diff --git a/.claude/commands/create-bug.md b/.claude/commands/create-bug.md
index a531bb76145a..7fecc5a308e1 100644
--- a/.claude/commands/create-bug.md
+++ b/.claude/commands/create-bug.md
@@ -124,7 +124,32 @@ For `render: shell` fields, wrap the value in a code fence:
 - Output the issue URL so the user can view it
 - Ask the user: "Would you like me to investigate the codebase for the possible root cause? (yes/no)"
 - Default is **no** — only proceed if the user explicitly says yes
-- If yes, investigate the codebase (research only — no code changes) and add a comment using:
+- If yes, perform the full **Root Cause Analysis** (Step 6)
+
+## Step 6: Root Cause Analysis
+
+When the user opts in, perform all three phases below and post a single comment on the issue with the combined findings.
+
+### 6a: Investigate the root cause
+
+- Trace the bug through the code to identify the exact files, lines, and logic causing the issue
+- Research only — no code changes
+
+### 6b: Identify regression PRs
+
+- Check `git log` history of affected files, comparing the release branch against the previous release branch
+- Identify which PRs introduced or surfaced the bug (new code, removed compensating mechanisms, refactors, etc.)
+- Note whether the issue is a new regression or pre-existing
+
+### 6c: Scope analysis
+
+- Search the codebase for the same pattern, function, or anti-pattern causing the bug
+- Identify all affected areas beyond the originally reported bug
+- If other features are impacted, file separate bug issues for each and link them
+
+### Comment format
+
+Post findings as a comment using:
 
 ```bash
 gh issue comment <issue-number> --repo MetaMask/metamask-mobile --body "..."
@@ -132,7 +157,10 @@ gh issue comment <issue-number> --repo MetaMask/metamask-mobile --body "..."
 
 The comment should include:
 
-- A summary of the possible root cause
-- The error flow with relevant file paths and line numbers
-- Key files table (file, line(s), description)
-- A suggested fix approach
+- **Summary** of the root cause
+- **Likely Regression PR(s)** — PR numbers, titles, authors, and explanation of what changed (or note if pre-existing)
+- **Error flow** with relevant file paths and line numbers
+- **Full scope of impact** — all affected files, hooks, and components beyond the reported bug
+- **Key files table** (file, line(s), description)
+- **Suggested fix approach**
+- **Links to related bugs** filed from the scope analysis
diff --git a/.cursor/worktrees.json b/.cursor/worktrees.json
new file mode 100644
index 000000000000..cbb8fe98f1fc
--- /dev/null
+++ b/.cursor/worktrees.json
@@ -0,0 +1,9 @@
+{
+  "setup-worktree": [
+    "cp $ROOT_WORKTREE_PATH/.js.env .js.env",
+    "cp $ROOT_WORKTREE_PATH/.ios.env .ios.env",
+    "cp $ROOT_WORKTREE_PATH/.android.env .android.env",
+    "cp $ROOT_WORKTREE_PATH/.e2e.env .e2e.env",
+    "cp -r $ROOT_WORKTREE_PATH/.cursor/plans .cursor/plans"
+  ]
+}
diff --git a/.e2e.env.example b/.e2e.env.example
index f70f8c38bb3e..fc88ce2c6896 100644
--- a/.e2e.env.example
+++ b/.e2e.env.example
@@ -27,6 +27,18 @@ export TEST_SRP_2=
 export TEST_SRP_3=
 export BROWSERSTACK_USERNAME=
 export BROWSERSTACK_ACCESS_KEY=
+
+# Appwright performance -> Sentry instrumentation
+# If E2E_PERFORMANCE_SENTRY_DSN is defined, each scenario uploads timers to Sentry.
+export E2E_PERFORMANCE_SENTRY_DSN=
+# Optional. Set to false to disable upload even when DSN is present.
+export E2E_PERFORMANCE_SENTRY_ENABLED=true
+# Optional sample rate between 0 and 1 (default: 1).
+export E2E_PERFORMANCE_SENTRY_SAMPLE_RATE=1
+# Optional metadata for Sentry events.
+export E2E_PERFORMANCE_SENTRY_ENVIRONMENT=e2e-performance
+export E2E_PERFORMANCE_SENTRY_RELEASE=
+
 # Set BROWSERSTACK_LOCAL=true when using run-appwright:mm-connect-android-bs-local (BrowserStack Local tunnel)
 # BROWSERSTACK_LOCAL=true
 export SEEDLESS_ONBOARDING_ENABLED=
diff --git a/.eslintignore b/.eslintignore
index f654ed55c5e8..15edab97f270 100644
--- a/.eslintignore
+++ b/.eslintignore
@@ -1,5 +1,8 @@
 /scripts/inpage-bridge
 /app/core/InpageBridgeWeb3.js
+/app/components/UI/Charts/AdvancedChart/webview/chartLogic.js
+/app/components/UI/Charts/AdvancedChart/webview/chartLogicString.ts
+/app/components/UI/Charts/AdvancedChart/webview/syncChartLogic.js
 /app/util/blockies.js
 __snapshots__
 android
diff --git a/.eslintrc.js b/.eslintrc.js
index 060b6c19802d..5e5c90cfa8cd 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -105,11 +105,29 @@ module.exports = {
       },
     },
     {
+      // Temporary rollout strategy:
+      // Keep color-no-hex disabled for all tests by default, then re-enable it
+      // for specific folders in small PR batches. Once migration is complete,
+      // remove this override and enforce across all tests in:
+      // - app/components/
+      // - app/component-library/
       files: ['**/*.test.{js,ts,tsx}', '**/*.stories.{js,ts,tsx}'],
       rules: {
         '@metamask/design-tokens/color-no-hex': 'off',
       },
     },
+    {
+      files: ['app/components/UI/Card/**/*.{js,jsx,ts,tsx}'],
+      rules: {
+        '@metamask/design-tokens/color-no-hex': 'error',
+      },
+    },
+    {
+      files: ['app/components/Snaps/**/*.{js,jsx,ts,tsx}'],
+      rules: {
+        '@metamask/design-tokens/color-no-hex': 'error',
+      },
+    },
     {
       files: [
         'app/components/UI/Name/**/*.{js,ts,tsx}',
diff --git a/.github/CODEOWNERS b/.github/CODEOWNERS
index 161fdb4836da..912fdf92b376 100644
--- a/.github/CODEOWNERS
+++ b/.github/CODEOWNERS
@@ -70,8 +70,11 @@ app/selectors/rampsController                          @MetaMask/ramp
 **/ramps/**                                             @MetaMask/ramp
 
 # Card Team
-app/components/UI/Card/              @MetaMask/card
-app/core/redux/slices/card/          @MetaMask/card
+app/components/UI/Card/                                    @MetaMask/card
+app/core/redux/slices/card/                                @MetaMask/card
+app/core/Engine/controllers/card-controller                @MetaMask/card
+app/core/Engine/messengers/card-controller-messenger       @MetaMask/card
+app/selectors/cardController.ts                            @MetaMask/card
 
 # Confirmation Team
 app/components/Views/confirmations                          @MetaMask/confirmations
@@ -107,7 +110,6 @@ app/core/SnapKeyring                                        @MetaMask/accounts-e
 
 # Co-owned by accounts and mobile-core-ux
 app/components/Views/AccountSelector                        @MetaMask/accounts-engineers @MetaMask/mobile-core-ux
-app/components/UI/EvmAccountSelectorList                    @MetaMask/accounts-engineers @MetaMask/mobile-core-ux
 
 # Multichain Accounts
 **/multichain-accounts/**                                   @MetaMask/accounts-engineers
diff --git a/.github/scripts/collect-qa-stats.mjs b/.github/scripts/collect-qa-stats.mjs
new file mode 100644
index 000000000000..ced016211bc6
--- /dev/null
+++ b/.github/scripts/collect-qa-stats.mjs
@@ -0,0 +1,176 @@
+#!/usr/bin/env node
+/**
+ *
+ * Downloads pre-aggregated QA stats artifacts from the triggering CI run via the
+ * GitHub API and writes a qa-stats.json file for consumption by downstream workflows.
+ *
+ * Required env vars:
+ *   GITHUB_TOKEN      — GitHub Actions token for API access
+ *   WORKFLOW_RUN_ID   — ID of the CI run that produced the artifacts
+ *
+ * Example of output format of qa-stats.json:
+ *   {
+ *     "component_view_tests_count": 34,
+ *     "unit_test_count": 679,
+ *   }
+ *
+ * How to add a new metric:
+ *   1. Add a collector function below (see existing example)
+ *   2. Call it in main() and assign the result to stats
+ */
+
+import { readFile, writeFile, mkdir } from 'fs/promises';
+import { execSync } from 'child_process';
+import { join } from 'path';
+
+const GITHUB_TOKEN = process.env.GITHUB_TOKEN;
+const WORKFLOW_RUN_ID = process.env.WORKFLOW_RUN_ID;
+
+if (!WORKFLOW_RUN_ID) throw new Error('Missing required WORKFLOW_RUN_ID env var');
+if (!GITHUB_TOKEN) throw new Error('Missing required GITHUB_TOKEN env var');
+
+
+// ---------------------------------------------------------------------------
+// GitHub artifact helpers
+// ---------------------------------------------------------------------------
+
+let _artifactList = null;
+
+/**
+ * Fetches (and caches) the list of artifacts for the triggering CI run.
+ * First call fetches and stores, every subsequent call returns the cached value.
+ * 
+ * @returns {Promise<Array>}
+ */
+async function getArtifactList() {
+  if (_artifactList) return _artifactList;
+
+  const artifacts = [];
+  let page = 1;
+
+  while (true) {
+    const url = `https://api.github.com/repos/MetaMask/metamask-mobile/actions/runs/${WORKFLOW_RUN_ID}/artifacts?per_page=100&page=${page}`;
+    const res = await fetch(url, {
+      headers: {
+        Authorization: `Bearer ${GITHUB_TOKEN}`,
+        Accept: 'application/vnd.github+json',
+      },
+    });
+
+    if (!res.ok) {
+      throw new Error(`Failed to list artifacts (page ${page}): ${res.status} ${res.statusText}`);
+    }
+
+    const data = await res.json();
+    artifacts.push(...data.artifacts);
+
+    if (data.artifacts.length < 100) break;
+    page++;
+  }
+
+  _artifactList = artifacts;
+  return _artifactList;
+}
+
+/**
+ * Downloads a named artifact from the triggering CI run, extracts it into a
+ * local directory named after the artifact, and returns that directory path.
+ *
+ * @param {string} artifactName
+ * @returns {Promise<string>} Path to the directory containing the extracted files
+ */
+async function downloadArtifact(artifactName) {
+  const artifacts = await getArtifactList();
+  const artifact = artifacts.find((a) => a.name === artifactName);
+
+  if (!artifact) {
+    throw new Error(
+      `Artifact "${artifactName}" not found in run ${WORKFLOW_RUN_ID}`,
+    );
+  }
+
+  // GitHub redirects to a pre-signed S3 URL. Follow manually so the
+  // Authorization header is not forwarded to S3.
+  const redirectRes = await fetch(artifact.archive_download_url, {
+    headers: {
+      Authorization: `Bearer ${GITHUB_TOKEN}`,
+      Accept: 'application/vnd.github+json',
+    },
+    redirect: 'manual',
+  });
+
+  const downloadUrl = redirectRes.headers.get('location');
+  if (!downloadUrl) {
+    throw new Error(`No redirect URL returned for artifact "${artifactName}"`);
+  }
+
+  const zipRes = await fetch(downloadUrl);
+  if (!zipRes.ok) {
+    throw new Error(
+      `Failed to download artifact "${artifactName}": ${zipRes.status} ${zipRes.statusText}`,
+    );
+  }
+
+  const destDir = `./${artifactName}`;
+  await mkdir(destDir, { recursive: true });
+  const zipPath = join(destDir, `${artifactName}.zip`);
+  await writeFile(zipPath, Buffer.from(await zipRes.arrayBuffer()));
+  execSync(`unzip -q "${zipPath}" -d "${destDir}"`);
+
+  return destDir;
+}
+
+// ---------------------------------------------------------------------------
+// Collectors — one async function per metric source
+// ---------------------------------------------------------------------------
+
+async function collectComponentViewTestCount() {
+  const destDir = await downloadArtifact('cv-test-stats');
+  const raw = await readFile(join(destDir, 'cv-test-stats.json'), 'utf8');
+  const data = JSON.parse(raw);
+  return data.component_view_test_number;
+}
+
+async function collectUnitTestCount() {
+  const destDir = await downloadArtifact('unit-test-stats');
+  const raw = await readFile(join(destDir, 'unit-test-stats.json'), 'utf8');
+  const data = JSON.parse(raw);
+  return data.unit_test_number;
+}
+
+// ---------------------------------------------------------------------------
+// Main
+// ---------------------------------------------------------------------------
+
+async function main() {
+  const stats = {};
+
+  const collectors = [
+    {
+      key: 'component_view_tests_count',
+      collect: collectComponentViewTestCount,
+    },
+    {
+      key: 'unit_tests_count',
+      collect: collectUnitTestCount,
+    },
+  ];
+
+  for (const { key, collect } of collectors) {
+    try {
+      stats[key] = await collect();
+    } catch (err) {
+      // stat will not be present in the output file if the collector fails
+      console.error(`[${key}] collector failed, skipping stat:`, err.message);
+    }
+  }
+
+  const outputPath = './qa-stats.json';
+  await writeFile(outputPath, JSON.stringify(stats, null, 2), 'utf8');
+  console.log(`✅ QA stats written to ${outputPath}:`, stats);
+}
+
+main().catch((err) => {
+  console.error('\n❌ Unexpected error:', err);
+  process.exit(1);
+});
diff --git a/.github/scripts/e2e-report-fixture-validation.mjs b/.github/scripts/e2e-report-fixture-validation.mjs
new file mode 100644
index 000000000000..af04fa1651e1
--- /dev/null
+++ b/.github/scripts/e2e-report-fixture-validation.mjs
@@ -0,0 +1,163 @@
+/**
+ * Reports E2E fixture validation results as a PR comment and GitHub annotation.
+ *
+ * Reads fixture-validation-result.json from the downloaded artifact directory,
+ * posts/updates a PR comment with the results, and emits GitHub annotations.
+ *
+ * Environment variables:
+ *   RESULTS_PATH          - Path to the downloaded artifact directory
+ *   VALIDATION_RESULT     - The upstream job result (success/failure/cancelled)
+ *   GITHUB_TOKEN          - GitHub token for API calls
+ *   PR_NUMBER             - Pull request number (empty for non-PR events)
+ *   GITHUB_REPOSITORY     - owner/repo
+ *   RUN_URL               - URL to the workflow run
+ */
+
+import fs from 'node:fs';
+import path from 'node:path';
+
+const {
+  RESULTS_PATH = '',
+  VALIDATION_RESULT = '',
+  GITHUB_TOKEN = '',
+  PR_NUMBER = '',
+  GITHUB_REPOSITORY = '',
+  RUN_URL = '',
+} = process.env;
+
+const COMMENT_MARKER = '**E2E Fixture Validation';
+
+function readResults() {
+  const jsonPath = path.join(RESULTS_PATH, 'fixture-validation-result.json');
+  if (!fs.existsSync(jsonPath)) return null;
+  return JSON.parse(fs.readFileSync(jsonPath, 'utf-8'));
+}
+
+function buildComment(results) {
+  if (VALIDATION_RESULT === 'failure' && !results) {
+    return `❌ ${COMMENT_MARKER} — Failed**\nThe fixture validation job failed. [Review the logs](${RUN_URL})`;
+  }
+
+  if (!results) {
+    if (VALIDATION_RESULT === 'success') {
+      return `✅ ${COMMENT_MARKER} — Passed**\n[View details](${RUN_URL})`;
+    }
+    return null;
+  }
+
+  const { hasStructuralChanges, newKeys, missingKeys, typeMismatches, valueMismatches } = results;
+
+  if (hasStructuralChanges) {
+    return [
+      `⚠️ ${COMMENT_MARKER} — Structural changes detected**`,
+      '',
+      '| Category | Count |',
+      '|----------|-------|',
+      `| New keys | ${newKeys} |`,
+      `| Missing keys | ${missingKeys} |`,
+      `| Type mismatches | ${typeMismatches} |`,
+      `| Value mismatches | ${valueMismatches} (informational) |`,
+      '',
+      'The committed fixture schema is out of date. To update, comment:',
+      '```',
+      '@metamaskbot update-mobile-fixture',
+      '```',
+      `[View full details](${RUN_URL}) | [Download diff report](${RUN_URL}#artifacts)`,
+    ].join('\n');
+  }
+
+  if (valueMismatches > 0) {
+    return `✅ ${COMMENT_MARKER} — Schema is up to date**\n${valueMismatches} value mismatches detected (expected — fixture represents an existing user).\n[View details](${RUN_URL})`;
+  }
+
+  return `✅ ${COMMENT_MARKER} — No differences found**\nFixture is up to date. [View details](${RUN_URL})`;
+}
+
+function emitAnnotation(results) {
+  if (!results) {
+    if (VALIDATION_RESULT === 'failure') {
+      console.log('::error::Fixture validation job failed.');
+    } else if (VALIDATION_RESULT === 'success') {
+      console.log('::notice::Fixture validation passed.');
+    }
+    return;
+  }
+
+  const { hasStructuralChanges, newKeys, missingKeys, typeMismatches, valueMismatches } = results;
+
+  if (hasStructuralChanges) {
+    console.log(`::warning::Fixture schema out of date — New: ${newKeys}, Missing: ${missingKeys}, Type mismatches: ${typeMismatches}. Run @metamaskbot update-mobile-fixture`);
+  } else if (valueMismatches > 0) {
+    console.log(`::notice::Fixture schema up to date. ${valueMismatches} value mismatches (expected).`);
+  } else {
+    console.log('::notice::Fixture validation passed — no differences found.');
+  }
+}
+
+async function ghApi(endpoint, options = {}) {
+  const { headers: extraHeaders, ...restOptions } = options;
+  const res = await fetch(`https://api.github.com${endpoint}`, {
+    headers: {
+      Authorization: `Bearer ${GITHUB_TOKEN}`,
+      Accept: 'application/vnd.github+json',
+      'X-GitHub-Api-Version': '2022-11-28',
+      'Content-Type': 'application/json',
+      ...extraHeaders,
+    },
+    ...restOptions,
+  });
+  if (!res.ok && restOptions.method !== 'DELETE') {
+    const text = await res.text().catch(() => '');
+    throw new Error(`GitHub API ${res.status}: ${text}`);
+  }
+  if (res.status === 204) return null;
+  if (!res.ok) return null; // DELETE with error — skip silently
+  return res.json();
+}
+
+async function deletePreviousComments() {
+  let page = 1;
+  // eslint-disable-next-line no-constant-condition
+  while (true) {
+    const comments = await ghApi(
+      `/repos/${GITHUB_REPOSITORY}/issues/${PR_NUMBER}/comments?per_page=100&page=${page}`,
+    );
+    if (!comments || comments.length === 0) break;
+    for (const comment of comments) {
+      if (comment.body && comment.body.includes(COMMENT_MARKER)) {
+        await ghApi(`/repos/${GITHUB_REPOSITORY}/issues/comments/${comment.id}`, { method: 'DELETE' });
+      }
+    }
+    if (comments.length < 100) break;
+    page++;
+  }
+}
+
+async function postComment(body) {
+  await ghApi(`/repos/${GITHUB_REPOSITORY}/issues/${PR_NUMBER}/comments`, {
+    method: 'POST',
+    body: JSON.stringify({ body }),
+  });
+}
+
+async function main() {
+  const results = readResults();
+
+  // Always emit annotation
+  emitAnnotation(results);
+
+  // Post PR comment if this is a PR
+  if (PR_NUMBER) {
+    const comment = buildComment(results);
+    if (comment) {
+      await deletePreviousComments();
+      await postComment(comment);
+      console.log(`Posted fixture validation comment on PR #${PR_NUMBER}`);
+    }
+  }
+}
+
+main().catch((err) => {
+  console.error('Failed to report fixture validation:', err);
+  process.exit(1);
+});
diff --git a/.github/scripts/shared/template.ts b/.github/scripts/shared/template.ts
index a21aece584ff..ce0aba012a62 100644
--- a/.github/scripts/shared/template.ts
+++ b/.github/scripts/shared/template.ts
@@ -27,7 +27,6 @@ const bugReportIssueTemplateTitles = [
   '### Expected behavior',
   '### Screenshots', // TODO: replace '### Screenshots' by '### Screenshots/Recordings' in January 2024 (as most issues will meet this criteria by then)
   '### Steps to reproduce',
-  '### Error messages or log output',
   '### Version',
   '### Build type',
   '### Device',
diff --git a/.github/workflows/build-android-e2e.yml b/.github/workflows/build-android-e2e.yml
index 4c3047c68c46..07cdc4cb274a 100644
--- a/.github/workflows/build-android-e2e.yml
+++ b/.github/workflows/build-android-e2e.yml
@@ -53,13 +53,23 @@ jobs:
 
       - name: Setup Android Build Environment
         timeout-minutes: 15
-        uses: MetaMask/github-tools/.github/actions/setup-e2e-env@v1
+        uses: MetaMask/github-tools/.github/actions/setup-e2e-env@v1.7.0
         with:
           platform: android
           setup-simulator: false
           configure-keystores: true
           target: ${{ inputs.keystore_target }} # qa for taget=main and flask for target=flask
+          
+      - name: Restore .metamask folder
+        id: restore-metamask
+        uses: actions/cache@v4
+        with:
+          path: .metamask
+          key: .metamask-${{ hashFiles('package.json', 'yarn.lock') }}
 
+      - name: Install Foundry if cache missed
+        if: steps.restore-metamask.outputs.cache-hit != 'true'
+        run: yarn install:foundryup
       - name: Setup project dependencies with retry
         uses: nick-fields/retry@ce71cc2ab81d554ebbe88c79ab5975992d79ba08 #v3.0.2
         with:
diff --git a/.github/workflows/build-ios-e2e.yml b/.github/workflows/build-ios-e2e.yml
index b15e262b24bd..f5cd550a5f9e 100644
--- a/.github/workflows/build-ios-e2e.yml
+++ b/.github/workflows/build-ios-e2e.yml
@@ -100,7 +100,7 @@ jobs:
       # Install Node.js, Xcode tools, and other iOS development dependencies
       - name: Installing iOS Environment Setup
         timeout-minutes: 15
-        uses: MetaMask/github-tools/.github/actions/setup-e2e-env@v1
+        uses: MetaMask/github-tools/.github/actions/setup-e2e-env@v1.7.0
         with:
           platform: ios
           setup-simulator: false
@@ -123,6 +123,16 @@ jobs:
       - name: Clean iOS plist files
         run: find ios -name "*.plist" -exec xattr -c {} \;
 
+      - name: Restore .metamask folder
+        id: restore-metamask
+        uses: actions/cache@v4
+        with:
+          path: .metamask
+          key: .metamask-${{ hashFiles('package.json', 'yarn.lock') }}
+
+      - name: Install Foundry if cache missed
+        if: steps.restore-metamask.outputs.cache-hit != 'true'
+        run: yarn install:foundryup
       # Run project setup with retry for better resilience
       - name: Setup project dependencies with retry
         uses: nick-fields/retry@ce71cc2ab81d554ebbe88c79ab5975992d79ba08 #v3.0.2
diff --git a/.github/workflows/build.yml b/.github/workflows/build.yml
index 74b68cfd9624..a1d3334047f0 100644
--- a/.github/workflows/build.yml
+++ b/.github/workflows/build.yml
@@ -9,6 +9,10 @@ on:
       platform:
         required: true
         type: string # android, ios, or both
+      skip_version_bump:
+        required: false
+        type: boolean
+        default: false
   workflow_dispatch:
     inputs:
       build_name:
@@ -32,14 +36,20 @@ on:
         required: true
         type: choice
         options: [android, ios, both]
+      skip_version_bump:
+        required: false
+        type: boolean
+        default: false
 
 permissions:
   contents: read
   id-token: write
 
 jobs:
-  # Bump version in repo (bitrise.yml, package.json, ios/android) before building
+  # Bump version in repo (bitrise.yml, package.json, ios/android) before building.
+  # Skipped when skip_version_bump=true (e.g. nightly builds where Bitrise owns the bump).
   update-build-version:
+    if: ${{ !inputs.skip_version_bump }}
     uses: ./.github/workflows/update-latest-build-version.yml
     permissions:
       contents: write
@@ -52,6 +62,7 @@ jobs:
   # Load config
   prepare:
     needs: [update-build-version]
+    if: ${{ always() && !failure() && !cancelled() }}
     runs-on: ubuntu-latest
     outputs:
       github_environment: ${{ steps.config.outputs.github_environment }}
@@ -61,9 +72,10 @@ jobs:
       signing_android_keystore_path: ${{ steps.config.outputs.signing_android_keystore_path }}
     steps:
       - uses: actions/checkout@v4
-      - uses: actions/setup-node@v4
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
         with:
-          node-version: '20'
+          node-version-file: '.nvmrc'
       - run: yarn install --immutable
       - run: node scripts/validate-build-config.js
 
@@ -83,9 +95,28 @@ jobs:
           fs.appendFileSync(process.env.GITHUB_OUTPUT, 'signing_android_keystore_path=' + (signing && signing.android_keystore_path ? signing.android_keystore_path : '') + '\n');
           "
 
+  # Setup dependencies (no secrets) - uses reusable workflow on platform-specific runner
+  setup-dependencies:
+    name: Setup Dependencies (${{ matrix.platform }})
+    needs: [prepare]
+    strategy:
+      matrix:
+        platform: ${{ inputs.platform == 'both' && fromJSON('["android", "ios"]') || fromJSON(format('["{0}"]', inputs.platform)) }}
+    uses: ./.github/workflows/setup-node-modules.yml
+    with:
+      checkout-submodules: true
+      platform: ${{ matrix.platform }}
+      build_name: ${{ inputs.build_name }}
+      use-tarball: true
+      upload-artifact: true
+      artifact-name: node-modules-${{ matrix.platform }}
+      artifact-retention-days: 1
+
   # Build
   build:
-    needs: [prepare, update-build-version]
+    needs: [prepare, setup-dependencies, update-build-version]
+    if: ${{ always() && !failure() && !cancelled() }}
+    timeout-minutes: 120 # Must allow build step (115min) + setup; comment at Build step documents this
     strategy:
       matrix:
         platform: ${{ inputs.platform == 'both' && fromJSON('["android", "ios"]') || fromJSON(format('["{0}"]', inputs.platform)) }}
@@ -94,6 +125,7 @@ jobs:
     environment: ${{ needs.prepare.outputs.github_environment }}
     steps:
       - name: Validate version-bump commit
+        if: ${{ !inputs.skip_version_bump }}
         run: |
           COMMIT_HASH="${{ needs.update-build-version.outputs.commit-hash }}"
           if [ -z "$COMMIT_HASH" ]; then
@@ -102,20 +134,89 @@ jobs:
           fi
           echo "Building at version-bump commit: $COMMIT_HASH"
       - uses: actions/checkout@v4
+        if: ${{ !inputs.skip_version_bump }}
         with:
           ref: ${{ needs.update-build-version.outputs.commit-hash }}
-      - uses: actions/setup-node@v4
+          submodules: recursive
+
+      - uses: actions/checkout@v4
+        if: ${{ inputs.skip_version_bump }}
         with:
-          node-version: '20'
-          cache: 'yarn'
-      - run: yarn install --immutable
+          submodules: recursive
+
+      # Node first so we can download/extract/verify; no yarn install here (we use the tarball to avoid running install in this job).
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version-file: '.nvmrc'
+
+      - name: Download node_modules tarball
+        uses: actions/download-artifact@v4
+        with:
+          name: node-modules-${{ matrix.platform }}
+
+      - name: Extract tarball (preserves symlinks)
+        run: |
+          echo "📦 Extracting tarball..."
+          tar -xzf node-modules-${{ matrix.platform }}.tar.gz
+          rm node-modules-${{ matrix.platform }}.tar.gz
+          echo "✅ Tarball extracted"
+
+      - name: Verify artifacts and symlinks
+        run: |
+          echo "✅ Verifying artifacts..."
+          if [ ! -d "node_modules" ]; then
+            echo "❌ node_modules not found"
+            exit 1
+          fi
+          if [ ! -f "app/core/InpageBridgeWeb3.js" ]; then
+            echo "❌ InpageBridgeWeb3.js not found"
+            exit 1
+          fi
+          echo "📦 node_modules size: $(du -sh node_modules | cut -f1)"
+
+          # Verify symlinks in .bin directory
+          echo "🔍 Checking .bin symlinks..."
+          if [ -e "node_modules/.bin/react-native" ]; then
+            echo "✅ react-native symlink exists and target is valid"
+            find node_modules/.bin -maxdepth 1 -name 'react-native' -ls
+          else
+            echo "❌ react-native symlink missing or broken"
+            find node_modules/.bin -maxdepth 1 -ls | head -10
+            exit 1
+          fi
+
+          # Check React Native scripts
+          if [ -d "node_modules/react-native/scripts" ]; then
+            echo "✅ React Native scripts found"
+          else
+            echo "❌ React Native scripts missing"
+            exit 1
+          fi
+
+          echo "✅ All artifacts verified with working symlinks!"
+
+      # iOS only: Ruby + CocoaPods + Xcode (no yarn install; node_modules from tarball). Signing is in Configure signing certificates below.
+      - name: Setup Ruby (iOS)
+        if: matrix.platform == 'ios'
+        uses: ruby/setup-ruby@44511735964dcb71245e7e55f72539531f7bc0eb #v1
+        with:
+          ruby-version: '3.2.9'
+          working-directory: ios
+          bundler-cache: true
+
+      - name: Select Xcode (iOS)
+        if: matrix.platform == 'ios'
+        env:
+          XCODE_VERSION: '16.3'
+        run: sudo xcode-select -s "/Applications/Xcode_$XCODE_VERSION.app"
 
       - name: Apply build config
         run: |
           # Load env vars from builds.yml (this step only)
-          eval "$(node scripts/apply-build-config.js "${{ inputs.build_name }}" --export)"
+          eval "$(node scripts/apply-build-config.js ${{ inputs.build_name }} --export)"
           # Persist to GITHUB_ENV so later steps (e.g. Build) see CONFIGURATION, IS_SIM_BUILD, etc.
-          node scripts/apply-build-config.js "${{ inputs.build_name }}" --export-github-env >> "$GITHUB_ENV"
+          node scripts/apply-build-config.js ${{ inputs.build_name }} --export-github-env >> "$GITHUB_ENV"
 
       - name: Validate secrets
         env:
@@ -123,6 +224,20 @@ jobs:
           SECRETS_JSON: ${{ toJSON(secrets) }}
         run: node scripts/validate-secrets-from-config.js
 
+      # iOS: Install Pods here so generated paths match this runner (setup-node-modules skips pod install with --no-install-pods).
+      - name: Install CocoaPods dependencies (iOS)
+        if: matrix.platform == 'ios'
+        env:
+          BUNDLE_GEMFILE: ios/Gemfile
+        uses: nick-fields/retry@ce71cc2ab81d554ebbe88c79ab5975992d79ba08 #v3.0.2
+        with:
+          timeout_minutes: 10
+          max_attempts: 3
+          retry_wait_seconds: 30
+          command: |
+            node -e "require('fs').writeFileSync('ios/debug.xcconfig',''); require('fs').writeFileSync('ios/release.xcconfig','');"
+            yarn pod:install
+
       - name: Set secrets
         env:
           CONFIG_SECRETS: ${{ needs.prepare.outputs.secrets_json }}
@@ -143,6 +258,16 @@ jobs:
           java-version: '17'
           distribution: 'temurin'
 
+      # iOS: Clean up any existing keychains from previous runs
+      - name: Clean up existing keychains
+        if: matrix.platform == 'ios' && needs.prepare.outputs.signing_aws_role != ''
+        run: |
+          KEYCHAIN_PATH="$RUNNER_TEMP/app-signing.keychain-db"
+          if [ -f "$KEYCHAIN_PATH" ]; then
+            echo "🧹 Removing existing keychain..."
+            security delete-keychain "$KEYCHAIN_PATH" || true
+          fi
+
       # Signing: uses role + secret from builds.yml (skip for dev builds - main-dev, flask-dev, qa-dev use debug/simulator)
       - name: Configure signing certificates
         if: needs.prepare.outputs.signing_aws_role != ''
@@ -154,31 +279,18 @@ jobs:
           aws-secret-name: ${{ needs.prepare.outputs.signing_aws_secret }}
           android-keystore-path: ${{ needs.prepare.outputs.signing_android_keystore_path }}
 
-      # iOS: install Ruby, Bundler, and CocoaPods so setup:github-ci has a working Ruby (fixes self-hosted runners)
-      - name: Installing iOS Environment Setup
+      # iOS: Configure Node path for Xcode build scripts (React Native Codegen)
+      - name: Configure Node path for Xcode
         if: matrix.platform == 'ios'
-        timeout-minutes: 15
-        uses: MetaMask/github-tools/.github/actions/setup-e2e-env@v1
-        with:
-          platform: ios
-          configure-keystores: false
-          setup-simulator: false
-          ruby-version: '3.1.6'
-
-      - name: Setup project dependencies with retry
-        uses: nick-fields/retry@ce71cc2ab81d554ebbe88c79ab5975992d79ba08 #v3.0.2
-        with:
-          timeout_minutes: 10
-          max_attempts: 3
-          retry_wait_seconds: 30
-          command: |
-            echo "🚀 Setting up project..."
-            if [ "${{ matrix.platform }}" = "ios" ]; then
-              yarn setup:github-ci --build-ios --no-build-android
-            else
-              yarn setup:github-ci --no-build-ios
-            fi
+        run: |
+          NODE_BINARY=$(command -v node)
+          echo "Node binary: $NODE_BINARY"
+          echo "export NODE_BINARY=\"$NODE_BINARY\"" > ios/.xcode.env.local
+          echo "✅ Created ios/.xcode.env.local"
+          cat ios/.xcode.env.local
+          node --version
 
+      # Build with retry logic. Timeouts: 55min per attempt, 115min total for step, 120min job
       - name: Build ${{ matrix.platform }}
         timeout-minutes: 115
         uses: nick-fields/retry@ce71cc2ab81d554ebbe88c79ab5975992d79ba08 #v3.0.2
@@ -195,6 +307,7 @@ jobs:
 
       # Rename build artifacts (also zips simulator .app and writes ios_deploy_path / ios_archive_path outputs)
       - name: Rename ${{ matrix.platform }} artifacts
+        if: success()
         id: rename
         run: node scripts/rename-artifacts.js ${{ matrix.platform }}
 
diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
index 487f68b47d38..ac06c4d9074a 100644
--- a/.github/workflows/ci.yml
+++ b/.github/workflows/ci.yml
@@ -1,4 +1,5 @@
 name: ci
+
 on:
   push:
     branches: [main]
@@ -25,7 +26,7 @@ jobs:
           cache: yarn
       - uses: ruby/setup-ruby@44511735964dcb71245e7e55f72539531f7bc0eb #v1
         with:
-          ruby-version: '3.1.6'
+          ruby-version: '3.2.9'
         env:
           BUNDLE_GEMFILE: ios/Gemfile
       - name: Install Yarn dependencies with retry
@@ -35,6 +36,16 @@ jobs:
           max_attempts: 3
           retry_wait_seconds: 30
           command: yarn install --immutable
+      - name: Restore .metamask folder
+        id: restore-metamask
+        uses: actions/cache@v4
+        with:
+          path: .metamask
+          key: .metamask-${{ hashFiles('package.json', 'yarn.lock') }}
+
+      - name: Install Foundry if cache missed
+        if: steps.restore-metamask.outputs.cache-hit != 'true'
+        run: yarn install:foundryup
       - name: Clean state and following up dependencies installation with retry
         uses: nick-fields/retry@ce71cc2ab81d554ebbe88c79ab5975992d79ba08 #v3.0.2
         with:
@@ -51,6 +62,7 @@ jobs:
           else
             echo "No changes detected"
           fi
+
   dedupe:
     runs-on: ubuntu-latest
     steps:
@@ -82,6 +94,7 @@ jobs:
             echo "Duplicate dependencies detected; run 'yarn deduplicate' to remove them"
             exit 1
           fi
+
   git-safe-dependencies:
     runs-on: ubuntu-latest
     steps:
@@ -106,6 +119,7 @@ jobs:
           max_attempts: 3
           retry_wait_seconds: 30
           command: yarn git-safe-dependencies
+
   scripts:
     runs-on: ubuntu-latest
     strategy:
@@ -144,6 +158,71 @@ jobs:
           else
             echo "No changes detected"
           fi
+
+  js-bundle-size-check:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - uses: actions/setup-node@v4
+        with:
+          node-version-file: '.nvmrc'
+          cache: yarn
+      - name: Install Yarn dependencies with retry
+        uses: nick-fields/retry@ce71cc2ab81d554ebbe88c79ab5975992d79ba08 #v3.0.2
+        with:
+          timeout_minutes: 10
+          max_attempts: 3
+          retry_wait_seconds: 30
+          command: yarn install --immutable
+      - name: Clean state and following up dependencies installation
+        run: yarn setup:github-ci --no-build-android
+
+      - name: Generate iOS bundle
+        run: yarn gen-bundle:ios
+        env:
+          NODE_OPTIONS: --max_old_space_size=12288
+
+      - name: Check bundle size
+        run: ./scripts/js-bundle-stats.sh ios/main.jsbundle 53
+
+      - name: Upload iOS bundle
+        uses: actions/upload-artifact@v4
+        with:
+          name: ios-bundle
+          path: ios/main.jsbundle
+
+  ship-js-bundle-size-check:
+    runs-on: ubuntu-latest
+    needs: [js-bundle-size-check]
+    if: ${{ github.ref == 'refs/heads/main' }}
+    steps:
+      - uses: actions/checkout@v4
+
+      - name: Download iOS bundle
+        uses: actions/download-artifact@v4
+        with:
+          name: ios-bundle
+          path: ios/main.jsbundle
+
+      - name: Push bundle size to mobile_bundlesize_stats repo
+        run: ./scripts/push-bundle-size.sh
+        env:
+          GITHUB_ACTOR: metamaskbot
+          GITHUB_TOKEN: ${{ secrets.MOBILE_BUNDLESIZE_TOKEN }}
+
+  check-workflows:
+    name: Check workflows
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - name: Download actionlint
+        id: download-actionlint
+        run: bash <(curl https://raw.githubusercontent.com/rhysd/actionlint/62dc61a45fc95efe8c800af7a557ab0b9165d63b/scripts/download-actionlint.bash) 1.7.1
+        shell: bash
+      - name: Check workflow files
+        run: ${{ steps.download-actionlint.outputs.executable }} -color -config-file .github/actionlint.yaml
+        shell: bash
+
   unit-tests:
     runs-on: ubuntu-latest
     strategy:
@@ -164,19 +243,23 @@ jobs:
           command: yarn install --immutable
       - name: Clean state and following up dependencies installation
         run: yarn setup:github-ci --node
+      - name: Prepare results directory
+        run: mkdir -p tests/results
       # The "10" in this command is the total number of shards. It must be kept
       # in sync with the length of matrix.shard
-      - run: yarn test:unit --shard=${{ matrix.shard }}/10 --forceExit --silent --coverageReporters=json
+      - run: yarn test:unit --shard=${{ matrix.shard }}/10 --forceExit --silent --coverageReporters=json --json --outputFile=tests/results/unit-test-results-${{ matrix.shard }}.json
         env:
           NODE_OPTIONS: --max_old_space_size=20480
-      - name: Rename coverage report to include shard number
+      - name: Rename coverage report and extract test count for this shard
         shell: bash
         run: |
-          mv ./tests/coverage/coverage-final.json ./tests/coverage/coverage-${{ matrix.shard }}.json
+          mv ./tests/coverage/coverage-final.json ./tests/coverage/coverage-unit-${{ matrix.shard }}.json
+          count=$(jq '(.numPassedTests // 0) + (.numFailedTests // 0)' tests/results/unit-test-results-${{ matrix.shard }}.json)
+          echo "{\"count\": $count}" > ./tests/coverage/count.json
       - uses: actions/upload-artifact@v4
         with:
-          name: coverage-${{ matrix.shard }}
-          path: ./tests/coverage/coverage-${{ matrix.shard }}.json
+          name: coverage-unit-${{ matrix.shard }}
+          path: ./tests/coverage/
           if-no-files-found: error
       - name: Require clean working directory
         shell: bash
@@ -187,9 +270,10 @@ jobs:
           else
             echo "No changes detected"
           fi
+
   merge-unit-and-component-view-tests:
     runs-on: ubuntu-latest
-    needs: [unit-tests, cv-test]
+    needs: [unit-tests, component-view-tests]
     if: ${{ !cancelled() && github.event_name != 'merge_group' }}
     steps:
       - uses: actions/checkout@v3
@@ -208,18 +292,59 @@ jobs:
         run: yarn setup:github-ci --node
       - uses: actions/download-artifact@v4
         with:
+          pattern: coverage-*
           path: tests/coverage/
-      - name: Gather partial coverage reports into one directory
+      - name: Aggregate test counts and gather coverage reports
         shell: bash
         run: |
-          mv ./tests/coverage/coverage-*/* ./tests/coverage
+          unit_total=0
+          for file in ./tests/coverage/coverage-unit-*/count.json; do
+            [ -f "$file" ] || continue
+            count=$(jq '.count // 0' "$file")
+            unit_total=$((unit_total + count))
+          done
+          echo "{\"unit_test_number\": $unit_total}" > unit-test-stats.json
+          echo "Unit test count: $unit_total"
+
+          cv_total=0
+          for file in ./tests/coverage/coverage-cv-*/count.json; do
+            [ -f "$file" ] || continue
+            count=$(jq '.count // 0' "$file")
+            cv_total=$((cv_total + count))
+          done
+          echo "{\"component_view_test_number\": $cv_total}" > cv-test-stats.json
+          echo "CV test count: $cv_total"
+
+          mkdir -p tests/coverage-cv-merged
+          for file in ./tests/coverage/coverage-cv-*/coverage-cv-*.json; do
+            [ -f "$file" ] && cp "$file" ./tests/coverage-cv-merged/
+          done
+
+          find ./tests/coverage/coverage-* -name 'coverage-*.json' -exec mv {} ./tests/coverage/ \;
       - run: yarn test:merge-coverage
       - run: yarn test:validate-coverage
       - uses: actions/upload-artifact@v4
         with:
-          name: coverage
+          name: lcov.info
           path: ./tests/merged-coverage/lcov.info
           if-no-files-found: error
+      - uses: actions/upload-artifact@v4
+        with:
+          name: cv-test-stats
+          path: ./cv-test-stats.json
+          if-no-files-found: error
+      - uses: actions/upload-artifact@v4
+        with:
+          name: unit-test-stats
+          path: ./unit-test-stats.json
+          if-no-files-found: error
+      - name: Generate CV test HTML coverage report
+        run: yarn nyc report --temp-dir ./tests/coverage-cv-merged --report-dir ./tests/coverage-cv-lcov --reporter html
+      - uses: actions/upload-artifact@v4
+        with:
+          name: cv-test-coverage-html
+          path: ./tests/coverage-cv-lcov/
+          if-no-files-found: error
       - name: Require clean working directory
         shell: bash
         run: |
@@ -229,9 +354,8 @@ jobs:
           else
             echo "No changes detected"
           fi
-  needs_e2e_build:
-    uses: ./.github/workflows/needs-e2e-build.yml
-  cv-test:
+
+  component-view-tests:
     runs-on: ubuntu-latest
     strategy:
       matrix:
@@ -251,58 +375,34 @@ jobs:
           command: yarn install --immutable
       - name: Clean state and following up dependencies installation
         run: yarn setup:github-ci --node
-      - run: yarn test:view:ci --shard=${{ matrix.shard }}/2
+      - name: Prepare results directory
+        run: mkdir -p tests/results
+      - run: |
+          yarn test:view:ci \
+            --shard=${{ matrix.shard }}/2 \
+            --json \
+            --outputFile=tests/results/cv-test-results-${{ matrix.shard }}.json
         env:
           NODE_OPTIONS: --max-old-space-size=20480
-      - name: Rename coverage report for this shard
+      - name: Rename coverage report and extract test count for this shard
         shell: bash
         run: |
-          mv ./tests/coverage/coverage-final.json ./tests/coverage/coverage-cv-test-${{ matrix.shard }}.json
+          mv ./tests/coverage/coverage-final.json ./tests/coverage/coverage-cv-${{ matrix.shard }}.json
+          count=$(jq '(.numPassedTests // 0) + (.numFailedTests // 0)' tests/results/cv-test-results-${{ matrix.shard }}.json)
+          echo "{\"count\": $count}" > ./tests/coverage/count.json
       - uses: actions/upload-artifact@v4
         with:
-          name: coverage-cv-test-${{ matrix.shard }}
+          name: coverage-cv-${{ matrix.shard }}
           path: ./tests/coverage/
           if-no-files-found: error
-  merge-cv-test-coverage:
-    runs-on: ubuntu-latest
-    needs: [cv-test]
-    if: ${{ !cancelled() && github.event_name != 'merge_group' }}
-    steps:
-      - uses: actions/checkout@v3
-      - uses: actions/setup-node@v3
-        with:
-          node-version-file: '.nvmrc'
-          cache: yarn
-      - name: Install Yarn dependencies with retry
-        uses: nick-fields/retry@ce71cc2ab81d554ebbe88c79ab5975992d79ba08 #v3.0.2
-        with:
-          timeout_minutes: 10
-          max_attempts: 3
-          retry_wait_seconds: 30
-          command: yarn install --immutable
-      - uses: actions/download-artifact@v4
-        with:
-          pattern: coverage-cv-test-*
-          path: tests/coverage-cv-test/
-      - name: Gather CV test shard coverage into one directory
-        shell: bash
-        run: |
-          mkdir -p tests/coverage-cv-test-merged
-          for d in tests/coverage-cv-test/coverage-cv-test-*; do
-            if [ -d "$d" ]; then
-              cp "$d"/*.json tests/coverage-cv-test-merged/ 2>/dev/null || true
-            fi
-          done
-      - name: Generate merged CV test HTML coverage report
-        run: yarn nyc report --temp-dir ./tests/coverage-cv-test-merged --report-dir ./tests/coverage-cv-test-lcov --reporter html
-      - uses: actions/upload-artifact@v4
-        with:
-          name: html-coverage-cv-test
-          path: ./tests/coverage-cv-test-lcov/
-          if-no-files-found: error
+
+  needs_e2e_build:
+    uses: ./.github/workflows/needs-e2e-build.yml
+
   smart-e2e-selection:
     name: 'Smart E2E Selection'
     runs-on: ubuntu-latest
+    if: ${{ !github.event.pull_request.head.repo.fork }}
     continue-on-error: true
     permissions:
       contents: read
@@ -341,7 +441,8 @@ jobs:
       ${{
         github.event_name != 'merge_group' &&
         needs.needs_e2e_build.outputs.android_changed == 'true' &&
-        !(needs.smart-e2e-selection.outputs.ai_confidence >= 80 && needs.smart-e2e-selection.outputs.ai_e2e_test_tags == '[]')
+        !(needs.smart-e2e-selection.outputs.ai_confidence >= 80 && needs.smart-e2e-selection.outputs.ai_e2e_test_tags == '[]') &&
+        !github.event.pull_request.head.repo.fork
       }}
     permissions:
       contents: read
@@ -356,7 +457,7 @@ jobs:
 
   e2e-smoke-tests-android:
     name: 'Android E2E Smoke Tests'
-    if: ${{ github.event_name != 'merge_group' && needs.needs_e2e_build.outputs.android_changed == 'true' }}
+    if: ${{ github.event_name != 'merge_group' && needs.needs_e2e_build.outputs.android_changed == 'true' && !github.event.pull_request.head.repo.fork }}
     permissions:
       contents: read
       id-token: write
@@ -377,7 +478,8 @@ jobs:
       ${{
         github.event_name != 'merge_group' &&
         needs.needs_e2e_build.outputs.ios_changed == 'true' &&
-        !(needs.smart-e2e-selection.outputs.ai_confidence >= 80 && needs.smart-e2e-selection.outputs.ai_e2e_test_tags == '[]')
+        !(needs.smart-e2e-selection.outputs.ai_confidence >= 80 && needs.smart-e2e-selection.outputs.ai_e2e_test_tags == '[]') &&
+        !github.event.pull_request.head.repo.fork
       }}
     permissions:
       contents: read
@@ -397,7 +499,7 @@ jobs:
 
   e2e-smoke-tests-ios:
     name: 'iOS E2E Smoke Tests'
-    if: ${{ github.event_name != 'merge_group' && needs.needs_e2e_build.outputs.ios_changed == 'true' }}
+    if: ${{ github.event_name != 'merge_group' && needs.needs_e2e_build.outputs.ios_changed == 'true' && !github.event.pull_request.head.repo.fork }}
     permissions:
       contents: read
       id-token: write
@@ -416,7 +518,7 @@ jobs:
 
   e2e-smoke-tests-android-flask:
     name: 'Android Flask E2E Smoke Tests'
-    if: ${{ github.event_name != 'merge_group' && needs.needs_e2e_build.outputs.android_changed == 'true' }}
+    if: ${{ github.event_name != 'merge_group' && needs.needs_e2e_build.outputs.android_changed == 'true' && !github.event.pull_request.head.repo.fork }}
     permissions:
       contents: read
       id-token: write
@@ -433,7 +535,7 @@ jobs:
 
   e2e-smoke-tests-ios-flask:
     name: 'iOS Flask E2E Smoke Tests'
-    if: ${{ github.event_name != 'merge_group' && needs.needs_e2e_build.outputs.ios_changed == 'true' }}
+    if: ${{ github.event_name != 'merge_group' && needs.needs_e2e_build.outputs.ios_changed == 'true' && !github.event.pull_request.head.repo.fork }}
     permissions:
       contents: read
       id-token: write
@@ -448,62 +550,57 @@ jobs:
         }}
     secrets: inherit
 
-  js-bundle-size-check:
-    runs-on: ubuntu-latest
-    steps:
-      - uses: actions/checkout@v4
-      - uses: actions/setup-node@v4
-        with:
-          node-version-file: '.nvmrc'
-          cache: yarn
-      - name: Install Yarn dependencies with retry
-        uses: nick-fields/retry@ce71cc2ab81d554ebbe88c79ab5975992d79ba08 #v3.0.2
-        with:
-          timeout_minutes: 10
-          max_attempts: 3
-          retry_wait_seconds: 30
-          command: yarn install --immutable
-      - name: Clean state and following up dependencies installation
-        run: yarn setup:github-ci --no-build-android
-
-      - name: Generate iOS bundle
-        run: yarn gen-bundle:ios
-        env:
-          NODE_OPTIONS: --max_old_space_size=12288
-
-      - name: Check bundle size
-        run: ./scripts/js-bundle-stats.sh ios/main.jsbundle 52
-
-      - name: Upload iOS bundle
-        uses: actions/upload-artifact@v4
-        with:
-          name: ios-bundle
-          path: ios/main.jsbundle
+  # Fixture validation — ensures committed E2E fixtures match the live app state schema
+  # TODO: Remove continue-on-error once fixture validation is stable
+  validate-e2e-fixtures:
+    name: 'Validate E2E Fixtures'
+    if: ${{ github.event_name != 'merge_group' && needs.needs_e2e_build.outputs.ios_changed == 'true' && !github.event.pull_request.head.repo.fork }}
+    permissions:
+      contents: read
+      id-token: write
+    needs: [needs_e2e_build, ios-tests-ready]
+    uses: ./.github/workflows/run-e2e-workflow.yml
+    with:
+      test-suite-name: validate-e2e-fixtures
+      platform: ios
+      test_suite_tag: 'FixtureValidation'
+      split_number: 1
+      total_splits: 1
+      build_type: 'main'
+      metamask_environment: 'qa'
+    secrets: inherit
 
-  ship-js-bundle-size-check:
+  report-fixture-validation:
+    name: 'Report Fixture Validation'
     runs-on: ubuntu-latest
-    needs: [js-bundle-size-check]
-    if: ${{ github.ref == 'refs/heads/main' }}
+    if: ${{ !cancelled() && needs.validate-e2e-fixtures.result != 'skipped' }}
+    needs: [validate-e2e-fixtures]
+    permissions:
+      pull-requests: write
     steps:
       - uses: actions/checkout@v4
 
-      - name: Download iOS bundle
+      - name: Download fixture validation results
+        continue-on-error: true
         uses: actions/download-artifact@v4
         with:
-          name: ios-bundle
-          path: ios/main.jsbundle
+          name: test-e2e-validate-e2e-fixtures-junit-results
+          path: fixture-results/
 
-      - name: Push bundle size to mobile_bundlesize_stats repo
-        run: ./scripts/push-bundle-size.sh
+      - name: Report results
         env:
-          GITHUB_ACTOR: metamaskbot
-          GITHUB_TOKEN: ${{ secrets.MOBILE_BUNDLESIZE_TOKEN }}
+          RESULTS_PATH: fixture-results
+          VALIDATION_RESULT: ${{ needs.validate-e2e-fixtures.result }}
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          GITHUB_REPOSITORY: ${{ github.repository }}
+          PR_NUMBER: ${{ github.event.pull_request.number }}
+          RUN_URL: ${{ github.server_url }}/${{ github.repository }}/actions/runs/${{ github.run_id }}
+        run: node .github/scripts/e2e-report-fixture-validation.mjs
 
   sonar-cloud:
     runs-on: ubuntu-latest
     needs: merge-unit-and-component-view-tests
-    # Temporarily skipped until SonarCloud is fixed
-    if: false
+    if: ${{ !cancelled() && github.event_name != 'merge_group' && !github.event.pull_request.head.repo.fork }}
     steps:
       - uses: actions/checkout@v3
         with:
@@ -513,7 +610,7 @@ jobs:
           node-version-file: '.nvmrc'
       - uses: actions/download-artifact@v4
         with:
-          name: coverage
+          name: lcov.info
           path: coverage/
       - name: Upload coverage reports to Codecov
         if: ${{ always() }}
@@ -543,11 +640,11 @@ jobs:
             echo "$path"
             git update-index --no-assume-unchanged "$path"
           done
+
   sonar-cloud-quality-gate-status:
     runs-on: ubuntu-latest
     needs: sonar-cloud
-    # Temporarily skipped until SonarCloud is fixed
-    if: false
+    if: ${{ !cancelled() && github.event_name != 'merge_group' && !github.event.pull_request.head.repo.fork }}
     steps:
       - name: Checkout code
         uses: actions/checkout@v3
@@ -599,18 +696,7 @@ jobs:
               exit 1
             fi
           fi
-  check-workflows:
-    name: Check workflows
-    runs-on: ubuntu-latest
-    steps:
-      - uses: actions/checkout@v4
-      - name: Download actionlint
-        id: download-actionlint
-        run: bash <(curl https://raw.githubusercontent.com/rhysd/actionlint/62dc61a45fc95efe8c800af7a557ab0b9165d63b/scripts/download-actionlint.bash) 1.7.1
-        shell: bash
-      - name: Check workflow files
-        run: ${{ steps.download-actionlint.outputs.executable }} -color -config-file .github/actionlint.yaml
-        shell: bash
+
   all-jobs-pass:
     name: All jobs pass
     runs-on: ubuntu-latest
@@ -621,9 +707,10 @@ jobs:
         dedupe,
         scripts,
         unit-tests,
-        cv-test,
+        component-view-tests,
         check-workflows,
         js-bundle-size-check,
+        sonar-cloud-quality-gate-status,
       ]
     outputs:
       ALL_JOBS_PASSED: ${{ steps.jobs-passed-status.outputs.ALL_JOBS_PASSED }}
@@ -633,10 +720,12 @@ jobs:
         env:
           NEEDS_CONTEXT: ${{ toJSON(needs) }}
           EVENT_NAME: ${{ github.event_name }}
+          IS_FORK: ${{ github.event.pull_request.head.repo.fork }}
         run: |
           # Check results of all required jobs dynamically
           # On merge_group events, "skipped" is acceptable (some jobs intentionally skip)
-          # On other events (PR, push), all jobs must succeed
+          # On fork PRs, "skipped" is acceptable (secret-dependent jobs are intentionally skipped)
+          # On other events (push to main), all jobs must succeed
 
           FAILED="false"
 
@@ -645,8 +734,8 @@ jobs:
               echo "::error::Job '$job_name' failed with result: $result"
               FAILED="true"
             elif [[ "$result" == "skipped" ]]; then
-              if [[ "$EVENT_NAME" == "merge_group" ]]; then
-                echo "Job '$job_name' was skipped (OK for merge_group events)"
+              if [[ "$EVENT_NAME" == "merge_group" ]] || [[ "$IS_FORK" == "true" ]]; then
+                echo "Job '$job_name' was skipped (OK for merge_group events and fork PRs)"
               else
                 echo "::error::Job '$job_name' was unexpectedly skipped on $EVENT_NAME event"
                 FAILED="true"
@@ -662,6 +751,7 @@ jobs:
           fi
 
           echo "ALL_JOBS_PASSED=true" >> "$GITHUB_OUTPUT"
+
   check-all-jobs-pass:
     name: Check all jobs pass
     if: ${{ !cancelled() }}
@@ -717,7 +807,7 @@ jobs:
     name: Log merge group failure
     runs-on: ubuntu-latest
     # Only run this job if the merge group event fails, skip on forks
-    if: ${{ github.event_name == 'merge_group' && failure() && !github.event.repository.fork }}
+    if: ${{ github.event_name == 'merge_group' && failure() }}
     needs:
       - check-all-jobs-pass
     steps:
diff --git a/.github/workflows/docker.yml b/.github/workflows/docker.yml
index 005b957f4ed9..47d765d4deb8 100644
--- a/.github/workflows/docker.yml
+++ b/.github/workflows/docker.yml
@@ -1,8 +1,6 @@
 name: docker
 on:
-  push:
-    branches: main
-  pull_request:
+  workflow_dispatch:
 
 jobs:
   docker:
diff --git a/.github/workflows/nightly-build.yml b/.github/workflows/nightly-build.yml
new file mode 100644
index 000000000000..0f4c33157b28
--- /dev/null
+++ b/.github/workflows/nightly-build.yml
@@ -0,0 +1,42 @@
+name: Nightly Build
+
+# Triggered by every push to chore/temp-nightly (which nightly-temp-branch-sync.yml
+# force-pushes daily at 4 AM UTC to match main).
+#
+# [skip ci] commits (e.g. version bumps pushed by Bitrise's bump_version_code job via
+# update-latest-build-version.yml) are automatically skipped by GitHub Actions, so
+# this workflow will NOT double-trigger on those commits.
+#
+# skip_version_bump=true is passed to build.yml because Bitrise already owns the
+# version bump for chore/temp-nightly during the parallel transition period.
+# When Bitrise is deprecated, remove skip_version_bump: true and the version bump
+# will be handled by build.yml as normal.
+
+on:
+  push:
+    branches:
+      - chore/temp-nightly
+  workflow_dispatch:
+
+permissions:
+  contents: read
+  id-token: write
+
+jobs:
+  build-exp:
+    name: Nightly exp build (main-exp)
+    uses: ./.github/workflows/build.yml
+    with:
+      build_name: main-exp
+      platform: both
+      skip_version_bump: true
+    secrets: inherit
+
+  build-rc:
+    name: Nightly RC build (main-rc)
+    uses: ./.github/workflows/build.yml
+    with:
+      build_name: main-rc
+      platform: both
+      skip_version_bump: true
+    secrets: inherit
diff --git a/.github/workflows/performance-test-runner.yml b/.github/workflows/performance-test-runner.yml
index 763ab5ccdc27..57cd0d327b4f 100644
--- a/.github/workflows/performance-test-runner.yml
+++ b/.github/workflows/performance-test-runner.yml
@@ -31,6 +31,11 @@ on:
         required: true
         type: string
         description: 'Unified BrowserStack build name for all sessions'
+      sentry_target:
+        required: false
+        type: string
+        default: test
+        description: 'Sentry DSN target: test or real'
     secrets:
       BROWSERSTACK_USERNAME:
         required: true
@@ -46,6 +51,10 @@ on:
         required: true
       E2E_PASSWORD:
         required: true
+      MM_SENTRY_DSN_TEST:
+        required: false
+      MM_SENTRY_DSN:
+        required: false
 
 jobs:
   run-tests:
@@ -58,7 +67,7 @@ jobs:
     steps:
       - name: Checkout code
         uses: actions/checkout@v4
-      
+
       - name: Restore node_modules cache
         id: cache
         uses: actions/cache@v4
@@ -70,13 +79,12 @@ jobs:
           key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
           restore-keys: |
             ${{ runner.os }}-yarn-
-      
+
       - name: Set up Node.js
         uses: actions/setup-node@v4
         with:
           node-version-file: '.nvmrc'
           cache: 'yarn'
-      
 
       - name: Install dependencies
         uses: nick-fields/retry@ce71cc2ab81d554ebbe88c79ab5975992d79ba08 #v3.0.2
@@ -85,13 +93,22 @@ jobs:
           max_attempts: 3
           retry_wait_seconds: 30
           command: yarn --immutable
-        ## This installs dependencies and creates the node_modules state file
-      
+        ## This installs dependencies and creates the node_modules state file      
+      - name: Restore .metamask folder
+        id: restore-metamask
+        uses: actions/cache@v4
+        with:
+          path: .metamask
+          key: .metamask-${{ hashFiles('package.json', 'yarn.lock') }}
+
+      - name: Install Foundry if cache missed
+        if: steps.restore-metamask.outputs.cache-hit != 'true'
+        run: yarn install:foundryup
       - name: Setup project
         run: yarn setup:github-ci
         working-directory: '.'
         ## This will apply the patches for appwright
-      
+
       - name: BrowserStack Env Setup
         uses: browserstack/github-actions/setup-env@4478e16186f38e5be07721931642e65a028713c3
         with:
@@ -123,26 +140,52 @@ jobs:
           # Use same args for all build types. Do not use --include-hosts for mm-connect:
           # bs-local.com requests must be forwarded to localhost; --include-hosts can block them.
           local-args: '--force-local --verbose'
-      
+
       - name: Wait for BrowserStack Local
         run: |
           echo "Waiting for BrowserStack Local to be ready..."
           # mm-connect needs the tunnel ready so the device can reach bs-local.com:8090; allow extra time
           sleep ${{ inputs.build_type == 'mm-connect' && 15 || 10 }}
           echo "BrowserStack Local should be ready now"
-      
+
       - name: Set Test Environment
         run: |
           echo "Setting ${{ inputs.build_type }} test environment for device: ${{ matrix.device.name }} (${{ matrix.device.category }} Class)"
           echo "OS Version: ${{ matrix.device.os_version }}"
           echo "Platform: ${{ inputs.platform }}"
-          
+
+          SENTRY_TARGET="${{ inputs.sentry_target }}"
+          SENTRY_TEST_DSN="${{ secrets.MM_SENTRY_DSN_TEST }}"
+          SENTRY_REAL_DSN="${{ secrets.MM_SENTRY_DSN }}"
+          SELECTED_SENTRY_DSN=""
+          SENTRY_ENVIRONMENT="github-actions-performance-e2e"
+
           # Validate that we have a BrowserStack URL
           if [ -z "${{ inputs.browserstack_app_url }}" ]; then
             echo "❌ Error: No ${{ inputs.platform }} BrowserStack URL available"
             exit 1
           fi
-          
+
+          case "$SENTRY_TARGET" in
+            real)
+              SELECTED_SENTRY_DSN="$SENTRY_REAL_DSN"
+              SENTRY_ENVIRONMENT="github-actions-performance-e2e-real"
+              if [ -z "$SELECTED_SENTRY_DSN" ]; then
+                echo "⚠️ MM_SENTRY_DSN is empty. Sentry uploads will be skipped."
+              fi
+              ;;
+            test)
+              SELECTED_SENTRY_DSN="$SENTRY_TEST_DSN"
+              if [ -z "$SELECTED_SENTRY_DSN" ]; then
+                echo "⚠️ MM_SENTRY_DSN_TEST is empty. Sentry uploads will be skipped."
+              fi
+              ;;
+            *)
+              echo "❌ Invalid sentry_target '$SENTRY_TARGET'. Expected 'test' or 'real'."
+              exit 1
+              ;;
+          esac
+
           {
             echo "BROWSERSTACK_DEVICE=${{ matrix.device.name }}"
             echo "BROWSERSTACK_OS_VERSION=${{ matrix.device.os_version }}"
@@ -157,9 +200,12 @@ jobs:
             echo "TEST_SRP_2=${{ secrets.TEST_SRP_2 }}"
             echo "TEST_SRP_3=${{ secrets.TEST_SRP_3 }}"
             echo "E2E_PASSWORD=${{ secrets.E2E_PASSWORD }}"
+            echo "E2E_PERFORMANCE_SENTRY_DSN=$SELECTED_SENTRY_DSN"
+            echo "E2E_PERFORMANCE_SENTRY_ENVIRONMENT=$SENTRY_ENVIRONMENT"
+            echo "E2E_PERFORMANCE_SENTRY_RELEASE=${{ github.sha }}"
             echo "DISABLE_VIDEO_DOWNLOAD=true"
           } >> "$GITHUB_ENV"
-      
+
       - name: Run Tests
         env:
           BROWSERSTACK_LOCAL: 'true'
@@ -173,7 +219,7 @@ jobs:
           echo "BrowserStack App URL: ${{ inputs.browserstack_app_url }}"
           echo "QA App Version: ${{ inputs.app_version }}"
           echo "BrowserStack Build Name: $BROWSERSTACK_BUILD_NAME"
-          
+
           # Run the appropriate test command based on build_type flag
           if [ "${{ inputs.build_type }}" = "onboarding" ]; then
             yarn run-appwright:${{ inputs.platform }}-onboarding-bs
@@ -182,9 +228,9 @@ jobs:
           else
             yarn run-appwright:${{ inputs.platform }}-bs
           fi
-          
+
           echo "✅ ${{ inputs.build_type }} tests completed for ${{ inputs.platform }} on ${{ matrix.device.name }}"
-      
+
       - name: Upload Test Results
         uses: actions/upload-artifact@v4
         if: always()
diff --git a/.github/workflows/push-eas-update.yml b/.github/workflows/push-eas-update.yml
index ab37ef9b9aa7..efac957c8c45 100644
--- a/.github/workflows/push-eas-update.yml
+++ b/.github/workflows/push-eas-update.yml
@@ -51,6 +51,23 @@ env:
   OTA_PUSH_PLATFORM: ${{ inputs.platform }}
 
 jobs:
+  ota-summary:
+    name: OTA Update Summary
+    runs-on: ubuntu-latest
+    steps:
+      - name: Display OTA Summary
+        run: |
+          {
+            echo "### OTA Update Summary"
+            echo ""
+            echo "| Field | Value |"
+            echo "| --- | --- |"
+            echo "| **Update version** | ${UPDATE_MESSAGE} |"
+            echo "| **Target version** | ${BASE_BRANCH_REF} |"
+            echo "| **Environment** | ${TARGET_CHANNEL} |"
+            echo "| **Target commit** | ${TARGET_COMMIT_HASH} |"
+          } >> "$GITHUB_STEP_SUMMARY"
+
   setup-dependencies:
     name: Setup Dependencies (PR)
     needs:
@@ -105,7 +122,7 @@ jobs:
       - name: Setup Node.js
         uses: actions/setup-node@v4
         with:
-          node-version: '20'
+          node-version-file: '.nvmrc'
 
       - name: Validate artifact compatibility (PR commit)
         uses: ./.github/actions/validate-artifact-compatibility
@@ -310,8 +327,11 @@ jobs:
       QUICKNODE_BASE_URL: ${{ secrets.QUICKNODE_BASE_URL }}
       QUICKNODE_LINEA_MAINNET_URL: ${{ secrets.QUICKNODE_LINEA_MAINNET_URL }}
       QUICKNODE_MONAD_URL: ${{ secrets.QUICKNODE_MONAD_URL }}
+      QUICKNODE_HYPEREVM_URL: ${{ secrets.QUICKNODE_HYPEREVM_URL }}
       QUICKNODE_OPTIMISM_URL: ${{ secrets.QUICKNODE_OPTIMISM_URL }}
       QUICKNODE_POLYGON_URL: ${{ secrets.QUICKNODE_POLYGON_URL }}
+      QUICKNODE_BSC_URL: ${{ secrets.QUICKNODE_BSC_URL }}
+      QUICKNODE_SEI_URL: ${{ secrets.QUICKNODE_SEI_URL }}
     steps:
       - name: Checkout repository
         uses: actions/checkout@v4
@@ -322,7 +342,7 @@ jobs:
       - name: Setup Node.js
         uses: actions/setup-node@v4
         with:
-          node-version: '20'
+          node-version-file: '.nvmrc'
 
       - name: Validate artifact compatibility
         uses: ./.github/actions/validate-artifact-compatibility
diff --git a/.github/workflows/qa-stats.yml b/.github/workflows/qa-stats.yml
new file mode 100644
index 000000000000..7eeb9b21dc1a
--- /dev/null
+++ b/.github/workflows/qa-stats.yml
@@ -0,0 +1,36 @@
+name: QA Stats
+
+on:
+  workflow_run:
+    workflows:
+      - ci
+    types:
+      - completed
+    branches:
+      - main
+
+jobs:
+  collect-qa-stats:
+    name: Collect QA Stats
+    runs-on: ubuntu-latest
+    if: ${{ github.event.workflow_run.conclusion == 'success' && github.event.workflow_run.event == 'push' && github.event.workflow_run.head_repository.full_name == github.repository }}
+
+    steps:
+      - uses: actions/checkout@v6
+
+      - uses: actions/setup-node@v6
+        with:
+          node-version-file: .nvmrc
+
+      - name: Collect QA stats
+        run: node .github/scripts/collect-qa-stats.mjs
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          WORKFLOW_RUN_ID: ${{ github.event.workflow_run.id }}
+
+      - name: Upload QA stats artifact
+        uses: actions/upload-artifact@v6
+        with:
+          name: qa-stats
+          path: ./qa-stats.json
+          if-no-files-found: error
diff --git a/.github/workflows/run-e2e-smoke-tests-android-flask.yml b/.github/workflows/run-e2e-smoke-tests-android-flask.yml
index 53b85f72075a..27302a850bb1 100644
--- a/.github/workflows/run-e2e-smoke-tests-android-flask.yml
+++ b/.github/workflows/run-e2e-smoke-tests-android-flask.yml
@@ -44,8 +44,23 @@ jobs:
           retry_wait_seconds: 30
           command: yarn install --immutable
 
+      - name: Restore .metamask folder
+        id: restore-metamask
+        uses: actions/cache@v4
+        with:
+          path: .metamask
+          key: .metamask-${{ hashFiles('package.json', 'yarn.lock') }}
+
+      - name: Install Foundry if cache missed
+        if: steps.restore-metamask.outputs.cache-hit != 'true'
+        run: yarn install:foundryup
       - name: Setup project
-        run: yarn setup:github-ci --no-build-ios
+        uses: nick-fields/retry@ce71cc2ab81d554ebbe88c79ab5975992d79ba08 #v3.0.2
+        with:
+          timeout_minutes: 10
+          max_attempts: 3
+          retry_wait_seconds: 30
+          command: yarn setup:github-ci --no-build-ios
 
       - name: Configure Keystore
         uses: MetaMask/github-tools/.github/actions/configure-keystore@v1
diff --git a/.github/workflows/run-e2e-smoke-tests-ios-flask.yml b/.github/workflows/run-e2e-smoke-tests-ios-flask.yml
index 96fbb2cd1ed2..c2a32ebdf098 100644
--- a/.github/workflows/run-e2e-smoke-tests-ios-flask.yml
+++ b/.github/workflows/run-e2e-smoke-tests-ios-flask.yml
@@ -32,7 +32,7 @@ jobs:
 
       - name: Setup iOS Environment
         timeout-minutes: 15
-        uses: MetaMask/github-tools/.github/actions/setup-e2e-env@v1
+        uses: MetaMask/github-tools/.github/actions/setup-e2e-env@v1.7.0
         with:
           platform: ios
           setup-simulator: false
@@ -45,8 +45,23 @@ jobs:
           retry_wait_seconds: 30
           command: yarn install --immutable
 
+      - name: Restore .metamask folder
+        id: restore-metamask
+        uses: actions/cache@v4
+        with:
+          path: .metamask
+          key: .metamask-${{ hashFiles('package.json', 'yarn.lock') }}
+
+      - name: Install Foundry if cache missed
+        if: steps.restore-metamask.outputs.cache-hit != 'true'
+        run: yarn install:foundryup
       - name: Setup project
-        run: yarn setup:github-ci --no-build-android
+        uses: nick-fields/retry@ce71cc2ab81d554ebbe88c79ab5975992d79ba08 #v3.0.2
+        with:
+          timeout_minutes: 10
+          max_attempts: 3
+          retry_wait_seconds: 30
+          command: yarn setup:github-ci --no-build-android
 
       - name: Download Main iOS App artifacts
         uses: actions/download-artifact@v4
diff --git a/.github/workflows/run-e2e-workflow.yml b/.github/workflows/run-e2e-workflow.yml
index c316956b0374..dfb5bf77c399 100644
--- a/.github/workflows/run-e2e-workflow.yml
+++ b/.github/workflows/run-e2e-workflow.yml
@@ -96,9 +96,6 @@ jobs:
     steps:
       - name: Checkout
         uses: actions/checkout@v4
-        with:
-          ref: ${{ github.event_name == 'merge_group' && github.event.merge_group.head_sha || github.event.pull_request.head.sha || github.sha }}
-          clean: true
 
       - name: Install Android System Images
         if: ${{ inputs.platform == 'android' }}
@@ -115,7 +112,7 @@ jobs:
 
       - name: Set up E2E environment
         timeout-minutes: 15
-        uses: MetaMask/github-tools/.github/actions/setup-e2e-env@v1
+        uses: MetaMask/github-tools/.github/actions/setup-e2e-env@v1.7.0
         with:
           platform: ${{ inputs.platform }}
           setup-simulator: ${{ inputs.platform == 'ios' }}
diff --git a/.github/workflows/run-performance-e2e-experimental.yml b/.github/workflows/run-performance-e2e-experimental.yml
index a5793626bb02..2b81ff57aac7 100644
--- a/.github/workflows/run-performance-e2e-experimental.yml
+++ b/.github/workflows/run-performance-e2e-experimental.yml
@@ -3,8 +3,17 @@
 name: Performance E2E Tests for Experimental Builds
 on:
   schedule:
-    - cron: '0 */3 * * 1-6'  # Every 3 hours, Mon–Fri (aligned with main performance workflow)
+    - cron: '0 */3 * * 1-6' # Every 3 hours, Mon–Fri (aligned with main performance workflow)
   workflow_dispatch:
+    inputs:
+      sentry_target:
+        description: 'Sentry target for performance events (test or real)'
+        required: false
+        type: choice
+        options:
+          - test
+          - real
+        default: test
   push:
     branches:
       - main
@@ -53,4 +62,5 @@ jobs:
     with:
       branch_name: main
       build_variant: exp
+      sentry_target: ${{ inputs.sentry_target || 'test' }}
     secrets: inherit
diff --git a/.github/workflows/run-performance-e2e-release.yml b/.github/workflows/run-performance-e2e-release.yml
index 2e22c533306c..27c0b1c68f2d 100644
--- a/.github/workflows/run-performance-e2e-release.yml
+++ b/.github/workflows/run-performance-e2e-release.yml
@@ -1,8 +1,17 @@
 name: Performance E2E Tests for Release Builds
 on:
   schedule:
-    - cron: '*/30 * * * *'  # Every 30 minutes to check for metamaskbot commits
+    - cron: '*/30 * * * *' # Every 30 minutes to check for metamaskbot commits
   workflow_dispatch:
+    inputs:
+      sentry_target:
+        description: 'Sentry target for performance events (test or real)'
+        required: false
+        type: choice
+        options:
+          - test
+          - real
+        default: test
   push:
     branches:
       - 'release/*'
@@ -24,7 +33,7 @@ jobs:
         uses: actions/checkout@v4
         with:
           fetch-depth: 0
-      
+
       - name: Check release trigger conditions
         id: check
         run: |
@@ -79,4 +88,6 @@ jobs:
     uses: ./.github/workflows/run-performance-e2e.yml
     needs: [check-release-trigger]
     if: needs.check-release-trigger.outputs.should-run == 'true'
+    with:
+      sentry_target: ${{ inputs.sentry_target || 'test' }}
     secrets: inherit
diff --git a/.github/workflows/run-performance-e2e.yml b/.github/workflows/run-performance-e2e.yml
index 30f8421080d8..c1dc40509bd6 100644
--- a/.github/workflows/run-performance-e2e.yml
+++ b/.github/workflows/run-performance-e2e.yml
@@ -15,6 +15,14 @@ on:
         description: 'Optional description for this test run'
         required: false
         type: string
+      sentry_target:
+        description: 'Sentry target for performance events (test or real)'
+        required: false
+        type: choice
+        options:
+          - test
+          - real
+        default: test
 
       browserstack_app_url_android_onboarding:
         description: 'BrowserStack Android Onboarding App URL (bs://...)'
@@ -38,6 +46,11 @@ on:
         description: 'Optional description for this test run'
         required: false
         type: string
+      sentry_target:
+        description: 'Sentry target for performance events (test or real)'
+        required: false
+        type: string
+        default: test
 
       browserstack_app_url_android_onboarding:
         description: 'BrowserStack Android Onboarding App URL (bs://...)'
@@ -210,11 +223,18 @@ jobs:
   run-android-onboarding-tests:
     name: Run Android Onboarding Tests
     uses: ./.github/workflows/performance-test-runner.yml
-    needs: [read-device-matrix, trigger-android-dual-versions, set-build-names, determine-branch-name]
+    needs:
+      [
+        read-device-matrix,
+        trigger-android-dual-versions,
+        set-build-names,
+        determine-branch-name,
+      ]
     if: always() && !failure() && !cancelled() && (needs.trigger-android-dual-versions.result == 'skipped' || needs.trigger-android-dual-versions.result == 'success') && (inputs.browserstack_app_url_android_onboarding != '' || needs.trigger-android-dual-versions.outputs.without-srp-browserstack-url != '')
     with:
       platform: android
       build_type: onboarding
+      sentry_target: ${{ inputs.sentry_target || 'test' }}
       device_matrix: ${{ needs.read-device-matrix.outputs.android_matrix }}
       browserstack_app_url: ${{ needs.trigger-android-dual-versions.outputs.without-srp-browserstack-url || inputs.browserstack_app_url_android_onboarding }}
       app_version: ${{ needs.trigger-android-dual-versions.outputs.without-srp-version || 'Manual-Input' }}
@@ -225,11 +245,18 @@ jobs:
   run-ios-onboarding-tests:
     name: Run iOS Onboarding Tests
     uses: ./.github/workflows/performance-test-runner.yml
-    needs: [read-device-matrix, trigger-ios-dual-versions, set-build-names, determine-branch-name]
+    needs:
+      [
+        read-device-matrix,
+        trigger-ios-dual-versions,
+        set-build-names,
+        determine-branch-name,
+      ]
     if: always() && !failure() && !cancelled() && (needs.trigger-ios-dual-versions.result == 'skipped' || needs.trigger-ios-dual-versions.result == 'success') && (inputs.browserstack_app_url_ios_onboarding != '' || needs.trigger-ios-dual-versions.outputs.without-srp-browserstack-url != '')
     with:
       platform: ios
       build_type: onboarding
+      sentry_target: ${{ inputs.sentry_target || 'test' }}
       device_matrix: ${{ needs.read-device-matrix.outputs.ios_matrix }}
       browserstack_app_url: ${{ needs.trigger-ios-dual-versions.outputs.without-srp-browserstack-url || inputs.browserstack_app_url_ios_onboarding }}
       app_version: ${{ needs.trigger-ios-dual-versions.outputs.without-srp-version || 'Manual-Input' }}
@@ -267,6 +294,7 @@ jobs:
     with:
       platform: android
       build_type: imported-wallet
+      sentry_target: ${{ inputs.sentry_target || 'test' }}
       device_matrix: ${{ needs.read-device-matrix.outputs.android_matrix }}
       browserstack_app_url: ${{ needs.trigger-android-dual-versions.outputs.with-srp-browserstack-url || inputs.browserstack_app_url_android_imported_wallet }}
       app_version: ${{ needs.trigger-android-dual-versions.outputs.with-srp-version || 'Manual-Input' }}
@@ -289,6 +317,7 @@ jobs:
     with:
       platform: ios
       build_type: imported-wallet
+      sentry_target: ${{ inputs.sentry_target || 'test' }}
       device_matrix: ${{ needs.read-device-matrix.outputs.ios_matrix }}
       browserstack_app_url: ${{ needs.trigger-ios-dual-versions.outputs.with-srp-browserstack-url || inputs.browserstack_app_url_ios_imported_wallet }}
       app_version: ${{ needs.trigger-ios-dual-versions.outputs.with-srp-version || 'Manual-Input' }}
@@ -311,6 +340,7 @@ jobs:
     with:
       platform: android
       build_type: mm-connect
+      sentry_target: ${{ inputs.sentry_target || 'test' }}
       device_matrix: ${{ needs.read-device-matrix.outputs.android_matrix }}
       browserstack_app_url: ${{ needs.trigger-android-dual-versions.outputs.with-srp-browserstack-url || inputs.browserstack_app_url_android_imported_wallet }}
       app_version: ${{ needs.trigger-android-dual-versions.outputs.with-srp-version || 'Manual-Input' }}
@@ -406,4 +436,4 @@ jobs:
           payload: |
             {
               "text": "${{ steps.summary.outputs.summary }}"
-            }
\ No newline at end of file
+            }
diff --git a/.github/workflows/setup-node-modules.yml b/.github/workflows/setup-node-modules.yml
index 32dc7f704673..0a655a6b276f 100644
--- a/.github/workflows/setup-node-modules.yml
+++ b/.github/workflows/setup-node-modules.yml
@@ -1,6 +1,12 @@
 # Reusable workflow for setting up node_modules
 # This workflow installs dependencies and runs the project setup, then uploads
 # the prepared node_modules as an artifact for consumption by other workflows.
+#
+# Use cases:
+# - EAS update: platform='', use-tarball=false, one ubuntu-latest runner.
+# - Build: platform=ios|android, use-tarball=true, build_name set; runs on
+#   platform-specific runner (macOS for iOS, Ubuntu for Android) and uploads
+#   a tarball to preserve symlinks.
 
 name: Setup Node Modules
 
@@ -17,13 +23,33 @@ on:
         required: false
         type: number
         default: 1
+      checkout-submodules:
+        description: 'Checkout with submodules recursive (required for build)'
+        required: false
+        type: boolean
+        default: false
+      platform:
+        description: "Platform for native setup: '' (generic/ubuntu), 'ios', or 'android'. When set, runs on platform-specific runner and uses platform-specific setup."
+        required: false
+        type: string
+        default: ''
+      build_name:
+        description: 'Build config name (e.g. main-prod). When set, applies build config before setup so METAMASK_BUILD_TYPE is correct for InpageBridgeWeb3.js.'
+        required: false
+        type: string
+        default: ''
+      use-tarball:
+        description: 'Upload a tar.gz artifact (preserves symlinks). Use for build.yml so the build job can extract on the same OS.'
+        required: false
+        type: boolean
+        default: false
       upload-artifact:
         description: 'Whether to upload node_modules as an artifact'
         required: false
         type: boolean
         default: true
       artifact-name:
-        description: 'Name of the artifact to upload'
+        description: 'Name of the artifact to upload. When platform is set, used as-is; otherwise suffix with node version and OS.'
         required: false
         type: string
         default: 'node-modules'
@@ -34,16 +60,21 @@ on:
         default: 1
     outputs:
       artifact-name:
-        description: 'The actual artifact name used (includes node version and OS)'
+        description: 'The actual artifact name used'
         value: ${{ jobs.setup.outputs.artifact-name }}
 
 permissions:
   contents: read
+  id-token: write
 
 jobs:
   setup:
-    name: Setup Node Modules
-    runs-on: ubuntu-latest
+    name: Setup Node Modules ${{ inputs.platform && format('({0})', inputs.platform) || '' }}
+    # Platform-specific runner to match consumer (build needs same OS for native deps/symlinks)
+    runs-on: ${{ inputs.platform == 'ios' && 'ghcr.io/cirruslabs/macos-runner:sequoia-xl' || (inputs.platform == 'android' && 'ghcr.io/cirruslabs/ubuntu-runner-amd64:24.04-lg' || 'ubuntu-latest') }}
+    permissions:
+      contents: read
+      id-token: write
     outputs:
       artifact-name: ${{ steps.set-artifact-name.outputs.artifact-name }}
     steps:
@@ -52,27 +83,76 @@ jobs:
         with:
           ref: ${{ inputs.ref }}
           fetch-depth: ${{ inputs.fetch-depth }}
+          submodules: ${{ inputs.checkout-submodules && 'recursive' || false }}
 
+      # iOS: Only Node + Ruby needed (setup runs gem/bundle install, no pods/Xcode). Full iOS env is in build job.
       - name: Setup Node.js
         uses: actions/setup-node@v4
         with:
-          node-version: '20'
+          node-version-file: '.nvmrc'
+          cache: ${{ inputs.platform == 'android' && 'yarn' || (inputs.platform == 'ios' && 'yarn') || '' }}
 
-      - name: Set artifact name with node version and OS
+      - name: Setup Ruby (iOS)
+        if: inputs.platform == 'ios'
+        uses: ruby/setup-ruby@44511735964dcb71245e7e55f72539531f7bc0eb #v1
+        with:
+          ruby-version: '3.2.9'
+          working-directory: ios
+          bundler-cache: true
+
+      - name: Set artifact name
         id: set-artifact-name
         run: |
-          NODE_VERSION=$(node --version | sed 's/v//')
-          OS_NAME=$(echo "$RUNNER_OS" | tr '[:upper:]' '[:lower:]')
-          ARTIFACT_NAME="${{ inputs.artifact-name }}-node${NODE_VERSION}-${OS_NAME}"
-          echo "artifact-name=$ARTIFACT_NAME" >> "$GITHUB_OUTPUT"
-          echo "📦 Artifact name: $ARTIFACT_NAME"
+          if [ -n "${{ inputs.platform }}" ]; then
+            echo "artifact-name=${{ inputs.artifact-name }}" >> "$GITHUB_OUTPUT"
+            echo "📦 Artifact name: ${{ inputs.artifact-name }}"
+          else
+            NODE_VERSION=$(node --version | sed 's/v//')
+            OS_NAME=$(echo "$RUNNER_OS" | tr '[:upper:]' '[:lower:]')
+            ARTIFACT_NAME="${{ inputs.artifact-name }}-node${NODE_VERSION}-${OS_NAME}"
+            echo "artifact-name=$ARTIFACT_NAME" >> "$GITHUB_OUTPUT"
+            echo "📦 Artifact name: $ARTIFACT_NAME"
+          fi
 
       - name: Install dependencies
         run: |
           echo "📦 Installing dependencies..."
           yarn install --immutable
 
+      - name: Apply build config (for setup)
+        if: inputs.build_name != ''
+        run: |
+          node scripts/apply-build-config.js ${{ inputs.build_name }} --export-github-env >> "$GITHUB_ENV"
+
+      - name: Restore .metamask folder
+        id: restore-metamask
+        if: inputs.platform != ''
+        uses: actions/cache@v4
+        with:
+          path: .metamask
+          key: .metamask-${{ hashFiles('package.json', 'yarn.lock') }}
+
+      - name: Install Foundry if cache missed
+        if: inputs.platform != '' && steps.restore-metamask.outputs.cache-hit != 'true'
+        run: yarn install:foundryup
+
       - name: Setup project
+        uses: nick-fields/retry@ce71cc2ab81d554ebbe88c79ab5975992d79ba08 #v3.0.2
+        if: inputs.platform != ''
+        with:
+          timeout_minutes: 10
+          max_attempts: 3
+          retry_wait_seconds: 30
+          command: |
+            echo "🔧 Running setup for ${{ inputs.platform }}..."
+            if [ "${{ inputs.platform }}" = "ios" ]; then
+              yarn setup:github-ci --build-ios --no-build-android --no-install-pods
+            else
+              yarn setup:github-ci --no-build-ios
+            fi
+
+      - name: Setup project (generic)
+        if: inputs.platform == ''
         run: |
           echo "🔧 Running setup for GitHub CI..."
           yarn setup:github-ci
@@ -80,7 +160,6 @@ jobs:
       - name: Verify setup completed
         run: |
           echo "✅ Verifying setup artifacts..."
-          # Check that critical setup artifacts exist
           if [ ! -d "node_modules" ]; then
             echo "❌ node_modules directory not found"
             exit 1
@@ -100,6 +179,7 @@ jobs:
           echo "✅ Setup verification passed"
 
       - name: Debug - List .yarn contents
+        if: inputs.platform == ''
         run: |
           echo "📂 Contents of .yarn directory:"
           ls -la .yarn/ || echo "No .yarn directory"
@@ -107,8 +187,29 @@ jobs:
           echo "📄 install-state.gz exists: $(test -f .yarn/install-state.gz && echo 'yes' || echo 'no')"
           echo "📁 cache dir exists: $(test -d .yarn/cache && echo 'yes' || echo 'no')"
 
-      - name: Upload node_modules artifact
-        if: inputs.upload-artifact
+      - name: Create tarball (preserves symlinks)
+        if: inputs.upload-artifact && inputs.use-tarball
+        run: |
+          echo "📦 Creating tarball to preserve symlinks..."
+          tar -czf node-modules-${{ inputs.platform }}.tar.gz \
+            node_modules \
+            app/util/termsOfUse/termsOfUseContent.ts \
+            app/core/InpageBridgeWeb3.js \
+            scripts/inpage-bridge/dist
+          echo "✅ Tarball created: $(du -h node-modules-${{ inputs.platform }}.tar.gz)"
+
+      - name: Upload node_modules tarball
+        if: inputs.upload-artifact && inputs.use-tarball
+        uses: actions/upload-artifact@v4
+        with:
+          name: ${{ steps.set-artifact-name.outputs.artifact-name }}
+          path: node-modules-${{ inputs.platform }}.tar.gz
+          retention-days: ${{ inputs.artifact-retention-days }}
+          compression-level: 0
+          if-no-files-found: error
+
+      - name: Upload node_modules artifact (zip)
+        if: inputs.upload-artifact && !inputs.use-tarball
         uses: actions/upload-artifact@v4.5.0
         with:
           name: ${{ steps.set-artifact-name.outputs.artifact-name }}
diff --git a/.github/workflows/update-e2e-fixtures.yml b/.github/workflows/update-e2e-fixtures.yml
new file mode 100644
index 000000000000..85a347e46976
--- /dev/null
+++ b/.github/workflows/update-e2e-fixtures.yml
@@ -0,0 +1,365 @@
+# Updates committed E2E fixture files by running the app and exporting live state.
+# Only merges structural changes (new/missing keys, type mismatches).
+# Value mismatches are reported but not auto-merged since the fixture represents
+# an existing user, not fresh post-onboarding state.
+#
+# Trigger via bot command on a PR: @metamaskbot update-mobile-fixture
+# Or manually via Actions tab with workflow_dispatch.
+#
+# NOTE: issue_comment always runs from the default branch (main).
+# To use the workflow version from the PR branch, the issue_comment handler
+# dispatches a workflow_dispatch event on the PR branch, then exits.
+
+name: Update E2E Fixtures
+
+on:
+  issue_comment:
+    types:
+      - created
+  workflow_dispatch:
+    inputs:
+      pr_number:
+        description: 'PR number to update fixtures for'
+        required: true
+        type: string
+
+jobs:
+  # ── issue_comment dispatcher ──────────────────────────────────────────
+  # Validates the comment, then re-dispatches this workflow on the PR branch.
+  dispatch:
+    name: Dispatch to PR branch
+    if: >-
+      ${{
+        github.event_name == 'issue_comment' &&
+        github.event.issue.pull_request &&
+        startsWith(github.event.comment.body, '@metamaskbot update-mobile-fixture')
+      }}
+    runs-on: ubuntu-latest
+    timeout-minutes: 5
+    steps:
+      - uses: actions/checkout@v4
+
+      - name: Get PR details
+        id: pr
+        run: |
+          PR_NUMBER="${{ github.event.issue.number }}"
+          IS_FORK=$(gh pr view "${PR_NUMBER}" --json isCrossRepository --jq '.isCrossRepository')
+          BRANCH=$(gh pr view "${PR_NUMBER}" --json headRefName --jq '.headRefName')
+          {
+            echo "PR_NUMBER=${PR_NUMBER}"
+            echo "IS_FORK=${IS_FORK}"
+            echo "BRANCH=${BRANCH}"
+          } >> "$GITHUB_OUTPUT"
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+
+      - name: Dispatch workflow on PR branch
+        if: steps.pr.outputs.IS_FORK == 'false'
+        run: |
+          gh workflow run "Update E2E Fixtures" \
+            --ref "${{ steps.pr.outputs.BRANCH }}" \
+            -f pr_number="${{ steps.pr.outputs.PR_NUMBER }}"
+
+          gh pr comment "${PR_NUMBER}" --body "🔄 **Fixture update started.** Running workflow from branch \`${{ steps.pr.outputs.BRANCH }}\`. [View workflow runs](${ACTIONS_URL})"
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          PR_NUMBER: ${{ steps.pr.outputs.PR_NUMBER }}
+          ACTIONS_URL: '${{ github.server_url }}/${{ github.repository }}/actions/workflows/update-e2e-fixtures.yml'
+
+  # ── workflow_dispatch: actual fixture update ──────────────────────────
+  # Everything below only runs on workflow_dispatch (from PR branch).
+
+  is-fork-pull-request:
+    name: Validate PR
+    if: ${{ github.event_name == 'workflow_dispatch' }}
+    runs-on: ubuntu-latest
+    timeout-minutes: 5
+    outputs:
+      IS_FORK: ${{ steps.is-fork.outputs.IS_FORK }}
+      PR_NUMBER: ${{ inputs.pr_number }}
+    steps:
+      - uses: actions/checkout@v4
+
+      - name: Determine whether this PR is from a fork
+        id: is-fork
+        run: echo "IS_FORK=$(gh pr view --json isCrossRepository --jq '.isCrossRepository' "${PR_NUMBER}" )" >> "$GITHUB_OUTPUT"
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          PR_NUMBER: ${{ inputs.pr_number }}
+
+  prepare:
+    name: Prepare build artifacts
+    runs-on: ubuntu-latest
+    timeout-minutes: 10
+    needs: is-fork-pull-request
+    if: ${{ needs.is-fork-pull-request.outputs.IS_FORK == 'false' }}
+    outputs:
+      COMMIT_SHA: ${{ steps.commit-sha.outputs.COMMIT_SHA }}
+      BRANCH: ${{ steps.branch.outputs.BRANCH }}
+      PR_NUMBER: ${{ needs.is-fork-pull-request.outputs.PR_NUMBER }}
+    steps:
+      - uses: actions/checkout@v4
+
+      - name: Checkout pull request
+        run: gh pr checkout "${PR_NUMBER}"
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          PR_NUMBER: ${{ needs.is-fork-pull-request.outputs.PR_NUMBER }}
+
+      - name: Get commit SHA
+        id: commit-sha
+        run: echo "COMMIT_SHA=$(git rev-parse HEAD)" >> "$GITHUB_OUTPUT"
+
+      - name: Get branch name
+        id: branch
+        run: echo "BRANCH=$(gh pr view "${PR_NUMBER}" --json headRefName --jq '.headRefName')" >> "$GITHUB_OUTPUT"
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          PR_NUMBER: ${{ needs.is-fork-pull-request.outputs.PR_NUMBER }}
+
+      - name: Download iOS build artifact from CI
+        run: |
+          COMMIT_SHA_FULL=$(git rev-parse HEAD)
+          BRANCH="${{ steps.branch.outputs.BRANCH }}"
+          echo "::group::Checking CI workflow status"
+
+          # Get the most recent ci workflow run for this branch
+          RUN_INFO=$(gh run list --workflow "ci" --branch "${BRANCH}" --json databaseId,status,conclusion,headSha --limit 1 --jq 'first')
+
+          if [ -z "$RUN_INFO" ] || [ "$RUN_INFO" = "null" ]; then
+            echo "::error title=No CI workflow found::No 'ci' workflow run found for branch ${BRANCH}. Push a commit to trigger CI first."
+            exit 1
+          fi
+
+          RUN_ID=$(echo "$RUN_INFO" | jq -r '.databaseId')
+          RUN_STATUS=$(echo "$RUN_INFO" | jq -r '.status')
+          RUN_CONCLUSION=$(echo "$RUN_INFO" | jq -r '.conclusion')
+          RUN_HEAD_SHA=$(echo "$RUN_INFO" | jq -r '.headSha')
+          RUN_URL="https://github.com/${{ github.repository }}/actions/runs/${RUN_ID}"
+
+          echo "CI workflow run: ${RUN_URL}"
+          echo "Status: ${RUN_STATUS}, Conclusion: ${RUN_CONCLUSION}"
+          echo "CI commit: ${RUN_HEAD_SHA}"
+          echo "PR HEAD commit: ${COMMIT_SHA_FULL}"
+          echo "::endgroup::"
+
+          if [ "${RUN_HEAD_SHA}" != "${COMMIT_SHA_FULL}" ]; then
+            echo "::error title=CI not up to date::The latest CI workflow (commit ${RUN_HEAD_SHA:0:7}) does not match the PR HEAD (commit ${COMMIT_SHA_FULL:0:7}). Wait for CI to run on the latest commit, then try again."
+            exit 1
+          fi
+
+          if [ "${RUN_STATUS}" != "completed" ]; then
+            echo "::error title=CI still running::The CI workflow is still in progress (status: ${RUN_STATUS}). Wait for the 'Build iOS Apps' job to complete, then run @metamaskbot update-mobile-fixture again. View CI: ${RUN_URL}"
+            exit 1
+          fi
+
+          if [ "${RUN_CONCLUSION}" != "success" ]; then
+            echo "::warning title=CI did not succeed::The CI workflow concluded with '${RUN_CONCLUSION}'. The iOS build artifact may not be available. View CI: ${RUN_URL}"
+          fi
+
+          echo "::group::Downloading iOS app artifact"
+          echo "Attempting to download iOS app artifact from CI run ${RUN_ID}..."
+
+          if ! gh run download "${RUN_ID}" -n main-qa-MetaMask.app -D ios-app-artifact; then
+            echo "::endgroup::"
+            echo "::error title=iOS artifact not found::Failed to download 'main-qa-MetaMask.app' artifact. Possible causes:%0A- The 'Build iOS Apps' job has not completed%0A- The iOS build was skipped (no iOS-impacting changes)%0A- The iOS build failed%0A%0ACheck the CI workflow: ${RUN_URL}"
+            exit 1
+          fi
+
+          echo "::endgroup::"
+          echo "✅ Successfully downloaded iOS app artifact."
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+
+      - name: Cache iOS app artifact
+        uses: actions/cache/save@v4
+        with:
+          path: ios-app-artifact
+          key: ios-app-${{ steps.commit-sha.outputs.COMMIT_SHA }}
+
+  update-fixtures:
+    name: Export & update fixtures
+    needs: [prepare]
+    runs-on: ghcr.io/cirruslabs/macos-runner:sequoia
+    timeout-minutes: 30
+
+    env:
+      METAMASK_ENVIRONMENT: qa
+      METAMASK_BUILD_TYPE: main
+      GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+      PLATFORM: ios
+      GITHUB_CI: 'true'
+      MM_INFURA_PROJECT_ID: ${{ secrets.MM_INFURA_PROJECT_ID }}
+      RAMP_INTERNAL_BUILD: 'true'
+      MM_SECURITY_ALERTS_API_ENABLED: 'true'
+      MM_NOTIFICATIONS_UI_ENABLED: 'true'
+      FEATURES_ANNOUNCEMENTS_ACCESS_TOKEN: ${{ secrets.FEATURES_ANNOUNCEMENTS_ACCESS_TOKEN }}
+      FEATURES_ANNOUNCEMENTS_SPACE_ID: ${{ secrets.FEATURES_ANNOUNCEMENTS_SPACE_ID }}
+      SEEDLESS_ONBOARDING_ENABLED: 'true'
+      SEGMENT_WRITE_KEY_QA: ${{ secrets.SEGMENT_WRITE_KEY_QA }}
+      SEGMENT_PROXY_URL_QA: ${{ secrets.SEGMENT_PROXY_URL_QA }}
+      SEGMENT_DELETE_API_SOURCE_ID_QA: ${{ secrets.SEGMENT_DELETE_API_SOURCE_ID_QA }}
+      MAIN_IOS_GOOGLE_CLIENT_ID_UAT: ${{ secrets.MAIN_IOS_GOOGLE_CLIENT_ID_UAT }}
+      MAIN_IOS_GOOGLE_REDIRECT_URI_UAT: ${{ secrets.MAIN_IOS_GOOGLE_REDIRECT_URI_UAT }}
+      MAIN_ANDROID_APPLE_CLIENT_ID_UAT: ${{ secrets.MAIN_ANDROID_APPLE_CLIENT_ID_UAT }}
+      MAIN_ANDROID_GOOGLE_CLIENT_ID_UAT: ${{ secrets.MAIN_ANDROID_GOOGLE_CLIENT_ID_UAT }}
+      MAIN_ANDROID_GOOGLE_SERVER_CLIENT_ID_UAT: ${{ secrets.MAIN_ANDROID_GOOGLE_SERVER_CLIENT_ID_UAT }}
+      SEGMENT_REGULATIONS_ENDPOINT_QA: ${{ secrets.SEGMENT_REGULATIONS_ENDPOINT_QA }}
+      MM_SENTRY_DSN_TEST: ${{ secrets.MM_SENTRY_DSN_TEST }}
+      MM_SENTRY_AUTH_TOKEN: ${{ secrets.MM_SENTRY_AUTH_TOKEN }}
+      GOOGLE_SERVICES_B64_IOS: ${{ secrets.GOOGLE_SERVICES_B64_IOS }}
+      GOOGLE_SERVICES_B64_ANDROID: ${{ secrets.GOOGLE_SERVICES_B64_ANDROID }}
+      YARN_ENABLE_GLOBAL_CACHE: 'true'
+
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+        with:
+          ref: ${{ needs.prepare.outputs.BRANCH }}
+
+      - name: Set up E2E environment
+        timeout-minutes: 15
+        uses: MetaMask/github-tools/.github/actions/setup-e2e-env@v1
+        with:
+          platform: ios
+          setup-simulator: true
+          configure-keystores: false
+
+      - name: Build Detox framework cache
+        run: |
+          yarn detox clean-framework-cache
+          yarn detox build-framework-cache
+
+      - name: Restore iOS app artifact
+        uses: actions/cache/restore@v4
+        with:
+          path: ios-app-artifact
+          key: ios-app-${{ needs.prepare.outputs.COMMIT_SHA }}
+          fail-on-cache-miss: true
+
+      - name: Place iOS app artifact
+        run: |
+          mkdir -p artifacts/main-qa-MetaMask.app
+          cp -R ios-app-artifact/* artifacts/main-qa-MetaMask.app/
+        env:
+          PREBUILT_IOS_APP_PATH: artifacts/main-qa-MetaMask.app
+
+      - name: Run fixture validation spec
+        timeout-minutes: 30
+        run: |
+          IS_TEST='true' NODE_OPTIONS='--experimental-vm-modules' \
+            yarn detox test -c ios.sim.main.ci --headless \
+            tests/regression/fixtures/fixture-validation.spec.ts
+        env:
+          PREBUILT_IOS_APP_PATH: artifacts/main-qa-MetaMask.app
+
+      - name: Cache updated fixture
+        uses: actions/cache/save@v4
+        with:
+          path: tests/framework/fixtures/json/default-fixture.json
+          key: fixture-${{ needs.prepare.outputs.COMMIT_SHA }}
+
+  commit-updated-fixtures:
+    name: Commit the updated fixtures
+    runs-on: ubuntu-latest
+    timeout-minutes: 10
+    needs:
+      - prepare
+      - is-fork-pull-request
+      - update-fixtures
+    if: ${{ needs.is-fork-pull-request.outputs.IS_FORK == 'false' }}
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v4
+        with:
+          token: ${{ secrets.ACTIONS_WRITE_TOKEN }}
+
+      - name: Checkout pull request
+        run: gh pr checkout "${PR_NUMBER}"
+        env:
+          GITHUB_TOKEN: ${{ secrets.ACTIONS_WRITE_TOKEN }}
+          PR_NUMBER: ${{ needs.prepare.outputs.PR_NUMBER }}
+
+      - name: Restore updated fixture
+        uses: actions/cache/restore@v4
+        with:
+          path: tests/framework/fixtures/json/default-fixture.json
+          key: fixture-${{ needs.prepare.outputs.COMMIT_SHA }}
+          fail-on-cache-miss: true
+
+      - name: Check for fixture changes
+        id: fixture-changes
+        run: |
+          if git diff --exit-code tests/framework/fixtures/json/default-fixture.json; then
+            echo "HAS_CHANGES=false" >> "$GITHUB_OUTPUT"
+          else
+            echo "HAS_CHANGES=true" >> "$GITHUB_OUTPUT"
+          fi
+
+      # Note: Commits pushed with the default GITHUB_TOKEN do not trigger
+      # downstream CI workflows (GitHub anti-loop protection). This is
+      # intentional — a follow-up push or manual CI re-run will validate
+      # the updated fixture. Use a PAT or GitHub App token if auto-triggered
+      # CI is needed in the future.
+      - name: Commit the updated fixture
+        if: steps.fixture-changes.outputs.HAS_CHANGES == 'true'
+        run: |
+          git config --global user.name 'MetaMask Bot'
+          git config --global user.email 'metamaskbot@users.noreply.github.com'
+          git commit -am "chore: update E2E default fixture"
+          git push
+
+      - name: Post comment
+        run: |
+          if [[ $HAS_CHANGES == 'true' ]]; then
+            gh pr comment "${PR_NUMBER}" --body 'E2E fixtures updated.'
+          else
+            gh pr comment "${PR_NUMBER}" --body 'No E2E fixture changes detected.'
+          fi
+        env:
+          HAS_CHANGES: ${{ steps.fixture-changes.outputs.HAS_CHANGES }}
+          GITHUB_TOKEN: ${{ secrets.ACTIONS_WRITE_TOKEN }}
+          PR_NUMBER: ${{ needs.prepare.outputs.PR_NUMBER }}
+
+  check-status:
+    name: Check whether the fixture update succeeded
+    runs-on: ubuntu-latest
+    timeout-minutes: 5
+    if: ${{ !cancelled() && needs.is-fork-pull-request.outputs.IS_FORK == 'false' }}
+    needs:
+      - is-fork-pull-request
+      - commit-updated-fixtures
+    outputs:
+      PASSED: ${{ steps.set-output.outputs.PASSED }}
+    steps:
+      - name: Set PASSED output
+        id: set-output
+        run: |
+          if [[ "${{ needs.commit-updated-fixtures.result }}" == "success" ]]; then
+            echo "PASSED=true" >> "$GITHUB_OUTPUT"
+          else
+            echo "PASSED=false" >> "$GITHUB_OUTPUT"
+          fi
+
+  failure-comment:
+    name: Comment about the fixture update failure
+    if: ${{ !cancelled() && needs.is-fork-pull-request.outputs.IS_FORK == 'false' }}
+    runs-on: ubuntu-latest
+    timeout-minutes: 5
+    needs:
+      - is-fork-pull-request
+      - check-status
+    steps:
+      - uses: actions/checkout@v4
+
+      - name: Post comment if the update failed
+        run: |
+          passed="${{ needs.check-status.outputs.PASSED }}"
+          if [[ $passed != "true" ]]; then
+            body="❌ **E2E fixture update failed.**\n\n**Common causes:**\n- CI workflow is still running — wait for 'Build iOS Apps' to complete\n- CI workflow was skipped — ensure your PR has iOS-impacting changes or use \`skip-smart-e2e-selection\` label\n- iOS build failed — check the CI workflow for errors\n\n[View logs and retry](${ACTION_RUN_URL})"
+            gh pr comment "${PR_NUMBER}" --body "$body"
+          fi
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          PR_NUMBER: ${{ needs.is-fork-pull-request.outputs.PR_NUMBER }}
+          ACTION_RUN_URL: '${{ github.server_url }}/${{ github.repository }}/actions/runs/${{ github.run_id }}'
diff --git a/.gitignore b/.gitignore
index c86a26c3a310..1c5d326b37f9 100644
--- a/.gitignore
+++ b/.gitignore
@@ -115,7 +115,7 @@ tests/artifacts
 # E2E Reports generated by tests
 tests/reports
 # Legacy e2e reports
-e2e/reports 
+e2e/reports
 
 # Unit Coverage Reports generated by tests
 tests/coverage
@@ -136,6 +136,7 @@ appwright/test-reports/
 test-results/
 test-reports/
 appwright/reporters/reports/*
+tests/reporters/reports/
 *.apk
 
 # anvil binaries
@@ -180,4 +181,4 @@ temp/
 
 tests/coverage-systems/
 
-runway-artifacts/
\ No newline at end of file
+runway-artifacts/
diff --git a/.js.env.example b/.js.env.example
index a15cddcf5c8b..4b384bcdcd6e 100644
--- a/.js.env.example
+++ b/.js.env.example
@@ -172,6 +172,12 @@ export ENABLE_WHY_DID_YOU_RENDER="false"
 # Rewards API URL
 export REWARDS_API_URL=""
 
+## Advanced Charts (TradingView charting library CDN)
+# Production: CloudFront distribution URL (trailing slash required)
+# Development: local http-server, e.g. http://localhost:8000/
+# Leave empty to use the default S3 origin fallback
+export MM_CHARTING_LIBRARY_URL=""
+
 ## Perps
 export MM_PERPS_ENABLED="true"
 
@@ -182,6 +188,12 @@ export MM_PERPS_GTM_MODAL_ENABLED="true"
 export MM_PERPS_ORDER_BOOK_ENABLED="true"
 export MM_PERPS_FEEDBACK_ENABLED="true"
 export MM_PERPS_MYX_PROVIDER_ENABLED="true"
+export MM_PERPS_MYX_APP_ID_TESTNET=""
+export MM_PERPS_MYX_API_SECRET_TESTNET=""
+export MM_PERPS_MYX_BROKER_ADDRESS_TESTNET=""
+export MM_PERPS_MYX_APP_ID_MAINNET=""
+export MM_PERPS_MYX_API_SECRET_MAINNET=""
+export MM_PERPS_MYX_BROKER_ADDRESS_MAINNET=""
 # HIP-3 Feature Flags (remote override with local fallback)
 export MM_PERPS_HIP3_ENABLED="true"
 export MM_PERPS_HIP3_ALLOWLIST_MARKETS=""  # Allowlist: Empty = enable all markets. Examples: "xyz:XYZ100,xyz:TSLA" or "xyz:*,abc:TSLA"
diff --git a/.ruby-version b/.ruby-version
index 9cec7165ab0a..e650c01d92f3 100644
--- a/.ruby-version
+++ b/.ruby-version
@@ -1 +1 @@
-3.1.6
+3.2.9
diff --git a/.storybook/storybook.requires.js b/.storybook/storybook.requires.js
index ef983aba2799..a9d2975e3d7d 100644
--- a/.storybook/storybook.requires.js
+++ b/.storybook/storybook.requires.js
@@ -47,13 +47,10 @@ const getStories = () => {
     "./app/component-library/components-temp/Buttons/ButtonSemantic/ButtonSemantic.stories.tsx": require("../app/component-library/components-temp/Buttons/ButtonSemantic/ButtonSemantic.stories.tsx"),
     "./app/component-library/components-temp/Buttons/ButtonToggle/ButtonToggle.stories.tsx": require("../app/component-library/components-temp/Buttons/ButtonToggle/ButtonToggle.stories.tsx"),
     "./app/component-library/components-temp/CellSelectWithMenu/CellSelectWithMenu.stories.tsx": require("../app/component-library/components-temp/CellSelectWithMenu/CellSelectWithMenu.stories.tsx"),
-    "./app/component-library/components-temp/HeaderCollapsible/HeaderCollapsible.stories.tsx": require("../app/component-library/components-temp/HeaderCollapsible/HeaderCollapsible.stories.tsx"),
-    "./app/component-library/components-temp/HeaderCollapsibleStandard/HeaderCollapsibleStandard.stories.tsx": require("../app/component-library/components-temp/HeaderCollapsibleStandard/HeaderCollapsibleStandard.stories.tsx"),
-    "./app/component-library/components-temp/HeaderCollapsibleSubpage/HeaderCollapsibleSubpage.stories.tsx": require("../app/component-library/components-temp/HeaderCollapsibleSubpage/HeaderCollapsibleSubpage.stories.tsx"),
-    "./app/component-library/components-temp/HeaderCompactSearch/HeaderCompactSearch.stories.tsx": require("../app/component-library/components-temp/HeaderCompactSearch/HeaderCompactSearch.stories.tsx"),
     "./app/component-library/components-temp/HeaderCompactStandard/HeaderCompactStandard.stories.tsx": require("../app/component-library/components-temp/HeaderCompactStandard/HeaderCompactStandard.stories.tsx"),
-    "./app/component-library/components-temp/HeaderStackedStandard/HeaderStackedStandard.stories.tsx": require("../app/component-library/components-temp/HeaderStackedStandard/HeaderStackedStandard.stories.tsx"),
-    "./app/component-library/components-temp/HeaderStackedSubpage/HeaderStackedSubpage.stories.tsx": require("../app/component-library/components-temp/HeaderStackedSubpage/HeaderStackedSubpage.stories.tsx"),
+    "./app/component-library/components-temp/HeaderRoot/HeaderRoot.stories.tsx": require("../app/component-library/components-temp/HeaderRoot/HeaderRoot.stories.tsx"),
+    "./app/component-library/components-temp/HeaderSearch/HeaderSearch.stories.tsx": require("../app/component-library/components-temp/HeaderSearch/HeaderSearch.stories.tsx"),
+    "./app/component-library/components-temp/HeaderStandardAnimated/HeaderStandardAnimated.stories.tsx": require("../app/component-library/components-temp/HeaderStandardAnimated/HeaderStandardAnimated.stories.tsx"),
     "./app/component-library/components-temp/KeyValueRow/KeyValueRow.stories.tsx": require("../app/component-library/components-temp/KeyValueRow/KeyValueRow.stories.tsx"),
     "./app/component-library/components-temp/ListItemMultiSelectButton/ListItemMultiSelectButton.stories.tsx": require("../app/component-library/components-temp/ListItemMultiSelectButton/ListItemMultiSelectButton.stories.tsx"),
     "./app/component-library/components-temp/ListItemMultiSelectWithMenuButton/ListItemMultiSelectWithMenuButton.stories.tsx": require("../app/component-library/components-temp/ListItemMultiSelectWithMenuButton/ListItemMultiSelectWithMenuButton.stories.tsx"),
diff --git a/.yarn/patches/@metamask-assets-controllers-npm-100.0.3-ea172b88c9.patch b/.yarn/patches/@metamask-assets-controllers-npm-100.0.3-ea172b88c9.patch
deleted file mode 100644
index dc19783ed9ab..000000000000
--- a/.yarn/patches/@metamask-assets-controllers-npm-100.0.3-ea172b88c9.patch
+++ /dev/null
@@ -1,28 +0,0 @@
-diff --git a/dist/multi-chain-accounts-service/api-balance-fetcher.cjs b/dist/multi-chain-accounts-service/api-balance-fetcher.cjs
-index 6ae7034bd87dfdaa49324fd36a340689df45960e..4719739bf194f5fb8669f382b021b54952294508 100644
---- a/dist/multi-chain-accounts-service/api-balance-fetcher.cjs
-+++ b/dist/multi-chain-accounts-service/api-balance-fetcher.cjs
-@@ -150,7 +150,10 @@ class AccountsApiBalanceFetcher {
-             chains.forEach((chainId) => {
-                 const key = `${address}-${chainId}`;
-                 const existingBalance = nativeBalancesFromAPI.get(key);
--                if (!existingBalance) {
-+                const isChainIncludedInRequest = chainIds.includes(chainId);
-+                const isChainSupported = this.supports(chainId);
-+                const shouldZeroOutBalance = !existingBalance && isChainIncludedInRequest && isChainSupported;
-+                if (shouldZeroOutBalance) {
-                     // Add zero native balance entry if API succeeded but didn't return one
-                     results.push({
-                         success: true,
-@@ -172,7 +175,10 @@ class AccountsApiBalanceFetcher {
-                         const key = `${account.toLowerCase()}-${tokenLowerCase}-${chainId}`;
-                         const isERC = tokenAddress !== ZERO_ADDRESS;
-                         const existingBalance = nonNativeBalancesFromAPI.get(key);
--                        if (isERC && !existingBalance) {
-+                        const isChainIncludedInRequest = chainIds.includes(chainId);
-+                        const isChainSupported = this.supports(chainId);
-+                        const shouldZeroOutBalance = !existingBalance && isChainIncludedInRequest && isChainSupported;
-+                        if (isERC && shouldZeroOutBalance) {
-                             results.push({
-                                 success: true,
-                                 value: new bn_js_1.default('0'),
diff --git a/.yarn/patches/@metamask-bridge-controller-npm-67.2.0-32d3aafe1f.patch b/.yarn/patches/@metamask-bridge-controller-npm-67.2.0-32d3aafe1f.patch
new file mode 100644
index 000000000000..a44ffb3f1311
--- /dev/null
+++ b/.yarn/patches/@metamask-bridge-controller-npm-67.2.0-32d3aafe1f.patch
@@ -0,0 +1,20 @@
+diff --git a/dist/utils/metrics/types.d.cts b/dist/utils/metrics/types.d.cts
+index b8f94476d4447cb5895a0f39e7beb1eb5e3b4e16..90cbc588e9ebbc84a761bbeaf3770572aad4d6f8 100644
+--- a/dist/utils/metrics/types.d.cts
++++ b/dist/utils/metrics/types.d.cts
+@@ -153,6 +153,7 @@ type RequiredEventContextFromClientBase = {
+ export type RequiredEventContextFromClient = {
+     [K in keyof RequiredEventContextFromClientBase]: RequiredEventContextFromClientBase[K] & {
+         location?: MetaMetricsSwapsEventSource;
++        ab_tests?: Record<string, string>;
+     };
+ };
+ /**
+@@ -198,6 +199,7 @@ export type EventPropertiesFromControllerState = {
+ export type CrossChainSwapsEventProperties<T extends UnifiedSwapBridgeEventName> = {
+     action_type: MetricsActionType;
+     location: MetaMetricsSwapsEventSource;
++    ab_tests?: Record<string, string>;
+ } | Pick<EventPropertiesFromControllerState, T>[T] | Pick<RequiredEventContextFromClient, T>[T];
+ export {};
+ //# sourceMappingURL=types.d.cts.map
diff --git a/.yarn/patches/@metamask-bridge-status-controller-npm-67.0.1-d8a41d9c02.patch b/.yarn/patches/@metamask-bridge-status-controller-npm-67.0.1-d8a41d9c02.patch
new file mode 100644
index 000000000000..c2335cc19b03
--- /dev/null
+++ b/.yarn/patches/@metamask-bridge-status-controller-npm-67.0.1-d8a41d9c02.patch
@@ -0,0 +1,177 @@
+diff --git a/dist/bridge-status-controller.cjs b/dist/bridge-status-controller.cjs
+index c89f7e4c600ea6e710a532fc6887ed525b80f333..c4c20566a27b77dfa8b88ff56a038ad5344e0efb 100644
+--- a/dist/bridge-status-controller.cjs
++++ b/dist/bridge-status-controller.cjs
+@@ -207,7 +207,7 @@ class BridgeStatusController extends (0, polling_controller_1.StaticIntervalPoll
+             });
+         });
+         _BridgeStatusController_addTxToHistory.set(this, (startPollingForBridgeTxStatusArgs, actionId) => {
+-            const { bridgeTxMeta, statusRequest, quoteResponse, startTime, slippagePercentage, initialDestAssetBalance, targetContractAddress, approvalTxId, isStxEnabled, location, accountAddress: selectedAddress, } = startPollingForBridgeTxStatusArgs;
++            const { bridgeTxMeta, statusRequest, quoteResponse, startTime, slippagePercentage, initialDestAssetBalance, targetContractAddress, approvalTxId, isStxEnabled, location, abTests, accountAddress: selectedAddress, } = startPollingForBridgeTxStatusArgs;
+             // Determine the key for this history item:
+             // - For pre-submission (non-batch EVM): use actionId
+             // - For post-submission or other cases: use bridgeTxMeta.id
+@@ -248,6 +248,7 @@ class BridgeStatusController extends (0, polling_controller_1.StaticIntervalPoll
+                 isStxEnabled: isStxEnabled ?? false,
+                 featureId: quoteResponse.featureId,
+                 location,
++                ...(abTests && { abTests }),
+             };
+             this.update((state) => {
+                 // Use actionId as key for pre-submission, or txMeta.id for post-submission
+@@ -716,8 +717,8 @@ class BridgeStatusController extends (0, polling_controller_1.StaticIntervalPoll
+          * @param location - The entry point from which the user initiated the swap or bridge (e.g. Main View, Token View, Trending Explore)
+          * @returns The transaction meta
+          */
+-        this.submitTx = async (accountAddress, quoteResponse, isStxEnabledOnClient, quotesReceivedContext, location = bridge_controller_1.MetaMetricsSwapsEventSource.MainView) => {
+-            this.messenger.call('BridgeController:stopPollingForQuotes', bridge_controller_1.AbortReason.TransactionSubmitted, 
++        this.submitTx = async (accountAddress, quoteResponse, isStxEnabledOnClient, quotesReceivedContext, location = bridge_controller_1.MetaMetricsSwapsEventSource.MainView, abTests) => {
++            this.messenger.call('BridgeController:stopPollingForQuotes', bridge_controller_1.AbortReason.TransactionSubmitted,
+             // If trade is submitted before all quotes are loaded, the QuotesReceived event is published
+             // If the trade has a featureId, it means it was submitted outside of the Unified Swap and Bridge experience, so no QuotesReceived event is published
+             quoteResponse.featureId ? undefined : quotesReceivedContext);
+@@ -726,7 +727,7 @@ class BridgeStatusController extends (0, polling_controller_1.StaticIntervalPoll
+                 throw new Error('Failed to submit cross-chain swap transaction: undefined multichain account');
+             }
+             const isHardwareAccount = (0, bridge_controller_1.isHardwareWallet)(selectedAccount);
+-            const preConfirmationProperties = (0, metrics_1.getPreConfirmationPropertiesFromQuote)(quoteResponse, isStxEnabledOnClient, isHardwareAccount, location);
++            const preConfirmationProperties = (0, metrics_1.getPreConfirmationPropertiesFromQuote)(quoteResponse, isStxEnabledOnClient, isHardwareAccount, location, abTests);
+             // Emit Submitted event after submit button is clicked
+             !quoteResponse.featureId &&
+                 __classPrivateFieldGet(this, _BridgeStatusController_trackUnifiedSwapBridgeEvent, "f").call(this, bridge_controller_1.UnifiedSwapBridgeEventName.Submitted, undefined, preConfirmationProperties);
+@@ -848,6 +849,7 @@ class BridgeStatusController extends (0, polling_controller_1.StaticIntervalPoll
+                         startTime,
+                         approvalTxId,
+                         location,
++                        abTests,
+                     }, actionId);
+                     // Pass txFee when gasIncluded is true to use the quote's gas fees
+                     // instead of re-estimating (which would fail for max native token swaps)
+@@ -888,6 +890,7 @@ class BridgeStatusController extends (0, polling_controller_1.StaticIntervalPoll
+                         startTime,
+                         approvalTxId,
+                         location,
++                        abTests,
+                     });
+                 }
+                 if ((0, bridge_controller_1.isNonEvmChainId)(quoteResponse.quote.srcChainId)) {
+@@ -916,12 +919,12 @@ class BridgeStatusController extends (0, polling_controller_1.StaticIntervalPoll
+          * @returns A lightweight TransactionMeta-like object for history linking
+          */
+         this.submitIntent = async (params) => {
+-            const { quoteResponse, signature, accountAddress, location } = params;
++            const { quoteResponse, signature, accountAddress, location, abTests } = params;
+             this.messenger.call('BridgeController:stopPollingForQuotes', bridge_controller_1.AbortReason.TransactionSubmitted);
+             // Build pre-confirmation properties for error tracking parity with submitTx
+             const account = __classPrivateFieldGet(this, _BridgeStatusController_instances, "m", _BridgeStatusController_getMultichainSelectedAccount).call(this, accountAddress);
+             const isHardwareAccount = Boolean(account) && (0, bridge_controller_1.isHardwareWallet)(account);
+-            const preConfirmationProperties = (0, metrics_1.getPreConfirmationPropertiesFromQuote)(quoteResponse, false, isHardwareAccount, location);
++            const preConfirmationProperties = (0, metrics_1.getPreConfirmationPropertiesFromQuote)(quoteResponse, false, isHardwareAccount, location, abTests);
+             try {
+                 const intent = (0, transaction_1.getIntentFromQuote)(quoteResponse);
+                 // If backend provided an approval tx for this intent quote, submit it first (on-chain),
+@@ -932,7 +935,7 @@ class BridgeStatusController extends (0, polling_controller_1.StaticIntervalPoll
+                     // Handle approval silently for better UX in intent flows
+                     const approvalTxMeta = await __classPrivateFieldGet(this, _BridgeStatusController_handleApprovalTx, "f").call(this, isBridgeTx, quoteResponse.quote.srcChainId, quoteResponse.approval && (0, bridge_controller_1.isEvmTxData)(quoteResponse.approval)
+                         ? quoteResponse.approval
+-                        : undefined, quoteResponse.resetApproval, 
++                        : undefined, quoteResponse.resetApproval,
+                     /* requireApproval */ false);
+                     approvalTxId = approvalTxMeta?.id;
+                     if (approvalTxId) {
+@@ -1017,6 +1020,7 @@ class BridgeStatusController extends (0, polling_controller_1.StaticIntervalPoll
+                         approvalTxId,
+                         startTime,
+                         location,
++                        abTests,
+                     });
+                     // Start polling using the orderId key to route to intent manager
+                     __classPrivateFieldGet(this, _BridgeStatusController_startPollingForTxId, "f").call(this, bridgeHistoryKey);
+@@ -1043,12 +1047,21 @@ class BridgeStatusController extends (0, polling_controller_1.StaticIntervalPoll
+          * @param eventProperties - The properties for the event
+          */
+         _BridgeStatusController_trackUnifiedSwapBridgeEvent.set(this, (eventName, txMetaId, eventProperties) => {
++               const historyAbTests = txMetaId
++                ? this.state.txHistory?.[txMetaId]?.abTests
++                : undefined;
++            const resolvedAbTests = eventProperties?.ab_tests ?? historyAbTests ?? undefined;
++
+             const baseProperties = {
+                 action_type: bridge_controller_1.MetricsActionType.SWAPBRIDGE_V1,
+                 location: eventProperties?.location ??
+                     (txMetaId ? this.state.txHistory?.[txMetaId]?.location : undefined) ??
+                     bridge_controller_1.MetaMetricsSwapsEventSource.MainView,
+                 ...(eventProperties ?? {}),
++                ...(resolvedAbTests &&
++                    Object.keys(resolvedAbTests).length > 0 && {
++                    ab_tests: resolvedAbTests,
++                }),
+             };
+             // This will publish events for PERPS dropped tx failures as well
+             if (!txMetaId) {
+diff --git a/dist/bridge-status-controller.d.cts b/dist/bridge-status-controller.d.cts
+index a71266a9c15070d9fd9242148b16ad0e454184e9..f5dc880b383ecef194a44539e6c570fbc0fa7b7a 100644
+--- a/dist/bridge-status-controller.d.cts
++++ b/dist/bridge-status-controller.d.cts
+@@ -88,7 +88,7 @@ export declare class BridgeStatusController extends BridgeStatusController_base<
+      * @param location - The entry point from which the user initiated the swap or bridge (e.g. Main View, Token View, Trending Explore)
+      * @returns The transaction meta
+      */
+-    submitTx: (accountAddress: string, quoteResponse: QuoteResponse<Trade, Trade> & QuoteMetadata, isStxEnabledOnClient: boolean, quotesReceivedContext?: RequiredEventContextFromClient[UnifiedSwapBridgeEventName.QuotesReceived], location?: MetaMetricsSwapsEventSource) => Promise<TransactionMeta & Partial<SolanaTransactionMeta>>;
++     submitTx: (accountAddress: string, quoteResponse: QuoteResponse<Trade, Trade> & QuoteMetadata, isStxEnabledOnClient: boolean, quotesReceivedContext?: RequiredEventContextFromClient[UnifiedSwapBridgeEventName.QuotesReceived], location?: MetaMetricsSwapsEventSource, abTests?: Record<string, string>) => Promise<TransactionMeta & Partial<SolanaTransactionMeta>>;
+     /**
+      * UI-signed intent submission (fast path): the UI generates the EIP-712 signature and calls this with the raw signature.
+      * Here we submit the order to the intent provider and create a synthetic history entry for UX.
+@@ -105,6 +105,7 @@ export declare class BridgeStatusController extends BridgeStatusController_base<
+         signature: string;
+         accountAddress: string;
+         location?: MetaMetricsSwapsEventSource;
++        abTests?: Record<string, string>;
+     }) => Promise<Pick<TransactionMeta, 'id' | 'chainId' | 'type' | 'status'>>;
+ }
+ export {};
+diff --git a/dist/types.d.cts b/dist/types.d.cts
+index d0492cd8b8159bc63121174e6395f53c49aba59b..c5402866e8f13e37e535d1196d697756d2330023 100644
+--- a/dist/types.d.cts
++++ b/dist/types.d.cts
+@@ -96,6 +96,11 @@ export type BridgeHistoryItem = {
+      * Used to attribute swaps to specific flows (e.g. Trending Explore).
+      */
+     location?: MetaMetricsSwapsEventSource;
++    /**
++     * A/B test context to attribute swap/bridge events to specific experiments.
++     * Keys are test names, values are variant names (e.g. { token_details_layout: 'treatment' }).
++     */
++    abTests?: Record<string, string>;
+     /**
+      * Attempts tracking for exponential backoff on failed fetches.
+      * We track the number of attempts and the last attempt time for each txMetaId that has failed at least once
+@@ -161,6 +166,7 @@ export type StartPollingForBridgeTxStatusArgs = {
+     approvalTxId?: BridgeHistoryItem['approvalTxId'];
+     isStxEnabled?: BridgeHistoryItem['isStxEnabled'];
+     location?: BridgeHistoryItem['location'];
++    abTests?: BridgeHistoryItem['abTests'];
+     accountAddress: string;
+ };
+ /**
+diff --git a/dist/utils/metrics.cjs b/dist/utils/metrics.cjs
+index 775367bc08c8a46c19a78913903573a295d1f677..ef00bf331d866e60a23204475f18a017614fdd57 100644
+--- a/dist/utils/metrics.cjs
++++ b/dist/utils/metrics.cjs
+@@ -109,7 +109,7 @@ exports.getPriceImpactFromQuote = getPriceImpactFromQuote;
+  * @param location - The entry point from which the user initiated the swap or bridge (e.g. Main View, Token View, Trending Explore)
+  * @returns The properties for the pre-confirmation event
+  */
+-const getPreConfirmationPropertiesFromQuote = (quoteResponse, isStxEnabledOnClient, isHardwareAccount, location = bridge_controller_1.MetaMetricsSwapsEventSource.MainView) => {
++const getPreConfirmationPropertiesFromQuote = (quoteResponse, isStxEnabledOnClient, isHardwareAccount, location = bridge_controller_1.MetaMetricsSwapsEventSource.MainView, abTests) => {
+     const { quote } = quoteResponse;
+     return {
+         ...(0, exports.getPriceImpactFromQuote)(quote),
+@@ -125,6 +125,7 @@ const getPreConfirmationPropertiesFromQuote = (quoteResponse, isStxEnabledOnClie
+         action_type: bridge_controller_1.MetricsActionType.SWAPBRIDGE_V1,
+         custom_slippage: false, // TODO detect whether the user changed the default slippage
+         location,
++        ...(abTests && Object.keys(abTests).length > 0 && { ab_tests: abTests }),
+     };
+ };
+ exports.getPreConfirmationPropertiesFromQuote = getPreConfirmationPropertiesFromQuote;
diff --git a/.yarn/patches/appwright-patch-9fcd858d19.patch b/.yarn/patches/appwright-patch-9fcd858d19.patch
new file mode 100644
index 000000000000..46d3c5253a49
--- /dev/null
+++ b/.yarn/patches/appwright-patch-9fcd858d19.patch
@@ -0,0 +1,13 @@
+diff --git a/dist/providers/browserstack/index.js b/dist/providers/browserstack/index.js
+index c84d31cb938f284c04051bcca7245ccbe42fa684..58a8bc4f521fd46a34d6caba7b0a88170e7ac6a1 100644
+--- a/dist/providers/browserstack/index.js
++++ b/dist/providers/browserstack/index.js
+@@ -248,7 +248,7 @@ class BrowserStackDeviceProvider {
+             capabilities: {
+                 "bstack:options": {
+                     debug: true,
+-                    local: true,
++                    local: process.env.BROWSERSTACK_LOCAL?.toLowerCase() !== 'false',
+                     ...(process.env.BROWSERSTACK_LOCAL_IDENTIFIER ? { localIdentifier: process.env.BROWSERSTACK_LOCAL_IDENTIFIER } : {}),
+                     networkProfile : '4g-lte-advanced-good',
+                     interactiveDebugging: true,
diff --git a/CHANGELOG.md b/CHANGELOG.md
index 03d8790eb2fe..c69c2b55406d 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -7,6 +7,63 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [Unreleased]
 
+## [7.69.0]
+
+### Added
+
+- Add network logo for Tempo mainnet (#26904)
+- Added the "refundTo" param for postQuote transactions, so refunds from Relay will be refunded back to Predict balance (#27065)
+- Added MYX Finance as a second perpetuals provider with provider+network switching UI and validated market data (#26553)
+- Added redesigned Speed up and Cancel transaction modal (#26209)
+- Added max convert bottom sheet for mUSD Quick Convert (#26638)
+- Allow users to select a payment method if their amount is 0 (#26717)
+- Added watchlist tokens to the top of the Perpetuals trending carousel on the homepage with a star badge indicator (#26763)
+- Added a bottom fade overlay to the homepage wallet view indicating scrollable content (#26470)
+- Sets Infura RPC for HyperEVM with Quicknode failover (#25367)
+- Added new toast-style notifications for buy order status updates (processing, completed, failed, cancelled) behind the Unified Buy V2 feature flag (#26670)
+- Added blue claim button to the homepage Predictions section for users with claimable winnings (#26650)
+
+### Changed
+
+- Updated mUSD conversion flow copy to replace boost with bonus (#26453)
+- Removed showing OTA modal when users are on onboarding screen (#26839)
+- Inlined perps "Add funds" flow in the pay-with token filter so the Pay With modal no longer depends on a deposit callback from the parent (#26543)
+- Improved keyboard UX for buy feature (#26776)
+- Improved Ramps buy flow by preventing auto-lock during checkout (#26723)
+- Updated prediction market card design with smaller cards, plain-text percentages, and consistent heights (#26795)
+- Updated ramp provider selection modal UI (#26726)
+- UI updates for the Reveal SRP feature, specifically the Quiz Component and Reveal SRP views (#25388)
+- Disabled the Max button for Predict Withdraw (#27006)
+- Updated mUSD conversion tertiary CTA copy (#26805)
+- Removed "Reset notifications" button from notifications list (#26641)
+- Removed territory field for unified formatting (#26623)
+
+### Fixed
+
+- Refactored Ramp buyability to add batched useTokensBuyability with keyed results and keep useTokenBuyability as a backward-compatible wrapper, reducing redundant legacy token-cache fetches for multi-token checks (#25539)
+- Fixed incorrect error message shown when there is not enough native token to cover gas fees during a withdrawal (#27001)
+- Fixed missing Ramps Button Clicked analytics event when tapping Buy on the homepage token empty state (#27058)
+- Fixed spurious offline/reconnecting toasts on mount and during intentional reconnects (#27034)
+- Fixed the occasional Input placeholder misalignments (#26835)
+- Fixed a quote expired element showing outside of the bridge page (#26729)
+- Fixed missing NFT detection on homepage focus, restoring auto-detection when the user navigates to the homepage (#26919)
+- Fixed cashback option visibility for US users on Card home screen and updated cashback description for Metal Card holders (#26993)
+- Fixed camera permission "allow once" not showing the camera popup on Android (#26415)
+- Fixed a bug where the Receive address in EVM token details showed a Non-EVM address after switching from a Non-EVM network (#26965)
+- Fixed a bug where some swap deeplink token icons did not load because ERC-20 icon URLs used checksummed addresses (#26914)
+- Fixed perps ROE percentage display to show 2 decimal places for improved precision (#26600)
+- Fixed token price display on the token details page to show up to 4 decimal places for precision, and subscript notation for very small prices, consistent with the trending token list (#26894)
+- Fixed Perps section on homepage showing a full-screen error instead of the compact inline error state (#26831)
+- Fixed Buy token selection screen showing "No tokens match" with an empty list on first app load after install or update; screen now shows loading until tokens are ready (#26852)
+- Fixed date of birth formatting on Card onboarding so the displayed date matches the user's selected date in all timezones (#26893)
+- Fixed Unified Buy Build Quote header to use correct typography and icon sizing per design spec (#26713)
+- Fixed Google login crash on Android devices without credential provider dependencies by falling back to browser-based authentication (#26677)
+- Fixed saving network details for custom networks (e.g. added from Popular list) when the Save button had no effect (#27053)
+- Fixed off-center "Buy/Get mUSD" button for primary mUSD conversion CTA (#27015)
+- Fixed network details screen showing a delete (trash) icon for networks that cannot be removed (e.g. Ethereum mainnet, Linea, Goerli, testnets) (#26983)
+- Fixed token hiding not working on the redesigned homepage (#26649)
+- Fixed an issue that could cause repeated Bridge RPC balance calls and improved how quickly source balances appear after token selection (#25952)
+
 ## [7.68.2]
 
 ### Fixed
@@ -10860,7 +10917,8 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - [#957](https://github.com/MetaMask/metamask-mobile/pull/957): fix timeouts (#957)
 - [#954](https://github.com/MetaMask/metamask-mobile/pull/954): Bugfix: onboarding navigation (#954)
 
-[Unreleased]: https://github.com/MetaMask/metamask-mobile/compare/v7.68.2...HEAD
+[Unreleased]: https://github.com/MetaMask/metamask-mobile/compare/v7.69.0...HEAD
+[7.69.0]: https://github.com/MetaMask/metamask-mobile/compare/v7.68.2...v7.69.0
 [7.68.2]: https://github.com/MetaMask/metamask-mobile/compare/v7.68.1...v7.68.2
 [7.68.1]: https://github.com/MetaMask/metamask-mobile/compare/v7.68.0...v7.68.1
 [7.68.0]: https://github.com/MetaMask/metamask-mobile/compare/v7.67.3...v7.68.0
diff --git a/README.md b/README.md
index 76e257c003bc..021cf3379730 100644
--- a/README.md
+++ b/README.md
@@ -20,6 +20,7 @@ To learn how to contribute to the MetaMask codebase, visit our [Contributor Docs
 - [Build Troubleshooting](./docs/readme/troubleshooting.md)
 - [Component View Testing](./docs/readme/component-view-testing.md)
 - [E2E Testing](./docs/readme/e2e-testing.md)
+- [On-Ramp Provider Manual Testing](./tests/docs/ONRAMP-PROVIDER-TESTING.md)
 - [Debugging](./docs/readme/debugging.md)
 - [Performance](./docs/readme/performance.md)
 - [Release Build Profiling](./docs/readme/release-build-profiler.md)
diff --git a/android/app/build.gradle b/android/app/build.gradle
index d82c6660106a..0e6881cc0419 100644
--- a/android/app/build.gradle
+++ b/android/app/build.gradle
@@ -187,8 +187,8 @@ android {
         applicationId "io.metamask"
         minSdkVersion rootProject.ext.minSdkVersion
         targetSdkVersion rootProject.ext.targetSdkVersion
-        versionName "7.68.1"
-        versionCode 4009
+        versionName "7.69.0"
+        versionCode 4015
         testBuildType System.getProperty('testBuildType', 'debug')
         testInstrumentationRunner "androidx.test.runner.AndroidJUnitRunner"
         manifestPlaceholders.MM_BRANCH_KEY_TEST = "$System.env.MM_BRANCH_KEY_TEST"
@@ -197,6 +197,7 @@ android {
 
 	  packagingOptions {
 		  exclude 'META-INF/DEPENDENCIES'
+      exclude 'META-INF/versions/9/OSGI-INF/MANIFEST.MF'
       pickFirst 'lib/x86/libc++_shared.so'
       pickFirst 'lib/x86_64/libc++_shared.so'
       pickFirst 'lib/armeabi-v7a/libc++_shared.so'
diff --git a/app/__mocks__/@myx-trade/sdk.js b/app/__mocks__/@myx-trade/sdk.js
index b382945bd517..75ea74354c60 100644
--- a/app/__mocks__/@myx-trade/sdk.js
+++ b/app/__mocks__/@myx-trade/sdk.js
@@ -13,6 +13,54 @@ class MyxClient {
   }
 }
 
+// SDK enums (mirrored from the real SDK to support adapter tests)
+const Direction = { LONG: 0, SHORT: 1 };
+const DirectionEnum = { Long: 0, Short: 1 };
+const OrderTypeEnum = { Market: 0, Limit: 1, Stop: 2, Conditional: 3 };
+const OperationEnum = { Increase: 0, Decrease: 1 };
+const OrderStatusEnum = { Cancelled: 1, Expired: 2, Successful: 9 };
+const ExecTypeEnum = {
+  Market: 1,
+  Limit: 2,
+  TP: 3,
+  SL: 4,
+  ADL: 5,
+  Liquidation: 6,
+};
+const TradeFlowTypeEnum = {
+  Increase: 0,
+  Decrease: 1,
+  AddMargin: 2,
+  RemoveMargin: 3,
+  CancelOrder: 4,
+  ADL: 5,
+  Liquidation: 6,
+  MarketClose: 7,
+  EarlyClose: 8,
+  AddTPSL: 9,
+  SecurityDeposit: 10,
+  TransferToWallet: 11,
+  MarginAccountDeposit: 12,
+  ReferralReward: 13,
+};
+const TriggerType = { None: 0, TP: 1, SL: 2 };
+const OrderType = { Market: 0, Limit: 1 };
+const OperationType = { Increase: 0, Decrease: 1 };
+const OrderStatus = { Pending: 0, Cancelled: 1, Expired: 2, Filled: 9 };
+const TimeInForce = { IOC: 0 };
+
 module.exports = {
   MyxClient,
+  Direction,
+  DirectionEnum,
+  OrderTypeEnum,
+  OperationEnum,
+  OrderStatusEnum,
+  ExecTypeEnum,
+  TradeFlowTypeEnum,
+  TriggerType,
+  OrderType,
+  OperationType,
+  OrderStatus,
+  TimeInForce,
 };
diff --git a/app/component-library/base-components/TagBase/__snapshots__/TagBase.test.tsx.snap b/app/component-library/base-components/TagBase/__snapshots__/TagBase.test.tsx.snap
index 7700e374528c..398a8f6620a8 100644
--- a/app/component-library/base-components/TagBase/__snapshots__/TagBase.test.tsx.snap
+++ b/app/component-library/base-components/TagBase/__snapshots__/TagBase.test.tsx.snap
@@ -9,10 +9,10 @@ exports[`TagBase should render TagBase 1`] = `
     {
       "alignSelf": "flex-start",
       "backgroundColor": "#ffffff",
-      "borderColor": "#b7bbc8",
+      "borderColor": "#949596",
       "borderRadius": 999,
       "borderWidth": 0,
-      "color": "#121314",
+      "color": "#131416",
       "padding": 16,
       "paddingHorizontal": 8,
       "paddingVertical": 2,
@@ -29,7 +29,7 @@ exports[`TagBase should render TagBase 1`] = `
     }
   >
     <SvgMock
-      color="#121314"
+      color="#131416"
       fill="currentColor"
       height={20}
       name="Add"
@@ -54,7 +54,7 @@ exports[`TagBase should render TagBase 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -75,7 +75,7 @@ exports[`TagBase should render TagBase 1`] = `
       testID="listitem-gap"
     />
     <SvgMock
-      color="#121314"
+      color="#131416"
       fill="currentColor"
       height={20}
       name="Add"
diff --git a/app/component-library/components-temp/ActionListItem/__snapshots__/ActionListItem.test.tsx.snap b/app/component-library/components-temp/ActionListItem/__snapshots__/ActionListItem.test.tsx.snap
index b36768d6dfce..ca4b09b72259 100644
--- a/app/component-library/components-temp/ActionListItem/__snapshots__/ActionListItem.test.tsx.snap
+++ b/app/component-library/components-temp/ActionListItem/__snapshots__/ActionListItem.test.tsx.snap
@@ -90,7 +90,7 @@ exports[`ActionListItem Rendering should render correctly with basic props 1`] =
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Medium",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -108,7 +108,7 @@ exports[`ActionListItem Rendering should render correctly with basic props 1`] =
           style={
             [
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Medium",
                 "fontSize": 14,
                 "fontWeight": 400,
diff --git a/app/component-library/components-temp/ButtonFilter/__snapshots__/ButtonFilter.test.tsx.snap b/app/component-library/components-temp/ButtonFilter/__snapshots__/ButtonFilter.test.tsx.snap
index 9f3959d5a2d2..1515973e1826 100644
--- a/app/component-library/components-temp/ButtonFilter/__snapshots__/ButtonFilter.test.tsx.snap
+++ b/app/component-library/components-temp/ButtonFilter/__snapshots__/ButtonFilter.test.tsx.snap
@@ -38,7 +38,7 @@ exports[`ButtonFilter renders correctly in active state 1`] = `
       {
         "alignItems": "center",
         "alignSelf": "flex-start",
-        "backgroundColor": "#3c4d9d0f",
+        "backgroundColor": "#b4b4b528",
         "borderRadius": 12,
         "columnGap": 8,
         "flexDirection": "row",
@@ -52,7 +52,7 @@ exports[`ButtonFilter renders correctly in active state 1`] = `
       },
       [
         {
-          "backgroundColor": "#121314",
+          "backgroundColor": "#131416",
         },
         undefined,
       ],
@@ -129,7 +129,7 @@ exports[`ButtonFilter renders correctly in inactive state 1`] = `
       {
         "alignItems": "center",
         "alignSelf": "flex-start",
-        "backgroundColor": "#3c4d9d0f",
+        "backgroundColor": "#b4b4b528",
         "borderRadius": 12,
         "columnGap": 8,
         "flexDirection": "row",
@@ -143,7 +143,7 @@ exports[`ButtonFilter renders correctly in inactive state 1`] = `
       },
       [
         {
-          "backgroundColor": "#3c4d9d0f",
+          "backgroundColor": "#b4b4b528",
         },
         undefined,
       ],
@@ -162,7 +162,7 @@ exports[`ButtonFilter renders correctly in inactive state 1`] = `
     style={
       [
         {
-          "color": "#121314",
+          "color": "#131416",
           "flexGrow": 0,
           "flexShrink": 1,
           "flexWrap": "wrap",
diff --git a/app/component-library/components-temp/Buttons/ButtonPill/__snapshots__/ButtonPill.test.tsx.snap b/app/component-library/components-temp/Buttons/ButtonPill/__snapshots__/ButtonPill.test.tsx.snap
index a73623d27abd..79f96a6e0b9d 100644
--- a/app/component-library/components-temp/Buttons/ButtonPill/__snapshots__/ButtonPill.test.tsx.snap
+++ b/app/component-library/components-temp/Buttons/ButtonPill/__snapshots__/ButtonPill.test.tsx.snap
@@ -11,9 +11,9 @@ exports[`ButtonPill should render correctly 1`] = `
   style={
     {
       "alignItems": "center",
-      "backgroundColor": "#f3f5f9",
+      "backgroundColor": "#f3f3f4",
       "borderRadius": 99,
-      "color": "#121314",
+      "color": "#131416",
       "justifyContent": "center",
       "paddingHorizontal": 8,
       "paddingVertical": 4,
diff --git a/app/component-library/components-temp/Buttons/ButtonSemantic/__snapshots__/ButtonSemantic.test.tsx.snap b/app/component-library/components-temp/Buttons/ButtonSemantic/__snapshots__/ButtonSemantic.test.tsx.snap
index 5da7449467cc..df6a92fc2d82 100644
--- a/app/component-library/components-temp/Buttons/ButtonSemantic/__snapshots__/ButtonSemantic.test.tsx.snap
+++ b/app/component-library/components-temp/Buttons/ButtonSemantic/__snapshots__/ButtonSemantic.test.tsx.snap
@@ -38,7 +38,7 @@ exports[`ButtonSemantic Rendering renders with Danger severity 1`] = `
       {
         "alignItems": "center",
         "alignSelf": "flex-start",
-        "backgroundColor": "#3c4d9d0f",
+        "backgroundColor": "#b4b4b528",
         "borderRadius": 12,
         "columnGap": 8,
         "flexDirection": "row",
@@ -129,7 +129,7 @@ exports[`ButtonSemantic Rendering renders with Success severity 1`] = `
       {
         "alignItems": "center",
         "alignSelf": "flex-start",
-        "backgroundColor": "#3c4d9d0f",
+        "backgroundColor": "#b4b4b528",
         "borderRadius": 12,
         "columnGap": 8,
         "flexDirection": "row",
diff --git a/app/component-library/components-temp/Buttons/ButtonToggle/__snapshots__/ButtonToggle.test.tsx.snap b/app/component-library/components-temp/Buttons/ButtonToggle/__snapshots__/ButtonToggle.test.tsx.snap
index 1115ac95ad4f..039de1ded514 100644
--- a/app/component-library/components-temp/Buttons/ButtonToggle/__snapshots__/ButtonToggle.test.tsx.snap
+++ b/app/component-library/components-temp/Buttons/ButtonToggle/__snapshots__/ButtonToggle.test.tsx.snap
@@ -12,7 +12,7 @@ exports[`ButtonToggle renders correctly in active state 1`] = `
     {
       "alignItems": "center",
       "alignSelf": "flex-start",
-      "backgroundColor": "#121314",
+      "backgroundColor": "#131416",
       "borderRadius": 12,
       "flexDirection": "row",
       "height": 40,
@@ -51,7 +51,7 @@ exports[`ButtonToggle renders correctly in inactive state 1`] = `
     {
       "alignItems": "center",
       "alignSelf": "flex-start",
-      "backgroundColor": "#3c4d9d0f",
+      "backgroundColor": "#b4b4b528",
       "borderColor": "transparent",
       "borderRadius": 12,
       "borderWidth": 1,
@@ -67,7 +67,7 @@ exports[`ButtonToggle renders correctly in inactive state 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Medium",
         "fontSize": 16,
         "letterSpacing": 0,
diff --git a/app/component-library/components-temp/CellSelectWithMenu/__snapshots__/CellSelectWithMenu.test.tsx.snap b/app/component-library/components-temp/CellSelectWithMenu/__snapshots__/CellSelectWithMenu.test.tsx.snap
index 8dae6fb31eb5..51d16193cd72 100644
--- a/app/component-library/components-temp/CellSelectWithMenu/__snapshots__/CellSelectWithMenu.test.tsx.snap
+++ b/app/component-library/components-temp/CellSelectWithMenu/__snapshots__/CellSelectWithMenu.test.tsx.snap
@@ -212,7 +212,7 @@ exports[`CellSelectWithMenu should render with default settings correctly 1`] =
               numberOfLines={1}
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -238,7 +238,7 @@ exports[`CellSelectWithMenu should render with default settings correctly 1`] =
                 numberOfLines={1}
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -249,7 +249,7 @@ exports[`CellSelectWithMenu should render with default settings correctly 1`] =
                 0x2990079bcdEe240329a520d2444386FC119da21a
               </Text>
               <SvgMock
-                color="#121314"
+                color="#131416"
                 fill="currentColor"
                 height={10}
                 name="ArrowDown"
@@ -267,7 +267,7 @@ exports[`CellSelectWithMenu should render with default settings correctly 1`] =
             <View
               style={
                 {
-                  "backgroundColor": "#f3f5f9",
+                  "backgroundColor": "#f3f3f4",
                   "borderRadius": 4,
                   "height": 24,
                   "justifyContent": "center",
@@ -281,7 +281,7 @@ exports[`CellSelectWithMenu should render with default settings correctly 1`] =
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Medium",
                     "fontSize": 12,
                     "letterSpacing": 0.25,
@@ -324,7 +324,7 @@ exports[`CellSelectWithMenu should render with default settings correctly 1`] =
       testID="button-menu-select-test-id"
     >
       <SvgMock
-        color="#121314"
+        color="#131416"
         fill="currentColor"
         height={20}
         name="MoreVertical"
diff --git a/app/component-library/components-temp/Contracts/ContractBoxBase/__snapshots__/ContractBoxBase.test.tsx.snap b/app/component-library/components-temp/Contracts/ContractBoxBase/__snapshots__/ContractBoxBase.test.tsx.snap
index dc3722039ca5..e2e24c83c7ce 100644
--- a/app/component-library/components-temp/Contracts/ContractBoxBase/__snapshots__/ContractBoxBase.test.tsx.snap
+++ b/app/component-library/components-temp/Contracts/ContractBoxBase/__snapshots__/ContractBoxBase.test.tsx.snap
@@ -75,7 +75,7 @@ exports[`Component ContractBoxBase should render correctly 1`] = `
       testID="copy-icon"
     >
       <Icon
-        color="#686e7d"
+        color="#66676a"
         name="Copy"
         size="24"
       />
diff --git a/app/component-library/components-temp/CustomSpendCap/CustomInput/__snapshots__/CustomInput.test.tsx.snap b/app/component-library/components-temp/CustomSpendCap/CustomInput/__snapshots__/CustomInput.test.tsx.snap
index b0a1ba1ff21d..311908a5edfe 100644
--- a/app/component-library/components-temp/CustomSpendCap/CustomInput/__snapshots__/CustomInput.test.tsx.snap
+++ b/app/component-library/components-temp/CustomSpendCap/CustomInput/__snapshots__/CustomInput.test.tsx.snap
@@ -33,7 +33,7 @@ exports[`CustomInput should render correctly 1`] = `
       style={
         [
           {
-            "color": "#121314",
+            "color": "#131416",
             "flexGrow": 1,
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
@@ -55,7 +55,7 @@ exports[`CustomInput should render correctly 1`] = `
     onPress={[Function]}
     style={
       {
-        "color": "#686e7d",
+        "color": "#66676a",
       }
     }
     testID="custom-spend-cap-max-test-id"
diff --git a/app/component-library/components-temp/CustomSpendCap/__snapshots__/CustomSpendCap.test.tsx.snap b/app/component-library/components-temp/CustomSpendCap/__snapshots__/CustomSpendCap.test.tsx.snap
index 4a34a506a265..9ea9cb8f3eae 100644
--- a/app/component-library/components-temp/CustomSpendCap/__snapshots__/CustomSpendCap.test.tsx.snap
+++ b/app/component-library/components-temp/CustomSpendCap/__snapshots__/CustomSpendCap.test.tsx.snap
@@ -4,7 +4,7 @@ exports[`CustomSpendCap should match snapshot 1`] = `
 <View
   style={
     {
-      "backgroundColor": "#f3f5f9",
+      "backgroundColor": "#f3f3f4",
       "borderRadius": 8,
       "padding": 16,
     }
@@ -31,7 +31,7 @@ exports[`CustomSpendCap should match snapshot 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Bold",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -97,7 +97,7 @@ exports[`CustomSpendCap should match snapshot 1`] = `
       style={
         {
           "backgroundColor": "transparent",
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -161,7 +161,7 @@ exports[`CustomSpendCap should match snapshot 1`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "flexGrow": 1,
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
@@ -186,7 +186,7 @@ exports[`CustomSpendCap should match snapshot 1`] = `
         onPress={[Function]}
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 14,
             "letterSpacing": 0,
@@ -210,7 +210,7 @@ exports[`CustomSpendCap should match snapshot 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#686e7d",
+          "color": "#66676a",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -229,7 +229,7 @@ exports[`CustomSpendCap should match snapshot 1`] = `
         style={
           {
             "backgroundColor": "transparent",
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
diff --git a/app/component-library/components-temp/HeaderCollapsible/HeaderCollapsible.stories.tsx b/app/component-library/components-temp/HeaderCollapsible/HeaderCollapsible.stories.tsx
deleted file mode 100644
index 9cbe8e4ad462..000000000000
--- a/app/component-library/components-temp/HeaderCollapsible/HeaderCollapsible.stories.tsx
+++ /dev/null
@@ -1,275 +0,0 @@
-/* eslint-disable no-console */
-import React, { useState, useCallback } from 'react';
-import {
-  View,
-  ScrollView,
-  NativeSyntheticEvent,
-  NativeScrollEvent,
-} from 'react-native';
-
-import {
-  Box,
-  Text,
-  TextVariant,
-  IconName,
-} from '@metamask/design-system-react-native';
-import { useTailwind } from '@metamask/design-system-twrnc-preset';
-import { useSharedValue, SharedValue } from 'react-native-reanimated';
-
-import HeaderCollapsible from './HeaderCollapsible';
-import TitleStandard from '../TitleStandard';
-
-const HeaderCollapsibleMeta = {
-  title: 'Components Temp / HeaderCollapsible',
-  component: HeaderCollapsible,
-  argTypes: {
-    title: {
-      control: 'text',
-    },
-    subtitle: {
-      control: 'text',
-    },
-    twClassName: {
-      control: 'text',
-    },
-  },
-};
-
-export default HeaderCollapsibleMeta;
-
-const SampleContent = ({ itemCount = 20 }: { itemCount?: number }) => (
-  <>
-    {Array.from({ length: itemCount }).map((_, index) => (
-      <Box key={index} twClassName="p-4 mb-2 bg-muted rounded-lg mx-4">
-        <Text variant={TextVariant.BodyMd}>Item {index + 1}</Text>
-        <Text variant={TextVariant.BodySm}>
-          This is sample content to demonstrate scrolling behavior.
-        </Text>
-      </Box>
-    ))}
-  </>
-);
-
-interface ScrollableStoryContainerProps {
-  children: (props: {
-    scrollYValue: SharedValue<number>;
-    setExpandedHeight: (h: number) => void;
-  }) => React.ReactNode;
-}
-
-const ScrollableStoryContainer = ({
-  children,
-}: ScrollableStoryContainerProps) => {
-  const tw = useTailwind();
-  const scrollYValue = useSharedValue(0);
-  const [expandedHeight, setExpandedHeight] = useState(140);
-
-  const onScroll = useCallback(
-    (event: NativeSyntheticEvent<NativeScrollEvent>) => {
-      scrollYValue.value = event.nativeEvent.contentOffset.y;
-    },
-    [scrollYValue],
-  );
-
-  return (
-    <View style={tw.style('flex-1 bg-default')}>
-      {children({ scrollYValue, setExpandedHeight })}
-      <ScrollView
-        onScroll={onScroll}
-        scrollEventThrottle={16}
-        contentContainerStyle={{ paddingTop: expandedHeight }}
-        showsVerticalScrollIndicator={false}
-      >
-        <SampleContent />
-      </ScrollView>
-    </View>
-  );
-};
-
-export const Default = {
-  render: () => (
-    <ScrollableStoryContainer>
-      {({ scrollYValue, setExpandedHeight }) => (
-        <HeaderCollapsible
-          title="Send"
-          onBack={() => console.log('Back pressed')}
-          expandedContent={
-            <TitleStandard
-              topLabel="Send"
-              title="$4.42"
-              twClassName="px-4 pt-1 pb-3 "
-            />
-          }
-          scrollY={scrollYValue}
-          onExpandedHeightChange={setExpandedHeight}
-        />
-      )}
-    </ScrollableStoryContainer>
-  ),
-};
-
-export const WithBottomLabel = {
-  render: () => (
-    <ScrollableStoryContainer>
-      {({ scrollYValue, setExpandedHeight }) => (
-        <HeaderCollapsible
-          title="Send"
-          onBack={() => console.log('Back pressed')}
-          expandedContent={
-            <TitleStandard
-              topLabel="Send"
-              title="$4.42"
-              bottomLabel="0.002 ETH"
-              twClassName="px-4 pt-1 pb-3 "
-            />
-          }
-          scrollY={scrollYValue}
-          onExpandedHeightChange={setExpandedHeight}
-        />
-      )}
-    </ScrollableStoryContainer>
-  ),
-};
-
-export const WithSubtitle = {
-  render: () => (
-    <ScrollableStoryContainer>
-      {({ scrollYValue, setExpandedHeight }) => (
-        <HeaderCollapsible
-          title="Send"
-          subtitle="0.002 ETH"
-          onBack={() => console.log('Back pressed')}
-          expandedContent={
-            <TitleStandard
-              topLabel="Send"
-              title="$4.42"
-              twClassName="px-4 pt-1 pb-3 "
-            />
-          }
-          scrollY={scrollYValue}
-          onExpandedHeightChange={setExpandedHeight}
-        />
-      )}
-    </ScrollableStoryContainer>
-  ),
-};
-
-export const OnClose = {
-  render: () => (
-    <ScrollableStoryContainer>
-      {({ scrollYValue, setExpandedHeight }) => (
-        <HeaderCollapsible
-          title="Send"
-          onClose={() => console.log('Close pressed')}
-          expandedContent={
-            <TitleStandard
-              topLabel="Send"
-              title="$4.42"
-              twClassName="px-4 pt-1 pb-3 "
-            />
-          }
-          scrollY={scrollYValue}
-          onExpandedHeightChange={setExpandedHeight}
-        />
-      )}
-    </ScrollableStoryContainer>
-  ),
-};
-
-export const BackAndClose = {
-  render: () => (
-    <ScrollableStoryContainer>
-      {({ scrollYValue, setExpandedHeight }) => (
-        <HeaderCollapsible
-          title="Send"
-          onBack={() => console.log('Back pressed')}
-          onClose={() => console.log('Close pressed')}
-          expandedContent={
-            <TitleStandard
-              topLabel="Send"
-              title="$4.42"
-              twClassName="px-4 pt-1 pb-3 "
-            />
-          }
-          scrollY={scrollYValue}
-          onExpandedHeightChange={setExpandedHeight}
-        />
-      )}
-    </ScrollableStoryContainer>
-  ),
-};
-
-export const EndButtonIconProps = {
-  render: () => (
-    <ScrollableStoryContainer>
-      {({ scrollYValue, setExpandedHeight }) => (
-        <HeaderCollapsible
-          title="Send"
-          onBack={() => console.log('Back pressed')}
-          endButtonIconProps={[
-            {
-              iconName: IconName.Close,
-              onPress: () => console.log('Close pressed'),
-            },
-          ]}
-          expandedContent={
-            <TitleStandard
-              topLabel="Send"
-              title="$4.42"
-              twClassName="px-4 pt-1 pb-3 "
-            />
-          }
-          scrollY={scrollYValue}
-          onExpandedHeightChange={setExpandedHeight}
-        />
-      )}
-    </ScrollableStoryContainer>
-  ),
-};
-
-export const BackButtonProps = {
-  render: () => (
-    <ScrollableStoryContainer>
-      {({ scrollYValue, setExpandedHeight }) => (
-        <HeaderCollapsible
-          title="Receive"
-          backButtonProps={{
-            onPress: () => console.log('Custom back pressed'),
-          }}
-          expandedContent={
-            <TitleStandard
-              topLabel="Receive"
-              title="$1,234.56"
-              twClassName="px-4 pt-1 pb-3 "
-            />
-          }
-          scrollY={scrollYValue}
-          onExpandedHeightChange={setExpandedHeight}
-        />
-      )}
-    </ScrollableStoryContainer>
-  ),
-};
-
-export const CustomExpandedContent = {
-  render: () => (
-    <ScrollableStoryContainer>
-      {({ scrollYValue, setExpandedHeight }) => (
-        <HeaderCollapsible
-          title="Custom"
-          onBack={() => console.log('Back pressed')}
-          expandedContent={
-            <Box twClassName="px-4 py-2">
-              <Text variant={TextVariant.HeadingMd}>Custom Title Section</Text>
-              <Text variant={TextVariant.BodySm}>
-                This is a completely custom expanded content section
-              </Text>
-            </Box>
-          }
-          scrollY={scrollYValue}
-          onExpandedHeightChange={setExpandedHeight}
-        />
-      )}
-    </ScrollableStoryContainer>
-  ),
-};
diff --git a/app/component-library/components-temp/HeaderCollapsible/HeaderCollapsible.test.tsx b/app/component-library/components-temp/HeaderCollapsible/HeaderCollapsible.test.tsx
deleted file mode 100644
index 6217e658c688..000000000000
--- a/app/component-library/components-temp/HeaderCollapsible/HeaderCollapsible.test.tsx
+++ /dev/null
@@ -1,332 +0,0 @@
-// Third party dependencies.
-import React from 'react';
-import { render } from '@testing-library/react-native';
-import { useSharedValue, SharedValue } from 'react-native-reanimated';
-import { Text } from 'react-native';
-
-// External dependencies.
-import { IconName } from '@metamask/design-system-react-native';
-
-// Internal dependencies.
-import HeaderCollapsible from './HeaderCollapsible';
-
-// Mock react-native-reanimated
-jest.mock('react-native-reanimated', () => {
-  const Reanimated = jest.requireActual('react-native-reanimated/mock');
-  Reanimated.useSharedValue = jest.fn((initial) => ({
-    value: initial,
-  }));
-  Reanimated.useAnimatedStyle = jest.fn((fn) => fn());
-  Reanimated.interpolate = jest.fn(
-    (_value, _inputRange, outputRange) => outputRange[0],
-  );
-  Reanimated.Extrapolation = { CLAMP: 'clamp' };
-  return Reanimated;
-});
-
-// Mock react-native-safe-area-context
-jest.mock('react-native-safe-area-context', () => ({
-  useSafeAreaInsets: () => ({ top: 44, bottom: 34, left: 0, right: 0 }),
-}));
-
-// Test wrapper component that provides scrollY
-const TestWrapper: React.FC<{
-  children: (scrollYValue: SharedValue<number>) => React.ReactNode;
-}> = ({ children }) => {
-  const scrollYValue = useSharedValue(0);
-  return <>{children(scrollYValue)}</>;
-};
-
-describe('HeaderCollapsible', () => {
-  beforeEach(() => {
-    jest.clearAllMocks();
-  });
-
-  describe('rendering', () => {
-    it('renders with title', () => {
-      const { getAllByText } = render(
-        <TestWrapper>
-          {(scrollYValue) => (
-            <HeaderCollapsible title="Test Title" scrollY={scrollYValue} />
-          )}
-        </TestWrapper>,
-      );
-
-      expect(getAllByText('Test Title').length).toBeGreaterThan(0);
-    });
-
-    it('renders container with testID when provided', () => {
-      const { getByTestId } = render(
-        <TestWrapper>
-          {(scrollYValue) => (
-            <HeaderCollapsible
-              title="Test"
-              scrollY={scrollYValue}
-              testID="test-container"
-            />
-          )}
-        </TestWrapper>,
-      );
-
-      expect(getByTestId('test-container')).toBeOnTheScreen();
-    });
-  });
-
-  describe('back button', () => {
-    it('renders back button when onBack provided', () => {
-      const { getByTestId } = render(
-        <TestWrapper>
-          {(scrollYValue) => (
-            <HeaderCollapsible
-              title="Test"
-              scrollY={scrollYValue}
-              onBack={jest.fn()}
-              backButtonProps={{ testID: 'test-back-button' }}
-            />
-          )}
-        </TestWrapper>,
-      );
-
-      expect(getByTestId('test-back-button')).toBeOnTheScreen();
-    });
-
-    it('renders back button when backButtonProps provided', () => {
-      const { getByTestId } = render(
-        <TestWrapper>
-          {(scrollYValue) => (
-            <HeaderCollapsible
-              title="Test"
-              scrollY={scrollYValue}
-              backButtonProps={{
-                onPress: jest.fn(),
-                testID: 'test-back-button',
-              }}
-            />
-          )}
-        </TestWrapper>,
-      );
-
-      expect(getByTestId('test-back-button')).toBeOnTheScreen();
-    });
-  });
-
-  describe('close button', () => {
-    it('renders close button when onClose provided', () => {
-      const { getByTestId } = render(
-        <TestWrapper>
-          {(scrollYValue) => (
-            <HeaderCollapsible
-              title="Test"
-              scrollY={scrollYValue}
-              onClose={jest.fn()}
-              closeButtonProps={{ testID: 'test-close-button' }}
-            />
-          )}
-        </TestWrapper>,
-      );
-
-      expect(getByTestId('test-close-button')).toBeOnTheScreen();
-    });
-
-    it('renders close button when closeButtonProps provided', () => {
-      const { getByTestId } = render(
-        <TestWrapper>
-          {(scrollYValue) => (
-            <HeaderCollapsible
-              title="Test"
-              scrollY={scrollYValue}
-              closeButtonProps={{
-                onPress: jest.fn(),
-                testID: 'test-close-button',
-              }}
-            />
-          )}
-        </TestWrapper>,
-      );
-
-      expect(getByTestId('test-close-button')).toBeOnTheScreen();
-    });
-  });
-
-  describe('endButtonIconProps', () => {
-    it('renders endButtonIconProps', () => {
-      const { getByTestId } = render(
-        <TestWrapper>
-          {(scrollYValue) => (
-            <HeaderCollapsible
-              title="Test"
-              scrollY={scrollYValue}
-              endButtonIconProps={[
-                {
-                  iconName: IconName.Close,
-                  onPress: jest.fn(),
-                  testID: 'end-button',
-                },
-              ]}
-            />
-          )}
-        </TestWrapper>,
-      );
-
-      expect(getByTestId('end-button')).toBeOnTheScreen();
-    });
-  });
-
-  describe('isInsideSafeAreaView', () => {
-    it('positions header at top 0 when isInsideSafeAreaView is false', () => {
-      const { getByTestId } = render(
-        <TestWrapper>
-          {(scrollYValue) => (
-            <HeaderCollapsible
-              title="Test"
-              scrollY={scrollYValue}
-              isInsideSafeAreaView={false}
-              testID="test-container"
-            />
-          )}
-        </TestWrapper>,
-      );
-
-      const container = getByTestId('test-container');
-      const flattenedStyle = Array.isArray(container.props.style)
-        ? Object.assign({}, ...container.props.style)
-        : container.props.style;
-
-      expect(flattenedStyle.top).toBe(0);
-    });
-
-    it('positions header at insets.top when isInsideSafeAreaView is true', () => {
-      const { getByTestId } = render(
-        <TestWrapper>
-          {(scrollYValue) => (
-            <HeaderCollapsible
-              title="Test"
-              scrollY={scrollYValue}
-              isInsideSafeAreaView
-              testID="test-container"
-            />
-          )}
-        </TestWrapper>,
-      );
-
-      const container = getByTestId('test-container');
-      const flattenedStyle = Array.isArray(container.props.style)
-        ? Object.assign({}, ...container.props.style)
-        : container.props.style;
-
-      expect(flattenedStyle.top).toBe(44);
-    });
-  });
-
-  describe('expandedContent', () => {
-    it('renders custom expandedContent node', () => {
-      const { getByText } = render(
-        <TestWrapper>
-          {(scrollYValue) => (
-            <HeaderCollapsible
-              title="Test"
-              scrollY={scrollYValue}
-              expandedContent={<Text>Custom Expanded Content</Text>}
-            />
-          )}
-        </TestWrapper>,
-      );
-
-      expect(getByText('Custom Expanded Content')).toBeOnTheScreen();
-    });
-
-    it('does not render expanded content when not provided', () => {
-      const { queryByText } = render(
-        <TestWrapper>
-          {(scrollYValue) => (
-            <HeaderCollapsible title="Test" scrollY={scrollYValue} />
-          )}
-        </TestWrapper>,
-      );
-
-      expect(queryByText('Custom Expanded Content')).toBeNull();
-    });
-  });
-
-  describe('subtitle', () => {
-    it('renders subtitle in compact header when provided', () => {
-      const { getByText } = render(
-        <TestWrapper>
-          {(scrollYValue) => (
-            <HeaderCollapsible
-              title="Test Title"
-              subtitle="Test Subtitle"
-              scrollY={scrollYValue}
-            />
-          )}
-        </TestWrapper>,
-      );
-
-      expect(getByText('Test Subtitle')).toBeOnTheScreen();
-    });
-
-    it('does not render subtitle when not provided', () => {
-      const { queryByText } = render(
-        <TestWrapper>
-          {(scrollYValue) => (
-            <HeaderCollapsible title="Test Title" scrollY={scrollYValue} />
-          )}
-        </TestWrapper>,
-      );
-
-      expect(queryByText('Test Subtitle')).toBeNull();
-    });
-
-    it('renders subtitle with testID when provided via subtitleProps', () => {
-      const { getByTestId } = render(
-        <TestWrapper>
-          {(scrollYValue) => (
-            <HeaderCollapsible
-              title="Test Title"
-              subtitle="Test Subtitle"
-              subtitleProps={{ testID: 'subtitle-test-id' }}
-              scrollY={scrollYValue}
-            />
-          )}
-        </TestWrapper>,
-      );
-
-      expect(getByTestId('subtitle-test-id')).toBeOnTheScreen();
-    });
-  });
-
-  describe('children', () => {
-    it('renders custom children in compact header section', () => {
-      const { getByText } = render(
-        <TestWrapper>
-          {(scrollYValue) => (
-            <HeaderCollapsible title="Test Title" scrollY={scrollYValue}>
-              <Text>Custom Compact Content</Text>
-            </HeaderCollapsible>
-          )}
-        </TestWrapper>,
-      );
-
-      expect(getByText('Custom Compact Content')).toBeOnTheScreen();
-    });
-
-    it('does not render subtitle when children provided', () => {
-      const { getByText, queryByText } = render(
-        <TestWrapper>
-          {(scrollYValue) => (
-            <HeaderCollapsible
-              title="Test Title"
-              subtitle="Test Subtitle"
-              scrollY={scrollYValue}
-            >
-              <Text>Custom Content</Text>
-            </HeaderCollapsible>
-          )}
-        </TestWrapper>,
-      );
-
-      expect(getByText('Custom Content')).toBeOnTheScreen();
-      expect(queryByText('Test Subtitle')).toBeNull();
-    });
-  });
-});
diff --git a/app/component-library/components-temp/HeaderCollapsible/HeaderCollapsible.tsx b/app/component-library/components-temp/HeaderCollapsible/HeaderCollapsible.tsx
deleted file mode 100644
index da54710e7263..000000000000
--- a/app/component-library/components-temp/HeaderCollapsible/HeaderCollapsible.tsx
+++ /dev/null
@@ -1,269 +0,0 @@
-// Third party dependencies.
-import React, { useMemo, useState, useCallback } from 'react';
-import { View, LayoutChangeEvent } from 'react-native';
-import Animated, {
-  useAnimatedStyle,
-  useDerivedValue,
-  interpolate,
-  Extrapolation,
-  useSharedValue,
-  withTiming,
-} from 'react-native-reanimated';
-
-// External dependencies.
-import {
-  Box,
-  BoxAlignItems,
-  Text,
-  TextVariant,
-  TextColor,
-  FontWeight,
-  IconName,
-  ButtonIconProps,
-} from '@metamask/design-system-react-native';
-import { useTailwind } from '@metamask/design-system-twrnc-preset';
-import { useSafeAreaInsets } from 'react-native-safe-area-context';
-
-// Internal dependencies.
-import HeaderBase from '../../components/HeaderBase';
-import { HeaderCollapsibleProps } from './HeaderCollapsible.types';
-
-const DEFAULT_EXPANDED_HEIGHT = 140;
-const DEFAULT_COLLAPSED_HEIGHT = 56;
-
-/**
- * HeaderCollapsible is a collapsing header component that transitions
- * between an expanded state (with custom content) and a compact sticky state (with HeaderBase)
- * based on scroll position.
- *
- * Uses Reanimated for performant scroll-linked animations.
- *
- * @example
- * ```tsx
- * return (
- *   <View style={{ flex: 1 }}>
- *     <HeaderCollapsible
- *       title="Send"
- *       onBack={handleBack}
- *       expandedContent={
- *         <TitleStandard
- *           topLabel="Send"
- *           title="$4.42"
- *         />
- *       }
- *       scrollY={scrollY}
- *     />
- *     <ScrollView
- *       onScroll={onScroll}
- *       scrollEventThrottle={16}
- *       contentContainerStyle={{ paddingTop: expandedHeight }}
- *     >
- *       <Content />
- *     </ScrollView>
- *   </View>
- * );
- * ```
- */
-const HeaderCollapsible: React.FC<HeaderCollapsibleProps> = ({
-  title,
-  titleProps,
-  subtitle,
-  subtitleProps,
-  children,
-  onBack,
-  backButtonProps,
-  onClose,
-  closeButtonProps,
-  expandedContent,
-  scrollTriggerPosition,
-  scrollY,
-  startButtonIconProps,
-  endButtonIconProps,
-  twClassName = '',
-  onExpandedHeightChange,
-  testID,
-  isInsideSafeAreaView = false,
-  ...headerBaseProps
-}) => {
-  const tw = useTailwind();
-  const insets = useSafeAreaInsets();
-
-  // Measure actual content height for dynamic sizing
-  const [measuredHeight, setMeasuredHeight] = useState(DEFAULT_EXPANDED_HEIGHT);
-  const animatedMeasuredHeight = useSharedValue(DEFAULT_EXPANDED_HEIGHT);
-
-  const handleLayout = useCallback(
-    (e: LayoutChangeEvent) => {
-      const { height } = e.nativeEvent.layout;
-      if (height > 0 && height !== measuredHeight) {
-        setMeasuredHeight(height);
-        animatedMeasuredHeight.value = height;
-        onExpandedHeightChange?.(height);
-      }
-    },
-    [measuredHeight, animatedMeasuredHeight, onExpandedHeightChange],
-  );
-
-  // Use scrollTriggerPosition if provided, otherwise use measured height
-  const effectiveScrollTriggerPosition =
-    scrollTriggerPosition ?? measuredHeight;
-
-  // Build startButtonIconProps with back button if onBack or backButtonProps is provided
-  const resolvedStartButtonIconProps = useMemo(() => {
-    if (startButtonIconProps) {
-      return startButtonIconProps;
-    }
-
-    if (onBack || backButtonProps) {
-      const backProps: ButtonIconProps = {
-        iconName: IconName.ArrowLeft,
-        ...(backButtonProps || {}),
-        onPress: backButtonProps?.onPress ?? onBack,
-      };
-      return backProps;
-    }
-
-    return undefined;
-  }, [startButtonIconProps, onBack, backButtonProps]);
-
-  // Build endButtonIconProps with close button if onClose or closeButtonProps is provided
-  const resolvedEndButtonIconProps = useMemo(() => {
-    const props: ButtonIconProps[] = [];
-
-    if (onClose || closeButtonProps) {
-      const closeProps: ButtonIconProps = {
-        iconName: IconName.Close,
-        ...(closeButtonProps || {}),
-        onPress: closeButtonProps?.onPress ?? onClose,
-      };
-      props.push(closeProps);
-    }
-
-    if (endButtonIconProps) {
-      props.push(...endButtonIconProps);
-    }
-
-    return props.length > 0 ? props : undefined;
-  }, [endButtonIconProps, onClose, closeButtonProps]);
-
-  // Animated style for the header container height (uses measured content height)
-  const headerAnimatedStyle = useAnimatedStyle(() => {
-    const height = interpolate(
-      scrollY.value,
-      [0, effectiveScrollTriggerPosition],
-      [animatedMeasuredHeight.value, DEFAULT_COLLAPSED_HEIGHT],
-      Extrapolation.CLAMP,
-    );
-
-    return {
-      height,
-    };
-  });
-
-  // Derived value: triggers timed animation when large content is fully hidden
-  const compactTitleProgress = useDerivedValue(() => {
-    // Use effectiveScrollTriggerPosition to sync with header collapse animation
-    const triggerPosition =
-      effectiveScrollTriggerPosition - DEFAULT_COLLAPSED_HEIGHT;
-    const isFullyHidden = scrollY.value >= triggerPosition;
-
-    // Animate to 1 when hidden, 0 when visible (with timing)
-    return withTiming(isFullyHidden ? 1 : 0, { duration: 150 });
-  });
-
-  // Animated style for the compact title (timed fade up when large content is fully hidden)
-  const compactTitleAnimatedStyle = useAnimatedStyle(() => {
-    const progress = compactTitleProgress.value;
-
-    return {
-      opacity: progress,
-      transform: [{ translateY: (1 - progress) * 8 }], // Fade up from 8px below
-    };
-  });
-
-  // Animated style for the expanded content (moves up behind header, synced 1:1 with scroll)
-  const expandedContentAnimatedStyle = useAnimatedStyle(() => {
-    const expandedContentHeight =
-      animatedMeasuredHeight.value - DEFAULT_COLLAPSED_HEIGHT;
-    // Move up 1:1 with scroll, clamped between 0 and -expandedContentHeight
-    // Math.min(..., 0) prevents moving down on overscroll
-    // Math.max(..., -expandedContentHeight) prevents moving up too far
-    const translateY = Math.min(
-      Math.max(-scrollY.value, -expandedContentHeight),
-      0,
-    );
-
-    return {
-      transform: [{ translateY }],
-    };
-  });
-
-  // Render compact title content
-  // If children is provided, use it; otherwise render default title + subtitle
-  const renderCompactContent = () => {
-    if (children) {
-      return children;
-    }
-    return (
-      <Box alignItems={BoxAlignItems.Center}>
-        <Text
-          variant={TextVariant.BodyMd}
-          fontWeight={FontWeight.Bold}
-          numberOfLines={1}
-          {...titleProps}
-        >
-          {title}
-        </Text>
-        {subtitle && (
-          <Text
-            variant={TextVariant.BodySm}
-            color={TextColor.TextAlternative}
-            numberOfLines={1}
-            {...subtitleProps}
-            twClassName={`-mt-0.5 ${subtitleProps?.twClassName}`.trim()}
-          >
-            {subtitle}
-          </Text>
-        )}
-      </Box>
-    );
-  };
-
-  const containerStyle = useMemo(
-    () => [
-      tw.style('absolute left-0 right-0 z-10'),
-      { top: isInsideSafeAreaView ? insets.top : 0 },
-      headerAnimatedStyle,
-    ],
-    [tw, isInsideSafeAreaView, insets.top, headerAnimatedStyle],
-  );
-
-  return (
-    <Animated.View style={containerStyle} testID={testID}>
-      {/* Header content - measured for dynamic height */}
-      <View onLayout={handleLayout}>
-        {/* HeaderBase with compact title */}
-        <HeaderBase
-          startButtonIconProps={resolvedStartButtonIconProps}
-          endButtonIconProps={resolvedEndButtonIconProps}
-          {...headerBaseProps}
-          twClassName={`${twClassName} bg-default px-2`.trim()}
-        >
-          {/* Compact title - fades in when collapsed */}
-          <Animated.View style={compactTitleAnimatedStyle}>
-            {renderCompactContent()}
-          </Animated.View>
-        </HeaderBase>
-
-        {/* Expanded content - clips as it moves up behind header */}
-        <Box twClassName="overflow-hidden">
-          <Animated.View style={expandedContentAnimatedStyle}>
-            {expandedContent}
-          </Animated.View>
-        </Box>
-      </View>
-    </Animated.View>
-  );
-};
-
-export default HeaderCollapsible;
diff --git a/app/component-library/components-temp/HeaderCollapsible/HeaderCollapsible.types.ts b/app/component-library/components-temp/HeaderCollapsible/HeaderCollapsible.types.ts
deleted file mode 100644
index 1f0f07c8cf48..000000000000
--- a/app/component-library/components-temp/HeaderCollapsible/HeaderCollapsible.types.ts
+++ /dev/null
@@ -1,131 +0,0 @@
-// Third party dependencies.
-import { ReactNode } from 'react';
-import { SharedValue } from 'react-native-reanimated';
-
-// External dependencies.
-import {
-  ButtonIconProps,
-  TextProps,
-} from '@metamask/design-system-react-native';
-
-// Internal dependencies.
-import { HeaderBaseProps } from '../../components/HeaderBase';
-
-/**
- * Props for the HeaderCollapsible component.
- */
-export interface HeaderCollapsibleProps extends HeaderBaseProps {
-  /**
-   * Title text displayed in the compact header state.
-   */
-  title: string;
-  /**
-   * Additional props to pass to the title Text component in the compact header.
-   * Props are spread to the Text component and can override default values.
-   */
-  titleProps?: Partial<TextProps>;
-  /**
-   * Subtitle text to display below the title in the compact header.
-   * Rendered with TextVariant.BodySm and TextColor.TextAlternative by default.
-   */
-  subtitle?: string;
-  /**
-   * Additional props to pass to the subtitle Text component.
-   * Props are spread to the Text component and can override default values.
-   */
-  subtitleProps?: Partial<TextProps>;
-  /**
-   * Callback when the back button is pressed.
-   * If provided, a back button will be rendered as startAccessory.
-   */
-  onBack?: () => void;
-  /**
-   * Additional props to pass to the back ButtonIcon.
-   * If provided, a back button will be rendered with these props spread.
-   */
-  backButtonProps?: Omit<ButtonIconProps, 'iconName'>;
-  /**
-   * Callback when the close button is pressed.
-   * If provided, a close button will be added to endButtonIconProps.
-   */
-  onClose?: () => void;
-  /**
-   * Additional props to pass to the close ButtonIcon.
-   * If provided, a close button will be added to endButtonIconProps with these props spread.
-   */
-  closeButtonProps?: Omit<ButtonIconProps, 'iconName'>;
-  /**
-   * Custom node to render in the expanded content section.
-   * This content is displayed when the header is expanded and collapses as the user scrolls.
-   */
-  expandedContent?: ReactNode;
-  /**
-   * Scroll position (in pixels) at which the header fully collapses.
-   * @default measured content height
-   */
-  scrollTriggerPosition?: number;
-  /**
-   * Reanimated shared value tracking scroll position.
-   */
-  scrollY: SharedValue<number>;
-  /**
-   * Callback fired when the expanded height is measured.
-   * Use this to update ScrollView's contentContainerStyle paddingTop.
-   */
-  onExpandedHeightChange?: (height: number) => void;
-  /**
-   * Whether the header is inside a SafeAreaView.
-   * When true, positions the header at the safe area boundary instead of top-0.
-   * @default false
-   */
-  isInsideSafeAreaView?: boolean;
-}
-
-/**
- * Options for the useHeaderCollapsible hook.
- */
-export interface UseHeaderCollapsibleOptions {
-  /**
-   * Height of the header in its expanded (large) state.
-   * @default 140
-   */
-  expandedHeight?: number;
-  /**
-   * Scroll position at which the header fully collapses.
-   * @default expandedHeight
-   */
-  scrollTriggerPosition?: number;
-}
-
-/**
- * Return type for the useHeaderCollapsible hook.
- */
-export interface UseHeaderCollapsibleReturn {
-  /**
-   * Scroll handler to attach to ScrollView's onScroll prop.
-   */
-  onScroll: (
-    event: import('react-native').NativeSyntheticEvent<
-      import('react-native').NativeScrollEvent
-    >,
-  ) => void;
-  /**
-   * Shared value tracking current scroll position.
-   */
-  scrollY: SharedValue<number>;
-  /**
-   * Expanded header height for initial padding.
-   * Use this for ScrollView's contentContainerStyle paddingTop.
-   */
-  expandedHeight: number;
-  /**
-   * Function to update the expanded height when content is measured.
-   * Pass this to HeaderCollapsible's onExpandedHeightChange prop.
-   */
-  setExpandedHeight: (height: number) => void;
-  /**
-   * The scroll position at which the header fully collapses.
-   * Defaults to expandedHeight if not provided.
-   */
-  scrollTriggerPosition: number;
-}
diff --git a/app/component-library/components-temp/HeaderCollapsible/index.ts b/app/component-library/components-temp/HeaderCollapsible/index.ts
deleted file mode 100644
index 98b53796f121..000000000000
--- a/app/component-library/components-temp/HeaderCollapsible/index.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-export { default } from './HeaderCollapsible';
-export { default as useHeaderCollapsible } from './useHeaderCollapsible';
-export type {
-  HeaderCollapsibleProps,
-  UseHeaderCollapsibleOptions,
-  UseHeaderCollapsibleReturn,
-} from './HeaderCollapsible.types';
diff --git a/app/component-library/components-temp/HeaderCollapsible/useHeaderCollapsible.ts b/app/component-library/components-temp/HeaderCollapsible/useHeaderCollapsible.ts
deleted file mode 100644
index 6672a9463a28..000000000000
--- a/app/component-library/components-temp/HeaderCollapsible/useHeaderCollapsible.ts
+++ /dev/null
@@ -1,72 +0,0 @@
-// Third party dependencies.
-import { useCallback, useState } from 'react';
-import { NativeSyntheticEvent, NativeScrollEvent } from 'react-native';
-import { useSharedValue } from 'react-native-reanimated';
-
-// Internal dependencies.
-import {
-  UseHeaderCollapsibleOptions,
-  UseHeaderCollapsibleReturn,
-} from './HeaderCollapsible.types';
-
-/**
- * Hook for managing HeaderCollapsible scroll-linked animations.
- *
- * @param options - Configuration options for the hook.
- * @returns Object containing scroll handler, scrollY value, and header heights.
- *
- * @example
- * ```tsx
- * const { onScroll, scrollY, expandedHeight, setExpandedHeight } = useHeaderCollapsible();
- *
- * return (
- *   <View>
- *     <HeaderCollapsible
- *       scrollY={scrollY}
- *       title="Notes"
- *       onBack={handleBack}
- *       onExpandedHeightChange={setExpandedHeight}
- *     />
- *     <ScrollView
- *       onScroll={onScroll}
- *       scrollEventThrottle={16}
- *       contentContainerStyle={{ paddingTop: expandedHeight }}
- *     >
- *       <Content />
- *     </ScrollView>
- *   </View>
- * );
- * ```
- */
-const useHeaderCollapsible = (
-  options: UseHeaderCollapsibleOptions = {},
-): UseHeaderCollapsibleReturn => {
-  const { expandedHeight: initialExpandedHeight = 140, scrollTriggerPosition } =
-    options;
-
-  // Track expanded height - can be updated by component via onExpandedHeightChange
-  const [expandedHeight, setExpandedHeight] = useState(initialExpandedHeight);
-
-  // Default scrollTriggerPosition to expandedHeight if not provided
-  const effectiveScrollTriggerPosition =
-    scrollTriggerPosition ?? expandedHeight;
-
-  const scrollYValue = useSharedValue(0);
-
-  const onScroll = useCallback(
-    (scrollEvent: NativeSyntheticEvent<NativeScrollEvent>) => {
-      scrollYValue.value = scrollEvent.nativeEvent.contentOffset.y;
-    },
-    [scrollYValue],
-  );
-
-  return {
-    onScroll,
-    scrollY: scrollYValue,
-    expandedHeight,
-    setExpandedHeight,
-    scrollTriggerPosition: effectiveScrollTriggerPosition,
-  };
-};
-
-export default useHeaderCollapsible;
diff --git a/app/component-library/components-temp/HeaderCollapsibleStandard/HeaderCollapsibleStandard.stories.tsx b/app/component-library/components-temp/HeaderCollapsibleStandard/HeaderCollapsibleStandard.stories.tsx
deleted file mode 100644
index da0e0b7c4212..000000000000
--- a/app/component-library/components-temp/HeaderCollapsibleStandard/HeaderCollapsibleStandard.stories.tsx
+++ /dev/null
@@ -1,232 +0,0 @@
-/* eslint-disable no-console */
-import React, { useState, useCallback } from 'react';
-import {
-  View,
-  ScrollView,
-  NativeSyntheticEvent,
-  NativeScrollEvent,
-} from 'react-native';
-
-import {
-  Box,
-  Text,
-  TextVariant,
-  IconName,
-} from '@metamask/design-system-react-native';
-import { useTailwind } from '@metamask/design-system-twrnc-preset';
-import { useSharedValue, SharedValue } from 'react-native-reanimated';
-
-import HeaderCollapsibleStandard from './HeaderCollapsibleStandard';
-
-const HeaderCollapsibleStandardMeta = {
-  title: 'Components Temp / HeaderCollapsibleStandard',
-  component: HeaderCollapsibleStandard,
-  argTypes: {
-    title: {
-      control: 'text',
-    },
-    subtitle: {
-      control: 'text',
-    },
-    twClassName: {
-      control: 'text',
-    },
-  },
-};
-
-export default HeaderCollapsibleStandardMeta;
-
-const SampleContent = ({ itemCount = 20 }: { itemCount?: number }) => (
-  <>
-    {Array.from({ length: itemCount }).map((_, index) => (
-      <Box key={index} twClassName="p-4 mb-2 bg-muted rounded-lg mx-4">
-        <Text variant={TextVariant.BodyMd}>Item {index + 1}</Text>
-        <Text variant={TextVariant.BodySm}>
-          This is sample content to demonstrate scrolling behavior.
-        </Text>
-      </Box>
-    ))}
-  </>
-);
-
-interface ScrollableStoryContainerProps {
-  children: (props: {
-    scrollYValue: SharedValue<number>;
-    setExpandedHeight: (h: number) => void;
-  }) => React.ReactNode;
-}
-
-const ScrollableStoryContainer = ({
-  children,
-}: ScrollableStoryContainerProps) => {
-  const tw = useTailwind();
-  const scrollYValue = useSharedValue(0);
-  const [expandedHeight, setExpandedHeight] = useState(140);
-
-  const onScroll = useCallback(
-    (event: NativeSyntheticEvent<NativeScrollEvent>) => {
-      scrollYValue.value = event.nativeEvent.contentOffset.y;
-    },
-    [scrollYValue],
-  );
-
-  return (
-    <View style={tw.style('flex-1 bg-default')}>
-      {children({ scrollYValue, setExpandedHeight })}
-      <ScrollView
-        onScroll={onScroll}
-        scrollEventThrottle={16}
-        contentContainerStyle={{ paddingTop: expandedHeight }}
-        showsVerticalScrollIndicator={false}
-      >
-        <SampleContent />
-      </ScrollView>
-    </View>
-  );
-};
-
-export const Default = {
-  render: () => (
-    <ScrollableStoryContainer>
-      {({ scrollYValue, setExpandedHeight }) => (
-        <HeaderCollapsibleStandard
-          title="Send"
-          onBack={() => console.log('Back pressed')}
-          titleStandardProps={{
-            topLabel: 'Send',
-            title: '$4.42',
-          }}
-          scrollY={scrollYValue}
-          onExpandedHeightChange={setExpandedHeight}
-        />
-      )}
-    </ScrollableStoryContainer>
-  ),
-};
-
-export const WithBottomLabel = {
-  render: () => (
-    <ScrollableStoryContainer>
-      {({ scrollYValue, setExpandedHeight }) => (
-        <HeaderCollapsibleStandard
-          title="Send"
-          onBack={() => console.log('Back pressed')}
-          titleStandardProps={{
-            topLabel: 'Send',
-            title: '$4.42',
-            bottomLabel: '0.002 ETH',
-          }}
-          scrollY={scrollYValue}
-          onExpandedHeightChange={setExpandedHeight}
-        />
-      )}
-    </ScrollableStoryContainer>
-  ),
-};
-
-export const WithSubtitle = {
-  render: () => (
-    <ScrollableStoryContainer>
-      {({ scrollYValue, setExpandedHeight }) => (
-        <HeaderCollapsibleStandard
-          title="Send"
-          subtitle="0.002 ETH"
-          onBack={() => console.log('Back pressed')}
-          titleStandardProps={{
-            topLabel: 'Send',
-            title: '$4.42',
-          }}
-          scrollY={scrollYValue}
-          onExpandedHeightChange={setExpandedHeight}
-        />
-      )}
-    </ScrollableStoryContainer>
-  ),
-};
-
-export const OnClose = {
-  render: () => (
-    <ScrollableStoryContainer>
-      {({ scrollYValue, setExpandedHeight }) => (
-        <HeaderCollapsibleStandard
-          title="Send"
-          onClose={() => console.log('Close pressed')}
-          titleStandardProps={{
-            topLabel: 'Send',
-            title: '$4.42',
-          }}
-          scrollY={scrollYValue}
-          onExpandedHeightChange={setExpandedHeight}
-        />
-      )}
-    </ScrollableStoryContainer>
-  ),
-};
-
-export const BackAndClose = {
-  render: () => (
-    <ScrollableStoryContainer>
-      {({ scrollYValue, setExpandedHeight }) => (
-        <HeaderCollapsibleStandard
-          title="Send"
-          onBack={() => console.log('Back pressed')}
-          onClose={() => console.log('Close pressed')}
-          titleStandardProps={{
-            topLabel: 'Send',
-            title: '$4.42',
-          }}
-          scrollY={scrollYValue}
-          onExpandedHeightChange={setExpandedHeight}
-        />
-      )}
-    </ScrollableStoryContainer>
-  ),
-};
-
-export const EndButtonIconProps = {
-  render: () => (
-    <ScrollableStoryContainer>
-      {({ scrollYValue, setExpandedHeight }) => (
-        <HeaderCollapsibleStandard
-          title="Send"
-          onBack={() => console.log('Back pressed')}
-          endButtonIconProps={[
-            {
-              iconName: IconName.Close,
-              onPress: () => console.log('Close pressed'),
-            },
-          ]}
-          titleStandardProps={{
-            topLabel: 'Send',
-            title: '$4.42',
-          }}
-          scrollY={scrollYValue}
-          onExpandedHeightChange={setExpandedHeight}
-        />
-      )}
-    </ScrollableStoryContainer>
-  ),
-};
-
-export const CustomTitleStandard = {
-  render: () => (
-    <ScrollableStoryContainer>
-      {({ scrollYValue, setExpandedHeight }) => (
-        <HeaderCollapsibleStandard
-          title="Custom"
-          onBack={() => console.log('Back pressed')}
-          titleStandard={
-            <Box twClassName="px-4 py-2">
-              <Text variant={TextVariant.HeadingMd}>Custom Title Section</Text>
-              <Text variant={TextVariant.BodySm}>
-                This is a completely custom expanded content section
-              </Text>
-            </Box>
-          }
-          scrollY={scrollYValue}
-          onExpandedHeightChange={setExpandedHeight}
-        />
-      )}
-    </ScrollableStoryContainer>
-  ),
-};
diff --git a/app/component-library/components-temp/HeaderCollapsibleStandard/HeaderCollapsibleStandard.test.tsx b/app/component-library/components-temp/HeaderCollapsibleStandard/HeaderCollapsibleStandard.test.tsx
deleted file mode 100644
index 67c61c3f3256..000000000000
--- a/app/component-library/components-temp/HeaderCollapsibleStandard/HeaderCollapsibleStandard.test.tsx
+++ /dev/null
@@ -1,339 +0,0 @@
-// Third party dependencies.
-import React from 'react';
-import { render, fireEvent } from '@testing-library/react-native';
-import { useSharedValue, SharedValue } from 'react-native-reanimated';
-import { Text, IconName } from '@metamask/design-system-react-native';
-
-// Internal dependencies.
-import HeaderCollapsibleStandard from './HeaderCollapsibleStandard';
-
-// Mock react-native-reanimated
-jest.mock('react-native-reanimated', () => {
-  const Reanimated = jest.requireActual('react-native-reanimated/mock');
-  Reanimated.useSharedValue = jest.fn((initial) => ({
-    value: initial,
-  }));
-  Reanimated.useAnimatedStyle = jest.fn((fn) => fn());
-  Reanimated.interpolate = jest.fn(
-    (_value, _inputRange, outputRange) => outputRange[0],
-  );
-  Reanimated.Extrapolation = { CLAMP: 'clamp' };
-  return Reanimated;
-});
-
-// Mock react-native-safe-area-context
-jest.mock('react-native-safe-area-context', () => ({
-  useSafeAreaInsets: () => ({ top: 44, bottom: 34, left: 0, right: 0 }),
-}));
-
-const TEST_IDS = {
-  CONTAINER: 'header-collapsible-standard-container',
-  TITLE_SECTION: 'header-collapsible-standard-title-section',
-  BACK_BUTTON: 'header-collapsible-standard-back-button',
-  CLOSE_BUTTON: 'header-collapsible-standard-close-button',
-  HEADER_BASE_END_ACCESSORY: 'header-base-end-accessory',
-};
-
-// Test wrapper component that provides scrollY
-const TestWrapper: React.FC<{
-  children: (scrollYValue: SharedValue<number>) => React.ReactNode;
-}> = ({ children }) => {
-  const scrollYValue = useSharedValue(0);
-  return <>{children(scrollYValue)}</>;
-};
-
-describe('HeaderCollapsibleStandard', () => {
-  beforeEach(() => {
-    jest.clearAllMocks();
-  });
-
-  describe('rendering', () => {
-    it('renders container with correct testID', () => {
-      const { getByTestId } = render(
-        <TestWrapper>
-          {(scrollYValue) => (
-            <HeaderCollapsibleStandard
-              title="Test"
-              scrollY={scrollYValue}
-              testID={TEST_IDS.CONTAINER}
-              titleStandardProps={{ title: 'Test' }}
-            />
-          )}
-        </TestWrapper>,
-      );
-
-      expect(getByTestId(TEST_IDS.CONTAINER)).toBeOnTheScreen();
-    });
-
-    it('renders TitleStandard with props when titleStandardProps provided', () => {
-      const { getByText, getByTestId } = render(
-        <TestWrapper>
-          {(scrollYValue) => (
-            <HeaderCollapsibleStandard
-              title="Test"
-              scrollY={scrollYValue}
-              titleStandardProps={{
-                topLabel: 'Send',
-                title: '$4.42',
-                testID: TEST_IDS.TITLE_SECTION,
-              }}
-            />
-          )}
-        </TestWrapper>,
-      );
-
-      expect(getByText('Send')).toBeOnTheScreen();
-      expect(getByText('$4.42')).toBeOnTheScreen();
-      expect(getByTestId(TEST_IDS.TITLE_SECTION)).toBeOnTheScreen();
-    });
-
-    it('renders custom titleStandard node when provided', () => {
-      const { getByText } = render(
-        <TestWrapper>
-          {(scrollYValue) => (
-            <HeaderCollapsibleStandard
-              title="Test"
-              scrollY={scrollYValue}
-              titleStandard={<Text>Custom Title Section</Text>}
-            />
-          )}
-        </TestWrapper>,
-      );
-
-      expect(getByText('Custom Title Section')).toBeOnTheScreen();
-    });
-
-    it('titleStandard takes priority over titleStandardProps', () => {
-      const { getByText, queryByText } = render(
-        <TestWrapper>
-          {(scrollYValue) => (
-            <HeaderCollapsibleStandard
-              title="Test"
-              scrollY={scrollYValue}
-              titleStandard={<Text>Custom Node</Text>}
-              titleStandardProps={{ title: 'Props Title' }}
-            />
-          )}
-        </TestWrapper>,
-      );
-
-      expect(getByText('Custom Node')).toBeOnTheScreen();
-      expect(queryByText('Props Title')).toBeNull();
-    });
-
-    it('passes testID from titleStandardProps to TitleStandard', () => {
-      const { getByTestId } = render(
-        <TestWrapper>
-          {(scrollYValue) => (
-            <HeaderCollapsibleStandard
-              title="Test"
-              scrollY={scrollYValue}
-              titleStandardProps={{
-                title: '$4.42',
-                testID: TEST_IDS.TITLE_SECTION,
-              }}
-            />
-          )}
-        </TestWrapper>,
-      );
-
-      expect(getByTestId(TEST_IDS.TITLE_SECTION)).toBeOnTheScreen();
-    });
-  });
-
-  describe('back button', () => {
-    it('renders back button when onBack provided', () => {
-      const { getByTestId } = render(
-        <TestWrapper>
-          {(scrollYValue) => (
-            <HeaderCollapsibleStandard
-              title="Test"
-              scrollY={scrollYValue}
-              onBack={jest.fn()}
-              backButtonProps={{ testID: TEST_IDS.BACK_BUTTON }}
-              titleStandardProps={{ title: 'Test' }}
-            />
-          )}
-        </TestWrapper>,
-      );
-
-      expect(getByTestId(TEST_IDS.BACK_BUTTON)).toBeOnTheScreen();
-    });
-
-    it('renders back button when backButtonProps provided', () => {
-      const { getByTestId } = render(
-        <TestWrapper>
-          {(scrollYValue) => (
-            <HeaderCollapsibleStandard
-              title="Test"
-              scrollY={scrollYValue}
-              backButtonProps={{
-                onPress: jest.fn(),
-                testID: TEST_IDS.BACK_BUTTON,
-              }}
-              titleStandardProps={{ title: 'Test' }}
-            />
-          )}
-        </TestWrapper>,
-      );
-
-      expect(getByTestId(TEST_IDS.BACK_BUTTON)).toBeOnTheScreen();
-    });
-
-    it('calls onBack when back button pressed', () => {
-      const onBack = jest.fn();
-      const { getByTestId } = render(
-        <TestWrapper>
-          {(scrollYValue) => (
-            <HeaderCollapsibleStandard
-              title="Test"
-              scrollY={scrollYValue}
-              onBack={onBack}
-              backButtonProps={{ testID: TEST_IDS.BACK_BUTTON }}
-              titleStandardProps={{ title: 'Test' }}
-            />
-          )}
-        </TestWrapper>,
-      );
-
-      fireEvent.press(getByTestId(TEST_IDS.BACK_BUTTON));
-
-      expect(onBack).toHaveBeenCalledTimes(1);
-    });
-
-    it('backButtonProps.onPress takes priority over onBack', () => {
-      const onBack = jest.fn();
-      const onPress = jest.fn();
-      const { getByTestId } = render(
-        <TestWrapper>
-          {(scrollYValue) => (
-            <HeaderCollapsibleStandard
-              title="Test"
-              scrollY={scrollYValue}
-              onBack={onBack}
-              backButtonProps={{ onPress, testID: TEST_IDS.BACK_BUTTON }}
-              titleStandardProps={{ title: 'Test' }}
-            />
-          )}
-        </TestWrapper>,
-      );
-
-      fireEvent.press(getByTestId(TEST_IDS.BACK_BUTTON));
-
-      expect(onPress).toHaveBeenCalledTimes(1);
-      expect(onBack).not.toHaveBeenCalled();
-    });
-  });
-
-  describe('close button', () => {
-    it('renders close button when onClose provided', () => {
-      const { getByTestId } = render(
-        <TestWrapper>
-          {(scrollYValue) => (
-            <HeaderCollapsibleStandard
-              title="Test"
-              scrollY={scrollYValue}
-              onClose={jest.fn()}
-              closeButtonProps={{ testID: TEST_IDS.CLOSE_BUTTON }}
-              titleStandardProps={{ title: 'Test' }}
-            />
-          )}
-        </TestWrapper>,
-      );
-
-      expect(getByTestId(TEST_IDS.CLOSE_BUTTON)).toBeOnTheScreen();
-    });
-
-    it('calls onClose when close button pressed', () => {
-      const onClose = jest.fn();
-      const { getByTestId } = render(
-        <TestWrapper>
-          {(scrollYValue) => (
-            <HeaderCollapsibleStandard
-              title="Test"
-              scrollY={scrollYValue}
-              onClose={onClose}
-              closeButtonProps={{ testID: TEST_IDS.CLOSE_BUTTON }}
-              titleStandardProps={{ title: 'Test' }}
-            />
-          )}
-        </TestWrapper>,
-      );
-
-      fireEvent.press(getByTestId(TEST_IDS.CLOSE_BUTTON));
-
-      expect(onClose).toHaveBeenCalledTimes(1);
-    });
-
-    it('closeButtonProps.onPress takes priority over onClose', () => {
-      const onClose = jest.fn();
-      const onPress = jest.fn();
-      const { getByTestId } = render(
-        <TestWrapper>
-          {(scrollYValue) => (
-            <HeaderCollapsibleStandard
-              title="Test"
-              scrollY={scrollYValue}
-              onClose={onClose}
-              closeButtonProps={{ onPress, testID: TEST_IDS.CLOSE_BUTTON }}
-              titleStandardProps={{ title: 'Test' }}
-            />
-          )}
-        </TestWrapper>,
-      );
-
-      fireEvent.press(getByTestId(TEST_IDS.CLOSE_BUTTON));
-
-      expect(onPress).toHaveBeenCalledTimes(1);
-      expect(onClose).not.toHaveBeenCalled();
-    });
-  });
-
-  describe('props forwarding', () => {
-    it('forwards endButtonIconProps to HeaderBase', () => {
-      const { getByTestId } = render(
-        <TestWrapper>
-          {(scrollYValue) => (
-            <HeaderCollapsibleStandard
-              title="Test"
-              scrollY={scrollYValue}
-              onBack={jest.fn()}
-              endButtonIconProps={[
-                {
-                  iconName: IconName.Close,
-                  onPress: jest.fn(),
-                  testID: TEST_IDS.HEADER_BASE_END_ACCESSORY,
-                },
-              ]}
-              titleStandardProps={{ title: 'Test' }}
-            />
-          )}
-        </TestWrapper>,
-      );
-
-      expect(getByTestId(TEST_IDS.HEADER_BASE_END_ACCESSORY)).toBeOnTheScreen();
-    });
-
-    it('forwards startButtonIconProps directly when provided', () => {
-      const onPress = jest.fn();
-      const { getByTestId } = render(
-        <TestWrapper>
-          {(scrollYValue) => (
-            <HeaderCollapsibleStandard
-              title="Test"
-              scrollY={scrollYValue}
-              startButtonIconProps={{
-                iconName: IconName.Menu,
-                onPress,
-                testID: 'custom-start-button',
-              }}
-              titleStandardProps={{ title: 'Test' }}
-            />
-          )}
-        </TestWrapper>,
-      );
-
-      expect(getByTestId('custom-start-button')).toBeOnTheScreen();
-    });
-  });
-});
diff --git a/app/component-library/components-temp/HeaderCollapsibleStandard/HeaderCollapsibleStandard.tsx b/app/component-library/components-temp/HeaderCollapsibleStandard/HeaderCollapsibleStandard.tsx
deleted file mode 100644
index 523a2701eb5c..000000000000
--- a/app/component-library/components-temp/HeaderCollapsibleStandard/HeaderCollapsibleStandard.tsx
+++ /dev/null
@@ -1,66 +0,0 @@
-// Third party dependencies.
-import React from 'react';
-
-// Internal dependencies.
-import HeaderCollapsible from '../HeaderCollapsible';
-import TitleStandard from '../TitleStandard';
-import { HeaderCollapsibleStandardProps } from './HeaderCollapsibleStandard.types';
-
-/**
- * HeaderCollapsibleStandard is a collapsing header component that combines
- * HeaderCollapsible with TitleStandard as the expanded content.
- *
- * @example
- * ```tsx
- * const { onScroll, scrollY, expandedHeight, setExpandedHeight } = useHeaderCollapsible();
- *
- * return (
- *   <View style={{ flex: 1 }}>
- *     <HeaderCollapsibleStandard
- *       title="Send"
- *       onBack={handleBack}
- *       titleStandardProps={{
- *         topLabel: "Send",
- *         title: "$4.42",
- *       }}
- *       scrollY={scrollY}
- *       onExpandedHeightChange={setExpandedHeight}
- *     />
- *     <ScrollView
- *       onScroll={onScroll}
- *       scrollEventThrottle={16}
- *       contentContainerStyle={{ paddingTop: expandedHeight }}
- *     >
- *       <Content />
- *     </ScrollView>
- *   </View>
- * );
- * ```
- */
-const HeaderCollapsibleStandard: React.FC<HeaderCollapsibleStandardProps> = ({
-  titleStandard,
-  titleStandardProps,
-  ...props
-}) => {
-  // Render title section content
-  const renderExpandedContent = () => {
-    if (titleStandard) {
-      return titleStandard;
-    }
-    if (titleStandardProps) {
-      return (
-        <TitleStandard
-          {...titleStandardProps}
-          twClassName={`px-4 pt-1 pb-3 ${titleStandardProps?.twClassName ?? ''}`.trim()}
-        />
-      );
-    }
-    return null;
-  };
-
-  return (
-    <HeaderCollapsible {...props} expandedContent={renderExpandedContent()} />
-  );
-};
-
-export default HeaderCollapsibleStandard;
diff --git a/app/component-library/components-temp/HeaderCollapsibleStandard/HeaderCollapsibleStandard.types.ts b/app/component-library/components-temp/HeaderCollapsibleStandard/HeaderCollapsibleStandard.types.ts
deleted file mode 100644
index a51cf70ea3b9..000000000000
--- a/app/component-library/components-temp/HeaderCollapsibleStandard/HeaderCollapsibleStandard.types.ts
+++ /dev/null
@@ -1,23 +0,0 @@
-// Third party dependencies.
-import { ReactNode } from 'react';
-
-// Internal dependencies.
-import { HeaderCollapsibleProps } from '../HeaderCollapsible/HeaderCollapsible.types';
-import { TitleStandardProps } from '../TitleStandard/TitleStandard.types';
-
-/**
- * HeaderCollapsibleStandard component props.
- */
-export interface HeaderCollapsibleStandardProps
-  extends Omit<HeaderCollapsibleProps, 'expandedContent'> {
-  /**
-   * Custom node to render in the expanded content section.
-   * If provided, takes priority over titleStandardProps.
-   */
-  titleStandard?: ReactNode;
-  /**
-   * Props to pass to the TitleStandard component.
-   * Only used if titleStandard is not provided.
-   */
-  titleStandardProps?: TitleStandardProps;
-}
diff --git a/app/component-library/components-temp/HeaderCollapsibleStandard/index.ts b/app/component-library/components-temp/HeaderCollapsibleStandard/index.ts
deleted file mode 100644
index 30f840763f82..000000000000
--- a/app/component-library/components-temp/HeaderCollapsibleStandard/index.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-export { default } from './HeaderCollapsibleStandard';
-export type { HeaderCollapsibleStandardProps } from './HeaderCollapsibleStandard.types';
-
-// Re-export hook and types from HeaderCollapsible for convenience
-export {
-  useHeaderCollapsible,
-  type UseHeaderCollapsibleOptions,
-  type UseHeaderCollapsibleReturn,
-} from '../HeaderCollapsible';
diff --git a/app/component-library/components-temp/HeaderCollapsibleSubpage/HeaderCollapsibleSubpage.stories.tsx b/app/component-library/components-temp/HeaderCollapsibleSubpage/HeaderCollapsibleSubpage.stories.tsx
deleted file mode 100644
index f73de83dc322..000000000000
--- a/app/component-library/components-temp/HeaderCollapsibleSubpage/HeaderCollapsibleSubpage.stories.tsx
+++ /dev/null
@@ -1,244 +0,0 @@
-/* eslint-disable no-console */
-import React, { useState, useCallback } from 'react';
-import {
-  View,
-  ScrollView,
-  NativeSyntheticEvent,
-  NativeScrollEvent,
-} from 'react-native';
-
-import {
-  Box,
-  Text,
-  TextVariant,
-  IconName,
-} from '@metamask/design-system-react-native';
-import { useTailwind } from '@metamask/design-system-twrnc-preset';
-import { useSharedValue, SharedValue } from 'react-native-reanimated';
-
-import { AvatarSize } from '../../components/Avatars/Avatar/Avatar.types';
-import AvatarToken from '../../components/Avatars/Avatar/variants/AvatarToken';
-import { SAMPLE_AVATARTOKEN_PROPS } from '../../components/Avatars/Avatar/variants/AvatarToken/AvatarToken.constants';
-
-import HeaderCollapsibleSubpage from './HeaderCollapsibleSubpage';
-
-const HeaderCollapsibleSubpageMeta = {
-  title: 'Components Temp / HeaderCollapsibleSubpage',
-  component: HeaderCollapsibleSubpage,
-  argTypes: {
-    title: {
-      control: 'text',
-    },
-    subtitle: {
-      control: 'text',
-    },
-    twClassName: {
-      control: 'text',
-    },
-  },
-};
-
-export default HeaderCollapsibleSubpageMeta;
-
-const SampleContent = ({ itemCount = 20 }: { itemCount?: number }) => (
-  <>
-    {Array.from({ length: itemCount }).map((_, index) => (
-      <Box key={index} twClassName="p-4 mb-2 bg-muted rounded-lg mx-4">
-        <Text variant={TextVariant.BodyMd}>Item {index + 1}</Text>
-        <Text variant={TextVariant.BodySm}>
-          This is sample content to demonstrate scrolling behavior.
-        </Text>
-      </Box>
-    ))}
-  </>
-);
-
-interface ScrollableStoryContainerProps {
-  children: (props: {
-    scrollYValue: SharedValue<number>;
-    setExpandedHeight: (h: number) => void;
-  }) => React.ReactNode;
-}
-
-const ScrollableStoryContainer = ({
-  children,
-}: ScrollableStoryContainerProps) => {
-  const tw = useTailwind();
-  const scrollYValue = useSharedValue(0);
-  const [expandedHeight, setExpandedHeight] = useState(140);
-
-  const onScroll = useCallback(
-    (event: NativeSyntheticEvent<NativeScrollEvent>) => {
-      scrollYValue.value = event.nativeEvent.contentOffset.y;
-    },
-    [scrollYValue],
-  );
-
-  return (
-    <View style={tw.style('flex-1 bg-default')}>
-      {children({ scrollYValue, setExpandedHeight })}
-      <ScrollView
-        onScroll={onScroll}
-        scrollEventThrottle={16}
-        contentContainerStyle={{ paddingTop: expandedHeight }}
-        showsVerticalScrollIndicator={false}
-      >
-        <SampleContent />
-      </ScrollView>
-    </View>
-  );
-};
-
-export const Default = {
-  render: () => (
-    <ScrollableStoryContainer>
-      {({ scrollYValue, setExpandedHeight }) => (
-        <HeaderCollapsibleSubpage
-          title="Token Name"
-          onBack={() => console.log('Back pressed')}
-          titleSubpageProps={{
-            title: 'Token Name',
-            bottomLabel: '$1,234.56',
-          }}
-          scrollY={scrollYValue}
-          onExpandedHeightChange={setExpandedHeight}
-        />
-      )}
-    </ScrollableStoryContainer>
-  ),
-};
-
-export const WithStartAccessory = {
-  render: () => (
-    <ScrollableStoryContainer>
-      {({ scrollYValue, setExpandedHeight }) => (
-        <HeaderCollapsibleSubpage
-          title="Wrapped Ethereum"
-          onBack={() => console.log('Back pressed')}
-          titleSubpageProps={{
-            startAccessory: (
-              <AvatarToken {...SAMPLE_AVATARTOKEN_PROPS} size={AvatarSize.Lg} />
-            ),
-            title: 'Wrapped Ethereum',
-            bottomLabel: '$3,456.78',
-          }}
-          scrollY={scrollYValue}
-          onExpandedHeightChange={setExpandedHeight}
-        />
-      )}
-    </ScrollableStoryContainer>
-  ),
-};
-
-export const WithSubtitle = {
-  render: () => (
-    <ScrollableStoryContainer>
-      {({ scrollYValue, setExpandedHeight }) => (
-        <HeaderCollapsibleSubpage
-          title="Token Name"
-          subtitle="1.5 WETH"
-          onBack={() => console.log('Back pressed')}
-          titleSubpageProps={{
-            startAccessory: (
-              <AvatarToken {...SAMPLE_AVATARTOKEN_PROPS} size={AvatarSize.Lg} />
-            ),
-            title: 'Wrapped Ethereum',
-            bottomLabel: '$3,456.78',
-          }}
-          scrollY={scrollYValue}
-          onExpandedHeightChange={setExpandedHeight}
-        />
-      )}
-    </ScrollableStoryContainer>
-  ),
-};
-
-export const OnClose = {
-  render: () => (
-    <ScrollableStoryContainer>
-      {({ scrollYValue, setExpandedHeight }) => (
-        <HeaderCollapsibleSubpage
-          title="Token Name"
-          onClose={() => console.log('Close pressed')}
-          titleSubpageProps={{
-            title: 'Token Name',
-            bottomLabel: '$1,234.56',
-          }}
-          scrollY={scrollYValue}
-          onExpandedHeightChange={setExpandedHeight}
-        />
-      )}
-    </ScrollableStoryContainer>
-  ),
-};
-
-export const BackAndClose = {
-  render: () => (
-    <ScrollableStoryContainer>
-      {({ scrollYValue, setExpandedHeight }) => (
-        <HeaderCollapsibleSubpage
-          title="Token Name"
-          onBack={() => console.log('Back pressed')}
-          onClose={() => console.log('Close pressed')}
-          titleSubpageProps={{
-            startAccessory: (
-              <AvatarToken {...SAMPLE_AVATARTOKEN_PROPS} size={AvatarSize.Lg} />
-            ),
-            title: 'Wrapped Ethereum',
-            bottomLabel: '$3,456.78',
-          }}
-          scrollY={scrollYValue}
-          onExpandedHeightChange={setExpandedHeight}
-        />
-      )}
-    </ScrollableStoryContainer>
-  ),
-};
-
-export const EndButtonIconProps = {
-  render: () => (
-    <ScrollableStoryContainer>
-      {({ scrollYValue, setExpandedHeight }) => (
-        <HeaderCollapsibleSubpage
-          title="Token Name"
-          onBack={() => console.log('Back pressed')}
-          endButtonIconProps={[
-            {
-              iconName: IconName.Close,
-              onPress: () => console.log('Close pressed'),
-            },
-          ]}
-          titleSubpageProps={{
-            title: 'Token Name',
-            bottomLabel: '$1,234.56',
-          }}
-          scrollY={scrollYValue}
-          onExpandedHeightChange={setExpandedHeight}
-        />
-      )}
-    </ScrollableStoryContainer>
-  ),
-};
-
-export const CustomTitleSubpage = {
-  render: () => (
-    <ScrollableStoryContainer>
-      {({ scrollYValue, setExpandedHeight }) => (
-        <HeaderCollapsibleSubpage
-          title="Custom"
-          onBack={() => console.log('Back pressed')}
-          titleSubpage={
-            <Box twClassName="px-4 py-2">
-              <Text variant={TextVariant.HeadingMd}>Custom Title Section</Text>
-              <Text variant={TextVariant.BodySm}>
-                This is a completely custom expanded content section
-              </Text>
-            </Box>
-          }
-          scrollY={scrollYValue}
-          onExpandedHeightChange={setExpandedHeight}
-        />
-      )}
-    </ScrollableStoryContainer>
-  ),
-};
diff --git a/app/component-library/components-temp/HeaderCollapsibleSubpage/HeaderCollapsibleSubpage.test.tsx b/app/component-library/components-temp/HeaderCollapsibleSubpage/HeaderCollapsibleSubpage.test.tsx
deleted file mode 100644
index 29ee27f3d6c1..000000000000
--- a/app/component-library/components-temp/HeaderCollapsibleSubpage/HeaderCollapsibleSubpage.test.tsx
+++ /dev/null
@@ -1,339 +0,0 @@
-// Third party dependencies.
-import React from 'react';
-import { render, fireEvent } from '@testing-library/react-native';
-import { useSharedValue, SharedValue } from 'react-native-reanimated';
-import { Text, IconName } from '@metamask/design-system-react-native';
-
-// Internal dependencies.
-import HeaderCollapsibleSubpage from './HeaderCollapsibleSubpage';
-
-// Mock react-native-reanimated
-jest.mock('react-native-reanimated', () => {
-  const Reanimated = jest.requireActual('react-native-reanimated/mock');
-  Reanimated.useSharedValue = jest.fn((initial) => ({
-    value: initial,
-  }));
-  Reanimated.useAnimatedStyle = jest.fn((fn) => fn());
-  Reanimated.interpolate = jest.fn(
-    (_value, _inputRange, outputRange) => outputRange[0],
-  );
-  Reanimated.Extrapolation = { CLAMP: 'clamp' };
-  return Reanimated;
-});
-
-// Mock react-native-safe-area-context
-jest.mock('react-native-safe-area-context', () => ({
-  useSafeAreaInsets: () => ({ top: 44, bottom: 34, left: 0, right: 0 }),
-}));
-
-const TEST_IDS = {
-  CONTAINER: 'header-collapsible-subpage-container',
-  TITLE_SECTION: 'header-collapsible-subpage-title-section',
-  BACK_BUTTON: 'header-collapsible-subpage-back-button',
-  CLOSE_BUTTON: 'header-collapsible-subpage-close-button',
-  HEADER_BASE_END_ACCESSORY: 'header-base-end-accessory',
-};
-
-// Test wrapper component that provides scrollY
-const TestWrapper: React.FC<{
-  children: (scrollYValue: SharedValue<number>) => React.ReactNode;
-}> = ({ children }) => {
-  const scrollYValue = useSharedValue(0);
-  return <>{children(scrollYValue)}</>;
-};
-
-describe('HeaderCollapsibleSubpage', () => {
-  beforeEach(() => {
-    jest.clearAllMocks();
-  });
-
-  describe('rendering', () => {
-    it('renders container with correct testID', () => {
-      const { getByTestId } = render(
-        <TestWrapper>
-          {(scrollYValue) => (
-            <HeaderCollapsibleSubpage
-              title="Test"
-              scrollY={scrollYValue}
-              testID={TEST_IDS.CONTAINER}
-              titleSubpageProps={{ title: 'Test' }}
-            />
-          )}
-        </TestWrapper>,
-      );
-
-      expect(getByTestId(TEST_IDS.CONTAINER)).toBeOnTheScreen();
-    });
-
-    it('renders TitleSubpage with props when titleSubpageProps provided', () => {
-      const { getByText, getByTestId } = render(
-        <TestWrapper>
-          {(scrollYValue) => (
-            <HeaderCollapsibleSubpage
-              title="Test"
-              scrollY={scrollYValue}
-              titleSubpageProps={{
-                title: 'Token Name',
-                bottomLabel: '$1,234.56',
-                testID: TEST_IDS.TITLE_SECTION,
-              }}
-            />
-          )}
-        </TestWrapper>,
-      );
-
-      expect(getByText('Token Name')).toBeOnTheScreen();
-      expect(getByText('$1,234.56')).toBeOnTheScreen();
-      expect(getByTestId(TEST_IDS.TITLE_SECTION)).toBeOnTheScreen();
-    });
-
-    it('renders custom titleSubpage node when provided', () => {
-      const { getByText } = render(
-        <TestWrapper>
-          {(scrollYValue) => (
-            <HeaderCollapsibleSubpage
-              title="Test"
-              scrollY={scrollYValue}
-              titleSubpage={<Text>Custom Title Section</Text>}
-            />
-          )}
-        </TestWrapper>,
-      );
-
-      expect(getByText('Custom Title Section')).toBeOnTheScreen();
-    });
-
-    it('titleSubpage takes priority over titleSubpageProps', () => {
-      const { getByText, queryByText } = render(
-        <TestWrapper>
-          {(scrollYValue) => (
-            <HeaderCollapsibleSubpage
-              title="Test"
-              scrollY={scrollYValue}
-              titleSubpage={<Text>Custom Node</Text>}
-              titleSubpageProps={{ title: 'Props Title' }}
-            />
-          )}
-        </TestWrapper>,
-      );
-
-      expect(getByText('Custom Node')).toBeOnTheScreen();
-      expect(queryByText('Props Title')).toBeNull();
-    });
-
-    it('passes testID from titleSubpageProps to TitleSubpage', () => {
-      const { getByTestId } = render(
-        <TestWrapper>
-          {(scrollYValue) => (
-            <HeaderCollapsibleSubpage
-              title="Test"
-              scrollY={scrollYValue}
-              titleSubpageProps={{
-                title: 'Token Name',
-                testID: TEST_IDS.TITLE_SECTION,
-              }}
-            />
-          )}
-        </TestWrapper>,
-      );
-
-      expect(getByTestId(TEST_IDS.TITLE_SECTION)).toBeOnTheScreen();
-    });
-  });
-
-  describe('back button', () => {
-    it('renders back button when onBack provided', () => {
-      const { getByTestId } = render(
-        <TestWrapper>
-          {(scrollYValue) => (
-            <HeaderCollapsibleSubpage
-              title="Test"
-              scrollY={scrollYValue}
-              onBack={jest.fn()}
-              backButtonProps={{ testID: TEST_IDS.BACK_BUTTON }}
-              titleSubpageProps={{ title: 'Test' }}
-            />
-          )}
-        </TestWrapper>,
-      );
-
-      expect(getByTestId(TEST_IDS.BACK_BUTTON)).toBeOnTheScreen();
-    });
-
-    it('renders back button when backButtonProps provided', () => {
-      const { getByTestId } = render(
-        <TestWrapper>
-          {(scrollYValue) => (
-            <HeaderCollapsibleSubpage
-              title="Test"
-              scrollY={scrollYValue}
-              backButtonProps={{
-                onPress: jest.fn(),
-                testID: TEST_IDS.BACK_BUTTON,
-              }}
-              titleSubpageProps={{ title: 'Test' }}
-            />
-          )}
-        </TestWrapper>,
-      );
-
-      expect(getByTestId(TEST_IDS.BACK_BUTTON)).toBeOnTheScreen();
-    });
-
-    it('calls onBack when back button pressed', () => {
-      const onBack = jest.fn();
-      const { getByTestId } = render(
-        <TestWrapper>
-          {(scrollYValue) => (
-            <HeaderCollapsibleSubpage
-              title="Test"
-              scrollY={scrollYValue}
-              onBack={onBack}
-              backButtonProps={{ testID: TEST_IDS.BACK_BUTTON }}
-              titleSubpageProps={{ title: 'Test' }}
-            />
-          )}
-        </TestWrapper>,
-      );
-
-      fireEvent.press(getByTestId(TEST_IDS.BACK_BUTTON));
-
-      expect(onBack).toHaveBeenCalledTimes(1);
-    });
-
-    it('backButtonProps.onPress takes priority over onBack', () => {
-      const onBack = jest.fn();
-      const onPress = jest.fn();
-      const { getByTestId } = render(
-        <TestWrapper>
-          {(scrollYValue) => (
-            <HeaderCollapsibleSubpage
-              title="Test"
-              scrollY={scrollYValue}
-              onBack={onBack}
-              backButtonProps={{ onPress, testID: TEST_IDS.BACK_BUTTON }}
-              titleSubpageProps={{ title: 'Test' }}
-            />
-          )}
-        </TestWrapper>,
-      );
-
-      fireEvent.press(getByTestId(TEST_IDS.BACK_BUTTON));
-
-      expect(onPress).toHaveBeenCalledTimes(1);
-      expect(onBack).not.toHaveBeenCalled();
-    });
-  });
-
-  describe('close button', () => {
-    it('renders close button when onClose provided', () => {
-      const { getByTestId } = render(
-        <TestWrapper>
-          {(scrollYValue) => (
-            <HeaderCollapsibleSubpage
-              title="Test"
-              scrollY={scrollYValue}
-              onClose={jest.fn()}
-              closeButtonProps={{ testID: TEST_IDS.CLOSE_BUTTON }}
-              titleSubpageProps={{ title: 'Test' }}
-            />
-          )}
-        </TestWrapper>,
-      );
-
-      expect(getByTestId(TEST_IDS.CLOSE_BUTTON)).toBeOnTheScreen();
-    });
-
-    it('calls onClose when close button pressed', () => {
-      const onClose = jest.fn();
-      const { getByTestId } = render(
-        <TestWrapper>
-          {(scrollYValue) => (
-            <HeaderCollapsibleSubpage
-              title="Test"
-              scrollY={scrollYValue}
-              onClose={onClose}
-              closeButtonProps={{ testID: TEST_IDS.CLOSE_BUTTON }}
-              titleSubpageProps={{ title: 'Test' }}
-            />
-          )}
-        </TestWrapper>,
-      );
-
-      fireEvent.press(getByTestId(TEST_IDS.CLOSE_BUTTON));
-
-      expect(onClose).toHaveBeenCalledTimes(1);
-    });
-
-    it('closeButtonProps.onPress takes priority over onClose', () => {
-      const onClose = jest.fn();
-      const onPress = jest.fn();
-      const { getByTestId } = render(
-        <TestWrapper>
-          {(scrollYValue) => (
-            <HeaderCollapsibleSubpage
-              title="Test"
-              scrollY={scrollYValue}
-              onClose={onClose}
-              closeButtonProps={{ onPress, testID: TEST_IDS.CLOSE_BUTTON }}
-              titleSubpageProps={{ title: 'Test' }}
-            />
-          )}
-        </TestWrapper>,
-      );
-
-      fireEvent.press(getByTestId(TEST_IDS.CLOSE_BUTTON));
-
-      expect(onPress).toHaveBeenCalledTimes(1);
-      expect(onClose).not.toHaveBeenCalled();
-    });
-  });
-
-  describe('props forwarding', () => {
-    it('forwards endButtonIconProps to HeaderBase', () => {
-      const { getByTestId } = render(
-        <TestWrapper>
-          {(scrollYValue) => (
-            <HeaderCollapsibleSubpage
-              title="Test"
-              scrollY={scrollYValue}
-              onBack={jest.fn()}
-              endButtonIconProps={[
-                {
-                  iconName: IconName.Close,
-                  onPress: jest.fn(),
-                  testID: TEST_IDS.HEADER_BASE_END_ACCESSORY,
-                },
-              ]}
-              titleSubpageProps={{ title: 'Test' }}
-            />
-          )}
-        </TestWrapper>,
-      );
-
-      expect(getByTestId(TEST_IDS.HEADER_BASE_END_ACCESSORY)).toBeOnTheScreen();
-    });
-
-    it('forwards startButtonIconProps directly when provided', () => {
-      const onPress = jest.fn();
-      const { getByTestId } = render(
-        <TestWrapper>
-          {(scrollYValue) => (
-            <HeaderCollapsibleSubpage
-              title="Test"
-              scrollY={scrollYValue}
-              startButtonIconProps={{
-                iconName: IconName.Menu,
-                onPress,
-                testID: 'custom-start-button',
-              }}
-              titleSubpageProps={{ title: 'Test' }}
-            />
-          )}
-        </TestWrapper>,
-      );
-
-      expect(getByTestId('custom-start-button')).toBeOnTheScreen();
-    });
-  });
-});
diff --git a/app/component-library/components-temp/HeaderCollapsibleSubpage/HeaderCollapsibleSubpage.tsx b/app/component-library/components-temp/HeaderCollapsibleSubpage/HeaderCollapsibleSubpage.tsx
deleted file mode 100644
index a7cc9f30dd83..000000000000
--- a/app/component-library/components-temp/HeaderCollapsibleSubpage/HeaderCollapsibleSubpage.tsx
+++ /dev/null
@@ -1,67 +0,0 @@
-// Third party dependencies.
-import React from 'react';
-
-// Internal dependencies.
-import HeaderCollapsible from '../HeaderCollapsible';
-import TitleSubpage from '../TitleSubpage';
-import { HeaderCollapsibleSubpageProps } from './HeaderCollapsibleSubpage.types';
-
-/**
- * HeaderCollapsibleSubpage is a collapsing header component that combines
- * HeaderCollapsible with TitleSubpage as the expanded content.
- *
- * @example
- * ```tsx
- * const { onScroll, scrollY, expandedHeight, setExpandedHeight } = useHeaderCollapsible();
- *
- * return (
- *   <View style={{ flex: 1 }}>
- *     <HeaderCollapsibleSubpage
- *       title="Token Name"
- *       onBack={handleBack}
- *       titleSubpageProps={{
- *         startAccessory: <AvatarToken />,
- *         title: "Token Name",
- *         bottomLabel: "$1,234.56",
- *       }}
- *       scrollY={scrollY}
- *       onExpandedHeightChange={setExpandedHeight}
- *     />
- *     <ScrollView
- *       onScroll={onScroll}
- *       scrollEventThrottle={16}
- *       contentContainerStyle={{ paddingTop: expandedHeight }}
- *     >
- *       <Content />
- *     </ScrollView>
- *   </View>
- * );
- * ```
- */
-const HeaderCollapsibleSubpage: React.FC<HeaderCollapsibleSubpageProps> = ({
-  titleSubpage,
-  titleSubpageProps,
-  ...props
-}) => {
-  // Render title section content
-  const renderExpandedContent = () => {
-    if (titleSubpage) {
-      return titleSubpage;
-    }
-    if (titleSubpageProps) {
-      return (
-        <TitleSubpage
-          {...titleSubpageProps}
-          twClassName={`px-4 pt-1 pb-3 ${titleSubpageProps?.twClassName ?? ''}`.trim()}
-        />
-      );
-    }
-    return null;
-  };
-
-  return (
-    <HeaderCollapsible {...props} expandedContent={renderExpandedContent()} />
-  );
-};
-
-export default HeaderCollapsibleSubpage;
diff --git a/app/component-library/components-temp/HeaderCollapsibleSubpage/HeaderCollapsibleSubpage.types.ts b/app/component-library/components-temp/HeaderCollapsibleSubpage/HeaderCollapsibleSubpage.types.ts
deleted file mode 100644
index 173b1b104d67..000000000000
--- a/app/component-library/components-temp/HeaderCollapsibleSubpage/HeaderCollapsibleSubpage.types.ts
+++ /dev/null
@@ -1,23 +0,0 @@
-// Third party dependencies.
-import { ReactNode } from 'react';
-
-// Internal dependencies.
-import { HeaderCollapsibleProps } from '../HeaderCollapsible/HeaderCollapsible.types';
-import { TitleSubpageProps } from '../TitleSubpage/TitleSubpage.types';
-
-/**
- * HeaderCollapsibleSubpage component props.
- */
-export interface HeaderCollapsibleSubpageProps
-  extends Omit<HeaderCollapsibleProps, 'expandedContent'> {
-  /**
-   * Custom node to render in the expanded content section.
-   * If provided, takes priority over titleSubpageProps.
-   */
-  titleSubpage?: ReactNode;
-  /**
-   * Props to pass to the TitleSubpage component.
-   * Only used if titleSubpage is not provided.
-   */
-  titleSubpageProps?: TitleSubpageProps;
-}
diff --git a/app/component-library/components-temp/HeaderCollapsibleSubpage/index.ts b/app/component-library/components-temp/HeaderCollapsibleSubpage/index.ts
deleted file mode 100644
index fbd329302eea..000000000000
--- a/app/component-library/components-temp/HeaderCollapsibleSubpage/index.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-export { default } from './HeaderCollapsibleSubpage';
-export type { HeaderCollapsibleSubpageProps } from './HeaderCollapsibleSubpage.types';
-
-// Re-export hook and types from HeaderCollapsible for convenience
-export {
-  useHeaderCollapsible,
-  type UseHeaderCollapsibleOptions,
-  type UseHeaderCollapsibleReturn,
-} from '../HeaderCollapsible';
diff --git a/app/component-library/components-temp/HeaderCompactSearch/index.ts b/app/component-library/components-temp/HeaderCompactSearch/index.ts
deleted file mode 100644
index 30acb53ffcb8..000000000000
--- a/app/component-library/components-temp/HeaderCompactSearch/index.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-export { default } from './HeaderCompactSearch';
-export {
-  HeaderCompactSearchVariant,
-  type HeaderCompactSearchProps,
-  type HeaderCompactSearchScreenProps,
-  type HeaderCompactSearchInlineProps,
-} from './HeaderCompactSearch.types';
diff --git a/app/component-library/components-temp/HeaderCompactStandard/HeaderCompactStandard.test.tsx b/app/component-library/components-temp/HeaderCompactStandard/HeaderCompactStandard.test.tsx
index b85e360c1935..68b47cf89609 100644
--- a/app/component-library/components-temp/HeaderCompactStandard/HeaderCompactStandard.test.tsx
+++ b/app/component-library/components-temp/HeaderCompactStandard/HeaderCompactStandard.test.tsx
@@ -107,6 +107,47 @@ describe('HeaderCompactStandard', () => {
       expect(getByText('Main Title')).toBeOnTheScreen();
       expect(getByText('Supporting Text')).toBeOnTheScreen();
     });
+
+    it('renders title when passed as React node', () => {
+      const TITLE_NODE_TEST_ID = 'custom-title-node';
+      const { getByTestId, getByText } = render(
+        <HeaderCompactStandard
+          title={<Text testID={TITLE_NODE_TEST_ID}>Custom Title Node</Text>}
+        />,
+      );
+
+      expect(getByTestId(TITLE_NODE_TEST_ID)).toBeOnTheScreen();
+      expect(getByText('Custom Title Node')).toBeOnTheScreen();
+    });
+
+    it('renders subtitle when passed as React node', () => {
+      const SUBTITLE_NODE_TEST_ID = 'custom-subtitle-node';
+      const { getByTestId, getByText } = render(
+        <HeaderCompactStandard
+          title="Page Title"
+          subtitle={
+            <Text testID={SUBTITLE_NODE_TEST_ID}>Custom Subtitle Node</Text>
+          }
+        />,
+      );
+
+      expect(getByTestId(SUBTITLE_NODE_TEST_ID)).toBeOnTheScreen();
+      expect(getByText('Custom Subtitle Node')).toBeOnTheScreen();
+    });
+
+    it('renders both title and subtitle as React nodes', () => {
+      const TITLE_NODE_TEST_ID = 'title-node';
+      const SUBTITLE_NODE_TEST_ID = 'subtitle-node';
+      const { getByTestId } = render(
+        <HeaderCompactStandard
+          title={<Text testID={TITLE_NODE_TEST_ID}>Node Title</Text>}
+          subtitle={<Text testID={SUBTITLE_NODE_TEST_ID}>Node Subtitle</Text>}
+        />,
+      );
+
+      expect(getByTestId(TITLE_NODE_TEST_ID)).toBeOnTheScreen();
+      expect(getByTestId(SUBTITLE_NODE_TEST_ID)).toBeOnTheScreen();
+    });
   });
 
   describe('back button', () => {
diff --git a/app/component-library/components-temp/HeaderCompactStandard/HeaderCompactStandard.tsx b/app/component-library/components-temp/HeaderCompactStandard/HeaderCompactStandard.tsx
index 5d689273959b..81783d163aae 100644
--- a/app/component-library/components-temp/HeaderCompactStandard/HeaderCompactStandard.tsx
+++ b/app/component-library/components-temp/HeaderCompactStandard/HeaderCompactStandard.tsx
@@ -97,22 +97,31 @@ const HeaderCompactStandard: React.FC<HeaderCompactStandardProps> = ({
     if (title) {
       return (
         <Box alignItems={BoxAlignItems.Center}>
-          <Text
-            variant={TextVariant.BodyMd}
-            fontWeight={FontWeight.Bold}
-            {...titleProps}
-          >
-            {title}
-          </Text>
-          {subtitle && (
+          {typeof title === 'string' ? (
             <Text
-              variant={TextVariant.BodySm}
-              color={TextColor.TextAlternative}
-              {...subtitleProps}
-              twClassName={`-mt-0.5 ${subtitleProps?.twClassName ?? ''}`.trim()}
+              variant={TextVariant.BodyMd}
+              fontWeight={FontWeight.Bold}
+              {...titleProps}
             >
-              {subtitle}
+              {title}
             </Text>
+          ) : (
+            title
+          )}
+          {subtitle && (
+            <Box twClassName="-mt-0.5">
+              {typeof subtitle === 'string' ? (
+                <Text
+                  variant={TextVariant.BodySm}
+                  color={TextColor.TextAlternative}
+                  {...subtitleProps}
+                >
+                  {subtitle}
+                </Text>
+              ) : (
+                subtitle
+              )}
+            </Box>
           )}
         </Box>
       );
diff --git a/app/component-library/components-temp/HeaderCompactStandard/HeaderCompactStandard.types.ts b/app/component-library/components-temp/HeaderCompactStandard/HeaderCompactStandard.types.ts
index 04a813f4f8bc..d3393429276a 100644
--- a/app/component-library/components-temp/HeaderCompactStandard/HeaderCompactStandard.types.ts
+++ b/app/component-library/components-temp/HeaderCompactStandard/HeaderCompactStandard.types.ts
@@ -1,4 +1,5 @@
 // External dependencies.
+import React from 'react';
 import {
   ButtonIconProps,
   TextProps,
@@ -12,24 +13,28 @@ import { HeaderBaseProps } from '../../components/HeaderBase';
  */
 export interface HeaderCompactStandardProps extends HeaderBaseProps {
   /**
-   * Title text to display in the header.
+   * Title to display in the header. Can be a string or a React node.
    * Used as children if children prop is not provided.
-   * Rendered with TextVariant.BodyMd and FontWeight.Bold by default.
+   * When string: rendered with TextVariant.BodyMd and FontWeight.Bold by default; titleProps apply.
+   * When node: rendered as-is; titleProps are not applied.
    */
-  title?: string;
+  title?: string | React.ReactNode;
   /**
    * Additional props to pass to the title Text component.
    * Props are spread to the Text component and can override default values.
+   * Only applied when title is a string.
    */
   titleProps?: Partial<TextProps>;
   /**
-   * Subtitle text to display below the title.
-   * Rendered with TextVariant.BodySm and TextColor.TextAlternative by default.
+   * Subtitle to display below the title. Can be a string or a React node.
+   * When string: rendered with TextVariant.BodySm and TextColor.TextAlternative by default; subtitleProps apply.
+   * When node: rendered inside the same -mt-0.5 container; subtitleProps are not applied.
    */
-  subtitle?: string;
+  subtitle?: string | React.ReactNode;
   /**
    * Additional props to pass to the subtitle Text component.
    * Props are spread to the Text component and can override default values.
+   * Only applied when subtitle is a string.
    */
   subtitleProps?: Partial<TextProps>;
   /**
diff --git a/app/component-library/components-temp/HeaderRoot/HeaderRoot.stories.tsx b/app/component-library/components-temp/HeaderRoot/HeaderRoot.stories.tsx
new file mode 100644
index 000000000000..a21eefa20d84
--- /dev/null
+++ b/app/component-library/components-temp/HeaderRoot/HeaderRoot.stories.tsx
@@ -0,0 +1,108 @@
+/* eslint-disable no-console */
+import React from 'react';
+
+import {
+  Box,
+  Text,
+  TextVariant,
+  Icon,
+  IconName,
+  IconColor,
+} from '@metamask/design-system-react-native';
+
+import HeaderRoot from './HeaderRoot';
+
+const HeaderRootMeta = {
+  title: 'Components Temp / HeaderRoot',
+  component: HeaderRoot,
+  argTypes: {
+    title: {
+      control: 'text',
+    },
+    twClassName: {
+      control: 'text',
+    },
+  },
+};
+
+export default HeaderRootMeta;
+
+export const Default = {
+  args: {
+    title: 'Header Title',
+  },
+};
+
+export const WithTitleAccessory = {
+  render: () => (
+    <HeaderRoot
+      title="Settings"
+      titleAccessory={
+        <Icon
+          name={IconName.Info}
+          color={IconColor.IconAlternative}
+          twClassName="ml-1"
+        />
+      }
+    />
+  ),
+};
+
+export const WithChildren = {
+  render: () => (
+    <HeaderRoot
+      endButtonIconProps={[
+        {
+          iconName: IconName.Close,
+          onPress: () => console.log('Close pressed'),
+        },
+      ]}
+    >
+      <Box twClassName="items-start">
+        <Text variant={TextVariant.HeadingSm}>Custom Title</Text>
+        <Text variant={TextVariant.BodySm}>Subtitle text</Text>
+      </Box>
+    </HeaderRoot>
+  ),
+};
+
+export const WithEndAccessory = {
+  render: () => (
+    <HeaderRoot
+      title="Page Title"
+      endAccessory={<Text variant={TextVariant.BodyMd}>Custom end</Text>}
+    />
+  ),
+};
+
+export const WithEndButtonIconProps = {
+  render: () => (
+    <HeaderRoot
+      title="Search"
+      endButtonIconProps={[
+        {
+          iconName: IconName.Close,
+          onPress: () => console.log('Close pressed'),
+        },
+      ]}
+    />
+  ),
+};
+
+export const MultipleEndButtons = {
+  render: () => (
+    <HeaderRoot
+      title="Search"
+      endButtonIconProps={[
+        {
+          iconName: IconName.Search,
+          onPress: () => console.log('Search pressed'),
+        },
+        {
+          iconName: IconName.Close,
+          onPress: () => console.log('Close pressed'),
+        },
+      ]}
+    />
+  ),
+};
diff --git a/app/component-library/components-temp/HeaderRoot/HeaderRoot.test.tsx b/app/component-library/components-temp/HeaderRoot/HeaderRoot.test.tsx
new file mode 100644
index 000000000000..b196d6232ddd
--- /dev/null
+++ b/app/component-library/components-temp/HeaderRoot/HeaderRoot.test.tsx
@@ -0,0 +1,319 @@
+// Third party dependencies.
+import React from 'react';
+import { Text } from 'react-native';
+import { render, fireEvent } from '@testing-library/react-native';
+
+// External dependencies.
+import { IconName } from '@metamask/design-system-react-native';
+
+// Internal dependencies.
+import HeaderRoot from './HeaderRoot';
+
+jest.mock('react-native-safe-area-context', () => ({
+  useSafeAreaInsets: () => ({ top: 44, bottom: 34, left: 0, right: 0 }),
+}));
+
+const CONTAINER_TEST_ID = 'header-root-container';
+const LEFT_CHILDREN_TEST_ID = 'header-root-left-children';
+const END_ACCESSORY_TEST_ID = 'header-root-end-accessory';
+const END_BUTTON_TEST_ID = 'header-root-end-button';
+
+describe('HeaderRoot', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  describe('rendering', () => {
+    it('renders container with testID when provided', () => {
+      const { getByTestId } = render(
+        <HeaderRoot title="Title" testID={CONTAINER_TEST_ID} />,
+      );
+
+      expect(getByTestId(CONTAINER_TEST_ID)).toBeOnTheScreen();
+    });
+
+    it('renders title in left section when title provided and no children', () => {
+      const { getByText } = render(<HeaderRoot title="Test Title" />);
+
+      expect(getByText('Test Title')).toBeOnTheScreen();
+    });
+
+    it('renders title with testID when provided via titleProps', () => {
+      const { getByTestId } = render(
+        <HeaderRoot
+          title="Test Title"
+          titleProps={{ testID: 'header-root-title' }}
+        />,
+      );
+
+      expect(getByTestId('header-root-title')).toBeOnTheScreen();
+    });
+
+    it('renders titleAccessory in title row when no children', () => {
+      const { getByTestId, getByText } = render(
+        <HeaderRoot
+          title="Title"
+          titleAccessory={<Text testID={LEFT_CHILDREN_TEST_ID}>Accessory</Text>}
+        />,
+      );
+
+      expect(getByText('Title')).toBeOnTheScreen();
+      expect(getByTestId(LEFT_CHILDREN_TEST_ID)).toBeOnTheScreen();
+    });
+
+    it('renders only titleAccessory when title is empty and children not provided', () => {
+      const { getByTestId } = render(
+        <HeaderRoot
+          title=""
+          titleAccessory={
+            <Text testID={LEFT_CHILDREN_TEST_ID}>Only Accessory</Text>
+          }
+        />,
+      );
+
+      expect(getByTestId(LEFT_CHILDREN_TEST_ID)).toBeOnTheScreen();
+    });
+
+    it('renders only titleAccessory when title is undefined', () => {
+      const { getByTestId } = render(
+        <HeaderRoot
+          titleAccessory={
+            <Text testID={LEFT_CHILDREN_TEST_ID}>Accessory Only</Text>
+          }
+        />,
+      );
+
+      expect(getByTestId(LEFT_CHILDREN_TEST_ID)).toBeOnTheScreen();
+    });
+
+    it('renders children in left section when children provided', () => {
+      const { getByTestId, queryByText } = render(
+        <HeaderRoot title="Ignored Title" testID={CONTAINER_TEST_ID}>
+          <Text testID={LEFT_CHILDREN_TEST_ID}>Custom Content</Text>
+        </HeaderRoot>,
+      );
+
+      expect(getByTestId(LEFT_CHILDREN_TEST_ID)).toBeOnTheScreen();
+      expect(getByTestId(CONTAINER_TEST_ID)).toBeOnTheScreen();
+      expect(queryByText('Ignored Title')).not.toBeOnTheScreen();
+    });
+
+    it('prioritizes children over title when both provided', () => {
+      const { getByText, queryByText } = render(
+        <HeaderRoot title="Title Text">
+          <Text>Children Text</Text>
+        </HeaderRoot>,
+      );
+
+      expect(getByText('Children Text')).toBeOnTheScreen();
+      expect(queryByText('Title Text')).not.toBeOnTheScreen();
+    });
+
+    it('renders title row when children is null', () => {
+      const { getByText } = render(
+        <HeaderRoot title="Title When Children Null">{null}</HeaderRoot>,
+      );
+
+      expect(getByText('Title When Children Null')).toBeOnTheScreen();
+    });
+
+    it('renders nothing in left section when no children and no title or titleAccessory', () => {
+      const { getByTestId, queryByText } = render(
+        <HeaderRoot testID={CONTAINER_TEST_ID} />,
+      );
+
+      expect(getByTestId(CONTAINER_TEST_ID)).toBeOnTheScreen();
+      expect(queryByText('Title')).not.toBeOnTheScreen();
+    });
+  });
+
+  describe('end section', () => {
+    it('renders endAccessory when provided', () => {
+      const { getByTestId } = render(
+        <HeaderRoot
+          title="Title"
+          endAccessory={<Text testID={END_ACCESSORY_TEST_ID}>End Content</Text>}
+        />,
+      );
+
+      expect(getByTestId(END_ACCESSORY_TEST_ID)).toBeOnTheScreen();
+    });
+
+    it('renders single ButtonIcon when endButtonIconProps has one item', () => {
+      const onPressMock = jest.fn();
+      const { getByTestId } = render(
+        <HeaderRoot
+          title="Title"
+          endButtonIconProps={[
+            {
+              iconName: IconName.Close,
+              onPress: onPressMock,
+              testID: END_BUTTON_TEST_ID,
+            },
+          ]}
+        />,
+      );
+
+      expect(getByTestId(END_BUTTON_TEST_ID)).toBeOnTheScreen();
+    });
+
+    it('calls onPress when end ButtonIcon is pressed', () => {
+      const onPressMock = jest.fn();
+      const { getByTestId } = render(
+        <HeaderRoot
+          title="Title"
+          endButtonIconProps={[
+            {
+              iconName: IconName.Close,
+              onPress: onPressMock,
+              testID: END_BUTTON_TEST_ID,
+            },
+          ]}
+        />,
+      );
+
+      fireEvent.press(getByTestId(END_BUTTON_TEST_ID));
+
+      expect(onPressMock).toHaveBeenCalledTimes(1);
+    });
+
+    it('renders multiple ButtonIcons when endButtonIconProps has multiple items', () => {
+      const { getByTestId } = render(
+        <HeaderRoot
+          title="Title"
+          endButtonIconProps={[
+            {
+              iconName: IconName.Close,
+              onPress: jest.fn(),
+              testID: 'end-button-close',
+            },
+            {
+              iconName: IconName.Search,
+              onPress: jest.fn(),
+              testID: 'end-button-search',
+            },
+          ]}
+        />,
+      );
+
+      expect(getByTestId('end-button-close')).toBeOnTheScreen();
+      expect(getByTestId('end-button-search')).toBeOnTheScreen();
+    });
+
+    it('does not render end section when no endAccessory and no endButtonIconProps', () => {
+      const { queryByTestId } = render(<HeaderRoot title="Title" />);
+
+      expect(queryByTestId(END_ACCESSORY_TEST_ID)).toBeNull();
+      expect(queryByTestId(END_BUTTON_TEST_ID)).toBeNull();
+    });
+
+    it('does not render end ButtonIcons when endButtonIconProps is empty array', () => {
+      const { queryByTestId } = render(
+        <HeaderRoot title="Title" endButtonIconProps={[]} />,
+      );
+
+      expect(queryByTestId(END_BUTTON_TEST_ID)).toBeNull();
+    });
+
+    it('prioritizes endAccessory over endButtonIconProps', () => {
+      const { getByTestId, queryByTestId } = render(
+        <HeaderRoot
+          title="Title"
+          endAccessory={<Text testID={END_ACCESSORY_TEST_ID}>Custom End</Text>}
+          endButtonIconProps={[
+            {
+              iconName: IconName.Close,
+              onPress: jest.fn(),
+              testID: END_BUTTON_TEST_ID,
+            },
+          ]}
+        />,
+      );
+
+      expect(getByTestId(END_ACCESSORY_TEST_ID)).toBeOnTheScreen();
+      expect(queryByTestId(END_BUTTON_TEST_ID)).toBeNull();
+    });
+  });
+
+  describe('includesTopInset', () => {
+    it('applies marginTop style when includesTopInset is true', () => {
+      const { getByTestId } = render(
+        <HeaderRoot
+          title="Title"
+          testID={CONTAINER_TEST_ID}
+          includesTopInset
+        />,
+      );
+
+      const container = getByTestId(CONTAINER_TEST_ID);
+
+      expect(container.props.style).toEqual(
+        expect.arrayContaining([
+          expect.anything(),
+          expect.objectContaining({ marginTop: 44 }),
+        ]),
+      );
+    });
+
+    it('does not apply marginTop when includesTopInset is false', () => {
+      const { getByTestId } = render(
+        <HeaderRoot title="Title" testID={CONTAINER_TEST_ID} />,
+      );
+
+      const container = getByTestId(CONTAINER_TEST_ID);
+      const marginTopStyle = container.props.style?.find(
+        (s: object) => s && typeof s === 'object' && 'marginTop' in s,
+      );
+
+      expect(marginTopStyle).toBeUndefined();
+    });
+  });
+
+  describe('style and twClassName', () => {
+    it('applies custom style to container', () => {
+      const customStyle = { backgroundColor: 'red' };
+      const { getByTestId } = render(
+        <HeaderRoot
+          title="Title"
+          testID={CONTAINER_TEST_ID}
+          style={customStyle}
+        />,
+      );
+
+      const container = getByTestId(CONTAINER_TEST_ID);
+
+      expect(container.props.style).toContainEqual(customStyle);
+    });
+
+    it('merges twClassName with base styles', () => {
+      const { getByTestId } = render(
+        <HeaderRoot
+          title="Title"
+          testID={CONTAINER_TEST_ID}
+          twClassName="custom-class"
+        />,
+      );
+
+      expect(getByTestId(CONTAINER_TEST_ID)).toBeOnTheScreen();
+    });
+  });
+
+  describe('titleProps', () => {
+    it('spreads titleProps to title Text when title is set', () => {
+      const { getByTestId } = render(
+        <HeaderRoot
+          title="Title"
+          titleProps={{
+            testID: 'title-with-props',
+            accessibilityLabel: 'Main title',
+          }}
+        />,
+      );
+
+      const title = getByTestId('title-with-props');
+
+      expect(title).toBeOnTheScreen();
+      expect(title.props.accessibilityLabel).toBe('Main title');
+    });
+  });
+});
diff --git a/app/component-library/components-temp/HeaderRoot/HeaderRoot.tsx b/app/component-library/components-temp/HeaderRoot/HeaderRoot.tsx
new file mode 100644
index 000000000000..589b180e1a58
--- /dev/null
+++ b/app/component-library/components-temp/HeaderRoot/HeaderRoot.tsx
@@ -0,0 +1,101 @@
+// Third party dependencies.
+import React from 'react';
+import { View } from 'react-native';
+
+// External dependencies.
+import {
+  Box,
+  Text,
+  ButtonIcon,
+  ButtonIconSize,
+  TextVariant,
+  BoxFlexDirection,
+  BoxAlignItems,
+} from '@metamask/design-system-react-native';
+import { useTailwind } from '@metamask/design-system-twrnc-preset';
+import { useSafeAreaInsets } from 'react-native-safe-area-context';
+
+// Internal dependencies.
+import { HeaderRootProps } from './HeaderRoot.types';
+
+const HeaderRoot: React.FC<HeaderRootProps> = ({
+  children,
+  title,
+  titleProps,
+  titleAccessory,
+  endAccessory,
+  endButtonIconProps,
+  includesTopInset = false,
+  style,
+  testID,
+  twClassName,
+  ...viewProps
+}) => {
+  const tw = useTailwind();
+  const insets = useSafeAreaInsets();
+
+  const renderEndContent = () => {
+    if (endAccessory) {
+      return endAccessory;
+    }
+    if (endButtonIconProps && endButtonIconProps.length > 0) {
+      const reversedProps = endButtonIconProps
+        .map((props, originalIndex) => ({ props, originalIndex }))
+        .reverse();
+      return reversedProps.map(({ props, originalIndex }) => (
+        <ButtonIcon
+          key={`end-button-icon-${originalIndex}`}
+          size={ButtonIconSize.Md}
+          {...props}
+        />
+      ));
+    }
+    return null;
+  };
+
+  const hasEndContent =
+    endAccessory || (endButtonIconProps && endButtonIconProps.length > 0);
+
+  const renderLeftSection = () => {
+    if (children != null && children !== undefined) {
+      return children;
+    }
+    if (title != null || titleAccessory != null) {
+      return (
+        <Box
+          flexDirection={BoxFlexDirection.Row}
+          alignItems={BoxAlignItems.Center}
+        >
+          {title != null && title !== '' && (
+            <Text variant={TextVariant.HeadingLg} {...titleProps}>
+              {title}
+            </Text>
+          )}
+          {titleAccessory}
+        </Box>
+      );
+    }
+    return null;
+  };
+
+  return (
+    <View
+      style={[
+        tw.style(
+          `flex-row items-center gap-4 min-h-14 pl-4 pr-2 ${twClassName ?? ''}`.trim(),
+        ),
+        includesTopInset && { marginTop: insets.top },
+        style,
+      ]}
+      testID={testID}
+      {...viewProps}
+    >
+      <Box twClassName="flex-1 items-start">{renderLeftSection()}</Box>
+      {hasEndContent && (
+        <Box twClassName="flex-row gap-2">{renderEndContent()}</Box>
+      )}
+    </View>
+  );
+};
+
+export default HeaderRoot;
diff --git a/app/component-library/components-temp/HeaderRoot/HeaderRoot.types.ts b/app/component-library/components-temp/HeaderRoot/HeaderRoot.types.ts
new file mode 100644
index 000000000000..968a4199f5df
--- /dev/null
+++ b/app/component-library/components-temp/HeaderRoot/HeaderRoot.types.ts
@@ -0,0 +1,63 @@
+// Third party dependencies.
+import { ViewProps, StyleProp, ViewStyle } from 'react-native';
+import { ReactNode } from 'react';
+
+// External dependencies.
+import {
+  ButtonIconProps,
+  TextProps,
+} from '@metamask/design-system-react-native';
+
+/**
+ * HeaderRoot component props.
+ * Left section renders either children or a title row (mutually exclusive).
+ * End section matches HeaderBase (endAccessory or endButtonIconProps).
+ */
+export interface HeaderRootProps extends ViewProps {
+  /**
+   * Optional custom content for the left section.
+   * When provided, title/titleAccessory are not rendered (mutually exclusive).
+   */
+  children?: ReactNode;
+  /**
+   * Optional content displayed after the title in the title row.
+   * Only used when children is not provided and title or titleAccessory is set.
+   */
+  titleAccessory?: ReactNode;
+  /**
+   * Optional main title text, rendered with TextVariant.HeadingLg.
+   * Only used when children is not provided.
+   */
+  title?: string;
+  /**
+   * Optional props to pass to the title Text component.
+   */
+  titleProps?: Partial<TextProps>;
+  /**
+   * Optional content to be displayed in the end section.
+   * Takes priority over endButtonIconProps if both are provided.
+   */
+  endAccessory?: ReactNode;
+  /**
+   * Optional array of ButtonIcon props to render multiple ButtonIcons as end accessories.
+   * Rendered in reverse order (first item appears rightmost).
+   * Only used if endAccessory is not provided.
+   */
+  endButtonIconProps?: ButtonIconProps[];
+  /**
+   * Optional prop to include the top inset so the header is visible below the device safe area.
+   */
+  includesTopInset?: boolean;
+  /**
+   * Optional style for the header container.
+   */
+  style?: StyleProp<ViewStyle>;
+  /**
+   * Optional test ID for the header container.
+   */
+  testID?: string;
+  /**
+   * Optional Tailwind class names for the header container.
+   */
+  twClassName?: string;
+}
diff --git a/app/component-library/components-temp/HeaderRoot/index.ts b/app/component-library/components-temp/HeaderRoot/index.ts
new file mode 100644
index 000000000000..baa9d3f03ed4
--- /dev/null
+++ b/app/component-library/components-temp/HeaderRoot/index.ts
@@ -0,0 +1,2 @@
+export { default } from './HeaderRoot';
+export type { HeaderRootProps } from './HeaderRoot.types';
diff --git a/app/component-library/components-temp/HeaderCompactSearch/HeaderCompactSearch.stories.tsx b/app/component-library/components-temp/HeaderSearch/HeaderSearch.stories.tsx
similarity index 64%
rename from app/component-library/components-temp/HeaderCompactSearch/HeaderCompactSearch.stories.tsx
rename to app/component-library/components-temp/HeaderSearch/HeaderSearch.stories.tsx
index b8aa3823018c..8c598a4fb700 100644
--- a/app/component-library/components-temp/HeaderCompactSearch/HeaderCompactSearch.stories.tsx
+++ b/app/component-library/components-temp/HeaderSearch/HeaderSearch.stories.tsx
@@ -1,19 +1,16 @@
 /* eslint-disable no-console */
 import React, { useState } from 'react';
 
-import HeaderCompactSearch from './HeaderCompactSearch';
-import { HeaderCompactSearchVariant } from './HeaderCompactSearch.types';
+import HeaderSearch from './HeaderSearch';
+import { HeaderSearchVariant } from './HeaderSearch.types';
 
-const HeaderCompactSearchMeta = {
-  title: 'Components Temp / HeaderCompactSearch',
-  component: HeaderCompactSearch,
+const HeaderSearchMeta = {
+  title: 'Components Temp / HeaderSearch',
+  component: HeaderSearch,
   argTypes: {
     variant: {
       control: 'select',
-      options: [
-        HeaderCompactSearchVariant.Screen,
-        HeaderCompactSearchVariant.Inline,
-      ],
+      options: [HeaderSearchVariant.Screen, HeaderSearchVariant.Inline],
     },
     twClassName: {
       control: 'text',
@@ -21,13 +18,13 @@ const HeaderCompactSearchMeta = {
   },
 };
 
-export default HeaderCompactSearchMeta;
+export default HeaderSearchMeta;
 
 const ScreenStory = () => {
   const [value, setValue] = useState('');
   return (
-    <HeaderCompactSearch
-      variant={HeaderCompactSearchVariant.Screen}
+    <HeaderSearch
+      variant={HeaderSearchVariant.Screen}
       onPressBackButton={() => console.log('Back pressed')}
       textFieldSearchProps={{
         value,
@@ -46,8 +43,8 @@ export const Screen = {
 const InlineStory = () => {
   const [value, setValue] = useState('');
   return (
-    <HeaderCompactSearch
-      variant={HeaderCompactSearchVariant.Inline}
+    <HeaderSearch
+      variant={HeaderSearchVariant.Inline}
       onPressCancelButton={() => console.log('Cancel pressed')}
       textFieldSearchProps={{
         value,
diff --git a/app/component-library/components-temp/HeaderCompactSearch/HeaderCompactSearch.test.tsx b/app/component-library/components-temp/HeaderSearch/HeaderSearch.test.tsx
similarity index 78%
rename from app/component-library/components-temp/HeaderCompactSearch/HeaderCompactSearch.test.tsx
rename to app/component-library/components-temp/HeaderSearch/HeaderSearch.test.tsx
index 2facc1e8e03d..42ad489e910e 100644
--- a/app/component-library/components-temp/HeaderCompactSearch/HeaderCompactSearch.test.tsx
+++ b/app/component-library/components-temp/HeaderSearch/HeaderSearch.test.tsx
@@ -6,8 +6,8 @@ import { render, fireEvent } from '@testing-library/react-native';
 import { strings } from '../../../../locales/i18n';
 
 // Internal dependencies.
-import HeaderCompactSearch from './HeaderCompactSearch';
-import { HeaderCompactSearchVariant } from './HeaderCompactSearch.types';
+import HeaderSearch from './HeaderSearch';
+import { HeaderSearchVariant } from './HeaderSearch.types';
 
 const mockTextFieldSearchProps = {
   value: '',
@@ -16,7 +16,7 @@ const mockTextFieldSearchProps = {
   placeholder: 'Search...',
 };
 
-describe('HeaderCompactSearch', () => {
+describe('HeaderSearch', () => {
   beforeEach(() => {
     jest.clearAllMocks();
   });
@@ -25,8 +25,8 @@ describe('HeaderCompactSearch', () => {
     it('renders correctly with screen variant', () => {
       const onPressBackButton = jest.fn();
       const { getByTestId } = render(
-        <HeaderCompactSearch
-          variant={HeaderCompactSearchVariant.Screen}
+        <HeaderSearch
+          variant={HeaderSearchVariant.Screen}
           onPressBackButton={onPressBackButton}
           textFieldSearchProps={mockTextFieldSearchProps}
           backButtonProps={{ testID: 'back-button' }}
@@ -39,22 +39,22 @@ describe('HeaderCompactSearch', () => {
     it('renders with testID', () => {
       const onPressBackButton = jest.fn();
       const { getByTestId } = render(
-        <HeaderCompactSearch
-          variant={HeaderCompactSearchVariant.Screen}
+        <HeaderSearch
+          variant={HeaderSearchVariant.Screen}
           onPressBackButton={onPressBackButton}
           textFieldSearchProps={mockTextFieldSearchProps}
-          testID="header-compact-search"
+          testID="header-search"
         />,
       );
 
-      expect(getByTestId('header-compact-search')).toBeOnTheScreen();
+      expect(getByTestId('header-search')).toBeOnTheScreen();
     });
 
     it('calls onPressBackButton when back button is pressed', () => {
       const onPressBackButton = jest.fn();
       const { getByTestId } = render(
-        <HeaderCompactSearch
-          variant={HeaderCompactSearchVariant.Screen}
+        <HeaderSearch
+          variant={HeaderSearchVariant.Screen}
           onPressBackButton={onPressBackButton}
           textFieldSearchProps={mockTextFieldSearchProps}
           backButtonProps={{ testID: 'back-button' }}
@@ -69,8 +69,8 @@ describe('HeaderCompactSearch', () => {
     it('forwards backButtonProps to ButtonIcon', () => {
       const onPressBackButton = jest.fn();
       const { getByTestId } = render(
-        <HeaderCompactSearch
-          variant={HeaderCompactSearchVariant.Screen}
+        <HeaderSearch
+          variant={HeaderSearchVariant.Screen}
           onPressBackButton={onPressBackButton}
           textFieldSearchProps={mockTextFieldSearchProps}
           backButtonProps={{ testID: 'custom-back-button' }}
@@ -83,8 +83,8 @@ describe('HeaderCompactSearch', () => {
     it('renders TextFieldSearch with provided props', () => {
       const onPressBackButton = jest.fn();
       const { getByPlaceholderText } = render(
-        <HeaderCompactSearch
-          variant={HeaderCompactSearchVariant.Screen}
+        <HeaderSearch
+          variant={HeaderSearchVariant.Screen}
           onPressBackButton={onPressBackButton}
           textFieldSearchProps={{
             ...mockTextFieldSearchProps,
@@ -101,8 +101,8 @@ describe('HeaderCompactSearch', () => {
     it('renders correctly with inline variant', () => {
       const onPressCancelButton = jest.fn();
       const { getByText } = render(
-        <HeaderCompactSearch
-          variant={HeaderCompactSearchVariant.Inline}
+        <HeaderSearch
+          variant={HeaderSearchVariant.Inline}
           onPressCancelButton={onPressCancelButton}
           textFieldSearchProps={mockTextFieldSearchProps}
         />,
@@ -114,22 +114,22 @@ describe('HeaderCompactSearch', () => {
     it('renders with testID', () => {
       const onPressCancelButton = jest.fn();
       const { getByTestId } = render(
-        <HeaderCompactSearch
-          variant={HeaderCompactSearchVariant.Inline}
+        <HeaderSearch
+          variant={HeaderSearchVariant.Inline}
           onPressCancelButton={onPressCancelButton}
           textFieldSearchProps={mockTextFieldSearchProps}
-          testID="header-compact-search-inline"
+          testID="header-search-inline"
         />,
       );
 
-      expect(getByTestId('header-compact-search-inline')).toBeOnTheScreen();
+      expect(getByTestId('header-search-inline')).toBeOnTheScreen();
     });
 
     it('calls onPressCancelButton when cancel button is pressed', () => {
       const onPressCancelButton = jest.fn();
       const { getByTestId } = render(
-        <HeaderCompactSearch
-          variant={HeaderCompactSearchVariant.Inline}
+        <HeaderSearch
+          variant={HeaderSearchVariant.Inline}
           onPressCancelButton={onPressCancelButton}
           textFieldSearchProps={mockTextFieldSearchProps}
           cancelButtonProps={{ testID: 'cancel-button' }}
@@ -144,8 +144,8 @@ describe('HeaderCompactSearch', () => {
     it('forwards cancelButtonProps to Button', () => {
       const onPressCancelButton = jest.fn();
       const { getByTestId } = render(
-        <HeaderCompactSearch
-          variant={HeaderCompactSearchVariant.Inline}
+        <HeaderSearch
+          variant={HeaderSearchVariant.Inline}
           onPressCancelButton={onPressCancelButton}
           textFieldSearchProps={mockTextFieldSearchProps}
           cancelButtonProps={{ testID: 'custom-cancel-button' }}
@@ -158,8 +158,8 @@ describe('HeaderCompactSearch', () => {
     it('renders TextFieldSearch with provided props', () => {
       const onPressCancelButton = jest.fn();
       const { getByPlaceholderText } = render(
-        <HeaderCompactSearch
-          variant={HeaderCompactSearchVariant.Inline}
+        <HeaderSearch
+          variant={HeaderSearchVariant.Inline}
           onPressCancelButton={onPressCancelButton}
           textFieldSearchProps={{
             ...mockTextFieldSearchProps,
@@ -176,8 +176,8 @@ describe('HeaderCompactSearch', () => {
     it('forwards twClassName to container for screen variant', () => {
       const onPressBackButton = jest.fn();
       const { getByTestId } = render(
-        <HeaderCompactSearch
-          variant={HeaderCompactSearchVariant.Screen}
+        <HeaderSearch
+          variant={HeaderSearchVariant.Screen}
           onPressBackButton={onPressBackButton}
           textFieldSearchProps={mockTextFieldSearchProps}
           testID="container"
@@ -191,8 +191,8 @@ describe('HeaderCompactSearch', () => {
     it('forwards twClassName to container for inline variant', () => {
       const onPressCancelButton = jest.fn();
       const { getByTestId } = render(
-        <HeaderCompactSearch
-          variant={HeaderCompactSearchVariant.Inline}
+        <HeaderSearch
+          variant={HeaderSearchVariant.Inline}
           onPressCancelButton={onPressCancelButton}
           textFieldSearchProps={mockTextFieldSearchProps}
           testID="container"
diff --git a/app/component-library/components-temp/HeaderCompactSearch/HeaderCompactSearch.tsx b/app/component-library/components-temp/HeaderSearch/HeaderSearch.tsx
similarity index 80%
rename from app/component-library/components-temp/HeaderCompactSearch/HeaderCompactSearch.tsx
rename to app/component-library/components-temp/HeaderSearch/HeaderSearch.tsx
index 8f865867387d..e6a7b130bbd1 100644
--- a/app/component-library/components-temp/HeaderCompactSearch/HeaderCompactSearch.tsx
+++ b/app/component-library/components-temp/HeaderSearch/HeaderSearch.tsx
@@ -16,20 +16,20 @@ import { strings } from '../../../../locales/i18n';
 import TextFieldSearch from '../../components/Form/TextFieldSearch';
 import { TextFieldSearchProps } from '../../components/Form/TextFieldSearch/TextFieldSearch.types';
 import {
-  HeaderCompactSearchInlineProps,
-  HeaderCompactSearchProps,
-  HeaderCompactSearchScreenProps,
-  HeaderCompactSearchVariant,
-} from './HeaderCompactSearch.types';
+  HeaderSearchInlineProps,
+  HeaderSearchProps,
+  HeaderSearchScreenProps,
+  HeaderSearchVariant,
+} from './HeaderSearch.types';
 
 /**
- * HeaderCompactSearch is a header component that combines a search field
+ * HeaderSearch is a header component that combines a search field
  * with either a back button (screen variant) or cancel button (inline variant).
  *
  * @example
  * // Screen variant with back button
- * <HeaderCompactSearch
- *   variant={HeaderCompactSearchVariant.Screen}
+ * <HeaderSearch
+ *   variant={HeaderSearchVariant.Screen}
  *   onPressBackButton={handleBack}
  *   textFieldSearchProps={{
  *     value: searchText,
@@ -41,8 +41,8 @@ import {
  *
  * @example
  * // Inline variant with cancel button
- * <HeaderCompactSearch
- *   variant={HeaderCompactSearchVariant.Inline}
+ * <HeaderSearch
+ *   variant={HeaderSearchVariant.Inline}
  *   onPressCancelButton={handleCancel}
  *   textFieldSearchProps={{
  *     value: searchText,
@@ -52,7 +52,7 @@ import {
  *   }}
  * />
  */
-const HeaderCompactSearch: React.FC<HeaderCompactSearchProps> = (props) => {
+const HeaderSearch: React.FC<HeaderSearchProps> = (props) => {
   const {
     variant,
     textFieldSearchProps,
@@ -62,11 +62,11 @@ const HeaderCompactSearch: React.FC<HeaderCompactSearchProps> = (props) => {
 
   const baseTwClassName = 'h-14 flex-row items-center';
 
-  if (variant === HeaderCompactSearchVariant.Screen) {
+  if (variant === HeaderSearchVariant.Screen) {
     const { onPressBackButton, backButtonProps } =
-      props as HeaderCompactSearchScreenProps;
+      props as HeaderSearchScreenProps;
     const screenBoxProps = boxProps as Omit<
-      HeaderCompactSearchScreenProps,
+      HeaderSearchScreenProps,
       | 'variant'
       | 'textFieldSearchProps'
       | 'twClassName'
@@ -98,9 +98,9 @@ const HeaderCompactSearch: React.FC<HeaderCompactSearchProps> = (props) => {
 
   // Inline variant
   const { onPressCancelButton, cancelButtonProps } =
-    props as HeaderCompactSearchInlineProps;
+    props as HeaderSearchInlineProps;
   const inlineBoxProps = boxProps as Omit<
-    HeaderCompactSearchInlineProps,
+    HeaderSearchInlineProps,
     | 'variant'
     | 'textFieldSearchProps'
     | 'twClassName'
@@ -133,4 +133,4 @@ const HeaderCompactSearch: React.FC<HeaderCompactSearchProps> = (props) => {
   );
 };
 
-export default HeaderCompactSearch;
+export default HeaderSearch;
diff --git a/app/component-library/components-temp/HeaderCompactSearch/HeaderCompactSearch.types.ts b/app/component-library/components-temp/HeaderSearch/HeaderSearch.types.ts
similarity index 67%
rename from app/component-library/components-temp/HeaderCompactSearch/HeaderCompactSearch.types.ts
rename to app/component-library/components-temp/HeaderSearch/HeaderSearch.types.ts
index 37d199527d1e..83b94795dbf5 100644
--- a/app/component-library/components-temp/HeaderCompactSearch/HeaderCompactSearch.types.ts
+++ b/app/component-library/components-temp/HeaderSearch/HeaderSearch.types.ts
@@ -9,9 +9,9 @@ import {
 import { TextFieldSearchProps } from '../../components/Form/TextFieldSearch/TextFieldSearch.types';
 
 /**
- * Variant enum for HeaderCompactSearch component.
+ * Variant enum for HeaderSearch component.
  */
-export enum HeaderCompactSearchVariant {
+export enum HeaderSearchVariant {
   Screen = 'screen',
   Inline = 'inline',
 }
@@ -19,7 +19,7 @@ export enum HeaderCompactSearchVariant {
 /**
  * Base props shared by both variants - extends BoxProps.
  */
-interface HeaderCompactSearchBaseProps extends Omit<BoxProps, 'children'> {
+interface HeaderSearchBaseProps extends Omit<BoxProps, 'children'> {
   /**
    * Props to pass to the TextFieldSearch component.
    */
@@ -30,12 +30,11 @@ interface HeaderCompactSearchBaseProps extends Omit<BoxProps, 'children'> {
  * Screen variant props.
  * Renders a back button (ArrowLeft) on the left side.
  */
-export interface HeaderCompactSearchScreenProps
-  extends HeaderCompactSearchBaseProps {
+export interface HeaderSearchScreenProps extends HeaderSearchBaseProps {
   /**
    * The variant of the component.
    */
-  variant: HeaderCompactSearchVariant.Screen;
+  variant: HeaderSearchVariant.Screen;
   /**
    * Callback when the back button is pressed.
    */
@@ -50,12 +49,11 @@ export interface HeaderCompactSearchScreenProps
  * Inline variant props.
  * Renders a cancel button on the right side.
  */
-export interface HeaderCompactSearchInlineProps
-  extends HeaderCompactSearchBaseProps {
+export interface HeaderSearchInlineProps extends HeaderSearchBaseProps {
   /**
    * The variant of the component.
    */
-  variant: HeaderCompactSearchVariant.Inline;
+  variant: HeaderSearchVariant.Inline;
   /**
    * Callback when the cancel button is pressed.
    */
@@ -67,8 +65,8 @@ export interface HeaderCompactSearchInlineProps
 }
 
 /**
- * HeaderCompactSearch component props.
+ * HeaderSearch component props.
  */
-export type HeaderCompactSearchProps =
-  | HeaderCompactSearchScreenProps
-  | HeaderCompactSearchInlineProps;
+export type HeaderSearchProps =
+  | HeaderSearchScreenProps
+  | HeaderSearchInlineProps;
diff --git a/app/component-library/components-temp/HeaderSearch/index.ts b/app/component-library/components-temp/HeaderSearch/index.ts
new file mode 100644
index 000000000000..81ba7adaf70c
--- /dev/null
+++ b/app/component-library/components-temp/HeaderSearch/index.ts
@@ -0,0 +1,7 @@
+export { default } from './HeaderSearch';
+export {
+  HeaderSearchVariant,
+  type HeaderSearchProps,
+  type HeaderSearchScreenProps,
+  type HeaderSearchInlineProps,
+} from './HeaderSearch.types';
diff --git a/app/component-library/components-temp/HeaderStackedStandard/HeaderStackedStandard.stories.tsx b/app/component-library/components-temp/HeaderStackedStandard/HeaderStackedStandard.stories.tsx
deleted file mode 100644
index 4e761694fec2..000000000000
--- a/app/component-library/components-temp/HeaderStackedStandard/HeaderStackedStandard.stories.tsx
+++ /dev/null
@@ -1,142 +0,0 @@
-/* eslint-disable no-console */
-import React from 'react';
-
-import {
-  Box,
-  Text,
-  TextVariant,
-  IconName,
-} from '@metamask/design-system-react-native';
-
-import HeaderStackedStandard from './HeaderStackedStandard';
-
-const HeaderStackedStandardMeta = {
-  title: 'Components Temp / HeaderStackedStandard',
-  component: HeaderStackedStandard,
-  argTypes: {
-    twClassName: {
-      control: 'text',
-    },
-  },
-};
-
-export default HeaderStackedStandardMeta;
-
-export const Default = {
-  args: {
-    titleStandardProps: {
-      topLabel: 'Send',
-      title: '$4.42',
-    },
-  },
-};
-
-export const OnBack = {
-  render: () => (
-    <HeaderStackedStandard
-      onBack={() => console.log('Back pressed')}
-      titleStandardProps={{
-        topLabel: 'Send',
-        title: '$4.42',
-      }}
-    />
-  ),
-};
-
-export const WithBottomLabel = {
-  render: () => (
-    <HeaderStackedStandard
-      onBack={() => console.log('Back pressed')}
-      titleStandardProps={{
-        topLabel: 'Send',
-        title: '$4.42',
-        bottomLabel: '0.002 ETH',
-      }}
-    />
-  ),
-};
-
-export const OnClose = {
-  render: () => (
-    <HeaderStackedStandard
-      onClose={() => console.log('Close pressed')}
-      titleStandardProps={{
-        topLabel: 'Send',
-        title: '$4.42',
-      }}
-    />
-  ),
-};
-
-export const BackAndClose = {
-  render: () => (
-    <HeaderStackedStandard
-      onBack={() => console.log('Back pressed')}
-      onClose={() => console.log('Close pressed')}
-      titleStandardProps={{
-        topLabel: 'Send',
-        title: '$4.42',
-      }}
-    />
-  ),
-};
-
-export const EndButtonIconProps = {
-  render: () => (
-    <HeaderStackedStandard
-      onBack={() => console.log('Back pressed')}
-      endButtonIconProps={[
-        {
-          iconName: IconName.Close,
-          onPress: () => console.log('Close pressed'),
-        },
-      ]}
-      titleStandardProps={{
-        topLabel: 'Send',
-        title: '$4.42',
-      }}
-    />
-  ),
-};
-
-export const BackButtonProps = {
-  render: () => (
-    <HeaderStackedStandard
-      backButtonProps={{
-        onPress: () => console.log('Custom back pressed'),
-      }}
-      titleStandardProps={{
-        topLabel: 'Receive',
-        title: '$1,234.56',
-      }}
-    />
-  ),
-};
-
-export const TitleStandard = {
-  render: () => (
-    <HeaderStackedStandard
-      onBack={() => console.log('Back pressed')}
-      titleStandard={
-        <Box twClassName="px-4 py-2">
-          <Text variant={TextVariant.HeadingMd}>Custom Title Section</Text>
-          <Text variant={TextVariant.BodySm}>
-            This is a completely custom title section
-          </Text>
-        </Box>
-      }
-    />
-  ),
-};
-
-export const NoBackButton = {
-  render: () => (
-    <HeaderStackedStandard
-      titleStandardProps={{
-        topLabel: 'Account Balance',
-        title: '$12,345.67',
-        bottomLabel: '+$123.45 (1.2%)',
-      }}
-    />
-  ),
-};
diff --git a/app/component-library/components-temp/HeaderStackedStandard/HeaderStackedStandard.test.tsx b/app/component-library/components-temp/HeaderStackedStandard/HeaderStackedStandard.test.tsx
deleted file mode 100644
index fff7569e17f1..000000000000
--- a/app/component-library/components-temp/HeaderStackedStandard/HeaderStackedStandard.test.tsx
+++ /dev/null
@@ -1,303 +0,0 @@
-// Third party dependencies.
-import React from 'react';
-import { render, fireEvent } from '@testing-library/react-native';
-import { Text, IconName } from '@metamask/design-system-react-native';
-
-// Internal dependencies.
-import HeaderStackedStandard from './HeaderStackedStandard';
-
-const TEST_IDS = {
-  CONTAINER: 'header-stacked-standard-container',
-  TITLE_SECTION: 'header-stacked-standard-title-section',
-  BACK_BUTTON: 'header-stacked-standard-back-button',
-  CLOSE_BUTTON: 'header-stacked-standard-close-button',
-  TITLE_STANDARD: 'title-standard',
-  HEADER_BASE_END_ACCESSORY: 'header-base-end-accessory',
-};
-
-describe('HeaderStackedStandard', () => {
-  beforeEach(() => {
-    jest.clearAllMocks();
-  });
-
-  describe('rendering', () => {
-    it('renders container with correct testID', () => {
-      const { getByTestId } = render(
-        <HeaderStackedStandard
-          testID={TEST_IDS.CONTAINER}
-          titleStandardProps={{ title: 'Test' }}
-        />,
-      );
-
-      expect(getByTestId(TEST_IDS.CONTAINER)).toBeOnTheScreen();
-    });
-
-    it('renders title section when titleStandardProps provided', () => {
-      const { getByTestId } = render(
-        <HeaderStackedStandard
-          titleSectionTestID={TEST_IDS.TITLE_SECTION}
-          titleStandardProps={{ title: '$4.42' }}
-        />,
-      );
-
-      expect(getByTestId(TEST_IDS.TITLE_SECTION)).toBeOnTheScreen();
-    });
-
-    it('renders TitleStandard with props when titleStandardProps provided', () => {
-      const { getByText, getByTestId } = render(
-        <HeaderStackedStandard
-          titleStandardProps={{
-            topLabel: 'Send',
-            title: '$4.42',
-            testID: TEST_IDS.TITLE_STANDARD,
-          }}
-        />,
-      );
-
-      expect(getByText('Send')).toBeOnTheScreen();
-      expect(getByText('$4.42')).toBeOnTheScreen();
-      expect(getByTestId(TEST_IDS.TITLE_STANDARD)).toBeOnTheScreen();
-    });
-
-    it('renders custom titleStandard node when provided', () => {
-      const { getByText } = render(
-        <HeaderStackedStandard
-          titleStandard={<Text>Custom Title Section</Text>}
-        />,
-      );
-
-      expect(getByText('Custom Title Section')).toBeOnTheScreen();
-    });
-
-    it('titleStandard takes priority over titleStandardProps', () => {
-      const { getByText, queryByText } = render(
-        <HeaderStackedStandard
-          titleStandard={<Text>Custom Node</Text>}
-          titleStandardProps={{ title: 'Props Title' }}
-        />,
-      );
-
-      expect(getByText('Custom Node')).toBeOnTheScreen();
-      expect(queryByText('Props Title')).toBeNull();
-    });
-
-    it('does not render title section when neither titleStandard nor titleStandardProps provided', () => {
-      const { queryByTestId } = render(
-        <HeaderStackedStandard
-          onBack={jest.fn()}
-          titleSectionTestID={TEST_IDS.TITLE_SECTION}
-        />,
-      );
-
-      expect(queryByTestId(TEST_IDS.TITLE_SECTION)).toBeNull();
-    });
-  });
-
-  describe('back button', () => {
-    it('renders back button when onBack provided', () => {
-      const { getByTestId } = render(
-        <HeaderStackedStandard
-          onBack={jest.fn()}
-          backButtonProps={{ testID: TEST_IDS.BACK_BUTTON }}
-          titleStandardProps={{ title: 'Test' }}
-        />,
-      );
-
-      expect(getByTestId(TEST_IDS.BACK_BUTTON)).toBeOnTheScreen();
-    });
-
-    it('renders back button when backButtonProps provided', () => {
-      const { getByTestId } = render(
-        <HeaderStackedStandard
-          backButtonProps={{ onPress: jest.fn(), testID: TEST_IDS.BACK_BUTTON }}
-          titleStandardProps={{ title: 'Test' }}
-        />,
-      );
-
-      expect(getByTestId(TEST_IDS.BACK_BUTTON)).toBeOnTheScreen();
-    });
-
-    it('calls onBack when back button pressed', () => {
-      const onBack = jest.fn();
-      const { getByTestId } = render(
-        <HeaderStackedStandard
-          onBack={onBack}
-          backButtonProps={{ testID: TEST_IDS.BACK_BUTTON }}
-          titleStandardProps={{ title: 'Test' }}
-        />,
-      );
-
-      fireEvent.press(getByTestId(TEST_IDS.BACK_BUTTON));
-
-      expect(onBack).toHaveBeenCalledTimes(1);
-    });
-
-    it('calls backButtonProps.onPress when back button pressed', () => {
-      const onPress = jest.fn();
-      const { getByTestId } = render(
-        <HeaderStackedStandard
-          backButtonProps={{ onPress, testID: TEST_IDS.BACK_BUTTON }}
-          titleStandardProps={{ title: 'Test' }}
-        />,
-      );
-
-      fireEvent.press(getByTestId(TEST_IDS.BACK_BUTTON));
-
-      expect(onPress).toHaveBeenCalledTimes(1);
-    });
-
-    it('backButtonProps.onPress takes priority over onBack', () => {
-      const onBack = jest.fn();
-      const onPress = jest.fn();
-      const { getByTestId } = render(
-        <HeaderStackedStandard
-          onBack={onBack}
-          backButtonProps={{ onPress, testID: TEST_IDS.BACK_BUTTON }}
-          titleStandardProps={{ title: 'Test' }}
-        />,
-      );
-
-      fireEvent.press(getByTestId(TEST_IDS.BACK_BUTTON));
-
-      expect(onPress).toHaveBeenCalledTimes(1);
-      expect(onBack).not.toHaveBeenCalled();
-    });
-
-    it('does not render back button when neither onBack nor backButtonProps provided', () => {
-      const { queryByLabelText } = render(
-        <HeaderStackedStandard titleStandardProps={{ title: 'Test' }} />,
-      );
-
-      expect(queryByLabelText('Arrow Left')).toBeNull();
-    });
-  });
-
-  describe('close button', () => {
-    it('renders close button when onClose provided', () => {
-      const { getByTestId } = render(
-        <HeaderStackedStandard
-          onClose={jest.fn()}
-          closeButtonProps={{ testID: TEST_IDS.CLOSE_BUTTON }}
-          titleStandardProps={{ title: 'Test' }}
-        />,
-      );
-
-      expect(getByTestId(TEST_IDS.CLOSE_BUTTON)).toBeOnTheScreen();
-    });
-
-    it('renders close button when closeButtonProps provided', () => {
-      const { getByTestId } = render(
-        <HeaderStackedStandard
-          closeButtonProps={{
-            onPress: jest.fn(),
-            testID: TEST_IDS.CLOSE_BUTTON,
-          }}
-          titleStandardProps={{ title: 'Test' }}
-        />,
-      );
-
-      expect(getByTestId(TEST_IDS.CLOSE_BUTTON)).toBeOnTheScreen();
-    });
-
-    it('calls onClose when close button pressed', () => {
-      const onClose = jest.fn();
-      const { getByTestId } = render(
-        <HeaderStackedStandard
-          onClose={onClose}
-          closeButtonProps={{ testID: TEST_IDS.CLOSE_BUTTON }}
-          titleStandardProps={{ title: 'Test' }}
-        />,
-      );
-
-      fireEvent.press(getByTestId(TEST_IDS.CLOSE_BUTTON));
-
-      expect(onClose).toHaveBeenCalledTimes(1);
-    });
-
-    it('calls closeButtonProps.onPress when close button pressed', () => {
-      const onPress = jest.fn();
-      const { getByTestId } = render(
-        <HeaderStackedStandard
-          closeButtonProps={{ onPress, testID: TEST_IDS.CLOSE_BUTTON }}
-          titleStandardProps={{ title: 'Test' }}
-        />,
-      );
-
-      fireEvent.press(getByTestId(TEST_IDS.CLOSE_BUTTON));
-
-      expect(onPress).toHaveBeenCalledTimes(1);
-    });
-
-    it('closeButtonProps.onPress takes priority over onClose', () => {
-      const onClose = jest.fn();
-      const onPress = jest.fn();
-      const { getByTestId } = render(
-        <HeaderStackedStandard
-          onClose={onClose}
-          closeButtonProps={{ onPress, testID: TEST_IDS.CLOSE_BUTTON }}
-          titleStandardProps={{ title: 'Test' }}
-        />,
-      );
-
-      fireEvent.press(getByTestId(TEST_IDS.CLOSE_BUTTON));
-
-      expect(onPress).toHaveBeenCalledTimes(1);
-      expect(onClose).not.toHaveBeenCalled();
-    });
-
-    it('does not render close button when neither onClose nor closeButtonProps provided', () => {
-      const { queryByLabelText } = render(
-        <HeaderStackedStandard titleStandardProps={{ title: 'Test' }} />,
-      );
-
-      expect(queryByLabelText('Close')).toBeNull();
-    });
-  });
-
-  describe('props forwarding', () => {
-    it('forwards endButtonIconProps to HeaderBase', () => {
-      const { getByTestId } = render(
-        <HeaderStackedStandard
-          onBack={jest.fn()}
-          endButtonIconProps={[
-            {
-              iconName: IconName.Close,
-              onPress: jest.fn(),
-              testID: TEST_IDS.HEADER_BASE_END_ACCESSORY,
-            },
-          ]}
-          titleStandardProps={{ title: 'Test' }}
-        />,
-      );
-
-      expect(getByTestId(TEST_IDS.HEADER_BASE_END_ACCESSORY)).toBeOnTheScreen();
-    });
-
-    it('accepts custom testID', () => {
-      const { getByTestId } = render(
-        <HeaderStackedStandard
-          testID="custom-header"
-          titleStandardProps={{ title: 'Test' }}
-        />,
-      );
-
-      expect(getByTestId('custom-header')).toBeOnTheScreen();
-    });
-
-    it('forwards startButtonIconProps directly when provided', () => {
-      const onPress = jest.fn();
-      const { getByTestId } = render(
-        <HeaderStackedStandard
-          startButtonIconProps={{
-            iconName: IconName.Menu,
-            onPress,
-            testID: 'custom-start-button',
-          }}
-          titleStandardProps={{ title: 'Test' }}
-        />,
-      );
-
-      expect(getByTestId('custom-start-button')).toBeOnTheScreen();
-    });
-  });
-});
diff --git a/app/component-library/components-temp/HeaderStackedStandard/HeaderStackedStandard.tsx b/app/component-library/components-temp/HeaderStackedStandard/HeaderStackedStandard.tsx
deleted file mode 100644
index f07b8b5c8631..000000000000
--- a/app/component-library/components-temp/HeaderStackedStandard/HeaderStackedStandard.tsx
+++ /dev/null
@@ -1,120 +0,0 @@
-// Third party dependencies.
-import React, { useMemo } from 'react';
-
-// External dependencies.
-import {
-  Box,
-  IconName,
-  ButtonIconProps,
-} from '@metamask/design-system-react-native';
-
-// Internal dependencies.
-import HeaderBase from '../../components/HeaderBase';
-import TitleStandard from '../TitleStandard';
-import { HeaderStackedStandardProps } from './HeaderStackedStandard.types';
-
-/**
- * HeaderStackedStandard is a header component that combines HeaderBase (with back button)
- * on top and a TitleStandard section below it.
- *
- * @example
- * ```tsx
- * <HeaderStackedStandard
- *   onBack={handleBack}
- *   titleStandardProps={{
- *     topLabel: "Send",
- *     title: "$4.42",
- *   }}
- * />
- * ```
- */
-const HeaderStackedStandard: React.FC<HeaderStackedStandardProps> = ({
-  onBack,
-  backButtonProps,
-  onClose,
-  closeButtonProps,
-  titleStandard,
-  titleStandardProps,
-  startButtonIconProps,
-  endButtonIconProps,
-  twClassName = '',
-  testID,
-  titleSectionTestID,
-  ...headerBaseProps
-}) => {
-  // Build startButtonIconProps with back button if onBack or backButtonProps is provided
-  const resolvedStartButtonIconProps = useMemo(() => {
-    if (startButtonIconProps) {
-      // If startButtonIconProps is explicitly provided, use it as-is
-      return startButtonIconProps;
-    }
-
-    if (onBack || backButtonProps) {
-      const backProps: ButtonIconProps = {
-        iconName: IconName.ArrowLeft,
-        ...(backButtonProps || {}),
-        onPress: backButtonProps?.onPress ?? onBack,
-      };
-      return backProps;
-    }
-
-    return undefined;
-  }, [startButtonIconProps, onBack, backButtonProps]);
-
-  // Build endButtonIconProps with close button if onClose or closeButtonProps is provided
-  const resolvedEndButtonIconProps = useMemo(() => {
-    const props: ButtonIconProps[] = [];
-
-    if (onClose || closeButtonProps) {
-      const closeProps: ButtonIconProps = {
-        iconName: IconName.Close,
-        ...(closeButtonProps || {}),
-        onPress: closeButtonProps?.onPress ?? onClose,
-      };
-      props.push(closeProps);
-    }
-
-    if (endButtonIconProps) {
-      props.push(...endButtonIconProps);
-    }
-
-    return props.length > 0 ? props : undefined;
-  }, [endButtonIconProps, onClose, closeButtonProps]);
-
-  // Render title section content
-  const renderTitleSection = () => {
-    if (titleStandard) {
-      return titleStandard;
-    }
-    if (titleStandardProps) {
-      return (
-        <TitleStandard
-          {...titleStandardProps}
-          twClassName={`px-4 pt-1 pb-3 ${titleStandardProps?.twClassName ?? ''}`.trim()}
-        />
-      );
-    }
-    return null;
-  };
-
-  const hasTitleSection = titleStandard || titleStandardProps;
-
-  return (
-    <Box testID={testID}>
-      {/* HeaderBase section */}
-      <HeaderBase
-        startButtonIconProps={resolvedStartButtonIconProps}
-        endButtonIconProps={resolvedEndButtonIconProps}
-        {...headerBaseProps}
-        twClassName={`px-2 ${twClassName}`.trim()}
-      />
-
-      {/* TitleStandard section */}
-      {hasTitleSection && (
-        <Box testID={titleSectionTestID}>{renderTitleSection()}</Box>
-      )}
-    </Box>
-  );
-};
-
-export default HeaderStackedStandard;
diff --git a/app/component-library/components-temp/HeaderStackedStandard/HeaderStackedStandard.types.ts b/app/component-library/components-temp/HeaderStackedStandard/HeaderStackedStandard.types.ts
deleted file mode 100644
index 49079c6aa1c6..000000000000
--- a/app/component-library/components-temp/HeaderStackedStandard/HeaderStackedStandard.types.ts
+++ /dev/null
@@ -1,50 +0,0 @@
-// Third party dependencies.
-import { ReactNode } from 'react';
-
-// External dependencies.
-import { ButtonIconProps } from '@metamask/design-system-react-native';
-
-// Internal dependencies.
-import { HeaderBaseProps } from '../../components/HeaderBase';
-import { TitleStandardProps } from '../TitleStandard/TitleStandard.types';
-
-/**
- * HeaderStackedStandard component props.
- */
-export interface HeaderStackedStandardProps
-  extends Omit<HeaderBaseProps, 'children'> {
-  /**
-   * Callback when the back button is pressed.
-   * If provided, a back button will be rendered as startAccessory.
-   */
-  onBack?: () => void;
-  /**
-   * Additional props to pass to the back ButtonIcon.
-   * If provided, a back button will be rendered with these props spread.
-   */
-  backButtonProps?: Omit<ButtonIconProps, 'iconName'>;
-  /**
-   * Callback when the close button is pressed.
-   * If provided, a close button will be added to endButtonIconProps.
-   */
-  onClose?: () => void;
-  /**
-   * Additional props to pass to the close ButtonIcon.
-   * If provided, a close button will be added to endButtonIconProps with these props spread.
-   */
-  closeButtonProps?: Omit<ButtonIconProps, 'iconName'>;
-  /**
-   * Custom node to render in the title section.
-   * If provided, takes priority over titleStandardProps.
-   */
-  titleStandard?: ReactNode;
-  /**
-   * Props to pass to the TitleStandard component.
-   * Only used if titleStandard is not provided.
-   */
-  titleStandardProps?: TitleStandardProps;
-  /**
-   * Test ID for the title section wrapper.
-   */
-  titleSectionTestID?: string;
-}
diff --git a/app/component-library/components-temp/HeaderStackedStandard/index.ts b/app/component-library/components-temp/HeaderStackedStandard/index.ts
deleted file mode 100644
index 2ba19e3f715f..000000000000
--- a/app/component-library/components-temp/HeaderStackedStandard/index.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-export { default } from './HeaderStackedStandard';
-export type { HeaderStackedStandardProps } from './HeaderStackedStandard.types';
diff --git a/app/component-library/components-temp/HeaderStackedSubpage/HeaderStackedSubpage.stories.tsx b/app/component-library/components-temp/HeaderStackedSubpage/HeaderStackedSubpage.stories.tsx
deleted file mode 100644
index 00d5b8019f60..000000000000
--- a/app/component-library/components-temp/HeaderStackedSubpage/HeaderStackedSubpage.stories.tsx
+++ /dev/null
@@ -1,147 +0,0 @@
-/* eslint-disable no-console */
-import React from 'react';
-
-import {
-  Box,
-  Text,
-  TextVariant,
-  IconName,
-} from '@metamask/design-system-react-native';
-
-import { AvatarSize } from '../../components/Avatars/Avatar/Avatar.types';
-import AvatarToken from '../../components/Avatars/Avatar/variants/AvatarToken';
-import { SAMPLE_AVATARTOKEN_PROPS } from '../../components/Avatars/Avatar/variants/AvatarToken/AvatarToken.constants';
-
-import HeaderStackedSubpage from './HeaderStackedSubpage';
-
-const HeaderStackedSubpageMeta = {
-  title: 'Components Temp / HeaderStackedSubpage',
-  component: HeaderStackedSubpage,
-  argTypes: {
-    twClassName: {
-      control: 'text',
-    },
-  },
-};
-
-export default HeaderStackedSubpageMeta;
-
-export const Default = {
-  args: {
-    titleSubpageProps: {
-      title: 'Token Name',
-      bottomLabel: '$1,234.56',
-    },
-  },
-};
-
-export const OnBack = {
-  render: () => (
-    <HeaderStackedSubpage
-      onBack={() => console.log('Back pressed')}
-      titleSubpageProps={{
-        title: 'Token Name',
-        bottomLabel: '$1,234.56',
-      }}
-    />
-  ),
-};
-
-export const WithStartAccessory = {
-  render: () => (
-    <HeaderStackedSubpage
-      onBack={() => console.log('Back pressed')}
-      titleSubpageProps={{
-        startAccessory: (
-          <AvatarToken {...SAMPLE_AVATARTOKEN_PROPS} size={AvatarSize.Lg} />
-        ),
-        title: 'Wrapped Ethereum',
-        bottomLabel: '$3,456.78',
-      }}
-    />
-  ),
-};
-
-export const OnClose = {
-  render: () => (
-    <HeaderStackedSubpage
-      onClose={() => console.log('Close pressed')}
-      titleSubpageProps={{
-        title: 'Token Name',
-        bottomLabel: '$1,234.56',
-      }}
-    />
-  ),
-};
-
-export const BackAndClose = {
-  render: () => (
-    <HeaderStackedSubpage
-      onBack={() => console.log('Back pressed')}
-      onClose={() => console.log('Close pressed')}
-      titleSubpageProps={{
-        title: 'Token Name',
-        bottomLabel: '$1,234.56',
-      }}
-    />
-  ),
-};
-
-export const EndButtonIconProps = {
-  render: () => (
-    <HeaderStackedSubpage
-      onBack={() => console.log('Back pressed')}
-      endButtonIconProps={[
-        {
-          iconName: IconName.Close,
-          onPress: () => console.log('Close pressed'),
-        },
-      ]}
-      titleSubpageProps={{
-        title: 'Token Name',
-        bottomLabel: '$1,234.56',
-      }}
-    />
-  ),
-};
-
-export const BackButtonProps = {
-  render: () => (
-    <HeaderStackedSubpage
-      backButtonProps={{
-        onPress: () => console.log('Custom back pressed'),
-      }}
-      titleSubpageProps={{
-        title: 'Token Name',
-        bottomLabel: '$1,234.56',
-      }}
-    />
-  ),
-};
-
-export const TitleSubpage = {
-  render: () => (
-    <HeaderStackedSubpage
-      onBack={() => console.log('Back pressed')}
-      titleSubpage={
-        <Box twClassName="px-4 py-2">
-          <Text variant={TextVariant.HeadingMd}>Custom Title Section</Text>
-          <Text variant={TextVariant.BodySm}>
-            This is a completely custom title section
-          </Text>
-        </Box>
-      }
-    />
-  ),
-};
-
-export const NoBackButton = {
-  render: () => (
-    <HeaderStackedSubpage
-      titleSubpageProps={{
-        title: 'Token Name',
-        bottomLabel: '+$123.45 (1.2%)',
-      }}
-    />
-  ),
-};
diff --git a/app/component-library/components-temp/HeaderStackedSubpage/HeaderStackedSubpage.test.tsx b/app/component-library/components-temp/HeaderStackedSubpage/HeaderStackedSubpage.test.tsx
deleted file mode 100644
index 25f3475d4fa2..000000000000
--- a/app/component-library/components-temp/HeaderStackedSubpage/HeaderStackedSubpage.test.tsx
+++ /dev/null
@@ -1,303 +0,0 @@
-// Third party dependencies.
-import React from 'react';
-import { render, fireEvent } from '@testing-library/react-native';
-import { Text, IconName } from '@metamask/design-system-react-native';
-
-// Internal dependencies.
-import HeaderStackedSubpage from './HeaderStackedSubpage';
-
-const TEST_IDS = {
-  CONTAINER: 'header-stacked-subpage-container',
-  TITLE_SECTION: 'header-stacked-subpage-title-section',
-  BACK_BUTTON: 'header-stacked-subpage-back-button',
-  CLOSE_BUTTON: 'header-stacked-subpage-close-button',
-  TITLE_SUBPAGE: 'title-subpage',
-  HEADER_BASE_END_ACCESSORY: 'header-base-end-accessory',
-};
-
-describe('HeaderStackedSubpage', () => {
-  beforeEach(() => {
-    jest.clearAllMocks();
-  });
-
-  describe('rendering', () => {
-    it('renders container with correct testID', () => {
-      const { getByTestId } = render(
-        <HeaderStackedSubpage
-          testID={TEST_IDS.CONTAINER}
-          titleSubpageProps={{ title: 'Test' }}
-        />,
-      );
-
-      expect(getByTestId(TEST_IDS.CONTAINER)).toBeOnTheScreen();
-    });
-
-    it('renders title section when titleSubpageProps provided', () => {
-      const { getByTestId } = render(
-        <HeaderStackedSubpage
-          titleSectionTestID={TEST_IDS.TITLE_SECTION}
-          titleSubpageProps={{ title: '$4.42' }}
-        />,
-      );
-
-      expect(getByTestId(TEST_IDS.TITLE_SECTION)).toBeOnTheScreen();
-    });
-
-    it('renders TitleSubpage with props when titleSubpageProps provided', () => {
-      const { getByText, getByTestId } = render(
-        <HeaderStackedSubpage
-          titleSubpageProps={{
-            title: 'Token Name',
-            bottomLabel: '$1,234.56',
-            testID: TEST_IDS.TITLE_SUBPAGE,
-          }}
-        />,
-      );
-
-      expect(getByText('Token Name')).toBeOnTheScreen();
-      expect(getByText('$1,234.56')).toBeOnTheScreen();
-      expect(getByTestId(TEST_IDS.TITLE_SUBPAGE)).toBeOnTheScreen();
-    });
-
-    it('renders custom titleSubpage node when provided', () => {
-      const { getByText } = render(
-        <HeaderStackedSubpage
-          titleSubpage={<Text>Custom Title Section</Text>}
-        />,
-      );
-
-      expect(getByText('Custom Title Section')).toBeOnTheScreen();
-    });
-
-    it('titleSubpage takes priority over titleSubpageProps', () => {
-      const { getByText, queryByText } = render(
-        <HeaderStackedSubpage
-          titleSubpage={<Text>Custom Node</Text>}
-          titleSubpageProps={{ title: 'Props Title' }}
-        />,
-      );
-
-      expect(getByText('Custom Node')).toBeOnTheScreen();
-      expect(queryByText('Props Title')).toBeNull();
-    });
-
-    it('does not render title section when neither titleSubpage nor titleSubpageProps provided', () => {
-      const { queryByTestId } = render(
-        <HeaderStackedSubpage
-          onBack={jest.fn()}
-          titleSectionTestID={TEST_IDS.TITLE_SECTION}
-        />,
-      );
-
-      expect(queryByTestId(TEST_IDS.TITLE_SECTION)).toBeNull();
-    });
-  });
-
-  describe('back button', () => {
-    it('renders back button when onBack provided', () => {
-      const { getByTestId } = render(
-        <HeaderStackedSubpage
-          onBack={jest.fn()}
-          backButtonProps={{ testID: TEST_IDS.BACK_BUTTON }}
-          titleSubpageProps={{ title: 'Test' }}
-        />,
-      );
-
-      expect(getByTestId(TEST_IDS.BACK_BUTTON)).toBeOnTheScreen();
-    });
-
-    it('renders back button when backButtonProps provided', () => {
-      const { getByTestId } = render(
-        <HeaderStackedSubpage
-          backButtonProps={{ onPress: jest.fn(), testID: TEST_IDS.BACK_BUTTON }}
-          titleSubpageProps={{ title: 'Test' }}
-        />,
-      );
-
-      expect(getByTestId(TEST_IDS.BACK_BUTTON)).toBeOnTheScreen();
-    });
-
-    it('calls onBack when back button pressed', () => {
-      const onBack = jest.fn();
-      const { getByTestId } = render(
-        <HeaderStackedSubpage
-          onBack={onBack}
-          backButtonProps={{ testID: TEST_IDS.BACK_BUTTON }}
-          titleSubpageProps={{ title: 'Test' }}
-        />,
-      );
-
-      fireEvent.press(getByTestId(TEST_IDS.BACK_BUTTON));
-
-      expect(onBack).toHaveBeenCalledTimes(1);
-    });
-
-    it('calls backButtonProps.onPress when back button pressed', () => {
-      const onPress = jest.fn();
-      const { getByTestId } = render(
-        <HeaderStackedSubpage
-          backButtonProps={{ onPress, testID: TEST_IDS.BACK_BUTTON }}
-          titleSubpageProps={{ title: 'Test' }}
-        />,
-      );
-
-      fireEvent.press(getByTestId(TEST_IDS.BACK_BUTTON));
-
-      expect(onPress).toHaveBeenCalledTimes(1);
-    });
-
-    it('backButtonProps.onPress takes priority over onBack', () => {
-      const onBack = jest.fn();
-      const onPress = jest.fn();
-      const { getByTestId } = render(
-        <HeaderStackedSubpage
-          onBack={onBack}
-          backButtonProps={{ onPress, testID: TEST_IDS.BACK_BUTTON }}
-          titleSubpageProps={{ title: 'Test' }}
-        />,
-      );
-
-      fireEvent.press(getByTestId(TEST_IDS.BACK_BUTTON));
-
-      expect(onPress).toHaveBeenCalledTimes(1);
-      expect(onBack).not.toHaveBeenCalled();
-    });
-
-    it('does not render back button when neither onBack nor backButtonProps provided', () => {
-      const { queryByLabelText } = render(
-        <HeaderStackedSubpage titleSubpageProps={{ title: 'Test' }} />,
-      );
-
-      expect(queryByLabelText('Arrow Left')).toBeNull();
-    });
-  });
-
-  describe('close button', () => {
-    it('renders close button when onClose provided', () => {
-      const { getByTestId } = render(
-        <HeaderStackedSubpage
-          onClose={jest.fn()}
-          closeButtonProps={{ testID: TEST_IDS.CLOSE_BUTTON }}
-          titleSubpageProps={{ title: 'Test' }}
-        />,
-      );
-
-      expect(getByTestId(TEST_IDS.CLOSE_BUTTON)).toBeOnTheScreen();
-    });
-
-    it('renders close button when closeButtonProps provided', () => {
-      const { getByTestId } = render(
-        <HeaderStackedSubpage
-          closeButtonProps={{
-            onPress: jest.fn(),
-            testID: TEST_IDS.CLOSE_BUTTON,
-          }}
-          titleSubpageProps={{ title: 'Test' }}
-        />,
-      );
-
-      expect(getByTestId(TEST_IDS.CLOSE_BUTTON)).toBeOnTheScreen();
-    });
-
-    it('calls onClose when close button pressed', () => {
-      const onClose = jest.fn();
-      const { getByTestId } = render(
-        <HeaderStackedSubpage
-          onClose={onClose}
-          closeButtonProps={{ testID: TEST_IDS.CLOSE_BUTTON }}
-          titleSubpageProps={{ title: 'Test' }}
-        />,
-      );
-
-      fireEvent.press(getByTestId(TEST_IDS.CLOSE_BUTTON));
-
-      expect(onClose).toHaveBeenCalledTimes(1);
-    });
-
-    it('calls closeButtonProps.onPress when close button pressed', () => {
-      const onPress = jest.fn();
-      const { getByTestId } = render(
-        <HeaderStackedSubpage
-          closeButtonProps={{ onPress, testID: TEST_IDS.CLOSE_BUTTON }}
-          titleSubpageProps={{ title: 'Test' }}
-        />,
-      );
-
-      fireEvent.press(getByTestId(TEST_IDS.CLOSE_BUTTON));
-
-      expect(onPress).toHaveBeenCalledTimes(1);
-    });
-
-    it('closeButtonProps.onPress takes priority over onClose', () => {
-      const onClose = jest.fn();
-      const onPress = jest.fn();
-      const { getByTestId } = render(
-        <HeaderStackedSubpage
-          onClose={onClose}
-          closeButtonProps={{ onPress, testID: TEST_IDS.CLOSE_BUTTON }}
-          titleSubpageProps={{ title: 'Test' }}
-        />,
-      );
-
-      fireEvent.press(getByTestId(TEST_IDS.CLOSE_BUTTON));
-
-      expect(onPress).toHaveBeenCalledTimes(1);
-      expect(onClose).not.toHaveBeenCalled();
-    });
-
-    it('does not render close button when neither onClose nor closeButtonProps provided', () => {
-      const { queryByLabelText } = render(
-        <HeaderStackedSubpage titleSubpageProps={{ title: 'Test' }} />,
-      );
-
-      expect(queryByLabelText('Close')).toBeNull();
-    });
-  });
-
-  describe('props forwarding', () => {
-    it('forwards endButtonIconProps to HeaderBase', () => {
-      const { getByTestId } = render(
-        <HeaderStackedSubpage
-          onBack={jest.fn()}
-          endButtonIconProps={[
-            {
-              iconName: IconName.Close,
-              onPress: jest.fn(),
-              testID: TEST_IDS.HEADER_BASE_END_ACCESSORY,
-            },
-          ]}
-          titleSubpageProps={{ title: 'Test' }}
-        />,
-      );
-
-      expect(getByTestId(TEST_IDS.HEADER_BASE_END_ACCESSORY)).toBeOnTheScreen();
-    });
-
-    it('accepts custom testID', () => {
-      const { getByTestId } = render(
-        <HeaderStackedSubpage
-          testID="custom-header"
-          titleSubpageProps={{ title: 'Test' }}
-        />,
-      );
-
-      expect(getByTestId('custom-header')).toBeOnTheScreen();
-    });
-
-    it('forwards startButtonIconProps directly when provided', () => {
-      const onPress = jest.fn();
-      const { getByTestId } = render(
-        <HeaderStackedSubpage
-          startButtonIconProps={{
-            iconName: IconName.Menu,
-            onPress,
-            testID: 'custom-start-button',
-          }}
-          titleSubpageProps={{ title: 'Test' }}
-        />,
-      );
-
-      expect(getByTestId('custom-start-button')).toBeOnTheScreen();
-    });
-  });
-});
diff --git a/app/component-library/components-temp/HeaderStackedSubpage/HeaderStackedSubpage.tsx b/app/component-library/components-temp/HeaderStackedSubpage/HeaderStackedSubpage.tsx
deleted file mode 100644
index 4a57e2af87a0..000000000000
--- a/app/component-library/components-temp/HeaderStackedSubpage/HeaderStackedSubpage.tsx
+++ /dev/null
@@ -1,120 +0,0 @@
-// Third party dependencies.
-import React, { useMemo } from 'react';
-
-// External dependencies.
-import {
-  Box,
-  IconName,
-  ButtonIconProps,
-} from '@metamask/design-system-react-native';
-
-// Internal dependencies.
-import HeaderBase from '../../components/HeaderBase';
-import TitleSubpage from '../TitleSubpage';
-import { HeaderStackedSubpageProps } from './HeaderStackedSubpage.types';
-
-/**
- * HeaderStackedSubpage is a header component that combines HeaderBase (with back button)
- * on top and a TitleSubpage section below it.
- *
- * @example
- * ```tsx
- * <HeaderStackedSubpage
- *   onBack={handleBack}
- *   titleSubpageProps={{
- *     title: "Token Name",
- *     bottomLabel: "$1,234.56",
- *   }}
- * />
- * ```
- */
-const HeaderStackedSubpage: React.FC<HeaderStackedSubpageProps> = ({
-  onBack,
-  backButtonProps,
-  onClose,
-  closeButtonProps,
-  titleSubpage,
-  titleSubpageProps,
-  startButtonIconProps,
-  endButtonIconProps,
-  twClassName = '',
-  testID,
-  titleSectionTestID,
-  ...headerBaseProps
-}) => {
-  // Build startButtonIconProps with back button if onBack or backButtonProps is provided
-  const resolvedStartButtonIconProps = useMemo(() => {
-    if (startButtonIconProps) {
-      // If startButtonIconProps is explicitly provided, use it as-is
-      return startButtonIconProps;
-    }
-
-    if (onBack || backButtonProps) {
-      const backProps: ButtonIconProps = {
-        iconName: IconName.ArrowLeft,
-        ...(backButtonProps || {}),
-        onPress: backButtonProps?.onPress ?? onBack,
-      };
-      return backProps;
-    }
-
-    return undefined;
-  }, [startButtonIconProps, onBack, backButtonProps]);
-
-  // Build endButtonIconProps with close button if onClose or closeButtonProps is provided
-  const resolvedEndButtonIconProps = useMemo(() => {
-    const props: ButtonIconProps[] = [];
-
-    if (onClose || closeButtonProps) {
-      const closeProps: ButtonIconProps = {
-        iconName: IconName.Close,
-        ...(closeButtonProps || {}),
-        onPress: closeButtonProps?.onPress ?? onClose,
-      };
-      props.push(closeProps);
-    }
-
-    if (endButtonIconProps) {
-      props.push(...endButtonIconProps);
-    }
-
-    return props.length > 0 ? props : undefined;
-  }, [endButtonIconProps, onClose, closeButtonProps]);
-
-  // Render title section content
-  const renderTitleSection = () => {
-    if (titleSubpage) {
-      return titleSubpage;
-    }
-    if (titleSubpageProps) {
-      return (
-        <TitleSubpage
-          {...titleSubpageProps}
-          twClassName={`px-4 pt-1 pb-3 ${titleSubpageProps?.twClassName ?? ''}`.trim()}
-        />
-      );
-    }
-    return null;
-  };
-
-  const hasTitleSection = titleSubpage || titleSubpageProps;
-
-  return (
-    <Box testID={testID}>
-      {/* HeaderBase section */}
-      <HeaderBase
-        startButtonIconProps={resolvedStartButtonIconProps}
-        endButtonIconProps={resolvedEndButtonIconProps}
-        {...headerBaseProps}
-        twClassName={`px-2 ${twClassName}`.trim()}
-      />
-
-      {/* TitleSubpage section */}
-      {hasTitleSection && (
-        <Box testID={titleSectionTestID}>{renderTitleSection()}</Box>
-      )}
-    </Box>
-  );
-};
-
-export default HeaderStackedSubpage;
diff --git a/app/component-library/components-temp/HeaderStackedSubpage/HeaderStackedSubpage.types.ts b/app/component-library/components-temp/HeaderStackedSubpage/HeaderStackedSubpage.types.ts
deleted file mode 100644
index 393195650f4d..000000000000
--- a/app/component-library/components-temp/HeaderStackedSubpage/HeaderStackedSubpage.types.ts
+++ /dev/null
@@ -1,50 +0,0 @@
-// Third party dependencies.
-import { ReactNode } from 'react';
-
-// External dependencies.
-import { ButtonIconProps } from '@metamask/design-system-react-native';
-
-// Internal dependencies.
-import { HeaderBaseProps } from '../../components/HeaderBase';
-import { TitleSubpageProps } from '../TitleSubpage/TitleSubpage.types';
-
-/**
- * HeaderStackedSubpage component props.
- */
-export interface HeaderStackedSubpageProps
-  extends Omit<HeaderBaseProps, 'children'> {
-  /**
-   * Callback when the back button is pressed.
-   * If provided, a back button will be rendered as startAccessory.
-   */
-  onBack?: () => void;
-  /**
-   * Additional props to pass to the back ButtonIcon.
-   * If provided, a back button will be rendered with these props spread.
-   */
-  backButtonProps?: Omit<ButtonIconProps, 'iconName'>;
-  /**
-   * Callback when the close button is pressed.
-   * If provided, a close button will be added to endButtonIconProps.
-   */
-  onClose?: () => void;
-  /**
-   * Additional props to pass to the close ButtonIcon.
-   * If provided, a close button will be added to endButtonIconProps with these props spread.
-   */
-  closeButtonProps?: Omit<ButtonIconProps, 'iconName'>;
-  /**
-   * Custom node to render in the title section.
-   * If provided, takes priority over titleSubpageProps.
-   */
-  titleSubpage?: ReactNode;
-  /**
-   * Props to pass to the TitleSubpage component.
-   * Only used if titleSubpage is not provided.
-   */
-  titleSubpageProps?: TitleSubpageProps;
-  /**
-   * Test ID for the title section wrapper.
-   */
-  titleSectionTestID?: string;
-}
diff --git a/app/component-library/components-temp/HeaderStackedSubpage/index.ts b/app/component-library/components-temp/HeaderStackedSubpage/index.ts
deleted file mode 100644
index b24ac27d497b..000000000000
--- a/app/component-library/components-temp/HeaderStackedSubpage/index.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-export { default } from './HeaderStackedSubpage';
-export type { HeaderStackedSubpageProps } from './HeaderStackedSubpage.types';
diff --git a/app/component-library/components-temp/HeaderStandardAnimated/HeaderStandardAnimated.stories.tsx b/app/component-library/components-temp/HeaderStandardAnimated/HeaderStandardAnimated.stories.tsx
new file mode 100644
index 000000000000..9bc50872a2c1
--- /dev/null
+++ b/app/component-library/components-temp/HeaderStandardAnimated/HeaderStandardAnimated.stories.tsx
@@ -0,0 +1,113 @@
+/* eslint-disable no-console */
+import React from 'react';
+
+import { Box, Text, TextVariant } from '@metamask/design-system-react-native';
+import Animated from 'react-native-reanimated';
+
+import HeaderStandardAnimated from './HeaderStandardAnimated';
+import useHeaderStandardAnimated from './useHeaderStandardAnimated';
+import TitleStandard from '../TitleStandard';
+
+const HeaderStandardAnimatedMeta = {
+  title: 'Components Temp / HeaderStandardAnimated',
+  component: HeaderStandardAnimated,
+  argTypes: {
+    title: {
+      control: 'text',
+    },
+    subtitle: {
+      control: 'text',
+    },
+    twClassName: {
+      control: 'text',
+    },
+  },
+};
+
+export default HeaderStandardAnimatedMeta;
+
+const SampleContent = ({ itemCount = 20 }: { itemCount?: number }) => (
+  <>
+    {Array.from({ length: itemCount }).map((_, index) => (
+      <Box key={index} twClassName="p-4 mb-2 bg-muted rounded-lg mx-4">
+        <Text variant={TextVariant.BodyMd}>Item {index + 1}</Text>
+        <Text variant={TextVariant.BodySm}>
+          This is sample content to demonstrate scrolling behavior.
+        </Text>
+      </Box>
+    ))}
+  </>
+);
+
+const DefaultStory = () => {
+  const { scrollY, onScroll, setTitleSectionHeight, titleSectionHeightSv } =
+    useHeaderStandardAnimated();
+
+  return (
+    <Box twClassName="flex-1 bg-default">
+      <HeaderStandardAnimated
+        scrollY={scrollY}
+        titleSectionHeight={titleSectionHeightSv}
+        title="Market"
+        onBack={() => console.log('Back pressed')}
+      />
+      <Animated.ScrollView
+        onScroll={onScroll}
+        scrollEventThrottle={16}
+        showsVerticalScrollIndicator={false}
+      >
+        <Box
+          onLayout={(e) => setTitleSectionHeight(e.nativeEvent.layout.height)}
+        >
+          <TitleStandard
+            topLabel="Perps"
+            title="ETH-PERP"
+            twClassName="px-4 pt-1 pb-3"
+          />
+        </Box>
+        <SampleContent />
+      </Animated.ScrollView>
+    </Box>
+  );
+};
+
+const WithSubtitleStory = () => {
+  const { scrollY, onScroll, setTitleSectionHeight, titleSectionHeightSv } =
+    useHeaderStandardAnimated();
+
+  return (
+    <Box twClassName="flex-1 bg-default">
+      <HeaderStandardAnimated
+        scrollY={scrollY}
+        titleSectionHeight={titleSectionHeightSv}
+        title="Market"
+        subtitle="Perpetual futures"
+        onBack={() => console.log('Back pressed')}
+      />
+      <Animated.ScrollView
+        onScroll={onScroll}
+        scrollEventThrottle={16}
+        showsVerticalScrollIndicator={false}
+      >
+        <Box
+          onLayout={(e) => setTitleSectionHeight(e.nativeEvent.layout.height)}
+        >
+          <TitleStandard
+            topLabel="Perps"
+            title="ETH-PERP"
+            twClassName="px-4 pt-1 pb-3"
+          />
+        </Box>
+        <SampleContent />
+      </Animated.ScrollView>
+    </Box>
+  );
+};
+
+export const Default = {
+  render: () => <DefaultStory />,
+};
+
+export const WithSubtitle = {
+  render: () => <WithSubtitleStory />,
+};
diff --git a/app/component-library/components-temp/HeaderStandardAnimated/HeaderStandardAnimated.test.tsx b/app/component-library/components-temp/HeaderStandardAnimated/HeaderStandardAnimated.test.tsx
new file mode 100644
index 000000000000..48e0fa354398
--- /dev/null
+++ b/app/component-library/components-temp/HeaderStandardAnimated/HeaderStandardAnimated.test.tsx
@@ -0,0 +1,349 @@
+// Third party dependencies.
+import React from 'react';
+import { render, fireEvent } from '@testing-library/react-native';
+
+// External dependencies.
+import { IconName } from '@metamask/design-system-react-native';
+import type { SharedValue } from 'react-native-reanimated';
+
+// Internal dependencies.
+import HeaderStandardAnimated from './HeaderStandardAnimated';
+
+jest.mock('react-native-reanimated', () => {
+  const Reanimated = jest.requireActual('react-native-reanimated/mock');
+  Reanimated.useSharedValue = jest.fn((initial: number) => ({
+    value: initial,
+  }));
+  Reanimated.useAnimatedStyle = jest.fn((fn: () => object) => fn());
+  return Reanimated;
+});
+
+jest.mock('react-native-safe-area-context', () => ({
+  useSafeAreaInsets: () => ({ top: 44, bottom: 34, left: 0, right: 0 }),
+}));
+
+const CONTAINER_TEST_ID = 'header-standard-animated-container';
+const TITLE_TEST_ID = 'header-standard-animated-title';
+const SUBTITLE_TEST_ID = 'header-standard-animated-subtitle';
+const BACK_BUTTON_TEST_ID = 'header-standard-animated-back-button';
+const CLOSE_BUTTON_TEST_ID = 'header-standard-animated-close-button';
+
+const createMockSharedValue = (initial: number): SharedValue<number> => {
+  const ref = { value: initial };
+  return {
+    get value() {
+      return ref.value;
+    },
+    set value(v: number) {
+      ref.value = v;
+    },
+    get: () => ref.value,
+    set: (v: number | ((prev: number) => number)) => {
+      ref.value = typeof v === 'function' ? v(ref.value) : v;
+    },
+    addListener: jest.fn(),
+    removeListener: jest.fn(),
+    modify: jest.fn(),
+  };
+};
+
+const defaultProps = {
+  scrollY: createMockSharedValue(0),
+  titleSectionHeight: createMockSharedValue(100),
+};
+
+describe('HeaderStandardAnimated', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  describe('rendering', () => {
+    it('renders with title', () => {
+      const { getByText } = render(
+        <HeaderStandardAnimated {...defaultProps} title="Test Title" />,
+      );
+
+      expect(getByText('Test Title')).toBeOnTheScreen();
+    });
+
+    it('renders title with testID when provided via titleProps', () => {
+      const { getByTestId } = render(
+        <HeaderStandardAnimated
+          {...defaultProps}
+          title="Test Title"
+          titleProps={{ testID: TITLE_TEST_ID }}
+        />,
+      );
+
+      expect(getByTestId(TITLE_TEST_ID)).toBeOnTheScreen();
+    });
+
+    it('renders container with testID when provided', () => {
+      const { getByTestId } = render(
+        <HeaderStandardAnimated
+          {...defaultProps}
+          title="Test Title"
+          testID={CONTAINER_TEST_ID}
+        />,
+      );
+
+      expect(getByTestId(CONTAINER_TEST_ID)).toBeOnTheScreen();
+    });
+
+    it('renders subtitle when provided', () => {
+      const { getByText } = render(
+        <HeaderStandardAnimated
+          {...defaultProps}
+          title="Test Title"
+          subtitle="Test Subtitle"
+        />,
+      );
+
+      expect(getByText('Test Subtitle')).toBeOnTheScreen();
+    });
+
+    it('does not render subtitle when not provided', () => {
+      const { queryByText } = render(
+        <HeaderStandardAnimated {...defaultProps} title="Test Title" />,
+      );
+
+      expect(queryByText('Test Subtitle')).not.toBeOnTheScreen();
+    });
+
+    it('renders subtitle with testID when provided via subtitleProps', () => {
+      const { getByTestId } = render(
+        <HeaderStandardAnimated
+          {...defaultProps}
+          title="Test Title"
+          subtitle="Test Subtitle"
+          subtitleProps={{ testID: SUBTITLE_TEST_ID }}
+        />,
+      );
+
+      expect(getByTestId(SUBTITLE_TEST_ID)).toBeOnTheScreen();
+    });
+
+    it('renders both title and subtitle together', () => {
+      const { getByText } = render(
+        <HeaderStandardAnimated
+          {...defaultProps}
+          title="Main Title"
+          subtitle="Supporting Text"
+        />,
+      );
+
+      expect(getByText('Main Title')).toBeOnTheScreen();
+      expect(getByText('Supporting Text')).toBeOnTheScreen();
+    });
+  });
+
+  describe('back button', () => {
+    it('renders back button when onBack provided', () => {
+      const { getByTestId } = render(
+        <HeaderStandardAnimated
+          {...defaultProps}
+          title="Title"
+          onBack={jest.fn()}
+          backButtonProps={{ testID: BACK_BUTTON_TEST_ID }}
+        />,
+      );
+
+      expect(getByTestId(BACK_BUTTON_TEST_ID)).toBeOnTheScreen();
+    });
+
+    it('renders back button when backButtonProps provided', () => {
+      const { getByTestId } = render(
+        <HeaderStandardAnimated
+          {...defaultProps}
+          title="Title"
+          backButtonProps={{
+            onPress: jest.fn(),
+            testID: BACK_BUTTON_TEST_ID,
+          }}
+        />,
+      );
+
+      expect(getByTestId(BACK_BUTTON_TEST_ID)).toBeOnTheScreen();
+    });
+
+    it('calls onBack when back button pressed', () => {
+      const onBack = jest.fn();
+      const { getByTestId } = render(
+        <HeaderStandardAnimated
+          {...defaultProps}
+          title="Title"
+          onBack={onBack}
+          backButtonProps={{ testID: BACK_BUTTON_TEST_ID }}
+        />,
+      );
+
+      fireEvent.press(getByTestId(BACK_BUTTON_TEST_ID));
+
+      expect(onBack).toHaveBeenCalledTimes(1);
+    });
+
+    it('calls backButtonProps.onPress when back button pressed', () => {
+      const onPress = jest.fn();
+      const { getByTestId } = render(
+        <HeaderStandardAnimated
+          {...defaultProps}
+          title="Title"
+          backButtonProps={{ onPress, testID: BACK_BUTTON_TEST_ID }}
+        />,
+      );
+
+      fireEvent.press(getByTestId(BACK_BUTTON_TEST_ID));
+
+      expect(onPress).toHaveBeenCalledTimes(1);
+    });
+
+    it('uses backButtonProps.onPress over onBack when both provided', () => {
+      const onBack = jest.fn();
+      const onPress = jest.fn();
+      const { getByTestId } = render(
+        <HeaderStandardAnimated
+          {...defaultProps}
+          title="Title"
+          onBack={onBack}
+          backButtonProps={{ onPress, testID: BACK_BUTTON_TEST_ID }}
+        />,
+      );
+
+      fireEvent.press(getByTestId(BACK_BUTTON_TEST_ID));
+
+      expect(onPress).toHaveBeenCalledTimes(1);
+      expect(onBack).not.toHaveBeenCalled();
+    });
+
+    it('renders startButtonIconProps when provided', () => {
+      const onPress = jest.fn();
+      const { getByTestId } = render(
+        <HeaderStandardAnimated
+          {...defaultProps}
+          title="Title"
+          startButtonIconProps={{
+            iconName: IconName.Menu,
+            onPress,
+            testID: 'custom-start-button',
+          }}
+        />,
+      );
+
+      expect(getByTestId('custom-start-button')).toBeOnTheScreen();
+    });
+
+    it('startButtonIconProps takes priority over onBack', () => {
+      const onBack = jest.fn();
+      const onPress = jest.fn();
+      const { getByTestId, queryByTestId } = render(
+        <HeaderStandardAnimated
+          {...defaultProps}
+          title="Title"
+          onBack={onBack}
+          backButtonProps={{ testID: BACK_BUTTON_TEST_ID }}
+          startButtonIconProps={{
+            iconName: IconName.Menu,
+            onPress,
+            testID: 'custom-start-button',
+          }}
+        />,
+      );
+
+      expect(getByTestId('custom-start-button')).toBeOnTheScreen();
+      expect(queryByTestId(BACK_BUTTON_TEST_ID)).not.toBeOnTheScreen();
+    });
+  });
+
+  describe('close button', () => {
+    it('renders close button when onClose provided', () => {
+      const { getByTestId } = render(
+        <HeaderStandardAnimated
+          {...defaultProps}
+          title="Title"
+          onClose={jest.fn()}
+          closeButtonProps={{ testID: CLOSE_BUTTON_TEST_ID }}
+        />,
+      );
+
+      expect(getByTestId(CLOSE_BUTTON_TEST_ID)).toBeOnTheScreen();
+    });
+
+    it('renders close button when closeButtonProps provided', () => {
+      const { getByTestId } = render(
+        <HeaderStandardAnimated
+          {...defaultProps}
+          title="Title"
+          closeButtonProps={{
+            onPress: jest.fn(),
+            testID: CLOSE_BUTTON_TEST_ID,
+          }}
+        />,
+      );
+
+      expect(getByTestId(CLOSE_BUTTON_TEST_ID)).toBeOnTheScreen();
+    });
+
+    it('calls onClose when close button pressed', () => {
+      const onClose = jest.fn();
+      const { getByTestId } = render(
+        <HeaderStandardAnimated
+          {...defaultProps}
+          title="Title"
+          onClose={onClose}
+          closeButtonProps={{ testID: CLOSE_BUTTON_TEST_ID }}
+        />,
+      );
+
+      fireEvent.press(getByTestId(CLOSE_BUTTON_TEST_ID));
+
+      expect(onClose).toHaveBeenCalledTimes(1);
+    });
+
+    it('calls closeButtonProps.onPress when close button pressed', () => {
+      const onPress = jest.fn();
+      const { getByTestId } = render(
+        <HeaderStandardAnimated
+          {...defaultProps}
+          title="Title"
+          closeButtonProps={{ onPress, testID: CLOSE_BUTTON_TEST_ID }}
+        />,
+      );
+
+      fireEvent.press(getByTestId(CLOSE_BUTTON_TEST_ID));
+
+      expect(onPress).toHaveBeenCalledTimes(1);
+    });
+
+    it('uses closeButtonProps.onPress over onClose when both provided', () => {
+      const onClose = jest.fn();
+      const onPress = jest.fn();
+      const { getByTestId } = render(
+        <HeaderStandardAnimated
+          {...defaultProps}
+          title="Title"
+          onClose={onClose}
+          closeButtonProps={{ onPress, testID: CLOSE_BUTTON_TEST_ID }}
+        />,
+      );
+
+      fireEvent.press(getByTestId(CLOSE_BUTTON_TEST_ID));
+
+      expect(onPress).toHaveBeenCalledTimes(1);
+      expect(onClose).not.toHaveBeenCalled();
+    });
+  });
+
+  describe('props forwarding', () => {
+    it('accepts custom testID', () => {
+      const { getByTestId } = render(
+        <HeaderStandardAnimated
+          {...defaultProps}
+          title="Title"
+          testID="custom-header"
+        />,
+      );
+
+      expect(getByTestId('custom-header')).toBeOnTheScreen();
+    });
+  });
+});
diff --git a/app/component-library/components-temp/HeaderStandardAnimated/HeaderStandardAnimated.tsx b/app/component-library/components-temp/HeaderStandardAnimated/HeaderStandardAnimated.tsx
new file mode 100644
index 000000000000..6cb8f3c55ebf
--- /dev/null
+++ b/app/component-library/components-temp/HeaderStandardAnimated/HeaderStandardAnimated.tsx
@@ -0,0 +1,80 @@
+// Third party dependencies.
+import React from 'react';
+
+// External dependencies.
+import {
+  Box,
+  BoxAlignItems,
+  Text,
+  TextVariant,
+  TextColor,
+  FontWeight,
+} from '@metamask/design-system-react-native';
+import Animated, {
+  useAnimatedStyle,
+  useDerivedValue,
+  withTiming,
+} from 'react-native-reanimated';
+
+// Internal dependencies.
+import HeaderCompactStandard from '../HeaderCompactStandard';
+import { HeaderStandardAnimatedProps } from './HeaderStandardAnimated.types';
+
+const HeaderStandardAnimated: React.FC<HeaderStandardAnimatedProps> = ({
+  title,
+  titleProps,
+  subtitle,
+  subtitleProps,
+  scrollY,
+  titleSectionHeight,
+  twClassName = '',
+  ...headerStandardProps
+}) => {
+  const compactTitleProgress = useDerivedValue(() => {
+    const hasMeasured = titleSectionHeight.value > 0;
+    const isFullyHidden =
+      hasMeasured && scrollY.value >= titleSectionHeight.value;
+    return withTiming(isFullyHidden ? 1 : 0, { duration: 150 });
+  });
+
+  const centerAnimatedStyle = useAnimatedStyle(() => {
+    const progress = compactTitleProgress.value;
+    return {
+      opacity: progress,
+      transform: [{ translateY: (1 - progress) * 8 }],
+    };
+  });
+
+  const content = title ? (
+    <Box alignItems={BoxAlignItems.Center}>
+      <Text
+        variant={TextVariant.BodyMd}
+        fontWeight={FontWeight.Bold}
+        {...titleProps}
+      >
+        {title}
+      </Text>
+      {subtitle && (
+        <Text
+          variant={TextVariant.BodySm}
+          color={TextColor.TextAlternative}
+          {...subtitleProps}
+          twClassName={`-mt-0.5 ${subtitleProps?.twClassName ?? ''}`.trim()}
+        >
+          {subtitle}
+        </Text>
+      )}
+    </Box>
+  ) : null;
+
+  return (
+    <HeaderCompactStandard
+      {...headerStandardProps}
+      twClassName={`bg-default ${twClassName}`.trim()}
+    >
+      <Animated.View style={centerAnimatedStyle}>{content}</Animated.View>
+    </HeaderCompactStandard>
+  );
+};
+
+export default HeaderStandardAnimated;
diff --git a/app/component-library/components-temp/HeaderStandardAnimated/HeaderStandardAnimated.types.ts b/app/component-library/components-temp/HeaderStandardAnimated/HeaderStandardAnimated.types.ts
new file mode 100644
index 000000000000..436f8d0530c5
--- /dev/null
+++ b/app/component-library/components-temp/HeaderStandardAnimated/HeaderStandardAnimated.types.ts
@@ -0,0 +1,35 @@
+// External dependencies.
+import { SharedValue, useAnimatedScrollHandler } from 'react-native-reanimated';
+
+// Internal dependencies.
+import { HeaderCompactStandardProps } from '../HeaderCompactStandard/HeaderCompactStandard.types';
+
+/**
+ * HeaderStandardAnimated component props.
+ * Extends HeaderCompactStandardProps with scroll-driven animation inputs.
+ * Content is driven by title/subtitle only; children is not supported.
+ */
+export interface HeaderStandardAnimatedProps
+  extends Omit<HeaderCompactStandardProps, 'children'> {
+  /**
+   * Shared value for scroll offset from the ScrollView.
+   * Used to drive the center-title animation when scroll passes the title section.
+   */
+  scrollY: SharedValue<number>;
+  /**
+   * Shared value for the height of the title section (first child of ScrollView).
+   * When scrollY >= titleSectionHeight, the compact center title is shown.
+   */
+  titleSectionHeight: SharedValue<number>;
+}
+
+/**
+ * Return type for useHeaderStandardAnimated hook.
+ * onScroll is an animated scroll handler; use with Animated.ScrollView for UI-thread updates.
+ */
+export interface UseHeaderStandardAnimatedReturn {
+  scrollY: SharedValue<number>;
+  titleSectionHeightSv: SharedValue<number>;
+  setTitleSectionHeight: (height: number) => void;
+  onScroll: ReturnType<typeof useAnimatedScrollHandler>;
+}
diff --git a/app/component-library/components-temp/HeaderStandardAnimated/index.ts b/app/component-library/components-temp/HeaderStandardAnimated/index.ts
new file mode 100644
index 000000000000..58f7cb8c7f09
--- /dev/null
+++ b/app/component-library/components-temp/HeaderStandardAnimated/index.ts
@@ -0,0 +1,6 @@
+export { default } from './HeaderStandardAnimated';
+export { default as useHeaderStandardAnimated } from './useHeaderStandardAnimated';
+export type {
+  HeaderStandardAnimatedProps,
+  UseHeaderStandardAnimatedReturn,
+} from './HeaderStandardAnimated.types';
diff --git a/app/component-library/components-temp/HeaderStandardAnimated/useHeaderStandardAnimated.test.ts b/app/component-library/components-temp/HeaderStandardAnimated/useHeaderStandardAnimated.test.ts
new file mode 100644
index 000000000000..e26188955b74
--- /dev/null
+++ b/app/component-library/components-temp/HeaderStandardAnimated/useHeaderStandardAnimated.test.ts
@@ -0,0 +1,103 @@
+// Third party dependencies.
+import { renderHook, act } from '@testing-library/react-native';
+
+// Internal dependencies.
+import useHeaderStandardAnimated from './useHeaderStandardAnimated';
+
+jest.mock('react-native-reanimated', () => ({
+  useSharedValue: jest.fn((initial: number) => ({ value: initial })),
+  useAnimatedScrollHandler: jest.fn(
+    (
+      config:
+        | { onScroll?: (e: { contentOffset: { y: number } }) => void }
+        | ((e: { contentOffset: { y: number } }) => void),
+    ) =>
+      (scrollEvent: { contentOffset: { y: number } }) => {
+        const handler =
+          typeof config === 'function' ? config : config?.onScroll;
+        handler?.(scrollEvent);
+      },
+  ),
+}));
+
+const createScrollEvent = (contentOffsetY: number) => ({
+  contentOffset: { y: contentOffsetY, x: 0 },
+});
+
+describe('useHeaderStandardAnimated', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  describe('return value', () => {
+    it('returns scrollY, titleSectionHeightSv, setTitleSectionHeight, and onScroll', () => {
+      const { result } = renderHook(() => useHeaderStandardAnimated());
+
+      expect(result.current).toHaveProperty('scrollY');
+      expect(result.current).toHaveProperty('titleSectionHeightSv');
+      expect(result.current).toHaveProperty('setTitleSectionHeight');
+      expect(result.current).toHaveProperty('onScroll');
+      expect(typeof result.current.setTitleSectionHeight).toBe('function');
+      expect(typeof result.current.onScroll).toBe('function');
+    });
+
+    it('initializes scrollY with value 0', () => {
+      const { result } = renderHook(() => useHeaderStandardAnimated());
+
+      expect(result.current.scrollY.value).toBe(0);
+    });
+
+    it('initializes titleSectionHeightSv with value 0', () => {
+      const { result } = renderHook(() => useHeaderStandardAnimated());
+
+      expect(result.current.titleSectionHeightSv.value).toBe(0);
+    });
+  });
+
+  describe('setTitleSectionHeight', () => {
+    it('updates titleSectionHeightSv.value when called', () => {
+      const { result } = renderHook(() => useHeaderStandardAnimated());
+
+      act(() => {
+        result.current.setTitleSectionHeight(120);
+      });
+
+      expect(result.current.titleSectionHeightSv.value).toBe(120);
+    });
+
+    it('updates titleSectionHeightSv.value on multiple calls', () => {
+      const { result } = renderHook(() => useHeaderStandardAnimated());
+
+      act(() => {
+        result.current.setTitleSectionHeight(50);
+      });
+      expect(result.current.titleSectionHeightSv.value).toBe(50);
+
+      act(() => {
+        result.current.setTitleSectionHeight(200);
+      });
+      expect(result.current.titleSectionHeightSv.value).toBe(200);
+    });
+  });
+
+  describe('onScroll', () => {
+    it('returns onScroll handler that accepts event with contentOffset and does not throw', () => {
+      // scrollY.value update from contentOffset.y is not asserted here because the hook
+      // receives the real react-native-reanimated in this test environment; the behavior
+      // is implemented in the hook and may be covered by integration tests.
+      const { result } = renderHook(() => useHeaderStandardAnimated());
+
+      expect(typeof result.current.onScroll).toBe('function');
+
+      expect(() => {
+        act(() => {
+          result.current.onScroll(
+            createScrollEvent(75) as unknown as Parameters<
+              ReturnType<typeof useHeaderStandardAnimated>['onScroll']
+            >[0],
+          );
+        });
+      }).not.toThrow();
+    });
+  });
+});
diff --git a/app/component-library/components-temp/HeaderStandardAnimated/useHeaderStandardAnimated.ts b/app/component-library/components-temp/HeaderStandardAnimated/useHeaderStandardAnimated.ts
new file mode 100644
index 000000000000..94960abf0391
--- /dev/null
+++ b/app/component-library/components-temp/HeaderStandardAnimated/useHeaderStandardAnimated.ts
@@ -0,0 +1,64 @@
+// Third party dependencies.
+import { useCallback } from 'react';
+import {
+  useSharedValue,
+  useAnimatedScrollHandler,
+} from 'react-native-reanimated';
+
+// Internal dependencies.
+import { UseHeaderStandardAnimatedReturn } from './HeaderStandardAnimated.types';
+
+/**
+ * Hook for managing HeaderStandardAnimated scroll-linked animations.
+ * Use with HeaderStandardAnimated placed outside the ScrollView as a sibling.
+ * Use the returned onScroll with Animated.ScrollView for UI-thread scroll updates (zero lag).
+ *
+ * @returns Object containing scrollY, titleSectionHeightSv, setTitleSectionHeight, and onScroll.
+ *
+ * @example
+ * ```tsx
+ * const { scrollY, onScroll, setTitleSectionHeight, titleSectionHeightSv } =
+ *   useHeaderStandardAnimated();
+ *
+ * <Box twClassName="flex-1">
+ *   <HeaderStandardAnimated
+ *     scrollY={scrollY}
+ *     titleSectionHeight={titleSectionHeightSv}
+ *     title="Market"
+ *     onBack={handleBack}
+ *   />
+ *   <Animated.ScrollView onScroll={onScroll} scrollEventThrottle={16}>
+ *     <Box onLayout={(e) => setTitleSectionHeight(e.nativeEvent.layout.height)}>
+ *       <TitleStandard topLabel="Perps" title="ETH-PERP" />
+ *     </Box>
+ *     {/* page body *\/}
+ *   </Animated.ScrollView>
+ * </Box>
+ * ```
+ */
+const useHeaderStandardAnimated = (): UseHeaderStandardAnimatedReturn => {
+  const scrollYValue = useSharedValue(0);
+  const titleSectionHeightSv = useSharedValue(0);
+
+  const setTitleSectionHeight = useCallback(
+    (height: number) => {
+      titleSectionHeightSv.value = height;
+    },
+    [titleSectionHeightSv],
+  );
+
+  const onScroll = useAnimatedScrollHandler({
+    onScroll: (scrollEvent) => {
+      scrollYValue.value = scrollEvent.contentOffset.y;
+    },
+  });
+
+  return {
+    scrollY: scrollYValue,
+    titleSectionHeightSv,
+    setTitleSectionHeight,
+    onScroll,
+  };
+};
+
+export default useHeaderStandardAnimated;
diff --git a/app/component-library/components-temp/KeyValueRow/__snapshots__/KeyValueRow.test.tsx.snap b/app/component-library/components-temp/KeyValueRow/__snapshots__/KeyValueRow.test.tsx.snap
index 6f5cbc66aefe..7bec26896d2c 100644
--- a/app/component-library/components-temp/KeyValueRow/__snapshots__/KeyValueRow.test.tsx.snap
+++ b/app/component-library/components-temp/KeyValueRow/__snapshots__/KeyValueRow.test.tsx.snap
@@ -34,7 +34,7 @@ exports[`KeyValueRow Prebuilt Component KeyValueRow should render text with icon
       }
     >
       <SvgMock
-        color="#121314"
+        color="#131416"
         fill="currentColor"
         height={20}
         name="Activity"
@@ -58,7 +58,7 @@ exports[`KeyValueRow Prebuilt Component KeyValueRow should render text with icon
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Medium",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -90,7 +90,7 @@ exports[`KeyValueRow Prebuilt Component KeyValueRow should render text with icon
       }
     >
       <SvgMock
-        color="#121314"
+        color="#131416"
         fill="currentColor"
         height={20}
         name="Add"
@@ -114,7 +114,7 @@ exports[`KeyValueRow Prebuilt Component KeyValueRow should render text with icon
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Medium",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -165,7 +165,7 @@ exports[`KeyValueRow Prebuilt Component KeyValueRow should render text with icon
       }
     >
       <SvgMock
-        color="#121314"
+        color="#131416"
         fill="currentColor"
         height={20}
         name="Activity"
@@ -189,7 +189,7 @@ exports[`KeyValueRow Prebuilt Component KeyValueRow should render text with icon
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Medium",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -221,7 +221,7 @@ exports[`KeyValueRow Prebuilt Component KeyValueRow should render text with icon
           }
         >
           <SvgMock
-            color="#686e7d"
+            color="#66676a"
             fill="currentColor"
             height={20}
             name="Question"
@@ -255,7 +255,7 @@ exports[`KeyValueRow Prebuilt Component KeyValueRow should render text with icon
       }
     >
       <SvgMock
-        color="#121314"
+        color="#131416"
         fill="currentColor"
         height={20}
         name="Add"
@@ -279,7 +279,7 @@ exports[`KeyValueRow Prebuilt Component KeyValueRow should render text with icon
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Medium",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -311,7 +311,7 @@ exports[`KeyValueRow Prebuilt Component KeyValueRow should render text with icon
           }
         >
           <SvgMock
-            color="#686e7d"
+            color="#66676a"
             fill="currentColor"
             height={20}
             name="Question"
@@ -375,7 +375,7 @@ exports[`KeyValueRow Prebuilt Component KeyValueRow should render text with tool
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Medium",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -407,7 +407,7 @@ exports[`KeyValueRow Prebuilt Component KeyValueRow should render text with tool
           }
         >
           <SvgMock
-            color="#686e7d"
+            color="#66676a"
             fill="currentColor"
             height={20}
             name="Question"
@@ -452,7 +452,7 @@ exports[`KeyValueRow Prebuilt Component KeyValueRow should render text with tool
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Medium",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -484,7 +484,7 @@ exports[`KeyValueRow Prebuilt Component KeyValueRow should render text with tool
           }
         >
           <SvgMock
-            color="#686e7d"
+            color="#66676a"
             fill="currentColor"
             height={20}
             name="Question"
@@ -548,7 +548,7 @@ exports[`KeyValueRow Prebuilt Component KeyValueRow should render when there is
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Medium",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -591,7 +591,7 @@ exports[`KeyValueRow Prebuilt Component KeyValueRow should render when there is
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Medium",
               "fontSize": 16,
               "letterSpacing": 0,
diff --git a/app/component-library/components-temp/ListItemMultiSelectButton/__snapshots__/ListItemMultiSelectButton.test.tsx.snap b/app/component-library/components-temp/ListItemMultiSelectButton/__snapshots__/ListItemMultiSelectButton.test.tsx.snap
index b85bbd7449ba..95a70e091ce3 100644
--- a/app/component-library/components-temp/ListItemMultiSelectButton/__snapshots__/ListItemMultiSelectButton.test.tsx.snap
+++ b/app/component-library/components-temp/ListItemMultiSelectButton/__snapshots__/ListItemMultiSelectButton.test.tsx.snap
@@ -77,7 +77,7 @@ exports[`ListItemMultiSelectButton should render correctly with default props 1`
       testID="button-menu-select-test-id"
     >
       <SvgMock
-        color="#121314"
+        color="#131416"
         fill="currentColor"
         height={20}
         name="MoreVertical"
diff --git a/app/component-library/components-temp/ListItemMultiSelectWithMenuButton/__snapshots__/ListItemMultiSelectWithMenuButton.test.tsx.snap b/app/component-library/components-temp/ListItemMultiSelectWithMenuButton/__snapshots__/ListItemMultiSelectWithMenuButton.test.tsx.snap
index 75f58f720410..21e040b1f95c 100644
--- a/app/component-library/components-temp/ListItemMultiSelectWithMenuButton/__snapshots__/ListItemMultiSelectWithMenuButton.test.tsx.snap
+++ b/app/component-library/components-temp/ListItemMultiSelectWithMenuButton/__snapshots__/ListItemMultiSelectWithMenuButton.test.tsx.snap
@@ -63,7 +63,7 @@ exports[`ListItemMultiSelectWithMenuButton should render correctly with default
               {
                 "alignItems": "center",
                 "backgroundColor": "#ffffff",
-                "borderColor": "#b7bbc8",
+                "borderColor": "#949596",
                 "borderRadius": 4,
                 "borderWidth": 2,
                 "height": 20,
@@ -113,7 +113,7 @@ exports[`ListItemMultiSelectWithMenuButton should render correctly with default
       testID="button-menu-select-with-menu-button-test-id"
     >
       <SvgMock
-        color="#121314"
+        color="#131416"
         fill="currentColor"
         height={20}
         name="MoreVertical"
diff --git a/app/component-library/components-temp/MainActionButton/__snapshots__/MainActionButton.test.tsx.snap b/app/component-library/components-temp/MainActionButton/__snapshots__/MainActionButton.test.tsx.snap
index 02fcf6d3b39f..d67b7c1d51b2 100644
--- a/app/component-library/components-temp/MainActionButton/__snapshots__/MainActionButton.test.tsx.snap
+++ b/app/component-library/components-temp/MainActionButton/__snapshots__/MainActionButton.test.tsx.snap
@@ -47,7 +47,7 @@ exports[`MainActionButton should render correctly 1`] = `
       [
         {
           "alignItems": "center",
-          "backgroundColor": "#3c4d9d0f",
+          "backgroundColor": "#b4b4b528",
           "borderRadius": 12,
           "justifyContent": "center",
           "opacity": 1,
@@ -69,7 +69,7 @@ exports[`MainActionButton should render correctly 1`] = `
       }
     >
       <SvgMock
-        color="#686e7d"
+        color="#66676a"
         fill="currentColor"
         height={24}
         name="Add"
@@ -87,7 +87,7 @@ exports[`MainActionButton should render correctly 1`] = `
         numberOfLines={1}
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "flexShrink": 0,
             "fontFamily": "Geist-Medium",
             "fontSize": 14,
diff --git a/app/component-library/components-temp/MultichainAccounts/MultichainAddWalletActions/__snapshots__/MultichainAddWalletActions.test.tsx.snap b/app/component-library/components-temp/MultichainAccounts/MultichainAddWalletActions/__snapshots__/MultichainAddWalletActions.test.tsx.snap
index 943b3099720c..63cfae3a63e2 100644
--- a/app/component-library/components-temp/MultichainAccounts/MultichainAddWalletActions/__snapshots__/MultichainAddWalletActions.test.tsx.snap
+++ b/app/component-library/components-temp/MultichainAccounts/MultichainAddWalletActions/__snapshots__/MultichainAddWalletActions.test.tsx.snap
@@ -403,7 +403,7 @@ exports[`MultichainAddWalletActions renders correctly 1`] = `
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "height": 20,
                                       "width": 20,
                                     },
@@ -430,7 +430,7 @@ exports[`MultichainAddWalletActions renders correctly 1`] = `
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Medium",
                                       "fontSize": 16,
                                       "fontWeight": 400,
@@ -537,7 +537,7 @@ exports[`MultichainAddWalletActions renders correctly 1`] = `
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "height": 20,
                                       "width": 20,
                                     },
@@ -564,7 +564,7 @@ exports[`MultichainAddWalletActions renders correctly 1`] = `
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Medium",
                                       "fontSize": 16,
                                       "fontWeight": 400,
@@ -671,7 +671,7 @@ exports[`MultichainAddWalletActions renders correctly 1`] = `
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "height": 20,
                                       "width": 20,
                                     },
@@ -698,7 +698,7 @@ exports[`MultichainAddWalletActions renders correctly 1`] = `
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Medium",
                                       "fontSize": 16,
                                       "fontWeight": 400,
diff --git a/app/component-library/components-temp/MultichainAccounts/MultichainAddressRow/__snapshots__/MultichainAddressRow.test.tsx.snap b/app/component-library/components-temp/MultichainAccounts/MultichainAddressRow/__snapshots__/MultichainAddressRow.test.tsx.snap
index 9afd2a87df75..29624e3a693c 100644
--- a/app/component-library/components-temp/MultichainAccounts/MultichainAddressRow/__snapshots__/MultichainAddressRow.test.tsx.snap
+++ b/app/component-library/components-temp/MultichainAccounts/MultichainAddressRow/__snapshots__/MultichainAddressRow.test.tsx.snap
@@ -72,7 +72,7 @@ exports[`MultichainAddressRow renders MultichainAddressRow correctly 1`] = `
       style={
         [
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "fontWeight": 400,
@@ -91,7 +91,7 @@ exports[`MultichainAddressRow renders MultichainAddressRow correctly 1`] = `
       style={
         [
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Medium",
             "fontSize": 14,
             "fontWeight": 400,
@@ -178,7 +178,7 @@ exports[`MultichainAddressRow renders MultichainAddressRow correctly 1`] = `
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "height": 24,
               "width": 24,
             },
diff --git a/app/component-library/components-temp/Price/AggregatedPercentage/__snapshots__/AggregatedPercentageCrossChains.test.tsx.snap b/app/component-library/components-temp/Price/AggregatedPercentage/__snapshots__/AggregatedPercentageCrossChains.test.tsx.snap
index af30f0cf5c49..88ff6e41973a 100644
--- a/app/component-library/components-temp/Price/AggregatedPercentage/__snapshots__/AggregatedPercentageCrossChains.test.tsx.snap
+++ b/app/component-library/components-temp/Price/AggregatedPercentage/__snapshots__/AggregatedPercentageCrossChains.test.tsx.snap
@@ -13,7 +13,7 @@ exports[`AggregatedPercentageCrossChains should match snapshot 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#686e7d",
+        "color": "#66676a",
         "fontFamily": "Geist-Medium",
         "fontSize": 16,
         "letterSpacing": 0,
@@ -28,7 +28,7 @@ exports[`AggregatedPercentageCrossChains should match snapshot 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#686e7d",
+        "color": "#66676a",
         "fontFamily": "Geist-Medium",
         "fontSize": 16,
         "letterSpacing": 0,
diff --git a/app/component-library/components-temp/QuickActionButtons/QuickActionButton/__snapshots__/QuickActionButton.test.tsx.snap b/app/component-library/components-temp/QuickActionButtons/QuickActionButton/__snapshots__/QuickActionButton.test.tsx.snap
index 6c72b107bc3d..9ce1bae2830e 100644
--- a/app/component-library/components-temp/QuickActionButtons/QuickActionButton/__snapshots__/QuickActionButton.test.tsx.snap
+++ b/app/component-library/components-temp/QuickActionButtons/QuickActionButton/__snapshots__/QuickActionButton.test.tsx.snap
@@ -37,7 +37,7 @@ exports[`QuickActionButton renders correctly with default props 1`] = `
     [
       {
         "alignItems": "center",
-        "backgroundColor": "#3c4d9d0f",
+        "backgroundColor": "#b4b4b528",
         "borderColor": "transparent",
         "borderRadius": 12,
         "borderWidth": 1,
@@ -69,7 +69,7 @@ exports[`QuickActionButton renders correctly with default props 1`] = `
     style={
       [
         {
-          "color": "#121314",
+          "color": "#131416",
           "flexGrow": 0,
           "flexShrink": 1,
           "flexWrap": "wrap",
diff --git a/app/component-library/components-temp/QuickActionButtons/__snapshots__/QuickActionButtons.test.tsx.snap b/app/component-library/components-temp/QuickActionButtons/__snapshots__/QuickActionButtons.test.tsx.snap
index cd0860120d67..38ad89986c8c 100644
--- a/app/component-library/components-temp/QuickActionButtons/__snapshots__/QuickActionButtons.test.tsx.snap
+++ b/app/component-library/components-temp/QuickActionButtons/__snapshots__/QuickActionButtons.test.tsx.snap
@@ -74,7 +74,7 @@ exports[`QuickActionButtons preserves button keys when provided 1`] = `
           [
             {
               "alignItems": "center",
-              "backgroundColor": "#3c4d9d0f",
+              "backgroundColor": "#b4b4b528",
               "borderColor": "transparent",
               "borderRadius": 12,
               "borderWidth": 1,
@@ -106,7 +106,7 @@ exports[`QuickActionButtons preserves button keys when provided 1`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "flexGrow": 0,
                 "flexShrink": 1,
                 "flexWrap": "wrap",
@@ -174,7 +174,7 @@ exports[`QuickActionButtons preserves button keys when provided 1`] = `
           [
             {
               "alignItems": "center",
-              "backgroundColor": "#3c4d9d0f",
+              "backgroundColor": "#b4b4b528",
               "borderColor": "transparent",
               "borderRadius": 12,
               "borderWidth": 1,
@@ -206,7 +206,7 @@ exports[`QuickActionButtons preserves button keys when provided 1`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "flexGrow": 0,
                 "flexShrink": 1,
                 "flexWrap": "wrap",
diff --git a/app/component-library/components-temp/SegmentedControl/__snapshots__/SegmentedControl.test.tsx.snap b/app/component-library/components-temp/SegmentedControl/__snapshots__/SegmentedControl.test.tsx.snap
index 6aed0d91847c..290413495af2 100644
--- a/app/component-library/components-temp/SegmentedControl/__snapshots__/SegmentedControl.test.tsx.snap
+++ b/app/component-library/components-temp/SegmentedControl/__snapshots__/SegmentedControl.test.tsx.snap
@@ -38,7 +38,7 @@ exports[`SegmentedControl Multi-select mode renders correctly with default selec
         {
           "alignItems": "center",
           "alignSelf": "flex-start",
-          "backgroundColor": "#121314",
+          "backgroundColor": "#131416",
           "borderRadius": 12,
           "flexDirection": "row",
           "height": 40,
@@ -84,7 +84,7 @@ exports[`SegmentedControl Multi-select mode renders correctly with default selec
         {
           "alignItems": "center",
           "alignSelf": "flex-start",
-          "backgroundColor": "#3c4d9d0f",
+          "backgroundColor": "#b4b4b528",
           "borderColor": "transparent",
           "borderRadius": 12,
           "borderWidth": 1,
@@ -100,7 +100,7 @@ exports[`SegmentedControl Multi-select mode renders correctly with default selec
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -132,7 +132,7 @@ exports[`SegmentedControl Multi-select mode renders correctly with default selec
         {
           "alignItems": "center",
           "alignSelf": "flex-start",
-          "backgroundColor": "#121314",
+          "backgroundColor": "#131416",
           "borderRadius": 12,
           "flexDirection": "row",
           "height": 40,
@@ -178,7 +178,7 @@ exports[`SegmentedControl Multi-select mode renders correctly with default selec
         {
           "alignItems": "center",
           "alignSelf": "flex-start",
-          "backgroundColor": "#3c4d9d0f",
+          "backgroundColor": "#b4b4b528",
           "borderColor": "transparent",
           "borderRadius": 12,
           "borderWidth": 1,
@@ -194,7 +194,7 @@ exports[`SegmentedControl Multi-select mode renders correctly with default selec
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -242,7 +242,7 @@ exports[`SegmentedControl Single-select mode renders correctly with default sele
         {
           "alignItems": "center",
           "alignSelf": "flex-start",
-          "backgroundColor": "#121314",
+          "backgroundColor": "#131416",
           "borderRadius": 12,
           "flexDirection": "row",
           "height": 40,
@@ -288,7 +288,7 @@ exports[`SegmentedControl Single-select mode renders correctly with default sele
         {
           "alignItems": "center",
           "alignSelf": "flex-start",
-          "backgroundColor": "#3c4d9d0f",
+          "backgroundColor": "#b4b4b528",
           "borderColor": "transparent",
           "borderRadius": 12,
           "borderWidth": 1,
@@ -304,7 +304,7 @@ exports[`SegmentedControl Single-select mode renders correctly with default sele
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -336,7 +336,7 @@ exports[`SegmentedControl Single-select mode renders correctly with default sele
         {
           "alignItems": "center",
           "alignSelf": "flex-start",
-          "backgroundColor": "#3c4d9d0f",
+          "backgroundColor": "#b4b4b528",
           "borderColor": "transparent",
           "borderRadius": 12,
           "borderWidth": 1,
@@ -352,7 +352,7 @@ exports[`SegmentedControl Single-select mode renders correctly with default sele
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -384,7 +384,7 @@ exports[`SegmentedControl Single-select mode renders correctly with default sele
         {
           "alignItems": "center",
           "alignSelf": "flex-start",
-          "backgroundColor": "#3c4d9d0f",
+          "backgroundColor": "#b4b4b528",
           "borderColor": "transparent",
           "borderRadius": 12,
           "borderWidth": 1,
@@ -400,7 +400,7 @@ exports[`SegmentedControl Single-select mode renders correctly with default sele
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "letterSpacing": 0,
diff --git a/app/component-library/components-temp/TabBar/__snapshots__/TabBar.test.tsx.snap b/app/component-library/components-temp/TabBar/__snapshots__/TabBar.test.tsx.snap
index f18a431f90f3..4cf3e935bc8e 100644
--- a/app/component-library/components-temp/TabBar/__snapshots__/TabBar.test.tsx.snap
+++ b/app/component-library/components-temp/TabBar/__snapshots__/TabBar.test.tsx.snap
@@ -23,7 +23,7 @@ exports[`TabBar accepts and passes through additional props with ScrollableTabVi
         },
         [
           {
-            "borderBottomColor": "#b7bbc866",
+            "borderBottomColor": "#b4b4b566",
             "borderBottomWidth": 1,
             "borderColor": "#ffffff",
           },
@@ -134,7 +134,7 @@ exports[`TabBar accepts and passes through additional props with ScrollableTabVi
       collapsable={false}
       style={
         {
-          "backgroundColor": "#121314",
+          "backgroundColor": "#131416",
           "bottom": 0,
           "height": 2,
           "position": "absolute",
@@ -155,7 +155,7 @@ exports[`TabBar accepts and passes through additional props with ScrollableTabVi
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -174,7 +174,7 @@ exports[`TabBar accepts and passes through additional props with ScrollableTabVi
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -212,7 +212,7 @@ exports[`TabBar renders correctly with ScrollableTabView 1`] = `
         },
         [
           {
-            "borderBottomColor": "#b7bbc866",
+            "borderBottomColor": "#b4b4b566",
             "borderBottomWidth": 1,
             "borderColor": "#ffffff",
           },
@@ -253,7 +253,7 @@ exports[`TabBar renders correctly with ScrollableTabView 1`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontWeight": "bold",
               },
               {
@@ -302,7 +302,7 @@ exports[`TabBar renders correctly with ScrollableTabView 1`] = `
           style={
             [
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontWeight": "normal",
               },
               {
@@ -323,7 +323,7 @@ exports[`TabBar renders correctly with ScrollableTabView 1`] = `
       collapsable={false}
       style={
         {
-          "backgroundColor": "#121314",
+          "backgroundColor": "#131416",
           "bottom": 0,
           "height": 2,
           "position": "absolute",
@@ -344,7 +344,7 @@ exports[`TabBar renders correctly with ScrollableTabView 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -363,7 +363,7 @@ exports[`TabBar renders correctly with ScrollableTabView 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -401,7 +401,7 @@ exports[`TabBar renders correctly with custom style using ScrollableTabView 1`]
         },
         [
           {
-            "borderBottomColor": "#b7bbc866",
+            "borderBottomColor": "#b4b4b566",
             "borderBottomWidth": 1,
             "borderColor": "#ffffff",
           },
@@ -444,7 +444,7 @@ exports[`TabBar renders correctly with custom style using ScrollableTabView 1`]
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontWeight": "bold",
               },
               {
@@ -493,7 +493,7 @@ exports[`TabBar renders correctly with custom style using ScrollableTabView 1`]
           style={
             [
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontWeight": "normal",
               },
               {
@@ -514,7 +514,7 @@ exports[`TabBar renders correctly with custom style using ScrollableTabView 1`]
       collapsable={false}
       style={
         {
-          "backgroundColor": "#121314",
+          "backgroundColor": "#131416",
           "bottom": 0,
           "height": 2,
           "position": "absolute",
@@ -535,7 +535,7 @@ exports[`TabBar renders correctly with custom style using ScrollableTabView 1`]
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -554,7 +554,7 @@ exports[`TabBar renders correctly with custom style using ScrollableTabView 1`]
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
diff --git a/app/component-library/components-temp/TabEmptyState/TabEmptyState.tsx b/app/component-library/components-temp/TabEmptyState/TabEmptyState.tsx
index 642757d5fd38..d6ab4c51f753 100644
--- a/app/component-library/components-temp/TabEmptyState/TabEmptyState.tsx
+++ b/app/component-library/components-temp/TabEmptyState/TabEmptyState.tsx
@@ -51,6 +51,7 @@ export const TabEmptyState: React.FC<TabEmptyStateProps> = ({
       <Button
         variant={ButtonVariant.Secondary}
         onPress={onAction}
+        twClassName="self-center"
         {...actionButtonProps}
       >
         {actionButtonText}
diff --git a/app/component-library/components-temp/Tabs/Tab/__snapshots__/Tab.test.tsx.snap b/app/component-library/components-temp/Tabs/Tab/__snapshots__/Tab.test.tsx.snap
index bf2a5e0643b5..acc2bdfd396e 100644
--- a/app/component-library/components-temp/Tabs/Tab/__snapshots__/Tab.test.tsx.snap
+++ b/app/component-library/components-temp/Tabs/Tab/__snapshots__/Tab.test.tsx.snap
@@ -58,7 +58,7 @@ exports[`Tab Active State applies active styling when isActive is true 1`] = `
       style={
         [
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Bold",
             "fontSize": 16,
             "fontWeight": 400,
@@ -79,7 +79,7 @@ exports[`Tab Active State applies active styling when isActive is true 1`] = `
       style={
         [
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Bold",
             "fontSize": 16,
             "fontWeight": 400,
@@ -163,7 +163,7 @@ exports[`Tab Active State applies inactive styling when isActive is false 1`] =
       style={
         [
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Bold",
             "fontSize": 16,
             "fontWeight": 400,
@@ -184,7 +184,7 @@ exports[`Tab Active State applies inactive styling when isActive is false 1`] =
       style={
         [
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "fontWeight": 400,
@@ -269,7 +269,7 @@ exports[`Tab Disabled State applies disabled styling when isDisabled is true 1`]
       style={
         [
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Bold",
             "fontSize": 16,
             "fontWeight": 400,
@@ -290,7 +290,7 @@ exports[`Tab Disabled State applies disabled styling when isDisabled is true 1`]
       style={
         [
           {
-            "color": "#b7bbc8",
+            "color": "#babbbe",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "fontWeight": 400,
@@ -375,7 +375,7 @@ exports[`Tab Disabled State shows disabled styling even when marked as active 1`
       style={
         [
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Bold",
             "fontSize": 16,
             "fontWeight": 400,
@@ -396,7 +396,7 @@ exports[`Tab Disabled State shows disabled styling even when marked as active 1`
       style={
         [
           {
-            "color": "#b7bbc8",
+            "color": "#babbbe",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "fontWeight": 400,
@@ -481,7 +481,7 @@ exports[`Tab Disabled State shows muted text color when disabled and inactive 1`
       style={
         [
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Bold",
             "fontSize": 16,
             "fontWeight": 400,
@@ -502,7 +502,7 @@ exports[`Tab Disabled State shows muted text color when disabled and inactive 1`
       style={
         [
           {
-            "color": "#b7bbc8",
+            "color": "#babbbe",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "fontWeight": 400,
@@ -586,7 +586,7 @@ exports[`Tab Rendering renders correctly 1`] = `
       style={
         [
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Bold",
             "fontSize": 16,
             "fontWeight": 400,
@@ -607,7 +607,7 @@ exports[`Tab Rendering renders correctly 1`] = `
       style={
         [
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "fontWeight": 400,
diff --git a/app/component-library/components-temp/Tabs/TabsBar/__snapshots__/TabsBar.test.tsx.snap b/app/component-library/components-temp/Tabs/TabsBar/__snapshots__/TabsBar.test.tsx.snap
index b869bafcd87b..90e07abab467 100644
--- a/app/component-library/components-temp/Tabs/TabsBar/__snapshots__/TabsBar.test.tsx.snap
+++ b/app/component-library/components-temp/Tabs/TabsBar/__snapshots__/TabsBar.test.tsx.snap
@@ -88,7 +88,7 @@ exports[`TabsBar Automatic Scroll Detection renders without scroll view initiall
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -109,7 +109,7 @@ exports[`TabsBar Automatic Scroll Detection renders without scroll view initiall
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -191,7 +191,7 @@ exports[`TabsBar Automatic Scroll Detection renders without scroll view initiall
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -212,7 +212,7 @@ exports[`TabsBar Automatic Scroll Detection renders without scroll view initiall
           style={
             [
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -294,7 +294,7 @@ exports[`TabsBar Automatic Scroll Detection renders without scroll view initiall
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -315,7 +315,7 @@ exports[`TabsBar Automatic Scroll Detection renders without scroll view initiall
           style={
             [
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -431,7 +431,7 @@ exports[`TabsBar Edge Cases handles invalid activeIndex gracefully 1`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -452,7 +452,7 @@ exports[`TabsBar Edge Cases handles invalid activeIndex gracefully 1`] = `
           style={
             [
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -534,7 +534,7 @@ exports[`TabsBar Edge Cases handles invalid activeIndex gracefully 1`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -555,7 +555,7 @@ exports[`TabsBar Edge Cases handles invalid activeIndex gracefully 1`] = `
           style={
             [
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -637,7 +637,7 @@ exports[`TabsBar Edge Cases handles invalid activeIndex gracefully 1`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -658,7 +658,7 @@ exports[`TabsBar Edge Cases handles invalid activeIndex gracefully 1`] = `
           style={
             [
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -774,7 +774,7 @@ exports[`TabsBar Edge Cases handles negative activeIndex gracefully 1`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -795,7 +795,7 @@ exports[`TabsBar Edge Cases handles negative activeIndex gracefully 1`] = `
           style={
             [
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -877,7 +877,7 @@ exports[`TabsBar Edge Cases handles negative activeIndex gracefully 1`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -898,7 +898,7 @@ exports[`TabsBar Edge Cases handles negative activeIndex gracefully 1`] = `
           style={
             [
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -980,7 +980,7 @@ exports[`TabsBar Edge Cases handles negative activeIndex gracefully 1`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -1001,7 +1001,7 @@ exports[`TabsBar Edge Cases handles negative activeIndex gracefully 1`] = `
           style={
             [
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -1118,7 +1118,7 @@ exports[`TabsBar Individual Tab Disabling hides underline when no tab is active
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -1139,7 +1139,7 @@ exports[`TabsBar Individual Tab Disabling hides underline when no tab is active
           style={
             [
               {
-                "color": "#b7bbc8",
+                "color": "#babbbe",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -1222,7 +1222,7 @@ exports[`TabsBar Individual Tab Disabling hides underline when no tab is active
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -1243,7 +1243,7 @@ exports[`TabsBar Individual Tab Disabling hides underline when no tab is active
           style={
             [
               {
-                "color": "#b7bbc8",
+                "color": "#babbbe",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -1326,7 +1326,7 @@ exports[`TabsBar Individual Tab Disabling hides underline when no tab is active
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -1347,7 +1347,7 @@ exports[`TabsBar Individual Tab Disabling hides underline when no tab is active
           style={
             [
               {
-                "color": "#b7bbc8",
+                "color": "#babbbe",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -1463,7 +1463,7 @@ exports[`TabsBar Individual Tab Disabling renders disabled tabs with correct sty
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -1484,7 +1484,7 @@ exports[`TabsBar Individual Tab Disabling renders disabled tabs with correct sty
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -1567,7 +1567,7 @@ exports[`TabsBar Individual Tab Disabling renders disabled tabs with correct sty
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -1588,7 +1588,7 @@ exports[`TabsBar Individual Tab Disabling renders disabled tabs with correct sty
           style={
             [
               {
-                "color": "#b7bbc8",
+                "color": "#babbbe",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -1670,7 +1670,7 @@ exports[`TabsBar Individual Tab Disabling renders disabled tabs with correct sty
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -1691,7 +1691,7 @@ exports[`TabsBar Individual Tab Disabling renders disabled tabs with correct sty
           style={
             [
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -1840,7 +1840,7 @@ exports[`TabsBar Rendering renders correctly with tabs 1`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -1861,7 +1861,7 @@ exports[`TabsBar Rendering renders correctly with tabs 1`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -1943,7 +1943,7 @@ exports[`TabsBar Rendering renders correctly with tabs 1`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -1964,7 +1964,7 @@ exports[`TabsBar Rendering renders correctly with tabs 1`] = `
           style={
             [
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -2046,7 +2046,7 @@ exports[`TabsBar Rendering renders correctly with tabs 1`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -2067,7 +2067,7 @@ exports[`TabsBar Rendering renders correctly with tabs 1`] = `
           style={
             [
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -2183,7 +2183,7 @@ exports[`TabsBar Underline Animation renders animated underline 1`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -2204,7 +2204,7 @@ exports[`TabsBar Underline Animation renders animated underline 1`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -2286,7 +2286,7 @@ exports[`TabsBar Underline Animation renders animated underline 1`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -2307,7 +2307,7 @@ exports[`TabsBar Underline Animation renders animated underline 1`] = `
           style={
             [
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -2389,7 +2389,7 @@ exports[`TabsBar Underline Animation renders animated underline 1`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -2410,7 +2410,7 @@ exports[`TabsBar Underline Animation renders animated underline 1`] = `
           style={
             [
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "fontWeight": 400,
diff --git a/app/component-library/components-temp/Tabs/TabsList/__snapshots__/TabsList.test.tsx.snap b/app/component-library/components-temp/Tabs/TabsList/__snapshots__/TabsList.test.tsx.snap
index 24046006fbdc..27f3133fd6b1 100644
--- a/app/component-library/components-temp/Tabs/TabsList/__snapshots__/TabsList.test.tsx.snap
+++ b/app/component-library/components-temp/Tabs/TabsList/__snapshots__/TabsList.test.tsx.snap
@@ -101,7 +101,7 @@ exports[`TabsList Edge Cases handles non-React element children with default val
             style={
               [
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Bold",
                   "fontSize": 16,
                   "fontWeight": 400,
@@ -122,7 +122,7 @@ exports[`TabsList Edge Cases handles non-React element children with default val
             style={
               [
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Bold",
                   "fontSize": 16,
                   "fontWeight": 400,
@@ -187,7 +187,7 @@ exports[`TabsList Edge Cases handles non-React element children with default val
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -275,7 +275,7 @@ exports[`TabsList passes BoxProps to underlying Box component 1`] = `
   style={
     [
       {
-        "backgroundColor": "#f3f5f9",
+        "backgroundColor": "#f3f3f4",
         "display": "flex",
         "paddingBottom": 16,
         "paddingLeft": 16,
@@ -373,7 +373,7 @@ exports[`TabsList passes BoxProps to underlying Box component 1`] = `
             style={
               [
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Bold",
                   "fontSize": 16,
                   "fontWeight": 400,
@@ -394,7 +394,7 @@ exports[`TabsList passes BoxProps to underlying Box component 1`] = `
             style={
               [
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Bold",
                   "fontSize": 16,
                   "fontWeight": 400,
@@ -476,7 +476,7 @@ exports[`TabsList passes BoxProps to underlying Box component 1`] = `
             style={
               [
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Bold",
                   "fontSize": 16,
                   "fontWeight": 400,
@@ -497,7 +497,7 @@ exports[`TabsList passes BoxProps to underlying Box component 1`] = `
             style={
               [
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "fontWeight": 400,
@@ -562,7 +562,7 @@ exports[`TabsList passes BoxProps to underlying Box component 1`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -683,7 +683,7 @@ exports[`TabsList renders correctly with multiple tabs 1`] = `
             style={
               [
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Bold",
                   "fontSize": 16,
                   "fontWeight": 400,
@@ -704,7 +704,7 @@ exports[`TabsList renders correctly with multiple tabs 1`] = `
             style={
               [
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Bold",
                   "fontSize": 16,
                   "fontWeight": 400,
@@ -786,7 +786,7 @@ exports[`TabsList renders correctly with multiple tabs 1`] = `
             style={
               [
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Bold",
                   "fontSize": 16,
                   "fontWeight": 400,
@@ -807,7 +807,7 @@ exports[`TabsList renders correctly with multiple tabs 1`] = `
             style={
               [
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "fontWeight": 400,
@@ -889,7 +889,7 @@ exports[`TabsList renders correctly with multiple tabs 1`] = `
             style={
               [
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Bold",
                   "fontSize": 16,
                   "fontWeight": 400,
@@ -910,7 +910,7 @@ exports[`TabsList renders correctly with multiple tabs 1`] = `
             style={
               [
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "fontWeight": 400,
@@ -975,7 +975,7 @@ exports[`TabsList renders correctly with multiple tabs 1`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "fontWeight": 400,
diff --git a/app/component-library/components-temp/TagColored/TagColored.tsx b/app/component-library/components-temp/TagColored/TagColored.tsx
index 631565ca9d4f..e054ce3a003a 100644
--- a/app/component-library/components-temp/TagColored/TagColored.tsx
+++ b/app/component-library/components-temp/TagColored/TagColored.tsx
@@ -25,14 +25,21 @@ const TagColored: React.FC<TagColoredProps> = ({
   labelProps,
 }) => {
   const { styles } = useStyles(styleSheet, { style, color });
+
+  const {
+    testID = TAGCOLORED_TEXT_TESTID,
+    style: labelStyle,
+    ...otherLabelProps
+  } = labelProps || {};
+
   return (
     <View style={styles.base} testID={TAGCOLORED_TESTID}>
       {typeof children === 'string' ? (
         <Text
           variant={DEFAULT_TAGCOLORED_TEXTVARIANT}
-          {...labelProps}
-          style={StyleSheet.flatten([styles.text, labelProps?.style])}
-          testID={TAGCOLORED_TEXT_TESTID}
+          {...otherLabelProps}
+          testID={testID}
+          style={StyleSheet.flatten([styles.text, labelStyle])}
         >
           {children}
         </Text>
diff --git a/app/component-library/components-temp/TagColored/__snapshots__/TagColored.test.tsx.snap b/app/component-library/components-temp/TagColored/__snapshots__/TagColored.test.tsx.snap
index bce78be083ae..1ce506d8c26c 100644
--- a/app/component-library/components-temp/TagColored/__snapshots__/TagColored.test.tsx.snap
+++ b/app/component-library/components-temp/TagColored/__snapshots__/TagColored.test.tsx.snap
@@ -6,7 +6,7 @@ exports[`TagColored renders with default props and matches snapshot 1`] = `
     {
       "alignItems": "center",
       "alignSelf": "flex-start",
-      "backgroundColor": "#f3f5f9",
+      "backgroundColor": "#f3f3f4",
       "borderRadius": 4,
       "height": 20,
       "justifyContent": "center",
@@ -19,7 +19,7 @@ exports[`TagColored renders with default props and matches snapshot 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#686e7d",
+        "color": "#66676a",
         "fontFamily": "Geist-Bold",
         "fontSize": 12,
         "fontWeight": "bold",
diff --git a/app/component-library/components-temp/TitleStandard/TitleStandard.tsx b/app/component-library/components-temp/TitleStandard/TitleStandard.tsx
index 13938438af78..55fa36d0b1b2 100644
--- a/app/component-library/components-temp/TitleStandard/TitleStandard.tsx
+++ b/app/component-library/components-temp/TitleStandard/TitleStandard.tsx
@@ -68,7 +68,7 @@ const TitleStandard: React.FC<TitleStandardProps> = ({
         alignItems={BoxAlignItems.Center}
       >
         {title && (
-          <Text variant={TextVariant.DisplayMd} {...titleProps}>
+          <Text variant={TextVariant.HeadingLg} {...titleProps}>
             {title}
           </Text>
         )}
diff --git a/app/component-library/components-temp/TitleStandard/TitleStandard.types.ts b/app/component-library/components-temp/TitleStandard/TitleStandard.types.ts
index 4bbb56046ed5..9f5b43ea2d9e 100644
--- a/app/component-library/components-temp/TitleStandard/TitleStandard.types.ts
+++ b/app/component-library/components-temp/TitleStandard/TitleStandard.types.ts
@@ -9,7 +9,7 @@ import { TextProps } from '@metamask/design-system-react-native';
  */
 export interface TitleStandardProps {
   /**
-   * Main title text, rendered with TextVariant.DisplayMd.
+   * Main title text, rendered with TextVariant.HeadingLg.
    */
   title?: string;
   /**
diff --git a/app/component-library/components/Avatars/Avatar/foundation/AvatarBase/AvatarBase.tsx b/app/component-library/components/Avatars/Avatar/foundation/AvatarBase/AvatarBase.tsx
index edd48964072d..b91229342edf 100644
--- a/app/component-library/components/Avatars/Avatar/foundation/AvatarBase/AvatarBase.tsx
+++ b/app/component-library/components/Avatars/Avatar/foundation/AvatarBase/AvatarBase.tsx
@@ -1,9 +1,5 @@
 /* eslint-disable react/prop-types */
 
-/**
- * @deprecated Please update your code to use `AvatarBase` from `@metamask/design-system-react-native`
- */
-
 // Third party dependencies.
 import React from 'react';
 import { View } from 'react-native';
@@ -16,6 +12,11 @@ import { AvatarBaseProps } from './AvatarBase.types';
 import styleSheet from './AvatarBase.styles';
 import { DEFAULT_AVATARBASE_SIZE } from './AvatarBase.constants';
 
+/**
+ * @deprecated Please update your code to use `AvatarBase` from `@metamask/design-system-react-native`.
+ * The API may have changed — compare props before migrating.
+ * @see {@link https://github.com/MetaMask/metamask-design-system/blob/main/packages/design-system-react-native/src/components/AvatarBase/README.md}
+ */
 const AvatarBase: React.FC<AvatarBaseProps> = ({
   size = DEFAULT_AVATARBASE_SIZE,
   style,
diff --git a/app/component-library/components/Avatars/Avatar/variants/AvatarAccount/AvatarAccount.tsx b/app/component-library/components/Avatars/Avatar/variants/AvatarAccount/AvatarAccount.tsx
index 9c0a40972165..d699b15f2fee 100644
--- a/app/component-library/components/Avatars/Avatar/variants/AvatarAccount/AvatarAccount.tsx
+++ b/app/component-library/components/Avatars/Avatar/variants/AvatarAccount/AvatarAccount.tsx
@@ -29,6 +29,11 @@ function getJazziconSeed(address: string) {
   return parseInt(address.slice(2, 10), 16);
 }
 
+/**
+ * @deprecated Please update your code to use `AvatarAccount` from `@metamask/design-system-react-native`.
+ * The API may have changed — compare props before migrating.
+ * @see {@link https://github.com/MetaMask/metamask-design-system/blob/main/packages/design-system-react-native/src/components/AvatarAccount/README.md}
+ */
 const AvatarAccount = ({
   type: avatarType = DEFAULT_AVATARACCOUNT_TYPE,
   accountAddress,
diff --git a/app/component-library/components/Avatars/Avatar/variants/AvatarFavicon/AvatarFavicon.tsx b/app/component-library/components/Avatars/Avatar/variants/AvatarFavicon/AvatarFavicon.tsx
index 27b356d91506..de46353f9357 100644
--- a/app/component-library/components/Avatars/Avatar/variants/AvatarFavicon/AvatarFavicon.tsx
+++ b/app/component-library/components/Avatars/Avatar/variants/AvatarFavicon/AvatarFavicon.tsx
@@ -22,6 +22,11 @@ import {
 import stylesheet from './AvatarFavicon.styles';
 import { AvatarFaviconProps } from './AvatarFavicon.types';
 
+/**
+ * @deprecated Please update your code to use `AvatarFavicon` from `@metamask/design-system-react-native`.
+ * The API may have changed — compare props before migrating.
+ * @see {@link https://github.com/MetaMask/metamask-design-system/blob/main/packages/design-system-react-native/src/components/AvatarFavicon/README.md}
+ */
 const AvatarFavicon = ({
   imageSource,
   size = DEFAULT_AVATARFAVICON_SIZE,
diff --git a/app/component-library/components/Avatars/Avatar/variants/AvatarIcon/AvatarIcon.tsx b/app/component-library/components/Avatars/Avatar/variants/AvatarIcon/AvatarIcon.tsx
index 2b5bb4b70722..4600bb72cf8c 100644
--- a/app/component-library/components/Avatars/Avatar/variants/AvatarIcon/AvatarIcon.tsx
+++ b/app/component-library/components/Avatars/Avatar/variants/AvatarIcon/AvatarIcon.tsx
@@ -1,9 +1,5 @@
 /* eslint-disable react/prop-types */
 
-/**
- * @deprecated Please update your code to use `AvatarIcon` from `@metamask/design-system-react-native`
- */
-
 // Third party dependencies.
 import React from 'react';
 
@@ -18,6 +14,11 @@ import stylesheet from './AvatarIcon.styles';
 import { AvatarIconProps } from './AvatarIcon.types';
 import { DEFAULT_AVATARICON_SIZE } from './AvatarIcon.constants';
 
+/**
+ * @deprecated Please update your code to use `AvatarIcon` from `@metamask/design-system-react-native`.
+ * The API may have changed — compare props before migrating.
+ * @see {@link https://github.com/MetaMask/metamask-design-system/blob/main/packages/design-system-react-native/src/components/AvatarIcon/README.md}
+ */
 const AvatarIcon = ({
   size = DEFAULT_AVATARICON_SIZE,
   name,
diff --git a/app/component-library/components/Avatars/Avatar/variants/AvatarIcon/__snapshots__/AvatarIcon.test.tsx.snap b/app/component-library/components/Avatars/Avatar/variants/AvatarIcon/__snapshots__/AvatarIcon.test.tsx.snap
index 0d756c875baf..e21ab545cf3e 100644
--- a/app/component-library/components/Avatars/Avatar/variants/AvatarIcon/__snapshots__/AvatarIcon.test.tsx.snap
+++ b/app/component-library/components/Avatars/Avatar/variants/AvatarIcon/__snapshots__/AvatarIcon.test.tsx.snap
@@ -15,7 +15,7 @@ exports[`AvatarIcon should render correctly 1`] = `
   }
 >
   <SvgMock
-    color="#121314"
+    color="#131416"
     fill="currentColor"
     height={20}
     name="AddSquare"
diff --git a/app/component-library/components/Avatars/Avatar/variants/AvatarNetwork/AvatarNetwork.tsx b/app/component-library/components/Avatars/Avatar/variants/AvatarNetwork/AvatarNetwork.tsx
index e8253980f831..03a28588cc7c 100644
--- a/app/component-library/components/Avatars/Avatar/variants/AvatarNetwork/AvatarNetwork.tsx
+++ b/app/component-library/components/Avatars/Avatar/variants/AvatarNetwork/AvatarNetwork.tsx
@@ -1,9 +1,5 @@
 /* eslint-disable react/prop-types */
 
-/**
- * @deprecated Please update your code to use `AvatarNetwork` from `@metamask/design-system-react-native`
- */
-
 // Third party dependencies.
 import React, { useCallback, useEffect, useState } from 'react';
 import { Image, ImageSourcePropType } from 'react-native';
@@ -22,6 +18,11 @@ import {
   AVATARNETWORK_IMAGE_TESTID,
 } from './AvatarNetwork.constants';
 
+/**
+ * @deprecated Please update your code to use `AvatarNetwork` from `@metamask/design-system-react-native`.
+ * The API may have changed — compare props before migrating.
+ * @see {@link https://github.com/MetaMask/metamask-design-system/blob/main/packages/design-system-react-native/src/components/AvatarNetwork/README.md}
+ */
 const AvatarNetwork = ({
   size = DEFAULT_AVATARNETWORK_SIZE,
   style,
diff --git a/app/component-library/components/Avatars/Avatar/variants/AvatarToken/AvatarToken.tsx b/app/component-library/components/Avatars/Avatar/variants/AvatarToken/AvatarToken.tsx
index b5363460a4e4..3495d62993de 100644
--- a/app/component-library/components/Avatars/Avatar/variants/AvatarToken/AvatarToken.tsx
+++ b/app/component-library/components/Avatars/Avatar/variants/AvatarToken/AvatarToken.tsx
@@ -1,7 +1,3 @@
-/**
- * @deprecated Please update your code to use `AvatarToken` from `@metamask/design-system-react-native`
- */
-
 // Third party dependencies.
 import { isNumber } from 'lodash';
 import React, { useState } from 'react';
@@ -25,6 +21,11 @@ import {
   AVATARTOKEN_IMAGE_TESTID,
 } from './AvatarToken.constants';
 
+/**
+ * @deprecated Please update your code to use `AvatarToken` from `@metamask/design-system-react-native`.
+ * The API may have changed — compare props before migrating.
+ * @see {@link https://github.com/MetaMask/metamask-design-system/blob/main/packages/design-system-react-native/src/components/AvatarToken/README.md}
+ */
 const AvatarToken = ({
   size = DEFAULT_AVATARTOKEN_SIZE,
   style,
diff --git a/app/component-library/components/Avatars/AvatarGroup/AvatarGroup.tsx b/app/component-library/components/Avatars/AvatarGroup/AvatarGroup.tsx
index 52df4a55aaee..7a1368293ad7 100644
--- a/app/component-library/components/Avatars/AvatarGroup/AvatarGroup.tsx
+++ b/app/component-library/components/Avatars/AvatarGroup/AvatarGroup.tsx
@@ -22,6 +22,11 @@ import {
   AVATARGROUP_CONTAINER_TESTID,
 } from './AvatarGroup.constants';
 
+/**
+ * @deprecated Please update your code to use `AvatarGroup` from `@metamask/design-system-react-native`.
+ * The API may have changed — compare props before migrating.
+ * @see {@link https://github.com/MetaMask/metamask-design-system/blob/main/packages/design-system-react-native/src/components/AvatarGroup/README.md}
+ */
 const AvatarGroup = ({
   avatarPropsList,
   size = DEFAULT_AVATARGROUP_AVATARSIZE,
diff --git a/app/component-library/components/Avatars/AvatarGroup/__snapshots__/AvatarGroup.test.tsx.snap b/app/component-library/components/Avatars/AvatarGroup/__snapshots__/AvatarGroup.test.tsx.snap
index 551b609ca159..5d91a80842d9 100644
--- a/app/component-library/components/Avatars/AvatarGroup/__snapshots__/AvatarGroup.test.tsx.snap
+++ b/app/component-library/components/Avatars/AvatarGroup/__snapshots__/AvatarGroup.test.tsx.snap
@@ -33,7 +33,7 @@ exports[`AvatarGroup should render AvatarGroup component 1`] = `
       testID="avatargroup-avatar"
     >
       <SvgMock
-        color="#121314"
+        color="#131416"
         fill="currentColor"
         height={12}
         name="AddSquare"
@@ -159,7 +159,7 @@ exports[`AvatarGroup should render AvatarGroup component 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#686e7d",
+        "color": "#66676a",
         "fontFamily": "Geist-Medium",
         "fontSize": 14,
         "letterSpacing": 0,
diff --git a/app/component-library/components/Badges/Badge/foundation/BadgeBase/BadgeBase.tsx b/app/component-library/components/Badges/Badge/foundation/BadgeBase/BadgeBase.tsx
index b72f7cb9a590..c6344cddb4d6 100644
--- a/app/component-library/components/Badges/Badge/foundation/BadgeBase/BadgeBase.tsx
+++ b/app/component-library/components/Badges/Badge/foundation/BadgeBase/BadgeBase.tsx
@@ -1,9 +1,5 @@
 /* eslint-disable react/prop-types */
 
-/**
- * @deprecated Please update your code to use `BadgeCount`, `BadgeIcon`, `BadgeNetwork` or `BadgeStatus` from `@metamask/design-system-react-native`
- */
-
 // Third library dependencies.
 import React from 'react';
 import { View } from 'react-native';
@@ -16,6 +12,11 @@ import { BADGE_BASE_TEST_ID } from './BadgeBase.constants';
 import { BadgeBaseProps } from './BadgeBase.types';
 import styleSheet from './BadgeBase.styles';
 
+/**
+ * @deprecated Please update your code to use `BadgeCount`, `BadgeIcon`, `BadgeNetwork` or `BadgeStatus` from `@metamask/design-system-react-native`.
+ * The API may have changed — compare props before migrating.
+ * @see {@link https://github.com/MetaMask/metamask-design-system/tree/main/packages/design-system-react-native/src/components}
+ */
 const BadgeBase: React.FC<BadgeBaseProps> = ({ children, style, ...props }) => {
   const { styles } = useStyles(styleSheet, {
     style,
diff --git a/app/component-library/components/Badges/Badge/variants/BadgeNetwork/BadgeNetwork.tsx b/app/component-library/components/Badges/Badge/variants/BadgeNetwork/BadgeNetwork.tsx
index 52cf608b7fd7..2c9ce8f5f9cf 100644
--- a/app/component-library/components/Badges/Badge/variants/BadgeNetwork/BadgeNetwork.tsx
+++ b/app/component-library/components/Badges/Badge/variants/BadgeNetwork/BadgeNetwork.tsx
@@ -16,6 +16,11 @@ import {
   DEFAULT_BADGENETWORK_NETWORKICON_SIZE,
 } from './BadgeNetwork.constants';
 
+/**
+ * @deprecated Please update your code to use `BadgeNetwork` from `@metamask/design-system-react-native`.
+ * The API may have changed — compare props before migrating.
+ * @see {@link https://github.com/MetaMask/metamask-design-system/blob/main/packages/design-system-react-native/src/components/BadgeNetwork/README.md}
+ */
 const BadgeNetwork = ({
   style,
   name,
diff --git a/app/component-library/components/Badges/Badge/variants/BadgeNotifications/BadgeNotifications.tsx b/app/component-library/components/Badges/Badge/variants/BadgeNotifications/BadgeNotifications.tsx
index 42d096ee46e7..38880830ae2e 100644
--- a/app/component-library/components/Badges/Badge/variants/BadgeNotifications/BadgeNotifications.tsx
+++ b/app/component-library/components/Badges/Badge/variants/BadgeNotifications/BadgeNotifications.tsx
@@ -10,6 +10,11 @@ import Icon, { IconSize, IconColor } from '../../../../Icons/Icon';
 import { BadgeNotificationsProps } from './BadgeNotifications.types';
 import styleSheet from './BadgeNotifications.styles';
 
+/**
+ * @deprecated Please update your code to use `BadgeIcon` from `@metamask/design-system-react-native`.
+ * The API may have changed — compare props before migrating.
+ * @see {@link https://github.com/MetaMask/metamask-design-system/blob/main/packages/design-system-react-native/src/components/BadgeIcon/README.md}
+ */
 const BadgeNotifications = ({
   style,
   iconName,
diff --git a/app/component-library/components/Badges/Badge/variants/BadgeStatus/__snapshots__/BadgeStatus.test.tsx.snap b/app/component-library/components/Badges/Badge/variants/BadgeStatus/__snapshots__/BadgeStatus.test.tsx.snap
index bb0b7800c133..9afeb1d8321b 100644
--- a/app/component-library/components/Badges/Badge/variants/BadgeStatus/__snapshots__/BadgeStatus.test.tsx.snap
+++ b/app/component-library/components/Badges/Badge/variants/BadgeStatus/__snapshots__/BadgeStatus.test.tsx.snap
@@ -4,7 +4,7 @@ exports[`BadgeStatus should render badge status correctly 1`] = `
 <BadgeBase
   style={
     {
-      "backgroundColor": "#686e7d",
+      "backgroundColor": "#66676a",
       "borderColor": "#ffffff",
       "borderRadius": 5,
       "borderWidth": 2,
diff --git a/app/component-library/components/Badges/BadgeWrapper/BadgeWrapper.tsx b/app/component-library/components/Badges/BadgeWrapper/BadgeWrapper.tsx
index 3aa7d4e21d8c..4cd953a90ca0 100644
--- a/app/component-library/components/Badges/BadgeWrapper/BadgeWrapper.tsx
+++ b/app/component-library/components/Badges/BadgeWrapper/BadgeWrapper.tsx
@@ -1,9 +1,5 @@
 /* eslint-disable react/prop-types */
 
-/**
- * @deprecated Please update your code to use `BadgeWrapper` from `@metamask/design-system-react-native`
- */
-
 // Third library dependencies.
 import React from 'react';
 import { View } from 'react-native';
@@ -20,6 +16,11 @@ import {
   BADGE_WRAPPER_BADGE_TEST_ID,
 } from './BadgeWrapper.constants';
 
+/**
+ * @deprecated Please update your code to use `BadgeWrapper` from `@metamask/design-system-react-native`.
+ * The API may have changed — compare props before migrating.
+ * @see {@link https://github.com/MetaMask/metamask-design-system/blob/main/packages/design-system-react-native/src/components/BadgeWrapper/README.md}
+ */
 const BadgeWrapper: React.FC<BadgeWrapperProps> = ({
   anchorElementShape = DEFAULT_BADGEWRAPPER_BADGEANCHORELEMENTSHAPE,
   badgePosition = DEFAULT_BADGEWRAPPER_BADGEPOSITION,
diff --git a/app/component-library/components/Banners/Banner/__snapshots__/Banner.test.tsx.snap b/app/component-library/components/Banners/Banner/__snapshots__/Banner.test.tsx.snap
index 6d4f421d7ce8..4cf945cd381f 100644
--- a/app/component-library/components/Banners/Banner/__snapshots__/Banner.test.tsx.snap
+++ b/app/component-library/components/Banners/Banner/__snapshots__/Banner.test.tsx.snap
@@ -48,9 +48,9 @@ exports[`Banner should render correctly 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Medium",
-          "fontSize": 18,
+          "fontSize": 16,
           "letterSpacing": 0,
           "lineHeight": 24,
         }
@@ -62,11 +62,11 @@ exports[`Banner should render correctly 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
-          "fontSize": 16,
+          "fontSize": 14,
           "letterSpacing": 0,
-          "lineHeight": 24,
+          "lineHeight": 22,
         }
       }
     >
@@ -124,9 +124,9 @@ exports[`Banner should render correctly with a close button 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Medium",
-          "fontSize": 18,
+          "fontSize": 16,
           "letterSpacing": 0,
           "lineHeight": 24,
         }
@@ -138,11 +138,11 @@ exports[`Banner should render correctly with a close button 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
-          "fontSize": 16,
+          "fontSize": 14,
           "letterSpacing": 0,
-          "lineHeight": 24,
+          "lineHeight": 22,
         }
       }
     >
@@ -159,7 +159,7 @@ exports[`Banner should render correctly with a close button 1`] = `
         {
           "alignItems": "center",
           "alignSelf": "flex-start",
-          "backgroundColor": "#3c4d9d0f",
+          "backgroundColor": "#b4b4b528",
           "borderColor": "transparent",
           "borderRadius": 0,
           "borderWidth": 1,
@@ -175,7 +175,7 @@ exports[`Banner should render correctly with a close button 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -214,7 +214,7 @@ exports[`Banner should render correctly with a close button 1`] = `
       testID="banner-close-button-icon"
     >
       <SvgMock
-        color="#121314"
+        color="#131416"
         fill="currentColor"
         height={16}
         name="Close"
@@ -258,7 +258,7 @@ exports[`Banner should render correctly with a start accessory 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -280,9 +280,9 @@ exports[`Banner should render correctly with a start accessory 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Medium",
-          "fontSize": 18,
+          "fontSize": 16,
           "letterSpacing": 0,
           "lineHeight": 24,
         }
@@ -294,11 +294,11 @@ exports[`Banner should render correctly with a start accessory 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
-          "fontSize": 16,
+          "fontSize": 14,
           "letterSpacing": 0,
-          "lineHeight": 24,
+          "lineHeight": 22,
         }
       }
     >
@@ -356,9 +356,9 @@ exports[`Banner should render correctly with an action button 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Medium",
-          "fontSize": 18,
+          "fontSize": 16,
           "letterSpacing": 0,
           "lineHeight": 24,
         }
@@ -370,11 +370,11 @@ exports[`Banner should render correctly with an action button 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
-          "fontSize": 16,
+          "fontSize": 14,
           "letterSpacing": 0,
-          "lineHeight": 24,
+          "lineHeight": 22,
         }
       }
     >
@@ -391,7 +391,7 @@ exports[`Banner should render correctly with an action button 1`] = `
         {
           "alignItems": "center",
           "alignSelf": "flex-start",
-          "backgroundColor": "#3c4d9d0f",
+          "backgroundColor": "#b4b4b528",
           "borderColor": "transparent",
           "borderRadius": 0,
           "borderWidth": 1,
@@ -407,7 +407,7 @@ exports[`Banner should render correctly with an action button 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "letterSpacing": 0,
diff --git a/app/component-library/components/Banners/Banner/foundation/BannerBase/BannerBase.constants.tsx b/app/component-library/components/Banners/Banner/foundation/BannerBase/BannerBase.constants.tsx
index c520f9d7ad4a..fd9f5bdd09f8 100644
--- a/app/component-library/components/Banners/Banner/foundation/BannerBase/BannerBase.constants.tsx
+++ b/app/component-library/components/Banners/Banner/foundation/BannerBase/BannerBase.constants.tsx
@@ -18,8 +18,8 @@ import { BannerBaseProps } from './BannerBase.types';
 export const TESTID_BANNER_CLOSE_BUTTON_ICON = 'banner-close-button-icon';
 
 // Defaults
-export const DEFAULT_BANNERBASE_TITLE_TEXTVARIANT = TextVariant.BodyLGMedium;
-export const DEFAULT_BANNERBASE_DESCRIPTION_TEXTVARIANT = TextVariant.BodyMD;
+export const DEFAULT_BANNERBASE_TITLE_TEXTVARIANT = TextVariant.BodyMDMedium;
+export const DEFAULT_BANNERBASE_DESCRIPTION_TEXTVARIANT = TextVariant.BodySM;
 export const DEFAULT_BANNERBASE_ACTIONBUTTON_VARIANT = ButtonVariants.Link;
 export const DEFAULT_BANNERBASE_ACTIONBUTTON_SIZE = ButtonSize.Auto;
 export const DEFAULT_BANNERBASE_CLOSEBUTTON_BUTTONICON_ICONCOLOR =
diff --git a/app/component-library/components/Banners/Banner/variants/BannerAlert/__snapshots__/BannerAlert.test.tsx.snap b/app/component-library/components/Banners/Banner/variants/BannerAlert/__snapshots__/BannerAlert.test.tsx.snap
index 4df2bbcd7cb1..6c72547eb7f7 100644
--- a/app/component-library/components/Banners/Banner/variants/BannerAlert/__snapshots__/BannerAlert.test.tsx.snap
+++ b/app/component-library/components/Banners/Banner/variants/BannerAlert/__snapshots__/BannerAlert.test.tsx.snap
@@ -47,9 +47,9 @@ exports[`BannerAlert should render BannerAlert 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Medium",
-          "fontSize": 18,
+          "fontSize": 16,
           "letterSpacing": 0,
           "lineHeight": 24,
         }
@@ -61,11 +61,11 @@ exports[`BannerAlert should render BannerAlert 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
-          "fontSize": 16,
+          "fontSize": 14,
           "letterSpacing": 0,
-          "lineHeight": 24,
+          "lineHeight": 22,
         }
       }
     >
@@ -80,7 +80,7 @@ exports[`BannerAlert should render BannerAlert 1`] = `
       style={
         {
           "backgroundColor": "transparent",
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -132,7 +132,7 @@ exports[`BannerAlert should render BannerAlert 1`] = `
       testID="banner-close-button-icon"
     >
       <SvgMock
-        color="#121314"
+        color="#131416"
         fill="currentColor"
         height={16}
         name="Close"
diff --git a/app/component-library/components/Banners/Banner/variants/BannerTip/__snapshots__/BannerTip.test.tsx.snap b/app/component-library/components/Banners/Banner/variants/BannerTip/__snapshots__/BannerTip.test.tsx.snap
index 522569a3033a..434a775ede9b 100644
--- a/app/component-library/components/Banners/Banner/variants/BannerTip/__snapshots__/BannerTip.test.tsx.snap
+++ b/app/component-library/components/Banners/Banner/variants/BannerTip/__snapshots__/BannerTip.test.tsx.snap
@@ -5,7 +5,7 @@ exports[`BannerTip should render default settings correctly 1`] = `
   style={
     {
       "backgroundColor": "#ffffff",
-      "borderColor": "#b7bbc8",
+      "borderColor": "#949596",
       "borderRadius": 4,
       "borderWidth": 1,
       "flexDirection": "row",
@@ -52,9 +52,9 @@ exports[`BannerTip should render default settings correctly 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Medium",
-          "fontSize": 18,
+          "fontSize": 16,
           "letterSpacing": 0,
           "lineHeight": 24,
         }
@@ -66,11 +66,11 @@ exports[`BannerTip should render default settings correctly 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
-          "fontSize": 16,
+          "fontSize": 14,
           "letterSpacing": 0,
-          "lineHeight": 24,
+          "lineHeight": 22,
         }
       }
     >
@@ -85,7 +85,7 @@ exports[`BannerTip should render default settings correctly 1`] = `
       style={
         {
           "backgroundColor": "transparent",
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -137,7 +137,7 @@ exports[`BannerTip should render default settings correctly 1`] = `
       testID="banner-close-button-icon"
     >
       <SvgMock
-        color="#121314"
+        color="#131416"
         fill="currentColor"
         height={16}
         name="Close"
diff --git a/app/component-library/components/BottomSheets/BottomSheet/foundation/BottomSheetDialog/__snapshots__/BottomSheetDialog.test.tsx.snap b/app/component-library/components/BottomSheets/BottomSheet/foundation/BottomSheetDialog/__snapshots__/BottomSheetDialog.test.tsx.snap
index 15e8965ed082..f75f25612638 100644
--- a/app/component-library/components/BottomSheets/BottomSheet/foundation/BottomSheetDialog/__snapshots__/BottomSheetDialog.test.tsx.snap
+++ b/app/component-library/components/BottomSheets/BottomSheet/foundation/BottomSheetDialog/__snapshots__/BottomSheetDialog.test.tsx.snap
@@ -29,7 +29,7 @@ exports[`BottomSheetDialog should render correctly 1`] = `
       [
         {
           "backgroundColor": "#ffffff",
-          "borderColor": "#b7bbc866",
+          "borderColor": "#b4b4b566",
           "borderTopLeftRadius": 24,
           "borderTopRightRadius": 24,
           "borderWidth": 1,
@@ -66,7 +66,7 @@ exports[`BottomSheetDialog should render correctly 1`] = `
       <View
         style={
           {
-            "backgroundColor": "#b7bbc866",
+            "backgroundColor": "#b4b4b566",
             "borderRadius": 2,
             "height": 4,
             "width": 40,
diff --git a/app/component-library/components/BottomSheets/BottomSheetFooter/__snapshots__/BottomSheetFooter.test.tsx.snap b/app/component-library/components/BottomSheets/BottomSheetFooter/__snapshots__/BottomSheetFooter.test.tsx.snap
index 1374691f1c30..a6131c052b47 100644
--- a/app/component-library/components/BottomSheets/BottomSheetFooter/__snapshots__/BottomSheetFooter.test.tsx.snap
+++ b/app/component-library/components/BottomSheets/BottomSheetFooter/__snapshots__/BottomSheetFooter.test.tsx.snap
@@ -22,7 +22,7 @@ exports[`BottomSheetFooter should render snapshot correctly 1`] = `
       {
         "alignItems": "center",
         "alignSelf": "flex-start",
-        "backgroundColor": "#3c4d9d0f",
+        "backgroundColor": "#b4b4b528",
         "borderColor": "transparent",
         "borderRadius": 12,
         "borderWidth": 1,
@@ -40,7 +40,7 @@ exports[`BottomSheetFooter should render snapshot correctly 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Medium",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -62,7 +62,7 @@ exports[`BottomSheetFooter should render snapshot correctly 1`] = `
       {
         "alignItems": "center",
         "alignSelf": "flex-start",
-        "backgroundColor": "#121314",
+        "backgroundColor": "#131416",
         "borderRadius": 12,
         "flex": 1,
         "flexDirection": "row",
diff --git a/app/component-library/components/BottomSheets/BottomSheetHeader/BottomSheetHeader.tsx b/app/component-library/components/BottomSheets/BottomSheetHeader/BottomSheetHeader.tsx
index 827efbd29033..9bd7af609e59 100644
--- a/app/component-library/components/BottomSheets/BottomSheetHeader/BottomSheetHeader.tsx
+++ b/app/component-library/components/BottomSheets/BottomSheetHeader/BottomSheetHeader.tsx
@@ -35,7 +35,7 @@ const BottomSheetHeader: React.FC<BottomSheetHeaderProps> = ({
       iconName={IconName.ArrowLeft}
       iconColor={IconColor.Default}
       onPress={onBack}
-      size={ButtonIconSizes.Lg}
+      size={ButtonIconSizes.Md}
       {...backButtonProps}
     />
   );
diff --git a/app/component-library/components/BottomSheets/BottomSheetHeader/__snapshots__/BottomSheetHeader.test.tsx.snap b/app/component-library/components/BottomSheets/BottomSheetHeader/__snapshots__/BottomSheetHeader.test.tsx.snap
index 9832503ee30d..89ee0cf3b17e 100644
--- a/app/component-library/components/BottomSheets/BottomSheetHeader/__snapshots__/BottomSheetHeader.test.tsx.snap
+++ b/app/component-library/components/BottomSheets/BottomSheetHeader/__snapshots__/BottomSheetHeader.test.tsx.snap
@@ -37,7 +37,7 @@ exports[`BottomSheetHeader renders snapshot correctly with Compact variant 1`] =
       style={
         [
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Bold",
             "fontSize": 16,
             "fontWeight": 700,
@@ -93,7 +93,7 @@ exports[`BottomSheetHeader renders snapshot correctly with Display variant 1`] =
       style={
         [
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Bold",
             "fontSize": 24,
             "fontWeight": 700,
@@ -148,7 +148,7 @@ exports[`BottomSheetHeader should render snapshot correctly 1`] = `
       style={
         [
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Bold",
             "fontSize": 16,
             "fontWeight": 700,
diff --git a/app/component-library/components/Buttons/Button/Button.tsx b/app/component-library/components/Buttons/Button/Button.tsx
index b73fdc0dc56c..694b00fa94ec 100644
--- a/app/component-library/components/Buttons/Button/Button.tsx
+++ b/app/component-library/components/Buttons/Button/Button.tsx
@@ -1,9 +1,5 @@
 /* eslint-disable react/prop-types */
 
-/**
- * @deprecated Please update your code to use `Button` from `@metamask/design-system-react-native`
- */
-
 import React from 'react';
 
 // External dependencies.
@@ -14,6 +10,11 @@ import ButtonSecondary from './variants/ButtonSecondary';
 // Internal dependencies.
 import { ButtonProps, ButtonVariants } from './Button.types';
 
+/**
+ * @deprecated Please update your code to use `Button` from `@metamask/design-system-react-native`.
+ * The API may have changed — compare props before migrating.
+ * @see {@link https://github.com/MetaMask/metamask-design-system/blob/main/packages/design-system-react-native/src/components/Button/README.md}
+ */
 const Button = (buttonProps: ButtonProps) => {
   const { variant, ...restProps } = buttonProps;
 
diff --git a/app/component-library/components/Buttons/Button/foundation/ButtonBase/__snapshots__/ButtonBase.test.tsx.snap b/app/component-library/components/Buttons/Button/foundation/ButtonBase/__snapshots__/ButtonBase.test.tsx.snap
index 34d0c19526b8..7f14baa43494 100644
--- a/app/component-library/components/Buttons/Button/foundation/ButtonBase/__snapshots__/ButtonBase.test.tsx.snap
+++ b/app/component-library/components/Buttons/Button/foundation/ButtonBase/__snapshots__/ButtonBase.test.tsx.snap
@@ -10,7 +10,7 @@ exports[`ButtonBase handles custom label color 1`] = `
     {
       "alignItems": "center",
       "alignSelf": "flex-start",
-      "backgroundColor": "#f3f5f9",
+      "backgroundColor": "#f3f3f4",
       "borderRadius": 12,
       "flexDirection": "row",
       "height": 40,
@@ -24,7 +24,7 @@ exports[`ButtonBase handles custom label color 1`] = `
     accessibilityRole="none"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
       }
     }
     variant="sBodyMDMedium"
@@ -44,7 +44,7 @@ exports[`ButtonBase handles custom label text variant 1`] = `
     {
       "alignItems": "center",
       "alignSelf": "flex-start",
-      "backgroundColor": "#f3f5f9",
+      "backgroundColor": "#f3f3f4",
       "borderRadius": 12,
       "flexDirection": "row",
       "height": 40,
@@ -58,7 +58,7 @@ exports[`ButtonBase handles custom label text variant 1`] = `
     accessibilityRole="none"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
       }
     }
     variant="sHeadingSM"
@@ -78,7 +78,7 @@ exports[`ButtonBase handles different sizes: ButtonBase with size 32 1`] = `
     {
       "alignItems": "center",
       "alignSelf": "flex-start",
-      "backgroundColor": "#f3f5f9",
+      "backgroundColor": "#f3f3f4",
       "borderRadius": 12,
       "flexDirection": "row",
       "height": 32,
@@ -92,7 +92,7 @@ exports[`ButtonBase handles different sizes: ButtonBase with size 32 1`] = `
     accessibilityRole="none"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
       }
     }
     variant="sBodyMDMedium"
@@ -112,7 +112,7 @@ exports[`ButtonBase handles different sizes: ButtonBase with size 40 1`] = `
     {
       "alignItems": "center",
       "alignSelf": "flex-start",
-      "backgroundColor": "#f3f5f9",
+      "backgroundColor": "#f3f3f4",
       "borderRadius": 12,
       "flexDirection": "row",
       "height": 40,
@@ -126,7 +126,7 @@ exports[`ButtonBase handles different sizes: ButtonBase with size 40 1`] = `
     accessibilityRole="none"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
       }
     }
     variant="sBodyMDMedium"
@@ -146,7 +146,7 @@ exports[`ButtonBase handles different sizes: ButtonBase with size 48 1`] = `
     {
       "alignItems": "center",
       "alignSelf": "flex-start",
-      "backgroundColor": "#f3f5f9",
+      "backgroundColor": "#f3f3f4",
       "borderRadius": 12,
       "flexDirection": "row",
       "height": 48,
@@ -160,7 +160,7 @@ exports[`ButtonBase handles different sizes: ButtonBase with size 48 1`] = `
     accessibilityRole="none"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
       }
     }
     variant="sBodyMDMedium"
@@ -179,7 +179,7 @@ exports[`ButtonBase handles different widths 1`] = `
   style={
     {
       "alignItems": "center",
-      "backgroundColor": "#f3f5f9",
+      "backgroundColor": "#f3f3f4",
       "borderRadius": 12,
       "flexDirection": "row",
       "height": 40,
@@ -194,7 +194,7 @@ exports[`ButtonBase handles different widths 1`] = `
     accessibilityRole="none"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
       }
     }
     variant="sBodyMDMedium"
@@ -215,7 +215,7 @@ exports[`ButtonBase renders when disabled 1`] = `
     {
       "alignItems": "center",
       "alignSelf": "flex-start",
-      "backgroundColor": "#f3f5f9",
+      "backgroundColor": "#f3f3f4",
       "borderRadius": 12,
       "flexDirection": "row",
       "height": 40,
@@ -230,7 +230,7 @@ exports[`ButtonBase renders when disabled 1`] = `
     accessibilityRole="none"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
       }
     }
     variant="sBodyMDMedium"
@@ -250,7 +250,7 @@ exports[`ButtonBase renders with basic props 1`] = `
     {
       "alignItems": "center",
       "alignSelf": "flex-start",
-      "backgroundColor": "#f3f5f9",
+      "backgroundColor": "#f3f3f4",
       "borderRadius": 12,
       "flexDirection": "row",
       "height": 40,
@@ -264,7 +264,7 @@ exports[`ButtonBase renders with basic props 1`] = `
     accessibilityRole="none"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
       }
     }
     variant="sBodyMDMedium"
@@ -284,7 +284,7 @@ exports[`ButtonBase renders with both start and end icons 1`] = `
     {
       "alignItems": "center",
       "alignSelf": "flex-start",
-      "backgroundColor": "#f3f5f9",
+      "backgroundColor": "#f3f3f4",
       "borderRadius": 12,
       "flexDirection": "row",
       "height": 40,
@@ -308,7 +308,7 @@ exports[`ButtonBase renders with both start and end icons 1`] = `
     accessibilityRole="none"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
       }
     }
     variant="sBodyMDMedium"
@@ -338,7 +338,7 @@ exports[`ButtonBase renders with custom label component 1`] = `
     {
       "alignItems": "center",
       "alignSelf": "flex-start",
-      "backgroundColor": "#f3f5f9",
+      "backgroundColor": "#f3f3f4",
       "borderRadius": 12,
       "flexDirection": "row",
       "height": 40,
@@ -362,7 +362,7 @@ exports[`ButtonBase renders with end icon 1`] = `
     {
       "alignItems": "center",
       "alignSelf": "flex-start",
-      "backgroundColor": "#f3f5f9",
+      "backgroundColor": "#f3f3f4",
       "borderRadius": 12,
       "flexDirection": "row",
       "height": 40,
@@ -376,7 +376,7 @@ exports[`ButtonBase renders with end icon 1`] = `
     accessibilityRole="none"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
       }
     }
     variant="sBodyMDMedium"
@@ -406,7 +406,7 @@ exports[`ButtonBase renders with start icon 1`] = `
     {
       "alignItems": "center",
       "alignSelf": "flex-start",
-      "backgroundColor": "#f3f5f9",
+      "backgroundColor": "#f3f3f4",
       "borderRadius": 12,
       "flexDirection": "row",
       "height": 40,
@@ -430,7 +430,7 @@ exports[`ButtonBase renders with start icon 1`] = `
     accessibilityRole="none"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
       }
     }
     variant="sBodyMDMedium"
diff --git a/app/component-library/components/Buttons/Button/variants/ButtonLink/ButtonLink.tsx b/app/component-library/components/Buttons/Button/variants/ButtonLink/ButtonLink.tsx
index 3b0a4455014d..5a668881f249 100644
--- a/app/component-library/components/Buttons/Button/variants/ButtonLink/ButtonLink.tsx
+++ b/app/component-library/components/Buttons/Button/variants/ButtonLink/ButtonLink.tsx
@@ -1,9 +1,5 @@
 /* eslint-disable react/prop-types */
 
-/**
- * @deprecated Please update your code to use `TextButton` from `@metamask/design-system-react-native`
- */
-
 // Third party dependencies.
 import React, { useState, useCallback } from 'react';
 import { GestureResponderEvent, StyleProp, TextStyle } from 'react-native';
@@ -26,6 +22,11 @@ import {
   DEFAULT_BUTTONLINK_LABEL_COLOR_ERROR_PRESSED,
 } from './ButtonLink.constants';
 
+/**
+ * @deprecated Please update your code to use `TextButton` from `@metamask/design-system-react-native`.
+ * The API may have changed — compare props before migrating.
+ * @see {@link https://github.com/MetaMask/metamask-design-system/blob/main/packages/design-system-react-native/src/components/TextButton/README.md}
+ */
 const ButtonLink: React.FC<ButtonLinkProps> = ({
   style,
   onPressIn,
diff --git a/app/component-library/components/Buttons/Button/variants/ButtonLink/__snapshots__/ButtonLink.test.tsx.snap b/app/component-library/components/Buttons/Button/variants/ButtonLink/__snapshots__/ButtonLink.test.tsx.snap
index 8b7ce6cc4ade..51cd25fb5027 100644
--- a/app/component-library/components/Buttons/Button/variants/ButtonLink/__snapshots__/ButtonLink.test.tsx.snap
+++ b/app/component-library/components/Buttons/Button/variants/ButtonLink/__snapshots__/ButtonLink.test.tsx.snap
@@ -10,7 +10,7 @@ exports[`ButtonLink should render correctly 1`] = `
   style={
     {
       "backgroundColor": "transparent",
-      "color": "#121314",
+      "color": "#131416",
       "fontFamily": "Geist-Regular",
       "fontSize": 16,
       "letterSpacing": 0,
diff --git a/app/component-library/components/Buttons/Button/variants/ButtonPrimary/ButtonPrimary.tsx b/app/component-library/components/Buttons/Button/variants/ButtonPrimary/ButtonPrimary.tsx
index 0a4341b9f95f..9934caf07b54 100644
--- a/app/component-library/components/Buttons/Button/variants/ButtonPrimary/ButtonPrimary.tsx
+++ b/app/component-library/components/Buttons/Button/variants/ButtonPrimary/ButtonPrimary.tsx
@@ -1,9 +1,5 @@
 /* eslint-disable react/prop-types */
 
-/**
- * @deprecated Please update your code to use `Button` from `@metamask/design-system-react-native` with variant `ButtonVariant.Primary`
- */
-
 // Third party dependencies.
 import React, { useCallback, useState } from 'react';
 import { ActivityIndicator, GestureResponderEvent } from 'react-native';
@@ -19,6 +15,11 @@ import { ButtonPrimaryProps } from './ButtonPrimary.types';
 import styleSheet from './ButtonPrimary.styles';
 import { DEFAULT_BUTTONPRIMARY_LABEL_TEXTVARIANT } from './ButtonPrimary.constants';
 
+/**
+ * @deprecated Please update your code to use `Button` from `@metamask/design-system-react-native` with variant `ButtonVariant.Primary`.
+ * The API may have changed — compare props before migrating.
+ * @see {@link https://github.com/MetaMask/metamask-design-system/blob/main/packages/design-system-react-native/src/components/Button/README.md}
+ */
 const ButtonPrimary = ({
   style,
   onPressIn,
diff --git a/app/component-library/components/Buttons/Button/variants/ButtonSecondary/ButtonSecondary.tsx b/app/component-library/components/Buttons/Button/variants/ButtonSecondary/ButtonSecondary.tsx
index abd9b85a889d..bb609f9e2645 100644
--- a/app/component-library/components/Buttons/Button/variants/ButtonSecondary/ButtonSecondary.tsx
+++ b/app/component-library/components/Buttons/Button/variants/ButtonSecondary/ButtonSecondary.tsx
@@ -1,9 +1,5 @@
 /* eslint-disable react/prop-types */
 
-/**
- * @deprecated Please update your code to use `Button` from `@metamask/design-system-react-native` with variant `ButtonVariant.Secondary`
- */
-
 // Third party dependencies.
 import React, { useCallback, useState } from 'react';
 import { ActivityIndicator, GestureResponderEvent } from 'react-native';
@@ -19,6 +15,11 @@ import { ButtonSecondaryProps } from './ButtonSecondary.types';
 import styleSheet from './ButtonSecondary.styles';
 import { DEFAULT_BUTTONSECONDARY_LABEL_TEXTVARIANT } from './ButtonSecondary.constants';
 
+/**
+ * @deprecated Please update your code to use `Button` from `@metamask/design-system-react-native` with variant `ButtonVariant.Secondary`.
+ * The API may have changed — compare props before migrating.
+ * @see {@link https://github.com/MetaMask/metamask-design-system/blob/main/packages/design-system-react-native/src/components/Button/README.md}
+ */
 const ButtonSecondary = ({
   style,
   onPressIn,
diff --git a/app/component-library/components/Buttons/ButtonIcon/ButtonIcon.tsx b/app/component-library/components/Buttons/ButtonIcon/ButtonIcon.tsx
index 192d6ef241d8..e73414e819f1 100644
--- a/app/component-library/components/Buttons/ButtonIcon/ButtonIcon.tsx
+++ b/app/component-library/components/Buttons/ButtonIcon/ButtonIcon.tsx
@@ -1,9 +1,5 @@
 /* eslint-disable react/prop-types */
 
-/**
- * @deprecated Please update your code to use `ButtonIcon` from `@metamask/design-system-react-native`
- */
-
 // Third party dependencies.
 import React, { useCallback, useState } from 'react';
 import { GestureResponderEvent, TouchableOpacity } from 'react-native';
@@ -21,6 +17,11 @@ import {
   ICONSIZE_BY_BUTTONICONSIZE,
 } from './ButtonIcon.constants';
 
+/**
+ * @deprecated Please update your code to use `ButtonIcon` from `@metamask/design-system-react-native`.
+ * The API may have changed — compare props before migrating.
+ * @see {@link https://github.com/MetaMask/metamask-design-system/blob/main/packages/design-system-react-native/src/components/ButtonIcon/README.md}
+ */
 const ButtonIcon = ({
   iconName,
   onPress,
diff --git a/app/component-library/components/Buttons/ButtonIcon/__snapshots__/ButtonIcon.test.tsx.snap b/app/component-library/components/Buttons/ButtonIcon/__snapshots__/ButtonIcon.test.tsx.snap
index 3a91de392039..c19b4a308542 100644
--- a/app/component-library/components/Buttons/ButtonIcon/__snapshots__/ButtonIcon.test.tsx.snap
+++ b/app/component-library/components/Buttons/ButtonIcon/__snapshots__/ButtonIcon.test.tsx.snap
@@ -20,7 +20,7 @@ exports[`ButtonIcon should render correctly 1`] = `
   }
 >
   <SvgMock
-    color="#121314"
+    color="#131416"
     fill="currentColor"
     height={20}
     name="Add"
diff --git a/app/component-library/components/Cards/Card/__snapshots__/Card.test.tsx.snap b/app/component-library/components/Cards/Card/__snapshots__/Card.test.tsx.snap
index 58d16364be59..992b46c1694e 100644
--- a/app/component-library/components/Cards/Card/__snapshots__/Card.test.tsx.snap
+++ b/app/component-library/components/Cards/Card/__snapshots__/Card.test.tsx.snap
@@ -5,7 +5,7 @@ exports[`Card - Snapshot should render correctly 1`] = `
   style={
     {
       "backgroundColor": "#ffffff",
-      "borderColor": "#b7bbc8",
+      "borderColor": "#949596",
       "borderRadius": 4,
       "borderWidth": 1,
       "padding": 16,
diff --git a/app/component-library/components/Cells/Cell/__snapshots__/Cell.test.tsx.snap b/app/component-library/components/Cells/Cell/__snapshots__/Cell.test.tsx.snap
index ae5fc135769a..d563cf147b56 100644
--- a/app/component-library/components/Cells/Cell/__snapshots__/Cell.test.tsx.snap
+++ b/app/component-library/components/Cells/Cell/__snapshots__/Cell.test.tsx.snap
@@ -13,7 +13,7 @@ exports[`Cell should render CellDisplay given the type Display 1`] = `
   style={
     {
       "backgroundColor": "#ffffff",
-      "borderColor": "#b7bbc8",
+      "borderColor": "#949596",
       "borderRadius": 4,
       "borderWidth": 1,
       "padding": 16,
@@ -188,7 +188,7 @@ exports[`Cell should render CellDisplay given the type Display 1`] = `
         numberOfLines={1}
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -204,7 +204,7 @@ exports[`Cell should render CellDisplay given the type Display 1`] = `
         numberOfLines={1}
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -219,7 +219,7 @@ exports[`Cell should render CellDisplay given the type Display 1`] = `
         numberOfLines={1}
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -232,7 +232,7 @@ exports[`Cell should render CellDisplay given the type Display 1`] = `
       <View
         style={
           {
-            "backgroundColor": "#f3f5f9",
+            "backgroundColor": "#f3f3f4",
             "borderRadius": 4,
             "height": 24,
             "justifyContent": "center",
@@ -245,7 +245,7 @@ exports[`Cell should render CellDisplay given the type Display 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "fontFamily": "Geist-Medium",
               "fontSize": 12,
               "letterSpacing": 0.25,
@@ -312,7 +312,7 @@ exports[`Cell should render CellMultiSelect given the type MultiSelect 1`] = `
               {
                 "alignItems": "center",
                 "backgroundColor": "#ffffff",
-                "borderColor": "#b7bbc8",
+                "borderColor": "#949596",
                 "borderRadius": 4,
                 "borderWidth": 2,
                 "height": 20,
@@ -497,7 +497,7 @@ exports[`Cell should render CellMultiSelect given the type MultiSelect 1`] = `
             numberOfLines={1}
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -513,7 +513,7 @@ exports[`Cell should render CellMultiSelect given the type MultiSelect 1`] = `
             numberOfLines={1}
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -528,7 +528,7 @@ exports[`Cell should render CellMultiSelect given the type MultiSelect 1`] = `
             numberOfLines={1}
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -541,7 +541,7 @@ exports[`Cell should render CellMultiSelect given the type MultiSelect 1`] = `
           <View
             style={
               {
-                "backgroundColor": "#f3f5f9",
+                "backgroundColor": "#f3f3f4",
                 "borderRadius": 4,
                 "height": 24,
                 "justifyContent": "center",
@@ -554,7 +554,7 @@ exports[`Cell should render CellMultiSelect given the type MultiSelect 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Medium",
                   "fontSize": 12,
                   "letterSpacing": 0.25,
@@ -636,7 +636,7 @@ exports[`Cell should render CellMultiSelectWithMenu given the type MultiSelectWi
               {
                 "alignItems": "center",
                 "backgroundColor": "#ffffff",
-                "borderColor": "#b7bbc8",
+                "borderColor": "#949596",
                 "borderRadius": 4,
                 "borderWidth": 2,
                 "height": 20,
@@ -819,7 +819,7 @@ exports[`Cell should render CellMultiSelectWithMenu given the type MultiSelectWi
               numberOfLines={1}
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -833,7 +833,7 @@ exports[`Cell should render CellMultiSelectWithMenu given the type MultiSelectWi
             <View
               style={
                 {
-                  "backgroundColor": "#f3f5f9",
+                  "backgroundColor": "#f3f3f4",
                   "borderRadius": 4,
                   "height": 24,
                   "justifyContent": "center",
@@ -847,7 +847,7 @@ exports[`Cell should render CellMultiSelectWithMenu given the type MultiSelectWi
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Medium",
                     "fontSize": 12,
                     "letterSpacing": 0.25,
@@ -890,7 +890,7 @@ exports[`Cell should render CellMultiSelectWithMenu given the type MultiSelectWi
       testID="button-menu-select-with-menu-button-test-id"
     >
       <SvgMock
-        color="#121314"
+        color="#131416"
         fill="currentColor"
         height={20}
         name="MoreVertical"
@@ -1101,7 +1101,7 @@ exports[`Cell should render CellSelect given the type Select 1`] = `
             numberOfLines={1}
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -1117,7 +1117,7 @@ exports[`Cell should render CellSelect given the type Select 1`] = `
             numberOfLines={1}
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -1132,7 +1132,7 @@ exports[`Cell should render CellSelect given the type Select 1`] = `
             numberOfLines={1}
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -1145,7 +1145,7 @@ exports[`Cell should render CellSelect given the type Select 1`] = `
           <View
             style={
               {
-                "backgroundColor": "#f3f5f9",
+                "backgroundColor": "#f3f3f4",
                 "borderRadius": 4,
                 "height": 24,
                 "justifyContent": "center",
@@ -1158,7 +1158,7 @@ exports[`Cell should render CellSelect given the type Select 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Medium",
                   "fontSize": 12,
                   "letterSpacing": 0.25,
@@ -1388,7 +1388,7 @@ exports[`Cell should render CellSelectWithMenu given the type SelectWithMenu 1`]
               numberOfLines={1}
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -1414,7 +1414,7 @@ exports[`Cell should render CellSelectWithMenu given the type SelectWithMenu 1`]
                 numberOfLines={1}
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -1425,7 +1425,7 @@ exports[`Cell should render CellSelectWithMenu given the type SelectWithMenu 1`]
                 0x2990079bcdEe240329a520d2444386FC119da21a
               </Text>
               <SvgMock
-                color="#121314"
+                color="#131416"
                 fill="currentColor"
                 height={10}
                 name="ArrowDown"
@@ -1443,7 +1443,7 @@ exports[`Cell should render CellSelectWithMenu given the type SelectWithMenu 1`]
             <View
               style={
                 {
-                  "backgroundColor": "#f3f5f9",
+                  "backgroundColor": "#f3f3f4",
                   "borderRadius": 4,
                   "height": 24,
                   "justifyContent": "center",
@@ -1457,7 +1457,7 @@ exports[`Cell should render CellSelectWithMenu given the type SelectWithMenu 1`]
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Medium",
                     "fontSize": 12,
                     "letterSpacing": 0.25,
@@ -1500,7 +1500,7 @@ exports[`Cell should render CellSelectWithMenu given the type SelectWithMenu 1`]
       testID="button-menu-select-test-id"
     >
       <SvgMock
-        color="#121314"
+        color="#131416"
         fill="currentColor"
         height={20}
         name="MoreVertical"
diff --git a/app/component-library/components/Cells/Cell/foundation/CellBase/__snapshots__/CellBase.test.tsx.snap b/app/component-library/components/Cells/Cell/foundation/CellBase/__snapshots__/CellBase.test.tsx.snap
index 4aaa793a9322..e4e31bb37c12 100644
--- a/app/component-library/components/Cells/Cell/foundation/CellBase/__snapshots__/CellBase.test.tsx.snap
+++ b/app/component-library/components/Cells/Cell/foundation/CellBase/__snapshots__/CellBase.test.tsx.snap
@@ -165,7 +165,7 @@ exports[`CellBase should render default settings correctly 1`] = `
       numberOfLines={1}
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -181,7 +181,7 @@ exports[`CellBase should render default settings correctly 1`] = `
       numberOfLines={1}
       style={
         {
-          "color": "#686e7d",
+          "color": "#66676a",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -196,7 +196,7 @@ exports[`CellBase should render default settings correctly 1`] = `
       numberOfLines={1}
       style={
         {
-          "color": "#686e7d",
+          "color": "#66676a",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -209,7 +209,7 @@ exports[`CellBase should render default settings correctly 1`] = `
     <View
       style={
         {
-          "backgroundColor": "#f3f5f9",
+          "backgroundColor": "#f3f3f4",
           "borderRadius": 4,
           "height": 24,
           "justifyContent": "center",
@@ -222,7 +222,7 @@ exports[`CellBase should render default settings correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Medium",
             "fontSize": 12,
             "letterSpacing": 0.25,
diff --git a/app/component-library/components/Cells/Cell/variants/CellDisplay/__snapshots__/CellDisplay.test.tsx.snap b/app/component-library/components/Cells/Cell/variants/CellDisplay/__snapshots__/CellDisplay.test.tsx.snap
index 2d1de28b5ef8..528115b88095 100644
--- a/app/component-library/components/Cells/Cell/variants/CellDisplay/__snapshots__/CellDisplay.test.tsx.snap
+++ b/app/component-library/components/Cells/Cell/variants/CellDisplay/__snapshots__/CellDisplay.test.tsx.snap
@@ -13,7 +13,7 @@ exports[`CellDisplay should render default settings correctly 1`] = `
   style={
     {
       "backgroundColor": "#ffffff",
-      "borderColor": "#b7bbc8",
+      "borderColor": "#949596",
       "borderRadius": 4,
       "borderWidth": 1,
       "padding": 16,
@@ -188,7 +188,7 @@ exports[`CellDisplay should render default settings correctly 1`] = `
         numberOfLines={1}
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -204,7 +204,7 @@ exports[`CellDisplay should render default settings correctly 1`] = `
         numberOfLines={1}
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -219,7 +219,7 @@ exports[`CellDisplay should render default settings correctly 1`] = `
         numberOfLines={1}
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -232,7 +232,7 @@ exports[`CellDisplay should render default settings correctly 1`] = `
       <View
         style={
           {
-            "backgroundColor": "#f3f5f9",
+            "backgroundColor": "#f3f3f4",
             "borderRadius": 4,
             "height": 24,
             "justifyContent": "center",
@@ -245,7 +245,7 @@ exports[`CellDisplay should render default settings correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "fontFamily": "Geist-Medium",
               "fontSize": 12,
               "letterSpacing": 0.25,
diff --git a/app/component-library/components/Cells/Cell/variants/CellMultiSelect/__snapshots__/CellMultiSelect.test.tsx.snap b/app/component-library/components/Cells/Cell/variants/CellMultiSelect/__snapshots__/CellMultiSelect.test.tsx.snap
index 749c1f3cd2eb..3a4cda873bab 100644
--- a/app/component-library/components/Cells/Cell/variants/CellMultiSelect/__snapshots__/CellMultiSelect.test.tsx.snap
+++ b/app/component-library/components/Cells/Cell/variants/CellMultiSelect/__snapshots__/CellMultiSelect.test.tsx.snap
@@ -51,7 +51,7 @@ exports[`CellMultiSelect should render default settings correctly 1`] = `
               {
                 "alignItems": "center",
                 "backgroundColor": "#ffffff",
-                "borderColor": "#b7bbc8",
+                "borderColor": "#949596",
                 "borderRadius": 4,
                 "borderWidth": 2,
                 "height": 20,
@@ -236,7 +236,7 @@ exports[`CellMultiSelect should render default settings correctly 1`] = `
             numberOfLines={1}
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -252,7 +252,7 @@ exports[`CellMultiSelect should render default settings correctly 1`] = `
             numberOfLines={1}
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -267,7 +267,7 @@ exports[`CellMultiSelect should render default settings correctly 1`] = `
             numberOfLines={1}
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -280,7 +280,7 @@ exports[`CellMultiSelect should render default settings correctly 1`] = `
           <View
             style={
               {
-                "backgroundColor": "#f3f5f9",
+                "backgroundColor": "#f3f3f4",
                 "borderRadius": 4,
                 "height": 24,
                 "justifyContent": "center",
@@ -293,7 +293,7 @@ exports[`CellMultiSelect should render default settings correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Medium",
                   "fontSize": 12,
                   "letterSpacing": 0.25,
diff --git a/app/component-library/components/Cells/Cell/variants/CellSelect/__snapshots__/CellSelect.test.tsx.snap b/app/component-library/components/Cells/Cell/variants/CellSelect/__snapshots__/CellSelect.test.tsx.snap
index c4c0d271d9f4..5fb7117ea411 100644
--- a/app/component-library/components/Cells/Cell/variants/CellSelect/__snapshots__/CellSelect.test.tsx.snap
+++ b/app/component-library/components/Cells/Cell/variants/CellSelect/__snapshots__/CellSelect.test.tsx.snap
@@ -194,7 +194,7 @@ exports[`CellSelect should render default settings correctly 1`] = `
             numberOfLines={1}
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -210,7 +210,7 @@ exports[`CellSelect should render default settings correctly 1`] = `
             numberOfLines={1}
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -225,7 +225,7 @@ exports[`CellSelect should render default settings correctly 1`] = `
             numberOfLines={1}
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -238,7 +238,7 @@ exports[`CellSelect should render default settings correctly 1`] = `
           <View
             style={
               {
-                "backgroundColor": "#f3f5f9",
+                "backgroundColor": "#f3f3f4",
                 "borderRadius": 4,
                 "height": 24,
                 "justifyContent": "center",
@@ -251,7 +251,7 @@ exports[`CellSelect should render default settings correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Medium",
                   "fontSize": 12,
                   "letterSpacing": 0.25,
diff --git a/app/component-library/components/Checkbox/Checkbox.tsx b/app/component-library/components/Checkbox/Checkbox.tsx
index b4f95ae8a9f0..db43c3b2519b 100644
--- a/app/component-library/components/Checkbox/Checkbox.tsx
+++ b/app/component-library/components/Checkbox/Checkbox.tsx
@@ -1,9 +1,5 @@
 /* eslint-disable react/prop-types */
 
-/**
- * @deprecated Please update your code to use `Checkbox` from `@metamask/design-system-react-native`
- */
-
 // Third party dependencies.
 import React from 'react';
 import { TouchableOpacity, View } from 'react-native';
@@ -25,6 +21,11 @@ import {
   DEFAULT_CHECKBOX_ISINDETERMINATE_ICONNAME,
 } from './Checkbox.constants';
 
+/**
+ * @deprecated Please update your code to use `Checkbox` from `@metamask/design-system-react-native`.
+ * The API may have changed — compare props before migrating.
+ * @see {@link https://github.com/MetaMask/metamask-design-system/blob/main/packages/design-system-react-native/src/components/Checkbox/README.md}
+ */
 const Checkbox = ({
   style,
   label,
diff --git a/app/component-library/components/Checkbox/__snapshots__/Checkbox.test.tsx.snap b/app/component-library/components/Checkbox/__snapshots__/Checkbox.test.tsx.snap
index 2ae8084c8585..9907ae0a44fd 100644
--- a/app/component-library/components/Checkbox/__snapshots__/Checkbox.test.tsx.snap
+++ b/app/component-library/components/Checkbox/__snapshots__/Checkbox.test.tsx.snap
@@ -18,7 +18,7 @@ exports[`Checkbox should render correctly 1`] = `
       {
         "alignItems": "center",
         "backgroundColor": "#ffffff",
-        "borderColor": "#b7bbc8",
+        "borderColor": "#949596",
         "borderRadius": 4,
         "borderWidth": 2,
         "height": 20,
diff --git a/app/component-library/components/Form/TextField/TextField.tsx b/app/component-library/components/Form/TextField/TextField.tsx
index 3a1a553d5554..fdce3b35778b 100644
--- a/app/component-library/components/Form/TextField/TextField.tsx
+++ b/app/component-library/components/Form/TextField/TextField.tsx
@@ -23,6 +23,11 @@ import {
   TEXTFIELD_ENDACCESSORY_TEST_ID,
 } from './TextField.constants';
 
+/**
+ * @deprecated Please update your code to use `TextField` from `@metamask/design-system-react-native`.
+ * The API may have changed — compare props before migrating.
+ * @see {@link https://github.com/MetaMask/metamask-design-system/blob/main/packages/design-system-react-native/src/components/TextField/README.md}
+ */
 const TextField = React.forwardRef<TextInput | null, TextFieldProps>(
   (
     {
diff --git a/app/component-library/components/Form/TextField/__snapshots__/TextField.test.tsx.snap b/app/component-library/components/Form/TextField/__snapshots__/TextField.test.tsx.snap
index faedc23f031f..941b63d4d843 100644
--- a/app/component-library/components/Form/TextField/__snapshots__/TextField.test.tsx.snap
+++ b/app/component-library/components/Form/TextField/__snapshots__/TextField.test.tsx.snap
@@ -6,8 +6,8 @@ exports[`TextField renders default settings correctly 1`] = `
   style={
     {
       "alignItems": "center",
-      "backgroundColor": "#3c4d9d0f",
-      "borderColor": "#b7bbc866",
+      "backgroundColor": "#b4b4b528",
+      "borderColor": "#b4b4b566",
       "borderRadius": 12,
       "borderWidth": 1,
       "flexDirection": "row",
diff --git a/app/component-library/components/Form/TextField/foundation/Input/Input.styles.ts b/app/component-library/components/Form/TextField/foundation/Input/Input.styles.ts
index 49573b8c0fbe..7dd0e0032169 100644
--- a/app/component-library/components/Form/TextField/foundation/Input/Input.styles.ts
+++ b/app/component-library/components/Form/TextField/foundation/Input/Input.styles.ts
@@ -1,5 +1,5 @@
 // Third party dependencies.
-import { StyleSheet, TextStyle } from 'react-native';
+import { Platform, StyleSheet, TextStyle } from 'react-native';
 
 // External dependencies.
 import { Theme } from '../../../../../../util/theme/models';
@@ -19,8 +19,19 @@ import { InputStyleSheetVars } from './Input.types';
  */
 const styleSheet = (params: { theme: Theme; vars: InputStyleSheetVars }) => {
   const { theme, vars } = params;
-  const { style, textVariant, isDisabled, isStateStylesDisabled, isFocused } =
-    vars;
+  const {
+    style,
+    textVariant,
+    isDisabled,
+    isStateStylesDisabled,
+    isFocused,
+    value = '',
+    placeholder,
+  } = vars;
+
+  const hasPlaceholder = placeholder != null && placeholder !== '';
+  const isPlaceholderVisible =
+    hasPlaceholder && (value === '' || value == null);
 
   const stateObj = isStateStylesDisabled
     ? {
@@ -45,6 +56,7 @@ const styleSheet = (params: { theme: Theme; vars: InputStyleSheetVars }) => {
         fontWeight: theme.typography[textVariant].fontWeight,
         fontSize: theme.typography[textVariant].fontSize,
         letterSpacing: theme.typography[textVariant].letterSpacing,
+        ...(Platform.OS === 'ios' && isPlaceholderVisible && { lineHeight: 0 }),
       },
       style,
     ) as TextStyle,
diff --git a/app/component-library/components/Form/TextField/foundation/Input/Input.test.tsx b/app/component-library/components/Form/TextField/foundation/Input/Input.test.tsx
index 33a907902534..1ddcc627e552 100644
--- a/app/component-library/components/Form/TextField/foundation/Input/Input.test.tsx
+++ b/app/component-library/components/Form/TextField/foundation/Input/Input.test.tsx
@@ -1,43 +1,107 @@
 // Third party dependencies.
 import React from 'react';
-import { shallow } from 'enzyme';
+import { fireEvent, render } from '@testing-library/react-native';
 
 // External dependencies.
 import { TextVariant } from '../../../../Texts/Text';
-import { mockTheme } from '../../../../../../util/theme';
+import { ThemeContext, mockTheme } from '../../../../../../util/theme';
 
 // Internal dependencies.
 import Input from './Input';
 import { INPUT_TEST_ID } from './Input.constants';
 
+const renderWithTheme = (ui: React.ReactElement) =>
+  render(<ThemeContext.Provider value={mockTheme}>{ui}</ThemeContext.Provider>);
+
+const getStyleProp = (
+  style: Record<string, unknown> | Record<string, unknown>[] | undefined,
+  key: string,
+): unknown => {
+  if (!style) return undefined;
+  const arr = Array.isArray(style) ? style : [style];
+  for (let i = arr.length - 1; i >= 0; i--) {
+    const val = (arr[i] as Record<string, unknown>)?.[key];
+    if (val !== undefined) return val;
+  }
+  return undefined;
+};
+
 describe('Input', () => {
-  it('should render correctly', () => {
-    const wrapper = shallow(<Input />);
-    expect(wrapper).toMatchSnapshot();
-  });
-  it('should render Input with the correct TextVariant', () => {
-    const wrapper = shallow(<Input textVariant={TextVariant.HeadingSM} />);
-    const inputComponent = wrapper.findWhere(
-      (node) => node.prop('testID') === INPUT_TEST_ID,
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  it('renders input with testID', () => {
+    const { getByTestId } = renderWithTheme(<Input value="" />);
+
+    expect(getByTestId(INPUT_TEST_ID)).toBeOnTheScreen();
+  });
+
+  it('applies TextVariant typography when textVariant provided', () => {
+    const { getByTestId } = renderWithTheme(
+      <Input value="" textVariant={TextVariant.HeadingSM} />,
     );
-    expect(inputComponent.props().style.fontSize).toBe(
-      mockTheme.typography.sHeadingSM.fontSize,
+
+    const input = getByTestId(INPUT_TEST_ID);
+    const fontSize = getStyleProp(input.props.style, 'fontSize');
+
+    expect(fontSize).toBe(mockTheme.typography.sHeadingSM.fontSize);
+  });
+
+  it('sets editable false and opacity 0.5 when isDisabled', () => {
+    const { getByTestId } = renderWithTheme(<Input value="" isDisabled />);
+
+    const input = getByTestId(INPUT_TEST_ID);
+
+    expect(input.props.editable).toBe(false);
+    expect(getStyleProp(input.props.style, 'opacity')).toBe(0.5);
+  });
+
+  it('keeps opacity 1 when isStateStylesDisabled', () => {
+    const { getByTestId } = renderWithTheme(
+      <Input value="" isStateStylesDisabled />,
     );
+
+    const input = getByTestId(INPUT_TEST_ID);
+
+    expect(getStyleProp(input.props.style, 'opacity')).toBe(1);
   });
-  it('should render the correct disabled state when disabled = true', () => {
-    const wrapper = shallow(<Input isDisabled />);
-    const inputComponent = wrapper.findWhere(
-      (node) => node.prop('testID') === INPUT_TEST_ID,
+
+  it('applies lineHeight 0 when placeholder is provided and value is empty', () => {
+    const { getByTestId } = renderWithTheme(
+      <Input value="" placeholder="Enter text" />,
     );
-    expect(inputComponent.props().editable).toBe(false);
-    expect(inputComponent.props().style.opacity).toBe(0.5);
+
+    const input = getByTestId(INPUT_TEST_ID);
+
+    expect(getStyleProp(input.props.style, 'lineHeight')).toBe(0);
   });
 
-  it('should not render state styles when isStateStylesDisabled = true', () => {
-    const wrapper = shallow(<Input isStateStylesDisabled />);
-    const inputComponent = wrapper.findWhere(
-      (node) => node.prop('testID') === INPUT_TEST_ID,
+  it('omits lineHeight when value is empty but no placeholder', () => {
+    const { getByTestId } = renderWithTheme(<Input value="" />);
+
+    const input = getByTestId(INPUT_TEST_ID);
+
+    expect(getStyleProp(input.props.style, 'lineHeight')).toBeUndefined();
+  });
+
+  it('omits lineHeight when value is non-empty', () => {
+    const { getByTestId } = renderWithTheme(<Input value="hello" />);
+
+    const input = getByTestId(INPUT_TEST_ID);
+
+    expect(getStyleProp(input.props.style, 'lineHeight')).toBeUndefined();
+  });
+
+  it('calls onChangeText when text changes', () => {
+    const onChangeText = jest.fn();
+    const { getByTestId } = renderWithTheme(
+      <Input value="" onChangeText={onChangeText} />,
     );
-    expect(inputComponent.props().style.opacity).toBe(1);
+
+    const input = getByTestId(INPUT_TEST_ID);
+    fireEvent.changeText(input, 'a');
+
+    expect(onChangeText).toHaveBeenCalledWith('a');
   });
 });
diff --git a/app/component-library/components/Form/TextField/foundation/Input/Input.tsx b/app/component-library/components/Form/TextField/foundation/Input/Input.tsx
index 795f3574773a..64ceb9f3cd5d 100644
--- a/app/component-library/components/Form/TextField/foundation/Input/Input.tsx
+++ b/app/component-library/components/Form/TextField/foundation/Input/Input.tsx
@@ -2,7 +2,11 @@
 
 // Third party dependencies.
 import React, { useCallback, useState } from 'react';
-import { TextInput } from 'react-native';
+import {
+  TextInput,
+  NativeSyntheticEvent,
+  TextInputFocusEventData,
+} from 'react-native';
 
 // External dependencies.
 import { useStyles } from '../../../../../hooks';
@@ -30,6 +34,9 @@ const Input = React.forwardRef<TextInput, InputProps>(
       onBlur,
       onFocus,
       autoFocus = true,
+      value,
+      placeholder,
+      onChangeText,
       ...props
     },
     ref,
@@ -42,30 +49,28 @@ const Input = React.forwardRef<TextInput, InputProps>(
       isStateStylesDisabled,
       isDisabled,
       isFocused,
+      value: value ?? '',
+      placeholder,
     });
 
     const onBlurHandler = useCallback(
-      // TODO: Replace "any" with type
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      (e: any) => {
+      (e: NativeSyntheticEvent<TextInputFocusEventData>) => {
         if (!isDisabled) {
           setIsFocused(false);
           onBlur?.(e);
         }
       },
-      [isDisabled, setIsFocused, onBlur],
+      [isDisabled, onBlur],
     );
 
     const onFocusHandler = useCallback(
-      // TODO: Replace "any" with type
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      (e: any) => {
+      (e: NativeSyntheticEvent<TextInputFocusEventData>) => {
         if (!isDisabled) {
           setIsFocused(true);
           onFocus?.(e);
         }
       },
-      [isDisabled, setIsFocused, onFocus],
+      [isDisabled, onFocus],
     );
 
     return (
@@ -73,6 +78,9 @@ const Input = React.forwardRef<TextInput, InputProps>(
         testID={INPUT_TEST_ID}
         placeholderTextColor={theme.colors.text.alternative}
         {...props}
+        placeholder={placeholder}
+        value={value}
+        onChangeText={onChangeText}
         style={styles.base}
         editable={!isDisabled && !isReadonly}
         autoFocus={autoFocus}
diff --git a/app/component-library/components/Form/TextField/foundation/Input/Input.types.ts b/app/component-library/components/Form/TextField/foundation/Input/Input.types.ts
index d69d7d604b87..289c74b1c0ed 100644
--- a/app/component-library/components/Form/TextField/foundation/Input/Input.types.ts
+++ b/app/component-library/components/Form/TextField/foundation/Input/Input.types.ts
@@ -32,10 +32,11 @@ export interface InputProps extends Omit<TextInputProps, 'editable'> {
 
 /**
  * Style sheet input parameters.
+ * Placeholder visibility (for lineHeight) is derived in the style sheet from value + placeholder.
  */
 export type InputStyleSheetVars = Pick<
   InputProps,
-  'style' | 'isStateStylesDisabled' | 'isDisabled'
+  'style' | 'isStateStylesDisabled' | 'isDisabled' | 'value' | 'placeholder'
 > & {
   isFocused: boolean;
   textVariant: TextVariant;
diff --git a/app/component-library/components/Form/TextField/foundation/Input/__snapshots__/Input.test.tsx.snap b/app/component-library/components/Form/TextField/foundation/Input/__snapshots__/Input.test.tsx.snap
deleted file mode 100644
index c07ca9001971..000000000000
--- a/app/component-library/components/Form/TextField/foundation/Input/__snapshots__/Input.test.tsx.snap
+++ /dev/null
@@ -1,25 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`Input should render correctly 1`] = `
-<TextInput
-  autoFocus={true}
-  editable={true}
-  onBlur={[Function]}
-  onFocus={[Function]}
-  placeholderTextColor="#686e7d"
-  style={
-    {
-      "backgroundColor": "#ffffff",
-      "borderColor": "#4459ff",
-      "borderWidth": 1,
-      "color": "#121314",
-      "fontFamily": "Geist-Regular",
-      "fontSize": 16,
-      "fontWeight": "400",
-      "letterSpacing": 0,
-      "opacity": 1,
-    }
-  }
-  testID="input"
-/>
-`;
diff --git a/app/component-library/components/Form/TextFieldSearch/TextFieldSearch.types.ts b/app/component-library/components/Form/TextFieldSearch/TextFieldSearch.types.ts
index 7e4d747bd7d3..b2cff890bedf 100644
--- a/app/component-library/components/Form/TextFieldSearch/TextFieldSearch.types.ts
+++ b/app/component-library/components/Form/TextFieldSearch/TextFieldSearch.types.ts
@@ -9,7 +9,7 @@ export interface TextFieldSearchProps extends TextFieldProps {
   /**
    * Optional prop to pass any additional props to the clear button.
    */
-  clearButtonProps?: ButtonIconProps;
+  clearButtonProps?: Partial<ButtonIconProps>;
   /**
    * Function to trigger when pressing the clear button.
    * The clear button is automatically shown when the input has a value.
diff --git a/app/component-library/components/Icons/Icon/Icon.tsx b/app/component-library/components/Icons/Icon/Icon.tsx
index 437c70c76749..2b801706f1dd 100644
--- a/app/component-library/components/Icons/Icon/Icon.tsx
+++ b/app/component-library/components/Icons/Icon/Icon.tsx
@@ -1,9 +1,5 @@
 /* eslint-disable react/prop-types, react/jsx-pascal-case */
 
-/**
- * @deprecated Please update your code to use `Icon` from `@metamask/design-system-react-native`
- */
-
 // Third party dependencies.
 import React from 'react';
 
@@ -16,6 +12,11 @@ import styleSheet from './Icon.styles';
 import { assetByIconName } from './Icon.assets';
 import { DEFAULT_ICON_SIZE, DEFAULT_ICON_COLOR } from './Icon.constants';
 
+/**
+ * @deprecated Please update your code to use `Icon` from `@metamask/design-system-react-native`.
+ * The API may have changed — compare props before migrating.
+ * @see {@link https://github.com/MetaMask/metamask-design-system/blob/main/packages/design-system-react-native/src/components/Icon/README.md}
+ */
 const Icon = ({
   size = DEFAULT_ICON_SIZE,
   style,
diff --git a/app/component-library/components/Icons/Icon/__snapshots__/Icon.test.tsx.snap b/app/component-library/components/Icons/Icon/__snapshots__/Icon.test.tsx.snap
index ecc0ddfa873f..2273aac30c1e 100644
--- a/app/component-library/components/Icons/Icon/__snapshots__/Icon.test.tsx.snap
+++ b/app/component-library/components/Icons/Icon/__snapshots__/Icon.test.tsx.snap
@@ -2,7 +2,7 @@
 
 exports[`Icon renders correctly 1`] = `
 <SvgMock
-  color="#121314"
+  color="#131416"
   fill="currentColor"
   height={20}
   name="Add"
diff --git a/app/component-library/components/Modals/ModalConfirmation/__snapshots__/ModalConfirmation.test.tsx.snap b/app/component-library/components/Modals/ModalConfirmation/__snapshots__/ModalConfirmation.test.tsx.snap
index d1964617c706..4a83f8364127 100644
--- a/app/component-library/components/Modals/ModalConfirmation/__snapshots__/ModalConfirmation.test.tsx.snap
+++ b/app/component-library/components/Modals/ModalConfirmation/__snapshots__/ModalConfirmation.test.tsx.snap
@@ -44,7 +44,7 @@ exports[`ModalConfirmation should render correctly 1`] = `
     <View
       style={
         {
-          "backgroundColor": "#b7bbc866",
+          "backgroundColor": "#b4b4b566",
           "height": 1,
         }
       }
diff --git a/app/component-library/components/Navigation/TabBar/__snapshots__/TabBar.test.tsx.snap b/app/component-library/components/Navigation/TabBar/__snapshots__/TabBar.test.tsx.snap
index ebf2edcc82a0..0645c93b5557 100644
--- a/app/component-library/components/Navigation/TabBar/__snapshots__/TabBar.test.tsx.snap
+++ b/app/component-library/components/Navigation/TabBar/__snapshots__/TabBar.test.tsx.snap
@@ -8,7 +8,7 @@ exports[`TabBar renders correctly 1`] = `
         {
           "alignItems": "flex-end",
           "backgroundColor": "#ffffff",
-          "borderColor": "#b7bbc866",
+          "borderColor": "#b4b4b566",
           "borderTopWidth": 1,
           "display": "flex",
           "flexDirection": "row",
@@ -92,7 +92,7 @@ exports[`TabBar renders correctly 1`] = `
         testID="tab-bar-item-Wallet"
       >
         <SvgMock
-          color="#121314"
+          color="#131416"
           fill="currentColor"
           height={24}
           name="Home"
@@ -110,7 +110,7 @@ exports[`TabBar renders correctly 1`] = `
           numberOfLines={1}
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "flexShrink": 0,
               "fontFamily": "Geist-Medium",
               "fontSize": 12,
@@ -193,7 +193,7 @@ exports[`TabBar renders correctly 1`] = `
         testID="tab-bar-item-Browser"
       >
         <SvgMock
-          color="#686e7d"
+          color="#66676a"
           fill="currentColor"
           height={24}
           name="Explore"
@@ -211,7 +211,7 @@ exports[`TabBar renders correctly 1`] = `
           numberOfLines={1}
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "flexShrink": 0,
               "fontFamily": "Geist-Medium",
               "fontSize": 12,
@@ -294,7 +294,7 @@ exports[`TabBar renders correctly 1`] = `
         testID="tab-bar-item-Actions"
       >
         <SvgMock
-          color="#686e7d"
+          color="#66676a"
           fill="currentColor"
           height={24}
           name="SwapVertical"
@@ -312,7 +312,7 @@ exports[`TabBar renders correctly 1`] = `
           numberOfLines={1}
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "flexShrink": 0,
               "fontFamily": "Geist-Medium",
               "fontSize": 12,
@@ -395,7 +395,7 @@ exports[`TabBar renders correctly 1`] = `
         testID="tab-bar-item-Activity"
       >
         <SvgMock
-          color="#686e7d"
+          color="#66676a"
           fill="currentColor"
           height={24}
           name="Activity"
@@ -413,7 +413,7 @@ exports[`TabBar renders correctly 1`] = `
           numberOfLines={1}
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "flexShrink": 0,
               "fontFamily": "Geist-Medium",
               "fontSize": 12,
@@ -496,7 +496,7 @@ exports[`TabBar renders correctly 1`] = `
         testID="tab-bar-item-Setting"
       >
         <SvgMock
-          color="#686e7d"
+          color="#66676a"
           fill="currentColor"
           height={24}
           name="Setting"
@@ -514,7 +514,7 @@ exports[`TabBar renders correctly 1`] = `
           numberOfLines={1}
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "flexShrink": 0,
               "fontFamily": "Geist-Medium",
               "fontSize": 12,
diff --git a/app/component-library/components/Navigation/TradeTabBarItem/__snapshots__/TradeTabBarItem.test.tsx.snap b/app/component-library/components/Navigation/TradeTabBarItem/__snapshots__/TradeTabBarItem.test.tsx.snap
index 05db5eb4240f..d5a74017c1e3 100644
--- a/app/component-library/components/Navigation/TradeTabBarItem/__snapshots__/TradeTabBarItem.test.tsx.snap
+++ b/app/component-library/components/Navigation/TradeTabBarItem/__snapshots__/TradeTabBarItem.test.tsx.snap
@@ -91,7 +91,7 @@ exports[`TradeTabBarItem renders TradeTabBarItem with icon and label 1`] = `
     numberOfLines={1}
     style={
       {
-        "color": "#686e7d",
+        "color": "#66676a",
         "flexShrink": 0,
         "fontFamily": "Geist-Medium",
         "fontSize": 12,
diff --git a/app/component-library/components/Pickers/PickerAccount/__snapshots__/PickerAccount.test.tsx.snap b/app/component-library/components/Pickers/PickerAccount/__snapshots__/PickerAccount.test.tsx.snap
index 829e640393df..41ddcf702a36 100644
--- a/app/component-library/components/Pickers/PickerAccount/__snapshots__/PickerAccount.test.tsx.snap
+++ b/app/component-library/components/Pickers/PickerAccount/__snapshots__/PickerAccount.test.tsx.snap
@@ -18,7 +18,7 @@ exports[`PickerAccount Props Forwarding forwards hitSlop prop to PickerBase 1`]
     {
       "alignItems": "center",
       "backgroundColor": "#ffffff",
-      "borderColor": "#b7bbc8",
+      "borderColor": "#949596",
       "borderRadius": 4,
       "borderWidth": 0,
       "flexDirection": "row",
@@ -31,7 +31,7 @@ exports[`PickerAccount Props Forwarding forwards hitSlop prop to PickerBase 1`]
     numberOfLines={1}
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Medium",
         "fontSize": 16,
         "letterSpacing": 0,
@@ -43,7 +43,7 @@ exports[`PickerAccount Props Forwarding forwards hitSlop prop to PickerBase 1`]
     Orangefox.eth
   </Text>
   <SvgMock
-    color="#121314"
+    color="#131416"
     fill="currentColor"
     height={16}
     name="ArrowDown"
@@ -69,7 +69,7 @@ exports[`PickerAccount Props Forwarding forwards style prop 1`] = `
     {
       "alignItems": "center",
       "backgroundColor": "#ffffff",
-      "borderColor": "#b7bbc8",
+      "borderColor": "#949596",
       "borderRadius": 4,
       "borderWidth": 0,
       "flexDirection": "row",
@@ -83,7 +83,7 @@ exports[`PickerAccount Props Forwarding forwards style prop 1`] = `
     numberOfLines={1}
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Medium",
         "fontSize": 16,
         "letterSpacing": 0,
@@ -95,7 +95,7 @@ exports[`PickerAccount Props Forwarding forwards style prop 1`] = `
     Orangefox.eth
   </Text>
   <SvgMock
-    color="#121314"
+    color="#131416"
     fill="currentColor"
     height={16}
     name="ArrowDown"
@@ -121,7 +121,7 @@ exports[`PickerAccount Rendering should render correctly with snapshot 1`] = `
     {
       "alignItems": "center",
       "backgroundColor": "#ffffff",
-      "borderColor": "#b7bbc8",
+      "borderColor": "#949596",
       "borderRadius": 4,
       "borderWidth": 0,
       "flexDirection": "row",
@@ -134,7 +134,7 @@ exports[`PickerAccount Rendering should render correctly with snapshot 1`] = `
     numberOfLines={1}
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Medium",
         "fontSize": 16,
         "letterSpacing": 0,
@@ -146,7 +146,7 @@ exports[`PickerAccount Rendering should render correctly with snapshot 1`] = `
     Orangefox.eth
   </Text>
   <SvgMock
-    color="#121314"
+    color="#131416"
     fill="currentColor"
     height={16}
     name="ArrowDown"
diff --git a/app/component-library/components/Pickers/PickerBase/__snapshots__/PickerBase.test.tsx.snap b/app/component-library/components/Pickers/PickerBase/__snapshots__/PickerBase.test.tsx.snap
index 6d014204c701..5950e629cf89 100644
--- a/app/component-library/components/Pickers/PickerBase/__snapshots__/PickerBase.test.tsx.snap
+++ b/app/component-library/components/Pickers/PickerBase/__snapshots__/PickerBase.test.tsx.snap
@@ -7,7 +7,7 @@ exports[`PickerBase should render correctly 1`] = `
     {
       "alignItems": "center",
       "backgroundColor": "#ffffff",
-      "borderColor": "#b7bbc8",
+      "borderColor": "#949596",
       "borderRadius": 4,
       "borderWidth": 1,
       "flexDirection": "row",
@@ -19,7 +19,7 @@ exports[`PickerBase should render correctly 1`] = `
     Test Content
   </Text>
   <SvgMock
-    color="#121314"
+    color="#131416"
     fill="currentColor"
     height={20}
     name="ArrowDown"
diff --git a/app/component-library/components/Pickers/PickerNetwork/__snapshots__/PickerNetwork.test.tsx.snap b/app/component-library/components/Pickers/PickerNetwork/__snapshots__/PickerNetwork.test.tsx.snap
index ffbe04ad266e..ceeddece8783 100644
--- a/app/component-library/components/Pickers/PickerNetwork/__snapshots__/PickerNetwork.test.tsx.snap
+++ b/app/component-library/components/Pickers/PickerNetwork/__snapshots__/PickerNetwork.test.tsx.snap
@@ -8,7 +8,7 @@ exports[`PickerNetwork renders correctly 1`] = `
     {
       "alignItems": "center",
       "alignSelf": "center",
-      "backgroundColor": "#f3f5f9",
+      "backgroundColor": "#f3f3f4",
       "borderRadius": 16,
       "flexDirection": "row",
       "height": 32,
@@ -57,7 +57,7 @@ exports[`PickerNetwork renders correctly 1`] = `
     numberOfLines={1}
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "flexShrink": 1,
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
@@ -71,7 +71,7 @@ exports[`PickerNetwork renders correctly 1`] = `
     Ethereum Mainnet
   </Text>
   <SvgMock
-    color="#121314"
+    color="#131416"
     fill="currentColor"
     height={12}
     name="ArrowDown"
diff --git a/app/component-library/components/RadioButton/__snapshots__/RadioButton.test.tsx.snap b/app/component-library/components/RadioButton/__snapshots__/RadioButton.test.tsx.snap
index e6644f8f5bbf..0ed81e947db7 100644
--- a/app/component-library/components/RadioButton/__snapshots__/RadioButton.test.tsx.snap
+++ b/app/component-library/components/RadioButton/__snapshots__/RadioButton.test.tsx.snap
@@ -18,7 +18,7 @@ exports[`RadioButton should render correctly 1`] = `
       {
         "alignItems": "center",
         "backgroundColor": "#ffffff",
-        "borderColor": "#b7bbc8",
+        "borderColor": "#949596",
         "borderRadius": 99,
         "borderWidth": 2,
         "height": 20,
diff --git a/app/component-library/components/Select/SelectButton/__snapshots__/SelectButton.test.tsx.snap b/app/component-library/components/Select/SelectButton/__snapshots__/SelectButton.test.tsx.snap
index ef3d46253259..3c58b7cddfaa 100644
--- a/app/component-library/components/Select/SelectButton/__snapshots__/SelectButton.test.tsx.snap
+++ b/app/component-library/components/Select/SelectButton/__snapshots__/SelectButton.test.tsx.snap
@@ -8,7 +8,7 @@ exports[`SelectButton should render snapshot correctly 1`] = `
     {
       "alignItems": "center",
       "backgroundColor": "#ffffff",
-      "borderColor": "#b7bbc8",
+      "borderColor": "#949596",
       "borderRadius": 8,
       "borderWidth": 1,
       "flexDirection": "row",
@@ -89,7 +89,7 @@ exports[`SelectButton should render snapshot correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -104,7 +104,7 @@ exports[`SelectButton should render snapshot correctly 1`] = `
           numberOfLines={1}
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "fontFamily": "Geist-Regular",
               "fontSize": 14,
               "letterSpacing": 0,
@@ -119,7 +119,7 @@ exports[`SelectButton should render snapshot correctly 1`] = `
   </View>
   <View>
     <SvgMock
-      color="#121314"
+      color="#131416"
       fill="currentColor"
       height={16}
       name="ArrowDown"
diff --git a/app/component-library/components/Select/SelectButton/foundation/__snapshots__/SelectButtonBase.test.tsx.snap b/app/component-library/components/Select/SelectButton/foundation/__snapshots__/SelectButtonBase.test.tsx.snap
index d22cf830fca8..21f3e1278a73 100644
--- a/app/component-library/components/Select/SelectButton/foundation/__snapshots__/SelectButtonBase.test.tsx.snap
+++ b/app/component-library/components/Select/SelectButton/foundation/__snapshots__/SelectButtonBase.test.tsx.snap
@@ -80,7 +80,7 @@ exports[`SelectButtonBase should render snapshot correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -95,7 +95,7 @@ exports[`SelectButtonBase should render snapshot correctly 1`] = `
           numberOfLines={1}
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "fontFamily": "Geist-Regular",
               "fontSize": 14,
               "letterSpacing": 0,
@@ -110,7 +110,7 @@ exports[`SelectButtonBase should render snapshot correctly 1`] = `
   </View>
   <View>
     <SvgMock
-      color="#121314"
+      color="#131416"
       fill="currentColor"
       height={20}
       name="ArrowDown"
diff --git a/app/component-library/components/Select/SelectOption/__snapshots__/SelectOption.test.tsx.snap b/app/component-library/components/Select/SelectOption/__snapshots__/SelectOption.test.tsx.snap
index 6a32bc805947..fac6c742671b 100644
--- a/app/component-library/components/Select/SelectOption/__snapshots__/SelectOption.test.tsx.snap
+++ b/app/component-library/components/Select/SelectOption/__snapshots__/SelectOption.test.tsx.snap
@@ -98,7 +98,7 @@ exports[`SelectOption should render snapshot correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -113,7 +113,7 @@ exports[`SelectOption should render snapshot correctly 1`] = `
               numberOfLines={1}
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 14,
                   "letterSpacing": 0,
diff --git a/app/component-library/components/Select/SelectValue/__snapshots__/SelectValue.test.tsx.snap b/app/component-library/components/Select/SelectValue/__snapshots__/SelectValue.test.tsx.snap
index 53987354f29f..a93ef6a0a739 100644
--- a/app/component-library/components/Select/SelectValue/__snapshots__/SelectValue.test.tsx.snap
+++ b/app/component-library/components/Select/SelectValue/__snapshots__/SelectValue.test.tsx.snap
@@ -69,7 +69,7 @@ exports[`SelectValue should render snapshot correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -84,7 +84,7 @@ exports[`SelectValue should render snapshot correctly 1`] = `
         numberOfLines={1}
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 14,
             "letterSpacing": 0,
diff --git a/app/component-library/components/Skeleton/__snapshots__/Skeleton.test.tsx.snap b/app/component-library/components/Skeleton/__snapshots__/Skeleton.test.tsx.snap
index a7ba18b4d6ef..c6342ca22cf7 100644
--- a/app/component-library/components/Skeleton/__snapshots__/Skeleton.test.tsx.snap
+++ b/app/component-library/components/Skeleton/__snapshots__/Skeleton.test.tsx.snap
@@ -14,7 +14,7 @@ exports[`Skeleton should match snapshot 1`] = `
     pointerEvents="none"
     style={
       {
-        "backgroundColor": "#686e7d",
+        "backgroundColor": "#66676a",
         "borderRadius": 4,
         "bottom": 0,
         "left": 0,
diff --git a/app/component-library/components/Tags/Tag/__snapshots__/Tag.test.tsx.snap b/app/component-library/components/Tags/Tag/__snapshots__/Tag.test.tsx.snap
index 3034c8023958..687298ba6e64 100644
--- a/app/component-library/components/Tags/Tag/__snapshots__/Tag.test.tsx.snap
+++ b/app/component-library/components/Tags/Tag/__snapshots__/Tag.test.tsx.snap
@@ -4,7 +4,7 @@ exports[`Tag should render correctly 1`] = `
 <View
   style={
     {
-      "backgroundColor": "#f3f5f9",
+      "backgroundColor": "#f3f3f4",
       "borderRadius": 4,
       "height": 24,
       "justifyContent": "center",
@@ -16,7 +16,7 @@ exports[`Tag should render correctly 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#686e7d",
+        "color": "#66676a",
         "fontFamily": "Geist-Medium",
         "fontSize": 12,
         "letterSpacing": 0.25,
diff --git a/app/component-library/components/Tags/TagUrl/__snapshots__/TagUrl.test.tsx.snap b/app/component-library/components/Tags/TagUrl/__snapshots__/TagUrl.test.tsx.snap
index 77043ee349af..2c6166c3d314 100644
--- a/app/component-library/components/Tags/TagUrl/__snapshots__/TagUrl.test.tsx.snap
+++ b/app/component-library/components/Tags/TagUrl/__snapshots__/TagUrl.test.tsx.snap
@@ -7,7 +7,7 @@ exports[`TagUrl should render correctly 1`] = `
       "alignItems": "center",
       "alignSelf": "center",
       "backgroundColor": "#ffffff",
-      "borderColor": "#b7bbc8",
+      "borderColor": "#949596",
       "borderRadius": 99,
       "borderWidth": 1,
       "flexDirection": "row",
@@ -36,7 +36,7 @@ exports[`TagUrl should render correctly 1`] = `
   <Text
     style={
       {
-        "color": "#686e7d",
+        "color": "#66676a",
         "flexShrink": 1,
       }
     }
diff --git a/app/component-library/components/Texts/SensitiveText/__snapshots__/SensitiveText.test.tsx.snap b/app/component-library/components/Texts/SensitiveText/__snapshots__/SensitiveText.test.tsx.snap
index 6efc3416efb4..be964acc801f 100644
--- a/app/component-library/components/Texts/SensitiveText/__snapshots__/SensitiveText.test.tsx.snap
+++ b/app/component-library/components/Texts/SensitiveText/__snapshots__/SensitiveText.test.tsx.snap
@@ -5,7 +5,7 @@ exports[`SensitiveText should render correctly 1`] = `
   accessibilityRole="text"
   style={
     {
-      "color": "#121314",
+      "color": "#131416",
       "fontFamily": "Geist-Regular",
       "fontSize": 16,
       "letterSpacing": 0,
diff --git a/app/component-library/components/Texts/Text/Text.tsx b/app/component-library/components/Texts/Text/Text.tsx
index 5ea2c25768ce..30db539e8b4c 100644
--- a/app/component-library/components/Texts/Text/Text.tsx
+++ b/app/component-library/components/Texts/Text/Text.tsx
@@ -1,9 +1,5 @@
 /* eslint-disable react/prop-types */
 
-/**
- * @deprecated Please update your code to use `Text` from `@metamask/design-system-react-native`
- */
-
 // Third party dependencies.
 import React from 'react';
 import { Text as RNText } from 'react-native';
@@ -16,6 +12,11 @@ import { TextProps } from './Text.types';
 import styleSheet from './Text.styles';
 import { DEFAULT_TEXT_COLOR, DEFAULT_TEXT_VARIANT } from './Text.constants';
 
+/**
+ * @deprecated Please update your code to use `Text` from `@metamask/design-system-react-native`.
+ * The API may have changed — compare props before migrating.
+ * @see {@link https://github.com/MetaMask/metamask-design-system/blob/main/packages/design-system-react-native/src/components/Text/README.md}
+ */
 const Text: React.FC<TextProps> = ({
   variant = DEFAULT_TEXT_VARIANT,
   color = DEFAULT_TEXT_COLOR,
diff --git a/app/component-library/components/Texts/Text/__snapshots__/Text.test.tsx.snap b/app/component-library/components/Texts/Text/__snapshots__/Text.test.tsx.snap
index f0f6d2fbcaaa..66f9a0c761ec 100644
--- a/app/component-library/components/Texts/Text/__snapshots__/Text.test.tsx.snap
+++ b/app/component-library/components/Texts/Text/__snapshots__/Text.test.tsx.snap
@@ -5,7 +5,7 @@ exports[`Text should render correctly 1`] = `
   accessibilityRole="text"
   style={
     {
-      "color": "#121314",
+      "color": "#131416",
       "fontFamily": "Geist-Regular",
       "fontSize": 16,
       "letterSpacing": 0,
diff --git a/app/component-library/components/Texts/TextWithPrefixIcon/__snapshots__/TextWithPrefixIcon.test.tsx.snap b/app/component-library/components/Texts/TextWithPrefixIcon/__snapshots__/TextWithPrefixIcon.test.tsx.snap
index da8b05f28fb2..e001a1096cb1 100644
--- a/app/component-library/components/Texts/TextWithPrefixIcon/__snapshots__/TextWithPrefixIcon.test.tsx.snap
+++ b/app/component-library/components/Texts/TextWithPrefixIcon/__snapshots__/TextWithPrefixIcon.test.tsx.snap
@@ -11,7 +11,7 @@ exports[`TextWithPrefixIcon - Snapshot should render default settings correctly
   testID="text-with-prefix-icon"
 >
   <Icon
-    color="#121314"
+    color="#131416"
     name="Add"
     testID="text-with-prefix-icon-icon"
   />
diff --git a/app/components/Approvals/ApprovalModal/__snapshots__/ApprovalModal.test.tsx.snap b/app/components/Approvals/ApprovalModal/__snapshots__/ApprovalModal.test.tsx.snap
index ca8ccecc5486..5df0b47d67c0 100644
--- a/app/components/Approvals/ApprovalModal/__snapshots__/ApprovalModal.test.tsx.snap
+++ b/app/components/Approvals/ApprovalModal/__snapshots__/ApprovalModal.test.tsx.snap
@@ -53,7 +53,7 @@ exports[`ApprovalModal renders 1`] = `
       onStartShouldSetResponder={[Function]}
       style={
         {
-          "backgroundColor": "#3f434a66",
+          "backgroundColor": "#0a0d135c",
           "bottom": 0,
           "height": 1334,
           "left": 0,
diff --git a/app/components/Approvals/SwitchChainApproval/SwitchChainApproval.test.tsx b/app/components/Approvals/SwitchChainApproval/SwitchChainApproval.test.tsx
index 4269515c41c1..9f618740e20a 100644
--- a/app/components/Approvals/SwitchChainApproval/SwitchChainApproval.test.tsx
+++ b/app/components/Approvals/SwitchChainApproval/SwitchChainApproval.test.tsx
@@ -18,35 +18,6 @@ jest.mock('../../../selectors/networkController', () => ({
   }),
 }));
 
-jest.mock('../../hooks/useNetworksByNamespace/useNetworksByNamespace', () => ({
-  useNetworksByNamespace: () => ({
-    networks: [
-      {
-        id: 'eip155:1',
-        name: 'Ethereum',
-        caipChainId: 'eip155:1',
-        isSelected: false,
-        imageSource:
-          'https://assets.coingecko.com/coins/images/279/small/ethereum.png?1595348880',
-        networkTypeOrRpcUrl: 'https://mock-url.com',
-      },
-    ],
-  }),
-  NetworkType: {
-    Popular: 'popular',
-    Custom: 'custom',
-  },
-}));
-
-const mockSelectNetwork = jest.fn();
-jest.mock('../../hooks/useNetworkSelection/useNetworkSelection', () => ({
-  useNetworkSelection: () => ({
-    selectCustomNetwork: jest.fn(),
-    selectPopularNetwork: jest.fn(),
-    selectNetwork: mockSelectNetwork,
-  }),
-}));
-
 jest.mock('../../Views/confirmations/hooks/useApprovalRequest');
 jest.mock('../../../actions/onboardNetwork');
 
@@ -144,38 +115,4 @@ describe('SwitchChainApproval', () => {
       networkStatus: true,
     });
   });
-
-  it('sets token network filter', () => {
-    mockApprovalRequest({
-      type: ApprovalTypes.SWITCH_ETHEREUM_CHAIN,
-      requestData: mockApprovalRequestData,
-    });
-
-    const wrapper = shallow(<SwitchChainApproval />);
-    wrapper.find('SwitchCustomNetwork').simulate('confirm');
-
-    expect(networkSwitched).toHaveBeenCalledTimes(1);
-    expect(networkSwitched).toHaveBeenCalledWith({
-      networkUrl: URL_MOCK,
-      networkStatus: true,
-    });
-  });
-
-  it('calls selectNetwork when confirm is pressed', () => {
-    mockApprovalRequest({
-      type: ApprovalTypes.SWITCH_ETHEREUM_CHAIN,
-      requestData: mockApprovalRequestData,
-    });
-
-    const wrapper = shallow(<SwitchChainApproval />);
-    wrapper.find('SwitchCustomNetwork').simulate('confirm');
-
-    expect(mockSelectNetwork).toHaveBeenCalledTimes(1);
-    expect(mockSelectNetwork).toHaveBeenCalledWith('0x1');
-    expect(networkSwitched).toHaveBeenCalledTimes(1);
-    expect(networkSwitched).toHaveBeenCalledWith({
-      networkUrl: URL_MOCK,
-      networkStatus: true,
-    });
-  });
 });
diff --git a/app/components/Approvals/SwitchChainApproval/SwitchChainApproval.tsx b/app/components/Approvals/SwitchChainApproval/SwitchChainApproval.tsx
index 1401f4f96d9f..06fbecdcd1e0 100644
--- a/app/components/Approvals/SwitchChainApproval/SwitchChainApproval.tsx
+++ b/app/components/Approvals/SwitchChainApproval/SwitchChainApproval.tsx
@@ -5,11 +5,6 @@ import ApprovalModal from '../ApprovalModal';
 import SwitchCustomNetwork from '../../UI/SwitchCustomNetwork';
 import { networkSwitched } from '../../../actions/onboardNetwork';
 import { useDispatch, useSelector } from 'react-redux';
-import {
-  NetworkType,
-  useNetworksByNamespace,
-} from '../../hooks/useNetworksByNamespace/useNetworksByNamespace';
-import { useNetworkSelection } from '../../hooks/useNetworkSelection/useNetworkSelection';
 import {
   Caip25CaveatType,
   Caip25EndowmentPermissionName,
@@ -26,12 +21,6 @@ const SwitchChainApproval = () => {
   } = useApprovalRequest();
 
   const dispatch = useDispatch();
-  const { networks } = useNetworksByNamespace({
-    networkType: NetworkType.Popular,
-  });
-  const { selectNetwork } = useNetworkSelection({
-    networks,
-  });
 
   const evmNetworkConfigurations = useSelector(
     selectEvmNetworkConfigurationsByChainId,
@@ -52,16 +41,13 @@ const SwitchChainApproval = () => {
   const onConfirm = useCallback(() => {
     defaultOnConfirm();
 
-    // If remove global network selector is enabled should set network filter
-    selectNetwork(chainId);
-
     dispatch(
       networkSwitched({
         networkUrl: approvalRequest?.requestData?.metadata?.rpcUrl,
         networkStatus: true,
       }),
     );
-  }, [approvalRequest, defaultOnConfirm, dispatch, selectNetwork, chainId]);
+  }, [approvalRequest, defaultOnConfirm, dispatch]);
 
   if (
     approvalRequest?.requestData?.diff?.permissionDiffMap?.[
diff --git a/app/components/Base/Keypad/__snapshots__/Keypad.test.tsx.snap b/app/components/Base/Keypad/__snapshots__/Keypad.test.tsx.snap
index e4e61b418531..af1d5c403792 100644
--- a/app/components/Base/Keypad/__snapshots__/Keypad.test.tsx.snap
+++ b/app/components/Base/Keypad/__snapshots__/Keypad.test.tsx.snap
@@ -46,7 +46,7 @@ exports[`Keypad components components should render correctly and match snapshot
           [
             {
               "alignItems": "center",
-              "backgroundColor": "#3c4d9d0f",
+              "backgroundColor": "#b4b4b528",
               "borderRadius": 12,
               "height": 48,
               "justifyContent": "center",
@@ -61,7 +61,7 @@ exports[`Keypad components components should render correctly and match snapshot
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 32,
                 "fontWeight": "500",
@@ -98,7 +98,7 @@ exports[`Keypad components components should render correctly and match snapshot
           [
             {
               "alignItems": "center",
-              "backgroundColor": "#3c4d9d0f",
+              "backgroundColor": "#b4b4b528",
               "borderRadius": 12,
               "height": 48,
               "justifyContent": "center",
@@ -113,7 +113,7 @@ exports[`Keypad components components should render correctly and match snapshot
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 32,
                 "fontWeight": "500",
@@ -150,7 +150,7 @@ exports[`Keypad components components should render correctly and match snapshot
           [
             {
               "alignItems": "center",
-              "backgroundColor": "#3c4d9d0f",
+              "backgroundColor": "#b4b4b528",
               "borderRadius": 12,
               "height": 48,
               "justifyContent": "center",
@@ -165,7 +165,7 @@ exports[`Keypad components components should render correctly and match snapshot
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 32,
                 "fontWeight": "500",
@@ -216,7 +216,7 @@ exports[`Keypad components components should render correctly and match snapshot
           [
             {
               "alignItems": "center",
-              "backgroundColor": "#3c4d9d0f",
+              "backgroundColor": "#b4b4b528",
               "borderRadius": 12,
               "height": 48,
               "justifyContent": "center",
@@ -231,7 +231,7 @@ exports[`Keypad components components should render correctly and match snapshot
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 32,
                 "fontWeight": "500",
@@ -268,7 +268,7 @@ exports[`Keypad components components should render correctly and match snapshot
           [
             {
               "alignItems": "center",
-              "backgroundColor": "#3c4d9d0f",
+              "backgroundColor": "#b4b4b528",
               "borderRadius": 12,
               "height": 48,
               "justifyContent": "center",
@@ -283,7 +283,7 @@ exports[`Keypad components components should render correctly and match snapshot
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 32,
                 "fontWeight": "500",
@@ -320,7 +320,7 @@ exports[`Keypad components components should render correctly and match snapshot
           [
             {
               "alignItems": "center",
-              "backgroundColor": "#3c4d9d0f",
+              "backgroundColor": "#b4b4b528",
               "borderRadius": 12,
               "height": 48,
               "justifyContent": "center",
@@ -335,7 +335,7 @@ exports[`Keypad components components should render correctly and match snapshot
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 32,
                 "fontWeight": "500",
@@ -386,7 +386,7 @@ exports[`Keypad components components should render correctly and match snapshot
           [
             {
               "alignItems": "center",
-              "backgroundColor": "#3c4d9d0f",
+              "backgroundColor": "#b4b4b528",
               "borderRadius": 12,
               "height": 48,
               "justifyContent": "center",
@@ -401,7 +401,7 @@ exports[`Keypad components components should render correctly and match snapshot
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 32,
                 "fontWeight": "500",
@@ -438,7 +438,7 @@ exports[`Keypad components components should render correctly and match snapshot
           [
             {
               "alignItems": "center",
-              "backgroundColor": "#3c4d9d0f",
+              "backgroundColor": "#b4b4b528",
               "borderRadius": 12,
               "height": 48,
               "justifyContent": "center",
@@ -453,7 +453,7 @@ exports[`Keypad components components should render correctly and match snapshot
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 32,
                 "fontWeight": "500",
@@ -490,7 +490,7 @@ exports[`Keypad components components should render correctly and match snapshot
           [
             {
               "alignItems": "center",
-              "backgroundColor": "#3c4d9d0f",
+              "backgroundColor": "#b4b4b528",
               "borderRadius": 12,
               "height": 48,
               "justifyContent": "center",
@@ -505,7 +505,7 @@ exports[`Keypad components components should render correctly and match snapshot
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 32,
                 "fontWeight": "500",
@@ -556,7 +556,7 @@ exports[`Keypad components components should render correctly and match snapshot
           [
             {
               "alignItems": "center",
-              "backgroundColor": "#3c4d9d0f",
+              "backgroundColor": "#b4b4b528",
               "borderRadius": 12,
               "height": 48,
               "justifyContent": "center",
@@ -571,7 +571,7 @@ exports[`Keypad components components should render correctly and match snapshot
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 32,
                 "fontWeight": "500",
@@ -608,7 +608,7 @@ exports[`Keypad components components should render correctly and match snapshot
           [
             {
               "alignItems": "center",
-              "backgroundColor": "#3c4d9d0f",
+              "backgroundColor": "#b4b4b528",
               "borderRadius": 12,
               "height": 48,
               "justifyContent": "center",
@@ -623,7 +623,7 @@ exports[`Keypad components components should render correctly and match snapshot
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 32,
                 "fontWeight": "500",
@@ -675,7 +675,7 @@ exports[`Keypad components components should render correctly and match snapshot
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "height": 32,
                 "width": 32,
               },
@@ -735,7 +735,7 @@ exports[`Keypad should render correctly and match snapshot 1`] = `
           [
             {
               "alignItems": "center",
-              "backgroundColor": "#3c4d9d0f",
+              "backgroundColor": "#b4b4b528",
               "borderRadius": 12,
               "height": 48,
               "justifyContent": "center",
@@ -750,7 +750,7 @@ exports[`Keypad should render correctly and match snapshot 1`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 32,
                 "fontWeight": "500",
@@ -787,7 +787,7 @@ exports[`Keypad should render correctly and match snapshot 1`] = `
           [
             {
               "alignItems": "center",
-              "backgroundColor": "#3c4d9d0f",
+              "backgroundColor": "#b4b4b528",
               "borderRadius": 12,
               "height": 48,
               "justifyContent": "center",
@@ -802,7 +802,7 @@ exports[`Keypad should render correctly and match snapshot 1`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 32,
                 "fontWeight": "500",
@@ -839,7 +839,7 @@ exports[`Keypad should render correctly and match snapshot 1`] = `
           [
             {
               "alignItems": "center",
-              "backgroundColor": "#3c4d9d0f",
+              "backgroundColor": "#b4b4b528",
               "borderRadius": 12,
               "height": 48,
               "justifyContent": "center",
@@ -854,7 +854,7 @@ exports[`Keypad should render correctly and match snapshot 1`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 32,
                 "fontWeight": "500",
@@ -905,7 +905,7 @@ exports[`Keypad should render correctly and match snapshot 1`] = `
           [
             {
               "alignItems": "center",
-              "backgroundColor": "#3c4d9d0f",
+              "backgroundColor": "#b4b4b528",
               "borderRadius": 12,
               "height": 48,
               "justifyContent": "center",
@@ -920,7 +920,7 @@ exports[`Keypad should render correctly and match snapshot 1`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 32,
                 "fontWeight": "500",
@@ -957,7 +957,7 @@ exports[`Keypad should render correctly and match snapshot 1`] = `
           [
             {
               "alignItems": "center",
-              "backgroundColor": "#3c4d9d0f",
+              "backgroundColor": "#b4b4b528",
               "borderRadius": 12,
               "height": 48,
               "justifyContent": "center",
@@ -972,7 +972,7 @@ exports[`Keypad should render correctly and match snapshot 1`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 32,
                 "fontWeight": "500",
@@ -1009,7 +1009,7 @@ exports[`Keypad should render correctly and match snapshot 1`] = `
           [
             {
               "alignItems": "center",
-              "backgroundColor": "#3c4d9d0f",
+              "backgroundColor": "#b4b4b528",
               "borderRadius": 12,
               "height": 48,
               "justifyContent": "center",
@@ -1024,7 +1024,7 @@ exports[`Keypad should render correctly and match snapshot 1`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 32,
                 "fontWeight": "500",
@@ -1075,7 +1075,7 @@ exports[`Keypad should render correctly and match snapshot 1`] = `
           [
             {
               "alignItems": "center",
-              "backgroundColor": "#3c4d9d0f",
+              "backgroundColor": "#b4b4b528",
               "borderRadius": 12,
               "height": 48,
               "justifyContent": "center",
@@ -1090,7 +1090,7 @@ exports[`Keypad should render correctly and match snapshot 1`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 32,
                 "fontWeight": "500",
@@ -1127,7 +1127,7 @@ exports[`Keypad should render correctly and match snapshot 1`] = `
           [
             {
               "alignItems": "center",
-              "backgroundColor": "#3c4d9d0f",
+              "backgroundColor": "#b4b4b528",
               "borderRadius": 12,
               "height": 48,
               "justifyContent": "center",
@@ -1142,7 +1142,7 @@ exports[`Keypad should render correctly and match snapshot 1`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 32,
                 "fontWeight": "500",
@@ -1179,7 +1179,7 @@ exports[`Keypad should render correctly and match snapshot 1`] = `
           [
             {
               "alignItems": "center",
-              "backgroundColor": "#3c4d9d0f",
+              "backgroundColor": "#b4b4b528",
               "borderRadius": 12,
               "height": 48,
               "justifyContent": "center",
@@ -1194,7 +1194,7 @@ exports[`Keypad should render correctly and match snapshot 1`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 32,
                 "fontWeight": "500",
@@ -1245,7 +1245,7 @@ exports[`Keypad should render correctly and match snapshot 1`] = `
           [
             {
               "alignItems": "center",
-              "backgroundColor": "#3c4d9d0f",
+              "backgroundColor": "#b4b4b528",
               "borderRadius": 12,
               "height": 48,
               "justifyContent": "center",
@@ -1262,7 +1262,7 @@ exports[`Keypad should render correctly and match snapshot 1`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 32,
                 "fontWeight": "500",
@@ -1299,7 +1299,7 @@ exports[`Keypad should render correctly and match snapshot 1`] = `
           [
             {
               "alignItems": "center",
-              "backgroundColor": "#3c4d9d0f",
+              "backgroundColor": "#b4b4b528",
               "borderRadius": 12,
               "height": 48,
               "justifyContent": "center",
@@ -1314,7 +1314,7 @@ exports[`Keypad should render correctly and match snapshot 1`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 32,
                 "fontWeight": "500",
@@ -1369,7 +1369,7 @@ exports[`Keypad should render correctly and match snapshot 1`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "height": 32,
                 "width": 32,
               },
diff --git a/app/components/Nav/App/App.tsx b/app/components/Nav/App/App.tsx
index 58723958b5a0..690420af7e9a 100644
--- a/app/components/Nav/App/App.tsx
+++ b/app/components/Nav/App/App.tsx
@@ -56,7 +56,7 @@ import ConnectQRHardware from '../../Views/ConnectQRHardware';
 import SelectHardwareWallet from '../../Views/ConnectHardware/SelectHardware';
 import { UpdateNeeded } from '../../../components/UI/UpdateNeeded';
 import { OTAUpdatesModal } from '../../UI/OTAUpdatesModal';
-import NetworkSettings from '../../Views/Settings/NetworksSettings/NetworkSettings';
+import NetworkDetailsView from '../../Views/NetworksManagement/NetworkDetailsView';
 import ModalMandatory from '../../../component-library/components/Modals/ModalMandatory';
 import { RestoreWallet } from '../../Views/RestoreWallet';
 import WalletRestored from '../../Views/RestoreWallet/WalletRestored';
@@ -94,7 +94,6 @@ import OnboardingAssetsSettings from '../../Views/OnboardingSuccess/OnboardingAs
 import OnboardingSecuritySettings from '../../Views/OnboardingSuccess/OnboardingSecuritySettings';
 import BasicFunctionalityModal from '../../UI/BasicFunctionality/BasicFunctionalityModal/BasicFunctionalityModal';
 import PermittedNetworksInfoSheet from '../../Views/AccountPermissions/PermittedNetworksInfoSheet/PermittedNetworksInfoSheet';
-import ResetNotificationsModal from '../../UI/Notification/ResetNotificationsModal';
 import NFTAutoDetectionModal from '../../../../app/components/Views/NFTAutoDetectionModal/NFTAutoDetectionModal';
 import WhatsNewModal from '../../UI/WhatsNewModal';
 import NftOptions from '../../../components/Views/NftOptions';
@@ -136,6 +135,7 @@ import { ShareAddressQR } from '../../Views/MultichainAccounts/sheets/ShareAddre
 import DeleteAccount from '../../Views/MultichainAccounts/sheets/DeleteAccount';
 import RevealPrivateKey from '../../Views/MultichainAccounts/sheets/RevealPrivateKey';
 import RevealSRP from '../../Views/MultichainAccounts/sheets/RevealSRP';
+import { RevealPrivateCredential } from '../../Views/RevealPrivateCredential';
 import { DeepLinkModal } from '../../UI/DeepLinkModal';
 import MultichainAccountsIntroModal from '../../Views/MultichainAccounts/IntroModal';
 import LearnMoreBottomSheet from '../../Views/MultichainAccounts/IntroModal/LearnMoreBottomSheet';
@@ -148,10 +148,10 @@ import useInterval from '../../hooks/useInterval';
 import { Duration } from '@metamask/utils';
 import { selectSeedlessOnboardingLoginFlow } from '../../../selectors/seedlessOnboardingController';
 import { PayWithModal } from '../../Views/confirmations/components/modals/pay-with-modal/pay-with-modal';
-import { State2AccountConnectWrapper } from '../../Views/MultichainAccounts/MultichainAccountConnect/State2AccountConnectWrapper';
+import MultichainAccountConnect from '../../Views/MultichainAccounts/MultichainAccountConnect/MultichainAccountConnect';
 import { SmartAccountModal } from '../../Views/MultichainAccounts/AccountDetails/components/SmartAccountModal/SmartAccountModal';
 import TradeWalletActions from '../../Views/TradeWalletActions';
-import { BIP44AccountPermissionWrapper } from '../../Views/MultichainAccounts/MultichainPermissionsSummary/BIP44AccountPermissionWrapper';
+import { MultichainAccountPermissions } from '../../Views/MultichainAccounts/MultichainAccountPermissions/MultichainAccountPermissions';
 import SocialLoginIosUser from '../../Views/SocialLoginIosUser';
 import { useOTAUpdates } from '../../hooks/useOTAUpdates';
 import MultichainTransactionDetailsSheet from '../../UI/MultichainTransactionDetailsModal/MultichainTransactionDetailsSheet';
@@ -333,10 +333,10 @@ const AddNetworkFlow = () => {
   const route = useRoute();
 
   return (
-    <Stack.Navigator>
+    <Stack.Navigator screenOptions={{ headerShown: false }}>
       <Stack.Screen
         name="AddNetwork"
-        component={NetworkSettings}
+        component={NetworkDetailsView}
         initialParams={route?.params}
       />
     </Stack.Navigator>
@@ -460,11 +460,11 @@ const RootModalFlow = (props: RootModalFlowProps) => (
     />
     <Stack.Screen
       name={Routes.SHEET.ACCOUNT_CONNECT}
-      component={State2AccountConnectWrapper}
+      component={MultichainAccountConnect}
     />
     <Stack.Screen
       name={Routes.SHEET.ACCOUNT_PERMISSIONS}
-      component={BIP44AccountPermissionWrapper}
+      component={MultichainAccountPermissions}
       initialParams={{ initialScreen: AccountPermissionsScreens.Connected }}
     />
     <Stack.Screen
@@ -499,10 +499,6 @@ const RootModalFlow = (props: RootModalFlowProps) => (
       name={Routes.SHEET.CONFIRM_TURN_ON_BACKUP_AND_SYNC}
       component={ConfirmTurnOnBackupAndSyncModal}
     />
-    <Stack.Screen
-      name={Routes.SHEET.RESET_NOTIFICATIONS}
-      component={ResetNotificationsModal}
-    />
     <Stack.Screen
       name={Routes.SHEET.AMBIGUOUS_ADDRESS}
       component={AmbiguousAddressSheet}
@@ -978,6 +974,26 @@ const AppFlow = () => (
         }),
       }}
     />
+    <Stack.Screen
+      name={Routes.SETTINGS.REVEAL_PRIVATE_CREDENTIAL}
+      component={RevealPrivateCredential}
+      options={{
+        headerShown: false,
+        animationEnabled: true,
+        cardStyleInterpolator: ({ current, layouts }) => ({
+          cardStyle: {
+            transform: [
+              {
+                translateX: current.progress.interpolate({
+                  inputRange: [0, 1],
+                  outputRange: [layouts.screen.width, 0],
+                }),
+              },
+            ],
+          },
+        }),
+      }}
+    />
     <Stack.Screen
       name={Routes.MULTICHAIN_ACCOUNTS.ACCOUNT_CELL_ACTIONS}
       component={MultichainAccountActions}
@@ -1043,13 +1059,21 @@ const AppFlow = () => (
     <Stack.Screen
       name={Routes.ADD_NETWORK}
       component={AddNetworkFlow}
-      options={{ animationEnabled: true }}
+      options={{
+        animationEnabled: true,
+        cardStyle: { flex: 1, backgroundColor: importedColors.transparent },
+        gestureEnabled: true,
+      }}
     />
     {isNetworkUiRedesignEnabled() ? (
       <Stack.Screen
         name={Routes.EDIT_NETWORK}
         component={AddNetworkFlow}
-        options={{ animationEnabled: true }}
+        options={{
+          animationEnabled: true,
+          cardStyle: { flex: 1, backgroundColor: importedColors.transparent },
+          gestureEnabled: true,
+        }}
       />
     ) : null}
     <Stack.Screen
diff --git a/app/components/Nav/Main/MainNavigator.js b/app/components/Nav/Main/MainNavigator.js
index 85ba523818f2..931ff274193b 100644
--- a/app/components/Nav/Main/MainNavigator.js
+++ b/app/components/Nav/Main/MainNavigator.js
@@ -68,6 +68,7 @@ import V2BankDetails from '../../UI/Ramp/Views/NativeFlow/BankDetails';
 import { colors as importedColors } from '../../../styles/common';
 import OrderDetails from '../../UI/Ramp/Aggregator/Views/OrderDetails';
 import RampsOrderDetails from '../../UI/Ramp/Views/OrderDetails';
+import DepositOrderDetails from '../../UI/Ramp/Deposit/Views/DepositOrderDetails/DepositOrderDetails';
 import ProcessingInfoModal from '../../UI/Ramp/Views/Modals/ProcessingInfoModal/ProcessingInfoModal';
 import SendTransaction from '../../UI/Ramp/Aggregator/Views/SendTransaction';
 import TabBar from '../../../component-library/components/Navigation/TabBar';
@@ -116,7 +117,6 @@ import { useAccountMenuEnabled } from '../../../selectors/featureFlagController/
 import PerpsPositionTransactionView from '../../UI/Perps/Views/PerpsTransactionsView/PerpsPositionTransactionView';
 import PerpsOrderTransactionView from '../../UI/Perps/Views/PerpsTransactionsView/PerpsOrderTransactionView';
 import PerpsFundingTransactionView from '../../UI/Perps/Views/PerpsTransactionsView/PerpsFundingTransactionView';
-import TurnOnBackupAndSync from '../../Views/Identity/TurnOnBackupAndSync/TurnOnBackupAndSync';
 import DeFiProtocolPositionDetails from '../../UI/DeFiPositions/DeFiProtocolPositionDetails';
 import UnmountOnBlur from '../../Views/UnmountOnBlur';
 ///: BEGIN:ONLY_INCLUDE_IF(sample-feature)
@@ -233,6 +233,7 @@ const WalletTabStackFlow = () => (
     <Stack.Screen
       name={Routes.SETTINGS.REVEAL_PRIVATE_CREDENTIAL}
       component={RevealPrivateCredential}
+      options={{ headerShown: false }}
     />
   </Stack.Navigator>
 );
@@ -262,6 +263,10 @@ const TransactionsHome = () => (
       name={Routes.RAMP.RAMPS_ORDER_DETAILS}
       component={RampsOrderDetails}
     />
+    <Stack.Screen
+      name={Routes.DEPOSIT.ORDER_DETAILS}
+      component={DepositOrderDetails}
+    />
     <Stack.Screen
       name={Routes.RAMP.BANK_DETAILS_STANDALONE}
       component={V2BankDetails}
@@ -449,7 +454,7 @@ const SettingsFlow = () => {
       <Stack.Screen
         name="ExperimentalSettings"
         component={ExperimentalSettings}
-        options={ExperimentalSettings.navigationOptions}
+        options={{ headerShown: false }}
       />
       <Stack.Screen
         name="CompanySettings"
@@ -485,11 +490,12 @@ const SettingsFlow = () => {
       <Stack.Screen
         name={Routes.SETTINGS.REVEAL_PRIVATE_CREDENTIAL}
         component={RevealPrivateCredential}
+        options={{ headerShown: false }}
       />
       <Stack.Screen
         name={Routes.WALLET.WALLET_CONNECT_SESSIONS_VIEW}
         component={WalletConnectSessions}
-        options={WalletConnectSessions.navigationOptions}
+        options={{ headerShown: false }}
       />
       <Stack.Screen
         name="ResetPassword"
@@ -1200,11 +1206,6 @@ const MainNavigator = () => {
         component={NotificationsOptInStack}
         options={NotificationsOptInStack.navigationOptions}
       />
-      <Stack.Screen
-        name={Routes.IDENTITY.TURN_ON_BACKUP_AND_SYNC}
-        component={TurnOnBackupAndSync}
-        options={TurnOnBackupAndSync.navigationOptions}
-      />
       <Stack.Screen
         name="DeFiProtocolPositionDetails"
         component={DeFiProtocolPositionDetails}
diff --git a/app/components/Nav/Main/RootRPCMethodsUI.test.js b/app/components/Nav/Main/RootRPCMethodsUI.test.js
index 92cd8e145068..751cfdf57a62 100644
--- a/app/components/Nav/Main/RootRPCMethodsUI.test.js
+++ b/app/components/Nav/Main/RootRPCMethodsUI.test.js
@@ -34,14 +34,18 @@ jest.mock('../../../components/hooks/useAnalytics/useAnalytics', () => ({
   })),
 }));
 
+const mockIsHardwareAccount = jest.fn((_, types) =>
+  types.includes('Ledger Hardware'),
+);
 jest.mock('../../../util/address', () => ({
-  isHardwareAccount: jest.fn((_, types) => types.includes('Ledger Hardware')),
+  isHardwareAccount: (...args) => mockIsHardwareAccount(...args),
 }));
 
+const mockGetDeviceId = jest.fn(() => {
+  throw new Error('KeystoneError#Tx_canceled');
+});
 jest.mock('../../../core/Ledger/Ledger', () => ({
-  getDeviceId: jest.fn(() => {
-    throw new Error('KeystoneError#Tx_canceled');
-  }),
+  getDeviceId: (...args) => mockGetDeviceId(...args),
 }));
 
 jest.mock('../../Approvals/WatchAssetApproval', () => 'WatchAssetApproval');
@@ -71,6 +75,34 @@ describe('RootRPCMethodsUI', () => {
   beforeEach(() => {
     jest.clearAllMocks();
     capturedAutoSign = undefined;
+    mockIsHardwareAccount.mockImplementation((_, types) =>
+      types.includes('Ledger Hardware'),
+    );
+  });
+
+  describe('autoSign', () => {
+    it('does not navigate or open signing when from account is not Ledger or QR', async () => {
+      mockIsHardwareAccount.mockReturnValue(false);
+
+      const mockNavigate = jest.fn();
+      render(<RootRPCMethodsUI navigation={{ navigate: mockNavigate }} />);
+
+      const subscribeCall = controllerMessenger.subscribe.mock.calls[0];
+      const handleUnapprovedTransaction = subscribeCall[1];
+      handleUnapprovedTransaction({
+        id: 'tx-1',
+        txParams: { from: '0xSoftwareWalletAddress' },
+      });
+
+      await capturedAutoSign({
+        id: 'tx-1',
+        txParams: { from: '0xSoftwareWalletAddress' },
+      });
+
+      expect(mockIsHardwareAccount).toHaveBeenCalled();
+      expect(mockNavigate).not.toHaveBeenCalled();
+      expect(mockGetDeviceId).not.toHaveBeenCalled();
+    });
   });
 
   it('calls trackEvent for DAPP_TRANSACTION_CANCELLED on keystone cancel', async () => {
diff --git a/app/components/Nav/Main/__snapshots__/MainNavigator.test.tsx.snap b/app/components/Nav/Main/__snapshots__/MainNavigator.test.tsx.snap
index c0767c6e24a1..601262367e73 100644
--- a/app/components/Nav/Main/__snapshots__/MainNavigator.test.tsx.snap
+++ b/app/components/Nav/Main/__snapshots__/MainNavigator.test.tsx.snap
@@ -358,10 +358,6 @@ exports[`MainNavigator Tab Bar Visibility hides tab bar when browser is active 1
     component={[Function]}
     name="OptInStack"
   />
-  <Screen
-    component={[Function]}
-    name="TurnOnBackupAndSync"
-  />
   <Screen
     component={[Function]}
     name="DeFiProtocolPositionDetails"
@@ -756,10 +752,6 @@ exports[`MainNavigator Tab Bar Visibility shows tab bar when not in browser 1`]
     component={[Function]}
     name="OptInStack"
   />
-  <Screen
-    component={[Function]}
-    name="TurnOnBackupAndSync"
-  />
   <Screen
     component={[Function]}
     name="DeFiProtocolPositionDetails"
@@ -1154,10 +1146,6 @@ exports[`MainNavigator matches rendered snapshot 1`] = `
     component={[Function]}
     name="OptInStack"
   />
-  <Screen
-    component={[Function]}
-    name="TurnOnBackupAndSync"
-  />
   <Screen
     component={[Function]}
     name="DeFiProtocolPositionDetails"
diff --git a/app/components/Snaps/SnapUIAddressInput/__snapshots__/SnapUIAddressInput.test.tsx.snap b/app/components/Snaps/SnapUIAddressInput/__snapshots__/SnapUIAddressInput.test.tsx.snap
index 48a63111281d..4f78b04abec0 100644
--- a/app/components/Snaps/SnapUIAddressInput/__snapshots__/SnapUIAddressInput.test.tsx.snap
+++ b/app/components/Snaps/SnapUIAddressInput/__snapshots__/SnapUIAddressInput.test.tsx.snap
@@ -26,7 +26,7 @@ exports[`SnapUIAddressInput renders the matched address info in a disabled state
           "gap": 8,
         },
         {
-          "borderColor": "#b7bbc866",
+          "borderColor": "#b4b4b566",
           "borderRadius": 8,
           "borderWidth": 1,
           "height": 48,
@@ -75,7 +75,7 @@ exports[`SnapUIAddressInput renders the matched address info in a disabled state
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -91,7 +91,7 @@ exports[`SnapUIAddressInput renders the matched address info in a disabled state
         numberOfLines={1}
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 12,
             "letterSpacing": 0.25,
@@ -179,8 +179,8 @@ exports[`SnapUIAddressInput renders with an invalid CAIP Account ID 1`] = `
     style={
       {
         "alignItems": "center",
-        "backgroundColor": "#3c4d9d0f",
-        "borderColor": "#b7bbc866",
+        "backgroundColor": "#b4b4b528",
+        "borderColor": "#b4b4b566",
         "borderRadius": 12,
         "borderWidth": 1,
         "flexDirection": "row",
@@ -209,13 +209,13 @@ exports[`SnapUIAddressInput renders with an invalid CAIP Account ID 1`] = `
         onBlur={[Function]}
         onChangeText={[Function]}
         onFocus={[Function]}
-        placeholderTextColor="#686e7d"
+        placeholderTextColor="#66676a"
         style={
           {
             "backgroundColor": "inherit",
             "borderColor": "transparent",
             "borderWidth": 1,
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "fontWeight": "400",
diff --git a/app/components/Snaps/SnapUIRenderer/__snapshots__/SnapUIRenderer.test.ts.snap b/app/components/Snaps/SnapUIRenderer/__snapshots__/SnapUIRenderer.test.ts.snap
index e645e8e47eb5..a9560728e269 100644
--- a/app/components/Snaps/SnapUIRenderer/__snapshots__/SnapUIRenderer.test.ts.snap
+++ b/app/components/Snaps/SnapUIRenderer/__snapshots__/SnapUIRenderer.test.ts.snap
@@ -57,7 +57,7 @@ exports[`SnapUIRenderer adds a footer if required 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "fontWeight": "400",
@@ -71,7 +71,7 @@ exports[`SnapUIRenderer adds a footer if required 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "fontWeight": "400",
@@ -122,7 +122,7 @@ exports[`SnapUIRenderer adds a footer if required 1`] = `
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -140,7 +140,7 @@ exports[`SnapUIRenderer adds a footer if required 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Medium",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -254,8 +254,8 @@ exports[`SnapUIRenderer prefills interactive inputs with existing state 1`] = `
                 style={
                   {
                     "alignItems": "center",
-                    "backgroundColor": "#3c4d9d0f",
-                    "borderColor": "#b7bbc866",
+                    "backgroundColor": "#b4b4b528",
+                    "borderColor": "#b4b4b566",
                     "borderRadius": 12,
                     "borderWidth": 1,
                     "flexDirection": "row",
@@ -286,13 +286,13 @@ exports[`SnapUIRenderer prefills interactive inputs with existing state 1`] = `
                     onBlur={[Function]}
                     onChangeText={[Function]}
                     onFocus={[Function]}
-                    placeholderTextColor="#686e7d"
+                    placeholderTextColor="#66676a"
                     style={
                       {
                         "backgroundColor": "inherit",
                         "borderColor": "transparent",
                         "borderWidth": 1,
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 16,
                         "fontWeight": "400",
@@ -413,8 +413,8 @@ exports[`SnapUIRenderer re-renders when the interface changes 1`] = `
                 style={
                   {
                     "alignItems": "center",
-                    "backgroundColor": "#3c4d9d0f",
-                    "borderColor": "#b7bbc866",
+                    "backgroundColor": "#b4b4b528",
+                    "borderColor": "#b4b4b566",
                     "borderRadius": 12,
                     "borderWidth": 1,
                     "flexDirection": "row",
@@ -446,13 +446,13 @@ exports[`SnapUIRenderer re-renders when the interface changes 1`] = `
                     onBlur={[Function]}
                     onChangeText={[Function]}
                     onFocus={[Function]}
-                    placeholderTextColor="#686e7d"
+                    placeholderTextColor="#66676a"
                     style={
                       {
                         "backgroundColor": "inherit",
                         "borderColor": "transparent",
                         "borderWidth": 1,
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 16,
                         "fontWeight": "400",
@@ -508,8 +508,8 @@ exports[`SnapUIRenderer re-renders when the interface changes 1`] = `
                 style={
                   {
                     "alignItems": "center",
-                    "backgroundColor": "#3c4d9d0f",
-                    "borderColor": "#b7bbc866",
+                    "backgroundColor": "#b4b4b528",
+                    "borderColor": "#b4b4b566",
                     "borderRadius": 12,
                     "borderWidth": 1,
                     "flexDirection": "row",
@@ -540,14 +540,14 @@ exports[`SnapUIRenderer re-renders when the interface changes 1`] = `
                     onBlur={[Function]}
                     onChangeText={[Function]}
                     onFocus={[Function]}
-                    placeholderTextColor="#686e7d"
+                    placeholderTextColor="#66676a"
                     secureTextEntry={true}
                     style={
                       {
                         "backgroundColor": "inherit",
                         "borderColor": "transparent",
                         "borderWidth": 1,
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 16,
                         "fontWeight": "400",
@@ -668,8 +668,8 @@ exports[`SnapUIRenderer re-syncs state when the interface changes 1`] = `
                 style={
                   {
                     "alignItems": "center",
-                    "backgroundColor": "#3c4d9d0f",
-                    "borderColor": "#b7bbc866",
+                    "backgroundColor": "#b4b4b528",
+                    "borderColor": "#b4b4b566",
                     "borderRadius": 12,
                     "borderWidth": 1,
                     "flexDirection": "row",
@@ -700,13 +700,13 @@ exports[`SnapUIRenderer re-syncs state when the interface changes 1`] = `
                     onBlur={[Function]}
                     onChangeText={[Function]}
                     onFocus={[Function]}
-                    placeholderTextColor="#686e7d"
+                    placeholderTextColor="#66676a"
                     style={
                       {
                         "backgroundColor": "inherit",
                         "borderColor": "transparent",
                         "borderWidth": 1,
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 16,
                         "fontWeight": "400",
@@ -762,8 +762,8 @@ exports[`SnapUIRenderer re-syncs state when the interface changes 1`] = `
                 style={
                   {
                     "alignItems": "center",
-                    "backgroundColor": "#3c4d9d0f",
-                    "borderColor": "#b7bbc866",
+                    "backgroundColor": "#b4b4b528",
+                    "borderColor": "#b4b4b566",
                     "borderRadius": 12,
                     "borderWidth": 1,
                     "flexDirection": "row",
@@ -794,13 +794,13 @@ exports[`SnapUIRenderer re-syncs state when the interface changes 1`] = `
                     onBlur={[Function]}
                     onChangeText={[Function]}
                     onFocus={[Function]}
-                    placeholderTextColor="#686e7d"
+                    placeholderTextColor="#66676a"
                     style={
                       {
                         "backgroundColor": "inherit",
                         "borderColor": "transparent",
                         "borderWidth": 1,
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 16,
                         "fontWeight": "400",
@@ -884,7 +884,7 @@ exports[`SnapUIRenderer renders basic UI 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "fontWeight": "400",
@@ -898,7 +898,7 @@ exports[`SnapUIRenderer renders basic UI 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "fontWeight": "400",
@@ -977,7 +977,7 @@ exports[`SnapUIRenderer renders complex nested components 1`] = `
             }
           >
             <View
-              backgroundColor="#f3f5f9"
+              backgroundColor="#f3f3f4"
               borderRadius={8}
               color="Default"
               flexDirection="column"
@@ -987,7 +987,7 @@ exports[`SnapUIRenderer renders complex nested components 1`] = `
               style={
                 [
                   {
-                    "backgroundColor": "#f3f5f9",
+                    "backgroundColor": "#f3f3f4",
                     "color": "Default",
                     "flexDirection": "column",
                     "gap": 8,
@@ -1037,7 +1037,7 @@ exports[`SnapUIRenderer renders complex nested components 1`] = `
                     accessibilityRole="text"
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Medium",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -1071,7 +1071,7 @@ exports[`SnapUIRenderer renders complex nested components 1`] = `
                       accessibilityRole="text"
                       style={
                         {
-                          "color": "#b7bbc8",
+                          "color": "#babbbe",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -1085,7 +1085,7 @@ exports[`SnapUIRenderer renders complex nested components 1`] = `
                       accessibilityRole="text"
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -1200,7 +1200,7 @@ exports[`SnapUIRenderer renders complex nested components 1`] = `
                       ellipsizeMode="tail"
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Medium",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -1215,7 +1215,7 @@ exports[`SnapUIRenderer renders complex nested components 1`] = `
                       ellipsizeMode="tail"
                       style={
                         {
-                          "color": "#686e7d",
+                          "color": "#66676a",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -1243,7 +1243,7 @@ exports[`SnapUIRenderer renders complex nested components 1`] = `
                     ellipsizeMode="tail"
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Medium",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -1259,7 +1259,7 @@ exports[`SnapUIRenderer renders complex nested components 1`] = `
                     ellipsizeMode="tail"
                     style={
                       {
-                        "color": "#686e7d",
+                        "color": "#66676a",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -1310,7 +1310,7 @@ exports[`SnapUIRenderer renders complex nested components 1`] = `
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -1328,7 +1328,7 @@ exports[`SnapUIRenderer renders complex nested components 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Medium",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -1351,7 +1351,7 @@ exports[`SnapUIRenderer renders complex nested components 1`] = `
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "flex": 1,
             "flexDirection": "row",
@@ -1391,7 +1391,7 @@ exports[`SnapUIRenderer renders complex nested components 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -1499,7 +1499,7 @@ exports[`SnapUIRenderer renders footers 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "fontWeight": "400",
@@ -1513,7 +1513,7 @@ exports[`SnapUIRenderer renders footers 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "fontWeight": "400",
@@ -1563,7 +1563,7 @@ exports[`SnapUIRenderer renders footers 1`] = `
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -1581,7 +1581,7 @@ exports[`SnapUIRenderer renders footers 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Medium",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -1604,7 +1604,7 @@ exports[`SnapUIRenderer renders footers 1`] = `
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "flex": 1,
             "flexDirection": "row",
@@ -1644,7 +1644,7 @@ exports[`SnapUIRenderer renders footers 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -1784,7 +1784,7 @@ exports[`SnapUIRenderer supports fields with multiple components 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Medium",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -1828,8 +1828,8 @@ exports[`SnapUIRenderer supports fields with multiple components 1`] = `
                   style={
                     {
                       "alignItems": "center",
-                      "backgroundColor": "#3c4d9d0f",
-                      "borderColor": "#b7bbc866",
+                      "backgroundColor": "#b4b4b528",
+                      "borderColor": "#b4b4b566",
                       "borderRadius": 12,
                       "borderWidth": 1,
                       "flexDirection": "row",
@@ -1948,13 +1948,13 @@ exports[`SnapUIRenderer supports fields with multiple components 1`] = `
                       onBlur={[Function]}
                       onChangeText={[Function]}
                       onFocus={[Function]}
-                      placeholderTextColor="#686e7d"
+                      placeholderTextColor="#66676a"
                       style={
                         {
                           "backgroundColor": "inherit",
                           "borderColor": "transparent",
                           "borderWidth": 1,
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "fontWeight": "400",
@@ -2113,8 +2113,8 @@ exports[`SnapUIRenderer supports interactive inputs 1`] = `
                 style={
                   {
                     "alignItems": "center",
-                    "backgroundColor": "#3c4d9d0f",
-                    "borderColor": "#b7bbc866",
+                    "backgroundColor": "#b4b4b528",
+                    "borderColor": "#b4b4b566",
                     "borderRadius": 12,
                     "borderWidth": 1,
                     "flexDirection": "row",
@@ -2145,13 +2145,13 @@ exports[`SnapUIRenderer supports interactive inputs 1`] = `
                     onBlur={[Function]}
                     onChangeText={[Function]}
                     onFocus={[Function]}
-                    placeholderTextColor="#686e7d"
+                    placeholderTextColor="#66676a"
                     style={
                       {
                         "backgroundColor": "inherit",
                         "borderColor": "transparent",
                         "borderWidth": 1,
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 16,
                         "fontWeight": "400",
@@ -2235,7 +2235,7 @@ exports[`SnapUIRenderer supports the onCancel prop 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "fontWeight": "400",
@@ -2249,7 +2249,7 @@ exports[`SnapUIRenderer supports the onCancel prop 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "fontWeight": "400",
@@ -2299,7 +2299,7 @@ exports[`SnapUIRenderer supports the onCancel prop 1`] = `
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -2317,7 +2317,7 @@ exports[`SnapUIRenderer supports the onCancel prop 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Medium",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -2340,7 +2340,7 @@ exports[`SnapUIRenderer supports the onCancel prop 1`] = `
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "flex": 1,
             "flexDirection": "row",
@@ -2380,7 +2380,7 @@ exports[`SnapUIRenderer supports the onCancel prop 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
diff --git a/app/components/Snaps/SnapUIRenderer/components/__snapshots__/account-selector.test.ts.snap b/app/components/Snaps/SnapUIRenderer/components/__snapshots__/account-selector.test.ts.snap
index fc3a1e76757f..6cb5e675da52 100644
--- a/app/components/Snaps/SnapUIRenderer/components/__snapshots__/account-selector.test.ts.snap
+++ b/app/components/Snaps/SnapUIRenderer/components/__snapshots__/account-selector.test.ts.snap
@@ -75,7 +75,7 @@ exports[`SnapUIAccountSelector renders an account selector 1`] = `
                     "alignItems": "center",
                     "alignSelf": "stretch",
                     "backgroundColor": "#ffffff",
-                    "borderColor": "#b7bbc866",
+                    "borderColor": "#b4b4b566",
                     "borderRadius": 8,
                     "borderWidth": 1,
                     "flexDirection": "row",
@@ -94,7 +94,7 @@ exports[`SnapUIAccountSelector renders an account selector 1`] = `
                 testID="snap-ui-renderer__selector"
               >
                 <SvgMock
-                  color="#121314"
+                  color="#131416"
                   fill="currentColor"
                   height={16}
                   name="ArrowDown"
@@ -190,7 +190,7 @@ exports[`SnapUIAccountSelector renders inside a field 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Medium",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -212,7 +212,7 @@ exports[`SnapUIAccountSelector renders inside a field 1`] = `
                     "alignItems": "center",
                     "alignSelf": "stretch",
                     "backgroundColor": "#ffffff",
-                    "borderColor": "#b7bbc866",
+                    "borderColor": "#b4b4b566",
                     "borderRadius": 8,
                     "borderWidth": 1,
                     "flexDirection": "row",
@@ -231,7 +231,7 @@ exports[`SnapUIAccountSelector renders inside a field 1`] = `
                 testID="snap-ui-renderer__selector"
               >
                 <SvgMock
-                  color="#121314"
+                  color="#131416"
                   fill="currentColor"
                   height={16}
                   name="ArrowDown"
diff --git a/app/components/Snaps/SnapUIRenderer/components/__snapshots__/address.test.ts.snap b/app/components/Snaps/SnapUIRenderer/components/__snapshots__/address.test.ts.snap
index ea026da5af17..088a1da75a8d 100644
--- a/app/components/Snaps/SnapUIRenderer/components/__snapshots__/address.test.ts.snap
+++ b/app/components/Snaps/SnapUIRenderer/components/__snapshots__/address.test.ts.snap
@@ -73,7 +73,7 @@ exports[`SnapUIAddress renders Bitcoin address 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -177,7 +177,7 @@ exports[`SnapUIAddress renders Bitcoin address with blockie 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -272,7 +272,7 @@ exports[`SnapUIAddress renders Cosmos address 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -376,7 +376,7 @@ exports[`SnapUIAddress renders Cosmos address with blockie 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -471,7 +471,7 @@ exports[`SnapUIAddress renders Ethereum address 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -575,7 +575,7 @@ exports[`SnapUIAddress renders Ethereum address with blockie 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -670,7 +670,7 @@ exports[`SnapUIAddress renders Hedera address 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -774,7 +774,7 @@ exports[`SnapUIAddress renders Hedera address with blockie 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -869,7 +869,7 @@ exports[`SnapUIAddress renders Polkadot address 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -973,7 +973,7 @@ exports[`SnapUIAddress renders Polkadot address with blockie 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -1068,7 +1068,7 @@ exports[`SnapUIAddress renders Starknet address 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -1172,7 +1172,7 @@ exports[`SnapUIAddress renders Starknet address with blockie 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -1267,7 +1267,7 @@ exports[`SnapUIAddress renders legacy Ethereum address 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
diff --git a/app/components/Snaps/SnapUIRenderer/components/__snapshots__/asset-selector.test.ts.snap b/app/components/Snaps/SnapUIRenderer/components/__snapshots__/asset-selector.test.ts.snap
index 3c7f8357b457..fa45132dca16 100644
--- a/app/components/Snaps/SnapUIRenderer/components/__snapshots__/asset-selector.test.ts.snap
+++ b/app/components/Snaps/SnapUIRenderer/components/__snapshots__/asset-selector.test.ts.snap
@@ -75,7 +75,7 @@ exports[`SnapUIAssetSelector should render 1`] = `
                     "alignItems": "center",
                     "alignSelf": "stretch",
                     "backgroundColor": "#ffffff",
-                    "borderColor": "#b7bbc866",
+                    "borderColor": "#b4b4b566",
                     "borderRadius": 8,
                     "borderWidth": 1,
                     "flexDirection": "row",
@@ -263,7 +263,7 @@ exports[`SnapUIAssetSelector should render 1`] = `
                       numberOfLines={1}
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Medium",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -279,7 +279,7 @@ exports[`SnapUIAssetSelector should render 1`] = `
                       numberOfLines={1}
                       style={
                         {
-                          "color": "#686e7d",
+                          "color": "#66676a",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 14,
                           "letterSpacing": 0,
@@ -310,7 +310,7 @@ exports[`SnapUIAssetSelector should render 1`] = `
                       accessibilityRole="text"
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Medium",
                           "fontSize": 14,
                           "letterSpacing": 0,
@@ -326,7 +326,7 @@ exports[`SnapUIAssetSelector should render 1`] = `
                       accessibilityRole="text"
                       style={
                         {
-                          "color": "#686e7d",
+                          "color": "#66676a",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 14,
                           "letterSpacing": 0,
@@ -339,7 +339,7 @@ exports[`SnapUIAssetSelector should render 1`] = `
                   </View>
                 </View>
                 <SvgMock
-                  color="#121314"
+                  color="#131416"
                   fill="currentColor"
                   height={16}
                   name="ArrowDown"
diff --git a/app/components/Snaps/SnapUIRenderer/components/__snapshots__/date-time-picker.test.tsx.snap b/app/components/Snaps/SnapUIRenderer/components/__snapshots__/date-time-picker.test.tsx.snap
index 064a540f7541..26e10e36b3cb 100644
--- a/app/components/Snaps/SnapUIRenderer/components/__snapshots__/date-time-picker.test.tsx.snap
+++ b/app/components/Snaps/SnapUIRenderer/components/__snapshots__/date-time-picker.test.tsx.snap
@@ -68,7 +68,7 @@ exports[`SnapUIDateTimePicker can show an error 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Medium",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -112,8 +112,8 @@ exports[`SnapUIDateTimePicker can show an error 1`] = `
                 style={
                   {
                     "alignItems": "center",
-                    "backgroundColor": "#3c4d9d0f",
-                    "borderColor": "#b7bbc866",
+                    "backgroundColor": "#b4b4b528",
+                    "borderColor": "#b4b4b566",
                     "borderRadius": 12,
                     "borderWidth": 1,
                     "flexDirection": "row",
@@ -143,7 +143,7 @@ exports[`SnapUIDateTimePicker can show an error 1`] = `
                       editable={true}
                       onBlur={[Function]}
                       onFocus={[Function]}
-                      placeholderTextColor="#686e7d"
+                      placeholderTextColor="#66676a"
                       pointerEvents="none"
                       readOnly={true}
                       style={
@@ -151,7 +151,7 @@ exports[`SnapUIDateTimePicker can show an error 1`] = `
                           "backgroundColor": "#ffffff",
                           "borderColor": "transparent",
                           "borderWidth": 1,
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "fontWeight": "400",
@@ -290,8 +290,8 @@ exports[`SnapUIDateTimePicker renders a date picker 1`] = `
                 style={
                   {
                     "alignItems": "center",
-                    "backgroundColor": "#3c4d9d0f",
-                    "borderColor": "#b7bbc866",
+                    "backgroundColor": "#b4b4b528",
+                    "borderColor": "#b4b4b566",
                     "borderRadius": 12,
                     "borderWidth": 1,
                     "flexDirection": "row",
@@ -321,7 +321,7 @@ exports[`SnapUIDateTimePicker renders a date picker 1`] = `
                       editable={true}
                       onBlur={[Function]}
                       onFocus={[Function]}
-                      placeholderTextColor="#686e7d"
+                      placeholderTextColor="#66676a"
                       pointerEvents="none"
                       readOnly={true}
                       style={
@@ -329,7 +329,7 @@ exports[`SnapUIDateTimePicker renders a date picker 1`] = `
                           "backgroundColor": "#ffffff",
                           "borderColor": "transparent",
                           "borderWidth": 1,
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "fontWeight": "400",
@@ -453,8 +453,8 @@ exports[`SnapUIDateTimePicker renders a date time picker 1`] = `
                 style={
                   {
                     "alignItems": "center",
-                    "backgroundColor": "#3c4d9d0f",
-                    "borderColor": "#b7bbc866",
+                    "backgroundColor": "#b4b4b528",
+                    "borderColor": "#b4b4b566",
                     "borderRadius": 12,
                     "borderWidth": 1,
                     "flexDirection": "row",
@@ -484,7 +484,7 @@ exports[`SnapUIDateTimePicker renders a date time picker 1`] = `
                       editable={true}
                       onBlur={[Function]}
                       onFocus={[Function]}
-                      placeholderTextColor="#686e7d"
+                      placeholderTextColor="#66676a"
                       pointerEvents="none"
                       readOnly={true}
                       style={
@@ -492,7 +492,7 @@ exports[`SnapUIDateTimePicker renders a date time picker 1`] = `
                           "backgroundColor": "#ffffff",
                           "borderColor": "transparent",
                           "borderWidth": 1,
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "fontWeight": "400",
@@ -616,8 +616,8 @@ exports[`SnapUIDateTimePicker renders a time picker 1`] = `
                 style={
                   {
                     "alignItems": "center",
-                    "backgroundColor": "#3c4d9d0f",
-                    "borderColor": "#b7bbc866",
+                    "backgroundColor": "#b4b4b528",
+                    "borderColor": "#b4b4b566",
                     "borderRadius": 12,
                     "borderWidth": 1,
                     "flexDirection": "row",
@@ -647,7 +647,7 @@ exports[`SnapUIDateTimePicker renders a time picker 1`] = `
                       editable={true}
                       onBlur={[Function]}
                       onFocus={[Function]}
-                      placeholderTextColor="#686e7d"
+                      placeholderTextColor="#66676a"
                       pointerEvents="none"
                       readOnly={true}
                       style={
@@ -655,7 +655,7 @@ exports[`SnapUIDateTimePicker renders a time picker 1`] = `
                           "backgroundColor": "#ffffff",
                           "borderColor": "transparent",
                           "borderWidth": 1,
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "fontWeight": "400",
@@ -750,7 +750,7 @@ exports[`SnapUIDateTimePicker renders inside a field 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Medium",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -794,8 +794,8 @@ exports[`SnapUIDateTimePicker renders inside a field 1`] = `
                 style={
                   {
                     "alignItems": "center",
-                    "backgroundColor": "#3c4d9d0f",
-                    "borderColor": "#b7bbc866",
+                    "backgroundColor": "#b4b4b528",
+                    "borderColor": "#b4b4b566",
                     "borderRadius": 12,
                     "borderWidth": 1,
                     "flexDirection": "row",
@@ -825,7 +825,7 @@ exports[`SnapUIDateTimePicker renders inside a field 1`] = `
                       editable={true}
                       onBlur={[Function]}
                       onFocus={[Function]}
-                      placeholderTextColor="#686e7d"
+                      placeholderTextColor="#66676a"
                       pointerEvents="none"
                       readOnly={true}
                       style={
@@ -833,7 +833,7 @@ exports[`SnapUIDateTimePicker renders inside a field 1`] = `
                           "backgroundColor": "#ffffff",
                           "borderColor": "transparent",
                           "borderWidth": 1,
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "fontWeight": "400",
diff --git a/app/components/Snaps/SnapUIRenderer/components/__snapshots__/form.test.ts.snap b/app/components/Snaps/SnapUIRenderer/components/__snapshots__/form.test.ts.snap
index b77ad52ccd7c..37f69a42a683 100644
--- a/app/components/Snaps/SnapUIRenderer/components/__snapshots__/form.test.ts.snap
+++ b/app/components/Snaps/SnapUIRenderer/components/__snapshots__/form.test.ts.snap
@@ -107,8 +107,8 @@ exports[`SnapUIForm will render 1`] = `
                   style={
                     {
                       "alignItems": "center",
-                      "backgroundColor": "#3c4d9d0f",
-                      "borderColor": "#b7bbc866",
+                      "backgroundColor": "#b4b4b528",
+                      "borderColor": "#b4b4b566",
                       "borderRadius": 12,
                       "borderWidth": 1,
                       "flexDirection": "row",
@@ -139,13 +139,13 @@ exports[`SnapUIForm will render 1`] = `
                       onBlur={[Function]}
                       onChangeText={[Function]}
                       onFocus={[Function]}
-                      placeholderTextColor="#686e7d"
+                      placeholderTextColor="#66676a"
                       style={
                         {
                           "backgroundColor": "inherit",
                           "borderColor": "transparent",
                           "borderWidth": 1,
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "fontWeight": "400",
@@ -283,7 +283,7 @@ exports[`SnapUIForm will render with fields 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Medium",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -327,8 +327,8 @@ exports[`SnapUIForm will render with fields 1`] = `
                   style={
                     {
                       "alignItems": "center",
-                      "backgroundColor": "#3c4d9d0f",
-                      "borderColor": "#b7bbc866",
+                      "backgroundColor": "#b4b4b528",
+                      "borderColor": "#b4b4b566",
                       "borderRadius": 12,
                       "borderWidth": 1,
                       "flexDirection": "row",
@@ -359,13 +359,13 @@ exports[`SnapUIForm will render with fields 1`] = `
                       onBlur={[Function]}
                       onChangeText={[Function]}
                       onFocus={[Function]}
-                      placeholderTextColor="#686e7d"
+                      placeholderTextColor="#66676a"
                       style={
                         {
                           "backgroundColor": "inherit",
                           "borderColor": "transparent",
                           "borderWidth": 1,
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "fontWeight": "400",
@@ -399,7 +399,7 @@ exports[`SnapUIForm will render with fields 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Medium",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -465,7 +465,7 @@ exports[`SnapUIForm will render with fields 1`] = `
                       accessibilityRole="text"
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -491,7 +491,7 @@ exports[`SnapUIForm will render with fields 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Medium",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -521,7 +521,7 @@ exports[`SnapUIForm will render with fields 1`] = `
                       {
                         "alignItems": "center",
                         "backgroundColor": "#ffffff",
-                        "borderColor": "#b7bbc8",
+                        "borderColor": "#949596",
                         "borderRadius": 99,
                         "borderWidth": 2,
                         "height": 20,
@@ -541,7 +541,7 @@ exports[`SnapUIForm will render with fields 1`] = `
                       accessibilityRole="text"
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -604,7 +604,7 @@ exports[`SnapUIForm will render with fields 1`] = `
                       accessibilityRole="text"
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -632,7 +632,7 @@ exports[`SnapUIForm will render with fields 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Medium",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -653,7 +653,7 @@ exports[`SnapUIForm will render with fields 1`] = `
                       "alignItems": "center",
                       "alignSelf": "stretch",
                       "backgroundColor": "#ffffff",
-                      "borderColor": "#b7bbc866",
+                      "borderColor": "#b4b4b566",
                       "borderRadius": 8,
                       "borderWidth": 1,
                       "flexDirection": "row",
@@ -722,7 +722,7 @@ exports[`SnapUIForm will render with fields 1`] = `
                           ellipsizeMode="tail"
                           style={
                             {
-                              "color": "#121314",
+                              "color": "#131416",
                               "fontFamily": "Geist-Medium",
                               "fontSize": 16,
                               "letterSpacing": 0,
@@ -750,7 +750,7 @@ exports[`SnapUIForm will render with fields 1`] = `
                         ellipsizeMode="tail"
                         style={
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "fontFamily": "Geist-Medium",
                             "fontSize": 16,
                             "letterSpacing": 0,
@@ -762,7 +762,7 @@ exports[`SnapUIForm will render with fields 1`] = `
                     </View>
                   </View>
                   <SvgMock
-                    color="#121314"
+                    color="#131416"
                     fill="currentColor"
                     height={16}
                     name="ArrowDown"
@@ -829,7 +829,7 @@ exports[`SnapUIForm will render with fields 1`] = `
                     onStartShouldSetResponder={[Function]}
                     style={
                       {
-                        "backgroundColor": "#3f434a66",
+                        "backgroundColor": "#0a0d135c",
                         "bottom": 0,
                         "height": 1334,
                         "left": 0,
@@ -968,25 +968,25 @@ exports[`SnapUIForm will render with fields 1`] = `
                                   {
                                     "alignItems": "center",
                                     "borderRadius": 8,
-                                    "height": 32,
+                                    "height": 28,
                                     "justifyContent": "center",
                                     "opacity": 1,
-                                    "width": 32,
+                                    "width": 28,
                                   }
                                 }
                               >
                                 <SvgMock
-                                  color="#121314"
+                                  color="#131416"
                                   fill="currentColor"
-                                  height={24}
+                                  height={20}
                                   name="ArrowLeft"
                                   style={
                                     {
-                                      "height": 24,
-                                      "width": 24,
+                                      "height": 20,
+                                      "width": 20,
                                     }
                                   }
-                                  width={24}
+                                  width={20}
                                 />
                               </TouchableOpacity>
                             </View>
@@ -1010,7 +1010,7 @@ exports[`SnapUIForm will render with fields 1`] = `
                               style={
                                 [
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Bold",
                                     "fontSize": 16,
                                     "fontWeight": 700,
@@ -1129,7 +1129,7 @@ exports[`SnapUIForm will render with fields 1`] = `
                                         ellipsizeMode="tail"
                                         style={
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Medium",
                                             "fontSize": 16,
                                             "letterSpacing": 0,
@@ -1157,7 +1157,7 @@ exports[`SnapUIForm will render with fields 1`] = `
                                       ellipsizeMode="tail"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Medium",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -1247,7 +1247,7 @@ exports[`SnapUIForm will render with fields 1`] = `
                                         ellipsizeMode="tail"
                                         style={
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Medium",
                                             "fontSize": 16,
                                             "letterSpacing": 0,
@@ -1275,7 +1275,7 @@ exports[`SnapUIForm will render with fields 1`] = `
                                       ellipsizeMode="tail"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Medium",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -1332,7 +1332,7 @@ exports[`SnapUIForm will render with fields 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Medium",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -1353,7 +1353,7 @@ exports[`SnapUIForm will render with fields 1`] = `
                       "alignItems": "center",
                       "alignSelf": "stretch",
                       "backgroundColor": "#ffffff",
-                      "borderColor": "#b7bbc866",
+                      "borderColor": "#b4b4b566",
                       "borderRadius": 8,
                       "borderWidth": 1,
                       "flexDirection": "row",
@@ -1422,7 +1422,7 @@ exports[`SnapUIForm will render with fields 1`] = `
                           ellipsizeMode="tail"
                           style={
                             {
-                              "color": "#121314",
+                              "color": "#131416",
                               "fontFamily": "Geist-Medium",
                               "fontSize": 16,
                               "letterSpacing": 0,
@@ -1437,7 +1437,7 @@ exports[`SnapUIForm will render with fields 1`] = `
                           ellipsizeMode="tail"
                           style={
                             {
-                              "color": "#686e7d",
+                              "color": "#66676a",
                               "fontFamily": "Geist-Regular",
                               "fontSize": 16,
                               "letterSpacing": 0,
@@ -1465,7 +1465,7 @@ exports[`SnapUIForm will render with fields 1`] = `
                         ellipsizeMode="tail"
                         style={
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "fontFamily": "Geist-Medium",
                             "fontSize": 16,
                             "letterSpacing": 0,
@@ -1481,7 +1481,7 @@ exports[`SnapUIForm will render with fields 1`] = `
                         ellipsizeMode="tail"
                         style={
                           {
-                            "color": "#686e7d",
+                            "color": "#66676a",
                             "fontFamily": "Geist-Regular",
                             "fontSize": 16,
                             "letterSpacing": 0,
@@ -1495,7 +1495,7 @@ exports[`SnapUIForm will render with fields 1`] = `
                     </View>
                   </View>
                   <SvgMock
-                    color="#121314"
+                    color="#131416"
                     fill="currentColor"
                     height={16}
                     name="ArrowDown"
@@ -1562,7 +1562,7 @@ exports[`SnapUIForm will render with fields 1`] = `
                     onStartShouldSetResponder={[Function]}
                     style={
                       {
-                        "backgroundColor": "#3f434a66",
+                        "backgroundColor": "#0a0d135c",
                         "bottom": 0,
                         "height": 1334,
                         "left": 0,
@@ -1701,25 +1701,25 @@ exports[`SnapUIForm will render with fields 1`] = `
                                   {
                                     "alignItems": "center",
                                     "borderRadius": 8,
-                                    "height": 32,
+                                    "height": 28,
                                     "justifyContent": "center",
                                     "opacity": 1,
-                                    "width": 32,
+                                    "width": 28,
                                   }
                                 }
                               >
                                 <SvgMock
-                                  color="#121314"
+                                  color="#131416"
                                   fill="currentColor"
-                                  height={24}
+                                  height={20}
                                   name="ArrowLeft"
                                   style={
                                     {
-                                      "height": 24,
-                                      "width": 24,
+                                      "height": 20,
+                                      "width": 20,
                                     }
                                   }
-                                  width={24}
+                                  width={20}
                                 />
                               </TouchableOpacity>
                             </View>
@@ -1743,7 +1743,7 @@ exports[`SnapUIForm will render with fields 1`] = `
                               style={
                                 [
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Bold",
                                     "fontSize": 16,
                                     "fontWeight": 700,
@@ -1861,7 +1861,7 @@ exports[`SnapUIForm will render with fields 1`] = `
                                         ellipsizeMode="tail"
                                         style={
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Medium",
                                             "fontSize": 16,
                                             "letterSpacing": 0,
@@ -1876,7 +1876,7 @@ exports[`SnapUIForm will render with fields 1`] = `
                                         ellipsizeMode="tail"
                                         style={
                                           {
-                                            "color": "#686e7d",
+                                            "color": "#66676a",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 16,
                                             "letterSpacing": 0,
@@ -1904,7 +1904,7 @@ exports[`SnapUIForm will render with fields 1`] = `
                                       ellipsizeMode="tail"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Medium",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -1920,7 +1920,7 @@ exports[`SnapUIForm will render with fields 1`] = `
                                       ellipsizeMode="tail"
                                       style={
                                         {
-                                          "color": "#686e7d",
+                                          "color": "#66676a",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -2011,7 +2011,7 @@ exports[`SnapUIForm will render with fields 1`] = `
                                         ellipsizeMode="tail"
                                         style={
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Medium",
                                             "fontSize": 16,
                                             "letterSpacing": 0,
@@ -2026,7 +2026,7 @@ exports[`SnapUIForm will render with fields 1`] = `
                                         ellipsizeMode="tail"
                                         style={
                                           {
-                                            "color": "#686e7d",
+                                            "color": "#66676a",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 16,
                                             "letterSpacing": 0,
@@ -2054,7 +2054,7 @@ exports[`SnapUIForm will render with fields 1`] = `
                                       ellipsizeMode="tail"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Medium",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -2070,7 +2070,7 @@ exports[`SnapUIForm will render with fields 1`] = `
                                       ellipsizeMode="tail"
                                       style={
                                         {
-                                          "color": "#686e7d",
+                                          "color": "#66676a",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
diff --git a/app/components/Snaps/SnapUIRenderer/components/__snapshots__/input.test.ts.snap b/app/components/Snaps/SnapUIRenderer/components/__snapshots__/input.test.ts.snap
index a530f11392f6..a78dedd35d01 100644
--- a/app/components/Snaps/SnapUIRenderer/components/__snapshots__/input.test.ts.snap
+++ b/app/components/Snaps/SnapUIRenderer/components/__snapshots__/input.test.ts.snap
@@ -94,8 +94,8 @@ exports[`SnapUIInput handles disabled input 1`] = `
                 style={
                   {
                     "alignItems": "center",
-                    "backgroundColor": "#3c4d9d0f",
-                    "borderColor": "#b7bbc866",
+                    "backgroundColor": "#b4b4b528",
+                    "borderColor": "#b4b4b566",
                     "borderRadius": 12,
                     "borderWidth": 1,
                     "flexDirection": "row",
@@ -126,13 +126,13 @@ exports[`SnapUIInput handles disabled input 1`] = `
                     onBlur={[Function]}
                     onChangeText={[Function]}
                     onFocus={[Function]}
-                    placeholderTextColor="#686e7d"
+                    placeholderTextColor="#66676a"
                     style={
                       {
                         "backgroundColor": "inherit",
                         "borderColor": "transparent",
                         "borderWidth": 1,
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 16,
                         "fontWeight": "400",
@@ -253,8 +253,8 @@ exports[`SnapUIInput renders with initial value 1`] = `
                 style={
                   {
                     "alignItems": "center",
-                    "backgroundColor": "#3c4d9d0f",
-                    "borderColor": "#b7bbc866",
+                    "backgroundColor": "#b4b4b528",
+                    "borderColor": "#b4b4b566",
                     "borderRadius": 12,
                     "borderWidth": 1,
                     "flexDirection": "row",
@@ -285,13 +285,13 @@ exports[`SnapUIInput renders with initial value 1`] = `
                     onBlur={[Function]}
                     onChangeText={[Function]}
                     onFocus={[Function]}
-                    placeholderTextColor="#686e7d"
+                    placeholderTextColor="#66676a"
                     style={
                       {
                         "backgroundColor": "inherit",
                         "borderColor": "transparent",
                         "borderWidth": 1,
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 16,
                         "fontWeight": "400",
diff --git a/app/components/Snaps/SnapUIRenderer/components/copyable.test.tsx b/app/components/Snaps/SnapUIRenderer/components/copyable.test.tsx
index 199cfe1daecb..27512f0fb49c 100644
--- a/app/components/Snaps/SnapUIRenderer/components/copyable.test.tsx
+++ b/app/components/Snaps/SnapUIRenderer/components/copyable.test.tsx
@@ -3,6 +3,7 @@
 import { fireEvent, waitFor } from '@testing-library/react-native';
 import ClipboardManager from '../../../../core/ClipboardManager';
 import { Copyable } from '@metamask/snaps-sdk/jsx';
+import { mockTheme } from '../../../../util/theme';
 import { renderInterface } from '../testUtils';
 import { copyable } from './copyable';
 
@@ -42,14 +43,6 @@ jest.mock('../../../../core/Engine/Engine', () => ({
 describe('SnapUICopyable', () => {
   // Tests for the factory function
   describe('copyable factory function', () => {
-    // Create a mock theme object
-    const mockTheme = {
-      colors: {
-        text: { default: '#000000' },
-        background: { default: '#FFFFFF' },
-      },
-    };
-
     // Create base params that match UIComponentParams interface
     const baseParams = {
       map: {},
diff --git a/app/components/Snaps/SnapUIRenderer/components/input.test.ts b/app/components/Snaps/SnapUIRenderer/components/input.test.ts
index 23e3e8c5161e..0c0fe4134d08 100644
--- a/app/components/Snaps/SnapUIRenderer/components/input.test.ts
+++ b/app/components/Snaps/SnapUIRenderer/components/input.test.ts
@@ -2,6 +2,7 @@ import { renderInterface } from '../testUtils';
 import { Input, Box, Form } from '@metamask/snaps-sdk/jsx';
 import { fireEvent } from '@testing-library/react-native';
 import { TEXTFIELD_TEST_ID } from '../../../../component-library/components/Form/TextField/TextField.constants';
+import { mockTheme } from '../../../../util/theme';
 
 jest.mock('../../../../core/Engine/Engine', () => ({
   controllerMessenger: {
@@ -15,8 +16,8 @@ jest.mock('../../../../core/Engine/Engine', () => ({
 }));
 
 describe('SnapUIInput', () => {
-  const clearBorderColor = '#b7bbc866';
-  const focusedBorderColor = '#b7bbc8';
+  const clearBorderColor = mockTheme.colors.border.muted;
+  const focusedBorderColor = mockTheme.colors.border.default;
 
   beforeEach(() => {
     jest.resetAllMocks();
diff --git a/app/components/Snaps/SnapUIRenderer/components/link.test.ts b/app/components/Snaps/SnapUIRenderer/components/link.test.ts
index 399d101d0f38..dcf0fc7c379b 100644
--- a/app/components/Snaps/SnapUIRenderer/components/link.test.ts
+++ b/app/components/Snaps/SnapUIRenderer/components/link.test.ts
@@ -30,7 +30,7 @@ describe('link component', () => {
           children: 'link',
           key: expect.any(String),
           props: {
-            color: '#4459ff',
+            color: mockTheme.colors.info.default,
             style: {
               fontWeight: undefined,
               textAlign: undefined,
@@ -75,7 +75,7 @@ describe('link component', () => {
           children: 'Visit ',
           key: expect.any(String),
           props: {
-            color: '#4459ff',
+            color: mockTheme.colors.info.default,
             style: {
               fontWeight: undefined,
               textAlign: undefined,
@@ -120,7 +120,7 @@ describe('link component', () => {
           children: 'Visit ',
           key: expect.any(String),
           props: {
-            color: '#4459ff',
+            color: mockTheme.colors.info.default,
             style: {
               fontWeight: undefined,
               textAlign: undefined,
@@ -133,7 +133,7 @@ describe('link component', () => {
           children: 'MetaMask',
           key: expect.any(String),
           props: {
-            color: '#4459ff',
+            color: mockTheme.colors.info.default,
             style: {
               fontWeight: undefined,
               textAlign: undefined,
diff --git a/app/components/Snaps/SnapUISpinner/SnapUISpinner.test.tsx b/app/components/Snaps/SnapUISpinner/SnapUISpinner.test.tsx
index 2dde7401c07f..48317692430b 100644
--- a/app/components/Snaps/SnapUISpinner/SnapUISpinner.test.tsx
+++ b/app/components/Snaps/SnapUISpinner/SnapUISpinner.test.tsx
@@ -2,14 +2,14 @@ import React from 'react';
 import { ActivityIndicator } from 'react-native';
 import { render } from '@testing-library/react-native';
 import { SnapUISpinner } from './SnapUISpinner';
-import { lightTheme } from '@metamask/design-tokens';
 
 const mockUseTheme = jest.fn();
 jest.mock('../../../util/theme', () => ({
   useTheme: () => mockUseTheme(),
 }));
 
-const mockColor = lightTheme.colors.primary.default;
+const { mockTheme } = jest.requireActual('../../../util/theme');
+const mockColor = mockTheme.colors.primary.default;
 
 describe('SnapUISpinner', () => {
   beforeEach(() => {
diff --git a/app/components/UI/AccountApproval/__snapshots__/index.test.tsx.snap b/app/components/UI/AccountApproval/__snapshots__/index.test.tsx.snap
index 143373cd5b7e..a8c533c0feb8 100644
--- a/app/components/UI/AccountApproval/__snapshots__/index.test.tsx.snap
+++ b/app/components/UI/AccountApproval/__snapshots__/index.test.tsx.snap
@@ -34,7 +34,7 @@ exports[`AccountApproval renders correctly 1`] = `
       <View
         placeholderStyle={
           {
-            "backgroundColor": "#f3f5f9",
+            "backgroundColor": "#f3f3f4",
           }
         }
         useNativeDriver={true}
@@ -80,7 +80,7 @@ exports[`AccountApproval renders correctly 1`] = `
                   "backgroundColor": "#eee",
                 },
                 {
-                  "backgroundColor": "#f3f5f9",
+                  "backgroundColor": "#f3f3f4",
                 },
               ]
             }
@@ -109,7 +109,7 @@ exports[`AccountApproval renders correctly 1`] = `
               "fontSize": 15,
             },
             {
-              "color": "#121314",
+              "color": "#131416",
               "marginRight": 5,
             },
             {
@@ -126,7 +126,7 @@ exports[`AccountApproval renders correctly 1`] = `
       <Text
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Bold",
             "fontSize": 14,
             "textAlign": "center",
@@ -160,7 +160,7 @@ exports[`AccountApproval renders correctly 1`] = `
       <Text
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 12,
             "padding": 5,
@@ -177,9 +177,9 @@ exports[`AccountApproval renders correctly 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Bold",
-        "fontSize": 18,
+        "fontSize": 20,
         "fontWeight": "700",
         "letterSpacing": 0,
         "lineHeight": 24,
@@ -195,7 +195,7 @@ exports[`AccountApproval renders correctly 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "fontWeight": "400",
@@ -246,7 +246,7 @@ exports[`AccountApproval renders correctly 1`] = `
             },
             {
               "backgroundColor": "#ffffff",
-              "borderColor": "#686e7d",
+              "borderColor": "#66676a",
               "borderWidth": 1,
             },
             [
@@ -280,7 +280,7 @@ exports[`AccountApproval renders correctly 1`] = `
                 "textAlign": "center",
               },
               {
-                "color": "#686e7d",
+                "color": "#66676a",
               },
               undefined,
             ],
diff --git a/app/components/UI/AccountFromToInfoCard/__snapshots__/AccountFromToInfoCard.test.tsx.snap b/app/components/UI/AccountFromToInfoCard/__snapshots__/AccountFromToInfoCard.test.tsx.snap
index 3f6ff9d08b1c..4c32ed25fa09 100644
--- a/app/components/UI/AccountFromToInfoCard/__snapshots__/AccountFromToInfoCard.test.tsx.snap
+++ b/app/components/UI/AccountFromToInfoCard/__snapshots__/AccountFromToInfoCard.test.tsx.snap
@@ -23,7 +23,7 @@ exports[`AccountFromToInfoCard should match snapshot 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -38,7 +38,7 @@ exports[`AccountFromToInfoCard should match snapshot 1`] = `
       style={
         {
           "backgroundColor": "#ffffff",
-          "borderColor": "#b7bbc8",
+          "borderColor": "#949596",
           "borderRadius": 4,
           "borderWidth": 1,
           "flexDirection": "row",
@@ -185,7 +185,7 @@ exports[`AccountFromToInfoCard should match snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 14,
                   "letterSpacing": 0,
@@ -208,7 +208,7 @@ exports[`AccountFromToInfoCard should match snapshot 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Bold",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -226,7 +226,7 @@ exports[`AccountFromToInfoCard should match snapshot 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 14,
                 "letterSpacing": 0,
@@ -241,7 +241,7 @@ exports[`AccountFromToInfoCard should match snapshot 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -282,7 +282,7 @@ exports[`AccountFromToInfoCard should match snapshot 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -307,7 +307,7 @@ exports[`AccountFromToInfoCard should match snapshot 1`] = `
             "paddingHorizontal": 10,
           },
           {
-            "borderColor": "#b7bbc8",
+            "borderColor": "#949596",
           },
         ]
       }
@@ -325,7 +325,7 @@ exports[`AccountFromToInfoCard should match snapshot 1`] = `
         <View
           placeholderStyle={
             {
-              "backgroundColor": "#f3f5f9",
+              "backgroundColor": "#f3f3f4",
             }
           }
           useNativeDriver={true}
@@ -372,7 +372,7 @@ exports[`AccountFromToInfoCard should match snapshot 1`] = `
                     "backgroundColor": "#eee",
                   },
                   {
-                    "backgroundColor": "#f3f5f9",
+                    "backgroundColor": "#f3f3f4",
                   },
                 ]
               }
@@ -414,7 +414,7 @@ exports[`AccountFromToInfoCard should match snapshot 1`] = `
                 numberOfLines={1}
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 14,
                     "letterSpacing": 0,
@@ -437,7 +437,7 @@ exports[`AccountFromToInfoCard should match snapshot 1`] = `
                 numberOfLines={1}
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 12,
                     "letterSpacing": 0,
diff --git a/app/components/UI/AccountInfoCard/__snapshots__/index.test.tsx.snap b/app/components/UI/AccountInfoCard/__snapshots__/index.test.tsx.snap
index 736f57c3ac30..5628043a249d 100644
--- a/app/components/UI/AccountInfoCard/__snapshots__/index.test.tsx.snap
+++ b/app/components/UI/AccountInfoCard/__snapshots__/index.test.tsx.snap
@@ -5,7 +5,7 @@ exports[`AccountInfoCard should match snapshot 1`] = `
   style={
     {
       "alignItems": "center",
-      "borderColor": "#b7bbc8",
+      "borderColor": "#949596",
       "borderRadius": 10,
       "borderWidth": 1,
       "flexDirection": "row",
@@ -17,7 +17,7 @@ exports[`AccountInfoCard should match snapshot 1`] = `
   <View
     placeholderStyle={
       {
-        "backgroundColor": "#f3f5f9",
+        "backgroundColor": "#f3f3f4",
       }
     }
     useNativeDriver={true}
@@ -64,7 +64,7 @@ exports[`AccountInfoCard should match snapshot 1`] = `
               "backgroundColor": "#eee",
             },
             {
-              "backgroundColor": "#f3f5f9",
+              "backgroundColor": "#f3f3f4",
             },
           ]
         }
@@ -98,14 +98,14 @@ exports[`AccountInfoCard should match snapshot 1`] = `
         style={
           {
             "0": {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Bold",
               "fontSize": 16,
               "marginRight": 2,
               "maxWidth": "45%",
             },
             "1": undefined,
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -133,13 +133,13 @@ exports[`AccountInfoCard should match snapshot 1`] = `
         style={
           {
             "0": {
-              "color": "#121314",
+              "color": "#131416",
               "flexGrow": 1,
               "fontFamily": "Geist-Bold",
               "fontSize": 16,
             },
             "1": undefined,
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -167,12 +167,12 @@ exports[`AccountInfoCard should match snapshot 1`] = `
           {
             "0": {
               "alignSelf": "flex-start",
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 14,
             },
             "1": undefined,
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
diff --git a/app/components/UI/AccountOverview/__snapshots__/index.test.tsx.snap b/app/components/UI/AccountOverview/__snapshots__/index.test.tsx.snap
index d9e6a57d984c..a4336dd54c7c 100644
--- a/app/components/UI/AccountOverview/__snapshots__/index.test.tsx.snap
+++ b/app/components/UI/AccountOverview/__snapshots__/index.test.tsx.snap
@@ -46,7 +46,7 @@ exports[`AccountOverview matches snapshot when given account with address and la
           <View
             placeholderStyle={
               {
-                "backgroundColor": "#f3f5f9",
+                "backgroundColor": "#f3f3f4",
               }
             }
             useNativeDriver={true}
@@ -93,7 +93,7 @@ exports[`AccountOverview matches snapshot when given account with address and la
                       "backgroundColor": "#eee",
                     },
                     {
-                      "backgroundColor": "#f3f5f9",
+                      "backgroundColor": "#f3f3f4",
                     },
                   ]
                 }
@@ -126,7 +126,7 @@ exports[`AccountOverview matches snapshot when given account with address and la
                 style={
                   {
                     "0": {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 24,
                       "textAlign": "center",
@@ -141,7 +141,7 @@ exports[`AccountOverview matches snapshot when given account with address and la
                     "2": {
                       "borderColor": "#ffffff",
                     },
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -171,7 +171,7 @@ exports[`AccountOverview matches snapshot when given account with address and la
             numberOfLines={1}
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 12,
                 "letterSpacing": 0.8,
diff --git a/app/components/UI/ActionView/__snapshots__/index.test.tsx.snap b/app/components/UI/ActionView/__snapshots__/index.test.tsx.snap
index d9b4442d4908..f2191f8e4824 100644
--- a/app/components/UI/ActionView/__snapshots__/index.test.tsx.snap
+++ b/app/components/UI/ActionView/__snapshots__/index.test.tsx.snap
@@ -105,7 +105,7 @@ exports[`ActionView should render correctly 1`] = `
         {
           "alignItems": "center",
           "alignSelf": "flex-start",
-          "backgroundColor": "#3c4d9d0f",
+          "backgroundColor": "#b4b4b528",
           "borderColor": "transparent",
           "borderRadius": 12,
           "borderWidth": 1,
@@ -123,7 +123,7 @@ exports[`ActionView should render correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -146,7 +146,7 @@ exports[`ActionView should render correctly 1`] = `
         {
           "alignItems": "center",
           "alignSelf": "flex-start",
-          "backgroundColor": "#121314",
+          "backgroundColor": "#131416",
           "borderRadius": 12,
           "flex": 1,
           "flexDirection": "row",
diff --git a/app/components/UI/AddressInputs/__snapshots__/index.test.jsx.snap b/app/components/UI/AddressInputs/__snapshots__/index.test.jsx.snap
index 908837512691..967a886ecf9e 100644
--- a/app/components/UI/AddressInputs/__snapshots__/index.test.jsx.snap
+++ b/app/components/UI/AddressInputs/__snapshots__/index.test.jsx.snap
@@ -23,7 +23,7 @@ exports[`AddressInputs AddressFrom should match default snapshot 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -38,7 +38,7 @@ exports[`AddressInputs AddressFrom should match default snapshot 1`] = `
     style={
       [
         {
-          "borderColor": "#b7bbc8",
+          "borderColor": "#949596",
           "borderRadius": 8,
           "borderWidth": 1,
           "flex": 1,
@@ -49,7 +49,7 @@ exports[`AddressInputs AddressFrom should match default snapshot 1`] = `
           "padding": 10,
         },
         {
-          "borderColor": "#b7bbc8",
+          "borderColor": "#949596",
         },
       ]
     }
@@ -65,7 +65,7 @@ exports[`AddressInputs AddressFrom should match default snapshot 1`] = `
       <View
         placeholderStyle={
           {
-            "backgroundColor": "#f3f5f9",
+            "backgroundColor": "#f3f3f4",
           }
         }
         useNativeDriver={true}
@@ -112,7 +112,7 @@ exports[`AddressInputs AddressFrom should match default snapshot 1`] = `
                   "backgroundColor": "#eee",
                 },
                 {
-                  "backgroundColor": "#f3f5f9",
+                  "backgroundColor": "#f3f3f4",
                 },
               ]
             }
@@ -147,7 +147,7 @@ exports[`AddressInputs AddressFrom should match default snapshot 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 14,
               "letterSpacing": 0,
@@ -162,7 +162,7 @@ exports[`AddressInputs AddressFrom should match default snapshot 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 12,
             "letterSpacing": 0,
@@ -200,7 +200,7 @@ exports[`AddressInputs AddressFrom should match snapshot when layout is vertical
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -215,7 +215,7 @@ exports[`AddressInputs AddressFrom should match snapshot when layout is vertical
     style={
       [
         {
-          "borderColor": "#b7bbc8",
+          "borderColor": "#949596",
           "borderRadius": 8,
           "borderWidth": 1,
           "flex": 1,
@@ -226,7 +226,7 @@ exports[`AddressInputs AddressFrom should match snapshot when layout is vertical
           "padding": 10,
         },
         {
-          "borderColor": "#b7bbc8",
+          "borderColor": "#949596",
         },
       ]
     }
@@ -242,7 +242,7 @@ exports[`AddressInputs AddressFrom should match snapshot when layout is vertical
       <View
         placeholderStyle={
           {
-            "backgroundColor": "#f3f5f9",
+            "backgroundColor": "#f3f3f4",
           }
         }
         useNativeDriver={true}
@@ -289,7 +289,7 @@ exports[`AddressInputs AddressFrom should match snapshot when layout is vertical
                   "backgroundColor": "#eee",
                 },
                 {
-                  "backgroundColor": "#f3f5f9",
+                  "backgroundColor": "#f3f3f4",
                 },
               ]
             }
@@ -324,7 +324,7 @@ exports[`AddressInputs AddressFrom should match snapshot when layout is vertical
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 14,
               "letterSpacing": 0,
@@ -339,7 +339,7 @@ exports[`AddressInputs AddressFrom should match snapshot when layout is vertical
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 12,
             "letterSpacing": 0,
@@ -379,7 +379,7 @@ exports[`AddressInputs AddressTo should match default snapshot 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -404,7 +404,7 @@ exports[`AddressInputs AddressTo should match default snapshot 1`] = `
           "paddingHorizontal": 10,
         },
         {
-          "borderColor": "#b7bbc8",
+          "borderColor": "#949596",
         },
       ]
     }
@@ -427,7 +427,7 @@ exports[`AddressInputs AddressTo should match default snapshot 1`] = `
         <View
           placeholderStyle={
             {
-              "backgroundColor": "#f3f5f9",
+              "backgroundColor": "#f3f3f4",
             }
           }
           useNativeDriver={true}
@@ -474,7 +474,7 @@ exports[`AddressInputs AddressTo should match default snapshot 1`] = `
                     "backgroundColor": "#eee",
                   },
                   {
-                    "backgroundColor": "#f3f5f9",
+                    "backgroundColor": "#f3f3f4",
                   },
                 ]
               }
@@ -549,7 +549,7 @@ exports[`AddressInputs AddressTo should match default snapshot 1`] = `
                 numberOfLines={1}
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 14,
                     "letterSpacing": 0,
@@ -572,7 +572,7 @@ exports[`AddressInputs AddressTo should match default snapshot 1`] = `
                 numberOfLines={1}
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 12,
                     "letterSpacing": 0,
@@ -648,7 +648,7 @@ exports[`AddressInputs AddressTo should match snapshot when layout is vertical 1
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -673,7 +673,7 @@ exports[`AddressInputs AddressTo should match snapshot when layout is vertical 1
           "paddingHorizontal": 10,
         },
         {
-          "borderColor": "#b7bbc8",
+          "borderColor": "#949596",
         },
       ]
     }
@@ -696,7 +696,7 @@ exports[`AddressInputs AddressTo should match snapshot when layout is vertical 1
         <View
           placeholderStyle={
             {
-              "backgroundColor": "#f3f5f9",
+              "backgroundColor": "#f3f3f4",
             }
           }
           useNativeDriver={true}
@@ -743,7 +743,7 @@ exports[`AddressInputs AddressTo should match snapshot when layout is vertical 1
                     "backgroundColor": "#eee",
                   },
                   {
-                    "backgroundColor": "#f3f5f9",
+                    "backgroundColor": "#f3f3f4",
                   },
                 ]
               }
@@ -818,7 +818,7 @@ exports[`AddressInputs AddressTo should match snapshot when layout is vertical 1
                 numberOfLines={1}
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 14,
                     "letterSpacing": 0,
@@ -841,7 +841,7 @@ exports[`AddressInputs AddressTo should match snapshot when layout is vertical 1
                 numberOfLines={1}
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 12,
                     "letterSpacing": 0,
diff --git a/app/components/UI/AnimatedSpinner/__snapshots__/index.test.tsx.snap b/app/components/UI/AnimatedSpinner/__snapshots__/index.test.tsx.snap
index 996f3f22229f..ea854acd2b47 100644
--- a/app/components/UI/AnimatedSpinner/__snapshots__/index.test.tsx.snap
+++ b/app/components/UI/AnimatedSpinner/__snapshots__/index.test.tsx.snap
@@ -4,7 +4,7 @@ exports[`AnimatedSpinner should render correctly 1`] = `
 <View
   style={
     {
-      "borderColor": "#f3f5f9",
+      "borderColor": "#f3f3f4",
       "borderRadius": 64,
       "borderWidth": 3.5,
       "height": 36,
diff --git a/app/components/UI/ApprovalTagUrl/__snapshots__/ApprovalTagUrl.test.tsx.snap b/app/components/UI/ApprovalTagUrl/__snapshots__/ApprovalTagUrl.test.tsx.snap
index ecb055837e1e..016af3027dba 100644
--- a/app/components/UI/ApprovalTagUrl/__snapshots__/ApprovalTagUrl.test.tsx.snap
+++ b/app/components/UI/ApprovalTagUrl/__snapshots__/ApprovalTagUrl.test.tsx.snap
@@ -7,7 +7,7 @@ exports[`ApprovalTagUrl renders correctly 1`] = `
       "alignItems": "center",
       "alignSelf": "center",
       "backgroundColor": "#ffffff",
-      "borderColor": "#b7bbc8",
+      "borderColor": "#949596",
       "borderRadius": 99,
       "borderWidth": 1,
       "flexDirection": "row",
@@ -53,7 +53,7 @@ exports[`ApprovalTagUrl renders correctly 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#686e7d",
+        "color": "#66676a",
         "flexShrink": 1,
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
@@ -74,7 +74,7 @@ exports[`ApprovalTagUrl renders origin when only origin is provided 1`] = `
       "alignItems": "center",
       "alignSelf": "center",
       "backgroundColor": "#ffffff",
-      "borderColor": "#b7bbc8",
+      "borderColor": "#949596",
       "borderRadius": 99,
       "borderWidth": 1,
       "flexDirection": "row",
@@ -120,7 +120,7 @@ exports[`ApprovalTagUrl renders origin when only origin is provided 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#686e7d",
+        "color": "#66676a",
         "flexShrink": 1,
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
diff --git a/app/components/UI/AssetIcon/__snapshots__/index.test.tsx.snap b/app/components/UI/AssetIcon/__snapshots__/index.test.tsx.snap
index 6f0b9a602c59..1d7608d67192 100644
--- a/app/components/UI/AssetIcon/__snapshots__/index.test.tsx.snap
+++ b/app/components/UI/AssetIcon/__snapshots__/index.test.tsx.snap
@@ -4,7 +4,7 @@ exports[`AssetIcon should render correctly 1`] = `
 <View
   placeholderStyle={
     {
-      "backgroundColor": "#f3f5f9",
+      "backgroundColor": "#f3f3f4",
     }
   }
   useNativeDriver={true}
@@ -13,7 +13,7 @@ exports[`AssetIcon should render correctly 1`] = `
     fadeIn={true}
     placeholderStyle={
       {
-        "backgroundColor": "#f3f5f9",
+        "backgroundColor": "#f3f3f4",
       }
     }
     source={
@@ -59,7 +59,7 @@ exports[`AssetIcon should render correctly 1`] = `
             "backgroundColor": "#eee",
           },
           {
-            "backgroundColor": "#f3f5f9",
+            "backgroundColor": "#f3f3f4",
           },
         ]
       }
diff --git a/app/components/UI/AssetOverview/Balance/__snapshots__/index.test.tsx.snap b/app/components/UI/AssetOverview/Balance/__snapshots__/index.test.tsx.snap
index 600fd330f02c..fe8f79d1eaca 100644
--- a/app/components/UI/AssetOverview/Balance/__snapshots__/index.test.tsx.snap
+++ b/app/components/UI/AssetOverview/Balance/__snapshots__/index.test.tsx.snap
@@ -14,9 +14,9 @@ exports[`Balance should render correctly with main and secondary balance 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Bold",
-        "fontSize": 18,
+        "fontSize": 20,
         "letterSpacing": 0,
         "lineHeight": 24,
       }
@@ -180,7 +180,7 @@ exports[`Balance should render correctly with main and secondary balance 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -204,7 +204,7 @@ exports[`Balance should render correctly with main and secondary balance 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "fontFamily": "Geist-Regular",
               "fontSize": 14,
               "fontWeight": "400",
@@ -230,7 +230,7 @@ exports[`Balance should render correctly with main and secondary balance 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -260,9 +260,9 @@ exports[`Balance should render correctly without a secondary balance 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Bold",
-        "fontSize": 18,
+        "fontSize": 20,
         "letterSpacing": 0,
         "lineHeight": 24,
       }
@@ -426,7 +426,7 @@ exports[`Balance should render correctly without a secondary balance 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -459,7 +459,7 @@ exports[`Balance should render correctly without a secondary balance 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "letterSpacing": 0,
diff --git a/app/components/UI/AssetOverview/MarketClosedActionButton/__snapshots__/MarketClosedActionButton.test.tsx.snap b/app/components/UI/AssetOverview/MarketClosedActionButton/__snapshots__/MarketClosedActionButton.test.tsx.snap
index 215adbe94714..e29fa7a99ce9 100644
--- a/app/components/UI/AssetOverview/MarketClosedActionButton/__snapshots__/MarketClosedActionButton.test.tsx.snap
+++ b/app/components/UI/AssetOverview/MarketClosedActionButton/__snapshots__/MarketClosedActionButton.test.tsx.snap
@@ -46,7 +46,7 @@ exports[`MarketClosedActionButton renders correctly 1`] = `
     style={
       [
         {
-          "backgroundColor": "#3c4d9d0f",
+          "backgroundColor": "#b4b4b528",
           "borderRadius": 12,
           "marginHorizontal": 16,
         },
@@ -65,7 +65,7 @@ exports[`MarketClosedActionButton renders correctly 1`] = `
       }
     >
       <SvgMock
-        color="#686e7d"
+        color="#66676a"
         fill="currentColor"
         height={24}
         name="AfterHours"
@@ -85,7 +85,7 @@ exports[`MarketClosedActionButton renders correctly 1`] = `
         numberOfLines={1}
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "flexShrink": 0,
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
@@ -100,7 +100,7 @@ exports[`MarketClosedActionButton renders correctly 1`] = `
         Test Button
       </Text>
       <SvgMock
-        color="#686e7d"
+        color="#66676a"
         fill="currentColor"
         height={24}
         name="Add"
diff --git a/app/components/UI/AssetOverview/Price/Price.tsx b/app/components/UI/AssetOverview/Price/Price.tsx
index 76f5c4b9705c..000398ed09d2 100644
--- a/app/components/UI/AssetOverview/Price/Price.tsx
+++ b/app/components/UI/AssetOverview/Price/Price.tsx
@@ -9,10 +9,12 @@ import { strings } from '../../../../../locales/i18n';
 import { useStyles } from '../../../../component-library/hooks';
 import { toDateFormat } from '../../../../util/date';
 import { addCurrencySymbol } from '../../../../util/number';
+import { formatPriceWithSubscriptNotation } from '../../Predict/utils/format';
 import Text, {
   TextColor,
   TextVariant,
 } from '../../../../component-library/components/Texts/Text';
+
 import PriceChart from '../PriceChart/PriceChart';
 import { distributeDataPoints } from '../PriceChart/utils';
 import styleSheet from './Price.styles';
@@ -147,7 +149,7 @@ const Price = ({
                 </SkeletonPlaceholder>
               </View>
             ) : (
-              addCurrencySymbol(price, currentCurrency, true)
+              formatPriceWithSubscriptNotation(price, currentCurrency)
             )}
           </Text>
         )}
diff --git a/app/components/UI/AssetOverview/TokenDetails/TokenDetailsList/__snapshots__/TokenDetailsList.test.tsx.snap b/app/components/UI/AssetOverview/TokenDetails/TokenDetailsList/__snapshots__/TokenDetailsList.test.tsx.snap
index 0e43a6393b2b..c4fd88399b7a 100644
--- a/app/components/UI/AssetOverview/TokenDetails/TokenDetailsList/__snapshots__/TokenDetailsList.test.tsx.snap
+++ b/app/components/UI/AssetOverview/TokenDetails/TokenDetailsList/__snapshots__/TokenDetailsList.test.tsx.snap
@@ -6,9 +6,9 @@ exports[`TokenDetails renders correctly 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Bold",
-        "fontSize": 18,
+        "fontSize": 20,
         "letterSpacing": 0,
         "lineHeight": 24,
         "paddingBottom": 8,
@@ -44,7 +44,7 @@ exports[`TokenDetails renders correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -68,7 +68,7 @@ exports[`TokenDetails renders correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 14,
               "letterSpacing": 0,
@@ -84,7 +84,7 @@ exports[`TokenDetails renders correctly 1`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "height": 16,
                 "width": 16,
               },
@@ -107,7 +107,7 @@ exports[`TokenDetails renders correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -121,7 +121,7 @@ exports[`TokenDetails renders correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 14,
             "letterSpacing": 0,
@@ -150,7 +150,7 @@ exports[`TokenDetails renders correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -164,7 +164,7 @@ exports[`TokenDetails renders correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 14,
             "letterSpacing": 0,
diff --git a/app/components/UI/BackupAlert/__snapshots__/BackupAlert.test.tsx.snap b/app/components/UI/BackupAlert/__snapshots__/BackupAlert.test.tsx.snap
index 0f305ed54bec..ec2c8abc6954 100644
--- a/app/components/UI/BackupAlert/__snapshots__/BackupAlert.test.tsx.snap
+++ b/app/components/UI/BackupAlert/__snapshots__/BackupAlert.test.tsx.snap
@@ -53,7 +53,7 @@ exports[`BackupAlert render matches snapshot 1`] = `
         }
       >
         <SvgMock
-          color="#121314"
+          color="#131416"
           fill="currentColor"
           height={20}
           name="Notification"
@@ -77,7 +77,7 @@ exports[`BackupAlert render matches snapshot 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Bold",
               "fontSize": 16,
               "letterSpacing": 0,
diff --git a/app/components/UI/BalanceEmptyState/BalanceEmptyState.test.tsx b/app/components/UI/BalanceEmptyState/BalanceEmptyState.test.tsx
index 5b179563c13d..2e2f9ce81c4c 100644
--- a/app/components/UI/BalanceEmptyState/BalanceEmptyState.test.tsx
+++ b/app/components/UI/BalanceEmptyState/BalanceEmptyState.test.tsx
@@ -30,6 +30,8 @@ jest.mock('../Ramp/hooks/useRampsUnifiedV1Enabled', () => ({
   default: () => mockUseRampsUnifiedV1Enabled(),
 }));
 
+jest.mock('../Ramp/hooks/useRampsUnifiedV2Enabled');
+
 const mockTrackEvent = jest.fn();
 const mockCreateEventBuilder = jest.fn();
 const mockEventBuilder = {
@@ -104,7 +106,7 @@ describe('BalanceEmptyState', () => {
     expect(mockCreateEventBuilder).toHaveBeenCalledWith('ramps_button_clicked');
     expect(mockEventBuilder.addProperties).toHaveBeenCalledWith(
       expect.objectContaining({
-        text: 'Add funds',
+        button_text: 'Add funds',
         location: 'BalanceEmptyState',
         chain_id_destination: 1,
         ramp_type: 'BUY',
@@ -127,7 +129,7 @@ describe('BalanceEmptyState', () => {
     expect(mockCreateEventBuilder).toHaveBeenCalledWith('ramps_button_clicked');
     expect(mockEventBuilder.addProperties).toHaveBeenCalledWith(
       expect.objectContaining({
-        text: 'Add funds',
+        button_text: 'Add funds',
         location: 'BalanceEmptyState',
         chain_id_destination: 1,
         ramp_type: 'UNIFIED_BUY',
diff --git a/app/components/UI/BalanceEmptyState/BalanceEmptyState.tsx b/app/components/UI/BalanceEmptyState/BalanceEmptyState.tsx
index b9f3d6eb49fe..ee5b1beb84b1 100644
--- a/app/components/UI/BalanceEmptyState/BalanceEmptyState.tsx
+++ b/app/components/UI/BalanceEmptyState/BalanceEmptyState.tsx
@@ -26,6 +26,7 @@ import bankTransferImage from '../../../images/bank-transfer.png';
 import { getDetectedGeolocation } from '../../../reducers/fiatOrders';
 import { useRampsButtonClickData } from '../Ramp/hooks/useRampsButtonClickData';
 import useRampsUnifiedV1Enabled from '../Ramp/hooks/useRampsUnifiedV1Enabled';
+import useRampsUnifiedV2Enabled from '../Ramp/hooks/useRampsUnifiedV2Enabled';
 
 /**
  * BalanceEmptyState smart component displays an empty state for wallet balance
@@ -42,6 +43,7 @@ const BalanceEmptyState: React.FC<BalanceEmptyStateProps> = ({
   const { goToBuy } = useRampNavigation();
   const buttonClickData = useRampsButtonClickData();
   const rampUnifiedV1Enabled = useRampsUnifiedV1Enabled();
+  const isV2UnifiedEnabled = useRampsUnifiedV2Enabled();
 
   const handleAction = () => {
     goToBuy();
@@ -49,10 +51,14 @@ const BalanceEmptyState: React.FC<BalanceEmptyStateProps> = ({
     trackEvent(
       createEventBuilder(MetaMetricsEvents.RAMPS_BUTTON_CLICKED)
         .addProperties({
-          text: 'Add funds',
+          button_text: 'Add funds',
           location: 'BalanceEmptyState',
           chain_id_destination: getDecimalChainId(chainId),
-          ramp_type: rampUnifiedV1Enabled ? 'UNIFIED_BUY' : 'BUY',
+          ramp_type: isV2UnifiedEnabled
+            ? 'UNIFIED_BUY_2'
+            : rampUnifiedV1Enabled
+              ? 'UNIFIED_BUY'
+              : 'BUY',
           region: rampGeodetectedRegion,
           ramp_routing: buttonClickData.ramp_routing,
           is_authenticated: buttonClickData.is_authenticated,
diff --git a/app/components/UI/BasicFunctionality/BasicFunctionalityModal/__snapshots__/BasicFunctionalityModal.test.js.snap b/app/components/UI/BasicFunctionality/BasicFunctionalityModal/__snapshots__/BasicFunctionalityModal.test.js.snap
index 43b6764e6d99..81283a43332f 100644
--- a/app/components/UI/BasicFunctionality/BasicFunctionalityModal/__snapshots__/BasicFunctionalityModal.test.js.snap
+++ b/app/components/UI/BasicFunctionality/BasicFunctionalityModal/__snapshots__/BasicFunctionalityModal.test.js.snap
@@ -23,7 +23,7 @@ exports[`BasicFunctionalityModal should render correctly 1`] = `
     style={
       [
         {
-          "backgroundColor": "#3f434a66",
+          "backgroundColor": "#0a0d135c",
           "bottom": 0,
           "left": 0,
           "position": "absolute",
@@ -73,7 +73,7 @@ exports[`BasicFunctionalityModal should render correctly 1`] = `
         [
           {
             "backgroundColor": "#ffffff",
-            "borderColor": "#b7bbc866",
+            "borderColor": "#b4b4b566",
             "borderTopLeftRadius": 24,
             "borderTopRightRadius": 24,
             "borderWidth": 1,
@@ -110,7 +110,7 @@ exports[`BasicFunctionalityModal should render correctly 1`] = `
         <View
           style={
             {
-              "backgroundColor": "#b7bbc866",
+              "backgroundColor": "#b4b4b566",
               "borderRadius": 2,
               "height": 4,
               "width": 40,
@@ -146,9 +146,9 @@ exports[`BasicFunctionalityModal should render correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Bold",
-              "fontSize": 18,
+              "fontSize": 20,
               "letterSpacing": 0,
               "lineHeight": 24,
               "textAlign": "center",
@@ -162,7 +162,7 @@ exports[`BasicFunctionalityModal should render correctly 1`] = `
           style={
             {
               "alignSelf": "flex-start",
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -179,7 +179,7 @@ exports[`BasicFunctionalityModal should render correctly 1`] = `
           style={
             {
               "alignSelf": "flex-start",
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -196,7 +196,7 @@ exports[`BasicFunctionalityModal should render correctly 1`] = `
             style={
               {
                 "alignSelf": "flex-start",
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -214,7 +214,7 @@ exports[`BasicFunctionalityModal should render correctly 1`] = `
             style={
               {
                 "alignSelf": "flex-start",
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -232,7 +232,7 @@ exports[`BasicFunctionalityModal should render correctly 1`] = `
             style={
               {
                 "alignSelf": "flex-start",
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -270,7 +270,7 @@ exports[`BasicFunctionalityModal should render correctly 1`] = `
                 {
                   "alignItems": "center",
                   "backgroundColor": "#ffffff",
-                  "borderColor": "#b7bbc8",
+                  "borderColor": "#949596",
                   "borderRadius": 4,
                   "borderWidth": 2,
                   "height": 20,
@@ -290,7 +290,7 @@ exports[`BasicFunctionalityModal should render correctly 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -321,7 +321,7 @@ exports[`BasicFunctionalityModal should render correctly 1`] = `
                 {
                   "alignItems": "center",
                   "alignSelf": "flex-start",
-                  "backgroundColor": "#3c4d9d0f",
+                  "backgroundColor": "#b4b4b528",
                   "borderColor": "transparent",
                   "borderRadius": 12,
                   "borderWidth": 1,
@@ -338,7 +338,7 @@ exports[`BasicFunctionalityModal should render correctly 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Medium",
                     "fontSize": 16,
                     "letterSpacing": 0,
diff --git a/app/components/UI/BasicFunctionality/__snapshots__/BasicFunctionality.test.js.snap b/app/components/UI/BasicFunctionality/__snapshots__/BasicFunctionality.test.js.snap
index bda18d1d83b7..55a2dd94e941 100644
--- a/app/components/UI/BasicFunctionality/__snapshots__/BasicFunctionality.test.js.snap
+++ b/app/components/UI/BasicFunctionality/__snapshots__/BasicFunctionality.test.js.snap
@@ -22,7 +22,7 @@ exports[`BasicFunctionality should render correctly 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Bold",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -45,13 +45,13 @@ exports[`BasicFunctionality should render correctly 1`] = `
             "width": 51,
           },
           {
-            "backgroundColor": "#b7bbc866",
+            "backgroundColor": "#b4b4b566",
             "borderRadius": 16,
           },
         ]
       }
       thumbTintColor="#ffffff"
-      tintColor="#b7bbc866"
+      tintColor="#b4b4b566"
       value={true}
     />
   </View>
@@ -59,7 +59,7 @@ exports[`BasicFunctionality should render correctly 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#686e7d",
+        "color": "#66676a",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
diff --git a/app/components/UI/BlockingActionModal/__snapshots__/index.test.tsx.snap b/app/components/UI/BlockingActionModal/__snapshots__/index.test.tsx.snap
index 5068c8e20bcc..a04dea5e3466 100644
--- a/app/components/UI/BlockingActionModal/__snapshots__/index.test.tsx.snap
+++ b/app/components/UI/BlockingActionModal/__snapshots__/index.test.tsx.snap
@@ -51,7 +51,7 @@ exports[`BlockingActionModal should render correctly 1`] = `
       onStartShouldSetResponder={[Function]}
       style={
         {
-          "backgroundColor": "#3f434a66",
+          "backgroundColor": "#0a0d135c",
           "bottom": 0,
           "height": 1334,
           "left": 0,
diff --git a/app/components/UI/Bridge/Views/BridgeView/BridgeView.view.test.tsx b/app/components/UI/Bridge/Views/BridgeView/BridgeView.view.test.tsx
index f28777ad8c76..71e0b41c30fb 100644
--- a/app/components/UI/Bridge/Views/BridgeView/BridgeView.view.test.tsx
+++ b/app/components/UI/Bridge/Views/BridgeView/BridgeView.view.test.tsx
@@ -39,6 +39,13 @@ const defaultBridgeWithTokens = (overrides?: Record<string, unknown>) => {
 };
 
 describeForPlatforms('BridgeView', () => {
+  beforeEach(() => {
+    // testSetup.js mocks Date.now to always return 123, which breaks lodash debounce
+    // (timeSinceLastCall = 123 - 123 = 0 never reaches the wait threshold).
+    // Restore it to a real implementation so debounce-based tests work correctly.
+    Date.now = () => new Date().getTime();
+  });
+
   it('renders input areas and hides confirm button without tokens or amount', () => {
     const { getByTestId, queryByTestId } = renderBridgeView({
       overrides: {
@@ -331,6 +338,10 @@ describeForPlatforms('BridgeView', () => {
 
     // Regression for #25256: two USDT tokens on Linea must both appear in search results.
     it('shows two USDT when search API returns two USDT on Linea (#25256)', async () => {
+      jest
+        .spyOn(Engine.context.AuthenticationController, 'getBearerToken')
+        .mockResolvedValue('mock-bearer-token');
+
       const LINEA_CHAIN_ID = 59144;
       const verifiedUsdtAddress = '0xA219439258ca9da29E9Cc4cE5596924745e12B93';
       const otherUsdtAddress = '0x0000000000000000000000000000000000000001';
diff --git a/app/components/UI/Bridge/Views/BridgeView/__snapshots__/BridgeView.test.tsx.snap b/app/components/UI/Bridge/Views/BridgeView/__snapshots__/BridgeView.test.tsx.snap
index c7f41e8bc25b..f6843cfa1415 100644
--- a/app/components/UI/Bridge/Views/BridgeView/__snapshots__/BridgeView.test.tsx.snap
+++ b/app/components/UI/Bridge/Views/BridgeView/__snapshots__/BridgeView.test.tsx.snap
@@ -411,14 +411,14 @@ exports[`BridgeView Bottom Content blurs input when opening QuoteExpiredModal 1`
                                         onFocus={[Function]}
                                         onPressIn={[Function]}
                                         placeholder="0"
-                                        placeholderTextColor="#686e7d"
+                                        placeholderTextColor="#66676a"
                                         showSoftInputOnFocus={false}
                                         style={
                                           {
                                             "backgroundColor": "#ffffff",
                                             "borderColor": "#4459ff",
                                             "borderWidth": 0,
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 40,
                                             "fontWeight": "400",
@@ -450,7 +450,7 @@ exports[`BridgeView Bottom Content blurs input when opening QuoteExpiredModal 1`
                                               "justifyContent": "flex-end",
                                             },
                                             {
-                                              "backgroundColor": "#3c4d9d0f",
+                                              "backgroundColor": "#b4b4b528",
                                               "borderRadius": 100,
                                               "paddingLeft": 8,
                                               "paddingRight": 11,
@@ -588,7 +588,7 @@ exports[`BridgeView Bottom Content blurs input when opening QuoteExpiredModal 1`
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
                                               "fontSize": 24,
                                               "fontWeight": 500,
@@ -643,7 +643,7 @@ exports[`BridgeView Bottom Content blurs input when opening QuoteExpiredModal 1`
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#686e7d",
+                                            "color": "#66676a",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 16,
                                             "letterSpacing": 0,
@@ -674,7 +674,7 @@ exports[`BridgeView Bottom Content blurs input when opening QuoteExpiredModal 1`
                                 <View
                                   style={
                                     {
-                                      "backgroundColor": "#b7bbc866",
+                                      "backgroundColor": "#b4b4b566",
                                       "height": 1,
                                       "position": "absolute",
                                       "width": "100%",
@@ -699,7 +699,7 @@ exports[`BridgeView Bottom Content blurs input when opening QuoteExpiredModal 1`
                                     style={
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 10000,
                                         "height": 44,
                                         "justifyContent": "center",
@@ -710,7 +710,7 @@ exports[`BridgeView Bottom Content blurs input when opening QuoteExpiredModal 1`
                                     testID="arrow-button"
                                   >
                                     <SvgMock
-                                      color="#121314"
+                                      color="#131416"
                                       fill="currentColor"
                                       height={24}
                                       name="SwapVertical"
@@ -777,7 +777,7 @@ exports[`BridgeView Bottom Content blurs input when opening QuoteExpiredModal 1`
                                         onFocus={[Function]}
                                         onPressIn={[Function]}
                                         placeholder="0"
-                                        placeholderTextColor="#686e7d"
+                                        placeholderTextColor="#66676a"
                                         selection={
                                           {
                                             "end": 0,
@@ -790,7 +790,7 @@ exports[`BridgeView Bottom Content blurs input when opening QuoteExpiredModal 1`
                                             "backgroundColor": "#ffffff",
                                             "borderColor": "#4459ff",
                                             "borderWidth": 0,
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 40,
                                             "fontWeight": "400",
@@ -816,7 +816,7 @@ exports[`BridgeView Bottom Content blurs input when opening QuoteExpiredModal 1`
                                         {
                                           "alignItems": "center",
                                           "alignSelf": "flex-start",
-                                          "backgroundColor": "#121314",
+                                          "backgroundColor": "#131416",
                                           "borderRadius": 12,
                                           "flexDirection": "row",
                                           "height": 40,
@@ -884,7 +884,7 @@ exports[`BridgeView Bottom Content blurs input when opening QuoteExpiredModal 1`
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#686e7d",
+                                            "color": "#66676a",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 16,
                                             "letterSpacing": 0,
@@ -959,7 +959,7 @@ exports[`BridgeView Bottom Content blurs input when opening QuoteExpiredModal 1`
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderColor": "transparent",
                                       "borderRadius": 12,
                                       "borderWidth": 1,
@@ -976,7 +976,7 @@ exports[`BridgeView Bottom Content blurs input when opening QuoteExpiredModal 1`
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Medium",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -998,7 +998,7 @@ exports[`BridgeView Bottom Content blurs input when opening QuoteExpiredModal 1`
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderColor": "transparent",
                                       "borderRadius": 12,
                                       "borderWidth": 1,
@@ -1015,7 +1015,7 @@ exports[`BridgeView Bottom Content blurs input when opening QuoteExpiredModal 1`
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Medium",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -1037,7 +1037,7 @@ exports[`BridgeView Bottom Content blurs input when opening QuoteExpiredModal 1`
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderColor": "transparent",
                                       "borderRadius": 12,
                                       "borderWidth": 1,
@@ -1054,7 +1054,7 @@ exports[`BridgeView Bottom Content blurs input when opening QuoteExpiredModal 1`
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Medium",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -1076,7 +1076,7 @@ exports[`BridgeView Bottom Content blurs input when opening QuoteExpiredModal 1`
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderColor": "transparent",
                                       "borderRadius": 12,
                                       "borderWidth": 1,
@@ -1093,7 +1093,7 @@ exports[`BridgeView Bottom Content blurs input when opening QuoteExpiredModal 1`
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Medium",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -1150,7 +1150,7 @@ exports[`BridgeView Bottom Content blurs input when opening QuoteExpiredModal 1`
                                         [
                                           {
                                             "alignItems": "center",
-                                            "backgroundColor": "#3c4d9d0f",
+                                            "backgroundColor": "#b4b4b528",
                                             "borderRadius": 12,
                                             "height": 48,
                                             "justifyContent": "center",
@@ -1165,7 +1165,7 @@ exports[`BridgeView Bottom Content blurs input when opening QuoteExpiredModal 1`
                                         style={
                                           [
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Bold",
                                               "fontSize": 32,
                                               "fontWeight": "500",
@@ -1202,7 +1202,7 @@ exports[`BridgeView Bottom Content blurs input when opening QuoteExpiredModal 1`
                                         [
                                           {
                                             "alignItems": "center",
-                                            "backgroundColor": "#3c4d9d0f",
+                                            "backgroundColor": "#b4b4b528",
                                             "borderRadius": 12,
                                             "height": 48,
                                             "justifyContent": "center",
@@ -1217,7 +1217,7 @@ exports[`BridgeView Bottom Content blurs input when opening QuoteExpiredModal 1`
                                         style={
                                           [
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Bold",
                                               "fontSize": 32,
                                               "fontWeight": "500",
@@ -1254,7 +1254,7 @@ exports[`BridgeView Bottom Content blurs input when opening QuoteExpiredModal 1`
                                         [
                                           {
                                             "alignItems": "center",
-                                            "backgroundColor": "#3c4d9d0f",
+                                            "backgroundColor": "#b4b4b528",
                                             "borderRadius": 12,
                                             "height": 48,
                                             "justifyContent": "center",
@@ -1269,7 +1269,7 @@ exports[`BridgeView Bottom Content blurs input when opening QuoteExpiredModal 1`
                                         style={
                                           [
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Bold",
                                               "fontSize": 32,
                                               "fontWeight": "500",
@@ -1320,7 +1320,7 @@ exports[`BridgeView Bottom Content blurs input when opening QuoteExpiredModal 1`
                                         [
                                           {
                                             "alignItems": "center",
-                                            "backgroundColor": "#3c4d9d0f",
+                                            "backgroundColor": "#b4b4b528",
                                             "borderRadius": 12,
                                             "height": 48,
                                             "justifyContent": "center",
@@ -1335,7 +1335,7 @@ exports[`BridgeView Bottom Content blurs input when opening QuoteExpiredModal 1`
                                         style={
                                           [
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Bold",
                                               "fontSize": 32,
                                               "fontWeight": "500",
@@ -1372,7 +1372,7 @@ exports[`BridgeView Bottom Content blurs input when opening QuoteExpiredModal 1`
                                         [
                                           {
                                             "alignItems": "center",
-                                            "backgroundColor": "#3c4d9d0f",
+                                            "backgroundColor": "#b4b4b528",
                                             "borderRadius": 12,
                                             "height": 48,
                                             "justifyContent": "center",
@@ -1387,7 +1387,7 @@ exports[`BridgeView Bottom Content blurs input when opening QuoteExpiredModal 1`
                                         style={
                                           [
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Bold",
                                               "fontSize": 32,
                                               "fontWeight": "500",
@@ -1424,7 +1424,7 @@ exports[`BridgeView Bottom Content blurs input when opening QuoteExpiredModal 1`
                                         [
                                           {
                                             "alignItems": "center",
-                                            "backgroundColor": "#3c4d9d0f",
+                                            "backgroundColor": "#b4b4b528",
                                             "borderRadius": 12,
                                             "height": 48,
                                             "justifyContent": "center",
@@ -1439,7 +1439,7 @@ exports[`BridgeView Bottom Content blurs input when opening QuoteExpiredModal 1`
                                         style={
                                           [
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Bold",
                                               "fontSize": 32,
                                               "fontWeight": "500",
@@ -1490,7 +1490,7 @@ exports[`BridgeView Bottom Content blurs input when opening QuoteExpiredModal 1`
                                         [
                                           {
                                             "alignItems": "center",
-                                            "backgroundColor": "#3c4d9d0f",
+                                            "backgroundColor": "#b4b4b528",
                                             "borderRadius": 12,
                                             "height": 48,
                                             "justifyContent": "center",
@@ -1505,7 +1505,7 @@ exports[`BridgeView Bottom Content blurs input when opening QuoteExpiredModal 1`
                                         style={
                                           [
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Bold",
                                               "fontSize": 32,
                                               "fontWeight": "500",
@@ -1542,7 +1542,7 @@ exports[`BridgeView Bottom Content blurs input when opening QuoteExpiredModal 1`
                                         [
                                           {
                                             "alignItems": "center",
-                                            "backgroundColor": "#3c4d9d0f",
+                                            "backgroundColor": "#b4b4b528",
                                             "borderRadius": 12,
                                             "height": 48,
                                             "justifyContent": "center",
@@ -1557,7 +1557,7 @@ exports[`BridgeView Bottom Content blurs input when opening QuoteExpiredModal 1`
                                         style={
                                           [
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Bold",
                                               "fontSize": 32,
                                               "fontWeight": "500",
@@ -1594,7 +1594,7 @@ exports[`BridgeView Bottom Content blurs input when opening QuoteExpiredModal 1`
                                         [
                                           {
                                             "alignItems": "center",
-                                            "backgroundColor": "#3c4d9d0f",
+                                            "backgroundColor": "#b4b4b528",
                                             "borderRadius": 12,
                                             "height": 48,
                                             "justifyContent": "center",
@@ -1609,7 +1609,7 @@ exports[`BridgeView Bottom Content blurs input when opening QuoteExpiredModal 1`
                                         style={
                                           [
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Bold",
                                               "fontSize": 32,
                                               "fontWeight": "500",
@@ -1660,7 +1660,7 @@ exports[`BridgeView Bottom Content blurs input when opening QuoteExpiredModal 1`
                                         [
                                           {
                                             "alignItems": "center",
-                                            "backgroundColor": "#3c4d9d0f",
+                                            "backgroundColor": "#b4b4b528",
                                             "borderRadius": 12,
                                             "height": 48,
                                             "justifyContent": "center",
@@ -1677,7 +1677,7 @@ exports[`BridgeView Bottom Content blurs input when opening QuoteExpiredModal 1`
                                         style={
                                           [
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Bold",
                                               "fontSize": 32,
                                               "fontWeight": "500",
@@ -1714,7 +1714,7 @@ exports[`BridgeView Bottom Content blurs input when opening QuoteExpiredModal 1`
                                         [
                                           {
                                             "alignItems": "center",
-                                            "backgroundColor": "#3c4d9d0f",
+                                            "backgroundColor": "#b4b4b528",
                                             "borderRadius": 12,
                                             "height": 48,
                                             "justifyContent": "center",
@@ -1729,7 +1729,7 @@ exports[`BridgeView Bottom Content blurs input when opening QuoteExpiredModal 1`
                                         style={
                                           [
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Bold",
                                               "fontSize": 32,
                                               "fontWeight": "500",
@@ -1784,7 +1784,7 @@ exports[`BridgeView Bottom Content blurs input when opening QuoteExpiredModal 1`
                                         style={
                                           [
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "height": 32,
                                               "width": 32,
                                             },
@@ -2224,14 +2224,14 @@ exports[`BridgeView renders 1`] = `
                                         onFocus={[Function]}
                                         onPressIn={[Function]}
                                         placeholder="0"
-                                        placeholderTextColor="#686e7d"
+                                        placeholderTextColor="#66676a"
                                         showSoftInputOnFocus={false}
                                         style={
                                           {
                                             "backgroundColor": "#ffffff",
                                             "borderColor": "#4459ff",
                                             "borderWidth": 0,
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 40,
                                             "fontWeight": "400",
@@ -2263,7 +2263,7 @@ exports[`BridgeView renders 1`] = `
                                               "justifyContent": "flex-end",
                                             },
                                             {
-                                              "backgroundColor": "#3c4d9d0f",
+                                              "backgroundColor": "#b4b4b528",
                                               "borderRadius": 100,
                                               "paddingLeft": 8,
                                               "paddingRight": 11,
@@ -2401,7 +2401,7 @@ exports[`BridgeView renders 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
                                               "fontSize": 24,
                                               "fontWeight": 500,
@@ -2456,7 +2456,7 @@ exports[`BridgeView renders 1`] = `
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#686e7d",
+                                            "color": "#66676a",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 16,
                                             "letterSpacing": 0,
@@ -2487,7 +2487,7 @@ exports[`BridgeView renders 1`] = `
                                 <View
                                   style={
                                     {
-                                      "backgroundColor": "#b7bbc866",
+                                      "backgroundColor": "#b4b4b566",
                                       "height": 1,
                                       "position": "absolute",
                                       "width": "100%",
@@ -2512,7 +2512,7 @@ exports[`BridgeView renders 1`] = `
                                     style={
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 10000,
                                         "height": 44,
                                         "justifyContent": "center",
@@ -2523,7 +2523,7 @@ exports[`BridgeView renders 1`] = `
                                     testID="arrow-button"
                                   >
                                     <SvgMock
-                                      color="#121314"
+                                      color="#131416"
                                       fill="currentColor"
                                       height={24}
                                       name="SwapVertical"
@@ -2590,7 +2590,7 @@ exports[`BridgeView renders 1`] = `
                                         onFocus={[Function]}
                                         onPressIn={[Function]}
                                         placeholder="0"
-                                        placeholderTextColor="#686e7d"
+                                        placeholderTextColor="#66676a"
                                         selection={
                                           {
                                             "end": 0,
@@ -2603,7 +2603,7 @@ exports[`BridgeView renders 1`] = `
                                             "backgroundColor": "#ffffff",
                                             "borderColor": "#4459ff",
                                             "borderWidth": 0,
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 40,
                                             "fontWeight": "400",
@@ -2629,7 +2629,7 @@ exports[`BridgeView renders 1`] = `
                                         {
                                           "alignItems": "center",
                                           "alignSelf": "flex-start",
-                                          "backgroundColor": "#121314",
+                                          "backgroundColor": "#131416",
                                           "borderRadius": 12,
                                           "flexDirection": "row",
                                           "height": 40,
@@ -2697,7 +2697,7 @@ exports[`BridgeView renders 1`] = `
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#686e7d",
+                                            "color": "#66676a",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 16,
                                             "letterSpacing": 0,
@@ -2784,7 +2784,7 @@ exports[`BridgeView renders 1`] = `
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderColor": "transparent",
                                       "borderRadius": 12,
                                       "borderWidth": 1,
@@ -2801,7 +2801,7 @@ exports[`BridgeView renders 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Medium",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -2823,7 +2823,7 @@ exports[`BridgeView renders 1`] = `
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderColor": "transparent",
                                       "borderRadius": 12,
                                       "borderWidth": 1,
@@ -2840,7 +2840,7 @@ exports[`BridgeView renders 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Medium",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -2862,7 +2862,7 @@ exports[`BridgeView renders 1`] = `
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderColor": "transparent",
                                       "borderRadius": 12,
                                       "borderWidth": 1,
@@ -2879,7 +2879,7 @@ exports[`BridgeView renders 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Medium",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -2901,7 +2901,7 @@ exports[`BridgeView renders 1`] = `
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderColor": "transparent",
                                       "borderRadius": 12,
                                       "borderWidth": 1,
@@ -2918,7 +2918,7 @@ exports[`BridgeView renders 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Medium",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -2975,7 +2975,7 @@ exports[`BridgeView renders 1`] = `
                                         [
                                           {
                                             "alignItems": "center",
-                                            "backgroundColor": "#3c4d9d0f",
+                                            "backgroundColor": "#b4b4b528",
                                             "borderRadius": 12,
                                             "height": 48,
                                             "justifyContent": "center",
@@ -2990,7 +2990,7 @@ exports[`BridgeView renders 1`] = `
                                         style={
                                           [
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Bold",
                                               "fontSize": 32,
                                               "fontWeight": "500",
@@ -3027,7 +3027,7 @@ exports[`BridgeView renders 1`] = `
                                         [
                                           {
                                             "alignItems": "center",
-                                            "backgroundColor": "#3c4d9d0f",
+                                            "backgroundColor": "#b4b4b528",
                                             "borderRadius": 12,
                                             "height": 48,
                                             "justifyContent": "center",
@@ -3042,7 +3042,7 @@ exports[`BridgeView renders 1`] = `
                                         style={
                                           [
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Bold",
                                               "fontSize": 32,
                                               "fontWeight": "500",
@@ -3079,7 +3079,7 @@ exports[`BridgeView renders 1`] = `
                                         [
                                           {
                                             "alignItems": "center",
-                                            "backgroundColor": "#3c4d9d0f",
+                                            "backgroundColor": "#b4b4b528",
                                             "borderRadius": 12,
                                             "height": 48,
                                             "justifyContent": "center",
@@ -3094,7 +3094,7 @@ exports[`BridgeView renders 1`] = `
                                         style={
                                           [
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Bold",
                                               "fontSize": 32,
                                               "fontWeight": "500",
@@ -3145,7 +3145,7 @@ exports[`BridgeView renders 1`] = `
                                         [
                                           {
                                             "alignItems": "center",
-                                            "backgroundColor": "#3c4d9d0f",
+                                            "backgroundColor": "#b4b4b528",
                                             "borderRadius": 12,
                                             "height": 48,
                                             "justifyContent": "center",
@@ -3160,7 +3160,7 @@ exports[`BridgeView renders 1`] = `
                                         style={
                                           [
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Bold",
                                               "fontSize": 32,
                                               "fontWeight": "500",
@@ -3197,7 +3197,7 @@ exports[`BridgeView renders 1`] = `
                                         [
                                           {
                                             "alignItems": "center",
-                                            "backgroundColor": "#3c4d9d0f",
+                                            "backgroundColor": "#b4b4b528",
                                             "borderRadius": 12,
                                             "height": 48,
                                             "justifyContent": "center",
@@ -3212,7 +3212,7 @@ exports[`BridgeView renders 1`] = `
                                         style={
                                           [
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Bold",
                                               "fontSize": 32,
                                               "fontWeight": "500",
@@ -3249,7 +3249,7 @@ exports[`BridgeView renders 1`] = `
                                         [
                                           {
                                             "alignItems": "center",
-                                            "backgroundColor": "#3c4d9d0f",
+                                            "backgroundColor": "#b4b4b528",
                                             "borderRadius": 12,
                                             "height": 48,
                                             "justifyContent": "center",
@@ -3264,7 +3264,7 @@ exports[`BridgeView renders 1`] = `
                                         style={
                                           [
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Bold",
                                               "fontSize": 32,
                                               "fontWeight": "500",
@@ -3315,7 +3315,7 @@ exports[`BridgeView renders 1`] = `
                                         [
                                           {
                                             "alignItems": "center",
-                                            "backgroundColor": "#3c4d9d0f",
+                                            "backgroundColor": "#b4b4b528",
                                             "borderRadius": 12,
                                             "height": 48,
                                             "justifyContent": "center",
@@ -3330,7 +3330,7 @@ exports[`BridgeView renders 1`] = `
                                         style={
                                           [
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Bold",
                                               "fontSize": 32,
                                               "fontWeight": "500",
@@ -3367,7 +3367,7 @@ exports[`BridgeView renders 1`] = `
                                         [
                                           {
                                             "alignItems": "center",
-                                            "backgroundColor": "#3c4d9d0f",
+                                            "backgroundColor": "#b4b4b528",
                                             "borderRadius": 12,
                                             "height": 48,
                                             "justifyContent": "center",
@@ -3382,7 +3382,7 @@ exports[`BridgeView renders 1`] = `
                                         style={
                                           [
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Bold",
                                               "fontSize": 32,
                                               "fontWeight": "500",
@@ -3419,7 +3419,7 @@ exports[`BridgeView renders 1`] = `
                                         [
                                           {
                                             "alignItems": "center",
-                                            "backgroundColor": "#3c4d9d0f",
+                                            "backgroundColor": "#b4b4b528",
                                             "borderRadius": 12,
                                             "height": 48,
                                             "justifyContent": "center",
@@ -3434,7 +3434,7 @@ exports[`BridgeView renders 1`] = `
                                         style={
                                           [
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Bold",
                                               "fontSize": 32,
                                               "fontWeight": "500",
@@ -3485,7 +3485,7 @@ exports[`BridgeView renders 1`] = `
                                         [
                                           {
                                             "alignItems": "center",
-                                            "backgroundColor": "#3c4d9d0f",
+                                            "backgroundColor": "#b4b4b528",
                                             "borderRadius": 12,
                                             "height": 48,
                                             "justifyContent": "center",
@@ -3502,7 +3502,7 @@ exports[`BridgeView renders 1`] = `
                                         style={
                                           [
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Bold",
                                               "fontSize": 32,
                                               "fontWeight": "500",
@@ -3539,7 +3539,7 @@ exports[`BridgeView renders 1`] = `
                                         [
                                           {
                                             "alignItems": "center",
-                                            "backgroundColor": "#3c4d9d0f",
+                                            "backgroundColor": "#b4b4b528",
                                             "borderRadius": 12,
                                             "height": 48,
                                             "justifyContent": "center",
@@ -3554,7 +3554,7 @@ exports[`BridgeView renders 1`] = `
                                         style={
                                           [
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Bold",
                                               "fontSize": 32,
                                               "fontWeight": "500",
@@ -3609,7 +3609,7 @@ exports[`BridgeView renders 1`] = `
                                         style={
                                           [
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "height": 32,
                                               "width": 32,
                                             },
diff --git a/app/components/UI/Bridge/Views/BridgeView/index.tsx b/app/components/UI/Bridge/Views/BridgeView/index.tsx
index 02fdbf85c473..64a11629c8f7 100644
--- a/app/components/UI/Bridge/Views/BridgeView/index.tsx
+++ b/app/components/UI/Bridge/Views/BridgeView/index.tsx
@@ -14,10 +14,7 @@ import Text, {
   TextColor,
   TextVariant,
 } from '../../../../../component-library/components/Texts/Text';
-import {
-  getDecimalChainId,
-  getNetworkImageSource,
-} from '../../../../../util/networks';
+import { getNetworkImageSource } from '../../../../../util/networks';
 import { useLatestBalance } from '../../hooks/useLatestBalance';
 import {
   selectSourceAmount,
@@ -35,7 +32,6 @@ import {
   selectBridgeViewMode,
   setBridgeViewMode,
   selectIsNonEvmNonEvmBridge,
-  selectAbTestContext,
 } from '../../../../../core/redux/slices/bridge';
 import {
   useNavigation,
@@ -58,8 +54,6 @@ import { useInitialDestToken } from '../../hooks/useInitialDestToken';
 import { useGasFeeEstimates } from '../../../../Views/confirmations/hooks/gas/useGasFeeEstimates';
 import { selectSelectedNetworkClientId } from '../../../../../selectors/networkController';
 import { useIsNetworkEnabled } from '../../hooks/useIsNetworkEnabled';
-import { MetaMetricsEvents } from '../../../../../core/Analytics';
-import { useAnalytics } from '../../../../hooks/useAnalytics/useAnalytics';
 import { BridgeToken } from '../../types';
 import { useSwitchTokens } from '../../hooks/useSwitchTokens';
 import { ScrollView } from 'react-native';
@@ -90,6 +84,7 @@ import { SwapsConfirmButton } from '../../components/SwapsConfirmButton/index.ts
 import { useBridgeViewOnFocus } from '../../hooks/useBridgeViewOnFocus/index.ts';
 import { useRenderQuoteExpireModal } from '../../hooks/useRenderQuoteExpireModal/index.ts';
 import { type BridgeRouteParams } from '../../hooks/useSwapBridgeNavigation/index.ts';
+import { useTrackSwapPageViewed } from '../../hooks/useTrackSwapPageViewed/index.ts';
 
 const BridgeView = () => {
   const [isErrorBannerVisible, setIsErrorBannerVisible] = useState(true);
@@ -100,7 +95,6 @@ const BridgeView = () => {
   const navigation = useNavigation();
   const route = useRoute<RouteProp<{ params: BridgeRouteParams }, 'params'>>();
   const { colors } = useTheme();
-  const { trackEvent, createEventBuilder } = useAnalytics();
   const keypadRef = useRef<SwapsKeypadRef>(null);
 
   // Needed to get gas fee estimates
@@ -113,7 +107,6 @@ const BridgeView = () => {
   const destChainId = useSelector(selectSelectedDestChainId);
   const destAddress = useSelector(selectDestAddress);
   const bridgeViewMode = useSelector(selectBridgeViewMode);
-  const abTestContext = useSelector(selectAbTestContext);
   const { quotesLastFetched } = useSelector(selectBridgeControllerState);
   const { handleSwitchTokens } = useSwitchTokens();
   const { isStockToken } = useRWAToken();
@@ -136,8 +129,6 @@ const BridgeView = () => {
   // The ref is typed to only expose the blur method we need
   const inputRef = useRef<TokenInputAreaRef>(null);
 
-  const updateQuoteParams = useBridgeQuoteRequest();
-
   // Fetch STX liveness for the source chain
   useRefreshSmartTransactionsLiveness(sourceToken?.chainId);
 
@@ -178,6 +169,11 @@ const BridgeView = () => {
     address: sourceToken?.address,
     decimals: sourceToken?.decimals,
     chainId: sourceToken?.chainId,
+    balance: sourceToken?.balance,
+  });
+
+  const updateQuoteParams = useBridgeQuoteRequest({
+    latestSourceAtomicBalance: latestSourceBalance?.atomicBalance,
   });
 
   const {
@@ -277,40 +273,7 @@ const BridgeView = () => {
     navigation.setOptions(getBridgeNavbar(navigation, bridgeViewMode, colors));
   }, [navigation, bridgeViewMode, colors]);
 
-  const hasTrackedPageView = useRef(false);
-  useEffect(() => {
-    const shouldTrackPageView = sourceToken && !hasTrackedPageView.current;
-
-    if (shouldTrackPageView) {
-      hasTrackedPageView.current = true;
-      const pageViewedProperties = {
-        chain_id_source: getDecimalChainId(sourceToken.chainId),
-        chain_id_destination: getDecimalChainId(destToken?.chainId),
-        token_symbol_source: sourceToken.symbol,
-        token_symbol_destination: destToken?.symbol,
-        token_address_source: sourceToken.address,
-        token_address_destination: destToken?.address,
-        ...(abTestContext?.assetsASSETS2493AbtestTokenDetailsLayout && {
-          ab_tests: {
-            assetsASSETS2493AbtestTokenDetailsLayout:
-              abTestContext.assetsASSETS2493AbtestTokenDetailsLayout,
-          },
-        }),
-      };
-      trackEvent(
-        createEventBuilder(MetaMetricsEvents.SWAP_PAGE_VIEWED)
-          .addProperties(pageViewedProperties)
-          .build(),
-      );
-    }
-  }, [
-    sourceToken,
-    destToken,
-    trackEvent,
-    createEventBuilder,
-    bridgeViewMode,
-    abTestContext,
-  ]);
+  useTrackSwapPageViewed();
 
   // Reset isErrorBannerVisible when error state changes
   useEffect(() => {
@@ -374,6 +337,14 @@ const BridgeView = () => {
       );
     }
 
+    // Prevent bottom section from rendering when no active
+    // quotes exist and none are being fetching.
+    // This resolves edge cases when users are redirected back from
+    // Select Quote page due to quotes expiry.
+    if (!activeQuote) {
+      return null;
+    }
+
     // TODO: remove this once controller types are updated
     // @ts-expect-error: controller types are not up to date yet
     const quoteBpsFee = activeQuote?.quote?.feeData?.metabridge?.quoteBpsFee;
@@ -519,7 +490,9 @@ const BridgeView = () => {
             )}
             {shouldDisplayQuoteDetails && (
               <Box style={styles.quoteContainer}>
-                <QuoteDetailsCard />
+                <QuoteDetailsCard
+                  hasInsufficientBalance={hasInsufficientBalance}
+                />
               </Box>
             )}
           </Box>
diff --git a/app/components/UI/Bridge/components/ApprovalText/__snapshots__/ApprovalTooltip.test.tsx.snap b/app/components/UI/Bridge/components/ApprovalText/__snapshots__/ApprovalTooltip.test.tsx.snap
index 6236b574f397..5acdeb913104 100644
--- a/app/components/UI/Bridge/components/ApprovalText/__snapshots__/ApprovalTooltip.test.tsx.snap
+++ b/app/components/UI/Bridge/components/ApprovalText/__snapshots__/ApprovalTooltip.test.tsx.snap
@@ -333,7 +333,7 @@ exports[`ApprovalTooltip renders correctly with given props 1`] = `
                       }
                     >
                       <SvgMock
-                        color="#686e7d"
+                        color="#66676a"
                         fill="currentColor"
                         height={16}
                         name="Info"
diff --git a/app/components/UI/Bridge/components/BridgeNetworkSelectorBase.tsx b/app/components/UI/Bridge/components/BridgeNetworkSelectorBase.tsx
deleted file mode 100644
index c270c93c6b87..000000000000
--- a/app/components/UI/Bridge/components/BridgeNetworkSelectorBase.tsx
+++ /dev/null
@@ -1,33 +0,0 @@
-import React from 'react';
-import { ScrollView } from 'react-native';
-
-import BottomSheetHeader from '../../../../component-library/components/BottomSheets/BottomSheetHeader';
-import BottomSheet from '../../../../component-library/components/BottomSheets/BottomSheet';
-import { strings } from '../../../../../locales/i18n';
-
-import { useNavigation } from '@react-navigation/native';
-
-interface BridgeNetworkSelectorBaseProps {
-  children: React.ReactNode;
-}
-
-export const BridgeNetworkSelectorBase: React.FC<
-  BridgeNetworkSelectorBaseProps
-> = ({ children }) => {
-  const navigation = useNavigation();
-
-  return (
-    <BottomSheet isFullscreen>
-      <BottomSheetHeader
-        onClose={() => navigation.goBack()}
-        closeButtonProps={{
-          testID: 'bridge-network-selector-close-button',
-        }}
-      >
-        {strings('bridge.select_network')}
-      </BottomSheetHeader>
-
-      <ScrollView>{children}</ScrollView>
-    </BottomSheet>
-  );
-};
diff --git a/app/components/UI/Bridge/components/BridgeTokenSelector/BridgeTokenSelector.tsx b/app/components/UI/Bridge/components/BridgeTokenSelector/BridgeTokenSelector.tsx
index d474e0c41336..db4af91618a4 100644
--- a/app/components/UI/Bridge/components/BridgeTokenSelector/BridgeTokenSelector.tsx
+++ b/app/components/UI/Bridge/components/BridgeTokenSelector/BridgeTokenSelector.tsx
@@ -420,7 +420,7 @@ export const BridgeTokenSelector: React.FC = () => {
         >
           <ButtonIcon
             iconName={IconName.Info}
-            size={ButtonIconSize.Md}
+            size={ButtonIconSize.Sm}
             onPress={() => handleInfoButtonPress(item)}
             iconProps={{ color: IconColor.IconAlternative }}
           />
diff --git a/app/components/UI/Bridge/components/BridgeTokenSelector/NetworkListModal.tsx b/app/components/UI/Bridge/components/BridgeTokenSelector/NetworkListModal.tsx
index 474a8048cf92..7509ecb510a1 100644
--- a/app/components/UI/Bridge/components/BridgeTokenSelector/NetworkListModal.tsx
+++ b/app/components/UI/Bridge/components/BridgeTokenSelector/NetworkListModal.tsx
@@ -1,5 +1,5 @@
 import React, { useCallback, useRef } from 'react';
-import { ScrollView } from 'react-native';
+import { ScrollView } from 'react-native-gesture-handler'; // Must use this to make sure scroll works inside a bottom sheet on Android
 import { useSelector, useDispatch } from 'react-redux';
 import { Icon, IconName, IconSize } from '@metamask/design-system-react-native';
 import { IconName as ComponentLibraryIconName } from '../../../../../component-library/components/Icons/Icon';
diff --git a/app/components/UI/Bridge/components/FlipQuoteButton/__snapshots__/FlipQuoteButton.test.tsx.snap b/app/components/UI/Bridge/components/FlipQuoteButton/__snapshots__/FlipQuoteButton.test.tsx.snap
index 4a39727ed9de..d9d5fce95072 100644
--- a/app/components/UI/Bridge/components/FlipQuoteButton/__snapshots__/FlipQuoteButton.test.tsx.snap
+++ b/app/components/UI/Bridge/components/FlipQuoteButton/__snapshots__/FlipQuoteButton.test.tsx.snap
@@ -18,7 +18,7 @@ exports[`FLipQuoteButton Rendering renders with disabled state 1`] = `
   <View
     style={
       {
-        "backgroundColor": "#b7bbc866",
+        "backgroundColor": "#b4b4b566",
         "height": 1,
         "position": "absolute",
         "width": "100%",
@@ -43,7 +43,7 @@ exports[`FLipQuoteButton Rendering renders with disabled state 1`] = `
       style={
         {
           "alignItems": "center",
-          "backgroundColor": "#3c4d9d0f",
+          "backgroundColor": "#b4b4b528",
           "borderRadius": 10000,
           "height": 44,
           "justifyContent": "center",
@@ -54,7 +54,7 @@ exports[`FLipQuoteButton Rendering renders with disabled state 1`] = `
       testID="arrow-button"
     >
       <SvgMock
-        color="#121314"
+        color="#131416"
         fill="currentColor"
         height={24}
         name="SwapVertical"
@@ -89,7 +89,7 @@ exports[`FLipQuoteButton Rendering renders with enabled state 1`] = `
   <View
     style={
       {
-        "backgroundColor": "#b7bbc866",
+        "backgroundColor": "#b4b4b566",
         "height": 1,
         "position": "absolute",
         "width": "100%",
@@ -117,7 +117,7 @@ exports[`FLipQuoteButton Rendering renders with enabled state 1`] = `
       style={
         {
           "alignItems": "center",
-          "backgroundColor": "#3c4d9d0f",
+          "backgroundColor": "#b4b4b528",
           "borderRadius": 10000,
           "height": 44,
           "justifyContent": "center",
@@ -128,7 +128,7 @@ exports[`FLipQuoteButton Rendering renders with enabled state 1`] = `
       testID="arrow-button"
     >
       <SvgMock
-        color="#121314"
+        color="#131416"
         fill="currentColor"
         height={24}
         name="SwapVertical"
diff --git a/app/components/UI/Bridge/components/GaslessQuickPickOptions/abTestConfig.ts b/app/components/UI/Bridge/components/GaslessQuickPickOptions/abTestConfig.ts
new file mode 100644
index 000000000000..59ede900be8d
--- /dev/null
+++ b/app/components/UI/Bridge/components/GaslessQuickPickOptions/abTestConfig.ts
@@ -0,0 +1,24 @@
+export const NUMPAD_QUICK_ACTIONS_AB_KEY =
+  'swapsSWAPS4135AbtestNumpadQuickAmounts';
+
+export enum NumpadQuickActionsVariant {
+  Control = 'control',
+  Treatment = 'treatment',
+}
+export type NumpadQuickAction = number | 'MAX';
+
+export const NUMPAD_QUICK_ACTIONS_VARIANTS: Record<
+  NumpadQuickActionsVariant,
+  readonly NumpadQuickAction[]
+> = {
+  [NumpadQuickActionsVariant.Control]: [25, 50, 75, 'MAX'],
+  [NumpadQuickActionsVariant.Treatment]: [50, 75, 90, 'MAX'],
+};
+
+export const NUMPAD_QUICK_ACTIONS_NO_MAX_VARIANTS: Record<
+  NumpadQuickActionsVariant,
+  readonly number[]
+> = {
+  [NumpadQuickActionsVariant.Control]: [25, 50, 75, 90],
+  [NumpadQuickActionsVariant.Treatment]: [50, 75, 85, 95],
+};
diff --git a/app/components/UI/Bridge/components/GaslessQuickPickOptions/index.test.tsx b/app/components/UI/Bridge/components/GaslessQuickPickOptions/index.test.tsx
index 4f8c9cb3525e..5e42c9a404b7 100644
--- a/app/components/UI/Bridge/components/GaslessQuickPickOptions/index.test.tsx
+++ b/app/components/UI/Bridge/components/GaslessQuickPickOptions/index.test.tsx
@@ -1,10 +1,23 @@
 import React from 'react';
-import { act, fireEvent, render } from '@testing-library/react-native';
+import { act, fireEvent } from '@testing-library/react-native';
 import { GaslessQuickPickOptions } from './index';
 import { Keys } from '../../../../Base/Keypad';
 import { BridgeToken } from '../../types';
 import { CHAIN_IDS } from '@metamask/transaction-controller';
 import { BigNumber } from 'ethers';
+import { useAnalytics } from '../../../../hooks/useAnalytics/useAnalytics';
+import renderWithProvider from '../../../../../util/test/renderWithProvider';
+
+jest.mock('../../../../../core/Engine', () => ({
+  __esModule: true,
+  default: {
+    context: {
+      BridgeController: {
+        trackUnifiedSwapBridgeEvent: jest.fn(),
+      },
+    },
+  },
+}));
 
 // Mock useLatestBalance to control tokenBalance in tests
 jest.mock('../../hooks/useLatestBalance', () => ({
@@ -16,6 +29,10 @@ jest.mock('../../hooks/useShouldRenderMaxOption', () => ({
   useShouldRenderMaxOption: jest.fn(() => true),
 }));
 
+jest.mock('../../../../hooks/useAnalytics/useAnalytics', () => ({
+  useAnalytics: jest.fn(),
+}));
+
 import { useLatestBalance } from '../../hooks/useLatestBalance';
 import { useShouldRenderMaxOption } from '../../hooks/useShouldRenderMaxOption';
 
@@ -26,6 +43,14 @@ const mockUseShouldRenderMaxOption =
   useShouldRenderMaxOption as jest.MockedFunction<
     typeof useShouldRenderMaxOption
   >;
+const mockUseAnalytics = useAnalytics as jest.MockedFunction<
+  typeof useAnalytics
+>;
+const actualUseAnalytics: typeof useAnalytics = jest.requireActual(
+  '../../../../hooks/useAnalytics/useAnalytics',
+).useAnalytics;
+const renderWithRedux = (component: React.ReactElement) =>
+  renderWithProvider(component, undefined, false);
 
 describe('GaslessQuickPickOptions', () => {
   const mockOnChange = jest.fn();
@@ -48,6 +73,10 @@ describe('GaslessQuickPickOptions', () => {
     mockUseShouldRenderMaxOption.mockReturnValue(true);
     mockUseLatestBalance.mockReset();
     mockUseLatestBalance.mockReturnValue(mockTokenBalance);
+    mockUseAnalytics.mockImplementation(() => ({
+      ...actualUseAnalytics(),
+      trackEvent: jest.fn(),
+    }));
   });
 
   afterEach(() => {
@@ -56,7 +85,7 @@ describe('GaslessQuickPickOptions', () => {
 
   describe('rendering', () => {
     it('renders QuickPickButtons when tokenBalance is provided', () => {
-      const { getByText } = render(
+      const { getByText } = renderWithRedux(
         <GaslessQuickPickOptions
           onChange={mockOnChange}
           token={mockToken}
@@ -73,7 +102,7 @@ describe('GaslessQuickPickOptions', () => {
     it('renders QuickPickButtons even when tokenBalance is not provided', () => {
       mockUseLatestBalance.mockReturnValue(undefined);
 
-      const { getByText } = render(
+      const { getByText } = renderWithRedux(
         <GaslessQuickPickOptions
           onChange={mockOnChange}
           token={undefined}
@@ -90,7 +119,7 @@ describe('GaslessQuickPickOptions', () => {
     it('renders Max button when useShouldRenderMaxOption returns true', () => {
       mockUseShouldRenderMaxOption.mockReturnValue(true);
 
-      const { getByText, queryByText } = render(
+      const { getByText, queryByText } = renderWithRedux(
         <GaslessQuickPickOptions
           onChange={mockOnChange}
           token={mockToken}
@@ -110,7 +139,7 @@ describe('GaslessQuickPickOptions', () => {
     it('renders 90% button when useShouldRenderMaxOption returns false', () => {
       mockUseShouldRenderMaxOption.mockReturnValue(false);
 
-      const { getByText, queryByText } = render(
+      const { getByText, queryByText } = renderWithRedux(
         <GaslessQuickPickOptions
           onChange={mockOnChange}
           token={mockToken}
@@ -130,7 +159,7 @@ describe('GaslessQuickPickOptions', () => {
     it('passes isQuoteSponsored to useShouldRenderMaxOption', () => {
       mockUseShouldRenderMaxOption.mockReturnValue(true);
 
-      const { getByText } = render(
+      const { getByText } = renderWithRedux(
         <GaslessQuickPickOptions
           onChange={mockOnChange}
           token={mockToken}
@@ -152,7 +181,7 @@ describe('GaslessQuickPickOptions', () => {
     it('calls onMaxPress when Max button is clicked', () => {
       mockUseShouldRenderMaxOption.mockReturnValue(true);
 
-      const { getByText } = render(
+      const { getByText } = renderWithRedux(
         <GaslessQuickPickOptions
           onChange={mockOnChange}
           token={mockToken}
@@ -178,7 +207,7 @@ describe('GaslessQuickPickOptions', () => {
       };
       mockUseLatestBalance.mockReturnValue(zeroBalance);
 
-      const { getByText } = render(
+      const { getByText } = renderWithRedux(
         <GaslessQuickPickOptions
           onChange={mockOnChange}
           token={mockToken}
@@ -199,7 +228,7 @@ describe('GaslessQuickPickOptions', () => {
       };
       mockUseLatestBalance.mockReturnValue(nonZeroBalance);
 
-      const { getByText } = render(
+      const { getByText } = renderWithRedux(
         <GaslessQuickPickOptions
           onChange={mockOnChange}
           token={mockToken}
@@ -218,7 +247,7 @@ describe('GaslessQuickPickOptions', () => {
     it('shows Max button when useShouldRenderMaxOption returns true', () => {
       mockUseShouldRenderMaxOption.mockReturnValue(true);
 
-      const { getByText, queryByText } = render(
+      const { getByText, queryByText } = renderWithRedux(
         <GaslessQuickPickOptions
           onChange={mockOnChange}
           token={mockToken}
@@ -238,7 +267,7 @@ describe('GaslessQuickPickOptions', () => {
     it('shows 90% button when useShouldRenderMaxOption returns false', () => {
       mockUseShouldRenderMaxOption.mockReturnValue(false);
 
-      const { getByText, queryByText } = render(
+      const { getByText, queryByText } = renderWithRedux(
         <GaslessQuickPickOptions
           onChange={mockOnChange}
           token={mockToken}
@@ -258,7 +287,7 @@ describe('GaslessQuickPickOptions', () => {
     it('passes isQuoteSponsored to useShouldRenderMaxOption', () => {
       mockUseShouldRenderMaxOption.mockReturnValue(true);
 
-      const { getByText } = render(
+      const { getByText } = renderWithRedux(
         <GaslessQuickPickOptions
           onChange={mockOnChange}
           token={mockToken}
@@ -283,7 +312,7 @@ describe('GaslessQuickPickOptions', () => {
       mockUseLatestBalance.mockReturnValue(zeroBalance);
       mockUseShouldRenderMaxOption.mockReturnValue(false);
 
-      const { getByText } = render(
+      const { getByText } = renderWithRedux(
         <GaslessQuickPickOptions
           onChange={mockOnChange}
           token={mockToken}
@@ -305,7 +334,7 @@ describe('GaslessQuickPickOptions', () => {
     it('quick pick buttons calculate correct percentages with Max button', () => {
       mockUseShouldRenderMaxOption.mockReturnValue(true);
 
-      const { getByText } = render(
+      const { getByText } = renderWithRedux(
         <GaslessQuickPickOptions
           onChange={mockOnChange}
           token={mockToken}
@@ -363,7 +392,7 @@ describe('GaslessQuickPickOptions', () => {
     it('quick pick buttons calculate correct percentages with 90% button', () => {
       mockUseShouldRenderMaxOption.mockReturnValue(false);
 
-      const { getByText } = render(
+      const { getByText } = renderWithRedux(
         <GaslessQuickPickOptions
           onChange={mockOnChange}
           token={mockToken}
@@ -390,7 +419,7 @@ describe('GaslessQuickPickOptions', () => {
     it('does not call onChange when tokenBalance has no displayBalance', () => {
       mockUseLatestBalance.mockReturnValue(undefined);
 
-      const { getByText } = render(
+      const { getByText } = renderWithRedux(
         <GaslessQuickPickOptions
           onChange={mockOnChange}
           token={mockToken}
diff --git a/app/components/UI/Bridge/components/GaslessQuickPickOptions/index.tsx b/app/components/UI/Bridge/components/GaslessQuickPickOptions/index.tsx
index ddcde4e7e75e..537fbfef3e35 100644
--- a/app/components/UI/Bridge/components/GaslessQuickPickOptions/index.tsx
+++ b/app/components/UI/Bridge/components/GaslessQuickPickOptions/index.tsx
@@ -6,6 +6,14 @@ import { KeypadChangeData, Keys } from '../../../../Base/Keypad';
 import { useLatestBalance } from '../../hooks/useLatestBalance';
 import { BridgeToken } from '../../types';
 import { BigNumber } from 'bignumber.js';
+import { useABTest } from '../../../../../hooks';
+import {
+  NUMPAD_QUICK_ACTIONS_NO_MAX_VARIANTS,
+  NUMPAD_QUICK_ACTIONS_AB_KEY,
+  NUMPAD_QUICK_ACTIONS_VARIANTS,
+  NumpadQuickActionsVariant,
+} from './abTestConfig';
+import { useTrackInputAmountChange } from './useTrackInputAmountChange';
 
 interface GaslessQuickPickOptionsProps {
   token?: BridgeToken;
@@ -25,6 +33,15 @@ export const GaslessQuickPickOptions = ({
     decimals: token?.decimals,
     chainId: token?.chainId,
   });
+  const { variantName } = useABTest(
+    NUMPAD_QUICK_ACTIONS_AB_KEY,
+    NUMPAD_QUICK_ACTIONS_VARIANTS,
+  );
+  const selectedVariant =
+    variantName === NumpadQuickActionsVariant.Treatment
+      ? NumpadQuickActionsVariant.Treatment
+      : NumpadQuickActionsVariant.Control;
+  const trackInputAmountChange = useTrackInputAmountChange();
 
   const onQuickOptionPress = useCallback(
     (percentage: number) => () => {
@@ -40,64 +57,47 @@ export const GaslessQuickPickOptions = ({
         valueAsNumber: Number(amount),
         pressedKey: Keys.Initial,
       });
+
+      const preset = `${percentage}%`;
+      trackInputAmountChange({ inputValue: amount.toString(), preset });
     },
-    [tokenBalance, onChange, token?.decimals],
+    [tokenBalance, token?.decimals, onChange, trackInputAmountChange],
   );
 
-  const standardQuickPickOptions = useMemo(
-    () =>
-      [
-        {
-          label: '25%',
-          onPress: onQuickOptionPress(25),
-        },
-        {
-          label: '50%',
-          onPress: onQuickOptionPress(50),
-        },
-        {
-          label: '75%',
-          onPress: onQuickOptionPress(75),
-        },
-        {
-          label: '90%',
-          onPress: onQuickOptionPress(90),
-        },
-      ] satisfies QuickPickButtonOption[],
-    [onQuickOptionPress],
-  );
-
-  const gasslessQuickPickOptions = useMemo(
-    () =>
-      [
-        {
-          label: '25%',
-          onPress: onQuickOptionPress(25),
-        },
-        {
-          label: '50%',
-          onPress: onQuickOptionPress(50),
-        },
-        {
-          label: '75%',
-          onPress: onQuickOptionPress(75),
-        },
-        {
-          label: 'Max',
-          onPress: onMaxPress,
-        },
-      ] satisfies QuickPickButtonOption[],
-    [onMaxPress, onQuickOptionPress],
-  );
+  const handleTrackedMaxPress = useCallback(() => {
+    onMaxPress();
+    trackInputAmountChange({ inputValue: '', preset: 'MAX' });
+  }, [onMaxPress, trackInputAmountChange]);
 
   const shouldRenderMaxOption = useShouldRenderMaxOption(
     token,
     tokenBalance?.displayBalance,
     isQuoteSponsored,
   );
-  const quickPickOptions = shouldRenderMaxOption
-    ? gasslessQuickPickOptions
-    : standardQuickPickOptions;
+
+  const quickPickOptions = useMemo(() => {
+    const quickActions = shouldRenderMaxOption
+      ? NUMPAD_QUICK_ACTIONS_VARIANTS[selectedVariant]
+      : NUMPAD_QUICK_ACTIONS_NO_MAX_VARIANTS[selectedVariant];
+    return quickActions.map((action) => {
+      if (action === 'MAX') {
+        return {
+          label: 'Max',
+          onPress: handleTrackedMaxPress,
+        };
+      }
+
+      return {
+        label: `${action}%`,
+        onPress: onQuickOptionPress(action),
+      };
+    }) satisfies QuickPickButtonOption[];
+  }, [
+    handleTrackedMaxPress,
+    onQuickOptionPress,
+    shouldRenderMaxOption,
+    selectedVariant,
+  ]);
 
   return <QuickPickButtons options={quickPickOptions} show />;
 };
diff --git a/app/components/UI/Bridge/components/GaslessQuickPickOptions/useTrackInputAmountChange.ts b/app/components/UI/Bridge/components/GaslessQuickPickOptions/useTrackInputAmountChange.ts
new file mode 100644
index 000000000000..774346a072e8
--- /dev/null
+++ b/app/components/UI/Bridge/components/GaslessQuickPickOptions/useTrackInputAmountChange.ts
@@ -0,0 +1,37 @@
+import { useCallback } from 'react';
+import { UnifiedSwapBridgeEventName } from '@metamask/bridge-controller';
+import { useABTest } from '../../../../../hooks';
+import Engine from '../../../../../core/Engine';
+import {
+  NUMPAD_QUICK_ACTIONS_AB_KEY,
+  NUMPAD_QUICK_ACTIONS_VARIANTS,
+} from './abTestConfig';
+
+export const useTrackInputAmountChange = () => {
+  const { variantName, isActive } = useABTest(
+    NUMPAD_QUICK_ACTIONS_AB_KEY,
+    NUMPAD_QUICK_ACTIONS_VARIANTS,
+  );
+
+  return useCallback(
+    ({ inputValue, preset }: { inputValue: string; preset?: string }) => {
+      Engine.context.BridgeController.trackUnifiedSwapBridgeEvent(
+        UnifiedSwapBridgeEventName.InputChanged,
+        {
+          input: 'token_amount_source',
+          input_value: inputValue,
+          ...(preset && { input_amount_preset: preset }),
+          ...(isActive && {
+            active_ab_tests: [
+              {
+                key: NUMPAD_QUICK_ACTIONS_AB_KEY,
+                value: variantName,
+              },
+            ],
+          }),
+        },
+      );
+    },
+    [isActive, variantName],
+  );
+};
diff --git a/app/components/UI/Bridge/components/InputStepper/__snapshots__/index.test.tsx.snap b/app/components/UI/Bridge/components/InputStepper/__snapshots__/index.test.tsx.snap
index 452328077822..240b63266f79 100644
--- a/app/components/UI/Bridge/components/InputStepper/__snapshots__/index.test.tsx.snap
+++ b/app/components/UI/Bridge/components/InputStepper/__snapshots__/index.test.tsx.snap
@@ -51,7 +51,7 @@ exports[`InputStepper complete component snapshot renders complete component cor
         [
           {
             "alignItems": "center",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 9999,
             "height": 40,
             "justifyContent": "center",
@@ -59,7 +59,7 @@ exports[`InputStepper complete component snapshot renders complete component cor
             "width": 40,
           },
           {
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
           },
           {
             "transform": [
@@ -78,7 +78,7 @@ exports[`InputStepper complete component snapshot renders complete component cor
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "height": 32,
               "width": 32,
             },
@@ -104,14 +104,14 @@ exports[`InputStepper complete component snapshot renders complete component cor
           onBlur={[Function]}
           onFocus={[Function]}
           placeholder="Enter value"
-          placeholderTextColor="#686e7d"
+          placeholderTextColor="#66676a"
           showSoftInputOnFocus={false}
           style={
             {
               "backgroundColor": "#ffffff",
               "borderColor": "#4459ff",
               "borderWidth": 0,
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 40,
               "fontWeight": "400",
@@ -133,7 +133,7 @@ exports[`InputStepper complete component snapshot renders complete component cor
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -187,7 +187,7 @@ exports[`InputStepper complete component snapshot renders complete component cor
         [
           {
             "alignItems": "center",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 9999,
             "height": 40,
             "justifyContent": "center",
@@ -195,7 +195,7 @@ exports[`InputStepper complete component snapshot renders complete component cor
             "width": 40,
           },
           {
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
           },
           {
             "transform": [
@@ -214,7 +214,7 @@ exports[`InputStepper complete component snapshot renders complete component cor
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "height": 32,
               "width": 32,
             },
@@ -278,7 +278,7 @@ exports[`InputStepper complete component snapshot renders with description 1`] =
         [
           {
             "alignItems": "center",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 9999,
             "height": 40,
             "justifyContent": "center",
@@ -286,7 +286,7 @@ exports[`InputStepper complete component snapshot renders with description 1`] =
             "width": 40,
           },
           {
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
           },
           {
             "transform": [
@@ -305,7 +305,7 @@ exports[`InputStepper complete component snapshot renders with description 1`] =
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "height": 32,
               "width": 32,
             },
@@ -331,14 +331,14 @@ exports[`InputStepper complete component snapshot renders with description 1`] =
           onBlur={[Function]}
           onFocus={[Function]}
           placeholder="0"
-          placeholderTextColor="#686e7d"
+          placeholderTextColor="#66676a"
           showSoftInputOnFocus={false}
           style={
             {
               "backgroundColor": "#ffffff",
               "borderColor": "#4459ff",
               "borderWidth": 0,
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 40,
               "fontWeight": "400",
@@ -387,7 +387,7 @@ exports[`InputStepper complete component snapshot renders with description 1`] =
         [
           {
             "alignItems": "center",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 9999,
             "height": 40,
             "justifyContent": "center",
@@ -395,7 +395,7 @@ exports[`InputStepper complete component snapshot renders with description 1`] =
             "width": 40,
           },
           {
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
           },
           {
             "transform": [
@@ -414,7 +414,7 @@ exports[`InputStepper complete component snapshot renders with description 1`] =
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "height": 32,
               "width": 32,
             },
@@ -478,7 +478,7 @@ exports[`InputStepper description row should render InputStepperDescriptionRow 1
         [
           {
             "alignItems": "center",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 9999,
             "height": 40,
             "justifyContent": "center",
@@ -486,7 +486,7 @@ exports[`InputStepper description row should render InputStepperDescriptionRow 1
             "width": 40,
           },
           {
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
           },
           {
             "transform": [
@@ -505,7 +505,7 @@ exports[`InputStepper description row should render InputStepperDescriptionRow 1
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "height": 32,
               "width": 32,
             },
@@ -531,14 +531,14 @@ exports[`InputStepper description row should render InputStepperDescriptionRow 1
           onBlur={[Function]}
           onFocus={[Function]}
           placeholder="0"
-          placeholderTextColor="#686e7d"
+          placeholderTextColor="#66676a"
           showSoftInputOnFocus={false}
           style={
             {
               "backgroundColor": "#ffffff",
               "borderColor": "#4459ff",
               "borderWidth": 0,
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 40,
               "fontWeight": "400",
@@ -587,7 +587,7 @@ exports[`InputStepper description row should render InputStepperDescriptionRow 1
         [
           {
             "alignItems": "center",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 9999,
             "height": 40,
             "justifyContent": "center",
@@ -595,7 +595,7 @@ exports[`InputStepper description row should render InputStepperDescriptionRow 1
             "width": 40,
           },
           {
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
           },
           {
             "transform": [
@@ -614,7 +614,7 @@ exports[`InputStepper description row should render InputStepperDescriptionRow 1
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "height": 32,
               "width": 32,
             },
@@ -678,7 +678,7 @@ exports[`InputStepper input renders correct style when value character length is
         [
           {
             "alignItems": "center",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 9999,
             "height": 40,
             "justifyContent": "center",
@@ -686,7 +686,7 @@ exports[`InputStepper input renders correct style when value character length is
             "width": 40,
           },
           {
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
           },
           {
             "transform": [
@@ -705,7 +705,7 @@ exports[`InputStepper input renders correct style when value character length is
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "height": 32,
               "width": 32,
             },
@@ -731,14 +731,14 @@ exports[`InputStepper input renders correct style when value character length is
           onBlur={[Function]}
           onFocus={[Function]}
           placeholder="0"
-          placeholderTextColor="#686e7d"
+          placeholderTextColor="#66676a"
           showSoftInputOnFocus={false}
           style={
             {
               "backgroundColor": "#ffffff",
               "borderColor": "#4459ff",
               "borderWidth": 0,
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 40,
               "fontWeight": "400",
@@ -787,7 +787,7 @@ exports[`InputStepper input renders correct style when value character length is
         [
           {
             "alignItems": "center",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 9999,
             "height": 40,
             "justifyContent": "center",
@@ -795,7 +795,7 @@ exports[`InputStepper input renders correct style when value character length is
             "width": 40,
           },
           {
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
           },
           {
             "transform": [
@@ -814,7 +814,7 @@ exports[`InputStepper input renders correct style when value character length is
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "height": 32,
               "width": 32,
             },
@@ -878,7 +878,7 @@ exports[`InputStepper input renders correct style when value character length is
         [
           {
             "alignItems": "center",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 9999,
             "height": 40,
             "justifyContent": "center",
@@ -886,7 +886,7 @@ exports[`InputStepper input renders correct style when value character length is
             "width": 40,
           },
           {
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
           },
           {
             "transform": [
@@ -905,7 +905,7 @@ exports[`InputStepper input renders correct style when value character length is
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "height": 32,
               "width": 32,
             },
@@ -931,14 +931,14 @@ exports[`InputStepper input renders correct style when value character length is
           onBlur={[Function]}
           onFocus={[Function]}
           placeholder="0"
-          placeholderTextColor="#686e7d"
+          placeholderTextColor="#66676a"
           showSoftInputOnFocus={false}
           style={
             {
               "backgroundColor": "#ffffff",
               "borderColor": "#4459ff",
               "borderWidth": 0,
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 35,
               "fontWeight": "400",
@@ -987,7 +987,7 @@ exports[`InputStepper input renders correct style when value character length is
         [
           {
             "alignItems": "center",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 9999,
             "height": 40,
             "justifyContent": "center",
@@ -995,7 +995,7 @@ exports[`InputStepper input renders correct style when value character length is
             "width": 40,
           },
           {
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
           },
           {
             "transform": [
@@ -1014,7 +1014,7 @@ exports[`InputStepper input renders correct style when value character length is
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "height": 32,
               "width": 32,
             },
@@ -1078,7 +1078,7 @@ exports[`InputStepper input renders correct style when value character length is
         [
           {
             "alignItems": "center",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 9999,
             "height": 40,
             "justifyContent": "center",
@@ -1086,7 +1086,7 @@ exports[`InputStepper input renders correct style when value character length is
             "width": 40,
           },
           {
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
           },
           {
             "transform": [
@@ -1105,7 +1105,7 @@ exports[`InputStepper input renders correct style when value character length is
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "height": 32,
               "width": 32,
             },
@@ -1131,14 +1131,14 @@ exports[`InputStepper input renders correct style when value character length is
           onBlur={[Function]}
           onFocus={[Function]}
           placeholder="0"
-          placeholderTextColor="#686e7d"
+          placeholderTextColor="#66676a"
           showSoftInputOnFocus={false}
           style={
             {
               "backgroundColor": "#ffffff",
               "borderColor": "#4459ff",
               "borderWidth": 0,
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 30,
               "fontWeight": "400",
@@ -1187,7 +1187,7 @@ exports[`InputStepper input renders correct style when value character length is
         [
           {
             "alignItems": "center",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 9999,
             "height": 40,
             "justifyContent": "center",
@@ -1195,7 +1195,7 @@ exports[`InputStepper input renders correct style when value character length is
             "width": 40,
           },
           {
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
           },
           {
             "transform": [
@@ -1214,7 +1214,7 @@ exports[`InputStepper input renders correct style when value character length is
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "height": 32,
               "width": 32,
             },
@@ -1278,7 +1278,7 @@ exports[`InputStepper input renders correct style when value character length is
         [
           {
             "alignItems": "center",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 9999,
             "height": 40,
             "justifyContent": "center",
@@ -1286,7 +1286,7 @@ exports[`InputStepper input renders correct style when value character length is
             "width": 40,
           },
           {
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
           },
           {
             "transform": [
@@ -1305,7 +1305,7 @@ exports[`InputStepper input renders correct style when value character length is
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "height": 32,
               "width": 32,
             },
@@ -1331,14 +1331,14 @@ exports[`InputStepper input renders correct style when value character length is
           onBlur={[Function]}
           onFocus={[Function]}
           placeholder="0"
-          placeholderTextColor="#686e7d"
+          placeholderTextColor="#66676a"
           showSoftInputOnFocus={false}
           style={
             {
               "backgroundColor": "#ffffff",
               "borderColor": "#4459ff",
               "borderWidth": 0,
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 25,
               "fontWeight": "400",
@@ -1387,7 +1387,7 @@ exports[`InputStepper input renders correct style when value character length is
         [
           {
             "alignItems": "center",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 9999,
             "height": 40,
             "justifyContent": "center",
@@ -1395,7 +1395,7 @@ exports[`InputStepper input renders correct style when value character length is
             "width": 40,
           },
           {
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
           },
           {
             "transform": [
@@ -1414,7 +1414,7 @@ exports[`InputStepper input renders correct style when value character length is
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "height": 32,
               "width": 32,
             },
@@ -1478,7 +1478,7 @@ exports[`InputStepper input renders correct style when value character length is
         [
           {
             "alignItems": "center",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 9999,
             "height": 40,
             "justifyContent": "center",
@@ -1486,7 +1486,7 @@ exports[`InputStepper input renders correct style when value character length is
             "width": 40,
           },
           {
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
           },
           {
             "transform": [
@@ -1505,7 +1505,7 @@ exports[`InputStepper input renders correct style when value character length is
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "height": 32,
               "width": 32,
             },
@@ -1531,14 +1531,14 @@ exports[`InputStepper input renders correct style when value character length is
           onBlur={[Function]}
           onFocus={[Function]}
           placeholder="0"
-          placeholderTextColor="#686e7d"
+          placeholderTextColor="#66676a"
           showSoftInputOnFocus={false}
           style={
             {
               "backgroundColor": "#ffffff",
               "borderColor": "#4459ff",
               "borderWidth": 0,
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 20,
               "fontWeight": "400",
@@ -1587,7 +1587,7 @@ exports[`InputStepper input renders correct style when value character length is
         [
           {
             "alignItems": "center",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 9999,
             "height": 40,
             "justifyContent": "center",
@@ -1595,7 +1595,7 @@ exports[`InputStepper input renders correct style when value character length is
             "width": 40,
           },
           {
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
           },
           {
             "transform": [
@@ -1614,7 +1614,7 @@ exports[`InputStepper input renders correct style when value character length is
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "height": 32,
               "width": 32,
             },
@@ -1678,7 +1678,7 @@ exports[`InputStepper minus button renders correct style of minus button when di
         [
           {
             "alignItems": "center",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 9999,
             "height": 40,
             "justifyContent": "center",
@@ -1686,7 +1686,7 @@ exports[`InputStepper minus button renders correct style of minus button when di
             "width": 40,
           },
           {
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
           },
           {
             "transform": [
@@ -1705,7 +1705,7 @@ exports[`InputStepper minus button renders correct style of minus button when di
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "height": 32,
               "width": 32,
             },
@@ -1731,14 +1731,14 @@ exports[`InputStepper minus button renders correct style of minus button when di
           onBlur={[Function]}
           onFocus={[Function]}
           placeholder="0"
-          placeholderTextColor="#686e7d"
+          placeholderTextColor="#66676a"
           showSoftInputOnFocus={false}
           style={
             {
               "backgroundColor": "#ffffff",
               "borderColor": "#4459ff",
               "borderWidth": 0,
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 40,
               "fontWeight": "400",
@@ -1787,7 +1787,7 @@ exports[`InputStepper minus button renders correct style of minus button when di
         [
           {
             "alignItems": "center",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 9999,
             "height": 40,
             "justifyContent": "center",
@@ -1795,7 +1795,7 @@ exports[`InputStepper minus button renders correct style of minus button when di
             "width": 40,
           },
           {
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
           },
           {
             "transform": [
@@ -1814,7 +1814,7 @@ exports[`InputStepper minus button renders correct style of minus button when di
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "height": 32,
               "width": 32,
             },
@@ -1878,7 +1878,7 @@ exports[`InputStepper minus button renders correct style of minus button when en
         [
           {
             "alignItems": "center",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 9999,
             "height": 40,
             "justifyContent": "center",
@@ -1886,7 +1886,7 @@ exports[`InputStepper minus button renders correct style of minus button when en
             "width": 40,
           },
           {
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
           },
           {
             "transform": [
@@ -1905,7 +1905,7 @@ exports[`InputStepper minus button renders correct style of minus button when en
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "height": 32,
               "width": 32,
             },
@@ -1931,14 +1931,14 @@ exports[`InputStepper minus button renders correct style of minus button when en
           onBlur={[Function]}
           onFocus={[Function]}
           placeholder="0"
-          placeholderTextColor="#686e7d"
+          placeholderTextColor="#66676a"
           showSoftInputOnFocus={false}
           style={
             {
               "backgroundColor": "#ffffff",
               "borderColor": "#4459ff",
               "borderWidth": 0,
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 40,
               "fontWeight": "400",
@@ -1987,7 +1987,7 @@ exports[`InputStepper minus button renders correct style of minus button when en
         [
           {
             "alignItems": "center",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 9999,
             "height": 40,
             "justifyContent": "center",
@@ -1995,7 +1995,7 @@ exports[`InputStepper minus button renders correct style of minus button when en
             "width": 40,
           },
           {
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
           },
           {
             "transform": [
@@ -2014,7 +2014,7 @@ exports[`InputStepper minus button renders correct style of minus button when en
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "height": 32,
               "width": 32,
             },
@@ -2078,7 +2078,7 @@ exports[`InputStepper plus button renders correct style of plus button when disa
         [
           {
             "alignItems": "center",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 9999,
             "height": 40,
             "justifyContent": "center",
@@ -2086,7 +2086,7 @@ exports[`InputStepper plus button renders correct style of plus button when disa
             "width": 40,
           },
           {
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
           },
           {
             "transform": [
@@ -2105,7 +2105,7 @@ exports[`InputStepper plus button renders correct style of plus button when disa
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "height": 32,
               "width": 32,
             },
@@ -2131,14 +2131,14 @@ exports[`InputStepper plus button renders correct style of plus button when disa
           onBlur={[Function]}
           onFocus={[Function]}
           placeholder="0"
-          placeholderTextColor="#686e7d"
+          placeholderTextColor="#66676a"
           showSoftInputOnFocus={false}
           style={
             {
               "backgroundColor": "#ffffff",
               "borderColor": "#4459ff",
               "borderWidth": 0,
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 40,
               "fontWeight": "400",
@@ -2187,7 +2187,7 @@ exports[`InputStepper plus button renders correct style of plus button when disa
         [
           {
             "alignItems": "center",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 9999,
             "height": 40,
             "justifyContent": "center",
@@ -2195,7 +2195,7 @@ exports[`InputStepper plus button renders correct style of plus button when disa
             "width": 40,
           },
           {
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
           },
           {
             "transform": [
@@ -2214,7 +2214,7 @@ exports[`InputStepper plus button renders correct style of plus button when disa
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "height": 32,
               "width": 32,
             },
@@ -2278,7 +2278,7 @@ exports[`InputStepper plus button renders correct style of plus button when enab
         [
           {
             "alignItems": "center",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 9999,
             "height": 40,
             "justifyContent": "center",
@@ -2286,7 +2286,7 @@ exports[`InputStepper plus button renders correct style of plus button when enab
             "width": 40,
           },
           {
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
           },
           {
             "transform": [
@@ -2305,7 +2305,7 @@ exports[`InputStepper plus button renders correct style of plus button when enab
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "height": 32,
               "width": 32,
             },
@@ -2331,14 +2331,14 @@ exports[`InputStepper plus button renders correct style of plus button when enab
           onBlur={[Function]}
           onFocus={[Function]}
           placeholder="0"
-          placeholderTextColor="#686e7d"
+          placeholderTextColor="#66676a"
           showSoftInputOnFocus={false}
           style={
             {
               "backgroundColor": "#ffffff",
               "borderColor": "#4459ff",
               "borderWidth": 0,
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 40,
               "fontWeight": "400",
@@ -2387,7 +2387,7 @@ exports[`InputStepper plus button renders correct style of plus button when enab
         [
           {
             "alignItems": "center",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 9999,
             "height": 40,
             "justifyContent": "center",
@@ -2395,7 +2395,7 @@ exports[`InputStepper plus button renders correct style of plus button when enab
             "width": 40,
           },
           {
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
           },
           {
             "transform": [
@@ -2414,7 +2414,7 @@ exports[`InputStepper plus button renders correct style of plus button when enab
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "height": 32,
               "width": 32,
             },
diff --git a/app/components/UI/Bridge/components/MarketClosedBottomSheets/__snapshots__/MarketClosedBottomSheet.test.tsx.snap b/app/components/UI/Bridge/components/MarketClosedBottomSheets/__snapshots__/MarketClosedBottomSheet.test.tsx.snap
index 494a49072613..6d46925b885c 100644
--- a/app/components/UI/Bridge/components/MarketClosedBottomSheets/__snapshots__/MarketClosedBottomSheet.test.tsx.snap
+++ b/app/components/UI/Bridge/components/MarketClosedBottomSheets/__snapshots__/MarketClosedBottomSheet.test.tsx.snap
@@ -34,7 +34,7 @@ exports[`MarketClosedBottomSheet renders correctly 1`] = `
       style={
         [
           {
-            "backgroundColor": "#3f434a66",
+            "backgroundColor": "#0a0d135c",
             "bottom": 0,
             "left": 0,
             "position": "absolute",
@@ -84,7 +84,7 @@ exports[`MarketClosedBottomSheet renders correctly 1`] = `
           [
             {
               "backgroundColor": "#ffffff",
-              "borderColor": "#b7bbc866",
+              "borderColor": "#b4b4b566",
               "borderTopLeftRadius": 24,
               "borderTopRightRadius": 24,
               "borderWidth": 1,
@@ -121,7 +121,7 @@ exports[`MarketClosedBottomSheet renders correctly 1`] = `
           <View
             style={
               {
-                "backgroundColor": "#b7bbc866",
+                "backgroundColor": "#b4b4b566",
                 "borderRadius": 2,
                 "height": 4,
                 "width": 40,
@@ -170,7 +170,7 @@ exports[`MarketClosedBottomSheet renders correctly 1`] = `
               style={
                 [
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Bold",
                     "fontSize": 16,
                     "fontWeight": 700,
@@ -210,7 +210,7 @@ exports[`MarketClosedBottomSheet renders correctly 1`] = `
                 }
               >
                 <SvgMock
-                  color="#121314"
+                  color="#131416"
                   fill="currentColor"
                   height={24}
                   name="Close"
@@ -237,7 +237,7 @@ exports[`MarketClosedBottomSheet renders correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -286,7 +286,7 @@ exports[`MarketClosedBottomSheet renders correctly 1`] = `
               {
                 "alignItems": "center",
                 "alignSelf": "flex-start",
-                "backgroundColor": "#3c4d9d0f",
+                "backgroundColor": "#b4b4b528",
                 "borderColor": "transparent",
                 "borderRadius": 12,
                 "borderWidth": 1,
@@ -304,7 +304,7 @@ exports[`MarketClosedBottomSheet renders correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Medium",
                   "fontSize": 16,
                   "letterSpacing": 0,
diff --git a/app/components/UI/Bridge/components/NetworkRow.tsx b/app/components/UI/Bridge/components/NetworkRow.tsx
index 9ef6ab914be2..c7dbe21a8e4e 100644
--- a/app/components/UI/Bridge/components/NetworkRow.tsx
+++ b/app/components/UI/Bridge/components/NetworkRow.tsx
@@ -3,7 +3,6 @@ import { StyleSheet } from 'react-native';
 import { Box } from '../../Box/Box';
 import Text, {
   TextVariant,
-  TextColor,
 } from '../../../../component-library/components/Texts/Text';
 import { useStyles } from '../../../../component-library/hooks';
 import { FlexDirection, AlignItems } from '../../Box/box.types';
@@ -28,7 +27,6 @@ const createStyles = () =>
     },
     noNetworkFeeContainer: {
       alignSelf: 'center',
-      height: 22,
     },
   });
 
@@ -68,10 +66,17 @@ export const NetworkRow: React.FC<NetworkRowProps> = ({
             <TagColored
               color={TagColor.Success}
               style={styles.noNetworkFeeContainer}
+              labelProps={{
+                variant: TextVariant.BodySM,
+                style: {
+                  textTransform: 'none',
+                  textAlign: 'center',
+                  bottom: 1,
+                  fontWeight: 'normal',
+                },
+              }}
             >
-              <Text variant={TextVariant.BodySM} color={TextColor.Success}>
-                {strings('networks.no_network_fee')}
-              </Text>
+              {strings('networks.no_network_fee')}
             </TagColored>
           ) : null}
         </Box>
diff --git a/app/components/UI/Bridge/components/QuoteDetailsCard/QuoteDetailsCard.styles.ts b/app/components/UI/Bridge/components/QuoteDetailsCard/QuoteDetailsCard.styles.ts
index 9e44e963c55f..8fd536d1d07e 100644
--- a/app/components/UI/Bridge/components/QuoteDetailsCard/QuoteDetailsCard.styles.ts
+++ b/app/components/UI/Bridge/components/QuoteDetailsCard/QuoteDetailsCard.styles.ts
@@ -48,9 +48,6 @@ const createStyles = ({ colors }: Theme) =>
       height: 16,
       marginTop: 0.5,
     },
-    gasFeesSponsoredContainer: {
-      height: 22,
-    },
   });
 
 export default createStyles;
diff --git a/app/components/UI/Bridge/components/QuoteDetailsCard/QuoteDetailsCard.test.tsx b/app/components/UI/Bridge/components/QuoteDetailsCard/QuoteDetailsCard.test.tsx
index c6202a68b0f6..9e4c3348eca0 100644
--- a/app/components/UI/Bridge/components/QuoteDetailsCard/QuoteDetailsCard.test.tsx
+++ b/app/components/UI/Bridge/components/QuoteDetailsCard/QuoteDetailsCard.test.tsx
@@ -28,7 +28,7 @@ jest.mock('rive-react-native', () => {
 });
 
 jest.mock('react-native-fade-in-image', () => {
-  const React = jest.requireActual('react');
+  const ReactMock = jest.requireActual('react');
   const { View } = jest.requireActual('react-native');
   return {
     __esModule: true,
@@ -38,7 +38,7 @@ jest.mock('react-native-fade-in-image', () => {
     }: {
       children: React.ReactNode;
       placeholderStyle?: unknown;
-    }) => React.createElement(View, { style: placeholderStyle }, children),
+    }) => ReactMock.createElement(View, { style: placeholderStyle }, children),
   };
 });
 
@@ -117,15 +117,15 @@ jest.mock('../../../../UI/Rewards/hooks/useLinkAccountAddress', () => ({
 jest.mock(
   '../../../../UI/Rewards/components/AddRewardsAccount/AddRewardsAccount',
   () => {
-    const React = jest.requireActual('react');
+    const ReactMock = jest.requireActual('react');
     const { View, Text } = jest.requireActual('react-native');
     return {
       __esModule: true,
       default: ({ testID }: { testID?: string }) =>
-        React.createElement(
+        ReactMock.createElement(
           View,
           { testID },
-          React.createElement(Text, null, 'Add Rewards Account'),
+          ReactMock.createElement(Text, null, 'Add Rewards Account'),
         ),
     };
   },
@@ -262,6 +262,10 @@ const testState = createBridgeTestState({
   },
 });
 
+const QuoteDetailsCardTestScreen = () => (
+  <QuoteDetailsCard hasInsufficientBalance={false} />
+);
+
 describe('QuoteDetailsCard', () => {
   beforeEach(() => {
     jest.clearAllMocks();
@@ -269,7 +273,7 @@ describe('QuoteDetailsCard', () => {
 
   it('renders initial state', () => {
     const { toJSON } = renderScreen(
-      QuoteDetailsCard,
+      QuoteDetailsCardTestScreen,
       {
         name: Routes.BRIDGE.ROOT,
       },
@@ -280,7 +284,7 @@ describe('QuoteDetailsCard', () => {
 
   it('displays fee amount', () => {
     const { getByText } = renderScreen(
-      QuoteDetailsCard,
+      QuoteDetailsCardTestScreen,
       {
         name: Routes.BRIDGE.ROOT,
       },
@@ -292,7 +296,7 @@ describe('QuoteDetailsCard', () => {
 
   it('displays quote rate', () => {
     const { getByText } = renderScreen(
-      QuoteDetailsCard,
+      QuoteDetailsCardTestScreen,
       {
         name: Routes.BRIDGE.ROOT,
       },
@@ -304,7 +308,7 @@ describe('QuoteDetailsCard', () => {
 
   it('navigates to slippage modal on edit press', () => {
     const { getByTestId } = renderScreen(
-      QuoteDetailsCard,
+      QuoteDetailsCardTestScreen,
       {
         name: Routes.BRIDGE.ROOT,
       },
@@ -327,7 +331,7 @@ describe('QuoteDetailsCard', () => {
 
   it('displays slippage value', () => {
     const { getByText } = renderScreen(
-      QuoteDetailsCard,
+      QuoteDetailsCardTestScreen,
       {
         name: Routes.BRIDGE.ROOT,
       },
@@ -365,7 +369,7 @@ describe('QuoteDetailsCard', () => {
     }));
 
     const { getByText } = renderScreen(
-      QuoteDetailsCard,
+      QuoteDetailsCardTestScreen,
       {
         name: Routes.BRIDGE.ROOT,
       },
@@ -399,7 +403,7 @@ describe('QuoteDetailsCard', () => {
     }));
 
     const { getByText } = renderScreen(
-      QuoteDetailsCard,
+      QuoteDetailsCardTestScreen,
       {
         name: Routes.BRIDGE.ROOT,
       },
@@ -439,7 +443,7 @@ describe('QuoteDetailsCard', () => {
     }));
 
     const { getByText, queryByText } = renderScreen(
-      QuoteDetailsCard,
+      QuoteDetailsCardTestScreen,
       { name: Routes.BRIDGE.ROOT },
       { state: testState },
     );
@@ -477,7 +481,7 @@ describe('QuoteDetailsCard', () => {
     }));
 
     const { getByLabelText } = renderScreen(
-      QuoteDetailsCard,
+      QuoteDetailsCardTestScreen,
       { name: Routes.BRIDGE.ROOT },
       { state: testState },
     );
@@ -514,7 +518,7 @@ describe('QuoteDetailsCard', () => {
     }));
 
     const { queryByTestId } = renderScreen(
-      QuoteDetailsCard,
+      QuoteDetailsCardTestScreen,
       { name: Routes.BRIDGE.ROOT },
       { state: testState },
     );
@@ -547,7 +551,7 @@ describe('QuoteDetailsCard', () => {
     }));
 
     const { getByLabelText } = renderScreen(
-      QuoteDetailsCard,
+      QuoteDetailsCardTestScreen,
       { name: Routes.BRIDGE.ROOT },
       { state: testState },
     );
@@ -567,7 +571,7 @@ describe('QuoteDetailsCard', () => {
 
   it('handles quote info navigation', () => {
     const { getByLabelText } = renderScreen(
-      QuoteDetailsCard,
+      QuoteDetailsCardTestScreen,
       { name: Routes.BRIDGE.ROOT },
       { state: testState },
     );
@@ -612,7 +616,7 @@ describe('QuoteDetailsCard', () => {
     }));
 
     const { queryByLabelText } = renderScreen(
-      QuoteDetailsCard,
+      QuoteDetailsCardTestScreen,
       { name: Routes.BRIDGE.ROOT },
       { state: testState },
     );
@@ -647,7 +651,7 @@ describe('QuoteDetailsCard', () => {
     }));
 
     const { getByText, queryByLabelText } = renderScreen(
-      QuoteDetailsCard,
+      QuoteDetailsCardTestScreen,
       { name: Routes.BRIDGE.ROOT },
       { state: testState },
     );
@@ -699,7 +703,7 @@ describe('QuoteDetailsCard', () => {
 
       // When rendering the component
       const { getByText, getByTestId } = renderScreen(
-        QuoteDetailsCard,
+        QuoteDetailsCardTestScreen,
         { name: Routes.BRIDGE.ROOT },
         { state: testState },
       );
@@ -724,7 +728,7 @@ describe('QuoteDetailsCard', () => {
 
       // When rendering the component
       const { getByText, getByTestId } = renderScreen(
-        QuoteDetailsCard,
+        QuoteDetailsCardTestScreen,
         { name: Routes.BRIDGE.ROOT },
         { state: testState },
       );
@@ -752,7 +756,7 @@ describe('QuoteDetailsCard', () => {
 
       // When rendering the component
       const { queryByText } = renderScreen(
-        QuoteDetailsCard,
+        QuoteDetailsCardTestScreen,
         { name: Routes.BRIDGE.ROOT },
         { state: testState },
       );
@@ -787,7 +791,7 @@ describe('QuoteDetailsCard', () => {
 
       // When rendering the component
       const { getByText, getByTestId, queryByTestId } = renderScreen(
-        QuoteDetailsCard,
+        QuoteDetailsCardTestScreen,
         { name: Routes.BRIDGE.ROOT },
         { state: testState },
       );
@@ -817,7 +821,7 @@ describe('QuoteDetailsCard', () => {
 
       // When rendering the component
       const { getByTestId } = renderScreen(
-        QuoteDetailsCard,
+        QuoteDetailsCardTestScreen,
         { name: Routes.BRIDGE.ROOT },
         { state: testState },
       );
@@ -841,7 +845,7 @@ describe('QuoteDetailsCard', () => {
 
       // When rendering the component
       const { getByText, getByTestId } = renderScreen(
-        QuoteDetailsCard,
+        QuoteDetailsCardTestScreen,
         { name: Routes.BRIDGE.ROOT },
         { state: testState },
       );
@@ -868,7 +872,7 @@ describe('QuoteDetailsCard', () => {
 
       // When rendering the component
       const { getByText, getByTestId } = renderScreen(
-        QuoteDetailsCard,
+        QuoteDetailsCardTestScreen,
         { name: Routes.BRIDGE.ROOT },
         { state: testState },
       );
@@ -893,7 +897,7 @@ describe('QuoteDetailsCard', () => {
 
       // When rendering the component
       const { getByLabelText } = renderScreen(
-        QuoteDetailsCard,
+        QuoteDetailsCardTestScreen,
         { name: Routes.BRIDGE.ROOT },
         { state: testState },
       );
@@ -918,7 +922,7 @@ describe('QuoteDetailsCard', () => {
 
       // When rendering the component
       const { getByText, getByTestId } = renderScreen(
-        QuoteDetailsCard,
+        QuoteDetailsCardTestScreen,
         { name: Routes.BRIDGE.ROOT },
         { state: testState },
       );
@@ -943,7 +947,7 @@ describe('QuoteDetailsCard', () => {
 
       // When rendering the component
       const { getByText, getByTestId } = renderScreen(
-        QuoteDetailsCard,
+        QuoteDetailsCardTestScreen,
         { name: Routes.BRIDGE.ROOT },
         { state: testState },
       );
@@ -986,7 +990,7 @@ describe('QuoteDetailsCard', () => {
 
       // When rendering the component
       const { getByText, getByTestId } = renderScreen(
-        QuoteDetailsCard,
+        QuoteDetailsCardTestScreen,
         { name: Routes.BRIDGE.ROOT },
         { state: testState },
       );
@@ -1014,7 +1018,7 @@ describe('QuoteDetailsCard', () => {
 
       // When rendering the component
       const { getByLabelText } = renderScreen(
-        QuoteDetailsCard,
+        QuoteDetailsCardTestScreen,
         { name: Routes.BRIDGE.ROOT },
         { state: testState },
       );
diff --git a/app/components/UI/Bridge/components/QuoteDetailsCard/QuoteDetailsCard.tsx b/app/components/UI/Bridge/components/QuoteDetailsCard/QuoteDetailsCard.tsx
index f904702652ea..68f838f74d1d 100644
--- a/app/components/UI/Bridge/components/QuoteDetailsCard/QuoteDetailsCard.tsx
+++ b/app/components/UI/Bridge/components/QuoteDetailsCard/QuoteDetailsCard.tsx
@@ -39,12 +39,12 @@ import AddRewardsAccount from '../../../Rewards/components/AddRewardsAccount/Add
 import QuoteCountdownTimer from '../QuoteCountdownTimer';
 import QuoteDetailsRecipientKeyValueRow from '../QuoteDetailsRecipientKeyValueRow/QuoteDetailsRecipientKeyValueRow';
 import { toSentenceCase } from '../../../../../util/string';
-import { getGasFeesSponsoredNetworkEnabled } from '../../../../../selectors/featureFlagController/gasFeesSponsored';
-import useIsInsufficientBalance from '../../hooks/useInsufficientBalance';
-import { useLatestBalance } from '../../hooks/useLatestBalance';
 import TagColored, {
   TagColor,
 } from '../../../../../component-library/components-temp/TagColored';
+import { useShouldRenderGasSponsoredBanner } from '../../hooks/useShouldRenderGasSponsoredBanner';
+import { isGaslessQuote } from '../../utils/isGaslessQuote';
+import { QuoteDetailsCardProps } from './QuoteDetailsCard.types';
 
 if (
   Platform.OS === 'android' &&
@@ -53,7 +53,9 @@ if (
   UIManager.setLayoutAnimationEnabledExperimental(true);
 }
 
-const QuoteDetailsCard: React.FC = () => {
+const QuoteDetailsCard: React.FC<QuoteDetailsCardProps> = ({
+  hasInsufficientBalance,
+}) => {
   const theme = useTheme();
   const navigation = useNavigation();
   const styles = createStyles(theme);
@@ -79,22 +81,6 @@ const QuoteDetailsCard: React.FC = () => {
     isQuoteLoading,
   });
 
-  const gasFeesSponsoredNetworkEnabled = useSelector(
-    getGasFeesSponsoredNetworkEnabled,
-  );
-
-  const latestSourceBalance = useLatestBalance({
-    address: sourceToken?.address,
-    decimals: sourceToken?.decimals,
-    chainId: sourceToken?.chainId,
-  });
-
-  const insufficientBal = useIsInsufficientBalance({
-    amount: sourceAmount,
-    token: sourceToken,
-    latestAtomicBalance: latestSourceBalance?.atomicBalance,
-  });
-
   const nativeTokenName = useMemo(() => {
     const chainId = sourceToken?.chainId;
     if (!chainId) return undefined;
@@ -102,21 +88,10 @@ const QuoteDetailsCard: React.FC = () => {
     return native?.symbol ?? sourceToken?.symbol ?? '';
   }, [sourceToken?.chainId, sourceToken?.symbol]);
 
-  const isCurrentNetworkGasSponsored = useMemo(() => {
-    if (!sourceToken?.chainId || !gasFeesSponsoredNetworkEnabled) {
-      return false;
-    }
-    return gasFeesSponsoredNetworkEnabled(sourceToken.chainId);
-  }, [sourceToken?.chainId, gasFeesSponsoredNetworkEnabled]);
-
-  const shouldShowGasSponsored = useMemo(() => {
-    const gasSponsored = activeQuote?.quote?.gasSponsored ?? false;
-    return gasSponsored || (insufficientBal && isCurrentNetworkGasSponsored);
-  }, [
-    activeQuote?.quote?.gasSponsored,
-    insufficientBal,
-    isCurrentNetworkGasSponsored,
-  ]);
+  const shouldShowGasSponsored = useShouldRenderGasSponsoredBanner({
+    quoteGasSponsored: activeQuote?.quote?.gasSponsored ?? false,
+    hasInsufficientBalance,
+  });
 
   const handleSlippagePress = () => {
     navigation.navigate(Routes.BRIDGE.MODALS.ROOT, {
@@ -140,9 +115,7 @@ const QuoteDetailsCard: React.FC = () => {
 
   const { networkFee, rate, priceImpact, slippage } = formattedQuoteData;
 
-  const gasIncluded = !!activeQuote?.quote.gasIncluded;
-  const gasIncluded7702 = !!activeQuote?.quote.gasIncluded7702;
-  const isGasless = gasIncluded7702 || gasIncluded;
+  const isGasless = isGaslessQuote(activeQuote?.quote);
 
   const formattedMinToTokenAmount = formatMinimumReceived(
     activeQuote?.minToTokenAmount?.amount || '0',
@@ -209,11 +182,17 @@ const QuoteDetailsCard: React.FC = () => {
               label: (
                 <TagColored
                   color={TagColor.Success}
-                  style={styles.gasFeesSponsoredContainer}
+                  labelProps={{
+                    variant: TextVariant.BodySM,
+                    style: {
+                      textTransform: 'none',
+                      textAlign: 'center',
+                      bottom: 1,
+                      fontWeight: 'normal',
+                    },
+                  }}
                 >
-                  <Text variant={TextVariant.BodySM} color={TextColor.Success}>
-                    {strings('bridge.gas_fees_sponsored')}
-                  </Text>
+                  {strings('bridge.gas_fees_sponsored')}
                 </TagColored>
               ),
             }}
diff --git a/app/components/UI/Bridge/components/QuoteDetailsCard/QuoteDetailsCard.types.ts b/app/components/UI/Bridge/components/QuoteDetailsCard/QuoteDetailsCard.types.ts
index 0cfc7c96e950..eb576aa6fa60 100644
--- a/app/components/UI/Bridge/components/QuoteDetailsCard/QuoteDetailsCard.types.ts
+++ b/app/components/UI/Bridge/components/QuoteDetailsCard/QuoteDetailsCard.types.ts
@@ -1,43 +1,3 @@
 export interface QuoteDetailsCardProps {
-  /**
-   * Source network name
-   */
-  sourceNetwork: {
-    name: string;
-    iconUrl?: string;
-  };
-  /**
-   * Destination network name
-   */
-  destNetwork: {
-    name: string;
-    iconUrl?: string;
-  };
-  /**
-   * Network fee in USD
-   */
-  networkFee: string;
-  /**
-   * Estimated time for the transaction
-   */
-  estimatedTime: string;
-  /**
-   * Quote details
-   */
-  quote: {
-    rate: string;
-    priceImpact: string;
-  };
-  /**
-   * Current slippage setting
-   */
-  slippage: string;
-  /**
-   * Callback when slippage is pressed
-   */
-  onSlippagePress: () => void;
-  /**
-   * ID for testing purposes
-   */
-  testID?: string;
+  hasInsufficientBalance: boolean;
 }
diff --git a/app/components/UI/Bridge/components/QuoteDetailsCard/__snapshots__/QuoteDetailsCard.test.tsx.snap b/app/components/UI/Bridge/components/QuoteDetailsCard/__snapshots__/QuoteDetailsCard.test.tsx.snap
index 36230cf49813..93f612e2d8b0 100644
--- a/app/components/UI/Bridge/components/QuoteDetailsCard/__snapshots__/QuoteDetailsCard.test.tsx.snap
+++ b/app/components/UI/Bridge/components/QuoteDetailsCard/__snapshots__/QuoteDetailsCard.test.tsx.snap
@@ -396,7 +396,7 @@ exports[`QuoteDetailsCard renders initial state 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -422,7 +422,7 @@ exports[`QuoteDetailsCard renders initial state 1`] = `
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#686e7d",
+                                          "color": "#66676a",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -455,7 +455,7 @@ exports[`QuoteDetailsCard renders initial state 1`] = `
                                   }
                                 >
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={16}
                                     name="Info"
@@ -503,7 +503,7 @@ exports[`QuoteDetailsCard renders initial state 1`] = `
                                   numberOfLines={1}
                                   style={
                                     {
-                                      "color": "#686e7d",
+                                      "color": "#66676a",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -561,7 +561,7 @@ exports[`QuoteDetailsCard renders initial state 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#686e7d",
+                                      "color": "#66676a",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -593,7 +593,7 @@ exports[`QuoteDetailsCard renders initial state 1`] = `
                                   }
                                 >
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={16}
                                     name="Info"
@@ -638,7 +638,7 @@ exports[`QuoteDetailsCard renders initial state 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#686e7d",
+                                      "color": "#66676a",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -697,7 +697,7 @@ exports[`QuoteDetailsCard renders initial state 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#686e7d",
+                                      "color": "#66676a",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -729,7 +729,7 @@ exports[`QuoteDetailsCard renders initial state 1`] = `
                                   }
                                 >
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={16}
                                     name="Info"
@@ -786,7 +786,7 @@ exports[`QuoteDetailsCard renders initial state 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -797,7 +797,7 @@ exports[`QuoteDetailsCard renders initial state 1`] = `
                                     0.5%
                                   </Text>
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={16}
                                     name="Edit"
@@ -858,7 +858,7 @@ exports[`QuoteDetailsCard renders initial state 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#686e7d",
+                                      "color": "#66676a",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -890,7 +890,7 @@ exports[`QuoteDetailsCard renders initial state 1`] = `
                                   }
                                 >
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={16}
                                     name="Info"
@@ -935,7 +935,7 @@ exports[`QuoteDetailsCard renders initial state 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#686e7d",
+                                      "color": "#66676a",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -981,7 +981,7 @@ exports[`QuoteDetailsCard renders initial state 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#686e7d",
+                                  "color": "#66676a",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -1025,7 +1025,7 @@ exports[`QuoteDetailsCard renders initial state 1`] = `
                                 numberOfLines={1}
                                 style={
                                   {
-                                    "color": "#686e7d",
+                                    "color": "#66676a",
                                     "flexShrink": 1,
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
@@ -1037,7 +1037,7 @@ exports[`QuoteDetailsCard renders initial state 1`] = `
                                 Select recipient
                               </Text>
                               <SvgMock
-                                color="#686e7d"
+                                color="#66676a"
                                 fill="currentColor"
                                 height={16}
                                 name="Edit"
diff --git a/app/components/UI/Bridge/components/QuoteExpiredModal/__snapshots__/QuoteExpiredModal.test.tsx.snap b/app/components/UI/Bridge/components/QuoteExpiredModal/__snapshots__/QuoteExpiredModal.test.tsx.snap
index 21b04baeefa8..2944fd3a077e 100644
--- a/app/components/UI/Bridge/components/QuoteExpiredModal/__snapshots__/QuoteExpiredModal.test.tsx.snap
+++ b/app/components/UI/Bridge/components/QuoteExpiredModal/__snapshots__/QuoteExpiredModal.test.tsx.snap
@@ -34,7 +34,7 @@ exports[`QuoteExpiredModal renders correctly 1`] = `
       style={
         [
           {
-            "backgroundColor": "#3f434a66",
+            "backgroundColor": "#0a0d135c",
             "bottom": 0,
             "left": 0,
             "position": "absolute",
@@ -84,7 +84,7 @@ exports[`QuoteExpiredModal renders correctly 1`] = `
           [
             {
               "backgroundColor": "#ffffff",
-              "borderColor": "#b7bbc866",
+              "borderColor": "#b4b4b566",
               "borderTopLeftRadius": 24,
               "borderTopRightRadius": 24,
               "borderWidth": 1,
@@ -121,7 +121,7 @@ exports[`QuoteExpiredModal renders correctly 1`] = `
           <View
             style={
               {
-                "backgroundColor": "#b7bbc866",
+                "backgroundColor": "#b4b4b566",
                 "borderRadius": 2,
                 "height": 4,
                 "width": 40,
@@ -181,7 +181,7 @@ exports[`QuoteExpiredModal renders correctly 1`] = `
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -259,7 +259,7 @@ exports[`QuoteExpiredModal renders correctly 1`] = `
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -282,7 +282,7 @@ exports[`QuoteExpiredModal renders correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -316,7 +316,7 @@ exports[`QuoteExpiredModal renders correctly 1`] = `
               {
                 "alignItems": "center",
                 "alignSelf": "flex-start",
-                "backgroundColor": "#121314",
+                "backgroundColor": "#131416",
                 "borderRadius": 12,
                 "flex": 1,
                 "flexDirection": "row",
diff --git a/app/components/UI/Bridge/components/SlippageModal/__snapshots__/CustomSlippageModal.test.tsx.snap b/app/components/UI/Bridge/components/SlippageModal/__snapshots__/CustomSlippageModal.test.tsx.snap
index eb68ae56c827..16a0030eef74 100644
--- a/app/components/UI/Bridge/components/SlippageModal/__snapshots__/CustomSlippageModal.test.tsx.snap
+++ b/app/components/UI/Bridge/components/SlippageModal/__snapshots__/CustomSlippageModal.test.tsx.snap
@@ -130,7 +130,7 @@ exports[`CustomSlippageModal confirm button is disabled when shouldDisableConfir
           [
             {
               "alignItems": "center",
-              "backgroundColor": "#3c4d9d0f",
+              "backgroundColor": "#b4b4b528",
               "borderColor": "transparent",
               "borderRadius": 12,
               "borderWidth": 1,
@@ -162,7 +162,7 @@ exports[`CustomSlippageModal confirm button is disabled when shouldDisableConfir
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "flexGrow": 0,
                 "flexShrink": 1,
                 "flexWrap": "wrap",
@@ -224,7 +224,7 @@ exports[`CustomSlippageModal confirm button is disabled when shouldDisableConfir
           [
             {
               "alignItems": "center",
-              "backgroundColor": "#121314",
+              "backgroundColor": "#131416",
               "borderRadius": 12,
               "columnGap": 8,
               "flexDirection": "row",
@@ -407,7 +407,7 @@ exports[`CustomSlippageModal confirm button is enabled when shouldDisableConfirm
           [
             {
               "alignItems": "center",
-              "backgroundColor": "#3c4d9d0f",
+              "backgroundColor": "#b4b4b528",
               "borderColor": "transparent",
               "borderRadius": 12,
               "borderWidth": 1,
@@ -439,7 +439,7 @@ exports[`CustomSlippageModal confirm button is enabled when shouldDisableConfirm
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "flexGrow": 0,
                 "flexShrink": 1,
                 "flexWrap": "wrap",
@@ -501,7 +501,7 @@ exports[`CustomSlippageModal confirm button is enabled when shouldDisableConfirm
           [
             {
               "alignItems": "center",
-              "backgroundColor": "#121314",
+              "backgroundColor": "#131416",
               "borderRadius": 12,
               "columnGap": 8,
               "flexDirection": "row",
@@ -684,7 +684,7 @@ exports[`CustomSlippageModal snapshot tests matches snapshot for complete modal
           [
             {
               "alignItems": "center",
-              "backgroundColor": "#3c4d9d0f",
+              "backgroundColor": "#b4b4b528",
               "borderColor": "transparent",
               "borderRadius": 12,
               "borderWidth": 1,
@@ -716,7 +716,7 @@ exports[`CustomSlippageModal snapshot tests matches snapshot for complete modal
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "flexGrow": 0,
                 "flexShrink": 1,
                 "flexWrap": "wrap",
@@ -778,7 +778,7 @@ exports[`CustomSlippageModal snapshot tests matches snapshot for complete modal
           [
             {
               "alignItems": "center",
-              "backgroundColor": "#121314",
+              "backgroundColor": "#131416",
               "borderRadius": 12,
               "columnGap": 8,
               "flexDirection": "row",
@@ -961,7 +961,7 @@ exports[`CustomSlippageModal snapshot tests matches snapshot with confirm disabl
           [
             {
               "alignItems": "center",
-              "backgroundColor": "#3c4d9d0f",
+              "backgroundColor": "#b4b4b528",
               "borderColor": "transparent",
               "borderRadius": 12,
               "borderWidth": 1,
@@ -993,7 +993,7 @@ exports[`CustomSlippageModal snapshot tests matches snapshot with confirm disabl
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "flexGrow": 0,
                 "flexShrink": 1,
                 "flexWrap": "wrap",
@@ -1055,7 +1055,7 @@ exports[`CustomSlippageModal snapshot tests matches snapshot with confirm disabl
           [
             {
               "alignItems": "center",
-              "backgroundColor": "#121314",
+              "backgroundColor": "#131416",
               "borderRadius": 12,
               "columnGap": 8,
               "flexDirection": "row",
@@ -1241,7 +1241,7 @@ exports[`CustomSlippageModal snapshot tests matches snapshot with description sh
           [
             {
               "alignItems": "center",
-              "backgroundColor": "#3c4d9d0f",
+              "backgroundColor": "#b4b4b528",
               "borderColor": "transparent",
               "borderRadius": 12,
               "borderWidth": 1,
@@ -1273,7 +1273,7 @@ exports[`CustomSlippageModal snapshot tests matches snapshot with description sh
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "flexGrow": 0,
                 "flexShrink": 1,
                 "flexWrap": "wrap",
@@ -1335,7 +1335,7 @@ exports[`CustomSlippageModal snapshot tests matches snapshot with description sh
           [
             {
               "alignItems": "center",
-              "backgroundColor": "#121314",
+              "backgroundColor": "#131416",
               "borderRadius": 12,
               "columnGap": 8,
               "flexDirection": "row",
diff --git a/app/components/UI/Bridge/components/SlippageModal/__snapshots__/DefaultSlippageButtonGroup.test.tsx.snap b/app/components/UI/Bridge/components/SlippageModal/__snapshots__/DefaultSlippageButtonGroup.test.tsx.snap
index 4792e1bde373..2e5e2c11a8cd 100644
--- a/app/components/UI/Bridge/components/SlippageModal/__snapshots__/DefaultSlippageButtonGroup.test.tsx.snap
+++ b/app/components/UI/Bridge/components/SlippageModal/__snapshots__/DefaultSlippageButtonGroup.test.tsx.snap
@@ -50,7 +50,7 @@ exports[`DefaultSlippageButtonGroup button variants handles mixed selected state
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -81,7 +81,7 @@ exports[`DefaultSlippageButtonGroup button variants handles mixed selected state
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "flexGrow": 0,
               "flexShrink": 1,
               "flexWrap": "wrap",
@@ -138,7 +138,7 @@ exports[`DefaultSlippageButtonGroup button variants handles mixed selected state
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "columnGap": 8,
             "flexDirection": "row",
@@ -224,7 +224,7 @@ exports[`DefaultSlippageButtonGroup button variants handles mixed selected state
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -255,7 +255,7 @@ exports[`DefaultSlippageButtonGroup button variants handles mixed selected state
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "flexGrow": 0,
               "flexShrink": 1,
               "flexWrap": "wrap",
@@ -327,7 +327,7 @@ exports[`DefaultSlippageButtonGroup button variants uses Primary variant for sel
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "columnGap": 8,
             "flexDirection": "row",
@@ -428,7 +428,7 @@ exports[`DefaultSlippageButtonGroup button variants uses Secondary variant for u
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -459,7 +459,7 @@ exports[`DefaultSlippageButtonGroup button variants uses Secondary variant for u
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "flexGrow": 0,
               "flexShrink": 1,
               "flexWrap": "wrap",
@@ -531,7 +531,7 @@ exports[`DefaultSlippageButtonGroup complete component snapshots matches snapsho
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -562,7 +562,7 @@ exports[`DefaultSlippageButtonGroup complete component snapshots matches snapsho
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "flexGrow": 0,
               "flexShrink": 1,
               "flexWrap": "wrap",
@@ -619,7 +619,7 @@ exports[`DefaultSlippageButtonGroup complete component snapshots matches snapsho
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -650,7 +650,7 @@ exports[`DefaultSlippageButtonGroup complete component snapshots matches snapsho
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "flexGrow": 0,
               "flexShrink": 1,
               "flexWrap": "wrap",
@@ -707,7 +707,7 @@ exports[`DefaultSlippageButtonGroup complete component snapshots matches snapsho
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "columnGap": 8,
             "flexDirection": "row",
@@ -793,7 +793,7 @@ exports[`DefaultSlippageButtonGroup complete component snapshots matches snapsho
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -824,7 +824,7 @@ exports[`DefaultSlippageButtonGroup complete component snapshots matches snapsho
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "flexGrow": 0,
               "flexShrink": 1,
               "flexWrap": "wrap",
@@ -881,7 +881,7 @@ exports[`DefaultSlippageButtonGroup complete component snapshots matches snapsho
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -912,7 +912,7 @@ exports[`DefaultSlippageButtonGroup complete component snapshots matches snapsho
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "flexGrow": 0,
               "flexShrink": 1,
               "flexWrap": "wrap",
@@ -984,7 +984,7 @@ exports[`DefaultSlippageButtonGroup complete component snapshots matches snapsho
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "columnGap": 8,
             "flexDirection": "row",
@@ -1070,7 +1070,7 @@ exports[`DefaultSlippageButtonGroup complete component snapshots matches snapsho
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -1101,7 +1101,7 @@ exports[`DefaultSlippageButtonGroup complete component snapshots matches snapsho
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "flexGrow": 0,
               "flexShrink": 1,
               "flexWrap": "wrap",
@@ -1158,7 +1158,7 @@ exports[`DefaultSlippageButtonGroup complete component snapshots matches snapsho
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -1189,7 +1189,7 @@ exports[`DefaultSlippageButtonGroup complete component snapshots matches snapsho
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "flexGrow": 0,
               "flexShrink": 1,
               "flexWrap": "wrap",
@@ -1261,7 +1261,7 @@ exports[`DefaultSlippageButtonGroup complete component snapshots matches snapsho
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -1292,7 +1292,7 @@ exports[`DefaultSlippageButtonGroup complete component snapshots matches snapsho
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "flexGrow": 0,
               "flexShrink": 1,
               "flexWrap": "wrap",
@@ -1349,7 +1349,7 @@ exports[`DefaultSlippageButtonGroup complete component snapshots matches snapsho
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -1380,7 +1380,7 @@ exports[`DefaultSlippageButtonGroup complete component snapshots matches snapsho
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "flexGrow": 0,
               "flexShrink": 1,
               "flexWrap": "wrap",
@@ -1437,7 +1437,7 @@ exports[`DefaultSlippageButtonGroup complete component snapshots matches snapsho
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "columnGap": 8,
             "flexDirection": "row",
@@ -1538,7 +1538,7 @@ exports[`DefaultSlippageButtonGroup edge cases handles long labels 1`] = `
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -1569,7 +1569,7 @@ exports[`DefaultSlippageButtonGroup edge cases handles long labels 1`] = `
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "flexGrow": 0,
               "flexShrink": 1,
               "flexWrap": "wrap",
@@ -1626,7 +1626,7 @@ exports[`DefaultSlippageButtonGroup edge cases handles long labels 1`] = `
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "columnGap": 8,
             "flexDirection": "row",
@@ -1727,7 +1727,7 @@ exports[`DefaultSlippageButtonGroup edge cases handles many options 1`] = `
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -1758,7 +1758,7 @@ exports[`DefaultSlippageButtonGroup edge cases handles many options 1`] = `
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "flexGrow": 0,
               "flexShrink": 1,
               "flexWrap": "wrap",
@@ -1815,7 +1815,7 @@ exports[`DefaultSlippageButtonGroup edge cases handles many options 1`] = `
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -1846,7 +1846,7 @@ exports[`DefaultSlippageButtonGroup edge cases handles many options 1`] = `
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "flexGrow": 0,
               "flexShrink": 1,
               "flexWrap": "wrap",
@@ -1903,7 +1903,7 @@ exports[`DefaultSlippageButtonGroup edge cases handles many options 1`] = `
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "columnGap": 8,
             "flexDirection": "row",
@@ -1989,7 +1989,7 @@ exports[`DefaultSlippageButtonGroup edge cases handles many options 1`] = `
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -2020,7 +2020,7 @@ exports[`DefaultSlippageButtonGroup edge cases handles many options 1`] = `
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "flexGrow": 0,
               "flexShrink": 1,
               "flexWrap": "wrap",
@@ -2077,7 +2077,7 @@ exports[`DefaultSlippageButtonGroup edge cases handles many options 1`] = `
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -2108,7 +2108,7 @@ exports[`DefaultSlippageButtonGroup edge cases handles many options 1`] = `
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "flexGrow": 0,
               "flexShrink": 1,
               "flexWrap": "wrap",
@@ -2165,7 +2165,7 @@ exports[`DefaultSlippageButtonGroup edge cases handles many options 1`] = `
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -2196,7 +2196,7 @@ exports[`DefaultSlippageButtonGroup edge cases handles many options 1`] = `
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "flexGrow": 0,
               "flexShrink": 1,
               "flexWrap": "wrap",
@@ -2268,7 +2268,7 @@ exports[`DefaultSlippageButtonGroup edge cases handles options without selected
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -2299,7 +2299,7 @@ exports[`DefaultSlippageButtonGroup edge cases handles options without selected
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "flexGrow": 0,
               "flexShrink": 1,
               "flexWrap": "wrap",
@@ -2356,7 +2356,7 @@ exports[`DefaultSlippageButtonGroup edge cases handles options without selected
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -2387,7 +2387,7 @@ exports[`DefaultSlippageButtonGroup edge cases handles options without selected
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "flexGrow": 0,
               "flexShrink": 1,
               "flexWrap": "wrap",
@@ -2459,7 +2459,7 @@ exports[`DefaultSlippageButtonGroup edge cases handles single option 1`] = `
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "columnGap": 8,
             "flexDirection": "row",
@@ -2560,7 +2560,7 @@ exports[`DefaultSlippageButtonGroup styling renders correct styling with first o
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "columnGap": 8,
             "flexDirection": "row",
@@ -2646,7 +2646,7 @@ exports[`DefaultSlippageButtonGroup styling renders correct styling with first o
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -2677,7 +2677,7 @@ exports[`DefaultSlippageButtonGroup styling renders correct styling with first o
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "flexGrow": 0,
               "flexShrink": 1,
               "flexWrap": "wrap",
@@ -2734,7 +2734,7 @@ exports[`DefaultSlippageButtonGroup styling renders correct styling with first o
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -2765,7 +2765,7 @@ exports[`DefaultSlippageButtonGroup styling renders correct styling with first o
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "flexGrow": 0,
               "flexShrink": 1,
               "flexWrap": "wrap",
@@ -2837,7 +2837,7 @@ exports[`DefaultSlippageButtonGroup styling renders correct styling with last op
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -2868,7 +2868,7 @@ exports[`DefaultSlippageButtonGroup styling renders correct styling with last op
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "flexGrow": 0,
               "flexShrink": 1,
               "flexWrap": "wrap",
@@ -2925,7 +2925,7 @@ exports[`DefaultSlippageButtonGroup styling renders correct styling with last op
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -2956,7 +2956,7 @@ exports[`DefaultSlippageButtonGroup styling renders correct styling with last op
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "flexGrow": 0,
               "flexShrink": 1,
               "flexWrap": "wrap",
@@ -3013,7 +3013,7 @@ exports[`DefaultSlippageButtonGroup styling renders correct styling with last op
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "columnGap": 8,
             "flexDirection": "row",
@@ -3114,7 +3114,7 @@ exports[`DefaultSlippageButtonGroup styling renders correct styling with multipl
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "columnGap": 8,
             "flexDirection": "row",
@@ -3200,7 +3200,7 @@ exports[`DefaultSlippageButtonGroup styling renders correct styling with multipl
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "columnGap": 8,
             "flexDirection": "row",
@@ -3286,7 +3286,7 @@ exports[`DefaultSlippageButtonGroup styling renders correct styling with multipl
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -3317,7 +3317,7 @@ exports[`DefaultSlippageButtonGroup styling renders correct styling with multipl
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "flexGrow": 0,
               "flexShrink": 1,
               "flexWrap": "wrap",
@@ -3389,7 +3389,7 @@ exports[`DefaultSlippageButtonGroup styling renders correct styling with no opti
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -3420,7 +3420,7 @@ exports[`DefaultSlippageButtonGroup styling renders correct styling with no opti
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "flexGrow": 0,
               "flexShrink": 1,
               "flexWrap": "wrap",
@@ -3477,7 +3477,7 @@ exports[`DefaultSlippageButtonGroup styling renders correct styling with no opti
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -3508,7 +3508,7 @@ exports[`DefaultSlippageButtonGroup styling renders correct styling with no opti
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "flexGrow": 0,
               "flexShrink": 1,
               "flexWrap": "wrap",
@@ -3565,7 +3565,7 @@ exports[`DefaultSlippageButtonGroup styling renders correct styling with no opti
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -3596,7 +3596,7 @@ exports[`DefaultSlippageButtonGroup styling renders correct styling with no opti
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "flexGrow": 0,
               "flexShrink": 1,
               "flexWrap": "wrap",
@@ -3668,7 +3668,7 @@ exports[`DefaultSlippageButtonGroup styling renders correct styling with one opt
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -3699,7 +3699,7 @@ exports[`DefaultSlippageButtonGroup styling renders correct styling with one opt
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "flexGrow": 0,
               "flexShrink": 1,
               "flexWrap": "wrap",
@@ -3756,7 +3756,7 @@ exports[`DefaultSlippageButtonGroup styling renders correct styling with one opt
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "columnGap": 8,
             "flexDirection": "row",
@@ -3842,7 +3842,7 @@ exports[`DefaultSlippageButtonGroup styling renders correct styling with one opt
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -3873,7 +3873,7 @@ exports[`DefaultSlippageButtonGroup styling renders correct styling with one opt
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "flexGrow": 0,
               "flexShrink": 1,
               "flexWrap": "wrap",
diff --git a/app/components/UI/Bridge/components/SlippageModal/__snapshots__/DefaultSlippageModal.test.tsx.snap b/app/components/UI/Bridge/components/SlippageModal/__snapshots__/DefaultSlippageModal.test.tsx.snap
index 80c74d98f47b..b0e555f3f613 100644
--- a/app/components/UI/Bridge/components/SlippageModal/__snapshots__/DefaultSlippageModal.test.tsx.snap
+++ b/app/components/UI/Bridge/components/SlippageModal/__snapshots__/DefaultSlippageModal.test.tsx.snap
@@ -32,7 +32,7 @@ exports[`DefaultSlippageModal edge cases handles empty slippage options 1`] = `
       style={
         [
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "fontWeight": 400,
@@ -96,7 +96,7 @@ exports[`DefaultSlippageModal edge cases handles empty slippage options 1`] = `
         [
           {
             "alignItems": "center",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "columnGap": 8,
             "flexDirection": "row",
@@ -180,7 +180,7 @@ exports[`DefaultSlippageModal snapshot tests matches snapshot for complete modal
       style={
         [
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "fontWeight": 400,
@@ -285,7 +285,7 @@ exports[`DefaultSlippageModal snapshot tests matches snapshot for complete modal
         [
           {
             "alignItems": "center",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "columnGap": 8,
             "flexDirection": "row",
@@ -369,7 +369,7 @@ exports[`DefaultSlippageModal snapshot tests matches snapshot for description: d
       style={
         [
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "fontWeight": 400,
@@ -474,7 +474,7 @@ exports[`DefaultSlippageModal snapshot tests matches snapshot for description: d
         [
           {
             "alignItems": "center",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "columnGap": 8,
             "flexDirection": "row",
@@ -558,7 +558,7 @@ exports[`DefaultSlippageModal snapshot tests matches snapshot for header: header
       style={
         [
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "fontWeight": 400,
@@ -663,7 +663,7 @@ exports[`DefaultSlippageModal snapshot tests matches snapshot for header: header
         [
           {
             "alignItems": "center",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "columnGap": 8,
             "flexDirection": "row",
@@ -747,7 +747,7 @@ exports[`DefaultSlippageModal snapshot tests matches snapshot for submit button:
       style={
         [
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "fontWeight": 400,
@@ -852,7 +852,7 @@ exports[`DefaultSlippageModal snapshot tests matches snapshot for submit button:
         [
           {
             "alignItems": "center",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "columnGap": 8,
             "flexDirection": "row",
@@ -936,7 +936,7 @@ exports[`DefaultSlippageModal snapshot tests matches snapshot with auto selected
       style={
         [
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "fontWeight": 400,
@@ -1041,7 +1041,7 @@ exports[`DefaultSlippageModal snapshot tests matches snapshot with auto selected
         [
           {
             "alignItems": "center",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "columnGap": 8,
             "flexDirection": "row",
@@ -1125,7 +1125,7 @@ exports[`DefaultSlippageModal snapshot tests matches snapshot with numeric slipp
       style={
         [
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "fontWeight": 400,
@@ -1230,7 +1230,7 @@ exports[`DefaultSlippageModal snapshot tests matches snapshot with numeric slipp
         [
           {
             "alignItems": "center",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "columnGap": 8,
             "flexDirection": "row",
diff --git a/app/components/UI/Bridge/components/TokenSelectorItem.tsx b/app/components/UI/Bridge/components/TokenSelectorItem.tsx
index 7bd9c0dd2a28..627168d10229 100644
--- a/app/components/UI/Bridge/components/TokenSelectorItem.tsx
+++ b/app/components/UI/Bridge/components/TokenSelectorItem.tsx
@@ -142,7 +142,7 @@ const FiatBalanceView = ({
     return <View style={styles.skeleton} />;
   }
 
-  return <Text variant={TextVariant.BodyLGMedium}>{balance}</Text>;
+  return <Text variant={TextVariant.BodyMD}>{balance}</Text>;
 };
 
 export const TokenSelectorItem: React.FC<TokenSelectorItemProps> = ({
@@ -248,7 +248,7 @@ export const TokenSelectorItem: React.FC<TokenSelectorItemProps> = ({
               alignItems={AlignItems.center}
               gap={4}
             >
-              <Text variant={TextVariant.BodyLGMedium}>{token.symbol}</Text>
+              <Text variant={TextVariant.BodyMD}>{token.symbol}</Text>
               {label && <Tag label={label} />}
               {showNoFeeBadge && (
                 <TagBase
@@ -262,7 +262,7 @@ export const TokenSelectorItem: React.FC<TokenSelectorItemProps> = ({
               )}
             </Box>
             <Text
-              variant={TextVariant.BodyMD}
+              variant={TextVariant.BodySM}
               color={TextColor.Alternative}
               numberOfLines={2}
               ellipsizeMode="tail"
@@ -281,7 +281,7 @@ export const TokenSelectorItem: React.FC<TokenSelectorItemProps> = ({
                 <View style={styles.skeleton} />
               ) : (
                 <Text
-                  variant={TextVariant.BodyMD}
+                  variant={TextVariant.BodySM}
                   color={TextColor.Alternative}
                 >
                   {secondaryBalance}
diff --git a/app/components/UI/Bridge/components/TransactionDetails/BridgeStepDescription.test.tsx b/app/components/UI/Bridge/components/TransactionDetails/BridgeStepDescription.test.tsx
index 1a668267ffea..1321217abe35 100644
--- a/app/components/UI/Bridge/components/TransactionDetails/BridgeStepDescription.test.tsx
+++ b/app/components/UI/Bridge/components/TransactionDetails/BridgeStepDescription.test.tsx
@@ -13,6 +13,7 @@ import {
   CHAIN_IDS,
 } from '@metamask/transaction-controller';
 import { fontStyles } from '../../../../../styles/common';
+import { mockTheme } from '../../../../../util/theme';
 
 describe('BridgeStepDescription', () => {
   const mockStep = {
@@ -142,7 +143,10 @@ describe('BridgeStepDescription', () => {
     );
 
     const textElement = getByText(/ETH/);
-    expect(textElement.props.style).toHaveProperty('color', '#686e7d');
+    expect(textElement.props.style).toHaveProperty(
+      'color',
+      mockTheme.colors.text.alternative,
+    );
   });
 
   it('should render bridge action with COMPLETE status text', () => {
@@ -155,7 +159,10 @@ describe('BridgeStepDescription', () => {
 
     expect(getByText(/ETH/)).toBeTruthy();
     const textElement = getByText(/ETH/);
-    expect(textElement.props.style).toHaveProperty('color', '#121314');
+    expect(textElement.props.style).toHaveProperty(
+      'color',
+      mockTheme.colors.text.default,
+    );
     expect(textElement.props.style).toHaveProperty(
       'fontFamily',
       fontStyles.normal.fontFamily,
@@ -173,7 +180,10 @@ describe('BridgeStepDescription', () => {
     expect(getByText(/ETH/)).toBeTruthy();
     expect(getByText(/USDC/)).toBeTruthy();
     const textElement = getByText(/ETH/);
-    expect(textElement.props.style).toHaveProperty('color', '#121314');
+    expect(textElement.props.style).toHaveProperty(
+      'color',
+      mockTheme.colors.text.default,
+    );
     expect(textElement.props.style).toHaveProperty(
       'fontFamily',
       fontStyles.normal.fontFamily,
@@ -192,7 +202,10 @@ describe('BridgeStepDescription', () => {
     expect(getByText(/10:00 AM/)).toBeTruthy();
     expect(getByText(/ETH/)).toBeTruthy();
     const textElement = getByText(/ETH/);
-    expect(textElement.props.style).toHaveProperty('color', '#121314');
+    expect(textElement.props.style).toHaveProperty(
+      'color',
+      mockTheme.colors.text.default,
+    );
     expect(textElement.props.style).toHaveProperty(
       'fontFamily',
       fontStyles.normal.fontFamily,
@@ -213,7 +226,10 @@ describe('BridgeStepDescription', () => {
     );
 
     const textElement = getByText(/ETH/);
-    expect(textElement.props.style).toHaveProperty('color', '#121314');
+    expect(textElement.props.style).toHaveProperty(
+      'color',
+      mockTheme.colors.text.default,
+    );
     expect(textElement.props.style).toHaveProperty(
       'fontFamily',
       fontStyles.medium.fontFamily,
@@ -234,7 +250,10 @@ describe('BridgeStepDescription', () => {
     );
 
     const textElement = getByText(/ETH/);
-    expect(textElement.props.style).toHaveProperty('color', '#121314');
+    expect(textElement.props.style).toHaveProperty(
+      'color',
+      mockTheme.colors.text.default,
+    );
     expect(textElement.props.style).toHaveProperty(
       'fontFamily',
       fontStyles.medium.fontFamily,
@@ -283,7 +302,10 @@ describe('BridgeStepDescription', () => {
     expect(getByText(/ETH/)).toBeTruthy();
     expect(getByText(/USDC/)).toBeTruthy();
     const textElement = getByText(/ETH/);
-    expect(textElement.props.style).toHaveProperty('color', '#686e7d');
+    expect(textElement.props.style).toHaveProperty(
+      'color',
+      mockTheme.colors.text.alternative,
+    );
     expect(textElement.props.style).toHaveProperty(
       'fontFamily',
       fontStyles.normal.fontFamily,
@@ -297,7 +319,10 @@ describe('BridgeStepDescription', () => {
 
     expect(getByText(/ETH/)).toBeTruthy();
     const textElement = getByText(/ETH/);
-    expect(textElement.props.style).toHaveProperty('color', '#686e7d');
+    expect(textElement.props.style).toHaveProperty(
+      'color',
+      mockTheme.colors.text.alternative,
+    );
     expect(textElement.props.style).toHaveProperty(
       'fontFamily',
       fontStyles.normal.fontFamily,
diff --git a/app/components/UI/Bridge/hooks/useAssetMetadata/utils.test.ts b/app/components/UI/Bridge/hooks/useAssetMetadata/utils.test.ts
index ae78a69626c4..e30907f1fea9 100644
--- a/app/components/UI/Bridge/hooks/useAssetMetadata/utils.test.ts
+++ b/app/components/UI/Bridge/hooks/useAssetMetadata/utils.test.ts
@@ -76,6 +76,14 @@ describe('asset-utils', () => {
       expect(getAssetImageUrl(assetId, 'eip155:1')).toBe(expectedUrl);
     });
 
+    it('lowercases EVM erc20 asset references in the image URL', () => {
+      const assetId =
+        'eip155:1/erc20:0xFeDC5f4a6c38211c1338aa411018DFAf26612c08' as CaipAssetType;
+      const expectedUrl = `${STATIC_METAMASK_BASE_URL}/api/v2/tokenIcons/assets/eip155/1/erc20/0xfedc5f4a6c38211c1338aa411018dfaf26612c08.png`;
+
+      expect(getAssetImageUrl(assetId, 'eip155:1')).toBe(expectedUrl);
+    });
+
     it('should return correct image URL for non-hex CAIP asset ID', () => {
       const assetId = `${SolScope.Mainnet}/token:aBCD` as CaipAssetType;
       const expectedUrl = `${STATIC_METAMASK_BASE_URL}/api/v2/tokenIcons/assets/solana/5eykt4UsFv8P8NJdTREpY1vzqKqZKvdp/token/aBCD.png`;
@@ -123,7 +131,7 @@ describe('asset-utils', () => {
         symbol: 'TEST',
         decimals: 18,
         image:
-          'https://static.cx.metamask.io/api/v2/tokenIcons/assets/eip155/1/erc20/0xbd3Afb0bB76683eCb4225F9DBc91f998713C3b01.png',
+          'https://static.cx.metamask.io/api/v2/tokenIcons/assets/eip155/1/erc20/0xbd3afb0bb76683ecb4225f9dbc91f998713c3b01.png',
         assetId: mockAssetId,
         address: mockAddress,
         chainId: mockHexChainId,
@@ -184,7 +192,7 @@ describe('asset-utils', () => {
         decimals: 18,
         name: 'Test Token',
         image:
-          'https://static.cx.metamask.io/api/v2/tokenIcons/assets/eip155/1/erc20/0xbd3Afb0bB76683eCb4225F9DBc91f998713C3b01.png',
+          'https://static.cx.metamask.io/api/v2/tokenIcons/assets/eip155/1/erc20/0xbd3afb0bb76683ecb4225f9dbc91f998713c3b01.png',
         assetId: mockAssetId,
         address: mockAddress,
         chainId: mockHexChainId,
@@ -215,7 +223,7 @@ describe('asset-utils', () => {
         decimals: 18,
         name: 'Test Token',
         image:
-          'https://static.cx.metamask.io/api/v2/tokenIcons/assets/eip155/1/erc20/0xbd3Afb0bB76683eCb4225F9DBc91f998713C3b01.png',
+          'https://static.cx.metamask.io/api/v2/tokenIcons/assets/eip155/1/erc20/0xbd3afb0bb76683ecb4225f9dbc91f998713c3b01.png',
         assetId: mockAssetId,
         address: mockAddress,
         chainId: mockHexChainId,
@@ -260,7 +268,7 @@ describe('asset-utils', () => {
         decimals: 18,
         name: 'Test Token',
         image:
-          'https://static.cx.metamask.io/api/v2/tokenIcons/assets/eip155/1/erc20/0xbd3Afb0bB76683eCb4225F9DBc91f998713C3b01.png',
+          'https://static.cx.metamask.io/api/v2/tokenIcons/assets/eip155/1/erc20/0xbd3afb0bb76683ecb4225f9dbc91f998713c3b01.png',
         assetId: mockAssetId,
         address: mockAddress,
         chainId: mockHexChainId,
diff --git a/app/components/UI/Bridge/hooks/useAssetMetadata/utils.ts b/app/components/UI/Bridge/hooks/useAssetMetadata/utils.ts
index fa291d954973..e86188dcffdf 100644
--- a/app/components/UI/Bridge/hooks/useAssetMetadata/utils.ts
+++ b/app/components/UI/Bridge/hooks/useAssetMetadata/utils.ts
@@ -23,6 +23,29 @@ import { TokenRwaData } from '@metamask/assets-controllers';
 const TOKEN_API_V3_BASE_URL = 'https://tokens.api.cx.metamask.io/v3';
 const STATIC_METAMASK_BASE_URL = 'https://static.cx.metamask.io';
 
+const normalizeAssetIdForImageUrl = (
+  assetId: CaipAssetType,
+  chainId: CaipChainId,
+): CaipAssetType => {
+  if (isNonEvmChainId(chainId)) {
+    return assetId;
+  }
+
+  const {
+    chainId: parsedChainId,
+    assetNamespace,
+    assetReference,
+  } = parseCaipAssetType(assetId);
+
+  if (assetNamespace !== 'erc20') {
+    return assetId;
+  }
+
+  return CaipAssetTypeStruct.create(
+    `${parsedChainId}/${assetNamespace}:${assetReference.toLowerCase()}`,
+  );
+};
+
 export const toAssetId = (
   address: Hex | CaipAssetType | string,
   chainId: CaipChainId,
@@ -59,7 +82,12 @@ export const getAssetImageUrl = (
     return undefined;
   }
 
-  return `${STATIC_METAMASK_BASE_URL}/api/v2/tokenIcons/assets/${assetIdInCaip
+  const normalizedAssetId = normalizeAssetIdForImageUrl(
+    assetIdInCaip,
+    chainIdInCaip,
+  );
+
+  return `${STATIC_METAMASK_BASE_URL}/api/v2/tokenIcons/assets/${normalizedAssetId
     .split(':')
     .join('/')}.png`;
 };
diff --git a/app/components/UI/Bridge/hooks/useBridgeQuoteData/index.ts b/app/components/UI/Bridge/hooks/useBridgeQuoteData/index.ts
index 9e345ae57aee..c6d17ece6939 100644
--- a/app/components/UI/Bridge/hooks/useBridgeQuoteData/index.ts
+++ b/app/components/UI/Bridge/hooks/useBridgeQuoteData/index.ts
@@ -14,23 +14,18 @@ import {
 import { RequestStatus, isNonEvmChainId } from '@metamask/bridge-controller';
 import { areAddressesEqual } from '../../../../../util/address';
 import { useCallback, useMemo, useEffect, useState, useRef } from 'react';
-import {
-  fromTokenMinimalUnit,
-  isNumberValue,
-} from '../../../../../util/number';
+import { fromTokenMinimalUnit } from '../../../../../util/number';
 import {
   isQuoteExpired,
   getQuoteRefreshRate,
   shouldRefreshQuote,
 } from '../../utils/quoteUtils';
-
-import { BigNumber } from 'bignumber.js';
 import I18n from '../../../../../../locales/i18n';
-import useFiatFormatter from '../../../SimulationDetails/FiatDisplay/useFiatFormatter';
 import useIsInsufficientBalance from '../useInsufficientBalance';
 import { BigNumber as EthersBigNumber } from 'ethers';
 import useValidateBridgeTx from '../../../../../util/bridge/hooks/useValidateBridgeTx';
 import { getIntlNumberFormatter } from '../../../../../util/intl';
+import { useFormattedNetworkFee } from '../useFormattedNetworkFee';
 
 interface UseBridgeQuoteDataParams {
   latestSourceAtomicBalance?: EthersBigNumber;
@@ -49,7 +44,6 @@ export const useBridgeQuoteData = ({
   const slippage = useSelector(selectSlippage);
   const isSubmittingTx = useSelector(selectIsSubmittingTx);
   const locale = I18n.locale;
-  const fiatFormatter = useFiatFormatter();
   const quotes = useSelector(selectBridgeQuotes);
   const bridgeFeatureFlags = useSelector(selectBridgeFeatureFlags);
   const isSolanaSwap = useSelector(selectIsSolanaSwap);
@@ -85,6 +79,10 @@ export const useBridgeQuoteData = ({
   const isExpired = isQuoteExpired(willRefresh, refreshRate, quotesLastFetched);
 
   const bestQuote = quotes?.recommendedQuote;
+  const allQuotes = useMemo(
+    () => quotes?.sortedQuotes ?? [],
+    [quotes?.sortedQuotes],
+  );
 
   const activeQuote =
     isExpired && !willRefresh && !isSubmittingTx ? undefined : bestQuote;
@@ -104,25 +102,45 @@ export const useBridgeQuoteData = ({
     return areAddressesEqual(quoteSourceAddress, selectedSourceAddress);
   }, [activeQuote, sourceToken]);
 
-  // Validate that the quote's destination asset matches the selected destination token
+  // Helper to validate that a quote's destination asset matches the selected destination token
   // This prevents showing stale quote data (with wrong decimals) when user changes destination token
-  const isQuoteDestTokenMatch = useMemo(() => {
-    if (!activeQuote || !destToken) return false;
-
-    const { destAsset } = activeQuote.quote;
-
-    // For non-EVM chains (e.g., Solana), destAsset.address is in raw format (e.g., "EPj...")
-    // or zero address for native tokens, while destToken.address uses CAIP format
-    // (e.g., "solana:.../token:EPj...").
-    // Use destAsset.assetId (CAIP format) for comparison.
-    // For EVM chains, use the original address comparison.
-    const quoteDestAddress = isNonEvmChainId(destToken.chainId)
-      ? (destAsset.assetId ?? destAsset.address)
-      : destAsset.address;
+  const isQuoteDestTokenMatchForQuote = useCallback(
+    (quote: (typeof allQuotes)[number] | undefined | null): boolean => {
+      if (!quote || !destToken) return false;
+
+      const { destAsset } = quote.quote;
+
+      // For non-EVM chains (e.g., Solana), destAsset.address is in raw format (e.g., "EPj...")
+      // or zero address for native tokens, while destToken.address uses CAIP format
+      // (e.g., "solana:.../token:EPj...").
+      // Use destAsset.assetId (CAIP format) for comparison.
+      // For EVM chains, use the original address comparison.
+      const quoteDestAddress = isNonEvmChainId(destToken.chainId)
+        ? (destAsset.assetId ?? destAsset.address)
+        : destAsset.address;
+
+      const selectedDestAddress = destToken.address;
+      return areAddressesEqual(quoteDestAddress, selectedDestAddress);
+    },
+    [destToken],
+  );
 
-    const selectedDestAddress = destToken.address;
-    return areAddressesEqual(quoteDestAddress, selectedDestAddress);
-  }, [activeQuote, destToken]);
+  const isQuoteDestTokenMatch = isQuoteDestTokenMatchForQuote(activeQuote);
+
+  // Filter all quotes to only include valid ones (not expired and matching dest token)
+  const validQuotes = useMemo(
+    () =>
+      isExpired && !willRefresh && !isSubmittingTx
+        ? []
+        : allQuotes.filter((quote) => isQuoteDestTokenMatchForQuote(quote)),
+    [
+      isExpired,
+      willRefresh,
+      isSubmittingTx,
+      allQuotes,
+      isQuoteDestTokenMatchForQuote,
+    ],
+  );
 
   const destTokenAmount =
     activeQuote && destToken && isQuoteSourceTokenMatch && isQuoteDestTokenMatch
@@ -137,28 +155,7 @@ export const useBridgeQuoteData = ({
       ? undefined
       : Number(destTokenAmount) / Number(sourceAmount);
 
-  const getNetworkFee = useCallback(() => {
-    if (!activeQuote?.totalNetworkFee) return '-';
-
-    const { totalNetworkFee } = activeQuote;
-
-    const { amount, valueInCurrency } = totalNetworkFee;
-
-    if (
-      amount == null ||
-      valueInCurrency == null ||
-      !isNumberValue(amount) ||
-      !isNumberValue(valueInCurrency)
-    ) {
-      return '-';
-    }
-
-    const formattedValueInCurrency = fiatFormatter(
-      new BigNumber(valueInCurrency),
-    );
-
-    return formattedValueInCurrency;
-  }, [activeQuote, fiatFormatter]);
+  const networkFee = useFormattedNetworkFee(activeQuote);
 
   const formattedQuoteData = useMemo(() => {
     if (!activeQuote) return undefined;
@@ -186,7 +183,7 @@ export const useBridgeQuoteData = ({
       : '--';
 
     return {
-      networkFee: getNetworkFee(),
+      networkFee,
       estimatedTime:
         estimatedProcessingTimeInSeconds >= 60
           ? `${Math.ceil(estimatedProcessingTimeInSeconds / 60)} min`
@@ -204,9 +201,9 @@ export const useBridgeQuoteData = ({
     quoteRate,
     sourceToken?.symbol,
     destToken?.symbol,
-    getNetworkFee,
     slippage,
     locale,
+    networkFee,
   ]);
 
   const isLoading = quotesLoadingStatus === RequestStatus.LOADING;
@@ -303,5 +300,6 @@ export const useBridgeQuoteData = ({
     isExpired,
     blockaidError,
     shouldShowPriceImpactWarning,
+    validQuotes,
   };
 };
diff --git a/app/components/UI/Bridge/hooks/useBridgeQuoteData/useBridgeQuoteData.test.ts b/app/components/UI/Bridge/hooks/useBridgeQuoteData/useBridgeQuoteData.test.ts
index 4eea13dc85d0..8c8ac39d6b76 100644
--- a/app/components/UI/Bridge/hooks/useBridgeQuoteData/useBridgeQuoteData.test.ts
+++ b/app/components/UI/Bridge/hooks/useBridgeQuoteData/useBridgeQuoteData.test.ts
@@ -141,6 +141,7 @@ describe('useBridgeQuoteData', () => {
       willRefresh: false,
       blockaidError: null,
       quotesLoadingStatus: null,
+      validQuotes: [],
     });
   });
 
@@ -224,6 +225,7 @@ describe('useBridgeQuoteData', () => {
       blockaidError: null,
       shouldShowPriceImpactWarning: false,
       quotesLoadingStatus: RequestStatus.FETCHED,
+      validQuotes: [],
     });
   });
 
@@ -302,6 +304,7 @@ describe('useBridgeQuoteData', () => {
       willRefresh: false,
       blockaidError: null,
       quotesLoadingStatus: null,
+      validQuotes: [],
     });
   });
 
@@ -337,6 +340,7 @@ describe('useBridgeQuoteData', () => {
       willRefresh: false,
       blockaidError: null,
       quotesLoadingStatus: RequestStatus.LOADING,
+      validQuotes: [],
     });
   });
 
@@ -373,6 +377,7 @@ describe('useBridgeQuoteData', () => {
       willRefresh: false,
       blockaidError: null,
       quotesLoadingStatus: null,
+      validQuotes: [],
     });
   });
 
@@ -810,4 +815,520 @@ describe('useBridgeQuoteData', () => {
       expect(result.current.blockaidError).toBe(null);
     });
   });
+
+  // Test validQuotes filtering
+  describe('validQuotes filtering', () => {
+    it('returns filtered validQuotes that match destination token', () => {
+      const mockQuote1 = {
+        ...mockQuoteWithMetadata,
+        quote: {
+          ...mockQuoteWithMetadata.quote,
+          destAsset: {
+            ...mockQuoteWithMetadata.quote.destAsset,
+            address:
+              'solana:5eykt4UsFv8P8NJdTREpY1vzqKqZKvdp/token:EPjFWdd5AufqSSqeM2qN1xzybapC8G4wEGGkZwyTDt1v',
+            assetId:
+              'solana:5eykt4UsFv8P8NJdTREpY1vzqKqZKvdp/token:EPjFWdd5AufqSSqeM2qN1xzybapC8G4wEGGkZwyTDt1v',
+          },
+        },
+      };
+
+      const mockQuote2 = {
+        ...mockQuoteWithMetadata,
+        quote: {
+          ...mockQuoteWithMetadata.quote,
+          destAsset: {
+            ...mockQuoteWithMetadata.quote.destAsset,
+            address: '0x0000000000000000000000000000000000000000',
+            assetId: '0x0000000000000000000000000000000000000000',
+          },
+        },
+      };
+
+      (selectBridgeQuotes as unknown as jest.Mock).mockImplementation(() => ({
+        recommendedQuote: mockQuote1,
+        sortedQuotes: [mockQuote1, mockQuote2],
+        alternativeQuotes: [],
+      }));
+
+      const bridgeReducerOverrides = {
+        destToken: {
+          symbol: 'USDC',
+          chainId: SolScope.Mainnet,
+          address:
+            'solana:5eykt4UsFv8P8NJdTREpY1vzqKqZKvdp/token:EPjFWdd5AufqSSqeM2qN1xzybapC8G4wEGGkZwyTDt1v',
+          decimals: 6,
+        },
+      };
+
+      const testState = createBridgeTestState({
+        bridgeReducerOverrides,
+      });
+
+      const { result } = renderHookWithProvider(() => useBridgeQuoteData(), {
+        state: testState,
+      });
+
+      expect(result.current.validQuotes).toHaveLength(1);
+      expect(result.current.validQuotes[0]).toEqual(mockQuote1);
+    });
+
+    it('returns empty validQuotes array when quotes are expired and not refreshing', () => {
+      (selectBridgeQuotes as unknown as jest.Mock).mockImplementation(() => ({
+        recommendedQuote: mockQuoteWithMetadata,
+        sortedQuotes: [mockQuoteWithMetadata],
+        alternativeQuotes: [],
+      }));
+
+      (isQuoteExpired as jest.Mock).mockReturnValue(true);
+      (shouldRefreshQuote as jest.Mock).mockReturnValue(false);
+
+      const testState = createBridgeTestState({});
+
+      const { result } = renderHookWithProvider(() => useBridgeQuoteData(), {
+        state: testState,
+      });
+
+      expect(result.current.validQuotes).toEqual([]);
+      expect(result.current.isExpired).toBe(true);
+    });
+
+    it('returns empty validQuotes when isSubmittingTx is true', () => {
+      (selectBridgeQuotes as unknown as jest.Mock).mockImplementation(() => ({
+        recommendedQuote: mockQuoteWithMetadata,
+        sortedQuotes: [mockQuoteWithMetadata],
+        alternativeQuotes: [],
+      }));
+
+      (isQuoteExpired as jest.Mock).mockReturnValue(true);
+
+      const bridgeReducerOverrides = {
+        isSubmittingTx: true,
+      };
+
+      const testState = createBridgeTestState({
+        bridgeReducerOverrides,
+      });
+
+      const { result } = renderHookWithProvider(() => useBridgeQuoteData(), {
+        state: testState,
+      });
+
+      expect(result.current.validQuotes).toEqual([]);
+    });
+  });
+
+  // Test isQuoteSourceTokenMatch
+  describe('source token matching', () => {
+    it('returns undefined destTokenAmount when quote source token does not match selected source token', () => {
+      const mockQuoteWithDifferentSource = {
+        ...mockQuoteWithMetadata,
+        quote: {
+          ...mockQuoteWithMetadata.quote,
+          srcAsset: {
+            ...mockQuoteWithMetadata.quote.srcAsset,
+            address: '0x1111111111111111111111111111111111111111',
+          },
+        },
+      };
+
+      (selectBridgeQuotes as unknown as jest.Mock).mockImplementation(() => ({
+        recommendedQuote: mockQuoteWithDifferentSource,
+        alternativeQuotes: [],
+      }));
+
+      const bridgeReducerOverrides = {
+        sourceToken: {
+          symbol: 'DAI',
+          chainId: CHAIN_IDS.MAINNET,
+          address: '0x6B175474E89094C44Da98b954EedeAC495271d0F',
+          decimals: 18,
+        },
+        destToken: {
+          symbol: 'USDC',
+          chainId: SolScope.Mainnet,
+          address:
+            'solana:5eykt4UsFv8P8NJdTREpY1vzqKqZKvdp/token:EPjFWdd5AufqSSqeM2qN1xzybapC8G4wEGGkZwyTDt1v',
+          decimals: 6,
+        },
+      };
+
+      const testState = createBridgeTestState({
+        bridgeReducerOverrides,
+      });
+
+      const { result } = renderHookWithProvider(() => useBridgeQuoteData(), {
+        state: testState,
+      });
+
+      expect(result.current.destTokenAmount).toBeUndefined();
+    });
+
+    it('handles non-EVM source chain IDs correctly', () => {
+      const mockQuoteWithSolanaSource = {
+        ...mockQuoteWithMetadata,
+        quote: {
+          ...mockQuoteWithMetadata.quote,
+          srcAsset: {
+            address: '11111111111111111111111111111112',
+            assetId:
+              'solana:5eykt4UsFv8P8NJdTREpY1vzqKqZKvdp/token:11111111111111111111111111111112',
+            decimals: 9,
+          },
+        },
+      };
+
+      (selectBridgeQuotes as unknown as jest.Mock).mockImplementation(() => ({
+        recommendedQuote: mockQuoteWithSolanaSource,
+        alternativeQuotes: [],
+      }));
+
+      const bridgeReducerOverrides = {
+        sourceToken: {
+          symbol: 'SOL',
+          chainId: SolScope.Mainnet,
+          address:
+            'solana:5eykt4UsFv8P8NJdTREpY1vzqKqZKvdp/token:11111111111111111111111111111112',
+          decimals: 9,
+        },
+        destToken: {
+          symbol: 'USDC',
+          chainId: SolScope.Mainnet,
+          address:
+            'solana:5eykt4UsFv8P8NJdTREpY1vzqKqZKvdp/token:EPjFWdd5AufqSSqeM2qN1xzybapC8G4wEGGkZwyTDt1v',
+          decimals: 6,
+        },
+      };
+
+      const testState = createBridgeTestState({
+        bridgeReducerOverrides,
+      });
+
+      const { result } = renderHookWithProvider(() => useBridgeQuoteData(), {
+        state: testState,
+      });
+
+      expect(result.current.activeQuote).toEqual(mockQuoteWithSolanaSource);
+    });
+  });
+
+  // Test estimated time formatting
+  describe('estimated time formatting', () => {
+    it('formats time as "< 1 second" when less than 1 second', () => {
+      const mockQuoteWithFastTime = {
+        ...mockQuoteWithMetadata,
+        estimatedProcessingTimeInSeconds: 0.5,
+      };
+
+      (selectBridgeQuotes as unknown as jest.Mock).mockImplementation(() => ({
+        recommendedQuote: mockQuoteWithFastTime,
+        alternativeQuotes: [],
+      }));
+
+      const testState = createBridgeTestState({});
+
+      const { result } = renderHookWithProvider(() => useBridgeQuoteData(), {
+        state: testState,
+      });
+
+      expect(result.current.formattedQuoteData?.estimatedTime).toBe(
+        '< 1 second',
+      );
+    });
+
+    it('formats time as seconds when between 1 and 59 seconds', () => {
+      const mockQuoteWith30Seconds = {
+        ...mockQuoteWithMetadata,
+        estimatedProcessingTimeInSeconds: 30,
+      };
+
+      (selectBridgeQuotes as unknown as jest.Mock).mockImplementation(() => ({
+        recommendedQuote: mockQuoteWith30Seconds,
+        alternativeQuotes: [],
+      }));
+
+      const testState = createBridgeTestState({});
+
+      const { result } = renderHookWithProvider(() => useBridgeQuoteData(), {
+        state: testState,
+      });
+
+      expect(result.current.formattedQuoteData?.estimatedTime).toBe(
+        '30 seconds',
+      );
+    });
+
+    it('formats time as minutes when 60 seconds or more', () => {
+      const mockQuoteWith120Seconds = {
+        ...mockQuoteWithMetadata,
+        estimatedProcessingTimeInSeconds: 120,
+      };
+
+      (selectBridgeQuotes as unknown as jest.Mock).mockImplementation(() => ({
+        recommendedQuote: mockQuoteWith120Seconds,
+        alternativeQuotes: [],
+      }));
+
+      const testState = createBridgeTestState({});
+
+      const { result } = renderHookWithProvider(() => useBridgeQuoteData(), {
+        state: testState,
+      });
+
+      expect(result.current.formattedQuoteData?.estimatedTime).toBe('2 min');
+    });
+
+    it('rounds up minutes when formatting', () => {
+      const mockQuoteWith90Seconds = {
+        ...mockQuoteWithMetadata,
+        estimatedProcessingTimeInSeconds: 90,
+      };
+
+      (selectBridgeQuotes as unknown as jest.Mock).mockImplementation(() => ({
+        recommendedQuote: mockQuoteWith90Seconds,
+        alternativeQuotes: [],
+      }));
+
+      const testState = createBridgeTestState({});
+
+      const { result } = renderHookWithProvider(() => useBridgeQuoteData(), {
+        state: testState,
+      });
+
+      expect(result.current.formattedQuoteData?.estimatedTime).toBe('2 min');
+    });
+  });
+
+  // Test quote rate formatting
+  describe('quote rate formatting', () => {
+    it('formats rate with 2 decimals when rate is greater than 1', () => {
+      const mockQuoteWithHighRate = {
+        ...mockQuoteWithMetadata,
+        quote: {
+          ...mockQuoteWithMetadata.quote,
+          destTokenAmount: '2500000000',
+        },
+      };
+
+      (selectBridgeQuotes as unknown as jest.Mock).mockImplementation(() => ({
+        recommendedQuote: mockQuoteWithHighRate,
+        alternativeQuotes: [],
+      }));
+
+      const bridgeReducerOverrides = {
+        sourceAmount: '1',
+        sourceToken: {
+          symbol: 'ETH',
+          chainId: CHAIN_IDS.MAINNET,
+          address: '0x0000000000000000000000000000000000000000',
+          decimals: 18,
+        },
+        destToken: {
+          symbol: 'USDC',
+          chainId: SolScope.Mainnet,
+          address:
+            'solana:5eykt4UsFv8P8NJdTREpY1vzqKqZKvdp/token:EPjFWdd5AufqSSqeM2qN1xzybapC8G4wEGGkZwyTDt1v',
+          decimals: 6,
+        },
+      };
+
+      const testState = createBridgeTestState({
+        bridgeReducerOverrides,
+      });
+
+      const { result } = renderHookWithProvider(() => useBridgeQuoteData(), {
+        state: testState,
+      });
+
+      expect(result.current.formattedQuoteData?.rate).toMatch(/1 ETH = /);
+      expect(result.current.formattedQuoteData?.rate).toMatch(/ USDC/);
+    });
+
+    it('formats rate with 3 significant digits when rate is less than 1', () => {
+      const mockQuoteWithLowRate = {
+        ...mockQuoteWithMetadata,
+        quote: {
+          ...mockQuoteWithMetadata.quote,
+          destTokenAmount: '100000',
+        },
+      };
+
+      (selectBridgeQuotes as unknown as jest.Mock).mockImplementation(() => ({
+        recommendedQuote: mockQuoteWithLowRate,
+        alternativeQuotes: [],
+      }));
+
+      const bridgeReducerOverrides = {
+        sourceAmount: '1',
+        sourceToken: {
+          symbol: 'ETH',
+          chainId: CHAIN_IDS.MAINNET,
+          address: '0x0000000000000000000000000000000000000000',
+          decimals: 18,
+        },
+        destToken: {
+          symbol: 'USDC',
+          chainId: SolScope.Mainnet,
+          address:
+            'solana:5eykt4UsFv8P8NJdTREpY1vzqKqZKvdp/token:EPjFWdd5AufqSSqeM2qN1xzybapC8G4wEGGkZwyTDt1v',
+          decimals: 6,
+        },
+      };
+
+      const testState = createBridgeTestState({
+        bridgeReducerOverrides,
+      });
+
+      const { result } = renderHookWithProvider(() => useBridgeQuoteData(), {
+        state: testState,
+      });
+
+      expect(result.current.formattedQuoteData?.rate).toMatch(/1 ETH = /);
+      expect(result.current.formattedQuoteData?.rate).toMatch(/ USDC/);
+    });
+  });
+
+  // Test race condition handling
+  describe('validation race condition handling', () => {
+    it('aborts previous validation when quote changes', async () => {
+      const mockQuote1 = {
+        ...mockQuoteWithMetadata,
+        quote: { ...mockQuoteWithMetadata.quote, requestId: 'quote1' },
+      };
+      const mockQuote2 = {
+        ...mockQuoteWithMetadata,
+        quote: { ...mockQuoteWithMetadata.quote, requestId: 'quote2' },
+      };
+
+      // Start with first quote
+      (selectBridgeQuotes as unknown as jest.Mock).mockImplementation(() => ({
+        recommendedQuote: mockQuote1,
+        alternativeQuotes: [],
+      }));
+
+      let abortCallCount = 0;
+      const mockAbort = jest.fn(() => {
+        abortCallCount++;
+      });
+
+      const originalAbortController = global.AbortController;
+      global.AbortController = jest.fn().mockImplementation(() => ({
+        signal: {},
+        abort: mockAbort,
+      })) as typeof AbortController;
+
+      mockValidateBridgeTx.mockResolvedValue({ status: 'SUCCESS' });
+
+      const bridgeReducerOverrides = {
+        sourceToken: {
+          symbol: 'SOL',
+          chainId: SolScope.Mainnet,
+          address: '11111111111111111111111111111112',
+          decimals: 9,
+        },
+        destToken: {
+          symbol: 'USDC',
+          chainId: SolScope.Mainnet,
+          address:
+            'solana:5eykt4UsFv8P8NJdTREpY1vzqKqZKvdp/token:EPjFWdd5AufqSSqeM2qN1xzybapC8G4wEGGkZwyTDt1v',
+          decimals: 6,
+        },
+      };
+
+      const testState = createBridgeTestState({
+        bridgeReducerOverrides,
+      });
+
+      const { result } = renderHookWithProvider(() => useBridgeQuoteData(), {
+        state: testState,
+      });
+
+      await waitFor(() => {
+        expect(result.current.blockaidError).toBe(null);
+      });
+
+      // Change to second quote
+      (selectBridgeQuotes as unknown as jest.Mock).mockImplementation(() => ({
+        recommendedQuote: mockQuote2,
+        alternativeQuotes: [],
+      }));
+
+      // Re-render with new quote
+      const { result: result2 } = renderHookWithProvider(
+        () => useBridgeQuoteData(),
+        {
+          state: testState,
+        },
+      );
+
+      await waitFor(() => {
+        expect(result2.current.blockaidError).toBe(null);
+      });
+
+      // Verify abort was called when quote changed
+      expect(abortCallCount).toBeGreaterThan(0);
+
+      // Restore original AbortController
+      global.AbortController = originalAbortController;
+    });
+  });
+
+  // Test abort controller cleanup
+  describe('abort controller cleanup', () => {
+    it('cleans up abort controller on unmount', () => {
+      (selectBridgeQuotes as unknown as jest.Mock).mockImplementation(() => ({
+        recommendedQuote: mockQuoteWithMetadata,
+        alternativeQuotes: [],
+      }));
+
+      const testState = createBridgeTestState({});
+
+      const { unmount } = renderHookWithProvider(() => useBridgeQuoteData(), {
+        state: testState,
+      });
+
+      // Should not throw when unmounting
+      expect(() => unmount()).not.toThrow();
+    });
+  });
+
+  // Test willRefresh scenarios
+  describe('willRefresh behavior', () => {
+    it('sets willRefresh to true when conditions are met', () => {
+      (selectBridgeQuotes as unknown as jest.Mock).mockImplementation(() => ({
+        recommendedQuote: mockQuoteWithMetadata,
+        alternativeQuotes: [],
+      }));
+
+      (shouldRefreshQuote as jest.Mock).mockReturnValue(true);
+
+      const testState = createBridgeTestState({});
+
+      const { result } = renderHookWithProvider(() => useBridgeQuoteData(), {
+        state: testState,
+      });
+
+      expect(result.current.willRefresh).toBe(true);
+    });
+
+    it('shows activeQuote when expired but willRefresh is true', () => {
+      (selectBridgeQuotes as unknown as jest.Mock).mockImplementation(() => ({
+        recommendedQuote: mockQuoteWithMetadata,
+        alternativeQuotes: [],
+      }));
+
+      (isQuoteExpired as jest.Mock).mockReturnValue(true);
+      (shouldRefreshQuote as jest.Mock).mockReturnValue(true);
+
+      const testState = createBridgeTestState({});
+
+      const { result } = renderHookWithProvider(() => useBridgeQuoteData(), {
+        state: testState,
+      });
+
+      expect(result.current.activeQuote).toEqual(mockQuoteWithMetadata);
+      expect(result.current.isExpired).toBe(true);
+      expect(result.current.willRefresh).toBe(true);
+    });
+  });
 });
diff --git a/app/components/UI/Bridge/hooks/useBridgeQuoteRequest/index.ts b/app/components/UI/Bridge/hooks/useBridgeQuoteRequest/index.ts
index 22e87d32e7f6..f5e80d65838a 100644
--- a/app/components/UI/Bridge/hooks/useBridgeQuoteRequest/index.ts
+++ b/app/components/UI/Bridge/hooks/useBridgeQuoteRequest/index.ts
@@ -23,14 +23,21 @@ import { debounce } from 'lodash';
 import { useUnifiedSwapBridgeContext } from '../useUnifiedSwapBridgeContext';
 import useIsInsufficientBalance from '../useInsufficientBalance';
 import { useLatestBalance } from '../useLatestBalance';
+import { BigNumber } from 'ethers';
 
 export const DEBOUNCE_WAIT = 300;
 
+interface UseBridgeQuoteRequestOptions {
+  latestSourceAtomicBalance?: BigNumber;
+}
+
 /**
  * Hook for handling bridge quote request updates
  * @returns {Function} A debounced function to update quote parameters
  */
-export const useBridgeQuoteRequest = () => {
+export const useBridgeQuoteRequest = (
+  options: UseBridgeQuoteRequestOptions = {},
+) => {
   const sourceAmount = useSelector(selectSourceAmount);
   const sourceToken = useSelector(selectSourceToken);
   const destToken = useSelector(selectDestToken);
@@ -39,12 +46,23 @@ export const useBridgeQuoteRequest = () => {
   const walletAddress = useSelector(selectSourceWalletAddress);
   const destAddress = useSelector(selectDestAddress);
   const context = useUnifiedSwapBridgeContext();
+  const { latestSourceAtomicBalance } = options;
+  const hasLatestSourceBalanceOverride = 'latestSourceAtomicBalance' in options;
 
-  const latestSourceBalance = useLatestBalance({
-    address: sourceToken?.address,
-    decimals: sourceToken?.decimals,
-    chainId: sourceToken?.chainId,
-  });
+  const latestSourceBalance = useLatestBalance(
+    hasLatestSourceBalanceOverride
+      ? {}
+      : {
+          address: sourceToken?.address,
+          decimals: sourceToken?.decimals,
+          chainId: sourceToken?.chainId,
+          balance: sourceToken?.balance,
+        },
+  );
+
+  const sourceAtomicBalance = hasLatestSourceBalanceOverride
+    ? latestSourceAtomicBalance
+    : latestSourceBalance?.atomicBalance;
 
   // Use simple balance check (ignoring gas fees) for quote requests to avoid circular dependencies.
   // The full balance check with gas fees is used separately within the BridgeView to block user from executing
@@ -53,7 +71,7 @@ export const useBridgeQuoteRequest = () => {
   const insufficientBal = useIsInsufficientBalance({
     amount: sourceAmount,
     token: sourceToken,
-    latestAtomicBalance: latestSourceBalance?.atomicBalance,
+    latestAtomicBalance: sourceAtomicBalance,
     ignoreGasFees: true,
   });
 
diff --git a/app/components/UI/Bridge/hooks/useBridgeQuoteRequest/useBridgeQuoteRequest.test.ts b/app/components/UI/Bridge/hooks/useBridgeQuoteRequest/useBridgeQuoteRequest.test.ts
index 03f0612a4c5a..ecf661c83510 100644
--- a/app/components/UI/Bridge/hooks/useBridgeQuoteRequest/useBridgeQuoteRequest.test.ts
+++ b/app/components/UI/Bridge/hooks/useBridgeQuoteRequest/useBridgeQuoteRequest.test.ts
@@ -571,6 +571,88 @@ describe('useBridgeQuoteRequest', () => {
         address: testState.bridge.sourceToken?.address,
         decimals: testState.bridge.sourceToken?.decimals,
         chainId: testState.bridge.sourceToken?.chainId,
+        balance: testState.bridge.sourceToken?.balance,
+      });
+    });
+
+    it('uses latestSourceAtomicBalance override when provided', async () => {
+      const testState = createBridgeTestState({
+        bridgeReducerOverrides: {
+          sourceAmount: '5.5',
+        },
+      });
+      const overriddenAtomicBalance = BigNumber.from('1234500000000000000');
+
+      renderHookWithProvider(
+        () =>
+          useBridgeQuoteRequest({
+            latestSourceAtomicBalance: overriddenAtomicBalance,
+          }),
+        {
+          state: testState,
+        },
+      );
+
+      expect(mockUseLatestBalance).toHaveBeenCalledWith({});
+      expect(mockUseIsInsufficientBalance).toHaveBeenCalledWith({
+        amount: '5.5',
+        token: testState.bridge.sourceToken,
+        latestAtomicBalance: overriddenAtomicBalance,
+        ignoreGasFees: true,
+      });
+    });
+
+    it('uses override path when latestSourceAtomicBalance key is provided as undefined', async () => {
+      const testState = createBridgeTestState({
+        bridgeReducerOverrides: {
+          sourceAmount: '5.5',
+        },
+      });
+
+      renderHookWithProvider(
+        () => useBridgeQuoteRequest({ latestSourceAtomicBalance: undefined }),
+        {
+          state: testState,
+        },
+      );
+
+      expect(mockUseLatestBalance).toHaveBeenCalledWith({});
+      expect(mockUseIsInsufficientBalance).toHaveBeenCalledWith({
+        amount: '5.5',
+        token: testState.bridge.sourceToken,
+        latestAtomicBalance: undefined,
+        ignoreGasFees: true,
+      });
+    });
+
+    it('falls back to useLatestBalance when no latestSourceAtomicBalance override is provided', async () => {
+      const testState = createBridgeTestState({
+        bridgeReducerOverrides: {
+          sourceAmount: '5.5',
+        },
+      });
+      const latestBalance = BigNumber.from('9000000000000000000');
+
+      mockUseLatestBalance.mockReturnValue({
+        displayBalance: '9',
+        atomicBalance: latestBalance,
+      });
+
+      renderHookWithProvider(() => useBridgeQuoteRequest(), {
+        state: testState,
+      });
+
+      expect(mockUseLatestBalance).toHaveBeenCalledWith({
+        address: testState.bridge.sourceToken?.address,
+        decimals: testState.bridge.sourceToken?.decimals,
+        chainId: testState.bridge.sourceToken?.chainId,
+        balance: testState.bridge.sourceToken?.balance,
+      });
+      expect(mockUseIsInsufficientBalance).toHaveBeenCalledWith({
+        amount: '5.5',
+        token: testState.bridge.sourceToken,
+        latestAtomicBalance: latestBalance,
+        ignoreGasFees: true,
       });
     });
   });
diff --git a/app/components/UI/Bridge/hooks/useFormattedNetworkFee/index.test.ts b/app/components/UI/Bridge/hooks/useFormattedNetworkFee/index.test.ts
new file mode 100644
index 000000000000..c1a020387277
--- /dev/null
+++ b/app/components/UI/Bridge/hooks/useFormattedNetworkFee/index.test.ts
@@ -0,0 +1,446 @@
+import { renderHookWithProvider } from '../../../../../util/test/renderWithProvider';
+import { useFormattedNetworkFee } from './index';
+import { formatNetworkFee } from '../../utils/formatNetworkFee';
+import { selectCurrentCurrency } from '../../../../../selectors/currencyRateController';
+import { QuoteMetadata, QuoteResponse } from '@metamask/bridge-controller';
+
+jest.mock('../../utils/formatNetworkFee');
+jest.mock('../../../../../selectors/currencyRateController');
+
+const mockFormatNetworkFee = formatNetworkFee as jest.MockedFunction<
+  typeof formatNetworkFee
+>;
+const mockSelectCurrentCurrency = selectCurrentCurrency as jest.MockedFunction<
+  typeof selectCurrentCurrency
+>;
+
+describe('useFormattedNetworkFee', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+    mockSelectCurrentCurrency.mockReturnValue('USD');
+    mockFormatNetworkFee.mockReturnValue('-');
+  });
+
+  describe('when quote is undefined', () => {
+    it('returns formatted network fee with undefined quote', () => {
+      // Arrange
+      mockSelectCurrentCurrency.mockReturnValue('USD');
+      mockFormatNetworkFee.mockReturnValue('-');
+
+      // Act
+      const { result } = renderHookWithProvider(
+        () => useFormattedNetworkFee(undefined),
+        { state: {} },
+      );
+
+      // Assert
+      expect(result.current).toBe('-');
+      expect(formatNetworkFee).toHaveBeenCalledWith('USD', undefined);
+    });
+  });
+
+  describe('when quote is null', () => {
+    it('returns formatted network fee with null quote', () => {
+      // Arrange
+      mockSelectCurrentCurrency.mockReturnValue('EUR');
+      mockFormatNetworkFee.mockReturnValue('-');
+
+      // Act
+      const { result } = renderHookWithProvider(
+        () => useFormattedNetworkFee(null),
+        { state: {} },
+      );
+
+      // Assert
+      expect(result.current).toBe('-');
+      expect(formatNetworkFee).toHaveBeenCalledWith('EUR', null);
+    });
+  });
+
+  describe('when quote has valid totalNetworkFee', () => {
+    it('returns formatted network fee with USD currency', () => {
+      // Arrange
+      const quote = {
+        totalNetworkFee: {
+          amount: '0.01',
+          valueInCurrency: '10.50',
+        },
+      } as unknown as QuoteResponse & QuoteMetadata;
+
+      mockSelectCurrentCurrency.mockReturnValue('USD');
+      mockFormatNetworkFee.mockReturnValue('$10.50');
+
+      // Act
+      const { result } = renderHookWithProvider(
+        () => useFormattedNetworkFee(quote),
+        { state: {} },
+      );
+
+      // Assert
+      expect(result.current).toBe('$10.50');
+      expect(formatNetworkFee).toHaveBeenCalledWith('USD', quote);
+    });
+
+    it('returns formatted network fee with EUR currency', () => {
+      // Arrange
+      const quote = {
+        totalNetworkFee: {
+          amount: '0.02',
+          valueInCurrency: '25.00',
+        },
+      } as unknown as QuoteResponse & QuoteMetadata;
+
+      mockSelectCurrentCurrency.mockReturnValue('EUR');
+      mockFormatNetworkFee.mockReturnValue('€25.00');
+
+      // Act
+      const { result } = renderHookWithProvider(
+        () => useFormattedNetworkFee(quote),
+        { state: {} },
+      );
+
+      // Assert
+      expect(result.current).toBe('€25.00');
+      expect(formatNetworkFee).toHaveBeenCalledWith('EUR', quote);
+    });
+
+    it('returns formatted network fee with GBP currency', () => {
+      // Arrange
+      const quote = {
+        totalNetworkFee: {
+          amount: '0.005',
+          valueInCurrency: '5.25',
+        },
+      } as unknown as QuoteResponse & QuoteMetadata;
+
+      mockSelectCurrentCurrency.mockReturnValue('GBP');
+      mockFormatNetworkFee.mockReturnValue('£5.25');
+
+      // Act
+      const { result } = renderHookWithProvider(
+        () => useFormattedNetworkFee(quote),
+        { state: {} },
+      );
+
+      // Assert
+      expect(result.current).toBe('£5.25');
+      expect(formatNetworkFee).toHaveBeenCalledWith('GBP', quote);
+    });
+
+    it('returns formatted network fee with JPY currency', () => {
+      // Arrange
+      const quote = {
+        totalNetworkFee: {
+          amount: '0.1',
+          valueInCurrency: '1500',
+        },
+      } as unknown as QuoteResponse & QuoteMetadata;
+
+      mockSelectCurrentCurrency.mockReturnValue('JPY');
+      mockFormatNetworkFee.mockReturnValue('¥1,500');
+
+      // Act
+      const { result } = renderHookWithProvider(
+        () => useFormattedNetworkFee(quote),
+        { state: {} },
+      );
+
+      // Assert
+      expect(result.current).toBe('¥1,500');
+      expect(formatNetworkFee).toHaveBeenCalledWith('JPY', quote);
+    });
+  });
+
+  describe('when network fee is small', () => {
+    it('returns formatted small network fee', () => {
+      // Arrange
+      const quote = {
+        totalNetworkFee: {
+          amount: '0.000001',
+          valueInCurrency: '0.005',
+        },
+      } as unknown as QuoteResponse & QuoteMetadata;
+
+      mockSelectCurrentCurrency.mockReturnValue('USD');
+      mockFormatNetworkFee.mockReturnValue('<$0.01');
+
+      // Act
+      const { result } = renderHookWithProvider(
+        () => useFormattedNetworkFee(quote),
+        { state: {} },
+      );
+
+      // Assert
+      expect(result.current).toBe('<$0.01');
+      expect(formatNetworkFee).toHaveBeenCalledWith('USD', quote);
+    });
+  });
+
+  describe('when network fee is large', () => {
+    it('returns formatted large network fee', () => {
+      // Arrange
+      const quote = {
+        totalNetworkFee: {
+          amount: '1.5',
+          valueInCurrency: '1234.56',
+        },
+      } as unknown as QuoteResponse & QuoteMetadata;
+
+      mockSelectCurrentCurrency.mockReturnValue('USD');
+      mockFormatNetworkFee.mockReturnValue('$1,234.56');
+
+      // Act
+      const { result } = renderHookWithProvider(
+        () => useFormattedNetworkFee(quote),
+        { state: {} },
+      );
+
+      // Assert
+      expect(result.current).toBe('$1,234.56');
+      expect(formatNetworkFee).toHaveBeenCalledWith('USD', quote);
+    });
+  });
+
+  describe('when network fee is zero', () => {
+    it('returns formatted zero network fee', () => {
+      // Arrange
+      const quote = {
+        totalNetworkFee: {
+          amount: '0',
+          valueInCurrency: '0',
+        },
+      } as unknown as QuoteResponse & QuoteMetadata;
+
+      mockSelectCurrentCurrency.mockReturnValue('USD');
+      mockFormatNetworkFee.mockReturnValue('$0');
+
+      // Act
+      const { result } = renderHookWithProvider(
+        () => useFormattedNetworkFee(quote),
+        { state: {} },
+      );
+
+      // Assert
+      expect(result.current).toBe('$0');
+      expect(formatNetworkFee).toHaveBeenCalledWith('USD', quote);
+    });
+  });
+
+  describe('when quote changes', () => {
+    it('recalculates formatted network fee when quote changes', () => {
+      // Arrange
+      const initialQuote = {
+        totalNetworkFee: {
+          amount: '0.01',
+          valueInCurrency: '10.00',
+        },
+      } as unknown as QuoteResponse & QuoteMetadata;
+
+      mockSelectCurrentCurrency.mockReturnValue('USD');
+      mockFormatNetworkFee.mockReturnValue('$10.00');
+
+      // Act - initial render
+      const { result } = renderHookWithProvider(
+        () => useFormattedNetworkFee(initialQuote),
+        { state: {} },
+      );
+
+      // Assert initial
+      expect(result.current).toBe('$10.00');
+      expect(formatNetworkFee).toHaveBeenCalledWith('USD', initialQuote);
+
+      // Arrange - update mock for different quote
+      const updatedQuote = {
+        totalNetworkFee: {
+          amount: '0.02',
+          valueInCurrency: '20.00',
+        },
+      } as unknown as QuoteResponse & QuoteMetadata;
+
+      mockFormatNetworkFee.mockReturnValue('$20.00');
+
+      // Act - new render with updated quote
+      const { result: updatedResult } = renderHookWithProvider(
+        () => useFormattedNetworkFee(updatedQuote),
+        { state: {} },
+      );
+
+      // Assert after update
+      expect(updatedResult.current).toBe('$20.00');
+      expect(formatNetworkFee).toHaveBeenCalledWith('USD', updatedQuote);
+    });
+  });
+
+  describe('when currency changes', () => {
+    it('recalculates formatted network fee when currency changes', () => {
+      // Arrange
+      const quote = {
+        totalNetworkFee: {
+          amount: '0.01',
+          valueInCurrency: '10.00',
+        },
+      } as unknown as QuoteResponse & QuoteMetadata;
+
+      // Act - initial render with USD
+      mockSelectCurrentCurrency.mockReturnValue('USD');
+      mockFormatNetworkFee.mockReturnValue('$10.00');
+
+      const { result: usdResult } = renderHookWithProvider(
+        () => useFormattedNetworkFee(quote),
+        { state: {} },
+      );
+
+      // Assert initial
+      expect(usdResult.current).toBe('$10.00');
+      expect(formatNetworkFee).toHaveBeenCalledWith('USD', quote);
+
+      // Arrange - change currency
+      mockSelectCurrentCurrency.mockReturnValue('EUR');
+      mockFormatNetworkFee.mockReturnValue('€10.00');
+
+      // Act - new render with EUR
+      const { result: eurResult } = renderHookWithProvider(
+        () => useFormattedNetworkFee(quote),
+        { state: {} },
+      );
+
+      // Assert after currency change
+      expect(eurResult.current).toBe('€10.00');
+      expect(formatNetworkFee).toHaveBeenCalledWith('EUR', quote);
+    });
+  });
+
+  describe('memoization', () => {
+    it('memoizes result when quote and currency remain unchanged', () => {
+      // Arrange
+      const quote = {
+        totalNetworkFee: {
+          amount: '0.01',
+          valueInCurrency: '10.00',
+        },
+      } as unknown as QuoteResponse & QuoteMetadata;
+
+      mockSelectCurrentCurrency.mockReturnValue('USD');
+      mockFormatNetworkFee.mockReturnValue('$10.00');
+
+      // Act
+      const { result } = renderHookWithProvider(
+        () => useFormattedNetworkFee(quote),
+        { state: {} },
+      );
+
+      // Assert
+      expect(result.current).toBe('$10.00');
+      expect(formatNetworkFee).toHaveBeenCalledTimes(1);
+    });
+
+    it('does not memoize result when quote changes', () => {
+      // Arrange
+      const initialQuote = {
+        totalNetworkFee: {
+          amount: '0.01',
+          valueInCurrency: '10.00',
+        },
+      } as unknown as QuoteResponse & QuoteMetadata;
+
+      const updatedQuote = {
+        totalNetworkFee: {
+          amount: '0.02',
+          valueInCurrency: '20.00',
+        },
+      } as unknown as QuoteResponse & QuoteMetadata;
+
+      mockSelectCurrentCurrency.mockReturnValue('USD');
+
+      // Act - first render
+      mockFormatNetworkFee.mockReturnValue('$10.00');
+      const { result: firstResult } = renderHookWithProvider(
+        () => useFormattedNetworkFee(initialQuote),
+        { state: {} },
+      );
+
+      // Act - second render with different quote
+      mockFormatNetworkFee.mockReturnValue('$20.00');
+      const { result: secondResult } = renderHookWithProvider(
+        () => useFormattedNetworkFee(updatedQuote),
+        { state: {} },
+      );
+
+      // Assert
+      expect(firstResult.current).toBe('$10.00');
+      expect(secondResult.current).toBe('$20.00');
+      expect(firstResult.current).not.toBe(secondResult.current);
+    });
+  });
+
+  describe('edge cases', () => {
+    it('handles missing totalNetworkFee in quote', () => {
+      // Arrange
+      const quote = {} as QuoteResponse & QuoteMetadata;
+
+      mockSelectCurrentCurrency.mockReturnValue('USD');
+      mockFormatNetworkFee.mockClear();
+      mockFormatNetworkFee.mockReturnValue('-');
+
+      // Act
+      const { result } = renderHookWithProvider(
+        () => useFormattedNetworkFee(quote),
+        { state: {} },
+      );
+
+      // Assert
+      expect(result.current).toBe('-');
+      expect(formatNetworkFee).toHaveBeenCalledWith('USD', quote);
+    });
+
+    it('handles unknown currency code', () => {
+      // Arrange
+      const quote = {
+        totalNetworkFee: {
+          amount: '0.01',
+          valueInCurrency: '10.00',
+        },
+      } as unknown as QuoteResponse & QuoteMetadata;
+
+      mockSelectCurrentCurrency.mockClear();
+      mockSelectCurrentCurrency.mockReturnValue('XYZ');
+      mockFormatNetworkFee.mockClear();
+      mockFormatNetworkFee.mockReturnValue('10.00 XYZ');
+
+      // Act
+      const { result } = renderHookWithProvider(
+        () => useFormattedNetworkFee(quote),
+        { state: {} },
+      );
+
+      // Assert
+      expect(result.current).toBe('10.00 XYZ');
+      expect(formatNetworkFee).toHaveBeenCalledWith('XYZ', quote);
+    });
+
+    it('handles empty string currency', () => {
+      // Arrange
+      const quote = {
+        totalNetworkFee: {
+          amount: '0.01',
+          valueInCurrency: '10.00',
+        },
+      } as unknown as QuoteResponse & QuoteMetadata;
+
+      mockSelectCurrentCurrency.mockClear();
+      mockSelectCurrentCurrency.mockReturnValue('');
+      mockFormatNetworkFee.mockClear();
+      mockFormatNetworkFee.mockReturnValue('-');
+
+      // Act
+      const { result } = renderHookWithProvider(
+        () => useFormattedNetworkFee(quote),
+        { state: {} },
+      );
+
+      // Assert
+      expect(result.current).toBe('-');
+      expect(formatNetworkFee).toHaveBeenCalledWith('', quote);
+    });
+  });
+});
diff --git a/app/components/UI/Bridge/hooks/useFormattedNetworkFee/index.ts b/app/components/UI/Bridge/hooks/useFormattedNetworkFee/index.ts
new file mode 100644
index 000000000000..8413e45ff8d3
--- /dev/null
+++ b/app/components/UI/Bridge/hooks/useFormattedNetworkFee/index.ts
@@ -0,0 +1,16 @@
+import { useMemo } from 'react';
+import { formatNetworkFee } from '../../utils/formatNetworkFee';
+import { useSelector } from 'react-redux';
+import { selectCurrentCurrency } from '../../../../../selectors/currencyRateController';
+import { QuoteMetadata, QuoteResponse } from '@metamask/bridge-controller';
+
+export const useFormattedNetworkFee = (
+  quote?: (QuoteMetadata & QuoteResponse) | null,
+) => {
+  const currency = useSelector(selectCurrentCurrency);
+  const networkFee = useMemo(
+    () => formatNetworkFee(currency, quote),
+    [quote, currency],
+  );
+  return networkFee;
+};
diff --git a/app/components/UI/Bridge/hooks/useIsNetworkGasSponsored/index.test.ts b/app/components/UI/Bridge/hooks/useIsNetworkGasSponsored/index.test.ts
new file mode 100644
index 000000000000..b708095a3fa4
--- /dev/null
+++ b/app/components/UI/Bridge/hooks/useIsNetworkGasSponsored/index.test.ts
@@ -0,0 +1,260 @@
+import { renderHookWithProvider } from '../../../../../util/test/renderWithProvider';
+import { useIsNetworkGasSponsored } from './index';
+import { getGasFeesSponsoredNetworkEnabled } from '../../../../../selectors/featureFlagController/gasFeesSponsored';
+import { Hex } from '@metamask/utils';
+
+jest.mock('../../../../../selectors/featureFlagController/gasFeesSponsored');
+
+const mockGetGasFeesSponsoredNetworkEnabled =
+  getGasFeesSponsoredNetworkEnabled as jest.MockedFunction<
+    typeof getGasFeesSponsoredNetworkEnabled
+  >;
+
+describe('useIsNetworkGasSponsored', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  describe('returns false', () => {
+    it('returns false when chainId is undefined', () => {
+      // Arrange
+      mockGetGasFeesSponsoredNetworkEnabled.mockReturnValue(() => false);
+
+      // Act
+      const { result } = renderHookWithProvider(
+        () => useIsNetworkGasSponsored(undefined),
+        { state: {} },
+      );
+
+      // Assert
+      expect(result.current).toBe(false);
+    });
+
+    it('returns false when gasFeesSponsoredNetworkEnabled is undefined', () => {
+      // Arrange
+      mockGetGasFeesSponsoredNetworkEnabled.mockReturnValue(
+        undefined as unknown as (chainId: string) => boolean,
+      );
+
+      // Act
+      const { result } = renderHookWithProvider(
+        () => useIsNetworkGasSponsored('0x1' as Hex),
+        { state: {} },
+      );
+
+      // Assert
+      expect(result.current).toBe(false);
+    });
+
+    it('returns false when network is not sponsored', () => {
+      // Arrange
+      mockGetGasFeesSponsoredNetworkEnabled.mockReturnValue(
+        (chainId) => chainId === '0x89', // Only Polygon is sponsored
+      );
+
+      // Act
+      const { result } = renderHookWithProvider(
+        () => useIsNetworkGasSponsored('0x1' as Hex), // Ethereum mainnet
+        { state: {} },
+      );
+
+      // Assert
+      expect(result.current).toBe(false);
+    });
+
+    it('returns false when both chainId and gasFeesSponsoredNetworkEnabled are undefined', () => {
+      // Arrange
+      mockGetGasFeesSponsoredNetworkEnabled.mockReturnValue(
+        undefined as unknown as (chainId: string) => boolean,
+      );
+
+      // Act
+      const { result } = renderHookWithProvider(
+        () => useIsNetworkGasSponsored(undefined),
+        { state: {} },
+      );
+
+      // Assert
+      expect(result.current).toBe(false);
+    });
+  });
+
+  describe('returns true', () => {
+    it('returns true when network is sponsored for Ethereum mainnet', () => {
+      // Arrange
+      mockGetGasFeesSponsoredNetworkEnabled.mockReturnValue(
+        (chainId) => chainId === '0x1', // Ethereum mainnet is sponsored
+      );
+
+      // Act
+      const { result } = renderHookWithProvider(
+        () => useIsNetworkGasSponsored('0x1' as Hex),
+        { state: {} },
+      );
+
+      // Assert
+      expect(result.current).toBe(true);
+    });
+
+    it('returns true when network is sponsored for Polygon', () => {
+      // Arrange
+      mockGetGasFeesSponsoredNetworkEnabled.mockReturnValue(
+        (chainId) => chainId === '0x89', // Polygon is sponsored
+      );
+
+      // Act
+      const { result } = renderHookWithProvider(
+        () => useIsNetworkGasSponsored('0x89' as Hex),
+        { state: {} },
+      );
+
+      // Assert
+      expect(result.current).toBe(true);
+    });
+
+    it('returns true when network is sponsored for Optimism', () => {
+      // Arrange
+      mockGetGasFeesSponsoredNetworkEnabled.mockReturnValue(
+        (chainId) => chainId === '0xa', // Optimism is sponsored
+      );
+
+      // Act
+      const { result } = renderHookWithProvider(
+        () => useIsNetworkGasSponsored('0xa' as Hex),
+        { state: {} },
+      );
+
+      // Assert
+      expect(result.current).toBe(true);
+    });
+
+    it('returns true for Solana when sponsored', () => {
+      // Arrange
+      const solanaChainId = 'solana:5eykt4UsFv8P8NJdTREpY1vzqKqZKvdp';
+      mockGetGasFeesSponsoredNetworkEnabled.mockReturnValue(
+        (chainId) => chainId === solanaChainId,
+      );
+
+      // Act
+      const { result } = renderHookWithProvider(
+        () => useIsNetworkGasSponsored(solanaChainId),
+        { state: {} },
+      );
+
+      // Assert
+      expect(result.current).toBe(true);
+    });
+  });
+
+  describe('multiple networks sponsored', () => {
+    it('returns true when multiple networks are sponsored', () => {
+      // Arrange
+      const sponsoredNetworks = ['0x1', '0x89', '0xa'];
+      mockGetGasFeesSponsoredNetworkEnabled.mockReturnValue((chainId) =>
+        sponsoredNetworks.includes(chainId),
+      );
+
+      // Act & Assert for each network
+      const ethereumResult = renderHookWithProvider(
+        () => useIsNetworkGasSponsored('0x1' as Hex),
+        { state: {} },
+      );
+      expect(ethereumResult.result.current).toBe(true);
+
+      const polygonResult = renderHookWithProvider(
+        () => useIsNetworkGasSponsored('0x89' as Hex),
+        { state: {} },
+      );
+      expect(polygonResult.result.current).toBe(true);
+
+      const optimismResult = renderHookWithProvider(
+        () => useIsNetworkGasSponsored('0xa' as Hex),
+        { state: {} },
+      );
+      expect(optimismResult.result.current).toBe(true);
+    });
+
+    it('returns false for unsupported network when multiple networks are sponsored', () => {
+      // Arrange
+      const sponsoredNetworks = ['0x1', '0x89', '0xa'];
+      mockGetGasFeesSponsoredNetworkEnabled.mockReturnValue((chainId) =>
+        sponsoredNetworks.includes(chainId),
+      );
+
+      // Act
+      const { result } = renderHookWithProvider(
+        () => useIsNetworkGasSponsored('0x38' as Hex), // BSC not sponsored
+        { state: {} },
+      );
+
+      // Assert
+      expect(result.current).toBe(false);
+    });
+  });
+
+  describe('different networks', () => {
+    it('correctly identifies Arbitrum as sponsored', () => {
+      // Arrange
+      mockGetGasFeesSponsoredNetworkEnabled.mockReturnValue(
+        (chainId) => chainId === '0xa4b1', // Arbitrum is sponsored
+      );
+
+      // Act
+      const { result } = renderHookWithProvider(
+        () => useIsNetworkGasSponsored('0xa4b1' as Hex),
+        { state: {} },
+      );
+
+      // Assert
+      expect(result.current).toBe(true);
+    });
+
+    it('correctly identifies Base as not sponsored', () => {
+      // Arrange
+      mockGetGasFeesSponsoredNetworkEnabled.mockReturnValue(
+        (chainId) => chainId === '0x1', // Only Ethereum is sponsored
+      );
+
+      // Act
+      const { result } = renderHookWithProvider(
+        () => useIsNetworkGasSponsored('0x2105' as Hex), // Base
+        { state: {} },
+      );
+
+      // Assert
+      expect(result.current).toBe(false);
+    });
+  });
+
+  describe('edge cases', () => {
+    it('handles empty string chainId', () => {
+      // Arrange
+      mockGetGasFeesSponsoredNetworkEnabled.mockReturnValue(() => true);
+
+      // Act
+      const { result } = renderHookWithProvider(
+        () => useIsNetworkGasSponsored('' as `${string}:${string}`),
+        { state: {} },
+      );
+
+      // Assert
+      expect(result.current).toBe(false);
+    });
+
+    it('handles null gasFeesSponsoredNetworkEnabled function', () => {
+      // Arrange
+      mockGetGasFeesSponsoredNetworkEnabled.mockReturnValue(
+        null as unknown as (chainId: string) => boolean,
+      );
+
+      // Act
+      const { result } = renderHookWithProvider(
+        () => useIsNetworkGasSponsored('0x1' as Hex),
+        { state: {} },
+      );
+
+      // Assert
+      expect(result.current).toBe(false);
+    });
+  });
+});
diff --git a/app/components/UI/Bridge/hooks/useIsNetworkGasSponsored/index.ts b/app/components/UI/Bridge/hooks/useIsNetworkGasSponsored/index.ts
new file mode 100644
index 000000000000..2f77fc340e63
--- /dev/null
+++ b/app/components/UI/Bridge/hooks/useIsNetworkGasSponsored/index.ts
@@ -0,0 +1,19 @@
+import { useSelector } from 'react-redux';
+import { getGasFeesSponsoredNetworkEnabled } from '../../../../../selectors/featureFlagController/gasFeesSponsored';
+import { useMemo } from 'react';
+import { BridgeToken } from '../../types';
+
+export const useIsNetworkGasSponsored = (chainId?: BridgeToken['chainId']) => {
+  const gasFeesSponsoredNetworkEnabled = useSelector(
+    getGasFeesSponsoredNetworkEnabled,
+  );
+
+  const isCurrentNetworkGasSponsored = useMemo(() => {
+    if (!chainId || !gasFeesSponsoredNetworkEnabled) {
+      return false;
+    }
+    return gasFeesSponsoredNetworkEnabled(chainId);
+  }, [chainId, gasFeesSponsoredNetworkEnabled]);
+
+  return isCurrentNetworkGasSponsored;
+};
diff --git a/app/components/UI/Bridge/hooks/useLatestBalance/index.ts b/app/components/UI/Bridge/hooks/useLatestBalance/index.ts
index 553771f3add1..f55e07f8e1c8 100644
--- a/app/components/UI/Bridge/hooks/useLatestBalance/index.ts
+++ b/app/components/UI/Bridge/hooks/useLatestBalance/index.ts
@@ -9,7 +9,11 @@ import { selectSelectedInternalAccountFormattedAddress } from '../../../../../se
 import { getProviderByChainId } from '../../../../../util/notifications/methods/common';
 import { BigNumber, constants, Contract } from 'ethers';
 import usePrevious from '../../../../hooks/usePrevious';
-import { isNativeAddress, isNonEvmChainId } from '@metamask/bridge-controller';
+import {
+  formatChainIdToCaip,
+  isNativeAddress,
+  isNonEvmChainId,
+} from '@metamask/bridge-controller';
 import { endTrace, trace, TraceName } from '../../../../../util/trace';
 import { useNonEvmTokensWithBalance } from '../useNonEvmTokensWithBalance';
 import { isEthAddress } from '../../../../../util/address';
@@ -50,6 +54,20 @@ interface Balance {
   atomicBalance: BigNumber;
 }
 
+// Non-EVM chains are case sensitive
+const normalizeTokenAddressForIdentity = (address?: string) =>
+  address && isEthAddress(address) ? address.toLowerCase() : address;
+
+// Used in case token and previous token are the same but chainId is in a different format
+const normalizeChainIdForIdentity = (chainId?: Hex | CaipChainId) =>
+  chainId ? formatChainIdToCaip(chainId) : undefined;
+
+const getTokenIdentity = (token?: {
+  address?: string;
+  chainId?: Hex | CaipChainId;
+}) =>
+  `${normalizeTokenAddressForIdentity(token?.address) ?? ''}::${normalizeChainIdForIdentity(token?.chainId) ?? ''}`;
+
 /**
  * A hook that fetches and returns the latest balance for a given token.
  * Latest balance is important because token balances can be cached and may not be updated immediately.
@@ -76,6 +94,26 @@ export const useLatestBalance = (token: {
   const nonEvmTokens = useNonEvmTokensWithBalance();
 
   const chainId = token.chainId;
+  const previousTokenIdentity = getTokenIdentity(previousToken);
+  const tokenIdentity = getTokenIdentity(token);
+  const tokenIdentityChanged = previousTokenIdentity !== tokenIdentity;
+
+  const setBalanceIfChanged = useCallback((nextBalance: Balance) => {
+    setBalance((currentBalance) => {
+      if (!currentBalance) {
+        return nextBalance;
+      }
+
+      if (
+        currentBalance.displayBalance === nextBalance.displayBalance &&
+        currentBalance.atomicBalance.eq(nextBalance.atomicBalance)
+      ) {
+        return currentBalance;
+      }
+
+      return nextBalance;
+    });
+  }, []);
 
   const handleFetchEvmAtomicBalance = useCallback(async () => {
     if (
@@ -106,7 +144,7 @@ export const useLatestBalance = (token: {
           chainId,
         );
         if (atomicBalance && token.decimals) {
-          setBalance({
+          setBalanceIfChanged({
             displayBalance: formatUnits(atomicBalance, token.decimals),
             atomicBalance,
           });
@@ -119,7 +157,13 @@ export const useLatestBalance = (token: {
         });
       }
     }
-  }, [token.address, token.decimals, chainId, selectedAddress]);
+  }, [
+    token.address,
+    token.decimals,
+    chainId,
+    selectedAddress,
+    setBalanceIfChanged,
+  ]);
 
   // No need to fetch the balance for non-EVM tokens, use the balance provided by the
   // multichain balances controller
@@ -138,46 +182,51 @@ export const useLatestBalance = (token: {
       )?.balance;
 
       if (displayBalance && token.decimals) {
-        setBalance({
+        setBalanceIfChanged({
           displayBalance,
           atomicBalance: parseUnits(displayBalance, token.decimals),
         });
       } else {
-        setBalance({
+        setBalanceIfChanged({
           displayBalance: '0',
           atomicBalance: parseUnits('0'),
         });
       }
     }
-  }, [token.address, token.decimals, chainId, selectedAddress, nonEvmTokens]);
+  }, [
+    token.address,
+    token.decimals,
+    chainId,
+    selectedAddress,
+    nonEvmTokens,
+    setBalanceIfChanged,
+  ]);
 
   useEffect(() => {
-    // Reset balance state when token address changes to prevent stale balance display
-    if (previousToken?.address !== token.address) {
+    // Reset balance state when token identity changes to prevent stale balance display.
+    if (tokenIdentityChanged) {
       setBalance(undefined);
     }
+  }, [previousTokenIdentity, tokenIdentity, tokenIdentityChanged]);
 
+  useEffect(() => {
     // In case chainId is undefined, exit early to avoid
     // calling handleFetchEvmAtomicBalance which will trigger an invalid address error
     // when selectedAddress is a non-EVM chain.
-    if (!chainId) {
+    if (!chainId || isCaipChainId(chainId)) {
       return;
     }
 
-    if (!isCaipChainId(chainId)) {
-      handleFetchEvmAtomicBalance();
-    }
+    handleFetchEvmAtomicBalance();
+  }, [chainId, handleFetchEvmAtomicBalance]);
 
-    if (isCaipChainId(chainId) && isNonEvmChainId(chainId)) {
-      handleNonEvmAtomicBalance();
+  useEffect(() => {
+    if (!chainId || !isCaipChainId(chainId) || !isNonEvmChainId(chainId)) {
+      return;
     }
-  }, [
-    handleFetchEvmAtomicBalance,
-    handleNonEvmAtomicBalance,
-    chainId,
-    previousToken?.address,
-    token.address,
-  ]);
+
+    handleNonEvmAtomicBalance();
+  }, [chainId, handleNonEvmAtomicBalance]);
 
   const cachedBalance = useMemo(() => {
     const displayBalance = token.balance;
@@ -192,17 +241,15 @@ export const useLatestBalance = (token: {
     }
 
     return { displayBalance, atomicBalance };
-    // Include token.address in the dependency array to ensure
-    // that the cached balance is updated when the token address changes.
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [token.balance, token.decimals, token.address]);
+  }, [token.balance, token.decimals]);
 
   if (!token.address || !token.decimals) {
     return undefined;
   }
 
-  // If the token has changed, return cached balance of new token, so we have time to fetch the new balance
-  if (previousToken?.address !== token.address) {
+  // If the token identity has changed, return cached balance of new token
+  // so we have time to fetch the new balance.
+  if (tokenIdentityChanged) {
     return cachedBalance;
   }
 
diff --git a/app/components/UI/Bridge/hooks/useLatestBalance/useLatestBalance.evmNonEvmDependency.test.tsx b/app/components/UI/Bridge/hooks/useLatestBalance/useLatestBalance.evmNonEvmDependency.test.tsx
new file mode 100644
index 000000000000..9ee3152868c5
--- /dev/null
+++ b/app/components/UI/Bridge/hooks/useLatestBalance/useLatestBalance.evmNonEvmDependency.test.tsx
@@ -0,0 +1,69 @@
+import {
+  initialState,
+  solanaNativeTokenAddress,
+} from '../../_mocks_/initialState';
+import { renderHookWithProvider } from '../../../../../util/test/renderWithProvider';
+import { useLatestBalance } from '.';
+import { getProviderByChainId } from '../../../../../util/notifications/methods/common';
+import { BigNumber, constants } from 'ethers';
+import { waitFor } from '@testing-library/react-native';
+import { Hex } from '@metamask/utils';
+import { SolScope } from '@metamask/keyring-api';
+
+const mockUseNonEvmTokensWithBalance = jest.fn();
+
+jest.mock('../../../../../util/notifications/methods/common', () => ({
+  getProviderByChainId: jest.fn(),
+}));
+
+jest.mock('../useNonEvmTokensWithBalance', () => ({
+  useNonEvmTokensWithBalance: () => mockUseNonEvmTokensWithBalance(),
+}));
+
+describe('useLatestBalance EVM/non-EVM dependencies', () => {
+  const mockProvider = {
+    getBalance: jest
+      .fn()
+      .mockResolvedValue(BigNumber.from('1000000000000000000')),
+  };
+
+  beforeEach(() => {
+    jest.clearAllMocks();
+    (getProviderByChainId as jest.Mock).mockReturnValue(mockProvider);
+    mockUseNonEvmTokensWithBalance.mockReturnValue([]);
+  });
+
+  it('does not retrigger EVM balance fetch when non-EVM token list changes', async () => {
+    let nonEvmTokens: { address: string; chainId: string; balance: string }[] =
+      [];
+    mockUseNonEvmTokensWithBalance.mockImplementation(() => nonEvmTokens);
+
+    const { rerender } = renderHookWithProvider(
+      () =>
+        useLatestBalance({
+          address: constants.AddressZero,
+          decimals: 18,
+          chainId: '0x1' as Hex,
+        }),
+      { state: initialState },
+    );
+
+    await waitFor(() => {
+      expect(mockProvider.getBalance).toHaveBeenCalledTimes(1);
+    });
+
+    nonEvmTokens = [
+      {
+        address: solanaNativeTokenAddress,
+        chainId: SolScope.Mainnet,
+        balance: '100.1',
+      },
+    ];
+
+    rerender(undefined);
+
+    await waitFor(() => {
+      expect(mockProvider.getBalance).toHaveBeenCalledTimes(1);
+    });
+  });
+});
diff --git a/app/components/UI/Bridge/hooks/useLatestBalance/useLatestBalance.test.tsx b/app/components/UI/Bridge/hooks/useLatestBalance/useLatestBalance.test.tsx
index 8754936cef91..c5bf78a4a86b 100644
--- a/app/components/UI/Bridge/hooks/useLatestBalance/useLatestBalance.test.tsx
+++ b/app/components/UI/Bridge/hooks/useLatestBalance/useLatestBalance.test.tsx
@@ -9,7 +9,7 @@ import { useLatestBalance } from '.';
 import { getProviderByChainId } from '../../../../../util/notifications/methods/common';
 import { BigNumber, constants } from 'ethers';
 import { waitFor } from '@testing-library/react-native';
-import { Hex, type CaipAssetId } from '@metamask/utils';
+import { Hex, type CaipAssetId, type CaipChainId } from '@metamask/utils';
 import { SolScope } from '@metamask/keyring-api';
 import { cloneDeep } from 'lodash';
 
@@ -664,6 +664,105 @@ describe('useLatestBalance', () => {
   });
 
   describe('balance reset when token address changes', () => {
+    it('does not treat equivalent EVM address casing as token identity change', async () => {
+      let tokenAddress = '0xabcdefabcdefabcdefabcdefabcdefabcdefabcd';
+      let tokenBalance = '10.0';
+
+      const { result, rerender } = renderHookWithProvider(
+        () =>
+          useLatestBalance({
+            address: tokenAddress,
+            decimals: 6,
+            chainId: '0x1' as Hex,
+            balance: tokenBalance,
+          }),
+        { state: initialState },
+      );
+
+      await waitFor(() => {
+        expect(result.current?.displayBalance).toBe('1.0');
+      });
+
+      tokenAddress = '0xABCDEFABCDEFABCDEFABCDEFABCDEFABCDEFABCD';
+      tokenBalance = '999.0';
+      rerender({ state: initialState });
+
+      expect(result.current?.displayBalance).toBe('1.0');
+    });
+
+    it('does not treat equivalent EVM chain formats as token identity change', async () => {
+      let chainId: Hex | CaipChainId = '0x1' as Hex;
+      let tokenBalance = '10.0';
+
+      const { result, rerender } = renderHookWithProvider(
+        () =>
+          useLatestBalance({
+            address: constants.AddressZero,
+            decimals: 18,
+            chainId,
+            balance: tokenBalance,
+          }),
+        { state: initialState },
+      );
+
+      await waitFor(() => {
+        expect(result.current?.displayBalance).toBe('1.0');
+      });
+
+      chainId = 'eip155:1' as CaipChainId;
+      tokenBalance = '999.0';
+      rerender({ state: initialState });
+
+      expect(result.current?.displayBalance).toBe('1.0');
+      expect(getProviderByChainId).toHaveBeenCalledTimes(1);
+    });
+
+    it('fetches new balance when chainId changes for the same native token address', async () => {
+      let chainId = '0x1' as Hex;
+      const mainnetProvider = {
+        getBalance: jest
+          .fn()
+          .mockResolvedValue(BigNumber.from('1000000000000000000')),
+      };
+      const lineaProvider = {
+        getBalance: jest
+          .fn()
+          .mockResolvedValue(BigNumber.from('2000000000000000000')),
+      };
+
+      (getProviderByChainId as jest.Mock).mockImplementation(
+        (requestedChainId: Hex) =>
+          requestedChainId === ('0xe708' as Hex)
+            ? lineaProvider
+            : mainnetProvider,
+      );
+
+      const { result, rerender } = renderHookWithProvider(
+        () =>
+          useLatestBalance({
+            address: constants.AddressZero,
+            decimals: 18,
+            chainId,
+          }),
+        { state: initialState },
+      );
+
+      await waitFor(() => {
+        expect(result.current?.displayBalance).toBe('1.0');
+      });
+
+      chainId = '0xe708' as Hex;
+      rerender({ state: initialState });
+
+      await waitFor(() => {
+        expect(result.current?.displayBalance).toBe('2.0');
+      });
+
+      expect(getProviderByChainId).toHaveBeenCalledWith('0xe708');
+      expect(mainnetProvider.getBalance).toHaveBeenCalledTimes(1);
+      expect(lineaProvider.getBalance).toHaveBeenCalledTimes(1);
+    });
+
     it('resets balance to undefined when token address changes', async () => {
       let tokenAddress = '0x1234567890123456789012345678901234567890';
 
diff --git a/app/components/UI/Bridge/hooks/usePopularTokens.test.ts b/app/components/UI/Bridge/hooks/usePopularTokens.test.ts
index fc0b631c25ff..d3739b3c9152 100644
--- a/app/components/UI/Bridge/hooks/usePopularTokens.test.ts
+++ b/app/components/UI/Bridge/hooks/usePopularTokens.test.ts
@@ -8,6 +8,14 @@ import {
 
 global.fetch = jest.fn();
 
+jest.mock('../../../../core/Engine', () => ({
+  context: {
+    AuthenticationController: {
+      getBearerToken: jest.fn().mockResolvedValue('mock-bearer-token'),
+    },
+  },
+}));
+
 const mockPopularTokens = [
   createMockPopularToken({ symbol: 'TEST', name: 'Test Token' }),
   createMockPopularToken({
@@ -50,7 +58,11 @@ describe('usePopularTokens', () => {
         expect.stringContaining('/getTokens/popular'),
         expect.objectContaining({
           method: 'POST',
-          headers: { 'Content-Type': 'application/json' },
+          headers: {
+            'Content-Type': 'application/json',
+            // Initial fetch may not have a bearer token
+            Authorization: 'Bearer ',
+          },
           body: JSON.stringify({
             chainIds: [MOCK_CHAIN_IDS.ethereum],
             includeAssets: [],
diff --git a/app/components/UI/Bridge/hooks/usePopularTokens.ts b/app/components/UI/Bridge/hooks/usePopularTokens.ts
index f83419307d2c..dbd5bef4874b 100644
--- a/app/components/UI/Bridge/hooks/usePopularTokens.ts
+++ b/app/components/UI/Bridge/hooks/usePopularTokens.ts
@@ -2,6 +2,7 @@ import { useState, useEffect } from 'react';
 import { CaipChainId, CaipAssetType } from '@metamask/utils';
 import { BRIDGE_API_BASE_URL } from '../../../../constants/bridge';
 import { TokenRwaData } from '@metamask/assets-controllers';
+import Engine from '../../../../core/Engine';
 
 export interface PopularToken {
   assetId: CaipAssetType;
@@ -109,6 +110,20 @@ export const usePopularTokens = ({
 }: UsePopularTokensParams): UsePopularTokensResult => {
   const [popularTokens, setPopularTokens] = useState<PopularToken[]>([]);
   const [isLoading, setIsLoading] = useState(true);
+  const [bearerToken, setBearerToken] = useState<string | null>(null);
+
+  useEffect(() => {
+    Engine.context.AuthenticationController.getBearerToken()
+      .then((token) => {
+        setBearerToken(token);
+      })
+      .catch((error) => {
+        console.warn(
+          'Failed to get bearer token for /getTokens/popular',
+          error,
+        );
+      });
+  }, []);
 
   useEffect(() => {
     const abortController = new AbortController();
@@ -141,6 +156,7 @@ export const usePopularTokens = ({
             method: 'POST',
             headers: {
               'Content-Type': 'application/json',
+              Authorization: `Bearer ${bearerToken ?? ''}`,
             },
             body: JSON.stringify({
               chainIds,
@@ -183,7 +199,7 @@ export const usePopularTokens = ({
       isCancelled = true;
       abortController.abort();
     };
-  }, [chainIds, includeAssets]);
+  }, [chainIds, includeAssets, bearerToken]);
 
   return { popularTokens, isLoading };
 };
diff --git a/app/components/UI/Bridge/hooks/useRenderQuoteExpireModal/index.ts b/app/components/UI/Bridge/hooks/useRenderQuoteExpireModal/index.ts
index c7a29bffe5af..c190735edf71 100644
--- a/app/components/UI/Bridge/hooks/useRenderQuoteExpireModal/index.ts
+++ b/app/components/UI/Bridge/hooks/useRenderQuoteExpireModal/index.ts
@@ -8,7 +8,7 @@ import {
   selectIsSelectingToken,
   selectIsSubmittingTx,
 } from '../../../../../core/redux/slices/bridge';
-import { useNavigation } from '@react-navigation/native';
+import { useIsFocused, useNavigation } from '@react-navigation/native';
 import Routes from '../../../../../constants/navigation/Routes';
 
 interface Params {
@@ -21,6 +21,7 @@ export const useRenderQuoteExpireModal = ({
   latestSourceBalance,
 }: Params) => {
   const navigation = useNavigation();
+  const isBridgeViewFocused = useIsFocused();
   const isSelectingRecipient = useSelector(selectIsSelectingRecipient);
   const isSelectingToken = useSelector(selectIsSelectingToken);
   const isSubmittingTx = useSelector(selectIsSubmittingTx);
@@ -46,6 +47,7 @@ export const useRenderQuoteExpireModal = ({
     if (
       isExpired &&
       !willRefresh &&
+      isBridgeViewFocused &&
       !isSelectingRecipient &&
       !isSelectingToken &&
       !isSubmittingTx &&
@@ -62,6 +64,7 @@ export const useRenderQuoteExpireModal = ({
     isExpired,
     willRefresh,
     navigation,
+    isBridgeViewFocused,
     isSelectingRecipient,
     isSelectingToken,
     isSubmittingTx,
diff --git a/app/components/UI/Bridge/hooks/useRenderQuoteExpireModal/useRenderQuoteExpireModal.test.ts b/app/components/UI/Bridge/hooks/useRenderQuoteExpireModal/useRenderQuoteExpireModal.test.ts
index 549a99f2c722..f595d5ffb7eb 100644
--- a/app/components/UI/Bridge/hooks/useRenderQuoteExpireModal/useRenderQuoteExpireModal.test.ts
+++ b/app/components/UI/Bridge/hooks/useRenderQuoteExpireModal/useRenderQuoteExpireModal.test.ts
@@ -29,12 +29,14 @@ import {
 
 // Mock navigation
 const mockNavigate = jest.fn();
+let mockIsFocused = true;
 jest.mock('@react-navigation/native', () => ({
   ...jest.requireActual('@react-navigation/native'),
   useNavigation: () => ({
     navigate: mockNavigate,
     setOptions: jest.fn(),
   }),
+  useIsFocused: () => mockIsFocused,
 }));
 
 const createMockInputRef = () => ({
@@ -53,6 +55,7 @@ const mockLatestSourceBalance = {
 describe('useRenderQuoteExpireModal', () => {
   beforeEach(() => {
     jest.clearAllMocks();
+    mockIsFocused = true;
     jest
       .mocked(useBridgeQuoteData)
       .mockReturnValue(
@@ -175,6 +178,29 @@ describe('useRenderQuoteExpireModal', () => {
     expect(mockNavigate).not.toHaveBeenCalled();
   });
 
+  it('does not navigate when bridge view is not focused', () => {
+    // Arrange
+    const inputRef = createMockInputRef();
+    mockIsFocused = false;
+    jest.mocked(useBridgeQuoteData).mockReturnValue({
+      ...mockUseBridgeQuoteData,
+      isExpired: true,
+      willRefresh: false,
+    } as ReturnType<typeof useBridgeQuoteData>);
+
+    // Act
+    renderHookWithProvider(() =>
+      useRenderQuoteExpireModal({
+        inputRef,
+        latestSourceBalance: mockLatestSourceBalance,
+      }),
+    );
+
+    // Assert
+    expect(inputRef.current.blur).not.toHaveBeenCalled();
+    expect(mockNavigate).not.toHaveBeenCalled();
+  });
+
   it('does not navigate when a transaction is being submitted', () => {
     // Arrange
     const inputRef = createMockInputRef();
@@ -223,6 +249,38 @@ describe('useRenderQuoteExpireModal', () => {
     expect(mockNavigate).toHaveBeenCalledTimes(1);
   });
 
+  it('shows modal after bridge view regains focus while quote remains expired', () => {
+    // Arrange
+    const inputRef = createMockInputRef();
+    mockIsFocused = false;
+    jest.mocked(useBridgeQuoteData).mockReturnValue({
+      ...mockUseBridgeQuoteData,
+      isExpired: true,
+      willRefresh: false,
+    } as ReturnType<typeof useBridgeQuoteData>);
+
+    // Act – render out of focus first
+    const { rerender } = renderHookWithProvider(() =>
+      useRenderQuoteExpireModal({
+        inputRef,
+        latestSourceBalance: mockLatestSourceBalance,
+      }),
+    );
+
+    expect(mockNavigate).not.toHaveBeenCalled();
+
+    // Regain focus while quote is still expired
+    mockIsFocused = true;
+    rerender({});
+
+    // Assert
+    expect(inputRef.current.blur).toHaveBeenCalledTimes(1);
+    expect(mockNavigate).toHaveBeenCalledTimes(1);
+    expect(mockNavigate).toHaveBeenCalledWith(Routes.BRIDGE.MODALS.ROOT, {
+      screen: Routes.BRIDGE.MODALS.QUOTE_EXPIRED_MODAL,
+    });
+  });
+
   it('resets and shows modal again after quote recovers then expires again', () => {
     // Arrange
     const inputRef = createMockInputRef();
diff --git a/app/components/UI/Bridge/hooks/useSearchTokens.test.ts b/app/components/UI/Bridge/hooks/useSearchTokens.test.ts
index b92e6b7a7f0a..01e8c6f24e61 100644
--- a/app/components/UI/Bridge/hooks/useSearchTokens.test.ts
+++ b/app/components/UI/Bridge/hooks/useSearchTokens.test.ts
@@ -9,6 +9,14 @@ import {
 
 global.fetch = jest.fn();
 
+jest.mock('../../../../core/Engine', () => ({
+  context: {
+    AuthenticationController: {
+      getBearerToken: jest.fn().mockResolvedValue('mock-bearer-token'),
+    },
+  },
+}));
+
 describe('useSearchTokens', () => {
   beforeEach(() => {
     jest.clearAllMocks();
@@ -55,7 +63,11 @@ describe('useSearchTokens', () => {
         expect.stringContaining('/getTokens/search'),
         expect.objectContaining({
           method: 'POST',
-          headers: { 'Content-Type': 'application/json' },
+          headers: {
+            'Content-Type': 'application/json',
+            // Initial fetch may not have a bearer token
+            Authorization: 'Bearer ',
+          },
           body: expect.stringContaining('test query'),
         }),
       );
diff --git a/app/components/UI/Bridge/hooks/useSearchTokens.ts b/app/components/UI/Bridge/hooks/useSearchTokens.ts
index cada57e717d1..5a1b689567b6 100644
--- a/app/components/UI/Bridge/hooks/useSearchTokens.ts
+++ b/app/components/UI/Bridge/hooks/useSearchTokens.ts
@@ -3,6 +3,7 @@ import { debounce } from 'lodash';
 import { CaipChainId } from '@metamask/utils';
 import { PopularToken, IncludeAsset } from './usePopularTokens';
 import { BRIDGE_API_BASE_URL } from '../../../../constants/bridge';
+import Engine from '../../../../core/Engine';
 
 const MIN_SEARCH_LENGTH = 3;
 
@@ -45,6 +46,7 @@ export const useSearchTokens = ({
   const [isSearchLoading, setIsSearchLoading] = useState(false);
   const [searchCursor, setSearchCursor] = useState<string | undefined>();
   const [isLoadingMore, setIsLoadingMore] = useState(false);
+  const [bearerToken, setBearerToken] = useState<string | null>(null);
   // Consumers need to distinguish "waiting for debounce" from "search returned 0 results"
   const [currentSearchQuery, setCurrentSearchQuery] = useState<string>('');
   const currentSearchQueryRef = useRef<string>('');
@@ -62,6 +64,16 @@ export const useSearchTokens = ({
     includeAssetsRef.current = includeAssets;
   }, [includeAssets]);
 
+  useEffect(() => {
+    Engine.context.AuthenticationController.getBearerToken()
+      .then((token) => {
+        setBearerToken(token);
+      })
+      .catch((error) => {
+        console.warn('Failed to get bearer token for /getTokens/search', error);
+      });
+  }, []);
+
   const resetSearch = useCallback(() => {
     setSearchResults([]);
     setSearchCursor(undefined);
@@ -118,6 +130,7 @@ export const useSearchTokens = ({
             method: 'POST',
             headers: {
               'Content-Type': 'application/json',
+              Authorization: `Bearer ${bearerToken ?? ''}`,
             },
             body: JSON.stringify(requestBody),
           },
@@ -156,7 +169,7 @@ export const useSearchTokens = ({
         }
       }
     },
-    [resetSearch],
+    [resetSearch, bearerToken],
   );
 
   // Create debounced search function
diff --git a/app/components/UI/Bridge/hooks/useShouldRenderGasSponsoredBanner/index.test.ts b/app/components/UI/Bridge/hooks/useShouldRenderGasSponsoredBanner/index.test.ts
new file mode 100644
index 000000000000..f34d0b616045
--- /dev/null
+++ b/app/components/UI/Bridge/hooks/useShouldRenderGasSponsoredBanner/index.test.ts
@@ -0,0 +1,400 @@
+import { renderHook } from '@testing-library/react-hooks';
+import { useShouldRenderGasSponsoredBanner } from './index';
+import { useIsNetworkGasSponsored } from '../useIsNetworkGasSponsored';
+import { useSelector } from 'react-redux';
+
+jest.mock('../useIsNetworkGasSponsored');
+jest.mock('react-redux', () => ({
+  useSelector: jest.fn(),
+}));
+
+const mockUseIsNetworkGasSponsored =
+  useIsNetworkGasSponsored as jest.MockedFunction<
+    typeof useIsNetworkGasSponsored
+  >;
+const mockUseSelector = useSelector as jest.MockedFunction<typeof useSelector>;
+
+describe('useShouldRenderGasSponsoredBanner', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+    mockUseSelector.mockReturnValue(null);
+    mockUseIsNetworkGasSponsored.mockReturnValue(false);
+  });
+
+  describe('returns true when quoteGasSponsored is true', () => {
+    it('returns true when quoteGasSponsored is true regardless of other conditions', () => {
+      // Arrange
+      mockUseIsNetworkGasSponsored.mockReturnValue(false);
+
+      // Act
+      const { result } = renderHook(() =>
+        useShouldRenderGasSponsoredBanner({
+          quoteGasSponsored: true,
+          hasInsufficientBalance: false,
+        }),
+      );
+
+      // Assert
+      expect(result.current).toBe(true);
+    });
+
+    it('returns true when quoteGasSponsored is true with insufficient balance and network not sponsored', () => {
+      // Arrange
+      mockUseIsNetworkGasSponsored.mockReturnValue(false);
+
+      // Act
+      const { result } = renderHook(() =>
+        useShouldRenderGasSponsoredBanner({
+          quoteGasSponsored: true,
+          hasInsufficientBalance: true,
+        }),
+      );
+
+      // Assert
+      expect(result.current).toBe(true);
+    });
+
+    it('returns true when quoteGasSponsored is true with sufficient balance and network sponsored', () => {
+      // Arrange
+      mockUseIsNetworkGasSponsored.mockReturnValue(true);
+
+      // Act
+      const { result } = renderHook(() =>
+        useShouldRenderGasSponsoredBanner({
+          quoteGasSponsored: true,
+          hasInsufficientBalance: false,
+        }),
+      );
+
+      // Assert
+      expect(result.current).toBe(true);
+    });
+  });
+
+  describe('returns true when insufficient balance and network is sponsored', () => {
+    it('returns true when user has insufficient balance and network is sponsored', () => {
+      // Arrange
+      mockUseIsNetworkGasSponsored.mockReturnValue(true);
+
+      // Act
+      const { result } = renderHook(() =>
+        useShouldRenderGasSponsoredBanner({
+          quoteGasSponsored: false,
+          hasInsufficientBalance: true,
+        }),
+      );
+
+      // Assert
+      expect(result.current).toBe(true);
+    });
+  });
+
+  describe('returns false', () => {
+    it('returns false when quoteGasSponsored is false and balance is sufficient', () => {
+      // Arrange
+      mockUseIsNetworkGasSponsored.mockReturnValue(false);
+
+      // Act
+      const { result } = renderHook(() =>
+        useShouldRenderGasSponsoredBanner({
+          quoteGasSponsored: false,
+          hasInsufficientBalance: false,
+        }),
+      );
+
+      // Assert
+      expect(result.current).toBe(false);
+    });
+
+    it('returns false when insufficient balance but network is not sponsored', () => {
+      // Arrange
+      mockUseIsNetworkGasSponsored.mockReturnValue(false);
+
+      // Act
+      const { result } = renderHook(() =>
+        useShouldRenderGasSponsoredBanner({
+          quoteGasSponsored: false,
+          hasInsufficientBalance: true,
+        }),
+      );
+
+      // Assert
+      expect(result.current).toBe(false);
+    });
+
+    it('returns false when sufficient balance but network is sponsored', () => {
+      // Arrange
+      mockUseIsNetworkGasSponsored.mockReturnValue(true);
+
+      // Act
+      const { result } = renderHook(() =>
+        useShouldRenderGasSponsoredBanner({
+          quoteGasSponsored: false,
+          hasInsufficientBalance: false,
+        }),
+      );
+
+      // Assert
+      expect(result.current).toBe(false);
+    });
+
+    it('returns false when quoteGasSponsored is undefined and balance is sufficient', () => {
+      // Arrange
+      mockUseIsNetworkGasSponsored.mockReturnValue(false);
+
+      // Act
+      const { result } = renderHook(() =>
+        useShouldRenderGasSponsoredBanner({
+          quoteGasSponsored: undefined,
+          hasInsufficientBalance: false,
+        }),
+      );
+
+      // Assert
+      expect(result.current).toBe(false);
+    });
+  });
+
+  describe('truth table for all conditions', () => {
+    it('quoteGasSponsored=true, hasInsufficientBalance=true, isNetworkGasSponsored=true → returns true', () => {
+      mockUseIsNetworkGasSponsored.mockReturnValue(true);
+
+      const { result } = renderHook(() =>
+        useShouldRenderGasSponsoredBanner({
+          quoteGasSponsored: true,
+          hasInsufficientBalance: true,
+        }),
+      );
+
+      expect(result.current).toBe(true);
+    });
+
+    it('quoteGasSponsored=true, hasInsufficientBalance=true, isNetworkGasSponsored=false → returns true', () => {
+      mockUseIsNetworkGasSponsored.mockReturnValue(false);
+
+      const { result } = renderHook(() =>
+        useShouldRenderGasSponsoredBanner({
+          quoteGasSponsored: true,
+          hasInsufficientBalance: true,
+        }),
+      );
+
+      expect(result.current).toBe(true);
+    });
+
+    it('quoteGasSponsored=true, hasInsufficientBalance=false, isNetworkGasSponsored=true → returns true', () => {
+      mockUseIsNetworkGasSponsored.mockReturnValue(true);
+
+      const { result } = renderHook(() =>
+        useShouldRenderGasSponsoredBanner({
+          quoteGasSponsored: true,
+          hasInsufficientBalance: false,
+        }),
+      );
+
+      expect(result.current).toBe(true);
+    });
+
+    it('quoteGasSponsored=true, hasInsufficientBalance=false, isNetworkGasSponsored=false → returns true', () => {
+      mockUseIsNetworkGasSponsored.mockReturnValue(false);
+
+      const { result } = renderHook(() =>
+        useShouldRenderGasSponsoredBanner({
+          quoteGasSponsored: true,
+          hasInsufficientBalance: false,
+        }),
+      );
+
+      expect(result.current).toBe(true);
+    });
+
+    it('quoteGasSponsored=false, hasInsufficientBalance=true, isNetworkGasSponsored=true → returns true', () => {
+      mockUseIsNetworkGasSponsored.mockReturnValue(true);
+
+      const { result } = renderHook(() =>
+        useShouldRenderGasSponsoredBanner({
+          quoteGasSponsored: false,
+          hasInsufficientBalance: true,
+        }),
+      );
+
+      expect(result.current).toBe(true);
+    });
+
+    it('quoteGasSponsored=false, hasInsufficientBalance=true, isNetworkGasSponsored=false → returns false', () => {
+      mockUseIsNetworkGasSponsored.mockReturnValue(false);
+
+      const { result } = renderHook(() =>
+        useShouldRenderGasSponsoredBanner({
+          quoteGasSponsored: false,
+          hasInsufficientBalance: true,
+        }),
+      );
+
+      expect(result.current).toBe(false);
+    });
+
+    it('quoteGasSponsored=false, hasInsufficientBalance=false, isNetworkGasSponsored=true → returns false', () => {
+      mockUseIsNetworkGasSponsored.mockReturnValue(true);
+
+      const { result } = renderHook(() =>
+        useShouldRenderGasSponsoredBanner({
+          quoteGasSponsored: false,
+          hasInsufficientBalance: false,
+        }),
+      );
+
+      expect(result.current).toBe(false);
+    });
+
+    it('quoteGasSponsored=false, hasInsufficientBalance=false, isNetworkGasSponsored=false → returns false', () => {
+      mockUseIsNetworkGasSponsored.mockReturnValue(false);
+
+      const { result } = renderHook(() =>
+        useShouldRenderGasSponsoredBanner({
+          quoteGasSponsored: false,
+          hasInsufficientBalance: false,
+        }),
+      );
+
+      expect(result.current).toBe(false);
+    });
+  });
+
+  describe('edge cases', () => {
+    it('handles undefined quoteGasSponsored as false', () => {
+      mockUseIsNetworkGasSponsored.mockReturnValue(false);
+
+      const { result } = renderHook(() =>
+        useShouldRenderGasSponsoredBanner({
+          quoteGasSponsored: undefined,
+          hasInsufficientBalance: false,
+        }),
+      );
+
+      expect(result.current).toBe(false);
+    });
+
+    it('returns true when quoteGasSponsored is undefined but insufficient balance with network sponsored', () => {
+      mockUseIsNetworkGasSponsored.mockReturnValue(true);
+
+      const { result } = renderHook(() =>
+        useShouldRenderGasSponsoredBanner({
+          quoteGasSponsored: undefined,
+          hasInsufficientBalance: true,
+        }),
+      );
+
+      expect(result.current).toBe(true);
+    });
+  });
+
+  describe('selector integration', () => {
+    it('calls useIsNetworkGasSponsored with sourceToken chainId', () => {
+      // Arrange
+      const sourceToken = {
+        address: '0x0000000000000000000000000000000000000000',
+        symbol: 'ETH',
+        decimals: 18,
+        chainId: '0x1',
+      };
+
+      mockUseSelector.mockReturnValue(sourceToken);
+      mockUseIsNetworkGasSponsored.mockReturnValue(false);
+
+      // Act
+      renderHook(() =>
+        useShouldRenderGasSponsoredBanner({
+          quoteGasSponsored: false,
+          hasInsufficientBalance: false,
+        }),
+      );
+
+      // Assert
+      expect(mockUseIsNetworkGasSponsored).toHaveBeenCalledWith('0x1');
+    });
+
+    it('calls useIsNetworkGasSponsored with undefined when sourceToken is null', () => {
+      // Arrange
+      mockUseSelector.mockReturnValue(null);
+      mockUseIsNetworkGasSponsored.mockReturnValue(false);
+
+      // Act
+      renderHook(() =>
+        useShouldRenderGasSponsoredBanner({
+          quoteGasSponsored: false,
+          hasInsufficientBalance: false,
+        }),
+      );
+
+      // Assert
+      expect(mockUseIsNetworkGasSponsored).toHaveBeenCalledWith(undefined);
+    });
+  });
+
+  describe('realistic scenarios', () => {
+    it('shows banner for gasless quote with sufficient balance', () => {
+      // Arrange
+      mockUseIsNetworkGasSponsored.mockReturnValue(false);
+
+      // Act
+      const { result } = renderHook(() =>
+        useShouldRenderGasSponsoredBanner({
+          quoteGasSponsored: true,
+          hasInsufficientBalance: false,
+        }),
+      );
+
+      // Assert
+      expect(result.current).toBe(true);
+    });
+
+    it('shows banner when user has insufficient balance on sponsored network', () => {
+      // Arrange
+      mockUseIsNetworkGasSponsored.mockReturnValue(true);
+
+      // Act
+      const { result } = renderHook(() =>
+        useShouldRenderGasSponsoredBanner({
+          quoteGasSponsored: false,
+          hasInsufficientBalance: true,
+        }),
+      );
+
+      // Assert
+      expect(result.current).toBe(true);
+    });
+
+    it('does not show banner for regular quote with sufficient balance', () => {
+      // Arrange
+      mockUseIsNetworkGasSponsored.mockReturnValue(false);
+
+      // Act
+      const { result } = renderHook(() =>
+        useShouldRenderGasSponsoredBanner({
+          quoteGasSponsored: false,
+          hasInsufficientBalance: false,
+        }),
+      );
+
+      // Assert
+      expect(result.current).toBe(false);
+    });
+
+    it('does not show banner when insufficient balance on non-sponsored network', () => {
+      // Arrange
+      mockUseIsNetworkGasSponsored.mockReturnValue(false);
+
+      // Act
+      const { result } = renderHook(() =>
+        useShouldRenderGasSponsoredBanner({
+          quoteGasSponsored: false,
+          hasInsufficientBalance: true,
+        }),
+      );
+
+      // Assert
+      expect(result.current).toBe(false);
+    });
+  });
+});
diff --git a/app/components/UI/Bridge/hooks/useShouldRenderGasSponsoredBanner/index.ts b/app/components/UI/Bridge/hooks/useShouldRenderGasSponsoredBanner/index.ts
new file mode 100644
index 000000000000..fec10e928af7
--- /dev/null
+++ b/app/components/UI/Bridge/hooks/useShouldRenderGasSponsoredBanner/index.ts
@@ -0,0 +1,21 @@
+import { useIsNetworkGasSponsored } from '../useIsNetworkGasSponsored';
+import { useSelector } from 'react-redux';
+import { selectSourceToken } from '../../../../../core/redux/slices/bridge';
+
+interface Props {
+  quoteGasSponsored?: boolean;
+  hasInsufficientBalance: boolean;
+}
+
+export const useShouldRenderGasSponsoredBanner = ({
+  quoteGasSponsored,
+  hasInsufficientBalance,
+}: Props) => {
+  const sourceToken = useSelector(selectSourceToken);
+  const isNetworkGasSponsored = useIsNetworkGasSponsored(sourceToken?.chainId);
+
+  const shouldShowGasSponsored =
+    quoteGasSponsored || (hasInsufficientBalance && isNetworkGasSponsored);
+
+  return shouldShowGasSponsored;
+};
diff --git a/app/components/UI/Bridge/hooks/useShouldRenderMaxOption/index.ts b/app/components/UI/Bridge/hooks/useShouldRenderMaxOption/index.ts
index cab9c1ef187c..19daf1603a36 100644
--- a/app/components/UI/Bridge/hooks/useShouldRenderMaxOption/index.ts
+++ b/app/components/UI/Bridge/hooks/useShouldRenderMaxOption/index.ts
@@ -1,31 +1,17 @@
 import { useSelector } from 'react-redux';
-import { selectShouldUseSmartTransaction } from '../../../../../selectors/smartTransactionsController';
-import { RootState } from '../../../../../reducers';
-import { selectIsGaslessSwapEnabled } from '../../../../../core/redux/slices/bridge';
+import { selectGasIncludedQuoteParams } from '../../../../../selectors/bridge';
 import { BridgeToken } from '../../types';
 import { useTokenAddress } from '../useTokenAddress';
-import {
-  formatChainIdToHex,
-  isNativeAddress,
-  isNonEvmChainId,
-} from '@metamask/bridge-controller';
+import { isNativeAddress } from '@metamask/bridge-controller';
 import { BigNumber } from 'bignumber.js';
 
 export const useShouldRenderMaxOption = (
   token?: BridgeToken,
   displayBalance?: string,
-  isQuoteSponsored = false,
+  _isQuoteSponsored = false,
 ) => {
-  const isGaslessSwapEnabled = useSelector((state: RootState) =>
-    token?.chainId ? selectIsGaslessSwapEnabled(state, token.chainId) : false,
-  );
-  const stxEnabled = useSelector((state: RootState) =>
-    token?.chainId && !isNonEvmChainId(token.chainId)
-      ? selectShouldUseSmartTransaction(
-          state,
-          formatChainIdToHex(token.chainId),
-        )
-      : false,
+  const { gasIncluded, gasIncluded7702 } = useSelector(
+    selectGasIncludedQuoteParams,
   );
   const tokenAddress = useTokenAddress(token);
   const isNativeAsset = isNativeAddress(tokenAddress);
@@ -41,10 +27,5 @@ export const useShouldRenderMaxOption = (
     return true;
   }
 
-  // Show for EVM native tokens if gasless swap is enabled OR quote is sponsored
-  // while smart transactions is enabled.
-  // For non-EVM native tokens stxEnabled will be false evaluating the whole
-  // expression to false. We do not know the fees beforehand so we cannot
-  // max out the input amount.
-  return (isGaslessSwapEnabled || isQuoteSponsored) && stxEnabled;
+  return gasIncluded || gasIncluded7702;
 };
diff --git a/app/components/UI/Bridge/hooks/useShouldRenderMaxOption/useShouldRenderMaxOption.test.ts b/app/components/UI/Bridge/hooks/useShouldRenderMaxOption/useShouldRenderMaxOption.test.ts
index 68d0c3cd7474..33510af815a6 100644
--- a/app/components/UI/Bridge/hooks/useShouldRenderMaxOption/useShouldRenderMaxOption.test.ts
+++ b/app/components/UI/Bridge/hooks/useShouldRenderMaxOption/useShouldRenderMaxOption.test.ts
@@ -1,12 +1,11 @@
 import { renderHook } from '@testing-library/react-hooks';
-import { useShouldRenderMaxOption } from '.';
-import { BridgeToken } from '../../types';
 import { CHAIN_IDS } from '@metamask/transaction-controller';
+import { isNativeAddress } from '@metamask/bridge-controller';
 import { useSelector } from 'react-redux';
+import { useShouldRenderMaxOption } from '.';
+import { BridgeToken } from '../../types';
 import { useTokenAddress } from '../useTokenAddress';
-import { isNativeAddress } from '@metamask/bridge-controller';
 
-// Mock dependencies
 jest.mock('react-redux', () => ({
   useSelector: jest.fn(),
 }));
@@ -15,17 +14,13 @@ jest.mock('../useTokenAddress', () => ({
   useTokenAddress: jest.fn(),
 }));
 
-jest.mock('@metamask/bridge-controller', () => ({
-  isNativeAddress: jest.fn(),
-}));
-
-jest.mock('../../../../../core/redux/slices/bridge', () => ({
-  selectIsGaslessSwapEnabled: jest.fn(),
-}));
-
-jest.mock('../../../../../selectors/smartTransactionsController', () => ({
-  selectShouldUseSmartTransaction: jest.fn(),
-}));
+jest.mock('@metamask/bridge-controller', () => {
+  const actual = jest.requireActual('@metamask/bridge-controller');
+  return {
+    ...actual,
+    isNativeAddress: jest.fn(),
+  };
+});
 
 const mockUseSelector = useSelector as jest.MockedFunction<typeof useSelector>;
 const mockUseTokenAddress = useTokenAddress as jest.MockedFunction<
@@ -35,560 +30,154 @@ const mockIsNativeAddress = isNativeAddress as jest.MockedFunction<
   typeof isNativeAddress
 >;
 
-/**
- * IMPORTANT: useSelector call order in the hook:
- * 1. First call: isGaslessSwapEnabled (line 12 in hook)
- * 2. Second call: stxEnabled (line 15 in hook)
- */
-describe('useShouldRenderMaxOption', () => {
-  const mockToken: BridgeToken = {
-    address: '0x1234567890123456789012345678901234567890',
-    symbol: 'TEST',
-    decimals: 18,
-    chainId: CHAIN_IDS.MAINNET,
-  };
-
-  const nativeToken: BridgeToken = {
-    address: '0x0000000000000000000000000000000000000000',
-    symbol: 'ETH',
-    decimals: 18,
-    chainId: CHAIN_IDS.MAINNET,
-  };
+const mockToken: BridgeToken = {
+  address: '0x1234567890123456789012345678901234567890',
+  symbol: 'TEST',
+  decimals: 18,
+  chainId: CHAIN_IDS.MAINNET,
+};
+
+const nativeToken: BridgeToken = {
+  address: '0x0000000000000000000000000000000000000000',
+  symbol: 'ETH',
+  decimals: 18,
+  chainId: CHAIN_IDS.MAINNET,
+};
+
+const setSelectorValues = ({
+  gasIncluded = false,
+  gasIncluded7702 = false,
+}: {
+  gasIncluded?: boolean;
+  gasIncluded7702?: boolean;
+} = {}) => {
+  mockUseSelector.mockImplementation(() => ({ gasIncluded, gasIncluded7702 }));
+};
 
+describe('useShouldRenderMaxOption', () => {
   beforeEach(() => {
     jest.clearAllMocks();
+
+    setSelectorValues();
     mockUseTokenAddress.mockReturnValue(mockToken.address);
     mockIsNativeAddress.mockReturnValue(false);
-    // Default: isGaslessSwapEnabled = false, stxEnabled = true
-    let callCount = 0;
-    mockUseSelector.mockImplementation(() => {
-      callCount++;
-      // First call: isGaslessSwapEnabled = false
-      // Second call: stxEnabled = true
-      return callCount === 2;
-    });
   });
 
-  describe('Zero balance scenarios', () => {
-    it('returns false when displayBalance is undefined', () => {
-      const { result } = renderHook(() =>
-        useShouldRenderMaxOption(mockToken, undefined, false),
-      );
-
-      expect(result.current).toBe(false);
-    });
-
-    it('returns false when displayBalance is "0"', () => {
-      const { result } = renderHook(() =>
-        useShouldRenderMaxOption(mockToken, '0', false),
-      );
+  it('returns false when token is undefined', () => {
+    const { result } = renderHook(() =>
+      useShouldRenderMaxOption(undefined, '10'),
+    );
 
-      expect(result.current).toBe(false);
-    });
-
-    it('returns false when displayBalance is "0.0"', () => {
-      const { result } = renderHook(() =>
-        useShouldRenderMaxOption(mockToken, '0.0', false),
-      );
-
-      expect(result.current).toBe(false);
-    });
-
-    it('returns false when displayBalance is empty string', () => {
-      const { result } = renderHook(() =>
-        useShouldRenderMaxOption(mockToken, '', false),
-      );
-
-      expect(result.current).toBe(false);
-    });
+    expect(result.current).toBe(false);
   });
 
-  describe('Non-native token scenarios', () => {
-    beforeEach(() => {
-      mockIsNativeAddress.mockReturnValue(false);
-      mockUseTokenAddress.mockReturnValue(mockToken.address);
-    });
-
-    it('returns true for non-native token with balance regardless of gasless', () => {
-      mockUseSelector.mockImplementation(() => false); // Both selectors false
-
-      const { result } = renderHook(() =>
-        useShouldRenderMaxOption(mockToken, '100.5', false),
-      );
-
-      expect(result.current).toBe(true);
-    });
-
-    it('returns true for non-native token with balance regardless of stxEnabled', () => {
-      mockUseSelector.mockImplementation(() => false); // stxEnabled = false
-
-      const { result } = renderHook(() =>
-        useShouldRenderMaxOption(mockToken, '50', false),
-      );
-
-      expect(result.current).toBe(true);
-    });
-
-    it('returns true for non-native token with balance regardless of isQuoteSponsored', () => {
-      const { result } = renderHook(() =>
-        useShouldRenderMaxOption(mockToken, '25.75', true),
-      );
-
-      expect(result.current).toBe(true);
-    });
-
-    it('returns true for non-native token with very small balance', () => {
-      const { result } = renderHook(() =>
-        useShouldRenderMaxOption(mockToken, '0.000001', false),
-      );
-
-      expect(result.current).toBe(true);
-    });
+  it('returns false when display balance is zero', () => {
+    const { result } = renderHook(() =>
+      useShouldRenderMaxOption(mockToken, '0'),
+    );
 
-    it('returns false for non-native token with zero balance', () => {
-      const { result } = renderHook(() =>
-        useShouldRenderMaxOption(mockToken, '0', false),
-      );
-
-      expect(result.current).toBe(false);
-    });
+    expect(result.current).toBe(false);
   });
 
-  describe('Native token scenarios', () => {
-    beforeEach(() => {
-      mockIsNativeAddress.mockReturnValue(true);
-      mockUseTokenAddress.mockReturnValue(nativeToken.address);
-    });
-
-    it('returns false when native token has zero balance', () => {
-      const { result } = renderHook(() =>
-        useShouldRenderMaxOption(nativeToken, '0', false),
-      );
-
-      expect(result.current).toBe(false);
-    });
-
-    it('returns false when native token has zero balance even with all conditions favorable', () => {
-      mockIsNativeAddress.mockReturnValue(true);
-      mockUseTokenAddress.mockReturnValue(nativeToken.address);
-      mockUseSelector.mockReturnValue(true); // stxEnabled=true, gasless=true
+  it('returns true for non-native token with positive balance', () => {
+    mockIsNativeAddress.mockReturnValue(false);
 
-      const { result } = renderHook(
-        () => useShouldRenderMaxOption(nativeToken, '0', true), // sponsored=true
-      );
+    const { result } = renderHook(() =>
+      useShouldRenderMaxOption(mockToken, '10'),
+    );
 
-      // Zero balance always returns false
-      expect(result.current).toBe(false);
-    });
+    expect(result.current).toBe(true);
   });
 
-  describe('Edge cases', () => {
-    it('returns false when token is undefined', () => {
-      mockUseTokenAddress.mockReturnValue(undefined);
-
-      const { result } = renderHook(() =>
-        useShouldRenderMaxOption(undefined, '100', false),
-      );
-
-      expect(result.current).toBe(false);
-    });
+  it('returns true for native token when gasIncluded is enabled', () => {
+    setSelectorValues({ gasIncluded: true });
+    mockUseTokenAddress.mockReturnValue(nativeToken.address);
+    mockIsNativeAddress.mockReturnValue(true);
 
-    it('returns false when token is undefined but has balance', () => {
-      mockUseTokenAddress.mockReturnValue(undefined);
-      mockIsNativeAddress.mockReturnValue(false);
-
-      const { result } = renderHook(() =>
-        useShouldRenderMaxOption(undefined, '500', false),
-      );
-
-      expect(result.current).toBe(false);
-    });
+    const { result } = renderHook(() =>
+      useShouldRenderMaxOption(nativeToken, '1.25'),
+    );
 
-    it('handles large balance values correctly for non-native tokens', () => {
-      mockIsNativeAddress.mockReturnValue(false);
-      mockUseTokenAddress.mockReturnValue(mockToken.address);
-
-      const { result } = renderHook(() =>
-        useShouldRenderMaxOption(mockToken, '1000000.123456789', false),
-      );
-
-      expect(result.current).toBe(true);
-    });
-
-    it('handles very small but non-zero balance for non-native tokens', () => {
-      mockIsNativeAddress.mockReturnValue(false);
-      mockUseTokenAddress.mockReturnValue(mockToken.address);
-
-      const { result } = renderHook(() =>
-        useShouldRenderMaxOption(mockToken, '0.000000001', false),
-      );
-
-      expect(result.current).toBe(true);
-    });
-
-    it('correctly identifies native token without chainId in token object', () => {
-      const tokenWithoutChainId = {
-        address: '0x0000000000000000000000000000000000000000',
-        symbol: 'ETH',
-        decimals: 18,
-      } as BridgeToken;
-
-      mockIsNativeAddress.mockReturnValue(true);
-      mockUseTokenAddress.mockReturnValue(tokenWithoutChainId.address);
-      mockUseSelector.mockReturnValue(false); // stxEnabled = false, isGaslessSwapEnabled = false
-
-      const { result } = renderHook(() =>
-        useShouldRenderMaxOption(tokenWithoutChainId, '100', false),
-      );
-
-      // Should return false (native + no gasless + no sponsored + no stx)
-      expect(result.current).toBe(false);
-    });
+    expect(result.current).toBe(true);
   });
 
-  describe('Hook parameter validation', () => {
-    it('uses useTokenAddress hook to get token address', () => {
-      const customToken = {
-        ...mockToken,
-        address: '0xabcdef1234567890abcdef1234567890abcdef12',
-      };
-      mockUseTokenAddress.mockReturnValue(customToken.address);
-
-      renderHook(() => useShouldRenderMaxOption(customToken, '100', false));
-
-      expect(mockUseTokenAddress).toHaveBeenCalledWith(customToken);
-    });
-
-    it('checks if token address is native using isNativeAddress', () => {
-      const tokenAddress = '0x1234567890123456789012345678901234567890';
-      mockUseTokenAddress.mockReturnValue(tokenAddress);
-      mockIsNativeAddress.mockReturnValue(false);
-
-      renderHook(() => useShouldRenderMaxOption(mockToken, '100', false));
-
-      expect(mockIsNativeAddress).toHaveBeenCalledWith(tokenAddress);
+  it('returns true for native token when 7702 is enabled', () => {
+    setSelectorValues({
+      gasIncluded: false,
+      gasIncluded7702: true,
     });
+    mockUseTokenAddress.mockReturnValue(nativeToken.address);
+    mockIsNativeAddress.mockReturnValue(true);
 
-    it('calls selectIsGaslessSwapEnabled with correct chainId', () => {
-      const tokenWithChainId = {
-        ...mockToken,
-        chainId: '0xa' as `0x${string}`, // Optimism
-      };
-      mockUseSelector.mockReturnValue(true);
-
-      renderHook(() =>
-        useShouldRenderMaxOption(tokenWithChainId, '100', false),
-      );
+    const { result } = renderHook(() =>
+      useShouldRenderMaxOption(nativeToken, '1.25'),
+    );
 
-      // Verify useSelector was called (it uses selectIsGaslessSwapEnabled)
-      expect(mockUseSelector).toHaveBeenCalled();
-    });
-  });
-
-  describe('Default parameter values', () => {
-    it('uses false as default for isQuoteSponsored when not provided', () => {
-      mockIsNativeAddress.mockReturnValue(true);
-      mockUseTokenAddress.mockReturnValue(nativeToken.address);
-      let callCount = 0;
-      mockUseSelector.mockImplementation(() => {
-        callCount++;
-        // First call: isGaslessSwapEnabled = false
-        // Second call: stxEnabled = true
-        return callCount === 2;
-      });
-
-      // Call without isQuoteSponsored parameter
-      const { result } = renderHook(() =>
-        useShouldRenderMaxOption(nativeToken, '100'),
-      );
-
-      // Should return false (native + stx=true + gasless=false + sponsored=false)
-      expect(result.current).toBe(false);
-    });
+    expect(result.current).toBe(true);
   });
 
-  describe('Integration scenarios', () => {
-    it('returns correct value for typical non-native ERC20 token', () => {
-      const usdcToken: BridgeToken = {
-        address: '0xa0b86991c6218b36c1d19d4a2e9eb0ce3606eb48',
-        symbol: 'USDC',
-        decimals: 6,
-        chainId: CHAIN_IDS.MAINNET,
-      };
-
-      mockIsNativeAddress.mockReturnValue(false);
-      mockUseTokenAddress.mockReturnValue(usdcToken.address);
-      mockUseSelector.mockReturnValue(false); // Everything disabled
-
-      const { result } = renderHook(() =>
-        useShouldRenderMaxOption(usdcToken, '1000', false),
-      );
-
-      // Non-native tokens always show max (even with everything disabled)
-      expect(result.current).toBe(true);
+  it('returns false for native token when gasIncluded and 7702 are both disabled', () => {
+    setSelectorValues({
+      gasIncluded: false,
+      gasIncluded7702: false,
     });
+    mockUseTokenAddress.mockReturnValue(nativeToken.address);
+    mockIsNativeAddress.mockReturnValue(true);
 
-    it('returns correct value for native ETH with gasless swap enabled', () => {
-      mockIsNativeAddress.mockReturnValue(true);
-      mockUseTokenAddress.mockReturnValue(nativeToken.address);
-      mockUseSelector.mockReturnValue(true); // stxEnabled=true, gasless=true
+    const { result } = renderHook(() =>
+      useShouldRenderMaxOption(nativeToken, '1.25'),
+    );
 
-      const { result } = renderHook(() =>
-        useShouldRenderMaxOption(nativeToken, '5.5', false),
-      );
-
-      expect(result.current).toBe(true);
-    });
-
-    it('returns correct value for native ETH with sponsored quote', () => {
-      mockIsNativeAddress.mockReturnValue(true);
-      mockUseTokenAddress.mockReturnValue(nativeToken.address);
-      let callCount = 0;
-      mockUseSelector.mockImplementation(() => {
-        callCount++;
-        // First call: isGaslessSwapEnabled = false
-        // Second call: stxEnabled = true
-        return callCount === 2;
-      });
-
-      const { result } = renderHook(() =>
-        useShouldRenderMaxOption(nativeToken, '2.25', true),
-      );
-
-      expect(result.current).toBe(true);
-    });
-
-    it('returns correct value for native ETH without gasless or sponsored but stx enabled', () => {
-      mockIsNativeAddress.mockReturnValue(true);
-      mockUseTokenAddress.mockReturnValue(nativeToken.address);
-      let callCount = 0;
-      mockUseSelector.mockImplementation(() => {
-        callCount++;
-        // First call: isGaslessSwapEnabled = false
-        // Second call: stxEnabled = true
-        return callCount === 2;
-      });
-
-      const { result } = renderHook(() =>
-        useShouldRenderMaxOption(nativeToken, '10', false),
-      );
-
-      // Should be false (native + stx=true + gasless=false + sponsored=false)
-      expect(result.current).toBe(false);
-    });
+    expect(result.current).toBe(false);
   });
 
-  describe('Boundary conditions', () => {
-    it('handles balance exactly equal to zero', () => {
-      const { result } = renderHook(() =>
-        useShouldRenderMaxOption(mockToken, '0.00000', false),
-      );
-
-      expect(result.current).toBe(false);
+  it('returns false for sponsored native quote when gasIncluded paths are disabled', () => {
+    setSelectorValues({
+      gasIncluded: false,
+      gasIncluded7702: false,
     });
+    mockUseTokenAddress.mockReturnValue(nativeToken.address);
+    mockIsNativeAddress.mockReturnValue(true);
 
-    it('handles extremely small but non-zero balance', () => {
-      mockIsNativeAddress.mockReturnValue(false);
-      mockUseTokenAddress.mockReturnValue(mockToken.address);
+    const { result } = renderHook(() =>
+      useShouldRenderMaxOption(nativeToken, '1.25', true),
+    );
 
-      const { result } = renderHook(() =>
-        useShouldRenderMaxOption(mockToken, '0.00000001', false),
-      );
-
-      expect(result.current).toBe(true);
-    });
-
-    it('handles extremely large balance', () => {
-      mockIsNativeAddress.mockReturnValue(false);
-      mockUseTokenAddress.mockReturnValue(mockToken.address);
-
-      const { result } = renderHook(() =>
-        useShouldRenderMaxOption(
-          mockToken,
-          '999999999999999999999999999.999999',
-          false,
-        ),
-      );
-
-      expect(result.current).toBe(true);
-    });
-
-    it('handles balance with many decimal places', () => {
-      mockIsNativeAddress.mockReturnValue(false);
-      mockUseTokenAddress.mockReturnValue(mockToken.address);
-
-      const { result } = renderHook(() =>
-        useShouldRenderMaxOption(
-          mockToken,
-          '123.456789012345678901234567',
-          false,
-        ),
-      );
-
-      expect(result.current).toBe(true);
-    });
+    expect(result.current).toBe(false);
   });
 
-  describe('Truth table - Native token with all combinations', () => {
-    beforeEach(() => {
-      mockIsNativeAddress.mockReturnValue(true);
-      mockUseTokenAddress.mockReturnValue(nativeToken.address);
+  it('returns true for sponsored native quote when 7702 path is enabled', () => {
+    setSelectorValues({
+      gasIncluded: false,
+      gasIncluded7702: true,
     });
+    mockUseTokenAddress.mockReturnValue(nativeToken.address);
+    mockIsNativeAddress.mockReturnValue(true);
 
-    const truthTable = [
-      { stxEnabled: true, gasless: true, sponsored: false, expected: true },
-      { stxEnabled: true, gasless: false, sponsored: true, expected: true },
-      { stxEnabled: true, gasless: true, sponsored: true, expected: true },
-      { stxEnabled: true, gasless: false, sponsored: false, expected: false },
-      { stxEnabled: false, gasless: true, sponsored: false, expected: false },
-      { stxEnabled: false, gasless: false, sponsored: true, expected: false },
-      { stxEnabled: false, gasless: true, sponsored: true, expected: false },
-      { stxEnabled: false, gasless: false, sponsored: false, expected: false },
-    ];
-
-    truthTable.forEach(({ stxEnabled, gasless, sponsored, expected }) => {
-      it(`stxEnabled=${stxEnabled}, gasless=${gasless}, sponsored=${sponsored} → returns ${expected}`, () => {
-        let callCount = 0;
-        mockUseSelector.mockImplementation(() => {
-          callCount++;
-          // First call: isGaslessSwapEnabled (line 12 in hook)
-          // Second call: stxEnabled (line 15 in hook)
-          if (callCount === 1) {
-            return gasless;
-          }
-          return stxEnabled;
-        });
-
-        const { result } = renderHook(() =>
-          useShouldRenderMaxOption(nativeToken, '100', sponsored),
-        );
-
-        expect(result.current).toBe(expected);
-      });
-    });
+    const { result } = renderHook(() =>
+      useShouldRenderMaxOption(nativeToken, '1.25', true),
+    );
+
+    expect(result.current).toBe(true);
   });
 
-  describe('Non-EVM native token scenarios', () => {
+  it('returns false for non-EVM native token when no gas-included path is enabled', () => {
     const solanaToken: BridgeToken = {
-      address: '0x0000000000000000000000000000000000000000',
-      symbol: 'SOL',
-      decimals: 9,
-      chainId: 'solana:5eykt4UsFv8P8NJdTREpY1vzqKqZKvdp', // Solana mainnet CAIP-2
+      ...nativeToken,
+      chainId:
+        'solana:5eykt4UsFv8P8NJdTREpY1vzqKqZKvdp' as `${string}:${string}`,
     };
-
-    const bitcoinToken: BridgeToken = {
-      address: '0x0000000000000000000000000000000000000000',
-      symbol: 'BTC',
-      decimals: 8,
-      chainId: 'bip122:000000000019d6689c085ae165831e93', // Bitcoin mainnet CAIP-2
-    };
-
-    beforeEach(() => {
-      mockIsNativeAddress.mockReturnValue(true);
+    setSelectorValues({
+      gasIncluded: false,
+      gasIncluded7702: false,
     });
+    mockUseTokenAddress.mockReturnValue(solanaToken.address);
+    mockIsNativeAddress.mockReturnValue(true);
 
-    it('returns false for Solana native token even with gasless enabled', () => {
-      mockUseTokenAddress.mockReturnValue(solanaToken.address);
-      let callCount = 0;
-      mockUseSelector.mockImplementation(() => {
-        callCount++;
-        // First call: isGaslessSwapEnabled = true
-        // Second call: stxEnabled = false (non-EVM chain)
-        if (callCount === 1) {
-          return true; // gasless enabled
-        }
-        return false; // stxEnabled is false for non-EVM
-      });
-
-      const { result } = renderHook(() =>
-        useShouldRenderMaxOption(solanaToken, '100', false),
-      );
-
-      // Should return false because stxEnabled is false for non-EVM chains
-      expect(result.current).toBe(false);
-    });
-
-    it('returns false for Solana native token even with sponsored quote', () => {
-      mockUseTokenAddress.mockReturnValue(solanaToken.address);
-      mockUseSelector.mockImplementation(
-        () =>
-          // First call: isGaslessSwapEnabled = false
-          // Second call: stxEnabled = false (non-EVM chain)
-          false,
-      );
-
-      const { result } = renderHook(
-        () => useShouldRenderMaxOption(solanaToken, '50', true), // sponsored = true
-      );
-
-      // Should return false because stxEnabled is false for non-EVM chains
-      expect(result.current).toBe(false);
-    });
-
-    it('returns false for Solana native token with both gasless and sponsored enabled', () => {
-      mockUseTokenAddress.mockReturnValue(solanaToken.address);
-      let callCount = 0;
-      mockUseSelector.mockImplementation(() => {
-        callCount++;
-        // First call: isGaslessSwapEnabled = true
-        // Second call: stxEnabled = false (non-EVM chain)
-        if (callCount === 1) {
-          return true; // gasless enabled
-        }
-        return false; // stxEnabled is false for non-EVM
-      });
-
-      const { result } = renderHook(
-        () => useShouldRenderMaxOption(solanaToken, '25.5', true), // sponsored = true
-      );
-
-      // Should return false because stxEnabled is false for non-EVM chains
-      expect(result.current).toBe(false);
-    });
-
-    it('returns false for Bitcoin native token with gasless enabled', () => {
-      mockUseTokenAddress.mockReturnValue(bitcoinToken.address);
-      let callCount = 0;
-      mockUseSelector.mockImplementation(() => {
-        callCount++;
-        // First call: isGaslessSwapEnabled = true
-        // Second call: stxEnabled = false (non-EVM chain)
-        if (callCount === 1) {
-          return true; // gasless enabled
-        }
-        return false; // stxEnabled is false for non-EVM
-      });
-
-      const { result } = renderHook(() =>
-        useShouldRenderMaxOption(bitcoinToken, '1.5', false),
-      );
-
-      // Should return false because stxEnabled is false for non-EVM chains
-      expect(result.current).toBe(false);
-    });
+    const { result } = renderHook(() =>
+      useShouldRenderMaxOption(solanaToken, '3'),
+    );
 
-    it('returns false for Bitcoin native token without any flags enabled', () => {
-      mockUseTokenAddress.mockReturnValue(bitcoinToken.address);
-      mockUseSelector.mockReturnValue(false); // All flags disabled
-
-      const { result } = renderHook(() =>
-        useShouldRenderMaxOption(bitcoinToken, '0.5', false),
-      );
-
-      // Should return false because stxEnabled is false for non-EVM chains
-      expect(result.current).toBe(false);
-    });
-
-    it('returns false for non-EVM native token with zero balance', () => {
-      mockUseTokenAddress.mockReturnValue(solanaToken.address);
-      mockUseSelector.mockReturnValue(false);
-
-      const { result } = renderHook(() =>
-        useShouldRenderMaxOption(solanaToken, '0', false),
-      );
-
-      // Should return false due to zero balance (checked before non-EVM logic)
-      expect(result.current).toBe(false);
-    });
+    expect(result.current).toBe(false);
   });
 });
diff --git a/app/components/UI/Bridge/hooks/useSwapBridgeNavigation/index.ts b/app/components/UI/Bridge/hooks/useSwapBridgeNavigation/index.ts
index 36404d39892d..38706dd8e86e 100644
--- a/app/components/UI/Bridge/hooks/useSwapBridgeNavigation/index.ts
+++ b/app/components/UI/Bridge/hooks/useSwapBridgeNavigation/index.ts
@@ -140,6 +140,7 @@ export const useSwapBridgeNavigation = ({
       bridgeViewMode: BridgeViewMode,
       sourceTokenOverride?: BridgeToken,
       destTokenOverride?: BridgeToken,
+      buttonLabel?: string,
     ) => {
       // Use tokenOverride if provided, otherwise fall back to tokenBase
       const effectiveSourceTokenBase = sourceTokenOverride ?? sourceTokenBase;
@@ -283,7 +284,7 @@ export const useSwapBridgeNavigation = ({
         ...(isFromNavbar
           ? {}
           : { action_position: ActionPosition.SECOND_POSITION }),
-        button_label: strings('asset_overview.swap'),
+        button_label: buttonLabel ?? strings('asset_overview.swap'),
         location: isFromNavbar
           ? ActionLocation.NAVBAR
           : ActionLocation.ASSET_DETAILS,
@@ -328,11 +329,16 @@ export const useSwapBridgeNavigation = ({
   const { networkModal } = useAddNetwork();
 
   const goToSwaps = useCallback(
-    (tokenOverride?: BridgeToken, destTokenOverride?: BridgeToken) => {
+    (
+      tokenOverride?: BridgeToken,
+      destTokenOverride?: BridgeToken,
+      buttonLabel?: string,
+    ) => {
       goToNativeBridge(
         BridgeViewMode.Unified,
         tokenOverride,
         destTokenOverride,
+        buttonLabel,
       );
     },
     [goToNativeBridge],
diff --git a/app/components/UI/Bridge/hooks/useTokenAddress/index.ts b/app/components/UI/Bridge/hooks/useTokenAddress/index.ts
index c3009e884c61..0388e066eb79 100644
--- a/app/components/UI/Bridge/hooks/useTokenAddress/index.ts
+++ b/app/components/UI/Bridge/hooks/useTokenAddress/index.ts
@@ -1,16 +1,7 @@
 import { BridgeToken } from '../../types';
-import { zeroAddress } from 'ethereumjs-util';
-import { CHAIN_IDS } from '@metamask/transaction-controller';
-import { POLYGON_NATIVE_TOKEN } from '../../constants/assets';
+import { normalizeTokenAddress } from '../../utils/tokenUtils';
 
-export const useTokenAddress = (token: BridgeToken | undefined) => {
-  // Polygon native token address can be 0x0000000000000000000000000000000000001010
-  // so we need to use the zero address for the token address
-  const tokenAddress =
-    token?.chainId === CHAIN_IDS.POLYGON &&
-    token?.address === POLYGON_NATIVE_TOKEN
-      ? zeroAddress()
-      : token?.address;
-
-  return tokenAddress;
-};
+export const useTokenAddress = (
+  token: BridgeToken | undefined,
+): string | undefined =>
+  token ? normalizeTokenAddress(token.address, token.chainId) : undefined;
diff --git a/app/components/UI/Bridge/hooks/useTokensWithBalance/index.ts b/app/components/UI/Bridge/hooks/useTokensWithBalance/index.ts
index 4ac20afdd887..e0684eb577ce 100644
--- a/app/components/UI/Bridge/hooks/useTokensWithBalance/index.ts
+++ b/app/components/UI/Bridge/hooks/useTokensWithBalance/index.ts
@@ -39,6 +39,7 @@ import {
   isNonEvmChainId,
 } from '@metamask/bridge-controller';
 import { isTradableToken } from '../../utils/isTradableToken';
+import { normalizeTokenAddress } from '../../utils/tokenUtils';
 
 interface CalculateFiatBalancesParams {
   assets: TokenI[];
@@ -261,7 +262,7 @@ export const useTokensWithBalance: ({
         }
 
         return {
-          address: token.address,
+          address: normalizeTokenAddress(token.address, chainId),
           name: token.name,
           decimals: token.decimals,
           symbol: token.isETH ? 'ETH' : token.symbol, // TODO: not sure why symbol is ETHEREUM, will also break the token icon for ETH
diff --git a/app/components/UI/Bridge/hooks/useTopTokens/index.ts b/app/components/UI/Bridge/hooks/useTopTokens/index.ts
deleted file mode 100644
index db5f34b144fb..000000000000
--- a/app/components/UI/Bridge/hooks/useTopTokens/index.ts
+++ /dev/null
@@ -1,299 +0,0 @@
-import {
-  BridgeClientId,
-  fetchBridgeTokens,
-  formatAddressToAssetId,
-  formatChainIdToCaip,
-  formatChainIdToHex,
-  isBitcoinChainId,
-  isNonEvmChainId,
-} from '@metamask/bridge-controller';
-import { useAsyncResult } from '../../../../hooks/useAsyncResult';
-import { Hex, CaipChainId, isCaipChainId } from '@metamask/utils';
-import { handleFetch, toChecksumHexAddress } from '@metamask/controller-utils';
-import { BtcAccountType } from '@metamask/keyring-api';
-import { BridgeToken } from '../../types';
-import { useEffect, useMemo } from 'react';
-import Engine from '../../../../../core/Engine';
-import { useSelector } from 'react-redux';
-import Logger from '../../../../../util/Logger';
-import { selectChainCache } from '../../../../../reducers/swaps';
-import { SwapsControllerState } from '@metamask/swaps-controller';
-import { selectTopAssetsFromFeatureFlags } from '../../../../../core/redux/slices/bridge';
-import { RootState } from '../../../../../reducers';
-import { BRIDGE_API_BASE_URL } from '../../../../../constants/bridge';
-import { selectERC20TokensByChain } from '../../../../../selectors/tokenListController';
-import {
-  Asset,
-  TokenListToken,
-  TokenRwaData,
-} from '@metamask/assets-controllers';
-import packageJSON from '../../../../../../package.json';
-import { getTokenIconUrl } from '../../utils';
-import { memoize } from 'lodash';
-
-const { version: clientVersion } = packageJSON;
-const MAX_TOP_TOKENS = 30;
-export const memoizedFetchBridgeTokens = memoize(fetchBridgeTokens);
-
-/**
- * Only needed for BTC
- * @param chainId - The chain ID to get the account type for
- * @returns The account type for the chain ID
- */
-const getAccountType = (
-  chainId: Hex | CaipChainId,
-): Asset['accountType'] | undefined => {
-  let accountType: Asset['accountType'] | undefined;
-
-  if (isBitcoinChainId(chainId)) {
-    accountType = BtcAccountType.P2wpkh;
-  }
-
-  return accountType;
-};
-
-/**
- * Convert cached tokens from TokenListController to BridgeToken format
- */
-const formatCachedTokenListControllerTokens = (
-  cachedTokens: Record<string, TokenListToken>,
-  chainId: Hex | CaipChainId,
-): Record<string, BridgeToken> => {
-  const bridgeTokenObj: Record<string, BridgeToken> = {};
-
-  const caipChainId = formatChainIdToCaip(chainId);
-  const hexChainId = formatChainIdToHex(chainId);
-  const isNonEnvChain = isNonEvmChainId(caipChainId);
-
-  Object.entries(cachedTokens).forEach(([address, token]) => {
-    // Convert non-EVM addresses to CAIP format for consistent deduplication
-    const assetId = formatAddressToAssetId(token.address, caipChainId);
-    const tokenAddress = isNonEnvChain ? assetId : token.address;
-
-    if (!tokenAddress) {
-      throw new Error(
-        `Invalid token address: ${token.address} for chain ID: ${chainId}`,
-      );
-    }
-
-    bridgeTokenObj[address] = {
-      address: tokenAddress,
-      symbol: token.symbol,
-      name: token.name,
-      image: getTokenIconUrl(assetId, isNonEnvChain) || token.iconUrl || '',
-      decimals: token.decimals,
-      aggregators: token.aggregators ?? [],
-      chainId: isNonEnvChain ? caipChainId : hexChainId,
-      accountType: getAccountType(caipChainId),
-      rwaData: token.rwaData,
-    };
-  });
-
-  return bridgeTokenObj;
-};
-
-interface UseTopTokensProps {
-  chainId?: Hex | CaipChainId;
-}
-
-export const useTopTokens = ({
-  chainId,
-}: UseTopTokensProps): {
-  topTokens: BridgeToken[] | undefined;
-  remainingTokens: BridgeToken[] | undefined;
-  pending: boolean;
-} => {
-  const swapsChainCache: SwapsControllerState['chainCache'] =
-    useSelector(selectChainCache);
-  const { swapsTopAssets, swapsTopAssetsPending } = useMemo(() => {
-    if (!chainId) {
-      return { swapsTopAssets: null, swapsTopAssetsPending: true };
-    }
-
-    // For non-EVM chains, we don't need to fetch top assets from the Swaps API
-    if (isCaipChainId(chainId)) {
-      return { swapsTopAssets: null, swapsTopAssetsPending: false };
-    }
-
-    return {
-      swapsTopAssets: swapsChainCache[chainId]?.topAssets || null,
-      swapsTopAssetsPending: false,
-    };
-  }, [chainId, swapsChainCache]);
-
-  // Get cached tokens from TokenListController
-  const cachedEvmTokensByChain = useSelector(selectERC20TokensByChain);
-  const cachedEvmTokensForChain = useMemo(() => {
-    if (!chainId || !cachedEvmTokensByChain) return null;
-
-    if (isNonEvmChainId(chainId)) {
-      return null;
-    }
-
-    // Convert to hex chainId if it's a CAIP chainId, as cached tokens use hex chainIds
-    const hexChainId = isCaipChainId(chainId)
-      ? formatChainIdToHex(chainId)
-      : chainId;
-
-    // Type assertion for the cache object which may have chainId keys
-    return cachedEvmTokensByChain[hexChainId]?.data || null;
-  }, [chainId, cachedEvmTokensByChain]);
-
-  // Check if we have cached tokens to avoid unnecessary API calls
-  const hasCachedTokens = Boolean(
-    cachedEvmTokensForChain && Object.keys(cachedEvmTokensForChain).length > 0,
-  );
-
-  // Get top assets for Solana from Bridge API feature flags for now,
-  // Swap API doesn't have top assets for Solana
-  const topAssetsFromFeatureFlags = useSelector((state: RootState) =>
-    selectTopAssetsFromFeatureFlags(state, chainId),
-  );
-
-  // Get the top assets from the Swaps API
-  useEffect(() => {
-    (async () => {
-      const { SwapsController } = Engine.context;
-      try {
-        if (chainId && !isCaipChainId(chainId)) {
-          // Maintains an internal cache, will fetch if past internal threshold
-          await SwapsController.fetchTopAssetsWithCache({
-            chainId,
-          });
-        }
-      } catch (error: unknown) {
-        Logger.error(error as Error, 'Swaps: Error while fetching top assets');
-      }
-    })();
-  }, [chainId]);
-
-  // Get the token data - use cached tokens if available, otherwise fetch from bridge API
-  const {
-    value: bridgeTokens,
-    pending: bridgeTokensPending,
-    error: bridgeTokensError,
-  } = useAsyncResult(async () => {
-    if (!chainId || bridgeTokensError) {
-      return {};
-    }
-
-    // If we have cached tokens, use them instead of fetching from bridge API
-    if (hasCachedTokens && cachedEvmTokensForChain) {
-      return formatCachedTokenListControllerTokens(
-        cachedEvmTokensForChain,
-        chainId,
-      );
-    }
-
-    // Fallback to bridge API if no cached tokens available (e.g., for non-EVM chains)
-    const rawBridgeAssets = await memoizedFetchBridgeTokens(
-      chainId,
-      BridgeClientId.MOBILE,
-      handleFetch,
-      BRIDGE_API_BASE_URL,
-      clientVersion,
-    );
-
-    // Convert from BridgeAsset type to BridgeToken type
-    const bridgeTokenObj: Record<string, BridgeToken> = {};
-    Object.keys(rawBridgeAssets).forEach((addr) => {
-      const bridgeAsset = rawBridgeAssets[addr];
-
-      const caipChainId = formatChainIdToCaip(bridgeAsset.chainId);
-      const hexChainId = formatChainIdToHex(bridgeAsset.chainId);
-
-      // Convert non-EVM addresses to CAIP format for consistent deduplication
-      const isNonEvmChain = isNonEvmChainId(caipChainId);
-
-      const tokenAddress = isNonEvmChain
-        ? bridgeAsset.assetId
-        : bridgeAsset.address;
-
-      const bridgeAssetRwaData = (bridgeAsset as { rwaData?: TokenRwaData })
-        .rwaData;
-      const bridgeAssetAggregators = (bridgeAsset as { aggregators?: string[] })
-        .aggregators;
-
-      bridgeTokenObj[addr] = {
-        address: tokenAddress,
-        symbol: bridgeAsset.symbol,
-        name: bridgeAsset.name,
-        image: bridgeAsset.iconUrl || bridgeAsset.icon || '',
-        decimals: bridgeAsset.decimals,
-        aggregators: bridgeAssetAggregators ?? [],
-        chainId: isNonEvmChainId(caipChainId) ? caipChainId : hexChainId,
-        accountType: getAccountType(caipChainId),
-        rwaData: bridgeAssetRwaData,
-      };
-    });
-
-    return bridgeTokenObj;
-  }, [chainId, hasCachedTokens, cachedEvmTokensForChain]);
-
-  // Merge the top assets from the Swaps API with the token data from the bridge API
-  const { topTokens, remainingTokens } = useMemo(() => {
-    if (!bridgeTokens) {
-      return { topTokens: [], remainingTokens: [] };
-    }
-
-    const result: BridgeToken[] = [];
-    const remainingTokensList: BridgeToken[] = [];
-    const addedAddresses = new Set<string>();
-    const topAssetAddrs =
-      topAssetsFromFeatureFlags ||
-      swapsTopAssets?.map((asset) => asset.address) ||
-      [];
-
-    // Helper function to add a token if it's not already added and we haven't reached the limit
-    const addTokenIfNotExists = (
-      token: BridgeToken,
-      normalizedAddress: string,
-    ) => {
-      if (!addedAddresses.has(normalizedAddress)) {
-        addedAddresses.add(normalizedAddress);
-        if (result.length < MAX_TOP_TOKENS) {
-          result.push(token);
-        } else {
-          remainingTokensList.push(token);
-        }
-      }
-    };
-
-    // First add top assets from feature flags or swaps
-    for (const topAssetAddr of topAssetAddrs) {
-      if (result.length >= MAX_TOP_TOKENS) break;
-
-      const candidateBridgeToken =
-        bridgeTokens[topAssetAddr] ||
-        bridgeTokens[topAssetAddr.toLowerCase()] ||
-        bridgeTokens[toChecksumHexAddress(topAssetAddr)];
-
-      if (candidateBridgeToken) {
-        const normalizedAddress = isNonEvmChainId(candidateBridgeToken.chainId)
-          ? candidateBridgeToken.address // Solana addresses are case-sensitive, TODO but are Bitcoin addresses case-sensitive?
-          : candidateBridgeToken.address.toLowerCase(); // EVM addresses are case-insensitive
-        addTokenIfNotExists(candidateBridgeToken, normalizedAddress);
-      }
-    }
-
-    // Then iterate through all bridge tokens to either add to top tokens or remaining tokens
-    for (const token of Object.values(bridgeTokens)) {
-      const normalizedAddress = isNonEvmChainId(token.chainId)
-        ? token.address // Solana addresses are case-sensitive, TODO but are Bitcoin addresses case-sensitive?
-        : token.address.toLowerCase(); // EVM addresses are case-insensitive
-
-      addTokenIfNotExists(token, normalizedAddress);
-    }
-
-    return {
-      topTokens: result,
-      remainingTokens: remainingTokensList,
-    };
-  }, [bridgeTokens, swapsTopAssets, topAssetsFromFeatureFlags]);
-
-  return {
-    topTokens,
-    remainingTokens,
-    pending: chainId ? bridgeTokensPending || swapsTopAssetsPending : false,
-  };
-};
diff --git a/app/components/UI/Bridge/hooks/useTopTokens/useTopTokens.test.ts b/app/components/UI/Bridge/hooks/useTopTokens/useTopTokens.test.ts
deleted file mode 100644
index f56753fb82e1..000000000000
--- a/app/components/UI/Bridge/hooks/useTopTokens/useTopTokens.test.ts
+++ /dev/null
@@ -1,208 +0,0 @@
-import {
-  initialState,
-  ethChainId,
-  ethToken1Address,
-  ethToken2Address,
-} from '../../_mocks_/initialState';
-import { renderHookWithProvider } from '../../../../../util/test/renderWithProvider';
-import { useTopTokens, memoizedFetchBridgeTokens } from '.';
-import { waitFor } from '@testing-library/react-native';
-import {
-  BridgeClientId,
-  BRIDGE_PROD_API_BASE_URL,
-  fetchBridgeTokens,
-} from '@metamask/bridge-controller';
-import { handleFetch } from '@metamask/controller-utils';
-import { BridgeToken } from '../../types';
-import { cloneDeep } from 'lodash';
-
-// Mock dependencies
-jest.mock('@metamask/bridge-controller', () => ({
-  ...jest.requireActual('@metamask/bridge-controller'),
-  fetchBridgeTokens: jest.fn(),
-}));
-
-describe('useTopTokens', () => {
-  // Expected tokens from cached TokenListController data for ethChainId
-  const expectedCachedToken1: BridgeToken = {
-    address: ethToken1Address,
-    symbol: 'TOKEN1',
-    name: 'Token One',
-    image: `https://static.cx.metamask.io/api/v2/tokenIcons/assets/eip155/1/erc20/${ethToken1Address.toLowerCase()}.png`,
-    decimals: 18,
-    chainId: ethChainId,
-  };
-
-  const expectedCachedToken2: BridgeToken = {
-    address: ethToken2Address,
-    symbol: 'HELLO',
-    name: 'Hello Token',
-    image: `https://static.cx.metamask.io/api/v2/tokenIcons/assets/eip155/1/erc20/${ethToken2Address.toLowerCase()}.png`,
-    decimals: 18,
-    chainId: ethChainId,
-  };
-
-  beforeEach(() => {
-    jest.clearAllMocks();
-  });
-
-  it('should return empty array when no chainId is provided', () => {
-    const { result } = renderHookWithProvider(() => useTopTokens({}), {
-      state: initialState,
-    });
-
-    expect(result.current.topTokens).toEqual([]);
-    expect(result.current.pending).toBe(false);
-  });
-
-  it('should use cached tokens from TokenListController when available', async () => {
-    const { result } = renderHookWithProvider(
-      () => useTopTokens({ chainId: ethChainId }),
-      { state: initialState },
-    );
-
-    // Initial state should be pending
-    expect(result.current.pending).toBe(true);
-
-    await waitFor(() => {
-      expect(result.current.pending).toBe(false);
-      expect(result.current.topTokens).toHaveLength(2); // From cached TokenListController tokens
-
-      // Verify both cached tokens are present and have correct data
-      const tokens = result.current.topTokens || [];
-      expect(tokens[0]).toMatchObject({
-        address: expectedCachedToken1.address,
-        symbol: expectedCachedToken1.symbol,
-        name: expectedCachedToken1.name,
-        image: expectedCachedToken1.image,
-        decimals: expectedCachedToken1.decimals,
-        chainId: expectedCachedToken1.chainId,
-      });
-
-      expect(tokens[1]).toMatchObject({
-        address: expectedCachedToken2.address,
-        symbol: expectedCachedToken2.symbol,
-        name: expectedCachedToken2.name,
-        image: expectedCachedToken2.image,
-        decimals: expectedCachedToken2.decimals,
-        chainId: expectedCachedToken2.chainId,
-      });
-    });
-
-    // Verify Bridge API was NOT called because cached tokens were used
-    expect(fetchBridgeTokens).not.toHaveBeenCalled();
-  });
-
-  describe('when no cached tokens are available', () => {
-    // Deep clone initial state and remove cached tokens to simulate no cache
-    const initialStateNoCache = cloneDeep(initialState);
-    initialStateNoCache.engine.backgroundState.TokenListController.tokensChainsCache =
-      {};
-
-    it('should fetch tokens from Bridge API when no cached tokens are available', async () => {
-      memoizedFetchBridgeTokens.cache.clear?.();
-
-      // Mock Bridge API response with expected tokens
-      const mockBridgeResponse = {
-        [ethToken1Address.toLowerCase()]: {
-          address: ethToken1Address,
-          symbol: 'FOO',
-          name: 'Foo Token',
-          iconUrl: 'https://foo.com/logo.png',
-          decimals: 18,
-          chainId: ethChainId,
-          assetId: 'token1-asset-id',
-        },
-        [ethToken2Address.toLowerCase()]: {
-          address: ethToken2Address,
-          symbol: 'BAR',
-          name: 'Bar Token',
-          iconUrl: 'https://bar.com/logo.png',
-          decimals: 18,
-          chainId: ethChainId,
-          assetId: 'token2-asset-id',
-        },
-      };
-
-      // Mock the Bridge API call
-      (fetchBridgeTokens as jest.Mock).mockResolvedValue(mockBridgeResponse);
-
-      const { result } = renderHookWithProvider(
-        () => useTopTokens({ chainId: ethChainId }),
-        { state: initialStateNoCache },
-      );
-
-      // Initial state should be pending
-      expect(result.current.pending).toBe(true);
-
-      await waitFor(() => {
-        expect(result.current.pending).toBe(false);
-        expect(result.current.topTokens).toHaveLength(2); // From Bridge API
-
-        // Verify tokens from Bridge API are present and have correct data
-        const tokens = result.current.topTokens || [];
-        expect(tokens[0]).toMatchObject({
-          address: ethToken1Address,
-          symbol: 'FOO',
-          name: 'Foo Token',
-          image: 'https://foo.com/logo.png',
-          decimals: 18,
-          chainId: ethChainId,
-        });
-
-        expect(tokens[1]).toMatchObject({
-          address: ethToken2Address,
-          symbol: 'BAR',
-          name: 'Bar Token',
-          image: 'https://bar.com/logo.png',
-          decimals: 18,
-          chainId: ethChainId,
-        });
-      });
-
-      // Verify Bridge API was called with correct parameters
-      expect(fetchBridgeTokens).toHaveBeenCalledWith(
-        ethChainId,
-        BridgeClientId.MOBILE,
-        handleFetch,
-        BRIDGE_PROD_API_BASE_URL,
-        expect.stringMatching(/^\d+\.\d+\.\d+$/), // Version from package.json
-      );
-    });
-
-    it('should handle Bridge API errors gracefully', async () => {
-      memoizedFetchBridgeTokens.cache.clear?.();
-
-      // Mock Bridge API error
-      (fetchBridgeTokens as jest.Mock).mockRejectedValue(
-        new Error('Bridge API Error'),
-      );
-
-      const { result } = renderHookWithProvider(
-        () => useTopTokens({ chainId: ethChainId }),
-        { state: initialStateNoCache },
-      );
-
-      await waitFor(() => {
-        expect(result.current.pending).toBe(false);
-        expect(result.current.topTokens).toEqual([]);
-      });
-    });
-
-    it('should handle missing Bridge token data gracefully', async () => {
-      memoizedFetchBridgeTokens.cache.clear?.();
-
-      (fetchBridgeTokens as jest.Mock).mockResolvedValue({});
-
-      const { result } = renderHookWithProvider(
-        () => useTopTokens({ chainId: ethChainId }),
-        { state: initialStateNoCache },
-      );
-
-      await waitFor(() => {
-        expect(result.current.pending).toBe(false);
-        expect(result.current.topTokens).toEqual([]);
-      });
-    });
-  });
-});
diff --git a/app/components/UI/Bridge/hooks/useTrackSwapPageViewed/index.ts b/app/components/UI/Bridge/hooks/useTrackSwapPageViewed/index.ts
new file mode 100644
index 000000000000..26fe449e1bbe
--- /dev/null
+++ b/app/components/UI/Bridge/hooks/useTrackSwapPageViewed/index.ts
@@ -0,0 +1,71 @@
+import { useEffect, useRef } from 'react';
+import { useSelector } from 'react-redux';
+import { useABTest } from '../../../../../hooks';
+import { useAnalytics } from '../../../../hooks/useAnalytics/useAnalytics';
+import { MetaMetricsEvents } from '../../../../../core/Analytics';
+import { getDecimalChainId } from '../../../../../util/networks';
+import {
+  selectDestToken,
+  selectSourceToken,
+  selectAbTestContext,
+} from '../../../../../core/redux/slices/bridge';
+import {
+  NUMPAD_QUICK_ACTIONS_AB_KEY,
+  NUMPAD_QUICK_ACTIONS_VARIANTS,
+} from '../../components/GaslessQuickPickOptions/abTestConfig';
+
+export const useTrackSwapPageViewed = () => {
+  const { trackEvent, createEventBuilder } = useAnalytics();
+  const sourceToken = useSelector(selectSourceToken);
+  const destToken = useSelector(selectDestToken);
+  const abTestContext = useSelector(selectAbTestContext);
+  const { variantName, isActive } = useABTest(
+    NUMPAD_QUICK_ACTIONS_AB_KEY,
+    NUMPAD_QUICK_ACTIONS_VARIANTS,
+  );
+
+  const hasTrackedPageView = useRef(false);
+
+  useEffect(() => {
+    const shouldTrackPageView = sourceToken && !hasTrackedPageView.current;
+
+    if (shouldTrackPageView) {
+      hasTrackedPageView.current = true;
+      const pageViewedProperties = {
+        chain_id_source: getDecimalChainId(sourceToken.chainId),
+        chain_id_destination: getDecimalChainId(destToken?.chainId),
+        token_symbol_source: sourceToken.symbol,
+        token_symbol_destination: destToken?.symbol,
+        token_address_source: sourceToken.address,
+        token_address_destination: destToken?.address,
+        ...(abTestContext?.assetsASSETS2493AbtestTokenDetailsLayout && {
+          ab_tests: {
+            assetsASSETS2493AbtestTokenDetailsLayout:
+              abTestContext.assetsASSETS2493AbtestTokenDetailsLayout,
+          },
+        }),
+        ...(isActive && {
+          active_ab_tests: [
+            {
+              key: NUMPAD_QUICK_ACTIONS_AB_KEY,
+              value: variantName,
+            },
+          ],
+        }),
+      };
+      trackEvent(
+        createEventBuilder(MetaMetricsEvents.SWAP_PAGE_VIEWED)
+          .addProperties(pageViewedProperties)
+          .build(),
+      );
+    }
+  }, [
+    sourceToken,
+    destToken,
+    trackEvent,
+    createEventBuilder,
+    isActive,
+    variantName,
+    abTestContext,
+  ]);
+};
diff --git a/app/components/UI/Bridge/utils/formatNetworkFee.test.ts b/app/components/UI/Bridge/utils/formatNetworkFee.test.ts
new file mode 100644
index 000000000000..5bc13ae70d56
--- /dev/null
+++ b/app/components/UI/Bridge/utils/formatNetworkFee.test.ts
@@ -0,0 +1,299 @@
+import { QuoteMetadata, QuoteResponse } from '@metamask/bridge-controller';
+import { BigNumber } from 'bignumber.js';
+import formatFiat from '../../../../util/formatFiat';
+import { isNumberValue } from '../../../../util/number';
+import { formatNetworkFee } from './formatNetworkFee';
+
+jest.mock('../../../../util/formatFiat');
+jest.mock('../../../../util/number');
+
+const mockFormatFiat = formatFiat as jest.MockedFunction<typeof formatFiat>;
+const mockIsNumberValue = isNumberValue as jest.MockedFunction<
+  typeof isNumberValue
+>;
+
+describe('formatNetworkFee', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+    mockIsNumberValue.mockReset();
+    mockFormatFiat.mockReset();
+  });
+
+  describe('when quote is null or undefined', () => {
+    it('returns "-" when quote is undefined', () => {
+      const result = formatNetworkFee('USD', undefined);
+      expect(result).toBe('-');
+    });
+
+    it('returns "-" when quote is null', () => {
+      const result = formatNetworkFee('USD', null);
+      expect(result).toBe('-');
+    });
+  });
+
+  describe('when totalNetworkFee is missing', () => {
+    it('returns "-" when totalNetworkFee is undefined', () => {
+      const quote = {} as QuoteResponse & QuoteMetadata;
+      const result = formatNetworkFee('USD', quote);
+      expect(result).toBe('-');
+    });
+
+    it('returns "-" when totalNetworkFee is null', () => {
+      const quote = {
+        totalNetworkFee: null,
+      } as unknown as QuoteResponse & QuoteMetadata;
+      const result = formatNetworkFee('USD', quote);
+      expect(result).toBe('-');
+    });
+  });
+
+  describe('when totalNetworkFee properties are invalid', () => {
+    it('returns "-" when amount is null', () => {
+      mockIsNumberValue.mockReturnValueOnce(false);
+
+      const quote = {
+        totalNetworkFee: {
+          amount: null,
+          valueInCurrency: '100',
+        },
+      } as unknown as QuoteResponse & QuoteMetadata;
+
+      const result = formatNetworkFee('USD', quote);
+      expect(result).toBe('-');
+    });
+
+    it('returns "-" when valueInCurrency is null', () => {
+      mockIsNumberValue.mockReturnValueOnce(true);
+      mockIsNumberValue.mockReturnValueOnce(false);
+
+      const quote = {
+        totalNetworkFee: {
+          amount: '0.01',
+          valueInCurrency: null,
+        },
+      } as unknown as QuoteResponse & QuoteMetadata;
+
+      const result = formatNetworkFee('USD', quote);
+      expect(result).toBe('-');
+    });
+
+    it('returns "-" when amount is undefined', () => {
+      mockIsNumberValue.mockReturnValueOnce(false);
+
+      const quote = {
+        totalNetworkFee: {
+          amount: undefined,
+          valueInCurrency: '100',
+        },
+      } as unknown as QuoteResponse & QuoteMetadata;
+
+      const result = formatNetworkFee('USD', quote);
+      expect(result).toBe('-');
+    });
+
+    it('returns "-" when valueInCurrency is undefined', () => {
+      mockIsNumberValue.mockReturnValueOnce(true);
+      mockIsNumberValue.mockReturnValueOnce(false);
+
+      const quote = {
+        totalNetworkFee: {
+          amount: '0.01',
+          valueInCurrency: undefined,
+        },
+      } as unknown as QuoteResponse & QuoteMetadata;
+
+      const result = formatNetworkFee('USD', quote);
+      expect(result).toBe('-');
+    });
+
+    it('returns "-" when amount is not a valid number value', () => {
+      mockIsNumberValue.mockReturnValueOnce(false);
+
+      const quote = {
+        totalNetworkFee: {
+          amount: 'invalid',
+          valueInCurrency: '100',
+        },
+      } as unknown as QuoteResponse & QuoteMetadata;
+
+      const result = formatNetworkFee('USD', quote);
+      expect(result).toBe('-');
+      expect(isNumberValue).toHaveBeenCalledWith('invalid');
+    });
+
+    it('returns "-" when valueInCurrency is not a valid number value', () => {
+      mockIsNumberValue.mockReturnValueOnce(true);
+      mockIsNumberValue.mockReturnValueOnce(false);
+
+      const quote = {
+        totalNetworkFee: {
+          amount: '0.01',
+          valueInCurrency: 'invalid',
+        },
+      } as unknown as QuoteResponse & QuoteMetadata;
+
+      const result = formatNetworkFee('USD', quote);
+      expect(result).toBe('-');
+      expect(isNumberValue).toHaveBeenCalledWith('0.01');
+      expect(isNumberValue).toHaveBeenCalledWith('invalid');
+    });
+  });
+
+  describe('when totalNetworkFee is valid', () => {
+    it('formats the network fee correctly with USD', () => {
+      mockIsNumberValue.mockImplementation(
+        (value) => value === '0.01' || value === '10.50',
+      );
+      mockFormatFiat.mockReturnValue('$10.50');
+
+      const quote = {
+        totalNetworkFee: {
+          amount: '0.01',
+          valueInCurrency: '10.50',
+        },
+      } as unknown as QuoteResponse & QuoteMetadata;
+
+      const result = formatNetworkFee('USD', quote);
+
+      expect(isNumberValue).toHaveBeenCalledWith('0.01');
+      expect(isNumberValue).toHaveBeenCalledWith('10.50');
+      expect(formatFiat).toHaveBeenCalledWith(new BigNumber('10.50'), 'USD');
+      expect(result).toBe('$10.50');
+    });
+
+    it('formats the network fee correctly with EUR', () => {
+      mockIsNumberValue.mockImplementation(
+        (value) => value === '0.02' || value === '25.00',
+      );
+      mockFormatFiat.mockReturnValue('€25.00');
+
+      const quote = {
+        totalNetworkFee: {
+          amount: '0.02',
+          valueInCurrency: '25.00',
+        },
+      } as unknown as QuoteResponse & QuoteMetadata;
+
+      const result = formatNetworkFee('EUR', quote);
+
+      expect(formatFiat).toHaveBeenCalledWith(new BigNumber('25.00'), 'EUR');
+      expect(result).toBe('€25.00');
+    });
+
+    it('formats the network fee correctly with GBP', () => {
+      mockIsNumberValue.mockImplementation(
+        (value) => value === '0.005' || value === '5.25',
+      );
+      mockFormatFiat.mockReturnValue('£5.25');
+
+      const quote = {
+        totalNetworkFee: {
+          amount: '0.005',
+          valueInCurrency: '5.25',
+        },
+      } as unknown as QuoteResponse & QuoteMetadata;
+
+      const result = formatNetworkFee('GBP', quote);
+
+      expect(formatFiat).toHaveBeenCalledWith(new BigNumber('5.25'), 'GBP');
+      expect(result).toBe('£5.25');
+    });
+
+    it('handles small network fees', () => {
+      mockIsNumberValue.mockImplementation(
+        (value) => value === '0.000001' || value === '0.005',
+      );
+      mockFormatFiat.mockReturnValue('<$0.01');
+
+      const quote = {
+        totalNetworkFee: {
+          amount: '0.000001',
+          valueInCurrency: '0.005',
+        },
+      } as unknown as QuoteResponse & QuoteMetadata;
+
+      const result = formatNetworkFee('USD', quote);
+
+      expect(formatFiat).toHaveBeenCalledWith(new BigNumber('0.005'), 'USD');
+      expect(result).toBe('<$0.01');
+    });
+
+    it('handles large network fees', () => {
+      mockIsNumberValue.mockImplementation(
+        (value) => value === '1.5' || value === '1234.56',
+      );
+      mockFormatFiat.mockReturnValue('$1,234.56');
+
+      const quote = {
+        totalNetworkFee: {
+          amount: '1.5',
+          valueInCurrency: '1234.56',
+        },
+      } as unknown as QuoteResponse & QuoteMetadata;
+
+      const result = formatNetworkFee('USD', quote);
+
+      expect(formatFiat).toHaveBeenCalledWith(new BigNumber('1234.56'), 'USD');
+      expect(result).toBe('$1,234.56');
+    });
+
+    it('handles zero network fee', () => {
+      mockIsNumberValue.mockImplementation((value) => value === '0');
+      mockFormatFiat.mockReturnValue('$0');
+
+      const quote = {
+        totalNetworkFee: {
+          amount: '0',
+          valueInCurrency: '0',
+        },
+      } as unknown as QuoteResponse & QuoteMetadata;
+
+      const result = formatNetworkFee('USD', quote);
+
+      expect(formatFiat).toHaveBeenCalledWith(new BigNumber('0'), 'USD');
+      expect(result).toBe('$0');
+    });
+  });
+
+  describe('edge cases', () => {
+    it('passes the currency parameter correctly to formatFiat', () => {
+      mockIsNumberValue.mockImplementation(
+        (value) => value === '1' || value === '100',
+      );
+      mockFormatFiat.mockReturnValue('100 XYZ');
+
+      const quote = {
+        totalNetworkFee: {
+          amount: '1',
+          valueInCurrency: '100',
+        },
+      } as unknown as QuoteResponse & QuoteMetadata;
+
+      formatNetworkFee('XYZ', quote);
+
+      expect(formatFiat).toHaveBeenCalledWith(new BigNumber('100'), 'XYZ');
+    });
+
+    it('creates a new BigNumber instance with the valueInCurrency', () => {
+      mockIsNumberValue.mockImplementation(
+        (value) => value === '0.05' || value === '42.99',
+      );
+      mockFormatFiat.mockImplementation((value) => {
+        expect(value).toBeInstanceOf(BigNumber);
+        expect(value.toString()).toBe('42.99');
+        return '$42.99';
+      });
+
+      const quote = {
+        totalNetworkFee: {
+          amount: '0.05',
+          valueInCurrency: '42.99',
+        },
+      } as unknown as QuoteResponse & QuoteMetadata;
+
+      formatNetworkFee('USD', quote);
+
+      expect(formatFiat).toHaveBeenCalled();
+    });
+  });
+});
diff --git a/app/components/UI/Bridge/utils/formatNetworkFee.ts b/app/components/UI/Bridge/utils/formatNetworkFee.ts
new file mode 100644
index 000000000000..ab55146cd948
--- /dev/null
+++ b/app/components/UI/Bridge/utils/formatNetworkFee.ts
@@ -0,0 +1,31 @@
+import { QuoteMetadata, QuoteResponse } from '@metamask/bridge-controller';
+import { isNumberValue } from '../../../../util/number';
+import formatFiat from '../../../../util/formatFiat';
+import { BigNumber } from 'bignumber.js';
+
+export const formatNetworkFee = (
+  currency: string,
+  quote?: (QuoteResponse & QuoteMetadata) | null,
+) => {
+  if (!quote?.totalNetworkFee) return '-';
+
+  const { totalNetworkFee } = quote;
+
+  const { amount, valueInCurrency } = totalNetworkFee;
+
+  if (
+    amount == null ||
+    valueInCurrency == null ||
+    !isNumberValue(amount) ||
+    !isNumberValue(valueInCurrency)
+  ) {
+    return '-';
+  }
+
+  const formattedValueInCurrency = formatFiat(
+    new BigNumber(valueInCurrency),
+    currency,
+  );
+
+  return formattedValueInCurrency;
+};
diff --git a/app/components/UI/Bridge/utils/isGaslessQuote.test.ts b/app/components/UI/Bridge/utils/isGaslessQuote.test.ts
new file mode 100644
index 000000000000..447963882c09
--- /dev/null
+++ b/app/components/UI/Bridge/utils/isGaslessQuote.test.ts
@@ -0,0 +1,116 @@
+import { Quote } from '@metamask/bridge-controller';
+import { isGaslessQuote } from './isGaslessQuote';
+
+describe('isGaslessQuote', () => {
+  describe('returns false', () => {
+    it('returns false when quote is undefined', () => {
+      // Arrange
+      const quote = undefined;
+
+      // Act
+      const result = isGaslessQuote(quote);
+
+      // Assert
+      expect(result).toBe(false);
+    });
+
+    it('returns false when quote has neither gasIncluded nor gasIncluded7702', () => {
+      // Arrange
+      const quote = {
+        gasIncluded: false,
+        gasIncluded7702: false,
+      } as Quote;
+
+      // Act
+      const result = isGaslessQuote(quote);
+
+      // Assert
+      expect(result).toBe(false);
+    });
+
+    it('returns false when quote object is empty', () => {
+      // Arrange
+      const quote = {} as Quote;
+
+      // Act
+      const result = isGaslessQuote(quote);
+
+      // Assert
+      expect(result).toBe(false);
+    });
+  });
+
+  describe('returns true for gasIncluded', () => {
+    it('returns true when gasIncluded is true', () => {
+      // Arrange
+      const quote = {
+        gasIncluded: true,
+        gasIncluded7702: false,
+      } as Quote;
+
+      // Act
+      const result = isGaslessQuote(quote);
+
+      // Assert
+      expect(result).toBe(true);
+    });
+
+    it('returns true when only gasIncluded is present and true', () => {
+      // Arrange
+      const quote = {
+        gasIncluded: true,
+      } as Quote;
+
+      // Act
+      const result = isGaslessQuote(quote);
+
+      // Assert
+      expect(result).toBe(true);
+    });
+  });
+
+  describe('returns true for gasIncluded7702', () => {
+    it('returns true when gasIncluded7702 is true', () => {
+      // Arrange
+      const quote = {
+        gasIncluded: false,
+        gasIncluded7702: true,
+      } as Quote;
+
+      // Act
+      const result = isGaslessQuote(quote);
+
+      // Assert
+      expect(result).toBe(true);
+    });
+
+    it('returns true when only gasIncluded7702 is present and true', () => {
+      // Arrange
+      const quote = {
+        gasIncluded7702: true,
+      } as Quote;
+
+      // Act
+      const result = isGaslessQuote(quote);
+
+      // Assert
+      expect(result).toBe(true);
+    });
+  });
+
+  describe('returns true when both properties are true', () => {
+    it('returns true when both gasIncluded and gasIncluded7702 are true', () => {
+      // Arrange
+      const quote = {
+        gasIncluded: true,
+        gasIncluded7702: true,
+      } as Quote;
+
+      // Act
+      const result = isGaslessQuote(quote);
+
+      // Assert
+      expect(result).toBe(true);
+    });
+  });
+});
diff --git a/app/components/UI/Bridge/utils/isGaslessQuote.ts b/app/components/UI/Bridge/utils/isGaslessQuote.ts
new file mode 100644
index 000000000000..e08582dfeacd
--- /dev/null
+++ b/app/components/UI/Bridge/utils/isGaslessQuote.ts
@@ -0,0 +1,9 @@
+import { Quote } from '@metamask/bridge-controller';
+
+export const isGaslessQuote = (quote?: Quote) => {
+  const gasIncluded = !!quote?.gasIncluded;
+  const gasIncluded7702 = !!quote?.gasIncluded7702;
+  const isGasless = gasIncluded7702 || gasIncluded;
+
+  return isGasless;
+};
diff --git a/app/components/UI/Bridge/utils/tokenUtils.ts b/app/components/UI/Bridge/utils/tokenUtils.ts
index 5f7efded7949..b4f0269e78c5 100644
--- a/app/components/UI/Bridge/utils/tokenUtils.ts
+++ b/app/components/UI/Bridge/utils/tokenUtils.ts
@@ -5,9 +5,28 @@ import {
   getNativeAssetForChainId,
   isNonEvmChainId,
 } from '@metamask/bridge-controller';
+import { zeroAddress } from 'ethereumjs-util';
+import { CHAIN_IDS } from '@metamask/transaction-controller';
 import { BridgeToken } from '../types';
 import { DefaultSwapDestTokens } from '../constants/default-swap-dest-tokens';
 import { IncludeAsset } from '../hooks/usePopularTokens';
+import { POLYGON_NATIVE_TOKEN } from '../constants/assets';
+
+/**
+ * Normalizes chain-specific native token addresses to the zero address for the bridge flow.
+ *
+ * Some chains use a non-zero contract address for their native token
+ * (e.g. Polygon uses 0x0000000000000000000000000000000000001010), but the bridge API
+ * expects the zero address for all native assets.
+ */
+export const normalizeTokenAddress = (
+  address: string,
+  chainId: Hex | CaipChainId,
+): string => {
+  const isPolygonNativeToken =
+    chainId === CHAIN_IDS.POLYGON && address === POLYGON_NATIVE_TOKEN;
+  return isPolygonNativeToken ? zeroAddress() : address;
+};
 
 /**
  * Creates a formatted native token object for the given chain ID
diff --git a/app/components/UI/BrowserUrlBar/__snapshots__/BrowserUrlBar.test.tsx.snap b/app/components/UI/BrowserUrlBar/__snapshots__/BrowserUrlBar.test.tsx.snap
index 2e2cf9fbf550..487c5b3ead4b 100644
--- a/app/components/UI/BrowserUrlBar/__snapshots__/BrowserUrlBar.test.tsx.snap
+++ b/app/components/UI/BrowserUrlBar/__snapshots__/BrowserUrlBar.test.tsx.snap
@@ -13,7 +13,7 @@ exports[`BrowserUrlBar render matches snapshot when focused 1`] = `
     style={
       {
         "alignItems": "center",
-        "backgroundColor": "#f3f5f9",
+        "backgroundColor": "#f3f3f4",
         "borderRadius": 999,
         "flex": 1,
         "flexDirection": "row",
@@ -40,13 +40,13 @@ exports[`BrowserUrlBar render matches snapshot when focused 1`] = `
         onFocus={[Function]}
         onSubmitEditing={[Function]}
         placeholder="Search by site or address"
-        placeholderTextColor="#b7bbc8"
+        placeholderTextColor="#babbbe"
         returnKeyType="go"
         selectTextOnFocus={true}
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "flex": 1,
               "fontFamily": "Geist-Regular",
               "fontSize": 14,
@@ -84,7 +84,7 @@ exports[`BrowserUrlBar render matches snapshot when focused 1`] = `
         onStartShouldSetResponder={[Function]}
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 14,
             "letterSpacing": 0,
@@ -127,7 +127,7 @@ exports[`BrowserUrlBar render matches snapshot when focused 1`] = `
       testID="url-clear-icon"
     >
       <SvgMock
-        color="#686e7d"
+        color="#66676a"
         fill="currentColor"
         height={20}
         name="CircleX"
@@ -171,7 +171,7 @@ exports[`BrowserUrlBar render matches snapshot when focused 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Medium",
             "fontSize": 14,
             "fontWeight": "500",
@@ -210,7 +210,7 @@ exports[`BrowserUrlBar render matches snapshot when not focused 1`] = `
     testID="url-input"
   >
     <SvgMock
-      color="#686e7d"
+      color="#66676a"
       fill="currentColor"
       height={16}
       name="Lock"
@@ -241,13 +241,13 @@ exports[`BrowserUrlBar render matches snapshot when not focused 1`] = `
         onFocus={[Function]}
         onSubmitEditing={[Function]}
         placeholder="Search by site or address"
-        placeholderTextColor="#b7bbc8"
+        placeholderTextColor="#babbbe"
         returnKeyType="go"
         selectTextOnFocus={true}
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "flex": 1,
               "fontFamily": "Geist-Regular",
               "fontSize": 14,
@@ -288,7 +288,7 @@ exports[`BrowserUrlBar render matches snapshot when not focused 1`] = `
         onStartShouldSetResponder={[Function]}
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 14,
             "letterSpacing": 0,
diff --git a/app/components/UI/CaipAccountSelectorList/__snapshots__/CaipAccountSelectorList.test.tsx.snap b/app/components/UI/CaipAccountSelectorList/__snapshots__/CaipAccountSelectorList.test.tsx.snap
index a6d597b90da9..025565a5ffd1 100644
--- a/app/components/UI/CaipAccountSelectorList/__snapshots__/CaipAccountSelectorList.test.tsx.snap
+++ b/app/components/UI/CaipAccountSelectorList/__snapshots__/CaipAccountSelectorList.test.tsx.snap
@@ -68,7 +68,7 @@ exports[`CaipAccountSelectorList renders all accounts with balances 1`] = `
         style={
           {
             "alignItems": "center",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "flexDirection": "row",
           }
         }
@@ -156,7 +156,7 @@ exports[`CaipAccountSelectorList renders all accounts with balances 1`] = `
                     numberOfLines={1}
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -182,7 +182,7 @@ exports[`CaipAccountSelectorList renders all accounts with balances 1`] = `
                       numberOfLines={1}
                       style={
                         {
-                          "color": "#686e7d",
+                          "color": "#66676a",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -214,7 +214,7 @@ exports[`CaipAccountSelectorList renders all accounts with balances 1`] = `
                       accessibilityRole="text"
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -277,7 +277,7 @@ exports[`CaipAccountSelectorList renders all accounts with balances 1`] = `
             testID="multichain-account-cell-menu"
           >
             <SvgMock
-              color="#121314"
+              color="#131416"
               fill="currentColor"
               height={20}
               name="MoreVertical"
@@ -390,7 +390,7 @@ exports[`CaipAccountSelectorList renders all accounts with balances 1`] = `
                     numberOfLines={1}
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -416,7 +416,7 @@ exports[`CaipAccountSelectorList renders all accounts with balances 1`] = `
                       numberOfLines={1}
                       style={
                         {
-                          "color": "#686e7d",
+                          "color": "#66676a",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -448,7 +448,7 @@ exports[`CaipAccountSelectorList renders all accounts with balances 1`] = `
                       accessibilityRole="text"
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -511,7 +511,7 @@ exports[`CaipAccountSelectorList renders all accounts with balances 1`] = `
             testID="multichain-account-cell-menu"
           >
             <SvgMock
-              color="#121314"
+              color="#131416"
               fill="currentColor"
               height={20}
               name="MoreVertical"
@@ -599,7 +599,7 @@ exports[`CaipAccountSelectorList renders all accounts with right accessory 1`] =
         style={
           {
             "alignItems": "center",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "flexDirection": "row",
           }
         }
@@ -688,7 +688,7 @@ exports[`CaipAccountSelectorList renders all accounts with right accessory 1`] =
                     numberOfLines={1}
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -714,7 +714,7 @@ exports[`CaipAccountSelectorList renders all accounts with right accessory 1`] =
                       numberOfLines={1}
                       style={
                         {
-                          "color": "#686e7d",
+                          "color": "#66676a",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -771,7 +771,7 @@ exports[`CaipAccountSelectorList renders all accounts with right accessory 1`] =
             testID="multichain-account-cell-menu"
           >
             <SvgMock
-              color="#121314"
+              color="#131416"
               fill="currentColor"
               height={20}
               name="MoreVertical"
@@ -885,7 +885,7 @@ exports[`CaipAccountSelectorList renders all accounts with right accessory 1`] =
                     numberOfLines={1}
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -911,7 +911,7 @@ exports[`CaipAccountSelectorList renders all accounts with right accessory 1`] =
                       numberOfLines={1}
                       style={
                         {
-                          "color": "#686e7d",
+                          "color": "#66676a",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -968,7 +968,7 @@ exports[`CaipAccountSelectorList renders all accounts with right accessory 1`] =
             testID="multichain-account-cell-menu"
           >
             <SvgMock
-              color="#121314"
+              color="#131416"
               fill="currentColor"
               height={20}
               name="MoreVertical"
@@ -1056,7 +1056,7 @@ exports[`CaipAccountSelectorList renders correctly 1`] = `
         style={
           {
             "alignItems": "center",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "flexDirection": "row",
           }
         }
@@ -1144,7 +1144,7 @@ exports[`CaipAccountSelectorList renders correctly 1`] = `
                     numberOfLines={1}
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -1170,7 +1170,7 @@ exports[`CaipAccountSelectorList renders correctly 1`] = `
                       numberOfLines={1}
                       style={
                         {
-                          "color": "#686e7d",
+                          "color": "#66676a",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -1202,7 +1202,7 @@ exports[`CaipAccountSelectorList renders correctly 1`] = `
                       accessibilityRole="text"
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -1265,7 +1265,7 @@ exports[`CaipAccountSelectorList renders correctly 1`] = `
             testID="multichain-account-cell-menu"
           >
             <SvgMock
-              color="#121314"
+              color="#131416"
               fill="currentColor"
               height={20}
               name="MoreVertical"
@@ -1378,7 +1378,7 @@ exports[`CaipAccountSelectorList renders correctly 1`] = `
                     numberOfLines={1}
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -1404,7 +1404,7 @@ exports[`CaipAccountSelectorList renders correctly 1`] = `
                       numberOfLines={1}
                       style={
                         {
-                          "color": "#686e7d",
+                          "color": "#66676a",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -1436,7 +1436,7 @@ exports[`CaipAccountSelectorList renders correctly 1`] = `
                       accessibilityRole="text"
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -1499,7 +1499,7 @@ exports[`CaipAccountSelectorList renders correctly 1`] = `
             testID="multichain-account-cell-menu"
           >
             <SvgMock
-              color="#121314"
+              color="#131416"
               fill="currentColor"
               height={20}
               name="MoreVertical"
@@ -1587,7 +1587,7 @@ exports[`CaipAccountSelectorList renders network icons for accounts with transac
         style={
           {
             "alignItems": "center",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "flexDirection": "row",
           }
         }
@@ -1675,7 +1675,7 @@ exports[`CaipAccountSelectorList renders network icons for accounts with transac
                     numberOfLines={1}
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -1701,7 +1701,7 @@ exports[`CaipAccountSelectorList renders network icons for accounts with transac
                       numberOfLines={1}
                       style={
                         {
-                          "color": "#686e7d",
+                          "color": "#66676a",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -1733,7 +1733,7 @@ exports[`CaipAccountSelectorList renders network icons for accounts with transac
                       accessibilityRole="text"
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -1796,7 +1796,7 @@ exports[`CaipAccountSelectorList renders network icons for accounts with transac
             testID="multichain-account-cell-menu"
           >
             <SvgMock
-              color="#121314"
+              color="#131416"
               fill="currentColor"
               height={20}
               name="MoreVertical"
@@ -1909,7 +1909,7 @@ exports[`CaipAccountSelectorList renders network icons for accounts with transac
                     numberOfLines={1}
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -1935,7 +1935,7 @@ exports[`CaipAccountSelectorList renders network icons for accounts with transac
                       numberOfLines={1}
                       style={
                         {
-                          "color": "#686e7d",
+                          "color": "#66676a",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -1967,7 +1967,7 @@ exports[`CaipAccountSelectorList renders network icons for accounts with transac
                       accessibilityRole="text"
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -2030,7 +2030,7 @@ exports[`CaipAccountSelectorList renders network icons for accounts with transac
             testID="multichain-account-cell-menu"
           >
             <SvgMock
-              color="#121314"
+              color="#131416"
               fill="currentColor"
               height={20}
               name="MoreVertical"
diff --git a/app/components/UI/Card/Views/CardAuthentication/CardAuthentication.test.tsx b/app/components/UI/Card/Views/CardAuthentication/CardAuthentication.test.tsx
index c99c75b59bba..f41a46bf2fea 100644
--- a/app/components/UI/Card/Views/CardAuthentication/CardAuthentication.test.tsx
+++ b/app/components/UI/Card/Views/CardAuthentication/CardAuthentication.test.tsx
@@ -53,17 +53,22 @@ jest.mock('../../hooks/useCardProviderAuthentication', () => ({
   })),
 }));
 
-jest.mock('../../../../../util/theme', () => ({
-  useTheme: () => ({
-    colors: {
-      background: { default: '#FFFFFF' },
-      text: { primary: '#000000', alternative: '#666666' },
-      primary: { default: '#037DD6' },
-      error: { default: '#D73A49', muted: '#FEF2F2' },
-      border: { default: '#E1E4E8' },
-    },
-  }),
-}));
+jest.mock('../../../../../util/theme', () => {
+  const actual = jest.requireActual('../../../../../util/theme');
+  return {
+    ...actual,
+    useTheme: () => ({
+      ...actual.mockTheme,
+      colors: {
+        ...actual.mockTheme.colors,
+        text: {
+          ...actual.mockTheme.colors.text,
+          primary: actual.mockTheme.colors.text.default,
+        },
+      },
+    }),
+  };
+});
 
 jest.mock('../../../../../../locales/i18n', () => ({
   strings: (key: string) => {
diff --git a/app/components/UI/Card/Views/CardAuthentication/__snapshots__/CardAuthentication.test.tsx.snap b/app/components/UI/Card/Views/CardAuthentication/__snapshots__/CardAuthentication.test.tsx.snap
index 1618a8ef649f..3f909e6c8ec1 100644
--- a/app/components/UI/Card/Views/CardAuthentication/__snapshots__/CardAuthentication.test.tsx.snap
+++ b/app/components/UI/Card/Views/CardAuthentication/__snapshots__/CardAuthentication.test.tsx.snap
@@ -404,7 +404,7 @@ exports[`CardAuthentication Component Login Step - Component Rendering matches l
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 24,
                                       "fontWeight": 700,
@@ -423,7 +423,7 @@ exports[`CardAuthentication Component Login Step - Component Rendering matches l
                                 style={
                                   [
                                     {
-                                      "color": "#686e7d",
+                                      "color": "#66676a",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "fontWeight": 400,
@@ -469,8 +469,8 @@ exports[`CardAuthentication Component Login Step - Component Rendering matches l
                                   style={
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
-                                      "borderColor": "#121314",
+                                      "backgroundColor": "#b4b4b528",
+                                      "borderColor": "#131416",
                                       "borderRadius": 8,
                                       "borderWidth": 1,
                                       "display": "flex",
@@ -507,7 +507,7 @@ exports[`CardAuthentication Component Login Step - Component Rendering matches l
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "height": 24,
                                             "width": 24,
                                           },
@@ -520,7 +520,7 @@ exports[`CardAuthentication Component Login Step - Component Rendering matches l
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 14,
                                             "fontWeight": "500",
@@ -541,7 +541,7 @@ exports[`CardAuthentication Component Login Step - Component Rendering matches l
                                   style={
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 8,
                                       "display": "flex",
                                       "flexBasis": "0%",
@@ -579,7 +579,7 @@ exports[`CardAuthentication Component Login Step - Component Rendering matches l
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 16,
                                             "fontWeight": 400,
@@ -598,7 +598,7 @@ exports[`CardAuthentication Component Login Step - Component Rendering matches l
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 14,
                                             "fontWeight": "500",
@@ -629,7 +629,7 @@ exports[`CardAuthentication Component Login Step - Component Rendering matches l
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -673,8 +673,8 @@ exports[`CardAuthentication Component Login Step - Component Rendering matches l
                                   style={
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
-                                      "borderColor": "#b7bbc866",
+                                      "backgroundColor": "#b4b4b528",
+                                      "borderColor": "#b4b4b566",
                                       "borderRadius": 12,
                                       "borderWidth": 1,
                                       "flexDirection": "row",
@@ -705,14 +705,14 @@ exports[`CardAuthentication Component Login Step - Component Rendering matches l
                                       onBlur={[Function]}
                                       onChangeText={[Function]}
                                       onFocus={[Function]}
-                                      placeholderTextColor="#686e7d"
+                                      placeholderTextColor="#66676a"
                                       returnKeyType="next"
                                       style={
                                         {
                                           "backgroundColor": "inherit",
                                           "borderColor": "transparent",
                                           "borderWidth": 1,
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "fontWeight": "400",
@@ -741,7 +741,7 @@ exports[`CardAuthentication Component Login Step - Component Rendering matches l
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -785,8 +785,8 @@ exports[`CardAuthentication Component Login Step - Component Rendering matches l
                                   style={
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
-                                      "borderColor": "#b7bbc866",
+                                      "backgroundColor": "#b4b4b528",
+                                      "borderColor": "#b4b4b566",
                                       "borderRadius": 12,
                                       "borderWidth": 1,
                                       "flexDirection": "row",
@@ -817,7 +817,7 @@ exports[`CardAuthentication Component Login Step - Component Rendering matches l
                                       onChangeText={[Function]}
                                       onFocus={[Function]}
                                       onSubmitEditing={[Function]}
-                                      placeholderTextColor="#686e7d"
+                                      placeholderTextColor="#66676a"
                                       returnKeyType="done"
                                       secureTextEntry={true}
                                       style={
@@ -825,7 +825,7 @@ exports[`CardAuthentication Component Login Step - Component Rendering matches l
                                           "backgroundColor": "inherit",
                                           "borderColor": "transparent",
                                           "borderWidth": 1,
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "fontWeight": "400",
@@ -856,7 +856,7 @@ exports[`CardAuthentication Component Login Step - Component Rendering matches l
                                         style={
                                           [
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "height": 20,
                                               "width": 20,
                                             },
@@ -917,7 +917,7 @@ exports[`CardAuthentication Component Login Step - Component Rendering matches l
                                       {
                                         "alignItems": "center",
                                         "alignSelf": "stretch",
-                                        "backgroundColor": "#121314",
+                                        "backgroundColor": "#131416",
                                         "borderRadius": 12,
                                         "flexDirection": "row",
                                         "height": 48,
@@ -952,7 +952,7 @@ exports[`CardAuthentication Component Login Step - Component Rendering matches l
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Medium",
                                             "fontSize": 16,
                                             "fontWeight": 400,
diff --git a/app/components/UI/Card/Views/CardHome/CardHome.test.tsx b/app/components/UI/Card/Views/CardHome/CardHome.test.tsx
index f5d806594100..070e037a7f57 100644
--- a/app/components/UI/Card/Views/CardHome/CardHome.test.tsx
+++ b/app/components/UI/Card/Views/CardHome/CardHome.test.tsx
@@ -65,6 +65,14 @@ jest.mock('@expensify/react-native-wallet', () => ({
   AddToWalletButton: () => null,
 }));
 
+const mockRemoveQueries = jest.fn();
+jest.mock('@tanstack/react-query', () => ({
+  ...jest.requireActual('@tanstack/react-query'),
+  useQueryClient: jest.fn(() => ({
+    removeQueries: mockRemoveQueries,
+  })),
+}));
+
 import { fireEvent, screen, waitFor } from '@testing-library/react-native';
 import { Alert } from 'react-native';
 import { useSelector } from 'react-redux';
@@ -531,6 +539,11 @@ jest.mock('../../../../../../locales/i18n', () => ({
         'Failed to load PIN. Please try again.',
       'card.password_bottomsheet.description_view_pin':
         'Enter your wallet password to view your card PIN.',
+      'card.card_home.manage_card_options.cashback': 'Cashback',
+      'card.card_home.manage_card_options.cashback_description':
+        'Earn 1% back on all spending',
+      'card.card_home.manage_card_options.cashback_description_metal':
+        'Earn 3% back on all spending',
     };
     return strings[key] || key;
   },
@@ -2624,9 +2637,7 @@ describe('CardHome Component', () => {
         expect(mockDispatch).toHaveBeenCalledWith(
           expect.objectContaining({ type: 'card/resetAuthenticatedData' }),
         );
-        expect(mockDispatch).toHaveBeenCalledWith(
-          expect.objectContaining({ type: 'card/clearAllCache' }),
-        );
+        expect(mockRemoveQueries).toHaveBeenCalled();
       });
 
       await waitFor(() => {
@@ -2657,7 +2668,7 @@ describe('CardHome Component', () => {
       // Then: should not trigger authentication error handling
       expect(mockRemoveCardBaanxToken).not.toHaveBeenCalled();
       expect(mockResetAuthenticatedData).not.toHaveBeenCalled();
-      expect(mockClearAllCache).not.toHaveBeenCalled();
+      expect(mockRemoveQueries).not.toHaveBeenCalled();
       expect(mockNavigationDispatch).not.toHaveBeenCalledWith(
         expect.objectContaining({ type: 'REPLACE' }),
       );
@@ -2678,7 +2689,7 @@ describe('CardHome Component', () => {
       // Then: should not trigger authentication error handling
       expect(mockRemoveCardBaanxToken).not.toHaveBeenCalled();
       expect(mockResetAuthenticatedData).not.toHaveBeenCalled();
-      expect(mockClearAllCache).not.toHaveBeenCalled();
+      expect(mockRemoveQueries).not.toHaveBeenCalled();
     });
 
     it('does nothing when error is not an authentication error', () => {
@@ -2696,7 +2707,7 @@ describe('CardHome Component', () => {
       // Then: should not trigger authentication error handling
       expect(mockRemoveCardBaanxToken).not.toHaveBeenCalled();
       expect(mockResetAuthenticatedData).not.toHaveBeenCalled();
-      expect(mockClearAllCache).not.toHaveBeenCalled();
+      expect(mockRemoveQueries).not.toHaveBeenCalled();
       expect(mockNavigationDispatch).not.toHaveBeenCalledWith(
         expect.objectContaining({ type: 'REPLACE' }),
       );
@@ -2748,7 +2759,7 @@ describe('CardHome Component', () => {
       // When: component renders
       render();
 
-      // Then: should dispatch Redux actions after token removal
+      // Then: should dispatch Redux actions and clear query cache after token removal
       await waitFor(() => {
         expect(mockRemoveCardBaanxToken).toHaveBeenCalled();
       });
@@ -2757,9 +2768,7 @@ describe('CardHome Component', () => {
         expect(mockDispatch).toHaveBeenCalledWith(
           expect.objectContaining({ type: 'card/resetAuthenticatedData' }),
         );
-        expect(mockDispatch).toHaveBeenCalledWith(
-          expect.objectContaining({ type: 'card/clearAllCache' }),
-        );
+        expect(mockRemoveQueries).toHaveBeenCalled();
       });
     });
 
@@ -2866,9 +2875,7 @@ describe('CardHome Component', () => {
         expect(mockDispatch).toHaveBeenCalledWith(
           expect.objectContaining({ type: 'card/resetAuthenticatedData' }),
         );
-        expect(mockDispatch).toHaveBeenCalledWith(
-          expect.objectContaining({ type: 'card/clearAllCache' }),
-        );
+        expect(mockRemoveQueries).toHaveBeenCalled();
         expect(StackActions.replace).toHaveBeenCalledWith(
           Routes.CARD.AUTHENTICATION,
         );
@@ -2888,12 +2895,14 @@ describe('CardHome Component', () => {
       mockDispatch.mockImplementation((action) => {
         if (action.type === 'card/resetAuthenticatedData') {
           callOrder.push('resetAuth');
-        } else if (action.type === 'card/clearAllCache') {
-          callOrder.push('clearCache');
         }
         return action;
       });
 
+      mockRemoveQueries.mockImplementation(() => {
+        callOrder.push('removeQueries');
+      });
+
       mockNavigationDispatch.mockImplementation(() => {
         callOrder.push('navigate');
       });
@@ -2911,7 +2920,7 @@ describe('CardHome Component', () => {
         expect(callOrder).toEqual([
           'removeToken',
           'resetAuth',
-          'clearCache',
+          'removeQueries',
           'navigate',
         ]);
       });
@@ -2936,14 +2945,12 @@ describe('CardHome Component', () => {
         expect(mockRemoveCardBaanxToken).toHaveBeenCalled();
       });
 
-      // 2. Dispatch Redux actions
+      // 2. Dispatch Redux actions and clear query cache
       await waitFor(() => {
         expect(mockDispatch).toHaveBeenCalledWith(
           expect.objectContaining({ type: 'card/resetAuthenticatedData' }),
         );
-        expect(mockDispatch).toHaveBeenCalledWith(
-          expect.objectContaining({ type: 'card/clearAllCache' }),
-        );
+        expect(mockRemoveQueries).toHaveBeenCalled();
       });
 
       // 3. Navigate to authentication screen (this happens after toast is shown)
@@ -5565,4 +5572,187 @@ describe('CardHome Component', () => {
       expect(cardDetails.holderName).toBe('Jane Smith');
     });
   });
+
+  describe('Cashback List Item', () => {
+    it('displays cashback item for authenticated international user with VERIFIED KYC', () => {
+      // Given: authenticated international user with verified KYC
+      setupMockSelectors({
+        isAuthenticated: true,
+        userLocation: 'international',
+      });
+      setupLoadCardDataMock({
+        isAuthenticated: true,
+        isBaanxLoginEnabled: true,
+        cardDetails: { type: CardType.VIRTUAL },
+        isLoading: false,
+        kycStatus: { verificationState: 'VERIFIED', userId: 'user-123' },
+      });
+
+      // When: component renders
+      render();
+
+      // Then: cashback item is visible
+      expect(
+        screen.getByTestId(CardHomeSelectors.CASHBACK_ITEM),
+      ).toBeOnTheScreen();
+    });
+
+    it('hides cashback item for US users', () => {
+      // Given: authenticated US user with verified KYC
+      setupMockSelectors({
+        isAuthenticated: true,
+        userLocation: 'us',
+      });
+      setupLoadCardDataMock({
+        isAuthenticated: true,
+        isBaanxLoginEnabled: true,
+        cardDetails: { type: CardType.VIRTUAL },
+        isLoading: false,
+        kycStatus: { verificationState: 'VERIFIED', userId: 'user-123' },
+      });
+
+      // When: component renders
+      render();
+
+      // Then: cashback item is not rendered
+      expect(
+        screen.queryByTestId(CardHomeSelectors.CASHBACK_ITEM),
+      ).not.toBeOnTheScreen();
+    });
+
+    it('hides cashback item when user is not authenticated', () => {
+      // Given: unauthenticated user
+      setupMockSelectors({
+        isAuthenticated: false,
+        userLocation: 'international',
+      });
+      setupLoadCardDataMock({
+        isAuthenticated: false,
+        isBaanxLoginEnabled: true,
+        cardDetails: { type: CardType.VIRTUAL },
+        isLoading: false,
+      });
+
+      // When: component renders
+      render();
+
+      // Then: cashback item is not rendered
+      expect(
+        screen.queryByTestId(CardHomeSelectors.CASHBACK_ITEM),
+      ).not.toBeOnTheScreen();
+    });
+
+    it('hides cashback item when KYC is not verified', () => {
+      // Given: authenticated international user with pending KYC
+      setupMockSelectors({
+        isAuthenticated: true,
+        userLocation: 'international',
+      });
+      setupLoadCardDataMock({
+        isAuthenticated: true,
+        isBaanxLoginEnabled: true,
+        cardDetails: { type: CardType.VIRTUAL },
+        isLoading: false,
+        kycStatus: { verificationState: 'PENDING', userId: 'user-123' },
+      });
+
+      // When: component renders
+      render();
+
+      // Then: cashback item is not rendered
+      expect(
+        screen.queryByTestId(CardHomeSelectors.CASHBACK_ITEM),
+      ).not.toBeOnTheScreen();
+    });
+
+    it('shows standard cashback description for virtual card', () => {
+      // Given: authenticated international user with virtual card
+      setupMockSelectors({
+        isAuthenticated: true,
+        userLocation: 'international',
+      });
+      setupLoadCardDataMock({
+        isAuthenticated: true,
+        isBaanxLoginEnabled: true,
+        cardDetails: { type: CardType.VIRTUAL },
+        isLoading: false,
+        kycStatus: { verificationState: 'VERIFIED', userId: 'user-123' },
+      });
+
+      // When: component renders
+      render();
+
+      // Then: standard description is shown
+      expect(
+        screen.getByText('Earn 1% back on all spending'),
+      ).toBeOnTheScreen();
+    });
+
+    it('shows metal cashback description for metal card', () => {
+      // Given: authenticated international user with metal card
+      setupMockSelectors({
+        isAuthenticated: true,
+        userLocation: 'international',
+      });
+      setupLoadCardDataMock({
+        isAuthenticated: true,
+        isBaanxLoginEnabled: true,
+        cardDetails: { type: CardType.METAL },
+        isLoading: false,
+        kycStatus: { verificationState: 'VERIFIED', userId: 'user-123' },
+      });
+
+      // When: component renders
+      render();
+
+      // Then: metal description is shown
+      expect(
+        screen.getByText('Earn 3% back on all spending'),
+      ).toBeOnTheScreen();
+    });
+
+    it('navigates to cashback screen on press', () => {
+      // Given: authenticated international user with verified KYC
+      setupMockSelectors({
+        isAuthenticated: true,
+        userLocation: 'international',
+      });
+      setupLoadCardDataMock({
+        isAuthenticated: true,
+        isBaanxLoginEnabled: true,
+        cardDetails: { type: CardType.VIRTUAL },
+        isLoading: false,
+        kycStatus: { verificationState: 'VERIFIED', userId: 'user-123' },
+      });
+
+      // When: user taps cashback item
+      render();
+      fireEvent.press(screen.getByTestId(CardHomeSelectors.CASHBACK_ITEM));
+
+      // Then: navigates to cashback route
+      expect(mockNavigate).toHaveBeenCalled();
+    });
+
+    it('tracks analytics event on press', () => {
+      // Given: authenticated international user with verified KYC
+      setupMockSelectors({
+        isAuthenticated: true,
+        userLocation: 'international',
+      });
+      setupLoadCardDataMock({
+        isAuthenticated: true,
+        isBaanxLoginEnabled: true,
+        cardDetails: { type: CardType.VIRTUAL },
+        isLoading: false,
+        kycStatus: { verificationState: 'VERIFIED', userId: 'user-123' },
+      });
+
+      // When: user taps cashback item
+      render();
+      fireEvent.press(screen.getByTestId(CardHomeSelectors.CASHBACK_ITEM));
+
+      // Then: tracks cashback button event
+      expect(mockTrackEvent).toHaveBeenCalled();
+    });
+  });
 });
diff --git a/app/components/UI/Card/Views/CardHome/CardHome.tsx b/app/components/UI/Card/Views/CardHome/CardHome.tsx
index 8ddfdbb1168d..c0d33dcd3cc8 100644
--- a/app/components/UI/Card/Views/CardHome/CardHome.tsx
+++ b/app/components/UI/Card/Views/CardHome/CardHome.tsx
@@ -31,6 +31,7 @@ import {
   useFocusEffect,
 } from '@react-navigation/native';
 import { useDispatch, useSelector } from 'react-redux';
+import { useQueryClient } from '@tanstack/react-query';
 import SensitiveText, {
   SensitiveTextLength,
 } from '../../../../../component-library/components/Texts/SensitiveText';
@@ -72,10 +73,10 @@ import {
 import { useCardSDK } from '../../sdk';
 import Routes from '../../../../../constants/navigation/Routes';
 import {
-  clearAllCache,
   resetAuthenticatedData,
   selectUserCardLocation,
 } from '../../../../../core/redux/slices/card';
+import { cardQueries } from '../../queries';
 import { selectMetalCardCheckoutFeatureFlag } from '../../../../../selectors/featureFlagController/card';
 import CardMessageBox from '../../components/CardMessageBox/CardMessageBox';
 import { useIsSwapEnabledForPriorityToken } from '../../hooks/useIsSwapEnabledForPriorityToken';
@@ -158,9 +159,9 @@ const CardHome = () => {
   } = useCardPinToken();
   const { reauthenticate } = useAuthentication();
   const hasTrackedCardHomeView = useRef(false);
-  const hasLoadedCardHomeView = useRef(false);
-  const hasCompletedInitialFetchRef = useRef(false);
   const hasHandledAuthErrorRef = useRef(false);
+  const hasCompletedInitialFetchRef = useRef(false);
+  const hasLoadedCardHomeView = useRef(false);
   const isComponentUnmountedRef = useRef(false);
   const hasShownDeeplinkToast = useRef(false);
   const [
@@ -173,6 +174,7 @@ const CardHome = () => {
   const { trackEvent, createEventBuilder } = useAnalytics();
   const navigation = useNavigation();
   const dispatch = useDispatch();
+  const queryClient = useQueryClient();
   const theme = useTheme();
   const tw = useTailwind();
 
@@ -708,24 +710,6 @@ const CardHome = () => {
     });
   }, [navigation, trackEvent, createEventBuilder, userShippingAddress]);
 
-  const isUserEligibleForMetalCard = useMemo(
-    () =>
-      isMetalCardCheckoutEnabled &&
-      isBaanxLoginEnabled &&
-      isAuthenticated &&
-      userLocation === 'us' &&
-      userShippingAddress &&
-      cardDetails?.type === CardType.VIRTUAL,
-    [
-      isMetalCardCheckoutEnabled,
-      isBaanxLoginEnabled,
-      isAuthenticated,
-      userLocation,
-      userShippingAddress,
-      cardDetails,
-    ],
-  );
-
   const showCardDetailsErrorToast = useCallback(() => {
     toastRef?.current?.showToast({
       variant: ToastVariants.Icon,
@@ -1044,6 +1028,31 @@ const CardHome = () => {
     isCardProvisioning,
   ]);
 
+  const isUserEligibleForMetalCard = useMemo(
+    () =>
+      !isLoading &&
+      !cardSetupState.isKYCPending &&
+      !cardSetupState.needsSetup &&
+      !isCardProvisioning &&
+      isMetalCardCheckoutEnabled &&
+      isBaanxLoginEnabled &&
+      isAuthenticated &&
+      userLocation === 'us' &&
+      userShippingAddress &&
+      cardDetails?.type === CardType.VIRTUAL,
+    [
+      isMetalCardCheckoutEnabled,
+      isBaanxLoginEnabled,
+      isAuthenticated,
+      userLocation,
+      userShippingAddress,
+      cardDetails,
+      isLoading,
+      cardSetupState,
+      isCardProvisioning,
+    ],
+  );
+
   useEffect(
     () => () => {
       isComponentUnmountedRef.current = true;
@@ -1078,7 +1087,7 @@ const CardHome = () => {
         }
 
         dispatch(resetAuthenticatedData());
-        dispatch(clearAllCache());
+        queryClient.removeQueries({ queryKey: cardQueries.keys.all() });
 
         toastRef?.current?.showToast({
           variant: ToastVariants.Icon,
@@ -1101,7 +1110,7 @@ const CardHome = () => {
     };
 
     handleAuthenticationError();
-  }, [cardError, dispatch, isAuthenticated, navigation, toastRef]);
+  }, [cardError, dispatch, queryClient, isAuthenticated, navigation, toastRef]);
 
   useEffect(() => {
     if (isSDKLoading) {
@@ -1109,7 +1118,7 @@ const CardHome = () => {
     }
     if (!hasLoadedCardHomeView.current && isAuthenticated) {
       hasLoadedCardHomeView.current = true;
-      fetchAllData().then(() => {
+      fetchAllData().finally(() => {
         hasCompletedInitialFetchRef.current = true;
       });
     }
@@ -1125,18 +1134,16 @@ const CardHome = () => {
         return;
       }
 
-      if (!externalWalletDetailsData && !isLoading) {
+      const hasInvalidatedQueries = queryClient
+        .getQueryCache()
+        .findAll({ queryKey: cardQueries.dashboard.keys.all() })
+        .some((query) => query.state.isInvalidated);
+
+      if (hasInvalidatedQueries) {
         fetchAllData();
       }
-    }, [
-      isSDKLoading,
-      isAuthenticated,
-      externalWalletDetailsData,
-      isLoading,
-      fetchAllData,
-    ]),
+    }, [isSDKLoading, isAuthenticated, fetchAllData, queryClient]),
   );
-
   /**
    * Check if the current token supports the spending limit progress bar feature.
    * Some tokens (e.g., aUSDC) have different allowance behavior and are unsupported.
@@ -1428,6 +1435,19 @@ const CardHome = () => {
       )}
 
       <Box style={tw.style(cardSetupState.needsSetup && 'hidden')}>
+        {isUserEligibleForMetalCard && (
+          <ManageCardListItem
+            title={strings(
+              'card.card_home.manage_card_options.order_metal_card',
+            )}
+            description={strings(
+              'card.card_home.manage_card_options.order_metal_card_description',
+            )}
+            rightIcon={IconName.ArrowRight}
+            onPress={orderMetalCardAction}
+            testID={CardHomeSelectors.ORDER_METAL_CARD_ITEM}
+          />
+        )}
         {isAuthenticated && !isLoading && cardDetails && (
           <ManageCardListItem
             title={strings(
@@ -1519,39 +1539,30 @@ const CardHome = () => {
               onPress={navigateToCardPage}
               testID={CardHomeSelectors.ADVANCED_CARD_MANAGEMENT_ITEM}
             />
-            {isUserEligibleForMetalCard && (
-              <ManageCardListItem
-                title={strings(
-                  'card.card_home.manage_card_options.order_metal_card',
-                )}
-                description={strings(
-                  'card.card_home.manage_card_options.order_metal_card_description',
-                )}
-                rightIcon={IconName.ArrowRight}
-                onPress={orderMetalCardAction}
-                testID={CardHomeSelectors.ORDER_METAL_CARD_ITEM}
-              />
-            )}
-            {isAuthenticated && kycStatus?.verificationState === 'VERIFIED' && (
-              <ManageCardListItem
-                title={strings('card.card_home.manage_card_options.cashback')}
-                description={strings(
-                  'card.card_home.manage_card_options.cashback_description',
-                )}
-                rightIcon={IconName.ArrowRight}
-                onPress={() => {
-                  trackEvent(
-                    createEventBuilder(MetaMetricsEvents.CARD_BUTTON_CLICKED)
-                      .addProperties({
-                        action: CardActions.CASHBACK_BUTTON,
-                      })
-                      .build(),
-                  );
-                  navigation.navigate(Routes.CARD.CASHBACK);
-                }}
-                testID={CardHomeSelectors.CASHBACK_ITEM}
-              />
-            )}
+            {isAuthenticated &&
+              kycStatus?.verificationState === 'VERIFIED' &&
+              userLocation !== 'us' && (
+                <ManageCardListItem
+                  title={strings('card.card_home.manage_card_options.cashback')}
+                  description={strings(
+                    cardDetails?.type === CardType.METAL
+                      ? 'card.card_home.manage_card_options.cashback_description_metal'
+                      : 'card.card_home.manage_card_options.cashback_description',
+                  )}
+                  rightIcon={IconName.ArrowRight}
+                  onPress={() => {
+                    trackEvent(
+                      createEventBuilder(MetaMetricsEvents.CARD_BUTTON_CLICKED)
+                        .addProperties({
+                          action: CardActions.CASHBACK_BUTTON,
+                        })
+                        .build(),
+                    );
+                    navigation.navigate(Routes.CARD.CASHBACK);
+                  }}
+                  testID={CardHomeSelectors.CASHBACK_ITEM}
+                />
+              )}
             <ManageCardListItem
               title={strings('card.card_home.manage_card_options.travel_title')}
               description={strings(
diff --git a/app/components/UI/Card/Views/CardHome/__snapshots__/CardHome.test.tsx.snap b/app/components/UI/Card/Views/CardHome/__snapshots__/CardHome.test.tsx.snap
index d090f3a27d79..694928718962 100644
--- a/app/components/UI/Card/Views/CardHome/__snapshots__/CardHome.test.tsx.snap
+++ b/app/components/UI/Card/Views/CardHome/__snapshots__/CardHome.test.tsx.snap
@@ -329,7 +329,7 @@ exports[`CardHome Component renders correctly and matches snapshot 1`] = `
                           }
                           onRefresh={[Function]}
                           refreshing={false}
-                          tintColor="#121314"
+                          tintColor="#131416"
                         />
                       }
                       showsVerticalScrollIndicator={false}
@@ -350,7 +350,7 @@ exports[`CardHome Component renders correctly and matches snapshot 1`] = `
                           style={
                             [
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Bold",
                                 "fontSize": 24,
                                 "fontWeight": 700,
@@ -371,7 +371,7 @@ exports[`CardHome Component renders correctly and matches snapshot 1`] = `
                           style={
                             [
                               {
-                                "backgroundColor": "#3c4d9d0f",
+                                "backgroundColor": "#b4b4b528",
                                 "borderRadius": 8,
                                 "display": "flex",
                                 "marginLeft": 16,
@@ -867,9 +867,9 @@ exports[`CardHome Component renders correctly and matches snapshot 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
-                                      "fontSize": 18,
+                                      "fontSize": 20,
                                       "letterSpacing": 0,
                                       "lineHeight": 24,
                                     }
@@ -883,7 +883,7 @@ exports[`CardHome Component renders correctly and matches snapshot 1`] = `
                                   testID="privacy-toggle-button"
                                 >
                                   <SvgMock
-                                    color="#121314"
+                                    color="#131416"
                                     fill="currentColor"
                                     height={20}
                                     name="Eye"
@@ -902,7 +902,7 @@ exports[`CardHome Component renders correctly and matches snapshot 1`] = `
                                 style={
                                   [
                                     {
-                                      "color": "#686e7d",
+                                      "color": "#66676a",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 14,
                                       "fontWeight": 400,
@@ -956,7 +956,7 @@ exports[`CardHome Component renders correctly and matches snapshot 1`] = `
                                   {
                                     "alignItems": "center",
                                     "alignSelf": "stretch",
-                                    "backgroundColor": "#121314",
+                                    "backgroundColor": "#131416",
                                     "borderRadius": 12,
                                     "flexDirection": "row",
                                     "height": 48,
@@ -994,7 +994,7 @@ exports[`CardHome Component renders correctly and matches snapshot 1`] = `
                                   {
                                     "alignItems": "center",
                                     "alignSelf": "stretch",
-                                    "backgroundColor": "#121314",
+                                    "backgroundColor": "#131416",
                                     "borderRadius": 12,
                                     "flexDirection": "row",
                                     "height": 48,
@@ -1071,7 +1071,7 @@ exports[`CardHome Component renders correctly and matches snapshot 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Medium",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -1085,7 +1085,7 @@ exports[`CardHome Component renders correctly and matches snapshot 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 14,
                                         "letterSpacing": 0,
@@ -1114,7 +1114,7 @@ exports[`CardHome Component renders correctly and matches snapshot 1`] = `
                                   testID="listitemcolumn"
                                 >
                                   <SvgMock
-                                    color="#121314"
+                                    color="#131416"
                                     fill="currentColor"
                                     height={20}
                                     name="ArrowRight"
@@ -1169,7 +1169,7 @@ exports[`CardHome Component renders correctly and matches snapshot 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Medium",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -1183,7 +1183,7 @@ exports[`CardHome Component renders correctly and matches snapshot 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#686e7d",
+                                      "color": "#66676a",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 14,
                                       "letterSpacing": 0,
@@ -1212,7 +1212,7 @@ exports[`CardHome Component renders correctly and matches snapshot 1`] = `
                                 testID="listitemcolumn"
                               >
                                 <SvgMock
-                                  color="#121314"
+                                  color="#131416"
                                   fill="currentColor"
                                   height={20}
                                   name="Export"
@@ -1266,7 +1266,7 @@ exports[`CardHome Component renders correctly and matches snapshot 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Medium",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -1280,7 +1280,7 @@ exports[`CardHome Component renders correctly and matches snapshot 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#686e7d",
+                                      "color": "#66676a",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 14,
                                       "letterSpacing": 0,
@@ -1309,7 +1309,7 @@ exports[`CardHome Component renders correctly and matches snapshot 1`] = `
                                 testID="listitemcolumn"
                               >
                                 <SvgMock
-                                  color="#121314"
+                                  color="#131416"
                                   fill="currentColor"
                                   height={20}
                                   name="Export"
@@ -1670,7 +1670,7 @@ exports[`CardHome Component renders correctly with privacy mode enabled 1`] = `
                           }
                           onRefresh={[Function]}
                           refreshing={false}
-                          tintColor="#121314"
+                          tintColor="#131416"
                         />
                       }
                       showsVerticalScrollIndicator={false}
@@ -1691,7 +1691,7 @@ exports[`CardHome Component renders correctly with privacy mode enabled 1`] = `
                           style={
                             [
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Bold",
                                 "fontSize": 24,
                                 "fontWeight": 700,
@@ -1712,7 +1712,7 @@ exports[`CardHome Component renders correctly with privacy mode enabled 1`] = `
                           style={
                             [
                               {
-                                "backgroundColor": "#3c4d9d0f",
+                                "backgroundColor": "#b4b4b528",
                                 "borderRadius": 8,
                                 "display": "flex",
                                 "marginLeft": 16,
@@ -2208,9 +2208,9 @@ exports[`CardHome Component renders correctly with privacy mode enabled 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
-                                      "fontSize": 18,
+                                      "fontSize": 20,
                                       "letterSpacing": 0,
                                       "lineHeight": 24,
                                     }
@@ -2224,7 +2224,7 @@ exports[`CardHome Component renders correctly with privacy mode enabled 1`] = `
                                   testID="privacy-toggle-button"
                                 >
                                   <SvgMock
-                                    color="#121314"
+                                    color="#131416"
                                     fill="currentColor"
                                     height={20}
                                     name="EyeSlash"
@@ -2243,7 +2243,7 @@ exports[`CardHome Component renders correctly with privacy mode enabled 1`] = `
                                 style={
                                   [
                                     {
-                                      "color": "#686e7d",
+                                      "color": "#66676a",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 14,
                                       "fontWeight": 400,
@@ -2297,7 +2297,7 @@ exports[`CardHome Component renders correctly with privacy mode enabled 1`] = `
                                   {
                                     "alignItems": "center",
                                     "alignSelf": "stretch",
-                                    "backgroundColor": "#121314",
+                                    "backgroundColor": "#131416",
                                     "borderRadius": 12,
                                     "flexDirection": "row",
                                     "height": 48,
@@ -2335,7 +2335,7 @@ exports[`CardHome Component renders correctly with privacy mode enabled 1`] = `
                                   {
                                     "alignItems": "center",
                                     "alignSelf": "stretch",
-                                    "backgroundColor": "#121314",
+                                    "backgroundColor": "#131416",
                                     "borderRadius": 12,
                                     "flexDirection": "row",
                                     "height": 48,
@@ -2412,7 +2412,7 @@ exports[`CardHome Component renders correctly with privacy mode enabled 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Medium",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -2426,7 +2426,7 @@ exports[`CardHome Component renders correctly with privacy mode enabled 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 14,
                                         "letterSpacing": 0,
@@ -2455,7 +2455,7 @@ exports[`CardHome Component renders correctly with privacy mode enabled 1`] = `
                                   testID="listitemcolumn"
                                 >
                                   <SvgMock
-                                    color="#121314"
+                                    color="#131416"
                                     fill="currentColor"
                                     height={20}
                                     name="ArrowRight"
@@ -2510,7 +2510,7 @@ exports[`CardHome Component renders correctly with privacy mode enabled 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Medium",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -2524,7 +2524,7 @@ exports[`CardHome Component renders correctly with privacy mode enabled 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#686e7d",
+                                      "color": "#66676a",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 14,
                                       "letterSpacing": 0,
@@ -2553,7 +2553,7 @@ exports[`CardHome Component renders correctly with privacy mode enabled 1`] = `
                                 testID="listitemcolumn"
                               >
                                 <SvgMock
-                                  color="#121314"
+                                  color="#131416"
                                   fill="currentColor"
                                   height={20}
                                   name="Export"
@@ -2607,7 +2607,7 @@ exports[`CardHome Component renders correctly with privacy mode enabled 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Medium",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -2621,7 +2621,7 @@ exports[`CardHome Component renders correctly with privacy mode enabled 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#686e7d",
+                                      "color": "#66676a",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 14,
                                       "letterSpacing": 0,
@@ -2650,7 +2650,7 @@ exports[`CardHome Component renders correctly with privacy mode enabled 1`] = `
                                 testID="listitemcolumn"
                               >
                                 <SvgMock
-                                  color="#121314"
+                                  color="#131416"
                                   fill="currentColor"
                                   height={20}
                                   name="Export"
diff --git a/app/components/UI/Card/Views/CardWelcome/CardWelcome.test.tsx b/app/components/UI/Card/Views/CardWelcome/CardWelcome.test.tsx
index 933b21f9bfaa..4be12497095b 100644
--- a/app/components/UI/Card/Views/CardWelcome/CardWelcome.test.tsx
+++ b/app/components/UI/Card/Views/CardWelcome/CardWelcome.test.tsx
@@ -51,9 +51,13 @@ jest.mock('../../../../../../locales/i18n', () => ({
 
 jest.mock('../../../../../images/stacked-cards.png', () => 1);
 
-jest.mock('../../../../../util/theme', () => ({
-  useTheme: () => ({ colors: { background: { default: '#fff' } } }),
-}));
+jest.mock('../../../../../util/theme', () => {
+  const actual = jest.requireActual('../../../../../util/theme');
+  return {
+    ...actual,
+    useTheme: () => actual.mockTheme,
+  };
+});
 
 const createTestStore = (initialState = {}) =>
   configureStore({
diff --git a/app/components/UI/Card/Views/Cashback/Cashback.test.tsx b/app/components/UI/Card/Views/Cashback/Cashback.test.tsx
index 839b30c3ab85..c29406ac6d43 100644
--- a/app/components/UI/Card/Views/Cashback/Cashback.test.tsx
+++ b/app/components/UI/Card/Views/Cashback/Cashback.test.tsx
@@ -1,3 +1,4 @@
+const mockGoBack = jest.fn();
 const mockShowToast = jest.fn();
 const mockCloseToast = jest.fn();
 const mockTrackEvent = jest.fn();
@@ -36,16 +37,23 @@ jest.mock('../../util/metrics', () => ({
   },
 }));
 
-jest.mock('../../../../../util/theme', () => ({
-  useTheme: jest.fn(() => ({
-    colors: {
-      icon: { default: '#000' },
-      success: { default: '#00ff00' },
-      error: { default: '#ff0000' },
-      background: { default: '#fff' },
-    },
-  })),
-}));
+jest.mock('@react-navigation/native', () => {
+  const actualNav = jest.requireActual('@react-navigation/native');
+  return {
+    ...actualNav,
+    useNavigation: () => ({
+      goBack: mockGoBack,
+    }),
+  };
+});
+
+jest.mock('../../../../../util/theme', () => {
+  const actual = jest.requireActual('../../../../../util/theme');
+  return {
+    ...actual,
+    useTheme: jest.fn(() => actual.mockTheme),
+  };
+});
 
 jest.mock('../../../../../../locales/i18n', () => ({
   strings: (key: string) => {
@@ -416,6 +424,51 @@ describe('Cashback Component', () => {
       );
     });
 
+    it('navigates back after successful withdrawal', () => {
+      mockHookReturn.cashbackWallet = {
+        id: 'w1',
+        balance: '10.00',
+        currency: 'musd',
+        isWithdrawable: true,
+        type: 'reward',
+      };
+      mockHookReturn.monitoringStatus = 'success';
+
+      render();
+
+      expect(mockGoBack).toHaveBeenCalled();
+    });
+
+    it('does not navigate back when monitoring fails', () => {
+      mockHookReturn.cashbackWallet = {
+        id: 'w1',
+        balance: '10.00',
+        currency: 'musd',
+        isWithdrawable: true,
+        type: 'reward',
+      };
+      mockHookReturn.monitoringStatus = 'failed';
+
+      render();
+
+      expect(mockGoBack).not.toHaveBeenCalled();
+    });
+
+    it('does not navigate back when status is idle', () => {
+      mockHookReturn.cashbackWallet = {
+        id: 'w1',
+        balance: '10.00',
+        currency: 'musd',
+        isWithdrawable: true,
+        type: 'reward',
+      };
+      mockHookReturn.monitoringStatus = 'idle';
+
+      render();
+
+      expect(mockGoBack).not.toHaveBeenCalled();
+    });
+
     it('shows failure toast when monitoring fails', () => {
       mockHookReturn.cashbackWallet = {
         id: 'w1',
diff --git a/app/components/UI/Card/Views/Cashback/Cashback.tsx b/app/components/UI/Card/Views/Cashback/Cashback.tsx
index 28f140a29121..4b1ccf0b42a6 100644
--- a/app/components/UI/Card/Views/Cashback/Cashback.tsx
+++ b/app/components/UI/Card/Views/Cashback/Cashback.tsx
@@ -5,11 +5,11 @@ import {
   Text,
   TextVariant,
   TextColor,
+  Skeleton,
 } from '@metamask/design-system-react-native';
 import { IconName } from '../../../../../component-library/components/Icons/Icon';
 import { useTailwind } from '@metamask/design-system-twrnc-preset';
 import { useTheme } from '../../../../../util/theme';
-import { Skeleton } from '../../../../../component-library/components/Skeleton';
 import { strings } from '../../../../../../locales/i18n';
 import Button, {
   ButtonSize,
@@ -26,6 +26,7 @@ import { useAnalytics } from '../../../../hooks/useAnalytics/useAnalytics';
 import { MetaMetricsEvents } from '../../../../../core/Analytics';
 import { CardActions } from '../../util/metrics';
 import { CashbackSelectors } from './Cashback.testIds';
+import { useNavigation } from '@react-navigation/native';
 
 const CURRENCY_DISPLAY_MAP: Record<string, string> = {
   musd: 'mUSD',
@@ -45,6 +46,7 @@ const formatAmount = (value: string | number): string => {
 };
 
 const Cashback: React.FC = () => {
+  const { goBack } = useNavigation();
   const tw = useTailwind();
   const theme = useTheme();
   const { toastRef } = useContext(ToastContext);
@@ -94,8 +96,9 @@ const Cashback: React.FC = () => {
         iconColor: theme.colors.success.default,
         hasNoTimeout: false,
       });
+      goBack();
     }
-  }, [monitoringStatus, toastRef, theme]);
+  }, [monitoringStatus, toastRef, theme, goBack]);
 
   useEffect(() => {
     if (monitoringStatus === 'failed' || monitoringError) {
@@ -189,7 +192,7 @@ const Cashback: React.FC = () => {
         </Box>
 
         {error ? (
-          <Box twClassName="rounded-xl bg-background-alternative p-4 items-center">
+          <Box twClassName="rounded-xl bg-background-muted p-4 items-center">
             <Text
               variant={TextVariant.BodyMd}
               color={TextColor.TextAlternative}
@@ -199,7 +202,7 @@ const Cashback: React.FC = () => {
           </Box>
         ) : (
           <Box
-            twClassName="rounded-xl bg-background-alternative p-4"
+            twClassName="rounded-xl bg-background-muted p-4"
             testID={CashbackSelectors.DETAILS_CARD}
           >
             <Box twClassName="gap-3">
diff --git a/app/components/UI/Card/Views/SpendingLimit/SpendingLimit.test.tsx b/app/components/UI/Card/Views/SpendingLimit/SpendingLimit.test.tsx
index 690549e8636e..d0856bf62aaa 100644
--- a/app/components/UI/Card/Views/SpendingLimit/SpendingLimit.test.tsx
+++ b/app/components/UI/Card/Views/SpendingLimit/SpendingLimit.test.tsx
@@ -119,17 +119,13 @@ jest.mock('../../sdk', () => ({
   })),
 }));
 
-jest.mock('../../../../../util/theme', () => ({
-  useTheme: jest.fn(() => ({
-    colors: {
-      success: { default: '#00ff00', muted: '#00ff0033' },
-      error: { default: '#ff0000', muted: '#ff000033' },
-      background: { default: '#ffffff' },
-      text: { default: '#000000' },
-      border: { default: '#cccccc' },
-    },
-  })),
-}));
+jest.mock('../../../../../util/theme', () => {
+  const actual = jest.requireActual('../../../../../util/theme');
+  return {
+    ...actual,
+    useTheme: jest.fn(() => actual.mockTheme),
+  };
+});
 
 const mockToastRef = {
   current: {
diff --git a/app/components/UI/Card/components/AddFundsBottomSheet/AddFundsBottomSheet.test.tsx b/app/components/UI/Card/components/AddFundsBottomSheet/AddFundsBottomSheet.test.tsx
index c987d4b458f4..ef247b6ee764 100644
--- a/app/components/UI/Card/components/AddFundsBottomSheet/AddFundsBottomSheet.test.tsx
+++ b/app/components/UI/Card/components/AddFundsBottomSheet/AddFundsBottomSheet.test.tsx
@@ -51,27 +51,13 @@ jest.mock('../../../../../util/trace', () => ({
   },
 }));
 
-jest.mock('../../../../../util/theme', () => ({
-  useTheme: jest.fn(() => ({
-    colors: {
-      text: {
-        alternative: '#666666',
-      },
-    },
-  })),
-  mockTheme: {
-    colors: {
-      background: {
-        default: '#ffffff',
-      },
-      text: {
-        default: '#000000',
-        alternative: '#666666',
-      },
-    },
-    themeAppearance: 'light',
-  },
-}));
+jest.mock('../../../../../util/theme', () => {
+  const { mockTheme } = jest.requireActual('../../../../../util/theme');
+  return {
+    useTheme: jest.fn(() => mockTheme),
+    mockTheme,
+  };
+});
 
 jest.mock('./AddFundsBottomSheet.styles', () => ({
   createStyles: jest.fn(() => ({
@@ -98,6 +84,8 @@ jest.mock('../../../Ramp/hooks/useRampsButtonClickData', () => ({
   useRampsButtonClickData: jest.fn(() => mockButtonClickData),
 }));
 
+jest.mock('../../../Ramp/hooks/useRampsUnifiedV2Enabled');
+
 jest.mock('@react-navigation/native', () => ({
   ...jest.requireActual('@react-navigation/native'),
   useNavigation: () => ({
@@ -241,7 +229,7 @@ describe('AddFundsBottomSheet', () => {
     );
     expect(mockEventBuilder.addProperties).toHaveBeenCalledWith(
       expect.objectContaining({
-        text: 'Deposit',
+        button_text: 'Fund with cash',
         location: 'CardHome',
         chain_id_destination: '59144',
         ramp_type: 'DEPOSIT',
diff --git a/app/components/UI/Card/components/AddFundsBottomSheet/AddFundsBottomSheet.tsx b/app/components/UI/Card/components/AddFundsBottomSheet/AddFundsBottomSheet.tsx
index 36b0f890279c..5bd00180a1c3 100644
--- a/app/components/UI/Card/components/AddFundsBottomSheet/AddFundsBottomSheet.tsx
+++ b/app/components/UI/Card/components/AddFundsBottomSheet/AddFundsBottomSheet.tsx
@@ -35,6 +35,7 @@ import { useRampNavigation } from '../../../Ramp/hooks/useRampNavigation';
 import { safeFormatChainIdToHex } from '../../util/safeFormatChainIdToHex';
 import { getDetectedGeolocation } from '../../../../../reducers/fiatOrders';
 import { useRampsButtonClickData } from '../../../Ramp/hooks/useRampsButtonClickData';
+import useRampsUnifiedV2Enabled from '../../../Ramp/hooks/useRampsUnifiedV2Enabled';
 import {
   createNavigationDetails,
   useParams,
@@ -66,6 +67,7 @@ const AddFundsBottomSheet: React.FC = () => {
   const rampGeodetectedRegion = useSelector(getDetectedGeolocation);
   const { goToDeposit } = useRampNavigation();
   const buttonClickData = useRampsButtonClickData();
+  const isV2UnifiedEnabled = useRampsUnifiedV2Enabled();
 
   const closeBottomSheetAndNavigate = useCallback(
     (navigateFunc: () => void) => {
@@ -94,10 +96,10 @@ const AddFundsBottomSheet: React.FC = () => {
     trackEvent(
       createEventBuilder(MetaMetricsEvents.RAMPS_BUTTON_CLICKED)
         .addProperties({
-          text: 'Deposit',
+          button_text: 'Fund with cash',
           location: 'CardHome',
           chain_id_destination: getDecimalChainId(priorityToken?.caipChainId),
-          ramp_type: 'DEPOSIT',
+          ramp_type: isV2UnifiedEnabled ? 'UNIFIED_BUY_2' : 'DEPOSIT',
           region: rampGeodetectedRegion,
           ramp_routing: buttonClickData.ramp_routing,
           is_authenticated: buttonClickData.is_authenticated,
@@ -118,6 +120,7 @@ const AddFundsBottomSheet: React.FC = () => {
     createEventBuilder,
     priorityToken,
     buttonClickData,
+    isV2UnifiedEnabled,
   ]);
 
   const options = [
diff --git a/app/components/UI/Card/components/AddFundsBottomSheet/__snapshots__/AddFundsBottomSheet.test.tsx.snap b/app/components/UI/Card/components/AddFundsBottomSheet/__snapshots__/AddFundsBottomSheet.test.tsx.snap
index df1444d1ceb8..cb5a0c634ce8 100644
--- a/app/components/UI/Card/components/AddFundsBottomSheet/__snapshots__/AddFundsBottomSheet.test.tsx.snap
+++ b/app/components/UI/Card/components/AddFundsBottomSheet/__snapshots__/AddFundsBottomSheet.test.tsx.snap
@@ -335,7 +335,7 @@ exports[`AddFundsBottomSheet renders with both options enabled and matches snaps
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -385,7 +385,7 @@ exports[`AddFundsBottomSheet renders with both options enabled and matches snaps
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -422,7 +422,7 @@ exports[`AddFundsBottomSheet renders with both options enabled and matches snaps
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -470,7 +470,7 @@ exports[`AddFundsBottomSheet renders with both options enabled and matches snaps
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Bold",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -504,7 +504,7 @@ exports[`AddFundsBottomSheet renders with both options enabled and matches snaps
                                   }
                                 >
                                   <SvgMock
-                                    color="#121314"
+                                    color="#131416"
                                     fill="currentColor"
                                     height={24}
                                     name="Close"
@@ -648,7 +648,7 @@ exports[`AddFundsBottomSheet renders with both options enabled and matches snaps
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -663,7 +663,7 @@ exports[`AddFundsBottomSheet renders with both options enabled and matches snaps
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 14,
                                               "letterSpacing": 0,
@@ -761,7 +761,7 @@ exports[`AddFundsBottomSheet renders with both options enabled and matches snaps
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -776,7 +776,7 @@ exports[`AddFundsBottomSheet renders with both options enabled and matches snaps
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 14,
                                               "letterSpacing": 0,
@@ -1143,7 +1143,7 @@ exports[`AddFundsBottomSheet renders with no options when both are disabled and
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -1193,7 +1193,7 @@ exports[`AddFundsBottomSheet renders with no options when both are disabled and
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -1230,7 +1230,7 @@ exports[`AddFundsBottomSheet renders with no options when both are disabled and
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -1278,7 +1278,7 @@ exports[`AddFundsBottomSheet renders with no options when both are disabled and
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Bold",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -1312,7 +1312,7 @@ exports[`AddFundsBottomSheet renders with no options when both are disabled and
                                   }
                                 >
                                   <SvgMock
-                                    color="#121314"
+                                    color="#131416"
                                     fill="currentColor"
                                     height={24}
                                     name="Close"
@@ -1735,7 +1735,7 @@ exports[`AddFundsBottomSheet renders with only deposit option when swaps are not
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -1785,7 +1785,7 @@ exports[`AddFundsBottomSheet renders with only deposit option when swaps are not
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -1822,7 +1822,7 @@ exports[`AddFundsBottomSheet renders with only deposit option when swaps are not
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -1870,7 +1870,7 @@ exports[`AddFundsBottomSheet renders with only deposit option when swaps are not
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Bold",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -1904,7 +1904,7 @@ exports[`AddFundsBottomSheet renders with only deposit option when swaps are not
                                   }
                                 >
                                   <SvgMock
-                                    color="#121314"
+                                    color="#131416"
                                     fill="currentColor"
                                     height={24}
                                     name="Close"
@@ -2048,7 +2048,7 @@ exports[`AddFundsBottomSheet renders with only deposit option when swaps are not
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -2063,7 +2063,7 @@ exports[`AddFundsBottomSheet renders with only deposit option when swaps are not
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 14,
                                               "letterSpacing": 0,
@@ -2435,7 +2435,7 @@ exports[`AddFundsBottomSheet renders with only swap option when deposit is disab
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -2485,7 +2485,7 @@ exports[`AddFundsBottomSheet renders with only swap option when deposit is disab
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -2522,7 +2522,7 @@ exports[`AddFundsBottomSheet renders with only swap option when deposit is disab
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -2570,7 +2570,7 @@ exports[`AddFundsBottomSheet renders with only swap option when deposit is disab
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Bold",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -2604,7 +2604,7 @@ exports[`AddFundsBottomSheet renders with only swap option when deposit is disab
                                   }
                                 >
                                   <SvgMock
-                                    color="#121314"
+                                    color="#131416"
                                     fill="currentColor"
                                     height={24}
                                     name="Close"
@@ -2753,7 +2753,7 @@ exports[`AddFundsBottomSheet renders with only swap option when deposit is disab
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -2768,7 +2768,7 @@ exports[`AddFundsBottomSheet renders with only swap option when deposit is disab
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 14,
                                               "letterSpacing": 0,
diff --git a/app/components/UI/Card/components/AssetSelectionBottomSheet/AssetSelectionBottomSheet.test.tsx b/app/components/UI/Card/components/AssetSelectionBottomSheet/AssetSelectionBottomSheet.test.tsx
index 75c4e5c59888..8981c667aa18 100644
--- a/app/components/UI/Card/components/AssetSelectionBottomSheet/AssetSelectionBottomSheet.test.tsx
+++ b/app/components/UI/Card/components/AssetSelectionBottomSheet/AssetSelectionBottomSheet.test.tsx
@@ -3,28 +3,13 @@ const mockNavigate = jest.fn();
 const mockGoBack = jest.fn();
 
 // Mock theme first to prevent component initialization errors
-jest.mock('../../../../../util/theme', () => ({
-  useTheme: jest.fn(() => ({
-    colors: {
-      primary: { default: '#0376c9' },
-      success: { default: '#28a745', muted: '#d4edda' },
-      error: { default: '#d73a49', muted: '#f8d7da' },
-      background: { default: '#ffffff' },
-      text: { default: '#000000' },
-    },
-    themeAppearance: 'light',
-  })),
-  mockTheme: {
-    colors: {
-      primary: { default: '#0376c9' },
-      success: { default: '#28a745', muted: '#d4edda' },
-      error: { default: '#d73a49', muted: '#f8d7da' },
-      background: { default: '#ffffff' },
-      text: { default: '#000000' },
-    },
-    themeAppearance: 'light',
-  },
-}));
+jest.mock('../../../../../util/theme', () => {
+  const actual = jest.requireActual('../../../../../util/theme');
+  return {
+    ...actual,
+    useTheme: jest.fn(() => actual.mockTheme),
+  };
+});
 
 const mockUseParams = jest.fn();
 jest.mock('@react-navigation/native', () => ({
diff --git a/app/components/UI/Card/components/CardButton/CardButton.test.tsx b/app/components/UI/Card/components/CardButton/CardButton.test.tsx
index d998d58997ee..33f475a010ad 100644
--- a/app/components/UI/Card/components/CardButton/CardButton.test.tsx
+++ b/app/components/UI/Card/components/CardButton/CardButton.test.tsx
@@ -24,8 +24,6 @@ function renderWithProvider(component: React.ComponentType) {
         engine: { backgroundState },
         card: {
           cardholderAccounts: [],
-          priorityTokensByAddress: {},
-          lastFetchedByAddress: {},
           hasViewedCardButton: false,
           isLoaded: false,
         },
diff --git a/app/components/UI/Card/components/CardButton/__snapshots__/CardButton.test.tsx.snap b/app/components/UI/Card/components/CardButton/__snapshots__/CardButton.test.tsx.snap
index 72901f766074..12a13066a965 100644
--- a/app/components/UI/Card/components/CardButton/__snapshots__/CardButton.test.tsx.snap
+++ b/app/components/UI/Card/components/CardButton/__snapshots__/CardButton.test.tsx.snap
@@ -379,7 +379,7 @@ exports[`CardButton Component renders and matches snapshot 1`] = `
                         style={
                           [
                             {
-                              "color": "#121314",
+                              "color": "#131416",
                               "height": 24,
                               "width": 24,
                             },
diff --git a/app/components/UI/Card/components/DaimoPayModal/DaimoPayModal.test.tsx b/app/components/UI/Card/components/DaimoPayModal/DaimoPayModal.test.tsx
index 7055665f3b03..9868883c4146 100644
--- a/app/components/UI/Card/components/DaimoPayModal/DaimoPayModal.test.tsx
+++ b/app/components/UI/Card/components/DaimoPayModal/DaimoPayModal.test.tsx
@@ -5,7 +5,7 @@ import DaimoPayModal from './DaimoPayModal';
 import { DaimoPayModalSelectors } from './DaimoPayModal.testIds';
 import { MetaMetricsEvents } from '../../../../../core/Analytics';
 import { CardScreens } from '../../util/metrics';
-import { clearCacheData } from '../../../../../core/redux/slices/card';
+import { cardQueries } from '../../queries';
 
 const mockNavigate = jest.fn();
 const mockGoBack = jest.fn();
@@ -32,6 +32,11 @@ jest.mock('@react-navigation/native', () => ({
   },
 }));
 
+const mockInvalidateQueries = jest.fn();
+jest.mock('@tanstack/react-query', () => ({
+  useQueryClient: jest.fn(),
+}));
+
 jest.mock('../../../../../util/navigation/navUtils', () => ({
   useParams: () => ({
     payId: 'test-pay-id-123',
@@ -114,10 +119,13 @@ jest.mock('../../../../../../locales/i18n', () => ({
 }));
 
 jest.mock('@metamask/design-system-twrnc-preset', () => ({
-  useTailwind: () => ({
-    style: jest.fn(() => ({})),
-    color: jest.fn(() => '#000'),
-  }),
+  useTailwind: () => {
+    const { mockTheme } = jest.requireActual('../../../../../util/theme');
+    return {
+      style: jest.fn(() => ({})),
+      color: jest.fn(() => mockTheme.colors.text.default),
+    };
+  },
 }));
 
 jest.mock('../../../../../core/EntryScriptWeb3', () => ({
@@ -161,10 +169,6 @@ jest.mock('../../../../../selectors/snaps/permissionController', () => ({
 
 jest.mock('../../../../../core/redux/slices/card', () => ({
   selectIsDaimoDemo: jest.fn(),
-  clearCacheData: jest.fn((key: string) => ({
-    type: 'card/clearCacheData',
-    payload: key,
-  })),
 }));
 
 jest.mock('../../../../../util/Logger', () => ({
@@ -271,6 +275,16 @@ describe('DaimoPayModal', () => {
   beforeEach(() => {
     jest.clearAllMocks();
     jest.useFakeTimers();
+
+    mockInvalidateQueries.mockResolvedValue(undefined);
+    (
+      jest.requireMock('@tanstack/react-query') as {
+        useQueryClient: jest.Mock;
+      }
+    ).useQueryClient.mockReturnValue({
+      invalidateQueries: mockInvalidateQueries,
+    });
+
     mockOnMessage = null;
     mockOnError = null;
     mockOnShouldStartLoadWithRequest = null;
@@ -507,9 +521,9 @@ describe('DaimoPayModal', () => {
         }
       });
 
-      expect(mockReduxDispatch).toHaveBeenCalledWith(
-        clearCacheData('card-details'),
-      );
+      expect(mockInvalidateQueries).toHaveBeenCalledWith({
+        queryKey: cardQueries.dashboard.keys.cardDetails(),
+      });
     });
 
     it('does not navigate on paymentCompleted in production mode - lets polling handle navigation', async () => {
diff --git a/app/components/UI/Card/components/DaimoPayModal/DaimoPayModal.tsx b/app/components/UI/Card/components/DaimoPayModal/DaimoPayModal.tsx
index f485774a9ff1..e03b69f52d2c 100644
--- a/app/components/UI/Card/components/DaimoPayModal/DaimoPayModal.tsx
+++ b/app/components/UI/Card/components/DaimoPayModal/DaimoPayModal.tsx
@@ -11,7 +11,8 @@ import {
   ButtonVariant,
   ButtonSize,
 } from '@metamask/design-system-react-native';
-import { useSelector, useDispatch } from 'react-redux';
+import { useSelector } from 'react-redux';
+import { useQueryClient } from '@tanstack/react-query';
 import { isEqual } from 'lodash';
 import { useParams } from '../../../../../util/navigation/navUtils';
 import Logger from '../../../../../util/Logger';
@@ -36,10 +37,8 @@ import AppConstants from '../../../../../core/AppConstants';
 import { getPermittedEvmAddressesByHostname } from '../../../../../core/Permissions';
 import { selectPermissionControllerState } from '../../../../../selectors/snaps/permissionController';
 import type { RootState } from '../../../../../reducers';
-import {
-  selectIsDaimoDemo,
-  clearCacheData,
-} from '../../../../../core/redux/slices/card';
+import { selectIsDaimoDemo } from '../../../../../core/redux/slices/card';
+import { cardQueries } from '../../queries';
 import { getDaimoEnvironment } from '../../util/getDaimoEnvironment';
 
 const POLLING_INTERVAL_MS = 5000;
@@ -78,7 +77,7 @@ const DaimoPayModal: React.FC = () => {
   const iconRef = useRef<ImageSourcePropType | undefined>(undefined);
 
   const navigation = useNavigation();
-  const dispatch = useDispatch();
+  const queryClient = useQueryClient();
   const { trackEvent, createEventBuilder } = useAnalytics();
   const { payId, fromUpgrade, orderId } = useParams<DaimoPayModalParams>();
   const tw = useTailwind();
@@ -170,7 +169,9 @@ const DaimoPayModal: React.FC = () => {
         pollingIntervalRef.current = null;
       }
 
-      dispatch(clearCacheData('card-details'));
+      queryClient.invalidateQueries({
+        queryKey: cardQueries.dashboard.keys.cardDetails(),
+      });
 
       const parentNavigator = navigation.dangerouslyGetParent();
       if (parentNavigator) {
@@ -209,7 +210,7 @@ const DaimoPayModal: React.FC = () => {
         );
       }
     },
-    [trackEvent, createEventBuilder, navigation, fromUpgrade, dispatch],
+    [trackEvent, createEventBuilder, navigation, fromUpgrade, queryClient],
   );
 
   const handlePaymentBounced = useCallback(
diff --git a/app/components/UI/Card/components/ManageCardListItem/__snapshots__/ManageCardListItem.test.tsx.snap b/app/components/UI/Card/components/ManageCardListItem/__snapshots__/ManageCardListItem.test.tsx.snap
index f9287650bc9c..0a30c686afa0 100644
--- a/app/components/UI/Card/components/ManageCardListItem/__snapshots__/ManageCardListItem.test.tsx.snap
+++ b/app/components/UI/Card/components/ManageCardListItem/__snapshots__/ManageCardListItem.test.tsx.snap
@@ -348,7 +348,7 @@ exports[`ManageCardListItem Component renders with React.ReactNode description a
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Medium",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -726,7 +726,7 @@ exports[`ManageCardListItem Component renders with all props and matches snapsho
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Medium",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -740,7 +740,7 @@ exports[`ManageCardListItem Component renders with all props and matches snapsho
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#686e7d",
+                                  "color": "#66676a",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 14,
                                   "letterSpacing": 0,
@@ -769,7 +769,7 @@ exports[`ManageCardListItem Component renders with all props and matches snapsho
                             testID="listitemcolumn"
                           >
                             <SvgMock
-                              color="#121314"
+                              color="#131416"
                               fill="currentColor"
                               height={20}
                               name="Edit"
@@ -1146,7 +1146,7 @@ exports[`ManageCardListItem Component renders with custom right icon when rightI
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Medium",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -1160,7 +1160,7 @@ exports[`ManageCardListItem Component renders with custom right icon when rightI
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#686e7d",
+                                  "color": "#66676a",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 14,
                                   "letterSpacing": 0,
@@ -1189,7 +1189,7 @@ exports[`ManageCardListItem Component renders with custom right icon when rightI
                             testID="listitemcolumn"
                           >
                             <SvgMock
-                              color="#121314"
+                              color="#131416"
                               fill="currentColor"
                               height={20}
                               name="Edit"
@@ -1566,7 +1566,7 @@ exports[`ManageCardListItem Component renders with required props and matches sn
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Medium",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -1580,7 +1580,7 @@ exports[`ManageCardListItem Component renders with required props and matches sn
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#686e7d",
+                                  "color": "#66676a",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 14,
                                   "letterSpacing": 0,
@@ -1954,7 +1954,7 @@ exports[`ManageCardListItem Component renders without right icon when rightIcon
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Medium",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -1968,7 +1968,7 @@ exports[`ManageCardListItem Component renders without right icon when rightIcon
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#686e7d",
+                                  "color": "#66676a",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 14,
                                   "letterSpacing": 0,
diff --git a/app/components/UI/Card/components/Onboarding/ConfirmEmail.test.tsx b/app/components/UI/Card/components/Onboarding/ConfirmEmail.test.tsx
index 98d158208d2e..46defc15e671 100644
--- a/app/components/UI/Card/components/Onboarding/ConfirmEmail.test.tsx
+++ b/app/components/UI/Card/components/Onboarding/ConfirmEmail.test.tsx
@@ -258,22 +258,19 @@ jest.mock('react-native-confirmation-code-field', () => {
 });
 
 // Mock useStyles hook
-jest.mock('../../../../../component-library/hooks', () => ({
-  useStyles: jest.fn(() => ({
-    styles: {
-      codeFieldRoot: {},
-      cellRoot: {},
-      focusCell: {},
-    },
-    theme: {
-      colors: {
-        text: {
-          alternative: '#6a737d',
-        },
+jest.mock('../../../../../component-library/hooks', () => {
+  const { mockTheme } = jest.requireActual('../../../../../util/theme');
+  return {
+    useStyles: jest.fn(() => ({
+      styles: {
+        codeFieldRoot: {},
+        cellRoot: {},
+        focusCell: {},
       },
-    },
-  })),
-}));
+      theme: mockTheme,
+    })),
+  };
+});
 
 jest.mock('../../../../hooks/useAnalytics/useAnalytics', () => ({
   useAnalytics: jest.fn(),
diff --git a/app/components/UI/Card/components/Onboarding/KYCFailed.test.tsx b/app/components/UI/Card/components/Onboarding/KYCFailed.test.tsx
index 57d5817e586e..900a594cf7d1 100644
--- a/app/components/UI/Card/components/Onboarding/KYCFailed.test.tsx
+++ b/app/components/UI/Card/components/Onboarding/KYCFailed.test.tsx
@@ -198,11 +198,14 @@ jest.mock('../../../../../../locales/i18n', () => ({
 }));
 
 // Mock styles/common
-jest.mock('../../../../../styles/common', () => ({
-  colors: {
-    white: '#FFFFFF',
-  },
-}));
+jest.mock('../../../../../styles/common', () => {
+  const { brandColor } = jest.requireActual('@metamask/design-tokens');
+  return {
+    colors: {
+      white: brandColor.white,
+    },
+  };
+});
 
 describe('KYCFailed Component', () => {
   const mockNavigate = jest.fn();
diff --git a/app/components/UI/Card/components/Onboarding/KYCFailed.tsx b/app/components/UI/Card/components/Onboarding/KYCFailed.tsx
index 611c010e7af1..cfe55e0d98a1 100644
--- a/app/components/UI/Card/components/Onboarding/KYCFailed.tsx
+++ b/app/components/UI/Card/components/Onboarding/KYCFailed.tsx
@@ -27,6 +27,7 @@ import { MetaMetricsEvents } from '../../../../../core/Analytics';
 import { CardScreens } from '../../util/metrics';
 import MM_CARD_ONBOARDING_FAILED from '../../../../../images/mm-card-onboarding-failed.png';
 import { Box, Text, TextVariant } from '@metamask/design-system-react-native';
+import { brandColor } from '@metamask/design-tokens';
 import { colors as importedColors } from '../../../../../styles/common';
 import { resetOnboardingState } from '../../../../../core/redux/slices/card';
 
@@ -101,13 +102,13 @@ const KYCFailed = () => {
   }, [navigation]);
 
   return (
-    <Box twClassName="flex-1" style={tw.style('bg-[#330745]')}>
+    <Box twClassName="flex-1" style={tw.style(`bg-[${brandColor.purple800}]`)}>
       {/* Header with back button */}
       <SafeAreaView edges={['top']} style={staticStyles.headerContainer}>
         <Box twClassName="px-4 py-2 items-start">
           <ButtonIcon
             iconName={IconName.ArrowLeft}
-            size={ButtonIconSizes.Lg}
+            size={ButtonIconSizes.Md}
             iconColor={importedColors.white}
             onPress={navigateToHome}
             testID="kyc-failed-back-button"
diff --git a/app/components/UI/Card/components/Onboarding/KYCPending.test.tsx b/app/components/UI/Card/components/Onboarding/KYCPending.test.tsx
index a2eb3d7175cc..49a696616442 100644
--- a/app/components/UI/Card/components/Onboarding/KYCPending.test.tsx
+++ b/app/components/UI/Card/components/Onboarding/KYCPending.test.tsx
@@ -185,11 +185,14 @@ jest.mock('../../../../../../locales/i18n', () => ({
 }));
 
 // Mock styles/common
-jest.mock('../../../../../styles/common', () => ({
-  colors: {
-    white: '#FFFFFF',
-  },
-}));
+jest.mock('../../../../../styles/common', () => {
+  const { brandColor } = jest.requireActual('@metamask/design-tokens');
+  return {
+    colors: {
+      white: brandColor.white,
+    },
+  };
+});
 
 describe('KYCPending Component', () => {
   const mockNavigate = jest.fn();
diff --git a/app/components/UI/Card/components/Onboarding/KYCPending.tsx b/app/components/UI/Card/components/Onboarding/KYCPending.tsx
index 914ef1f4081c..8b27b973fd2f 100644
--- a/app/components/UI/Card/components/Onboarding/KYCPending.tsx
+++ b/app/components/UI/Card/components/Onboarding/KYCPending.tsx
@@ -64,7 +64,7 @@ const KYCPending = () => {
         <Box twClassName="px-4 py-2 items-start">
           <ButtonIcon
             iconName={IconName.ArrowLeft}
-            size={ButtonIconSizes.Lg}
+            size={ButtonIconSizes.Md}
             iconColor={importedColors.white}
             onPress={navigateToHome}
             testID="kyc-pending-back-button"
diff --git a/app/components/UI/Card/components/Onboarding/SignUp.tsx b/app/components/UI/Card/components/Onboarding/SignUp.tsx
index 13c4dc3753df..7942b7994b73 100644
--- a/app/components/UI/Card/components/Onboarding/SignUp.tsx
+++ b/app/components/UI/Card/components/Onboarding/SignUp.tsx
@@ -8,6 +8,7 @@ import {
   Icon,
   IconSize,
   IconName,
+  Label,
 } from '@metamask/design-system-react-native';
 import Button, {
   ButtonSize,
@@ -15,7 +16,6 @@ import Button, {
   ButtonWidthTypes,
 } from '../../../../../component-library/components/Buttons/Button';
 import TextField from '../../../../../component-library/components/Form/TextField';
-import Label from '../../../../../component-library/components/Form/Label';
 import Routes from '../../../../../constants/navigation/Routes';
 import { strings } from '../../../../../../locales/i18n';
 import OnboardingStep from './OnboardingStep';
@@ -35,7 +35,7 @@ import { validatePassword } from '../../util/validatePassword';
 import { useAnalytics } from '../../../../hooks/useAnalytics/useAnalytics';
 import { MetaMetricsEvents } from '../../../../../core/Analytics';
 import { CardActions, CardScreens } from '../../util/metrics';
-import { TouchableOpacity } from 'react-native';
+import { ActivityIndicator, TouchableOpacity } from 'react-native';
 import {
   clearOnValueChange,
   createRegionSelectorModalNavigationDetails,
@@ -57,7 +57,10 @@ const SignUp = () => {
   const [isPasswordVisible, setIsPasswordVisible] = useState(false);
   const selectedCountry = useSelector(selectSelectedCountry);
   const geoLocation = useSelector(selectCardGeoLocation);
-  const { data: registrationSettings } = useRegistrationSettings();
+  const {
+    data: registrationSettings,
+    isLoading: isLoadingRegistrationSettings,
+  } = useRegistrationSettings();
   const { trackEvent, createEventBuilder } = useAnalytics();
 
   useEffect(() => {
@@ -218,6 +221,7 @@ const SignUp = () => {
   ]);
 
   const handleCountrySelect = useCallback(() => {
+    if (isLoadingRegistrationSettings) return;
     resetEmailVerificationSend();
     setOnValueChange((region) => {
       dispatch(setSelectedCountry(region));
@@ -231,7 +235,13 @@ const SignUp = () => {
         regions,
       }),
     );
-  }, [dispatch, navigation, regions, resetEmailVerificationSend]);
+  }, [
+    dispatch,
+    navigation,
+    regions,
+    resetEmailVerificationSend,
+    isLoadingRegistrationSettings,
+  ]);
 
   useEffect(() => () => clearOnValueChange(), []);
 
@@ -239,11 +249,21 @@ const SignUp = () => {
     <>
       <Box>
         <Label>{strings('card.card_onboarding.sign_up.country_label')}</Label>
-        <SelectField
-          value={selectedCountry?.name}
-          onPress={handleCountrySelect}
-          testID="signup-country-select"
-        />
+        {isLoadingRegistrationSettings && !selectedCountry ? (
+          <Box
+            twClassName="flex-row items-center justify-center h-12 rounded-xl border border-solid border-border-muted bg-background-muted"
+            testID="signup-country-loading"
+          >
+            <ActivityIndicator size="small" />
+          </Box>
+        ) : (
+          <SelectField
+            value={selectedCountry?.name}
+            onPress={handleCountrySelect}
+            isDisabled={isLoadingRegistrationSettings}
+            testID="signup-country-select"
+          />
+        )}
       </Box>
 
       <Box>
diff --git a/app/components/UI/Card/components/PasswordBottomSheet/PasswordBottomSheet.test.tsx b/app/components/UI/Card/components/PasswordBottomSheet/PasswordBottomSheet.test.tsx
index 24cc324de68c..e65aff3b5405 100644
--- a/app/components/UI/Card/components/PasswordBottomSheet/PasswordBottomSheet.test.tsx
+++ b/app/components/UI/Card/components/PasswordBottomSheet/PasswordBottomSheet.test.tsx
@@ -19,20 +19,12 @@ jest.mock('../../../../../core/Authentication/hooks/useAuthentication', () =>
   jest.fn(),
 );
 
-jest.mock('../../../../../util/theme', () => ({
-  useTheme: jest.fn(() => ({
-    colors: {
-      text: {
-        muted: '#999999',
-        default: '#000000',
-        alternative: '#666666',
-      },
-      error: {
-        default: '#FF0000',
-      },
-    },
-  })),
-}));
+jest.mock('../../../../../util/theme', () => {
+  const { mockTheme } = jest.requireActual('../../../../../util/theme');
+  return {
+    useTheme: jest.fn(() => mockTheme),
+  };
+});
 
 jest.mock('../../../../../util/navigation/navUtils', () => ({
   useParams: () => mockUseParams(),
diff --git a/app/components/UI/Card/components/PasswordBottomSheet/__snapshots__/PasswordBottomSheet.test.tsx.snap b/app/components/UI/Card/components/PasswordBottomSheet/__snapshots__/PasswordBottomSheet.test.tsx.snap
index d4776b2019ca..eebf4e0e9631 100644
--- a/app/components/UI/Card/components/PasswordBottomSheet/__snapshots__/PasswordBottomSheet.test.tsx.snap
+++ b/app/components/UI/Card/components/PasswordBottomSheet/__snapshots__/PasswordBottomSheet.test.tsx.snap
@@ -335,7 +335,7 @@ exports[`PasswordBottomSheet renders correctly and matches snapshot 1`] = `
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -385,7 +385,7 @@ exports[`PasswordBottomSheet renders correctly and matches snapshot 1`] = `
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -422,7 +422,7 @@ exports[`PasswordBottomSheet renders correctly and matches snapshot 1`] = `
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -470,7 +470,7 @@ exports[`PasswordBottomSheet renders correctly and matches snapshot 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Bold",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -504,7 +504,7 @@ exports[`PasswordBottomSheet renders correctly and matches snapshot 1`] = `
                                   }
                                 >
                                   <SvgMock
-                                    color="#121314"
+                                    color="#131416"
                                     fill="currentColor"
                                     height={24}
                                     name="Close"
@@ -533,7 +533,7 @@ exports[`PasswordBottomSheet renders correctly and matches snapshot 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#686e7d",
+                                  "color": "#66676a",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -551,15 +551,15 @@ exports[`PasswordBottomSheet renders correctly and matches snapshot 1`] = `
                               onChangeText={[Function]}
                               onSubmitEditing={[Function]}
                               placeholder="Password"
-                              placeholderTextColor="#b7bbc8"
+                              placeholderTextColor="#babbbe"
                               secureTextEntry={true}
                               style={
                                 {
                                   "backgroundColor": "#ffffff",
-                                  "borderColor": "#b7bbc8",
+                                  "borderColor": "#949596",
                                   "borderRadius": 8,
                                   "borderWidth": 1,
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "paddingBottom": 12,
                                   "paddingLeft": 16,
                                   "paddingRight": 16,
@@ -590,7 +590,7 @@ exports[`PasswordBottomSheet renders correctly and matches snapshot 1`] = `
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "flex-start",
-                                  "backgroundColor": "#3c4d9d0f",
+                                  "backgroundColor": "#b4b4b528",
                                   "borderColor": "transparent",
                                   "borderRadius": 12,
                                   "borderWidth": 1,
@@ -608,7 +608,7 @@ exports[`PasswordBottomSheet renders correctly and matches snapshot 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Medium",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -631,7 +631,7 @@ exports[`PasswordBottomSheet renders correctly and matches snapshot 1`] = `
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "flex-start",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flex": 1,
                                   "flexDirection": "row",
diff --git a/app/components/UI/Card/components/ViewPinBottomSheet/__snapshots__/ViewPinBottomSheet.test.tsx.snap b/app/components/UI/Card/components/ViewPinBottomSheet/__snapshots__/ViewPinBottomSheet.test.tsx.snap
index 6e4be5d814ce..28d2994ce8fa 100644
--- a/app/components/UI/Card/components/ViewPinBottomSheet/__snapshots__/ViewPinBottomSheet.test.tsx.snap
+++ b/app/components/UI/Card/components/ViewPinBottomSheet/__snapshots__/ViewPinBottomSheet.test.tsx.snap
@@ -335,7 +335,7 @@ exports[`ViewPinBottomSheet renders correctly and matches snapshot 1`] = `
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -385,7 +385,7 @@ exports[`ViewPinBottomSheet renders correctly and matches snapshot 1`] = `
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -422,7 +422,7 @@ exports[`ViewPinBottomSheet renders correctly and matches snapshot 1`] = `
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -471,7 +471,7 @@ exports[`ViewPinBottomSheet renders correctly and matches snapshot 1`] = `
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 16,
                                       "fontWeight": 700,
@@ -508,7 +508,7 @@ exports[`ViewPinBottomSheet renders correctly and matches snapshot 1`] = `
                                   }
                                 >
                                   <SvgMock
-                                    color="#121314"
+                                    color="#131416"
                                     fill="currentColor"
                                     height={24}
                                     name="Close"
@@ -575,7 +575,7 @@ exports[`ViewPinBottomSheet renders correctly and matches snapshot 1`] = `
                                   pointerEvents="none"
                                   style={
                                     {
-                                      "backgroundColor": "#686e7d",
+                                      "backgroundColor": "#66676a",
                                       "borderRadius": 4,
                                       "bottom": 0,
                                       "left": 0,
diff --git a/app/components/UI/Card/hooks/useCardDelegation.test.ts b/app/components/UI/Card/hooks/useCardDelegation.test.ts
index c041a00ecd76..dbd83c7bdd25 100644
--- a/app/components/UI/Card/hooks/useCardDelegation.test.ts
+++ b/app/components/UI/Card/hooks/useCardDelegation.test.ts
@@ -9,6 +9,7 @@ import Engine from '../../../../core/Engine';
 import Logger from '../../../../util/Logger';
 import { MetaMetricsEvents } from '../../../../core/Analytics';
 import { useAnalytics } from '../../../hooks/useAnalytics/useAnalytics';
+import { createMockUseAnalyticsHook } from '../../../../util/test/analyticsMock';
 import { toTokenMinimalUnit } from '../../../../util/number';
 import { safeToChecksumAddress } from '../../../../util/address';
 import { ARBITRARY_ALLOWANCE } from '../constants';
@@ -68,9 +69,7 @@ jest.mock('../../../../core/Engine', () => ({
 
 const mockUseSelector = useSelector as jest.MockedFunction<typeof useSelector>;
 const mockUseCardSDK = useCardSDK as jest.MockedFunction<typeof useCardSDK>;
-const mockUseAnalytics = useAnalytics as jest.MockedFunction<
-  typeof useAnalytics
->;
+const mockUseAnalytics = jest.mocked(useAnalytics);
 const mockUseNeedsGasFaucet = useNeedsGasFaucet as jest.MockedFunction<
   typeof useNeedsGasFaucet
 >;
@@ -155,19 +154,12 @@ describe('useCardDelegation', () => {
     });
     mockTrackEvent = jest.fn();
 
-    mockUseAnalytics.mockReturnValue({
-      trackEvent: mockTrackEvent,
-      createEventBuilder: mockCreateEventBuilder,
-      isEnabled: jest.fn().mockReturnValue(true),
-      enable: jest.fn(),
-      addTraitsToUser: jest.fn(),
-      createDataDeletionTask: jest.fn(),
-      checkDataDeleteStatus: jest.fn(),
-      getAnalyticsId: jest.fn(),
-      isDataRecorded: jest.fn().mockReturnValue(true),
-      getDeleteRegulationId: jest.fn(),
-      getDeleteRegulationCreationDate: jest.fn(),
-    } as ReturnType<typeof useAnalytics>);
+    mockUseAnalytics.mockReturnValue(
+      createMockUseAnalyticsHook({
+        trackEvent: mockTrackEvent,
+        createEventBuilder: mockCreateEventBuilder,
+      }),
+    );
 
     // Setup selector mock - returns a function that returns account
     mockUseSelector.mockReturnValue(
diff --git a/app/components/UI/Card/hooks/useCardDetails.test.ts b/app/components/UI/Card/hooks/useCardDetails.test.ts
index 4be67bdb1d76..9874a642d38d 100644
--- a/app/components/UI/Card/hooks/useCardDetails.test.ts
+++ b/app/components/UI/Card/hooks/useCardDetails.test.ts
@@ -1,5 +1,6 @@
 import { renderHook } from '@testing-library/react-hooks';
 import { useSelector } from 'react-redux';
+import { useQuery } from '@tanstack/react-query';
 import { useCardSDK } from '../sdk';
 import useCardDetails from './useCardDetails';
 import {
@@ -10,9 +11,8 @@ import {
   CardType,
 } from '../types';
 import { CardSDK } from '../sdk/CardSDK';
-import { useWrapWithCache } from './useWrapWithCache';
+import { cardQueries } from '../queries';
 
-// Mock dependencies
 jest.mock('react-redux', () => ({
   useSelector: jest.fn(),
 }));
@@ -21,19 +21,21 @@ jest.mock('../sdk', () => ({
   useCardSDK: jest.fn(),
 }));
 
-jest.mock('./useWrapWithCache', () => ({
-  useWrapWithCache: jest.fn(),
+const mockRefetch = jest.fn();
+jest.mock('@tanstack/react-query', () => ({
+  useQuery: jest.fn().mockReturnValue({
+    data: undefined,
+    isLoading: false,
+    error: null,
+    refetch: jest.fn(),
+  }),
 }));
 
 const mockUseSelector = useSelector as jest.MockedFunction<typeof useSelector>;
 const mockUseCardSDK = useCardSDK as jest.MockedFunction<typeof useCardSDK>;
-const mockUseWrapWithCache = useWrapWithCache as jest.MockedFunction<
-  typeof useWrapWithCache
->;
 
 describe('useCardDetails', () => {
   const mockGetCardDetails = jest.fn();
-  const mockFetchData = jest.fn();
 
   const mockSDK = {
     getCardDetails: mockGetCardDetails,
@@ -49,35 +51,30 @@ describe('useCardDetails', () => {
     orderedAt: '2024-01-01T00:00:00Z',
   };
 
-  const mockCacheReturn = {
-    data: null,
-    isLoading: false,
-    error: null,
-    fetchData: mockFetchData,
-  };
-
   beforeEach(() => {
     jest.clearAllMocks();
 
-    // Default mocks - authenticated user with loaded SDK
-    mockUseSelector.mockReturnValue(true); // isAuthenticated
+    mockUseSelector.mockReturnValue(true);
 
     mockUseCardSDK.mockReturnValue({
       ...jest.requireMock('../sdk'),
       sdk: mockSDK,
     });
 
-    mockUseWrapWithCache.mockReturnValue(mockCacheReturn);
+    (useQuery as jest.Mock).mockReturnValue({
+      data: undefined,
+      isLoading: false,
+      error: null,
+      refetch: mockRefetch,
+    });
+
     mockGetCardDetails.mockResolvedValue(mockCardDetailsResponse);
   });
 
   describe('Initial State', () => {
     it('initializes with correct default state', () => {
-      // Given: useWrapWithCache returns default values
-      // When: Hook is rendered
       const { result } = renderHook(() => useCardDetails());
 
-      // Then: Initial state should have null values and not be loading
       expect(result.current.cardDetails).toBeNull();
       expect(result.current.isLoading).toBe(false);
       expect(result.current.error).toBeNull();
@@ -86,104 +83,84 @@ describe('useCardDetails', () => {
   });
 
   describe('Fetching Card Details', () => {
-    it('returns card details data from useWrapWithCache', () => {
-      // Given: useWrapWithCache returns card details data
+    it('returns card details data from useQuery', () => {
       const cardDetailsResult = {
         cardDetails: mockCardDetailsResponse,
         warning: null,
       };
-      mockUseWrapWithCache.mockReturnValue({
+      (useQuery as jest.Mock).mockReturnValue({
         data: cardDetailsResult,
         isLoading: false,
         error: null,
-        fetchData: mockFetchData,
+        refetch: mockRefetch,
       });
 
-      // When: Hook is rendered
       const { result } = renderHook(() => useCardDetails());
 
-      // Then: Returns card details from cache
       expect(result.current.cardDetails).toEqual(mockCardDetailsResponse);
       expect(result.current.warning).toBeNull();
       expect(result.current.isLoading).toBe(false);
       expect(result.current.error).toBeNull();
     });
 
-    it('returns loading state from useWrapWithCache', () => {
-      // Given: useWrapWithCache is loading
-      mockUseWrapWithCache.mockReturnValue({
-        data: null,
+    it('returns loading state from useQuery', () => {
+      (useQuery as jest.Mock).mockReturnValue({
+        data: undefined,
         isLoading: true,
         error: null,
-        fetchData: mockFetchData,
+        refetch: mockRefetch,
       });
 
-      // When: Hook is rendered
       const { result } = renderHook(() => useCardDetails());
 
-      // Then: Shows loading state
       expect(result.current.isLoading).toBe(true);
       expect(result.current.cardDetails).toBeNull();
       expect(result.current.error).toBeNull();
     });
 
-    it('exposes fetchCardDetails function from useWrapWithCache', () => {
-      // Given: Hook is rendered
+    it('exposes fetchCardDetails function', () => {
       const { result } = renderHook(() => useCardDetails());
 
-      // Then: fetchCardDetails is available
-      expect(result.current.fetchCardDetails).toBe(mockFetchData);
+      expect(typeof result.current.fetchCardDetails).toBe('function');
     });
 
-    it('passes correct cache key and options to useWrapWithCache', () => {
-      // When: Hook is rendered
+    it('passes correct query key and options to useQuery', () => {
       renderHook(() => useCardDetails());
 
-      // Then: useWrapWithCache called with correct params
-      expect(mockUseWrapWithCache).toHaveBeenCalledWith(
-        'card-details',
-        expect.any(Function),
-        {
-          cacheDuration: 60000, // AUTHENTICATED_CACHE_DURATION
-          fetchOnMount: false, // Manual fetch control
-        },
+      const queryConfig = (useQuery as jest.Mock).mock.calls[0][0];
+      expect(queryConfig.queryKey).toEqual(
+        cardQueries.dashboard.keys.cardDetails(),
       );
+      expect(queryConfig.staleTime).toBe(0);
+      expect(queryConfig.enabled).toBe(false);
     });
   });
 
   describe('Error Handling', () => {
-    it('returns error state from useWrapWithCache', () => {
-      // Given: useWrapWithCache has error
+    it('returns error state from useQuery', () => {
       const mockError = new Error('Test error');
-      mockUseWrapWithCache.mockReturnValue({
-        data: null,
+      (useQuery as jest.Mock).mockReturnValue({
+        data: undefined,
         isLoading: false,
         error: mockError,
-        fetchData: mockFetchData,
+        refetch: mockRefetch,
       });
 
-      // When: Hook is rendered
       const { result } = renderHook(() => useCardDetails());
 
-      // Then: Returns error object
       expect(result.current.error).toBe(mockError);
       expect(result.current.cardDetails).toBeNull();
     });
 
-    it('handles NO_CARD error in fetch function', async () => {
-      // Given: SDK returns NO_CARD error
+    it('handles NO_CARD error in queryFn', async () => {
       const noCardError = new CardError(CardErrorType.NO_CARD, 'No card found');
       mockGetCardDetails.mockRejectedValue(noCardError);
 
       renderHook(() => useCardDetails());
 
-      // Get the fetch function from useWrapWithCache mock
-      const fetchFunction = mockUseWrapWithCache.mock.calls[0][1];
-
-      // When: Fetch function is called
-      const result = await fetchFunction();
+      const queryConfig = (useQuery as jest.Mock).mock.calls[0][0];
+      const result = await queryConfig.queryFn();
 
-      // Then: Returns result with no_card warning
       expect(result).toEqual({
         cardDetails: null,
         warning: 'no_card',
@@ -191,7 +168,6 @@ describe('useCardDetails', () => {
     });
 
     it('throws error for other CardError types', async () => {
-      // Given: SDK returns a different CardError
       const cardError = new CardError(
         CardErrorType.SERVER_ERROR,
         'Server error occurred',
@@ -200,48 +176,34 @@ describe('useCardDetails', () => {
 
       renderHook(() => useCardDetails());
 
-      // Get the fetch function from useWrapWithCache mock
-      const fetchFunction = mockUseWrapWithCache.mock.calls[0][1];
+      const queryConfig = (useQuery as jest.Mock).mock.calls[0][0];
 
-      // When/Then: Fetch function throws error
-      await expect(fetchFunction()).rejects.toThrow(cardError);
+      await expect(queryConfig.queryFn()).rejects.toThrow(cardError);
     });
 
     it('throws error for generic errors', async () => {
-      // Given: SDK throws generic error
       const genericError = new Error('Network error');
       mockGetCardDetails.mockRejectedValue(genericError);
 
       renderHook(() => useCardDetails());
 
-      // Get the fetch function from useWrapWithCache mock
-      const fetchFunction = mockUseWrapWithCache.mock.calls[0][1];
+      const queryConfig = (useQuery as jest.Mock).mock.calls[0][0];
 
-      // When/Then: Fetch function throws error
-      await expect(fetchFunction()).rejects.toThrow(genericError);
+      await expect(queryConfig.queryFn()).rejects.toThrow(genericError);
     });
   });
 
   describe('Fetch Function Behavior', () => {
-    it('returns null when user is not authenticated', async () => {
-      // Given: User is not authenticated
+    it('disables query when user is not authenticated', () => {
       mockUseSelector.mockReturnValue(false);
 
       renderHook(() => useCardDetails());
 
-      // Get the fetch function from useWrapWithCache mock
-      const fetchFunction = mockUseWrapWithCache.mock.calls[0][1];
-
-      // When: Fetch function is called
-      const result = await fetchFunction();
-
-      // Then: Returns null
-      expect(result).toBeNull();
-      expect(mockGetCardDetails).not.toHaveBeenCalled();
+      const queryConfig = (useQuery as jest.Mock).mock.calls[0][0];
+      expect(queryConfig.enabled).toBe(false);
     });
 
-    it('returns null when SDK is not available', async () => {
-      // Given: No SDK available
+    it('disables query when SDK is not available', () => {
       mockUseCardSDK.mockReturnValue({
         ...jest.requireMock('../sdk'),
         sdk: null,
@@ -249,28 +211,16 @@ describe('useCardDetails', () => {
 
       renderHook(() => useCardDetails());
 
-      // Get the fetch function from useWrapWithCache mock
-      const fetchFunction = mockUseWrapWithCache.mock.calls[0][1];
-
-      // When: Fetch function is called
-      const result = await fetchFunction();
-
-      // Then: Returns null
-      expect(result).toBeNull();
-      expect(mockGetCardDetails).not.toHaveBeenCalled();
+      const queryConfig = (useQuery as jest.Mock).mock.calls[0][0];
+      expect(queryConfig.enabled).toBe(false);
     });
 
     it('fetches card details when authenticated and SDK is ready', async () => {
-      // Given: Authenticated user with ready SDK
       renderHook(() => useCardDetails());
 
-      // Get the fetch function from useWrapWithCache mock
-      const fetchFunction = mockUseWrapWithCache.mock.calls[0][1];
-
-      // When: Fetch function is called
-      const result = await fetchFunction();
+      const queryConfig = (useQuery as jest.Mock).mock.calls[0][0];
+      const result = await queryConfig.queryFn();
 
-      // Then: Fetches and returns card details
       expect(mockGetCardDetails).toHaveBeenCalledTimes(1);
       expect(result).toEqual({
         cardDetails: mockCardDetailsResponse,
@@ -281,7 +231,6 @@ describe('useCardDetails', () => {
 
   describe('Warning States', () => {
     it('sets frozen warning when card status is FROZEN', async () => {
-      // Given: Card with FROZEN status
       const frozenCardResponse = {
         ...mockCardDetailsResponse,
         status: CardStatus.FROZEN,
@@ -290,13 +239,9 @@ describe('useCardDetails', () => {
 
       renderHook(() => useCardDetails());
 
-      // Get the fetch function from useWrapWithCache mock
-      const fetchFunction = mockUseWrapWithCache.mock.calls[0][1];
+      const queryConfig = (useQuery as jest.Mock).mock.calls[0][0];
+      const result = await queryConfig.queryFn();
 
-      // When: Fetch function is called
-      const result = await fetchFunction();
-
-      // Then: Sets warning to Frozen
       expect(result).toEqual({
         cardDetails: frozenCardResponse,
         warning: 'frozen',
@@ -304,7 +249,6 @@ describe('useCardDetails', () => {
     });
 
     it('sets blocked warning when card status is BLOCKED', async () => {
-      // Given: Card with BLOCKED status
       const blockedCardResponse = {
         ...mockCardDetailsResponse,
         status: CardStatus.BLOCKED,
@@ -313,13 +257,9 @@ describe('useCardDetails', () => {
 
       renderHook(() => useCardDetails());
 
-      // Get the fetch function from useWrapWithCache mock
-      const fetchFunction = mockUseWrapWithCache.mock.calls[0][1];
-
-      // When: Fetch function is called
-      const result = await fetchFunction();
+      const queryConfig = (useQuery as jest.Mock).mock.calls[0][0];
+      const result = await queryConfig.queryFn();
 
-      // Then: Sets warning to Blocked
       expect(result).toEqual({
         cardDetails: blockedCardResponse,
         warning: 'blocked',
@@ -327,19 +267,14 @@ describe('useCardDetails', () => {
     });
 
     it('sets no card warning when NO_CARD error is thrown', async () => {
-      // Given: SDK returns NO_CARD error
       const noCardError = new CardError(CardErrorType.NO_CARD, 'No card found');
       mockGetCardDetails.mockRejectedValue(noCardError);
 
       renderHook(() => useCardDetails());
 
-      // Get the fetch function from useWrapWithCache mock
-      const fetchFunction = mockUseWrapWithCache.mock.calls[0][1];
+      const queryConfig = (useQuery as jest.Mock).mock.calls[0][0];
+      const result = await queryConfig.queryFn();
 
-      // When: Fetch function is called
-      const result = await fetchFunction();
-
-      // Then: Sets warning to NoCard and no error
       expect(result).toEqual({
         cardDetails: null,
         warning: 'no_card',
@@ -347,26 +282,20 @@ describe('useCardDetails', () => {
     });
 
     it('does not set warning when card status is ACTIVE', async () => {
-      // Given: Card with ACTIVE status
       mockGetCardDetails.mockResolvedValue(mockCardDetailsResponse);
 
       renderHook(() => useCardDetails());
 
-      // Get the fetch function from useWrapWithCache mock
-      const fetchFunction = mockUseWrapWithCache.mock.calls[0][1];
-
-      // When: Fetch function is called
-      const result = await fetchFunction();
+      const queryConfig = (useQuery as jest.Mock).mock.calls[0][0];
+      const result = await queryConfig.queryFn();
 
-      // Then: No warning is set
       expect(result).toEqual({
         cardDetails: mockCardDetailsResponse,
         warning: null,
       });
     });
 
-    it('returns warning from useWrapWithCache data', () => {
-      // Given: useWrapWithCache returns data with frozen warning
+    it('returns warning from useQuery data', () => {
       const cardDetailsResult = {
         cardDetails: {
           ...mockCardDetailsResponse,
@@ -374,17 +303,15 @@ describe('useCardDetails', () => {
         },
         warning: 'frozen' as const,
       };
-      mockUseWrapWithCache.mockReturnValue({
+      (useQuery as jest.Mock).mockReturnValue({
         data: cardDetailsResult,
         isLoading: false,
         error: null,
-        fetchData: mockFetchData,
+        refetch: mockRefetch,
       });
 
-      // When: Hook is rendered
       const { result } = renderHook(() => useCardDetails());
 
-      // Then: Returns warning from cache
       expect(result.current.warning).toBe('frozen');
       expect(result.current.error).toBeNull();
     });
diff --git a/app/components/UI/Card/hooks/useCardDetails.ts b/app/components/UI/Card/hooks/useCardDetails.ts
index adff5fe90422..10c0df41aa62 100644
--- a/app/components/UI/Card/hooks/useCardDetails.ts
+++ b/app/components/UI/Card/hooks/useCardDetails.ts
@@ -1,4 +1,5 @@
-import { useCallback } from 'react';
+import { useCallback, useRef } from 'react';
+import { useQuery } from '@tanstack/react-query';
 import { useCardSDK } from '../sdk';
 import {
   CardDetailsResponse,
@@ -7,10 +8,7 @@ import {
   CardStatus,
   CardStateWarning,
 } from '../types';
-import { selectIsAuthenticatedCard } from '../../../../core/redux/slices/card';
-import { useSelector } from 'react-redux';
-import { useWrapWithCache } from './useWrapWithCache';
-import { AUTHENTICATED_CACHE_DURATION } from '../constants';
+import { cardQueries } from '../queries';
 
 interface CardDetailsResult {
   cardDetails: CardDetailsResponse | null;
@@ -18,17 +16,22 @@ interface CardDetailsResult {
 }
 
 const useCardDetails = () => {
-  const isAuthenticated = useSelector(selectIsAuthenticatedCard);
   const { sdk } = useCardSDK();
+  const sdkRef = useRef(sdk);
+  sdkRef.current = sdk;
 
-  const fetchCardDetailsInternal =
-    useCallback(async (): Promise<CardDetailsResult | null> => {
-      if (!sdk || !isAuthenticated) {
-        return null;
-      }
-
+  const {
+    data: cardDetailsData,
+    isLoading,
+    error,
+    refetch,
+  } = useQuery<CardDetailsResult | null>({
+    queryKey: cardQueries.dashboard.keys.cardDetails(),
+    queryFn: async (): Promise<CardDetailsResult | null> => {
       try {
-        const cardDetailsResponse = await sdk.getCardDetails();
+        const currentSdk = sdkRef.current;
+        if (!currentSdk) throw new Error('SDK not initialized');
+        const cardDetailsResponse = await currentSdk.getCardDetails();
         let warning: CardStateWarning | null = null;
 
         if (cardDetailsResponse.status === CardStatus.FROZEN) {
@@ -53,30 +56,21 @@ const useCardDetails = () => {
 
         throw err;
       }
-    }, [sdk, isAuthenticated]);
-
-  // Use cache wrapper for card details
-  const cacheResult = useWrapWithCache(
-    'card-details',
-    fetchCardDetailsInternal,
-    {
-      cacheDuration: AUTHENTICATED_CACHE_DURATION, // 30 seconds cache
-      fetchOnMount: false,
     },
-  );
+    enabled: false,
+    staleTime: 0,
+  });
 
-  const {
-    data: cardDetailsData,
-    isLoading,
-    error,
-    fetchData: fetchCardDetails,
-  } = cacheResult;
+  const fetchCardDetails = useCallback(async () => {
+    const result = await refetch();
+    return result.data ?? null;
+  }, [refetch]);
 
   return {
     cardDetails: cardDetailsData?.cardDetails ?? null,
     warning: cardDetailsData?.warning ?? null,
     isLoading,
-    error,
+    error: error as Error | null,
     fetchCardDetails,
   };
 };
diff --git a/app/components/UI/Card/hooks/useCardDetailsToken.test.ts b/app/components/UI/Card/hooks/useCardDetailsToken.test.ts
index ac6aae366406..77275933ca84 100644
--- a/app/components/UI/Card/hooks/useCardDetailsToken.test.ts
+++ b/app/components/UI/Card/hooks/useCardDetailsToken.test.ts
@@ -1,7 +1,7 @@
 import { renderHook, act } from '@testing-library/react-hooks';
 import { useSelector } from 'react-redux';
 import { useCardSDK } from '../sdk';
-import useCardDetailsToken from './useCardDetailsToken';
+import useCardDetailsToken, { CARD_DETAILS_CSS } from './useCardDetailsToken';
 import { CardType, CardDetailsTokenResponse } from '../types';
 import { CardSDK } from '../sdk/CardSDK';
 
@@ -116,15 +116,13 @@ describe('useCardDetailsToken', () => {
         await result.current.fetchCardDetailsToken();
       });
 
-      // Then: Fetches with VIRTUAL card CSS config
-      expect(mockGenerateCardDetailsToken).toHaveBeenCalledWith({
-        customCss: {
-          cardBackgroundColor: '#FF5C16',
-          cardTextColor: '#FFFFFF',
-          panBackgroundColor: '#EFEFEF',
-          panTextColor: '#000000',
-        },
-      });
+      // Then: Fetches with card CSS object and sets the image URL
+      const firstCallArgs = mockGenerateCardDetailsToken.mock.calls[0][0];
+      expect(firstCallArgs).toEqual(
+        expect.objectContaining({
+          customCss: CARD_DETAILS_CSS[CardType.VIRTUAL],
+        }),
+      );
       expect(result.current.imageUrl).toBe(mockTokenResponse.imageUrl);
     });
 
@@ -137,15 +135,19 @@ describe('useCardDetailsToken', () => {
         await result.current.fetchCardDetailsToken(CardType.VIRTUAL);
       });
 
-      // Then: Fetches with VIRTUAL card CSS config (orange)
-      expect(mockGenerateCardDetailsToken).toHaveBeenCalledWith({
-        customCss: {
-          cardBackgroundColor: '#FF5C16',
-          cardTextColor: '#FFFFFF',
-          panBackgroundColor: '#EFEFEF',
-          panTextColor: '#000000',
-        },
+      // Then: Explicit VIRTUAL has the same CSS config as default card type
+      const virtualCss =
+        mockGenerateCardDetailsToken.mock.calls[0][0].customCss;
+
+      mockGenerateCardDetailsToken.mockClear();
+
+      await act(async () => {
+        await result.current.fetchCardDetailsToken();
       });
+
+      const defaultCss =
+        mockGenerateCardDetailsToken.mock.calls[0][0].customCss;
+      expect(virtualCss).toEqual(defaultCss);
     });
 
     it('fetches card details token with METAL card type', async () => {
@@ -157,15 +159,18 @@ describe('useCardDetailsToken', () => {
         await result.current.fetchCardDetailsToken(CardType.METAL);
       });
 
-      // Then: Fetches with METAL card CSS config (purple)
-      expect(mockGenerateCardDetailsToken).toHaveBeenCalledWith({
-        customCss: {
-          cardBackgroundColor: '#3D065F',
-          cardTextColor: '#FFFFFF',
-          panBackgroundColor: '#EFEFEF',
-          panTextColor: '#000000',
-        },
+      // Then: METAL has a different CSS config from VIRTUAL
+      const metalCss = mockGenerateCardDetailsToken.mock.calls[0][0].customCss;
+
+      mockGenerateCardDetailsToken.mockClear();
+
+      await act(async () => {
+        await result.current.fetchCardDetailsToken(CardType.VIRTUAL);
       });
+
+      const virtualCss =
+        mockGenerateCardDetailsToken.mock.calls[0][0].customCss;
+      expect(metalCss).not.toEqual(virtualCss);
     });
 
     it('fetches card details token with PHYSICAL card type', async () => {
@@ -177,15 +182,18 @@ describe('useCardDetailsToken', () => {
         await result.current.fetchCardDetailsToken(CardType.PHYSICAL);
       });
 
-      // Then: Fetches with PHYSICAL card CSS config (purple)
-      expect(mockGenerateCardDetailsToken).toHaveBeenCalledWith({
-        customCss: {
-          cardBackgroundColor: '#3D065F',
-          cardTextColor: '#FFFFFF',
-          panBackgroundColor: '#EFEFEF',
-          panTextColor: '#000000',
-        },
+      // Then: PHYSICAL shares the same CSS config as METAL
+      const physicalCss =
+        mockGenerateCardDetailsToken.mock.calls[0][0].customCss;
+
+      mockGenerateCardDetailsToken.mockClear();
+
+      await act(async () => {
+        await result.current.fetchCardDetailsToken(CardType.METAL);
       });
+
+      const metalCss = mockGenerateCardDetailsToken.mock.calls[0][0].customCss;
+      expect(physicalCss).toEqual(metalCss);
     });
 
     it('sets loading state while fetching', async () => {
diff --git a/app/components/UI/Card/hooks/useCardDetailsToken.ts b/app/components/UI/Card/hooks/useCardDetailsToken.ts
index 75a108ed1f37..9a0e7a4b5ef9 100644
--- a/app/components/UI/Card/hooks/useCardDetailsToken.ts
+++ b/app/components/UI/Card/hooks/useCardDetailsToken.ts
@@ -6,7 +6,7 @@ import { useSelector } from 'react-redux';
 
 // Hex colors required by the external card details API
 /* eslint-disable @metamask/design-tokens/color-no-hex */
-const CARD_DETAILS_CSS = {
+export const CARD_DETAILS_CSS = {
   [CardType.VIRTUAL]: {
     cardBackgroundColor: '#FF5C16',
     cardTextColor: '#FFFFFF',
diff --git a/app/components/UI/Card/hooks/useCardFreeze.ts b/app/components/UI/Card/hooks/useCardFreeze.ts
index 85cbe6dd5e5c..7d38dc91ed90 100644
--- a/app/components/UI/Card/hooks/useCardFreeze.ts
+++ b/app/components/UI/Card/hooks/useCardFreeze.ts
@@ -32,8 +32,6 @@ const useCardFreeze = ({
   optimisticStatusRef.current = optimisticStatus;
 
   // Clear optimistic override once the real cardStatus prop catches up.
-  // This avoids reverting the switch when fetchCardDetails silently fails
-  // (useWrapWithCache swallows errors and returns null).
   useEffect(() => {
     if (optimisticStatus !== null && cardStatus === optimisticStatus) {
       setOptimisticStatus(null);
diff --git a/app/components/UI/Card/hooks/useCardPinToken.test.ts b/app/components/UI/Card/hooks/useCardPinToken.test.ts
index 6558b6613107..2b5e153f7d4b 100644
--- a/app/components/UI/Card/hooks/useCardPinToken.test.ts
+++ b/app/components/UI/Card/hooks/useCardPinToken.test.ts
@@ -83,6 +83,7 @@ describe('useCardPinToken', () => {
       });
 
       expect(mockMutateAsync).toHaveBeenCalledWith({
+        // eslint-disable-next-line @metamask/design-tokens/color-no-hex
         customCss: { backgroundColor: '#FFF', textColor: '#000' },
       });
     });
diff --git a/app/components/UI/Card/hooks/useCardPinToken.ts b/app/components/UI/Card/hooks/useCardPinToken.ts
index f1117a4ebf71..9d86d8542b2b 100644
--- a/app/components/UI/Card/hooks/useCardPinToken.ts
+++ b/app/components/UI/Card/hooks/useCardPinToken.ts
@@ -6,7 +6,7 @@ import { useTheme } from '../../../../util/theme';
 import type { CardPinTokenResponse } from '../types';
 
 /* eslint-disable @metamask/design-tokens/color-no-hex */
-const PIN_CSS = {
+export const PIN_CSS = {
   dark: { backgroundColor: '#121314', textColor: '#FFF' },
   light: { backgroundColor: '#FFF', textColor: '#000' },
 } as const;
diff --git a/app/components/UI/Card/hooks/useGetCardExternalWalletDetails.test.ts b/app/components/UI/Card/hooks/useGetCardExternalWalletDetails.test.ts
index 6fa43fe72126..ed0e04ab554e 100644
--- a/app/components/UI/Card/hooks/useGetCardExternalWalletDetails.test.ts
+++ b/app/components/UI/Card/hooks/useGetCardExternalWalletDetails.test.ts
@@ -1,8 +1,7 @@
 import { renderHook } from '@testing-library/react-hooks';
-import { useSelector } from 'react-redux';
+import { useQuery } from '@tanstack/react-query';
 import useGetCardExternalWalletDetails from './useGetCardExternalWalletDetails';
 import { useCardSDK } from '../sdk';
-import { useWrapWithCache } from './useWrapWithCache';
 import Logger from '../../../../util/Logger';
 import {
   CardExternalWalletDetail,
@@ -10,34 +9,35 @@ import {
   DelegationSettingsNetwork,
 } from '../types';
 import { CaipChainId } from '@metamask/utils';
-
-// Mock dependencies
-jest.mock('react-redux', () => ({
-  useSelector: jest.fn(),
-}));
+import { cardQueries } from '../queries';
 
 jest.mock('../sdk', () => ({
   useCardSDK: jest.fn(),
 }));
 
-jest.mock('./useWrapWithCache', () => ({
-  useWrapWithCache: jest.fn(),
+const mockRefetch = jest.fn();
+const mockGetQueryData = jest.fn();
+jest.mock('@tanstack/react-query', () => ({
+  useQuery: jest.fn().mockReturnValue({
+    data: undefined,
+    isLoading: false,
+    error: null,
+    refetch: jest.fn(),
+  }),
+  useQueryClient: jest.fn().mockReturnValue({
+    getQueryData: (...args: unknown[]) => mockGetQueryData(...args),
+  }),
 }));
 
 jest.mock('../../../../util/Logger', () => ({
   error: jest.fn(),
 }));
 
-const mockUseSelector = useSelector as jest.MockedFunction<typeof useSelector>;
 const mockUseCardSDK = useCardSDK as jest.MockedFunction<typeof useCardSDK>;
-const mockUseWrapWithCache = useWrapWithCache as jest.MockedFunction<
-  typeof useWrapWithCache
->;
 const mockLogger = Logger as jest.Mocked<typeof Logger>;
 
 describe('useGetCardExternalWalletDetails', () => {
   const mockGetCardExternalWalletDetails = jest.fn();
-  const mockFetchData = jest.fn();
 
   const mockSDK = {
     getCardExternalWalletDetails: mockGetCardExternalWalletDetails,
@@ -95,39 +95,33 @@ describe('useGetCardExternalWalletDetails', () => {
     network: 'linea',
   };
 
-  const mockCacheReturn = {
-    data: null,
-    isLoading: false,
-    error: null,
-    fetchData: mockFetchData,
-  };
-
   beforeEach(() => {
     jest.clearAllMocks();
-    jest.useFakeTimers();
-
-    mockUseSelector.mockReturnValue(true); // isAuthenticated
 
     mockUseCardSDK.mockReturnValue({
       ...jest.requireMock('../sdk'),
       sdk: mockSDK,
     });
 
-    mockUseWrapWithCache.mockImplementation((_key, fetchFn, _options) => {
-      // Store the fetch function for later use
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      (mockCacheReturn as any).actualFetchFn = fetchFn;
-      return mockCacheReturn;
+    (useQuery as jest.Mock).mockReturnValue({
+      data: undefined,
+      isLoading: false,
+      error: null,
+      refetch: mockRefetch,
+    });
+
+    const { useQueryClient } = jest.requireMock('@tanstack/react-query');
+    useQueryClient.mockReturnValue({
+      getQueryData: mockGetQueryData,
     });
   });
 
   afterEach(() => {
     jest.resetAllMocks();
-    jest.useRealTimers();
   });
 
   describe('Initial State', () => {
-    it('returns cache data from useWrapWithCache', () => {
+    it('returns default state from useQuery', () => {
       const { result } = renderHook(() =>
         useGetCardExternalWalletDetails(mockDelegationSettings),
       );
@@ -135,60 +129,79 @@ describe('useGetCardExternalWalletDetails', () => {
       expect(result.current.data).toBeNull();
       expect(result.current.isLoading).toBe(false);
       expect(result.current.error).toBeNull();
-      expect(result.current.fetchData).toBe(mockFetchData);
+      expect(typeof result.current.fetchData).toBe('function');
     });
 
-    it('passes correct cache configuration to useWrapWithCache', () => {
+    it('passes correct query configuration to useQuery', () => {
       renderHook(() => useGetCardExternalWalletDetails(mockDelegationSettings));
 
-      expect(mockUseWrapWithCache).toHaveBeenCalledWith(
-        'card-external-wallet-details',
-        expect.any(Function),
-        {
-          cacheDuration: 60000,
-          fetchOnMount: false,
-        },
+      const queryConfig = (useQuery as jest.Mock).mock.calls[0][0];
+      expect(queryConfig.queryKey).toEqual(
+        cardQueries.dashboard.keys.externalWalletDetails(),
       );
+      expect(queryConfig.staleTime).toBe(60000);
+      expect(queryConfig.enabled).toBe(false);
     });
   });
 
-  describe('Prerequisites Check', () => {
-    it('returns null when SDK is not available', async () => {
+  describe('SDK ref (stale closure)', () => {
+    it('uses current SDK from ref when queryFn runs so refetch works after SDK becomes available', async () => {
       mockUseCardSDK.mockReturnValue({
         ...jest.requireMock('../sdk'),
         sdk: null,
       });
 
-      renderHook(() => useGetCardExternalWalletDetails(mockDelegationSettings));
+      const { rerender } = renderHook(() =>
+        useGetCardExternalWalletDetails(mockDelegationSettings),
+      );
 
-      // Get the fetch function from the mock
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      const fetchFn = (mockCacheReturn as any).actualFetchFn;
-      const result = await fetchFn();
+      mockUseCardSDK.mockReturnValue({
+        ...jest.requireMock('../sdk'),
+        sdk: mockSDK,
+      });
+      mockGetCardExternalWalletDetails.mockResolvedValue([mockWalletDetail1]);
 
-      expect(result).toBeNull();
-      expect(mockGetCardExternalWalletDetails).not.toHaveBeenCalled();
+      rerender();
+
+      const queryConfig = (useQuery as jest.Mock).mock.calls[1][0];
+      const result = await queryConfig.queryFn();
+
+      expect(mockGetCardExternalWalletDetails).toHaveBeenCalledWith(
+        mockDelegationSettings.networks,
+      );
+      expect(result?.walletDetails).toEqual([mockWalletDetail1]);
     });
 
-    it('returns null when user is not authenticated', async () => {
-      mockUseSelector.mockReturnValue(false);
+    it('throws when queryFn runs and SDK ref is still null', async () => {
+      mockUseCardSDK.mockReturnValue({
+        ...jest.requireMock('../sdk'),
+        sdk: null,
+      });
 
       renderHook(() => useGetCardExternalWalletDetails(mockDelegationSettings));
 
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      const fetchFn = (mockCacheReturn as any).actualFetchFn;
-      const result = await fetchFn();
+      const queryConfig = (useQuery as jest.Mock).mock.calls[0][0];
 
-      expect(result).toBeNull();
+      await expect(queryConfig.queryFn()).rejects.toThrow(
+        'SDK not initialized',
+      );
       expect(mockGetCardExternalWalletDetails).not.toHaveBeenCalled();
     });
+  });
 
-    it('returns null when delegation settings are not available', async () => {
+  describe('Prerequisites Check', () => {
+    it('query is always disabled (fetching is done via fetchData)', () => {
+      renderHook(() => useGetCardExternalWalletDetails(mockDelegationSettings));
+
+      const queryConfig = (useQuery as jest.Mock).mock.calls[0][0];
+      expect(queryConfig.enabled).toBe(false);
+    });
+
+    it('returns null from queryFn when delegation settings ref is null', async () => {
       renderHook(() => useGetCardExternalWalletDetails(null));
 
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      const fetchFn = (mockCacheReturn as any).actualFetchFn;
-      const result = await fetchFn();
+      const queryConfig = (useQuery as jest.Mock).mock.calls[0][0];
+      const result = await queryConfig.queryFn();
 
       expect(result).toBeNull();
       expect(mockGetCardExternalWalletDetails).not.toHaveBeenCalled();
@@ -201,9 +214,8 @@ describe('useGetCardExternalWalletDetails', () => {
 
       renderHook(() => useGetCardExternalWalletDetails(mockDelegationSettings));
 
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      const fetchFn = (mockCacheReturn as any).actualFetchFn;
-      await fetchFn();
+      const queryConfig = (useQuery as jest.Mock).mock.calls[0][0];
+      await queryConfig.queryFn();
 
       expect(mockGetCardExternalWalletDetails).toHaveBeenCalledWith(
         mockDelegationSettings.networks,
@@ -215,14 +227,13 @@ describe('useGetCardExternalWalletDetails', () => {
 
       renderHook(() => useGetCardExternalWalletDetails(mockDelegationSettings));
 
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      const fetchFn = (mockCacheReturn as any).actualFetchFn;
-      const result = await fetchFn();
+      const queryConfig = (useQuery as jest.Mock).mock.calls[0][0];
+      const result = await queryConfig.queryFn();
 
       expect(result).toEqual({
         walletDetails: [],
         mappedWalletDetails: [],
-        priorityWalletDetail: null,
+        priorityWalletDetail: undefined,
       });
     });
 
@@ -231,9 +242,8 @@ describe('useGetCardExternalWalletDetails', () => {
 
       renderHook(() => useGetCardExternalWalletDetails(mockDelegationSettings));
 
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      const fetchFn = (mockCacheReturn as any).actualFetchFn;
-      const result = await fetchFn();
+      const queryConfig = (useQuery as jest.Mock).mock.calls[0][0];
+      const result = await queryConfig.queryFn();
 
       expect(result?.walletDetails).toEqual([mockWalletDetail1]);
       expect(result?.mappedWalletDetails).toHaveLength(1);
@@ -250,9 +260,8 @@ describe('useGetCardExternalWalletDetails', () => {
 
       renderHook(() => useGetCardExternalWalletDetails(mockDelegationSettings));
 
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      const fetchFn = (mockCacheReturn as any).actualFetchFn;
-      const result = await fetchFn();
+      const queryConfig = (useQuery as jest.Mock).mock.calls[0][0];
+      const result = await queryConfig.queryFn();
 
       expect(result?.priorityWalletDetail?.address).toBe('0xtoken1');
     });
@@ -274,9 +283,8 @@ describe('useGetCardExternalWalletDetails', () => {
 
       renderHook(() => useGetCardExternalWalletDetails(mockDelegationSettings));
 
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      const fetchFn = (mockCacheReturn as any).actualFetchFn;
-      const result = await fetchFn();
+      const queryConfig = (useQuery as jest.Mock).mock.calls[0][0];
+      const result = await queryConfig.queryFn();
 
       expect(result?.priorityWalletDetail?.address).toBe('0xtoken2');
     });
@@ -289,9 +297,8 @@ describe('useGetCardExternalWalletDetails', () => {
 
       renderHook(() => useGetCardExternalWalletDetails(mockDelegationSettings));
 
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      const fetchFn = (mockCacheReturn as any).actualFetchFn;
-      const result = await fetchFn();
+      const queryConfig = (useQuery as jest.Mock).mock.calls[0][0];
+      const result = await queryConfig.queryFn();
 
       expect(result?.priorityWalletDetail?.address).toBe('0xtoken1');
     });
@@ -304,9 +311,8 @@ describe('useGetCardExternalWalletDetails', () => {
 
       renderHook(() => useGetCardExternalWalletDetails(mockDelegationSettings));
 
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      const fetchFn = (mockCacheReturn as any).actualFetchFn;
-      const result = await fetchFn();
+      const queryConfig = (useQuery as jest.Mock).mock.calls[0][0];
+      const result = await queryConfig.queryFn();
 
       expect(result?.priorityWalletDetail?.address).toBe('0xtoken2');
     });
@@ -319,9 +325,8 @@ describe('useGetCardExternalWalletDetails', () => {
 
       renderHook(() => useGetCardExternalWalletDetails(mockDelegationSettings));
 
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      const fetchFn = (mockCacheReturn as any).actualFetchFn;
-      const result = await fetchFn();
+      const queryConfig = (useQuery as jest.Mock).mock.calls[0][0];
+      const result = await queryConfig.queryFn();
 
       expect(result?.priorityWalletDetail?.address).toBe('0xtoken2');
     });
@@ -334,10 +339,9 @@ describe('useGetCardExternalWalletDetails', () => {
 
       renderHook(() => useGetCardExternalWalletDetails(mockDelegationSettings));
 
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      const fetchFn = (mockCacheReturn as any).actualFetchFn;
+      const queryConfig = (useQuery as jest.Mock).mock.calls[0][0];
 
-      await expect(fetchFn()).rejects.toThrow('API error');
+      await expect(queryConfig.queryFn()).rejects.toThrow('API error');
       expect(mockLogger.error).toHaveBeenCalledWith(
         apiError,
         'useGetCardExternalWalletDetails: Failed to fetch external wallet details',
@@ -349,10 +353,9 @@ describe('useGetCardExternalWalletDetails', () => {
 
       renderHook(() => useGetCardExternalWalletDetails(mockDelegationSettings));
 
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      const fetchFn = (mockCacheReturn as any).actualFetchFn;
+      const queryConfig = (useQuery as jest.Mock).mock.calls[0][0];
 
-      await expect(fetchFn()).rejects.toThrow('string error');
+      await expect(queryConfig.queryFn()).rejects.toThrow('string error');
       expect(mockLogger.error).toHaveBeenCalledWith(
         expect.objectContaining({ message: 'string error' }),
         'useGetCardExternalWalletDetails: Failed to fetch external wallet details',
@@ -362,28 +365,12 @@ describe('useGetCardExternalWalletDetails', () => {
 
   describe('Auto-fetch Behavior', () => {
     it('does not auto-fetch when all prerequisites are ready and no data exists', () => {
-      mockUseWrapWithCache.mockReturnValue({
-        data: null,
-        isLoading: false,
-        error: null,
-        fetchData: mockFetchData,
-      });
-
       renderHook(() => useGetCardExternalWalletDetails(mockDelegationSettings));
 
-      // Auto-fetch is intentionally disabled (fetchOnMount: false)
-      expect(mockFetchData).not.toHaveBeenCalled();
+      expect(mockGetCardExternalWalletDetails).not.toHaveBeenCalled();
     });
 
     it('does not auto-fetch when prerequisites change from unavailable to available', () => {
-      mockUseWrapWithCache.mockReturnValue({
-        data: null,
-        isLoading: false,
-        error: null,
-        fetchData: mockFetchData,
-      });
-
-      // Start with SDK unavailable
       mockUseCardSDK.mockReturnValue({
         ...jest.requireMock('../sdk'),
         sdk: null,
@@ -393,7 +380,6 @@ describe('useGetCardExternalWalletDetails', () => {
         useGetCardExternalWalletDetails(mockDelegationSettings),
       );
 
-      // SDK becomes available
       mockUseCardSDK.mockReturnValue({
         ...jest.requireMock('../sdk'),
         sdk: mockSDK,
@@ -401,43 +387,24 @@ describe('useGetCardExternalWalletDetails', () => {
 
       rerender();
 
-      // Auto-fetch is intentionally disabled (fetchOnMount: false)
-      expect(mockFetchData).not.toHaveBeenCalled();
+      expect(mockGetCardExternalWalletDetails).not.toHaveBeenCalled();
     });
   });
 
   describe('Cache Integration', () => {
-    it('uses 60 second cache duration', () => {
+    it('uses 60 second staleTime', () => {
       renderHook(() => useGetCardExternalWalletDetails(mockDelegationSettings));
 
-      expect(mockUseWrapWithCache).toHaveBeenCalledWith(
-        expect.any(String),
-        expect.any(Function),
-        expect.objectContaining({
-          cacheDuration: 60000,
-        }),
-      );
-    });
-
-    it('disables fetch on mount', () => {
-      renderHook(() => useGetCardExternalWalletDetails(mockDelegationSettings));
-
-      expect(mockUseWrapWithCache).toHaveBeenCalledWith(
-        expect.any(String),
-        expect.any(Function),
-        expect.objectContaining({
-          fetchOnMount: false,
-        }),
-      );
+      const queryConfig = (useQuery as jest.Mock).mock.calls[0][0];
+      expect(queryConfig.staleTime).toBe(60000);
     });
 
-    it('uses correct cache key', () => {
+    it('uses correct query key', () => {
       renderHook(() => useGetCardExternalWalletDetails(mockDelegationSettings));
 
-      expect(mockUseWrapWithCache).toHaveBeenCalledWith(
-        'card-external-wallet-details',
-        expect.any(Function),
-        expect.any(Object),
+      const queryConfig = (useQuery as jest.Mock).mock.calls[0][0];
+      expect(queryConfig.queryKey).toEqual(
+        cardQueries.dashboard.keys.externalWalletDetails(),
       );
     });
   });
diff --git a/app/components/UI/Card/hooks/useGetCardExternalWalletDetails.ts b/app/components/UI/Card/hooks/useGetCardExternalWalletDetails.ts
index ece170bd05aa..7b99725b1cbd 100644
--- a/app/components/UI/Card/hooks/useGetCardExternalWalletDetails.ts
+++ b/app/components/UI/Card/hooks/useGetCardExternalWalletDetails.ts
@@ -1,7 +1,6 @@
 import { useCallback, useRef } from 'react';
-import { useSelector } from 'react-redux';
+import { useQuery, useQueryClient } from '@tanstack/react-query';
 import { useCardSDK } from '../sdk';
-import { selectIsAuthenticatedCard } from '../../../../core/redux/slices/card';
 import {
   CardExternalWalletDetail,
   CardTokenAllowance,
@@ -11,13 +10,8 @@ import {
 import Logger from '../../../../util/Logger';
 import { isZero } from '../../../../util/lodash';
 import { ARBITRARY_ALLOWANCE } from '../constants';
-import { useWrapWithCache } from './useWrapWithCache';
+import { cardQueries } from '../queries';
 
-/**
- * Determines the allowance state based on the allowance value
- * @param allowanceFloat - Parsed allowance value
- * @returns AllowanceState enum value
- */
 const determineAllowanceState = (allowanceFloat: number): AllowanceState => {
   if (allowanceFloat === 0) {
     return AllowanceState.NotEnabled;
@@ -28,11 +22,6 @@ const determineAllowanceState = (allowanceFloat: number): AllowanceState => {
   return AllowanceState.Enabled;
 };
 
-/**
- * Maps a CardExternalWalletDetail to CardTokenAllowance format
- * @param cardExternalWalletDetail - External wallet detail from API
- * @returns Mapped CardTokenAllowance or null if invalid
- */
 const mapCardExternalWalletDetailToCardTokenAllowance = (
   cardExternalWalletsDetail: (CardExternalWalletDetail | undefined)[],
 ): (CardTokenAllowance | null)[] =>
@@ -60,120 +49,116 @@ const mapCardExternalWalletDetailToCardTokenAllowance = (
       allowance: allowanceFloat.toString(),
       availableBalance: availableBalance.toString(),
       delegationContract: cardExternalWalletDetail.delegationContractAddress,
-      stagingTokenAddress: cardExternalWalletDetail.stagingTokenAddress ?? null, // Pass through staging token address
-      priority: cardExternalWalletDetail.priority, // Preserve priority from API
+      stagingTokenAddress: cardExternalWalletDetail.stagingTokenAddress ?? null,
+      priority: cardExternalWalletDetail.priority,
       isStaked: false,
     } as CardTokenAllowance;
   });
 
 /**
- * Hook to fetch external wallet details from the Card API (authenticated mode)
- *
- * This hook fetches all external wallet details for the authenticated user,
- * including balances, allowances, and token information.
+ * Hook to fetch external wallet details from the Card API (authenticated mode).
  *
  * @param delegationSettings - Delegation settings containing network configurations
- * @returns Object containing:
- * - walletDetails: Array of CardExternalWalletDetail objects
- * - mappedWalletDetails: Array of CardTokenAllowance objects (mapped format)
- * - priorityWalletDetail: The wallet detail with highest priority (first with balance)
- * - isLoading: Loading state
- * - error: Error object if any
- * - fetch: Function to manually trigger fetch
+ * @returns Object containing wallet details data, loading state, error, and fetch function
  */
 const useGetCardExternalWalletDetails = (
   delegationSettings: DelegationSettingsResponse | null,
 ) => {
   const { sdk } = useCardSDK();
-  const isAuthenticated = useSelector(selectIsAuthenticatedCard);
-
-  // Use a ref to always access the latest delegation settings value
-  // This avoids stale closure issues when fetchCardExternalWalletDetails is called
-  // after fetchDelegationSettings completes but before the next render
-  const delegationSettingsRef = useRef(delegationSettings);
-  delegationSettingsRef.current = delegationSettings;
-
-  const fetchCardExternalWalletDetails = useCallback(async () => {
-    // Read from ref to get the latest value (avoids stale closure)
-    const currentDelegationSettings = delegationSettingsRef.current;
-    if (!sdk || !isAuthenticated || !currentDelegationSettings) {
-      return null;
-    }
-
-    try {
-      const cardExternalWalletDetails = await sdk.getCardExternalWalletDetails(
-        currentDelegationSettings.networks,
-      );
-
-      if (!cardExternalWalletDetails?.length) {
-        return {
-          walletDetails: [],
-          mappedWalletDetails: [],
-          priorityWalletDetail: null,
-        };
+  const queryClient = useQueryClient();
+  const sdkRef = useRef(sdk);
+  sdkRef.current = sdk;
+
+  const { data, isLoading, error, refetch } = useQuery({
+    queryKey: cardQueries.dashboard.keys.externalWalletDetails(),
+    queryFn: async () => {
+      const currentDelegationSettings =
+        delegationSettings ??
+        queryClient.getQueryData<DelegationSettingsResponse | null>(
+          cardQueries.dashboard.keys.delegationSettings(),
+        );
+      if (!currentDelegationSettings) {
+        return null;
       }
 
-      let cardExternalWalletDetailsWithPriority = cardExternalWalletDetails[0];
-
-      // Find the first wallet detail with a non-zero balance if there are multiple
-      // If there's only one WalletExternalDetail, use the first one
-      if (cardExternalWalletDetails.length > 1) {
-        const detailWithBalance = cardExternalWalletDetails.find((detail) => {
-          if (
-            isNaN(parseFloat(detail.balance)) ||
-            isZero(detail.balance) ||
-            detail.balance === '0.0'
-          ) {
-            return false;
-          }
-          return true;
-        });
+      const currentSdk = sdkRef.current;
+      if (!currentSdk) throw new Error('SDK not initialized');
+
+      try {
+        const cardExternalWalletDetails =
+          await currentSdk.getCardExternalWalletDetails(
+            currentDelegationSettings.networks,
+          );
+
+        if (!cardExternalWalletDetails?.length) {
+          return {
+            walletDetails: [] as CardExternalWalletDetail[],
+            mappedWalletDetails: [] as CardTokenAllowance[],
+            priorityWalletDetail: undefined as CardTokenAllowance | undefined,
+          };
+        }
 
-        if (detailWithBalance) {
-          cardExternalWalletDetailsWithPriority = detailWithBalance;
+        let cardExternalWalletDetailsWithPriority =
+          cardExternalWalletDetails[0];
+
+        if (cardExternalWalletDetails.length > 1) {
+          const detailWithBalance = cardExternalWalletDetails.find((detail) => {
+            if (
+              isNaN(parseFloat(detail.balance)) ||
+              isZero(detail.balance) ||
+              detail.balance === '0.0'
+            ) {
+              return false;
+            }
+            return true;
+          });
+
+          if (detailWithBalance) {
+            cardExternalWalletDetailsWithPriority = detailWithBalance;
+          }
         }
-      }
 
-      const mappedWalletDetails =
-        mapCardExternalWalletDetailToCardTokenAllowance(
-          cardExternalWalletDetails,
-        ).filter(Boolean) as CardTokenAllowance[];
-
-      // Get priority wallet detail
-      const priorityWalletDetail = mappedWalletDetails.find(
-        (mpw) =>
-          mpw.address?.toLowerCase() ===
-          cardExternalWalletDetailsWithPriority.tokenDetails.address?.toLowerCase(),
-      );
-
-      return {
-        walletDetails: cardExternalWalletDetails,
-        mappedWalletDetails,
-        priorityWalletDetail,
-      };
-    } catch (err) {
-      const normalizedError =
-        err instanceof Error ? err : new Error(String(err));
-      Logger.error(
-        normalizedError,
-        'useGetCardExternalWalletDetails: Failed to fetch external wallet details',
-      );
-      throw normalizedError;
-    }
-    // Note: delegationSettings is accessed via ref, not closure, so it's not in dependencies
-  }, [sdk, isAuthenticated]);
-
-  // Note: Auto-fetch is disabled to prevent duplicate API calls.
-  // CardHome orchestrates all data fetching via fetchAllData() to ensure
-  // a single source of truth for when data is loaded.
-  return useWrapWithCache(
-    'card-external-wallet-details',
-    fetchCardExternalWalletDetails,
-    {
-      cacheDuration: 60 * 1000, // 60 seconds cache (matches authenticated mode in useGetPriorityCardToken)
-      fetchOnMount: false,
+        const mappedWalletDetails =
+          mapCardExternalWalletDetailToCardTokenAllowance(
+            cardExternalWalletDetails,
+          ).filter(Boolean) as CardTokenAllowance[];
+
+        const priorityWalletDetail = mappedWalletDetails.find(
+          (mpw) =>
+            mpw.address?.toLowerCase() ===
+            cardExternalWalletDetailsWithPriority.tokenDetails.address?.toLowerCase(),
+        );
+
+        return {
+          walletDetails: cardExternalWalletDetails,
+          mappedWalletDetails,
+          priorityWalletDetail,
+        };
+      } catch (err) {
+        const normalizedError =
+          err instanceof Error ? err : new Error(String(err));
+        Logger.error(
+          normalizedError,
+          'useGetCardExternalWalletDetails: Failed to fetch external wallet details',
+        );
+        throw normalizedError;
+      }
     },
-  );
+    enabled: false,
+    staleTime: 60_000,
+  });
+
+  const fetchData = useCallback(async () => {
+    const result = await refetch();
+    return result.data ?? null;
+  }, [refetch]);
+
+  return {
+    data: data ?? null,
+    isLoading,
+    error: error as Error | null,
+    fetchData,
+  };
 };
 
 export default useGetCardExternalWalletDetails;
diff --git a/app/components/UI/Card/hooks/useGetDelegationSettings.test.ts b/app/components/UI/Card/hooks/useGetDelegationSettings.test.ts
index 2579f8882227..90d65341b706 100644
--- a/app/components/UI/Card/hooks/useGetDelegationSettings.test.ts
+++ b/app/components/UI/Card/hooks/useGetDelegationSettings.test.ts
@@ -1,36 +1,35 @@
-import { renderHook } from '@testing-library/react-hooks';
-import { useSelector } from 'react-redux';
+import { renderHook, act } from '@testing-library/react-hooks';
+import { useQuery } from '@tanstack/react-query';
 import useGetDelegationSettings from './useGetDelegationSettings';
 import { useCardSDK } from '../sdk';
-import { useWrapWithCache } from './useWrapWithCache';
 import {
   DelegationSettingsResponse,
   DelegationSettingsNetwork,
 } from '../types';
 import { CardSDK } from '../sdk/CardSDK';
-
-// Mock dependencies
-jest.mock('react-redux', () => ({
-  useSelector: jest.fn(),
-}));
+import { cardQueries } from '../queries';
 
 jest.mock('../sdk', () => ({
   useCardSDK: jest.fn(),
 }));
 
-jest.mock('./useWrapWithCache', () => ({
-  useWrapWithCache: jest.fn(),
+const mockFetchQuery = jest.fn();
+const mockQueryClient = {
+  fetchQuery: (...args: unknown[]) => mockFetchQuery(...args),
+};
+jest.mock('@tanstack/react-query', () => ({
+  useQuery: jest.fn().mockReturnValue({
+    data: undefined,
+    isLoading: false,
+    error: null,
+  }),
+  useQueryClient: jest.fn(() => mockQueryClient),
 }));
 
-const mockUseSelector = useSelector as jest.MockedFunction<typeof useSelector>;
 const mockUseCardSDK = useCardSDK as jest.MockedFunction<typeof useCardSDK>;
-const mockUseWrapWithCache = useWrapWithCache as jest.MockedFunction<
-  typeof useWrapWithCache
->;
 
 describe('useGetDelegationSettings', () => {
   const mockGetDelegationSettings = jest.fn();
-  const mockFetchData = jest.fn();
 
   const mockSDK = {
     getDelegationSettings: mockGetDelegationSettings,
@@ -77,30 +76,24 @@ describe('useGetDelegationSettings', () => {
     },
   };
 
-  const mockCacheReturn = {
-    data: null,
-    isLoading: false,
-    error: null,
-    fetchData: mockFetchData,
-  };
-
   beforeEach(() => {
     jest.clearAllMocks();
 
-    mockUseSelector.mockReturnValue(true); // isAuthenticated
-
     mockUseCardSDK.mockReturnValue({
       ...jest.requireMock('../sdk'),
       sdk: mockSDK,
     });
 
-    mockUseWrapWithCache.mockImplementation((_key, fetchFn, _options) => {
-      // Store the fetch function for later use
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      (mockCacheReturn as any).actualFetchFn = fetchFn;
-      return mockCacheReturn;
+    (useQuery as jest.Mock).mockReturnValue({
+      data: undefined,
+      isLoading: false,
+      error: null,
     });
 
+    const { useQueryClient } = jest.requireMock('@tanstack/react-query');
+    useQueryClient.mockReturnValue(mockQueryClient);
+
+    mockFetchQuery.mockResolvedValue(mockDelegationSettingsResponse);
     mockGetDelegationSettings.mockResolvedValue(mockDelegationSettingsResponse);
   });
 
@@ -109,53 +102,41 @@ describe('useGetDelegationSettings', () => {
   });
 
   describe('Initial State', () => {
-    it('returns cache data from useWrapWithCache', () => {
+    it('returns default state from useQuery', () => {
       const { result } = renderHook(() => useGetDelegationSettings());
 
       expect(result.current.data).toBeNull();
       expect(result.current.isLoading).toBe(false);
       expect(result.current.error).toBe(null);
-      expect(result.current.fetchData).toBe(mockFetchData);
+      expect(typeof result.current.fetchData).toBe('function');
     });
 
-    it('passes correct cache key to useWrapWithCache', () => {
+    it('passes correct query key to useQuery', () => {
       renderHook(() => useGetDelegationSettings());
 
-      expect(mockUseWrapWithCache).toHaveBeenCalledWith(
-        'delegation-settings',
-        expect.any(Function),
-        expect.any(Object),
+      const queryConfig = (useQuery as jest.Mock).mock.calls[0][0];
+      expect(queryConfig.queryKey).toEqual(
+        cardQueries.dashboard.keys.delegationSettings(),
       );
     });
 
-    it('passes correct cache configuration to useWrapWithCache', () => {
+    it('passes correct staleTime to useQuery', () => {
       renderHook(() => useGetDelegationSettings());
 
-      expect(mockUseWrapWithCache).toHaveBeenCalledWith(
-        expect.any(String),
-        expect.any(Function),
-        {
-          cacheDuration: 600000, // 10 minutes in milliseconds
-          fetchOnMount: false,
-        },
-      );
+      const queryConfig = (useQuery as jest.Mock).mock.calls[0][0];
+      expect(queryConfig.staleTime).toBe(600000);
     });
 
-    it('uses 10 minute cache duration', () => {
+    it('uses 10 minute staleTime', () => {
       renderHook(() => useGetDelegationSettings());
 
-      const call = mockUseWrapWithCache.mock.calls[0];
-      const options = call[2];
-
-      expect(options).toEqual({
-        cacheDuration: 10 * 60 * 1000,
-        fetchOnMount: false,
-      });
+      const queryConfig = (useQuery as jest.Mock).mock.calls[0][0];
+      expect(queryConfig.staleTime).toBe(10 * 60 * 1000);
     });
   });
 
   describe('Prerequisites Check', () => {
-    it('returns null when SDK is not available', async () => {
+    it('throws error from queryFn when SDK is not available', () => {
       mockUseCardSDK.mockReturnValue({
         ...jest.requireMock('../sdk'),
         sdk: null,
@@ -163,36 +144,26 @@ describe('useGetDelegationSettings', () => {
 
       renderHook(() => useGetDelegationSettings());
 
-      // Get the fetch function from the mock
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      const fetchFn = (mockCacheReturn as any).actualFetchFn;
-      const result = await fetchFn();
-
-      expect(result).toBeNull();
+      const queryConfig = (useQuery as jest.Mock).mock.calls[0][0];
+      expect(() => queryConfig.queryFn()).toThrow('SDK not initialized');
       expect(mockGetDelegationSettings).not.toHaveBeenCalled();
     });
 
-    it('returns null when user is not authenticated', async () => {
-      mockUseSelector.mockReturnValue(false);
-
+    it('query is always disabled (fetching is done via fetchData)', () => {
       renderHook(() => useGetDelegationSettings());
 
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      const fetchFn = (mockCacheReturn as any).actualFetchFn;
-      const result = await fetchFn();
-
-      expect(result).toBeNull();
-      expect(mockGetDelegationSettings).not.toHaveBeenCalled();
+      const queryConfig = (useQuery as jest.Mock).mock.calls[0][0];
+      expect(queryConfig.enabled).toBe(false);
     });
 
-    it('calls getDelegationSettings when SDK and authentication are available', async () => {
-      renderHook(() => useGetDelegationSettings());
+    it('calls getDelegationSettings when SDK is available via fetchData', async () => {
+      const { result } = renderHook(() => useGetDelegationSettings());
 
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      const fetchFn = (mockCacheReturn as any).actualFetchFn;
-      await fetchFn();
+      await act(async () => {
+        await result.current.fetchData();
+      });
 
-      expect(mockGetDelegationSettings).toHaveBeenCalledTimes(1);
+      expect(mockFetchQuery).toHaveBeenCalledTimes(1);
     });
   });
 
@@ -200,9 +171,8 @@ describe('useGetDelegationSettings', () => {
     it('returns delegation settings from SDK', async () => {
       renderHook(() => useGetDelegationSettings());
 
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      const fetchFn = (mockCacheReturn as any).actualFetchFn;
-      const result = await fetchFn();
+      const queryConfig = (useQuery as jest.Mock).mock.calls[0][0];
+      const result = await queryConfig.queryFn();
 
       expect(result).toEqual(mockDelegationSettingsResponse);
     });
@@ -210,9 +180,8 @@ describe('useGetDelegationSettings', () => {
     it('calls SDK getDelegationSettings without arguments', async () => {
       renderHook(() => useGetDelegationSettings());
 
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      const fetchFn = (mockCacheReturn as any).actualFetchFn;
-      await fetchFn();
+      const queryConfig = (useQuery as jest.Mock).mock.calls[0][0];
+      await queryConfig.queryFn();
 
       expect(mockGetDelegationSettings).toHaveBeenCalledWith();
     });
@@ -220,9 +189,8 @@ describe('useGetDelegationSettings', () => {
     it('returns delegation settings with multiple networks', async () => {
       renderHook(() => useGetDelegationSettings());
 
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      const fetchFn = (mockCacheReturn as any).actualFetchFn;
-      const result = await fetchFn();
+      const queryConfig = (useQuery as jest.Mock).mock.calls[0][0];
+      const result = await queryConfig.queryFn();
 
       expect(result?.networks).toHaveLength(2);
       expect(result?.count).toBe(2);
@@ -231,9 +199,8 @@ describe('useGetDelegationSettings', () => {
     it('returns delegation settings with network configurations', async () => {
       renderHook(() => useGetDelegationSettings());
 
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      const fetchFn = (mockCacheReturn as any).actualFetchFn;
-      const result = await fetchFn();
+      const queryConfig = (useQuery as jest.Mock).mock.calls[0][0];
+      const result = await queryConfig.queryFn();
 
       expect(result?.networks[0]).toMatchObject({
         network: 'linea',
@@ -246,9 +213,8 @@ describe('useGetDelegationSettings', () => {
     it('returns delegation settings with token configurations', async () => {
       renderHook(() => useGetDelegationSettings());
 
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      const fetchFn = (mockCacheReturn as any).actualFetchFn;
-      const result = await fetchFn();
+      const queryConfig = (useQuery as jest.Mock).mock.calls[0][0];
+      const result = await queryConfig.queryFn();
 
       expect(result?.networks[0].tokens).toHaveProperty('USDC');
       expect(result?.networks[0].tokens.USDC).toMatchObject({
@@ -261,9 +227,8 @@ describe('useGetDelegationSettings', () => {
     it('returns delegation settings with links', async () => {
       renderHook(() => useGetDelegationSettings());
 
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      const fetchFn = (mockCacheReturn as any).actualFetchFn;
-      const result = await fetchFn();
+      const queryConfig = (useQuery as jest.Mock).mock.calls[0][0];
+      const result = await queryConfig.queryFn();
 
       expect(result?._links).toHaveProperty('self');
       expect(result?._links.self).toBe(
@@ -284,9 +249,8 @@ describe('useGetDelegationSettings', () => {
 
       renderHook(() => useGetDelegationSettings());
 
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      const fetchFn = (mockCacheReturn as any).actualFetchFn;
-      const result = await fetchFn();
+      const queryConfig = (useQuery as jest.Mock).mock.calls[0][0];
+      const result = await queryConfig.queryFn();
 
       expect(result?.networks).toEqual([]);
       expect(result?.count).toBe(0);
@@ -311,9 +275,8 @@ describe('useGetDelegationSettings', () => {
 
       renderHook(() => useGetDelegationSettings());
 
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      const fetchFn = (mockCacheReturn as any).actualFetchFn;
-      const result = await fetchFn();
+      const queryConfig = (useQuery as jest.Mock).mock.calls[0][0];
+      const result = await queryConfig.queryFn();
 
       expect(result?.networks[0].tokens).toEqual({});
     });
@@ -337,9 +300,8 @@ describe('useGetDelegationSettings', () => {
 
       renderHook(() => useGetDelegationSettings());
 
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      const fetchFn = (mockCacheReturn as any).actualFetchFn;
-      const result = await fetchFn();
+      const queryConfig = (useQuery as jest.Mock).mock.calls[0][0];
+      const result = await queryConfig.queryFn();
 
       expect(result?.networks).toHaveLength(1);
       expect(result?.count).toBe(1);
@@ -347,19 +309,56 @@ describe('useGetDelegationSettings', () => {
   });
 
   describe('Cache Integration', () => {
-    it('exposes fetchData function from useWrapWithCache', () => {
+    it('exposes fetchData function', () => {
       const { result } = renderHook(() => useGetDelegationSettings());
 
-      expect(result.current.fetchData).toBe(mockFetchData);
       expect(typeof result.current.fetchData).toBe('function');
     });
 
-    it('returns data from cache when available', () => {
-      mockUseWrapWithCache.mockReturnValue({
+    it('delegates cache freshness to fetchQuery with staleTime', async () => {
+      const { result } = renderHook(() => useGetDelegationSettings());
+
+      await act(async () => {
+        await result.current.fetchData();
+      });
+
+      expect(mockFetchQuery).toHaveBeenCalledWith(
+        expect.objectContaining({
+          queryKey: cardQueries.dashboard.keys.delegationSettings(),
+          staleTime: 10 * 60 * 1000,
+        }),
+      );
+    });
+
+    it('returns fetched data from fetchData', async () => {
+      const { result } = renderHook(() => useGetDelegationSettings());
+
+      let fetchResult;
+      await act(async () => {
+        fetchResult = await result.current.fetchData();
+      });
+
+      expect(fetchResult).toEqual(mockDelegationSettingsResponse);
+    });
+
+    it('returns null when fetchQuery returns null', async () => {
+      mockFetchQuery.mockResolvedValue(null);
+
+      const { result } = renderHook(() => useGetDelegationSettings());
+
+      let fetchResult;
+      await act(async () => {
+        fetchResult = await result.current.fetchData();
+      });
+
+      expect(fetchResult).toBeNull();
+    });
+
+    it('returns data from useQuery when available', () => {
+      (useQuery as jest.Mock).mockReturnValue({
         data: mockDelegationSettingsResponse,
         isLoading: false,
         error: null,
-        fetchData: mockFetchData,
       });
 
       const { result } = renderHook(() => useGetDelegationSettings());
@@ -367,12 +366,11 @@ describe('useGetDelegationSettings', () => {
       expect(result.current.data).toEqual(mockDelegationSettingsResponse);
     });
 
-    it('returns loading state from cache', () => {
-      mockUseWrapWithCache.mockReturnValue({
-        data: null,
+    it('returns loading state from useQuery', () => {
+      (useQuery as jest.Mock).mockReturnValue({
+        data: undefined,
         isLoading: true,
         error: null,
-        fetchData: mockFetchData,
       });
 
       const { result } = renderHook(() => useGetDelegationSettings());
@@ -380,12 +378,11 @@ describe('useGetDelegationSettings', () => {
       expect(result.current.isLoading).toBe(true);
     });
 
-    it('returns error state from cache', () => {
-      mockUseWrapWithCache.mockReturnValue({
-        data: null,
+    it('returns error state from useQuery', () => {
+      (useQuery as jest.Mock).mockReturnValue({
+        data: undefined,
         isLoading: false,
         error: new Error('Test error'),
-        fetchData: mockFetchData,
       });
 
       const { result } = renderHook(() => useGetDelegationSettings());
@@ -393,70 +390,28 @@ describe('useGetDelegationSettings', () => {
       expect(result.current.error).toBeInstanceOf(Error);
     });
 
-    it('uses consistent cache key across renders', () => {
+    it('uses consistent query key across renders', () => {
       const { rerender } = renderHook(() => useGetDelegationSettings());
 
-      const firstCallKey = mockUseWrapWithCache.mock.calls[0][0];
+      const firstCallKey = (useQuery as jest.Mock).mock.calls[0][0].queryKey;
 
       rerender();
 
-      const secondCallKey = mockUseWrapWithCache.mock.calls[1][0];
+      const secondCallKey = (useQuery as jest.Mock).mock.calls[1][0].queryKey;
 
-      expect(firstCallKey).toBe(secondCallKey);
-      expect(firstCallKey).toBe('delegation-settings');
+      expect(firstCallKey).toEqual(secondCallKey);
+      expect(firstCallKey).toEqual(
+        cardQueries.dashboard.keys.delegationSettings(),
+      );
     });
   });
 
-  describe('Callback Stability', () => {
-    it('updates fetch callback when SDK changes', () => {
-      const { rerender } = renderHook(() => useGetDelegationSettings());
-
-      const firstCallback = mockUseWrapWithCache.mock.calls[0][1];
-
-      // Change SDK instance
-      const newMockSDK = {
-        getDelegationSettings: jest.fn(),
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      } as any;
-
-      mockUseCardSDK.mockReturnValue({
-        ...jest.requireMock('../sdk'),
-        sdk: newMockSDK,
-      });
-
-      rerender();
-
-      const secondCallback = mockUseWrapWithCache.mock.calls[1][1];
-
-      expect(firstCallback).not.toBe(secondCallback);
-    });
-
-    it('updates fetch callback when authentication state changes', () => {
-      const { rerender } = renderHook(() => useGetDelegationSettings());
-
-      const firstCallback = mockUseWrapWithCache.mock.calls[0][1];
-
-      // Change authentication state
-      mockUseSelector.mockReturnValue(false);
-
-      rerender();
-
-      const secondCallback = mockUseWrapWithCache.mock.calls[1][1];
-
-      expect(firstCallback).not.toBe(secondCallback);
-    });
-
-    it('maintains callback stability when unrelated state changes', () => {
-      const { rerender } = renderHook(() => useGetDelegationSettings());
-
-      const firstCallback = mockUseWrapWithCache.mock.calls[0][1];
-
-      rerender();
-
-      const secondCallback = mockUseWrapWithCache.mock.calls[1][1];
+  describe('Enabled Condition', () => {
+    it('query is always disabled (manual fetching via fetchData)', () => {
+      renderHook(() => useGetDelegationSettings());
 
-      // Callback should be stable since SDK and auth haven't changed
-      expect(firstCallback).toBe(secondCallback);
+      const queryConfig = (useQuery as jest.Mock).mock.calls[0][0];
+      expect(queryConfig.enabled).toBe(false);
     });
   });
 
@@ -486,10 +441,9 @@ describe('useGetDelegationSettings', () => {
 
       renderHook(() => useGetDelegationSettings());
 
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      const fetchFn = (mockCacheReturn as any).actualFetchFn;
+      const queryConfig = (useQuery as jest.Mock).mock.calls[0][0];
 
-      await expect(fetchFn()).rejects.toThrow('API Error');
+      await expect(queryConfig.queryFn()).rejects.toThrow('API Error');
     });
 
     it('handles network errors', async () => {
@@ -498,24 +452,22 @@ describe('useGetDelegationSettings', () => {
 
       renderHook(() => useGetDelegationSettings());
 
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      const fetchFn = (mockCacheReturn as any).actualFetchFn;
+      const queryConfig = (useQuery as jest.Mock).mock.calls[0][0];
 
-      await expect(fetchFn()).rejects.toThrow('Network timeout');
+      await expect(queryConfig.queryFn()).rejects.toThrow('Network timeout');
     });
 
-    it('handles SDK method not available', async () => {
+    it('handles SDK method not available', () => {
       mockUseCardSDK.mockReturnValue({
         ...jest.requireMock('../sdk'),
-        sdk: {} as unknown as CardSDK, // SDK wi thout getDelegationSettings method
+        sdk: {} as unknown as CardSDK,
       });
 
       renderHook(() => useGetDelegationSettings());
 
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      const fetchFn = (mockCacheReturn as any).actualFetchFn;
+      const queryConfig = (useQuery as jest.Mock).mock.calls[0][0];
 
-      await expect(fetchFn()).rejects.toThrow();
+      expect(() => queryConfig.queryFn()).toThrow();
     });
   });
 
@@ -526,29 +478,30 @@ describe('useGetDelegationSettings', () => {
 
       expect(result1.current).toBeDefined();
       expect(result2.current).toBeDefined();
-      expect(mockUseWrapWithCache).toHaveBeenCalledTimes(2);
+      expect(useQuery as jest.Mock).toHaveBeenCalledTimes(2);
     });
 
-    it('uses same cache key across multiple instances', () => {
+    it('uses same query key across multiple instances', () => {
       renderHook(() => useGetDelegationSettings());
       renderHook(() => useGetDelegationSettings());
 
-      const firstKey = mockUseWrapWithCache.mock.calls[0][0];
-      const secondKey = mockUseWrapWithCache.mock.calls[1][0];
+      const firstKey = (useQuery as jest.Mock).mock.calls[0][0].queryKey;
+      const secondKey = (useQuery as jest.Mock).mock.calls[1][0].queryKey;
 
-      expect(firstKey).toBe(secondKey);
-      expect(firstKey).toBe('delegation-settings');
+      expect(firstKey).toEqual(secondKey);
+      expect(firstKey).toEqual(cardQueries.dashboard.keys.delegationSettings());
     });
 
-    it('uses same cache duration across multiple instances', () => {
+    it('uses same staleTime across multiple instances', () => {
       renderHook(() => useGetDelegationSettings());
       renderHook(() => useGetDelegationSettings());
 
-      const firstOptions = mockUseWrapWithCache.mock.calls[0][2];
-      const secondOptions = mockUseWrapWithCache.mock.calls[1][2];
+      const firstStaleTime = (useQuery as jest.Mock).mock.calls[0][0].staleTime;
+      const secondStaleTime = (useQuery as jest.Mock).mock.calls[1][0]
+        .staleTime;
 
-      expect(firstOptions).toEqual(secondOptions);
-      expect(firstOptions?.cacheDuration).toBe(600000);
+      expect(firstStaleTime).toBe(secondStaleTime);
+      expect(firstStaleTime).toBe(600000);
     });
   });
 });
diff --git a/app/components/UI/Card/hooks/useGetDelegationSettings.ts b/app/components/UI/Card/hooks/useGetDelegationSettings.ts
index d2f309a77f2e..12fd0c0442ae 100644
--- a/app/components/UI/Card/hooks/useGetDelegationSettings.ts
+++ b/app/components/UI/Card/hooks/useGetDelegationSettings.ts
@@ -1,29 +1,55 @@
-import { useCallback } from 'react';
+import { useCallback, useRef, useMemo } from 'react';
+import { useQuery, useQueryClient } from '@tanstack/react-query';
 import { useCardSDK } from '../sdk';
-import { useWrapWithCache } from './useWrapWithCache';
-import { useSelector } from 'react-redux';
-import { selectIsAuthenticatedCard } from '../../../../core/redux/slices/card';
+import { DelegationSettingsResponse } from '../types';
+import { cardQueries } from '../queries';
+
+const STALE_TIME = 10 * 60 * 1000; // 10 minutes
+const QUERY_KEY = cardQueries.dashboard.keys.delegationSettings();
 
 /**
- * Hook to fetch and cache delegation settings from the Card SDK
+ * Hook to fetch and cache delegation settings from the Card SDK.
  *
  * @returns Object containing delegation settings data, loading state, error, and fetch function
  */
 const useGetDelegationSettings = () => {
   const { sdk } = useCardSDK();
-  const isAuthenticated = useSelector(selectIsAuthenticatedCard);
+  const queryClient = useQueryClient();
+  const sdkRef = useRef(sdk);
+  sdkRef.current = sdk;
+
+  const queryFn = useMemo(
+    () => () => {
+      const currentSdk = sdkRef.current;
+      if (!currentSdk) throw new Error('SDK not initialized');
+      return currentSdk.getDelegationSettings();
+    },
+    [],
+  );
+
+  const { data, isLoading, error } =
+    useQuery<DelegationSettingsResponse | null>({
+      queryKey: QUERY_KEY,
+      queryFn,
+      enabled: false,
+      staleTime: STALE_TIME,
+    });
 
-  const fetchDelegationSettings = useCallback(async () => {
-    if (!sdk || !isAuthenticated) {
-      return null;
-    }
-    return sdk.getDelegationSettings();
-  }, [sdk, isAuthenticated]);
+  const fetchData = useCallback(async () => {
+    const result = await queryClient.fetchQuery({
+      queryKey: QUERY_KEY,
+      queryFn,
+      staleTime: STALE_TIME,
+    });
+    return result ?? null;
+  }, [queryClient, queryFn]);
 
-  return useWrapWithCache('delegation-settings', fetchDelegationSettings, {
-    cacheDuration: 10 * 60 * 1000, // 10 minutes cache
-    fetchOnMount: false, // Disabled - fetchAllData orchestrates fetching
-  });
+  return {
+    data: data ?? null,
+    isLoading,
+    error: error as Error | null,
+    fetchData,
+  };
 };
 
 export default useGetDelegationSettings;
diff --git a/app/components/UI/Card/hooks/useGetLatestAllowanceForPriorityToken.test.ts b/app/components/UI/Card/hooks/useGetLatestAllowanceForPriorityToken.test.ts
index 2e501137e907..6413dfe68d63 100644
--- a/app/components/UI/Card/hooks/useGetLatestAllowanceForPriorityToken.test.ts
+++ b/app/components/UI/Card/hooks/useGetLatestAllowanceForPriorityToken.test.ts
@@ -1,4 +1,11 @@
-import { renderHook, waitFor, act } from '@testing-library/react-native';
+import React from 'react';
+import {
+  renderHook,
+  waitFor,
+  act,
+  cleanup,
+} from '@testing-library/react-native';
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 import { ethers } from 'ethers';
 import useGetLatestAllowanceForPriorityToken from './useGetLatestAllowanceForPriorityToken';
 import { useCardSDK } from '../sdk';
@@ -9,7 +16,6 @@ import {
   caipChainIdToNetwork,
 } from '../constants';
 
-// Mock dependencies
 jest.mock('../sdk');
 jest.mock('../../../../util/Logger', () => ({
   error: jest.fn(),
@@ -30,6 +36,16 @@ jest.mock('../../../../core/Multichain/utils', () => ({
   isNonEvmChainId: (...args: unknown[]) => mockIsNonEvmChainId(...args),
 }));
 
+let queryClient: QueryClient;
+
+const createWrapper = () => {
+  queryClient = new QueryClient({
+    defaultOptions: { queries: { retry: false } },
+  });
+  return ({ children }: { children: React.ReactNode }) =>
+    React.createElement(QueryClientProvider, { client: queryClient }, children);
+};
+
 describe('useGetLatestAllowanceForPriorityToken', () => {
   const mockSDK = {
     getLatestAllowanceFromLogs: jest.fn(),
@@ -62,11 +78,13 @@ describe('useGetLatestAllowanceForPriorityToken', () => {
       toString: () => '11806489',
     });
     (ethers.utils.formatUnits as jest.Mock).mockReturnValue('15.0');
-    // Default: EVM chains return false (not non-EVM)
     mockIsNonEvmChainId.mockReturnValue(false);
   });
 
   afterEach(() => {
+    queryClient.cancelQueries();
+    queryClient.clear();
+    cleanup();
     jest.resetAllMocks();
   });
 
@@ -74,8 +92,9 @@ describe('useGetLatestAllowanceForPriorityToken', () => {
     (useCardSDK as jest.Mock).mockReturnValue({ sdk: null });
     const mockToken = createMockToken();
 
-    const { result } = renderHook(() =>
-      useGetLatestAllowanceForPriorityToken(mockToken),
+    const { result } = renderHook(
+      () => useGetLatestAllowanceForPriorityToken(mockToken),
+      { wrapper: createWrapper() },
     );
 
     await waitFor(() => {
@@ -85,8 +104,9 @@ describe('useGetLatestAllowanceForPriorityToken', () => {
   });
 
   it('returns null when priorityToken is null', async () => {
-    const { result } = renderHook(() =>
-      useGetLatestAllowanceForPriorityToken(null),
+    const { result } = renderHook(
+      () => useGetLatestAllowanceForPriorityToken(null),
+      { wrapper: createWrapper() },
     );
 
     await waitFor(() => {
@@ -100,8 +120,9 @@ describe('useGetLatestAllowanceForPriorityToken', () => {
       allowanceState: AllowanceState.Enabled,
     });
 
-    const { result } = renderHook(() =>
-      useGetLatestAllowanceForPriorityToken(mockToken),
+    const { result } = renderHook(
+      () => useGetLatestAllowanceForPriorityToken(mockToken),
+      { wrapper: createWrapper() },
     );
 
     await waitFor(() => {
@@ -115,8 +136,9 @@ describe('useGetLatestAllowanceForPriorityToken', () => {
       allowanceState: AllowanceState.NotEnabled,
     });
 
-    const { result } = renderHook(() =>
-      useGetLatestAllowanceForPriorityToken(mockToken),
+    const { result } = renderHook(
+      () => useGetLatestAllowanceForPriorityToken(mockToken),
+      { wrapper: createWrapper() },
     );
 
     await waitFor(() => {
@@ -126,14 +148,14 @@ describe('useGetLatestAllowanceForPriorityToken', () => {
   });
 
   it('skips fetch for non-EVM chains', async () => {
-    // Mock isNonEvmChainId to return true for Solana
     mockIsNonEvmChainId.mockReturnValue(true);
     const mockToken = createMockToken({
       caipChainId: 'solana:5eykt4UsFv8P8NJdTREpY1vzqKqZKvdp',
     });
 
-    const { result } = renderHook(() =>
-      useGetLatestAllowanceForPriorityToken(mockToken),
+    const { result } = renderHook(
+      () => useGetLatestAllowanceForPriorityToken(mockToken),
+      { wrapper: createWrapper() },
     );
 
     await waitFor(() => {
@@ -146,8 +168,9 @@ describe('useGetLatestAllowanceForPriorityToken', () => {
     (ethers.utils.isAddress as jest.Mock).mockReturnValue(false);
     const mockToken = createMockToken();
 
-    const { result } = renderHook(() =>
-      useGetLatestAllowanceForPriorityToken(mockToken),
+    const { result } = renderHook(
+      () => useGetLatestAllowanceForPriorityToken(mockToken),
+      { wrapper: createWrapper() },
     );
 
     await waitFor(() => {
@@ -161,8 +184,9 @@ describe('useGetLatestAllowanceForPriorityToken', () => {
       delegationContract: undefined,
     });
 
-    const { result } = renderHook(() =>
-      useGetLatestAllowanceForPriorityToken(mockToken),
+    const { result } = renderHook(
+      () => useGetLatestAllowanceForPriorityToken(mockToken),
+      { wrapper: createWrapper() },
     );
 
     await waitFor(() => {
@@ -175,8 +199,9 @@ describe('useGetLatestAllowanceForPriorityToken', () => {
     mockSDK.getLatestAllowanceFromLogs.mockResolvedValue('15000000');
     const mockToken = createMockToken();
 
-    const { result } = renderHook(() =>
-      useGetLatestAllowanceForPriorityToken(mockToken),
+    const { result } = renderHook(
+      () => useGetLatestAllowanceForPriorityToken(mockToken),
+      { wrapper: createWrapper() },
     );
 
     await waitFor(() => {
@@ -199,7 +224,9 @@ describe('useGetLatestAllowanceForPriorityToken', () => {
       stagingTokenAddress: '0xstagingtokenaddress123456789012345678',
     });
 
-    renderHook(() => useGetLatestAllowanceForPriorityToken(mockToken));
+    renderHook(() => useGetLatestAllowanceForPriorityToken(mockToken), {
+      wrapper: createWrapper(),
+    });
 
     await waitFor(() => {
       expect(mockSDK.getLatestAllowanceFromLogs).toHaveBeenCalledWith(
@@ -215,8 +242,9 @@ describe('useGetLatestAllowanceForPriorityToken', () => {
     mockSDK.getLatestAllowanceFromLogs.mockResolvedValue(null);
     const mockToken = createMockToken();
 
-    const { result } = renderHook(() =>
-      useGetLatestAllowanceForPriorityToken(mockToken),
+    const { result } = renderHook(
+      () => useGetLatestAllowanceForPriorityToken(mockToken),
+      { wrapper: createWrapper() },
     );
 
     await waitFor(() => {
@@ -232,8 +260,9 @@ describe('useGetLatestAllowanceForPriorityToken', () => {
     mockSDK.getLatestAllowanceFromLogs.mockRejectedValue(mockError);
     const mockToken = createMockToken();
 
-    const { result } = renderHook(() =>
-      useGetLatestAllowanceForPriorityToken(mockToken),
+    const { result } = renderHook(
+      () => useGetLatestAllowanceForPriorityToken(mockToken),
+      { wrapper: createWrapper() },
     );
 
     await waitFor(() => {
@@ -252,8 +281,9 @@ describe('useGetLatestAllowanceForPriorityToken', () => {
     mockSDK.getLatestAllowanceFromLogs.mockRejectedValue('string error');
     const mockToken = createMockToken();
 
-    const { result } = renderHook(() =>
-      useGetLatestAllowanceForPriorityToken(mockToken),
+    const { result } = renderHook(
+      () => useGetLatestAllowanceForPriorityToken(mockToken),
+      { wrapper: createWrapper() },
     );
 
     await waitFor(() => {
@@ -270,8 +300,9 @@ describe('useGetLatestAllowanceForPriorityToken', () => {
       .mockResolvedValueOnce('20000000');
     const mockToken = createMockToken();
 
-    const { result } = renderHook(() =>
-      useGetLatestAllowanceForPriorityToken(mockToken),
+    const { result } = renderHook(
+      () => useGetLatestAllowanceForPriorityToken(mockToken),
+      { wrapper: createWrapper() },
     );
 
     await waitFor(() => {
@@ -300,16 +331,15 @@ describe('useGetLatestAllowanceForPriorityToken', () => {
     );
     const mockToken = createMockToken();
 
-    const { result } = renderHook(() =>
-      useGetLatestAllowanceForPriorityToken(mockToken),
+    const { result } = renderHook(
+      () => useGetLatestAllowanceForPriorityToken(mockToken),
+      { wrapper: createWrapper() },
     );
 
-    // Hook starts fetching immediately, so loading should be true
     await waitFor(() => {
       expect(result.current.isLoading).toBe(true);
     });
 
-    // Wait for loading to complete
     await waitFor(
       () => {
         expect(result.current.isLoading).toBe(false);
@@ -325,7 +355,9 @@ describe('useGetLatestAllowanceForPriorityToken', () => {
     const mockToken = createMockToken({ decimals: 6 });
     (ethers.utils.formatUnits as jest.Mock).mockReturnValue('15.0');
 
-    renderHook(() => useGetLatestAllowanceForPriorityToken(mockToken));
+    renderHook(() => useGetLatestAllowanceForPriorityToken(mockToken), {
+      wrapper: createWrapper(),
+    });
 
     await waitFor(() => {
       expect(ethers.utils.formatUnits).toHaveBeenCalledWith('15000000', 6);
@@ -337,8 +369,9 @@ describe('useGetLatestAllowanceForPriorityToken', () => {
       walletAddress: undefined as unknown as string,
     });
 
-    const { result } = renderHook(() =>
-      useGetLatestAllowanceForPriorityToken(mockToken),
+    const { result } = renderHook(
+      () => useGetLatestAllowanceForPriorityToken(mockToken),
+      { wrapper: createWrapper() },
     );
 
     await waitFor(() => {
@@ -352,8 +385,9 @@ describe('useGetLatestAllowanceForPriorityToken', () => {
       decimals: undefined as unknown as number,
     });
 
-    const { result } = renderHook(() =>
-      useGetLatestAllowanceForPriorityToken(mockToken),
+    const { result } = renderHook(
+      () => useGetLatestAllowanceForPriorityToken(mockToken),
+      { wrapper: createWrapper() },
     );
 
     await waitFor(() => {
@@ -364,7 +398,6 @@ describe('useGetLatestAllowanceForPriorityToken', () => {
 
   describe('unsupported tokens', () => {
     beforeEach(() => {
-      // Mock the includes method to return true only for AUSDC
       jest
         .spyOn(SPENDING_LIMIT_UNSUPPORTED_TOKENS, 'includes')
         .mockImplementation((symbol: string) => symbol === 'AUSDC');
@@ -379,8 +412,9 @@ describe('useGetLatestAllowanceForPriorityToken', () => {
         symbol: 'aUSDC',
       });
 
-      const { result } = renderHook(() =>
-        useGetLatestAllowanceForPriorityToken(mockToken),
+      const { result } = renderHook(
+        () => useGetLatestAllowanceForPriorityToken(mockToken),
+        { wrapper: createWrapper() },
       );
 
       await waitFor(() => {
@@ -394,8 +428,9 @@ describe('useGetLatestAllowanceForPriorityToken', () => {
         symbol: 'ausdc',
       });
 
-      const { result } = renderHook(() =>
-        useGetLatestAllowanceForPriorityToken(mockToken),
+      const { result } = renderHook(
+        () => useGetLatestAllowanceForPriorityToken(mockToken),
+        { wrapper: createWrapper() },
       );
 
       await waitFor(() => {
@@ -409,8 +444,9 @@ describe('useGetLatestAllowanceForPriorityToken', () => {
         symbol: 'AuSdC',
       });
 
-      const { result } = renderHook(() =>
-        useGetLatestAllowanceForPriorityToken(mockToken),
+      const { result } = renderHook(
+        () => useGetLatestAllowanceForPriorityToken(mockToken),
+        { wrapper: createWrapper() },
       );
 
       await waitFor(() => {
@@ -425,8 +461,9 @@ describe('useGetLatestAllowanceForPriorityToken', () => {
         symbol: 'USDC',
       });
 
-      const { result } = renderHook(() =>
-        useGetLatestAllowanceForPriorityToken(mockToken),
+      const { result } = renderHook(
+        () => useGetLatestAllowanceForPriorityToken(mockToken),
+        { wrapper: createWrapper() },
       );
 
       await waitFor(() => {
@@ -448,8 +485,9 @@ describe('useGetLatestAllowanceForPriorityToken', () => {
         symbol: undefined as unknown as string,
       });
 
-      const { result } = renderHook(() =>
-        useGetLatestAllowanceForPriorityToken(mockToken),
+      const { result } = renderHook(
+        () => useGetLatestAllowanceForPriorityToken(mockToken),
+        { wrapper: createWrapper() },
       );
 
       await waitFor(() => {
diff --git a/app/components/UI/Card/hooks/useGetLatestAllowanceForPriorityToken.ts b/app/components/UI/Card/hooks/useGetLatestAllowanceForPriorityToken.ts
index 66ba4fc75de0..153c42f6297f 100644
--- a/app/components/UI/Card/hooks/useGetLatestAllowanceForPriorityToken.ts
+++ b/app/components/UI/Card/hooks/useGetLatestAllowanceForPriorityToken.ts
@@ -1,4 +1,5 @@
-import { useCallback, useEffect, useState } from 'react';
+import { useCallback, useRef } from 'react';
+import { useQuery } from '@tanstack/react-query';
 import { useCardSDK } from '../sdk';
 import { CardTokenAllowance, AllowanceState } from '../types';
 import Logger from '../../../../util/Logger';
@@ -8,121 +9,111 @@ import {
   SPENDING_LIMIT_UNSUPPORTED_TOKENS,
 } from '../constants';
 import { isNonEvmChainId } from '../../../../core/Multichain/utils';
+import { cardQueries } from '../queries';
+
+/**
+ * Determines whether fetching the latest allowance is applicable for the given token.
+ * Returns false when the fetch should be skipped.
+ */
+const isAllowanceFetchApplicable = (
+  token: CardTokenAllowance | null | undefined,
+): token is CardTokenAllowance => {
+  if (!token) return false;
+  if (token.allowanceState !== AllowanceState.Limited) return false;
+  if (
+    token.symbol &&
+    SPENDING_LIMIT_UNSUPPORTED_TOKENS.includes(token.symbol.toUpperCase())
+  )
+    return false;
+  if (token.caipChainId && isNonEvmChainId(token.caipChainId)) return false;
+
+  const tokenAddress = token.stagingTokenAddress || token.address;
+  if (!tokenAddress || !ethers.utils.isAddress(tokenAddress)) return false;
+  if (!token.delegationContract || !token.walletAddress || !token.decimals)
+    return false;
+
+  return true;
+};
 
 /**
  * Hook to get the latest allowance from approval logs for the priority token.
- * This is only needed in authenticated mode when the allowance state is Limited,
+ * Only needed in authenticated mode when allowanceState is Limited,
  * to display the spending limit progress bar with the correct total allowance.
- * The latest allowance represents the most recent approval amount the user set,
- * which is used as the "total" for calculating spending progress.
- *
- * Optimization: Only fetches from logs when allowanceState === Limited.
- * For Enabled (unlimited) or NotEnabled states, this fetch is skipped as it's not needed.
  *
  * @param priorityToken - The priority token to fetch the latest allowance for
- * @returns Object containing:
- * - latestAllowance: The latest approval amount from logs (human-readable string)
- * - isLoading: Loading state
- * - error: Error object if any
- * - refetch: Function to manually trigger fetch
+ * @returns Object containing latest allowance, loading state, error, and refetch function
  */
 const useGetLatestAllowanceForPriorityToken = (
   priorityToken: CardTokenAllowance | null | undefined,
 ) => {
   const { sdk } = useCardSDK();
-  const [latestAllowance, setLatestAllowance] = useState<string | null>(null);
-  const [isLoading, setIsLoading] = useState(false);
-  const [error, setError] = useState<Error | null>(null);
-
-  const fetchLatestAllowance = useCallback(async () => {
-    if (!sdk || !priorityToken) {
-      return;
-    }
-
-    // Only fetch for Limited allowance state
-    // Unlimited (Enabled) and NotEnabled states don't need totalAllowance from logs
-    if (priorityToken.allowanceState !== AllowanceState.Limited) {
-      return;
-    }
+  const sdkRef = useRef(sdk);
+  sdkRef.current = sdk;
 
-    // Skip for unsupported tokens (e.g., aUSDC which has different allowance behavior)
-    if (
-      priorityToken.symbol &&
-      SPENDING_LIMIT_UNSUPPORTED_TOKENS.includes(
-        priorityToken.symbol.toUpperCase(),
-      )
-    ) {
-      return;
-    }
+  const applicable = isAllowanceFetchApplicable(priorityToken);
 
-    // Only fetch for EVM tokens
-    if (
-      priorityToken.caipChainId &&
-      isNonEvmChainId(priorityToken.caipChainId)
-    ) {
-      return;
-    }
+  // Extract values only when applicable (type guard ensures priorityToken is non-null)
+  const tokenAddress = applicable
+    ? priorityToken.stagingTokenAddress || priorityToken.address || ''
+    : '';
+  const delegationContract = applicable
+    ? priorityToken.delegationContract || ''
+    : '';
+  const walletAddress = applicable ? priorityToken.walletAddress || '' : '';
+  const caipChainId = applicable
+    ? priorityToken.caipChainId
+    : ('' as `${string}:${string}`);
+  const decimals = applicable ? priorityToken.decimals || 0 : 0;
 
-    const tokenAddress =
-      priorityToken.stagingTokenAddress || priorityToken.address;
+  const { data, isLoading, error, refetch } = useQuery<string | null>({
+    queryKey: cardQueries.dashboard.keys.latestAllowance(
+      tokenAddress,
+      delegationContract,
+      walletAddress,
+      caipChainId,
+      decimals,
+    ),
+    queryFn: async () => {
+      const currentSdk = sdkRef.current;
+      if (!currentSdk || !applicable) return null;
 
-    if (!tokenAddress || !ethers.utils.isAddress(tokenAddress)) {
-      return;
-    }
+      const cardNetwork = caipChainIdToNetwork[caipChainId];
 
-    if (
-      !priorityToken.delegationContract ||
-      !priorityToken.walletAddress ||
-      !priorityToken.decimals
-    ) {
-      return;
-    }
-
-    setIsLoading(true);
-    setError(null);
-    const cardNetwork = caipChainIdToNetwork[priorityToken.caipChainId];
-
-    try {
-      const rawLatestAllowance = await sdk.getLatestAllowanceFromLogs(
-        priorityToken.walletAddress,
-        tokenAddress,
-        priorityToken.delegationContract,
-        cardNetwork ?? 'linea',
-      );
+      try {
+        const rawLatestAllowance = await currentSdk.getLatestAllowanceFromLogs(
+          walletAddress,
+          tokenAddress,
+          delegationContract,
+          cardNetwork ?? 'linea',
+        );
 
-      if (rawLatestAllowance) {
-        // Convert from wei to human-readable using token decimals
-        const formatted = ethers.utils.formatUnits(
-          rawLatestAllowance,
-          priorityToken.decimals,
+        if (rawLatestAllowance) {
+          return ethers.utils.formatUnits(rawLatestAllowance, decimals);
+        }
+        return null;
+      } catch (err) {
+        const normalizedError =
+          err instanceof Error ? err : new Error(String(err));
+        Logger.error(
+          normalizedError,
+          'useGetLatestAllowanceForPriorityToken: Failed to fetch latest allowance',
         );
-        setLatestAllowance(formatted);
-      } else {
-        setLatestAllowance(null);
+        throw normalizedError;
       }
-    } catch (err) {
-      const normalizedError =
-        err instanceof Error ? err : new Error(String(err));
-      Logger.error(
-        normalizedError,
-        'useGetLatestAllowanceForPriorityToken: Failed to fetch latest allowance',
-      );
-      setError(normalizedError);
-      setLatestAllowance(null);
-    } finally {
-      setIsLoading(false);
-    }
-  }, [sdk, priorityToken]);
+    },
+    enabled: applicable && !!sdk,
+    staleTime: 60_000,
+  });
 
-  useEffect(() => {
-    fetchLatestAllowance();
-  }, [fetchLatestAllowance]);
+  const refetchAllowance = useCallback(async () => {
+    await refetch();
+  }, [refetch]);
 
   return {
-    latestAllowance,
+    latestAllowance: data ?? null,
     isLoading,
-    error,
-    refetch: fetchLatestAllowance,
+    error: error as Error | null,
+    refetch: refetchAllowance,
   };
 };
 
diff --git a/app/components/UI/Card/hooks/useGetPriorityCardToken.test.ts b/app/components/UI/Card/hooks/useGetPriorityCardToken.test.ts
index 25537bc22296..68f53d2d67d7 100644
--- a/app/components/UI/Card/hooks/useGetPriorityCardToken.test.ts
+++ b/app/components/UI/Card/hooks/useGetPriorityCardToken.test.ts
@@ -4,17 +4,31 @@ import { useCardSDK } from '../sdk';
 import { CardToken, CardTokenAllowance, AllowanceState } from '../types';
 import { useGetPriorityCardToken } from './useGetPriorityCardToken';
 import Logger from '../../../../util/Logger';
-import { strings } from '../../../../../locales/i18n';
 
 const mockUseSelector = useSelector as jest.MockedFunction<typeof useSelector>;
 
+const mockRefetch = jest.fn();
+let mockUseQueryOptions: Record<string, unknown> = {};
+const mockUseQueryReturn = {
+  data: undefined as unknown,
+  isLoading: false,
+  error: null as unknown,
+  refetch: mockRefetch,
+};
+
+jest.mock('@tanstack/react-query', () => ({
+  useQuery: (options: Record<string, unknown>) => {
+    mockUseQueryOptions = options;
+    return mockUseQueryReturn;
+  },
+}));
+
 jest.mock('../sdk', () => ({
   useCardSDK: jest.fn(),
 }));
 
 jest.mock('react-redux', () => ({
   useSelector: jest.fn(),
-  useDispatch: jest.fn(),
 }));
 
 jest.mock('../../../../selectors/tokenBalancesController', () => ({
@@ -28,12 +42,6 @@ jest.mock('../../../../selectors/multichainAccounts/accounts', () => ({
 jest.mock('../../../../core/redux/slices/card', () => ({
   ...jest.requireActual('../../../../core/redux/slices/card'),
   selectIsAuthenticatedCard: jest.fn(),
-  selectCardPriorityToken: jest.requireActual(
-    '../../../../core/redux/slices/card',
-  ).selectCardPriorityToken,
-  selectCardPriorityTokenLastFetched: jest.requireActual(
-    '../../../../core/redux/slices/card',
-  ).selectCardPriorityTokenLastFetched,
 }));
 
 import { selectAllTokenBalances } from '../../../../selectors/tokenBalancesController';
@@ -56,10 +64,6 @@ jest.mock('../../../../util/Logger', () => ({
   error: jest.fn(),
 }));
 
-jest.mock('../../../../../locales/i18n', () => ({
-  strings: jest.fn(),
-}));
-
 jest.mock('../../../../util/trace', () => ({
   ...jest.requireActual('../../../../util/trace'),
   trace: jest.fn(),
@@ -85,12 +89,6 @@ jest.mock('../../../../core/Engine', () => ({
 describe('useGetPriorityCardToken', () => {
   const mockGetPriorityToken = jest.fn();
   const mockFetchAllowances = jest.fn();
-  const mockDispatch = jest.fn();
-  const mockTrace = jest.fn();
-  const mockEndTrace = jest.fn();
-
-  let mockPriorityToken: CardTokenAllowance | null = null;
-  let mockLastFetched: Date | string | null = null;
 
   const mockSupportedTokens = [
     {
@@ -107,7 +105,6 @@ describe('useGetPriorityCardToken', () => {
     },
   ];
 
-  // Mock Redux state that persists across test lifecycle
   const mockSDK = {
     getPriorityToken: mockGetPriorityToken,
     getSupportedTokensAllowances: mockFetchAllowances,
@@ -149,19 +146,7 @@ describe('useGetPriorityCardToken', () => {
     name: 'Token 1',
   };
 
-  beforeEach(() => {
-    jest.clearAllMocks();
-
-    // Reset all individual mock functions
-    mockGetPriorityToken.mockReset();
-    mockFetchAllowances.mockReset();
-    mockDispatch.mockReset();
-    mockTrace.mockReset();
-    mockEndTrace.mockReset();
-
-    mockPriorityToken = null;
-    mockLastFetched = null;
-
+  const setupDefaultMocks = () => {
     const mockTokenBalances = {
       [mockAddress.toLowerCase()]: {
         '0x1': {
@@ -169,7 +154,6 @@ describe('useGetPriorityCardToken', () => {
           '0xToken2': '500000000000000000',
         },
       },
-      addToken: jest.fn().mockResolvedValue(undefined),
     };
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
     mockSelectAllTokenBalances.mockReturnValue(mockTokenBalances as any);
@@ -201,22 +185,16 @@ describe('useGetPriorityCardToken', () => {
       if (selector === selectSelectedInternalAccountByScope) {
         return mockAccountSelector;
       }
+      if (selector === selectIsAuthenticatedCard) {
+        return false;
+      }
 
-      // If selector is a function (like createSelector result), try to execute it
       if (typeof selector === 'function') {
         try {
           const mockState = {
             card: {
               cardholderAccounts: [],
               isLoaded: true,
-              priorityTokensByAddress: {
-                [mockAddress.toLowerCase()]: mockPriorityToken,
-              },
-              lastFetchedByAddress: {
-                [mockAddress.toLowerCase()]: mockLastFetched,
-              },
-              authenticatedPriorityToken: null,
-              authenticatedPriorityTokenLastFetched: null,
             },
             engine: {
               backgroundState: {
@@ -228,56 +206,31 @@ describe('useGetPriorityCardToken', () => {
             // eslint-disable-next-line @typescript-eslint/no-explicit-any
           } as unknown as any;
 
-          const result = selector(mockState);
-
-          // If the result is an object with allTokenBalances, return it (this is the cardState)
-          if (
-            result &&
-            typeof result === 'object' &&
-            'allTokenBalances' in result
-          ) {
-            return result;
-          }
-
-          return result;
+          return selector(mockState);
         } catch (_e) {
-          // Fallback for selectors that fail
+          // Fallback
         }
       }
 
-      const selectorString = selector?.toString?.() || '';
-      if (
-        selectorString.includes('selectCardPriorityToken') &&
-        !selectorString.includes('LastFetched')
-      ) {
-        return mockPriorityToken;
-      }
-      if (selectorString.includes('selectCardPriorityTokenLastFetched')) {
-        return mockLastFetched;
-      }
-      if (selectorString.includes('selectIsAuthenticatedCard')) {
-        return false;
-      }
-
       return null;
     });
 
     (useCardSDK as jest.Mock).mockReturnValue({ sdk: mockSDK });
+  };
 
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    const { useDispatch } = jest.requireMock('react-redux');
-
-    mockDispatch.mockImplementation(
-      (action: { type?: string; payload?: unknown }) => action,
-    );
-
-    useDispatch.mockReturnValue(mockDispatch);
+  beforeEach(() => {
+    jest.clearAllMocks();
+    mockGetPriorityToken.mockReset();
+    mockFetchAllowances.mockReset();
 
-    (strings as jest.Mock).mockReturnValue('Error occurred');
+    // Reset useQuery mock return values
+    mockUseQueryReturn.data = undefined;
+    mockUseQueryReturn.isLoading = false;
+    mockUseQueryReturn.error = null;
+    mockRefetch.mockReset();
+    mockUseQueryOptions = {};
 
-    const { trace, endTrace } = jest.requireMock('../../../../util/trace');
-    trace.mockImplementation(mockTrace);
-    endTrace.mockImplementation(mockEndTrace);
+    setupDefaultMocks();
   });
 
   it('should initialize with correct default state', async () => {
@@ -285,149 +238,25 @@ describe('useGetPriorityCardToken', () => {
 
     const { result } = renderHook(() => useGetPriorityCardToken());
 
-    await act(async () => {
-      await new Promise((resolve) => setTimeout(resolve, 0));
-    });
-
     expect(result.current.isLoading).toBe(false);
     expect(result.current.priorityToken).toBe(null);
   });
 
-  it('should fetch priority token successfully', async () => {
-    mockFetchAllowances.mockResolvedValue(mockSDKTokensData);
-    mockGetPriorityToken.mockResolvedValue(mockCardToken);
-
-    const { result } = renderHook(() => useGetPriorityCardToken());
-
-    await act(async () => {
-      await new Promise((resolve) => setTimeout(resolve, 100));
-    });
-
-    expect(result.current.isLoading).toBe(false);
-    expect(result.current.error).toBe(false);
-
-    expect(mockDispatch).toHaveBeenCalledWith(
-      expect.objectContaining({
-        type: expect.stringContaining('setCardPriorityToken'),
-        payload: expect.objectContaining({
-          address: '0x1234567890123456789012345678901234567890',
-          token: expect.objectContaining({
-            address: '0xToken1',
-            symbol: 'TKN1',
-            name: 'Token 1',
-            allowanceState: AllowanceState.Enabled,
-          }),
-        }),
-      }),
-    );
-
-    expect(mockDispatch).toHaveBeenCalledWith(
-      expect.objectContaining({
-        type: expect.stringContaining('setCardPriorityTokenLastFetched'),
-        payload: expect.objectContaining({
-          address: '0x1234567890123456789012345678901234567890',
-          lastFetched: expect.any(Date),
-        }),
-      }),
-    );
-
-    // Verify SDK was used to suggest a priority token
-    expect(mockGetPriorityToken).toHaveBeenCalledTimes(1);
-    expect(mockGetPriorityToken).toHaveBeenCalledWith(mockAddress, [
-      '0xToken1',
-      '0xToken2',
-    ]);
-    expect(mockTrace).toHaveBeenCalledWith({
-      name: expect.any(String),
-      op: expect.any(String),
-    });
-    expect(mockEndTrace).toHaveBeenCalledWith({
-      name: expect.any(String),
-    });
-  });
-
-  it('should handle API errors gracefully', async () => {
-    const mockError = new Error('Failed to fetch priority token');
-    mockFetchAllowances.mockRejectedValueOnce(mockError);
-
-    const { result } = renderHook(() => useGetPriorityCardToken());
-
-    await act(async () => {
-      await new Promise((resolve) => setTimeout(resolve, 100));
-    });
-
-    expect(result.current.priorityToken).toBeNull();
-    expect(result.current.isLoading).toBe(false);
-    expect(result.current.error).toBe(true);
-    expect(mockGetPriorityToken).not.toHaveBeenCalled();
-    expect(Logger.error).toHaveBeenCalledWith(
-      expect.any(Error),
-      'useGetPriorityCardToken::error fetching priority token',
-    );
-  });
-
-  it('should not fetch when SDK is not available', async () => {
-    (useCardSDK as jest.Mock).mockReturnValue({ sdk: null });
-
-    const { result } = renderHook(() => useGetPriorityCardToken());
-
-    await act(async () => {
-      await new Promise((resolve) => setTimeout(resolve, 0));
-    });
-
-    expect(result.current.priorityToken).toBeNull();
-    expect(result.current.isLoading).toBe(false);
-    expect(result.current.error).toBe(false);
-    expect(mockGetPriorityToken).not.toHaveBeenCalled();
-  });
-
-  it('should handle null response from API and fallback to first valid allowance', async () => {
-    mockFetchAllowances.mockResolvedValue(mockSDKTokensData);
-    mockGetPriorityToken.mockResolvedValue(null);
-
-    const { result } = renderHook(() => useGetPriorityCardToken());
-
-    await act(async () => {
-      await new Promise((resolve) => setTimeout(resolve, 100));
-    });
-
-    expect(mockDispatch).toHaveBeenCalledWith(
-      expect.objectContaining({
-        type: expect.stringContaining('setCardPriorityToken'),
-        payload: expect.objectContaining({
-          address: mockAddress,
-          token: expect.objectContaining({
-            address: '0xToken1',
-            symbol: 'TKN1',
-            name: 'Token 1',
-            allowanceState: AllowanceState.Enabled,
-          }),
-        }),
-      }),
-    );
-
-    expect(result.current.isLoading).toBe(false);
-    expect(result.current.error).toBe(false);
-    expect(mockGetPriorityToken).toHaveBeenCalledTimes(1);
-  });
-
-  it('should use cached token when cache is valid', async () => {
-    const now = new Date();
-    const recentTimestamp = new Date(now.getTime() - 2 * 60 * 1000); // 2 minutes ago
-    const cachedToken = {
-      address: '0xCachedToken',
-      symbol: 'CACHED',
-      name: 'Cached Token',
-      caipChainId: `eip155:${CHAIN_IDS.LINEA_MAINNET}`,
-      allowance: '1000000000000',
+  it('should return priority token from useQuery data', async () => {
+    const priorityToken: CardTokenAllowance = {
+      address: '0xToken1',
+      symbol: 'TKN1',
+      name: 'Token 1',
       decimals: 18,
       allowanceState: AllowanceState.Enabled,
-      isStaked: false,
-      chainId: CHAIN_IDS.LINEA_MAINNET,
-    } as CardTokenAllowance;
+      allowance: '1000000000000',
+      caipChainId: `eip155:${CHAIN_IDS.LINEA_MAINNET}` as `${string}:${string}`,
+    };
 
-    mockPriorityToken = cachedToken;
-    mockLastFetched = recentTimestamp;
+    mockUseQueryReturn.data = {
+      priorityToken,
+      allTokensWithAllowances: [priorityToken],
+    };
 
     const { result } = renderHook(() => useGetPriorityCardToken());
 
@@ -435,45 +264,27 @@ describe('useGetPriorityCardToken', () => {
       await new Promise((resolve) => setTimeout(resolve, 50));
     });
 
-    expect(mockGetPriorityToken).not.toHaveBeenCalled();
-
+    expect(result.current.priorityToken).toEqual(priorityToken);
+    expect(result.current.allTokensWithAllowances).toEqual([priorityToken]);
     expect(result.current.isLoading).toBe(false);
-    // And the cached token should be surfaced by the hook
-    expect(result.current.priorityToken).toEqual(
-      expect.objectContaining({
-        address: '0xCachedToken',
-        symbol: 'CACHED',
-      }),
-    );
+    expect(result.current.error).toBe(false);
   });
 
-  it('should fetch new data when cache is stale', async () => {
-    const staleTimestamp = new Date(Date.now() - 10 * 60 * 1000);
-    mockLastFetched = staleTimestamp;
+  it('should pass correct enabled flag to useQuery when unauthenticated', () => {
+    renderHook(() => useGetPriorityCardToken());
 
-    mockFetchAllowances.mockResolvedValue(mockSDKTokensData);
-    mockGetPriorityToken.mockResolvedValue(mockCardToken);
-
-    const { result } = renderHook(() => useGetPriorityCardToken());
-
-    await act(async () => {
-      await new Promise((resolve) => setTimeout(resolve, 100));
-    });
+    expect(mockUseQueryOptions.enabled).toBe(true);
+  });
 
-    expect(mockFetchAllowances).toHaveBeenCalledTimes(1);
-    expect(mockGetPriorityToken).toHaveBeenCalledTimes(1);
+  it('should disable useQuery when SDK is not available', () => {
+    (useCardSDK as jest.Mock).mockReturnValue({ sdk: null });
 
-    expect(mockDispatch).toHaveBeenCalledWith(
-      expect.objectContaining({
-        type: expect.stringContaining('setCardPriorityToken'),
-      }),
-    );
+    renderHook(() => useGetPriorityCardToken());
 
-    expect(result.current.isLoading).toBe(false);
-    expect(result.current.error).toBe(false);
+    expect(mockUseQueryOptions.enabled).toBe(false);
   });
 
-  it('should not fetch when no address is available', async () => {
+  it('should disable useQuery when no address is available', () => {
     const noAddressSelector = () => undefined;
     mockSelectSelectedInternalAccountByScope.mockReturnValue(noAddressSelector);
 
@@ -485,554 +296,453 @@ describe('useGetPriorityCardToken', () => {
       if (selector === selectSelectedInternalAccountByScope) {
         return noAddressSelector;
       }
+      if (selector === selectIsAuthenticatedCard) {
+        return false;
+      }
 
-      // Handle createSelector - return proper cardState
       if (typeof selector === 'function') {
         try {
           const mockState = {
-            card: {
-              cardholderAccounts: [],
-              isLoaded: true,
-              priorityTokensByAddress: {},
-              lastFetchedByAddress: {},
-              authenticatedPriorityToken: null,
-              authenticatedPriorityTokenLastFetched: null,
-            },
+            card: { cardholderAccounts: [], isLoaded: true },
             engine: {
               backgroundState: {
-                TokenBalancesController: {
-                  tokenBalances: {},
-                },
+                TokenBalancesController: { tokenBalances: {} },
               },
             },
             // eslint-disable-next-line @typescript-eslint/no-explicit-any
           } as unknown as any;
-
           return selector(mockState);
         } catch (_e) {
           // Fallback
         }
       }
 
-      if (selector?.toString?.().includes('selectIsAuthenticatedCard')) {
-        return false;
-      }
-
       return null;
     });
 
     const { result } = renderHook(() => useGetPriorityCardToken());
 
-    await act(async () => {
-      await new Promise((resolve) => setTimeout(resolve, 50));
-    });
-
-    expect(mockFetchAllowances).not.toHaveBeenCalled();
-    expect(mockGetPriorityToken).not.toHaveBeenCalled();
+    expect(mockUseQueryOptions.enabled).toBe(false);
+    expect(result.current.priorityToken).toBeNull();
     expect(result.current.isLoading).toBe(false);
     expect(result.current.error).toBe(false);
+  });
+
+  it('should report error when useQuery has an error', () => {
+    mockUseQueryReturn.error = new Error('Failed to fetch');
+
+    const { result } = renderHook(() => useGetPriorityCardToken());
+
+    expect(result.current.error).toBe(true);
     expect(result.current.priorityToken).toBeNull();
   });
 
-  it('should handle manual fetchPriorityToken call', async () => {
-    mockFetchAllowances.mockResolvedValue(mockSDKTokensData);
-    mockGetPriorityToken.mockResolvedValue(mockCardToken);
+  it('should report loading when useQuery is loading', () => {
+    mockUseQueryReturn.isLoading = true;
 
     const { result } = renderHook(() => useGetPriorityCardToken());
 
-    await act(async () => {
-      await new Promise((resolve) => setTimeout(resolve, 100));
+    expect(result.current.isLoading).toBe(true);
+  });
+
+  it('should return null priorityToken when useQuery returns no data', () => {
+    mockUseQueryReturn.data = undefined;
+
+    const { result } = renderHook(() => useGetPriorityCardToken());
+
+    expect(result.current.priorityToken).toBeNull();
+    expect(result.current.allTokensWithAllowances).toBeNull();
+  });
+
+  it('should handle manual fetchPriorityToken call (unauthenticated)', async () => {
+    const priorityToken: CardTokenAllowance = {
+      address: '0xToken1',
+      symbol: 'TKN1',
+      name: 'Token 1',
+      decimals: 18,
+      allowanceState: AllowanceState.Enabled,
+      allowance: '1000000000000',
+      caipChainId: `eip155:${CHAIN_IDS.LINEA_MAINNET}` as `${string}:${string}`,
+    };
+
+    mockRefetch.mockResolvedValue({
+      data: {
+        priorityToken,
+        allTokensWithAllowances: [priorityToken],
+      },
     });
 
-    mockFetchAllowances.mockClear();
-    mockGetPriorityToken.mockClear();
-    mockDispatch.mockClear();
+    const { result } = renderHook(() => useGetPriorityCardToken());
 
     let manualResult: CardTokenAllowance | null | undefined;
     await act(async () => {
       manualResult = await result.current.fetchPriorityToken();
     });
 
-    expect(manualResult).toEqual(
-      expect.objectContaining({
-        address: '0xToken1',
-        symbol: 'TKN1',
-        name: 'Token 1',
-        allowanceState: AllowanceState.Enabled,
-      }),
-    );
-    expect(mockFetchAllowances).toHaveBeenCalledTimes(1);
-    expect(mockGetPriorityToken).toHaveBeenCalledTimes(1);
-    expect(mockDispatch).toHaveBeenCalledTimes(2);
+    expect(manualResult).toEqual(priorityToken);
+    expect(mockRefetch).toHaveBeenCalledTimes(1);
   });
 
-  it('should return fallback token when no allowances are returned', async () => {
-    mockFetchAllowances.mockResolvedValue([]);
+  describe('queryFn logic', () => {
+    it('should fetch allowances and determine priority token via queryFn', async () => {
+      mockFetchAllowances.mockResolvedValue(mockSDKTokensData);
+      mockGetPriorityToken.mockResolvedValue(mockCardToken);
 
-    const { result } = renderHook(() => useGetPriorityCardToken());
+      renderHook(() => useGetPriorityCardToken());
 
-    await act(async () => {
-      await new Promise((resolve) => setTimeout(resolve, 100));
-    });
+      const queryFn = mockUseQueryOptions.queryFn as () => Promise<unknown>;
+      expect(queryFn).toBeDefined();
 
-    expect(mockDispatch).toHaveBeenCalledWith(
-      expect.objectContaining({
-        type: expect.stringContaining('setCardPriorityToken'),
-        payload: expect.objectContaining({
-          address: mockAddress,
-          token: expect.objectContaining({
+      const queryResult = await queryFn();
+
+      expect(mockFetchAllowances).toHaveBeenCalledTimes(1);
+      expect(mockGetPriorityToken).toHaveBeenCalledTimes(1);
+      expect(mockGetPriorityToken).toHaveBeenCalledWith(mockAddress, [
+        '0xToken1',
+        '0xToken2',
+      ]);
+      expect(queryResult).toEqual(
+        expect.objectContaining({
+          priorityToken: expect.objectContaining({
             address: '0xToken1',
             symbol: 'TKN1',
-            name: 'Token 1',
-            allowanceState: AllowanceState.NotEnabled,
-            isStaked: false,
-            caipChainId: expect.any(String),
+            allowanceState: AllowanceState.Enabled,
           }),
+          allTokensWithAllowances: expect.any(Array),
         }),
-      }),
-    );
+      );
+    });
 
-    expect(result.current.isLoading).toBe(false);
-    expect(result.current.error).toBe(false);
-    expect(mockGetPriorityToken).not.toHaveBeenCalled();
-  });
+    it('should return fallback token when no allowances are returned', async () => {
+      mockFetchAllowances.mockResolvedValue([]);
 
-  it('should return null when no allowances and no supported tokens exist', async () => {
-    mockFetchAllowances.mockResolvedValue([]);
-    (useCardSDK as jest.Mock).mockReturnValue({
-      sdk: {
-        ...mockSDK,
-        supportedTokens: [],
-        getSupportedTokensByChainId: jest.fn(() => []),
-      },
+      renderHook(() => useGetPriorityCardToken());
+
+      const queryFn = mockUseQueryOptions.queryFn as () => Promise<unknown>;
+      const queryResult = (await queryFn()) as {
+        priorityToken: CardTokenAllowance;
+        allTokensWithAllowances: CardTokenAllowance[];
+      };
+
+      expect(queryResult.priorityToken).toEqual(
+        expect.objectContaining({
+          address: '0xToken1',
+          symbol: 'TKN1',
+          name: 'Token 1',
+          allowanceState: AllowanceState.NotEnabled,
+          isStaked: false,
+        }),
+      );
+      expect(queryResult.allTokensWithAllowances).toEqual([]);
+      expect(mockGetPriorityToken).not.toHaveBeenCalled();
     });
 
-    const { result } = renderHook(() => useGetPriorityCardToken());
+    it('should return null when no allowances and no supported tokens exist', async () => {
+      mockFetchAllowances.mockResolvedValue([]);
+      (useCardSDK as jest.Mock).mockReturnValue({
+        sdk: {
+          ...mockSDK,
+          supportedTokens: [],
+          getSupportedTokensByChainId: jest.fn(() => []),
+        },
+      });
 
-    await act(async () => {
-      await new Promise((resolve) => setTimeout(resolve, 100));
+      renderHook(() => useGetPriorityCardToken());
+
+      const queryFn = mockUseQueryOptions.queryFn as () => Promise<unknown>;
+      const queryResult = (await queryFn()) as {
+        priorityToken: null;
+        allTokensWithAllowances: CardTokenAllowance[];
+      };
+
+      expect(queryResult.priorityToken).toBeNull();
+      expect(queryResult.allTokensWithAllowances).toEqual([]);
+      expect(mockGetPriorityToken).not.toHaveBeenCalled();
     });
 
-    expect(mockDispatch).toHaveBeenCalledWith(
-      expect.objectContaining({
-        type: expect.stringContaining('setCardPriorityToken'),
-        payload: expect.objectContaining({
-          address: mockAddress,
-          token: null,
-        }),
-      }),
-    );
+    it('should return first token when all allowances have zero balance', async () => {
+      const zeroAllowanceTokens = [
+        createMockSDKTokenData('0xToken1', '0'),
+        createMockSDKTokenData('0xToken2', '0'),
+      ];
 
-    expect(result.current.isLoading).toBe(false);
-    expect(result.current.error).toBe(false);
-    expect(mockGetPriorityToken).not.toHaveBeenCalled();
-  });
+      mockFetchAllowances.mockResolvedValue(zeroAllowanceTokens);
 
-  it('should return first token when all allowances have zero balance', async () => {
-    const zeroAllowanceTokens = [
-      createMockSDKTokenData('0xToken1', '0'),
-      createMockSDKTokenData('0xToken2', '0'),
-    ];
+      renderHook(() => useGetPriorityCardToken());
 
-    mockFetchAllowances.mockResolvedValue(zeroAllowanceTokens);
+      const queryFn = mockUseQueryOptions.queryFn as () => Promise<unknown>;
+      const queryResult = (await queryFn()) as {
+        priorityToken: CardTokenAllowance;
+        allTokensWithAllowances: CardTokenAllowance[];
+      };
 
-    const { result } = renderHook(() => useGetPriorityCardToken());
+      expect(queryResult.priorityToken).toEqual(
+        expect.objectContaining({
+          address: '0xToken1',
+          symbol: 'TKN1',
+          allowanceState: AllowanceState.NotEnabled,
+        }),
+      );
+      expect(mockGetPriorityToken).not.toHaveBeenCalled();
+    });
 
-    await act(async () => {
-      await new Promise((resolve) => setTimeout(resolve, 100));
+    it('should handle null response from API and fallback to first valid allowance', async () => {
+      mockFetchAllowances.mockResolvedValue(mockSDKTokensData);
+      mockGetPriorityToken.mockResolvedValue(null);
+
+      renderHook(() => useGetPriorityCardToken());
+
+      const queryFn = mockUseQueryOptions.queryFn as () => Promise<unknown>;
+      const queryResult = (await queryFn()) as {
+        priorityToken: CardTokenAllowance;
+      };
+
+      expect(queryResult.priorityToken).toEqual(
+        expect.objectContaining({
+          address: '0xToken1',
+          symbol: 'TKN1',
+          allowanceState: AllowanceState.Enabled,
+        }),
+      );
     });
 
-    expect(mockDispatch).toHaveBeenCalledWith(
-      expect.objectContaining({
-        type: expect.stringContaining('setCardPriorityToken'),
-        payload: expect.objectContaining({
-          address: mockAddress,
-          token: expect.objectContaining({
-            address: '0xToken1',
-            symbol: 'TKN1',
-            name: 'Token 1',
-            allowanceState: AllowanceState.NotEnabled,
-          }),
+    it('should handle tokens with limited allowance', async () => {
+      const limitedAllowanceTokens = [
+        createMockSDKTokenData('0xToken1', '1000'),
+        createMockSDKTokenData('0xToken2', '2000'),
+      ];
+
+      mockFetchAllowances.mockResolvedValue(limitedAllowanceTokens);
+      mockGetPriorityToken.mockResolvedValue(mockCardToken);
+
+      renderHook(() => useGetPriorityCardToken());
+
+      const queryFn = mockUseQueryOptions.queryFn as () => Promise<unknown>;
+      const queryResult = (await queryFn()) as {
+        priorityToken: CardTokenAllowance;
+      };
+
+      expect(queryResult.priorityToken).toEqual(
+        expect.objectContaining({
+          address: '0xToken1',
+          symbol: 'TKN1',
+          allowanceState: AllowanceState.Limited,
         }),
-      }),
-    );
+      );
+    });
 
-    expect(result.current.isLoading).toBe(false);
-    expect(result.current.error).toBe(false);
-    expect(mockGetPriorityToken).not.toHaveBeenCalled();
-  });
+    it('should handle unsupported token filtering', async () => {
+      const unsupportedTokenAllowances = [
+        createMockSDKTokenData('0xUnsupportedToken', '1000000000000'),
+      ];
 
-  it('should fallback to token with positive balance when suggested token has zero balance', async () => {
-    const tokenWithZeroBalanceSDK = createMockSDKTokenData(
-      '0xZeroBalance',
-      '1000000000000',
-    );
-    const tokenWithPositiveBalanceSDK = createMockSDKTokenData(
-      '0xToken2',
-      '500000000000',
-    );
-    const allowancesWithZeroBalance = [
-      tokenWithZeroBalanceSDK,
-      tokenWithPositiveBalanceSDK,
-    ];
+      mockFetchAllowances.mockResolvedValue(unsupportedTokenAllowances);
 
-    const suggestedTokenWithZeroBalance = {
-      address: '0xZeroBalance',
-      symbol: 'ZERO',
-      name: 'Zero Balance Token',
-      decimals: 18,
-    };
+      renderHook(() => useGetPriorityCardToken());
 
-    const customTokenBalances = {
-      [mockAddress.toLowerCase()]: {
-        '0x1': {
-          '0xZeroBalance': '0',
-          '0xToken2': '500000000000000000',
-        },
-      },
-    };
+      const queryFn = mockUseQueryOptions.queryFn as () => Promise<unknown>;
+      const queryResult = (await queryFn()) as {
+        priorityToken: CardTokenAllowance;
+      };
 
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    mockUseSelector.mockImplementation((selector: any) => {
-      if (selector === selectAllTokenBalances) {
-        return customTokenBalances;
-      }
-      if (selector === selectSelectedInternalAccountByScope) {
-        return (scope: string) => {
-          if (scope === 'eip155:0') {
-            return {
-              address: mockAddress,
-              id: 'test-account-id',
-              type: 'eip155:eoa' as const,
-              options: {},
-              metadata: {},
-              methods: [],
-            };
-          }
-          return undefined;
-        };
-      }
-
-      // Handle createSelector - return proper cardState
-      if (typeof selector === 'function') {
-        try {
-          const mockState = {
-            card: {
-              cardholderAccounts: [],
-              isLoaded: true,
-              priorityTokensByAddress: {
-                [mockAddress.toLowerCase()]: mockPriorityToken,
-              },
-              lastFetchedByAddress: {
-                [mockAddress.toLowerCase()]: mockLastFetched,
-              },
-              authenticatedPriorityToken: null,
-              authenticatedPriorityTokenLastFetched: null,
-            },
-            engine: {
-              backgroundState: {
-                TokenBalancesController: {
-                  tokenBalances: customTokenBalances,
-                },
-              },
-            },
-            // eslint-disable-next-line @typescript-eslint/no-explicit-any
-          } as unknown as any;
-
-          return selector(mockState);
-        } catch (_e) {
-          // Fallback
-        }
-      }
-
-      const selectorString = selector?.toString?.() || '';
-      if (
-        selectorString.includes('selectCardPriorityToken') &&
-        !selectorString.includes('LastFetched')
-      ) {
-        return mockPriorityToken;
-      }
-      if (selectorString.includes('selectCardPriorityTokenLastFetched')) {
-        return mockLastFetched;
-      }
-      if (selectorString.includes('selectIsAuthenticatedCard')) {
-        return false;
-      }
-      return null;
-    });
-
-    mockFetchAllowances.mockResolvedValue(allowancesWithZeroBalance);
-    mockGetPriorityToken.mockResolvedValue(suggestedTokenWithZeroBalance);
-
-    const { result } = renderHook(() => useGetPriorityCardToken());
-
-    await act(async () => {
-      await new Promise((resolve) => setTimeout(resolve, 100));
-    });
-
-    expect(mockDispatch).toHaveBeenCalledWith(
-      expect.objectContaining({
-        type: expect.stringContaining('setCardPriorityToken'),
-        payload: expect.objectContaining({
-          address: expect.any(String),
-          token: expect.objectContaining({
-            address: '0xToken2',
-            symbol: 'TKN2',
-            name: 'Token 2',
-            allowanceState: AllowanceState.Enabled,
-          }),
+      expect(queryResult.priorityToken).toEqual(
+        expect.objectContaining({
+          address: '0xToken1',
+          allowanceState: AllowanceState.NotEnabled,
         }),
-      }),
-    );
-    expect(result.current.isLoading).toBe(false);
-    expect(result.current.error).toBe(false);
-  });
-
-  it('should return suggested token even with zero balance if no other token has positive balance', async () => {
-    const tokenWithZeroBalance1SDK = createMockSDKTokenData(
-      '0xToken1',
-      '1000000000000',
-    );
-    const tokenWithZeroBalance2SDK = createMockSDKTokenData(
-      '0xToken2',
-      '500000000000',
-    );
-    const allowancesWithZeroBalance = [
-      tokenWithZeroBalance1SDK,
-      tokenWithZeroBalance2SDK,
-    ];
-
-    const suggestedTokenWithZeroBalance = {
-      address: '0xToken1',
-      symbol: 'TKN1',
-      name: 'Token 1',
-      decimals: 18,
-    };
+      );
+    });
 
-    const zeroBalanceTokens = {
-      [mockAddress.toLowerCase()]: {
-        '0x1': {
-          '0xToken1': '0',
-          '0xToken2': '0',
+    it('should fallback to token with positive balance when suggested token has zero balance', async () => {
+      const customTokenBalances = {
+        [mockAddress.toLowerCase()]: {
+          '0x1': {
+            '0xZeroBalance': '0',
+            '0xToken2': '500000000000000000',
+          },
         },
-      },
-    };
+      };
 
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    mockUseSelector.mockImplementation((selector: any) => {
-      if (selector === selectAllTokenBalances) {
-        return zeroBalanceTokens;
-      }
-      if (selector === selectSelectedInternalAccountByScope) {
-        return (scope: string) => {
-          if (scope === 'eip155:0') {
-            return {
-              address: mockAddress,
-              id: 'test-account-id',
-              type: 'eip155:eoa' as const,
-              options: {},
-              metadata: {},
-              methods: [],
-            };
-          }
-          return undefined;
-        };
-      }
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      mockUseSelector.mockImplementation((selector: any) => {
+        if (selector === selectAllTokenBalances) {
+          return customTokenBalances;
+        }
+        if (selector === selectSelectedInternalAccountByScope) {
+          return (scope: string) => {
+            if (scope === 'eip155:0') {
+              return {
+                address: mockAddress,
+                id: 'test-account-id',
+                type: 'eip155:eoa' as const,
+                options: {},
+                metadata: {},
+                methods: [],
+              };
+            }
+            return undefined;
+          };
+        }
+        if (selector === selectIsAuthenticatedCard) {
+          return false;
+        }
 
-      // Handle createSelector - return proper cardState
-      if (typeof selector === 'function') {
-        try {
-          const mockState = {
-            card: {
-              cardholderAccounts: [],
-              isLoaded: true,
-              priorityTokensByAddress: {
-                [mockAddress.toLowerCase()]: mockPriorityToken,
-              },
-              lastFetchedByAddress: {
-                [mockAddress.toLowerCase()]: mockLastFetched,
-              },
-              authenticatedPriorityToken: null,
-              authenticatedPriorityTokenLastFetched: null,
-            },
-            engine: {
-              backgroundState: {
-                TokenBalancesController: {
-                  tokenBalances: zeroBalanceTokens,
+        if (typeof selector === 'function') {
+          try {
+            const mockState = {
+              card: { cardholderAccounts: [], isLoaded: true },
+              engine: {
+                backgroundState: {
+                  TokenBalancesController: {
+                    tokenBalances: customTokenBalances,
+                  },
                 },
               },
-            },
-            // eslint-disable-next-line @typescript-eslint/no-explicit-any
-          } as unknown as any;
-
-          return selector(mockState);
-        } catch (_e) {
-          // Fallback
+              // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            } as unknown as any;
+            return selector(mockState);
+          } catch (_e) {
+            // Fallback
+          }
         }
-      }
-
-      const selectorString = selector?.toString?.() || '';
-      if (
-        selectorString.includes('selectCardPriorityToken') &&
-        !selectorString.includes('LastFetched')
-      ) {
-        return mockPriorityToken;
-      }
-      if (selectorString.includes('selectCardPriorityTokenLastFetched')) {
-        return mockLastFetched;
-      }
-      if (selectorString.includes('selectIsAuthenticatedCard')) {
-        return false;
-      }
-      return null;
-    });
-
-    mockFetchAllowances.mockResolvedValue(allowancesWithZeroBalance);
-    mockGetPriorityToken.mockResolvedValue(suggestedTokenWithZeroBalance);
-
-    const { result } = renderHook(() => useGetPriorityCardToken());
-
-    await act(async () => {
-      await new Promise((resolve) => setTimeout(resolve, 100));
-    });
-
-    expect(mockDispatch).toHaveBeenCalledWith(
-      expect.objectContaining({
-        type: expect.stringContaining('setCardPriorityToken'),
-        payload: expect.objectContaining({
-          address: expect.any(String),
-          token: expect.objectContaining({
-            address: '0xToken1',
-            symbol: 'TKN1',
-            name: 'Token 1',
-            allowanceState: AllowanceState.Enabled,
-          }),
-        }),
-      }),
-    );
-    expect(result.current.isLoading).toBe(false);
-    expect(result.current.error).toBe(false);
-  });
-
-  it('should handle loading state correctly during fetch', async () => {
-    // Use deferred promises to control timing
-    let resolveAllowances: (value: typeof mockSDKTokensData) => void;
-    let resolvePriorityToken: (value: CardToken) => void;
 
-    const allowancesPromise = new Promise<typeof mockSDKTokensData>(
-      (resolve) => {
-        resolveAllowances = resolve;
-      },
-    );
-    const priorityTokenPromise = new Promise<CardToken>((resolve) => {
-      resolvePriorityToken = resolve;
-    });
+        return null;
+      });
 
-    mockFetchAllowances.mockReturnValue(allowancesPromise);
-    mockGetPriorityToken.mockReturnValue(priorityTokenPromise);
+      const tokenWithZeroBalanceSDK = createMockSDKTokenData(
+        '0xZeroBalance',
+        '1000000000000',
+      );
+      const tokenWithPositiveBalanceSDK = createMockSDKTokenData(
+        '0xToken2',
+        '500000000000',
+      );
 
-    const { result } = renderHook(() => useGetPriorityCardToken());
+      mockFetchAllowances.mockResolvedValue([
+        tokenWithZeroBalanceSDK,
+        tokenWithPositiveBalanceSDK,
+      ]);
+      mockGetPriorityToken.mockResolvedValue({
+        address: '0xZeroBalance',
+        symbol: 'ZERO',
+        name: 'Zero Balance Token',
+        decimals: 18,
+      });
 
-    // Wait for initial effect to trigger
-    await act(async () => {
-      await new Promise((resolve) => setTimeout(resolve, 10));
-    });
+      renderHook(() => useGetPriorityCardToken());
 
-    // Should be loading while fetching allowances
-    expect(result.current.isLoading).toBe(true);
+      const queryFn = mockUseQueryOptions.queryFn as () => Promise<unknown>;
+      const queryResult = (await queryFn()) as {
+        priorityToken: CardTokenAllowance;
+      };
 
-    // Resolve allowances
-    await act(async () => {
-      resolveAllowances(mockSDKTokensData);
-      await new Promise((resolve) => setTimeout(resolve, 10));
+      expect(queryResult.priorityToken).toEqual(
+        expect.objectContaining({
+          address: '0xToken2',
+          symbol: 'TKN2',
+          allowanceState: AllowanceState.Enabled,
+        }),
+      );
     });
 
-    // Still loading while fetching priority token
-    expect(result.current.isLoading).toBe(true);
+    it('should return suggested token even with zero balance if no other token has positive balance', async () => {
+      const zeroBalanceTokens = {
+        [mockAddress.toLowerCase()]: {
+          '0x1': {
+            '0xToken1': '0',
+            '0xToken2': '0',
+          },
+        },
+      };
 
-    // Resolve priority token
-    await act(async () => {
-      resolvePriorityToken(mockCardToken);
-      await new Promise((resolve) => setTimeout(resolve, 10));
-    });
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      mockUseSelector.mockImplementation((selector: any) => {
+        if (selector === selectAllTokenBalances) {
+          return zeroBalanceTokens;
+        }
+        if (selector === selectSelectedInternalAccountByScope) {
+          return (scope: string) => {
+            if (scope === 'eip155:0') {
+              return {
+                address: mockAddress,
+                id: 'test-account-id',
+                type: 'eip155:eoa' as const,
+                options: {},
+                metadata: {},
+                methods: [],
+              };
+            }
+            return undefined;
+          };
+        }
+        if (selector === selectIsAuthenticatedCard) {
+          return false;
+        }
 
-    // Should be done loading
-    expect(result.current.isLoading).toBe(false);
-  });
+        if (typeof selector === 'function') {
+          try {
+            const mockState = {
+              card: { cardholderAccounts: [], isLoaded: true },
+              engine: {
+                backgroundState: {
+                  TokenBalancesController: {
+                    tokenBalances: zeroBalanceTokens,
+                  },
+                },
+              },
+              // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            } as unknown as any;
+            return selector(mockState);
+          } catch (_e) {
+            // Fallback
+          }
+        }
 
-  it('should handle tokens with limited allowance', async () => {
-    const limitedAllowanceTokens = [
-      createMockSDKTokenData('0xToken1', '1000'),
-      createMockSDKTokenData('0xToken2', '2000'),
-    ];
+        return null;
+      });
 
-    mockFetchAllowances.mockResolvedValue(limitedAllowanceTokens);
-    mockGetPriorityToken.mockResolvedValue(mockCardToken);
+      mockFetchAllowances.mockResolvedValue(mockSDKTokensData);
+      mockGetPriorityToken.mockResolvedValue({
+        address: '0xToken1',
+        symbol: 'TKN1',
+        name: 'Token 1',
+        decimals: 18,
+      });
 
-    const { result } = renderHook(() => useGetPriorityCardToken());
+      renderHook(() => useGetPriorityCardToken());
 
-    await act(async () => {
-      await new Promise((resolve) => setTimeout(resolve, 100));
-    });
+      const queryFn = mockUseQueryOptions.queryFn as () => Promise<unknown>;
+      const queryResult = (await queryFn()) as {
+        priorityToken: CardTokenAllowance;
+      };
 
-    expect(mockDispatch).toHaveBeenCalledWith(
-      expect.objectContaining({
-        type: expect.stringContaining('setCardPriorityToken'),
-        payload: expect.objectContaining({
-          address: mockAddress,
-          token: expect.objectContaining({
-            address: '0xToken1',
-            symbol: 'TKN1',
-            name: 'Token 1',
-            allowanceState: AllowanceState.Limited,
-          }),
+      expect(queryResult.priorityToken).toEqual(
+        expect.objectContaining({
+          address: '0xToken1',
+          symbol: 'TKN1',
+          allowanceState: AllowanceState.Enabled,
         }),
-      }),
-    );
-
-    expect(result.current.isLoading).toBe(false);
-    expect(result.current.error).toBe(false);
-  });
-
-  it('should handle unsupported token filtering', async () => {
-    const unsupportedTokenAllowances = [
-      createMockSDKTokenData('0xUnsupportedToken', '1000000000000'),
-    ];
+      );
+    });
 
-    mockFetchAllowances.mockResolvedValue(unsupportedTokenAllowances);
+    it('should throw when SDK or selectedAddress not available', async () => {
+      (useCardSDK as jest.Mock).mockReturnValue({ sdk: null });
 
-    const { result } = renderHook(() => useGetPriorityCardToken());
+      renderHook(() => useGetPriorityCardToken());
 
-    await act(async () => {
-      await new Promise((resolve) => setTimeout(resolve, 100));
+      const queryFn = mockUseQueryOptions.queryFn as () => Promise<unknown>;
+      await expect(queryFn()).rejects.toThrow(
+        'SDK or selectedAddress not available',
+      );
     });
-
-    expect(mockDispatch).toHaveBeenCalledWith(
-      expect.objectContaining({
-        type: expect.stringContaining('setCardPriorityToken'),
-        payload: expect.objectContaining({
-          address: mockAddress,
-          token: expect.objectContaining({
-            address: '0xToken1',
-            allowanceState: AllowanceState.NotEnabled,
-          }),
-        }),
-      }),
-    );
-    expect(result.current.isLoading).toBe(false);
-    expect(result.current.error).toBe(false);
   });
 
-  describe('Authenticated Card - fetchPriorityTokenAPI', () => {
+  describe('Authenticated Card - externalWalletDetailsData derivation', () => {
     beforeEach(() => {
       jest.clearAllMocks();
       mockGetPriorityToken.mockReset();
       mockFetchAllowances.mockReset();
-      mockDispatch.mockReset();
-
-      mockDispatch.mockImplementation((action) => action);
 
-      // Set up authenticated state - this is the key!
       mockSelectIsAuthenticatedCard.mockReturnValue(true);
 
       const mockAccountSelector = (scope: string) => {
@@ -1059,544 +769,13 @@ describe('useGetPriorityCardToken', () => {
       // eslint-disable-next-line @typescript-eslint/no-explicit-any
       mockSelectAllTokenBalances.mockReturnValue(mockTokenBalances as any);
 
-      // Set up authenticated state in useSelector
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      mockUseSelector.mockImplementation((selector: any) => {
-        if (selector === selectAllTokenBalances) {
-          return mockTokenBalances;
-        }
-        if (selector === selectSelectedInternalAccountByScope) {
-          return mockAccountSelector;
-        }
-        if (selector === selectIsAuthenticatedCard) {
-          return true;
-        }
-
-        if (typeof selector === 'function') {
-          try {
-            const mockState = {
-              card: {
-                cardholderAccounts: [],
-                isLoaded: true,
-                priorityTokensByAddress: {},
-                lastFetchedByAddress: {},
-                authenticatedPriorityToken: null,
-                authenticatedPriorityTokenLastFetched: null,
-              },
-              engine: {
-                backgroundState: {
-                  TokenBalancesController: {
-                    tokenBalances: mockTokenBalances,
-                  },
-                },
-              },
-              // eslint-disable-next-line @typescript-eslint/no-explicit-any
-            } as unknown as any;
-
-            return selector(mockState);
-          } catch (_e) {
-            // Fallback
-          }
-        }
-
-        return null;
-      });
-
-      const { useDispatch: useDispatchMock } = jest.requireMock('react-redux');
-      useDispatchMock.mockReturnValue(mockDispatch);
-
-      // Ensure SDK is not in loading state
-      (useCardSDK as jest.Mock).mockReturnValue({
-        sdk: {
-          ...mockSDK,
-          getCardExternalWalletDetails: jest.fn().mockResolvedValue([]),
-        },
-        isLoading: false,
-      });
-    });
-
-    it('fetches and returns authenticated priority token with correct allowance state', async () => {
-      const priorityWalletDetail: CardTokenAllowance = {
-        address: '0xToken1',
-        symbol: 'TKN1',
-        name: 'Token 1',
-        decimals: 18,
-        allowance: '1000000000000',
-        allowanceState: AllowanceState.Enabled,
-        walletAddress: '0xWallet123',
-        caipChainId:
-          `eip155:${CHAIN_IDS.LINEA_MAINNET}` as `${string}:${string}`,
-      };
-
-      const externalWalletDetailsData = {
-        priorityWalletDetail,
-        mappedWalletDetails: [priorityWalletDetail],
-      };
-
-      const { result } = renderHook(() =>
-        useGetPriorityCardToken(externalWalletDetailsData),
-      );
-
-      await act(async () => {
-        await new Promise((resolve) => setTimeout(resolve, 100));
-      });
-
-      expect(mockDispatch).toHaveBeenCalledWith(
-        expect.objectContaining({
-          type: expect.stringContaining('setAuthenticatedPriorityToken'),
-          payload: expect.objectContaining({
-            address: '0xToken1',
-            symbol: 'TKN1',
-            name: 'Token 1',
-            allowanceState: AllowanceState.Enabled,
-            walletAddress: '0xWallet123',
-            caipChainId: expect.any(String),
-          }),
-        }),
-      );
-
-      expect(mockDispatch).toHaveBeenCalledWith(
-        expect.objectContaining({
-          type: expect.stringContaining(
-            'setAuthenticatedPriorityTokenLastFetched',
-          ),
-          payload: expect.any(Date),
-        }),
-      );
-
-      expect(result.current.isLoading).toBe(false);
-      expect(result.current.error).toBe(false);
-      expect(result.current.warning).toBeNull();
-    });
-
-    it('handles empty wallet details and sets NeedDelegation warning', async () => {
-      const externalWalletDetailsData = {
-        priorityWalletDetail: null,
-        mappedWalletDetails: [],
-      };
-
-      const { result } = renderHook(() =>
-        useGetPriorityCardToken(externalWalletDetailsData),
-      );
-
-      await act(async () => {
-        await new Promise((resolve) => setTimeout(resolve, 100));
-      });
-
-      expect(mockDispatch).toHaveBeenCalledWith(
-        expect.objectContaining({
-          type: expect.stringContaining('setAuthenticatedPriorityToken'),
-          payload: null,
-        }),
-      );
-
-      expect(result.current.warning).toBe('need_delegation');
-      expect(result.current.isLoading).toBe(false);
-      expect(result.current.error).toBe(false);
-    });
-
-    it('handles wallet detail without token details', async () => {
-      const externalWalletDetailsData = {
-        priorityWalletDetail: null,
-        mappedWalletDetails: [],
-      };
-
-      const { result } = renderHook(() =>
-        useGetPriorityCardToken(externalWalletDetailsData),
-      );
-
-      await act(async () => {
-        await new Promise((resolve) => setTimeout(resolve, 100));
-      });
-
-      expect(mockDispatch).toHaveBeenCalledWith(
-        expect.objectContaining({
-          type: expect.stringContaining('setAuthenticatedPriorityToken'),
-          payload: null,
-        }),
-      );
-
-      expect(result.current.warning).toBe('need_delegation');
-    });
-
-    it('selects first wallet with balance when first has no balance property', async () => {
-      const priorityWalletDetail: CardTokenAllowance = {
-        address: '0xToken2',
-        symbol: 'TKN2',
-        name: 'Token 2',
-        decimals: 18,
-        allowance: '1000000000000',
-        allowanceState: AllowanceState.Enabled,
-        walletAddress: '0xWallet123',
-        caipChainId:
-          `eip155:${CHAIN_IDS.LINEA_MAINNET}` as `${string}:${string}`,
-      };
-
-      const externalWalletDetailsData = {
-        priorityWalletDetail,
-        mappedWalletDetails: [priorityWalletDetail],
-      };
-
-      const { result } = renderHook(() =>
-        useGetPriorityCardToken(externalWalletDetailsData),
-      );
-
-      await act(async () => {
-        await new Promise((resolve) => setTimeout(resolve, 100));
-      });
-
-      expect(mockDispatch).toHaveBeenCalledWith(
-        expect.objectContaining({
-          type: expect.stringContaining('setAuthenticatedPriorityToken'),
-          payload: expect.objectContaining({
-            address: '0xToken2',
-            symbol: 'TKN2',
-          }),
-        }),
-      );
-
-      expect(result.current.isLoading).toBe(false);
-      expect(result.current.error).toBe(false);
-    });
-
-    it('skips wallets with zero balance and selects wallet with positive balance', async () => {
-      const priorityWalletDetail: CardTokenAllowance = {
-        address: '0xToken3',
-        symbol: 'TKN3',
-        name: 'Token 3',
-        decimals: 18,
-        allowance: '1000000000000',
-        allowanceState: AllowanceState.Enabled,
-        walletAddress: '0xWallet123',
-        caipChainId:
-          `eip155:${CHAIN_IDS.LINEA_MAINNET}` as `${string}:${string}`,
-      };
-
-      const externalWalletDetailsData = {
-        priorityWalletDetail,
-        mappedWalletDetails: [priorityWalletDetail],
-      };
-
-      const { result } = renderHook(() =>
-        useGetPriorityCardToken(externalWalletDetailsData),
-      );
-
-      await act(async () => {
-        await new Promise((resolve) => setTimeout(resolve, 100));
-      });
-
-      expect(mockDispatch).toHaveBeenCalledWith(
-        expect.objectContaining({
-          type: expect.stringContaining('setAuthenticatedPriorityToken'),
-          payload: expect.objectContaining({
-            address: '0xToken3',
-            symbol: 'TKN3',
-          }),
-        }),
-      );
-
-      expect(result.current.isLoading).toBe(false);
-      expect(result.current.error).toBe(false);
-    });
-
-    it('skips wallets with non-numeric balance and selects wallet with valid balance', async () => {
-      const priorityWalletDetail: CardTokenAllowance = {
-        address: '0xToken3',
-        symbol: 'TKN3',
-        name: 'Token 3',
-        decimals: 18,
-        allowance: '5000000000000',
-        allowanceState: AllowanceState.Enabled,
-        walletAddress: '0xWallet123',
-        caipChainId:
-          `eip155:${CHAIN_IDS.LINEA_MAINNET}` as `${string}:${string}`,
-      };
-
-      const externalWalletDetailsData = {
-        priorityWalletDetail,
-        mappedWalletDetails: [priorityWalletDetail],
-      };
-
-      const { result } = renderHook(() =>
-        useGetPriorityCardToken(externalWalletDetailsData),
-      );
-
-      await act(async () => {
-        await new Promise((resolve) => setTimeout(resolve, 100));
-      });
-
-      expect(mockDispatch).toHaveBeenCalledWith(
-        expect.objectContaining({
-          type: expect.stringContaining('setAuthenticatedPriorityToken'),
-          payload: expect.objectContaining({
-            address: '0xToken3',
-            symbol: 'TKN3',
-          }),
-        }),
-      );
-
-      expect(result.current.isLoading).toBe(false);
-      expect(result.current.error).toBe(false);
-    });
-
-    it('maps NotEnabled allowance state when allowance is zero', async () => {
-      const priorityWalletDetail: CardTokenAllowance = {
-        address: '0xToken1',
-        symbol: 'TKN1',
-        name: 'Token 1',
-        decimals: 18,
-        allowance: '0',
-        allowanceState: AllowanceState.NotEnabled,
-        walletAddress: '0xWallet123',
-        caipChainId:
-          `eip155:${CHAIN_IDS.LINEA_MAINNET}` as `${string}:${string}`,
-      };
-
-      const externalWalletDetailsData = {
-        priorityWalletDetail,
-        mappedWalletDetails: [priorityWalletDetail],
-      };
-
-      const { result } = renderHook(() =>
-        useGetPriorityCardToken(externalWalletDetailsData),
-      );
-
-      await act(async () => {
-        await new Promise((resolve) => setTimeout(resolve, 100));
-      });
-
-      expect(mockDispatch).toHaveBeenCalledWith(
-        expect.objectContaining({
-          type: expect.stringContaining('setAuthenticatedPriorityToken'),
-          payload: expect.objectContaining({
-            allowanceState: AllowanceState.NotEnabled,
-          }),
-        }),
-      );
-
-      expect(result.current.isLoading).toBe(false);
-      expect(result.current.error).toBe(false);
-    });
-
-    it('maps Limited allowance state when allowance is less than arbitrary limit', async () => {
-      const priorityWalletDetail: CardTokenAllowance = {
-        address: '0xToken1',
-        symbol: 'TKN1',
-        name: 'Token 1',
-        decimals: 18,
-        allowance: '5000',
-        allowanceState: AllowanceState.Limited,
-        walletAddress: '0xWallet123',
-        caipChainId:
-          `eip155:${CHAIN_IDS.LINEA_MAINNET}` as `${string}:${string}`,
-      };
-
-      const externalWalletDetailsData = {
-        priorityWalletDetail,
-        mappedWalletDetails: [priorityWalletDetail],
-      };
-
-      const { result } = renderHook(() =>
-        useGetPriorityCardToken(externalWalletDetailsData),
-      );
-
-      await act(async () => {
-        await new Promise((resolve) => setTimeout(resolve, 100));
-      });
-
-      expect(mockDispatch).toHaveBeenCalledWith(
-        expect.objectContaining({
-          type: expect.stringContaining('setAuthenticatedPriorityToken'),
-          payload: expect.objectContaining({
-            allowanceState: AllowanceState.Limited,
-          }),
-        }),
-      );
-
-      expect(result.current.isLoading).toBe(false);
-      expect(result.current.error).toBe(false);
-    });
-
-    it('calculates available balance as minimum of balance and allowance', async () => {
-      const priorityWalletDetail: CardTokenAllowance = {
-        address: '0xToken1',
-        symbol: 'TKN1',
-        name: 'Token 1',
-        decimals: 18,
-        allowance: '5000',
-        allowanceState: AllowanceState.Limited,
-        walletAddress: '0xWallet123',
-        caipChainId:
-          `eip155:${CHAIN_IDS.LINEA_MAINNET}` as `${string}:${string}`,
-        availableBalance: '5000',
-      };
-
-      const externalWalletDetailsData = {
-        priorityWalletDetail,
-        mappedWalletDetails: [priorityWalletDetail],
-      };
-
-      const { result } = renderHook(() =>
-        useGetPriorityCardToken(externalWalletDetailsData),
-      );
-
-      await act(async () => {
-        await new Promise((resolve) => setTimeout(resolve, 100));
-      });
-
-      expect(mockDispatch).toHaveBeenCalledWith(
-        expect.objectContaining({
-          type: expect.stringContaining('setAuthenticatedPriorityToken'),
-          payload: expect.objectContaining({
-            availableBalance: '5000',
-          }),
-        }),
-      );
-
-      expect(result.current.isLoading).toBe(false);
-      expect(result.current.error).toBe(false);
-    });
-
-    it('handles error when external wallet data is invalid', async () => {
-      // Pass undefined to simulate error condition
-      const { result } = renderHook(() => useGetPriorityCardToken(undefined));
-
-      await act(async () => {
-        await new Promise((resolve) => setTimeout(resolve, 100));
-      });
-
-      // In authenticated mode without external wallet data, hook should set null token
-      expect(result.current.isLoading).toBe(false);
-      // The hook should not error when no external wallet data is provided
-      // It will simply not have authenticated data to work with
-    });
-
-    it('validates cache correctly for authenticated users within 30 second window', () => {
-      // This test verifies that the cache validation logic works correctly
-      // for authenticated users (30 second window vs 5 minute window for non-authenticated)
-
-      // Use a fixed reference time for consistency
-      const fixedNow = new Date('2025-01-15T12:00:00.000Z');
-      const recentTimestamp = new Date('2025-01-15T11:59:45.000Z'); // 15 seconds ago
-      const staleTimestamp = new Date('2025-01-15T11:59:20.000Z'); // 40 seconds ago
-
-      const cachedToken = {
-        address: '0xCachedToken',
-        symbol: 'CACHED',
-        name: 'Cached Token',
-        decimals: 18,
-        allowanceState: AllowanceState.Enabled,
-        isStaked: false,
-        chainId: CHAIN_IDS.LINEA_MAINNET,
-      };
-
-      // Test the cache validation logic directly with a fixed "now" reference
-      const validateCache = (
-        lastFetched: Date | string | null,
-        authenticated: boolean,
-        currentTime: Date,
-      ): boolean => {
-        if (!lastFetched) return false;
-        const thirtySecondsAgo = new Date(currentTime.getTime() - 30 * 1000);
-        const fiveMinutesAgo = new Date(currentTime.getTime() - 5 * 60 * 1000);
-        const lastFetchedDate =
-          lastFetched instanceof Date ? lastFetched : new Date(lastFetched);
-
-        if (authenticated) {
-          return lastFetchedDate > thirtySecondsAgo;
-        }
-
-        return lastFetchedDate > fiveMinutesAgo;
-      };
-
-      // Test with recent timestamp (should be valid for authenticated)
-      expect(validateCache(recentTimestamp, true, fixedNow)).toBe(true);
-
-      // Test with stale timestamp (should be invalid for authenticated)
-      expect(validateCache(staleTimestamp, true, fixedNow)).toBe(false);
-
-      // Test with recent timestamp for non-authenticated (should still be valid)
-      expect(validateCache(recentTimestamp, false, fixedNow)).toBe(true);
-
-      // Verify the cached token structure
-      expect(cachedToken).toEqual(
-        expect.objectContaining({
-          address: '0xCachedToken',
-          symbol: 'CACHED',
-        }),
-      );
-    });
-
-    it('processes external wallet data when authenticated cache is stale (over 30 seconds)', async () => {
-      const priorityWalletDetail: CardTokenAllowance = {
-        address: '0xToken1',
-        symbol: 'TKN1',
-        name: 'Token 1',
-        decimals: 18,
-        allowance: '1000000000000',
-        allowanceState: AllowanceState.Enabled,
-        walletAddress: '0xWallet123',
-        caipChainId:
-          `eip155:${CHAIN_IDS.LINEA_MAINNET}` as `${string}:${string}`,
-      };
-
-      const externalWalletDetailsData = {
-        priorityWalletDetail,
-        mappedWalletDetails: [priorityWalletDetail],
-      };
-
-      renderHook(() => useGetPriorityCardToken(externalWalletDetailsData));
-
-      await act(async () => {
-        await new Promise((resolve) => setTimeout(resolve, 100));
-      });
-
-      expect(mockDispatch).toHaveBeenCalledWith(
-        expect.objectContaining({
-          type: expect.stringContaining('setAuthenticatedPriorityToken'),
-          payload: expect.objectContaining({
-            address: '0xToken1',
-            symbol: 'TKN1',
-          }),
-        }),
-      );
-    });
-
-    it('returns authenticated priority token when manually calling fetchPriorityToken', async () => {
-      const priorityWalletDetail: CardTokenAllowance = {
-        address: '0xToken1',
-        symbol: 'TKN1',
-        name: 'Token 1',
-        decimals: 18,
-        allowance: '1000000000000',
-        allowanceState: AllowanceState.Enabled,
-        walletAddress: '0xWallet123',
-        caipChainId:
-          `eip155:${CHAIN_IDS.LINEA_MAINNET}` as `${string}:${string}`,
-      };
-
-      const externalWalletDetailsData = {
-        priorityWalletDetail,
-        mappedWalletDetails: [priorityWalletDetail],
-      };
-
-      // Update selector to return the authenticated token
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      mockUseSelector.mockImplementation((selector: any) => {
-        if (selector === selectAllTokenBalances) {
-          return {};
-        }
-        if (selector === selectSelectedInternalAccountByScope) {
-          return (scope: string) => {
-            if (scope === 'eip155:0') {
-              return {
-                address: mockAddress,
-                id: 'test-account-id',
-                type: 'eip155:eoa' as const,
-              };
-            }
-            return undefined;
-          };
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      mockUseSelector.mockImplementation((selector: any) => {
+        if (selector === selectAllTokenBalances) {
+          return mockTokenBalances;
+        }
+        if (selector === selectSelectedInternalAccountByScope) {
+          return mockAccountSelector;
         }
         if (selector === selectIsAuthenticatedCard) {
           return true;
@@ -1608,15 +787,11 @@ describe('useGetPriorityCardToken', () => {
               card: {
                 cardholderAccounts: [],
                 isLoaded: true,
-                priorityTokensByAddress: {},
-                lastFetchedByAddress: {},
-                authenticatedPriorityToken: priorityWalletDetail,
-                authenticatedPriorityTokenLastFetched: new Date(),
               },
               engine: {
                 backgroundState: {
                   TokenBalancesController: {
-                    tokenBalances: {},
+                    tokenBalances: mockTokenBalances,
                   },
                 },
               },
@@ -1632,43 +807,16 @@ describe('useGetPriorityCardToken', () => {
         return null;
       });
 
-      renderHook(() => useGetPriorityCardToken(externalWalletDetailsData));
-
-      await act(async () => {
-        await new Promise((resolve) => setTimeout(resolve, 100));
-      });
-
-      // Verify the dispatched token was set
-      expect(mockDispatch).toHaveBeenCalledWith(
-        expect.objectContaining({
-          type: expect.stringContaining('setAuthenticatedPriorityToken'),
-          payload: expect.objectContaining({
-            address: '0xToken1',
-            symbol: 'TKN1',
-          }),
-        }),
-      );
-    });
-
-    it('returns null and sets warning when priorityWalletDetail is undefined', async () => {
-      const externalWalletDetailsData = {
-        priorityWalletDetail: undefined,
-        mappedWalletDetails: [],
-      };
-
-      const { result } = renderHook(() =>
-        useGetPriorityCardToken(externalWalletDetailsData),
-      );
-
-      await act(async () => {
-        await new Promise((resolve) => setTimeout(resolve, 100));
+      (useCardSDK as jest.Mock).mockReturnValue({
+        sdk: {
+          ...mockSDK,
+          getCardExternalWalletDetails: jest.fn().mockResolvedValue([]),
+        },
+        isLoading: false,
       });
-
-      expect(result.current.warning).toBe('need_delegation');
-      expect(result.current.priorityToken).toBeNull();
     });
 
-    it('handles multiple wallet details and returns priority token', async () => {
+    it('returns authenticated priority token from externalWalletDetailsData', async () => {
       const priorityWalletDetail: CardTokenAllowance = {
         address: '0xToken1',
         symbol: 'TKN1',
@@ -1681,72 +829,42 @@ describe('useGetPriorityCardToken', () => {
           `eip155:${CHAIN_IDS.LINEA_MAINNET}` as `${string}:${string}`,
       };
 
-      const secondWalletDetail: CardTokenAllowance = {
-        address: '0xToken2',
-        symbol: 'TKN2',
-        name: 'Token 2',
-        decimals: 18,
-        allowance: '500000000000',
-        allowanceState: AllowanceState.Enabled,
-        walletAddress: '0xWallet456',
-        caipChainId:
-          `eip155:${CHAIN_IDS.LINEA_MAINNET}` as `${string}:${string}`,
-      };
-
       const externalWalletDetailsData = {
         priorityWalletDetail,
-        mappedWalletDetails: [priorityWalletDetail, secondWalletDetail],
+        mappedWalletDetails: [priorityWalletDetail],
       };
 
-      renderHook(() => useGetPriorityCardToken(externalWalletDetailsData));
+      const { result } = renderHook(() =>
+        useGetPriorityCardToken(externalWalletDetailsData),
+      );
 
       await act(async () => {
-        await new Promise((resolve) => setTimeout(resolve, 100));
+        await new Promise((resolve) => setTimeout(resolve, 50));
       });
 
-      expect(mockDispatch).toHaveBeenCalledWith(
-        expect.objectContaining({
-          type: expect.stringContaining('setAuthenticatedPriorityToken'),
-          payload: expect.objectContaining({
-            address: '0xToken1',
-            symbol: 'TKN1',
-          }),
-        }),
-      );
+      expect(result.current.priorityToken).toEqual(priorityWalletDetail);
+      expect(result.current.isLoading).toBe(false);
+      expect(result.current.error).toBe(false);
+      expect(result.current.warning).toBeNull();
     });
 
-    it('manually calls fetchPriorityToken and returns priority wallet detail', async () => {
-      const priorityWalletDetail: CardTokenAllowance = {
-        address: '0xToken1',
-        symbol: 'TKN1',
-        name: 'Token 1',
-        decimals: 18,
-        allowance: '1000000000000',
-        allowanceState: AllowanceState.Enabled,
-        walletAddress: '0xWallet123',
-        caipChainId:
-          `eip155:${CHAIN_IDS.LINEA_MAINNET}` as `${string}:${string}`,
-      };
-
+    it('handles empty wallet details and sets NeedDelegation warning', () => {
       const externalWalletDetailsData = {
-        priorityWalletDetail,
-        mappedWalletDetails: [priorityWalletDetail],
+        priorityWalletDetail: null,
+        mappedWalletDetails: [],
       };
 
       const { result } = renderHook(() =>
         useGetPriorityCardToken(externalWalletDetailsData),
       );
 
-      let fetchResult: CardTokenAllowance | null = null;
-      await act(async () => {
-        fetchResult = await result.current.fetchPriorityToken();
-      });
-
-      expect(fetchResult).toEqual(priorityWalletDetail);
+      expect(result.current.warning).toBe('need_delegation');
+      expect(result.current.priorityToken).toBeNull();
+      expect(result.current.isLoading).toBe(false);
       expect(result.current.error).toBe(false);
     });
 
-    it('returns null when manually calling fetchPriorityToken with null priorityWalletDetail', async () => {
+    it('handles wallet detail without token details', () => {
       const externalWalletDetailsData = {
         priorityWalletDetail: null,
         mappedWalletDetails: [],
@@ -1756,20 +874,14 @@ describe('useGetPriorityCardToken', () => {
         useGetPriorityCardToken(externalWalletDetailsData),
       );
 
-      let fetchResult: CardTokenAllowance | null | undefined;
-      await act(async () => {
-        fetchResult = await result.current.fetchPriorityToken();
-      });
-
-      expect(fetchResult).toBeNull();
       expect(result.current.warning).toBe('need_delegation');
     });
 
-    it('dispatches both setAuthenticatedPriorityToken and setAuthenticatedPriorityTokenLastFetched', async () => {
+    it('returns priority wallet detail from externalWalletDetailsData', async () => {
       const priorityWalletDetail: CardTokenAllowance = {
-        address: '0xToken1',
-        symbol: 'TKN1',
-        name: 'Token 1',
+        address: '0xToken2',
+        symbol: 'TKN2',
+        name: 'Token 2',
         decimals: 18,
         allowance: '1000000000000',
         allowanceState: AllowanceState.Enabled,
@@ -1783,30 +895,34 @@ describe('useGetPriorityCardToken', () => {
         mappedWalletDetails: [priorityWalletDetail],
       };
 
-      renderHook(() => useGetPriorityCardToken(externalWalletDetailsData));
+      const { result } = renderHook(() =>
+        useGetPriorityCardToken(externalWalletDetailsData),
+      );
 
       await act(async () => {
-        await new Promise((resolve) => setTimeout(resolve, 100));
+        await new Promise((resolve) => setTimeout(resolve, 50));
       });
 
-      expect(mockDispatch).toHaveBeenCalledWith(
-        expect.objectContaining({
-          type: expect.stringContaining('setAuthenticatedPriorityToken'),
-          payload: priorityWalletDetail,
-        }),
-      );
+      expect(result.current.priorityToken).toEqual(priorityWalletDetail);
+      expect(result.current.isLoading).toBe(false);
+      expect(result.current.error).toBe(false);
+    });
 
-      expect(mockDispatch).toHaveBeenCalledWith(
-        expect.objectContaining({
-          type: expect.stringContaining(
-            'setAuthenticatedPriorityTokenLastFetched',
-          ),
-          payload: expect.any(Date),
-        }),
+    it('returns null and sets warning when priorityWalletDetail is undefined', () => {
+      const externalWalletDetailsData = {
+        priorityWalletDetail: undefined,
+        mappedWalletDetails: [],
+      };
+
+      const { result } = renderHook(() =>
+        useGetPriorityCardToken(externalWalletDetailsData),
       );
+
+      expect(result.current.warning).toBe('need_delegation');
+      expect(result.current.priorityToken).toBeNull();
     });
 
-    it('clears error state when fetchPriorityToken succeeds', async () => {
+    it('handles multiple wallet details and returns priority token', () => {
       const priorityWalletDetail: CardTokenAllowance = {
         address: '0xToken1',
         symbol: 'TKN1',
@@ -1819,25 +935,32 @@ describe('useGetPriorityCardToken', () => {
           `eip155:${CHAIN_IDS.LINEA_MAINNET}` as `${string}:${string}`,
       };
 
+      const secondWalletDetail: CardTokenAllowance = {
+        address: '0xToken2',
+        symbol: 'TKN2',
+        name: 'Token 2',
+        decimals: 18,
+        allowance: '500000000000',
+        allowanceState: AllowanceState.Enabled,
+        walletAddress: '0xWallet456',
+        caipChainId:
+          `eip155:${CHAIN_IDS.LINEA_MAINNET}` as `${string}:${string}`,
+      };
+
       const externalWalletDetailsData = {
         priorityWalletDetail,
-        mappedWalletDetails: [priorityWalletDetail],
+        mappedWalletDetails: [priorityWalletDetail, secondWalletDetail],
       };
 
       const { result } = renderHook(() =>
         useGetPriorityCardToken(externalWalletDetailsData),
       );
 
-      await act(async () => {
-        await result.current.fetchPriorityToken();
-      });
-
-      expect(result.current.error).toBe(false);
-      expect(result.current.isLoading).toBe(false);
+      expect(result.current.priorityToken).toEqual(priorityWalletDetail);
     });
 
-    it('maintains state consistency when external wallet data changes', async () => {
-      const initialPriorityWalletDetail: CardTokenAllowance = {
+    it('manually calls fetchPriorityToken and returns priority wallet detail', async () => {
+      const priorityWalletDetail: CardTokenAllowance = {
         address: '0xToken1',
         symbol: 'TKN1',
         name: 'Token 1',
@@ -1850,76 +973,57 @@ describe('useGetPriorityCardToken', () => {
       };
 
       const externalWalletDetailsData = {
-        priorityWalletDetail: initialPriorityWalletDetail,
-        mappedWalletDetails: [initialPriorityWalletDetail],
+        priorityWalletDetail,
+        mappedWalletDetails: [priorityWalletDetail],
       };
 
-      const { rerender } = renderHook(
-        (props) => useGetPriorityCardToken(props),
-        {
-          initialProps: externalWalletDetailsData,
-        },
+      const { result } = renderHook(() =>
+        useGetPriorityCardToken(externalWalletDetailsData),
       );
 
+      let fetchResult: CardTokenAllowance | null = null;
       await act(async () => {
-        await new Promise((resolve) => setTimeout(resolve, 100));
+        fetchResult = await result.current.fetchPriorityToken();
       });
 
-      const updatedPriorityWalletDetail: CardTokenAllowance = {
-        address: '0xToken2',
-        symbol: 'TKN2',
-        name: 'Token 2',
-        decimals: 18,
-        allowance: '2000000000000',
-        allowanceState: AllowanceState.Enabled,
-        walletAddress: '0xWallet456',
-        caipChainId:
-          `eip155:${CHAIN_IDS.LINEA_MAINNET}` as `${string}:${string}`,
-      };
+      expect(fetchResult).toEqual(priorityWalletDetail);
+      expect(result.current.error).toBe(false);
+    });
 
-      const updatedWalletDetailsData = {
-        priorityWalletDetail: updatedPriorityWalletDetail,
-        mappedWalletDetails: [updatedPriorityWalletDetail],
+    it('returns null when manually calling fetchPriorityToken with null priorityWalletDetail', async () => {
+      const externalWalletDetailsData = {
+        priorityWalletDetail: null,
+        mappedWalletDetails: [],
       };
 
-      mockDispatch.mockClear();
+      const { result } = renderHook(() =>
+        useGetPriorityCardToken(externalWalletDetailsData),
+      );
 
+      let fetchResult: CardTokenAllowance | null | undefined;
       await act(async () => {
-        rerender(updatedWalletDetailsData);
-        await new Promise((resolve) => setTimeout(resolve, 100));
+        fetchResult = await result.current.fetchPriorityToken();
       });
 
-      expect(mockDispatch).toHaveBeenCalledWith(
-        expect.objectContaining({
-          type: expect.stringContaining('setAuthenticatedPriorityToken'),
-          payload: updatedPriorityWalletDetail,
-        }),
-      );
+      expect(fetchResult).toBeNull();
+      expect(result.current.warning).toBe('need_delegation');
     });
 
-    it('handles walletDetails being undefined', async () => {
+    it('handles error when external wallet data is invalid', () => {
       const { result } = renderHook(() => useGetPriorityCardToken(undefined));
 
-      await act(async () => {
-        await new Promise((resolve) => setTimeout(resolve, 50));
-      });
-
-      expect(result.current.priorityToken).toBeNull();
       expect(result.current.isLoading).toBe(false);
+      expect(result.current.priorityToken).toBeNull();
     });
 
-    it('handles walletDetails being null', async () => {
+    it('handles walletDetails being null', () => {
       const { result } = renderHook(() => useGetPriorityCardToken(null));
 
-      await act(async () => {
-        await new Promise((resolve) => setTimeout(resolve, 50));
-      });
-
       expect(result.current.priorityToken).toBeNull();
       expect(result.current.isLoading).toBe(false);
     });
 
-    it('sets error state false and loading state false on successful fetch', async () => {
+    it('sets error state false and loading state false on successful derivation', async () => {
       const priorityWalletDetail: CardTokenAllowance = {
         address: '0xToken1',
         symbol: 'TKN1',
@@ -1942,17 +1046,22 @@ describe('useGetPriorityCardToken', () => {
       );
 
       await act(async () => {
-        await new Promise((resolve) => setTimeout(resolve, 100));
+        await new Promise((resolve) => setTimeout(resolve, 50));
       });
 
       expect(result.current.error).toBe(false);
       expect(result.current.isLoading).toBe(false);
       expect(result.current.warning).toBeNull();
     });
+
+    it('disables useQuery when authenticated', () => {
+      renderHook(() => useGetPriorityCardToken());
+
+      expect(mockUseQueryOptions.enabled).toBe(false);
+    });
   });
 
   describe('Token Adding Functionality', () => {
-    // Pre-create static objects to avoid recreating them in each test
     const STATIC_TOKEN_BALANCES = {
       [mockAddress.toLowerCase()]: {
         [CHAIN_IDS.LINEA_MAINNET]: {
@@ -1990,13 +1099,10 @@ describe('useGetPriorityCardToken', () => {
     let mockNetworkController: { findNetworkClientIdByChainId: jest.Mock };
 
     beforeEach(() => {
-      // Reset all mocks from the parent describe block
       jest.clearAllMocks();
       mockGetPriorityToken.mockReset();
       mockFetchAllowances.mockReset();
-      mockDispatch.mockReset();
 
-      // IMPORTANT: Reset authenticated state to false for non-authenticated tests
       mockSelectIsAuthenticatedCard.mockReturnValue(false);
 
       const mockAccountSelector = (scope: string) => {
@@ -2018,7 +1124,6 @@ describe('useGetPriorityCardToken', () => {
         mockAccountSelector as any,
       );
 
-      // Create simple mock controllers
       mockTokensController = {
         state: {
           allTokens: {
@@ -2036,89 +1141,58 @@ describe('useGetPriorityCardToken', () => {
           .mockReturnValue('linea-mainnet'),
       };
 
-      // Set up the mock Engine with static references
       const mockEngine = jest.requireMock('../../../../core/Engine');
       mockEngine.context.TokensController = mockTokensController;
       mockEngine.context.NetworkController = mockNetworkController;
 
-      // Set up SDK mock to avoid fetch attempts
       (useCardSDK as jest.Mock).mockReturnValue({ sdk: mockSDK });
 
-      // Mock successful API calls to avoid errors
-      mockFetchAllowances.mockResolvedValue([]);
-      mockGetPriorityToken.mockResolvedValue(null);
-
-      // Simplified dispatch mock
-      mockDispatch.mockImplementation((action) => action);
-
       // eslint-disable-next-line @typescript-eslint/no-explicit-any
       mockSelectAllTokenBalances.mockReturnValue(STATIC_TOKEN_BALANCES as any);
 
-      // Simplified selector implementation
-      const { useSelector: useSelectorMock, useDispatch: useDispatchMock } =
-        jest.requireMock('react-redux');
-      useSelectorMock.mockImplementation(
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        (selector: any) => {
-          if (selector === selectAllTokenBalances) {
-            return STATIC_TOKEN_BALANCES;
-          }
-          if (selector === selectSelectedInternalAccountByScope) {
-            return mockAccountSelector;
-          }
-          if (selector === selectIsAuthenticatedCard) {
-            return false;
-          }
+      // Provide the priority token via useQuery data so the addToken effect triggers
+      mockUseQueryReturn.data = {
+        priorityToken: STATIC_PRIORITY_TOKEN,
+        allTokensWithAllowances: [STATIC_PRIORITY_TOKEN],
+      };
 
-          const selectorStr = selector?.toString?.() || '';
-          // Detect by internal state keys to be resilient to createSelector wrappers
-          if (selectorStr.includes('selectAllTokenBalances')) {
-            return STATIC_TOKEN_BALANCES;
-          }
-          if (selectorStr.includes('priorityTokensByAddress')) {
-            return STATIC_PRIORITY_TOKEN;
-          }
-          if (selectorStr.includes('lastFetchedByAddress')) {
-            return new Date();
-          }
-          // As a fallback, try invoking the selector with a minimal card state
-          if (typeof selector === 'function') {
-            try {
-              return selector({
-                card: {
-                  cardholderAccounts: [],
-                  isLoaded: true,
-                  priorityTokensByAddress: {
-                    [mockAddress.toLowerCase()]: STATIC_PRIORITY_TOKEN,
-                  },
-                  lastFetchedByAddress: {
-                    [mockAddress.toLowerCase()]: new Date(),
-                  },
-                  authenticatedPriorityToken: null,
-                  authenticatedPriorityTokenLastFetched: null,
-                },
-                engine: {
-                  backgroundState: {
-                    TokenBalancesController: {
-                      tokenBalances: STATIC_TOKEN_BALANCES,
-                    },
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      mockUseSelector.mockImplementation((selector: any) => {
+        if (selector === selectAllTokenBalances) {
+          return STATIC_TOKEN_BALANCES;
+        }
+        if (selector === selectSelectedInternalAccountByScope) {
+          return mockAccountSelector;
+        }
+        if (selector === selectIsAuthenticatedCard) {
+          return false;
+        }
+
+        if (typeof selector === 'function') {
+          try {
+            return selector({
+              card: {
+                cardholderAccounts: [],
+                isLoaded: true,
+              },
+              engine: {
+                backgroundState: {
+                  TokenBalancesController: {
+                    tokenBalances: STATIC_TOKEN_BALANCES,
                   },
                 },
-                // eslint-disable-next-line @typescript-eslint/no-explicit-any
-              } as unknown as any);
-            } catch (_e) {
-              return null;
-            }
+              },
+              // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            } as unknown as any);
+          } catch (_e) {
+            return null;
           }
-          return null;
-        },
-      );
-
-      useDispatchMock.mockReturnValue(mockDispatch);
+        }
+        return null;
+      });
     });
 
     afterEach(() => {
-      // Clear any references to prevent memory leaks
       mockTokensController =
         undefined as unknown as typeof mockTokensController;
       mockNetworkController =
@@ -2128,7 +1202,6 @@ describe('useGetPriorityCardToken', () => {
     it('should add token when it does not exist in TokensController', async () => {
       const { result } = renderHook(() => useGetPriorityCardToken());
 
-      // Wait for the addToken effect to run
       await act(async () => {
         await new Promise((resolve) => setTimeout(resolve, 50));
       });
@@ -2147,14 +1220,12 @@ describe('useGetPriorityCardToken', () => {
     });
 
     it('should not add token when it already exists in TokensController', async () => {
-      // Get the Engine mock and replace the TokensController with one that has existing tokens
       const mockEngine = jest.requireMock('../../../../core/Engine');
       const addTokenMock = jest.fn().mockResolvedValue(undefined);
 
       mockEngine.context.TokensController = {
         state: {
           allTokens: {
-            // CHAIN_IDS.LINEA_MAINNET is '0xe708' in hex format
             '0xe708': {
               [mockAddress.toLowerCase()]: STATIC_EXISTING_TOKEN_LIST,
             },
@@ -2165,7 +1236,6 @@ describe('useGetPriorityCardToken', () => {
 
       const { result } = renderHook(() => useGetPriorityCardToken());
 
-      // Wait for the addToken effect to run
       await act(async () => {
         await new Promise((resolve) => setTimeout(resolve, 50));
       });
@@ -2182,7 +1252,6 @@ describe('useGetPriorityCardToken', () => {
 
       const { result } = renderHook(() => useGetPriorityCardToken());
 
-      // Wait for the addToken effect to run
       await act(async () => {
         await new Promise((resolve) => setTimeout(resolve, 50));
       });
@@ -2192,78 +1261,14 @@ describe('useGetPriorityCardToken', () => {
         expect.any(Error),
         'useGetPriorityCardToken::error adding priority token',
       );
-      expect(result.current.error).toBe(true);
       expect(result.current.isLoading).toBe(false);
     });
 
     it('should not add token when priorityToken is null', async () => {
-      // Mock no priority token
-      const { useSelector: useSelectorMock2 } = jest.requireMock('react-redux');
-      useSelectorMock2.mockImplementation(
-        (selector: (state: unknown) => unknown) => {
-          if (selector === selectAllTokenBalances) {
-            return STATIC_TOKEN_BALANCES;
-          }
-          if (selector === selectSelectedInternalAccountByScope) {
-            return (scope: string) => {
-              if (scope === 'eip155:0') {
-                return {
-                  address: mockAddress,
-                };
-              }
-              return undefined;
-            };
-          }
-
-          // Handle createSelector - return proper cardState with null priorityToken
-          if (typeof selector === 'function') {
-            try {
-              const mockState = {
-                card: {
-                  cardholderAccounts: [],
-                  isLoaded: true,
-                  priorityTokensByAddress: {
-                    [mockAddress.toLowerCase()]: null,
-                  },
-                  lastFetchedByAddress: {
-                    [mockAddress.toLowerCase()]: new Date(),
-                  },
-                  authenticatedPriorityToken: null,
-                  authenticatedPriorityTokenLastFetched: null,
-                },
-                engine: {
-                  backgroundState: {
-                    TokenBalancesController: {
-                      tokenBalances: STATIC_TOKEN_BALANCES,
-                    },
-                  },
-                },
-                // eslint-disable-next-line @typescript-eslint/no-explicit-any
-              } as unknown as any;
-
-              return selector(mockState);
-            } catch (_e) {
-              // Fallback
-            }
-          }
-
-          const selectorStr = selector?.toString?.() || '';
-          if (selectorStr.includes('selectCardPriorityToken')) {
-            return null; // No priority token
-          }
-          if (selectorStr.includes('selectCardPriorityTokenLastFetched')) {
-            return new Date();
-          }
-          if (selectorStr.includes('selectIsAuthenticatedCard')) {
-            return false;
-          }
-          return null;
-        },
-      );
+      mockUseQueryReturn.data = undefined;
 
       const { result } = renderHook(() => useGetPriorityCardToken());
 
-      // Wait for effects to run
       await act(async () => {
         await new Promise((resolve) => setTimeout(resolve, 50));
       });
diff --git a/app/components/UI/Card/hooks/useGetPriorityCardToken.tsx b/app/components/UI/Card/hooks/useGetPriorityCardToken.tsx
index c43cd42981d3..0962ffc26a26 100644
--- a/app/components/UI/Card/hooks/useGetPriorityCardToken.tsx
+++ b/app/components/UI/Card/hooks/useGetPriorityCardToken.tsx
@@ -1,5 +1,6 @@
 import { useCallback, useEffect, useState, useMemo } from 'react';
-import { useDispatch, useSelector } from 'react-redux';
+import { useSelector } from 'react-redux';
+import { useQuery } from '@tanstack/react-query';
 import { useCardSDK } from '../sdk';
 import {
   AllowanceState,
@@ -22,34 +23,21 @@ import { selectAllTokenBalances } from '../../../../selectors/tokenBalancesContr
 import { CardSDK } from '../sdk/CardSDK';
 import {
   ARBITRARY_ALLOWANCE,
-  AUTHENTICATED_CACHE_DURATION,
   UNAUTHENTICATED_CACHE_DURATION,
 } from '../constants';
 import { selectSelectedInternalAccountByScope } from '../../../../selectors/multichainAccounts/accounts';
-import {
-  selectCardPriorityToken,
-  selectCardPriorityTokenLastFetched,
-  selectIsAuthenticatedCard,
-  setAuthenticatedPriorityToken,
-  setAuthenticatedPriorityTokenLastFetched,
-  setCardPriorityToken,
-  setCardPriorityTokenLastFetched,
-} from '../../../../core/redux/slices/card';
+import { selectIsAuthenticatedCard } from '../../../../core/redux/slices/card';
 import Engine from '../../../../core/Engine';
 import { buildTokenIconUrl } from '../util/buildTokenIconUrl';
-import { createSelector } from 'reselect';
 import {
   isSolanaChainId,
   formatChainIdToCaip,
 } from '@metamask/bridge-controller';
 import { safeFormatChainIdToHex } from '../util/safeFormatChainIdToHex';
+import { cardQueries } from '../queries';
 
 /**
  * Fetches token allowances from the Card SDK and maps them to CardTokenAllowance objects.
- * @param {CardSDK} sdk - The Card SDK instance.
- * @param {string} selectedAddress - The user's Ethereum address.
- * @param {string} chainId - The chain ID for which to fetch allowances.
- * @returns {Promise<CardTokenAllowance[]>} - A promise that resolves to an array of CardTokenAllowance objects.
  */
 const fetchAllowances = async (
   sdk: CardSDK,
@@ -118,30 +106,32 @@ const fetchAllowances = async (
   }
 };
 
-interface State {
-  isLoading: boolean;
-  isLoadingAddToken: boolean;
-  error: boolean;
-  warning: CardStateWarning | null;
+const filterNonZeroAllowances = (
+  allowances: CardTokenAllowance[],
+): CardTokenAllowance[] =>
+  allowances.filter(({ allowance }) => parseFloat(allowance) > 0);
+
+const findFirstAllowanceWithPositiveBalance = (
+  allowances: CardTokenAllowance[],
+  balances: Record<Hex, string>,
+): CardTokenAllowance | undefined =>
+  allowances.find(
+    ({ allowance, address: tokenAddress }) =>
+      parseFloat(allowance) > 0 &&
+      balances[tokenAddress as Hex] &&
+      BigNumber(balances[tokenAddress as Hex]).gt(0),
+  );
+
+interface OnChainPriorityTokenResult {
+  priorityToken: CardTokenAllowance | null;
+  allTokensWithAllowances: CardTokenAllowance[];
 }
 
 /**
  * React hook to fetch and determine the priority card token for a given user address.
  *
- * This hook implements a caching strategy where if the priority token was fetched less than 5 minutes ago,
- * it returns the cached value. Otherwise, it fetches a new priority token from the Card SDK.
- *
- * @returns {{
- * fetchPriorityToken: () => Promise<CardTokenAllowance | null>,
- * isLoading: boolean,
- * error: boolean,
- * priorityToken: CardTokenAllowance | null
- * }}
- * An object containing:
- * - fetchPriorityToken: async function to manually refresh the priority token
- * - isLoading: indicates loading state during the fetch
- * - error: any error encountered while fetching
- * - priorityToken: the cached or newly fetched priority token
+ * Authenticated mode: derives priority token from externalWalletDetailsData (no query).
+ * Unauthenticated mode: uses React Query to fetch on-chain allowances and determine priority.
  */
 export const useGetPriorityCardToken = (
   externalWalletDetailsData?: {
@@ -150,75 +140,15 @@ export const useGetPriorityCardToken = (
     priorityWalletDetail?: CardTokenAllowance | null;
   } | null,
 ) => {
-  const dispatch = useDispatch();
   const { TokensController, NetworkController } = Engine.context;
   const isAuthenticated = useSelector(selectIsAuthenticatedCard);
   const { sdk } = useCardSDK();
-  const [state, setState] = useState<State>({
-    isLoading: false,
-    isLoadingAddToken: false,
-    error: false,
-    warning: null,
-  });
-  const [allTokensWithAllowances, setAllTokensWithAllowances] = useState<
-    CardTokenAllowance[] | null
-  >(null);
+  const [isLoadingAddToken, setIsLoadingAddToken] = useState(false);
+
   const selectedAddress = useSelector(selectSelectedInternalAccountByScope)(
     'eip155:0',
   )?.address;
-  const selectCardHookState = useMemo(
-    () =>
-      createSelector(
-        [
-          selectAllTokenBalances,
-          (rootState) =>
-            selectCardPriorityToken(
-              isAuthenticated,
-              selectedAddress,
-            )(rootState),
-          (rootState) =>
-            selectCardPriorityTokenLastFetched(
-              isAuthenticated,
-              selectedAddress,
-            )(rootState),
-        ],
-        (allTokenBalances, priorityToken, lastFetched) => ({
-          allTokenBalances,
-          priorityToken,
-          lastFetched,
-        }),
-      ),
-    [isAuthenticated, selectedAddress],
-  );
-
-  const cardState = useSelector(selectCardHookState);
-  const { allTokenBalances, priorityToken, lastFetched } = cardState;
-
-  // Helper to check if cache is still valid
-  // Cache is only valid if we have both a recent lastFetched AND an actual token
-  const isCacheValid = useCallback(() => {
-    if (!lastFetched || !priorityToken) return false;
-    const now = Date.now();
-    // Handle both Date objects and ISO date strings (from redux-persist)
-    const lastFetchedTime =
-      lastFetched instanceof Date
-        ? lastFetched.getTime()
-        : new Date(lastFetched).getTime();
-
-    const cacheDuration = isAuthenticated
-      ? AUTHENTICATED_CACHE_DURATION
-      : UNAUTHENTICATED_CACHE_DURATION;
-    const cacheExpiry = now - cacheDuration;
-    return lastFetchedTime > cacheExpiry;
-  }, [lastFetched, priorityToken, isAuthenticated]);
-
-  const cacheIsValid = isCacheValid();
-
-  // Helpers
-  const filterNonZeroAllowances = (
-    allowances: CardTokenAllowance[],
-  ): CardTokenAllowance[] =>
-    allowances.filter(({ allowance }) => parseFloat(allowance) > 0);
+  const allTokenBalances = useSelector(selectAllTokenBalances);
 
   const getBalancesForChain = useCallback(
     (tokenChainId: CaipChainId): Record<Hex, string> =>
@@ -228,305 +158,161 @@ export const useGetPriorityCardToken = (
     [allTokenBalances, selectedAddress],
   );
 
-  const findFirstAllowanceWithPositiveBalance = (
-    allowances: CardTokenAllowance[],
-    balances: Record<Hex, string>,
-  ): CardTokenAllowance | undefined =>
-    allowances.find(
-      ({ allowance, address: tokenAddress }) =>
-        parseFloat(allowance) > 0 &&
-        balances[tokenAddress as Hex] &&
-        BigNumber(balances[tokenAddress as Hex]).gt(0),
-    );
-
-  // Fetch priority token function on chain -- when user is not authenticated
-  const fetchPriorityTokenOnChain: () => Promise<CardTokenAllowance | null> =
-    useCallback(async () => {
-      setState((prevState) => ({
-        ...prevState,
-        isLoading: true,
-        error: false,
-        warning: null,
-      }));
-
+  // --- Unauthenticated on-chain query ---
+  const {
+    data: onChainData,
+    isLoading: isLoadingOnChain,
+    error: onChainError,
+    refetch: refetchOnChain,
+  } = useQuery<OnChainPriorityTokenResult>({
+    queryKey: cardQueries.dashboard.keys.priorityTokenOnChain(
+      selectedAddress ?? '',
+    ),
+    queryFn: async (): Promise<OnChainPriorityTokenResult> => {
       if (!sdk || !selectedAddress) {
-        setState((prevState) => ({
-          ...prevState,
-          isLoading: false,
-          warning: null,
-        }));
-        return null;
+        throw new Error('SDK or selectedAddress not available');
       }
 
-      try {
-        trace({
-          name: TraceName.Card,
-          op: TraceOperation.CardGetPriorityToken,
-        });
-
-        // Fetch all token allowances for unauthenticated users
-        const cardTokenAllowances = await fetchAllowances(
-          sdk,
-          selectedAddress,
-          formatChainIdToCaip(CHAIN_IDS.LINEA_MAINNET),
-        );
+      trace({
+        name: TraceName.Card,
+        op: TraceOperation.CardGetPriorityToken,
+      });
 
-        // Store all tokens for asset selection
-        setAllTokensWithAllowances(cardTokenAllowances);
-
-        endTrace({
-          name: TraceName.Card,
-        });
-
-        if (!cardTokenAllowances || cardTokenAllowances.length === 0) {
-          const supportedTokens = sdk.getSupportedTokensByChainId();
-
-          if (supportedTokens[0]) {
-            const fallbackToken = {
-              ...supportedTokens[0],
-              allowanceState: AllowanceState.NotEnabled,
-              isStaked: false,
-              caipChainId: formatChainIdToCaip(CHAIN_IDS.LINEA_MAINNET),
-              allowance: '0',
-            } as CardTokenAllowance;
-
-            // Update cache with fallback token
-            dispatch(
-              setCardPriorityToken({
-                address: selectedAddress,
-                token: fallbackToken,
-              }),
-            );
-            dispatch(
-              setCardPriorityTokenLastFetched({
-                address: selectedAddress,
-                lastFetched: new Date(),
-              }),
-            );
+      const cardTokenAllowances = await fetchAllowances(
+        sdk,
+        selectedAddress,
+        formatChainIdToCaip(CHAIN_IDS.LINEA_MAINNET),
+      );
 
-            setState((prevState) => ({ ...prevState, isLoading: false }));
-            return fallbackToken;
-          }
+      endTrace({ name: TraceName.Card });
 
-          dispatch(
-            setCardPriorityToken({
-              address: selectedAddress,
-              token: null,
-            }),
-          );
-          dispatch(
-            setCardPriorityTokenLastFetched({
-              address: selectedAddress,
-              lastFetched: new Date(),
-            }),
-          );
-          setState((prevState) => ({ ...prevState, isLoading: false }));
-          return null;
-        }
+      if (!cardTokenAllowances || cardTokenAllowances.length === 0) {
+        const supportedTokens = sdk.getSupportedTokensByChainId();
 
-        const validAllowances = filterNonZeroAllowances(cardTokenAllowances);
-        if (validAllowances.length === 0) {
-          const defaultToken = cardTokenAllowances[0] || null;
-          dispatch(
-            setCardPriorityToken({
-              address: selectedAddress,
-              token: defaultToken,
-            }),
-          );
-          dispatch(
-            setCardPriorityTokenLastFetched({
-              address: selectedAddress,
-              lastFetched: new Date(),
-            }),
-          );
-          setState((prevState) => ({ ...prevState, isLoading: false }));
-          return defaultToken;
+        if (supportedTokens[0]) {
+          const fallbackToken = {
+            ...supportedTokens[0],
+            allowanceState: AllowanceState.NotEnabled,
+            isStaked: false,
+            caipChainId: formatChainIdToCaip(CHAIN_IDS.LINEA_MAINNET),
+            allowance: '0',
+          } as CardTokenAllowance;
+
+          return {
+            priorityToken: fallbackToken,
+            allTokensWithAllowances: [],
+          };
         }
 
-        const validTokenAddresses = validAllowances.map(
-          ({ address }) => address,
-        );
+        return { priorityToken: null, allTokensWithAllowances: [] };
+      }
 
-        const suggestedPriorityToken = await sdk.getPriorityToken(
-          selectedAddress,
-          validTokenAddresses as string[],
-        );
+      const validAllowances = filterNonZeroAllowances(cardTokenAllowances);
 
-        const matchingAllowance = suggestedPriorityToken
-          ? validAllowances.find(
-              ({ address }) =>
-                address?.toLowerCase() ===
-                suggestedPriorityToken.address?.toLowerCase(),
-            )
-          : undefined;
+      if (validAllowances.length === 0) {
+        return {
+          priorityToken: cardTokenAllowances[0] || null,
+          allTokensWithAllowances: cardTokenAllowances,
+        };
+      }
 
-        let finalToken: CardTokenAllowance | null = null;
+      const validTokenAddresses = validAllowances.map(({ address }) => address);
+      const suggestedPriorityToken = await sdk.getPriorityToken(
+        selectedAddress,
+        validTokenAddresses as string[],
+      );
 
-        if (matchingAllowance) {
-          const chainBalances = getBalancesForChain(
-            matchingAllowance.caipChainId,
-          );
+      const matchingAllowance = suggestedPriorityToken
+        ? validAllowances.find(
+            ({ address }) =>
+              address?.toLowerCase() ===
+              suggestedPriorityToken.address?.toLowerCase(),
+          )
+        : undefined;
 
-          const rawTokenBalance =
-            suggestedPriorityToken?.address &&
-            chainBalances[suggestedPriorityToken.address as Hex]
-              ? chainBalances[suggestedPriorityToken.address as Hex]
-              : '0';
-          const decimalTokenBalance = BigNumber(
-            renderFromTokenMinimalUnit(
-              rawTokenBalance,
-              suggestedPriorityToken?.decimals || 6,
-            ),
-          );
+      let finalToken: CardTokenAllowance | null = null;
 
-          if (decimalTokenBalance.gt(0)) {
-            finalToken = matchingAllowance;
-          } else {
-            const positiveBalanceAllowance =
-              findFirstAllowanceWithPositiveBalance(
-                validAllowances,
-                chainBalances,
-              );
-            finalToken = positiveBalanceAllowance ?? matchingAllowance;
-          }
-        } else {
-          finalToken = cardTokenAllowances[0] || null;
-        }
-
-        // Update cache with the final token and current timestamp
-        dispatch(
-          setCardPriorityToken({
-            address: selectedAddress,
-            token: finalToken,
-          }),
-        );
-        dispatch(
-          setCardPriorityTokenLastFetched({
-            address: selectedAddress,
-            lastFetched: new Date(),
-          }),
+      if (matchingAllowance) {
+        const chainBalances = getBalancesForChain(
+          matchingAllowance.caipChainId,
         );
 
-        setState((prevState) => ({ ...prevState, isLoading: false }));
-        return finalToken;
-      } catch (err) {
-        const normalizedError =
-          err instanceof Error ? err : new Error(String(err));
-        Logger.error(
-          normalizedError,
-          'useGetPriorityCardToken::error fetching priority token',
+        const rawTokenBalance =
+          suggestedPriorityToken?.address &&
+          chainBalances[suggestedPriorityToken.address as Hex]
+            ? chainBalances[suggestedPriorityToken.address as Hex]
+            : '0';
+        const decimalTokenBalance = BigNumber(
+          renderFromTokenMinimalUnit(
+            rawTokenBalance,
+            suggestedPriorityToken?.decimals || 6,
+          ),
         );
-        setState((prevState) => ({
-          ...prevState,
-          error: true,
-          isLoading: false,
-        }));
-        return null;
-      }
-    }, [sdk, selectedAddress, getBalancesForChain, dispatch]);
 
-  const fetchPriorityTokenAPI: () => Promise<CardTokenAllowance | null> =
-    useCallback(async () => {
-      try {
-        setState((prevState) => ({
-          ...prevState,
-          isLoading: true,
-          error: false,
-          warning: null,
-        }));
-
-        // Use provided data if available (to avoid duplicate calls)
-        let priorityWalletDetail: CardTokenAllowance | null = null;
-
-        if (externalWalletDetailsData?.priorityWalletDetail) {
-          priorityWalletDetail = externalWalletDetailsData.priorityWalletDetail;
+        if (decimalTokenBalance.gt(0)) {
+          finalToken = matchingAllowance;
+        } else {
+          const positiveBalanceAllowance =
+            findFirstAllowanceWithPositiveBalance(
+              validAllowances,
+              chainBalances,
+            );
+          finalToken = positiveBalanceAllowance ?? matchingAllowance;
         }
-
-        const warning = !priorityWalletDetail
-          ? CardStateWarning.NeedDelegation
-          : null;
-
-        setState((prevState) => ({
-          ...prevState,
-          isLoading: false,
-          warning,
-        }));
-
-        dispatch(setAuthenticatedPriorityToken(priorityWalletDetail));
-        dispatch(setAuthenticatedPriorityTokenLastFetched(new Date()));
-        return priorityWalletDetail;
-      } catch (err) {
-        const normalizedError =
-          err instanceof Error ? err : new Error(String(err));
-        Logger.error(
-          normalizedError,
-          'useGetPriorityCardToken::error fetching priority token API',
-        );
-        setState((prevState) => ({
-          ...prevState,
-          isLoading: false,
-          error: true,
-          warning: null,
-        }));
-        return null;
-      }
-    }, [externalWalletDetailsData, dispatch]);
-
-  const fetchPriorityToken: () => Promise<CardTokenAllowance | null> =
-    useCallback(async () => {
-      if (isAuthenticated) {
-        return fetchPriorityTokenAPI();
+      } else {
+        finalToken = cardTokenAllowances[0] || null;
       }
 
-      return fetchPriorityTokenOnChain();
-    }, [isAuthenticated, fetchPriorityTokenAPI, fetchPriorityTokenOnChain]);
+      return {
+        priorityToken: finalToken,
+        allTokensWithAllowances: cardTokenAllowances,
+      };
+    },
+    enabled: !isAuthenticated && !!sdk && !!selectedAddress,
+    staleTime: UNAUTHENTICATED_CACHE_DURATION,
+  });
 
-  // Sync authenticated priority token from external wallet data
-  useEffect(() => {
+  // --- Authenticated mode: derive from external wallet details ---
+  const authenticatedPriorityToken = useMemo(() => {
     if (!isAuthenticated || !externalWalletDetailsData) {
-      return;
+      return null;
     }
+    return externalWalletDetailsData.priorityWalletDetail ?? null;
+  }, [isAuthenticated, externalWalletDetailsData]);
 
-    const priorityWalletDetail = externalWalletDetailsData.priorityWalletDetail;
-    const warning = !priorityWalletDetail
+  const authenticatedWarning = useMemo(() => {
+    if (!isAuthenticated || !externalWalletDetailsData) {
+      return null;
+    }
+    return !externalWalletDetailsData.priorityWalletDetail
       ? CardStateWarning.NeedDelegation
       : null;
+  }, [isAuthenticated, externalWalletDetailsData]);
 
-    setState((prevState) => ({
-      ...prevState,
-      warning,
-    }));
+  // --- Unified outputs ---
+  const priorityToken = isAuthenticated
+    ? authenticatedPriorityToken
+    : (onChainData?.priorityToken ?? null);
 
-    dispatch(setAuthenticatedPriorityToken(priorityWalletDetail ?? null));
-    dispatch(setAuthenticatedPriorityTokenLastFetched(new Date()));
-  }, [isAuthenticated, externalWalletDetailsData, dispatch]);
+  const allTokensWithAllowances = isAuthenticated
+    ? null
+    : (onChainData?.allTokensWithAllowances ?? null);
 
-  // Auto-fetch on-chain priority token for unauthenticated users
-  useEffect(() => {
-    const run = async () => {
-      if (isAuthenticated || !selectedAddress || !sdk) {
-        return;
-      }
+  const warning = isAuthenticated ? authenticatedWarning : null;
 
-      // If cache is still valid, don't fetch
-      if (cacheIsValid) {
-        return;
-      }
+  const isLoading = isAuthenticated ? false : isLoadingOnChain;
 
-      // Unauthenticated mode: Fetch on-chain priority token when cache invalid
-      await fetchPriorityTokenOnChain();
-    };
+  const error = isAuthenticated ? false : !!onChainError;
 
-    run();
-  }, [
-    isAuthenticated,
-    selectedAddress,
-    cacheIsValid,
-    sdk,
-    fetchPriorityTokenOnChain,
-  ]);
+  const fetchPriorityToken = useCallback(async () => {
+    if (!isAuthenticated) {
+      const result = await refetchOnChain();
+      return result.data?.priorityToken ?? null;
+    }
+    return authenticatedPriorityToken;
+  }, [isAuthenticated, refetchOnChain, authenticatedPriorityToken]);
 
-  // Add priorityToken to the TokenListController if it exists
+  // Side effect: add priorityToken to the TokenListController if it exists
   useEffect(() => {
     let isCancelled = false;
 
@@ -537,12 +323,9 @@ export const useGetPriorityCardToken = (
             priorityToken.caipChainId &&
             isSolanaChainId(priorityToken.caipChainId)
           ) {
-            // Solana tokens are not supported in the TokenListController
             return;
           }
 
-          // Ensure chainId is in Hex format (convert from CAIP if needed)
-          // This handles cases where chainId might be in "eip155:59144" format
           const hexChainId = safeFormatChainIdToHex(
             priorityToken.caipChainId,
           ) as `0x${string}`;
@@ -564,10 +347,7 @@ export const useGetPriorityCardToken = (
             );
             const networkClientId =
               NetworkController.findNetworkClientIdByChainId(hexChainId as Hex);
-            setState((prevState) => ({
-              ...prevState,
-              isLoadingAddToken: true,
-            }));
+            setIsLoadingAddToken(true);
             await TokensController.addToken({
               address: priorityToken.address ?? '',
               symbol: priorityToken.symbol as string,
@@ -577,10 +357,7 @@ export const useGetPriorityCardToken = (
               networkClientId,
             });
             if (!isCancelled) {
-              setState((prevState) => ({
-                ...prevState,
-                isLoadingAddToken: false,
-              }));
+              setIsLoadingAddToken(false);
             }
           }
         }
@@ -592,18 +369,12 @@ export const useGetPriorityCardToken = (
             normalizedError,
             'useGetPriorityCardToken::error adding priority token',
           );
-          setState((prevState) => ({
-            ...prevState,
-            isLoadingAddToken: false,
-            error: true,
-            warning: null,
-          }));
+          setIsLoadingAddToken(false);
         }
       } finally {
-        setState((prevState) => ({
-          ...prevState,
-          isLoadingAddToken: false,
-        }));
+        if (!isCancelled) {
+          setIsLoadingAddToken(false);
+        }
       }
     };
 
@@ -614,14 +385,9 @@ export const useGetPriorityCardToken = (
     };
   }, [priorityToken, TokensController, NetworkController, selectedAddress]);
 
-  // Determine if we should show loading state
-  // Only show loading if we're actively fetching AND don't have cached data
-  const shouldShowLoading =
-    state.isLoading && (!priorityToken || !cacheIsValid);
-
   const isLoadingFinal = useMemo(
-    () => state.isLoadingAddToken || shouldShowLoading,
-    [state.isLoadingAddToken, shouldShowLoading],
+    () => isLoadingAddToken || isLoading,
+    [isLoadingAddToken, isLoading],
   );
 
   return {
@@ -629,7 +395,7 @@ export const useGetPriorityCardToken = (
     priorityToken,
     allTokensWithAllowances,
     isLoading: isLoadingFinal,
-    error: state.error,
-    warning: state.warning,
+    error,
+    warning,
   };
 };
diff --git a/app/components/UI/Card/hooks/useGetUserKYCStatus.test.tsx b/app/components/UI/Card/hooks/useGetUserKYCStatus.test.tsx
index 145a3ba14076..dfa3bb10a644 100644
--- a/app/components/UI/Card/hooks/useGetUserKYCStatus.test.tsx
+++ b/app/components/UI/Card/hooks/useGetUserKYCStatus.test.tsx
@@ -1,18 +1,40 @@
 import React from 'react';
-import { renderHook, waitFor, act } from '@testing-library/react-native';
+import { renderHook, act } from '@testing-library/react-native';
 import { Provider } from 'react-redux';
 import { configureStore } from '@reduxjs/toolkit';
 import useGetUserKYCStatus from './useGetUserKYCStatus';
 import { useCardSDK } from '../sdk';
 import { CardSDK } from '../sdk/CardSDK';
 import { CardError, CardErrorType } from '../types';
-import cardReducer from '../../../../core/redux/slices/card';
+import cardReducer, {
+  setIsAuthenticatedCard,
+} from '../../../../core/redux/slices/card';
 
 jest.mock('../sdk');
 
+let mockQueryFn: (() => Promise<unknown>) | undefined;
+const mockRefetch = jest.fn();
+let mockQueryReturn: {
+  data: unknown;
+  isLoading: boolean;
+  error: Error | null;
+  refetch: jest.Mock;
+} = {
+  data: undefined,
+  isLoading: false,
+  error: null,
+  refetch: mockRefetch,
+};
+
+jest.mock('@tanstack/react-query', () => ({
+  useQuery: jest.fn().mockImplementation((config) => {
+    mockQueryFn = config.queryFn;
+    return mockQueryReturn;
+  }),
+}));
+
 const mockUseCardSDK = useCardSDK as jest.MockedFunction<typeof useCardSDK>;
 
-// Helper to create a test store
 const createTestStore = () =>
   configureStore({
     reducer: {
@@ -39,182 +61,221 @@ describe('useGetUserKYCStatus', () => {
   beforeEach(() => {
     jest.clearAllMocks();
     mockUseCardSDK.mockReturnValue(mockCardSDKContext);
+
+    mockQueryReturn = {
+      data: undefined,
+      isLoading: false,
+      error: null,
+      refetch: mockRefetch,
+    };
+    mockRefetch.mockResolvedValue({ data: null });
+    mockQueryFn = undefined;
   });
 
-  it('does not fetch when user is not authenticated', () => {
+  it('does not enable query when user is not authenticated', () => {
+    const { useQuery: mockUseQuery } = jest.requireMock(
+      '@tanstack/react-query',
+    );
+
     const store = createTestStore();
-    renderHook(() => useGetUserKYCStatus(false), {
+    renderHook(() => useGetUserKYCStatus(), {
       wrapper: ({ children }) => <Provider store={store}>{children}</Provider>,
     });
 
-    expect(mockGetUserDetails).not.toHaveBeenCalled();
+    expect(mockUseQuery).toHaveBeenCalledWith(
+      expect.objectContaining({
+        enabled: false,
+      }),
+    );
   });
 
-  it('fetches KYC status when authenticated', async () => {
-    mockGetUserDetails.mockResolvedValue({
-      id: 'user-123',
-      verificationState: 'VERIFIED',
-    });
+  it('query is always disabled (fetching is done via fetchKYCStatus)', () => {
+    const { useQuery: mockUseQuery } = jest.requireMock(
+      '@tanstack/react-query',
+    );
 
     const store = createTestStore();
-    const { result } = renderHook(() => useGetUserKYCStatus(true), {
+    store.dispatch(setIsAuthenticatedCard(true));
+
+    renderHook(() => useGetUserKYCStatus(), {
       wrapper: ({ children }) => <Provider store={store}>{children}</Provider>,
     });
 
-    // Given: fetch on mount is disabled, nothing is fetched automatically
-    expect(mockGetUserDetails).not.toHaveBeenCalled();
-
-    // When: fetching explicitly
-    await act(async () => {
-      await result.current.fetchKYCStatus();
-    });
+    expect(mockUseQuery).toHaveBeenCalledWith(
+      expect.objectContaining({
+        enabled: false,
+      }),
+    );
+  });
 
-    // Then: SDK is called and state is updated from cache
-    await waitFor(() => {
-      expect(mockGetUserDetails).toHaveBeenCalledTimes(1);
-      expect(result.current.isLoading).toBe(false);
-    });
-    expect(result.current.kycStatus).toEqual({
+  it('returns KYC status data from query', () => {
+    const kycData = {
       verificationState: 'VERIFIED',
       userId: 'user-123',
       userDetails: {
         id: 'user-123',
         verificationState: 'VERIFIED',
       },
+    };
+    mockQueryReturn.data = kycData;
+
+    const store = createTestStore();
+    const { result } = renderHook(() => useGetUserKYCStatus(), {
+      wrapper: ({ children }) => <Provider store={store}>{children}</Provider>,
     });
+
+    expect(result.current.kycStatus).toEqual(kycData);
     expect(result.current.error).toBeNull();
   });
 
-  it('returns PENDING state when user verification is pending', async () => {
-    mockGetUserDetails.mockResolvedValue({
-      id: 'user-123',
+  it('returns PENDING state when user verification is pending', () => {
+    mockQueryReturn.data = {
       verificationState: 'PENDING',
-    });
+      userId: 'user-123',
+      userDetails: { id: 'user-123', verificationState: 'PENDING' },
+    };
 
     const store = createTestStore();
-    const { result } = renderHook(() => useGetUserKYCStatus(true), {
+    const { result } = renderHook(() => useGetUserKYCStatus(), {
       wrapper: ({ children }) => <Provider store={store}>{children}</Provider>,
     });
 
-    await act(async () => {
-      await result.current.fetchKYCStatus();
-    });
-
-    await waitFor(() => {
-      expect(result.current.kycStatus?.verificationState).toBe('PENDING');
-    });
+    expect(result.current.kycStatus?.verificationState).toBe('PENDING');
   });
 
-  it('returns REJECTED state when user verification is rejected', async () => {
-    mockGetUserDetails.mockResolvedValue({
-      id: 'user-123',
+  it('returns REJECTED state when user verification is rejected', () => {
+    mockQueryReturn.data = {
       verificationState: 'REJECTED',
-    });
+      userId: 'user-123',
+      userDetails: { id: 'user-123', verificationState: 'REJECTED' },
+    };
 
     const store = createTestStore();
-    const { result } = renderHook(() => useGetUserKYCStatus(true), {
+    const { result } = renderHook(() => useGetUserKYCStatus(), {
       wrapper: ({ children }) => <Provider store={store}>{children}</Provider>,
     });
 
-    await act(async () => {
-      await result.current.fetchKYCStatus();
-    });
-
-    await waitFor(() => {
-      expect(result.current.kycStatus?.verificationState).toBe('REJECTED');
-    });
+    expect(result.current.kycStatus?.verificationState).toBe('REJECTED');
   });
 
-  it('sets error and clears KYC status when API call fails', async () => {
-    const mockError = new CardError(
+  it('returns error when query fails', () => {
+    mockQueryReturn.error = new CardError(
       CardErrorType.SERVER_ERROR,
       'Failed to fetch',
     );
-    mockGetUserDetails.mockRejectedValue(mockError);
 
     const store = createTestStore();
-    const { result } = renderHook(() => useGetUserKYCStatus(true), {
+    const { result } = renderHook(() => useGetUserKYCStatus(), {
       wrapper: ({ children }) => <Provider store={store}>{children}</Provider>,
     });
 
-    await act(async () => {
-      await result.current.fetchKYCStatus();
-    });
-
-    await waitFor(() => {
-      expect(mockGetUserDetails).toHaveBeenCalledTimes(1);
-      expect(result.current.isLoading).toBe(false);
-      expect(result.current.error).toBeTruthy();
-      expect(result.current.kycStatus).toBeNull();
-    });
+    expect(result.current.error).toBeTruthy();
+    expect(result.current.kycStatus).toBeNull();
   });
 
-  it('refetches KYC status when fetchKYCStatus is called manually', async () => {
-    mockGetUserDetails.mockResolvedValue({
-      id: 'user-123',
+  it('calls refetch when fetchKYCStatus is invoked', async () => {
+    const kycData = {
       verificationState: 'VERIFIED',
-    });
+      userId: 'user-123',
+      userDetails: { id: 'user-123', verificationState: 'VERIFIED' },
+    };
+    mockRefetch.mockResolvedValue({ data: kycData });
 
     const store = createTestStore();
-    const { result } = renderHook(() => useGetUserKYCStatus(true), {
+    const { result } = renderHook(() => useGetUserKYCStatus(), {
       wrapper: ({ children }) => <Provider store={store}>{children}</Provider>,
     });
 
-    expect(mockGetUserDetails).not.toHaveBeenCalled();
-
     await act(async () => {
-      await result.current.fetchKYCStatus();
+      const fetchResult = await result.current.fetchKYCStatus();
+      expect(fetchResult).toEqual(kycData);
     });
 
-    await waitFor(() => {
-      expect(mockGetUserDetails).toHaveBeenCalledTimes(1);
+    expect(mockRefetch).toHaveBeenCalledTimes(1);
+  });
+
+  it('refetches KYC status when fetchKYCStatus is called multiple times', async () => {
+    mockRefetch.mockResolvedValue({ data: null });
+
+    const store = createTestStore();
+    const { result } = renderHook(() => useGetUserKYCStatus(), {
+      wrapper: ({ children }) => <Provider store={store}>{children}</Provider>,
     });
 
     await act(async () => {
       await result.current.fetchKYCStatus();
     });
 
-    await waitFor(() => {
-      expect(mockGetUserDetails).toHaveBeenCalledTimes(2);
+    await act(async () => {
+      await result.current.fetchKYCStatus();
     });
+
+    expect(mockRefetch).toHaveBeenCalledTimes(2);
   });
 
-  it('returns null status when SDK is not available', () => {
+  it('disables query when SDK is not available even if authenticated', () => {
+    const { useQuery: mockUseQuery } = jest.requireMock(
+      '@tanstack/react-query',
+    );
+
     mockUseCardSDK.mockReturnValue({
       ...mockCardSDKContext,
       sdk: null,
     });
 
     const store = createTestStore();
-    const { result } = renderHook(() => useGetUserKYCStatus(true), {
+    store.dispatch(setIsAuthenticatedCard(true));
+
+    const { result } = renderHook(() => useGetUserKYCStatus(), {
       wrapper: ({ children }) => <Provider store={store}>{children}</Provider>,
     });
 
+    expect(mockUseQuery).toHaveBeenCalledWith(
+      expect.objectContaining({
+        enabled: false,
+      }),
+    );
     expect(result.current.kycStatus).toBeNull();
     expect(result.current.isLoading).toBe(false);
     expect(result.current.error).toBeNull();
   });
 
-  it('sets verificationState to null when missing from API response', async () => {
+  it('queryFn returns correct shape from SDK response', async () => {
     mockGetUserDetails.mockResolvedValue({
       id: 'user-123',
-      // verificationState is undefined
+      verificationState: 'VERIFIED',
     });
 
     const store = createTestStore();
-    const { result } = renderHook(() => useGetUserKYCStatus(true), {
+    renderHook(() => useGetUserKYCStatus(), {
       wrapper: ({ children }) => <Provider store={store}>{children}</Provider>,
     });
 
-    await act(async () => {
-      await result.current.fetchKYCStatus();
+    expect(mockQueryFn).toBeDefined();
+    const queryResult = await mockQueryFn?.();
+    expect(queryResult).toEqual({
+      verificationState: 'VERIFIED',
+      userId: 'user-123',
+      userDetails: {
+        id: 'user-123',
+        verificationState: 'VERIFIED',
+      },
+    });
+  });
+
+  it('queryFn sets verificationState to null when missing from API response', async () => {
+    mockGetUserDetails.mockResolvedValue({
+      id: 'user-123',
     });
 
-    await waitFor(() => {
-      expect(result.current.isLoading).toBe(false);
+    const store = createTestStore();
+    renderHook(() => useGetUserKYCStatus(), {
+      wrapper: ({ children }) => <Provider store={store}>{children}</Provider>,
     });
 
-    expect(result.current.kycStatus).toEqual({
+    expect(mockQueryFn).toBeDefined();
+    const queryResult = await mockQueryFn?.();
+    expect(queryResult).toEqual({
       verificationState: null,
       userId: 'user-123',
       userDetails: {
diff --git a/app/components/UI/Card/hooks/useGetUserKYCStatus.ts b/app/components/UI/Card/hooks/useGetUserKYCStatus.ts
index de1208058928..a3367d2bc8f8 100644
--- a/app/components/UI/Card/hooks/useGetUserKYCStatus.ts
+++ b/app/components/UI/Card/hooks/useGetUserKYCStatus.ts
@@ -1,8 +1,9 @@
-import { useCallback } from 'react';
+import { useCallback, useRef } from 'react';
+import { useQuery } from '@tanstack/react-query';
 import { useCardSDK } from '../sdk';
 import Logger from '../../../../util/Logger';
 import { CardVerificationState, UserResponse } from '../types';
-import { useWrapWithCache } from './useWrapWithCache';
+import { cardQueries } from '../queries';
 
 export interface UserKYCStatus {
   verificationState: CardVerificationState | null;
@@ -18,50 +19,49 @@ interface UseGetUserKYCStatusResult {
 }
 
 /**
- * Hook to fetch user KYC verification status
- * Only fetches when user is authenticated
+ * Hook to fetch user KYC verification status.
  *
- * @param isAuthenticated - Whether the user is authenticated
- * @returns {UseGetUserKYCStatusResult} KYC status data, loading state, error, and fetch function
+ * @returns KYC status data, loading state, error, and fetch function
  */
-const useGetUserKYCStatus = (
-  isAuthenticated: boolean,
-): UseGetUserKYCStatusResult => {
+const useGetUserKYCStatus = (): UseGetUserKYCStatusResult => {
   const { sdk } = useCardSDK();
+  const sdkRef = useRef(sdk);
+  sdkRef.current = sdk;
 
-  const fetchKYCStatusInternal = useCallback(async () => {
-    if (!isAuthenticated || !sdk) {
-      return null;
-    }
+  const { data, isLoading, error, refetch } = useQuery<UserKYCStatus | null>({
+    queryKey: cardQueries.dashboard.keys.kycStatus(),
+    queryFn: async () => {
+      try {
+        const currentSdk = sdkRef.current;
+        if (!currentSdk) throw new Error('SDK not initialized');
+        const response = await currentSdk.getUserDetails();
 
-    try {
-      const response = await sdk.getUserDetails();
-
-      return {
-        verificationState: response.verificationState ?? null,
-        userId: response.id,
-        userDetails: response,
-      };
-    } catch (err) {
-      const errorMessage =
-        err instanceof Error ? err : new Error('Failed to fetch KYC status');
-      Logger.log('useGetUserKYCStatus: Error fetching KYC status', err);
-      throw errorMessage;
-    }
-  }, [sdk, isAuthenticated]);
-
-  const cacheResult = useWrapWithCache('kyc-status', fetchKYCStatusInternal, {
-    cacheDuration: 60 * 1000, // 60 seconds cache
-    fetchOnMount: false, // Disabled - fetchAllData orchestrates fetching
+        return {
+          verificationState: response.verificationState ?? null,
+          userId: response.id,
+          userDetails: response,
+        };
+      } catch (err) {
+        const errorMessage =
+          err instanceof Error ? err : new Error('Failed to fetch KYC status');
+        Logger.log('useGetUserKYCStatus: Error fetching KYC status', err);
+        throw errorMessage;
+      }
+    },
+    enabled: false,
+    staleTime: 0,
   });
 
-  const { data, isLoading, error, fetchData } = cacheResult;
+  const fetchKYCStatus = useCallback(async () => {
+    const result = await refetch();
+    return result.data ?? null;
+  }, [refetch]);
 
   return {
-    kycStatus: data,
+    kycStatus: data ?? null,
     isLoading,
-    error,
-    fetchKYCStatus: fetchData,
+    error: error as Error | null,
+    fetchKYCStatus,
   };
 };
 
diff --git a/app/components/UI/Card/hooks/useLoadCardData.test.ts b/app/components/UI/Card/hooks/useLoadCardData.test.ts
index 6f0b17a65bb1..f8f47001d2f9 100644
--- a/app/components/UI/Card/hooks/useLoadCardData.test.ts
+++ b/app/components/UI/Card/hooks/useLoadCardData.test.ts
@@ -18,6 +18,7 @@ import {
   DelegationSettingsResponse,
   CardErrorType,
 } from '../types';
+import { cardQueries } from '../queries';
 
 const mockUseSelector = useSelector as jest.MockedFunction<typeof useSelector>;
 
@@ -33,6 +34,11 @@ jest.mock('./useGetDelegationSettings');
 jest.mock('./useGetLatestAllowanceForPriorityToken');
 jest.mock('./useGetUserKYCStatus');
 
+const mockRefetchQueries = jest.fn();
+jest.mock('@tanstack/react-query', () => ({
+  useQueryClient: jest.fn(),
+}));
+
 const mockUseIsBaanxLoginEnabled =
   useIsBaanxLoginEnabled as jest.MockedFunction<typeof useIsBaanxLoginEnabled>;
 const mockUseCardDetails = useCardDetails as jest.MockedFunction<
@@ -58,6 +64,9 @@ const mockUseGetUserKYCStatus = useGetUserKYCStatus as jest.MockedFunction<
   typeof useGetUserKYCStatus
 >;
 
+let mockIsAuthenticated = false;
+const mockSelectedAddress = '0xMockAddress';
+
 describe('useLoadCardData', () => {
   const mockPriorityToken: CardTokenAllowance = {
     address: '0xToken1',
@@ -123,8 +132,21 @@ describe('useLoadCardData', () => {
   beforeEach(() => {
     jest.clearAllMocks();
 
-    // Default mocks for all hooks
-    mockUseSelector.mockReturnValue(false); // isAuthenticated = false by default
+    mockRefetchQueries.mockResolvedValue(undefined);
+    (
+      jest.requireMock('@tanstack/react-query') as {
+        useQueryClient: jest.Mock;
+      }
+    ).useQueryClient.mockReturnValue({
+      refetchQueries: mockRefetchQueries,
+    });
+
+    mockIsAuthenticated = false;
+    mockUseSelector.mockImplementation(() => {
+      const callIndex = mockUseSelector.mock.calls.length;
+      if (callIndex % 2 === 1) return mockIsAuthenticated;
+      return () => ({ address: mockSelectedAddress });
+    });
 
     mockUseIsBaanxLoginEnabled.mockReturnValue(true);
 
@@ -180,7 +202,7 @@ describe('useLoadCardData', () => {
 
   describe('Unauthenticated Mode', () => {
     beforeEach(() => {
-      mockUseSelector.mockReturnValue(false); // Not authenticated
+      mockIsAuthenticated = false; // Not authenticated
     });
 
     it('returns priority token and all tokens from on-chain data', () => {
@@ -333,20 +355,26 @@ describe('useLoadCardData', () => {
       expect(result.current.isBaanxLoginEnabled).toBe(true);
     });
 
-    it('does not call fetchExternalWalletDetails in unauthenticated mode', async () => {
+    it('refetches only on-chain priority token in unauthenticated mode', async () => {
       const { result } = renderHook(() => useLoadCardData());
 
       await act(async () => {
         await result.current.fetchAllData();
       });
 
-      expect(mockFetchExternalWalletDetails).not.toHaveBeenCalled();
+      expect(mockRefetchQueries).toHaveBeenCalledWith({
+        queryKey:
+          cardQueries.dashboard.keys.priorityTokenOnChain(mockSelectedAddress),
+      });
+      expect(mockRefetchQueries).not.toHaveBeenCalledWith({
+        queryKey: cardQueries.dashboard.keys.externalWalletDetails(),
+      });
     });
   });
 
   describe('Authenticated Mode', () => {
     beforeEach(() => {
-      mockUseSelector.mockReturnValue(true); // Authenticated
+      mockIsAuthenticated = true; // Authenticated
     });
 
     it('returns priority token and all tokens from API data', () => {
@@ -409,7 +437,7 @@ describe('useLoadCardData', () => {
       mockUseGetCardExternalWalletDetails.mockReturnValue({
         data: {
           walletDetails: [],
-          priorityWalletDetail: null,
+          priorityWalletDetail: undefined,
           mappedWalletDetails: [],
         },
         isLoading: false,
@@ -422,25 +450,22 @@ describe('useLoadCardData', () => {
       expect(result.current.allTokens).toEqual([]);
     });
 
-    it('calls all fetch functions when fetchAllData is invoked', async () => {
+    it('fetches delegation settings first, then wallet details, card details, and KYC in parallel', async () => {
       const { result } = renderHook(() => useLoadCardData());
 
       await act(async () => {
         await result.current.fetchAllData();
       });
 
-      expect(mockFetchPriorityToken).toHaveBeenCalledTimes(1);
-      expect(mockFetchCardDetails).toHaveBeenCalledTimes(1);
+      expect(mockFetchDelegationSettings).toHaveBeenCalledTimes(1);
       expect(mockFetchExternalWalletDetails).toHaveBeenCalledTimes(1);
+      expect(mockFetchCardDetails).toHaveBeenCalledTimes(1);
+      expect(mockFetchKYCStatus).toHaveBeenCalledTimes(1);
     });
 
     it('handles fetchAllData errors gracefully', async () => {
-      mockFetchPriorityToken.mockRejectedValue(
-        new Error('Priority token error'),
-      );
-      mockFetchCardDetails.mockRejectedValue(new Error('Card details error'));
       mockFetchExternalWalletDetails.mockRejectedValue(
-        new Error('External wallet error'),
+        new Error('Refetch failed'),
       );
 
       const { result } = renderHook(() => useLoadCardData());
@@ -489,7 +514,7 @@ describe('useLoadCardData', () => {
     });
 
     it('handles null delegation settings gracefully in authenticated mode', () => {
-      mockUseSelector.mockReturnValue(true); // Authenticated
+      mockIsAuthenticated = true; // Authenticated
       mockUseGetDelegationSettings.mockReturnValue({
         data: null,
         isLoading: false,
@@ -503,7 +528,7 @@ describe('useLoadCardData', () => {
     });
 
     it('handles null external wallet details gracefully in authenticated mode', () => {
-      mockUseSelector.mockReturnValue(true); // Authenticated
+      mockIsAuthenticated = true; // Authenticated
       mockUseGetCardExternalWalletDetails.mockReturnValue({
         data: null,
         isLoading: false,
@@ -589,7 +614,7 @@ describe('useLoadCardData', () => {
 
   describe('Mode Switching', () => {
     it('switches from unauthenticated to authenticated mode', () => {
-      mockUseSelector.mockReturnValue(false); // Start unauthenticated
+      mockIsAuthenticated = false; // Start unauthenticated
 
       const { result, rerender } = renderHook(() => useLoadCardData());
 
@@ -597,7 +622,7 @@ describe('useLoadCardData', () => {
       expect(result.current.delegationSettings).toBeNull();
       expect(result.current.externalWalletDetailsData).toBeNull();
 
-      mockUseSelector.mockReturnValue(true); // Switch to authenticated
+      mockIsAuthenticated = true; // Switch to authenticated
 
       rerender();
 
@@ -609,14 +634,14 @@ describe('useLoadCardData', () => {
     });
 
     it('switches from authenticated to unauthenticated mode', () => {
-      mockUseSelector.mockReturnValue(true); // Start authenticated
+      mockIsAuthenticated = true; // Start authenticated
 
       const { result, rerender } = renderHook(() => useLoadCardData());
 
       expect(result.current.isAuthenticated).toBe(true);
       expect(result.current.delegationSettings).toEqual(mockDelegationSettings);
 
-      mockUseSelector.mockReturnValue(false); // Switch to unauthenticated
+      mockIsAuthenticated = false; // Switch to unauthenticated
 
       rerender();
 
@@ -638,7 +663,7 @@ describe('useLoadCardData', () => {
         },
       ];
 
-      mockUseSelector.mockReturnValue(false); // Unauthenticated
+      mockIsAuthenticated = false; // Unauthenticated
       mockUseGetPriorityCardToken.mockReturnValue({
         priorityToken: unauthenticatedTokens[0],
         allTokensWithAllowances: unauthenticatedTokens,
@@ -652,7 +677,7 @@ describe('useLoadCardData', () => {
 
       expect(result.current.allTokens).toEqual(unauthenticatedTokens);
 
-      mockUseSelector.mockReturnValue(true); // Authenticated
+      mockIsAuthenticated = true; // Authenticated
 
       rerender();
 
@@ -663,7 +688,7 @@ describe('useLoadCardData', () => {
   describe('Latest Allowance', () => {
     describe('Authenticated Mode', () => {
       beforeEach(() => {
-        mockUseSelector.mockReturnValue(true); // Authenticated
+        mockIsAuthenticated = true; // Authenticated
       });
 
       it('adds totalAllowance to priority token when latest allowance is available', () => {
@@ -767,7 +792,7 @@ describe('useLoadCardData', () => {
 
     describe('Unauthenticated Mode', () => {
       beforeEach(() => {
-        mockUseSelector.mockReturnValue(false); // Unauthenticated
+        mockIsAuthenticated = false; // Unauthenticated
       });
 
       it('returns priority token without totalAllowance property', () => {
@@ -801,7 +826,7 @@ describe('useLoadCardData', () => {
       });
 
       it('ignores latest allowance when switching from authenticated to unauthenticated', () => {
-        mockUseSelector.mockReturnValue(true); // Start authenticated
+        mockIsAuthenticated = true; // Start authenticated
         const latestAllowance = '2000000000000';
         mockUseGetLatestAllowanceForPriorityToken.mockReturnValue({
           latestAllowance,
@@ -816,7 +841,7 @@ describe('useLoadCardData', () => {
           latestAllowance,
         );
 
-        mockUseSelector.mockReturnValue(false); // Switch to unauthenticated
+        mockIsAuthenticated = false; // Switch to unauthenticated
 
         rerender();
 
@@ -830,14 +855,15 @@ describe('useLoadCardData', () => {
 
   describe('Fetch Functions', () => {
     beforeEach(() => {
-      // Reset fetch mocks to ensure clean state for each test
       mockFetchPriorityToken.mockReset().mockResolvedValue(undefined);
       mockFetchCardDetails.mockReset().mockResolvedValue(undefined);
       mockFetchExternalWalletDetails.mockReset().mockResolvedValue(undefined);
+      mockFetchDelegationSettings.mockReset().mockResolvedValue(undefined);
+      mockFetchKYCStatus.mockReset().mockResolvedValue(undefined);
     });
 
-    it('fetchAllData executes all fetches in parallel for unauthenticated mode', async () => {
-      mockUseSelector.mockReturnValue(false); // Unauthenticated
+    it('fetchAllData refetches on-chain priority token for unauthenticated mode', async () => {
+      mockIsAuthenticated = false; // Unauthenticated
 
       const { result } = renderHook(() => useLoadCardData());
 
@@ -845,13 +871,15 @@ describe('useLoadCardData', () => {
         await result.current.fetchAllData();
       });
 
-      expect(mockFetchPriorityToken).toHaveBeenCalledTimes(1);
-      expect(mockFetchCardDetails).not.toHaveBeenCalled();
-      expect(mockFetchExternalWalletDetails).not.toHaveBeenCalled();
+      expect(mockRefetchQueries).toHaveBeenCalledTimes(1);
+      expect(mockRefetchQueries).toHaveBeenCalledWith({
+        queryKey:
+          cardQueries.dashboard.keys.priorityTokenOnChain(mockSelectedAddress),
+      });
     });
 
-    it('fetchAllData executes all fetches in parallel for authenticated mode', async () => {
-      mockUseSelector.mockReturnValue(true); // Authenticated
+    it('fetchAllData fetches delegation settings first then other queries for authenticated mode', async () => {
+      mockIsAuthenticated = true; // Authenticated
 
       const { result } = renderHook(() => useLoadCardData());
 
@@ -859,9 +887,9 @@ describe('useLoadCardData', () => {
         await result.current.fetchAllData();
       });
 
-      expect(mockFetchPriorityToken).toHaveBeenCalledTimes(1);
-      expect(mockFetchCardDetails).toHaveBeenCalledTimes(1);
+      expect(mockFetchDelegationSettings).toHaveBeenCalledTimes(1);
       expect(mockFetchExternalWalletDetails).toHaveBeenCalledTimes(1);
+      expect(mockFetchCardDetails).toHaveBeenCalledTimes(1);
       expect(mockFetchKYCStatus).toHaveBeenCalledTimes(1);
     });
   });
@@ -869,7 +897,7 @@ describe('useLoadCardData', () => {
   describe('KYC Status', () => {
     describe('Authenticated Mode', () => {
       beforeEach(() => {
-        mockUseSelector.mockReturnValue(true); // Authenticated
+        mockIsAuthenticated = true; // Authenticated
       });
 
       it('returns KYC status when user is verified', () => {
@@ -1013,9 +1041,7 @@ describe('useLoadCardData', () => {
         });
       });
 
-      it('fetches KYC status when fetchAllData is called', async () => {
-        mockFetchKYCStatus.mockReset().mockResolvedValue(undefined);
-
+      it('refetches KYC status when fetchAllData is called', async () => {
         const { result } = renderHook(() => useLoadCardData());
 
         await act(async () => {
@@ -1060,7 +1086,7 @@ describe('useLoadCardData', () => {
 
     describe('Unauthenticated Mode', () => {
       beforeEach(() => {
-        mockUseSelector.mockReturnValue(false); // Unauthenticated
+        mockIsAuthenticated = false; // Unauthenticated
       });
 
       it('returns null KYC status', () => {
@@ -1110,28 +1136,28 @@ describe('useLoadCardData', () => {
         expect(result.current.error).toBeFalsy();
       });
 
-      it('does not fetch KYC status when fetchAllData is called', async () => {
-        mockFetchKYCStatus.mockReset().mockResolvedValue(undefined);
-
+      it('does not refetch KYC status when fetchAllData is called', async () => {
         const { result } = renderHook(() => useLoadCardData());
 
         await act(async () => {
           await result.current.fetchAllData();
         });
 
-        expect(mockFetchKYCStatus).not.toHaveBeenCalled();
+        expect(mockRefetchQueries).not.toHaveBeenCalledWith({
+          queryKey: cardQueries.dashboard.keys.kycStatus(),
+        });
       });
     });
 
     describe('Mode Switching', () => {
       it('returns KYC status when switching from unauthenticated to authenticated', () => {
-        mockUseSelector.mockReturnValue(false); // Start unauthenticated
+        mockIsAuthenticated = false; // Start unauthenticated
 
         const { result, rerender } = renderHook(() => useLoadCardData());
 
         expect(result.current.kycStatus).toBeNull();
 
-        mockUseSelector.mockReturnValue(true); // Switch to authenticated
+        mockIsAuthenticated = true; // Switch to authenticated
 
         rerender();
 
@@ -1143,7 +1169,7 @@ describe('useLoadCardData', () => {
       });
 
       it('returns null KYC status when switching from authenticated to unauthenticated', () => {
-        mockUseSelector.mockReturnValue(true); // Start authenticated
+        mockIsAuthenticated = true; // Start authenticated
         mockUseGetUserKYCStatus.mockReturnValue({
           kycStatus: {
             verificationState: 'VERIFIED',
@@ -1163,7 +1189,7 @@ describe('useLoadCardData', () => {
           userDetails: { id: 'user-123' },
         });
 
-        mockUseSelector.mockReturnValue(false); // Switch to unauthenticated
+        mockIsAuthenticated = false; // Switch to unauthenticated
 
         rerender();
 
diff --git a/app/components/UI/Card/hooks/useLoadCardData.ts b/app/components/UI/Card/hooks/useLoadCardData.ts
index e30561947802..cca8f1aee9ff 100644
--- a/app/components/UI/Card/hooks/useLoadCardData.ts
+++ b/app/components/UI/Card/hooks/useLoadCardData.ts
@@ -1,6 +1,8 @@
 import { useSelector } from 'react-redux';
-import { useMemo } from 'react';
+import { useCallback, useMemo, useRef } from 'react';
+import { useQueryClient } from '@tanstack/react-query';
 import { selectIsAuthenticatedCard } from '../../../../core/redux/slices/card';
+import { selectSelectedInternalAccountByScope } from '../../../../selectors/multichainAccounts/accounts';
 import useIsBaanxLoginEnabled from './isBaanxLoginEnabled';
 import useCardDetails from './useCardDetails';
 import { useGetPriorityCardToken } from './useGetPriorityCardToken';
@@ -9,39 +11,16 @@ import useGetDelegationSettings from './useGetDelegationSettings';
 import useGetLatestAllowanceForPriorityToken from './useGetLatestAllowanceForPriorityToken';
 import useGetUserKYCStatus from './useGetUserKYCStatus';
 import { CardTokenAllowance, CardStateWarning } from '../types';
+import { cardQueries } from '../queries';
 
-/**
- * Hook to load card data.
- *
- * The hook has two modes when landing on the Card Home page:
- * 1. Authenticated mode: The user is authenticated and has a priority token -- everything should be fetched from the API.
- * 2. Unauthenticated mode: The user is not authenticated BUT is a Cardholder -- everything should be fetched on-chain.
- *
- * The isAuthenticated flag is used to determine the mode.
- *
- * The hook will return the following data:
- * Shared by both modes:
- * - Priority token (single token with highest priority)
- * - All available tokens with allowances (for asset selection)
- * - Asset Balance (via useAssetBalances hook - used separately)
- * - Open Swaps (via useOpenSwaps hook - used separately)
- * - Card Details (for card status, type, etc.)
- *
- * @returns Object containing:
- * - priorityToken: The token with highest priority (first with balance)
- * - allTokens: All available tokens with allowances (for asset selection bottom sheet)
- * - cardDetails: Card details (status, type, etc.)
- * - isLoading: Combined loading state
- * - error: Combined error state
- * - isAuthenticated: Current authentication status
- * - isBaanxLoginEnabled: Whether Baanx login is enabled
- * - isCardholder: Whether user is a cardholder
- */
 const useLoadCardData = () => {
   const isAuthenticated = useSelector(selectIsAuthenticatedCard);
   const isBaanxLoginEnabled = useIsBaanxLoginEnabled();
+  const queryClient = useQueryClient();
+  const selectedAddress = useSelector(selectSelectedInternalAccountByScope)(
+    'eip155:0',
+  )?.address;
 
-  // Get delegation settings (only used in authenticated mode)
   const {
     data: delegationSettings,
     isLoading: isLoadingDelegationSettings,
@@ -49,8 +28,6 @@ const useLoadCardData = () => {
     fetchData: fetchDelegationSettings,
   } = useGetDelegationSettings();
 
-  // Authenticated mode: Get all wallet details from API
-  // Pass delegationSettings to avoid duplicate hook calls
   const {
     data: externalWalletDetailsData,
     isLoading: isLoadingExternalWalletDetails,
@@ -58,20 +35,14 @@ const useLoadCardData = () => {
     fetchData: fetchExternalWalletDetails,
   } = useGetCardExternalWalletDetails(delegationSettings);
 
-  // Get priority token (works for both authenticated and unauthenticated)
-  // Authenticated: uses externalWalletDetailsData
-  // Unauthenticated: fetches allowances internally via sdk.getSupportedTokensAllowances()
   const {
     priorityToken,
     allTokensWithAllowances,
     isLoading: isLoadingPriorityToken,
     error: priorityTokenError,
     warning: priorityTokenWarning,
-    fetchPriorityToken,
   } = useGetPriorityCardToken(externalWalletDetailsData);
 
-  // Get latest allowance for priority token (authenticated mode only, for spending limit display)
-  // This fetches the most recent approval amount from on-chain logs
   const {
     latestAllowance: priorityTokenLatestAllowance,
     isLoading: isLoadingLatestAllowance,
@@ -79,15 +50,13 @@ const useLoadCardData = () => {
     isAuthenticated ? priorityToken : null,
   );
 
-  // Get user KYC status (authenticated mode only)
   const {
     kycStatus,
     isLoading: isLoadingKYCStatus,
     error: kycStatusError,
     fetchKYCStatus,
-  } = useGetUserKYCStatus(isAuthenticated);
+  } = useGetUserKYCStatus();
 
-  // Update priority token with latest allowance if available
   const priorityTokenWithLatestAllowance = useMemo(() => {
     if (!priorityToken || !isAuthenticated) {
       return priorityToken;
@@ -99,26 +68,21 @@ const useLoadCardData = () => {
     };
   }, [priorityToken, priorityTokenLatestAllowance, isAuthenticated]);
 
-  // Get card details (only needed for unauthenticated mode)
   const {
     cardDetails,
     isLoading: isLoadingCardDetails,
     error: cardDetailsError,
     warning: cardDetailsWarning,
-    fetchCardDetails,
+    fetchCardDetails: fetchCardDetailsQuery,
   } = useCardDetails();
 
-  // Determine which tokens list to use based on authentication status
   const allTokens: CardTokenAllowance[] = useMemo(() => {
     if (isAuthenticated) {
-      // Authenticated: Use API data (tokens user has delegated)
       return externalWalletDetailsData?.mappedWalletDetails || [];
     }
-    // Unauthenticated: Use on-chain data from useGetPriorityCardToken
     return allTokensWithAllowances || [];
   }, [externalWalletDetailsData, isAuthenticated, allTokensWithAllowances]);
 
-  // Combined loading state
   const isLoading = useMemo(() => {
     const baseLoading =
       isLoadingPriorityToken ||
@@ -144,7 +108,6 @@ const useLoadCardData = () => {
     isAuthenticated,
   ]);
 
-  // Combined error state
   const error = useMemo(() => {
     const baseError = priorityTokenError;
 
@@ -157,7 +120,6 @@ const useLoadCardData = () => {
         cardDetailsError
       );
     }
-    // In unauthenticated mode, still check for delegation settings and card details errors
     return baseError || delegationSettingsError || cardDetailsError;
   }, [
     priorityTokenError,
@@ -168,8 +130,6 @@ const useLoadCardData = () => {
     cardDetailsError,
   ]);
 
-  // Combined warning (only from priority token and card details)
-  // Priority: NoCard warning always takes precedence because the user must provision a card before delegating
   const warning = useMemo(() => {
     if (cardDetailsWarning === CardStateWarning.NoCard) {
       return cardDetailsWarning;
@@ -177,55 +137,59 @@ const useLoadCardData = () => {
     return priorityTokenWarning || cardDetailsWarning;
   }, [priorityTokenWarning, cardDetailsWarning]);
 
-  // Manual fetch function to refresh all data
-  // Note: fetchExternalWalletDetails depends on delegationSettings, so we must
-  // ensure delegation settings is available first before fetching wallet details
-  const fetchAllData = useMemo(
-    () => async () => {
-      if (isAuthenticated) {
-        // First, fetch delegation settings (required for external wallet details)
-        await fetchDelegationSettings();
-        // Then fetch all other data in parallel
-        await Promise.all([
-          fetchPriorityToken(),
-          fetchCardDetails(),
-          fetchExternalWalletDetails(),
-          fetchKYCStatus(),
-        ]);
-      } else {
-        await fetchPriorityToken();
+  const fetchRef = useRef({
+    fetchDelegationSettings,
+    fetchExternalWalletDetails,
+    fetchCardDetails: fetchCardDetailsQuery,
+    fetchKYCStatus,
+  });
+  fetchRef.current = {
+    fetchDelegationSettings,
+    fetchExternalWalletDetails,
+    fetchCardDetails: fetchCardDetailsQuery,
+    fetchKYCStatus,
+  };
+
+  const fetchAllData = useCallback(async () => {
+    if (isAuthenticated) {
+      const fns = fetchRef.current;
+      try {
+        await fns.fetchDelegationSettings();
+      } catch {
+        // Delegation settings uses queryClient.fetchQuery which throws on
+        // error. Catch here so independent sibling fetches still run.
       }
-    },
-    [
-      fetchPriorityToken,
-      fetchCardDetails,
-      isAuthenticated,
-      fetchExternalWalletDetails,
-      fetchKYCStatus,
-      fetchDelegationSettings,
-    ],
-  );
+      await Promise.all([
+        fns.fetchExternalWalletDetails(),
+        fns.fetchCardDetails(),
+        fns.fetchKYCStatus(),
+      ]);
+    } else if (selectedAddress) {
+      await queryClient.refetchQueries({
+        queryKey:
+          cardQueries.dashboard.keys.priorityTokenOnChain(selectedAddress),
+      });
+    }
+  }, [queryClient, isAuthenticated, selectedAddress]);
+
+  const fetchCardDetails = useCallback(async () => {
+    await fetchRef.current.fetchCardDetails();
+  }, []);
 
   return {
-    // Token data
     priorityToken: priorityTokenWithLatestAllowance,
     allTokens,
-    // Card details
     cardDetails,
-    // Delegation settings and external wallet details (authenticated mode only)
     delegationSettings: isAuthenticated ? delegationSettings : null,
     externalWalletDetailsData: isAuthenticated
       ? externalWalletDetailsData
       : null,
-    // KYC status (authenticated mode only)
     kycStatus: isAuthenticated ? kycStatus : null,
-    // State flags
     isLoading,
     error,
     warning,
     isAuthenticated,
     isBaanxLoginEnabled,
-    // Fetch functions
     fetchAllData,
     fetchCardDetails,
   };
diff --git a/app/components/UI/Card/hooks/useRegisterUserConsent.test.ts b/app/components/UI/Card/hooks/useRegisterUserConsent.test.ts
index ae2f2e85f177..a5618cdd8aa4 100644
--- a/app/components/UI/Card/hooks/useRegisterUserConsent.test.ts
+++ b/app/components/UI/Card/hooks/useRegisterUserConsent.test.ts
@@ -8,7 +8,16 @@ import AppConstants from '../../../../core/AppConstants';
 import { CardSDK } from '../sdk/CardSDK';
 import { Region } from '../components/Onboarding/RegionSelectorModal';
 
-// Mock dependencies
+const mockFetchQuery = jest.fn();
+
+const mockQueryClient = {
+  fetchQuery: (...args: unknown[]) => mockFetchQuery(...args),
+};
+
+jest.mock('@tanstack/react-query', () => ({
+  useQueryClient: jest.fn(() => mockQueryClient),
+}));
+
 jest.mock('react-redux', () => ({
   useSelector: jest.fn(),
 }));
@@ -53,12 +62,11 @@ const MOCK_REGION_DE: Region = { key: 'DE', name: 'Germany', emoji: '🇩🇪' }
 describe('useRegisterUserConsent', () => {
   const mockCreateOnboardingConsent = jest.fn();
   const mockLinkUserToConsent = jest.fn();
-  const mockGetConsentSetByOnboardingId = jest.fn();
 
   const mockSDK = {
     createOnboardingConsent: mockCreateOnboardingConsent,
     linkUserToConsent: mockLinkUserToConsent,
-    getConsentSetByOnboardingId: mockGetConsentSetByOnboardingId,
+    getConsentSetByOnboardingId: jest.fn(),
   } as unknown as CardSDK;
 
   const mockConsentResponse = {
@@ -71,17 +79,17 @@ describe('useRegisterUserConsent', () => {
   beforeEach(() => {
     jest.clearAllMocks();
 
-    // Default mocks
     mockUseCardSDK.mockReturnValue({
       ...jest.requireMock('../sdk'),
       sdk: mockSDK,
     });
 
-    mockUseSelector.mockReturnValue(MOCK_REGION_US); // selectedCountry
+    mockUseSelector.mockReturnValue(MOCK_REGION_US);
 
     mockGetErrorMessage.mockReturnValue('Mocked error message');
     mockCreateOnboardingConsent.mockResolvedValue(mockConsentResponse);
     mockLinkUserToConsent.mockResolvedValue(undefined);
+    mockFetchQuery.mockResolvedValue(null);
   });
 
   describe('hook initialization', () => {
@@ -111,9 +119,7 @@ describe('useRegisterUserConsent', () => {
         completedAt: '2024-01-01T00:00:00.000Z',
       };
 
-      mockGetConsentSetByOnboardingId.mockResolvedValue({
-        consentSets: [mockConsentSet],
-      });
+      mockFetchQuery.mockResolvedValue(mockConsentSet);
 
       const { result } = renderHook(() => useRegisterUserConsent());
 
@@ -125,14 +131,17 @@ describe('useRegisterUserConsent', () => {
           );
       });
 
-      expect(mockGetConsentSetByOnboardingId).toHaveBeenCalledWith(
-        testOnboardingId,
+      expect(mockFetchQuery).toHaveBeenCalledWith(
+        expect.objectContaining({
+          queryKey: ['card', 'dashboard', 'consentSet', testOnboardingId],
+          staleTime: 30_000,
+        }),
       );
       expect(retrievedConsentSet).toEqual(mockConsentSet);
     });
 
     it('returns null when no consent exists', async () => {
-      mockGetConsentSetByOnboardingId.mockResolvedValue(null);
+      mockFetchQuery.mockResolvedValue(null);
 
       const { result } = renderHook(() => useRegisterUserConsent());
 
@@ -164,12 +173,12 @@ describe('useRegisterUserConsent', () => {
       ).rejects.toThrow('Card SDK not initialized');
     });
 
-    it('throws error when SDK call fails', async () => {
+    it('throws error when fetchQuery fails', async () => {
       const testError = new CardError(
         CardErrorType.NETWORK_ERROR,
         'Network failed',
       );
-      mockGetConsentSetByOnboardingId.mockRejectedValue(testError);
+      mockFetchQuery.mockRejectedValue(testError);
 
       const { result } = renderHook(() => useRegisterUserConsent());
 
@@ -818,26 +827,13 @@ describe('useRegisterUserConsent', () => {
       expect(customSDK.linkUserToConsent).toHaveBeenCalled();
     });
 
-    it('uses SDK from useCardSDK hook for getting consent set', async () => {
+    it('uses queryClient.fetchQuery for getting consent set', async () => {
       const mockConsentSet = {
         consentSetId: 'test-consent',
         userId: 'test-user',
         completedAt: '2024-01-01T00:00:00.000Z',
       };
-      const customSDK = {
-        createOnboardingConsent: jest
-          .fn()
-          .mockResolvedValue(mockConsentResponse),
-        linkUserToConsent: jest.fn().mockResolvedValue(undefined),
-        getConsentSetByOnboardingId: jest.fn().mockResolvedValue({
-          consentSets: [mockConsentSet],
-        }),
-      } as unknown as CardSDK;
-
-      mockUseCardSDK.mockReturnValue({
-        ...jest.requireMock('../sdk'),
-        sdk: customSDK,
-      });
+      mockFetchQuery.mockResolvedValue(mockConsentSet);
 
       const { result } = renderHook(() => useRegisterUserConsent());
 
@@ -847,7 +843,11 @@ describe('useRegisterUserConsent', () => {
         );
       });
 
-      expect(customSDK.getConsentSetByOnboardingId).toHaveBeenCalled();
+      expect(mockFetchQuery).toHaveBeenCalledWith(
+        expect.objectContaining({
+          queryKey: ['card', 'dashboard', 'consentSet', testOnboardingId],
+        }),
+      );
     });
 
     it('handles SDK loading state', () => {
@@ -1015,7 +1015,6 @@ describe('useRegisterUserConsent', () => {
       const initialGetFunction =
         result.current.getOnboardingConsentSetByOnboardingId;
 
-      // Change SDK dependency
       mockUseCardSDK.mockReturnValue({
         ...jest.requireMock('../sdk'),
         sdk: {
@@ -1027,7 +1026,6 @@ describe('useRegisterUserConsent', () => {
 
       rerender();
 
-      // Function is different due to SDK dependency change
       expect(result.current.getOnboardingConsentSetByOnboardingId).not.toBe(
         initialGetFunction,
       );
diff --git a/app/components/UI/Card/hooks/useRegisterUserConsent.ts b/app/components/UI/Card/hooks/useRegisterUserConsent.ts
index 46899ac79a74..1811097eaebd 100644
--- a/app/components/UI/Card/hooks/useRegisterUserConsent.ts
+++ b/app/components/UI/Card/hooks/useRegisterUserConsent.ts
@@ -1,10 +1,12 @@
 import { useCallback, useState } from 'react';
+import { useQueryClient } from '@tanstack/react-query';
 import { useCardSDK } from '../sdk';
 import { selectSelectedCountry } from '../../../../core/redux/slices/card';
 import { useSelector } from 'react-redux';
 import AppConstants from '../../../../core/AppConstants';
 import { getErrorMessage } from '../util/getErrorMessage';
 import { Consent, ConsentSet } from '../types';
+import { cardQueries } from '../queries';
 
 interface UseRegisterUserConsentState {
   isLoading: boolean;
@@ -40,6 +42,7 @@ interface UseRegisterUserConsentReturn extends UseRegisterUserConsentState {
  */
 export const useRegisterUserConsent = (): UseRegisterUserConsentReturn => {
   const { sdk } = useCardSDK();
+  const queryClient = useQueryClient();
   const selectedCountry = useSelector(selectSelectedCountry);
   const [state, setState] = useState<UseRegisterUserConsentState>({
     isLoading: false,
@@ -73,15 +76,20 @@ export const useRegisterUserConsent = (): UseRegisterUserConsentReturn => {
         throw new Error('Card SDK not initialized');
       }
 
-      const consentSetResponse =
-        await sdk.getConsentSetByOnboardingId(onboardingId);
-      if (!consentSetResponse) {
-        return null;
-      }
-
-      return consentSetResponse.consentSets[0];
+      return queryClient.fetchQuery({
+        queryKey: cardQueries.dashboard.keys.consentSet(onboardingId),
+        queryFn: async () => {
+          const consentSetResponse =
+            await sdk.getConsentSetByOnboardingId(onboardingId);
+          if (!consentSetResponse) {
+            return null;
+          }
+          return consentSetResponse.consentSets[0];
+        },
+        staleTime: 30_000,
+      });
     },
-    [sdk],
+    [sdk, queryClient],
   );
 
   /**
diff --git a/app/components/UI/Card/hooks/useRegistrationSettings.test.ts b/app/components/UI/Card/hooks/useRegistrationSettings.test.ts
index 03457c80286b..4edb42eb206b 100644
--- a/app/components/UI/Card/hooks/useRegistrationSettings.test.ts
+++ b/app/components/UI/Card/hooks/useRegistrationSettings.test.ts
@@ -1,22 +1,34 @@
-import { renderHook } from '@testing-library/react-hooks';
+import { renderHook, act } from '@testing-library/react-hooks';
 import { useCardSDK } from '../sdk';
 import useRegistrationSettings from './useRegistrationSettings';
-import { useWrapWithCache } from './useWrapWithCache';
 import { CardSDK } from '../sdk/CardSDK';
 
-// Mock dependencies
 jest.mock('../sdk', () => ({
   useCardSDK: jest.fn(),
 }));
 
-jest.mock('./useWrapWithCache', () => ({
-  useWrapWithCache: jest.fn(),
+const mockRefetch = jest.fn();
+let mockQueryFn: (() => Promise<unknown>) | undefined;
+let mockQueryReturn: {
+  data: unknown;
+  isLoading: boolean;
+  error: Error | null;
+  refetch: jest.Mock;
+} = {
+  data: undefined,
+  isLoading: false,
+  error: null,
+  refetch: mockRefetch,
+};
+
+jest.mock('@tanstack/react-query', () => ({
+  useQuery: jest.fn().mockImplementation(({ queryFn }) => {
+    mockQueryFn = queryFn;
+    return mockQueryReturn;
+  }),
 }));
 
 const mockUseCardSDK = useCardSDK as jest.MockedFunction<typeof useCardSDK>;
-const mockUseWrapWithCache = useWrapWithCache as jest.MockedFunction<
-  typeof useWrapWithCache
->;
 
 describe('useRegistrationSettings', () => {
   const mockGetRegistrationSettings = jest.fn();
@@ -32,63 +44,90 @@ describe('useRegistrationSettings', () => {
     privacyPolicyUrl: 'https://example.com/privacy',
   };
 
-  const mockCacheReturn = {
-    data: null,
-    isLoading: false,
-    error: null,
-    fetchData: jest.fn(),
-  };
-
   beforeEach(() => {
     jest.clearAllMocks();
 
-    // Default mocks
+    mockQueryReturn = {
+      data: undefined,
+      isLoading: false,
+      error: null,
+      refetch: mockRefetch,
+    };
+
     mockUseCardSDK.mockReturnValue({
       ...jest.requireMock('../sdk'),
       sdk: mockSDK,
     });
 
-    mockUseWrapWithCache.mockReturnValue(mockCacheReturn);
     mockGetRegistrationSettings.mockResolvedValue(
       mockRegistrationSettingsResponse,
     );
+
+    mockRefetch.mockResolvedValue({ data: null });
   });
 
   describe('hook initialization', () => {
-    it('should initialize with default location when no location provided', () => {
+    it('initializes with useQuery using correct query key', () => {
+      const { useQuery: mockUseQuery } = jest.requireMock(
+        '@tanstack/react-query',
+      );
+
+      renderHook(() => useRegistrationSettings());
+
+      expect(mockUseQuery).toHaveBeenCalledWith(
+        expect.objectContaining({
+          queryKey: ['card', 'dashboard', 'registrationSettings'],
+          staleTime: 5 * 60 * 1000,
+        }),
+      );
+    });
+
+    it('disables query when SDK is not available', () => {
+      const { useQuery: mockUseQuery } = jest.requireMock(
+        '@tanstack/react-query',
+      );
+
+      mockUseCardSDK.mockReturnValue({
+        ...jest.requireMock('../sdk'),
+        sdk: null,
+      });
+
       renderHook(() => useRegistrationSettings());
 
-      expect(mockUseWrapWithCache).toHaveBeenCalledWith(
-        'registration-settings',
-        expect.any(Function),
-        { cacheDuration: 5 * 60 * 1000 },
+      expect(mockUseQuery).toHaveBeenCalledWith(
+        expect.objectContaining({
+          enabled: false,
+        }),
       );
     });
 
-    it('should set cache duration to 5 minutes', () => {
+    it('enables query when SDK is available', () => {
+      const { useQuery: mockUseQuery } = jest.requireMock(
+        '@tanstack/react-query',
+      );
+
       renderHook(() => useRegistrationSettings());
 
-      expect(mockUseWrapWithCache).toHaveBeenCalledWith(
-        expect.any(String),
-        expect.any(Function),
-        { cacheDuration: 5 * 60 * 1000 },
+      expect(mockUseQuery).toHaveBeenCalledWith(
+        expect.objectContaining({
+          enabled: true,
+        }),
       );
     });
   });
 
-  describe('fetchRegistrationSettings function', () => {
-    it('should return registration settings data when SDK call succeeds', async () => {
+  describe('queryFn behavior', () => {
+    it('returns registration settings data when SDK call succeeds', async () => {
       renderHook(() => useRegistrationSettings());
 
-      // Get the fetch function from the mock call
-      const fetchFunction = mockUseWrapWithCache.mock.calls[0][1];
-      const fetchResult = await fetchFunction();
+      expect(mockQueryFn).toBeDefined();
+      const fetchResult = await mockQueryFn?.();
 
       expect(fetchResult).toEqual(mockRegistrationSettingsResponse);
       expect(mockGetRegistrationSettings).toHaveBeenCalled();
     });
 
-    it('should throw error when SDK is not available', async () => {
+    it('throws error when SDK is not available', () => {
       mockUseCardSDK.mockReturnValue({
         ...jest.requireMock('../sdk'),
         sdk: null,
@@ -96,48 +135,45 @@ describe('useRegistrationSettings', () => {
 
       renderHook(() => useRegistrationSettings());
 
-      // Get the fetch function from the mock call
-      const fetchFunction = mockUseWrapWithCache.mock.calls[0][1];
-
-      await expect(fetchFunction()).rejects.toThrow('Card SDK not available');
+      expect(mockQueryFn).toBeDefined();
+      expect(() => mockQueryFn?.()).toThrow('SDK not initialized');
     });
 
-    it('should propagate SDK errors', async () => {
+    it('propagates SDK errors', async () => {
       const sdkError = new Error('SDK error');
       mockGetRegistrationSettings.mockRejectedValue(sdkError);
 
       renderHook(() => useRegistrationSettings());
 
-      // Get the fetch function from the mock call
-      const fetchFunction = mockUseWrapWithCache.mock.calls[0][1];
-
-      await expect(fetchFunction()).rejects.toThrow('SDK error');
+      expect(mockQueryFn).toBeDefined();
+      await expect(mockQueryFn?.()).rejects.toThrow('SDK error');
     });
   });
 
   describe('return value', () => {
-    it('should return the result from useWrapWithCache', () => {
-      const mockReturn = {
+    it('returns data from useQuery', () => {
+      mockQueryReturn = {
         data: mockRegistrationSettingsResponse,
         isLoading: false,
         error: null,
-        fetchData: jest.fn(),
+        refetch: mockRefetch,
       };
-      mockUseWrapWithCache.mockReturnValue(mockReturn);
 
       const { result } = renderHook(() => useRegistrationSettings());
 
-      expect(result.current).toEqual(mockReturn);
+      expect(result.current.data).toEqual(mockRegistrationSettingsResponse);
+      expect(result.current.isLoading).toBe(false);
+      expect(result.current.error).toBeNull();
+      expect(typeof result.current.fetchData).toBe('function');
     });
 
-    it('should return loading state from useWrapWithCache', () => {
-      const mockReturn = {
-        data: null,
+    it('returns loading state from useQuery', () => {
+      mockQueryReturn = {
+        data: undefined,
         isLoading: true,
         error: null,
-        fetchData: jest.fn(),
+        refetch: mockRefetch,
       };
-      mockUseWrapWithCache.mockReturnValue(mockReturn);
 
       const { result } = renderHook(() => useRegistrationSettings());
 
@@ -145,14 +181,13 @@ describe('useRegistrationSettings', () => {
       expect(result.current.data).toBeNull();
     });
 
-    it('should return error state from useWrapWithCache', () => {
-      const mockReturn = {
-        data: null,
+    it('returns error state from useQuery', () => {
+      mockQueryReturn = {
+        data: undefined,
         isLoading: false,
         error: new Error('Registration settings error'),
-        fetchData: jest.fn(),
+        refetch: mockRefetch,
       };
-      mockUseWrapWithCache.mockReturnValue(mockReturn);
 
       const { result } = renderHook(() => useRegistrationSettings());
 
@@ -162,25 +197,38 @@ describe('useRegistrationSettings', () => {
       expect(result.current.data).toBeNull();
     });
 
-    it('should provide fetchData function from useWrapWithCache', () => {
-      const mockFetchData = jest.fn();
-      const mockReturn = {
-        data: null,
-        isLoading: false,
-        error: null,
-        fetchData: mockFetchData,
-      };
-      mockUseWrapWithCache.mockReturnValue(mockReturn);
+    it('provides fetchData function that calls refetch', async () => {
+      mockRefetch.mockResolvedValue({
+        data: mockRegistrationSettingsResponse,
+      });
 
       const { result } = renderHook(() => useRegistrationSettings());
 
-      expect(result.current.fetchData).toBe(mockFetchData);
-      expect(typeof result.current.fetchData).toBe('function');
+      let fetchResult: unknown;
+      await act(async () => {
+        fetchResult = await result.current.fetchData();
+      });
+
+      expect(mockRefetch).toHaveBeenCalled();
+      expect(fetchResult).toEqual(mockRegistrationSettingsResponse);
+    });
+
+    it('returns null from fetchData when refetch returns no data', async () => {
+      mockRefetch.mockResolvedValue({ data: undefined });
+
+      const { result } = renderHook(() => useRegistrationSettings());
+
+      let fetchResult: unknown;
+      await act(async () => {
+        fetchResult = await result.current.fetchData();
+      });
+
+      expect(fetchResult).toBeNull();
     });
   });
 
   describe('edge cases', () => {
-    it('should handle undefined SDK gracefully', async () => {
+    it('handles undefined SDK gracefully', () => {
       mockUseCardSDK.mockReturnValue({
         ...jest.requireMock('../sdk'),
         sdk: null,
@@ -188,48 +236,46 @@ describe('useRegistrationSettings', () => {
 
       renderHook(() => useRegistrationSettings());
 
-      // Get the fetch function from the mock call
-      const fetchFunction = mockUseWrapWithCache.mock.calls[0][1];
-
-      await expect(fetchFunction()).rejects.toThrow('Card SDK not available');
+      expect(mockQueryFn).toBeDefined();
+      expect(() => mockQueryFn?.()).toThrow('SDK not initialized');
     });
 
-    it('should handle null registration settings response', async () => {
+    it('handles null registration settings response', async () => {
       mockGetRegistrationSettings.mockResolvedValue(null);
 
       renderHook(() => useRegistrationSettings());
 
-      // Get the fetch function from the mock call
-      const fetchFunction = mockUseWrapWithCache.mock.calls[0][1];
-
-      const result = await fetchFunction();
+      expect(mockQueryFn).toBeDefined();
+      const result = await mockQueryFn?.();
 
       expect(result).toBeNull();
     });
 
-    it('should handle empty registration settings response', async () => {
+    it('handles empty registration settings response', async () => {
       const emptyResponse = {};
       mockGetRegistrationSettings.mockResolvedValue(emptyResponse);
 
       renderHook(() => useRegistrationSettings());
 
-      // Get the fetch function from the mock call
-      const fetchFunction = mockUseWrapWithCache.mock.calls[0][1];
-
-      const result = await fetchFunction();
+      expect(mockQueryFn).toBeDefined();
+      const result = await mockQueryFn?.();
 
       expect(result).toEqual(emptyResponse);
     });
   });
 
   describe('caching behavior', () => {
-    it('should use correct cache configuration', () => {
+    it('uses correct staleTime configuration', () => {
+      const { useQuery: mockUseQuery } = jest.requireMock(
+        '@tanstack/react-query',
+      );
+
       renderHook(() => useRegistrationSettings());
 
-      expect(mockUseWrapWithCache).toHaveBeenCalledWith(
-        expect.any(String),
-        expect.any(Function),
-        { cacheDuration: 5 * 60 * 1000 },
+      expect(mockUseQuery).toHaveBeenCalledWith(
+        expect.objectContaining({
+          staleTime: 5 * 60 * 1000,
+        }),
       );
     });
   });
diff --git a/app/components/UI/Card/hooks/useRegistrationSettings.ts b/app/components/UI/Card/hooks/useRegistrationSettings.ts
index 74cff512f851..a4290b5af21a 100644
--- a/app/components/UI/Card/hooks/useRegistrationSettings.ts
+++ b/app/components/UI/Card/hooks/useRegistrationSettings.ts
@@ -1,27 +1,37 @@
 import { useCallback } from 'react';
+import { useQuery } from '@tanstack/react-query';
 import { useCardSDK } from '../sdk';
-import { useWrapWithCache } from './useWrapWithCache';
+import { cardQueries } from '../queries';
 
 /**
- * Hook to fetch and cache registration settings from the Card SDK
+ * Hook to fetch and cache registration settings from the Card SDK.
  *
  * @returns Object containing registration settings data, loading state, error, and fetch function
  */
 const useRegistrationSettings = () => {
   const { sdk } = useCardSDK();
 
-  const fetchRegistrationSettings = useCallback(async () => {
-    if (!sdk) {
-      throw new Error('Card SDK not available');
-    }
-    return sdk.getRegistrationSettings();
-  }, [sdk]);
+  const { data, isLoading, error, refetch } = useQuery({
+    queryKey: cardQueries.dashboard.keys.registrationSettings(),
+    queryFn: () => {
+      if (!sdk) throw new Error('SDK not initialized');
+      return sdk.getRegistrationSettings();
+    },
+    enabled: !!sdk,
+    staleTime: 5 * 60 * 1000,
+  });
 
-  return useWrapWithCache(
-    'registration-settings',
-    fetchRegistrationSettings,
-    { cacheDuration: 5 * 60 * 1000 }, // 5 minutes cache
-  );
+  const fetchData = useCallback(async () => {
+    const result = await refetch();
+    return result.data ?? null;
+  }, [refetch]);
+
+  return {
+    data: data ?? null,
+    isLoading,
+    error: error as Error | null,
+    fetchData,
+  };
 };
 
 export default useRegistrationSettings;
diff --git a/app/components/UI/Card/hooks/useSpendingLimit.test.ts b/app/components/UI/Card/hooks/useSpendingLimit.test.ts
index f2fa840f5b91..2362383a56d9 100644
--- a/app/components/UI/Card/hooks/useSpendingLimit.test.ts
+++ b/app/components/UI/Card/hooks/useSpendingLimit.test.ts
@@ -5,7 +5,6 @@ import {
   useFocusEffect,
   StackActions,
 } from '@react-navigation/native';
-import { useDispatch } from 'react-redux';
 import { SolScope } from '@metamask/keyring-api';
 import useSpendingLimit, { UseSpendingLimitParams } from './useSpendingLimit';
 import { useCardDelegation } from './useCardDelegation';
@@ -16,7 +15,7 @@ import { LINEA_CAIP_CHAIN_ID } from '../util/buildTokenList';
 import { useAnalytics } from '../../../hooks/useAnalytics/useAnalytics';
 import { ToastContext } from '../../../../component-library/components/Toast';
 import Logger from '../../../../util/Logger';
-import { clearCacheData } from '../../../../core/redux/slices/card';
+import { cardQueries } from '../queries';
 import { createAssetSelectionModalNavigationDetails } from '../components/AssetSelectionBottomSheet';
 import Routes from '../../../../constants/navigation/Routes';
 
@@ -29,8 +28,9 @@ jest.mock('@react-navigation/native', () => ({
   },
 }));
 
-jest.mock('react-redux', () => ({
-  useDispatch: jest.fn(),
+const mockInvalidateQueries = jest.fn();
+jest.mock('@tanstack/react-query', () => ({
+  useQueryClient: jest.fn(),
 }));
 
 // Create the mock class inside the factory to avoid hoisting issues
@@ -51,16 +51,13 @@ jest.mock('../sdk', () => ({
   useCardSDK: jest.fn(),
 }));
 
-const mockTheme = {
-  colors: {
-    success: { default: '#00ff00', muted: '#00ff0033' },
-    error: { default: '#ff0000', muted: '#ff000033' },
-  },
-};
-
-jest.mock('../../../../util/theme', () => ({
-  useTheme: jest.fn(() => mockTheme),
-}));
+jest.mock('../../../../util/theme', () => {
+  const actual = jest.requireActual('../../../../util/theme');
+  return {
+    ...actual,
+    useTheme: jest.fn(() => actual.mockTheme),
+  };
+});
 
 jest.mock('../../../hooks/useAnalytics/useAnalytics', () => ({
   useAnalytics: jest.fn(),
@@ -71,10 +68,6 @@ jest.mock('../../../../util/Logger', () => ({
   error: jest.fn(),
 }));
 
-jest.mock('../../../../core/redux/slices/card', () => ({
-  clearCacheData: jest.fn(),
-}));
-
 jest.mock('../components/AssetSelectionBottomSheet', () => ({
   createAssetSelectionModalNavigationDetails: jest.fn(),
 }));
@@ -85,7 +78,6 @@ const mockUseNavigation = useNavigation as jest.MockedFunction<
 const mockUseFocusEffect = useFocusEffect as jest.MockedFunction<
   typeof useFocusEffect
 >;
-const mockUseDispatch = useDispatch as jest.MockedFunction<typeof useDispatch>;
 const mockUseCardDelegation = useCardDelegation as jest.MockedFunction<
   typeof useCardDelegation
 >;
@@ -147,7 +139,6 @@ describe('useSpendingLimit', () => {
     dispatch: jest.Mock;
     setParams: jest.Mock;
   };
-  let mockDispatch: jest.Mock;
   let mockSubmitDelegation: jest.Mock;
   let mockTrackEvent: jest.Mock;
   let mockCreateEventBuilder: jest.Mock;
@@ -160,6 +151,15 @@ describe('useSpendingLimit', () => {
     jest.clearAllMocks();
     jest.useFakeTimers();
 
+    mockInvalidateQueries.mockResolvedValue(undefined);
+    (
+      jest.requireMock('@tanstack/react-query') as {
+        useQueryClient: jest.Mock;
+      }
+    ).useQueryClient.mockReturnValue({
+      invalidateQueries: mockInvalidateQueries,
+    });
+
     // Setup navigation mock
     mockNavigation = {
       navigate: jest.fn(),
@@ -174,10 +174,6 @@ describe('useSpendingLimit', () => {
       callback();
     });
 
-    // Setup dispatch mock
-    mockDispatch = jest.fn();
-    mockUseDispatch.mockReturnValue(mockDispatch);
-
     // Setup delegation mock
     mockSubmitDelegation = jest.fn().mockResolvedValue(undefined);
     mockUseCardDelegation.mockReturnValue({
@@ -647,9 +643,9 @@ describe('useSpendingLimit', () => {
         await submitPromise;
       });
 
-      expect(mockDispatch).toHaveBeenCalledWith(
-        clearCacheData('card-external-wallet-details'),
-      );
+      expect(mockInvalidateQueries).toHaveBeenCalledWith({
+        queryKey: cardQueries.dashboard.keys.externalWalletDetails(),
+      });
     });
 
     it('shows success toast for non-onboarding flow', async () => {
diff --git a/app/components/UI/Card/hooks/useSpendingLimit.ts b/app/components/UI/Card/hooks/useSpendingLimit.ts
index e4287037f10e..63a5ca8b2fe2 100644
--- a/app/components/UI/Card/hooks/useSpendingLimit.ts
+++ b/app/components/UI/Card/hooks/useSpendingLimit.ts
@@ -4,7 +4,7 @@ import {
   useNavigation,
   StackActions,
 } from '@react-navigation/native';
-import { useDispatch } from 'react-redux';
+import { useQueryClient } from '@tanstack/react-query';
 import { SolScope } from '@metamask/keyring-api';
 import { useTheme } from '../../../../util/theme';
 import { useCardDelegation, UserCancelledError } from './useCardDelegation';
@@ -20,7 +20,7 @@ import {
   LINEA_CAIP_CHAIN_ID,
   QUICK_SELECT_TOKENS,
 } from '../util/buildTokenList';
-import { clearCacheData } from '../../../../core/redux/slices/card';
+import { cardQueries } from '../queries';
 import { createAssetSelectionModalNavigationDetails } from '../components/AssetSelectionBottomSheet';
 import Routes from '../../../../constants/navigation/Routes';
 import Logger from '../../../../util/Logger';
@@ -111,7 +111,7 @@ const useSpendingLimit = ({
   routeParams,
 }: UseSpendingLimitParams): UseSpendingLimitReturn => {
   const navigation = useNavigation();
-  const dispatch = useDispatch();
+  const queryClient = useQueryClient();
   const theme = useTheme();
   const { toastRef } = useContext(ToastContext);
   const { trackEvent, createEventBuilder } = useAnalytics();
@@ -406,7 +406,9 @@ const useSpendingLimit = ({
 
       // Wait for backend to process
       await new Promise((resolve) => setTimeout(resolve, 3000));
-      dispatch(clearCacheData('card-external-wallet-details'));
+      await queryClient.invalidateQueries({
+        queryKey: cardQueries.dashboard.keys.externalWalletDetails(),
+      });
 
       if (!isOnboardingFlow) {
         showSuccessToast();
@@ -438,7 +440,7 @@ const useSpendingLimit = ({
     priorityToken,
     delegationAmount,
     submitDelegation,
-    dispatch,
+    queryClient,
     isOnboardingFlow,
     showSuccessToast,
     showErrorToast,
diff --git a/app/components/UI/Card/hooks/useUpdateTokenPriority.test.ts b/app/components/UI/Card/hooks/useUpdateTokenPriority.test.ts
index b60cf7daad6b..aebde584bd3f 100644
--- a/app/components/UI/Card/hooks/useUpdateTokenPriority.test.ts
+++ b/app/components/UI/Card/hooks/useUpdateTokenPriority.test.ts
@@ -8,26 +8,21 @@ import {
   CardExternalWalletDetailsResponse,
 } from '../types';
 import Logger from '../../../../util/Logger';
+import { cardQueries } from '../queries';
 
-// Mock dependencies
-jest.mock('../sdk', () => ({
-  useCardSDK: jest.fn(),
+const mockInvalidateQueries = jest.fn();
+jest.mock('@tanstack/react-query', () => ({
+  useQueryClient: jest.fn(),
 }));
 
-jest.mock('react-redux', () => ({
-  useDispatch: () => jest.fn(),
+jest.mock('../sdk', () => ({
+  useCardSDK: jest.fn(),
 }));
 
 jest.mock('../../../../util/Logger', () => ({
   error: jest.fn(),
 }));
 
-jest.mock('../../../../core/redux/slices/card', () => ({
-  setAuthenticatedPriorityToken: jest.fn(),
-  setAuthenticatedPriorityTokenLastFetched: jest.fn(),
-  clearCacheData: jest.fn(),
-}));
-
 const mockUseCardSDK = useCardSDK as jest.MockedFunction<typeof useCardSDK>;
 
 describe('useUpdateTokenPriority', () => {
@@ -92,6 +87,15 @@ describe('useUpdateTokenPriority', () => {
   beforeEach(() => {
     jest.clearAllMocks();
 
+    mockInvalidateQueries.mockResolvedValue(undefined);
+    (
+      jest.requireMock('@tanstack/react-query') as {
+        useQueryClient: jest.Mock;
+      }
+    ).useQueryClient.mockReturnValue({
+      invalidateQueries: mockInvalidateQueries,
+    });
+
     mockSDK = {
       updateWalletPriority: jest.fn().mockResolvedValue({}),
     };
@@ -133,6 +137,9 @@ describe('useUpdateTokenPriority', () => {
         { id: 2, priority: 2 },
         { id: 1, priority: 1 },
       ]);
+      expect(mockInvalidateQueries).toHaveBeenCalledWith({
+        queryKey: cardQueries.dashboard.keys.externalWalletDetails(),
+      });
       expect(mockOnSuccess).toHaveBeenCalled();
       expect(mockOnError).not.toHaveBeenCalled();
     });
diff --git a/app/components/UI/Card/hooks/useUpdateTokenPriority.ts b/app/components/UI/Card/hooks/useUpdateTokenPriority.ts
index 05aa4b904cce..29a94546802e 100644
--- a/app/components/UI/Card/hooks/useUpdateTokenPriority.ts
+++ b/app/components/UI/Card/hooks/useUpdateTokenPriority.ts
@@ -1,16 +1,12 @@
 import { useCallback } from 'react';
-import { useDispatch } from 'react-redux';
+import { useQueryClient } from '@tanstack/react-query';
 import { useCardSDK } from '../sdk';
-import {
-  setAuthenticatedPriorityToken,
-  setAuthenticatedPriorityTokenLastFetched,
-  clearCacheData,
-} from '../../../../core/redux/slices/card';
 import {
   CardTokenAllowance,
   CardExternalWalletDetailsResponse,
 } from '../types';
 import Logger from '../../../../util/Logger';
+import { cardQueries } from '../queries';
 
 interface UseUpdateTokenPriorityParams {
   onSuccess?: () => void;
@@ -25,7 +21,7 @@ export const useUpdateTokenPriority = (
   params?: UseUpdateTokenPriorityParams,
 ) => {
   const { sdk } = useCardSDK();
-  const dispatch = useDispatch();
+  const queryClient = useQueryClient();
   const { onSuccess, onError } = params || {};
 
   const updateTokenPriority = useCallback(
@@ -97,27 +93,11 @@ export const useUpdateTokenPriority = (
         // Update priority via SDK
         await sdk.updateWalletPriority(newPriorities);
 
-        // Invalidate external wallet details cache to force refetch with updated priorities
-        dispatch(clearCacheData('card-external-wallet-details'));
-
-        // Update priority token in Redux with new priority value
-        const priorityTokenData: CardTokenAllowance = {
-          address: token.address,
-          decimals: token.decimals,
-          symbol: token.symbol,
-          name: token.name,
-          allowanceState: token.allowanceState,
-          allowance: token.allowance || '0',
-          availableBalance: token.availableBalance || '0',
-          walletAddress: selectedWallet.walletAddress,
-          caipChainId: token.caipChainId,
-          delegationContract: token.delegationContract,
-          priority: 1, // New priority is always 1 (highest)
-          stagingTokenAddress: token.stagingTokenAddress,
-        };
-
-        dispatch(setAuthenticatedPriorityToken(priorityTokenData));
-        dispatch(setAuthenticatedPriorityTokenLastFetched(new Date()));
+        // Invalidate external wallet details cache to force refetch with updated priorities.
+        // The priority token is derived from this data via React Query.
+        await queryClient.invalidateQueries({
+          queryKey: cardQueries.dashboard.keys.externalWalletDetails(),
+        });
 
         onSuccess?.();
         return true;
@@ -130,7 +110,7 @@ export const useUpdateTokenPriority = (
         return false;
       }
     },
-    [sdk, dispatch, onSuccess, onError],
+    [sdk, queryClient, onSuccess, onError],
   );
 
   return {
diff --git a/app/components/UI/Card/hooks/useUserRegistrationStatus.test.ts b/app/components/UI/Card/hooks/useUserRegistrationStatus.test.ts
index 0b90334a7cf1..ab51f7387328 100644
--- a/app/components/UI/Card/hooks/useUserRegistrationStatus.test.ts
+++ b/app/components/UI/Card/hooks/useUserRegistrationStatus.test.ts
@@ -1,19 +1,13 @@
 import { renderHook, act } from '@testing-library/react-hooks';
-import { useSelector, useDispatch } from 'react-redux';
+import { useSelector } from 'react-redux';
 import { useCardSDK } from '../sdk';
 import { useUserRegistrationStatus } from './useUserRegistrationStatus';
 import { CardSDK } from '../sdk/CardSDK';
-import {
-  UserResponse,
-  CardVerificationState,
-  CardError,
-  CardErrorType,
-} from '../types';
+import { UserResponse, CardVerificationState } from '../types';
 import { getErrorMessage } from '../util/getErrorMessage';
 
 jest.mock('react-redux', () => ({
   useSelector: jest.fn(),
-  useDispatch: jest.fn(),
 }));
 
 jest.mock('../sdk', () => ({
@@ -24,8 +18,29 @@ jest.mock('../util/getErrorMessage', () => ({
   getErrorMessage: jest.fn(),
 }));
 
+let mockQueryConfig: {
+  enabled?: boolean;
+  refetchInterval?: unknown;
+} = {};
+
+const mockUseQueryReturn: {
+  data: UserResponse | undefined;
+  isLoading: boolean;
+  error: Error | null;
+} = {
+  data: undefined,
+  isLoading: false,
+  error: null,
+};
+
+jest.mock('@tanstack/react-query', () => ({
+  useQuery: jest.fn().mockImplementation((config) => {
+    mockQueryConfig = config;
+    return mockUseQueryReturn;
+  }),
+}));
+
 const mockUseSelector = useSelector as jest.MockedFunction<typeof useSelector>;
-const mockUseDispatch = useDispatch as jest.MockedFunction<typeof useDispatch>;
 const mockUseCardSDK = useCardSDK as jest.MockedFunction<typeof useCardSDK>;
 const mockGetErrorMessage = getErrorMessage as jest.MockedFunction<
   typeof getErrorMessage
@@ -33,6 +48,7 @@ const mockGetErrorMessage = getErrorMessage as jest.MockedFunction<
 
 describe('useUserRegistrationStatus', () => {
   const mockGetRegistrationStatus = jest.fn();
+  const mockSetUser = jest.fn();
 
   const mockSDK = {
     getRegistrationStatus: mockGetRegistrationStatus,
@@ -50,16 +66,9 @@ describe('useUserRegistrationStatus', () => {
 
   beforeEach(() => {
     jest.clearAllMocks();
-    jest.useFakeTimers();
 
-    // Default mocks - always return onboarding-123 for selectOnboardingId
     mockUseSelector.mockReturnValue('onboarding-123');
 
-    // Mock useDispatch
-    const mockDispatch = jest.fn();
-    mockUseDispatch.mockReturnValue(mockDispatch);
-
-    // Default mock for getRegistrationStatus
     mockGetRegistrationStatus.mockResolvedValue({
       ...mockUserResponse,
       verificationState: 'PENDING',
@@ -68,525 +77,404 @@ describe('useUserRegistrationStatus', () => {
     mockUseCardSDK.mockReturnValue({
       sdk: mockSDK,
       user: null,
-      setUser: jest.fn(),
+      setUser: mockSetUser,
       isLoading: false,
       logoutFromProvider: jest.fn(),
       fetchUserData: jest.fn(),
       isReturningSession: false,
     });
     mockGetErrorMessage.mockReturnValue('Mocked error message');
-  });
 
-  afterEach(() => {
-    jest.useRealTimers();
+    mockUseQueryReturn.data = undefined;
+    mockUseQueryReturn.isLoading = false;
+    mockUseQueryReturn.error = null;
+    mockQueryConfig = {};
   });
 
   describe('Initial State', () => {
     it('initializes with correct default state', () => {
-      // When: Hook is rendered without user data
       const { result } = renderHook(() => useUserRegistrationStatus());
 
-      // Then: Initial state defaults to PENDING and polling is not started
       expect(result.current.verificationState).toBe('PENDING');
       expect(result.current.isLoading).toBe(false);
       expect(result.current.isError).toBe(false);
       expect(result.current.error).toBeNull();
-      expect(typeof result.current.clearError).toBe('function');
       expect(typeof result.current.startPolling).toBe('function');
       expect(typeof result.current.stopPolling).toBe('function');
     });
   });
 
-  describe('fetchRegistrationStatus', () => {
-    it('sets loading state during fetch', async () => {
-      // Given: Mock response
-      mockGetRegistrationStatus.mockResolvedValue(mockUserResponse);
-
-      const { result, waitForNextUpdate } = renderHook(() =>
-        useUserRegistrationStatus(),
+  describe('useQuery configuration', () => {
+    it('passes correct query key with onboardingId', () => {
+      const { useQuery: mockUseQuery } = jest.requireMock(
+        '@tanstack/react-query',
       );
 
-      // When: startPolling is called (which triggers fetchRegistrationStatus internally)
-      act(() => {
-        result.current.startPolling();
-      });
-
-      // Wait for the async operation to complete and state to update
-      await waitForNextUpdate();
-
-      // Then: Should have completed the fetch
-      expect(result.current.verificationState).toBe('VERIFIED');
-      expect(result.current.isLoading).toBe(false);
+      renderHook(() => useUserRegistrationStatus());
+
+      expect(mockUseQuery).toHaveBeenCalledWith(
+        expect.objectContaining({
+          queryKey: [
+            'card',
+            'dashboard',
+            'registrationStatus',
+            'onboarding-123',
+          ],
+        }),
+      );
     });
 
-    it('handles SDK not initialized error', async () => {
-      // Given: SDK is not available
-      mockUseCardSDK.mockReturnValue({
-        ...jest.requireMock('../sdk'),
-        sdk: null,
-      });
+    it('disables query initially (polling not started)', () => {
+      const { useQuery: mockUseQuery } = jest.requireMock(
+        '@tanstack/react-query',
+      );
 
-      // When: Hook attempts to fetch
-      const { result } = renderHook(() => useUserRegistrationStatus());
+      renderHook(() => useUserRegistrationStatus());
 
-      await act(async () => {
-        result.current.startPolling();
-      });
-
-      // Then: Should set error state
-      expect(result.current.isError).toBe(true);
-      expect(result.current.error).toBe('Card SDK not initialized');
-      expect(result.current.isLoading).toBe(false);
-      expect(mockGetRegistrationStatus).not.toHaveBeenCalled();
+      expect(mockUseQuery).toHaveBeenCalledWith(
+        expect.objectContaining({
+          enabled: false,
+        }),
+      );
     });
 
-    it('handles API errors', async () => {
-      // Given: API throws an error
-      const apiError = new CardError(
-        CardErrorType.SERVER_ERROR,
-        'Server error',
+    it('enables query when startPolling is called', () => {
+      const { useQuery: mockUseQuery } = jest.requireMock(
+        '@tanstack/react-query',
       );
-      mockGetRegistrationStatus.mockRejectedValue(apiError);
-      mockGetErrorMessage.mockReturnValue('Server error occurred');
 
-      // When: Hook attempts to fetch
       const { result } = renderHook(() => useUserRegistrationStatus());
 
-      await act(async () => {
+      act(() => {
         result.current.startPolling();
       });
 
-      // Then: Should handle error properly
-      expect(result.current.isError).toBe(true);
-      expect(result.current.error).toBe('Server error occurred');
-      expect(result.current.isLoading).toBe(false);
-      expect(mockGetErrorMessage).toHaveBeenCalledWith(apiError);
+      const lastCallConfig =
+        mockUseQuery.mock.calls[mockUseQuery.mock.calls.length - 1][0];
+      expect(lastCallConfig.enabled).toBe(true);
     });
-  });
 
-  describe('clearError', () => {
-    it('clears error state', async () => {
-      // Given: Hook is in error state
-      mockUseCardSDK.mockReturnValue({
-        ...jest.requireMock('../sdk'),
-        sdk: null,
-      });
+    it('disables query when stopPolling is called', () => {
+      const { useQuery: mockUseQuery } = jest.requireMock(
+        '@tanstack/react-query',
+      );
 
       const { result } = renderHook(() => useUserRegistrationStatus());
 
-      await act(async () => {
+      act(() => {
         result.current.startPolling();
       });
 
-      expect(result.current.isError).toBe(true);
-      expect(result.current.error).toBe('Card SDK not initialized');
-
-      // When: clearError is called
       act(() => {
-        result.current.clearError();
+        result.current.stopPolling();
       });
 
-      // Then: Error state should be cleared
-      expect(result.current.isError).toBe(false);
-      expect(result.current.error).toBeNull();
+      const lastCallConfig =
+        mockUseQuery.mock.calls[mockUseQuery.mock.calls.length - 1][0];
+      expect(lastCallConfig.enabled).toBe(false);
     });
-  });
 
-  describe('Polling Management', () => {
-    it('starts polling and fetches immediately', async () => {
-      // Given: Successful API response
-      mockGetRegistrationStatus.mockResolvedValue(mockUserResponse);
+    it('provides refetchInterval function', () => {
+      renderHook(() => useUserRegistrationStatus());
 
-      // When: startPolling is called
-      const { result, waitForNextUpdate } = renderHook(() =>
-        useUserRegistrationStatus(),
-      );
-
-      act(() => {
-        result.current.startPolling();
-      });
-
-      await waitForNextUpdate();
-
-      // Then: Fetches immediately
-      expect(mockGetRegistrationStatus).toHaveBeenCalledTimes(1);
-      expect(result.current.verificationState).toBe('VERIFIED');
+      expect(mockQueryConfig.refetchInterval).toBeDefined();
+      expect(typeof mockQueryConfig.refetchInterval).toBe('function');
     });
 
-    it('sets up polling interval after initial fetch', async () => {
-      // Given: Successful API response with PENDING state to keep polling active
-      const pendingResponse: UserResponse = {
-        ...mockUserResponse,
-        verificationState: 'PENDING',
-      };
-      mockGetRegistrationStatus.mockResolvedValue(pendingResponse);
-
-      // When: startPolling is called
-      const { result } = renderHook(() => useUserRegistrationStatus());
+    it('refetchInterval returns 5000 when state is PENDING', () => {
+      renderHook(() => useUserRegistrationStatus());
 
-      await act(async () => {
-        result.current.startPolling();
-      });
+      const refetchIntervalFn = mockQueryConfig.refetchInterval as (query: {
+        state: { data: { verificationState: string } | undefined };
+      }) => number | false;
 
-      // Clear the initial call
-      mockGetRegistrationStatus.mockClear();
-
-      // When: Time advances by polling interval
-      await act(async () => {
-        jest.advanceTimersByTime(5000);
+      const result = refetchIntervalFn({
+        state: { data: { verificationState: 'PENDING' } },
       });
 
-      // Then: Should fetch again
-      expect(mockGetRegistrationStatus).toHaveBeenCalledTimes(1);
+      expect(result).toBe(5000);
     });
 
-    it('clears existing interval when starting new polling', async () => {
-      // Given: Hook with active polling (PENDING state to keep polling active)
-      const pendingResponse: UserResponse = {
-        ...mockUserResponse,
-        verificationState: 'PENDING',
-      };
-      mockGetRegistrationStatus.mockResolvedValue(pendingResponse);
-      const { result } = renderHook(() => useUserRegistrationStatus());
+    it('refetchInterval returns false when state is VERIFIED', () => {
+      renderHook(() => useUserRegistrationStatus());
 
-      await act(async () => {
-        result.current.startPolling();
+      const refetchIntervalFn = mockQueryConfig.refetchInterval as (query: {
+        state: { data: { verificationState: string } | undefined };
+      }) => number | false;
+
+      const result = refetchIntervalFn({
+        state: { data: { verificationState: 'VERIFIED' } },
       });
 
-      // Clear the initial call
-      mockGetRegistrationStatus.mockClear();
+      expect(result).toBe(false);
+    });
 
-      // When: startPolling is called again
-      await act(async () => {
-        result.current.startPolling();
-      });
+    it('refetchInterval returns false when state is REJECTED', () => {
+      renderHook(() => useUserRegistrationStatus());
 
-      // Then: Should fetch immediately (new polling started)
-      expect(mockGetRegistrationStatus).toHaveBeenCalledTimes(1);
+      const refetchIntervalFn = mockQueryConfig.refetchInterval as (query: {
+        state: { data: { verificationState: string } | undefined };
+      }) => number | false;
 
-      // When: Time advances
-      await act(async () => {
-        jest.advanceTimersByTime(5000);
+      const result = refetchIntervalFn({
+        state: { data: { verificationState: 'REJECTED' } },
       });
 
-      // Then: Should only have one active interval
-      expect(mockGetRegistrationStatus).toHaveBeenCalledTimes(2);
+      expect(result).toBe(false);
     });
 
-    it('stops polling when stopPolling is called', async () => {
-      // Given: Hook with active polling (PENDING state to keep polling active)
-      const pendingResponse: UserResponse = {
-        ...mockUserResponse,
-        verificationState: 'PENDING',
-      };
-      mockGetRegistrationStatus.mockResolvedValue(pendingResponse);
-      const { result } = renderHook(() => useUserRegistrationStatus());
+    it('refetchInterval returns 5000 when data is undefined', () => {
+      renderHook(() => useUserRegistrationStatus());
 
-      await act(async () => {
-        result.current.startPolling();
-      });
-
-      // Clear the initial call
-      mockGetRegistrationStatus.mockClear();
+      const refetchIntervalFn = mockQueryConfig.refetchInterval as (query: {
+        state: { data: undefined };
+      }) => number | false;
 
-      // When: stopPolling is called
-      act(() => {
-        result.current.stopPolling();
-      });
-
-      // When: Time advances
-      await act(async () => {
-        jest.advanceTimersByTime(10000);
+      const result = refetchIntervalFn({
+        state: { data: undefined },
       });
 
-      // Then: Should not fetch again
-      expect(mockGetRegistrationStatus).not.toHaveBeenCalled();
+      expect(result).toBe(5000);
     });
   });
 
-  describe('Auto-stop polling based on verification state', () => {
-    it('continues polling when verification state is PENDING', async () => {
-      // Given: Response with PENDING verification state
-      const pendingResponse: UserResponse = {
+  describe('verification state resolution', () => {
+    it('returns data verificationState when available', () => {
+      mockUseQueryReturn.data = {
         ...mockUserResponse,
-        verificationState: 'PENDING',
+        verificationState: 'VERIFIED',
       };
-      mockGetRegistrationStatus.mockResolvedValue(pendingResponse);
 
-      // When: Polling is manually started
       const { result } = renderHook(() => useUserRegistrationStatus());
 
-      await act(async () => {
-        result.current.startPolling();
-      });
-
-      expect(result.current.verificationState).toBe('PENDING');
-
-      // Clear the initial call
-      mockGetRegistrationStatus.mockClear();
+      expect(result.current.verificationState).toBe('VERIFIED');
+    });
 
-      // When: Time advances
-      await act(async () => {
-        jest.advanceTimersByTime(5000);
+    it('falls back to user verificationState from SDK context', () => {
+      mockUseQueryReturn.data = undefined;
+      mockUseCardSDK.mockReturnValue({
+        sdk: mockSDK,
+        user: { ...mockUserResponse, verificationState: 'UNVERIFIED' },
+        setUser: mockSetUser,
+        isLoading: false,
+        logoutFromProvider: jest.fn(),
+        fetchUserData: jest.fn(),
+        isReturningSession: false,
       });
 
-      // Then: Should continue polling
-      expect(mockGetRegistrationStatus).toHaveBeenCalledTimes(1);
-    });
-
-    it('automatically stops polling when verification state is UNVERIFIED', async () => {
-      // Given: Initial PENDING response
-      const pendingResponse: UserResponse = {
-        ...mockUserResponse,
-        verificationState: 'PENDING',
-      };
-      mockGetRegistrationStatus.mockResolvedValueOnce(pendingResponse);
+      const { result } = renderHook(() => useUserRegistrationStatus());
 
-      const { result, waitForNextUpdate } = renderHook(() =>
-        useUserRegistrationStatus(),
-      );
+      expect(result.current.verificationState).toBe('UNVERIFIED');
+    });
 
-      act(() => {
-        result.current.startPolling();
+    it('defaults to PENDING when no data and no user', () => {
+      mockUseQueryReturn.data = undefined;
+      mockUseCardSDK.mockReturnValue({
+        sdk: mockSDK,
+        user: null,
+        setUser: mockSetUser,
+        isLoading: false,
+        logoutFromProvider: jest.fn(),
+        fetchUserData: jest.fn(),
+        isReturningSession: false,
       });
 
-      await waitForNextUpdate();
+      const { result } = renderHook(() => useUserRegistrationStatus());
 
       expect(result.current.verificationState).toBe('PENDING');
+    });
+  });
 
-      // When: Next poll returns UNVERIFIED
-      const unverifiedResponse: UserResponse = {
-        ...mockUserResponse,
-        verificationState: 'UNVERIFIED',
-      };
-      mockGetRegistrationStatus.mockResolvedValueOnce(unverifiedResponse);
+  describe('Auto-stop polling based on verification state', () => {
+    it('refetchInterval stops polling when state is VERIFIED', () => {
+      renderHook(() => useUserRegistrationStatus());
+
+      const refetchIntervalFn = mockQueryConfig.refetchInterval as (query: {
+        state: { data: { verificationState: string } | undefined };
+      }) => number | false;
+
+      expect(
+        refetchIntervalFn({
+          state: { data: { verificationState: 'VERIFIED' } },
+        }),
+      ).toBe(false);
+    });
 
-      act(() => {
-        jest.advanceTimersByTime(5000);
-      });
+    it('refetchInterval stops polling when state is UNVERIFIED', () => {
+      renderHook(() => useUserRegistrationStatus());
 
-      await waitForNextUpdate();
+      const refetchIntervalFn = mockQueryConfig.refetchInterval as (query: {
+        state: { data: { verificationState: string } | undefined };
+      }) => number | false;
 
-      // Then: Verification state updates and polling auto-stops
-      expect(result.current.verificationState).toBe('UNVERIFIED');
+      expect(
+        refetchIntervalFn({
+          state: { data: { verificationState: 'UNVERIFIED' } },
+        }),
+      ).toBe(false);
+    });
 
-      // Clear previous calls
-      mockGetRegistrationStatus.mockClear();
+    it('refetchInterval stops polling when state is REJECTED', () => {
+      renderHook(() => useUserRegistrationStatus());
 
-      // When: More time passes
-      await act(async () => {
-        jest.advanceTimersByTime(10000);
-      });
+      const refetchIntervalFn = mockQueryConfig.refetchInterval as (query: {
+        state: { data: { verificationState: string } | undefined };
+      }) => number | false;
 
-      // Then: Polling has stopped automatically (no more fetches)
-      expect(mockGetRegistrationStatus).not.toHaveBeenCalled();
+      expect(
+        refetchIntervalFn({
+          state: { data: { verificationState: 'REJECTED' } },
+        }),
+      ).toBe(false);
     });
 
-    it('automatically stops polling when verification state changes from PENDING to VERIFIED', async () => {
-      // Given: Initial PENDING response
-      const pendingResponse: UserResponse = {
-        ...mockUserResponse,
-        verificationState: 'PENDING',
-      };
-      mockGetRegistrationStatus.mockResolvedValueOnce(pendingResponse);
+    it('refetchInterval continues polling when state is PENDING', () => {
+      renderHook(() => useUserRegistrationStatus());
 
-      const { result, waitForNextUpdate } = renderHook(() =>
-        useUserRegistrationStatus(),
-      );
+      const refetchIntervalFn = mockQueryConfig.refetchInterval as (query: {
+        state: { data: { verificationState: string } | undefined };
+      }) => number | false;
 
-      act(() => {
-        result.current.startPolling();
-      });
+      expect(
+        refetchIntervalFn({
+          state: { data: { verificationState: 'PENDING' } },
+        }),
+      ).toBe(5000);
+    });
+  });
 
-      await waitForNextUpdate();
+  describe('error handling', () => {
+    it('returns error state when query has error', () => {
+      const queryError = new Error('Server error');
+      mockUseQueryReturn.error = queryError;
+      mockGetErrorMessage.mockReturnValue('Server error occurred');
 
-      expect(result.current.verificationState).toBe('PENDING');
+      const { result } = renderHook(() => useUserRegistrationStatus());
 
-      // When: Next poll returns VERIFIED
-      const verifiedResponse: UserResponse = {
-        ...mockUserResponse,
-        verificationState: 'VERIFIED',
-      };
-      mockGetRegistrationStatus.mockResolvedValueOnce(verifiedResponse);
+      expect(result.current.isError).toBe(true);
+      expect(result.current.error).toBe('Server error occurred');
+    });
 
-      act(() => {
-        jest.advanceTimersByTime(5000);
-      });
+    it('returns no error state when query has no error', () => {
+      mockUseQueryReturn.error = null;
 
-      await waitForNextUpdate();
+      const { result } = renderHook(() => useUserRegistrationStatus());
 
-      // Then: Verification state updates and polling auto-stops
-      expect(result.current.verificationState).toBe('VERIFIED');
+      expect(result.current.isError).toBe(false);
+      expect(result.current.error).toBeNull();
+    });
+  });
 
-      // Clear previous calls
-      mockGetRegistrationStatus.mockClear();
+  describe('Polling Management', () => {
+    it('starts polling via startPolling', () => {
+      const { result } = renderHook(() => useUserRegistrationStatus());
 
-      // When: More time passes
-      await act(async () => {
-        jest.advanceTimersByTime(10000);
+      act(() => {
+        result.current.startPolling();
       });
 
-      // Then: Polling has stopped automatically (no more fetches)
-      expect(mockGetRegistrationStatus).not.toHaveBeenCalled();
+      expect(result.current.verificationState).toBe('PENDING');
     });
 
-    it('automatically stops polling when verification state changes to REJECTED', async () => {
-      // Given: Initial PENDING response
-      const pendingResponse: UserResponse = {
-        ...mockUserResponse,
-        verificationState: 'PENDING',
-      };
-      mockGetRegistrationStatus.mockResolvedValueOnce(pendingResponse);
-
-      const { result, waitForNextUpdate } = renderHook(() =>
-        useUserRegistrationStatus(),
+    it('stops polling via stopPolling', () => {
+      const { useQuery: mockUseQuery } = jest.requireMock(
+        '@tanstack/react-query',
       );
 
+      const { result } = renderHook(() => useUserRegistrationStatus());
+
       act(() => {
         result.current.startPolling();
       });
 
-      await waitForNextUpdate();
-
-      expect(result.current.verificationState).toBe('PENDING');
-
-      // When: Next poll returns REJECTED
-      const rejectedResponse: UserResponse = {
-        ...mockUserResponse,
-        verificationState: 'REJECTED',
-      };
-      mockGetRegistrationStatus.mockResolvedValueOnce(rejectedResponse);
-
       act(() => {
-        jest.advanceTimersByTime(5000);
+        result.current.stopPolling();
       });
 
-      await waitForNextUpdate();
-
-      // Then: Verification state updates and polling auto-stops
-      expect(result.current.verificationState).toBe('REJECTED');
+      const lastCallConfig =
+        mockUseQuery.mock.calls[mockUseQuery.mock.calls.length - 1][0];
+      expect(lastCallConfig.enabled).toBe(false);
+    });
 
-      // Clear the initial calls
-      mockGetRegistrationStatus.mockClear();
+    it('handles stopPolling when no polling is active', () => {
+      const { result } = renderHook(() => useUserRegistrationStatus());
 
-      // When: Time advances
-      await act(async () => {
-        jest.advanceTimersByTime(10000);
+      act(() => {
+        result.current.stopPolling();
       });
 
-      // Then: Polling has stopped automatically (no more fetches)
-      expect(mockGetRegistrationStatus).not.toHaveBeenCalled();
+      expect(result.current.verificationState).toBe('PENDING');
+      expect(result.current.isError).toBe(false);
     });
-  });
 
-  describe('Memory Management', () => {
-    it('cleans up polling interval on unmount', async () => {
-      // Given: Hook with active polling
-      mockGetRegistrationStatus.mockResolvedValue({
-        ...mockUserResponse,
-        verificationState: 'PENDING',
-      });
-
-      const { result, unmount } = renderHook(() => useUserRegistrationStatus());
+    it('handles multiple rapid startPolling calls', () => {
+      const { result } = renderHook(() => useUserRegistrationStatus());
 
-      await act(async () => {
+      act(() => {
         result.current.startPolling();
       });
 
-      mockGetRegistrationStatus.mockClear();
-
-      // When: Component unmounts
-      unmount();
+      act(() => {
+        result.current.startPolling();
+      });
 
-      // When: Time advances after unmount
-      await act(async () => {
-        jest.advanceTimersByTime(10000);
+      act(() => {
+        result.current.startPolling();
       });
 
-      // Then: Polling stops (cleanup on unmount)
-      expect(mockGetRegistrationStatus).not.toHaveBeenCalled();
+      expect(result.current.verificationState).toBe('PENDING');
+      expect(result.current.isError).toBe(false);
     });
   });
 
   describe('Edge Cases', () => {
-    it('handles response without verificationState', async () => {
-      // Given: Response without verificationState
-      const responseWithoutVerificationState: UserResponse = {
+    it('handles response without verificationState', () => {
+      mockUseQueryReturn.data = {
         id: 'user-123',
         firstName: 'John',
         lastName: 'Doe',
         email: 'john.doe@example.com',
-      };
-      mockGetRegistrationStatus.mockResolvedValue(
-        responseWithoutVerificationState,
-      );
-
-      // When: Hook fetches data
-      const { result, waitForNextUpdate } = renderHook(() =>
-        useUserRegistrationStatus(),
-      );
+      } as UserResponse;
 
-      act(() => {
-        result.current.startPolling();
-      });
-
-      await waitForNextUpdate();
+      const { result } = renderHook(() => useUserRegistrationStatus());
 
-      // Then: Should handle gracefully - verificationState should be 'PENDING' (default fallback)
       expect(result.current.verificationState).toBe('PENDING');
       expect(result.current.isError).toBe(false);
     });
 
-    it('handles multiple rapid startPolling calls', async () => {
-      // Given: PENDING response to maintain polling
-      const pendingResponse: UserResponse = {
-        ...mockUserResponse,
-        verificationState: 'PENDING',
-      };
-      mockGetRegistrationStatus.mockResolvedValue(pendingResponse);
-
-      const { result } = renderHook(() => useUserRegistrationStatus());
-
-      // When: Multiple rapid startPolling calls
-      await act(async () => {
-        result.current.startPolling();
-      });
-
-      await act(async () => {
-        result.current.startPolling();
+    it('handles SDK not available', () => {
+      mockUseCardSDK.mockReturnValue({
+        sdk: null,
+        user: null,
+        setUser: mockSetUser,
+        isLoading: false,
+        logoutFromProvider: jest.fn(),
+        fetchUserData: jest.fn(),
+        isReturningSession: false,
       });
 
-      await act(async () => {
-        result.current.startPolling();
-      });
+      const { result } = renderHook(() => useUserRegistrationStatus());
 
-      // Then: Each call triggers a fetch, clearing previous interval
-      expect(mockGetRegistrationStatus).toHaveBeenCalledTimes(3);
+      expect(result.current.verificationState).toBe('PENDING');
+      expect(result.current.isLoading).toBe(false);
+    });
+  });
 
-      // Clear previous calls
-      mockGetRegistrationStatus.mockClear();
+  describe('setUser effect', () => {
+    it('calls setUser when data is available', () => {
+      mockUseQueryReturn.data = mockUserResponse;
 
-      // When: Time advances
-      await act(async () => {
-        jest.advanceTimersByTime(5000);
-      });
+      renderHook(() => useUserRegistrationStatus());
 
-      // Then: Only one active interval remains (last startPolling call)
-      expect(mockGetRegistrationStatus).toHaveBeenCalledTimes(1);
+      expect(mockSetUser).toHaveBeenCalledWith(mockUserResponse);
     });
 
-    it('handles stopPolling when no polling is active', () => {
-      // Given: Hook without active polling
-      const { result } = renderHook(() => useUserRegistrationStatus());
+    it('does not call setUser when data is undefined', () => {
+      mockUseQueryReturn.data = undefined;
 
-      // When: stopPolling is called without active polling
-      act(() => {
-        result.current.stopPolling();
-      });
+      renderHook(() => useUserRegistrationStatus());
 
-      // Then: Should handle gracefully without errors - verificationState remains PENDING
-      expect(result.current.verificationState).toBe('PENDING');
-      expect(result.current.isError).toBe(false);
+      expect(mockSetUser).not.toHaveBeenCalled();
     });
   });
 });
diff --git a/app/components/UI/Card/hooks/useUserRegistrationStatus.ts b/app/components/UI/Card/hooks/useUserRegistrationStatus.ts
index 1f832282ca35..c7d7c44350a7 100644
--- a/app/components/UI/Card/hooks/useUserRegistrationStatus.ts
+++ b/app/components/UI/Card/hooks/useUserRegistrationStatus.ts
@@ -1,115 +1,74 @@
-import { useCallback, useEffect, useRef, useState } from 'react';
+import { useCallback, useEffect, useState } from 'react';
+import { useQuery } from '@tanstack/react-query';
 import { useCardSDK } from '../sdk';
 import { CardVerificationState } from '../types';
 import { getErrorMessage } from '../util/getErrorMessage';
 import { selectOnboardingId } from '../../../../core/redux/slices/card';
 import { useSelector } from 'react-redux';
+import { cardQueries } from '../queries';
+
+const POLLING_INTERVAL = 5000;
 
 interface UseUserRegistrationStatusReturn {
   verificationState: CardVerificationState | null;
   isLoading: boolean;
   isError: boolean;
   error: string | null;
-  clearError: () => void;
   startPolling: () => void;
   stopPolling: () => void;
 }
 
 /**
- * Hook for polling user registration status
- * Polls the registration status using getRegistrationStatus from CardSDK.
+ * Hook for polling user registration status.
  * Polling must be started manually via startPolling() and automatically stops
  * when verification reaches a terminal state (VERIFIED, REJECTED, or UNVERIFIED).
- * Only PENDING state continues polling.
  */
 export const useUserRegistrationStatus =
   (): UseUserRegistrationStatusReturn => {
     const { sdk, user, setUser } = useCardSDK();
-    const [verificationState, setVerificationState] =
-      useState<CardVerificationState>(user?.verificationState || 'PENDING');
-    const [isLoading, setIsLoading] = useState(false);
-    const [isError, setIsError] = useState(false);
-    const [error, setError] = useState<string | null>(null);
-    const intervalRef = useRef<NodeJS.Timeout | null>(null);
     const onboardingId = useSelector(selectOnboardingId);
+    const [isPolling, setIsPolling] = useState(false);
+
+    const { data, isLoading, error } = useQuery({
+      queryKey: cardQueries.dashboard.keys.registrationStatus(
+        onboardingId ?? '',
+      ),
+      queryFn: async () => {
+        if (!sdk) throw new Error('Card SDK not initialized');
+        if (!onboardingId) throw new Error('Onboarding ID not available');
+        return sdk.getRegistrationStatus(onboardingId);
+      },
+      enabled: isPolling && !!sdk && !!onboardingId,
+      refetchInterval: (query) => {
+        const state = query.state.data?.verificationState;
+        if (state && state !== 'PENDING') return false;
+        return POLLING_INTERVAL;
+      },
+    });
 
-    // Default polling interval: 5 seconds
-    const POLLING_INTERVAL = 5000;
-
-    const clearError = useCallback(() => {
-      setError(null);
-      setIsError(false);
-    }, []);
-
-    const fetchRegistrationStatus = useCallback(async () => {
-      if (!sdk) {
-        const errorMessage = 'Card SDK not initialized';
-        setError(errorMessage);
-        setIsError(true);
-        return;
-      }
-
-      if (!onboardingId) {
-        const errorMessage = 'Onboarding ID not available';
-        setError(errorMessage);
-        setIsError(true);
-        return;
-      }
-
-      try {
-        setIsLoading(true);
-        setIsError(false);
-        setError(null);
-
-        const response = await sdk.getRegistrationStatus(onboardingId);
-        setUser(response);
-        setVerificationState(response.verificationState || 'PENDING');
-        setIsLoading(false);
-      } catch (err) {
-        const errorMessage = getErrorMessage(err);
-        setError(errorMessage);
-        setIsError(true);
-        setIsLoading(false);
-      }
-    }, [setUser, onboardingId, sdk]);
-
-    const startPolling = useCallback(() => {
-      // Clear any existing interval
-      if (intervalRef.current) {
-        clearInterval(intervalRef.current);
+    useEffect(() => {
+      if (data) {
+        setUser(data);
       }
+    }, [data, setUser]);
 
-      // Fetch immediately
-      fetchRegistrationStatus();
-
-      // Set up polling interval
-      intervalRef.current = setInterval(() => {
-        fetchRegistrationStatus();
-      }, POLLING_INTERVAL);
-    }, [fetchRegistrationStatus]);
-
-    const stopPolling = useCallback(() => {
-      if (intervalRef.current) {
-        clearInterval(intervalRef.current);
-        intervalRef.current = null;
-      }
-    }, []);
+    const verificationState: CardVerificationState =
+      data?.verificationState ?? user?.verificationState ?? 'PENDING';
 
     useEffect(() => {
-      // Auto-stop polling when verification reaches terminal state (not PENDING)
-      if (verificationState !== 'PENDING' && intervalRef.current) {
-        stopPolling();
+      if (verificationState !== 'PENDING') {
+        setIsPolling(false);
       }
+    }, [verificationState]);
 
-      return stopPolling;
-    }, [verificationState, stopPolling]);
+    const startPolling = useCallback(() => setIsPolling(true), []);
+    const stopPolling = useCallback(() => setIsPolling(false), []);
 
     return {
       verificationState,
       isLoading,
-      isError,
-      error,
-      clearError,
+      isError: !!error,
+      error: error ? getErrorMessage(error) : null,
       startPolling,
       stopPolling,
     };
diff --git a/app/components/UI/Card/hooks/useWrapWithCache.test.ts b/app/components/UI/Card/hooks/useWrapWithCache.test.ts
deleted file mode 100644
index f512e5a8116b..000000000000
--- a/app/components/UI/Card/hooks/useWrapWithCache.test.ts
+++ /dev/null
@@ -1,598 +0,0 @@
-import { renderHook, act } from '@testing-library/react-hooks';
-import { useSelector, useDispatch } from 'react-redux';
-import { useWrapWithCache } from './useWrapWithCache';
-
-// Mock dependencies
-jest.mock('react-redux', () => ({
-  useSelector: jest.fn(),
-  useDispatch: jest.fn(),
-}));
-
-const mockUseSelector = useSelector as jest.MockedFunction<typeof useSelector>;
-const mockUseDispatch = useDispatch as jest.MockedFunction<typeof useDispatch>;
-
-describe('useWrapWithCache', () => {
-  const mockDispatch = jest.fn();
-  const mockFetchFunction = jest.fn();
-  const mockCacheKey = 'test-cache-key';
-  const mockData = { id: 1, name: 'Test Data' };
-
-  const defaultConfig = {
-    cacheDuration: 5 * 60 * 1000, // 5 minutes
-    fetchOnMount: true,
-  };
-
-  // Simulated Redux state that gets updated when dispatch is called
-  let mockCacheState: {
-    data: Record<string, unknown>;
-    timestamps: Record<string, number>;
-  };
-
-  beforeEach(() => {
-    jest.clearAllMocks();
-    mockFetchFunction.mockReset();
-    mockFetchFunction.mockImplementation(() => new Promise(() => undefined));
-
-    // Reset cache state
-    mockCacheState = {
-      data: {},
-      timestamps: {},
-    };
-
-    // Mock dispatch to update cache state (simulating Redux behavior)
-    mockDispatch.mockImplementation(
-      (action: {
-        type: string;
-        payload?: { key: string; data: unknown; timestamp: number };
-      }) => {
-        if (action.type === 'card/setCacheData' && action.payload) {
-          mockCacheState.data[action.payload.key] = action.payload.data;
-          mockCacheState.timestamps[action.payload.key] =
-            action.payload.timestamp;
-        }
-      },
-    );
-    mockUseDispatch.mockReturnValue(mockDispatch);
-
-    // Mock selector to return current cache state
-    mockUseSelector.mockImplementation((selector) => {
-      const mockState = {
-        card: {
-          cache: mockCacheState,
-        },
-      };
-      return selector(mockState);
-    });
-  });
-
-  describe('Initial State', () => {
-    it('initializes with correct default state when no cached data exists', () => {
-      // Given: No cached data in Redux (default state)
-
-      // When: Hook is rendered with fetchOnMount disabled
-      const { result } = renderHook(() =>
-        useWrapWithCache(mockCacheKey, mockFetchFunction, {
-          fetchOnMount: false,
-        }),
-      );
-
-      // Then: Should have correct initial state
-      expect(result.current.data).toBeNull();
-      expect(result.current.isLoading).toBe(false);
-      expect(result.current.error).toBeNull();
-    });
-
-    it('initializes with cached data when available in Redux', () => {
-      const cachedData = mockData;
-      const cachedTimestamp = Date.now() - 1000; // 1 second ago
-
-      // Given: Cached data exists in Redux
-      mockCacheState.data[mockCacheKey] = cachedData;
-      mockCacheState.timestamps[mockCacheKey] = cachedTimestamp;
-
-      // When: Hook is rendered
-      const { result } = renderHook(() =>
-        useWrapWithCache(mockCacheKey, mockFetchFunction, defaultConfig),
-      );
-
-      // Then: Should initialize with cached data
-      expect(result.current.data).toEqual(mockData);
-    });
-
-    it('handles null cached data gracefully', () => {
-      // Given: Cached data is null (default state handles this)
-
-      // When: Hook is rendered
-      const { result } = renderHook(() =>
-        useWrapWithCache(mockCacheKey, mockFetchFunction, defaultConfig),
-      );
-
-      // Then: Should handle null data gracefully
-      expect(result.current.data).toBeNull();
-    });
-  });
-
-  describe('Cache Validation', () => {
-    it('considers cache valid when data is fresh', () => {
-      // Given: Fresh cached data (within the 5 minute default cache duration)
-      const cachedData = mockData;
-      // Use a timestamp that's definitely fresh (30 seconds ago)
-      const recentTimestamp = Date.now() - 30 * 1000; // 30 seconds ago
-
-      mockCacheState.data[mockCacheKey] = cachedData;
-      mockCacheState.timestamps[mockCacheKey] = recentTimestamp;
-
-      // When: Hook is rendered with fresh cache and fetchOnMount disabled to isolate cache logic
-      const { result } = renderHook(() =>
-        useWrapWithCache(mockCacheKey, mockFetchFunction, {
-          fetchOnMount: false,
-        }),
-      );
-
-      // Then: Should use cached data
-      expect(result.current.data).toEqual(cachedData);
-      expect(mockFetchFunction).not.toHaveBeenCalled();
-    });
-
-    it('considers cache invalid when data is stale', () => {
-      const staleTimestamp = Date.now() - 6 * 60 * 1000; // 6 minutes ago (older than 5min cache duration)
-      const cachedData = mockData;
-
-      // Given: Stale cached data and fetchOnMount enabled
-      mockCacheState.data[mockCacheKey] = cachedData;
-      mockCacheState.timestamps[mockCacheKey] = staleTimestamp;
-      mockFetchFunction.mockImplementation(
-        () =>
-          new Promise(() => {
-            // Never resolves – we only need to know fetch was triggered
-          }),
-      );
-
-      // When: Hook is rendered
-      renderHook(() =>
-        useWrapWithCache(mockCacheKey, mockFetchFunction, defaultConfig),
-      );
-
-      // Then: Should trigger fetch for stale cache
-      expect(mockFetchFunction).toHaveBeenCalledTimes(1);
-    });
-
-    it('considers cache invalid when lastFetched is null', () => {
-      const cachedData = mockData;
-
-      // Given: Cached data without lastFetched timestamp
-      mockCacheState.data[mockCacheKey] = cachedData;
-      // No timestamp for this key - intentionally omitted
-      mockFetchFunction.mockImplementation(
-        () =>
-          new Promise(() => {
-            // Never resolves – we only need to know fetch was triggered
-          }),
-      );
-
-      // When: Hook is rendered
-      renderHook(() =>
-        useWrapWithCache(mockCacheKey, mockFetchFunction, defaultConfig),
-      );
-
-      // Then: Should trigger fetch when lastFetched is null
-      expect(mockFetchFunction).toHaveBeenCalledTimes(1);
-    });
-  });
-
-  describe('Fetch Behavior', () => {
-    it('fetches data on mount when fetchOnMount is true and no valid cache', () => {
-      // Given: No cached data and fetchOnMount enabled (default state)
-      mockFetchFunction.mockImplementation(
-        () =>
-          new Promise(() => {
-            // Never resolves – we only need to know fetch was triggered
-          }),
-      );
-
-      // When: Hook is rendered
-      renderHook(() =>
-        useWrapWithCache(mockCacheKey, mockFetchFunction, defaultConfig),
-      );
-
-      // Then: Should fetch data on mount
-      expect(mockFetchFunction).toHaveBeenCalledTimes(1);
-    });
-
-    it('prevents infinite loops by not fetching when already loading', () => {
-      // Given: Hook with slow fetch
-      mockFetchFunction.mockImplementation(
-        () =>
-          new Promise(() => {
-            // Never resolves - simulates long fetch
-          }),
-      );
-
-      // When: Hook is rendered and re-renders while loading
-      const { rerender } = renderHook(() =>
-        useWrapWithCache(mockCacheKey, mockFetchFunction, defaultConfig),
-      );
-
-      // Force multiple re-renders while loading
-      rerender();
-      rerender();
-      rerender();
-
-      // Then: Should only call fetch once despite re-renders
-      expect(mockFetchFunction).toHaveBeenCalledTimes(1);
-    });
-
-    it('prevents retry loops by not auto-fetching when error exists', async () => {
-      const mockError = new Error('Network error');
-
-      // Given: Initial fetch fails with error
-      mockFetchFunction.mockRejectedValueOnce(mockError);
-
-      // When: Hook is rendered and encounters error
-      const { result, waitForNextUpdate, rerender } = renderHook(() =>
-        useWrapWithCache(mockCacheKey, mockFetchFunction, defaultConfig),
-      );
-
-      await waitForNextUpdate();
-
-      // Then: Error state is set
-      expect(result.current.error).toBeInstanceOf(Error);
-      expect(result.current.error?.message).toBe('Network error');
-
-      // Clear the mock to track new calls
-      mockFetchFunction.mockClear();
-
-      // When: Component re-renders with error state
-      rerender();
-      rerender();
-
-      // Then: Should not retry fetch automatically (user must manually retry)
-      expect(mockFetchFunction).not.toHaveBeenCalled();
-    });
-
-    it('does not fetch data on mount when fetchOnMount is false', () => {
-      const config = { ...defaultConfig, fetchOnMount: false };
-
-      // Given: fetchOnMount is disabled (default state)
-
-      // When: Hook is rendered
-      renderHook(() =>
-        useWrapWithCache(mockCacheKey, mockFetchFunction, config),
-      );
-
-      // Then: Should not fetch data on mount
-      expect(mockFetchFunction).not.toHaveBeenCalled();
-    });
-
-    it('stores fetched data when fetchData resolves', async () => {
-      // Given: No cached data and manual fetch
-      const fetchPromise = Promise.resolve(mockData);
-      mockFetchFunction.mockReturnValue(fetchPromise);
-
-      // When: Hook is rendered with fetchOnMount disabled
-      const { result } = renderHook(() =>
-        useWrapWithCache(mockCacheKey, mockFetchFunction, {
-          fetchOnMount: false,
-        }),
-      );
-
-      await act(async () => {
-        await result.current.fetchData();
-      });
-
-      // Then: Should dispatch action with fetched data
-      expect(mockDispatch).toHaveBeenCalledWith({
-        type: 'card/setCacheData',
-        payload: {
-          key: mockCacheKey,
-          data: mockData,
-          timestamp: expect.any(Number),
-        },
-      });
-      expect(result.current.isLoading).toBe(false);
-    });
-
-    it('handles Error instances from fetch failures', async () => {
-      const mockError = new Error('Test error');
-
-      // Given: No cached data and fetch will fail (default state)
-      mockFetchFunction.mockRejectedValue(mockError);
-
-      // When: Hook is rendered and fetch fails
-      const { result, waitForNextUpdate } = renderHook(() =>
-        useWrapWithCache(mockCacheKey, mockFetchFunction, defaultConfig),
-      );
-
-      await waitForNextUpdate();
-
-      // Then: Should update state with error object
-      expect(result.current.data).toBeNull();
-      expect(result.current.isLoading).toBe(false);
-      expect(result.current.error).toBeInstanceOf(Error);
-      expect(result.current.error?.message).toBe('Test error');
-      expect(mockDispatch).not.toHaveBeenCalled();
-    });
-
-    it('converts non-Error objects to Error instances', async () => {
-      const nonErrorObject = { message: 'API returned error', code: 500 };
-
-      // Given: Fetch fails with non-Error object
-      mockFetchFunction.mockRejectedValue(nonErrorObject);
-
-      // When: Hook is rendered and fetch fails
-      const { result, waitForNextUpdate } = renderHook(() =>
-        useWrapWithCache(mockCacheKey, mockFetchFunction, defaultConfig),
-      );
-
-      await waitForNextUpdate();
-
-      // Then: Should convert to Error instance
-      expect(result.current.error).toBeInstanceOf(Error);
-      expect(result.current.error?.message).toBe('[object Object]');
-    });
-
-    it('converts string errors to Error instances', async () => {
-      const stringError = 'Something went wrong';
-
-      // Given: Fetch fails with string error
-      mockFetchFunction.mockRejectedValue(stringError);
-
-      // When: Hook is rendered and fetch fails
-      const { result, waitForNextUpdate } = renderHook(() =>
-        useWrapWithCache(mockCacheKey, mockFetchFunction, defaultConfig),
-      );
-
-      await waitForNextUpdate();
-
-      // Then: Should convert to Error instance
-      expect(result.current.error).toBeInstanceOf(Error);
-      expect(result.current.error?.message).toBe('Something went wrong');
-    });
-
-    it('sets loading state during fetch', () => {
-      // Given: No cached data and slow fetch (default state)
-      mockFetchFunction.mockImplementation(
-        () =>
-          new Promise(() => {
-            // Never resolves
-          }),
-      );
-
-      // When: Hook is rendered
-      const { result } = renderHook(() =>
-        useWrapWithCache(mockCacheKey, mockFetchFunction, defaultConfig),
-      );
-
-      // Then: Should be in loading state
-      expect(result.current.isLoading).toBe(true);
-      expect(result.current.error).toBeNull();
-    });
-  });
-
-  describe('Manual Fetch', () => {
-    it('allows manual data fetching via fetchData function', async () => {
-      // Given: Hook with cached data and fetchOnMount disabled
-      const cachedData = mockData;
-      const cachedTimestamp = Date.now() - 1000;
-      mockCacheState.data[mockCacheKey] = cachedData;
-      mockCacheState.timestamps[mockCacheKey] = cachedTimestamp;
-
-      const newData = { id: 2, name: 'New Data' };
-      mockFetchFunction.mockResolvedValue(newData);
-
-      // When: Manual fetch is triggered
-      const { result } = renderHook(() =>
-        useWrapWithCache(mockCacheKey, mockFetchFunction, {
-          fetchOnMount: false, // Disable auto-fetch
-        }),
-      );
-
-      await act(async () => {
-        await result.current.fetchData();
-      });
-
-      // Then: Should fetch and update with new data
-      expect(mockFetchFunction).toHaveBeenCalledTimes(1);
-      expect(mockDispatch).toHaveBeenCalledWith({
-        type: 'card/setCacheData',
-        payload: {
-          key: mockCacheKey,
-          data: newData,
-          timestamp: expect.any(Number),
-        },
-      });
-    });
-
-    it('handles manual fetch errors', async () => {
-      const mockError = new Error('Test error');
-
-      // Given: Hook with cached data
-      const cachedData = mockData;
-      const cachedTimestamp = Date.now() - 1000;
-      mockCacheState.data[mockCacheKey] = cachedData;
-      mockCacheState.timestamps[mockCacheKey] = cachedTimestamp;
-      mockFetchFunction.mockRejectedValue(mockError);
-
-      // When: Manual fetch fails
-      const { result } = renderHook(() =>
-        useWrapWithCache(mockCacheKey, mockFetchFunction, defaultConfig),
-      );
-
-      await act(async () => {
-        await result.current.fetchData();
-      });
-
-      // Then: Should update error state but keep cached data
-      expect(result.current.data).toEqual(mockData); // Should keep cached data
-      expect(result.current.error).toBeInstanceOf(Error);
-      expect(result.current.error?.message).toBe('Test error');
-      expect(result.current.isLoading).toBe(false);
-    });
-  });
-
-  describe('Configuration Options', () => {
-    it('respects custom cache duration', () => {
-      // Given: Fresh cached data with custom cache duration
-      const cachedData = mockData;
-      const recentTimestamp = Date.now() - 30000; // 30 seconds ago
-      const customConfig = { cacheDuration: 60000, fetchOnMount: false }; // 1 minute cache, no fetch on mount
-
-      mockCacheState.data[mockCacheKey] = cachedData;
-      mockCacheState.timestamps[mockCacheKey] = recentTimestamp;
-
-      // When: Hook is rendered with custom cache duration
-      renderHook(() =>
-        useWrapWithCache(mockCacheKey, mockFetchFunction, customConfig),
-      );
-
-      // Then: Should not fetch because cache is still valid
-      expect(mockFetchFunction).not.toHaveBeenCalled();
-    });
-
-    it('handles zero cache duration by always fetching', () => {
-      // Given: Cached data with zero cache duration (always fetch)
-      const cachedData = mockData;
-      const recentTimestamp = Date.now() - 1000; // 1 second ago
-      const zeroConfig = { cacheDuration: 0, fetchOnMount: true }; // Always fetch
-
-      mockCacheState.data[mockCacheKey] = cachedData;
-      mockCacheState.timestamps[mockCacheKey] = recentTimestamp;
-      mockFetchFunction.mockImplementation(
-        () =>
-          new Promise(() => {
-            // Never resolves – we only need to know fetch was triggered
-          }),
-      );
-
-      // When: Hook is rendered with zero cache duration
-      renderHook(() =>
-        useWrapWithCache(mockCacheKey, mockFetchFunction, zeroConfig),
-      );
-
-      // Then: Should always fetch regardless of cache
-      expect(mockFetchFunction).toHaveBeenCalled();
-    });
-  });
-
-  describe('Redux Integration', () => {
-    it('uses correct selector for cache key', () => {
-      // Given: Hook with specific cache key (default state)
-
-      // When: Hook is rendered
-      renderHook(() =>
-        useWrapWithCache(mockCacheKey, mockFetchFunction, defaultConfig),
-      );
-
-      // Then: Should call useSelector with correct selector
-      expect(mockUseSelector).toHaveBeenCalledWith(expect.any(Function));
-    });
-
-    it('dispatches cache updates with correct structure', async () => {
-      // Given: No cached data and manual fetch trigger
-      mockFetchFunction.mockResolvedValue(mockData);
-
-      // When: Data is fetched via fetchData
-      const { result } = renderHook(() =>
-        useWrapWithCache(mockCacheKey, mockFetchFunction, {
-          fetchOnMount: false,
-        }),
-      );
-
-      await act(async () => {
-        await result.current.fetchData();
-      });
-
-      // Then: Should dispatch correct action structure
-      expect(mockDispatch).toHaveBeenCalledWith({
-        type: 'card/setCacheData',
-        payload: {
-          key: mockCacheKey,
-          data: mockData,
-          timestamp: expect.any(Number),
-        },
-      });
-      expect(result.current.isLoading).toBe(false);
-    });
-  });
-
-  describe('Edge Cases', () => {
-    it('skips caching when fetch returns null', async () => {
-      // Given: Fetch function returns null via manual fetch
-      mockFetchFunction.mockResolvedValue(null);
-
-      // When: fetchData is called manually
-      const { result } = renderHook(() =>
-        useWrapWithCache(mockCacheKey, mockFetchFunction, {
-          fetchOnMount: false,
-        }),
-      );
-
-      await act(async () => {
-        await result.current.fetchData();
-      });
-
-      // Then: Should not cache null responses
-      expect(mockDispatch).not.toHaveBeenCalled();
-      expect(result.current.isLoading).toBe(false);
-      expect(result.current.data).toBeNull();
-    });
-
-    it('skips caching when fetch returns undefined', async () => {
-      // Given: Fetch function returns undefined and manual fetch trigger
-      mockFetchFunction.mockResolvedValue(undefined);
-
-      // When: fetchData is called manually
-      const { result } = renderHook(() =>
-        useWrapWithCache(mockCacheKey, mockFetchFunction, {
-          fetchOnMount: false,
-        }),
-      );
-
-      await act(async () => {
-        await result.current.fetchData();
-      });
-
-      // Then: Should not cache undefined responses
-      expect(mockDispatch).not.toHaveBeenCalled();
-      expect(result.current.isLoading).toBe(false);
-      expect(result.current.data).toBeNull();
-    });
-
-    it('handles empty cache key', () => {
-      // Given: Empty cache key
-      const emptyCacheKey = '';
-
-      // When: Hook is rendered with empty cache key
-      const { result } = renderHook(() =>
-        useWrapWithCache(emptyCacheKey, mockFetchFunction, {
-          fetchOnMount: false,
-        }),
-      );
-
-      // Then: Should not be loading and should not fetch
-      expect(result.current.isLoading).toBe(false);
-      expect(mockFetchFunction).not.toHaveBeenCalled();
-    });
-  });
-
-  describe('Memory Management', () => {
-    it('cleans up properly on unmount', () => {
-      // Given: Hook with ongoing fetch (default state)
-      mockFetchFunction.mockImplementation(
-        () =>
-          new Promise(() => {
-            // Never resolves
-          }),
-      );
-
-      // When: Hook is mounted and then unmounted
-      const { unmount } = renderHook(() =>
-        useWrapWithCache(mockCacheKey, mockFetchFunction, defaultConfig),
-      );
-      unmount();
-
-      // Then: Should not cause memory leaks or errors
-      expect(() => unmount()).not.toThrow();
-    });
-  });
-});
diff --git a/app/components/UI/Card/hooks/useWrapWithCache.ts b/app/components/UI/Card/hooks/useWrapWithCache.ts
deleted file mode 100644
index 80b94e2a63cb..000000000000
--- a/app/components/UI/Card/hooks/useWrapWithCache.ts
+++ /dev/null
@@ -1,160 +0,0 @@
-import { useCallback, useEffect, useState } from 'react';
-import { useDispatch, useSelector } from 'react-redux';
-import { RootState } from '../../../../reducers';
-import { setCacheData } from '../../../../core/redux/slices/card';
-
-/**
- * Configuration options for the cache hook
- */
-interface CacheConfig {
-  /** Cache duration in milliseconds (default: 5 minutes) */
-  cacheDuration?: number;
-  /** Whether to fetch data on component mount (default: true) */
-  fetchOnMount?: boolean;
-}
-
-/**
- * Return type for the cache hook
- */
-interface CacheHookReturn<T> {
-  /** Cached data or null if not available */
-  data: T | null;
-  /** Loading state - true when actively fetching */
-  isLoading: boolean;
-  /** Error object if last fetch failed, null otherwise */
-  error: Error | null;
-  /** Function to manually trigger data fetch */
-  fetchData: () => Promise<T | null>;
-}
-
-/**
- * A simplified hook that provides caching functionality using Redux for state management.
- *
- * This hook implements a simple cache strategy:
- * 1. Check if cache is valid (less than 5 minutes old by default)
- * 2. If cache is valid and data exists, return cached data
- * 3. If cache is stale or no data exists, fetch new data
- * 4. Store both data and lastFetched timestamp in Redux
- *
- * @template T The type of data being cached
- * @param cacheKey Unique identifier for this cache entry
- * @param fetchFn Async function that fetches the data
- * @param config Optional configuration for cache behavior
- * @returns Object containing data, loading state, error, and fetch function
- *
- * @example
- * ```typescript
- * const { data, isLoading, error, fetchData } = useWrapWithCache(
- *   'registration-settings',
- *   () => api.getRegistrationSettings(),
- *   { cacheDuration: 10 * 60 * 1000 }, // 10 minutes
- * );
- * ```
- */
-export const useWrapWithCache = <T>(
-  cacheKey: string,
-  fetchFn: () => Promise<T | null>,
-  config: CacheConfig = {},
-): CacheHookReturn<T> => {
-  const {
-    cacheDuration = 5 * 60 * 1000, // 5 minutes default
-    fetchOnMount = true,
-  } = config;
-
-  const dispatch = useDispatch();
-  const [isLoading, setIsLoading] = useState<boolean>(false);
-  const [error, setError] = useState<Error | null>(null);
-
-  // Get cached data and timestamp from Redux store (card.cache)
-  const cachedData = useSelector(
-    (state: RootState) => (state.card.cache.data[cacheKey] as T | null) || null,
-  );
-  const lastFetched = useSelector(
-    (state: RootState) => state.card.cache.timestamps[cacheKey] || null,
-  );
-
-  // Helper to check if cache is still valid (same pattern as useGetPriorityCardToken)
-  const isCacheValid = useCallback(() => {
-    if (!lastFetched) return false;
-    const now = new Date();
-    const cacheExpiry = new Date(now.getTime() - cacheDuration);
-    // Handle timestamp as number (from card.cache.timestamps)
-    const lastFetchedDate = new Date(lastFetched);
-    return lastFetchedDate > cacheExpiry;
-  }, [lastFetched, cacheDuration]);
-
-  const cacheIsValid = isCacheValid();
-
-  // Fetch function that updates cache
-  const fetchData: () => Promise<T | null> = useCallback(async () => {
-    setIsLoading(true);
-    setError(null);
-
-    try {
-      const result = await fetchFn();
-      const normalizedResult = result ?? null;
-
-      // Only update cache if we got actual data (not null from missing dependencies)
-      // This prevents caching "null" responses when dependencies aren't ready
-      if (normalizedResult !== null) {
-        dispatch(
-          setCacheData({
-            key: cacheKey,
-            data: normalizedResult,
-            timestamp: Date.now(),
-          }),
-        );
-      }
-
-      return normalizedResult;
-    } catch (err) {
-      const errorObject = err instanceof Error ? err : new Error(String(err));
-      setError(errorObject);
-      return null;
-    } finally {
-      setIsLoading(false);
-    }
-  }, [fetchFn, cacheKey, dispatch]);
-
-  // Effect to handle initial fetch - runs on mount and when cache becomes invalid
-  // We DON'T include fetchData in dependencies to prevent refetching when the fetch function changes
-  // (e.g., when delegationSettings loads, it shouldn't trigger a refetch if cache is still valid)
-  useEffect(() => {
-    if (!fetchOnMount) {
-      return;
-    }
-
-    // Don't fetch if already loading (prevents infinite loops on re-renders)
-    if (isLoading) {
-      return;
-    }
-
-    // Don't fetch if there was an error (prevents retry loops on failed requests)
-    // User must manually call fetchData() to retry
-    if (error) {
-      return;
-    }
-
-    // If cache is valid and we have data, don't fetch
-    if (cacheIsValid && cachedData !== null) {
-      return;
-    }
-
-    // Cache is stale or we don't have data, fetch new data
-    fetchData();
-    // We deliberately exclude fetchData from dependencies to prevent unnecessary refetches
-    // when the fetch function reference changes but the cache is still valid
-    // eslint-disable-next-line react-compiler/react-compiler
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [cacheIsValid, cachedData, fetchOnMount, isLoading, error]);
-
-  // Determine loading state: only show loading if actively fetching AND no cached data
-  const shouldShowLoading = isLoading && (!cachedData || !cacheIsValid);
-
-  return {
-    data: cachedData,
-    isLoading: shouldShowLoading,
-    error,
-    fetchData,
-  };
-};
diff --git a/app/components/UI/Card/queries/dashboard.ts b/app/components/UI/Card/queries/dashboard.ts
new file mode 100644
index 000000000000..ec45a2cac515
--- /dev/null
+++ b/app/components/UI/Card/queries/dashboard.ts
@@ -0,0 +1,33 @@
+export const dashboardKeys = {
+  all: () => ['card', 'dashboard'] as const,
+  delegationSettings: () =>
+    [...dashboardKeys.all(), 'delegationSettings'] as const,
+  externalWalletDetails: () =>
+    [...dashboardKeys.all(), 'externalWalletDetails'] as const,
+  cardDetails: () => [...dashboardKeys.all(), 'cardDetails'] as const,
+  kycStatus: () => [...dashboardKeys.all(), 'kycStatus'] as const,
+  priorityTokenOnChain: (address: string) =>
+    [...dashboardKeys.all(), 'priorityToken', 'onChain', address] as const,
+  latestAllowance: (
+    tokenAddress: string,
+    delegationContract: string,
+    walletAddress: string,
+    caipChainId: string,
+    decimals: number,
+  ) =>
+    [
+      ...dashboardKeys.all(),
+      'latestAllowance',
+      tokenAddress,
+      delegationContract,
+      walletAddress,
+      caipChainId,
+      decimals,
+    ] as const,
+  registrationSettings: () =>
+    [...dashboardKeys.all(), 'registrationSettings'] as const,
+  registrationStatus: (onboardingId: string) =>
+    [...dashboardKeys.all(), 'registrationStatus', onboardingId] as const,
+  consentSet: (onboardingId: string) =>
+    [...dashboardKeys.all(), 'consentSet', onboardingId] as const,
+};
diff --git a/app/components/UI/Card/queries/index.ts b/app/components/UI/Card/queries/index.ts
index 5ba4e742b2c1..ccbd3433ec45 100644
--- a/app/components/UI/Card/queries/index.ts
+++ b/app/components/UI/Card/queries/index.ts
@@ -4,7 +4,15 @@ import {
   cashbackWalletOptions,
   cashbackWithdrawEstimationOptions,
 } from './cashback';
+import { dashboardKeys } from './dashboard';
+
 export const cardQueries = {
+  keys: {
+    all: () => ['card'] as const,
+  },
+  dashboard: {
+    keys: dashboardKeys,
+  },
   pin: {
     keys: pinKeys,
     tokenMutationFn: pinTokenMutationFn,
diff --git a/app/components/UI/Card/queries/pin.test.ts b/app/components/UI/Card/queries/pin.test.ts
index 175983e13626..3313da98989d 100644
--- a/app/components/UI/Card/queries/pin.test.ts
+++ b/app/components/UI/Card/queries/pin.test.ts
@@ -1,4 +1,5 @@
 import { CardSDK } from '../sdk/CardSDK';
+import { PIN_CSS } from '../hooks/useCardPinToken';
 import { pinKeys, pinTokenMutationFn } from './pin';
 
 describe('pinKeys', () => {
@@ -25,11 +26,11 @@ describe('pinTokenMutationFn', () => {
 
     const mutationFn = pinTokenMutationFn(mockSdk);
     const result = await mutationFn({
-      customCss: { backgroundColor: '#FFFFFF', textColor: '#000000' },
+      customCss: PIN_CSS.light,
     });
 
     expect(mockSdk.generateCardPinToken).toHaveBeenCalledWith({
-      customCss: { backgroundColor: '#FFFFFF', textColor: '#000000' },
+      customCss: PIN_CSS.light,
     });
     expect(result).toEqual(mockResponse);
   });
diff --git a/app/components/UI/Card/sdk/CardSDK.test.ts b/app/components/UI/Card/sdk/CardSDK.test.ts
index 1e3b1864a324..524195092411 100644
--- a/app/components/UI/Card/sdk/CardSDK.test.ts
+++ b/app/components/UI/Card/sdk/CardSDK.test.ts
@@ -13,6 +13,7 @@ import {
   CardAuthorizeResponse,
   CardExchangeTokenResponse,
   CardLocation,
+  CardType,
   CreateOnboardingConsentRequest,
   UserResponse,
   DelegationSettingsNetwork,
@@ -20,6 +21,8 @@ import {
   CashbackWithdrawEstimationResponse,
   CashbackWithdrawResponse,
 } from '../types';
+import { CARD_DETAILS_CSS } from '../hooks/useCardDetailsToken';
+import { PIN_CSS } from '../hooks/useCardPinToken';
 import Logger from '../../../../util/Logger';
 import { getCardBaanxToken } from '../util/cardTokenVault';
 import AppConstants from '../../../../core/AppConstants';
@@ -3986,12 +3989,7 @@ describe('CardSDK', () => {
         json: jest.fn().mockResolvedValue(mockTokenResponse),
       });
 
-      const customCss = {
-        cardBackgroundColor: '#FF5C16',
-        cardTextColor: '#FFFFFF',
-        panBackgroundColor: '#EFEFEF',
-        panTextColor: '#000000',
-      };
+      const customCss = CARD_DETAILS_CSS[CardType.VIRTUAL];
 
       // When: generateCardDetailsToken is called with custom CSS
       const result = await cardSDK.generateCardDetailsToken({ customCss });
@@ -4136,10 +4134,7 @@ describe('CardSDK', () => {
         json: jest.fn().mockResolvedValue(mockPinTokenResponse),
       });
 
-      const customCss = {
-        backgroundColor: '#FFFFFF',
-        textColor: '#000000',
-      };
+      const customCss = PIN_CSS.light;
 
       const result = await cardSDK.generateCardPinToken({ customCss });
 
diff --git a/app/components/UI/Card/sdk/index.test.tsx b/app/components/UI/Card/sdk/index.test.tsx
index d61312abfc48..ef2b6daa58a3 100644
--- a/app/components/UI/Card/sdk/index.test.tsx
+++ b/app/components/UI/Card/sdk/index.test.tsx
@@ -6,6 +6,7 @@ import {
   act,
 } from '@testing-library/react-native';
 import { useSelector } from 'react-redux';
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 import {
   CardSDKProvider,
   useCardSDK,
@@ -55,11 +56,10 @@ jest.mock('../../../../selectors/featureFlagController/card', () => ({
 }));
 
 jest.mock('../../../../core/redux/slices/card', () => ({
-  setAuthenticatedPriorityToken: jest.fn(),
-  setAuthenticatedPriorityTokenLastFetched: jest.fn(),
   setIsAuthenticatedCard: jest.fn(),
   selectUserCardLocation: jest.fn(),
   setUserCardLocation: jest.fn(),
+  setContactVerificationId: jest.fn(),
   selectOnboardingId: jest.fn(),
   resetOnboardingState: jest.fn(() => ({
     type: 'card/resetOnboardingState',
@@ -67,9 +67,6 @@ jest.mock('../../../../core/redux/slices/card', () => ({
   resetAuthenticatedData: jest.fn(() => ({
     type: 'card/resetAuthenticatedData',
   })),
-  clearAllCache: jest.fn(() => ({
-    type: 'card/clearAllCache',
-  })),
 }));
 
 jest.mock('../../../../selectors/multichainAccounts/accounts', () => ({
@@ -189,10 +186,20 @@ describe('CardSDK Context', () => {
     );
   };
 
-  // Helper: Create wrapper component
-  const createWrapper = ({ children }: { children: React.ReactNode }) => (
-    <CardSDKProvider>{children}</CardSDKProvider>
-  );
+  // Helper: Create wrapper component with QueryClientProvider
+  const createQueryClient = () =>
+    new QueryClient({
+      defaultOptions: { queries: { retry: false } },
+    });
+
+  const createWrapper = ({ children }: { children: React.ReactNode }) => {
+    const queryClient = createQueryClient();
+    return (
+      <QueryClientProvider client={queryClient}>
+        <CardSDKProvider>{children}</CardSDKProvider>
+      </QueryClientProvider>
+    );
+  };
 
   beforeEach(() => {
     jest.clearAllMocks();
@@ -221,12 +228,15 @@ describe('CardSDK Context', () => {
     it('initializes SDK when feature flag is available', () => {
       // Given: feature flag is configured
       setupMockUseSelector(mockCardFeatureFlag);
+      const queryClient = createQueryClient();
 
       // When: provider renders
       render(
-        <CardSDKProvider>
-          <View>Test Child</View>
-        </CardSDKProvider>,
+        <QueryClientProvider client={queryClient}>
+          <CardSDKProvider>
+            <View>Test Child</View>
+          </CardSDKProvider>
+        </QueryClientProvider>,
       );
 
       // Then: SDK should be created with feature flag
@@ -239,12 +249,15 @@ describe('CardSDK Context', () => {
     it('does not initialize SDK when feature flag is missing', () => {
       // Given: no feature flag
       setupMockUseSelector(null);
+      const queryClient = createQueryClient();
 
       // When: provider renders
       render(
-        <CardSDKProvider>
-          <View>Test Child</View>
-        </CardSDKProvider>,
+        <QueryClientProvider client={queryClient}>
+          <CardSDKProvider>
+            <View>Test Child</View>
+          </CardSDKProvider>
+        </QueryClientProvider>,
       );
 
       // Then: SDK should not be created
@@ -254,6 +267,7 @@ describe('CardSDK Context', () => {
     it('uses provided value prop when given', () => {
       // Given: a custom context value
       setupMockUseSelector(mockCardFeatureFlag);
+      const queryClient = createQueryClient();
       const providedValue: ICardSDK = {
         sdk: null,
         isLoading: false,
@@ -272,9 +286,11 @@ describe('CardSDK Context', () => {
       };
 
       render(
-        <CardSDKProvider value={providedValue}>
-          <TestComponent />
-        </CardSDKProvider>,
+        <QueryClientProvider client={queryClient}>
+          <CardSDKProvider value={providedValue}>
+            <TestComponent />
+          </CardSDKProvider>
+        </QueryClientProvider>,
       );
 
       // Then: custom value is used (assertion in TestComponent)
@@ -415,30 +431,6 @@ describe('CardSDK Context', () => {
       );
     });
 
-    it('dispatches clearAllCache action on logout', async () => {
-      // Given: SDK available
-      setupMockSDK();
-      setupMockUseSelector(mockCardFeatureFlag);
-
-      const { result } = renderHook(() => useCardSDK(), {
-        wrapper: createWrapper,
-      });
-
-      await waitFor(() => {
-        expect(result.current.isLoading).toBe(false);
-      });
-
-      // When: user logs out
-      await act(async () => {
-        await result.current.logoutFromProvider();
-      });
-
-      // Then: should dispatch clearAllCache
-      expect(mockDispatch).toHaveBeenCalledWith(
-        expect.objectContaining({ type: 'card/clearAllCache' }),
-      );
-    });
-
     it('dispatches resetOnboardingState action on logout', async () => {
       // Given: SDK available
       setupMockSDK();
@@ -508,9 +500,6 @@ describe('CardSDK Context', () => {
       expect(mockDispatch).toHaveBeenCalledWith(
         expect.objectContaining({ type: 'card/resetAuthenticatedData' }),
       );
-      expect(mockDispatch).toHaveBeenCalledWith(
-        expect.objectContaining({ type: 'card/clearAllCache' }),
-      );
       expect(mockDispatch).toHaveBeenCalledWith(
         expect.objectContaining({ type: 'card/resetOnboardingState' }),
       );
@@ -807,14 +796,13 @@ describe('CardSDK Context', () => {
 
       // Then: user data should be fetched and set
       await waitFor(() => {
-        expect(result.current.isLoading).toBe(false);
+        expect(result.current.user).toEqual(mockUserResponse);
       });
 
       expect(mockGetRegistrationStatus).toHaveBeenCalledWith(
         'test-onboarding-id',
         null,
       );
-      expect(result.current.user).toEqual(mockUserResponse);
     });
 
     it('does not fetch user data when SDK is not available', async () => {
@@ -1008,14 +996,13 @@ describe('CardSDK Context', () => {
       });
 
       await waitFor(() => {
-        expect(result.current.isLoading).toBe(false);
+        expect(result.current.user).toEqual(mockUserResponse);
       });
 
       expect(mockGetRegistrationStatus).toHaveBeenCalledWith(
         'existing-onboarding-id',
         null,
       );
-      expect(result.current.user).toEqual(mockUserResponse);
     });
 
     it('allows manual fetchUserData call regardless of initial onboardingId state', async () => {
diff --git a/app/components/UI/Card/sdk/index.tsx b/app/components/UI/Card/sdk/index.tsx
index e60b43e3d5be..4c24eb2f707c 100644
--- a/app/components/UI/Card/sdk/index.tsx
+++ b/app/components/UI/Card/sdk/index.tsx
@@ -7,6 +7,7 @@ import React, {
   useCallback,
 } from 'react';
 import { useDispatch, useSelector } from 'react-redux';
+import { useQueryClient } from '@tanstack/react-query';
 
 import Logger from '../../../../util/Logger';
 import { CardSDK } from './CardSDK';
@@ -21,10 +22,10 @@ import {
   selectOnboardingId,
   resetOnboardingState,
   resetAuthenticatedData,
-  clearAllCache,
   setContactVerificationId,
   setUserCardLocation,
 } from '../../../../core/redux/slices/card';
+import { cardQueries } from '../queries';
 import { UserResponse } from '../types';
 import { getErrorMessage } from '../util/getErrorMessage';
 import { mapCountryToLocation } from '../util/mapCountryToLocation';
@@ -61,6 +62,7 @@ export const CardSDKProvider = ({
   const userCardLocation = useSelector(selectUserCardLocation);
   const onboardingId = useSelector(selectOnboardingId);
   const dispatch = useDispatch();
+  const queryClient = useQueryClient();
   const [sdk, setSdk] = useState<CardSDK | null>(null);
   // Start with true to indicate initialization in progress
   const [isLoading, setIsLoading] = useState(true);
@@ -146,10 +148,10 @@ export const CardSDKProvider = ({
     }
 
     dispatch(resetAuthenticatedData());
-    dispatch(clearAllCache());
+    queryClient.removeQueries({ queryKey: cardQueries.keys.all() });
     dispatch(resetOnboardingState());
     setUser(null);
-  }, [sdk, dispatch]);
+  }, [sdk, dispatch, queryClient]);
 
   // Memoized context value to prevent unnecessary re-renders
   const contextValue = useMemo(
diff --git a/app/components/UI/Card/util/mapBaanxApiUrl.test.ts b/app/components/UI/Card/util/mapBaanxApiUrl.test.ts
index b545a6dcd34d..f652af76570f 100644
--- a/app/components/UI/Card/util/mapBaanxApiUrl.test.ts
+++ b/app/components/UI/Card/util/mapBaanxApiUrl.test.ts
@@ -3,8 +3,8 @@ import { getDefaultBaanxApiBaseUrlForMetaMaskEnv } from './mapBaanxApiUrl';
 
 describe('getDefaultBaanxApiBaseUrlForMetaMaskEnv', () => {
   const originalBaanxUrl = process.env.BAANX_API_URL;
-  const originalGitHubActions = process.env.GITHUB_ACTIONS;
-  const originalE2e = process.env.E2E;
+  const originalBuildsEnabled =
+    process.env.BUILDS_ENABLED_WITH_GH_ACTIONS_TEMPORARY;
 
   afterEach(() => {
     if (originalBaanxUrl !== undefined) {
@@ -12,22 +12,17 @@ describe('getDefaultBaanxApiBaseUrlForMetaMaskEnv', () => {
     } else {
       delete process.env.BAANX_API_URL;
     }
-    if (originalGitHubActions !== undefined) {
-      process.env.GITHUB_ACTIONS = originalGitHubActions;
+    if (originalBuildsEnabled !== undefined) {
+      process.env.BUILDS_ENABLED_WITH_GH_ACTIONS_TEMPORARY =
+        originalBuildsEnabled;
     } else {
-      delete process.env.GITHUB_ACTIONS;
-    }
-    if (originalE2e !== undefined) {
-      process.env.E2E = originalE2e;
-    } else {
-      delete process.env.E2E;
+      delete process.env.BUILDS_ENABLED_WITH_GH_ACTIONS_TEMPORARY;
     }
   });
 
-  describe('when GITHUB_ACTIONS (builds.yml path)', () => {
+  describe('when BUILDS_ENABLED_WITH_GH_ACTIONS_TEMPORARY (builds.yml path)', () => {
     beforeEach(() => {
-      process.env.GITHUB_ACTIONS = 'true';
-      delete process.env.E2E;
+      process.env.BUILDS_ENABLED_WITH_GH_ACTIONS_TEMPORARY = 'true';
     });
 
     it('returns BAANX_API_URL from environment when set', () => {
@@ -53,23 +48,11 @@ describe('getDefaultBaanxApiBaseUrlForMetaMaskEnv', () => {
       const result2 = getDefaultBaanxApiBaseUrlForMetaMaskEnv('production');
       expect(result1).toBe(result2);
     });
-
-    it('uses metaMaskEnv when E2E is true (E2E path)', () => {
-      process.env.GITHUB_ACTIONS = 'true';
-      process.env.E2E = 'true';
-      process.env.BAANX_API_URL = 'https://build-time.api';
-      expect(getDefaultBaanxApiBaseUrlForMetaMaskEnv('production')).toBe(
-        AppConstants.BAANX_API_URL.PRD,
-      );
-      expect(getDefaultBaanxApiBaseUrlForMetaMaskEnv('dev')).toBe(
-        AppConstants.BAANX_API_URL.DEV,
-      );
-    });
   });
 
-  describe('when not GITHUB_ACTIONS (Bitrise / .js.env path)', () => {
+  describe('when not BUILDS_ENABLED_WITH_GH_ACTIONS_TEMPORARY (Bitrise / .js.env path)', () => {
     beforeEach(() => {
-      delete process.env.GITHUB_ACTIONS;
+      delete process.env.BUILDS_ENABLED_WITH_GH_ACTIONS_TEMPORARY;
     });
 
     it('returns AppConstants.BAANX_API_URL.PRD for production/rc', () => {
diff --git a/app/components/UI/Card/util/mapBaanxApiUrl.ts b/app/components/UI/Card/util/mapBaanxApiUrl.ts
index dc4c0281e6f2..d9b177332baf 100644
--- a/app/components/UI/Card/util/mapBaanxApiUrl.ts
+++ b/app/components/UI/Card/util/mapBaanxApiUrl.ts
@@ -2,13 +2,13 @@ import AppConstants from '../../../../core/AppConstants';
 
 /**
  * Returns the Baanx API base URL for the given MetaMask environment.
- * When GITHUB_ACTIONS (and not E2E), uses process.env.BAANX_API_URL (set by builds.yml).
+ * When BUILDS_ENABLED_WITH_GH_ACTIONS_TEMPORARY (and not E2E), uses process.env.BAANX_API_URL (set by builds.yml).
  * When not (Bitrise / .js.env / E2E), uses AppConstants.BAANX_API_URL per env.
  */
 export const getDefaultBaanxApiBaseUrlForMetaMaskEnv = (
   metaMaskEnv: string | undefined,
 ): string => {
-  if (process.env.GITHUB_ACTIONS === 'true' && process.env.E2E !== 'true') {
+  if (process.env.BUILDS_ENABLED_WITH_GH_ACTIONS_TEMPORARY === 'true') {
     return process.env.BAANX_API_URL as string;
   }
   switch (metaMaskEnv) {
diff --git a/app/components/UI/Card/util/validateDateOfBirth.test.ts b/app/components/UI/Card/util/validateDateOfBirth.test.ts
index 118a349316bf..52351ba25ab1 100644
--- a/app/components/UI/Card/util/validateDateOfBirth.test.ts
+++ b/app/components/UI/Card/util/validateDateOfBirth.test.ts
@@ -1,8 +1,8 @@
 import { validateDateOfBirth, formatDateOfBirth } from './validateDateOfBirth';
 
 describe('validateDateOfBirth', () => {
-  // Mock Date.now() to ensure consistent test results
-  const mockCurrentDate = new Date('2024-01-15T10:00:00.000Z');
+  // Mock Date.now() to ensure consistent test results (local timezone)
+  const mockCurrentDate = new Date(2024, 0, 15);
 
   beforeEach(() => {
     jest.useFakeTimers();
@@ -15,8 +15,8 @@ describe('validateDateOfBirth', () => {
 
   describe('when validating age requirements', () => {
     it('returns true for person who is exactly 18 years old', () => {
-      // Given: date of birth exactly 18 years ago
-      const eighteenYearsAgo = new Date('2006-01-15T10:00:00.000Z');
+      // Given: date of birth exactly 18 years ago (local timezone)
+      const eighteenYearsAgo = new Date(2006, 0, 15);
       const timestamp = eighteenYearsAgo.getTime();
 
       // When: validating date of birth
@@ -27,8 +27,8 @@ describe('validateDateOfBirth', () => {
     });
 
     it('returns true for person who is older than 18', () => {
-      // Given: date of birth 25 years ago
-      const twentyFiveYearsAgo = new Date('1999-01-15T10:00:00.000Z');
+      // Given: date of birth 25 years ago (local timezone)
+      const twentyFiveYearsAgo = new Date(1999, 0, 15);
       const timestamp = twentyFiveYearsAgo.getTime();
 
       // When: validating date of birth
@@ -39,8 +39,8 @@ describe('validateDateOfBirth', () => {
     });
 
     it('returns false for person who is younger than 18', () => {
-      // Given: date of birth 17 years ago
-      const seventeenYearsAgo = new Date('2007-01-15T10:00:00.000Z');
+      // Given: date of birth 17 years ago (local timezone)
+      const seventeenYearsAgo = new Date(2007, 0, 15);
       const timestamp = seventeenYearsAgo.getTime();
 
       // When: validating date of birth
@@ -51,8 +51,8 @@ describe('validateDateOfBirth', () => {
     });
 
     it('returns false for person who turns 18 tomorrow', () => {
-      // Given: date of birth that makes person turn 18 tomorrow
-      const almostEighteen = new Date('2006-01-16T10:00:00.000Z');
+      // Given: date of birth that makes person turn 18 tomorrow (local timezone)
+      const almostEighteen = new Date(2006, 0, 16);
       const timestamp = almostEighteen.getTime();
 
       // When: validating date of birth
@@ -63,8 +63,8 @@ describe('validateDateOfBirth', () => {
     });
 
     it('returns true for person who turned 18 yesterday', () => {
-      // Given: date of birth that made person turn 18 yesterday
-      const justTurnedEighteen = new Date('2006-01-14T10:00:00.000Z');
+      // Given: date of birth that made person turn 18 yesterday (local timezone)
+      const justTurnedEighteen = new Date(2006, 0, 14);
       const timestamp = justTurnedEighteen.getTime();
 
       // When: validating date of birth
@@ -77,12 +77,12 @@ describe('validateDateOfBirth', () => {
 
   describe('when handling birthday edge cases', () => {
     it('correctly handles leap year birthdays', () => {
-      // Given: current date is March 1, 2024 (leap year)
-      const leapYearDate = new Date('2024-03-01T10:00:00.000Z');
+      // Given: current date is March 1, 2024 (leap year, local timezone)
+      const leapYearDate = new Date(2024, 2, 1);
       jest.setSystemTime(leapYearDate);
 
-      // And: person born on Feb 29, 2006 (18 years ago, leap year)
-      const leapYearBirthday = new Date('2006-02-29T10:00:00.000Z');
+      // And: person born on Feb 29, 2006 (18 years ago, leap year, local timezone)
+      const leapYearBirthday = new Date(2006, 1, 29);
       const timestamp = leapYearBirthday.getTime();
 
       // When: validating date of birth
@@ -93,12 +93,12 @@ describe('validateDateOfBirth', () => {
     });
 
     it('handles month boundary correctly when birthday has not occurred', () => {
-      // Given: current date is January 10, 2024
-      const currentDate = new Date('2024-01-10T10:00:00.000Z');
+      // Given: current date is January 10, 2024 (local timezone)
+      const currentDate = new Date(2024, 0, 10);
       jest.setSystemTime(currentDate);
 
-      // And: person born on January 15, 2006 (birthday later this month)
-      const birthdayLaterThisMonth = new Date('2006-01-15T10:00:00.000Z');
+      // And: person born on January 15, 2006 (birthday later this month, local timezone)
+      const birthdayLaterThisMonth = new Date(2006, 0, 15);
       const timestamp = birthdayLaterThisMonth.getTime();
 
       // When: validating date of birth
@@ -109,12 +109,12 @@ describe('validateDateOfBirth', () => {
     });
 
     it('handles year boundary correctly', () => {
-      // Given: current date is January 1, 2024
-      const newYearDate = new Date('2024-01-01T10:00:00.000Z');
+      // Given: current date is January 1, 2024 (local timezone)
+      const newYearDate = new Date(2024, 0, 1);
       jest.setSystemTime(newYearDate);
 
-      // And: person born on December 31, 2005 (18 years and 1 day old)
-      const lastYearBirthday = new Date('2005-12-31T10:00:00.000Z');
+      // And: person born on December 31, 2005 (18 years and 1 day old, local timezone)
+      const lastYearBirthday = new Date(2005, 11, 31);
       const timestamp = lastYearBirthday.getTime();
 
       // When: validating date of birth
@@ -127,9 +127,9 @@ describe('validateDateOfBirth', () => {
 
   describe('when handling dates before 1970 (negative timestamps)', () => {
     it('returns true for person born in 1959 (negative timestamp)', () => {
-      // Given: date of birth on September 16, 1959
-      const dateIn1959 = new Date('1959-09-16T00:00:00.000Z');
-      const timestamp = dateIn1959.getTime(); // This will be negative
+      // Given: date of birth on September 16, 1959 (local timezone)
+      const dateIn1959 = new Date(1959, 8, 16);
+      const timestamp = dateIn1959.getTime(); // This will be negative in some timezones
 
       // When: validating date of birth
       const result = validateDateOfBirth(timestamp);
@@ -139,9 +139,9 @@ describe('validateDateOfBirth', () => {
     });
 
     it('returns true for person born in 1950', () => {
-      // Given: date of birth in 1950
-      const dateIn1950 = new Date('1950-06-15T00:00:00.000Z');
-      const timestamp = dateIn1950.getTime(); // This will be negative
+      // Given: date of birth in 1950 (local timezone)
+      const dateIn1950 = new Date(1950, 5, 15);
+      const timestamp = dateIn1950.getTime(); // This will be negative in some timezones
 
       // When: validating date of birth
       const result = validateDateOfBirth(timestamp);
@@ -151,9 +151,9 @@ describe('validateDateOfBirth', () => {
     });
 
     it('returns true for person born on January 1, 1900', () => {
-      // Given: very old date of birth
-      const veryOldDate = new Date('1900-01-01T00:00:00.000Z');
-      const timestamp = veryOldDate.getTime(); // This will be very negative
+      // Given: very old date of birth (local timezone)
+      const veryOldDate = new Date(1900, 0, 1);
+      const timestamp = veryOldDate.getTime(); // This will be very negative in some timezones
 
       // When: validating date of birth
       const result = validateDateOfBirth(timestamp);
@@ -189,8 +189,8 @@ describe('validateDateOfBirth', () => {
     });
 
     it('returns false for future date', () => {
-      // Given: date in the future
-      const futureDate = new Date('2025-01-15T10:00:00.000Z');
+      // Given: date in the future (local timezone)
+      const futureDate = new Date(2025, 0, 15);
       const timestamp = futureDate.getTime();
 
       // When: validating future date
@@ -205,8 +205,8 @@ describe('validateDateOfBirth', () => {
 describe('formatDateOfBirth', () => {
   describe('when formatting valid timestamps', () => {
     it('formats valid timestamp string to YYYY-MM-DD', () => {
-      // Given: valid timestamp string
-      const date = new Date('2006-01-15T10:30:45.123Z');
+      // Given: date created in local timezone (Jan 15, 2006)
+      const date = new Date(2006, 0, 15);
       const timestampString = date.getTime().toString();
 
       // When: formatting timestamp
@@ -216,20 +216,9 @@ describe('formatDateOfBirth', () => {
       expect(result).toBe('2006-01-15');
     });
 
-    it('formats timestamp with different time zones correctly', () => {
-      // Given: timestamp for a specific UTC date
-      const timestampString = '1137312000000'; // 2006-01-15T00:00:00.000Z
-
-      // When: formatting timestamp
-      const result = formatDateOfBirth(timestampString);
-
-      // Then: should return correct date regardless of timezone
-      expect(result).toBe('2006-01-15');
-    });
-
     it('handles leap year dates correctly', () => {
-      // Given: leap year date timestamp
-      const leapYearDate = new Date('2004-02-29T12:00:00.000Z');
+      // Given: leap year date created in local timezone (Feb 29, 2004)
+      const leapYearDate = new Date(2004, 1, 29);
       const timestampString = leapYearDate.getTime().toString();
 
       // When: formatting timestamp
@@ -300,8 +289,8 @@ describe('formatDateOfBirth', () => {
 
   describe('when handling edge cases', () => {
     it('formats very old dates correctly', () => {
-      // Given: very old date (year 1900)
-      const oldDate = new Date('1900-01-01T00:00:00.000Z');
+      // Given: very old date (year 1900) created in local timezone
+      const oldDate = new Date(1900, 0, 1);
       const timestampString = oldDate.getTime().toString();
 
       // When: formatting timestamp
@@ -336,8 +325,8 @@ describe('formatDateOfBirth', () => {
     });
 
     it('formats recent dates correctly', () => {
-      // Given: recent date
-      const recentDate = new Date('2023-12-31T23:59:59.999Z');
+      // Given: date created in local timezone (matching PersonalDetails.tsx parsing)
+      const recentDate = new Date(2023, 11, 31);
       const timestampString = recentDate.getTime().toString();
 
       // When: formatting timestamp
@@ -348,8 +337,9 @@ describe('formatDateOfBirth', () => {
     });
 
     it('handles zero timestamp correctly', () => {
-      // Given: zero timestamp (Unix epoch)
-      const timestampString = '0';
+      // Given: epoch date created in local timezone
+      const epochLocal = new Date(1970, 0, 1);
+      const timestampString = epochLocal.getTime().toString();
 
       // When: formatting timestamp
       const result = formatDateOfBirth(timestampString);
diff --git a/app/components/UI/Card/util/validateDateOfBirth.ts b/app/components/UI/Card/util/validateDateOfBirth.ts
index c1b366b5b522..8765b4fdfed0 100644
--- a/app/components/UI/Card/util/validateDateOfBirth.ts
+++ b/app/components/UI/Card/util/validateDateOfBirth.ts
@@ -50,5 +50,8 @@ export const formatDateOfBirth = (timestamp: string): string => {
   if (isNaN(date.getTime())) {
     return '';
   }
-  return date.toISOString().split('T')[0]; // Returns YYYY-MM-DD format
+  const year = date.getFullYear();
+  const month = String(date.getMonth() + 1).padStart(2, '0');
+  const day = String(date.getDate()).padStart(2, '0');
+  return `${year}-${month}-${day}`;
 };
diff --git a/app/components/UI/Charts/AdvancedChart/AdvancedChart.styles.ts b/app/components/UI/Charts/AdvancedChart/AdvancedChart.styles.ts
new file mode 100644
index 000000000000..c918d14a988b
--- /dev/null
+++ b/app/components/UI/Charts/AdvancedChart/AdvancedChart.styles.ts
@@ -0,0 +1,44 @@
+import { StyleSheet } from 'react-native';
+import type { Theme } from '../../../../util/theme/models';
+
+export const DEFAULT_CHART_HEIGHT = 400;
+
+const styleSheet = (params: { theme: Theme; vars: { height: number } }) =>
+  StyleSheet.create({
+    container: {
+      width: '100%',
+      height: params.vars.height,
+      backgroundColor: params.theme.colors.background.default,
+    },
+    webview: {
+      flex: 1,
+      backgroundColor: params.theme.colors.background.default,
+    },
+    loadingContainer: {
+      position: 'absolute',
+      top: 0,
+      left: 0,
+      right: 0,
+      bottom: 0,
+      justifyContent: 'center',
+      alignItems: 'center',
+      backgroundColor: params.theme.colors.background.default,
+    },
+    loadingText: {
+      marginTop: 12,
+      color: params.theme.colors.text.muted,
+    },
+    errorContainer: {
+      flex: 1,
+      justifyContent: 'center',
+      alignItems: 'center',
+      padding: 20,
+      backgroundColor: params.theme.colors.background.default,
+    },
+    errorText: {
+      color: params.theme.colors.error.default,
+      textAlign: 'center',
+    },
+  });
+
+export default styleSheet;
diff --git a/app/components/UI/Charts/AdvancedChart/AdvancedChart.tsx b/app/components/UI/Charts/AdvancedChart/AdvancedChart.tsx
new file mode 100644
index 000000000000..54af667d48d6
--- /dev/null
+++ b/app/components/UI/Charts/AdvancedChart/AdvancedChart.tsx
@@ -0,0 +1,366 @@
+import React, {
+  useCallback,
+  useEffect,
+  useImperativeHandle,
+  useMemo,
+  useRef,
+  useState,
+  forwardRef,
+} from 'react';
+import { View, ActivityIndicator } from 'react-native';
+import { WebView, WebViewMessageEvent } from '@metamask/react-native-webview';
+import { Text, TextVariant } from '@metamask/design-system-react-native';
+import { useStyles } from '../../../../component-library/hooks';
+import styleSheet, { DEFAULT_CHART_HEIGHT } from './AdvancedChart.styles';
+import {
+  createAdvancedChartTemplate,
+  CHARTING_LIBRARY_BASE_URL,
+} from './AdvancedChartTemplate';
+import {
+  ChartType,
+  DEFAULT_DISABLED_FEATURES,
+  parseWebViewMessage,
+  type AdvancedChartProps,
+  type AdvancedChartRef,
+  type IndicatorType,
+  type OHLCVBar,
+  type RNToWebViewMessage,
+} from './AdvancedChart.types';
+
+/**
+ * Generic TradingView Advanced Chart component.
+ *
+ * Renders a professional charting widget inside a WebView.
+ * Designed to be consumed by multiple features (Token Details, Perps, etc.)
+ * with a composable props API -- each consumer uses only the props it needs.
+ *
+ * ATTRIBUTION NOTICE:
+ * TradingView Advanced Charts (TM)
+ * Copyright (c) 2025 TradingView, Inc. https://www.tradingview.com/
+ */
+const AdvancedChart = forwardRef<AdvancedChartRef, AdvancedChartProps>(
+  (
+    {
+      ohlcvData,
+      height = DEFAULT_CHART_HEIGHT,
+      realtimeBar,
+      onRequestMoreHistory,
+      indicators = [],
+      positionLines,
+      chartType,
+      showVolume = false,
+      enableDrawingTools = false,
+      disabledFeatures = DEFAULT_DISABLED_FEATURES,
+      onChartReady,
+      onError,
+      onCrosshairMove,
+      isLoading = false,
+    },
+    ref,
+  ) => {
+    const { styles, theme } = useStyles(styleSheet, {
+      height,
+    } as { height: number });
+    const webViewRef = useRef<WebView>(null);
+    const [chartReadyCount, setChartReadyCount] = useState(0);
+    const isChartReady = chartReadyCount > 0;
+    const [webViewError, setWebViewError] = useState<string | null>(null);
+
+    const activeIndicatorsRef = useRef<Set<IndicatorType>>(new Set());
+    const [webViewLoaded, setWebViewLoaded] = useState(false);
+    const prevPositionLinesRef = useRef(positionLines);
+    const prevChartTypeRef = useRef(chartType);
+    const prevShowVolumeRef = useRef(showVolume);
+
+    const htmlContent = useMemo(
+      () =>
+        createAdvancedChartTemplate(theme, {
+          enableDrawingTools,
+          showVolume,
+          disabledFeatures,
+        }),
+      [theme, enableDrawingTools, showVolume, disabledFeatures],
+    );
+
+    // Reset all chart state when the WebView reloads due to htmlContent changes
+    useEffect(() => {
+      setChartReadyCount(0);
+      setWebViewLoaded(false);
+      activeIndicatorsRef.current.clear();
+      prevPositionLinesRef.current = undefined;
+      prevChartTypeRef.current = undefined;
+      prevShowVolumeRef.current = showVolume;
+    }, [htmlContent]); // eslint-disable-line react-hooks/exhaustive-deps
+
+    // ---- Helpers ----
+
+    const postMessage = useCallback((message: RNToWebViewMessage) => {
+      if (webViewRef.current) {
+        webViewRef.current.postMessage(JSON.stringify(message));
+      }
+    }, []);
+
+    const sendOHLCVData = useCallback(
+      (data: OHLCVBar[]) => {
+        postMessage({
+          type: 'SET_OHLCV_DATA',
+          payload: { data },
+        });
+      },
+      [postMessage],
+    );
+
+    const addIndicator = useCallback(
+      (indicator: IndicatorType, inputs?: Record<string, unknown>) => {
+        if (!isChartReady) return;
+        postMessage({
+          type: 'ADD_INDICATOR',
+          payload: { name: indicator, inputs },
+        });
+      },
+      [isChartReady, postMessage],
+    );
+
+    const removeIndicator = useCallback(
+      (indicator: IndicatorType) => {
+        if (!isChartReady) return;
+        postMessage({
+          type: 'REMOVE_INDICATOR',
+          payload: { name: indicator },
+        });
+      },
+      [isChartReady, postMessage],
+    );
+
+    const setChartTypeInternal = useCallback(
+      (type: ChartType) => {
+        if (!isChartReady) return;
+        postMessage({
+          type: 'SET_CHART_TYPE',
+          payload: { type },
+        });
+      },
+      [isChartReady, postMessage],
+    );
+
+    // ---- WebView message handling ----
+
+    const handleMessage = useCallback(
+      (event: WebViewMessageEvent) => {
+        let raw;
+        try {
+          raw = JSON.parse(event.nativeEvent.data);
+        } catch {
+          return;
+        }
+
+        const message = parseWebViewMessage(raw);
+        if (!message) return;
+
+        switch (message.type) {
+          case 'CHART_READY':
+            activeIndicatorsRef.current.clear();
+            prevPositionLinesRef.current = undefined;
+            prevChartTypeRef.current = undefined;
+            prevShowVolumeRef.current = showVolume;
+            setChartReadyCount((c) => c + 1);
+            setWebViewError(null);
+            onChartReady?.();
+            break;
+
+          case 'INDICATOR_ADDED':
+            activeIndicatorsRef.current.add(message.payload.name);
+            break;
+
+          case 'INDICATOR_REMOVED':
+            activeIndicatorsRef.current.delete(message.payload.name);
+            break;
+
+          case 'CROSSHAIR_MOVE':
+            onCrosshairMove?.(message.payload.data);
+            break;
+
+          case 'NEED_MORE_HISTORY':
+            onRequestMoreHistory?.(message.payload);
+            break;
+
+          case 'ERROR':
+            if (!isChartReady) {
+              setWebViewError(message.payload.message);
+            }
+            onError?.(message.payload.message);
+            break;
+
+          case 'DEBUG':
+            break;
+
+          default:
+            break;
+        }
+      },
+      [
+        isChartReady,
+        showVolume,
+        onChartReady,
+        onError,
+        onCrosshairMove,
+        onRequestMoreHistory,
+      ],
+    );
+
+    const handleWebViewError = useCallback(
+      (syntheticEvent: { nativeEvent: { description: string } }) => {
+        const { description } = syntheticEvent.nativeEvent;
+        setWebViewError(description);
+        onError?.(description);
+      },
+      [onError],
+    );
+
+    const handleLoadEnd = useCallback(() => {
+      setWebViewLoaded(true);
+    }, []);
+
+    // ---- Ref API ----
+
+    useImperativeHandle(
+      ref,
+      () => ({
+        addIndicator,
+        removeIndicator,
+        setChartType: setChartTypeInternal,
+        reset: () => {
+          setChartReadyCount(0);
+          setWebViewLoaded(false);
+          setWebViewError(null);
+          activeIndicatorsRef.current.clear();
+          prevPositionLinesRef.current = undefined;
+          prevChartTypeRef.current = undefined;
+          prevShowVolumeRef.current = showVolume;
+          webViewRef.current?.reload();
+        },
+      }),
+      [addIndicator, removeIndicator, setChartTypeInternal, showVolume],
+    );
+
+    // ---- Declarative prop syncing ----
+
+    useEffect(() => {
+      if (ohlcvData.length > 0 && webViewLoaded) {
+        sendOHLCVData(ohlcvData);
+      }
+    }, [ohlcvData, webViewLoaded, sendOHLCVData]);
+
+    // Forward real-time bar updates to WebView
+    useEffect(() => {
+      if (!isChartReady || !realtimeBar) return;
+      postMessage({
+        type: 'REALTIME_UPDATE',
+        payload: { bar: realtimeBar },
+      });
+    }, [realtimeBar, isChartReady, postMessage]);
+
+    // Sync indicators prop (depends on chartReadyCount to re-fire on chart recreation)
+    useEffect(() => {
+      if (chartReadyCount === 0) return;
+
+      const currentIndicators = new Set(indicators);
+      const active = activeIndicatorsRef.current;
+
+      indicators.forEach((indicator) => {
+        if (!active.has(indicator)) {
+          addIndicator(indicator);
+        }
+      });
+
+      active.forEach((indicator) => {
+        if (!currentIndicators.has(indicator)) {
+          removeIndicator(indicator);
+        }
+      });
+    }, [indicators, chartReadyCount, addIndicator, removeIndicator]);
+
+    // Sync positionLines prop
+    useEffect(() => {
+      if (chartReadyCount === 0) return;
+      if (positionLines === prevPositionLinesRef.current) return;
+      prevPositionLinesRef.current = positionLines;
+
+      postMessage({
+        type: 'SET_POSITION_LINES',
+        payload: { position: positionLines ?? null },
+      });
+    }, [positionLines, chartReadyCount, postMessage]);
+
+    // Sync chartType prop
+    useEffect(() => {
+      if (chartReadyCount === 0 || chartType === undefined) return;
+      if (chartType === prevChartTypeRef.current) return;
+      prevChartTypeRef.current = chartType;
+      setChartTypeInternal(chartType);
+    }, [chartType, chartReadyCount, setChartTypeInternal]);
+
+    // Sync showVolume prop
+    useEffect(() => {
+      if (chartReadyCount === 0) return;
+      if (showVolume === prevShowVolumeRef.current) return;
+      prevShowVolumeRef.current = showVolume;
+
+      postMessage({
+        type: 'TOGGLE_VOLUME',
+        payload: { visible: showVolume },
+      });
+    }, [showVolume, chartReadyCount, postMessage]);
+
+    // ---- Render ----
+
+    if (webViewError) {
+      return (
+        <View style={styles.errorContainer}>
+          <Text variant={TextVariant.BodyMd} style={styles.errorText}>
+            Failed to load chart: {webViewError}
+          </Text>
+        </View>
+      );
+    }
+
+    return (
+      <View style={styles.container}>
+        <WebView
+          ref={webViewRef}
+          source={{ html: htmlContent, baseUrl: CHARTING_LIBRARY_BASE_URL }}
+          style={styles.webview}
+          onMessage={handleMessage}
+          onError={handleWebViewError}
+          onLoadEnd={handleLoadEnd}
+          originWhitelist={['*']}
+          javaScriptEnabled
+          domStorageEnabled
+          scrollEnabled={false}
+          bounces={false}
+          showsHorizontalScrollIndicator={false}
+          showsVerticalScrollIndicator={false}
+          allowsInlineMediaPlayback
+          androidLayerType="hardware"
+          mixedContentMode="always"
+        />
+
+        {(isLoading || !isChartReady) && (
+          <View style={styles.loadingContainer}>
+            <ActivityIndicator
+              size="large"
+              color={theme.colors.primary.default}
+            />
+            <Text variant={TextVariant.BodySm} style={styles.loadingText}>
+              Loading chart...
+            </Text>
+          </View>
+        )}
+      </View>
+    );
+  },
+);
+
+AdvancedChart.displayName = 'AdvancedChart';
+
+export default AdvancedChart;
diff --git a/app/components/UI/Charts/AdvancedChart/AdvancedChart.types.ts b/app/components/UI/Charts/AdvancedChart/AdvancedChart.types.ts
new file mode 100644
index 000000000000..8dbfc56bf470
--- /dev/null
+++ b/app/components/UI/Charts/AdvancedChart/AdvancedChart.types.ts
@@ -0,0 +1,352 @@
+// ============================================
+// OHLCV data types
+// ============================================
+
+/**
+ * OHLCV bar data structure for TradingView Advanced Charts
+ */
+export interface OHLCVBar {
+  /** Unix timestamp in milliseconds */
+  time: number;
+  /** Opening price */
+  open: number;
+  /** Highest price */
+  high: number;
+  /** Lowest price */
+  low: number;
+  /** Closing price */
+  close: number;
+  /** Trading volume */
+  volume: number;
+}
+
+/**
+ * Any TradingView study name is accepted. The three presets ('MACD', 'RSI',
+ * 'MA200') get built-in parameter defaults in chartLogic.js; all other strings
+ * are forwarded to `createStudy` as-is with optional `inputs` from the payload.
+ */
+export type IndicatorType = string;
+
+/**
+ * TradingView widget features disabled by default.
+ *
+ * These defaults are optimized for the Token Details mobile UX: a clean,
+ * minimal chart with no header chrome, search, or toolbars. Consumers
+ * needing TradingView's native UI (e.g. Perps with full indicator picker,
+ * timeframes toolbar, or symbol search) can pass a custom list via the
+ * `disabledFeatures` prop to opt back in selectively.
+ */
+export const DEFAULT_DISABLED_FEATURES: string[] = [
+  'use_localstorage_for_settings',
+  'header_widget',
+  'timeframes_toolbar',
+  'edit_buttons_in_legend',
+  'control_bar',
+  'border_around_the_chart',
+  'header_symbol_search',
+  'header_settings',
+  'header_compare',
+  'header_undo_redo',
+  'header_screenshot',
+  'header_fullscreen_button',
+  'legend_context_menu',
+  'symbol_search_hot_key',
+  'symbol_info',
+  'legend_widget',
+  'display_market_status',
+  'scales_context_menu',
+  'pane_context_menu',
+  'create_volume_indicator_by_default',
+  'main_series_scale_menu',
+  'go_to_date',
+];
+
+/**
+ * Position side for long/short position shapes
+ */
+export type PositionSide = 'long' | 'short';
+
+/**
+ * Position lines to render on the chart (Perps-style dashed horizontal lines).
+ * Only lines with defined values are rendered.
+ */
+export interface PositionLines {
+  side: PositionSide;
+  entryPrice: number;
+  currentPrice?: number;
+  takeProfitPrice?: number;
+  stopLossPrice?: number;
+  liquidationPrice?: number;
+}
+
+/**
+ * Crosshair OHLC data forwarded from the WebView when the user
+ * scrubs over the chart. Mirrors the Perps OhlcData contract.
+ */
+export interface CrosshairData {
+  time: number;
+  open: number;
+  high: number;
+  low: number;
+  close: number;
+  volume?: number;
+}
+
+/**
+ * Chart type constants matching TradingView SeriesType.
+ * Uses as-const object instead of enum to avoid numeric enum pitfalls
+ * (reverse lookups, runtime code, opaque values in bridge messages).
+ */
+export const ChartType = {
+  Candles: 1,
+  Line: 2,
+} as const;
+
+export type ChartType = (typeof ChartType)[keyof typeof ChartType];
+
+// ============================================
+// Message protocol: React Native <-> WebView
+// ============================================
+
+export type RNToWebViewMessageType =
+  | 'SET_OHLCV_DATA'
+  | 'ADD_INDICATOR'
+  | 'REMOVE_INDICATOR'
+  | 'SET_CHART_TYPE'
+  | 'SET_POSITION_LINES'
+  | 'REALTIME_UPDATE'
+  | 'TOGGLE_VOLUME';
+
+export type WebViewToRNMessageType =
+  | 'CHART_READY'
+  | 'INDICATOR_ADDED'
+  | 'INDICATOR_REMOVED'
+  | 'CROSSHAIR_MOVE'
+  | 'NEED_MORE_HISTORY'
+  | 'ERROR'
+  | 'DEBUG';
+
+export interface SetOHLCVDataPayload {
+  data: OHLCVBar[];
+}
+
+export interface AddIndicatorPayload {
+  name: IndicatorType;
+  /** Custom TradingView study inputs (e.g. { in_0: 14 }). Used for non-preset studies. */
+  inputs?: Record<string, unknown>;
+}
+
+export interface RemoveIndicatorPayload {
+  name: IndicatorType;
+}
+
+export interface SetChartTypePayload {
+  type: ChartType;
+}
+
+export interface SetPositionLinesPayload {
+  position: PositionLines | null;
+}
+
+export interface RealtimeUpdatePayload {
+  bar: OHLCVBar;
+}
+
+export interface ToggleVolumePayload {
+  visible: boolean;
+}
+
+export type RNToWebViewMessage =
+  | { type: 'SET_OHLCV_DATA'; payload: SetOHLCVDataPayload }
+  | { type: 'ADD_INDICATOR'; payload: AddIndicatorPayload }
+  | { type: 'REMOVE_INDICATOR'; payload: RemoveIndicatorPayload }
+  | { type: 'SET_CHART_TYPE'; payload: SetChartTypePayload }
+  | { type: 'SET_POSITION_LINES'; payload: SetPositionLinesPayload }
+  | { type: 'REALTIME_UPDATE'; payload: RealtimeUpdatePayload }
+  | { type: 'TOGGLE_VOLUME'; payload: ToggleVolumePayload };
+
+export interface IndicatorAddedPayload {
+  name: IndicatorType;
+  id: string;
+}
+
+export interface IndicatorRemovedPayload {
+  name: IndicatorType;
+}
+
+export interface CrosshairMovePayload {
+  data: CrosshairData | null;
+}
+
+export interface NeedMoreHistoryPayload {
+  oldestTimestamp: number;
+}
+
+export interface ErrorPayload {
+  message: string;
+  code?: string;
+}
+
+export type WebViewToRNMessage =
+  | { type: 'CHART_READY' }
+  | { type: 'INDICATOR_ADDED'; payload: IndicatorAddedPayload }
+  | { type: 'INDICATOR_REMOVED'; payload: IndicatorRemovedPayload }
+  | { type: 'CROSSHAIR_MOVE'; payload: CrosshairMovePayload }
+  | { type: 'NEED_MORE_HISTORY'; payload: NeedMoreHistoryPayload }
+  | { type: 'ERROR'; payload: ErrorPayload }
+  | { type: 'DEBUG' };
+
+// ============================================
+// Message parsing / runtime narrowing
+// ============================================
+
+function isIndicatorType(value: unknown): value is IndicatorType {
+  return typeof value === 'string' && value.length > 0;
+}
+
+/**
+ * Runtime narrower for messages arriving from the WebView over postMessage.
+ * Returns a typed WebViewToRNMessage if valid, or null for malformed data.
+ */
+export function parseWebViewMessage(raw: unknown): WebViewToRNMessage | null {
+  if (typeof raw !== 'object' || raw === null) return null;
+
+  const { type, payload } = raw as { type: unknown; payload: unknown };
+  if (typeof type !== 'string') return null;
+
+  const obj = (
+    typeof payload === 'object' && payload !== null ? payload : {}
+  ) as Record<string, unknown>;
+
+  switch (type) {
+    case 'CHART_READY':
+    case 'DEBUG':
+      return { type };
+
+    case 'NEED_MORE_HISTORY':
+      return {
+        type,
+        payload: {
+          oldestTimestamp:
+            typeof obj.oldestTimestamp === 'number' ? obj.oldestTimestamp : 0,
+        },
+      };
+
+    case 'INDICATOR_ADDED':
+      if (isIndicatorType(obj.name) && typeof obj.id === 'string') {
+        return { type, payload: { name: obj.name, id: obj.id } };
+      }
+      return null;
+
+    case 'INDICATOR_REMOVED':
+      if (isIndicatorType(obj.name)) {
+        return { type, payload: { name: obj.name } };
+      }
+      return null;
+
+    case 'CROSSHAIR_MOVE':
+      return {
+        type,
+        payload: {
+          data:
+            typeof obj.data === 'object' && obj.data !== null
+              ? (obj.data as CrosshairData)
+              : null,
+        },
+      };
+
+    case 'ERROR':
+      if (typeof obj.message === 'string') {
+        return {
+          type,
+          payload: {
+            message: obj.message,
+            ...(typeof obj.code === 'string' ? { code: obj.code } : {}),
+          },
+        };
+      }
+      return null;
+
+    default:
+      return null;
+  }
+}
+
+// ============================================
+// Component props and ref
+// ============================================
+
+/**
+ * Generic AdvancedChart component props.
+ *
+ * Composable API: each consumer uses only the props it needs.
+ * - Token Details: ohlcvData, indicators, chartType
+ * - Perps: ohlcvData, positionLines, onRequestMoreHistory, onRealtimeUpdate, onCrosshairMove
+ */
+export interface AdvancedChartProps {
+  /** OHLCV data to display (required) */
+  ohlcvData: OHLCVBar[];
+  /** Chart height in pixels */
+  height?: number;
+
+  /** Latest bar for real-time streaming (Perps). When this changes the WebView receives a tick. */
+  realtimeBar?: OHLCVBar;
+  /**
+   * Called when the user scrolls to the left edge and more history is needed.
+   * Receives the oldest bar timestamp (ms) currently held by the chart so
+   * consumers can use it directly as the `endTime` for their next fetch,
+   * without having to independently track their own oldest candle.
+   */
+  onRequestMoreHistory?: (params: { oldestTimestamp: number }) => void;
+
+  /** Active indicators to display (Token Details). Synced declaratively via useEffect. */
+  indicators?: IndicatorType[];
+  /** Position lines to overlay (Perps). Set to undefined to clear. */
+  positionLines?: PositionLines;
+
+  /** Initial chart type */
+  chartType?: ChartType;
+  /** Show volume bars below the chart */
+  showVolume?: boolean;
+  /** Enable left-side drawing toolbar */
+  enableDrawingTools?: boolean;
+  /**
+   * TradingView widget features to disable. Defaults to DEFAULT_DISABLED_FEATURES
+   * (a curated mobile-friendly set). Pass a custom array to re-enable native
+   * TradingView capabilities like header_widget, timeframes_toolbar, etc.
+   */
+  disabledFeatures?: string[];
+
+  /** Callback when chart is ready */
+  onChartReady?: () => void;
+  /** Callback when an error occurs */
+  onError?: (error: string) => void;
+  /** Crosshair OHLC data callback (for overlay legend) */
+  onCrosshairMove?: (data: CrosshairData | null) => void;
+
+  /** External loading state */
+  isLoading?: boolean;
+}
+
+/**
+ * Imperative ref handle for AdvancedChart.
+ * Use props for declarative control; ref for one-off imperative actions.
+ */
+export interface AdvancedChartRef {
+  addIndicator: (
+    indicator: IndicatorType,
+    inputs?: Record<string, unknown>,
+  ) => void;
+  removeIndicator: (indicator: IndicatorType) => void;
+  setChartType: (chartType: ChartType) => void;
+  reset: () => void;
+}
+
+/**
+ * Props for the IndicatorToggle component
+ */
+export interface IndicatorToggleProps {
+  activeIndicators: IndicatorType[];
+  onToggle: (indicator: IndicatorType) => void;
+  disabled?: boolean;
+}
diff --git a/app/components/UI/Charts/AdvancedChart/AdvancedChartTemplate.ts b/app/components/UI/Charts/AdvancedChart/AdvancedChartTemplate.ts
new file mode 100644
index 000000000000..677b408797e0
--- /dev/null
+++ b/app/components/UI/Charts/AdvancedChart/AdvancedChartTemplate.ts
@@ -0,0 +1,136 @@
+import type { Theme } from '../../../../util/theme/models';
+import { chartLogicScript } from './webview';
+
+/**
+ * CDN base URL for the TradingView charting library assets.
+ *
+ * Production: set MM_CHARTING_LIBRARY_URL to the CloudFront distribution URL
+ * (trailing slash required). Defaults to the S3 origin until the CloudFront
+ * distribution is delivered by DevOps.
+ *
+ * Local development: override MM_CHARTING_LIBRARY_URL with a local http-server
+ * URL (e.g. http://localhost:8000/) and run:
+ * npx http-server --cors -p 8000 <dir-containing-charting_library/>
+ */
+export const CHARTING_LIBRARY_BASE_URL =
+  process.env.MM_CHARTING_LIBRARY_URL ?? '';
+
+const CHARTING_LIBRARY_URL = `${CHARTING_LIBRARY_BASE_URL}charting_library/`;
+
+/**
+ * Scheme + host only (no path) for use in CSP frame-src.
+ * TradingView's iframe_loading_same_origin feature loads sameorigin.html from
+ * this origin, so frame-src must allow it explicitly.
+ * e.g. "https://va-mmcx-terminal.s3.us-east-2.amazonaws.com"
+ */
+const CHARTING_LIBRARY_ORIGIN = (() => {
+  try {
+    const { origin } = new URL(CHARTING_LIBRARY_BASE_URL);
+    return origin;
+  } catch {
+    return CHARTING_LIBRARY_BASE_URL;
+  }
+})();
+
+/**
+ * Strip the alpha channel from a hex color string.
+ * Design tokens may use 9-char hex (#RRGGBBAA); TradingView expects #RRGGBB.
+ */
+const stripHexAlpha = (hex: string): string =>
+  hex.length === 9 && hex.startsWith('#') ? hex.slice(0, 7) : hex;
+
+interface ChartFeatures {
+  enableDrawingTools?: boolean;
+  showVolume?: boolean;
+  disabledFeatures?: string[];
+}
+
+const createConfigScript = (
+  libraryUrl: string,
+  theme: Theme,
+  features: ChartFeatures,
+): string => `
+window.CONFIG = {
+  libraryUrl: '${libraryUrl}',
+  theme: {
+    backgroundColor: '${theme.colors.background.default}',
+    borderColor: '${stripHexAlpha(theme.colors.border.muted)}',
+    textColor: '${theme.colors.text.alternative}',
+    successColor: '${theme.colors.success.default}',
+    errorColor: '${theme.colors.error.default}',
+    primaryColor: '${theme.colors.primary.default}'
+  },
+  features: {
+    enableDrawingTools: ${features.enableDrawingTools ? 'true' : 'false'},
+    showVolume: ${features.showVolume ? 'true' : 'false'},
+    disabledFeatures: ${JSON.stringify(features.disabledFeatures ?? [])}
+  }
+};
+`;
+
+/**
+ * Creates the HTML template for TradingView Advanced Charts.
+ *
+ * @param theme - MetaMask theme for styling
+ * @param features - Optional feature flags forwarded to the WebView
+ */
+export const createAdvancedChartTemplate = (
+  theme: Theme,
+  features: ChartFeatures = {},
+): string => `
+<!DOCTYPE html>
+<html>
+<head>
+    <meta charset="UTF-8">
+    <title>TradingView Advanced Chart</title>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">
+    <meta http-equiv="Content-Security-Policy" content="default-src 'self' ${CHARTING_LIBRARY_BASE_URL}; script-src 'unsafe-inline' ${CHARTING_LIBRARY_BASE_URL}; style-src 'unsafe-inline' ${CHARTING_LIBRARY_BASE_URL}; img-src 'self' data: ${CHARTING_LIBRARY_BASE_URL}; font-src ${CHARTING_LIBRARY_BASE_URL}; worker-src blob:; frame-src 'self' blob: ${CHARTING_LIBRARY_ORIGIN}; connect-src 'none'; object-src 'none'; base-uri 'none'; frame-ancestors 'none';">
+    <style>
+        html, body {
+            margin: 0;
+            padding: 0;
+            width: 100%;
+            height: 100%;
+            overflow: hidden;
+            background: ${theme.colors.background.default};
+        }
+        #tv_chart_container {
+            width: 100%;
+            height: 100%;
+            position: relative;
+        }
+        .loading-overlay {
+            position: absolute;
+            top: 0;
+            left: 0;
+            width: 100%;
+            height: 100%;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            background: ${theme.colors.background.default};
+            color: ${theme.colors.text.muted};
+            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
+            font-size: 14px;
+            z-index: 1000;
+        }
+        .loading-overlay.hidden {
+            display: none;
+        }
+    </style>
+</head>
+<body>
+    <div id="loading-overlay" class="loading-overlay">Loading chart...</div>
+    <div id="tv_chart_container"></div>
+
+    <script type="text/javascript">
+        ${createConfigScript(CHARTING_LIBRARY_URL, theme, features)}
+    </script>
+    <script type="text/javascript">
+        ${chartLogicScript}
+    </script>
+</body>
+</html>
+`;
+
+export default createAdvancedChartTemplate;
diff --git a/app/components/UI/Charts/AdvancedChart/TimeRangeSelector.tsx b/app/components/UI/Charts/AdvancedChart/TimeRangeSelector.tsx
new file mode 100644
index 000000000000..ed58875970d1
--- /dev/null
+++ b/app/components/UI/Charts/AdvancedChart/TimeRangeSelector.tsx
@@ -0,0 +1,112 @@
+import React from 'react';
+import { Pressable, StyleSheet } from 'react-native';
+import {
+  Box,
+  Text,
+  TextVariant,
+  BoxFlexDirection,
+  BoxAlignItems,
+  BoxJustifyContent,
+} from '@metamask/design-system-react-native';
+import { useStyles } from '../../../../component-library/hooks';
+import { Theme } from '../../../../util/theme/models';
+
+export type TimeRange = '1H' | '1D' | '1W' | '1M' | 'YTD' | 'ALL';
+
+/** Valid Hyperliquid candle interval values */
+export type CandleInterval = '1m' | '15m' | '1h' | '4h' | '1d';
+
+export interface TimeRangeConfig {
+  /** Hyperliquid candle interval */
+  hlInterval: CandleInterval;
+  /** Number of candles to fetch */
+  count: number;
+}
+
+const ytdDays = () => {
+  const now = new Date();
+  const startOfYear = Date.UTC(now.getFullYear(), 0, 1);
+  const today = Date.UTC(now.getFullYear(), now.getMonth(), now.getDate());
+  return Math.round((today - startOfYear) / 86_400_000) + 1;
+};
+
+export const TIME_RANGE_CONFIGS: Record<TimeRange, TimeRangeConfig> = {
+  '1H': { hlInterval: '1m', count: 60 },
+  '1D': { hlInterval: '15m', count: 96 },
+  '1W': { hlInterval: '1h', count: 168 },
+  '1M': { hlInterval: '4h', count: 180 },
+  YTD: { hlInterval: '1d', count: Math.min(ytdDays(), 500) },
+  ALL: { hlInterval: '1d', count: 500 },
+};
+
+const TIME_RANGES: TimeRange[] = ['1H', '1D', '1W', '1M', 'YTD', 'ALL'];
+
+interface TimeRangeSelectorProps {
+  selected: TimeRange;
+  onSelect: (range: TimeRange) => void;
+  /** Optional subset of ranges to display. Defaults to all. */
+  ranges?: TimeRange[];
+}
+
+const selectorStyleSheet = (params: { theme: Theme }) => {
+  const { theme } = params;
+  return StyleSheet.create({
+    button: {
+      paddingHorizontal: 14,
+      paddingVertical: 8,
+      borderRadius: 8,
+      alignItems: 'center',
+      justifyContent: 'center',
+    },
+    buttonSelected: {
+      backgroundColor: theme.colors.background.muted,
+    },
+    buttonPressed: {
+      opacity: 0.7,
+    },
+  });
+};
+
+const TimeRangeSelector: React.FC<TimeRangeSelectorProps> = ({
+  selected,
+  onSelect,
+  ranges = TIME_RANGES,
+}) => {
+  const { styles } = useStyles(selectorStyleSheet, {});
+
+  return (
+    <Box
+      flexDirection={BoxFlexDirection.Row}
+      alignItems={BoxAlignItems.Center}
+      justifyContent={BoxJustifyContent.Center}
+      gap={1}
+      twClassName="py-2 px-4"
+    >
+      {ranges.map((range) => {
+        const isSelected = selected === range;
+        return (
+          <Pressable
+            key={range}
+            style={({ pressed }) => [
+              styles.button,
+              isSelected && styles.buttonSelected,
+              pressed && styles.buttonPressed,
+            ]}
+            onPress={() => onSelect(range)}
+          >
+            <Text
+              variant={TextVariant.BodyMd}
+              twClassName={
+                isSelected ? 'text-text-default' : 'text-text-alternative'
+              }
+            >
+              {range}
+            </Text>
+          </Pressable>
+        );
+      })}
+    </Box>
+  );
+};
+
+export default TimeRangeSelector;
diff --git a/app/components/UI/Charts/AdvancedChart/__tests__/AdvancedChart.test.tsx b/app/components/UI/Charts/AdvancedChart/__tests__/AdvancedChart.test.tsx
new file mode 100644
index 000000000000..382bf5b65a63
--- /dev/null
+++ b/app/components/UI/Charts/AdvancedChart/__tests__/AdvancedChart.test.tsx
@@ -0,0 +1,437 @@
+import React from 'react';
+import { render, act } from '@testing-library/react-native';
+import AdvancedChart from '../AdvancedChart';
+import {
+  ChartType,
+  type OHLCVBar,
+  type AdvancedChartRef,
+  type PositionLines,
+} from '../AdvancedChart.types';
+
+const mockPostMessage = jest.fn();
+
+jest.mock('@metamask/react-native-webview', () => {
+  const { View } = jest.requireActual('react-native');
+  const { forwardRef, useImperativeHandle } = jest.requireActual('react');
+  const MockWebView = forwardRef(
+    (props: Record<string, unknown>, ref: React.Ref<unknown>) => {
+      useImperativeHandle(ref, () => ({
+        postMessage: mockPostMessage,
+        reload: jest.fn(),
+      }));
+      return <View testID="mock-webview" {...props} />;
+    },
+  );
+  MockWebView.displayName = 'MockWebView';
+  return { WebView: MockWebView };
+});
+
+const MOCK_BARS: OHLCVBar[] = [
+  { time: 1000000, open: 10, high: 12, low: 9, close: 11, volume: 100 },
+  { time: 1000300, open: 11, high: 13, low: 10, close: 12, volume: 200 },
+];
+
+describe('AdvancedChart', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  it('renders without crashing', () => {
+    const { getByText } = render(<AdvancedChart ohlcvData={MOCK_BARS} />);
+    expect(getByText('Loading chart...')).toBeOnTheScreen();
+  });
+
+  it('shows loading overlay when isLoading is true', () => {
+    const { getByText } = render(
+      <AdvancedChart ohlcvData={MOCK_BARS} isLoading />,
+    );
+    expect(getByText('Loading chart...')).toBeOnTheScreen();
+  });
+
+  it('sends OHLCV data on WebView load end', () => {
+    const { getByTestId } = render(<AdvancedChart ohlcvData={MOCK_BARS} />);
+
+    const webView = getByTestId('mock-webview');
+    act(() => {
+      webView.props.onLoadEnd();
+    });
+
+    expect(mockPostMessage).toHaveBeenCalledWith(
+      JSON.stringify({
+        type: 'SET_OHLCV_DATA',
+        payload: { data: MOCK_BARS },
+      }),
+    );
+  });
+
+  it('exposes addIndicator via ref', () => {
+    const ref = React.createRef<AdvancedChartRef>();
+    render(<AdvancedChart ref={ref} ohlcvData={MOCK_BARS} />);
+
+    expect(ref.current).toBeTruthy();
+    expect(ref.current?.addIndicator).toBeInstanceOf(Function);
+    expect(ref.current?.removeIndicator).toBeInstanceOf(Function);
+    expect(ref.current?.setChartType).toBeInstanceOf(Function);
+    expect(ref.current?.reset).toBeInstanceOf(Function);
+  });
+
+  it('calls onChartReady when chart reports ready', () => {
+    const onChartReady = jest.fn();
+    const { getByTestId } = render(
+      <AdvancedChart ohlcvData={MOCK_BARS} onChartReady={onChartReady} />,
+    );
+
+    const webView = getByTestId('mock-webview');
+    const onMessage = webView.props.onMessage;
+
+    act(() => {
+      onMessage({
+        nativeEvent: {
+          data: JSON.stringify({ type: 'CHART_READY', payload: {} }),
+        },
+      });
+    });
+
+    expect(onChartReady).toHaveBeenCalledTimes(1);
+  });
+
+  it('calls onError when chart reports an error', () => {
+    const onError = jest.fn();
+    const { getByTestId } = render(
+      <AdvancedChart ohlcvData={MOCK_BARS} onError={onError} />,
+    );
+
+    const webView = getByTestId('mock-webview');
+    act(() => {
+      webView.props.onMessage({
+        nativeEvent: {
+          data: JSON.stringify({
+            type: 'ERROR',
+            payload: { message: 'test error' },
+          }),
+        },
+      });
+    });
+
+    expect(onError).toHaveBeenCalledWith('test error');
+  });
+
+  it('does not destroy the chart for errors after CHART_READY', () => {
+    const onError = jest.fn();
+    const { getByTestId, queryByText } = render(
+      <AdvancedChart ohlcvData={MOCK_BARS} onError={onError} />,
+    );
+
+    const webView = getByTestId('mock-webview');
+
+    act(() => {
+      webView.props.onMessage({
+        nativeEvent: {
+          data: JSON.stringify({ type: 'CHART_READY', payload: {} }),
+        },
+      });
+    });
+
+    act(() => {
+      webView.props.onMessage({
+        nativeEvent: {
+          data: JSON.stringify({
+            type: 'ERROR',
+            payload: { message: 'Failed to add indicator: timeout' },
+          }),
+        },
+      });
+    });
+
+    expect(onError).toHaveBeenCalledWith('Failed to add indicator: timeout');
+    expect(queryByText(/Failed to load chart/)).not.toBeOnTheScreen();
+    expect(getByTestId('mock-webview')).toBeOnTheScreen();
+  });
+
+  it('calls onCrosshairMove when crosshair data arrives', () => {
+    const onCrosshairMove = jest.fn();
+    const { getByTestId } = render(
+      <AdvancedChart ohlcvData={MOCK_BARS} onCrosshairMove={onCrosshairMove} />,
+    );
+
+    const webView = getByTestId('mock-webview');
+    const crosshairData = {
+      time: 1000000,
+      open: 10,
+      high: 12,
+      low: 9,
+      close: 11,
+      volume: 100,
+    };
+
+    act(() => {
+      webView.props.onMessage({
+        nativeEvent: {
+          data: JSON.stringify({
+            type: 'CROSSHAIR_MOVE',
+            payload: { data: crosshairData },
+          }),
+        },
+      });
+    });
+
+    expect(onCrosshairMove).toHaveBeenCalledWith(crosshairData);
+  });
+
+  it('calls onRequestMoreHistory when WebView requests more data', () => {
+    const onRequestMoreHistory = jest.fn();
+    const { getByTestId } = render(
+      <AdvancedChart
+        ohlcvData={MOCK_BARS}
+        onRequestMoreHistory={onRequestMoreHistory}
+      />,
+    );
+
+    const webView = getByTestId('mock-webview');
+    act(() => {
+      webView.props.onMessage({
+        nativeEvent: {
+          data: JSON.stringify({
+            type: 'NEED_MORE_HISTORY',
+            payload: { oldestTimestamp: 1000000 },
+          }),
+        },
+      });
+    });
+
+    expect(onRequestMoreHistory).toHaveBeenCalledTimes(1);
+  });
+
+  it('sends SET_POSITION_LINES when positionLines prop changes', () => {
+    const position: PositionLines = {
+      side: 'long',
+      entryPrice: 1991.7,
+      liquidationPrice: 1357.83,
+    };
+
+    const { getByTestId, rerender } = render(
+      <AdvancedChart ohlcvData={MOCK_BARS} />,
+    );
+
+    // Simulate chart ready
+    const webView = getByTestId('mock-webview');
+    act(() => {
+      webView.props.onMessage({
+        nativeEvent: {
+          data: JSON.stringify({ type: 'CHART_READY', payload: {} }),
+        },
+      });
+    });
+
+    mockPostMessage.mockClear();
+
+    rerender(<AdvancedChart ohlcvData={MOCK_BARS} positionLines={position} />);
+
+    expect(mockPostMessage).toHaveBeenCalledWith(
+      JSON.stringify({
+        type: 'SET_POSITION_LINES',
+        payload: { position },
+      }),
+    );
+  });
+
+  it('sends SET_POSITION_LINES with null when positionLines cleared', () => {
+    const position: PositionLines = {
+      side: 'long',
+      entryPrice: 1991.7,
+    };
+
+    const { getByTestId, rerender } = render(
+      <AdvancedChart ohlcvData={MOCK_BARS} positionLines={position} />,
+    );
+
+    const webView = getByTestId('mock-webview');
+    act(() => {
+      webView.props.onMessage({
+        nativeEvent: {
+          data: JSON.stringify({ type: 'CHART_READY', payload: {} }),
+        },
+      });
+    });
+
+    mockPostMessage.mockClear();
+
+    rerender(<AdvancedChart ohlcvData={MOCK_BARS} positionLines={undefined} />);
+
+    expect(mockPostMessage).toHaveBeenCalledWith(
+      JSON.stringify({
+        type: 'SET_POSITION_LINES',
+        payload: { position: null },
+      }),
+    );
+  });
+
+  it('sends REALTIME_UPDATE when realtimeBar changes', () => {
+    const { getByTestId, rerender } = render(
+      <AdvancedChart ohlcvData={MOCK_BARS} />,
+    );
+
+    const webView = getByTestId('mock-webview');
+    act(() => {
+      webView.props.onMessage({
+        nativeEvent: {
+          data: JSON.stringify({ type: 'CHART_READY', payload: {} }),
+        },
+      });
+    });
+
+    mockPostMessage.mockClear();
+
+    const newBar: OHLCVBar = {
+      time: 1000600,
+      open: 12,
+      high: 14,
+      low: 11,
+      close: 13,
+      volume: 300,
+    };
+
+    rerender(<AdvancedChart ohlcvData={MOCK_BARS} realtimeBar={newBar} />);
+
+    expect(mockPostMessage).toHaveBeenCalledWith(
+      JSON.stringify({
+        type: 'REALTIME_UPDATE',
+        payload: { bar: newBar },
+      }),
+    );
+  });
+
+  it('sends SET_CHART_TYPE when chartType prop changes', () => {
+    const { getByTestId, rerender } = render(
+      <AdvancedChart ohlcvData={MOCK_BARS} chartType={ChartType.Candles} />,
+    );
+
+    const webView = getByTestId('mock-webview');
+    act(() => {
+      webView.props.onMessage({
+        nativeEvent: {
+          data: JSON.stringify({ type: 'CHART_READY', payload: {} }),
+        },
+      });
+    });
+
+    mockPostMessage.mockClear();
+
+    rerender(
+      <AdvancedChart ohlcvData={MOCK_BARS} chartType={ChartType.Line} />,
+    );
+
+    expect(mockPostMessage).toHaveBeenCalledWith(
+      JSON.stringify({
+        type: 'SET_CHART_TYPE',
+        payload: { type: ChartType.Line },
+      }),
+    );
+  });
+
+  it('resets chart state when htmlContent changes so sync effects re-fire', () => {
+    const onChartReady = jest.fn();
+    const { getByTestId, getByText, rerender } = render(
+      <AdvancedChart
+        ohlcvData={MOCK_BARS}
+        onChartReady={onChartReady}
+        enableDrawingTools={false}
+        indicators={['RSI']}
+      />,
+    );
+
+    const webView = getByTestId('mock-webview');
+
+    act(() => {
+      webView.props.onLoadEnd();
+    });
+    act(() => {
+      webView.props.onMessage({
+        nativeEvent: {
+          data: JSON.stringify({ type: 'CHART_READY', payload: {} }),
+        },
+      });
+    });
+
+    expect(onChartReady).toHaveBeenCalledTimes(1);
+    mockPostMessage.mockClear();
+
+    rerender(
+      <AdvancedChart
+        ohlcvData={MOCK_BARS}
+        onChartReady={onChartReady}
+        enableDrawingTools
+        indicators={['RSI']}
+      />,
+    );
+
+    expect(getByText('Loading chart...')).toBeOnTheScreen();
+
+    act(() => {
+      webView.props.onLoadEnd();
+    });
+    act(() => {
+      webView.props.onMessage({
+        nativeEvent: {
+          data: JSON.stringify({ type: 'CHART_READY', payload: {} }),
+        },
+      });
+    });
+
+    expect(onChartReady).toHaveBeenCalledTimes(2);
+
+    const addIndicatorCall = mockPostMessage.mock.calls.find((call) => {
+      const parsed = JSON.parse(call[0] as string);
+      return parsed.type === 'ADD_INDICATOR' && parsed.payload.name === 'RSI';
+    });
+    expect(addIndicatorCall).toBeDefined();
+  });
+
+  it('displays error screen for errors before CHART_READY', () => {
+    const { getByTestId, getByText } = render(
+      <AdvancedChart ohlcvData={MOCK_BARS} />,
+    );
+
+    const webView = getByTestId('mock-webview');
+    act(() => {
+      webView.props.onMessage({
+        nativeEvent: {
+          data: JSON.stringify({
+            type: 'ERROR',
+            payload: { message: 'Load failed' },
+          }),
+        },
+      });
+    });
+
+    expect(getByText(/Load failed/)).toBeOnTheScreen();
+  });
+
+  it('recovers from error state when reset() is called via ref', () => {
+    const ref = React.createRef<AdvancedChartRef>();
+    const { getByTestId, getByText, queryByText } = render(
+      <AdvancedChart ref={ref} ohlcvData={MOCK_BARS} />,
+    );
+
+    const webView = getByTestId('mock-webview');
+    act(() => {
+      webView.props.onMessage({
+        nativeEvent: {
+          data: JSON.stringify({
+            type: 'ERROR',
+            payload: { message: 'Load failed' },
+          }),
+        },
+      });
+    });
+
+    expect(getByText(/Load failed/)).toBeOnTheScreen();
+
+    act(() => {
+      ref.current?.reset();
+    });
+
+    expect(queryByText(/Load failed/)).not.toBeOnTheScreen();
+    expect(getByText('Loading chart...')).toBeOnTheScreen();
+  });
+});
diff --git a/app/components/UI/Charts/AdvancedChart/__tests__/TimeRangeSelector.test.tsx b/app/components/UI/Charts/AdvancedChart/__tests__/TimeRangeSelector.test.tsx
new file mode 100644
index 000000000000..21fa02ee4ba1
--- /dev/null
+++ b/app/components/UI/Charts/AdvancedChart/__tests__/TimeRangeSelector.test.tsx
@@ -0,0 +1,107 @@
+import React from 'react';
+import { render, fireEvent } from '@testing-library/react-native';
+import TimeRangeSelector, {
+  TIME_RANGE_CONFIGS,
+  type TimeRange,
+} from '../TimeRangeSelector';
+
+describe('TimeRangeSelector', () => {
+  const defaultProps = {
+    selected: '1D' as TimeRange,
+    onSelect: jest.fn(),
+  };
+
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  it('renders all time range buttons by default', () => {
+    const { getByText } = render(<TimeRangeSelector {...defaultProps} />);
+
+    expect(getByText('1H')).toBeOnTheScreen();
+    expect(getByText('1D')).toBeOnTheScreen();
+    expect(getByText('1W')).toBeOnTheScreen();
+    expect(getByText('1M')).toBeOnTheScreen();
+    expect(getByText('YTD')).toBeOnTheScreen();
+    expect(getByText('ALL')).toBeOnTheScreen();
+  });
+
+  it('renders only specified ranges when ranges prop is provided', () => {
+    const { getByText, queryByText } = render(
+      <TimeRangeSelector {...defaultProps} ranges={['1H', '1D', '1W']} />,
+    );
+
+    expect(getByText('1H')).toBeOnTheScreen();
+    expect(getByText('1D')).toBeOnTheScreen();
+    expect(getByText('1W')).toBeOnTheScreen();
+    expect(queryByText('1M')).not.toBeOnTheScreen();
+    expect(queryByText('YTD')).not.toBeOnTheScreen();
+    expect(queryByText('ALL')).not.toBeOnTheScreen();
+  });
+
+  it('calls onSelect with the tapped range', () => {
+    const onSelect = jest.fn();
+    const { getByText } = render(
+      <TimeRangeSelector {...defaultProps} onSelect={onSelect} />,
+    );
+
+    fireEvent.press(getByText('1W'));
+
+    expect(onSelect).toHaveBeenCalledWith('1W');
+    expect(onSelect).toHaveBeenCalledTimes(1);
+  });
+
+  it('calls onSelect when tapping the already selected range', () => {
+    const onSelect = jest.fn();
+    const { getByText } = render(
+      <TimeRangeSelector selected="1D" onSelect={onSelect} />,
+    );
+
+    fireEvent.press(getByText('1D'));
+
+    expect(onSelect).toHaveBeenCalledWith('1D');
+  });
+
+  describe('TIME_RANGE_CONFIGS', () => {
+    it('has a config for every time range', () => {
+      const ranges: TimeRange[] = ['1H', '1D', '1W', '1M', 'YTD', 'ALL'];
+
+      ranges.forEach((range) => {
+        expect(TIME_RANGE_CONFIGS[range]).toBeDefined();
+        expect(TIME_RANGE_CONFIGS[range].hlInterval).toBeTruthy();
+        expect(TIME_RANGE_CONFIGS[range].count).toBeGreaterThan(0);
+      });
+    });
+
+    it('maps 1H to 1-minute candles', () => {
+      expect(TIME_RANGE_CONFIGS['1H'].hlInterval).toBe('1m');
+      expect(TIME_RANGE_CONFIGS['1H'].count).toBe(60);
+    });
+
+    it('maps 1D to 15-minute candles', () => {
+      expect(TIME_RANGE_CONFIGS['1D'].hlInterval).toBe('15m');
+      expect(TIME_RANGE_CONFIGS['1D'].count).toBe(96);
+    });
+
+    it('maps 1W to 1-hour candles', () => {
+      expect(TIME_RANGE_CONFIGS['1W'].hlInterval).toBe('1h');
+      expect(TIME_RANGE_CONFIGS['1W'].count).toBe(168);
+    });
+
+    it('maps 1M to 4-hour candles', () => {
+      expect(TIME_RANGE_CONFIGS['1M'].hlInterval).toBe('4h');
+      expect(TIME_RANGE_CONFIGS['1M'].count).toBe(180);
+    });
+
+    it('maps ALL to daily candles with 500 count', () => {
+      expect(TIME_RANGE_CONFIGS.ALL.hlInterval).toBe('1d');
+      expect(TIME_RANGE_CONFIGS.ALL.count).toBe(500);
+    });
+
+    it('maps YTD to daily candles capped at 500', () => {
+      expect(TIME_RANGE_CONFIGS.YTD.hlInterval).toBe('1d');
+      expect(TIME_RANGE_CONFIGS.YTD.count).toBeGreaterThan(0);
+      expect(TIME_RANGE_CONFIGS.YTD.count).toBeLessThanOrEqual(500);
+    });
+  });
+});
diff --git a/app/components/UI/Charts/AdvancedChart/webview/chartLogic.js b/app/components/UI/Charts/AdvancedChart/webview/chartLogic.js
new file mode 100644
index 000000000000..27fd979b4e7d
--- /dev/null
+++ b/app/components/UI/Charts/AdvancedChart/webview/chartLogic.js
@@ -0,0 +1,875 @@
+/**
+ * TradingView Chart WebView Logic
+ *
+ * Generic charting logic for TradingView Advanced Charts.
+ * Embedded into the WebView HTML at runtime via chartLogicString.ts.
+ *
+ * CONFIG is injected before this script runs and contains:
+ * - libraryUrl: string
+ * - theme: { backgroundColor, borderColor, textColor, successColor, errorColor, primaryColor }
+ */
+
+// ============================================
+// Global State
+// ============================================
+window.chartWidget = null;
+window.ohlcvData = [];
+window.currentSymbol = 'ASSET';
+window.activeStudies = {};
+window.positionShapeIds = [];
+window.isChartReady = false;
+window.pendingMessages = [];
+window.libraryLoaded = false;
+window.libraryError = null;
+window.realtimeCallbacks = {};
+window.pendingGetBarsCallback = null;
+
+// ============================================
+// Communication with React Native
+// ============================================
+function sendToReactNative(type, payload) {
+  payload = payload || {};
+  if (window.ReactNativeWebView) {
+    window.ReactNativeWebView.postMessage(
+      JSON.stringify({ type: type, payload: payload }),
+    );
+  }
+}
+
+// ============================================
+// Message Handler
+// ============================================
+function handleMessage(event) {
+  try {
+    var message =
+      typeof event.data === 'string' ? JSON.parse(event.data) : event.data;
+
+    if (!window.isChartReady && message.type !== 'SET_OHLCV_DATA') {
+      window.pendingMessages.push(message);
+      return;
+    }
+
+    switch (message.type) {
+      case 'SET_OHLCV_DATA':
+        handleSetOHLCVData(message.payload);
+        break;
+      case 'ADD_INDICATOR':
+        handleAddIndicator(message.payload);
+        break;
+      case 'REMOVE_INDICATOR':
+        handleRemoveIndicator(message.payload);
+        break;
+      case 'SET_CHART_TYPE':
+        handleSetChartType(message.payload);
+        break;
+      case 'SET_POSITION_LINES':
+        handleSetPositionLines(message.payload);
+        break;
+      case 'REALTIME_UPDATE':
+        handleRealtimeUpdate(message.payload);
+        break;
+      case 'TOGGLE_VOLUME':
+        handleToggleVolume(message.payload);
+        break;
+    }
+  } catch (error) {
+    sendToReactNative('ERROR', { message: error.message });
+  }
+}
+
+window.addEventListener('message', handleMessage);
+document.addEventListener('message', handleMessage);
+
+// ============================================
+// Data Handlers
+// ============================================
+var INTERVAL_MS_TO_TV = {
+  60000: '1',
+  180000: '3',
+  300000: '5',
+  900000: '15',
+  1800000: '30',
+  3600000: '60',
+  7200000: '120',
+  14400000: '240',
+  28800000: '480',
+  43200000: '720',
+  86400000: '1D',
+  259200000: '3D',
+  604800000: '1W',
+  2592000000: '1M',
+};
+
+function detectResolution(data) {
+  if (data.length < 2) return '5';
+  // Use median of first few diffs to avoid gaps skewing the result
+  var diffs = [];
+  var len = Math.min(data.length - 1, 10);
+  for (var i = 0; i < len; i++) {
+    diffs.push(data[i + 1].time - data[i].time);
+  }
+  diffs.sort(function (a, b) {
+    return a - b;
+  });
+  var median = diffs[Math.floor(diffs.length / 2)];
+
+  // Find closest match
+  var keys = Object.keys(INTERVAL_MS_TO_TV);
+  var best = '5';
+  var bestDist = Infinity;
+  for (var k = 0; k < keys.length; k++) {
+    var d = Math.abs(Number(keys[k]) - median);
+    if (d < bestDist) {
+      bestDist = d;
+      best = INTERVAL_MS_TO_TV[keys[k]];
+    }
+  }
+  return best;
+}
+
+function handleSetOHLCVData(payload) {
+  if (!payload || !payload.data || payload.data.length === 0) return;
+
+  window.ohlcvData = payload.data;
+
+  var newResolution = detectResolution(window.ohlcvData);
+  var hasPending = !!window.pendingGetBarsCallback;
+
+  // TODO: Early return bypasses resolution-change handling at lines 146–170.
+  // If SET_OHLCV_DATA arrives at a different resolution while a history
+  // request is pending (if a user switches interval during a pending chart candle history navigation request),
+  // the widget stays at the old resolution while window.currentResolution
+  // reflects the new one. Fix when wiring up history pagination for Perps.
+  if (hasPending) {
+    var pending = window.pendingGetBarsCallback;
+    window.pendingGetBarsCallback = null;
+    window.currentResolution = newResolution;
+    resolvePendingGetBars(pending);
+    return;
+  }
+
+  if (window.chartWidget && window.isChartReady) {
+    if (window.currentResolution !== newResolution) {
+      window.currentResolution = newResolution;
+      try {
+        window.chartWidget
+          .activeChart()
+          .setResolution(newResolution, function () {});
+      } catch (e) {
+        window.chartWidget.remove();
+        window.chartWidget = null;
+        window.isChartReady = false;
+        window.activeStudies = {};
+        window.volumeStudyId = null;
+        window.positionShapeIds = [];
+        window.realtimeCallbacks = {};
+        window.pendingGetBarsCallback = null;
+        initChart();
+      }
+    } else {
+      try {
+        window.chartWidget.activeChart().resetData();
+      } catch (e) {
+        // resetData can fail if chart is in a transitional state
+      }
+    }
+  } else if (window.chartWidget && !window.isChartReady) {
+    window.currentResolution = newResolution;
+  } else if (!window.chartWidget) {
+    window.currentResolution = newResolution;
+    libraryLoadAttempts = 0;
+    initChart();
+  }
+}
+
+// ============================================
+// Realtime Update Handler
+// ============================================
+function handleRealtimeUpdate(payload) {
+  if (!payload || !payload.bar) return;
+
+  var bar = payload.bar;
+
+  // Append or update the last bar in the local data store
+  if (window.ohlcvData.length > 0) {
+    var lastBar = window.ohlcvData[window.ohlcvData.length - 1];
+    if (lastBar.time === bar.time) {
+      window.ohlcvData[window.ohlcvData.length - 1] = bar;
+    } else {
+      window.ohlcvData.push(bar);
+    }
+  } else {
+    window.ohlcvData.push(bar);
+  }
+
+  // Forward to all active TradingView subscribeBars callbacks
+  var tick = {
+    time: bar.time,
+    open: bar.open,
+    high: bar.high,
+    low: bar.low,
+    close: bar.close,
+    volume: bar.volume,
+  };
+  var guids = Object.keys(window.realtimeCallbacks);
+  for (var i = 0; i < guids.length; i++) {
+    window.realtimeCallbacks[guids[i]](tick);
+  }
+}
+
+// ============================================
+// Indicator Handlers
+//
+// Curated subset for Token Details mobile UX. Consumers needing the full
+// TradingView study picker can re-enable header_widget via disabledFeatures
+// prop, which exposes TradingView's native indicator UI.
+// ============================================
+function handleAddIndicator(payload) {
+  if (!window.chartWidget || !window.isChartReady) return;
+  if (!payload || !payload.name) return;
+
+  var indicatorName = payload.name;
+
+  if (window.activeStudies[indicatorName]) {
+    return;
+  }
+
+  try {
+    var chart = window.chartWidget.activeChart();
+    var studyName, inputs;
+
+    switch (indicatorName) {
+      case 'MACD':
+        studyName = 'MACD';
+        inputs = { in_0: 12, in_1: 26, in_2: 9 };
+        break;
+      case 'RSI':
+        studyName = 'Relative Strength Index';
+        inputs = { in_0: 14 };
+        break;
+      case 'MA200':
+        studyName = 'Moving Average';
+        inputs = { in_0: 200 };
+        break;
+      default:
+        studyName = indicatorName;
+        inputs = payload.inputs || {};
+        break;
+    }
+
+    chart
+      .createStudy(studyName, false, false, inputs)
+      .then(function (studyId) {
+        window.activeStudies[indicatorName] = studyId;
+        sendToReactNative('INDICATOR_ADDED', {
+          name: indicatorName,
+          id: String(studyId),
+        });
+      })
+      .catch(function (error) {
+        sendToReactNative('ERROR', {
+          message: 'Failed to add indicator: ' + error.message,
+        });
+      });
+  } catch (error) {
+    sendToReactNative('ERROR', { message: error.message });
+  }
+}
+
+function handleRemoveIndicator(payload) {
+  if (!window.chartWidget || !window.isChartReady) return;
+  if (!payload || !payload.name) return;
+
+  var indicatorName = payload.name;
+  var studyId = window.activeStudies[indicatorName];
+
+  if (!studyId) return;
+
+  try {
+    var chart = window.chartWidget.activeChart();
+    chart.removeEntity(studyId);
+    delete window.activeStudies[indicatorName];
+    sendToReactNative('INDICATOR_REMOVED', { name: indicatorName });
+  } catch (error) {
+    sendToReactNative('ERROR', { message: error.message });
+  }
+}
+
+// ============================================
+// Chart Type Handler
+// ============================================
+function handleSetChartType(payload) {
+  if (!window.chartWidget || !window.isChartReady) return;
+
+  try {
+    var chart = window.chartWidget.activeChart();
+    chart.setChartType(payload.type);
+  } catch (error) {
+    sendToReactNative('ERROR', { message: error.message });
+  }
+}
+
+// ============================================
+// Position Lines (unified SET_POSITION_LINES)
+// ============================================
+
+function clearPositionLines() {
+  if (!window.chartWidget || !window.isChartReady) return;
+
+  try {
+    var chart = window.chartWidget.activeChart();
+    for (var i = 0; i < window.positionShapeIds.length; i++) {
+      try {
+        chart.removeEntity(window.positionShapeIds[i]);
+      } catch (e) {
+        // Shape may already be removed
+      }
+    }
+    window.positionShapeIds = [];
+  } catch (error) {
+    sendToReactNative('ERROR', {
+      message: 'Failed to clear position lines: ' + error.message,
+    });
+  }
+}
+
+function handleSetPositionLines(payload) {
+  if (!window.chartWidget || !window.isChartReady) return;
+
+  // Clear existing lines first
+  clearPositionLines();
+
+  // null or missing position means "clear only"
+  if (!payload || !payload.position) return;
+
+  var position = payload.position;
+  var theme = window.CONFIG.theme;
+
+  try {
+    var chart = window.chartWidget.activeChart();
+    var lines = [];
+
+    if (position.entryPrice) {
+      lines.push({
+        price: position.entryPrice,
+        text: 'Entry',
+        color: '#858585',
+        lineStyle: 2,
+      });
+    }
+    if (position.takeProfitPrice) {
+      lines.push({
+        price: position.takeProfitPrice,
+        text: 'TP',
+        color: theme.successColor,
+        lineStyle: 2,
+      });
+    }
+    if (position.stopLossPrice) {
+      lines.push({
+        price: position.stopLossPrice,
+        text: 'SL',
+        color: '#858585',
+        lineStyle: 2,
+      });
+    }
+    if (position.liquidationPrice) {
+      lines.push({
+        price: position.liquidationPrice,
+        text: 'Liq',
+        color: theme.errorColor,
+        lineStyle: 2,
+      });
+    }
+    // TODO: currentPrice is defined in PositionLines but not yet rendered here.
+    // Add a line for position.currentPrice (e.g. a solid line showing live mark
+    // price) when the Perps integration is ready.
+
+    for (var i = 0; i < lines.length; i++) {
+      (function (line) {
+        chart
+          .createShape(
+            { price: line.price },
+            {
+              shape: 'horizontal_line',
+              lock: true,
+              disableSelection: true,
+              disableSave: true,
+              disableUndo: true,
+              text: line.text,
+              overrides: {
+                linecolor: line.color,
+                linestyle: line.lineStyle,
+                linewidth: 1,
+                showLabel: true,
+                textcolor: line.color,
+                fontsize: 11,
+                horzLabelsAlign: 'right',
+                showPrice: true,
+              },
+            },
+          )
+          .then(function (entityId) {
+            if (entityId) {
+              window.positionShapeIds.push(entityId);
+            }
+          })
+          .catch(function () {
+            // Shape creation can fail silently
+          });
+      })(lines[i]);
+    }
+  } catch (error) {
+    sendToReactNative('ERROR', {
+      message: 'Failed to add position lines: ' + error.message,
+    });
+  }
+}
+
+// ============================================
+// Volume Helpers
+// ============================================
+window.volumeStudyId = null;
+
+function createVolumeStudy() {
+  if (!window.chartWidget || !window.isChartReady) return;
+  if (window.volumeStudyId) return;
+
+  try {
+    window.chartWidget
+      .activeChart()
+      .createStudy('Volume', false, false, {}, { 'volume ma.visible': false })
+      .then(function (studyId) {
+        window.volumeStudyId = studyId;
+      })
+      .catch(function () {
+        // Volume study creation failed
+      });
+  } catch (e) {
+    // Not critical
+  }
+}
+
+function handleToggleVolume(payload) {
+  if (!window.chartWidget || !window.isChartReady) return;
+  if (!payload) return;
+
+  if (payload.visible && !window.volumeStudyId) {
+    createVolumeStudy();
+  } else if (!payload.visible && window.volumeStudyId) {
+    try {
+      window.chartWidget.activeChart().removeEntity(window.volumeStudyId);
+    } catch (e) {
+      // Already removed
+    }
+    window.volumeStudyId = null;
+  }
+}
+
+// ============================================
+// Custom Datafeed Implementation
+// ============================================
+
+/**
+ * TradingView variable_tick_size string.
+ *
+ * Tells TradingView to dynamically adjust pricescale/minmov based on
+ * the current price level. Format: "tickSize threshold tickSize threshold …"
+ * where each tickSize applies for prices below the next threshold, and
+ * the last tickSize applies to all prices above the last threshold.
+ *
+ * This replaces a manual pricescale computation and adapts automatically
+ * as prices change (e.g. meme token pumps from $0.0001 to $1).
+ */
+var VARIABLE_TICK_SIZE = [
+  '0.0000000001',
+  '0.000001', // prices < $0.000001 → 10 dp
+  '0.00000001',
+  '0.0001', // prices < $0.0001   →  8 dp
+  '0.000001',
+  '0.01', // prices < $0.01     →  6 dp
+  '0.0001',
+  '1', // prices < $1        →  4 dp
+  '0.01',
+  '10000', // prices < $10000    →  2 dp
+  '0.1', // prices ≥ $10000    →  1 dp
+].join(' ');
+
+function filterBarsForRange(fromMs, toMs, countBack) {
+  var barsInRange = [];
+  for (var i = 0; i < window.ohlcvData.length; i++) {
+    var b = window.ohlcvData[i];
+    if (b.time >= fromMs && b.time < toMs) {
+      barsInRange.push({
+        time: b.time,
+        open: b.open,
+        high: b.high,
+        low: b.low,
+        close: b.close,
+        volume: b.volume,
+      });
+    }
+  }
+
+  if (barsInRange.length < countBack) {
+    var allBeforeTo = [];
+    for (var j = 0; j < window.ohlcvData.length; j++) {
+      if (window.ohlcvData[j].time < toMs) {
+        allBeforeTo.push(window.ohlcvData[j]);
+      }
+    }
+    var startIdx = Math.max(0, allBeforeTo.length - countBack);
+    barsInRange = [];
+    for (var k = startIdx; k < allBeforeTo.length; k++) {
+      var bar = allBeforeTo[k];
+      barsInRange.push({
+        time: bar.time,
+        open: bar.open,
+        high: bar.high,
+        low: bar.low,
+        close: bar.close,
+        volume: bar.volume,
+      });
+    }
+  }
+
+  return barsInRange;
+}
+
+function resolvePendingGetBars(pending) {
+  var currentOldest =
+    window.ohlcvData.length > 0 ? window.ohlcvData[0].time : 0;
+
+  if (currentOldest >= pending.oldestAtDefer) {
+    pending.onResult([], { noData: true });
+    return;
+  }
+
+  // Return only the newly fetched bars (older than what we had before deferring).
+  // TradingView already has bars from oldestAtDefer onward.
+  var bars = [];
+  for (var i = 0; i < window.ohlcvData.length; i++) {
+    var b = window.ohlcvData[i];
+    if (b.time < pending.oldestAtDefer) {
+      bars.push({
+        time: b.time,
+        open: b.open,
+        high: b.high,
+        low: b.low,
+        close: b.close,
+        volume: b.volume,
+      });
+    }
+  }
+
+  pending.onResult(bars, { noData: false });
+}
+
+var customDatafeed = {
+  onReady: function (callback) {
+    setTimeout(function () {
+      callback({
+        supported_resolutions: [
+          '1',
+          '3',
+          '5',
+          '15',
+          '30',
+          '60',
+          '120',
+          '240',
+          '480',
+          '720',
+          '1D',
+          '3D',
+          '1W',
+          '1M',
+        ],
+        supports_marks: false,
+        supports_timescale_marks: false,
+        supports_time: true,
+      });
+    }, 0);
+  },
+
+  searchSymbols: function (userInput, exchange, symbolType, onResult) {
+    onResult([]);
+  },
+
+  resolveSymbol: function (symbolName, onResolve) {
+    setTimeout(function () {
+      onResolve({
+        name: symbolName,
+        ticker: symbolName,
+        description: symbolName,
+        type: 'crypto',
+        session: '24x7',
+        timezone: 'Etc/UTC',
+        exchange: '',
+        minmov: 1,
+        pricescale: 100,
+        variable_tick_size: VARIABLE_TICK_SIZE,
+        has_intraday: true,
+        has_daily: true,
+        has_weekly_and_monthly: true,
+        supported_resolutions: [
+          '1',
+          '3',
+          '5',
+          '15',
+          '30',
+          '60',
+          '120',
+          '240',
+          '480',
+          '720',
+          '1D',
+          '3D',
+          '1W',
+          '1M',
+        ],
+        volume_precision: 0,
+        data_status: 'streaming',
+      });
+    }, 0);
+  },
+
+  getBars: function (symbolInfo, resolution, periodParams, onResult, onError) {
+    try {
+      var fromMs = periodParams.from * 1000;
+      var toMs = periodParams.to * 1000;
+      var countBack = periodParams.countBack;
+      var firstRequest = periodParams.firstDataRequest;
+
+      var bars = filterBarsForRange(fromMs, toMs, countBack);
+
+      if (bars.length > 0) {
+        onResult(bars, { noData: false });
+        return;
+      }
+
+      if (firstRequest || window.ohlcvData.length === 0) {
+        onResult([], { noData: true });
+        return;
+      }
+
+      var oldestTs = window.ohlcvData[0].time;
+
+      window.pendingGetBarsCallback = {
+        onResult: onResult,
+        oldestAtDefer: oldestTs,
+      };
+
+      sendToReactNative('NEED_MORE_HISTORY', { oldestTimestamp: oldestTs });
+    } catch (error) {
+      onError(error.message);
+    }
+  },
+
+  subscribeBars: function (symbolInfo, resolution, onTick, listenerGuid) {
+    window.realtimeCallbacks[listenerGuid] = onTick;
+  },
+
+  unsubscribeBars: function (listenerGuid) {
+    delete window.realtimeCallbacks[listenerGuid];
+  },
+};
+
+// ============================================
+// Library Loading
+// ============================================
+var libraryLoadAttempts = 0;
+var maxLibraryLoadAttempts = 50;
+
+function loadLibrary() {
+  var scriptUrl = window.CONFIG.libraryUrl + 'charting_library.js';
+
+  var script = document.createElement('script');
+  script.type = 'text/javascript';
+  script.src = scriptUrl;
+  script.onload = function () {
+    window.libraryLoaded = true;
+    if (window.ohlcvData.length > 0) {
+      initChart();
+    }
+  };
+  script.onerror = function () {
+    window.libraryError =
+      'Failed to load TradingView library. URL: ' + scriptUrl;
+    document.getElementById('loading-overlay').innerHTML =
+      '<div style="text-align:center;padding:20px;">' +
+      '<p style="color:#FF6B6B;margin-bottom:10px;">Failed to load chart library</p>' +
+      '<p style="font-size:12px;color:#888;">URL: ' +
+      scriptUrl +
+      '</p>' +
+      '<p style="font-size:12px;color:#888;">Check S3 access or CORS configuration.</p>' +
+      '</div>';
+    sendToReactNative('ERROR', { message: window.libraryError });
+  };
+  document.head.appendChild(script);
+}
+
+// ============================================
+// Chart Initialization
+// ============================================
+function initChart() {
+  if (window.chartWidget) return;
+
+  if (typeof TradingView === 'undefined') {
+    libraryLoadAttempts++;
+    if (libraryLoadAttempts >= maxLibraryLoadAttempts) {
+      var errorMsg =
+        'TradingView library failed to initialize after ' +
+        maxLibraryLoadAttempts * 100 +
+        'ms';
+      document.getElementById('loading-overlay').textContent = errorMsg;
+      sendToReactNative('ERROR', { message: errorMsg });
+      return;
+    }
+    setTimeout(initChart, 100);
+    return;
+  }
+
+  if (window.ohlcvData.length === 0) {
+    return;
+  }
+
+  try {
+    var theme = window.CONFIG.theme;
+    var features = window.CONFIG.features || {};
+
+    // Disabled features are passed from React Native via CONFIG.features.disabledFeatures.
+    // Defaults are set in DEFAULT_DISABLED_FEATURES (AdvancedChart.types.ts) and are
+    // optimized for the Token Details mobile UX. Consumers needing TradingView's
+    // native UI (e.g. Perps) can override via the disabledFeatures prop.
+    var disabledFeatures = (features.disabledFeatures || []).slice();
+
+    if (!features.enableDrawingTools) {
+      disabledFeatures.push('left_toolbar');
+      disabledFeatures.push('context_menus');
+    }
+
+    window.chartWidget = new TradingView.widget({
+      symbol: window.currentSymbol,
+      interval: window.currentResolution || '5',
+      container: 'tv_chart_container',
+      datafeed: customDatafeed,
+      library_path: window.CONFIG.libraryUrl,
+      locale: 'en',
+      fullscreen: false,
+      autosize: true,
+      theme: 'Dark',
+
+      disabled_features: disabledFeatures,
+      enabled_features: ['study_templates', 'iframe_loading_same_origin'],
+
+      overrides: {
+        'paneProperties.background': theme.backgroundColor,
+        'paneProperties.backgroundType': 'solid',
+        'paneProperties.vertGridProperties.color': theme.borderColor,
+        'paneProperties.horzGridProperties.color': theme.borderColor,
+        'scalesProperties.textColor': theme.textColor,
+        'scalesProperties.lineColor': theme.borderColor,
+        'scalesProperties.fontSize': 11,
+        'scalesProperties.showStudyLastValue': true,
+        'scalesProperties.showSeriesLastValue': true,
+        'scalesProperties.showSymbolLabels': true,
+        'scalesProperties.showRightScale': true,
+        'scalesProperties.showLeftScale': false,
+        'paneProperties.bottomMargin': 5,
+        'mainSeriesProperties.candleStyle.upColor': theme.successColor,
+        'mainSeriesProperties.candleStyle.downColor': theme.errorColor,
+        'mainSeriesProperties.candleStyle.borderUpColor': theme.successColor,
+        'mainSeriesProperties.candleStyle.borderDownColor': theme.errorColor,
+        'mainSeriesProperties.candleStyle.wickUpColor': theme.successColor,
+        'mainSeriesProperties.candleStyle.wickDownColor': theme.errorColor,
+      },
+
+      loading_screen: {
+        backgroundColor: theme.backgroundColor,
+        foregroundColor: theme.primaryColor,
+      },
+    });
+
+    window.chartWidget.onChartReady(function () {
+      window.isChartReady = true;
+      document.getElementById('loading-overlay').classList.add('hidden');
+
+      try {
+        var timeScale = window.chartWidget.activeChart().getTimeScale();
+        timeScale.defaultRightOffset().setValue(0);
+        timeScale.setRightOffset(0);
+      } catch (e) {}
+
+      sendToReactNative('CHART_READY', {});
+
+      // Set up crosshair move listener for OHLC overlay
+      try {
+        window.chartWidget
+          .activeChart()
+          .crossHairMoved()
+          .subscribe(null, function (params) {
+            if (
+              params &&
+              params.price !== undefined &&
+              params.time !== undefined
+            ) {
+              // Find the bar closest to the crosshair time
+              var targetTime = params.time * 1000;
+              var closestBar = null;
+              var minDiff = Infinity;
+              for (var i = 0; i < window.ohlcvData.length; i++) {
+                var diff = Math.abs(window.ohlcvData[i].time - targetTime);
+                if (diff < minDiff) {
+                  minDiff = diff;
+                  closestBar = window.ohlcvData[i];
+                }
+              }
+              if (closestBar) {
+                sendToReactNative('CROSSHAIR_MOVE', {
+                  data: {
+                    time: closestBar.time,
+                    open: closestBar.open,
+                    high: closestBar.high,
+                    low: closestBar.low,
+                    close: closestBar.close,
+                    volume: closestBar.volume,
+                  },
+                });
+              }
+            } else {
+              sendToReactNative('CROSSHAIR_MOVE', { data: null });
+            }
+          });
+      } catch (e) {
+        // Crosshair subscription not critical
+      }
+
+      // Auto-add volume study if showVolume is true (no SMA overlay)
+      if (features.showVolume) {
+        createVolumeStudy();
+      }
+
+      // Process pending messages
+      window.pendingMessages.forEach(function (msg) {
+        handleMessage({ data: msg });
+      });
+      window.pendingMessages = [];
+    });
+  } catch (error) {
+    sendToReactNative('ERROR', {
+      message: 'Failed to initialize chart: ' + error.message,
+    });
+  }
+}
+
+// ============================================
+// Start
+// ============================================
+if (document.readyState === 'loading') {
+  document.addEventListener('DOMContentLoaded', function () {
+    loadLibrary();
+  });
+} else {
+  loadLibrary();
+}
diff --git a/app/components/UI/Charts/AdvancedChart/webview/chartLogicString.ts b/app/components/UI/Charts/AdvancedChart/webview/chartLogicString.ts
new file mode 100644
index 000000000000..7017c9900690
--- /dev/null
+++ b/app/components/UI/Charts/AdvancedChart/webview/chartLogicString.ts
@@ -0,0 +1,880 @@
+/**
+ * AUTO-GENERATED - DO NOT EDIT DIRECTLY
+ *
+ * This file is generated from chartLogic.js by syncChartLogic.js
+ * Edit chartLogic.js instead, then run:
+ *   node app/components/UI/Charts/AdvancedChart/webview/syncChartLogic.js
+ */
+
+// eslint-disable-next-line import/no-default-export
+export default `/**
+ * TradingView Chart WebView Logic
+ *
+ * Generic charting logic for TradingView Advanced Charts.
+ * Embedded into the WebView HTML at runtime via chartLogicString.ts.
+ *
+ * CONFIG is injected before this script runs and contains:
+ * - libraryUrl: string
+ * - theme: { backgroundColor, borderColor, textColor, successColor, errorColor, primaryColor }
+ */
+
+// ============================================
+// Global State
+// ============================================
+window.chartWidget = null;
+window.ohlcvData = [];
+window.currentSymbol = 'ASSET';
+window.activeStudies = {};
+window.positionShapeIds = [];
+window.isChartReady = false;
+window.pendingMessages = [];
+window.libraryLoaded = false;
+window.libraryError = null;
+window.realtimeCallbacks = {};
+window.pendingGetBarsCallback = null;
+
+// ============================================
+// Communication with React Native
+// ============================================
+function sendToReactNative(type, payload) {
+  payload = payload || {};
+  if (window.ReactNativeWebView) {
+    window.ReactNativeWebView.postMessage(
+      JSON.stringify({ type: type, payload: payload }),
+    );
+  }
+}
+
+// ============================================
+// Message Handler
+// ============================================
+function handleMessage(event) {
+  try {
+    var message =
+      typeof event.data === 'string' ? JSON.parse(event.data) : event.data;
+
+    if (!window.isChartReady && message.type !== 'SET_OHLCV_DATA') {
+      window.pendingMessages.push(message);
+      return;
+    }
+
+    switch (message.type) {
+      case 'SET_OHLCV_DATA':
+        handleSetOHLCVData(message.payload);
+        break;
+      case 'ADD_INDICATOR':
+        handleAddIndicator(message.payload);
+        break;
+      case 'REMOVE_INDICATOR':
+        handleRemoveIndicator(message.payload);
+        break;
+      case 'SET_CHART_TYPE':
+        handleSetChartType(message.payload);
+        break;
+      case 'SET_POSITION_LINES':
+        handleSetPositionLines(message.payload);
+        break;
+      case 'REALTIME_UPDATE':
+        handleRealtimeUpdate(message.payload);
+        break;
+      case 'TOGGLE_VOLUME':
+        handleToggleVolume(message.payload);
+        break;
+    }
+  } catch (error) {
+    sendToReactNative('ERROR', { message: error.message });
+  }
+}
+
+window.addEventListener('message', handleMessage);
+document.addEventListener('message', handleMessage);
+
+// ============================================
+// Data Handlers
+// ============================================
+var INTERVAL_MS_TO_TV = {
+  60000: '1',
+  180000: '3',
+  300000: '5',
+  900000: '15',
+  1800000: '30',
+  3600000: '60',
+  7200000: '120',
+  14400000: '240',
+  28800000: '480',
+  43200000: '720',
+  86400000: '1D',
+  259200000: '3D',
+  604800000: '1W',
+  2592000000: '1M',
+};
+
+function detectResolution(data) {
+  if (data.length < 2) return '5';
+  // Use median of first few diffs to avoid gaps skewing the result
+  var diffs = [];
+  var len = Math.min(data.length - 1, 10);
+  for (var i = 0; i < len; i++) {
+    diffs.push(data[i + 1].time - data[i].time);
+  }
+  diffs.sort(function (a, b) {
+    return a - b;
+  });
+  var median = diffs[Math.floor(diffs.length / 2)];
+
+  // Find closest match
+  var keys = Object.keys(INTERVAL_MS_TO_TV);
+  var best = '5';
+  var bestDist = Infinity;
+  for (var k = 0; k < keys.length; k++) {
+    var d = Math.abs(Number(keys[k]) - median);
+    if (d < bestDist) {
+      bestDist = d;
+      best = INTERVAL_MS_TO_TV[keys[k]];
+    }
+  }
+  return best;
+}
+
+function handleSetOHLCVData(payload) {
+  if (!payload || !payload.data || payload.data.length === 0) return;
+
+  window.ohlcvData = payload.data;
+
+  var newResolution = detectResolution(window.ohlcvData);
+  var hasPending = !!window.pendingGetBarsCallback;
+
+  if (hasPending) {
+    var pending = window.pendingGetBarsCallback;
+    window.pendingGetBarsCallback = null;
+    window.currentResolution = newResolution;
+    resolvePendingGetBars(pending);
+    return;
+  }
+
+  if (window.chartWidget && window.isChartReady) {
+    if (window.currentResolution !== newResolution) {
+      window.currentResolution = newResolution;
+      try {
+        window.chartWidget
+          .activeChart()
+          .setResolution(newResolution, function () {});
+      } catch (e) {
+        window.chartWidget.remove();
+        window.chartWidget = null;
+        window.isChartReady = false;
+        window.activeStudies = {};
+        window.volumeStudyId = null;
+        window.positionShapeIds = [];
+        window.realtimeCallbacks = {};
+        window.pendingGetBarsCallback = null;
+        initChart();
+      }
+    } else {
+      try {
+        window.chartWidget.activeChart().resetData();
+      } catch (e) {
+        // resetData can fail if chart is in a transitional state
+      }
+    }
+  } else if (window.chartWidget && !window.isChartReady) {
+    window.currentResolution = newResolution;
+  } else if (!window.chartWidget) {
+    window.currentResolution = newResolution;
+    libraryLoadAttempts = 0;
+    initChart();
+  }
+}
+
+// ============================================
+// Realtime Update Handler
+// ============================================
+function handleRealtimeUpdate(payload) {
+  if (!payload || !payload.bar) return;
+
+  var bar = payload.bar;
+
+  // Append or update the last bar in the local data store
+  if (window.ohlcvData.length > 0) {
+    var lastBar = window.ohlcvData[window.ohlcvData.length - 1];
+    if (lastBar.time === bar.time) {
+      window.ohlcvData[window.ohlcvData.length - 1] = bar;
+    } else {
+      window.ohlcvData.push(bar);
+    }
+  } else {
+    window.ohlcvData.push(bar);
+  }
+
+  // Forward to all active TradingView subscribeBars callbacks
+  var tick = {
+    time: bar.time,
+    open: bar.open,
+    high: bar.high,
+    low: bar.low,
+    close: bar.close,
+    volume: bar.volume,
+  };
+  var guids = Object.keys(window.realtimeCallbacks);
+  for (var i = 0; i < guids.length; i++) {
+    window.realtimeCallbacks[guids[i]](tick);
+  }
+}
+
+// ============================================
+// Indicator Handlers
+//
+// Curated subset for Token Details mobile UX. Consumers needing the full
+// TradingView study picker can re-enable header_widget via disabledFeatures
+// prop, which exposes TradingView's native indicator UI.
+// ============================================
+function handleAddIndicator(payload) {
+  if (!window.chartWidget || !window.isChartReady) return;
+  if (!payload || !payload.name) return;
+
+  var indicatorName = payload.name;
+
+  if (window.activeStudies[indicatorName]) {
+    return;
+  }
+
+  try {
+    var chart = window.chartWidget.activeChart();
+    var studyName, inputs;
+
+    switch (indicatorName) {
+      case 'MACD':
+        studyName = 'MACD';
+        inputs = { in_0: 12, in_1: 26, in_2: 9 };
+        break;
+      case 'RSI':
+        studyName = 'Relative Strength Index';
+        inputs = { in_0: 14 };
+        break;
+      case 'MA200':
+        studyName = 'Moving Average';
+        inputs = { in_0: 200 };
+        break;
+      default:
+        studyName = indicatorName;
+        inputs = payload.inputs || {};
+        break;
+    }
+
+    chart
+      .createStudy(studyName, false, false, inputs)
+      .then(function (studyId) {
+        window.activeStudies[indicatorName] = studyId;
+        sendToReactNative('INDICATOR_ADDED', {
+          name: indicatorName,
+          id: String(studyId),
+        });
+      })
+      .catch(function (error) {
+        sendToReactNative('ERROR', {
+          message: 'Failed to add indicator: ' + error.message,
+        });
+      });
+  } catch (error) {
+    sendToReactNative('ERROR', { message: error.message });
+  }
+}
+
+function handleRemoveIndicator(payload) {
+  if (!window.chartWidget || !window.isChartReady) return;
+  if (!payload || !payload.name) return;
+
+  var indicatorName = payload.name;
+  var studyId = window.activeStudies[indicatorName];
+
+  if (!studyId) return;
+
+  try {
+    var chart = window.chartWidget.activeChart();
+    chart.removeEntity(studyId);
+    delete window.activeStudies[indicatorName];
+    sendToReactNative('INDICATOR_REMOVED', { name: indicatorName });
+  } catch (error) {
+    sendToReactNative('ERROR', { message: error.message });
+  }
+}
+
+// ============================================
+// Chart Type Handler
+// ============================================
+function handleSetChartType(payload) {
+  if (!window.chartWidget || !window.isChartReady) return;
+
+  try {
+    var chart = window.chartWidget.activeChart();
+    chart.setChartType(payload.type);
+  } catch (error) {
+    sendToReactNative('ERROR', { message: error.message });
+  }
+}
+
+// ============================================
+// Position Lines (unified SET_POSITION_LINES)
+// ============================================
+
+function clearPositionLines() {
+  if (!window.chartWidget || !window.isChartReady) return;
+
+  try {
+    var chart = window.chartWidget.activeChart();
+    for (var i = 0; i < window.positionShapeIds.length; i++) {
+      try {
+        chart.removeEntity(window.positionShapeIds[i]);
+      } catch (e) {
+        // Shape may already be removed
+      }
+    }
+    window.positionShapeIds = [];
+  } catch (error) {
+    sendToReactNative('ERROR', {
+      message: 'Failed to clear position lines: ' + error.message,
+    });
+  }
+}
+
+function handleSetPositionLines(payload) {
+  if (!window.chartWidget || !window.isChartReady) return;
+
+  // Clear existing lines first
+  clearPositionLines();
+
+  // null or missing position means "clear only"
+  if (!payload || !payload.position) return;
+
+  var position = payload.position;
+  var theme = window.CONFIG.theme;
+
+  try {
+    var chart = window.chartWidget.activeChart();
+    var lines = [];
+
+    if (position.entryPrice) {
+      lines.push({
+        price: position.entryPrice,
+        text: 'Entry',
+        color: '#858585',
+        lineStyle: 2,
+      });
+    }
+    if (position.takeProfitPrice) {
+      lines.push({
+        price: position.takeProfitPrice,
+        text: 'TP',
+        color: theme.successColor,
+        lineStyle: 2,
+      });
+    }
+    if (position.stopLossPrice) {
+      lines.push({
+        price: position.stopLossPrice,
+        text: 'SL',
+        color: '#858585',
+        lineStyle: 2,
+      });
+    }
+    if (position.liquidationPrice) {
+      lines.push({
+        price: position.liquidationPrice,
+        text: 'Liq',
+        color: theme.errorColor,
+        lineStyle: 2,
+      });
+    }
+    // TODO: currentPrice is defined in PositionLines but not yet rendered here.
+    // Add a line for position.currentPrice (e.g. a solid line showing live mark
+    // price) when the Perps integration is ready.
+
+    for (var i = 0; i < lines.length; i++) {
+      (function (line) {
+        chart
+          .createShape(
+            { price: line.price },
+            {
+              shape: 'horizontal_line',
+              lock: true,
+              disableSelection: true,
+              disableSave: true,
+              disableUndo: true,
+              text: line.text,
+              overrides: {
+                linecolor: line.color,
+                linestyle: line.lineStyle,
+                linewidth: 1,
+                showLabel: true,
+                textcolor: line.color,
+                fontsize: 11,
+                horzLabelsAlign: 'right',
+                showPrice: true,
+              },
+            },
+          )
+          .then(function (entityId) {
+            if (entityId) {
+              window.positionShapeIds.push(entityId);
+            }
+          })
+          .catch(function () {
+            // Shape creation can fail silently
+          });
+      })(lines[i]);
+    }
+  } catch (error) {
+    sendToReactNative('ERROR', {
+      message: 'Failed to add position lines: ' + error.message,
+    });
+  }
+}
+
+// ============================================
+// Volume Helpers
+// ============================================
+window.volumeStudyId = null;
+
+function createVolumeStudy() {
+  if (!window.chartWidget || !window.isChartReady) return;
+  if (window.volumeStudyId) return;
+
+  try {
+    window.chartWidget
+      .activeChart()
+      .createStudy('Volume', false, false, {}, { 'volume ma.visible': false })
+      .then(function (studyId) {
+        window.volumeStudyId = studyId;
+      })
+      .catch(function () {
+        // Volume study creation failed
+      });
+  } catch (e) {
+    // Not critical
+  }
+}
+
+function handleToggleVolume(payload) {
+  if (!window.chartWidget || !window.isChartReady) return;
+  if (!payload) return;
+
+  if (payload.visible && !window.volumeStudyId) {
+    createVolumeStudy();
+  } else if (!payload.visible && window.volumeStudyId) {
+    try {
+      window.chartWidget.activeChart().removeEntity(window.volumeStudyId);
+    } catch (e) {
+      // Already removed
+    }
+    window.volumeStudyId = null;
+  }
+}
+
+// ============================================
+// Custom Datafeed Implementation
+// ============================================
+
+/**
+ * TradingView variable_tick_size string.
+ *
+ * Tells TradingView to dynamically adjust pricescale/minmov based on
+ * the current price level. Format: "tickSize threshold tickSize threshold …"
+ * where each tickSize applies for prices below the next threshold, and
+ * the last tickSize applies to all prices above the last threshold.
+ *
+ * This replaces a manual pricescale computation and adapts automatically
+ * as prices change (e.g. meme token pumps from $0.0001 to $1).
+ */
+var VARIABLE_TICK_SIZE = [
+  '0.0000000001',
+  '0.000001', // prices < $0.000001 → 10 dp
+  '0.00000001',
+  '0.0001', // prices < $0.0001   →  8 dp
+  '0.000001',
+  '0.01', // prices < $0.01     →  6 dp
+  '0.0001',
+  '1', // prices < $1        →  4 dp
+  '0.01',
+  '10000', // prices < $10000    →  2 dp
+  '0.1', // prices ≥ $10000    →  1 dp
+].join(' ');
+
+function filterBarsForRange(fromMs, toMs, countBack) {
+  var barsInRange = [];
+  for (var i = 0; i < window.ohlcvData.length; i++) {
+    var b = window.ohlcvData[i];
+    if (b.time >= fromMs && b.time < toMs) {
+      barsInRange.push({
+        time: b.time,
+        open: b.open,
+        high: b.high,
+        low: b.low,
+        close: b.close,
+        volume: b.volume,
+      });
+    }
+  }
+
+  if (barsInRange.length < countBack) {
+    var allBeforeTo = [];
+    for (var j = 0; j < window.ohlcvData.length; j++) {
+      if (window.ohlcvData[j].time < toMs) {
+        allBeforeTo.push(window.ohlcvData[j]);
+      }
+    }
+    var startIdx = Math.max(0, allBeforeTo.length - countBack);
+    barsInRange = [];
+    for (var k = startIdx; k < allBeforeTo.length; k++) {
+      var bar = allBeforeTo[k];
+      barsInRange.push({
+        time: bar.time,
+        open: bar.open,
+        high: bar.high,
+        low: bar.low,
+        close: bar.close,
+        volume: bar.volume,
+      });
+    }
+  }
+
+  return barsInRange;
+}
+
+function resolvePendingGetBars(pending) {
+  var currentOldest =
+    window.ohlcvData.length > 0 ? window.ohlcvData[0].time : 0;
+
+  if (currentOldest >= pending.oldestAtDefer) {
+    pending.onResult([], { noData: true });
+    return;
+  }
+
+  // Return only the newly fetched bars (older than what we had before deferring).
+  // TradingView already has bars from oldestAtDefer onward.
+  var bars = [];
+  for (var i = 0; i < window.ohlcvData.length; i++) {
+    var b = window.ohlcvData[i];
+    if (b.time < pending.oldestAtDefer) {
+      bars.push({
+        time: b.time,
+        open: b.open,
+        high: b.high,
+        low: b.low,
+        close: b.close,
+        volume: b.volume,
+      });
+    }
+  }
+
+  pending.onResult(bars, { noData: false });
+}
+
+var customDatafeed = {
+  onReady: function (callback) {
+    setTimeout(function () {
+      callback({
+        supported_resolutions: [
+          '1',
+          '3',
+          '5',
+          '15',
+          '30',
+          '60',
+          '120',
+          '240',
+          '480',
+          '720',
+          '1D',
+          '3D',
+          '1W',
+          '1M',
+        ],
+        supports_marks: false,
+        supports_timescale_marks: false,
+        supports_time: true,
+      });
+    }, 0);
+  },
+
+  searchSymbols: function (userInput, exchange, symbolType, onResult) {
+    onResult([]);
+  },
+
+  resolveSymbol: function (symbolName, onResolve) {
+    setTimeout(function () {
+      onResolve({
+        name: symbolName,
+        ticker: symbolName,
+        description: symbolName,
+        type: 'crypto',
+        session: '24x7',
+        timezone: 'Etc/UTC',
+        exchange: '',
+        minmov: 1,
+        pricescale: 100,
+        variable_tick_size: VARIABLE_TICK_SIZE,
+        has_intraday: true,
+        has_daily: true,
+        has_weekly_and_monthly: true,
+        supported_resolutions: [
+          '1',
+          '3',
+          '5',
+          '15',
+          '30',
+          '60',
+          '120',
+          '240',
+          '480',
+          '720',
+          '1D',
+          '3D',
+          '1W',
+          '1M',
+        ],
+        volume_precision: 0,
+        data_status: 'streaming',
+      });
+    }, 0);
+  },
+
+  getBars: function (symbolInfo, resolution, periodParams, onResult, onError) {
+    try {
+      var fromMs = periodParams.from * 1000;
+      var toMs = periodParams.to * 1000;
+      var countBack = periodParams.countBack;
+      var firstRequest = periodParams.firstDataRequest;
+
+      var bars = filterBarsForRange(fromMs, toMs, countBack);
+
+      if (bars.length > 0) {
+        onResult(bars, { noData: false });
+        return;
+      }
+
+      if (firstRequest || window.ohlcvData.length === 0) {
+        onResult([], { noData: true });
+        return;
+      }
+
+      var oldestTs = window.ohlcvData[0].time;
+
+      window.pendingGetBarsCallback = {
+        onResult: onResult,
+        oldestAtDefer: oldestTs,
+      };
+
+      sendToReactNative('NEED_MORE_HISTORY', { oldestTimestamp: oldestTs });
+    } catch (error) {
+      onError(error.message);
+    }
+  },
+
+  subscribeBars: function (symbolInfo, resolution, onTick, listenerGuid) {
+    window.realtimeCallbacks[listenerGuid] = onTick;
+  },
+
+  unsubscribeBars: function (listenerGuid) {
+    delete window.realtimeCallbacks[listenerGuid];
+  },
+};
+
+// ============================================
+// Library Loading
+// ============================================
+var libraryLoadAttempts = 0;
+var maxLibraryLoadAttempts = 50;
+
+function loadLibrary() {
+  var scriptUrl = window.CONFIG.libraryUrl + 'charting_library.js';
+
+  var script = document.createElement('script');
+  script.type = 'text/javascript';
+  script.src = scriptUrl;
+  script.onload = function () {
+    window.libraryLoaded = true;
+    if (window.ohlcvData.length > 0) {
+      initChart();
+    }
+  };
+  script.onerror = function () {
+    window.libraryError =
+      'Failed to load TradingView library. URL: ' + scriptUrl;
+    document.getElementById('loading-overlay').innerHTML =
+      '<div style="text-align:center;padding:20px;">' +
+      '<p style="color:#FF6B6B;margin-bottom:10px;">Failed to load chart library</p>' +
+      '<p style="font-size:12px;color:#888;">URL: ' +
+      scriptUrl +
+      '</p>' +
+      '<p style="font-size:12px;color:#888;">Check S3 access or CORS configuration.</p>' +
+      '</div>';
+    sendToReactNative('ERROR', { message: window.libraryError });
+  };
+  document.head.appendChild(script);
+}
+
+// ============================================
+// Chart Initialization
+// ============================================
+function initChart() {
+  if (window.chartWidget) return;
+
+  if (typeof TradingView === 'undefined') {
+    libraryLoadAttempts++;
+    if (libraryLoadAttempts >= maxLibraryLoadAttempts) {
+      var errorMsg =
+        'TradingView library failed to initialize after ' +
+        maxLibraryLoadAttempts * 100 +
+        'ms';
+      document.getElementById('loading-overlay').textContent = errorMsg;
+      sendToReactNative('ERROR', { message: errorMsg });
+      return;
+    }
+    setTimeout(initChart, 100);
+    return;
+  }
+
+  if (window.ohlcvData.length === 0) {
+    return;
+  }
+
+  try {
+    var theme = window.CONFIG.theme;
+    var features = window.CONFIG.features || {};
+
+    // Disabled features are passed from React Native via CONFIG.features.disabledFeatures.
+    // Defaults are set in DEFAULT_DISABLED_FEATURES (AdvancedChart.types.ts) and are
+    // optimized for the Token Details mobile UX. Consumers needing TradingView's
+    // native UI (e.g. Perps) can override via the disabledFeatures prop.
+    var disabledFeatures = (features.disabledFeatures || []).slice();
+
+    if (!features.enableDrawingTools) {
+      disabledFeatures.push('left_toolbar');
+      disabledFeatures.push('context_menus');
+    }
+
+    window.chartWidget = new TradingView.widget({
+      symbol: window.currentSymbol,
+      interval: window.currentResolution || '5',
+      container: 'tv_chart_container',
+      datafeed: customDatafeed,
+      library_path: window.CONFIG.libraryUrl,
+      locale: 'en',
+      fullscreen: false,
+      autosize: true,
+      theme: 'Dark',
+
+      disabled_features: disabledFeatures,
+      enabled_features: ['study_templates', 'iframe_loading_same_origin'],
+
+      overrides: {
+        'paneProperties.background': theme.backgroundColor,
+        'paneProperties.backgroundType': 'solid',
+        'paneProperties.vertGridProperties.color': theme.borderColor,
+        'paneProperties.horzGridProperties.color': theme.borderColor,
+        'scalesProperties.textColor': theme.textColor,
+        'scalesProperties.lineColor': theme.borderColor,
+        'scalesProperties.fontSize': 11,
+        'scalesProperties.showStudyLastValue': true,
+        'scalesProperties.showSeriesLastValue': true,
+        'scalesProperties.showSymbolLabels': true,
+        'scalesProperties.showRightScale': true,
+        'scalesProperties.showLeftScale': false,
+        'paneProperties.bottomMargin': 5,
+        'mainSeriesProperties.candleStyle.upColor': theme.successColor,
+        'mainSeriesProperties.candleStyle.downColor': theme.errorColor,
+        'mainSeriesProperties.candleStyle.borderUpColor': theme.successColor,
+        'mainSeriesProperties.candleStyle.borderDownColor': theme.errorColor,
+        'mainSeriesProperties.candleStyle.wickUpColor': theme.successColor,
+        'mainSeriesProperties.candleStyle.wickDownColor': theme.errorColor,
+      },
+
+      loading_screen: {
+        backgroundColor: theme.backgroundColor,
+        foregroundColor: theme.primaryColor,
+      },
+    });
+
+    window.chartWidget.onChartReady(function () {
+      window.isChartReady = true;
+      document.getElementById('loading-overlay').classList.add('hidden');
+
+      try {
+        var timeScale = window.chartWidget.activeChart().getTimeScale();
+        timeScale.defaultRightOffset().setValue(0);
+        timeScale.setRightOffset(0);
+      } catch (e) {}
+
+      sendToReactNative('CHART_READY', {});
+
+      // Set up crosshair move listener for OHLC overlay
+      try {
+        window.chartWidget
+          .activeChart()
+          .crossHairMoved()
+          .subscribe(null, function (params) {
+            if (
+              params &&
+              params.price !== undefined &&
+              params.time !== undefined
+            ) {
+              // Find the bar closest to the crosshair time
+              var targetTime = params.time * 1000;
+              var closestBar = null;
+              var minDiff = Infinity;
+              for (var i = 0; i < window.ohlcvData.length; i++) {
+                var diff = Math.abs(window.ohlcvData[i].time - targetTime);
+                if (diff < minDiff) {
+                  minDiff = diff;
+                  closestBar = window.ohlcvData[i];
+                }
+              }
+              if (closestBar) {
+                sendToReactNative('CROSSHAIR_MOVE', {
+                  data: {
+                    time: closestBar.time,
+                    open: closestBar.open,
+                    high: closestBar.high,
+                    low: closestBar.low,
+                    close: closestBar.close,
+                    volume: closestBar.volume,
+                  },
+                });
+              }
+            } else {
+              sendToReactNative('CROSSHAIR_MOVE', { data: null });
+            }
+          });
+      } catch (e) {
+        // Crosshair subscription not critical
+      }
+
+      // Auto-add volume study if showVolume is true (no SMA overlay)
+      if (features.showVolume) {
+        createVolumeStudy();
+      }
+
+      // Process pending messages
+      window.pendingMessages.forEach(function (msg) {
+        handleMessage({ data: msg });
+      });
+      window.pendingMessages = [];
+    });
+  } catch (error) {
+    sendToReactNative('ERROR', {
+      message: 'Failed to initialize chart: ' + error.message,
+    });
+  }
+}
+
+// ============================================
+// Start
+// ============================================
+if (document.readyState === 'loading') {
+  document.addEventListener('DOMContentLoaded', function () {
+    loadLibrary();
+  });
+} else {
+  loadLibrary();
+}
+`;
diff --git a/app/components/UI/Charts/AdvancedChart/webview/index.ts b/app/components/UI/Charts/AdvancedChart/webview/index.ts
new file mode 100644
index 000000000000..4bc83b6113ba
--- /dev/null
+++ b/app/components/UI/Charts/AdvancedChart/webview/index.ts
@@ -0,0 +1 @@
+export { default as chartLogicScript } from './chartLogicString';
diff --git a/app/components/UI/Charts/AdvancedChart/webview/syncChartLogic.js b/app/components/UI/Charts/AdvancedChart/webview/syncChartLogic.js
new file mode 100644
index 000000000000..78ff071c1b87
--- /dev/null
+++ b/app/components/UI/Charts/AdvancedChart/webview/syncChartLogic.js
@@ -0,0 +1,31 @@
+#!/usr/bin/env node
+/* eslint-disable import/no-commonjs, import/no-nodejs-modules, no-console */
+/**
+ * Sync script that reads chartLogic.js and exports it as a string in chartLogicString.ts
+ *
+ * Run this after editing chartLogic.js:
+ *   node app/components/UI/Charts/AdvancedChart/webview/syncChartLogic.js
+ */
+
+const fs = require('fs');
+const path = require('path');
+
+const sourceFile = path.join(__dirname, 'chartLogic.js');
+const targetFile = path.join(__dirname, 'chartLogicString.ts');
+
+const jsContent = fs.readFileSync(sourceFile, 'utf8');
+
+const tsContent = `/**
+ * AUTO-GENERATED - DO NOT EDIT DIRECTLY
+ *
+ * This file is generated from chartLogic.js by syncChartLogic.js
+ * Edit chartLogic.js instead, then run:
+ *   node app/components/UI/Charts/AdvancedChart/webview/syncChartLogic.js
+ */
+
+// eslint-disable-next-line import/no-default-export
+export default \`${jsContent.replace(/\\/g, '\\\\').replace(/`/g, '\\`').replace(/\${/g, '\\${')}\`;
+`;
+
+fs.writeFileSync(targetFile, tsContent);
+console.log('✓ Synced chartLogic.js → chartLogicString.ts');
diff --git a/app/components/UI/CollectibleModal/__snapshots__/CollectibleModal.test.tsx.snap b/app/components/UI/CollectibleModal/__snapshots__/CollectibleModal.test.tsx.snap
index ef3d565c7e6f..026e17c80273 100644
--- a/app/components/UI/CollectibleModal/__snapshots__/CollectibleModal.test.tsx.snap
+++ b/app/components/UI/CollectibleModal/__snapshots__/CollectibleModal.test.tsx.snap
@@ -30,7 +30,7 @@ exports[`CollectibleModal renders correctly 1`] = `
       style={
         [
           {
-            "backgroundColor": "#3f434a66",
+            "backgroundColor": "#0a0d135c",
             "bottom": 0,
             "left": 0,
             "position": "absolute",
@@ -116,7 +116,7 @@ exports[`CollectibleModal renders correctly 1`] = `
               [
                 {
                   "alignItems": "center",
-                  "backgroundColor": "#f3f5f9",
+                  "backgroundColor": "#f3f3f4",
                   "borderRadius": 8,
                   "flex": 1,
                   "justifyContent": "center",
@@ -149,7 +149,7 @@ exports[`CollectibleModal renders correctly 1`] = `
               style={
                 [
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 30,
                     "marginVertical": 2,
@@ -282,7 +282,7 @@ exports[`CollectibleModal renders correctly 1`] = `
           <View
             style={
               {
-                "backgroundColor": "#b7bbc8",
+                "backgroundColor": "#949596",
                 "borderRadius": 4,
                 "height": 5,
                 "width": 48,
@@ -306,7 +306,7 @@ exports[`CollectibleModal renders correctly 1`] = `
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 30,
                       "marginVertical": 2,
@@ -324,7 +324,7 @@ exports[`CollectibleModal renders correctly 1`] = `
                     undefined,
                     undefined,
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                     },
                     undefined,
                     undefined,
@@ -353,7 +353,7 @@ exports[`CollectibleModal renders correctly 1`] = `
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 30,
                       "marginVertical": 2,
@@ -369,7 +369,7 @@ exports[`CollectibleModal renders correctly 1`] = `
                     undefined,
                     undefined,
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                     },
                     undefined,
                     undefined,
@@ -447,7 +447,7 @@ exports[`CollectibleModal renders correctly 1`] = `
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 30,
                         "marginVertical": 2,
@@ -529,7 +529,7 @@ exports[`CollectibleModal renders correctly 1`] = `
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 30,
                       "marginVertical": 2,
@@ -541,14 +541,14 @@ exports[`CollectibleModal renders correctly 1`] = `
                     },
                     undefined,
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                     },
                     undefined,
                     undefined,
                     undefined,
                     undefined,
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                     },
                     undefined,
                     undefined,
@@ -582,7 +582,7 @@ exports[`CollectibleModal renders correctly 1`] = `
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 30,
                       "marginVertical": 2,
diff --git a/app/components/UI/CustomAlert/__snapshots__/index.test.tsx.snap b/app/components/UI/CustomAlert/__snapshots__/index.test.tsx.snap
index b1e98438d610..2732dc3408e4 100644
--- a/app/components/UI/CustomAlert/__snapshots__/index.test.tsx.snap
+++ b/app/components/UI/CustomAlert/__snapshots__/index.test.tsx.snap
@@ -51,7 +51,7 @@ exports[`CustomAlert should render correctly 1`] = `
       onStartShouldSetResponder={[Function]}
       style={
         {
-          "backgroundColor": "#3f434a66",
+          "backgroundColor": "#0a0d135c",
           "bottom": 0,
           "height": 1334,
           "left": 0,
diff --git a/app/components/UI/DeFiPositions/DeFiPositionsList.test.tsx b/app/components/UI/DeFiPositions/DeFiPositionsList.test.tsx
index 24e837cbdc05..dbd9422ff8a0 100644
--- a/app/components/UI/DeFiPositions/DeFiPositionsList.test.tsx
+++ b/app/components/UI/DeFiPositions/DeFiPositionsList.test.tsx
@@ -4,6 +4,8 @@ import { backgroundState } from '../../../util/test/initial-root-state';
 import DeFiPositionsList from './DeFiPositionsList';
 import { RootState } from '../../../reducers';
 import { WalletViewSelectorsIDs } from '../../Views/Wallet/WalletView.testIds';
+import { useAnalytics } from '../../hooks/useAnalytics/useAnalytics';
+import { createMockUseAnalyticsHook } from '../../../util/test/analyticsMock';
 
 jest.mock('../../../util/networks', () => ({
   ...jest.requireActual('../../../util/networks'),
@@ -555,6 +557,110 @@ describe('DeFiPositionsList', () => {
     });
   });
 
+  describe('Position Screen Viewed Analytics', () => {
+    let mockTrackEvent: jest.Mock;
+    let mockAddProperties: jest.Mock;
+
+    beforeEach(() => {
+      mockTrackEvent = jest.fn();
+      mockAddProperties = jest.fn().mockReturnThis();
+      jest.mocked(useAnalytics).mockReturnValue(
+        createMockUseAnalyticsHook({
+          trackEvent: mockTrackEvent,
+          createEventBuilder: jest.fn().mockReturnValue({
+            addProperties: mockAddProperties,
+            addSensitiveProperties: jest.fn().mockReturnThis(),
+            removeProperties: jest.fn().mockReturnThis(),
+            removeSensitiveProperties: jest.fn().mockReturnThis(),
+            setSaveDataRecording: jest.fn().mockReturnThis(),
+            build: jest.fn(),
+          }),
+        }),
+      );
+    });
+
+    it('tracks Position Screen Viewed when isFullView is true and positions are loaded', async () => {
+      const { findByTestId } = renderWithProvider(
+        <DeFiPositionsList tabLabel="DeFi" isFullView />,
+        { state: mockInitialState },
+      );
+
+      await findByTestId(WalletViewSelectorsIDs.DEFI_POSITIONS_LIST);
+
+      expect(mockTrackEvent).toHaveBeenCalled();
+      expect(mockAddProperties).toHaveBeenCalledWith(
+        expect.objectContaining({
+          item_count: 1,
+          location: 'homepage',
+          is_empty: false,
+          screen_type: 'defi',
+        }),
+      );
+    });
+
+    it('tracks Position Screen Viewed with is_empty true when no positions are present', async () => {
+      const defiPositionsModule = jest.requireMock(
+        '../../../selectors/defiPositionsController',
+      );
+      defiPositionsModule.selectDeFiPositionsByAddress.mockReturnValue({});
+      defiPositionsModule.selectDefiPositionsByEnabledNetworks.mockReturnValue(
+        {},
+      );
+
+      const { findByTestId } = renderWithProvider(
+        <DeFiPositionsList tabLabel="DeFi" isFullView />,
+        { state: mockInitialState },
+      );
+
+      await findByTestId(WalletViewSelectorsIDs.DEFI_POSITIONS_CONTAINER);
+
+      expect(mockTrackEvent).toHaveBeenCalled();
+      expect(mockAddProperties).toHaveBeenCalledWith(
+        expect.objectContaining({
+          item_count: 0,
+          is_empty: true,
+          screen_type: 'defi',
+        }),
+      );
+    });
+
+    it('does not track Position Screen Viewed when isFullView is false', async () => {
+      const { findByTestId } = renderWithProvider(
+        <DeFiPositionsList tabLabel="DeFi" isFullView={false} />,
+        { state: mockInitialState },
+      );
+
+      await findByTestId(WalletViewSelectorsIDs.DEFI_POSITIONS_LIST);
+
+      expect(mockAddProperties).not.toHaveBeenCalledWith(
+        expect.objectContaining({ screen_type: 'defi', location: 'homepage' }),
+      );
+    });
+
+    it('does not track Position Screen Viewed when positions are still loading', async () => {
+      const defiPositionsModule = jest.requireMock(
+        '../../../selectors/defiPositionsController',
+      );
+      defiPositionsModule.selectDeFiPositionsByAddress.mockReturnValue(
+        undefined,
+      );
+      defiPositionsModule.selectDefiPositionsByEnabledNetworks.mockReturnValue(
+        undefined,
+      );
+
+      const { findByText } = renderWithProvider(
+        <DeFiPositionsList tabLabel="DeFi" isFullView />,
+        { state: mockInitialState },
+      );
+
+      await findByText('Loading DeFi positions...');
+
+      expect(mockAddProperties).not.toHaveBeenCalledWith(
+        expect.objectContaining({ screen_type: 'defi', location: 'homepage' }),
+      );
+    });
+  });
+
   describe('Homepage Redesign V1 Feature', () => {
     it('removes scrolling container in favour of global scroll container when isHomepageRedesignV1Enabled is true', async () => {
       const { findByTestId, queryByTestId } = renderWithProvider(
diff --git a/app/components/UI/DeFiPositions/DeFiPositionsList.tsx b/app/components/UI/DeFiPositions/DeFiPositionsList.tsx
index 7b93a2a55a51..9f8cd267251d 100644
--- a/app/components/UI/DeFiPositions/DeFiPositionsList.tsx
+++ b/app/components/UI/DeFiPositions/DeFiPositionsList.tsx
@@ -1,4 +1,4 @@
-import React, { useMemo } from 'react';
+import React, { useEffect, useMemo, useRef } from 'react';
 import { View } from 'react-native';
 import { strings } from '../../../../locales/i18n';
 import { useSelector } from 'react-redux';
@@ -31,6 +31,8 @@ import { WalletViewSelectorsIDs } from '../../Views/Wallet/WalletView.testIds';
 import { DefiEmptyState } from '../DefiEmptyState';
 import { selectHomepageRedesignV1Enabled } from '../../../selectors/featureFlagController/homepage';
 import ConditionalScrollView from '../../../component-library/components-temp/ConditionalScrollView';
+import { useAnalytics } from '../../hooks/useAnalytics/useAnalytics';
+import { MetaMetricsEvents } from '../../../core/Analytics';
 
 export interface DeFiPositionsListProps {
   tabLabel: string;
@@ -41,6 +43,8 @@ const DeFiPositionsList: React.FC<DeFiPositionsListProps> = ({
   isFullView = false,
 }) => {
   const { styles } = useStyles(styleSheet, undefined);
+  const { trackEvent, createEventBuilder } = useAnalytics();
+  const hasTrackedScreenViewRef = useRef(false);
   const tokenSortConfig = useSelector(selectTokenSortConfig);
   const defiPositions = useSelector(selectDeFiPositionsByAddress);
   const defiPositionsByEnabledNetworks = useSelector(
@@ -87,6 +91,26 @@ const DeFiPositionsList: React.FC<DeFiPositionsListProps> = ({
     return sortAssets(defiPositionsList, defiSortConfig);
   }, [defiPositions, tokenSortConfig, defiPositionsByEnabledNetworks]);
 
+  useEffect(() => {
+    if (
+      !isFullView ||
+      !Array.isArray(formattedDeFiPositions) ||
+      hasTrackedScreenViewRef.current
+    )
+      return;
+    hasTrackedScreenViewRef.current = true;
+    trackEvent(
+      createEventBuilder(MetaMetricsEvents.POSITION_SCREEN_VIEWED)
+        .addProperties({
+          item_count: formattedDeFiPositions.length,
+          location: 'homepage',
+          is_empty: formattedDeFiPositions.length === 0,
+          screen_type: 'defi',
+        })
+        .build(),
+    );
+  }, [isFullView, formattedDeFiPositions, trackEvent, createEventBuilder]);
+
   if (!formattedDeFiPositions) {
     if (formattedDeFiPositions === undefined) {
       // Position data is still loading
diff --git a/app/components/UI/DeFiPositions/DeFiPositionsListItem.tsx b/app/components/UI/DeFiPositions/DeFiPositionsListItem.tsx
index ad406e53d39f..ea2f7798045c 100644
--- a/app/components/UI/DeFiPositions/DeFiPositionsListItem.tsx
+++ b/app/components/UI/DeFiPositions/DeFiPositionsListItem.tsx
@@ -135,7 +135,7 @@ const DeFiPositionsListItem: React.FC<DeFiPositionsListItemProps> = ({
       />
 
       <View style={styles.contentWrapper}>
-        <Text variant={TextVariant.BodyLGMedium}>
+        <Text variant={TextVariant.BodyMDMedium}>
           {protocolAggregate.protocolDetails.name}
         </Text>
         <Text variant={TextVariant.BodySMMedium} color={TextColor.Alternative}>
@@ -145,7 +145,7 @@ const DeFiPositionsListItem: React.FC<DeFiPositionsListItemProps> = ({
 
       <View style={styles.balance}>
         <SensitiveText
-          variant={TextVariant.BodyLGMedium}
+          variant={TextVariant.BodyMDMedium}
           isHidden={privacyMode}
           length={SensitiveTextLength.Medium}
         >
diff --git a/app/components/UI/DeleteWalletModal/__snapshots__/index.test.tsx.snap b/app/components/UI/DeleteWalletModal/__snapshots__/index.test.tsx.snap
index 77149ea1e1a6..54e3aa677775 100644
--- a/app/components/UI/DeleteWalletModal/__snapshots__/index.test.tsx.snap
+++ b/app/components/UI/DeleteWalletModal/__snapshots__/index.test.tsx.snap
@@ -334,7 +334,7 @@ exports[`DeleteWalletModal bottom sheet renders matching snapshot 1`] = `
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -384,7 +384,7 @@ exports[`DeleteWalletModal bottom sheet renders matching snapshot 1`] = `
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -421,7 +421,7 @@ exports[`DeleteWalletModal bottom sheet renders matching snapshot 1`] = `
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -446,9 +446,9 @@ exports[`DeleteWalletModal bottom sheet renders matching snapshot 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Bold",
-                                  "fontSize": 18,
+                                  "fontSize": 20,
                                   "letterSpacing": 0,
                                   "lineHeight": 24,
                                   "marginLeft": "auto",
@@ -465,7 +465,7 @@ exports[`DeleteWalletModal bottom sheet renders matching snapshot 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -500,7 +500,7 @@ exports[`DeleteWalletModal bottom sheet renders matching snapshot 1`] = `
                                 }
                               >
                                 <SvgMock
-                                  color="#b7bbc8"
+                                  color="#babbbe"
                                   fill="currentColor"
                                   height={20}
                                   name="FaceId"
@@ -516,7 +516,7 @@ exports[`DeleteWalletModal bottom sheet renders matching snapshot 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -531,7 +531,7 @@ exports[`DeleteWalletModal bottom sheet renders matching snapshot 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -557,7 +557,7 @@ exports[`DeleteWalletModal bottom sheet renders matching snapshot 1`] = `
                                 }
                               >
                                 <SvgMock
-                                  color="#b7bbc8"
+                                  color="#babbbe"
                                   fill="currentColor"
                                   height={20}
                                   name="SecurityKey"
@@ -573,7 +573,7 @@ exports[`DeleteWalletModal bottom sheet renders matching snapshot 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -588,7 +588,7 @@ exports[`DeleteWalletModal bottom sheet renders matching snapshot 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
diff --git a/app/components/UI/Earn/LendingLearnMoreModal/__snapshots__/LendingLearnMoreModal.test.tsx.snap b/app/components/UI/Earn/LendingLearnMoreModal/__snapshots__/LendingLearnMoreModal.test.tsx.snap
index 035fb0e543cb..2ea516dfc232 100644
--- a/app/components/UI/Earn/LendingLearnMoreModal/__snapshots__/LendingLearnMoreModal.test.tsx.snap
+++ b/app/components/UI/Earn/LendingLearnMoreModal/__snapshots__/LendingLearnMoreModal.test.tsx.snap
@@ -34,7 +34,7 @@ exports[`LendingLearnMoreModal render lending history apy chart 1`] = `
       style={
         [
           {
-            "backgroundColor": "#3f434a66",
+            "backgroundColor": "#0a0d135c",
             "bottom": 0,
             "left": 0,
             "position": "absolute",
@@ -84,7 +84,7 @@ exports[`LendingLearnMoreModal render lending history apy chart 1`] = `
           [
             {
               "backgroundColor": "#ffffff",
-              "borderColor": "#b7bbc866",
+              "borderColor": "#b4b4b566",
               "borderTopLeftRadius": 24,
               "borderTopRightRadius": 24,
               "borderWidth": 1,
@@ -161,7 +161,7 @@ exports[`LendingLearnMoreModal render lending history apy chart 1`] = `
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -239,7 +239,7 @@ exports[`LendingLearnMoreModal render lending history apy chart 1`] = `
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -285,7 +285,7 @@ exports[`LendingLearnMoreModal render lending history apy chart 1`] = `
                 style={
                   {
                     "alignItems": "center",
-                    "backgroundColor": "#3c4d9d0f",
+                    "backgroundColor": "#b4b4b528",
                     "borderRadius": 32,
                     "height": 36,
                     "justifyContent": "center",
@@ -298,7 +298,7 @@ exports[`LendingLearnMoreModal render lending history apy chart 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#686e7d",
+                      "color": "#66676a",
                       "fontFamily": "Geist-Medium",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -327,7 +327,7 @@ exports[`LendingLearnMoreModal render lending history apy chart 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#686e7d",
+                      "color": "#66676a",
                       "fontFamily": "Geist-Medium",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -356,7 +356,7 @@ exports[`LendingLearnMoreModal render lending history apy chart 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#686e7d",
+                      "color": "#66676a",
                       "fontFamily": "Geist-Medium",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -395,7 +395,7 @@ exports[`LendingLearnMoreModal render lending history apy chart 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Medium",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -549,7 +549,7 @@ exports[`LendingLearnMoreModal render lending history apy chart 1`] = `
             }
           >
             <SvgMock
-              color="#121314"
+              color="#131416"
               fill="currentColor"
               height={20}
               name="Plant"
@@ -572,7 +572,7 @@ exports[`LendingLearnMoreModal render lending history apy chart 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Bold",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -586,7 +586,7 @@ exports[`LendingLearnMoreModal render lending history apy chart 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -609,7 +609,7 @@ exports[`LendingLearnMoreModal render lending history apy chart 1`] = `
             }
           >
             <SvgMock
-              color="#121314"
+              color="#131416"
               fill="currentColor"
               height={20}
               name="Clock"
@@ -627,7 +627,7 @@ exports[`LendingLearnMoreModal render lending history apy chart 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Bold",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -641,7 +641,7 @@ exports[`LendingLearnMoreModal render lending history apy chart 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -677,7 +677,7 @@ exports[`LendingLearnMoreModal render lending history apy chart 1`] = `
               {
                 "alignItems": "center",
                 "alignSelf": "flex-start",
-                "backgroundColor": "#3c4d9d0f",
+                "backgroundColor": "#b4b4b528",
                 "borderColor": "transparent",
                 "borderRadius": 12,
                 "borderWidth": 1,
@@ -695,7 +695,7 @@ exports[`LendingLearnMoreModal render lending history apy chart 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Medium",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -717,7 +717,7 @@ exports[`LendingLearnMoreModal render lending history apy chart 1`] = `
               {
                 "alignItems": "center",
                 "alignSelf": "flex-start",
-                "backgroundColor": "#121314",
+                "backgroundColor": "#131416",
                 "borderRadius": 12,
                 "flex": 1,
                 "flexDirection": "row",
diff --git a/app/components/UI/Earn/Views/EarnInputView/__snapshots__/EarnInputView.test.tsx.snap b/app/components/UI/Earn/Views/EarnInputView/__snapshots__/EarnInputView.test.tsx.snap
index 730f4a6f348f..1e741f005b22 100644
--- a/app/components/UI/Earn/Views/EarnInputView/__snapshots__/EarnInputView.test.tsx.snap
+++ b/app/components/UI/Earn/Views/EarnInputView/__snapshots__/EarnInputView.test.tsx.snap
@@ -425,7 +425,7 @@ exports[`EarnInputView render matches snapshot 1`] = `
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "height": 24,
                                         "width": 24,
                                       },
@@ -466,7 +466,7 @@ exports[`EarnInputView render matches snapshot 1`] = `
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 16,
                                       "fontWeight": 400,
@@ -545,7 +545,7 @@ exports[`EarnInputView render matches snapshot 1`] = `
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#686e7d",
+                                          "color": "#66676a",
                                           "fontFamily": "Geist-Medium",
                                           "fontSize": 14,
                                           "letterSpacing": 0,
@@ -575,7 +575,7 @@ exports[`EarnInputView render matches snapshot 1`] = `
                                       testID="LendingMaxSafeWithdrawalTooltipIcon"
                                     >
                                       <SvgMock
-                                        color="#686e7d"
+                                        color="#66676a"
                                         fill="currentColor"
                                         height={20}
                                         name="Question"
@@ -594,7 +594,7 @@ exports[`EarnInputView render matches snapshot 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 14,
                                       "letterSpacing": 0,
@@ -660,7 +660,7 @@ exports[`EarnInputView render matches snapshot 1`] = `
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "letterSpacing": 0,
@@ -674,7 +674,7 @@ exports[`EarnInputView render matches snapshot 1`] = `
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#b7bbc8",
+                                          "color": "#babbbe",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "letterSpacing": 0,
@@ -698,7 +698,7 @@ exports[`EarnInputView render matches snapshot 1`] = `
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
                                       "backgroundColor": "#ffffff",
-                                      "borderColor": "#b7bbc866",
+                                      "borderColor": "#b4b4b566",
                                       "borderRadius": 16,
                                       "borderWidth": 1,
                                       "flexDirection": "row",
@@ -714,7 +714,7 @@ exports[`EarnInputView render matches snapshot 1`] = `
                                     accessibilityRole="none"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Medium",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -725,7 +725,7 @@ exports[`EarnInputView render matches snapshot 1`] = `
                                     0 USD
                                   </Text>
                                   <SvgMock
-                                    color="#121314"
+                                    color="#131416"
                                     fill="currentColor"
                                     height={16}
                                     name="SwapVertical"
@@ -744,7 +744,7 @@ exports[`EarnInputView render matches snapshot 1`] = `
                             <View
                               style={
                                 {
-                                  "borderColor": "#b7bbc866",
+                                  "borderColor": "#b4b4b566",
                                   "padding": 16,
                                   "paddingBottom": 8,
                                 }
@@ -773,7 +773,7 @@ exports[`EarnInputView render matches snapshot 1`] = `
                               {
                                 "alignItems": "center",
                                 "alignSelf": "stretch",
-                                "backgroundColor": "#3c4d9d0f",
+                                "backgroundColor": "#b4b4b528",
                                 "borderRadius": 20,
                                 "flex": 1,
                                 "flexDirection": "row",
@@ -788,7 +788,7 @@ exports[`EarnInputView render matches snapshot 1`] = `
                               accessibilityRole="none"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Medium",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -808,7 +808,7 @@ exports[`EarnInputView render matches snapshot 1`] = `
                               {
                                 "alignItems": "center",
                                 "alignSelf": "stretch",
-                                "backgroundColor": "#3c4d9d0f",
+                                "backgroundColor": "#b4b4b528",
                                 "borderRadius": 20,
                                 "flex": 1,
                                 "flexDirection": "row",
@@ -823,7 +823,7 @@ exports[`EarnInputView render matches snapshot 1`] = `
                               accessibilityRole="none"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Medium",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -843,7 +843,7 @@ exports[`EarnInputView render matches snapshot 1`] = `
                               {
                                 "alignItems": "center",
                                 "alignSelf": "stretch",
-                                "backgroundColor": "#3c4d9d0f",
+                                "backgroundColor": "#b4b4b528",
                                 "borderRadius": 20,
                                 "flex": 1,
                                 "flexDirection": "row",
@@ -858,7 +858,7 @@ exports[`EarnInputView render matches snapshot 1`] = `
                               accessibilityRole="none"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Medium",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -878,7 +878,7 @@ exports[`EarnInputView render matches snapshot 1`] = `
                               {
                                 "alignItems": "center",
                                 "alignSelf": "stretch",
-                                "backgroundColor": "#3c4d9d0f",
+                                "backgroundColor": "#b4b4b528",
                                 "borderRadius": 20,
                                 "flex": 1,
                                 "flexDirection": "row",
@@ -890,7 +890,7 @@ exports[`EarnInputView render matches snapshot 1`] = `
                             }
                           >
                             <SvgMock
-                              color="#121314"
+                              color="#131416"
                               fill="currentColor"
                               height={16}
                               name="Sparkle"
@@ -907,7 +907,7 @@ exports[`EarnInputView render matches snapshot 1`] = `
                               accessibilityRole="none"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Medium",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -966,7 +966,7 @@ exports[`EarnInputView render matches snapshot 1`] = `
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 12,
                                       "height": 48,
                                       "justifyContent": "center",
@@ -981,7 +981,7 @@ exports[`EarnInputView render matches snapshot 1`] = `
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 32,
                                         "fontWeight": "500",
@@ -1018,7 +1018,7 @@ exports[`EarnInputView render matches snapshot 1`] = `
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 12,
                                       "height": 48,
                                       "justifyContent": "center",
@@ -1033,7 +1033,7 @@ exports[`EarnInputView render matches snapshot 1`] = `
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 32,
                                         "fontWeight": "500",
@@ -1070,7 +1070,7 @@ exports[`EarnInputView render matches snapshot 1`] = `
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 12,
                                       "height": 48,
                                       "justifyContent": "center",
@@ -1085,7 +1085,7 @@ exports[`EarnInputView render matches snapshot 1`] = `
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 32,
                                         "fontWeight": "500",
@@ -1136,7 +1136,7 @@ exports[`EarnInputView render matches snapshot 1`] = `
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 12,
                                       "height": 48,
                                       "justifyContent": "center",
@@ -1151,7 +1151,7 @@ exports[`EarnInputView render matches snapshot 1`] = `
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 32,
                                         "fontWeight": "500",
@@ -1188,7 +1188,7 @@ exports[`EarnInputView render matches snapshot 1`] = `
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 12,
                                       "height": 48,
                                       "justifyContent": "center",
@@ -1203,7 +1203,7 @@ exports[`EarnInputView render matches snapshot 1`] = `
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 32,
                                         "fontWeight": "500",
@@ -1240,7 +1240,7 @@ exports[`EarnInputView render matches snapshot 1`] = `
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 12,
                                       "height": 48,
                                       "justifyContent": "center",
@@ -1255,7 +1255,7 @@ exports[`EarnInputView render matches snapshot 1`] = `
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 32,
                                         "fontWeight": "500",
@@ -1306,7 +1306,7 @@ exports[`EarnInputView render matches snapshot 1`] = `
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 12,
                                       "height": 48,
                                       "justifyContent": "center",
@@ -1321,7 +1321,7 @@ exports[`EarnInputView render matches snapshot 1`] = `
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 32,
                                         "fontWeight": "500",
@@ -1358,7 +1358,7 @@ exports[`EarnInputView render matches snapshot 1`] = `
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 12,
                                       "height": 48,
                                       "justifyContent": "center",
@@ -1373,7 +1373,7 @@ exports[`EarnInputView render matches snapshot 1`] = `
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 32,
                                         "fontWeight": "500",
@@ -1410,7 +1410,7 @@ exports[`EarnInputView render matches snapshot 1`] = `
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 12,
                                       "height": 48,
                                       "justifyContent": "center",
@@ -1425,7 +1425,7 @@ exports[`EarnInputView render matches snapshot 1`] = `
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 32,
                                         "fontWeight": "500",
@@ -1476,7 +1476,7 @@ exports[`EarnInputView render matches snapshot 1`] = `
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 12,
                                       "height": 48,
                                       "justifyContent": "center",
@@ -1493,7 +1493,7 @@ exports[`EarnInputView render matches snapshot 1`] = `
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 32,
                                         "fontWeight": "500",
@@ -1530,7 +1530,7 @@ exports[`EarnInputView render matches snapshot 1`] = `
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 12,
                                       "height": 48,
                                       "justifyContent": "center",
@@ -1545,7 +1545,7 @@ exports[`EarnInputView render matches snapshot 1`] = `
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 32,
                                         "fontWeight": "500",
@@ -1600,7 +1600,7 @@ exports[`EarnInputView render matches snapshot 1`] = `
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "height": 32,
                                         "width": 32,
                                       },
@@ -1632,7 +1632,7 @@ exports[`EarnInputView render matches snapshot 1`] = `
                               {
                                 "alignItems": "center",
                                 "alignSelf": "stretch",
-                                "backgroundColor": "#121314",
+                                "backgroundColor": "#131416",
                                 "borderRadius": 12,
                                 "flexDirection": "row",
                                 "height": 48,
@@ -2098,7 +2098,7 @@ exports[`EarnInputView when values are entered in the keypad updates ETH and fia
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "height": 24,
                                         "width": 24,
                                       },
@@ -2139,7 +2139,7 @@ exports[`EarnInputView when values are entered in the keypad updates ETH and fia
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 16,
                                       "fontWeight": 400,
@@ -2218,7 +2218,7 @@ exports[`EarnInputView when values are entered in the keypad updates ETH and fia
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#686e7d",
+                                          "color": "#66676a",
                                           "fontFamily": "Geist-Medium",
                                           "fontSize": 14,
                                           "letterSpacing": 0,
@@ -2248,7 +2248,7 @@ exports[`EarnInputView when values are entered in the keypad updates ETH and fia
                                       testID="LendingMaxSafeWithdrawalTooltipIcon"
                                     >
                                       <SvgMock
-                                        color="#686e7d"
+                                        color="#66676a"
                                         fill="currentColor"
                                         height={20}
                                         name="Question"
@@ -2267,7 +2267,7 @@ exports[`EarnInputView when values are entered in the keypad updates ETH and fia
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 14,
                                       "letterSpacing": 0,
@@ -2333,7 +2333,7 @@ exports[`EarnInputView when values are entered in the keypad updates ETH and fia
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "letterSpacing": 0,
@@ -2347,7 +2347,7 @@ exports[`EarnInputView when values are entered in the keypad updates ETH and fia
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#b7bbc8",
+                                          "color": "#babbbe",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "letterSpacing": 0,
@@ -2371,7 +2371,7 @@ exports[`EarnInputView when values are entered in the keypad updates ETH and fia
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
                                       "backgroundColor": "#ffffff",
-                                      "borderColor": "#b7bbc866",
+                                      "borderColor": "#b4b4b566",
                                       "borderRadius": 16,
                                       "borderWidth": 1,
                                       "flexDirection": "row",
@@ -2387,7 +2387,7 @@ exports[`EarnInputView when values are entered in the keypad updates ETH and fia
                                     accessibilityRole="none"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Medium",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -2398,7 +2398,7 @@ exports[`EarnInputView when values are entered in the keypad updates ETH and fia
                                     0 USD
                                   </Text>
                                   <SvgMock
-                                    color="#121314"
+                                    color="#131416"
                                     fill="currentColor"
                                     height={16}
                                     name="SwapVertical"
@@ -2417,7 +2417,7 @@ exports[`EarnInputView when values are entered in the keypad updates ETH and fia
                             <View
                               style={
                                 {
-                                  "borderColor": "#b7bbc866",
+                                  "borderColor": "#b4b4b566",
                                   "padding": 16,
                                   "paddingBottom": 8,
                                 }
@@ -2446,7 +2446,7 @@ exports[`EarnInputView when values are entered in the keypad updates ETH and fia
                               {
                                 "alignItems": "center",
                                 "alignSelf": "stretch",
-                                "backgroundColor": "#3c4d9d0f",
+                                "backgroundColor": "#b4b4b528",
                                 "borderRadius": 20,
                                 "flex": 1,
                                 "flexDirection": "row",
@@ -2461,7 +2461,7 @@ exports[`EarnInputView when values are entered in the keypad updates ETH and fia
                               accessibilityRole="none"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Medium",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -2481,7 +2481,7 @@ exports[`EarnInputView when values are entered in the keypad updates ETH and fia
                               {
                                 "alignItems": "center",
                                 "alignSelf": "stretch",
-                                "backgroundColor": "#3c4d9d0f",
+                                "backgroundColor": "#b4b4b528",
                                 "borderRadius": 20,
                                 "flex": 1,
                                 "flexDirection": "row",
@@ -2496,7 +2496,7 @@ exports[`EarnInputView when values are entered in the keypad updates ETH and fia
                               accessibilityRole="none"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Medium",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -2516,7 +2516,7 @@ exports[`EarnInputView when values are entered in the keypad updates ETH and fia
                               {
                                 "alignItems": "center",
                                 "alignSelf": "stretch",
-                                "backgroundColor": "#3c4d9d0f",
+                                "backgroundColor": "#b4b4b528",
                                 "borderRadius": 20,
                                 "flex": 1,
                                 "flexDirection": "row",
@@ -2531,7 +2531,7 @@ exports[`EarnInputView when values are entered in the keypad updates ETH and fia
                               accessibilityRole="none"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Medium",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -2551,7 +2551,7 @@ exports[`EarnInputView when values are entered in the keypad updates ETH and fia
                               {
                                 "alignItems": "center",
                                 "alignSelf": "stretch",
-                                "backgroundColor": "#3c4d9d0f",
+                                "backgroundColor": "#b4b4b528",
                                 "borderRadius": 20,
                                 "flex": 1,
                                 "flexDirection": "row",
@@ -2563,7 +2563,7 @@ exports[`EarnInputView when values are entered in the keypad updates ETH and fia
                             }
                           >
                             <SvgMock
-                              color="#121314"
+                              color="#131416"
                               fill="currentColor"
                               height={16}
                               name="Sparkle"
@@ -2580,7 +2580,7 @@ exports[`EarnInputView when values are entered in the keypad updates ETH and fia
                               accessibilityRole="none"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Medium",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -2639,7 +2639,7 @@ exports[`EarnInputView when values are entered in the keypad updates ETH and fia
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 12,
                                       "height": 48,
                                       "justifyContent": "center",
@@ -2654,7 +2654,7 @@ exports[`EarnInputView when values are entered in the keypad updates ETH and fia
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 32,
                                         "fontWeight": "500",
@@ -2691,7 +2691,7 @@ exports[`EarnInputView when values are entered in the keypad updates ETH and fia
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 12,
                                       "height": 48,
                                       "justifyContent": "center",
@@ -2706,7 +2706,7 @@ exports[`EarnInputView when values are entered in the keypad updates ETH and fia
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 32,
                                         "fontWeight": "500",
@@ -2743,7 +2743,7 @@ exports[`EarnInputView when values are entered in the keypad updates ETH and fia
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 12,
                                       "height": 48,
                                       "justifyContent": "center",
@@ -2758,7 +2758,7 @@ exports[`EarnInputView when values are entered in the keypad updates ETH and fia
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 32,
                                         "fontWeight": "500",
@@ -2809,7 +2809,7 @@ exports[`EarnInputView when values are entered in the keypad updates ETH and fia
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 12,
                                       "height": 48,
                                       "justifyContent": "center",
@@ -2824,7 +2824,7 @@ exports[`EarnInputView when values are entered in the keypad updates ETH and fia
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 32,
                                         "fontWeight": "500",
@@ -2861,7 +2861,7 @@ exports[`EarnInputView when values are entered in the keypad updates ETH and fia
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 12,
                                       "height": 48,
                                       "justifyContent": "center",
@@ -2876,7 +2876,7 @@ exports[`EarnInputView when values are entered in the keypad updates ETH and fia
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 32,
                                         "fontWeight": "500",
@@ -2913,7 +2913,7 @@ exports[`EarnInputView when values are entered in the keypad updates ETH and fia
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 12,
                                       "height": 48,
                                       "justifyContent": "center",
@@ -2928,7 +2928,7 @@ exports[`EarnInputView when values are entered in the keypad updates ETH and fia
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 32,
                                         "fontWeight": "500",
@@ -2979,7 +2979,7 @@ exports[`EarnInputView when values are entered in the keypad updates ETH and fia
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 12,
                                       "height": 48,
                                       "justifyContent": "center",
@@ -2994,7 +2994,7 @@ exports[`EarnInputView when values are entered in the keypad updates ETH and fia
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 32,
                                         "fontWeight": "500",
@@ -3031,7 +3031,7 @@ exports[`EarnInputView when values are entered in the keypad updates ETH and fia
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 12,
                                       "height": 48,
                                       "justifyContent": "center",
@@ -3046,7 +3046,7 @@ exports[`EarnInputView when values are entered in the keypad updates ETH and fia
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 32,
                                         "fontWeight": "500",
@@ -3083,7 +3083,7 @@ exports[`EarnInputView when values are entered in the keypad updates ETH and fia
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 12,
                                       "height": 48,
                                       "justifyContent": "center",
@@ -3098,7 +3098,7 @@ exports[`EarnInputView when values are entered in the keypad updates ETH and fia
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 32,
                                         "fontWeight": "500",
@@ -3149,7 +3149,7 @@ exports[`EarnInputView when values are entered in the keypad updates ETH and fia
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 12,
                                       "height": 48,
                                       "justifyContent": "center",
@@ -3166,7 +3166,7 @@ exports[`EarnInputView when values are entered in the keypad updates ETH and fia
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 32,
                                         "fontWeight": "500",
@@ -3203,7 +3203,7 @@ exports[`EarnInputView when values are entered in the keypad updates ETH and fia
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 12,
                                       "height": 48,
                                       "justifyContent": "center",
@@ -3218,7 +3218,7 @@ exports[`EarnInputView when values are entered in the keypad updates ETH and fia
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 32,
                                         "fontWeight": "500",
@@ -3273,7 +3273,7 @@ exports[`EarnInputView when values are entered in the keypad updates ETH and fia
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "height": 32,
                                         "width": 32,
                                       },
@@ -3305,7 +3305,7 @@ exports[`EarnInputView when values are entered in the keypad updates ETH and fia
                               {
                                 "alignItems": "center",
                                 "alignSelf": "stretch",
-                                "backgroundColor": "#121314",
+                                "backgroundColor": "#131416",
                                 "borderRadius": 12,
                                 "flexDirection": "row",
                                 "height": 48,
diff --git a/app/components/UI/Earn/Views/EarnLendingDepositConfirmationView/__snapshots__/EarnLendingDepositConfirmationView.test.tsx.snap b/app/components/UI/Earn/Views/EarnLendingDepositConfirmationView/__snapshots__/EarnLendingDepositConfirmationView.test.tsx.snap
index 1741d30541df..375031b673c3 100644
--- a/app/components/UI/Earn/Views/EarnLendingDepositConfirmationView/__snapshots__/EarnLendingDepositConfirmationView.test.tsx.snap
+++ b/app/components/UI/Earn/Views/EarnLendingDepositConfirmationView/__snapshots__/EarnLendingDepositConfirmationView.test.tsx.snap
@@ -4,7 +4,7 @@ exports[`EarnLendingDepositConfirmationView matches snapshot 1`] = `
 <View
   style={
     {
-      "backgroundColor": "#f3f5f9",
+      "backgroundColor": "#f3f3f4",
       "height": "100%",
       "justifyContent": "space-between",
     }
@@ -173,7 +173,7 @@ exports[`EarnLendingDepositConfirmationView matches snapshot 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 24,
                 "letterSpacing": 0,
@@ -190,7 +190,7 @@ exports[`EarnLendingDepositConfirmationView matches snapshot 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -207,8 +207,8 @@ exports[`EarnLendingDepositConfirmationView matches snapshot 1`] = `
         style={
           {
             "backgroundColor": "#ffffff",
-            "borderRadius": 8,
-            "marginBottom": 8,
+            "borderRadius": 12,
+            "marginBottom": 12,
             "paddingBottom": 8,
             "paddingHorizontal": 8,
             "paddingTop": 12,
@@ -269,7 +269,7 @@ exports[`EarnLendingDepositConfirmationView matches snapshot 1`] = `
                     accessibilityRole="text"
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Medium",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -301,7 +301,7 @@ exports[`EarnLendingDepositConfirmationView matches snapshot 1`] = `
                     }
                   >
                     <SvgMock
-                      color="#686e7d"
+                      color="#66676a"
                       fill="currentColor"
                       height={16}
                       name="Question"
@@ -405,7 +405,7 @@ exports[`EarnLendingDepositConfirmationView matches snapshot 1`] = `
                     accessibilityRole="text"
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Medium",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -457,7 +457,7 @@ exports[`EarnLendingDepositConfirmationView matches snapshot 1`] = `
                       numberOfLines={1}
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -473,7 +473,7 @@ exports[`EarnLendingDepositConfirmationView matches snapshot 1`] = `
                       numberOfLines={1}
                       style={
                         {
-                          "color": "#686e7d",
+                          "color": "#66676a",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -532,7 +532,7 @@ exports[`EarnLendingDepositConfirmationView matches snapshot 1`] = `
                     accessibilityRole="text"
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Medium",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -564,7 +564,7 @@ exports[`EarnLendingDepositConfirmationView matches snapshot 1`] = `
                     }
                   >
                     <SvgMock
-                      color="#686e7d"
+                      color="#66676a"
                       fill="currentColor"
                       height={16}
                       name="Question"
@@ -609,7 +609,7 @@ exports[`EarnLendingDepositConfirmationView matches snapshot 1`] = `
                     accessibilityRole="text"
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -668,7 +668,7 @@ exports[`EarnLendingDepositConfirmationView matches snapshot 1`] = `
                     accessibilityRole="text"
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Medium",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -700,7 +700,7 @@ exports[`EarnLendingDepositConfirmationView matches snapshot 1`] = `
                     }
                   >
                     <SvgMock
-                      color="#686e7d"
+                      color="#66676a"
                       fill="currentColor"
                       height={16}
                       name="Question"
@@ -745,7 +745,7 @@ exports[`EarnLendingDepositConfirmationView matches snapshot 1`] = `
                     accessibilityRole="text"
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -804,7 +804,7 @@ exports[`EarnLendingDepositConfirmationView matches snapshot 1`] = `
                     accessibilityRole="text"
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Medium",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -836,7 +836,7 @@ exports[`EarnLendingDepositConfirmationView matches snapshot 1`] = `
                     }
                   >
                     <SvgMock
-                      color="#686e7d"
+                      color="#66676a"
                       fill="currentColor"
                       height={16}
                       name="Question"
@@ -884,11 +884,11 @@ exports[`EarnLendingDepositConfirmationView matches snapshot 1`] = `
                     style={
                       {
                         "alignSelf": "flex-start",
-                        "backgroundColor": "#f3f5f9",
-                        "borderColor": "#b7bbc8",
+                        "backgroundColor": "#f3f3f4",
+                        "borderColor": "#949596",
                         "borderRadius": 999,
                         "borderWidth": 0,
-                        "color": "#686e7d",
+                        "color": "#66676a",
                         "padding": 16,
                         "paddingHorizontal": 8,
                         "paddingVertical": 2,
@@ -943,7 +943,7 @@ exports[`EarnLendingDepositConfirmationView matches snapshot 1`] = `
                         accessibilityRole="text"
                         style={
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "fontFamily": "Geist-Regular",
                             "fontSize": 16,
                             "letterSpacing": 0,
@@ -965,8 +965,8 @@ exports[`EarnLendingDepositConfirmationView matches snapshot 1`] = `
         style={
           {
             "backgroundColor": "#ffffff",
-            "borderRadius": 8,
-            "marginBottom": 8,
+            "borderRadius": 12,
+            "marginBottom": 12,
             "paddingBottom": 8,
             "paddingHorizontal": 8,
             "paddingTop": 12,
@@ -994,7 +994,7 @@ exports[`EarnLendingDepositConfirmationView matches snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Medium",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -1025,7 +1025,7 @@ exports[`EarnLendingDepositConfirmationView matches snapshot 1`] = `
               }
             >
               <SvgMock
-                color="#686e7d"
+                color="#66676a"
                 fill="currentColor"
                 height={16}
                 name="Info"
@@ -1090,7 +1090,7 @@ exports[`EarnLendingDepositConfirmationView matches snapshot 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -1113,7 +1113,7 @@ exports[`EarnLendingDepositConfirmationView matches snapshot 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -1127,7 +1127,7 @@ exports[`EarnLendingDepositConfirmationView matches snapshot 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -1404,7 +1404,7 @@ exports[`EarnLendingDepositConfirmationView matches snapshot 1`] = `
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -1422,7 +1422,7 @@ exports[`EarnLendingDepositConfirmationView matches snapshot 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Medium",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -1445,7 +1445,7 @@ exports[`EarnLendingDepositConfirmationView matches snapshot 1`] = `
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "flex": 1,
             "flexDirection": "row",
@@ -1496,7 +1496,7 @@ exports[`EarnLendingDepositConfirmationView matches snapshot 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 14,
               "letterSpacing": 0,
@@ -1511,7 +1511,7 @@ exports[`EarnLendingDepositConfirmationView matches snapshot 1`] = `
           onPress={[Function]}
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 14,
               "letterSpacing": 0,
@@ -1536,7 +1536,7 @@ exports[`EarnLendingDepositConfirmationView matches snapshot 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 14,
               "letterSpacing": 0,
@@ -1553,7 +1553,7 @@ exports[`EarnLendingDepositConfirmationView matches snapshot 1`] = `
           onPress={[Function]}
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 14,
               "letterSpacing": 0,
@@ -1569,7 +1569,7 @@ exports[`EarnLendingDepositConfirmationView matches snapshot 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 14,
               "letterSpacing": 0,
diff --git a/app/components/UI/Earn/Views/EarnLendingDepositConfirmationView/components/ConfirmationFooter/__snapshots__/ConfirmationFooter.test.tsx.snap b/app/components/UI/Earn/Views/EarnLendingDepositConfirmationView/components/ConfirmationFooter/__snapshots__/ConfirmationFooter.test.tsx.snap
index 605bfb00d1fb..6ad9834304a0 100644
--- a/app/components/UI/Earn/Views/EarnLendingDepositConfirmationView/components/ConfirmationFooter/__snapshots__/ConfirmationFooter.test.tsx.snap
+++ b/app/components/UI/Earn/Views/EarnLendingDepositConfirmationView/components/ConfirmationFooter/__snapshots__/ConfirmationFooter.test.tsx.snap
@@ -183,7 +183,7 @@ exports[`ConfirmationFooter renders correctly 1`] = `
             style={
               {
                 "alignItems": "center",
-                "backgroundColor": "#f3f5f9",
+                "backgroundColor": "#f3f3f4",
                 "borderRadius": 12,
                 "height": 24,
                 "justifyContent": "center",
@@ -263,7 +263,7 @@ exports[`ConfirmationFooter renders correctly 1`] = `
         {
           "alignItems": "center",
           "alignSelf": "flex-start",
-          "backgroundColor": "#3c4d9d0f",
+          "backgroundColor": "#b4b4b528",
           "borderColor": "transparent",
           "borderRadius": 12,
           "borderWidth": 1,
@@ -281,7 +281,7 @@ exports[`ConfirmationFooter renders correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -304,7 +304,7 @@ exports[`ConfirmationFooter renders correctly 1`] = `
         {
           "alignItems": "center",
           "alignSelf": "flex-start",
-          "backgroundColor": "#121314",
+          "backgroundColor": "#131416",
           "borderRadius": 12,
           "flex": 1,
           "flexDirection": "row",
@@ -355,7 +355,7 @@ exports[`ConfirmationFooter renders correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 14,
             "letterSpacing": 0,
@@ -370,7 +370,7 @@ exports[`ConfirmationFooter renders correctly 1`] = `
         onPress={[Function]}
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 14,
             "letterSpacing": 0,
@@ -395,7 +395,7 @@ exports[`ConfirmationFooter renders correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 14,
             "letterSpacing": 0,
@@ -412,7 +412,7 @@ exports[`ConfirmationFooter renders correctly 1`] = `
         onPress={[Function]}
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 14,
             "letterSpacing": 0,
@@ -428,7 +428,7 @@ exports[`ConfirmationFooter renders correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 14,
             "letterSpacing": 0,
diff --git a/app/components/UI/Earn/Views/EarnLendingDepositConfirmationView/components/DepositInfoSection/__snapshots__/DepositInfoSection.test.tsx.snap b/app/components/UI/Earn/Views/EarnLendingDepositConfirmationView/components/DepositInfoSection/__snapshots__/DepositInfoSection.test.tsx.snap
index 0eb81de7901e..3a426fad0583 100644
--- a/app/components/UI/Earn/Views/EarnLendingDepositConfirmationView/components/DepositInfoSection/__snapshots__/DepositInfoSection.test.tsx.snap
+++ b/app/components/UI/Earn/Views/EarnLendingDepositConfirmationView/components/DepositInfoSection/__snapshots__/DepositInfoSection.test.tsx.snap
@@ -5,8 +5,8 @@ exports[`DepositInfoSection renders correctly 1`] = `
   style={
     {
       "backgroundColor": "#ffffff",
-      "borderRadius": 8,
-      "marginBottom": 8,
+      "borderRadius": 12,
+      "marginBottom": 12,
       "paddingBottom": 8,
       "paddingHorizontal": 8,
       "paddingTop": 12,
@@ -67,7 +67,7 @@ exports[`DepositInfoSection renders correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Medium",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -99,7 +99,7 @@ exports[`DepositInfoSection renders correctly 1`] = `
               }
             >
               <SvgMock
-                color="#686e7d"
+                color="#66676a"
                 fill="currentColor"
                 height={16}
                 name="Question"
@@ -203,7 +203,7 @@ exports[`DepositInfoSection renders correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Medium",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -255,7 +255,7 @@ exports[`DepositInfoSection renders correctly 1`] = `
                 numberOfLines={1}
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -271,7 +271,7 @@ exports[`DepositInfoSection renders correctly 1`] = `
                 numberOfLines={1}
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -330,7 +330,7 @@ exports[`DepositInfoSection renders correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Medium",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -362,7 +362,7 @@ exports[`DepositInfoSection renders correctly 1`] = `
               }
             >
               <SvgMock
-                color="#686e7d"
+                color="#66676a"
                 fill="currentColor"
                 height={16}
                 name="Question"
@@ -407,7 +407,7 @@ exports[`DepositInfoSection renders correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -466,7 +466,7 @@ exports[`DepositInfoSection renders correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Medium",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -498,7 +498,7 @@ exports[`DepositInfoSection renders correctly 1`] = `
               }
             >
               <SvgMock
-                color="#686e7d"
+                color="#66676a"
                 fill="currentColor"
                 height={16}
                 name="Question"
@@ -543,7 +543,7 @@ exports[`DepositInfoSection renders correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -602,7 +602,7 @@ exports[`DepositInfoSection renders correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Medium",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -634,7 +634,7 @@ exports[`DepositInfoSection renders correctly 1`] = `
               }
             >
               <SvgMock
-                color="#686e7d"
+                color="#66676a"
                 fill="currentColor"
                 height={16}
                 name="Question"
@@ -682,11 +682,11 @@ exports[`DepositInfoSection renders correctly 1`] = `
               style={
                 {
                   "alignSelf": "flex-start",
-                  "backgroundColor": "#f3f5f9",
-                  "borderColor": "#b7bbc8",
+                  "backgroundColor": "#f3f3f4",
+                  "borderColor": "#949596",
                   "borderRadius": 999,
                   "borderWidth": 0,
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "padding": 16,
                   "paddingHorizontal": 8,
                   "paddingVertical": 2,
@@ -741,7 +741,7 @@ exports[`DepositInfoSection renders correctly 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
diff --git a/app/components/UI/Earn/Views/EarnLendingDepositConfirmationView/components/DepositReceiveSection/__snapshots__/DepositReceiveSection.test.tsx.snap b/app/components/UI/Earn/Views/EarnLendingDepositConfirmationView/components/DepositReceiveSection/__snapshots__/DepositReceiveSection.test.tsx.snap
index ed148907b019..57cb822814c0 100644
--- a/app/components/UI/Earn/Views/EarnLendingDepositConfirmationView/components/DepositReceiveSection/__snapshots__/DepositReceiveSection.test.tsx.snap
+++ b/app/components/UI/Earn/Views/EarnLendingDepositConfirmationView/components/DepositReceiveSection/__snapshots__/DepositReceiveSection.test.tsx.snap
@@ -5,8 +5,8 @@ exports[`DepositReceiveSection renders correctly 1`] = `
   style={
     {
       "backgroundColor": "#ffffff",
-      "borderRadius": 8,
-      "marginBottom": 8,
+      "borderRadius": 12,
+      "marginBottom": 12,
       "paddingBottom": 8,
       "paddingHorizontal": 8,
       "paddingTop": 12,
@@ -34,7 +34,7 @@ exports[`DepositReceiveSection renders correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -65,7 +65,7 @@ exports[`DepositReceiveSection renders correctly 1`] = `
         }
       >
         <SvgMock
-          color="#686e7d"
+          color="#66676a"
           fill="currentColor"
           height={16}
           name="Info"
@@ -130,7 +130,7 @@ exports[`DepositReceiveSection renders correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -153,7 +153,7 @@ exports[`DepositReceiveSection renders correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -167,7 +167,7 @@ exports[`DepositReceiveSection renders correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
diff --git a/app/components/UI/Earn/Views/EarnLendingDepositConfirmationView/components/Erc20TokenHero/__snapshots__/Erc20TokenHero.test.tsx.snap b/app/components/UI/Earn/Views/EarnLendingDepositConfirmationView/components/Erc20TokenHero/__snapshots__/Erc20TokenHero.test.tsx.snap
index 069c5b0c827d..406803338baa 100644
--- a/app/components/UI/Earn/Views/EarnLendingDepositConfirmationView/components/Erc20TokenHero/__snapshots__/Erc20TokenHero.test.tsx.snap
+++ b/app/components/UI/Earn/Views/EarnLendingDepositConfirmationView/components/Erc20TokenHero/__snapshots__/Erc20TokenHero.test.tsx.snap
@@ -150,7 +150,7 @@ exports[`Erc20TokenHero renders USDC token correctly 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Bold",
           "fontSize": 24,
           "letterSpacing": 0,
@@ -167,7 +167,7 @@ exports[`Erc20TokenHero renders USDC token correctly 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#686e7d",
+          "color": "#66676a",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
diff --git a/app/components/UI/Earn/Views/EarnLendingDepositConfirmationView/components/ProgressStepper/__snapshots__/ProgressStepper.test.tsx.snap b/app/components/UI/Earn/Views/EarnLendingDepositConfirmationView/components/ProgressStepper/__snapshots__/ProgressStepper.test.tsx.snap
index e023a51590b0..7dfdff5be174 100644
--- a/app/components/UI/Earn/Views/EarnLendingDepositConfirmationView/components/ProgressStepper/__snapshots__/ProgressStepper.test.tsx.snap
+++ b/app/components/UI/Earn/Views/EarnLendingDepositConfirmationView/components/ProgressStepper/__snapshots__/ProgressStepper.test.tsx.snap
@@ -173,7 +173,7 @@ exports[`ProgressStepper renders correctly 1`] = `
         style={
           {
             "alignItems": "center",
-            "backgroundColor": "#f3f5f9",
+            "backgroundColor": "#f3f3f4",
             "borderRadius": 12,
             "height": 24,
             "justifyContent": "center",
@@ -870,7 +870,7 @@ exports[`ProgressStepper renders first step loading when isLoading prop set to t
         style={
           {
             "alignItems": "center",
-            "backgroundColor": "#f3f5f9",
+            "backgroundColor": "#f3f3f4",
             "borderRadius": 12,
             "height": 24,
             "justifyContent": "center",
@@ -1101,7 +1101,7 @@ exports[`ProgressStepper renders first step pending state when active step is 0
         style={
           {
             "alignItems": "center",
-            "backgroundColor": "#f3f5f9",
+            "backgroundColor": "#f3f3f4",
             "borderRadius": 12,
             "height": 24,
             "justifyContent": "center",
diff --git a/app/components/UI/Earn/Views/EarnLendingWithdrawalConfirmationView/EarnLendingWithdrawalConfirmationView.test.tsx b/app/components/UI/Earn/Views/EarnLendingWithdrawalConfirmationView/EarnLendingWithdrawalConfirmationView.test.tsx
index bfe542e8c32d..2a709e045af9 100644
--- a/app/components/UI/Earn/Views/EarnLendingWithdrawalConfirmationView/EarnLendingWithdrawalConfirmationView.test.tsx
+++ b/app/components/UI/Earn/Views/EarnLendingWithdrawalConfirmationView/EarnLendingWithdrawalConfirmationView.test.tsx
@@ -1,4 +1,5 @@
 import { LendingMarketWithPosition } from '@metamask/earn-controller';
+import { mockTheme } from '../../../../../util/theme';
 import { useRoute } from '@react-navigation/native';
 import { act, fireEvent } from '@testing-library/react-native';
 import React from 'react';
@@ -234,7 +235,7 @@ describe('EarnLendingWithdrawalConfirmationView', () => {
       expect.any(Object), // theme.colors
       {
         hasCancelButton: false,
-        backgroundColor: '#f3f5f9',
+        backgroundColor: mockTheme.colors.background.alternative,
       },
       {
         backButtonEvent: {
diff --git a/app/components/UI/Earn/Views/EarnLendingWithdrawalConfirmationView/__snapshots__/EarnLendingWithdrawalConfirmationView.test.tsx.snap b/app/components/UI/Earn/Views/EarnLendingWithdrawalConfirmationView/__snapshots__/EarnLendingWithdrawalConfirmationView.test.tsx.snap
index f3c6405a4980..034649063bcd 100644
--- a/app/components/UI/Earn/Views/EarnLendingWithdrawalConfirmationView/__snapshots__/EarnLendingWithdrawalConfirmationView.test.tsx.snap
+++ b/app/components/UI/Earn/Views/EarnLendingWithdrawalConfirmationView/__snapshots__/EarnLendingWithdrawalConfirmationView.test.tsx.snap
@@ -4,7 +4,7 @@ exports[`EarnLendingWithdrawalConfirmationView matches snapshot 1`] = `
 <View
   style={
     {
-      "backgroundColor": "#f3f5f9",
+      "backgroundColor": "#f3f3f4",
       "height": "100%",
       "justifyContent": "space-between",
     }
@@ -139,7 +139,7 @@ exports[`EarnLendingWithdrawalConfirmationView matches snapshot 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Bold",
               "fontSize": 24,
               "letterSpacing": 0,
@@ -156,7 +156,7 @@ exports[`EarnLendingWithdrawalConfirmationView matches snapshot 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -180,8 +180,8 @@ exports[`EarnLendingWithdrawalConfirmationView matches snapshot 1`] = `
         style={
           {
             "backgroundColor": "#ffffff",
-            "borderRadius": 8,
-            "marginBottom": 8,
+            "borderRadius": 12,
+            "marginBottom": 12,
             "paddingBottom": 8,
             "paddingHorizontal": 8,
             "paddingTop": 12,
@@ -243,7 +243,7 @@ exports[`EarnLendingWithdrawalConfirmationView matches snapshot 1`] = `
                     accessibilityRole="text"
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Medium",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -275,7 +275,7 @@ exports[`EarnLendingWithdrawalConfirmationView matches snapshot 1`] = `
                     }
                   >
                     <SvgMock
-                      color="#686e7d"
+                      color="#66676a"
                       fill="currentColor"
                       height={16}
                       name="Question"
@@ -320,7 +320,7 @@ exports[`EarnLendingWithdrawalConfirmationView matches snapshot 1`] = `
                     accessibilityRole="text"
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -341,8 +341,8 @@ exports[`EarnLendingWithdrawalConfirmationView matches snapshot 1`] = `
         style={
           {
             "backgroundColor": "#ffffff",
-            "borderRadius": 8,
-            "marginBottom": 8,
+            "borderRadius": 12,
+            "marginBottom": 12,
             "paddingBottom": 8,
             "paddingHorizontal": 8,
             "paddingTop": 12,
@@ -404,7 +404,7 @@ exports[`EarnLendingWithdrawalConfirmationView matches snapshot 1`] = `
                     accessibilityRole="text"
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Medium",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -564,7 +564,7 @@ exports[`EarnLendingWithdrawalConfirmationView matches snapshot 1`] = `
                     accessibilityRole="text"
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Medium",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -596,7 +596,7 @@ exports[`EarnLendingWithdrawalConfirmationView matches snapshot 1`] = `
                     }
                   >
                     <SvgMock
-                      color="#686e7d"
+                      color="#66676a"
                       fill="currentColor"
                       height={16}
                       name="Question"
@@ -644,11 +644,11 @@ exports[`EarnLendingWithdrawalConfirmationView matches snapshot 1`] = `
                     style={
                       {
                         "alignSelf": "flex-start",
-                        "backgroundColor": "#f3f5f9",
-                        "borderColor": "#b7bbc8",
+                        "backgroundColor": "#f3f3f4",
+                        "borderColor": "#949596",
                         "borderRadius": 999,
                         "borderWidth": 0,
-                        "color": "#686e7d",
+                        "color": "#66676a",
                         "padding": 16,
                         "paddingHorizontal": 8,
                         "paddingVertical": 2,
@@ -692,7 +692,7 @@ exports[`EarnLendingWithdrawalConfirmationView matches snapshot 1`] = `
                         accessibilityRole="text"
                         style={
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "fontFamily": "Geist-Regular",
                             "fontSize": 16,
                             "letterSpacing": 0,
@@ -712,7 +712,7 @@ exports[`EarnLendingWithdrawalConfirmationView matches snapshot 1`] = `
         <View
           style={
             {
-              "backgroundColor": "#b7bbc866",
+              "backgroundColor": "#b4b4b566",
               "height": 1,
               "marginLeft": -8,
               "marginRight": -8,
@@ -774,7 +774,7 @@ exports[`EarnLendingWithdrawalConfirmationView matches snapshot 1`] = `
                     accessibilityRole="text"
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Medium",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -856,7 +856,7 @@ exports[`EarnLendingWithdrawalConfirmationView matches snapshot 1`] = `
                       accessibilityRole="text"
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -907,7 +907,7 @@ exports[`EarnLendingWithdrawalConfirmationView matches snapshot 1`] = `
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -925,7 +925,7 @@ exports[`EarnLendingWithdrawalConfirmationView matches snapshot 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Medium",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -948,7 +948,7 @@ exports[`EarnLendingWithdrawalConfirmationView matches snapshot 1`] = `
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "flex": 1,
             "flexDirection": "row",
@@ -999,7 +999,7 @@ exports[`EarnLendingWithdrawalConfirmationView matches snapshot 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 14,
               "letterSpacing": 0,
@@ -1014,7 +1014,7 @@ exports[`EarnLendingWithdrawalConfirmationView matches snapshot 1`] = `
           onPress={[Function]}
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 14,
               "letterSpacing": 0,
@@ -1039,7 +1039,7 @@ exports[`EarnLendingWithdrawalConfirmationView matches snapshot 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 14,
               "letterSpacing": 0,
@@ -1056,7 +1056,7 @@ exports[`EarnLendingWithdrawalConfirmationView matches snapshot 1`] = `
           onPress={[Function]}
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 14,
               "letterSpacing": 0,
@@ -1072,7 +1072,7 @@ exports[`EarnLendingWithdrawalConfirmationView matches snapshot 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 14,
               "letterSpacing": 0,
diff --git a/app/components/UI/Earn/Views/EarnMusdConversionEducationView/EarnMusdConversionEducationView.view.test.tsx b/app/components/UI/Earn/Views/EarnMusdConversionEducationView/EarnMusdConversionEducationView.view.test.tsx
index 44015b4697ba..342812376730 100644
--- a/app/components/UI/Earn/Views/EarnMusdConversionEducationView/EarnMusdConversionEducationView.view.test.tsx
+++ b/app/components/UI/Earn/Views/EarnMusdConversionEducationView/EarnMusdConversionEducationView.view.test.tsx
@@ -57,7 +57,9 @@ describeForPlatforms('EarnMusdConversionEducationView', () => {
       ),
     ).toBeOnTheScreen();
     expect(
-      getByText(/Convert your stablecoins to mUSD.*receive up to a \d+% bonus/),
+      getByText(
+        /Convert your stablecoins to mUSD.*earn up to a \d+% annualized bonus/,
+      ),
     ).toBeOnTheScreen();
     expect(
       getByText(strings('earn.musd_conversion.education.primary_button')),
@@ -389,7 +391,7 @@ describeForPlatforms('EarnMusdConversionEducationView', () => {
 
     // Assert
     const description = getByText(
-      /Convert your stablecoins to mUSD.*receive up to a \d+% bonus/,
+      /Convert your stablecoins to mUSD.*earn up to a \d+% annualized bonus/,
     );
     expect(description).toBeOnTheScreen();
     expect(description.props.children[0]).toContain(`${MUSD_CONVERSION_APY}%`);
diff --git a/app/components/UI/Earn/Views/EarnMusdConversionEducationView/index.test.tsx b/app/components/UI/Earn/Views/EarnMusdConversionEducationView/index.test.tsx
index a048c9b2048c..ff8365edd913 100644
--- a/app/components/UI/Earn/Views/EarnMusdConversionEducationView/index.test.tsx
+++ b/app/components/UI/Earn/Views/EarnMusdConversionEducationView/index.test.tsx
@@ -139,6 +139,21 @@ const mockConversionToken = {
   balance: '1000000',
   logo: undefined,
   isETH: false,
+  fiat: { balance: 50 },
+};
+
+const mockConversionTokenHighBalance = {
+  address: '0xdAC17F958D2ee523a2206206994597C13D831ec7',
+  chainId: '0x1',
+  aggregators: [],
+  decimals: 6,
+  image: '',
+  name: 'Tether USD',
+  symbol: 'USDT',
+  balance: '5000000',
+  logo: undefined,
+  isETH: false,
+  fiat: { balance: 500 },
 };
 
 describe('EarnMusdConversionEducationView', () => {
@@ -457,7 +472,7 @@ describe('EarnMusdConversionEducationView', () => {
       });
     });
 
-    it('navigates to home when has convertible tokens but no valid payment token and mUSD is not buyable', async () => {
+    it('falls back to first conversion token when getPaymentTokenForSelectedNetwork returns null', async () => {
       mockUseMusdConversionFlowData.mockReturnValue({
         isGeoEligible: true,
         hasConvertibleTokens: true,
@@ -468,7 +483,7 @@ describe('EarnMusdConversionEducationView', () => {
         isPopularNetworksFilterActive: false,
         selectedChainId: null,
         selectedChains: [],
-        conversionTokens: [mockConversionToken],
+        conversionTokens: [mockConversionTokenHighBalance, mockConversionToken],
         isMusdBuyableOnChain: {},
         isMusdBuyableOnAnyChain: false,
       });
@@ -487,6 +502,91 @@ describe('EarnMusdConversionEducationView', () => {
       });
 
       await waitFor(() => {
+        expect(mockInitiateConversion).toHaveBeenCalledWith({
+          preferredPaymentToken: {
+            address: mockConversionTokenHighBalance.address,
+            chainId: mockConversionTokenHighBalance.chainId,
+          },
+          skipEducationCheck: true,
+          navigationOverride: MUSD_CONVERSION_NAVIGATION_OVERRIDE.QUICK_CONVERT,
+        });
+      });
+    });
+
+    it('falls through to buy when first conversion token has no chainId', async () => {
+      const mockGoToBuy = jest.fn();
+      mockUseRampNavigation.mockReturnValue({
+        goToBuy: mockGoToBuy,
+        goToAggregator: mockGoToAggregator,
+        goToSell: jest.fn(),
+        goToDeposit: jest.fn(),
+      });
+
+      mockUseMusdConversionFlowData.mockReturnValue({
+        isGeoEligible: true,
+        hasConvertibleTokens: true,
+        isEmptyWallet: false,
+        getPaymentTokenForSelectedNetwork: jest.fn().mockReturnValue(null),
+        getChainIdForBuyFlow: mockGetChainIdForBuyFlow,
+        isMusdBuyable: true,
+        isPopularNetworksFilterActive: false,
+        selectedChainId: null,
+        selectedChains: [],
+        conversionTokens: [{ ...mockConversionToken, chainId: undefined }],
+        isMusdBuyableOnChain: {},
+        isMusdBuyableOnAnyChain: false,
+      });
+
+      const { getByTestId } = renderWithProvider(
+        <EarnMusdConversionEducationView />,
+        { state: {} },
+      );
+
+      await act(async () => {
+        fireEvent.press(
+          getByTestId(
+            EARN_TEST_IDS.MUSD.CONVERSION_EDUCATION_VIEW.PRIMARY_BUTTON,
+          ),
+        );
+      });
+
+      await waitFor(() => {
+        expect(mockInitiateConversion).not.toHaveBeenCalled();
+        expect(mockGoToBuy).toHaveBeenCalled();
+      });
+    });
+
+    it('falls through to navigate_home when first token invalid and mUSD not buyable', async () => {
+      mockUseMusdConversionFlowData.mockReturnValue({
+        isGeoEligible: true,
+        hasConvertibleTokens: true,
+        isEmptyWallet: false,
+        getPaymentTokenForSelectedNetwork: jest.fn().mockReturnValue(null),
+        getChainIdForBuyFlow: mockGetChainIdForBuyFlow,
+        isMusdBuyable: false,
+        isPopularNetworksFilterActive: false,
+        selectedChainId: null,
+        selectedChains: [],
+        conversionTokens: [{ ...mockConversionToken, chainId: undefined }],
+        isMusdBuyableOnChain: {},
+        isMusdBuyableOnAnyChain: false,
+      });
+
+      const { getByTestId } = renderWithProvider(
+        <EarnMusdConversionEducationView />,
+        { state: {} },
+      );
+
+      await act(async () => {
+        fireEvent.press(
+          getByTestId(
+            EARN_TEST_IDS.MUSD.CONVERSION_EDUCATION_VIEW.PRIMARY_BUTTON,
+          ),
+        );
+      });
+
+      await waitFor(() => {
+        expect(mockInitiateConversion).not.toHaveBeenCalled();
         expect(mockNavigation.navigate).toHaveBeenCalledWith(
           Routes.WALLET.HOME,
           {
diff --git a/app/components/UI/Earn/Views/EarnMusdConversionEducationView/index.tsx b/app/components/UI/Earn/Views/EarnMusdConversionEducationView/index.tsx
index 44bc2d65de60..359229480a8b 100644
--- a/app/components/UI/Earn/Views/EarnMusdConversionEducationView/index.tsx
+++ b/app/components/UI/Earn/Views/EarnMusdConversionEducationView/index.tsx
@@ -41,6 +41,8 @@ import { EARN_TEST_IDS } from '../../constants/testIds';
 import AppConstants from '../../../../../core/AppConstants';
 import { MUSD_CONVERSION_NAVIGATION_OVERRIDE } from '../../types/musd.types';
 import { selectMusdQuickConvertEnabledFlag } from '../../selectors/featureFlags';
+import { toChecksumAddress } from '../../../../../util/address';
+import { safeFormatChainIdToHex } from '../../../Card/util/safeFormatChainIdToHex';
 interface EarnMusdConversionEducationViewRouteParams {
   /**
    * Indicates if this navigation originated from a deeplink
@@ -81,6 +83,7 @@ const EarnMusdConversionEducationView = () => {
     getPaymentTokenForSelectedNetwork,
     getChainIdForBuyFlow,
     isMusdBuyable,
+    conversionTokens,
   } = useMusdConversionFlowData();
 
   const { styles } = useStyles(styleSheet, {});
@@ -106,7 +109,18 @@ const EarnMusdConversionEducationView = () => {
 
     // Try conversion flow if user has convertible tokens
     if (hasConvertibleTokens) {
-      const paymentToken = getPaymentTokenForSelectedNetwork();
+      const fallbackToken = conversionTokens[0];
+      const fallbackChainIdHex = fallbackToken?.chainId
+        ? safeFormatChainIdToHex(fallbackToken.chainId)
+        : null;
+      const paymentToken =
+        getPaymentTokenForSelectedNetwork() ??
+        (fallbackToken?.address && fallbackChainIdHex?.startsWith('0x')
+          ? {
+              address: toChecksumAddress(fallbackToken.address) as Hex,
+              chainId: fallbackChainIdHex as Hex,
+            }
+          : null);
       if (paymentToken) {
         return {
           action: 'convert' as const,
@@ -131,6 +145,7 @@ const EarnMusdConversionEducationView = () => {
     getPaymentTokenForSelectedNetwork,
     getChainIdForBuyFlow,
     isMusdBuyable,
+    conversionTokens,
   ]);
 
   const primaryButtonText = useMemo(() => {
diff --git a/app/components/UI/Earn/Views/EarnWithdrawInputView/__snapshots__/EarnWithdrawInputView.test.tsx.snap b/app/components/UI/Earn/Views/EarnWithdrawInputView/__snapshots__/EarnWithdrawInputView.test.tsx.snap
index 24575e1fe35e..5a48ae3fc524 100644
--- a/app/components/UI/Earn/Views/EarnWithdrawInputView/__snapshots__/EarnWithdrawInputView.test.tsx.snap
+++ b/app/components/UI/Earn/Views/EarnWithdrawInputView/__snapshots__/EarnWithdrawInputView.test.tsx.snap
@@ -401,7 +401,7 @@ exports[`EarnWithdrawInputView render matches snapshot 1`] = `
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#686e7d",
+                                          "color": "#66676a",
                                           "fontFamily": "Geist-Medium",
                                           "fontSize": 14,
                                           "letterSpacing": 0,
@@ -431,7 +431,7 @@ exports[`EarnWithdrawInputView render matches snapshot 1`] = `
                                       testID="LendingMaxSafeWithdrawalTooltipIcon"
                                     >
                                       <SvgMock
-                                        color="#686e7d"
+                                        color="#66676a"
                                         fill="currentColor"
                                         height={20}
                                         name="Question"
@@ -450,7 +450,7 @@ exports[`EarnWithdrawInputView render matches snapshot 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 14,
                                       "letterSpacing": 0,
@@ -516,7 +516,7 @@ exports[`EarnWithdrawInputView render matches snapshot 1`] = `
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "letterSpacing": 0,
@@ -530,7 +530,7 @@ exports[`EarnWithdrawInputView render matches snapshot 1`] = `
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#b7bbc8",
+                                          "color": "#babbbe",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "letterSpacing": 0,
@@ -554,7 +554,7 @@ exports[`EarnWithdrawInputView render matches snapshot 1`] = `
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
                                       "backgroundColor": "#ffffff",
-                                      "borderColor": "#b7bbc866",
+                                      "borderColor": "#b4b4b566",
                                       "borderRadius": 16,
                                       "borderWidth": 1,
                                       "flexDirection": "row",
@@ -570,7 +570,7 @@ exports[`EarnWithdrawInputView render matches snapshot 1`] = `
                                     accessibilityRole="none"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Medium",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -581,7 +581,7 @@ exports[`EarnWithdrawInputView render matches snapshot 1`] = `
                                     0 USD
                                   </Text>
                                   <SvgMock
-                                    color="#121314"
+                                    color="#131416"
                                     fill="currentColor"
                                     height={16}
                                     name="SwapVertical"
@@ -620,7 +620,7 @@ exports[`EarnWithdrawInputView render matches snapshot 1`] = `
                               {
                                 "alignItems": "center",
                                 "alignSelf": "stretch",
-                                "backgroundColor": "#3c4d9d0f",
+                                "backgroundColor": "#b4b4b528",
                                 "borderRadius": 20,
                                 "flex": 1,
                                 "flexDirection": "row",
@@ -635,7 +635,7 @@ exports[`EarnWithdrawInputView render matches snapshot 1`] = `
                               accessibilityRole="none"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Medium",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -655,7 +655,7 @@ exports[`EarnWithdrawInputView render matches snapshot 1`] = `
                               {
                                 "alignItems": "center",
                                 "alignSelf": "stretch",
-                                "backgroundColor": "#3c4d9d0f",
+                                "backgroundColor": "#b4b4b528",
                                 "borderRadius": 20,
                                 "flex": 1,
                                 "flexDirection": "row",
@@ -670,7 +670,7 @@ exports[`EarnWithdrawInputView render matches snapshot 1`] = `
                               accessibilityRole="none"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Medium",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -690,7 +690,7 @@ exports[`EarnWithdrawInputView render matches snapshot 1`] = `
                               {
                                 "alignItems": "center",
                                 "alignSelf": "stretch",
-                                "backgroundColor": "#3c4d9d0f",
+                                "backgroundColor": "#b4b4b528",
                                 "borderRadius": 20,
                                 "flex": 1,
                                 "flexDirection": "row",
@@ -705,7 +705,7 @@ exports[`EarnWithdrawInputView render matches snapshot 1`] = `
                               accessibilityRole="none"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Medium",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -725,7 +725,7 @@ exports[`EarnWithdrawInputView render matches snapshot 1`] = `
                               {
                                 "alignItems": "center",
                                 "alignSelf": "stretch",
-                                "backgroundColor": "#3c4d9d0f",
+                                "backgroundColor": "#b4b4b528",
                                 "borderRadius": 20,
                                 "flex": 1,
                                 "flexDirection": "row",
@@ -737,7 +737,7 @@ exports[`EarnWithdrawInputView render matches snapshot 1`] = `
                             }
                           >
                             <SvgMock
-                              color="#121314"
+                              color="#131416"
                               fill="currentColor"
                               height={16}
                               name="Sparkle"
@@ -754,7 +754,7 @@ exports[`EarnWithdrawInputView render matches snapshot 1`] = `
                               accessibilityRole="none"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Medium",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -813,7 +813,7 @@ exports[`EarnWithdrawInputView render matches snapshot 1`] = `
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 12,
                                       "height": 48,
                                       "justifyContent": "center",
@@ -828,7 +828,7 @@ exports[`EarnWithdrawInputView render matches snapshot 1`] = `
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 32,
                                         "fontWeight": "500",
@@ -865,7 +865,7 @@ exports[`EarnWithdrawInputView render matches snapshot 1`] = `
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 12,
                                       "height": 48,
                                       "justifyContent": "center",
@@ -880,7 +880,7 @@ exports[`EarnWithdrawInputView render matches snapshot 1`] = `
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 32,
                                         "fontWeight": "500",
@@ -917,7 +917,7 @@ exports[`EarnWithdrawInputView render matches snapshot 1`] = `
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 12,
                                       "height": 48,
                                       "justifyContent": "center",
@@ -932,7 +932,7 @@ exports[`EarnWithdrawInputView render matches snapshot 1`] = `
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 32,
                                         "fontWeight": "500",
@@ -983,7 +983,7 @@ exports[`EarnWithdrawInputView render matches snapshot 1`] = `
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 12,
                                       "height": 48,
                                       "justifyContent": "center",
@@ -998,7 +998,7 @@ exports[`EarnWithdrawInputView render matches snapshot 1`] = `
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 32,
                                         "fontWeight": "500",
@@ -1035,7 +1035,7 @@ exports[`EarnWithdrawInputView render matches snapshot 1`] = `
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 12,
                                       "height": 48,
                                       "justifyContent": "center",
@@ -1050,7 +1050,7 @@ exports[`EarnWithdrawInputView render matches snapshot 1`] = `
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 32,
                                         "fontWeight": "500",
@@ -1087,7 +1087,7 @@ exports[`EarnWithdrawInputView render matches snapshot 1`] = `
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 12,
                                       "height": 48,
                                       "justifyContent": "center",
@@ -1102,7 +1102,7 @@ exports[`EarnWithdrawInputView render matches snapshot 1`] = `
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 32,
                                         "fontWeight": "500",
@@ -1153,7 +1153,7 @@ exports[`EarnWithdrawInputView render matches snapshot 1`] = `
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 12,
                                       "height": 48,
                                       "justifyContent": "center",
@@ -1168,7 +1168,7 @@ exports[`EarnWithdrawInputView render matches snapshot 1`] = `
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 32,
                                         "fontWeight": "500",
@@ -1205,7 +1205,7 @@ exports[`EarnWithdrawInputView render matches snapshot 1`] = `
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 12,
                                       "height": 48,
                                       "justifyContent": "center",
@@ -1220,7 +1220,7 @@ exports[`EarnWithdrawInputView render matches snapshot 1`] = `
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 32,
                                         "fontWeight": "500",
@@ -1257,7 +1257,7 @@ exports[`EarnWithdrawInputView render matches snapshot 1`] = `
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 12,
                                       "height": 48,
                                       "justifyContent": "center",
@@ -1272,7 +1272,7 @@ exports[`EarnWithdrawInputView render matches snapshot 1`] = `
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 32,
                                         "fontWeight": "500",
@@ -1323,7 +1323,7 @@ exports[`EarnWithdrawInputView render matches snapshot 1`] = `
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 12,
                                       "height": 48,
                                       "justifyContent": "center",
@@ -1340,7 +1340,7 @@ exports[`EarnWithdrawInputView render matches snapshot 1`] = `
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 32,
                                         "fontWeight": "500",
@@ -1377,7 +1377,7 @@ exports[`EarnWithdrawInputView render matches snapshot 1`] = `
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 12,
                                       "height": 48,
                                       "justifyContent": "center",
@@ -1392,7 +1392,7 @@ exports[`EarnWithdrawInputView render matches snapshot 1`] = `
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 32,
                                         "fontWeight": "500",
@@ -1447,7 +1447,7 @@ exports[`EarnWithdrawInputView render matches snapshot 1`] = `
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "height": 32,
                                         "width": 32,
                                       },
@@ -1479,7 +1479,7 @@ exports[`EarnWithdrawInputView render matches snapshot 1`] = `
                               {
                                 "alignItems": "center",
                                 "alignSelf": "stretch",
-                                "backgroundColor": "#121314",
+                                "backgroundColor": "#131416",
                                 "borderRadius": 12,
                                 "flexDirection": "row",
                                 "height": 48,
diff --git a/app/components/UI/Earn/Views/MusdQuickConvertView/MusdQuickConvertView.test.tsx b/app/components/UI/Earn/Views/MusdQuickConvertView/MusdQuickConvertView.test.tsx
index c2baaa91880c..bbb4fa43dba1 100644
--- a/app/components/UI/Earn/Views/MusdQuickConvertView/MusdQuickConvertView.test.tsx
+++ b/app/components/UI/Earn/Views/MusdQuickConvertView/MusdQuickConvertView.test.tsx
@@ -311,7 +311,7 @@ describe('MusdQuickConvertView', () => {
       expect(
         getByText(
           strings('earn.musd_conversion.quick_convert.title', {
-            apy: MUSD_CONVERSION_APY,
+            percentage: MUSD_CONVERSION_APY,
           }),
         ),
       ).toBeOnTheScreen();
diff --git a/app/components/UI/Earn/Views/MusdQuickConvertView/components/MusdBalanceCard/MusdBalanceCard.test.tsx b/app/components/UI/Earn/Views/MusdQuickConvertView/components/MusdBalanceCard/MusdBalanceCard.test.tsx
index ba7d3c63fab1..45d598b89064 100644
--- a/app/components/UI/Earn/Views/MusdQuickConvertView/components/MusdBalanceCard/MusdBalanceCard.test.tsx
+++ b/app/components/UI/Earn/Views/MusdQuickConvertView/components/MusdBalanceCard/MusdBalanceCard.test.tsx
@@ -54,7 +54,7 @@ describe('MusdBalanceCard', () => {
       expect(getByText(MUSD_TOKEN.symbol)).toBeOnTheScreen();
     });
 
-    it('displays percentage boost text from localization', () => {
+    it('displays percentage bonus text from localization', () => {
       const { getByText } = renderWithProvider(
         <MusdBalanceCard chainId={CHAIN_IDS.MAINNET} balance="$100.00" />,
         {
@@ -62,7 +62,7 @@ describe('MusdBalanceCard', () => {
         },
       );
 
-      expect(getByText('3% boost')).toBeOnTheScreen();
+      expect(getByText('3% bonus')).toBeOnTheScreen();
     });
   });
 });
diff --git a/app/components/UI/Earn/Views/MusdQuickConvertView/components/MusdBalanceCard/MusdBalanceCard.tsx b/app/components/UI/Earn/Views/MusdQuickConvertView/components/MusdBalanceCard/MusdBalanceCard.tsx
index ec95ee759a20..a0876b88b3ea 100644
--- a/app/components/UI/Earn/Views/MusdQuickConvertView/components/MusdBalanceCard/MusdBalanceCard.tsx
+++ b/app/components/UI/Earn/Views/MusdQuickConvertView/components/MusdBalanceCard/MusdBalanceCard.tsx
@@ -71,7 +71,7 @@ const MusdBalanceCard = ({ chainId, balance }: MusdBalanceCardProps) => {
 
       <View style={styles.right}>
         <Text variant={TextVariant.BodyMDMedium} color={TextColor.Success}>
-          {strings('earn.musd_conversion.percentage_boost', {
+          {strings('earn.musd_conversion.percentage_bonus', {
             percentage: MUSD_CONVERSION_APY,
           })}
         </Text>
diff --git a/app/components/UI/Earn/Views/MusdQuickConvertView/index.tsx b/app/components/UI/Earn/Views/MusdQuickConvertView/index.tsx
index 54025cada2f8..218a8e7b26df 100644
--- a/app/components/UI/Earn/Views/MusdQuickConvertView/index.tsx
+++ b/app/components/UI/Earn/Views/MusdQuickConvertView/index.tsx
@@ -258,12 +258,12 @@ const MusdQuickConvertView = () => {
         <View style={styles.headerTextContainer}>
           <Text variant={TextVariant.HeadingLG}>
             {strings('earn.musd_conversion.quick_convert.title', {
-              apy: MUSD_CONVERSION_APY,
+              percentage: MUSD_CONVERSION_APY,
             })}
           </Text>
           <Text variant={TextVariant.BodySM} color={TextColor.Alternative}>
             {strings('earn.musd_conversion.quick_convert.subtitle', {
-              apy: MUSD_CONVERSION_APY,
+              percentage: MUSD_CONVERSION_APY,
             })}{' '}
             <Text
               variant={TextVariant.BodySM}
diff --git a/app/components/UI/Earn/components/EarnDepositTokenListItem/__snapshots__/EarnDepositTokenListItem.test.tsx.snap b/app/components/UI/Earn/components/EarnDepositTokenListItem/__snapshots__/EarnDepositTokenListItem.test.tsx.snap
index ea9422991e2f..e279ca7409fa 100644
--- a/app/components/UI/Earn/components/EarnDepositTokenListItem/__snapshots__/EarnDepositTokenListItem.test.tsx.snap
+++ b/app/components/UI/Earn/components/EarnDepositTokenListItem/__snapshots__/EarnDepositTokenListItem.test.tsx.snap
@@ -141,7 +141,7 @@ exports[`EarnDepositTokenListItem render matches snapshot 1`] = `
         numberOfLines={1}
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -180,7 +180,7 @@ exports[`EarnDepositTokenListItem render matches snapshot 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#686e7d",
+          "color": "#66676a",
           "fontFamily": "Geist-Bold",
           "fontSize": 14,
           "letterSpacing": 0,
diff --git a/app/components/UI/Earn/components/EarnLendingBalance/__snapshots__/EarnLendingBalance.test.tsx.snap b/app/components/UI/Earn/components/EarnLendingBalance/__snapshots__/EarnLendingBalance.test.tsx.snap
index 5e6a3d05c223..32786f9cd2d7 100644
--- a/app/components/UI/Earn/components/EarnLendingBalance/__snapshots__/EarnLendingBalance.test.tsx.snap
+++ b/app/components/UI/Earn/components/EarnLendingBalance/__snapshots__/EarnLendingBalance.test.tsx.snap
@@ -12,7 +12,7 @@ exports[`EarnLendingBalance does renders earnings for output tokens 1`] = `
           "paddingTop": 14,
         },
         {
-          "backgroundColor": "#f3f5f9",
+          "backgroundColor": "#f3f3f4",
           "borderRadius": 12,
           "marginTop": 16,
           "padding": 16,
@@ -31,7 +31,7 @@ exports[`EarnLendingBalance does renders earnings for output tokens 1`] = `
         {
           "alignItems": "center",
           "alignSelf": "flex-start",
-          "backgroundColor": "#3c4d9d0f",
+          "backgroundColor": "#b4b4b528",
           "borderColor": "transparent",
           "borderRadius": 12,
           "borderWidth": 1,
@@ -49,7 +49,7 @@ exports[`EarnLendingBalance does renders earnings for output tokens 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -81,9 +81,9 @@ exports[`EarnLendingBalance does renders earnings for output tokens 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Bold",
-              "fontSize": 18,
+              "fontSize": 20,
               "letterSpacing": 0,
               "lineHeight": 24,
               "paddingBottom": 8,
@@ -113,7 +113,7 @@ exports[`EarnLendingBalance does renders earnings for output tokens 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Medium",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -153,7 +153,7 @@ exports[`EarnLendingBalance does renders earnings for output tokens 1`] = `
                 testID="annual-rate-tooltip"
               >
                 <SvgMock
-                  color="#b7bbc8"
+                  color="#babbbe"
                   fill="currentColor"
                   height={16}
                   name="Info"
@@ -204,7 +204,7 @@ exports[`EarnLendingBalance does renders earnings for output tokens 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Medium",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -226,7 +226,7 @@ exports[`EarnLendingBalance does renders earnings for output tokens 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -240,7 +240,7 @@ exports[`EarnLendingBalance does renders earnings for output tokens 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Medium",
                     "fontSize": 14,
                     "letterSpacing": 0,
@@ -409,7 +409,7 @@ exports[`EarnLendingBalance renders balance and buttons when user has lending po
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -449,7 +449,7 @@ exports[`EarnLendingBalance renders balance and buttons when user has lending po
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -469,7 +469,7 @@ exports[`EarnLendingBalance renders balance and buttons when user has lending po
           accessibilityRole="text"
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "fontFamily": "Geist-Medium",
               "fontSize": 14,
               "letterSpacing": 0,
@@ -494,7 +494,7 @@ exports[`EarnLendingBalance renders balance and buttons when user has lending po
           "paddingTop": 14,
         },
         {
-          "backgroundColor": "#f3f5f9",
+          "backgroundColor": "#f3f3f4",
           "borderRadius": 12,
           "marginTop": 16,
           "padding": 16,
@@ -513,7 +513,7 @@ exports[`EarnLendingBalance renders balance and buttons when user has lending po
         {
           "alignItems": "center",
           "alignSelf": "flex-start",
-          "backgroundColor": "#3c4d9d0f",
+          "backgroundColor": "#b4b4b528",
           "borderColor": "transparent",
           "borderRadius": 12,
           "borderWidth": 1,
@@ -531,7 +531,7 @@ exports[`EarnLendingBalance renders balance and buttons when user has lending po
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -553,7 +553,7 @@ exports[`EarnLendingBalance renders balance and buttons when user has lending po
         {
           "alignItems": "center",
           "alignSelf": "flex-start",
-          "backgroundColor": "#3c4d9d0f",
+          "backgroundColor": "#b4b4b528",
           "borderColor": "transparent",
           "borderRadius": 12,
           "borderWidth": 1,
@@ -571,7 +571,7 @@ exports[`EarnLendingBalance renders balance and buttons when user has lending po
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "letterSpacing": 0,
diff --git a/app/components/UI/Earn/components/EarnMaintenanceBanner/__snapshots__/EarnMaintenanceBanner.test.tsx.snap b/app/components/UI/Earn/components/EarnMaintenanceBanner/__snapshots__/EarnMaintenanceBanner.test.tsx.snap
index 1aee3ca7355d..d0a8498816b6 100644
--- a/app/components/UI/Earn/components/EarnMaintenanceBanner/__snapshots__/EarnMaintenanceBanner.test.tsx.snap
+++ b/app/components/UI/Earn/components/EarnMaintenanceBanner/__snapshots__/EarnMaintenanceBanner.test.tsx.snap
@@ -48,11 +48,11 @@ exports[`EarnMaintenanceBanner renders banner and maintenance message 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
-          "fontSize": 16,
+          "fontSize": 14,
           "letterSpacing": 0,
-          "lineHeight": 24,
+          "lineHeight": 22,
         }
       }
     >
diff --git a/app/components/UI/Earn/components/EarnTokenList/__snapshots__/EarnTokenList.test.tsx.snap b/app/components/UI/Earn/components/EarnTokenList/__snapshots__/EarnTokenList.test.tsx.snap
index 72890bec0a48..2c91bcc31bf0 100644
--- a/app/components/UI/Earn/components/EarnTokenList/__snapshots__/EarnTokenList.test.tsx.snap
+++ b/app/components/UI/Earn/components/EarnTokenList/__snapshots__/EarnTokenList.test.tsx.snap
@@ -34,7 +34,7 @@ exports[`EarnTokenList render matches snapshot 1`] = `
       style={
         [
           {
-            "backgroundColor": "#3f434a66",
+            "backgroundColor": "#0a0d135c",
             "bottom": 0,
             "left": 0,
             "position": "absolute",
@@ -84,7 +84,7 @@ exports[`EarnTokenList render matches snapshot 1`] = `
           [
             {
               "backgroundColor": "#ffffff",
-              "borderColor": "#b7bbc866",
+              "borderColor": "#b4b4b566",
               "borderTopLeftRadius": 24,
               "borderTopRightRadius": 24,
               "borderWidth": 1,
@@ -121,7 +121,7 @@ exports[`EarnTokenList render matches snapshot 1`] = `
           <View
             style={
               {
-                "backgroundColor": "#b7bbc866",
+                "backgroundColor": "#b4b4b566",
                 "borderRadius": 2,
                 "height": 4,
                 "width": 40,
@@ -181,7 +181,7 @@ exports[`EarnTokenList render matches snapshot 1`] = `
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -259,7 +259,7 @@ exports[`EarnTokenList render matches snapshot 1`] = `
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -508,7 +508,7 @@ exports[`EarnTokenList render matches snapshot 1`] = `
                   style={
                     {
                       "alignItems": "center",
-                      "backgroundColor": "#f3f5f9",
+                      "backgroundColor": "#f3f3f4",
                       "borderRadius": 8,
                       "gap": 8,
                       "paddingHorizontal": 16,
@@ -520,9 +520,9 @@ exports[`EarnTokenList render matches snapshot 1`] = `
                     accessibilityRole="text"
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Bold",
-                        "fontSize": 18,
+                        "fontSize": 20,
                         "letterSpacing": 0,
                         "lineHeight": 24,
                       }
@@ -548,7 +548,7 @@ exports[`EarnTokenList render matches snapshot 1`] = `
                     accessibilityRole="text"
                     style={
                       {
-                        "color": "#686e7d",
+                        "color": "#66676a",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -744,7 +744,7 @@ exports[`EarnTokenList render matches snapshot 1`] = `
                           numberOfLines={1}
                           style={
                             {
-                              "color": "#121314",
+                              "color": "#131416",
                               "fontFamily": "Geist-Medium",
                               "fontSize": 16,
                               "letterSpacing": 0,
@@ -783,7 +783,7 @@ exports[`EarnTokenList render matches snapshot 1`] = `
                         accessibilityRole="text"
                         style={
                           {
-                            "color": "#686e7d",
+                            "color": "#66676a",
                             "fontFamily": "Geist-Medium",
                             "fontSize": 14,
                             "letterSpacing": 0,
@@ -949,7 +949,7 @@ exports[`EarnTokenList render matches snapshot 1`] = `
                           numberOfLines={1}
                           style={
                             {
-                              "color": "#121314",
+                              "color": "#131416",
                               "fontFamily": "Geist-Medium",
                               "fontSize": 16,
                               "letterSpacing": 0,
@@ -988,7 +988,7 @@ exports[`EarnTokenList render matches snapshot 1`] = `
                         accessibilityRole="text"
                         style={
                           {
-                            "color": "#686e7d",
+                            "color": "#66676a",
                             "fontFamily": "Geist-Medium",
                             "fontSize": 14,
                             "letterSpacing": 0,
diff --git a/app/components/UI/Earn/components/EarnTokenSelector/__snapshots__/EarnTokenSelector.test.tsx.snap b/app/components/UI/Earn/components/EarnTokenSelector/__snapshots__/EarnTokenSelector.test.tsx.snap
index c07e094bebc1..8d6d0c422d40 100644
--- a/app/components/UI/Earn/components/EarnTokenSelector/__snapshots__/EarnTokenSelector.test.tsx.snap
+++ b/app/components/UI/Earn/components/EarnTokenSelector/__snapshots__/EarnTokenSelector.test.tsx.snap
@@ -9,7 +9,7 @@ exports[`EarnTokenSelector renders correctly 1`] = `
     {
       "alignItems": "center",
       "backgroundColor": "#ffffff",
-      "borderColor": "#b7bbc8",
+      "borderColor": "#949596",
       "borderRadius": 8,
       "borderWidth": 1,
       "flexDirection": "row",
@@ -183,7 +183,7 @@ exports[`EarnTokenSelector renders correctly 1`] = `
             numberOfLines={1}
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Medium",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -260,7 +260,7 @@ exports[`EarnTokenSelector renders correctly 1`] = `
             numberOfLines={1}
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Medium",
                 "fontSize": 14,
                 "letterSpacing": 0,
@@ -278,7 +278,7 @@ exports[`EarnTokenSelector renders correctly 1`] = `
   </View>
   <View>
     <SvgMock
-      color="#121314"
+      color="#131416"
       fill="currentColor"
       height={16}
       name="ArrowDown"
diff --git a/app/components/UI/Earn/components/Earnings/EarningsHistory/EarningsHistoryChart/__snapshots__/EarningsHistoryChart.test.tsx.snap b/app/components/UI/Earn/components/Earnings/EarningsHistory/EarningsHistoryChart/__snapshots__/EarningsHistoryChart.test.tsx.snap
index d29f3079c0fd..d99c9a206ff8 100644
--- a/app/components/UI/Earn/components/Earnings/EarningsHistory/EarningsHistoryChart/__snapshots__/EarningsHistoryChart.test.tsx.snap
+++ b/app/components/UI/Earn/components/Earnings/EarningsHistory/EarningsHistoryChart/__snapshots__/EarningsHistoryChart.test.tsx.snap
@@ -37,7 +37,7 @@ exports[`EarningsHistoryChart renders to match snapshot 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
diff --git a/app/components/UI/Earn/components/Earnings/__snapshots__/index.test.tsx.snap b/app/components/UI/Earn/components/Earnings/__snapshots__/index.test.tsx.snap
index f1e5e6c6010f..115e797b4bf7 100644
--- a/app/components/UI/Earn/components/Earnings/__snapshots__/index.test.tsx.snap
+++ b/app/components/UI/Earn/components/Earnings/__snapshots__/index.test.tsx.snap
@@ -13,9 +13,9 @@ exports[`Earnings displays lending maintenance banner when feature flag is enabl
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Bold",
-          "fontSize": 18,
+          "fontSize": 20,
           "letterSpacing": 0,
           "lineHeight": 24,
           "paddingBottom": 8,
@@ -72,11 +72,11 @@ exports[`Earnings displays lending maintenance banner when feature flag is enabl
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
-                "fontSize": 16,
+                "fontSize": 14,
                 "letterSpacing": 0,
-                "lineHeight": 24,
+                "lineHeight": 22,
               }
             }
           >
@@ -104,7 +104,7 @@ exports[`Earnings displays lending maintenance banner when feature flag is enabl
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Medium",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -144,7 +144,7 @@ exports[`Earnings displays lending maintenance banner when feature flag is enabl
             testID="annual-rate-tooltip"
           >
             <SvgMock
-              color="#b7bbc8"
+              color="#babbbe"
               fill="currentColor"
               height={16}
               name="Info"
@@ -195,7 +195,7 @@ exports[`Earnings displays lending maintenance banner when feature flag is enabl
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Medium",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -217,7 +217,7 @@ exports[`Earnings displays lending maintenance banner when feature flag is enabl
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -231,7 +231,7 @@ exports[`Earnings displays lending maintenance banner when feature flag is enabl
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Medium",
                 "fontSize": 14,
                 "letterSpacing": 0,
@@ -264,7 +264,7 @@ exports[`Earnings displays lending maintenance banner when feature flag is enabl
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Medium",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -286,7 +286,7 @@ exports[`Earnings displays lending maintenance banner when feature flag is enabl
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -300,7 +300,7 @@ exports[`Earnings displays lending maintenance banner when feature flag is enabl
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Medium",
                 "fontSize": 14,
                 "letterSpacing": 0,
@@ -325,7 +325,7 @@ exports[`Earnings displays lending maintenance banner when feature flag is enabl
           {
             "alignItems": "center",
             "alignSelf": "stretch",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -342,7 +342,7 @@ exports[`Earnings displays lending maintenance banner when feature flag is enabl
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Medium",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -371,9 +371,9 @@ exports[`Earnings displays pooled-staking maintenance banner when feature flag i
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Bold",
-          "fontSize": 18,
+          "fontSize": 20,
           "letterSpacing": 0,
           "lineHeight": 24,
           "paddingBottom": 8,
@@ -430,11 +430,11 @@ exports[`Earnings displays pooled-staking maintenance banner when feature flag i
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
-                "fontSize": 16,
+                "fontSize": 14,
                 "letterSpacing": 0,
-                "lineHeight": 24,
+                "lineHeight": 22,
               }
             }
           >
@@ -462,7 +462,7 @@ exports[`Earnings displays pooled-staking maintenance banner when feature flag i
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Medium",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -502,7 +502,7 @@ exports[`Earnings displays pooled-staking maintenance banner when feature flag i
             testID="annual-rate-tooltip"
           >
             <SvgMock
-              color="#b7bbc8"
+              color="#babbbe"
               fill="currentColor"
               height={16}
               name="Info"
@@ -553,7 +553,7 @@ exports[`Earnings displays pooled-staking maintenance banner when feature flag i
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Medium",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -575,7 +575,7 @@ exports[`Earnings displays pooled-staking maintenance banner when feature flag i
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -589,7 +589,7 @@ exports[`Earnings displays pooled-staking maintenance banner when feature flag i
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Medium",
                 "fontSize": 14,
                 "letterSpacing": 0,
@@ -622,7 +622,7 @@ exports[`Earnings displays pooled-staking maintenance banner when feature flag i
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Medium",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -644,7 +644,7 @@ exports[`Earnings displays pooled-staking maintenance banner when feature flag i
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -658,7 +658,7 @@ exports[`Earnings displays pooled-staking maintenance banner when feature flag i
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Medium",
                 "fontSize": 14,
                 "letterSpacing": 0,
@@ -683,7 +683,7 @@ exports[`Earnings displays pooled-staking maintenance banner when feature flag i
           {
             "alignItems": "center",
             "alignSelf": "stretch",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -700,7 +700,7 @@ exports[`Earnings displays pooled-staking maintenance banner when feature flag i
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Medium",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -729,9 +729,9 @@ exports[`Earnings should render correctly 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Bold",
-          "fontSize": 18,
+          "fontSize": 20,
           "letterSpacing": 0,
           "lineHeight": 24,
           "paddingBottom": 8,
@@ -761,7 +761,7 @@ exports[`Earnings should render correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Medium",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -801,7 +801,7 @@ exports[`Earnings should render correctly 1`] = `
             testID="annual-rate-tooltip"
           >
             <SvgMock
-              color="#b7bbc8"
+              color="#babbbe"
               fill="currentColor"
               height={16}
               name="Info"
@@ -852,7 +852,7 @@ exports[`Earnings should render correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Medium",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -874,7 +874,7 @@ exports[`Earnings should render correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -888,7 +888,7 @@ exports[`Earnings should render correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Medium",
                 "fontSize": 14,
                 "letterSpacing": 0,
@@ -921,7 +921,7 @@ exports[`Earnings should render correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Medium",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -943,7 +943,7 @@ exports[`Earnings should render correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -957,7 +957,7 @@ exports[`Earnings should render correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Medium",
                 "fontSize": 14,
                 "letterSpacing": 0,
@@ -982,7 +982,7 @@ exports[`Earnings should render correctly 1`] = `
           {
             "alignItems": "center",
             "alignSelf": "stretch",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -999,7 +999,7 @@ exports[`Earnings should render correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Medium",
               "fontSize": 16,
               "letterSpacing": 0,
diff --git a/app/components/UI/Earn/components/EmptyStateCta/__snapshots__/EmptyStateCta.test.tsx.snap b/app/components/UI/Earn/components/EmptyStateCta/__snapshots__/EmptyStateCta.test.tsx.snap
index 7a95864c22c5..e2dab80d5c93 100644
--- a/app/components/UI/Earn/components/EmptyStateCta/__snapshots__/EmptyStateCta.test.tsx.snap
+++ b/app/components/UI/Earn/components/EmptyStateCta/__snapshots__/EmptyStateCta.test.tsx.snap
@@ -6,7 +6,7 @@ exports[`EmptyStateCta renders correctly 1`] = `
   style={
     {
       "alignItems": "center",
-      "backgroundColor": "#f3f5f9",
+      "backgroundColor": "#f3f3f4",
       "borderRadius": 12,
       "marginTop": 8,
       "padding": 16,
@@ -18,9 +18,9 @@ exports[`EmptyStateCta renders correctly 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Bold",
-        "fontSize": 18,
+        "fontSize": 20,
         "letterSpacing": 0,
         "lineHeight": 24,
         "paddingBottom": 8,
@@ -33,7 +33,7 @@ exports[`EmptyStateCta renders correctly 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
@@ -72,7 +72,7 @@ exports[`EmptyStateCta renders correctly 1`] = `
       style={
         {
           "backgroundColor": "transparent",
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -108,7 +108,7 @@ exports[`EmptyStateCta renders correctly 1`] = `
       {
         "alignItems": "center",
         "alignSelf": "stretch",
-        "backgroundColor": "#3c4d9d0f",
+        "backgroundColor": "#b4b4b528",
         "borderColor": "transparent",
         "borderRadius": 12,
         "borderWidth": 1,
@@ -124,7 +124,7 @@ exports[`EmptyStateCta renders correctly 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Medium",
           "fontSize": 16,
           "letterSpacing": 0,
diff --git a/app/components/UI/Earn/components/MaxInputModal/__snapshots__/MaxInputModal.test.tsx.snap b/app/components/UI/Earn/components/MaxInputModal/__snapshots__/MaxInputModal.test.tsx.snap
index fd03db9ea75a..d2d7fafaf240 100644
--- a/app/components/UI/Earn/components/MaxInputModal/__snapshots__/MaxInputModal.test.tsx.snap
+++ b/app/components/UI/Earn/components/MaxInputModal/__snapshots__/MaxInputModal.test.tsx.snap
@@ -334,7 +334,7 @@ exports[`MaxInputModal render matches snapshot 1`] = `
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -384,7 +384,7 @@ exports[`MaxInputModal render matches snapshot 1`] = `
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -421,7 +421,7 @@ exports[`MaxInputModal render matches snapshot 1`] = `
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -476,9 +476,9 @@ exports[`MaxInputModal render matches snapshot 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
-                                      "fontSize": 18,
+                                      "fontSize": 20,
                                       "letterSpacing": 0,
                                       "lineHeight": 24,
                                     }
@@ -510,7 +510,7 @@ exports[`MaxInputModal render matches snapshot 1`] = `
                                     }
                                   >
                                     <SvgMock
-                                      color="#121314"
+                                      color="#131416"
                                       fill="currentColor"
                                       height={24}
                                       name="Close"
@@ -538,7 +538,7 @@ exports[`MaxInputModal render matches snapshot 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -578,7 +578,7 @@ exports[`MaxInputModal render matches snapshot 1`] = `
                                   {
                                     "alignItems": "center",
                                     "alignSelf": "stretch",
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "borderColor": "transparent",
                                     "borderRadius": 12,
                                     "borderWidth": 1,
@@ -594,7 +594,7 @@ exports[`MaxInputModal render matches snapshot 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Medium",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -624,7 +624,7 @@ exports[`MaxInputModal render matches snapshot 1`] = `
                                   {
                                     "alignItems": "center",
                                     "alignSelf": "stretch",
-                                    "backgroundColor": "#121314",
+                                    "backgroundColor": "#131416",
                                     "borderRadius": 12,
                                     "flexDirection": "row",
                                     "height": 48,
diff --git a/app/components/UI/Earn/components/Musd/MusdConversionAssetOverviewCta/MusdConversionAssetOverviewCta.test.tsx b/app/components/UI/Earn/components/Musd/MusdConversionAssetOverviewCta/MusdConversionAssetOverviewCta.test.tsx
index d69644ee2167..e2ade49a6a8e 100644
--- a/app/components/UI/Earn/components/Musd/MusdConversionAssetOverviewCta/MusdConversionAssetOverviewCta.test.tsx
+++ b/app/components/UI/Earn/components/Musd/MusdConversionAssetOverviewCta/MusdConversionAssetOverviewCta.test.tsx
@@ -131,7 +131,7 @@ describe('MusdConversionAssetOverviewCta', () => {
       ).toBeOnTheScreen();
       expect(
         getByText(
-          `Convert your stablecoins to mUSD and receive up to a ${MUSD_CONVERSION_APY}% bonus.`,
+          `Convert your stablecoins to mUSD and get a ${MUSD_CONVERSION_APY}% annualized bonus.`,
         ),
       ).toBeOnTheScreen();
     });
@@ -435,7 +435,9 @@ describe('MusdConversionAssetOverviewCta', () => {
       });
 
       // Assert
-      const expectedCtaText = `${strings('earn.musd_conversion.earn_rewards_when')} ${strings('earn.musd_conversion.you_convert_to')} mUSD`;
+      const expectedCtaText = strings('earn.musd_conversion.bonus_title', {
+        percentage: MUSD_CONVERSION_APY,
+      });
 
       expect(mockCreateEventBuilder).toHaveBeenCalledTimes(1);
       expect(mockCreateEventBuilder).toHaveBeenCalledWith(
@@ -482,7 +484,9 @@ describe('MusdConversionAssetOverviewCta', () => {
       });
 
       // Assert
-      const expectedCtaText = `${strings('earn.musd_conversion.earn_rewards_when')} ${strings('earn.musd_conversion.you_convert_to')} mUSD`;
+      const expectedCtaText = strings('earn.musd_conversion.bonus_title', {
+        percentage: MUSD_CONVERSION_APY,
+      });
 
       expect(mockCreateEventBuilder).toHaveBeenCalledTimes(1);
       expect(mockCreateEventBuilder).toHaveBeenCalledWith(
@@ -530,7 +534,9 @@ describe('MusdConversionAssetOverviewCta', () => {
       });
 
       // Assert
-      const expectedCtaText = `${strings('earn.musd_conversion.earn_rewards_when')} ${strings('earn.musd_conversion.you_convert_to')} mUSD`;
+      const expectedCtaText = strings('earn.musd_conversion.bonus_title', {
+        percentage: MUSD_CONVERSION_APY,
+      });
 
       expect(mockCreateEventBuilder).toHaveBeenCalledTimes(1);
       expect(mockCreateEventBuilder).toHaveBeenCalledWith(
diff --git a/app/components/UI/Earn/components/Musd/MusdConversionAssetOverviewCta/MusdConversionAssetOverviewCta.view.test.tsx b/app/components/UI/Earn/components/Musd/MusdConversionAssetOverviewCta/MusdConversionAssetOverviewCta.view.test.tsx
index 817e079bc2b9..3fa6a6945e69 100644
--- a/app/components/UI/Earn/components/Musd/MusdConversionAssetOverviewCta/MusdConversionAssetOverviewCta.view.test.tsx
+++ b/app/components/UI/Earn/components/Musd/MusdConversionAssetOverviewCta/MusdConversionAssetOverviewCta.view.test.tsx
@@ -103,7 +103,7 @@ describeForPlatforms('MusdConversionAssetOverviewCta', () => {
     ).toBeOnTheScreen();
     expect(
       getByText(
-        `Convert your stablecoins to mUSD and receive up to a ${MUSD_CONVERSION_APY}% bonus.`,
+        `Convert your stablecoins to mUSD and get a ${MUSD_CONVERSION_APY}% annualized bonus.`,
       ),
     ).toBeOnTheScreen();
   });
@@ -474,7 +474,7 @@ describeForPlatforms('MusdConversionAssetOverviewCta', () => {
     ).toBeOnTheScreen();
   });
 
-  it('renders CTA with correct boost title text', () => {
+  it('renders CTA with correct bonus title text', () => {
     // Arrange
     const state = initialStateWallet()
       .withMinimalMultichainAssets()
@@ -507,7 +507,7 @@ describeForPlatforms('MusdConversionAssetOverviewCta', () => {
     ).toBeOnTheScreen();
   });
 
-  it('renders CTA with correct boost description text', () => {
+  it('renders CTA with correct bonus description text', () => {
     // Arrange
     const state = initialStateWallet()
       .withMinimalMultichainAssets()
@@ -537,7 +537,7 @@ describeForPlatforms('MusdConversionAssetOverviewCta', () => {
     // Assert
     expect(
       getByText(
-        `Convert your stablecoins to mUSD and receive up to a ${MUSD_CONVERSION_APY}% bonus.`,
+        `Convert your stablecoins to mUSD and get a ${MUSD_CONVERSION_APY}% annualized bonus.`,
       ),
     ).toBeOnTheScreen();
   });
diff --git a/app/components/UI/Earn/components/Musd/MusdConversionAssetOverviewCta/index.tsx b/app/components/UI/Earn/components/Musd/MusdConversionAssetOverviewCta/index.tsx
index 9f70c130b2c8..2d066511d1eb 100644
--- a/app/components/UI/Earn/components/Musd/MusdConversionAssetOverviewCta/index.tsx
+++ b/app/components/UI/Earn/components/Musd/MusdConversionAssetOverviewCta/index.tsx
@@ -53,7 +53,9 @@ const MusdConversionAssetOverviewCta = ({
   const submitCtaPressedEvent = () => {
     const { EVENT_LOCATIONS, MUSD_CTA_TYPES } = MUSD_EVENTS_CONSTANTS;
 
-    const ctaText = `${strings('earn.musd_conversion.earn_rewards_when')} ${strings('earn.musd_conversion.you_convert_to')} mUSD`;
+    const ctaText = strings('earn.musd_conversion.bonus_title', {
+      percentage: MUSD_CONVERSION_APY,
+    });
 
     const getRedirectLocation = () => {
       if (!hasSeenConversionEducationScreen) {
@@ -114,12 +116,12 @@ const MusdConversionAssetOverviewCta = ({
       {/* Text content in the center */}
       <View style={styles.textContainer}>
         <Text variant={TextVariant.BodySMMedium} style={styles.title}>
-          {strings('earn.musd_conversion.boost_title', {
+          {strings('earn.musd_conversion.bonus_title', {
             percentage: MUSD_CONVERSION_APY,
           })}
         </Text>
         <Text variant={TextVariant.BodySMMedium} color={TextColor.Alternative}>
-          {strings('earn.musd_conversion.boost_description', {
+          {strings('earn.musd_conversion.bonus_description', {
             percentage: MUSD_CONVERSION_APY,
           })}
         </Text>
diff --git a/app/components/UI/Earn/hooks/useEarnToasts.test.tsx b/app/components/UI/Earn/hooks/useEarnToasts.test.tsx
index 4a8bfc28bf1e..417195c10cd9 100644
--- a/app/components/UI/Earn/hooks/useEarnToasts.test.tsx
+++ b/app/components/UI/Earn/hooks/useEarnToasts.test.tsx
@@ -200,7 +200,7 @@ describe('useEarnToasts', () => {
 
       expect(successToast.labelOptions).toBeDefined();
       expect(Array.isArray(successToast.labelOptions)).toBe(true);
-      expect(successToast.labelOptions).toHaveLength(1);
+      expect(successToast.labelOptions).toHaveLength(3);
     });
 
     it('includes labelOptions in failed toast', () => {
diff --git a/app/components/UI/Earn/hooks/useEarnToasts.tsx b/app/components/UI/Earn/hooks/useEarnToasts.tsx
index aadacf310d18..eaa3a0fac804 100644
--- a/app/components/UI/Earn/hooks/useEarnToasts.tsx
+++ b/app/components/UI/Earn/hooks/useEarnToasts.tsx
@@ -14,7 +14,12 @@ import {
 } from '../../../../component-library/components/Toast/Toast.types';
 import { useAppThemeFromContext } from '../../../../util/theme';
 import { Spinner } from '@metamask/design-system-react-native/dist/components/temp-components/Spinner/index.cjs';
-import { IconSize as ReactNativeDsIconSize } from '@metamask/design-system-react-native';
+import {
+  IconSize as ReactNativeDsIconSize,
+  Text,
+  TextColor,
+  TextVariant,
+} from '@metamask/design-system-react-native';
 
 export type EarnToastOptions = Omit<
   Extract<ToastOptions, { variant: ToastVariants.Icon }>,
@@ -185,6 +190,14 @@ const useEarnToasts = (): {
           ...earnBaseToastOptions.success,
           labelOptions: getEarnToastLabels({
             primary: strings('earn.musd_conversion.toasts.delivered'),
+            secondary: (
+              <Text
+                variant={TextVariant.BodySm}
+                color={TextColor.TextAlternative}
+              >
+                {strings('earn.musd_conversion.toasts.delivered_description')}
+              </Text>
+            ),
           }),
           closeButtonOptions,
         },
diff --git a/app/components/UI/Earn/hooks/useMusdConversionTokens.test.ts b/app/components/UI/Earn/hooks/useMusdConversionTokens.test.ts
index dce189fa7ce4..8c92863938cb 100644
--- a/app/components/UI/Earn/hooks/useMusdConversionTokens.test.ts
+++ b/app/components/UI/Earn/hooks/useMusdConversionTokens.test.ts
@@ -191,6 +191,23 @@ describe('useMusdConversionTokens', () => {
       expect(result.current.tokens).not.toContainEqual(mockDaiMainnet);
     });
 
+    it('returns tokens sorted by fiat balance descending', () => {
+      mockUseAccountTokens.mockReturnValue([
+        mockUsdcLinea,
+        mockUsdcMainnet,
+        mockUsdtMainnet,
+      ]);
+      mockIsTokenAllowed.mockReturnValue(true);
+
+      const { result } = renderHook(() => useMusdConversionTokens());
+
+      expect(result.current.tokens).toEqual([
+        mockUsdtMainnet,
+        mockUsdcMainnet,
+        mockUsdcLinea,
+      ]);
+    });
+
     it('returns empty array when no tokens match allowlist', () => {
       mockUseAccountTokens.mockReturnValue([mockDaiMainnet]);
       mockIsTokenAllowed.mockReturnValue(false);
diff --git a/app/components/UI/Earn/hooks/useMusdConversionTokens.ts b/app/components/UI/Earn/hooks/useMusdConversionTokens.ts
index 1711c1f22527..44295c9b6613 100644
--- a/app/components/UI/Earn/hooks/useMusdConversionTokens.ts
+++ b/app/components/UI/Earn/hooks/useMusdConversionTokens.ts
@@ -87,9 +87,12 @@ export const useMusdConversionTokens = () => {
     [filterTokensWithAllowlistAndBlocklist, filterTokensWithMinBalance],
   );
 
-  // Allowed tokens for conversion.
+  // Allowed tokens for conversion, sorted by fiat balance descending.
   const conversionTokens = useMemo(
-    () => filterAllowedTokens(allTokens),
+    () =>
+      filterAllowedTokens(allTokens).sort(
+        (a, b) => (b.fiat?.balance ?? 0) - (a.fiat?.balance ?? 0),
+      ),
     [allTokens, filterAllowedTokens],
   );
 
diff --git a/app/components/UI/Earn/hooks/useMusdCtaVisibility.test.ts b/app/components/UI/Earn/hooks/useMusdCtaVisibility.test.ts
index 68c0e577231a..445ae7ec8891 100644
--- a/app/components/UI/Earn/hooks/useMusdCtaVisibility.test.ts
+++ b/app/components/UI/Earn/hooks/useMusdCtaVisibility.test.ts
@@ -11,6 +11,8 @@ import { useMusdConversionEligibility } from './useMusdConversionEligibility';
 import { useCurrentNetworkInfo } from '../../../hooks/useCurrentNetworkInfo';
 import { useNetworksByCustomNamespace } from '../../../hooks/useNetworksByNamespace/useNetworksByNamespace';
 import { useRampTokens, RampsToken } from '../../Ramp/hooks/useRampTokens';
+import useRampsTokens from '../../Ramp/hooks/useRampsTokens';
+import useRampsUnifiedV2Enabled from '../../Ramp/hooks/useRampsUnifiedV2Enabled';
 import { MUSD_TOKEN_ASSET_ID_BY_CHAIN } from '../constants/musd';
 import { createMockToken } from '../../Stake/testUtils';
 import {
@@ -31,6 +33,8 @@ jest.mock('./useMusdConversionEligibility');
 jest.mock('../../../hooks/useCurrentNetworkInfo');
 jest.mock('../../../hooks/useNetworksByNamespace/useNetworksByNamespace');
 jest.mock('../../Ramp/hooks/useRampTokens');
+jest.mock('../../Ramp/hooks/useRampsTokens');
+jest.mock('../../Ramp/hooks/useRampsUnifiedV2Enabled');
 jest.mock('react-redux', () => ({
   ...jest.requireActual('react-redux'),
   useSelector: jest.fn(),
@@ -61,6 +65,13 @@ const mockUseNetworksByCustomNamespace =
 const mockUseRampTokens = useRampTokens as jest.MockedFunction<
   typeof useRampTokens
 >;
+const mockUseRampsTokens = useRampsTokens as jest.MockedFunction<
+  typeof useRampsTokens
+>;
+const mockUseRampsUnifiedV2Enabled =
+  useRampsUnifiedV2Enabled as jest.MockedFunction<
+    typeof useRampsUnifiedV2Enabled
+  >;
 const mockUseMusdConversionTokens =
   useMusdConversionTokens as jest.MockedFunction<
     typeof useMusdConversionTokens
@@ -195,6 +206,14 @@ describe('useMusdCtaVisibility', () => {
     mockUseNetworksByCustomNamespace.mockReturnValue(
       defaultNetworksByNamespace,
     );
+    mockUseRampsUnifiedV2Enabled.mockReturnValue(false);
+    mockUseRampsTokens.mockReturnValue({
+      tokens: null,
+      selectedToken: null,
+      setSelectedToken: jest.fn(),
+      isLoading: false,
+      error: null,
+    });
     mockUseRampTokens.mockReturnValue(defaultRampTokens);
     mockUseMusdConversionTokens.mockReturnValue({
       tokens: [],
diff --git a/app/components/UI/Earn/hooks/useMusdRampAvailability.test.ts b/app/components/UI/Earn/hooks/useMusdRampAvailability.test.ts
index 27641a1dfe20..a0ad78b53c6d 100644
--- a/app/components/UI/Earn/hooks/useMusdRampAvailability.test.ts
+++ b/app/components/UI/Earn/hooks/useMusdRampAvailability.test.ts
@@ -2,233 +2,174 @@ import { renderHook } from '@testing-library/react-hooks';
 import { CHAIN_IDS } from '@metamask/transaction-controller';
 import { Hex } from '@metamask/utils';
 import { useMusdRampAvailability } from './useMusdRampAvailability';
-import { useRampTokens, RampsToken } from '../../Ramp/hooks/useRampTokens';
-import { MUSD_TOKEN_ASSET_ID_BY_CHAIN } from '../constants/musd';
-
-jest.mock('../../Ramp/hooks/useRampTokens');
+import {
+  MUSD_BUYABLE_CHAIN_IDS,
+  MUSD_TOKEN,
+  MUSD_TOKEN_ADDRESS_BY_CHAIN,
+} from '../constants/musd';
+import {
+  getTokenBuyabilityKey,
+  useTokensBuyability,
+} from '../../Ramp/hooks/useTokenBuyability';
+import { TokenI } from '../../Tokens/types';
+
+jest.mock('../../Ramp/hooks/useTokenBuyability', () => {
+  const actual = jest.requireActual('../../Ramp/hooks/useTokenBuyability');
+  return {
+    ...actual,
+    useTokensBuyability: jest.fn(),
+  };
+});
 
-const mockUseRampTokens = useRampTokens as jest.MockedFunction<
-  typeof useRampTokens
+const mockUseTokensBuyability = useTokensBuyability as jest.MockedFunction<
+  typeof useTokensBuyability
 >;
 
 describe('useMusdRampAvailability', () => {
-  const createMusdRampToken = (
-    chainId: Hex,
-    tokenSupported = true,
-  ): RampsToken => {
-    const assetId = MUSD_TOKEN_ASSET_ID_BY_CHAIN[chainId].toLowerCase();
-    const caipChainId = assetId.split('/')[0] as `${string}:${string}`;
-    return {
-      assetId: assetId as `${string}:${string}/${string}:${string}`,
-      symbol: 'MUSD',
-      chainId: caipChainId,
-      tokenSupported,
-      name: 'MetaMask USD',
-      decimals: 6,
-      iconUrl: 'https://example.com/musd.png',
-    };
-  };
+  const getMusdToken = (chainId: Hex): TokenI => ({
+    address: MUSD_TOKEN_ADDRESS_BY_CHAIN[chainId],
+    chainId,
+    symbol: MUSD_TOKEN.symbol,
+    name: MUSD_TOKEN.name,
+    decimals: MUSD_TOKEN.decimals,
+    image: '',
+    logo: undefined,
+    balance: '0',
+    isETH: false,
+    isNative: false,
+  });
 
-  const defaultRampTokens = {
-    topTokens: null,
-    allTokens: [
-      createMusdRampToken(CHAIN_IDS.MAINNET as Hex),
-      createMusdRampToken(CHAIN_IDS.LINEA_MAINNET as Hex),
-    ],
-    isLoading: false,
-    error: null,
+  const MAINNET_MUSD_KEY = getTokenBuyabilityKey(
+    getMusdToken(CHAIN_IDS.MAINNET as Hex),
+  );
+  const LINEA_MUSD_KEY = getTokenBuyabilityKey(
+    getMusdToken(CHAIN_IDS.LINEA_MAINNET as Hex),
+  );
+
+  const setBuyability = (
+    buyabilityByTokenKey: Record<string, boolean> = {},
+  ) => {
+    mockUseTokensBuyability.mockReturnValue({
+      buyabilityByTokenKey,
+      isLoading: false,
+    });
   };
 
   beforeEach(() => {
     jest.clearAllMocks();
-    mockUseRampTokens.mockReturnValue(defaultRampTokens);
-  });
-
-  afterEach(() => {
-    jest.resetAllMocks();
+    setBuyability({
+      [MAINNET_MUSD_KEY]: true,
+      [LINEA_MUSD_KEY]: true,
+    });
   });
 
-  describe('hook structure', () => {
-    it('returns object with all required properties', () => {
-      const { result } = renderHook(() => useMusdRampAvailability());
-
-      expect(result.current).toHaveProperty('isMusdBuyableOnChain');
-      expect(result.current).toHaveProperty('isMusdBuyableOnAnyChain');
-      expect(result.current).toHaveProperty('getIsMusdBuyable');
-    });
+  it('returns false for all mUSD buyable chains when no tokens are buyable', () => {
+    setBuyability({});
 
-    it('returns getIsMusdBuyable as a function', () => {
-      const { result } = renderHook(() => useMusdRampAvailability());
+    const { result } = renderHook(() => useMusdRampAvailability());
 
-      expect(typeof result.current.getIsMusdBuyable).toBe('function');
+    MUSD_BUYABLE_CHAIN_IDS.forEach((chainId) => {
+      expect(result.current.isMusdBuyableOnChain[chainId]).toBe(false);
     });
+    expect(result.current.isMusdBuyableOnAnyChain).toBe(false);
   });
 
-  describe('isMusdBuyableOnChain', () => {
-    it('returns empty object when allTokens is null', () => {
-      mockUseRampTokens.mockReturnValue({
-        ...defaultRampTokens,
-        allTokens: null,
-      });
+  it('marks remaining chains as not buyable when buyability results are missing', () => {
+    setBuyability({ [MAINNET_MUSD_KEY]: true });
 
-      const { result } = renderHook(() => useMusdRampAvailability());
+    const { result } = renderHook(() => useMusdRampAvailability());
 
-      expect(result.current.isMusdBuyableOnChain).toEqual({});
-    });
+    expect(result.current.isMusdBuyableOnChain[CHAIN_IDS.MAINNET]).toBe(true);
+    expect(result.current.isMusdBuyableOnChain[CHAIN_IDS.LINEA_MAINNET]).toBe(
+      false,
+    );
+  });
 
-    it('returns buyability status for each chain', () => {
-      mockUseRampTokens.mockReturnValue({
-        ...defaultRampTokens,
-        allTokens: [
-          createMusdRampToken(CHAIN_IDS.MAINNET as Hex, true),
-          createMusdRampToken(CHAIN_IDS.LINEA_MAINNET as Hex, false),
-        ],
-      });
-
-      const { result } = renderHook(() => useMusdRampAvailability());
-
-      expect(result.current.isMusdBuyableOnChain[CHAIN_IDS.MAINNET]).toBe(true);
-      expect(result.current.isMusdBuyableOnChain[CHAIN_IDS.LINEA_MAINNET]).toBe(
-        false,
-      );
+  it('returns true when at least one chain has buyable mUSD', () => {
+    setBuyability({
+      [MAINNET_MUSD_KEY]: false,
+      [LINEA_MUSD_KEY]: true,
     });
 
-    it('returns false for chain when token not supported', () => {
-      mockUseRampTokens.mockReturnValue({
-        ...defaultRampTokens,
-        allTokens: [
-          createMusdRampToken(CHAIN_IDS.MAINNET as Hex, false),
-          createMusdRampToken(CHAIN_IDS.LINEA_MAINNET as Hex, false),
-        ],
-      });
-
-      const { result } = renderHook(() => useMusdRampAvailability());
-
-      expect(result.current.isMusdBuyableOnChain[CHAIN_IDS.MAINNET]).toBe(
-        false,
-      );
-      expect(result.current.isMusdBuyableOnChain[CHAIN_IDS.LINEA_MAINNET]).toBe(
-        false,
-      );
-    });
-  });
+    const { result } = renderHook(() => useMusdRampAvailability());
 
-  describe('isMusdBuyableOnAnyChain', () => {
-    it('returns true when at least one chain has buyable mUSD', () => {
-      mockUseRampTokens.mockReturnValue({
-        ...defaultRampTokens,
-        allTokens: [
-          createMusdRampToken(CHAIN_IDS.MAINNET as Hex, false),
-          createMusdRampToken(CHAIN_IDS.LINEA_MAINNET as Hex, true),
-        ],
-      });
-
-      const { result } = renderHook(() => useMusdRampAvailability());
+    expect(result.current.isMusdBuyableOnAnyChain).toBe(true);
+  });
 
-      expect(result.current.isMusdBuyableOnAnyChain).toBe(true);
+  it('returns chain-specific buyability when a single chain is selected', () => {
+    setBuyability({
+      [MAINNET_MUSD_KEY]: true,
+      [LINEA_MUSD_KEY]: false,
     });
 
-    it('returns false when no chains have buyable mUSD', () => {
-      mockUseRampTokens.mockReturnValue({
-        ...defaultRampTokens,
-        allTokens: [
-          createMusdRampToken(CHAIN_IDS.MAINNET as Hex, false),
-          createMusdRampToken(CHAIN_IDS.LINEA_MAINNET as Hex, false),
-        ],
-      });
+    const { result } = renderHook(() => useMusdRampAvailability());
 
-      const { result } = renderHook(() => useMusdRampAvailability());
+    const isMusdBuyable = result.current.getIsMusdBuyable(
+      CHAIN_IDS.MAINNET as Hex,
+      false,
+    );
+
+    expect(isMusdBuyable).toBe(true);
+  });
 
-      expect(result.current.isMusdBuyableOnAnyChain).toBe(false);
+  it('returns false when selected chain is not buyable', () => {
+    setBuyability({
+      [MAINNET_MUSD_KEY]: true,
+      [LINEA_MUSD_KEY]: false,
     });
 
-    it('returns false when allTokens is empty', () => {
-      mockUseRampTokens.mockReturnValue({
-        ...defaultRampTokens,
-        allTokens: [],
-      });
+    const { result } = renderHook(() => useMusdRampAvailability());
 
-      const { result } = renderHook(() => useMusdRampAvailability());
+    const isMusdBuyable = result.current.getIsMusdBuyable(
+      CHAIN_IDS.LINEA_MAINNET as Hex,
+      false,
+    );
 
-      expect(result.current.isMusdBuyableOnAnyChain).toBe(false);
-    });
+    expect(isMusdBuyable).toBe(false);
   });
 
-  describe('getIsMusdBuyable', () => {
-    it('returns isMusdBuyableOnAnyChain when popular networks filter is active', () => {
-      mockUseRampTokens.mockReturnValue({
-        ...defaultRampTokens,
-        allTokens: [
-          createMusdRampToken(CHAIN_IDS.MAINNET as Hex, false),
-          createMusdRampToken(CHAIN_IDS.LINEA_MAINNET as Hex, true),
-        ],
-      });
+  it('returns false when no chain is selected and popular networks filter is inactive', () => {
+    setBuyability({
+      [MAINNET_MUSD_KEY]: true,
+      [LINEA_MUSD_KEY]: true,
+    });
 
-      const { result } = renderHook(() => useMusdRampAvailability());
-      const isMusdBuyable = result.current.getIsMusdBuyable(null, true);
+    const { result } = renderHook(() => useMusdRampAvailability());
 
-      expect(isMusdBuyable).toBe(true);
-    });
+    const isMusdBuyable = result.current.getIsMusdBuyable(null, false);
 
-    it('returns chain-specific buyability when single chain selected', () => {
-      mockUseRampTokens.mockReturnValue({
-        ...defaultRampTokens,
-        allTokens: [
-          createMusdRampToken(CHAIN_IDS.MAINNET as Hex, true),
-          createMusdRampToken(CHAIN_IDS.LINEA_MAINNET as Hex, false),
-        ],
-      });
-
-      const { result } = renderHook(() => useMusdRampAvailability());
-      const isMusdBuyable = result.current.getIsMusdBuyable(
-        CHAIN_IDS.MAINNET as Hex,
-        false,
-      );
-
-      expect(isMusdBuyable).toBe(true);
-    });
+    expect(isMusdBuyable).toBe(false);
+  });
 
-    it('returns false when selected chain not buyable', () => {
-      mockUseRampTokens.mockReturnValue({
-        ...defaultRampTokens,
-        allTokens: [
-          createMusdRampToken(CHAIN_IDS.MAINNET as Hex, true),
-          createMusdRampToken(CHAIN_IDS.LINEA_MAINNET as Hex, false),
-        ],
-      });
-
-      const { result } = renderHook(() => useMusdRampAvailability());
-      const isMusdBuyable = result.current.getIsMusdBuyable(
-        CHAIN_IDS.LINEA_MAINNET as Hex,
-        false,
-      );
-
-      expect(isMusdBuyable).toBe(false);
+  it('returns false for an unknown chain ID', () => {
+    setBuyability({
+      [MAINNET_MUSD_KEY]: true,
+      [LINEA_MUSD_KEY]: true,
     });
 
-    it('returns false when no chain selected and popular networks filter is inactive', () => {
-      const { result } = renderHook(() => useMusdRampAvailability());
-      const isMusdBuyable = result.current.getIsMusdBuyable(null, false);
+    const { result } = renderHook(() => useMusdRampAvailability());
 
-      expect(isMusdBuyable).toBe(false);
-    });
+    const isMusdBuyable = result.current.getIsMusdBuyable(
+      '0x999' as Hex,
+      false,
+    );
 
-    it('returns false for unknown chain ID', () => {
-      const { result } = renderHook(() => useMusdRampAvailability());
-      const isMusdBuyable = result.current.getIsMusdBuyable(
-        '0x999' as Hex,
-        false,
-      );
+    expect(isMusdBuyable).toBe(false);
+  });
 
-      expect(isMusdBuyable).toBe(false);
+  it('uses aggregate buyability when popular networks filter is active even with selected chain', () => {
+    setBuyability({
+      [MAINNET_MUSD_KEY]: false,
+      [LINEA_MUSD_KEY]: true,
     });
-  });
 
-  describe('integration with useRampTokens', () => {
-    it('calls useRampTokens hook', () => {
-      renderHook(() => useMusdRampAvailability());
+    const { result } = renderHook(() => useMusdRampAvailability());
 
-      expect(mockUseRampTokens).toHaveBeenCalled();
-    });
+    const isMusdBuyable = result.current.getIsMusdBuyable(
+      CHAIN_IDS.MAINNET as Hex,
+      true,
+    );
+
+    expect(isMusdBuyable).toBe(true);
   });
 });
diff --git a/app/components/UI/Earn/hooks/useMusdRampAvailability.ts b/app/components/UI/Earn/hooks/useMusdRampAvailability.ts
index 2eeb16eebe8b..93bca09ad050 100644
--- a/app/components/UI/Earn/hooks/useMusdRampAvailability.ts
+++ b/app/components/UI/Earn/hooks/useMusdRampAvailability.ts
@@ -1,11 +1,15 @@
 import { useCallback, useMemo } from 'react';
 import { Hex } from '@metamask/utils';
 import {
+  MUSD_TOKEN,
+  MUSD_TOKEN_ADDRESS_BY_CHAIN,
   MUSD_BUYABLE_CHAIN_IDS,
-  MUSD_TOKEN_ASSET_ID_BY_CHAIN,
 } from '../constants/musd';
-import { useRampTokens } from '../../Ramp/hooks/useRampTokens';
-import { toLowerCaseEquals } from '../../../../util/general';
+import { TokenI } from '../../Tokens/types';
+import {
+  getTokenBuyabilityKey,
+  useTokensBuyability,
+} from '../../Ramp/hooks/useTokenBuyability';
 
 export interface MusdRampAvailability {
   isMusdBuyableOnChain: Record<Hex, boolean>;
@@ -26,34 +30,56 @@ export interface MusdRampAvailability {
  * @returns {MusdRampAvailability} Ramp availability state and helpers
  */
 export const useMusdRampAvailability = (): MusdRampAvailability => {
-  const { allTokens } = useRampTokens();
+  const musdTokensByChain = useMemo(
+    () =>
+      MUSD_BUYABLE_CHAIN_IDS.map((chainId) => {
+        const address = MUSD_TOKEN_ADDRESS_BY_CHAIN[chainId];
+        if (!address) {
+          return null;
+        }
+
+        const token: TokenI = {
+          address,
+          chainId,
+          symbol: MUSD_TOKEN.symbol,
+          name: MUSD_TOKEN.name,
+          decimals: MUSD_TOKEN.decimals,
+          image: '',
+          logo: undefined,
+          balance: '0',
+          isETH: false,
+          isNative: false,
+        };
+        return token;
+      }),
+    [],
+  );
+
+  const musdTokens = useMemo(
+    () => musdTokensByChain.filter((token): token is TokenI => token !== null),
+    [musdTokensByChain],
+  );
+
+  const { buyabilityByTokenKey } = useTokensBuyability(musdTokens);
 
   // Check if mUSD is buyable on a specific chain based on ramp availability
   const isMusdBuyableOnChain = useMemo(() => {
-    if (!allTokens) {
-      return {};
-    }
-
     const buyableByChain: Record<Hex, boolean> = {};
-
     MUSD_BUYABLE_CHAIN_IDS.forEach((chainId) => {
-      const musdAssetId = MUSD_TOKEN_ASSET_ID_BY_CHAIN[chainId];
-      if (!musdAssetId) {
-        buyableByChain[chainId] = false;
-        return;
-      }
-
-      const musdToken = allTokens.find(
-        (token) =>
-          toLowerCaseEquals(token.assetId, musdAssetId) &&
-          token.tokenSupported === true,
-      );
+      buyableByChain[chainId] = false;
+    });
 
-      buyableByChain[chainId] = Boolean(musdToken);
+    musdTokens.forEach((token) => {
+      if (token.chainId) {
+        const tokenKey = getTokenBuyabilityKey(token);
+        buyableByChain[token.chainId as Hex] = Boolean(
+          buyabilityByTokenKey[tokenKey],
+        );
+      }
     });
 
     return buyableByChain;
-  }, [allTokens]);
+  }, [buyabilityByTokenKey, musdTokens]);
 
   // Check if mUSD is buyable on any chain (for "all networks" view)
   const isMusdBuyableOnAnyChain = useMemo(
diff --git a/app/components/UI/Earn/modals/LendingMaxWithdrawalModal/__snapshots__/LendingMaxWithdrawalModal.test.tsx.snap b/app/components/UI/Earn/modals/LendingMaxWithdrawalModal/__snapshots__/LendingMaxWithdrawalModal.test.tsx.snap
index 4395f788fd1d..6d2af1381920 100644
--- a/app/components/UI/Earn/modals/LendingMaxWithdrawalModal/__snapshots__/LendingMaxWithdrawalModal.test.tsx.snap
+++ b/app/components/UI/Earn/modals/LendingMaxWithdrawalModal/__snapshots__/LendingMaxWithdrawalModal.test.tsx.snap
@@ -42,7 +42,7 @@ exports[`LendingMaxWithdrawalModal should render correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Bold",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -76,7 +76,7 @@ exports[`LendingMaxWithdrawalModal should render correctly 1`] = `
           }
         >
           <SvgMock
-            color="#121314"
+            color="#131416"
             fill="currentColor"
             height={24}
             name="Close"
@@ -105,7 +105,7 @@ exports[`LendingMaxWithdrawalModal should render correctly 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -119,7 +119,7 @@ exports[`LendingMaxWithdrawalModal should render correctly 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -131,7 +131,7 @@ exports[`LendingMaxWithdrawalModal should render correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -148,7 +148,7 @@ exports[`LendingMaxWithdrawalModal should render correctly 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -160,7 +160,7 @@ exports[`LendingMaxWithdrawalModal should render correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "letterSpacing": 0,
diff --git a/app/components/UI/Earn/selectors/featureFlags/index.test.ts b/app/components/UI/Earn/selectors/featureFlags/index.test.ts
index 785dbc9201ce..0bd392cd5b5a 100644
--- a/app/components/UI/Earn/selectors/featureFlags/index.test.ts
+++ b/app/components/UI/Earn/selectors/featureFlags/index.test.ts
@@ -14,7 +14,6 @@ import {
   selectMusdConversionBlockedCountries,
   parseBlockedCountriesEnv,
   selectMusdConversionMinAssetBalanceRequired,
-  selectMerklCampaignClaimingEnabledFlag,
 } from '.';
 import mockedEngine from '../../../../../core/__mocks__/MockedEngine';
 import type { Json } from '@metamask/utils';
@@ -1059,44 +1058,6 @@ describe('Earn Feature Flag Selectors', () => {
     });
   });
 
-  describe('selectMerklCampaignClaimingEnabledFlag', () => {
-    afterEach(() => {
-      delete process.env.MM_EARN_MERKL_CAMPAIGN_CLAIMING;
-    });
-
-    it('returns true when remote flag is valid and enabled', () => {
-      const state = createStateWithRemoteFlags({
-        earnMerklCampaignClaiming: {
-          enabled: true,
-          minimumVersion: '1.0.0',
-        },
-      });
-      expect(selectMerklCampaignClaimingEnabledFlag(state)).toBe(true);
-    });
-
-    it('returns false when remote flag is valid and disabled', () => {
-      const state = createStateWithRemoteFlags({
-        earnMerklCampaignClaiming: {
-          enabled: false,
-          minimumVersion: '1.0.0',
-        },
-      });
-      expect(selectMerklCampaignClaimingEnabledFlag(state)).toBe(false);
-    });
-
-    it('falls back to local env when remote flag is missing and not GITHUB_ACTIONS', () => {
-      process.env.MM_EARN_MERKL_CAMPAIGN_CLAIMING = 'true';
-      const state = createStateWithRemoteFlags({});
-      expect(selectMerklCampaignClaimingEnabledFlag(state)).toBe(true);
-    });
-
-    it('falls back to false when remote flag is missing and env is false', () => {
-      process.env.MM_EARN_MERKL_CAMPAIGN_CLAIMING = 'false';
-      const state = createStateWithRemoteFlags({});
-      expect(selectMerklCampaignClaimingEnabledFlag(state)).toBe(false);
-    });
-  });
-
   describe('earnRemoteFeatureFlag', () => {
     const validRemoteFlag: VersionGatedFeatureFlag = {
       enabled: true,
diff --git a/app/components/UI/Earn/selectors/featureFlags/index.ts b/app/components/UI/Earn/selectors/featureFlags/index.ts
index 3f17f7029c3e..6da9c0b2900a 100644
--- a/app/components/UI/Earn/selectors/featureFlags/index.ts
+++ b/app/components/UI/Earn/selectors/featureFlags/index.ts
@@ -17,6 +17,7 @@ export const selectPooledStakingEnabledFlag = createSelector(
     const remoteFlag =
       remoteFeatureFlags?.earnPooledStakingEnabled as unknown as VersionGatedFeatureFlag;
 
+    // Fallback to local flag if remote flag is not available
     return validatedVersionGatedFeatureFlag(remoteFlag) ?? localFlag;
   },
 );
@@ -29,6 +30,7 @@ export const selectPooledStakingServiceInterruptionBannerEnabledFlag =
     const remoteFlag =
       remoteFeatureFlags?.earnPooledStakingServiceInterruptionBannerEnabled as unknown as VersionGatedFeatureFlag;
 
+    // Fallback to local flag if remote flag is not available
     return validatedVersionGatedFeatureFlag(remoteFlag) ?? localFlag;
   });
 
@@ -39,6 +41,7 @@ export const selectStablecoinLendingEnabledFlag = createSelector(
     const remoteFlag =
       remoteFeatureFlags?.earnStablecoinLendingEnabled as unknown as VersionGatedFeatureFlag;
 
+    // Fallback to local flag if remote flag is not available
     return validatedVersionGatedFeatureFlag(remoteFlag) ?? localFlag;
   },
 );
@@ -50,6 +53,7 @@ export const selectStablecoinLendingServiceInterruptionBannerEnabledFlag =
     const remoteFlag =
       remoteFeatureFlags?.earnStablecoinLendingServiceInterruptionBannerEnabled as unknown as VersionGatedFeatureFlag;
 
+    // Fallback to local flag if remote flag is not available
     return validatedVersionGatedFeatureFlag(remoteFlag) ?? localFlag;
   });
 
@@ -60,6 +64,7 @@ export const selectIsMusdConversionFlowEnabledFlag = createSelector(
     const remoteFlag =
       remoteFeatureFlags?.earnMusdConversionFlowEnabled as unknown as VersionGatedFeatureFlag;
 
+    // Fallback to local flag if remote flag is not available
     return validatedVersionGatedFeatureFlag(remoteFlag) ?? localFlag;
   },
 );
@@ -77,10 +82,12 @@ export const selectIsMusdGetBuyCtaEnabledFlag = createSelector(
     const remoteFlag =
       remoteFeatureFlags?.earnMusdCtaEnabled as unknown as VersionGatedFeatureFlag;
 
+    // mUSD conversion flow must be enabled to show the mUSD CTA
     if (!isMusdConversionFlowEnabled) {
       return false;
     }
 
+    // Fallback to local flag if remote flag is not available
     return validatedVersionGatedFeatureFlag(remoteFlag) ?? localFlag;
   },
 );
@@ -99,10 +106,12 @@ export const selectIsMusdConversionAssetOverviewEnabledFlag = createSelector(
     const remoteFlag =
       remoteFeatureFlags?.earnMusdConversionAssetOverviewCtaEnabled as unknown as VersionGatedFeatureFlag;
 
+    // mUSD conversion flow must be enabled to show the mUSD CTA
     if (!isMusdConversionFlowEnabled) {
       return false;
     }
 
+    // Fallback to local flag if remote flag is not available
     return validatedVersionGatedFeatureFlag(remoteFlag) ?? localFlag;
   },
 );
@@ -121,10 +130,12 @@ export const selectIsMusdConversionTokenListItemCtaEnabledFlag = createSelector(
     const remoteFlag =
       remoteFeatureFlags?.earnMusdConversionTokenListItemCtaEnabled as unknown as VersionGatedFeatureFlag;
 
+    // mUSD conversion flow must be enabled to show the mUSD CTA
     if (!isMusdConversionFlowEnabled) {
       return false;
     }
 
+    // Fallback to local flag if remote flag is not available
     return validatedVersionGatedFeatureFlag(remoteFlag) ?? localFlag;
   },
 );
@@ -352,6 +363,7 @@ export const selectMerklCampaignClaimingEnabledFlag = createSelector(
     const remoteFlag =
       remoteFeatureFlags?.earnMerklCampaignClaiming as unknown as VersionGatedFeatureFlag;
 
+    // Fallback to local flag if remote flag is not available
     return validatedVersionGatedFeatureFlag(remoteFlag) ?? localFlag;
   },
 );
diff --git a/app/components/UI/EditGasFee1559/__snapshots__/index.test.tsx.snap b/app/components/UI/EditGasFee1559/__snapshots__/index.test.tsx.snap
index 852191886e05..a3ac625917f1 100644
--- a/app/components/UI/EditGasFee1559/__snapshots__/index.test.tsx.snap
+++ b/app/components/UI/EditGasFee1559/__snapshots__/index.test.tsx.snap
@@ -38,7 +38,7 @@ exports[`EditGasFee1559 should render correctly 1`] = `
             <TouchableOpacity>
               <Icon
                 allowFontScaling={false}
-                color="#121314"
+                color="#131416"
                 name="arrow-back"
                 size={24}
               />
@@ -264,7 +264,7 @@ exports[`EditGasFee1559 should render correctly 1`] = `
                             size={14}
                             style={
                               {
-                                "color": "#b7bbc8",
+                                "color": "#babbbe",
                               }
                             }
                           />
@@ -320,7 +320,7 @@ exports[`EditGasFee1559 should render correctly 1`] = `
                             size={14}
                             style={
                               {
-                                "color": "#b7bbc8",
+                                "color": "#babbbe",
                               }
                             }
                           />
@@ -397,7 +397,7 @@ exports[`EditGasFee1559 should render correctly 1`] = `
                             size={14}
                             style={
                               {
-                                "color": "#b7bbc8",
+                                "color": "#babbbe",
                               }
                             }
                           />
diff --git a/app/components/UI/EditGasFeeLegacy/__snapshots__/index.test.tsx.snap b/app/components/UI/EditGasFeeLegacy/__snapshots__/index.test.tsx.snap
index 242a4f2a978d..883a9d010a3b 100644
--- a/app/components/UI/EditGasFeeLegacy/__snapshots__/index.test.tsx.snap
+++ b/app/components/UI/EditGasFeeLegacy/__snapshots__/index.test.tsx.snap
@@ -38,7 +38,7 @@ exports[`EditGasFeeLegacy should render correctly 1`] = `
             <TouchableOpacity>
               <Icon
                 allowFontScaling={false}
-                color="#121314"
+                color="#131416"
                 name="arrow-back"
                 size={24}
               />
@@ -178,7 +178,7 @@ exports[`EditGasFeeLegacy should render correctly 1`] = `
                           size={14}
                           style={
                             {
-                              "color": "#b7bbc8",
+                              "color": "#babbbe",
                             }
                           }
                         />
@@ -234,7 +234,7 @@ exports[`EditGasFeeLegacy should render correctly 1`] = `
                           size={14}
                           style={
                             {
-                              "color": "#b7bbc8",
+                              "color": "#babbbe",
                             }
                           }
                         />
diff --git a/app/components/UI/EvmAccountSelectorList/EvmAccountSelectorList.constants.ts b/app/components/UI/EvmAccountSelectorList/EvmAccountSelectorList.constants.ts
deleted file mode 100644
index 1d0e5522d64e..000000000000
--- a/app/components/UI/EvmAccountSelectorList/EvmAccountSelectorList.constants.ts
+++ /dev/null
@@ -1 +0,0 @@
-export const ACCOUNT_SELECTOR_LIST_TESTID = 'account-selector-list';
diff --git a/app/components/UI/EvmAccountSelectorList/EvmAccountSelectorList.styles.ts b/app/components/UI/EvmAccountSelectorList/EvmAccountSelectorList.styles.ts
deleted file mode 100644
index c383a42a1eda..000000000000
--- a/app/components/UI/EvmAccountSelectorList/EvmAccountSelectorList.styles.ts
+++ /dev/null
@@ -1,45 +0,0 @@
-// Third party dependencies.
-import { StyleSheet } from 'react-native';
-import { Theme } from '../../../util/theme/models';
-
-/**
- * Style sheet function for AvatarIcon component.
- *
- * @param params Style sheet params.
- * @param params.theme App theme from ThemeContext.
- * @param params.vars Inputs that the style sheet depends on.
- * @returns StyleSheet object.
- */
-const styleSheet = ({ theme }: { theme: Theme }) =>
-  StyleSheet.create({
-    balancesContainer: {
-      alignItems: 'flex-end',
-      flexDirection: 'column',
-    },
-    balanceLabel: { textAlign: 'right', fontWeight: '500' },
-    titleText: { fontWeight: '500' },
-    sectionHeader: {
-      paddingHorizontal: 16,
-      paddingVertical: 8,
-      flexDirection: 'row',
-      justifyContent: 'space-between',
-      alignItems: 'center',
-      backgroundColor: theme.colors.background.default,
-    },
-    sectionDetailsLink: {
-      color: theme.colors.primary.default,
-    },
-    sectionSeparator: {
-      height: 1,
-      backgroundColor: theme.colors.border.default,
-      opacity: 0.4,
-      marginVertical: 8,
-    },
-    listContainer: {
-      flexGrow: 1,
-      flexShrink: 1,
-      flexDirection: 'row',
-    },
-  });
-
-export default styleSheet;
diff --git a/app/components/UI/EvmAccountSelectorList/EvmAccountSelectorList.test.tsx b/app/components/UI/EvmAccountSelectorList/EvmAccountSelectorList.test.tsx
deleted file mode 100644
index 150a88202272..000000000000
--- a/app/components/UI/EvmAccountSelectorList/EvmAccountSelectorList.test.tsx
+++ /dev/null
@@ -1,1763 +0,0 @@
-import React from 'react';
-// eslint-disable-next-line @typescript-eslint/no-shadow
-import { waitFor, within, fireEvent } from '@testing-library/react-native';
-import { Alert, AlertButton, View } from 'react-native';
-import renderWithProvider from '../../../util/test/renderWithProvider';
-import EvmAccountSelectorList from './EvmAccountSelectorList';
-import { useAccounts, Account } from '../../hooks/useAccounts';
-import { AccountListBottomSheetSelectorsIDs } from '../../Views/AccountSelector/AccountListBottomSheet.testIds';
-import { backgroundState } from '../../../util/test/initial-root-state';
-import { regex } from '../../../util/regex';
-import {
-  createMockAccountsControllerState,
-  createMockAccountsControllerStateWithSnap,
-  MOCK_ADDRESS_1,
-  MOCK_ADDRESS_2,
-} from '../../../util/test/accountsControllerTestUtils';
-import { mockNetworkState } from '../../../util/test/network';
-import { CHAIN_IDS } from '@metamask/transaction-controller';
-import { EvmAccountSelectorListProps } from './EvmAccountSelectorList.types';
-import Engine from '../../../core/Engine';
-import { CellComponentSelectorsIDs } from '../../../component-library/components/Cells/Cell/CellComponent.testIds';
-import { KeyringTypes } from '@metamask/keyring-controller';
-import { ACCOUNT_SELECTOR_LIST_TESTID } from './EvmAccountSelectorList.constants';
-import { AVATARGROUP_CONTAINER_TESTID } from '../../../component-library/components/Avatars/AvatarGroup/AvatarGroup.constants';
-import { KnownCaipNamespace } from '@metamask/utils';
-import Routes from '../../../constants/navigation/Routes';
-import { WalletViewSelectorsIDs } from '../../Views/Wallet/WalletView.testIds';
-
-const BUSINESS_ACCOUNT = '0xC4955C0d639D99699Bfd7Ec54d9FaFEe40e4D272';
-const PERSONAL_ACCOUNT = '0xd018538C87232FF95acbCe4870629b75640a78E7';
-
-// Those ID have been generated with createMockUuidFromAddress, but we hardcode them here, otherwise jest
-// will complain.
-const BUSINESS_ACCOUNT_ID = '30786334-3935-4563-b064-363339643939';
-const PERSONAL_ACCOUNT_ID = '30786430-3138-4533-b863-383732333266';
-
-const MOCK_ACCOUNTS_CONTROLLER_STATE = createMockAccountsControllerState([
-  BUSINESS_ACCOUNT,
-  PERSONAL_ACCOUNT,
-]);
-
-// Mock InteractionManager to run callbacks immediately in tests
-const { InteractionManager } = jest.requireActual('react-native');
-
-InteractionManager.runAfterInteractions = jest.fn(async (callback) =>
-  callback(),
-);
-
-jest.mock('../../../util/address', () => {
-  const actual = jest.requireActual('../../../util/address');
-  return {
-    ...actual,
-    getLabelTextByInternalAccount: jest.fn(),
-  };
-});
-
-// Mock isDefaultAccountName from ENSUtils
-jest.mock('../../../util/ENSUtils', () => ({
-  ...jest.requireActual('../../../util/ENSUtils'),
-  isDefaultAccountName: jest.fn(),
-}));
-
-const mockNavigate = jest.fn();
-
-jest.mock('@react-navigation/native', () => ({
-  ...jest.requireActual('@react-navigation/native'),
-  useNavigation: () => ({
-    navigate: mockNavigate,
-  }),
-}));
-
-// Mock whenEngineReady to prevent Engine access after Jest teardown
-jest.mock('../../../core/Analytics/whenEngineReady', () => ({
-  whenEngineReady: jest.fn().mockResolvedValue(undefined),
-}));
-
-// Mock analytics module
-jest.mock('../../../util/analytics/analytics', () => ({
-  analytics: {
-    isEnabled: jest.fn(() => false),
-    trackEvent: jest.fn(),
-    optIn: jest.fn().mockResolvedValue(undefined),
-    optOut: jest.fn().mockResolvedValue(undefined),
-    getAnalyticsId: jest.fn().mockResolvedValue('test-analytics-id'),
-    identify: jest.fn(),
-    trackView: jest.fn(),
-    isOptedIn: jest.fn().mockResolvedValue(false),
-  },
-}));
-
-// Mock useAccounts
-jest.mock('../../hooks/useAccounts', () => {
-  const useAccountsMock = jest.fn(() => ({
-    accounts: [
-      {
-        id: BUSINESS_ACCOUNT_ID,
-        name: 'Account 1',
-        address: BUSINESS_ACCOUNT,
-        assets: {
-          fiatBalance: '$3200.00\n1 ETH',
-          tokens: [],
-        },
-        type: 'HD Key Tree',
-        yOffset: 0,
-        isSelected: true,
-        balanceError: undefined,
-        caipAccountId: 'eip155:0:0xC4955C0d639D99699Bfd7Ec54d9FaFEe40e4D272',
-      },
-      {
-        id: PERSONAL_ACCOUNT_ID,
-        name: 'Account 2',
-        address: PERSONAL_ACCOUNT,
-        assets: {
-          fiatBalance: '$6400.00\n2 ETH',
-          tokens: [],
-        },
-        type: 'HD Key Tree',
-        yOffset: 78,
-        isSelected: false,
-        balanceError: undefined,
-        caipAccountId: 'eip155:0:0xd018538C87232FF95acbCe4870629b75640a78E7',
-      },
-    ],
-    evmAccounts: [],
-    ensByAccountAddress: {},
-  }));
-  return {
-    useAccounts: useAccountsMock,
-    Account: Object, // Mock for the Account type
-  };
-});
-
-// Mock Engine
-jest.mock('../../../core/Engine', () => ({
-  context: {
-    KeyringController: {
-      removeAccount: jest.fn(),
-    },
-    AccountsController: {
-      getAccountByAddress: jest.fn().mockImplementation((address) => ({
-        address,
-        name:
-          address === '0xC4955C0d639D99699Bfd7Ec54d9FaFEe40e4D272'
-            ? 'Account 1'
-            : 'Account 2',
-      })),
-    },
-    PermissionController: {
-      state: {
-        subjects: {},
-      },
-    },
-  },
-  getTotalEvmFiatAccountBalance: jest.fn().mockReturnValue('0'),
-}));
-
-const MOCK_NETWORKS_WITH_TRANSACTION_ACTIVITY = {
-  [BUSINESS_ACCOUNT.toLowerCase()]: {
-    namespace: 'eip155:0',
-    activeChains: ['1', '56'],
-  },
-  [PERSONAL_ACCOUNT.toLowerCase()]: {
-    namespace: 'eip155:0',
-    activeChains: ['1', '137'],
-  },
-};
-
-const initialState = {
-  engine: {
-    backgroundState: {
-      ...backgroundState,
-      NetworkController: {
-        ...mockNetworkState({
-          id: 'mainnet',
-          nickname: 'Ethereum Mainnet',
-          ticker: 'ETH',
-          chainId: CHAIN_IDS.MAINNET,
-        }),
-      },
-      AccountsController: MOCK_ACCOUNTS_CONTROLLER_STATE,
-      AccountTreeController: {
-        accountTrees: {
-          roots: {
-            'default-group': {
-              metadata: {
-                name: 'Default Group',
-              },
-              groups: {
-                'hd-accounts': {
-                  accounts: [BUSINESS_ACCOUNT_ID, PERSONAL_ACCOUNT_ID],
-                },
-              },
-            },
-          },
-        },
-      },
-      AccountTrackerController: {
-        accountsByChainId: {
-          '0x1': {
-            [BUSINESS_ACCOUNT]: { balance: '0xDE0B6B3A7640000' },
-            [PERSONAL_ACCOUNT]: { balance: '0x1BC16D674EC80000' },
-          },
-        },
-      },
-      PreferencesController: {
-        isMultiAccountBalancesEnabled: true,
-        selectedAddress: BUSINESS_ACCOUNT,
-      },
-      CurrencyRateController: {
-        currentCurrency: 'usd',
-        currencyRates: {
-          ETH: {
-            conversionRate: 3200,
-          },
-        },
-      },
-      MultichainNetworkController: {
-        networksWithTransactionActivity:
-          MOCK_NETWORKS_WITH_TRANSACTION_ACTIVITY,
-      },
-      RemoteFeatureFlagController: {
-        remoteFeatureFlags: {
-          enableMultichainAccounts: {
-            enabled: false,
-            featureVersion: null,
-            minimumVersion: null,
-          },
-          enableMultichainAccountsState2: {
-            enabled: false,
-            featureVersion: null,
-            minimumVersion: null,
-          },
-        },
-      },
-    },
-  },
-  settings: {
-    primaryCurrency: 'ETH',
-  },
-};
-
-const onSelectAccount = jest.fn();
-const onRemoveImportedAccount = jest.fn();
-
-// Helper function to set mock implementation for useAccounts
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-const setAccountsMock = (mockAccounts: any[], mockEnsByAccountAddress = {}) => {
-  const mockAccountData = {
-    accounts: mockAccounts,
-    evmAccounts: [],
-    ensByAccountAddress: mockEnsByAccountAddress,
-  };
-  (useAccounts as jest.Mock).mockImplementation(() => mockAccountData);
-  return mockAccountData;
-};
-
-const defaultAccountsMock = [
-  {
-    id: BUSINESS_ACCOUNT_ID,
-    name: 'Account 1',
-    address: BUSINESS_ACCOUNT,
-    assets: {
-      fiatBalance: '$3200.00\n1 ETH',
-      tokens: [],
-    },
-    type: 'HD Key Tree',
-    yOffset: 0,
-    isSelected: true,
-    balanceError: undefined,
-    caipAccountId: `eip155:0:${BUSINESS_ACCOUNT}`,
-    isLoadingAccount: false,
-    scopes: [],
-  },
-  {
-    id: PERSONAL_ACCOUNT_ID,
-    name: 'Account 2',
-    address: PERSONAL_ACCOUNT,
-    assets: {
-      fiatBalance: '$6400.00\n2 ETH',
-      tokens: [],
-    },
-    type: 'HD Key Tree',
-    yOffset: 78,
-    isSelected: false,
-    balanceError: undefined,
-    caipAccountId: `eip155:0:${PERSONAL_ACCOUNT}`,
-    isLoadingAccount: false,
-    scopes: [],
-  },
-];
-
-const EvmAccountSelectorListUseAccounts: React.FC<
-  EvmAccountSelectorListProps
-> = ({ privacyMode = false }) => {
-  // Set the mock implementation for this specific component render
-  if (privacyMode) {
-    setAccountsMock(defaultAccountsMock);
-  }
-  const { accounts, ensByAccountAddress } = useAccounts();
-  return (
-    <EvmAccountSelectorList
-      onSelectAccount={onSelectAccount}
-      onRemoveImportedAccount={onRemoveImportedAccount}
-      accounts={accounts}
-      ensByAccountAddress={ensByAccountAddress}
-      isRemoveAccountEnabled
-      privacyMode={privacyMode}
-    />
-  );
-};
-
-const RIGHT_ACCESSORY_TEST_ID = 'right-accessory';
-
-const EvmAccountSelectorListRightAccessoryUseAccounts = () => {
-  const { accounts, ensByAccountAddress } = useAccounts();
-  return (
-    <EvmAccountSelectorList
-      renderRightAccessory={(address, name) => (
-        <View testID={RIGHT_ACCESSORY_TEST_ID}>{`${address} - ${name}`}</View>
-      )}
-      isSelectionDisabled
-      selectedAddresses={[]}
-      accounts={accounts}
-      ensByAccountAddress={ensByAccountAddress}
-    />
-  );
-};
-
-const renderComponent = (
-  // TODO: Replace "any" with type
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  state: any = {},
-  EvmAccountSelectorListTest = EvmAccountSelectorListUseAccounts,
-) => renderWithProvider(<EvmAccountSelectorListTest {...state} />, { state });
-
-describe('EvmAccountSelectorList', () => {
-  beforeEach(() => {
-    // Reset all mocks before each test
-    jest.clearAllMocks();
-
-    // Set default mock implementation
-    setAccountsMock(defaultAccountsMock);
-
-    // Reset function mocks
-    onSelectAccount.mockClear();
-    onRemoveImportedAccount.mockClear();
-    mockNavigate.mockClear();
-    (Engine.context.KeyringController.removeAccount as jest.Mock).mockClear();
-  });
-
-  afterEach(() => {
-    jest.restoreAllMocks();
-  });
-
-  it('renders correctly', async () => {
-    const { toJSON } = renderComponent(initialState);
-    await waitFor(() => expect(toJSON()).toMatchSnapshot());
-  });
-
-  it('renders all accounts with balances', async () => {
-    const { queryByTestId, getAllByTestId, toJSON } =
-      renderComponent(initialState);
-
-    await waitFor(async () => {
-      const businessAccountItem = await queryByTestId(
-        `${AccountListBottomSheetSelectorsIDs.ACCOUNT_BALANCE_BY_ADDRESS_TEST_ID}-${BUSINESS_ACCOUNT}`,
-      );
-      const personalAccountItem = await queryByTestId(
-        `${AccountListBottomSheetSelectorsIDs.ACCOUNT_BALANCE_BY_ADDRESS_TEST_ID}-${PERSONAL_ACCOUNT}`,
-      );
-
-      if (!businessAccountItem || !personalAccountItem) {
-        throw new Error('Account items not found');
-      }
-
-      expect(
-        within(businessAccountItem).getByText(regex.usd(3200)),
-      ).toBeDefined();
-
-      expect(
-        within(personalAccountItem).getByText(regex.usd(6400)),
-      ).toBeDefined();
-
-      const accounts = getAllByTestId(regex.accountBalance);
-      expect(accounts.length).toBe(2);
-
-      expect(toJSON()).toMatchSnapshot();
-    });
-  });
-
-  it('renders all accounts with right accessory', async () => {
-    const { getAllByTestId, toJSON } = renderComponent(
-      initialState,
-      EvmAccountSelectorListRightAccessoryUseAccounts,
-    );
-
-    await waitFor(() => {
-      const rightAccessories = getAllByTestId(RIGHT_ACCESSORY_TEST_ID);
-      expect(rightAccessories.length).toBe(2);
-
-      // Check that each right accessory contains the expected content
-      expect(rightAccessories[0].props.children).toContain(BUSINESS_ACCOUNT);
-      expect(rightAccessories[1].props.children).toContain(PERSONAL_ACCOUNT);
-
-      expect(toJSON()).toMatchSnapshot();
-    });
-  });
-  it('renders correct account names', async () => {
-    const { getAllByTestId } = renderComponent(initialState);
-
-    await waitFor(() => {
-      const accountNameItems = getAllByTestId(
-        CellComponentSelectorsIDs.BASE_TITLE,
-      );
-      expect(within(accountNameItems[0]).getByText('Account 1')).toBeDefined();
-      expect(within(accountNameItems[1]).getByText('Account 2')).toBeDefined();
-    });
-  });
-  it('renders the snap name tag for Snap accounts', async () => {
-    // Setup mock with snap accounts
-    const mockSnapAccounts = [
-      {
-        name: 'Snap Account 1',
-        address: MOCK_ADDRESS_1,
-        assets: {
-          fiatBalance: '$3200.00\n1 ETH',
-          tokens: [],
-        },
-        type: KeyringTypes.snap,
-        yOffset: 0,
-        isSelected: true,
-        balanceError: undefined,
-        caipAccountId: `eip155:0:${MOCK_ADDRESS_1}`,
-      },
-    ];
-
-    setAccountsMock(mockSnapAccounts);
-
-    const mockAccountsWithSnap = createMockAccountsControllerStateWithSnap(
-      [MOCK_ADDRESS_1, MOCK_ADDRESS_2],
-      'MetaMask Simple Snap Keyring',
-    );
-
-    const stateWithSnapAccount = {
-      ...initialState,
-      engine: {
-        ...initialState.engine,
-        backgroundState: {
-          ...initialState.engine.backgroundState,
-          AccountsController: mockAccountsWithSnap,
-        },
-      },
-    };
-
-    const { queryByText } = renderComponent(stateWithSnapAccount);
-
-    await waitFor(async () => {
-      const snapTag = await queryByText('MetaMask Simple Snap Keyring');
-      expect(snapTag).toBeDefined();
-    });
-  });
-  it('Text is hidden when privacy mode is on', async () => {
-    const state = {
-      ...initialState,
-      privacyMode: true,
-    };
-
-    const { queryByTestId } = renderComponent(state);
-
-    await waitFor(() => {
-      const businessAccountItem = queryByTestId(
-        `${AccountListBottomSheetSelectorsIDs.ACCOUNT_BALANCE_BY_ADDRESS_TEST_ID}-${BUSINESS_ACCOUNT}`,
-      );
-
-      if (!businessAccountItem) {
-        throw new Error('Business account item not found');
-      }
-
-      expect(
-        within(businessAccountItem).queryByText(regex.usd(3200)),
-      ).toBeNull();
-
-      expect(
-        within(businessAccountItem).getByText('••••••••••••'),
-      ).toBeDefined();
-    });
-  });
-  it('allows account removal for simple keyring type', async () => {
-    const mockAlert = jest.spyOn(Alert, 'alert');
-    mockAlert.mockReset();
-    mockAlert.mockImplementation(
-      (_title, _message, buttons?: AlertButton[]) => {
-        // Simulate user clicking "Yes, remove it"
-        buttons?.[1]?.onPress?.();
-      },
-    );
-
-    // Setup mock with removable account
-    const mockSimpleAccount = [
-      {
-        name: 'Account 1',
-        address: BUSINESS_ACCOUNT,
-        assets: {
-          fiatBalance: '$3200.00\n1 ETH',
-          tokens: [],
-        },
-        type: KeyringTypes.simple, // Important: must be simple type for removal
-        yOffset: 0,
-        isSelected: true,
-        balanceError: undefined,
-        caipAccountId: `eip155:0:${BUSINESS_ACCOUNT}`,
-      },
-    ];
-
-    setAccountsMock(mockSimpleAccount);
-
-    // Create a state with a simple keyring account
-    const mockAccountsWithSimple = createMockAccountsControllerState([
-      BUSINESS_ACCOUNT,
-    ]);
-    const accountUuid = Object.keys(
-      mockAccountsWithSimple.internalAccounts.accounts,
-    )[0];
-    mockAccountsWithSimple.internalAccounts.accounts[accountUuid].metadata = {
-      ...mockAccountsWithSimple.internalAccounts.accounts[accountUuid].metadata,
-      keyring: {
-        type: KeyringTypes.simple,
-      },
-    };
-
-    const stateWithSimpleAccount = {
-      ...initialState,
-      engine: {
-        ...initialState.engine,
-        backgroundState: {
-          ...initialState.engine.backgroundState,
-          AccountsController: mockAccountsWithSimple,
-        },
-      },
-    };
-
-    const { getAllByTestId } = renderComponent(stateWithSimpleAccount);
-
-    // Find all cell elements with the select-with-menu test ID
-    const cells = getAllByTestId(CellComponentSelectorsIDs.SELECT_WITH_MENU);
-    // Trigger long press on the first cell (since we only have one account in this test)
-    cells[0].props.onLongPress();
-
-    await waitFor(() => {
-      // Verify Alert was shown with correct text
-      expect(mockAlert).toHaveBeenCalledWith(
-        'Account removal',
-        'Do you really want to remove this account?',
-        expect.any(Array),
-        { cancelable: false },
-      );
-    });
-
-    // Verify onRemoveImportedAccount was called with correct parameters
-    expect(onRemoveImportedAccount).toHaveBeenCalledWith({
-      removedAddress: BUSINESS_ACCOUNT,
-    });
-
-    // Verify KeyringController.removeAccount was called
-    expect(Engine.context.KeyringController.removeAccount).toHaveBeenCalledWith(
-      BUSINESS_ACCOUNT,
-    );
-
-    mockAlert.mockRestore();
-  });
-
-  it('allows account removal for snap keyring type', async () => {
-    const mockAlert = jest.spyOn(Alert, 'alert');
-    mockAlert.mockReset();
-    mockAlert.mockImplementation(
-      (_title, _message, buttons?: AlertButton[]) => {
-        // Simulate user clicking "Yes, remove it"
-        buttons?.[1]?.onPress?.();
-      },
-    );
-
-    // Setup mock with removable snap accounts
-    const mockSnapAccounts = [
-      {
-        name: 'Snap Account 1',
-        address: MOCK_ADDRESS_1,
-        assets: {
-          fiatBalance: '$3200.00\n1 ETH',
-          tokens: [],
-        },
-        type: KeyringTypes.snap, // Important: must be snap type for removal
-        yOffset: 0,
-        isSelected: true,
-        balanceError: undefined,
-        caipAccountId: `eip155:0:${MOCK_ADDRESS_1}`,
-      },
-      {
-        name: 'Snap Account 2',
-        address: MOCK_ADDRESS_2,
-        assets: {
-          fiatBalance: '$6400.00\n2 ETH',
-          tokens: [],
-        },
-        type: KeyringTypes.snap, // Important: must be snap type for removal
-        yOffset: 78,
-        isSelected: false,
-        balanceError: undefined,
-        caipAccountId: `eip155:0:${MOCK_ADDRESS_2}`,
-      },
-    ];
-
-    setAccountsMock(mockSnapAccounts);
-
-    const mockAccountsWithSnap = createMockAccountsControllerStateWithSnap(
-      [MOCK_ADDRESS_1, MOCK_ADDRESS_2],
-      'MetaMask Simple Snap Keyring',
-    );
-
-    const stateWithSnapAccount = {
-      ...initialState,
-      engine: {
-        ...initialState.engine,
-        backgroundState: {
-          ...initialState.engine.backgroundState,
-          AccountsController: mockAccountsWithSnap,
-        },
-      },
-    };
-
-    const { getAllByTestId } = renderComponent(stateWithSnapAccount);
-
-    // Find all cell elements with the select-with-menu test ID
-    const cells = getAllByTestId(CellComponentSelectorsIDs.SELECT_WITH_MENU);
-    // Trigger long press on the first cell that should correspond to MOCK_ADDRESS_1
-    cells[0].props.onLongPress();
-
-    // Need to wait for the Alert to be called
-    await waitFor(() => {
-      // Verify Alert was shown with correct text
-      expect(mockAlert).toHaveBeenCalledWith(
-        'Account removal',
-        'Do you really want to remove this account?',
-        expect.any(Array),
-        { cancelable: false },
-      );
-    });
-
-    // Verify onRemoveImportedAccount was called with correct parameters
-    expect(onRemoveImportedAccount).toHaveBeenCalledWith({
-      removedAddress: MOCK_ADDRESS_1,
-      nextActiveAddress: MOCK_ADDRESS_2,
-    });
-
-    // Verify KeyringController.removeAccount was called
-    expect(Engine.context.KeyringController.removeAccount).toHaveBeenCalledWith(
-      MOCK_ADDRESS_1,
-    );
-
-    mockAlert.mockRestore();
-  });
-
-  it('renders accounts with balance error', async () => {
-    // Create a mock account with balance error
-    const mockAccount = {
-      name: 'Account 1',
-      address: BUSINESS_ACCOUNT,
-      assets: {
-        fiatBalance: '$3200.00\n1 ETH',
-      },
-      type: 'HD Key Tree',
-      yOffset: 0,
-      isSelected: true,
-      balanceError: 'Balance error message',
-      caipAccountId: `eip155:0:${BUSINESS_ACCOUNT}`,
-    };
-
-    setAccountsMock([mockAccount]);
-
-    // Create a component that explicitly verifies the account data
-    let testAccounts: Account[] = [];
-    const EvmAccountSelectorListBalanceErrorTest = () => {
-      const { accounts } = useAccounts();
-      // Store for verification
-      testAccounts = accounts;
-
-      return (
-        <EvmAccountSelectorList accounts={accounts} ensByAccountAddress={{}} />
-      );
-    };
-
-    renderComponent(initialState, EvmAccountSelectorListBalanceErrorTest);
-
-    // Verify the account data has the balance error
-    expect(testAccounts[0].balanceError).toBe('Balance error message');
-  });
-
-  it('renders in multi-select mode', () => {
-    setAccountsMock([
-      {
-        name: 'Account 1',
-        address: BUSINESS_ACCOUNT,
-        assets: {
-          fiatBalance: '$3200.00\n1 ETH',
-        },
-        type: 'HD Key Tree',
-        yOffset: 0,
-        isSelected: true,
-        balanceError: undefined,
-        caipAccountId: `eip155:0:${BUSINESS_ACCOUNT}`,
-      },
-    ]);
-
-    // Create a test component with multi-select mode
-    const EvmAccountSelectorListMultiSelectTest = () => {
-      const { accounts, ensByAccountAddress } = useAccounts();
-      return (
-        <EvmAccountSelectorList
-          onSelectAccount={onSelectAccount}
-          accounts={accounts}
-          ensByAccountAddress={ensByAccountAddress}
-          isMultiSelect
-          selectedAddresses={[BUSINESS_ACCOUNT]}
-        />
-      );
-    };
-
-    // Use initialState to ensure proper AccountTreeController structure
-    const { getByTestId } = renderComponent(
-      initialState,
-      EvmAccountSelectorListMultiSelectTest,
-    );
-
-    // Simply check if the component renders
-    expect(getByTestId(ACCOUNT_SELECTOR_LIST_TESTID)).toBeDefined();
-  });
-
-  it('renders in select-without-menu mode', async () => {
-    const EvmAccountSelectorListSelectWithoutMenuTest: React.FC = () => {
-      const { accounts, ensByAccountAddress } = useAccounts();
-      return (
-        <EvmAccountSelectorList
-          onSelectAccount={onSelectAccount}
-          accounts={accounts}
-          ensByAccountAddress={ensByAccountAddress}
-          isSelectWithoutMenu
-          selectedAddresses={[BUSINESS_ACCOUNT]}
-        />
-      );
-    };
-
-    const { getAllByTestId } = renderComponent(
-      initialState,
-      EvmAccountSelectorListSelectWithoutMenuTest,
-    );
-
-    await waitFor(() => {
-      // Find all select-without-menu cells
-      const cells = getAllByTestId(CellComponentSelectorsIDs.SELECT);
-      expect(cells.length).toBe(2);
-    });
-  });
-
-  it('disables account selection when isSelectionDisabled is true', async () => {
-    // Clear any previous calls
-    onSelectAccount.mockClear();
-
-    const EvmAccountSelectorListDisabledSelectionTest: React.FC = () => {
-      const { accounts, ensByAccountAddress } = useAccounts();
-      return (
-        <EvmAccountSelectorList
-          onSelectAccount={onSelectAccount}
-          accounts={accounts}
-          ensByAccountAddress={ensByAccountAddress}
-          isSelectionDisabled
-        />
-      );
-    };
-
-    const { getAllByTestId } = renderComponent(
-      initialState,
-      EvmAccountSelectorListDisabledSelectionTest,
-    );
-
-    const cells = getAllByTestId(CellComponentSelectorsIDs.SELECT_WITH_MENU);
-
-    // Check that all cells have the disabled prop set to true
-    cells.forEach((cell) => {
-      expect(cell.props.disabled).toBe(true);
-    });
-
-    // Since we're mocking React Native components, we can't directly test
-    // that clicks don't work when disabled. Instead, we'll verify the component
-    // has the disabled prop set, which is a better indicator of disabled state.
-    // Calling onPress manually here would bypass the disabled check in the real component.
-  });
-
-  it('navigates to account actions when menu button is clicked', async () => {
-    // Clear mocks
-    mockNavigate.mockClear();
-
-    const { getAllByTestId } = renderComponent(initialState);
-
-    // Find buttons with the correct test ID
-    const actionButtons = getAllByTestId(
-      WalletViewSelectorsIDs.ACCOUNT_ACTIONS,
-    );
-    expect(actionButtons.length).toBe(2);
-
-    // Click the first account's action button
-    actionButtons[0].props.onPress();
-
-    // Verify navigation was triggered
-    expect(mockNavigate).toHaveBeenCalled();
-    // The actual values may be different based on the component's implementation
-    // So we're just checking that navigation occurred, not the specific values
-    expect(mockNavigate).toHaveBeenCalledWith(
-      expect.any(String),
-      expect.objectContaining({
-        screen: expect.any(String),
-        params: expect.anything(),
-      }),
-    );
-  });
-
-  it('should not allow account removal when long-pressed for HD Key Tree account type', async () => {
-    const mockAlert = jest.spyOn(Alert, 'alert');
-    mockAlert.mockReset();
-
-    // Clear previous calls to removeAccount
-    (Engine.context.KeyringController.removeAccount as jest.Mock).mockClear();
-
-    // Mock account data that is not removable (HD Key Tree)
-    setAccountsMock([
-      {
-        name: 'Account 1',
-        address: BUSINESS_ACCOUNT,
-        assets: {
-          fiatBalance: '$3200.00\n1 ETH',
-        },
-        type: 'HD Key Tree', // Not a simple or snap keyring type
-        yOffset: 0,
-        isSelected: true,
-        balanceError: undefined,
-        caipAccountId: `eip155:0:${BUSINESS_ACCOUNT}`,
-      },
-    ]);
-
-    const { getAllByTestId } = renderComponent(initialState);
-
-    await waitFor(() => {
-      const cells = getAllByTestId(CellComponentSelectorsIDs.SELECT_WITH_MENU);
-      expect(cells.length).toBeGreaterThan(0);
-
-      cells[0].props.onLongPress();
-
-      expect(mockAlert).not.toHaveBeenCalled();
-
-      expect(
-        Engine.context.KeyringController.removeAccount,
-      ).not.toHaveBeenCalled();
-    });
-
-    mockAlert.mockRestore();
-  });
-
-  it('should not allow account removal when isRemoveAccountEnabled is false', async () => {
-    const mockAlert = jest.spyOn(Alert, 'alert');
-    mockAlert.mockReset();
-
-    // Clear previous calls to removeAccount
-    (Engine.context.KeyringController.removeAccount as jest.Mock).mockClear();
-
-    // Mock account data for a simple keyring account (normally removable)
-    setAccountsMock([
-      {
-        name: 'Account 1',
-        address: BUSINESS_ACCOUNT,
-        assets: {
-          fiatBalance: '$3200.00\n1 ETH',
-        },
-        type: KeyringTypes.simple, // Normally removable type
-        yOffset: 0,
-        isSelected: true,
-        balanceError: undefined,
-        caipAccountId: `eip155:0:${BUSINESS_ACCOUNT}`,
-      },
-    ]);
-
-    const EvmAccountSelectorListNoRemoveTest: React.FC = () => {
-      const { accounts, ensByAccountAddress } = useAccounts();
-      return (
-        <EvmAccountSelectorList
-          onSelectAccount={onSelectAccount}
-          onRemoveImportedAccount={onRemoveImportedAccount}
-          accounts={accounts}
-          ensByAccountAddress={ensByAccountAddress}
-          isRemoveAccountEnabled={false}
-        />
-      );
-    };
-
-    const { getAllByTestId } = renderComponent(
-      initialState,
-      EvmAccountSelectorListNoRemoveTest,
-    );
-
-    await waitFor(() => {
-      const cells = getAllByTestId(CellComponentSelectorsIDs.SELECT_WITH_MENU);
-      expect(cells.length).toBeGreaterThan(0);
-
-      cells[0].props.onLongPress();
-
-      expect(mockAlert).not.toHaveBeenCalled();
-
-      expect(
-        Engine.context.KeyringController.removeAccount,
-      ).not.toHaveBeenCalled();
-    });
-
-    mockAlert.mockRestore();
-  });
-
-  it('should auto-scroll to selected account when isAutoScrollEnabled is true', () => {
-    // Create a mock for the FlatList's scrollToOffset method
-    const mockScrollToOffset = jest.fn();
-
-    // Override the scrollToOffset method by mocking the React Native FlatList
-    jest.mock('react-native-gesture-handler', () => {
-      const actual = jest.requireActual('react-native-gesture-handler');
-      const FlatList = ({
-        onContentSizeChange,
-        ...props
-      }: {
-        onContentSizeChange?: () => void;
-      }) => {
-        // Simulate the ref by providing a scrollToOffset method
-        setTimeout(() => {
-          if (onContentSizeChange) {
-            onContentSizeChange();
-          }
-        }, 0);
-        return actual.FlatList(props);
-      };
-      FlatList.prototype.scrollToOffset = mockScrollToOffset;
-      return {
-        ...actual,
-        FlatList,
-      };
-    });
-
-    // Mock the account data with an account that has a selected flag
-    (useAccounts as jest.Mock).mockReturnValue({
-      accounts: [
-        {
-          id: 'mock-account-id-1',
-          name: 'Account 1',
-          address: BUSINESS_ACCOUNT,
-          assets: { fiatBalance: '$3200.00\n1 ETH' },
-          type: 'HD Key Tree',
-          yOffset: 150,
-          isSelected: true,
-          balanceError: undefined,
-          caipAccountId: `eip155:0:${BUSINESS_ACCOUNT}`,
-        },
-      ],
-      evmAccounts: [],
-      ensByAccountAddress: {},
-    });
-
-    renderComponent(initialState);
-
-    // Skip actually testing the scrollToOffset call since we can't
-    // reliably mock and test the FlatList's methods in this environment
-    expect(true).toBe(true);
-  });
-
-  // TODO: fix this test
-  it('should not auto-scroll when isAutoScrollEnabled is false', async () => {
-    const mockScrollToOffset = jest.fn();
-
-    // Create test component with auto-scroll disabled
-    const EvmAccountSelectorListNoAutoScrollTest: React.FC = () => {
-      const { accounts, ensByAccountAddress } = useAccounts();
-      return (
-        <EvmAccountSelectorList
-          onSelectAccount={onSelectAccount}
-          accounts={accounts}
-          ensByAccountAddress={ensByAccountAddress}
-          isAutoScrollEnabled={false}
-        />
-      );
-    };
-
-    const { getByTestId } = renderComponent(
-      initialState,
-      EvmAccountSelectorListNoAutoScrollTest,
-    );
-
-    // Get the FlatList and trigger content size change
-    const flatList = getByTestId(ACCOUNT_SELECTOR_LIST_TESTID);
-    flatList.props.onContentSizeChange();
-
-    // Verify that scrollToOffset was not called
-    expect(mockScrollToOffset).not.toHaveBeenCalled();
-  });
-
-  it('should display ENS name instead of account name when available', async () => {
-    // Access the mocked function directly from the jest mock
-    const mockENSUtils = jest.requireMock('../../../util/ENSUtils');
-    mockENSUtils.isDefaultAccountName.mockReturnValue(true);
-
-    // Mock accounts with ENS names
-    setAccountsMock(
-      [
-        {
-          name: 'Account 1', // Default account name
-          address: BUSINESS_ACCOUNT,
-          assets: {
-            fiatBalance: '$3200.00\n1 ETH',
-          },
-          type: 'HD Key Tree',
-          yOffset: 0,
-          isSelected: true,
-          balanceError: undefined,
-          caipAccountId: `eip155:0:${BUSINESS_ACCOUNT}`,
-        },
-      ],
-      {
-        [BUSINESS_ACCOUNT]: 'vitalik.eth', // ENS name for the account
-      },
-    );
-
-    const { getByText } = renderComponent(initialState);
-
-    await waitFor(() => {
-      expect(getByText('vitalik.eth')).toBeDefined();
-    });
-    mockENSUtils.isDefaultAccountName.mockRestore();
-  });
-
-  it('should use account name when ENS name is available but not a default account name', async () => {
-    // Access the mocked function directly from the jest mock
-    const mockENSUtils = jest.requireMock('../../../util/ENSUtils');
-    mockENSUtils.isDefaultAccountName.mockReturnValue(false);
-
-    // Mock accounts with a custom name
-    setAccountsMock(
-      [
-        {
-          name: 'My Custom Account Name',
-          address: BUSINESS_ACCOUNT,
-          assets: {
-            fiatBalance: '$3200.00\n1 ETH',
-          },
-          type: 'HD Key Tree',
-          yOffset: 0,
-          isSelected: true,
-          balanceError: undefined,
-          caipAccountId: `eip155:0:${BUSINESS_ACCOUNT}`,
-        },
-      ],
-      {
-        [BUSINESS_ACCOUNT]: 'vitalik.eth', // ENS name is available
-      },
-    );
-
-    const { getByText } = renderComponent(initialState);
-
-    await waitFor(() => {
-      expect(getByText('My Custom Account Name')).toBeDefined();
-    });
-    mockENSUtils.isDefaultAccountName.mockRestore();
-  });
-
-  it('selects an account when tapped', async () => {
-    // Setup with multiple accounts using the same addresses as in initialState
-    const mockMultipleAccounts = [
-      {
-        name: 'Account 1',
-        address: BUSINESS_ACCOUNT,
-        assets: {
-          fiatBalance: '$3200.00\n1 ETH',
-          tokens: [],
-        },
-        type: KeyringTypes.simple,
-        yOffset: 0,
-        isSelected: true,
-        balanceError: undefined,
-        caipAccountId: `eip155:0:${BUSINESS_ACCOUNT}`,
-      },
-      {
-        name: 'Account 2',
-        address: PERSONAL_ACCOUNT, // Use PERSONAL_ACCOUNT instead of MOCK_ADDRESS_1
-        assets: {
-          fiatBalance: '$6400.00\n2 ETH',
-          tokens: [],
-        },
-        type: KeyringTypes.simple,
-        yOffset: 78,
-        isSelected: false,
-        balanceError: undefined,
-        caipAccountId: `eip155:0:${PERSONAL_ACCOUNT}`,
-      },
-    ];
-
-    setAccountsMock(mockMultipleAccounts);
-
-    const { getAllByTestId } = renderComponent(initialState);
-
-    // Wait for exactly 2 cells to render (one for each account)
-    await waitFor(() => {
-      const cells = getAllByTestId(CellComponentSelectorsIDs.SELECT_WITH_MENU);
-      expect(cells.length).toBe(2);
-    });
-
-    const cells = getAllByTestId(CellComponentSelectorsIDs.SELECT_WITH_MENU);
-
-    expect(cells).toHaveLength(2);
-    expect(cells[0]).toBeDefined();
-    expect(cells[1]).toBeDefined();
-
-    fireEvent.press(cells[1]);
-
-    expect(onSelectAccount).toHaveBeenCalledWith(PERSONAL_ACCOUNT, false);
-  });
-
-  it('navigates to account details when a balance error is tapped', () => {
-    // Setup account with balance error
-    const mockAccountWithError = [
-      {
-        name: 'Error Account',
-        address: BUSINESS_ACCOUNT,
-        assets: {
-          fiatBalance: '$0.00\n0 ETH',
-          tokens: [],
-        },
-        type: KeyringTypes.simple,
-        yOffset: 0,
-        isSelected: true,
-        balanceError: true, // Account has balance error
-        caipAccountId: `eip155:0:${BUSINESS_ACCOUNT}`,
-      },
-    ];
-
-    setAccountsMock(mockAccountWithError);
-
-    // Render the component to ensure it handles accounts with balance errors
-    const { getByTestId } = renderComponent(initialState);
-
-    // Verify the component renders successfully even with balance errors
-    expect(getByTestId(ACCOUNT_SELECTOR_LIST_TESTID)).toBeDefined();
-  });
-
-  it('correctly handles auto-scrolling when an account is marked with autoscroll', async () => {
-    // Setup accounts with one marked for auto-scroll
-    const mockAccountsForScroll = [
-      {
-        name: 'Account 1',
-        address: BUSINESS_ACCOUNT,
-        assets: {
-          fiatBalance: '$3200.00\n1 ETH',
-          tokens: [],
-        },
-        type: KeyringTypes.simple,
-        yOffset: 0,
-        isSelected: false,
-        balanceError: undefined,
-        caipAccountId: `eip155:0:${BUSINESS_ACCOUNT}`,
-      },
-      {
-        name: 'Account 2',
-        address: MOCK_ADDRESS_1,
-        assets: {
-          fiatBalance: '$6400.00\n2 ETH',
-          tokens: [],
-        },
-        type: KeyringTypes.simple,
-        yOffset: 78, // This is the yOffset that should be used for scrolling
-        isSelected: true,
-        balanceError: undefined,
-        autoScroll: true, // This account should be auto-scrolled to
-        caipAccountId: `eip155:0:${MOCK_ADDRESS_1}`,
-      },
-    ];
-
-    setAccountsMock(mockAccountsForScroll);
-
-    renderComponent(initialState);
-
-    // Since we can't properly test SectionList scrolling in this environment,
-    // we'll just verify the component renders correctly
-    expect(true).toBe(true);
-  });
-
-  it('should call onSelectAccount when an account is pressed', async () => {
-    const { getAllByTestId } = renderComponent(initialState);
-
-    await waitFor(() => {
-      const cells = getAllByTestId(CellComponentSelectorsIDs.SELECT_WITH_MENU);
-      expect(cells.length).toBeGreaterThan(0);
-    });
-
-    // Find all cell elements
-    const cells = getAllByTestId(CellComponentSelectorsIDs.SELECT_WITH_MENU);
-    // Select the second account
-    cells[1].props.onPress();
-
-    // Verify onSelectAccount was called with correct parameters
-    expect(onSelectAccount).toHaveBeenCalledWith(PERSONAL_ACCOUNT, false);
-  });
-
-  it('renders network icons for accounts with transaction activity', () => {
-    const { toJSON } = renderComponent(initialState);
-    expect(toJSON()).toMatchSnapshot();
-  });
-
-  it('render the correct amount of network icons for accounts with transaction activity', () => {
-    const stateWithNetworkActivity = {
-      ...initialState,
-      engine: {
-        ...initialState.engine,
-        backgroundState: {
-          ...initialState.engine.backgroundState,
-          MultichainNetworkController: {
-            ...initialState.engine.backgroundState.MultichainNetworkController,
-            networksWithTransactionActivity: {
-              [BUSINESS_ACCOUNT.toLowerCase()]: {
-                namespace: KnownCaipNamespace.Eip155,
-                activeChains: ['1', '137'],
-              },
-              [PERSONAL_ACCOUNT.toLowerCase()]: {
-                namespace: KnownCaipNamespace.Eip155,
-                activeChains: ['1'],
-              },
-            },
-          },
-        },
-      },
-    };
-    const { getAllByTestId } = renderComponent(stateWithNetworkActivity);
-
-    const avatarGroups = getAllByTestId(AVATARGROUP_CONTAINER_TESTID);
-    expect(avatarGroups).toHaveLength(2);
-  });
-
-  it('does not render network icons when account has no transaction activity', () => {
-    const stateWithNoNetworkActivity = {
-      ...initialState,
-      engine: {
-        ...initialState.engine,
-        backgroundState: {
-          ...initialState.engine.backgroundState,
-          MultichainNetworkController: {
-            ...initialState.engine.backgroundState.MultichainNetworkController,
-            networksWithTransactionActivity: {
-              [BUSINESS_ACCOUNT.toLowerCase()]: {
-                namespace: KnownCaipNamespace.Eip155,
-                activeChains: [],
-              },
-              [PERSONAL_ACCOUNT.toLowerCase()]: {
-                namespace: KnownCaipNamespace.Eip155,
-                activeChains: [],
-              },
-            },
-          },
-        },
-      },
-    };
-
-    const { queryAllByTestId } = renderComponent(stateWithNoNetworkActivity);
-
-    const avatarGroups = queryAllByTestId('network-avatar-group-container');
-    expect(avatarGroups).toHaveLength(0);
-  });
-
-  // Helper to create state with multichain accounts enabled
-  const getMultichainState = (overrides = {}) => ({
-    ...initialState,
-    engine: {
-      ...initialState.engine,
-      backgroundState: {
-        ...initialState.engine.backgroundState,
-        AccountTreeController: {
-          accountTree: {
-            wallets: {
-              wallet1: {
-                id: 'test-wallet-id-123',
-                metadata: {
-                  name: 'HD Accounts',
-                },
-                groups: {
-                  group1: {
-                    accounts: [
-                      Object.keys(
-                        initialState.engine.backgroundState.AccountsController
-                          .internalAccounts.accounts,
-                      )[0],
-                      Object.keys(
-                        initialState.engine.backgroundState.AccountsController
-                          .internalAccounts.accounts,
-                      )[1],
-                    ],
-                  },
-                },
-              },
-            },
-          },
-        },
-        RemoteFeatureFlagController: {
-          remoteFeatureFlags: {
-            enableMultichainAccounts: {
-              enabled: true,
-              featureVersion: '1',
-              minimumVersion: '1.0.0',
-            },
-          },
-        },
-        ...overrides,
-      },
-    },
-  });
-
-  it('renders sections based on AccountTreeController when multichain accounts enabled', () => {
-    const multichainState = getMultichainState();
-    const { getByText, getAllByText } = renderComponent(multichainState);
-
-    expect(getByText('HD Accounts')).toBeDefined();
-
-    expect(getAllByText(/^Account/)).toHaveLength(2);
-    expect(getByText('Account 1')).toBeDefined();
-    expect(getByText('Account 2')).toBeDefined();
-  });
-
-  it('navigates to multichain account details when multichain accounts enabled', () => {
-    const multichainState = getMultichainState();
-    const { getAllByTestId } = renderComponent(multichainState);
-
-    const accountActionsButton = getAllByTestId(
-      WalletViewSelectorsIDs.ACCOUNT_ACTIONS,
-    )[0];
-
-    fireEvent.press(accountActionsButton);
-
-    const expectedAccount =
-      multichainState.engine.backgroundState.AccountsController.internalAccounts
-        .accounts[BUSINESS_ACCOUNT_ID];
-    expect(mockNavigate).toHaveBeenCalledWith(
-      Routes.MULTICHAIN_ACCOUNTS.ACCOUNT_DETAILS,
-      {
-        account: expectedAccount,
-      },
-    );
-  });
-
-  it('does not render tag labels when multichain accounts enabled', () => {
-    jest
-      .requireMock('../../../util/address')
-      .getLabelTextByInternalAccount.mockReturnValue('Imported');
-
-    const multichainState = getMultichainState();
-    const { queryByText } = renderComponent(multichainState);
-
-    // Tag labels should not be rendered when multichain is enabled
-    // Even though getLabelTextByInternalAccount might be called, its result shouldn't be displayed
-    expect(queryByText('Imported')).toBeNull();
-  });
-
-  it('renders section headers when multichain accounts enabled', () => {
-    const multichainState = getMultichainState();
-    const { getByText } = renderComponent(multichainState);
-
-    expect(getByText('HD Accounts')).toBeDefined();
-    expect(getByText('Details')).toBeDefined();
-  });
-
-  it('creates flattened data structure correctly for multichain accounts', () => {
-    const multichainState = getMultichainState();
-    const { getByTestId, getByText, getAllByTestId } =
-      renderComponent(multichainState);
-
-    // Verify the list is rendered
-    const flatList = getByTestId(ACCOUNT_SELECTOR_LIST_TESTID);
-    expect(flatList).toBeDefined();
-
-    // Verify section header is rendered
-    expect(getByText('HD Accounts')).toBeDefined();
-
-    // Verify accounts are rendered
-    expect(getByText('Account 1')).toBeDefined();
-    expect(getByText('Account 2')).toBeDefined();
-
-    // Verify account cells are rendered
-    const accountCells = getAllByTestId(
-      CellComponentSelectorsIDs.SELECT_WITH_MENU,
-    );
-    expect(accountCells.length).toBe(2);
-  });
-
-  it('renders different item types correctly', () => {
-    const multichainState = getMultichainState();
-    const { getByText, getAllByTestId } = renderComponent(multichainState);
-
-    // Verify header is rendered (section title)
-    expect(getByText('HD Accounts')).toBeDefined();
-
-    // Verify accounts are rendered
-    const accountCells = getAllByTestId(
-      CellComponentSelectorsIDs.SELECT_WITH_MENU,
-    );
-    expect(accountCells.length).toBeGreaterThan(0);
-
-    // Verify details link is rendered in header
-    expect(getByText('Details')).toBeDefined();
-  });
-
-  it('handles onContentSizeChange callback correctly', () => {
-    // Mock accounts with selected account
-    setAccountsMock([
-      {
-        name: 'Account 1',
-        address: BUSINESS_ACCOUNT,
-        assets: { fiatBalance: '$3200.00\n1 ETH' },
-        type: 'HD Key Tree',
-        yOffset: 150,
-        isSelected: true,
-        balanceError: undefined,
-        caipAccountId: `eip155:0:${BUSINESS_ACCOUNT}`,
-      },
-    ]);
-
-    const { getByTestId } = renderComponent(initialState);
-
-    const flatList = getByTestId(ACCOUNT_SELECTOR_LIST_TESTID);
-
-    // Verify the component renders with onContentSizeChange prop
-    expect(flatList.props.onContentSizeChange).toBeDefined();
-    expect(typeof flatList.props.onContentSizeChange).toBe('function');
-  });
-
-  it('handles keyExtractor function with proper item structure', () => {
-    const { getByTestId } = renderComponent(initialState);
-
-    const flatList = getByTestId(ACCOUNT_SELECTOR_LIST_TESTID);
-    const keyExtractor = flatList.props.keyExtractor;
-
-    // Test that keyExtractor function exists
-    expect(typeof keyExtractor).toBe('function');
-
-    // Test key extraction for account item
-    const accountItem = {
-      type: 'account',
-      data: {
-        name: 'Test Account',
-        address: '0x123',
-        assets: { fiatBalance: '$100' },
-        type: 'HD Key Tree',
-        yOffset: 0,
-        isSelected: false,
-        balanceError: undefined,
-        caipAccountId: 'eip155:0:0x123',
-      },
-      sectionIndex: 0,
-      accountIndex: 0,
-    };
-
-    const key = keyExtractor(accountItem);
-    expect(key).toBe('0x123');
-  });
-
-  it('creates footer items when there are multiple sections', () => {
-    const accountIds = Object.keys(
-      initialState.engine.backgroundState.AccountsController.internalAccounts
-        .accounts,
-    );
-    // Create a state with multiple sections to trigger footer creation
-    const multiSectionState = {
-      ...initialState,
-      engine: {
-        ...initialState.engine,
-        backgroundState: {
-          ...initialState.engine.backgroundState,
-          AccountTreeController: {
-            accountTree: {
-              wallets: {
-                wallet1: {
-                  metadata: {
-                    name: 'HD Accounts',
-                  },
-                  groups: {
-                    group1: {
-                      accounts: [accountIds[0]],
-                    },
-                    group2: {
-                      accounts: [accountIds[1]],
-                    },
-                  },
-                },
-                wallet2: {
-                  metadata: {
-                    name: 'Imported Accounts',
-                  },
-                  groups: {
-                    group3: {
-                      accounts: [],
-                    },
-                  },
-                },
-              },
-            },
-          },
-          RemoteFeatureFlagController: {
-            remoteFeatureFlags: {
-              enableMultichainAccounts: {
-                enabled: true,
-                featureVersion: '1',
-                minimumVersion: '1.0.0',
-              },
-            },
-          },
-        },
-      },
-    };
-
-    const { getByTestId, getByText, queryAllByText } =
-      renderComponent(multiSectionState);
-
-    // Verify the list is rendered
-    const flatList = getByTestId(ACCOUNT_SELECTOR_LIST_TESTID);
-    expect(flatList).toBeDefined();
-
-    // Verify multiple sections are rendered
-    expect(getByText('HD Accounts')).toBeDefined();
-    expect(getByText('Imported Accounts')).toBeDefined();
-
-    // Verify multiple "Details" links for each section
-    const detailsLinks = queryAllByText('Details');
-    expect(detailsLinks.length).toBeGreaterThan(1);
-  });
-
-  it('navigates to wallet details when section header details link is pressed', () => {
-    const multichainState = getMultichainState();
-    const { getByText } = renderComponent(multichainState);
-
-    const detailsLink = getByText('Details');
-    fireEvent.press(detailsLink);
-
-    expect(mockNavigate).toHaveBeenCalledWith(
-      Routes.MULTICHAIN_ACCOUNTS.WALLET_DETAILS,
-      {
-        walletId: 'test-wallet-id-123',
-      },
-    );
-  });
-
-  describe('onContentSizeChange callback logic', () => {
-    it('should handle scroll logic for different scenarios', () => {
-      const testCases = [
-        {
-          name: 'with selectedAddresses provided',
-          accounts: [
-            {
-              name: 'Account 1',
-              address: BUSINESS_ACCOUNT,
-              assets: { fiatBalance: '$3200.00\n1 ETH' },
-              type: KeyringTypes.hd,
-              yOffset: 150,
-              isSelected: false,
-              balanceError: undefined,
-              caipAccountId: `eip155:0:${BUSINESS_ACCOUNT}`,
-              isLoadingAccount: false,
-              scopes: ['eip155:1'],
-            },
-          ],
-          selectedAddresses: [BUSINESS_ACCOUNT],
-          isAutoScrollEnabled: true,
-        },
-        {
-          name: 'with isSelected fallback',
-          accounts: [
-            {
-              name: 'Account 1',
-              address: BUSINESS_ACCOUNT,
-              assets: { fiatBalance: '$3200.00\n1 ETH' },
-              type: KeyringTypes.hd,
-              yOffset: 150,
-              isSelected: false,
-              balanceError: undefined,
-              caipAccountId: `eip155:0:${BUSINESS_ACCOUNT}`,
-              isLoadingAccount: false,
-              scopes: ['eip155:1'],
-            },
-            {
-              name: 'Account 2',
-              address: PERSONAL_ACCOUNT,
-              assets: { fiatBalance: '$6400.00\n2 ETH' },
-              type: KeyringTypes.hd,
-              yOffset: 300,
-              isSelected: true,
-              balanceError: undefined,
-              caipAccountId: `eip155:0:${PERSONAL_ACCOUNT}`,
-              isLoadingAccount: false,
-              scopes: ['eip155:1'],
-            },
-          ],
-          selectedAddresses: [],
-          isAutoScrollEnabled: true,
-        },
-        {
-          name: 'with no selected account',
-          accounts: [
-            {
-              name: 'Account 1',
-              address: BUSINESS_ACCOUNT,
-              assets: { fiatBalance: '$3200.00\n1 ETH' },
-              type: KeyringTypes.hd,
-              yOffset: 150,
-              isSelected: false,
-              balanceError: undefined,
-              caipAccountId: `eip155:0:${BUSINESS_ACCOUNT}`,
-              isLoadingAccount: false,
-              scopes: ['eip155:1'],
-            },
-          ],
-          selectedAddresses: [],
-          isAutoScrollEnabled: true,
-        },
-        {
-          name: 'with invalid address',
-          accounts: [
-            {
-              name: 'Account 1',
-              address: BUSINESS_ACCOUNT,
-              assets: { fiatBalance: '$3200.00\n1 ETH' },
-              type: KeyringTypes.hd,
-              yOffset: 150,
-              isSelected: false,
-              balanceError: undefined,
-              caipAccountId: `eip155:0:${BUSINESS_ACCOUNT}`,
-              isLoadingAccount: false,
-              scopes: ['eip155:1'],
-            },
-          ],
-          selectedAddresses: ['0xInvalidAddress'],
-          isAutoScrollEnabled: true,
-        },
-        {
-          name: 'with auto-scroll disabled',
-          accounts: [
-            {
-              name: 'Account 1',
-              address: BUSINESS_ACCOUNT,
-              assets: { fiatBalance: '$3200.00\n1 ETH' },
-              type: KeyringTypes.hd,
-              yOffset: 150,
-              isSelected: true,
-              balanceError: undefined,
-              caipAccountId: `eip155:0:${BUSINESS_ACCOUNT}`,
-              isLoadingAccount: false,
-              scopes: ['eip155:1'],
-            },
-          ],
-          selectedAddresses: [BUSINESS_ACCOUNT],
-          isAutoScrollEnabled: false,
-        },
-      ];
-
-      testCases.forEach(
-        ({
-          accounts: testAccounts,
-          selectedAddresses,
-          isAutoScrollEnabled,
-        }) => {
-          setAccountsMock(testAccounts);
-
-          const TestComponent: React.FC = () => {
-            const { accounts, ensByAccountAddress } = useAccounts();
-            return (
-              <EvmAccountSelectorList
-                onSelectAccount={onSelectAccount}
-                accounts={accounts}
-                ensByAccountAddress={ensByAccountAddress}
-                selectedAddresses={selectedAddresses}
-                isAutoScrollEnabled={isAutoScrollEnabled}
-              />
-            );
-          };
-
-          const { getByTestId } = renderComponent(initialState, TestComponent);
-          const flatList = getByTestId(ACCOUNT_SELECTOR_LIST_TESTID);
-
-          expect(flatList.props.onContentSizeChange).toBeDefined();
-          expect(typeof flatList.props.onContentSizeChange).toBe('function');
-          expect(() => flatList.props.onContentSizeChange()).not.toThrow();
-        },
-      );
-    });
-
-    it('should call scrollToOffset with correct parameters when conditions are met', () => {
-      const mockScrollToOffset = jest.fn();
-      const mockRef = { current: { scrollToOffset: mockScrollToOffset } };
-
-      const testScrollLogic = (
-        accounts: Account[],
-        selectedAddresses?: string[],
-        isAutoScrollEnabled = true,
-      ) => {
-        if (!accounts.length || !isAutoScrollEnabled) return;
-
-        // Simulate the accountsLengthRef logic
-        const accountsLengthRef = { current: 0 };
-
-        if (accountsLengthRef.current !== accounts.length) {
-          let selectedAccount: Account | undefined;
-
-          if (selectedAddresses?.length) {
-            const selectedAddress = selectedAddresses[0];
-            selectedAccount = accounts.find(
-              (acc) =>
-                acc.address.toLowerCase() === selectedAddress.toLowerCase(),
-            );
-          }
-
-          // Fall back to the account with isSelected flag if no override or match found
-          if (!selectedAccount) {
-            selectedAccount = accounts.find((acc) => acc.isSelected);
-          }
-
-          mockRef.current?.scrollToOffset({
-            offset: selectedAccount?.yOffset || 0,
-            animated: false,
-          });
-
-          accountsLengthRef.current = accounts.length;
-        }
-      };
-
-      const mockAccounts: Account[] = [
-        {
-          id: 'mock-account-id-1',
-          name: 'Account 1',
-          address: BUSINESS_ACCOUNT,
-          assets: { fiatBalance: '$3200.00\n1 ETH' },
-          type: KeyringTypes.hd,
-          yOffset: 150,
-          isSelected: false,
-          balanceError: undefined,
-          caipAccountId: `eip155:1:${BUSINESS_ACCOUNT}` as const,
-          isLoadingAccount: false,
-          scopes: ['eip155:1'],
-        },
-      ];
-
-      // Test the logic directly
-      testScrollLogic(mockAccounts, [BUSINESS_ACCOUNT], true);
-
-      // Verify scrollToOffset was called with the correct parameters
-      expect(mockScrollToOffset).toHaveBeenCalledWith({
-        offset: 150,
-        animated: false,
-      });
-    });
-  });
-});
diff --git a/app/components/UI/EvmAccountSelectorList/EvmAccountSelectorList.tsx b/app/components/UI/EvmAccountSelectorList/EvmAccountSelectorList.tsx
deleted file mode 100644
index 7c5b91ee58d0..000000000000
--- a/app/components/UI/EvmAccountSelectorList/EvmAccountSelectorList.tsx
+++ /dev/null
@@ -1,590 +0,0 @@
-import React, { useCallback, useRef, useMemo, useEffect } from 'react';
-import {
-  Alert,
-  InteractionManager,
-  View,
-  ViewStyle,
-  TouchableOpacity,
-  ScrollViewProps,
-} from 'react-native';
-import { ScrollView } from 'react-native-gesture-handler';
-import { CaipChainId } from '@metamask/utils';
-import { useSelector } from 'react-redux';
-import { useNavigation } from '@react-navigation/native';
-import { KeyringTypes } from '@metamask/keyring-controller';
-import { isAddress as isSolanaAddress } from '@solana/addresses';
-
-import Cell, {
-  CellVariant,
-} from '../../../component-library/components/Cells/Cell';
-import { useStyles } from '../../../component-library/hooks';
-import Text, {
-  TextColor,
-  TextVariant,
-} from '../../../component-library/components/Texts/Text';
-import SensitiveText, {
-  SensitiveTextLength,
-} from '../../../component-library/components/Texts/SensitiveText';
-import {
-  areAddressesEqual,
-  formatAddress,
-  getLabelTextByInternalAccount,
-  toFormattedAddress,
-} from '../../../util/address';
-import { isDefaultAccountName } from '../../../util/ENSUtils';
-import { strings } from '../../../../locales/i18n';
-import { AvatarVariant } from '../../../component-library/components/Avatars/Avatar/Avatar.types';
-import { Account, Assets } from '../../hooks/useAccounts';
-import Engine from '../../../core/Engine';
-import { removeAccountsFromPermissions } from '../../../core/Permissions';
-import Routes from '../../../constants/navigation/Routes';
-import { selectAccountSections } from '../../../selectors/multichainAccounts/accountTreeController';
-import { selectMultichainAccountsState1Enabled } from '../../../selectors/featureFlagController/multichainAccounts/enabledMultichainAccounts';
-import { selectAvatarAccountType } from '../../../selectors/settings';
-
-import {
-  AccountSection,
-  EvmAccountSelectorListProps,
-  FlattenedAccountListItem,
-} from './EvmAccountSelectorList.types';
-import styleSheet from './EvmAccountSelectorList.styles';
-import { AccountListBottomSheetSelectorsIDs } from '../../Views/AccountSelector/AccountListBottomSheet.testIds';
-import { WalletViewSelectorsIDs } from '../../Views/Wallet/WalletView.testIds';
-import { ACCOUNT_SELECTOR_LIST_TESTID } from './EvmAccountSelectorList.constants';
-import { toHex } from '@metamask/controller-utils';
-import AccountNetworkIndicator from '../AccountNetworkIndicator';
-import { Skeleton } from '../../../component-library/components/Skeleton';
-import {
-  selectInternalAccounts,
-  selectInternalAccountsById,
-} from '../../../selectors/accountsController';
-import { AccountWalletObject } from '@metamask/account-tree-controller';
-import { FlashList, ListRenderItem, FlashListRef } from '@shopify/flash-list';
-
-/**
- * @deprecated This component is deprecated in favor of the CaipAccountSelectorList component.
- * Functionally they should be nearly identical except that EvmAccountSelectorList expects
- * Hex addressess where as CaipAccountSelectorList expects CaipAccountIds.
- *
- * If changes need to be made to this component, please instead make them to CaipAccountSelectorList
- * and adopt that component instead.
- */
-const EvmAccountSelectorList = ({
-  onSelectAccount,
-  onRemoveImportedAccount,
-  accounts,
-  ensByAccountAddress,
-  isLoading = false,
-  selectedAddresses,
-  isMultiSelect = false,
-  isSelectWithoutMenu = false,
-  renderRightAccessory,
-  isSelectionDisabled,
-  isRemoveAccountEnabled = false,
-  isAutoScrollEnabled = true,
-  privacyMode = false,
-  ...props
-}: EvmAccountSelectorListProps) => {
-  const { navigate } = useNavigation();
-  /**
-   * Ref for the FlashList component.
-   */
-  const accountListRef = useRef<FlashListRef<FlattenedAccountListItem>>(null);
-  const accountsLengthRef = useRef<number>(0);
-  const { styles } = useStyles(styleSheet, {});
-
-  const accountAvatarType = useSelector(selectAvatarAccountType);
-
-  const isMultichainAccountsState1Enabled = useSelector(
-    selectMultichainAccountsState1Enabled,
-  );
-  const accountTreeSections = useSelector(selectAccountSections);
-
-  const internalAccounts = useSelector(selectInternalAccounts);
-  const internalAccountsById = useSelector(selectInternalAccountsById);
-
-  const accountSections = useMemo((): AccountSection[] => {
-    if (isMultichainAccountsState1Enabled) {
-      const accountsById = new Map<string, Account>();
-      internalAccounts.forEach((account) => {
-        const accountObj = accounts.find((a) => a.id === account.id);
-        if (accountObj) {
-          accountsById.set(account.id, accountObj);
-        }
-      });
-
-      // Use AccountTreeController sections and match accounts to their IDs
-      return accountTreeSections.map((section) => ({
-        title: section.title,
-        wallet: section.wallet,
-        data: section.data
-          .map((accountId: string) => accountsById.get(accountId))
-          .filter(
-            (account: Account | undefined) => account !== undefined,
-          ) as Account[],
-      }));
-    }
-    // Fallback for old behavior
-    return accounts.length > 0 ? [{ title: 'Accounts', data: accounts }] : [];
-  }, [
-    accounts,
-    isMultichainAccountsState1Enabled,
-    accountTreeSections,
-    internalAccounts,
-  ]);
-
-  // Flatten sections into a single array for FlatList
-  const flattenedData = useMemo((): FlattenedAccountListItem[] => {
-    const items: FlattenedAccountListItem[] = [];
-    let accountIndex = 0;
-
-    accountSections.forEach((section, sectionIndex) => {
-      if (isMultichainAccountsState1Enabled) {
-        items.push({
-          type: 'header',
-          data: section,
-          sectionIndex,
-        });
-      }
-
-      section.data.forEach((account) => {
-        items.push({
-          type: 'account',
-          data: account,
-          sectionIndex,
-          accountIndex,
-        });
-        accountIndex++;
-      });
-
-      if (
-        isMultichainAccountsState1Enabled &&
-        sectionIndex < accountSections.length - 1
-      ) {
-        items.push({
-          type: 'footer',
-          data: section,
-          sectionIndex,
-        });
-      }
-    });
-
-    return items;
-  }, [accountSections, isMultichainAccountsState1Enabled]);
-
-  const getKeyExtractor = (item: FlattenedAccountListItem) => {
-    if (item.type === 'header') {
-      return `header-${item.sectionIndex}`;
-    }
-    if (item.type === 'footer') {
-      return `footer-${item.sectionIndex}`;
-    }
-    return item.data.address;
-  };
-
-  // FlashList optimization: Define item types for better recycling
-  const getItemType = useCallback(
-    (item: FlattenedAccountListItem) => item.type,
-    [],
-  );
-
-  const useMultichainAccountDesign = Boolean(isMultichainAccountsState1Enabled);
-
-  const selectedAddressesLookup = useMemo(() => {
-    if (!selectedAddresses?.length) return undefined;
-    const lookupSet = new Set<string>();
-    selectedAddresses.forEach((addr) => {
-      if (addr) lookupSet.add(toFormattedAddress(addr));
-    });
-    return lookupSet;
-  }, [selectedAddresses]);
-
-  const renderAccountBalances = useCallback(
-    (
-      { fiatBalance }: Assets,
-      partialAccount: { address: string; scopes: CaipChainId[] },
-      isLoadingAccount: boolean,
-    ) => {
-      const fiatBalanceStrSplit = fiatBalance.split('\n');
-      const fiatBalanceAmount = fiatBalanceStrSplit[0] || '';
-
-      return (
-        <View
-          style={styles.balancesContainer}
-          testID={`${AccountListBottomSheetSelectorsIDs.ACCOUNT_BALANCE_BY_ADDRESS_TEST_ID}-${partialAccount.address}`}
-        >
-          {isLoadingAccount ? (
-            <Skeleton width={60} height={24} />
-          ) : (
-            <>
-              <SensitiveText
-                length={SensitiveTextLength.Long}
-                style={styles.balanceLabel}
-                isHidden={privacyMode}
-              >
-                {fiatBalanceAmount}
-              </SensitiveText>
-
-              <AccountNetworkIndicator partialAccount={partialAccount} />
-            </>
-          )}
-        </View>
-      );
-    },
-    [styles.balancesContainer, styles.balanceLabel, privacyMode],
-  );
-
-  const onLongPress = useCallback(
-    ({
-      address,
-      isAccountRemoveable,
-      isSelected,
-      index,
-    }: {
-      address: string;
-      isAccountRemoveable: boolean;
-      isSelected: boolean;
-      index: number;
-    }) => {
-      if (!isAccountRemoveable || !isRemoveAccountEnabled) return;
-      Alert.alert(
-        strings('accounts.remove_account_title'),
-        strings('accounts.remove_account_message'),
-        [
-          {
-            text: strings('accounts.no'),
-            onPress: () => false,
-            style: 'cancel',
-          },
-          {
-            text: strings('accounts.yes_remove_it'),
-            onPress: async () => {
-              InteractionManager.runAfterInteractions(async () => {
-                // Determine which account should be active after removal
-                let nextActiveAddress: string;
-
-                if (isSelected) {
-                  // If removing the selected account, choose an adjacent one
-                  const nextActiveIndex = index === 0 ? 1 : index - 1;
-                  nextActiveAddress = accounts[nextActiveIndex]?.address;
-                } else {
-                  // Not removing selected account, so keep current selection
-                  nextActiveAddress =
-                    selectedAddresses?.[0] ||
-                    accounts.find((acc) => acc.isSelected)?.address ||
-                    '';
-                }
-
-                // Switching accounts on the PreferencesController must happen before account is removed from the KeyringController, otherwise UI will break.
-                // If needed, place Engine.setSelectedAddress in onRemoveImportedAccount callback.
-                onRemoveImportedAccount?.({
-                  removedAddress: address,
-                  nextActiveAddress,
-                });
-                // Revocation of accounts from PermissionController is needed whenever accounts are removed.
-                // If there is an instance where this is not the case, this logic will need to be updated.
-                removeAccountsFromPermissions([toHex(address)]);
-                await Engine.context.KeyringController.removeAccount(address);
-              });
-            },
-          },
-        ],
-        { cancelable: false },
-      );
-    },
-    [
-      accounts,
-      onRemoveImportedAccount,
-      isRemoveAccountEnabled,
-      selectedAddresses,
-    ],
-  );
-
-  const onNavigateToAccountActions = useCallback(
-    (selectedAccountAddress: string) => {
-      const account = Engine.context.AccountsController.getAccountByAddress(
-        selectedAccountAddress,
-      );
-
-      if (!account) return;
-
-      navigate(Routes.MODAL.ROOT_MODAL_FLOW, {
-        screen: Routes.SHEET.ACCOUNT_ACTIONS,
-        params: { selectedAccount: account },
-      });
-    },
-    [navigate],
-  );
-
-  const onNavigateToWalletDetails = useCallback(
-    (wallet: AccountWalletObject) => {
-      navigate(Routes.MULTICHAIN_ACCOUNTS.WALLET_DETAILS, {
-        walletId: wallet.id,
-      });
-    },
-    [navigate],
-  );
-
-  const renderSectionHeader = useCallback(
-    ({ title, wallet }: { title: string; wallet?: AccountWalletObject }) => (
-      <View style={styles.sectionHeader}>
-        <Text variant={TextVariant.BodySMMedium} color={TextColor.Alternative}>
-          {title}
-        </Text>
-        <TouchableOpacity
-          onPress={() => wallet && onNavigateToWalletDetails(wallet)}
-        >
-          <Text variant={TextVariant.BodySM} style={styles.sectionDetailsLink}>
-            {strings('multichain_accounts.accounts_list.details')}
-          </Text>
-        </TouchableOpacity>
-      </View>
-    ),
-    [
-      styles.sectionHeader,
-      styles.sectionDetailsLink,
-      onNavigateToWalletDetails,
-    ],
-  );
-
-  const renderSectionFooter = useCallback(
-    () => <View style={styles.sectionSeparator} />,
-    [styles.sectionSeparator],
-  );
-
-  const scrollToSelectedAccount = useCallback(() => {
-    if (!accounts.length || !isAutoScrollEnabled || !accountListRef.current)
-      return;
-
-    let selectedAccount: Account | undefined;
-
-    if (selectedAddresses?.length) {
-      const selectedAddressLower = selectedAddresses[0].toLowerCase();
-      selectedAccount = accounts.find(
-        (acc) => acc.address.toLowerCase() === selectedAddressLower,
-      );
-    }
-
-    if (selectedAccount) {
-      // Find the item index for the selected account in flattened data
-      const selectedItemIndex = flattenedData.findIndex(
-        (item) =>
-          item.type === 'account' &&
-          areAddressesEqual(item.data.address, selectedAccount.address),
-      );
-
-      if (selectedItemIndex !== -1) {
-        // Use requestAnimationFrame to ensure smooth scrolling
-        requestAnimationFrame(() => {
-          accountListRef.current?.scrollToIndex({
-            index: selectedItemIndex,
-            animated: true,
-            viewPosition: 0.5, // Center the item in the view
-          });
-        });
-      }
-    }
-  }, [
-    accounts,
-    accountListRef,
-    selectedAddresses,
-    isAutoScrollEnabled,
-    flattenedData,
-  ]);
-
-  // Scroll to selected account when selection changes or on mount
-  useEffect(() => {
-    scrollToSelectedAccount();
-  }, [scrollToSelectedAccount]);
-
-  const renderItem: ListRenderItem<FlattenedAccountListItem> = useCallback(
-    ({ item }) => {
-      if (item.type === 'header') {
-        return renderSectionHeader(item.data);
-      }
-
-      if (item.type === 'footer') {
-        return renderSectionFooter();
-      }
-
-      // Render account item
-      const {
-        id,
-        name,
-        address,
-        assets,
-        type,
-        isSelected,
-        balanceError,
-        isLoadingAccount,
-      } = item.data;
-
-      const internalAccount = internalAccountsById[id];
-
-      const shortAddress = formatAddress(address, 'short');
-      const tagLabel = isMultichainAccountsState1Enabled
-        ? undefined
-        : getLabelTextByInternalAccount(internalAccount);
-      const ensName = ensByAccountAddress[address];
-      const accountName =
-        isDefaultAccountName(name) && ensName ? ensName : name;
-      const isDisabled = !!balanceError || isLoading || isSelectionDisabled;
-      let cellVariant = CellVariant.SelectWithMenu;
-
-      if (isMultiSelect) {
-        cellVariant = CellVariant.MultiSelect;
-      }
-      if (isSelectWithoutMenu) {
-        cellVariant = CellVariant.Select;
-      }
-      let isSelectedAccount = isSelected;
-      if (selectedAddressesLookup) {
-        isSelectedAccount = selectedAddressesLookup.has(
-          toFormattedAddress(address),
-        );
-      }
-
-      const cellStyle: ViewStyle = {
-        opacity: isLoading ? 0.5 : 1,
-      };
-      if (!isMultiSelect) {
-        cellStyle.alignItems = 'center';
-      }
-
-      const handleLongPress = () => {
-        onLongPress({
-          address,
-          isAccountRemoveable:
-            type === KeyringTypes.simple ||
-            (type === KeyringTypes.snap && !isSolanaAddress(address)),
-          isSelected: isSelectedAccount,
-          index: item.accountIndex,
-        });
-      };
-
-      const handlePress = () => {
-        onSelectAccount?.(address, isSelectedAccount);
-      };
-
-      const handleButtonClick = () => {
-        if (useMultichainAccountDesign) {
-          const account = internalAccount;
-
-          if (!account) return;
-
-          navigate(Routes.MULTICHAIN_ACCOUNTS.ACCOUNT_DETAILS, {
-            account,
-          });
-          return;
-        }
-
-        onNavigateToAccountActions(address);
-      };
-
-      const buttonProps = {
-        onButtonClick: handleButtonClick,
-        buttonTestId: WalletViewSelectorsIDs.ACCOUNT_ACTIONS,
-      };
-
-      const avatarProps = {
-        variant: AvatarVariant.Account as const,
-        type: accountAvatarType,
-        accountAddress: address,
-      };
-
-      return (
-        <Cell
-          onLongPress={handleLongPress}
-          variant={cellVariant}
-          isSelected={isSelectedAccount}
-          title={accountName}
-          titleProps={{
-            style: styles.titleText,
-          }}
-          secondaryText={shortAddress}
-          showSecondaryTextIcon={false}
-          tertiaryText={balanceError}
-          onPress={handlePress}
-          avatarProps={avatarProps}
-          tagLabel={tagLabel}
-          disabled={isDisabled}
-          style={cellStyle}
-          buttonProps={buttonProps}
-        >
-          {renderRightAccessory?.(address, accountName) ||
-            (assets &&
-              renderAccountBalances(assets, item.data, isLoadingAccount))}
-        </Cell>
-      );
-    },
-    [
-      ensByAccountAddress,
-      isLoading,
-      isSelectionDisabled,
-      isMultiSelect,
-      isSelectWithoutMenu,
-      selectedAddressesLookup,
-      accountAvatarType,
-      renderRightAccessory,
-      renderAccountBalances,
-      onLongPress,
-      onSelectAccount,
-      useMultichainAccountDesign,
-      onNavigateToAccountActions,
-      navigate,
-      styles.titleText,
-      isMultichainAccountsState1Enabled,
-      renderSectionHeader,
-      renderSectionFooter,
-      internalAccountsById,
-    ],
-  );
-
-  const onContentSizeChanged = useCallback(() => {
-    // Handle auto scroll to account
-    if (!accounts.length || !isAutoScrollEnabled) return;
-
-    if (accountsLengthRef.current !== accounts.length) {
-      let selectedAccount: Account | undefined;
-
-      if (selectedAddresses?.length) {
-        const selectedAddress = selectedAddresses[0];
-        selectedAccount = accounts.find((acc) =>
-          areAddressesEqual(acc.address, selectedAddress),
-        );
-      }
-
-      // Fall back to the account with isSelected flag if no override or match found
-      if (!selectedAccount) {
-        selectedAccount = accounts.find((acc) => acc.isSelected);
-      }
-
-      accountListRef.current?.scrollToOffset({
-        offset: selectedAccount?.yOffset || 0,
-        animated: false,
-      });
-
-      accountsLengthRef.current = accounts.length;
-    }
-  }, [accounts, accountListRef, selectedAddresses, isAutoScrollEnabled]);
-
-  return (
-    <View style={styles.listContainer}>
-      <FlashList
-        ref={accountListRef}
-        onContentSizeChange={onContentSizeChanged}
-        data={flattenedData}
-        keyExtractor={getKeyExtractor}
-        renderItem={renderItem}
-        getItemType={getItemType}
-        renderScrollComponent={
-          ScrollView as React.ComponentType<ScrollViewProps>
-        }
-        testID={ACCOUNT_SELECTOR_LIST_TESTID}
-        {...props}
-      />
-    </View>
-  );
-};
-
-export default React.memo(EvmAccountSelectorList);
diff --git a/app/components/UI/EvmAccountSelectorList/EvmAccountSelectorList.types.ts b/app/components/UI/EvmAccountSelectorList/EvmAccountSelectorList.types.ts
deleted file mode 100644
index ecd195a07e2e..000000000000
--- a/app/components/UI/EvmAccountSelectorList/EvmAccountSelectorList.types.ts
+++ /dev/null
@@ -1,86 +0,0 @@
-// Third party dependencies.
-import React from 'react';
-import { FlashListProps } from '@shopify/flash-list';
-
-// External dependencies
-import { Account, UseAccounts } from '../../hooks/useAccounts';
-import { AccountWalletObject } from '@metamask/account-tree-controller';
-
-type FlattenedAccountListItem =
-  | { type: 'header'; data: AccountSection; sectionIndex: number }
-  | {
-      type: 'account';
-      data: Account;
-      sectionIndex: number;
-      accountIndex: number;
-    }
-  | { type: 'footer'; data: AccountSection; sectionIndex: number };
-
-/**
- * EvmAccountSelectorList props.
- */
-export interface EvmAccountSelectorListProps
-  extends Partial<FlashListProps<FlattenedAccountListItem>>,
-    Omit<UseAccounts, 'evmAccounts'> {
-  /**
-   * Optional callback to trigger when account is selected.
-   */
-  onSelectAccount?: (address: string, isSelected: boolean) => void;
-  /**
-   * Optional callback to trigger when imported account is removed.
-   */
-  onRemoveImportedAccount?: (params: {
-    removedAddress: string;
-    nextActiveAddress: string;
-  }) => void;
-  /**
-   * Optional boolean that indicates if accounts are being processed in the background. The accounts will be unselectable as long as this is true.
-   * @default false
-   */
-  isLoading?: boolean;
-  /**
-   * Optional list of selected addresses that will be used to show selected accounts.
-   * Scenarios where this can be used includes temporarily showing one or more selected accounts.
-   * This is required for multi select to work since the list does not track selected accounts by itself.
-   */
-  selectedAddresses?: string[];
-  /**
-   * Optional boolean that indicates if list should be used as multi select.
-   */
-  isMultiSelect?: boolean;
-  /**
-   * Optional boolean that indicates if list should be used as select without menu.
-   */
-  isSelectWithoutMenu?: boolean;
-  /**
-   * Optional boolean that indicates if list should auto scroll to selected address.
-   */
-  isAutoScrollEnabled?: boolean;
-  /**
-   * Optional render function to replace the right accessory of each account element.
-   */
-  renderRightAccessory?: (
-    accountAddress: string,
-    accountName: string,
-  ) => React.ReactNode;
-  /**
-   * Optional boolean to disable selection of the account elements.
-   */
-  isSelectionDisabled?: boolean;
-  /**
-   * Optional boolean to enable removing accounts.
-   */
-  isRemoveAccountEnabled?: boolean;
-  /**
-   * Optional boolean to indicate if privacy mode is enabled.
-   */
-  privacyMode?: boolean;
-}
-
-export interface AccountSection {
-  title: string;
-  wallet?: AccountWalletObject;
-  data: Account[];
-}
-
-export type { FlattenedAccountListItem };
diff --git a/app/components/UI/EvmAccountSelectorList/__snapshots__/EvmAccountSelectorList.test.tsx.snap b/app/components/UI/EvmAccountSelectorList/__snapshots__/EvmAccountSelectorList.test.tsx.snap
deleted file mode 100644
index 99836a4ee7e9..000000000000
--- a/app/components/UI/EvmAccountSelectorList/__snapshots__/EvmAccountSelectorList.test.tsx.snap
+++ /dev/null
@@ -1,2213 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`EvmAccountSelectorList renders all accounts with balances 1`] = `
-<View
-  style={
-    {
-      "flexDirection": "row",
-      "flexGrow": 1,
-      "flexShrink": 1,
-    }
-  }
->
-  <View
-    collapsable={false}
-    onLayout={[Function]}
-    style={
-      {
-        "flex": 1,
-        "overflow": "hidden",
-      }
-    }
-  >
-    <RCTScrollView
-      collapsable={false}
-      getItemType={[Function]}
-      handlerTag={2}
-      handlerType="NativeViewGestureHandler"
-      keyExtractor={[Function]}
-      maintainVisibleContentPosition={
-        {
-          "minIndexForVisible": 0,
-        }
-      }
-      onContentSizeChange={[Function]}
-      onGestureHandlerEvent={[Function]}
-      onGestureHandlerStateChange={[Function]}
-      onScroll={[Function]}
-      testID="account-selector-list"
-    >
-      <View>
-        <View
-          style={
-            {
-              "height": 0,
-              "left": 0,
-              "position": "absolute",
-              "top": 1000000,
-            }
-          }
-        />
-        <View
-          style={
-            {
-              "height": 0,
-              "width": undefined,
-            }
-          }
-        />
-        <View
-          style={
-            {
-              "height": 0,
-              "marginLeft": undefined,
-              "marginTop": 0,
-              "opacity": 1,
-              "width": undefined,
-            }
-          }
-        >
-          <View
-            index={0}
-            onLayout={[Function]}
-            style={
-              {
-                "flexDirection": "column",
-                "height": undefined,
-                "left": 0,
-                "maxHeight": undefined,
-                "maxWidth": undefined,
-                "minHeight": undefined,
-                "minWidth": undefined,
-                "position": "absolute",
-                "top": 0,
-                "width": 0,
-              }
-            }
-          >
-            <View
-              style={
-                {
-                  "alignItems": "center",
-                  "backgroundColor": "#3c4d9d0f",
-                  "flexDirection": "row",
-                }
-              }
-            >
-              <TouchableOpacity
-                onLongPress={[Function]}
-                onPress={[Function]}
-                style={
-                  {
-                    "alignItems": "center",
-                    "flex": 1,
-                    "opacity": 1,
-                    "padding": 16,
-                    "position": "relative",
-                    "zIndex": 1,
-                  }
-                }
-                testID="select-with-menu"
-              >
-                <View
-                  accessibilityRole="none"
-                  accessible={true}
-                  style={
-                    {
-                      "alignItems": "flex-start",
-                      "flexDirection": "column",
-                      "padding": 16,
-                      "paddingBottom": 0,
-                      "paddingLeft": 0,
-                      "paddingRight": 0,
-                      "paddingTop": 0,
-                      "zIndex": 2,
-                    }
-                  }
-                >
-                  <View
-                    style={
-                      {
-                        "alignItems": "center",
-                        "flexDirection": "row",
-                      }
-                    }
-                  >
-                    <View
-                      style={
-                        {
-                          "alignItems": "center",
-                          "flexDirection": "row",
-                          "opacity": 1,
-                        }
-                      }
-                    >
-                      <View
-                        style={
-                          {
-                            "backgroundColor": "#ffffff",
-                            "borderRadius": 8,
-                            "height": 32,
-                            "marginRight": 16,
-                            "overflow": "hidden",
-                            "width": 32,
-                          }
-                        }
-                        testID="cellbase-avatar"
-                      >
-                        <View
-                          style={
-                            {
-                              "height": 32,
-                              "width": 32,
-                            }
-                          }
-                        />
-                      </View>
-                      <View
-                        style={
-                          {
-                            "alignItems": "flex-start",
-                            "flex": 1,
-                          }
-                        }
-                      >
-                        <Text
-                          accessibilityRole="text"
-                          numberOfLines={1}
-                          style={
-                            {
-                              "color": "#121314",
-                              "fontFamily": "Geist-Medium",
-                              "fontSize": 16,
-                              "fontWeight": "500",
-                              "letterSpacing": 0,
-                              "lineHeight": 24,
-                            }
-                          }
-                          testID="cellbase-avatar-title"
-                        >
-                          Account 1
-                        </Text>
-                        <View
-                          style={
-                            {
-                              "alignItems": "flex-start",
-                              "flexDirection": "row",
-                              "marginBottom": 0,
-                              "zIndex": 1,
-                            }
-                          }
-                        >
-                          <Text
-                            accessibilityRole="text"
-                            numberOfLines={1}
-                            style={
-                              {
-                                "color": "#686e7d",
-                                "fontFamily": "Geist-Regular",
-                                "fontSize": 16,
-                                "letterSpacing": 0,
-                                "lineHeight": 24,
-                              }
-                            }
-                          >
-                            0xC4955...4D272
-                          </Text>
-                        </View>
-                      </View>
-                      <View
-                        style={
-                          {
-                            "marginLeft": 16,
-                          }
-                        }
-                      >
-                        <View
-                          style={
-                            {
-                              "alignItems": "flex-end",
-                              "flexDirection": "column",
-                            }
-                          }
-                          testID="account-balance-by-address-0xC4955C0d639D99699Bfd7Ec54d9FaFEe40e4D272"
-                        >
-                          <Text
-                            accessibilityRole="text"
-                            style={
-                              {
-                                "color": "#121314",
-                                "fontFamily": "Geist-Medium",
-                                "fontSize": 16,
-                                "fontWeight": "500",
-                                "letterSpacing": 0,
-                                "lineHeight": 24,
-                                "textAlign": "right",
-                              }
-                            }
-                          >
-                            $3200.00
-                          </Text>
-                          <View
-                            style={
-                              {
-                                "marginTop": 4,
-                              }
-                            }
-                            testID="network-container"
-                          >
-                            <View
-                              style={
-                                {
-                                  "alignItems": "center",
-                                  "flexDirection": "row",
-                                }
-                              }
-                              testID="avatar-group-container"
-                            />
-                          </View>
-                        </View>
-                      </View>
-                    </View>
-                  </View>
-                </View>
-              </TouchableOpacity>
-              <View
-                style={
-                  {
-                    "paddingRight": 8,
-                  }
-                }
-              >
-                <TouchableOpacity
-                  accessibilityRole="button"
-                  accessible={true}
-                  activeOpacity={1}
-                  disabled={false}
-                  onPress={[Function]}
-                  onPressIn={[Function]}
-                  onPressOut={[Function]}
-                  style={
-                    {
-                      "alignItems": "center",
-                      "borderRadius": 8,
-                      "height": 28,
-                      "justifyContent": "center",
-                      "opacity": 1,
-                      "width": 28,
-                    }
-                  }
-                  testID="multichain-account-cell-menu"
-                >
-                  <SvgMock
-                    color="#121314"
-                    fill="currentColor"
-                    height={20}
-                    name="MoreVertical"
-                    style={
-                      {
-                        "height": 20,
-                        "width": 20,
-                      }
-                    }
-                    width={20}
-                  />
-                </TouchableOpacity>
-              </View>
-            </View>
-          </View>
-          <View
-            index={1}
-            onLayout={[Function]}
-            style={
-              {
-                "flexDirection": "column",
-                "height": undefined,
-                "left": 0,
-                "maxHeight": undefined,
-                "maxWidth": undefined,
-                "minHeight": undefined,
-                "minWidth": undefined,
-                "position": "absolute",
-                "top": 0,
-                "width": 0,
-              }
-            }
-          >
-            <View
-              style={
-                {
-                  "alignItems": "center",
-                  "backgroundColor": "#ffffff",
-                  "flexDirection": "row",
-                }
-              }
-            >
-              <TouchableOpacity
-                onLongPress={[Function]}
-                onPress={[Function]}
-                style={
-                  {
-                    "alignItems": "center",
-                    "flex": 1,
-                    "opacity": 1,
-                    "padding": 16,
-                    "position": "relative",
-                    "zIndex": 1,
-                  }
-                }
-                testID="select-with-menu"
-              >
-                <View
-                  accessibilityRole="none"
-                  accessible={true}
-                  style={
-                    {
-                      "alignItems": "flex-start",
-                      "flexDirection": "column",
-                      "padding": 16,
-                      "paddingBottom": 0,
-                      "paddingLeft": 0,
-                      "paddingRight": 0,
-                      "paddingTop": 0,
-                      "zIndex": 2,
-                    }
-                  }
-                >
-                  <View
-                    style={
-                      {
-                        "alignItems": "center",
-                        "flexDirection": "row",
-                      }
-                    }
-                  >
-                    <View
-                      style={
-                        {
-                          "alignItems": "center",
-                          "flexDirection": "row",
-                          "opacity": 1,
-                        }
-                      }
-                    >
-                      <View
-                        style={
-                          {
-                            "backgroundColor": "#ffffff",
-                            "borderRadius": 8,
-                            "height": 32,
-                            "marginRight": 16,
-                            "overflow": "hidden",
-                            "width": 32,
-                          }
-                        }
-                        testID="cellbase-avatar"
-                      >
-                        <View
-                          style={
-                            {
-                              "height": 32,
-                              "width": 32,
-                            }
-                          }
-                        />
-                      </View>
-                      <View
-                        style={
-                          {
-                            "alignItems": "flex-start",
-                            "flex": 1,
-                          }
-                        }
-                      >
-                        <Text
-                          accessibilityRole="text"
-                          numberOfLines={1}
-                          style={
-                            {
-                              "color": "#121314",
-                              "fontFamily": "Geist-Medium",
-                              "fontSize": 16,
-                              "fontWeight": "500",
-                              "letterSpacing": 0,
-                              "lineHeight": 24,
-                            }
-                          }
-                          testID="cellbase-avatar-title"
-                        >
-                          Account 2
-                        </Text>
-                        <View
-                          style={
-                            {
-                              "alignItems": "flex-start",
-                              "flexDirection": "row",
-                              "marginBottom": 0,
-                              "zIndex": 1,
-                            }
-                          }
-                        >
-                          <Text
-                            accessibilityRole="text"
-                            numberOfLines={1}
-                            style={
-                              {
-                                "color": "#686e7d",
-                                "fontFamily": "Geist-Regular",
-                                "fontSize": 16,
-                                "letterSpacing": 0,
-                                "lineHeight": 24,
-                              }
-                            }
-                          >
-                            0xd0185...a78E7
-                          </Text>
-                        </View>
-                      </View>
-                      <View
-                        style={
-                          {
-                            "marginLeft": 16,
-                          }
-                        }
-                      >
-                        <View
-                          style={
-                            {
-                              "alignItems": "flex-end",
-                              "flexDirection": "column",
-                            }
-                          }
-                          testID="account-balance-by-address-0xd018538C87232FF95acbCe4870629b75640a78E7"
-                        >
-                          <Text
-                            accessibilityRole="text"
-                            style={
-                              {
-                                "color": "#121314",
-                                "fontFamily": "Geist-Medium",
-                                "fontSize": 16,
-                                "fontWeight": "500",
-                                "letterSpacing": 0,
-                                "lineHeight": 24,
-                                "textAlign": "right",
-                              }
-                            }
-                          >
-                            $6400.00
-                          </Text>
-                          <View
-                            style={
-                              {
-                                "marginTop": 4,
-                              }
-                            }
-                            testID="network-container"
-                          >
-                            <View
-                              style={
-                                {
-                                  "alignItems": "center",
-                                  "flexDirection": "row",
-                                }
-                              }
-                              testID="avatar-group-container"
-                            />
-                          </View>
-                        </View>
-                      </View>
-                    </View>
-                  </View>
-                </View>
-              </TouchableOpacity>
-              <View
-                style={
-                  {
-                    "paddingRight": 8,
-                  }
-                }
-              >
-                <TouchableOpacity
-                  accessibilityRole="button"
-                  accessible={true}
-                  activeOpacity={1}
-                  disabled={false}
-                  onPress={[Function]}
-                  onPressIn={[Function]}
-                  onPressOut={[Function]}
-                  style={
-                    {
-                      "alignItems": "center",
-                      "borderRadius": 8,
-                      "height": 28,
-                      "justifyContent": "center",
-                      "opacity": 1,
-                      "width": 28,
-                    }
-                  }
-                  testID="multichain-account-cell-menu"
-                >
-                  <SvgMock
-                    color="#121314"
-                    fill="currentColor"
-                    height={20}
-                    name="MoreVertical"
-                    style={
-                      {
-                        "height": 20,
-                        "width": 20,
-                      }
-                    }
-                    width={20}
-                  />
-                </TouchableOpacity>
-              </View>
-            </View>
-          </View>
-        </View>
-      </View>
-    </RCTScrollView>
-  </View>
-</View>
-`;
-
-exports[`EvmAccountSelectorList renders all accounts with right accessory 1`] = `
-<View
-  style={
-    {
-      "flexDirection": "row",
-      "flexGrow": 1,
-      "flexShrink": 1,
-    }
-  }
->
-  <View
-    collapsable={false}
-    onLayout={[Function]}
-    style={
-      {
-        "flex": 1,
-        "overflow": "hidden",
-      }
-    }
-  >
-    <RCTScrollView
-      collapsable={false}
-      getItemType={[Function]}
-      handlerTag={3}
-      handlerType="NativeViewGestureHandler"
-      keyExtractor={[Function]}
-      maintainVisibleContentPosition={
-        {
-          "minIndexForVisible": 0,
-        }
-      }
-      onContentSizeChange={[Function]}
-      onGestureHandlerEvent={[Function]}
-      onGestureHandlerStateChange={[Function]}
-      onScroll={[Function]}
-      testID="account-selector-list"
-    >
-      <View>
-        <View
-          style={
-            {
-              "height": 0,
-              "left": 0,
-              "position": "absolute",
-              "top": 1000000,
-            }
-          }
-        />
-        <View
-          style={
-            {
-              "height": 0,
-              "width": undefined,
-            }
-          }
-        />
-        <View
-          style={
-            {
-              "height": 0,
-              "marginLeft": undefined,
-              "marginTop": 0,
-              "opacity": 1,
-              "width": undefined,
-            }
-          }
-        >
-          <View
-            index={0}
-            onLayout={[Function]}
-            style={
-              {
-                "flexDirection": "column",
-                "height": undefined,
-                "left": 0,
-                "maxHeight": undefined,
-                "maxWidth": undefined,
-                "minHeight": undefined,
-                "minWidth": undefined,
-                "position": "absolute",
-                "top": 0,
-                "width": 0,
-              }
-            }
-          >
-            <View
-              style={
-                {
-                  "alignItems": "center",
-                  "backgroundColor": "#3c4d9d0f",
-                  "flexDirection": "row",
-                }
-              }
-            >
-              <TouchableOpacity
-                disabled={true}
-                onLongPress={[Function]}
-                onPress={[Function]}
-                style={
-                  {
-                    "alignItems": "center",
-                    "flex": 1,
-                    "opacity": 1,
-                    "padding": 16,
-                    "position": "relative",
-                    "zIndex": 1,
-                  }
-                }
-                testID="select-with-menu"
-              >
-                <View
-                  accessibilityRole="none"
-                  accessible={true}
-                  style={
-                    {
-                      "alignItems": "flex-start",
-                      "flexDirection": "column",
-                      "padding": 16,
-                      "paddingBottom": 0,
-                      "paddingLeft": 0,
-                      "paddingRight": 0,
-                      "paddingTop": 0,
-                      "zIndex": 2,
-                    }
-                  }
-                >
-                  <View
-                    style={
-                      {
-                        "alignItems": "center",
-                        "flexDirection": "row",
-                      }
-                    }
-                  >
-                    <View
-                      style={
-                        {
-                          "alignItems": "center",
-                          "flexDirection": "row",
-                          "opacity": 1,
-                        }
-                      }
-                    >
-                      <View
-                        style={
-                          {
-                            "backgroundColor": "#ffffff",
-                            "borderRadius": 8,
-                            "height": 32,
-                            "marginRight": 16,
-                            "overflow": "hidden",
-                            "width": 32,
-                          }
-                        }
-                        testID="cellbase-avatar"
-                      >
-                        <View
-                          style={
-                            {
-                              "height": 32,
-                              "width": 32,
-                            }
-                          }
-                        />
-                      </View>
-                      <View
-                        style={
-                          {
-                            "alignItems": "flex-start",
-                            "flex": 1,
-                          }
-                        }
-                      >
-                        <Text
-                          accessibilityRole="text"
-                          numberOfLines={1}
-                          style={
-                            {
-                              "color": "#121314",
-                              "fontFamily": "Geist-Medium",
-                              "fontSize": 16,
-                              "fontWeight": "500",
-                              "letterSpacing": 0,
-                              "lineHeight": 24,
-                            }
-                          }
-                          testID="cellbase-avatar-title"
-                        >
-                          Account 1
-                        </Text>
-                        <View
-                          style={
-                            {
-                              "alignItems": "flex-start",
-                              "flexDirection": "row",
-                              "marginBottom": 0,
-                              "zIndex": 1,
-                            }
-                          }
-                        >
-                          <Text
-                            accessibilityRole="text"
-                            numberOfLines={1}
-                            style={
-                              {
-                                "color": "#686e7d",
-                                "fontFamily": "Geist-Regular",
-                                "fontSize": 16,
-                                "letterSpacing": 0,
-                                "lineHeight": 24,
-                              }
-                            }
-                          >
-                            0xC4955...4D272
-                          </Text>
-                        </View>
-                      </View>
-                      <View
-                        style={
-                          {
-                            "marginLeft": 16,
-                          }
-                        }
-                      >
-                        <View
-                          testID="right-accessory"
-                        >
-                          0xC4955C0d639D99699Bfd7Ec54d9FaFEe40e4D272 - Account 1
-                        </View>
-                      </View>
-                    </View>
-                  </View>
-                </View>
-              </TouchableOpacity>
-              <View
-                style={
-                  {
-                    "paddingRight": 8,
-                  }
-                }
-              >
-                <TouchableOpacity
-                  accessibilityRole="button"
-                  accessible={true}
-                  activeOpacity={1}
-                  disabled={false}
-                  onPress={[Function]}
-                  onPressIn={[Function]}
-                  onPressOut={[Function]}
-                  style={
-                    {
-                      "alignItems": "center",
-                      "borderRadius": 8,
-                      "height": 28,
-                      "justifyContent": "center",
-                      "opacity": 1,
-                      "width": 28,
-                    }
-                  }
-                  testID="multichain-account-cell-menu"
-                >
-                  <SvgMock
-                    color="#121314"
-                    fill="currentColor"
-                    height={20}
-                    name="MoreVertical"
-                    style={
-                      {
-                        "height": 20,
-                        "width": 20,
-                      }
-                    }
-                    width={20}
-                  />
-                </TouchableOpacity>
-              </View>
-            </View>
-          </View>
-          <View
-            index={1}
-            onLayout={[Function]}
-            style={
-              {
-                "flexDirection": "column",
-                "height": undefined,
-                "left": 0,
-                "maxHeight": undefined,
-                "maxWidth": undefined,
-                "minHeight": undefined,
-                "minWidth": undefined,
-                "position": "absolute",
-                "top": 0,
-                "width": 0,
-              }
-            }
-          >
-            <View
-              style={
-                {
-                  "alignItems": "center",
-                  "backgroundColor": "#ffffff",
-                  "flexDirection": "row",
-                }
-              }
-            >
-              <TouchableOpacity
-                disabled={true}
-                onLongPress={[Function]}
-                onPress={[Function]}
-                style={
-                  {
-                    "alignItems": "center",
-                    "flex": 1,
-                    "opacity": 1,
-                    "padding": 16,
-                    "position": "relative",
-                    "zIndex": 1,
-                  }
-                }
-                testID="select-with-menu"
-              >
-                <View
-                  accessibilityRole="none"
-                  accessible={true}
-                  style={
-                    {
-                      "alignItems": "flex-start",
-                      "flexDirection": "column",
-                      "padding": 16,
-                      "paddingBottom": 0,
-                      "paddingLeft": 0,
-                      "paddingRight": 0,
-                      "paddingTop": 0,
-                      "zIndex": 2,
-                    }
-                  }
-                >
-                  <View
-                    style={
-                      {
-                        "alignItems": "center",
-                        "flexDirection": "row",
-                      }
-                    }
-                  >
-                    <View
-                      style={
-                        {
-                          "alignItems": "center",
-                          "flexDirection": "row",
-                          "opacity": 1,
-                        }
-                      }
-                    >
-                      <View
-                        style={
-                          {
-                            "backgroundColor": "#ffffff",
-                            "borderRadius": 8,
-                            "height": 32,
-                            "marginRight": 16,
-                            "overflow": "hidden",
-                            "width": 32,
-                          }
-                        }
-                        testID="cellbase-avatar"
-                      >
-                        <View
-                          style={
-                            {
-                              "height": 32,
-                              "width": 32,
-                            }
-                          }
-                        />
-                      </View>
-                      <View
-                        style={
-                          {
-                            "alignItems": "flex-start",
-                            "flex": 1,
-                          }
-                        }
-                      >
-                        <Text
-                          accessibilityRole="text"
-                          numberOfLines={1}
-                          style={
-                            {
-                              "color": "#121314",
-                              "fontFamily": "Geist-Medium",
-                              "fontSize": 16,
-                              "fontWeight": "500",
-                              "letterSpacing": 0,
-                              "lineHeight": 24,
-                            }
-                          }
-                          testID="cellbase-avatar-title"
-                        >
-                          Account 2
-                        </Text>
-                        <View
-                          style={
-                            {
-                              "alignItems": "flex-start",
-                              "flexDirection": "row",
-                              "marginBottom": 0,
-                              "zIndex": 1,
-                            }
-                          }
-                        >
-                          <Text
-                            accessibilityRole="text"
-                            numberOfLines={1}
-                            style={
-                              {
-                                "color": "#686e7d",
-                                "fontFamily": "Geist-Regular",
-                                "fontSize": 16,
-                                "letterSpacing": 0,
-                                "lineHeight": 24,
-                              }
-                            }
-                          >
-                            0xd0185...a78E7
-                          </Text>
-                        </View>
-                      </View>
-                      <View
-                        style={
-                          {
-                            "marginLeft": 16,
-                          }
-                        }
-                      >
-                        <View
-                          testID="right-accessory"
-                        >
-                          0xd018538C87232FF95acbCe4870629b75640a78E7 - Account 2
-                        </View>
-                      </View>
-                    </View>
-                  </View>
-                </View>
-              </TouchableOpacity>
-              <View
-                style={
-                  {
-                    "paddingRight": 8,
-                  }
-                }
-              >
-                <TouchableOpacity
-                  accessibilityRole="button"
-                  accessible={true}
-                  activeOpacity={1}
-                  disabled={false}
-                  onPress={[Function]}
-                  onPressIn={[Function]}
-                  onPressOut={[Function]}
-                  style={
-                    {
-                      "alignItems": "center",
-                      "borderRadius": 8,
-                      "height": 28,
-                      "justifyContent": "center",
-                      "opacity": 1,
-                      "width": 28,
-                    }
-                  }
-                  testID="multichain-account-cell-menu"
-                >
-                  <SvgMock
-                    color="#121314"
-                    fill="currentColor"
-                    height={20}
-                    name="MoreVertical"
-                    style={
-                      {
-                        "height": 20,
-                        "width": 20,
-                      }
-                    }
-                    width={20}
-                  />
-                </TouchableOpacity>
-              </View>
-            </View>
-          </View>
-        </View>
-      </View>
-    </RCTScrollView>
-  </View>
-</View>
-`;
-
-exports[`EvmAccountSelectorList renders correctly 1`] = `
-<View
-  style={
-    {
-      "flexDirection": "row",
-      "flexGrow": 1,
-      "flexShrink": 1,
-    }
-  }
->
-  <View
-    collapsable={false}
-    onLayout={[Function]}
-    style={
-      {
-        "flex": 1,
-        "overflow": "hidden",
-      }
-    }
-  >
-    <RCTScrollView
-      collapsable={false}
-      getItemType={[Function]}
-      handlerTag={1}
-      handlerType="NativeViewGestureHandler"
-      keyExtractor={[Function]}
-      maintainVisibleContentPosition={
-        {
-          "minIndexForVisible": 0,
-        }
-      }
-      onContentSizeChange={[Function]}
-      onGestureHandlerEvent={[Function]}
-      onGestureHandlerStateChange={[Function]}
-      onScroll={[Function]}
-      testID="account-selector-list"
-    >
-      <View>
-        <View
-          style={
-            {
-              "height": 0,
-              "left": 0,
-              "position": "absolute",
-              "top": 1000000,
-            }
-          }
-        />
-        <View
-          style={
-            {
-              "height": 0,
-              "width": undefined,
-            }
-          }
-        />
-        <View
-          style={
-            {
-              "height": 0,
-              "marginLeft": undefined,
-              "marginTop": 0,
-              "opacity": 1,
-              "width": undefined,
-            }
-          }
-        >
-          <View
-            index={0}
-            onLayout={[Function]}
-            style={
-              {
-                "flexDirection": "column",
-                "height": undefined,
-                "left": 0,
-                "maxHeight": undefined,
-                "maxWidth": undefined,
-                "minHeight": undefined,
-                "minWidth": undefined,
-                "position": "absolute",
-                "top": 0,
-                "width": 0,
-              }
-            }
-          >
-            <View
-              style={
-                {
-                  "alignItems": "center",
-                  "backgroundColor": "#3c4d9d0f",
-                  "flexDirection": "row",
-                }
-              }
-            >
-              <TouchableOpacity
-                onLongPress={[Function]}
-                onPress={[Function]}
-                style={
-                  {
-                    "alignItems": "center",
-                    "flex": 1,
-                    "opacity": 1,
-                    "padding": 16,
-                    "position": "relative",
-                    "zIndex": 1,
-                  }
-                }
-                testID="select-with-menu"
-              >
-                <View
-                  accessibilityRole="none"
-                  accessible={true}
-                  style={
-                    {
-                      "alignItems": "flex-start",
-                      "flexDirection": "column",
-                      "padding": 16,
-                      "paddingBottom": 0,
-                      "paddingLeft": 0,
-                      "paddingRight": 0,
-                      "paddingTop": 0,
-                      "zIndex": 2,
-                    }
-                  }
-                >
-                  <View
-                    style={
-                      {
-                        "alignItems": "center",
-                        "flexDirection": "row",
-                      }
-                    }
-                  >
-                    <View
-                      style={
-                        {
-                          "alignItems": "center",
-                          "flexDirection": "row",
-                          "opacity": 1,
-                        }
-                      }
-                    >
-                      <View
-                        style={
-                          {
-                            "backgroundColor": "#ffffff",
-                            "borderRadius": 8,
-                            "height": 32,
-                            "marginRight": 16,
-                            "overflow": "hidden",
-                            "width": 32,
-                          }
-                        }
-                        testID="cellbase-avatar"
-                      >
-                        <View
-                          style={
-                            {
-                              "height": 32,
-                              "width": 32,
-                            }
-                          }
-                        />
-                      </View>
-                      <View
-                        style={
-                          {
-                            "alignItems": "flex-start",
-                            "flex": 1,
-                          }
-                        }
-                      >
-                        <Text
-                          accessibilityRole="text"
-                          numberOfLines={1}
-                          style={
-                            {
-                              "color": "#121314",
-                              "fontFamily": "Geist-Medium",
-                              "fontSize": 16,
-                              "fontWeight": "500",
-                              "letterSpacing": 0,
-                              "lineHeight": 24,
-                            }
-                          }
-                          testID="cellbase-avatar-title"
-                        >
-                          Account 1
-                        </Text>
-                        <View
-                          style={
-                            {
-                              "alignItems": "flex-start",
-                              "flexDirection": "row",
-                              "marginBottom": 0,
-                              "zIndex": 1,
-                            }
-                          }
-                        >
-                          <Text
-                            accessibilityRole="text"
-                            numberOfLines={1}
-                            style={
-                              {
-                                "color": "#686e7d",
-                                "fontFamily": "Geist-Regular",
-                                "fontSize": 16,
-                                "letterSpacing": 0,
-                                "lineHeight": 24,
-                              }
-                            }
-                          >
-                            0xC4955...4D272
-                          </Text>
-                        </View>
-                      </View>
-                      <View
-                        style={
-                          {
-                            "marginLeft": 16,
-                          }
-                        }
-                      >
-                        <View
-                          style={
-                            {
-                              "alignItems": "flex-end",
-                              "flexDirection": "column",
-                            }
-                          }
-                          testID="account-balance-by-address-0xC4955C0d639D99699Bfd7Ec54d9FaFEe40e4D272"
-                        >
-                          <Text
-                            accessibilityRole="text"
-                            style={
-                              {
-                                "color": "#121314",
-                                "fontFamily": "Geist-Medium",
-                                "fontSize": 16,
-                                "fontWeight": "500",
-                                "letterSpacing": 0,
-                                "lineHeight": 24,
-                                "textAlign": "right",
-                              }
-                            }
-                          >
-                            $3200.00
-                          </Text>
-                          <View
-                            style={
-                              {
-                                "marginTop": 4,
-                              }
-                            }
-                            testID="network-container"
-                          >
-                            <View
-                              style={
-                                {
-                                  "alignItems": "center",
-                                  "flexDirection": "row",
-                                }
-                              }
-                              testID="avatar-group-container"
-                            />
-                          </View>
-                        </View>
-                      </View>
-                    </View>
-                  </View>
-                </View>
-              </TouchableOpacity>
-              <View
-                style={
-                  {
-                    "paddingRight": 8,
-                  }
-                }
-              >
-                <TouchableOpacity
-                  accessibilityRole="button"
-                  accessible={true}
-                  activeOpacity={1}
-                  disabled={false}
-                  onPress={[Function]}
-                  onPressIn={[Function]}
-                  onPressOut={[Function]}
-                  style={
-                    {
-                      "alignItems": "center",
-                      "borderRadius": 8,
-                      "height": 28,
-                      "justifyContent": "center",
-                      "opacity": 1,
-                      "width": 28,
-                    }
-                  }
-                  testID="multichain-account-cell-menu"
-                >
-                  <SvgMock
-                    color="#121314"
-                    fill="currentColor"
-                    height={20}
-                    name="MoreVertical"
-                    style={
-                      {
-                        "height": 20,
-                        "width": 20,
-                      }
-                    }
-                    width={20}
-                  />
-                </TouchableOpacity>
-              </View>
-            </View>
-          </View>
-          <View
-            index={1}
-            onLayout={[Function]}
-            style={
-              {
-                "flexDirection": "column",
-                "height": undefined,
-                "left": 0,
-                "maxHeight": undefined,
-                "maxWidth": undefined,
-                "minHeight": undefined,
-                "minWidth": undefined,
-                "position": "absolute",
-                "top": 0,
-                "width": 0,
-              }
-            }
-          >
-            <View
-              style={
-                {
-                  "alignItems": "center",
-                  "backgroundColor": "#ffffff",
-                  "flexDirection": "row",
-                }
-              }
-            >
-              <TouchableOpacity
-                onLongPress={[Function]}
-                onPress={[Function]}
-                style={
-                  {
-                    "alignItems": "center",
-                    "flex": 1,
-                    "opacity": 1,
-                    "padding": 16,
-                    "position": "relative",
-                    "zIndex": 1,
-                  }
-                }
-                testID="select-with-menu"
-              >
-                <View
-                  accessibilityRole="none"
-                  accessible={true}
-                  style={
-                    {
-                      "alignItems": "flex-start",
-                      "flexDirection": "column",
-                      "padding": 16,
-                      "paddingBottom": 0,
-                      "paddingLeft": 0,
-                      "paddingRight": 0,
-                      "paddingTop": 0,
-                      "zIndex": 2,
-                    }
-                  }
-                >
-                  <View
-                    style={
-                      {
-                        "alignItems": "center",
-                        "flexDirection": "row",
-                      }
-                    }
-                  >
-                    <View
-                      style={
-                        {
-                          "alignItems": "center",
-                          "flexDirection": "row",
-                          "opacity": 1,
-                        }
-                      }
-                    >
-                      <View
-                        style={
-                          {
-                            "backgroundColor": "#ffffff",
-                            "borderRadius": 8,
-                            "height": 32,
-                            "marginRight": 16,
-                            "overflow": "hidden",
-                            "width": 32,
-                          }
-                        }
-                        testID="cellbase-avatar"
-                      >
-                        <View
-                          style={
-                            {
-                              "height": 32,
-                              "width": 32,
-                            }
-                          }
-                        />
-                      </View>
-                      <View
-                        style={
-                          {
-                            "alignItems": "flex-start",
-                            "flex": 1,
-                          }
-                        }
-                      >
-                        <Text
-                          accessibilityRole="text"
-                          numberOfLines={1}
-                          style={
-                            {
-                              "color": "#121314",
-                              "fontFamily": "Geist-Medium",
-                              "fontSize": 16,
-                              "fontWeight": "500",
-                              "letterSpacing": 0,
-                              "lineHeight": 24,
-                            }
-                          }
-                          testID="cellbase-avatar-title"
-                        >
-                          Account 2
-                        </Text>
-                        <View
-                          style={
-                            {
-                              "alignItems": "flex-start",
-                              "flexDirection": "row",
-                              "marginBottom": 0,
-                              "zIndex": 1,
-                            }
-                          }
-                        >
-                          <Text
-                            accessibilityRole="text"
-                            numberOfLines={1}
-                            style={
-                              {
-                                "color": "#686e7d",
-                                "fontFamily": "Geist-Regular",
-                                "fontSize": 16,
-                                "letterSpacing": 0,
-                                "lineHeight": 24,
-                              }
-                            }
-                          >
-                            0xd0185...a78E7
-                          </Text>
-                        </View>
-                      </View>
-                      <View
-                        style={
-                          {
-                            "marginLeft": 16,
-                          }
-                        }
-                      >
-                        <View
-                          style={
-                            {
-                              "alignItems": "flex-end",
-                              "flexDirection": "column",
-                            }
-                          }
-                          testID="account-balance-by-address-0xd018538C87232FF95acbCe4870629b75640a78E7"
-                        >
-                          <Text
-                            accessibilityRole="text"
-                            style={
-                              {
-                                "color": "#121314",
-                                "fontFamily": "Geist-Medium",
-                                "fontSize": 16,
-                                "fontWeight": "500",
-                                "letterSpacing": 0,
-                                "lineHeight": 24,
-                                "textAlign": "right",
-                              }
-                            }
-                          >
-                            $6400.00
-                          </Text>
-                          <View
-                            style={
-                              {
-                                "marginTop": 4,
-                              }
-                            }
-                            testID="network-container"
-                          >
-                            <View
-                              style={
-                                {
-                                  "alignItems": "center",
-                                  "flexDirection": "row",
-                                }
-                              }
-                              testID="avatar-group-container"
-                            />
-                          </View>
-                        </View>
-                      </View>
-                    </View>
-                  </View>
-                </View>
-              </TouchableOpacity>
-              <View
-                style={
-                  {
-                    "paddingRight": 8,
-                  }
-                }
-              >
-                <TouchableOpacity
-                  accessibilityRole="button"
-                  accessible={true}
-                  activeOpacity={1}
-                  disabled={false}
-                  onPress={[Function]}
-                  onPressIn={[Function]}
-                  onPressOut={[Function]}
-                  style={
-                    {
-                      "alignItems": "center",
-                      "borderRadius": 8,
-                      "height": 28,
-                      "justifyContent": "center",
-                      "opacity": 1,
-                      "width": 28,
-                    }
-                  }
-                  testID="multichain-account-cell-menu"
-                >
-                  <SvgMock
-                    color="#121314"
-                    fill="currentColor"
-                    height={20}
-                    name="MoreVertical"
-                    style={
-                      {
-                        "height": 20,
-                        "width": 20,
-                      }
-                    }
-                    width={20}
-                  />
-                </TouchableOpacity>
-              </View>
-            </View>
-          </View>
-        </View>
-      </View>
-    </RCTScrollView>
-  </View>
-</View>
-`;
-
-exports[`EvmAccountSelectorList renders network icons for accounts with transaction activity 1`] = `
-<View
-  style={
-    {
-      "flexDirection": "row",
-      "flexGrow": 1,
-      "flexShrink": 1,
-    }
-  }
->
-  <View
-    collapsable={false}
-    onLayout={[Function]}
-    style={
-      {
-        "flex": 1,
-        "overflow": "hidden",
-      }
-    }
-  >
-    <RCTScrollView
-      collapsable={false}
-      getItemType={[Function]}
-      handlerTag={24}
-      handlerType="NativeViewGestureHandler"
-      keyExtractor={[Function]}
-      maintainVisibleContentPosition={
-        {
-          "minIndexForVisible": 0,
-        }
-      }
-      onContentSizeChange={[Function]}
-      onGestureHandlerEvent={[Function]}
-      onGestureHandlerStateChange={[Function]}
-      onScroll={[Function]}
-      testID="account-selector-list"
-    >
-      <View>
-        <View
-          style={
-            {
-              "height": 0,
-              "left": 0,
-              "position": "absolute",
-              "top": 1000000,
-            }
-          }
-        />
-        <View
-          style={
-            {
-              "height": 0,
-              "width": undefined,
-            }
-          }
-        />
-        <View
-          style={
-            {
-              "height": 0,
-              "marginLeft": undefined,
-              "marginTop": 0,
-              "opacity": 1,
-              "width": undefined,
-            }
-          }
-        >
-          <View
-            index={0}
-            onLayout={[Function]}
-            style={
-              {
-                "flexDirection": "column",
-                "height": undefined,
-                "left": 0,
-                "maxHeight": undefined,
-                "maxWidth": undefined,
-                "minHeight": undefined,
-                "minWidth": undefined,
-                "position": "absolute",
-                "top": 0,
-                "width": 0,
-              }
-            }
-          >
-            <View
-              style={
-                {
-                  "alignItems": "center",
-                  "backgroundColor": "#3c4d9d0f",
-                  "flexDirection": "row",
-                }
-              }
-            >
-              <TouchableOpacity
-                onLongPress={[Function]}
-                onPress={[Function]}
-                style={
-                  {
-                    "alignItems": "center",
-                    "flex": 1,
-                    "opacity": 1,
-                    "padding": 16,
-                    "position": "relative",
-                    "zIndex": 1,
-                  }
-                }
-                testID="select-with-menu"
-              >
-                <View
-                  accessibilityRole="none"
-                  accessible={true}
-                  style={
-                    {
-                      "alignItems": "flex-start",
-                      "flexDirection": "column",
-                      "padding": 16,
-                      "paddingBottom": 0,
-                      "paddingLeft": 0,
-                      "paddingRight": 0,
-                      "paddingTop": 0,
-                      "zIndex": 2,
-                    }
-                  }
-                >
-                  <View
-                    style={
-                      {
-                        "alignItems": "center",
-                        "flexDirection": "row",
-                      }
-                    }
-                  >
-                    <View
-                      style={
-                        {
-                          "alignItems": "center",
-                          "flexDirection": "row",
-                          "opacity": 1,
-                        }
-                      }
-                    >
-                      <View
-                        style={
-                          {
-                            "backgroundColor": "#ffffff",
-                            "borderRadius": 8,
-                            "height": 32,
-                            "marginRight": 16,
-                            "overflow": "hidden",
-                            "width": 32,
-                          }
-                        }
-                        testID="cellbase-avatar"
-                      >
-                        <View
-                          style={
-                            {
-                              "height": 32,
-                              "width": 32,
-                            }
-                          }
-                        />
-                      </View>
-                      <View
-                        style={
-                          {
-                            "alignItems": "flex-start",
-                            "flex": 1,
-                          }
-                        }
-                      >
-                        <Text
-                          accessibilityRole="text"
-                          numberOfLines={1}
-                          style={
-                            {
-                              "color": "#121314",
-                              "fontFamily": "Geist-Medium",
-                              "fontSize": 16,
-                              "fontWeight": "500",
-                              "letterSpacing": 0,
-                              "lineHeight": 24,
-                            }
-                          }
-                          testID="cellbase-avatar-title"
-                        >
-                          Account 1
-                        </Text>
-                        <View
-                          style={
-                            {
-                              "alignItems": "flex-start",
-                              "flexDirection": "row",
-                              "marginBottom": 0,
-                              "zIndex": 1,
-                            }
-                          }
-                        >
-                          <Text
-                            accessibilityRole="text"
-                            numberOfLines={1}
-                            style={
-                              {
-                                "color": "#686e7d",
-                                "fontFamily": "Geist-Regular",
-                                "fontSize": 16,
-                                "letterSpacing": 0,
-                                "lineHeight": 24,
-                              }
-                            }
-                          >
-                            0xC4955...4D272
-                          </Text>
-                        </View>
-                      </View>
-                      <View
-                        style={
-                          {
-                            "marginLeft": 16,
-                          }
-                        }
-                      >
-                        <View
-                          style={
-                            {
-                              "alignItems": "flex-end",
-                              "flexDirection": "column",
-                            }
-                          }
-                          testID="account-balance-by-address-0xC4955C0d639D99699Bfd7Ec54d9FaFEe40e4D272"
-                        >
-                          <Text
-                            accessibilityRole="text"
-                            style={
-                              {
-                                "color": "#121314",
-                                "fontFamily": "Geist-Medium",
-                                "fontSize": 16,
-                                "fontWeight": "500",
-                                "letterSpacing": 0,
-                                "lineHeight": 24,
-                                "textAlign": "right",
-                              }
-                            }
-                          >
-                            $3200.00
-                          </Text>
-                          <View
-                            style={
-                              {
-                                "marginTop": 4,
-                              }
-                            }
-                            testID="network-container"
-                          >
-                            <View
-                              style={
-                                {
-                                  "alignItems": "center",
-                                  "flexDirection": "row",
-                                }
-                              }
-                              testID="avatar-group-container"
-                            />
-                          </View>
-                        </View>
-                      </View>
-                    </View>
-                  </View>
-                </View>
-              </TouchableOpacity>
-              <View
-                style={
-                  {
-                    "paddingRight": 8,
-                  }
-                }
-              >
-                <TouchableOpacity
-                  accessibilityRole="button"
-                  accessible={true}
-                  activeOpacity={1}
-                  disabled={false}
-                  onPress={[Function]}
-                  onPressIn={[Function]}
-                  onPressOut={[Function]}
-                  style={
-                    {
-                      "alignItems": "center",
-                      "borderRadius": 8,
-                      "height": 28,
-                      "justifyContent": "center",
-                      "opacity": 1,
-                      "width": 28,
-                    }
-                  }
-                  testID="multichain-account-cell-menu"
-                >
-                  <SvgMock
-                    color="#121314"
-                    fill="currentColor"
-                    height={20}
-                    name="MoreVertical"
-                    style={
-                      {
-                        "height": 20,
-                        "width": 20,
-                      }
-                    }
-                    width={20}
-                  />
-                </TouchableOpacity>
-              </View>
-            </View>
-          </View>
-          <View
-            index={1}
-            onLayout={[Function]}
-            style={
-              {
-                "flexDirection": "column",
-                "height": undefined,
-                "left": 0,
-                "maxHeight": undefined,
-                "maxWidth": undefined,
-                "minHeight": undefined,
-                "minWidth": undefined,
-                "position": "absolute",
-                "top": 0,
-                "width": 0,
-              }
-            }
-          >
-            <View
-              style={
-                {
-                  "alignItems": "center",
-                  "backgroundColor": "#ffffff",
-                  "flexDirection": "row",
-                }
-              }
-            >
-              <TouchableOpacity
-                onLongPress={[Function]}
-                onPress={[Function]}
-                style={
-                  {
-                    "alignItems": "center",
-                    "flex": 1,
-                    "opacity": 1,
-                    "padding": 16,
-                    "position": "relative",
-                    "zIndex": 1,
-                  }
-                }
-                testID="select-with-menu"
-              >
-                <View
-                  accessibilityRole="none"
-                  accessible={true}
-                  style={
-                    {
-                      "alignItems": "flex-start",
-                      "flexDirection": "column",
-                      "padding": 16,
-                      "paddingBottom": 0,
-                      "paddingLeft": 0,
-                      "paddingRight": 0,
-                      "paddingTop": 0,
-                      "zIndex": 2,
-                    }
-                  }
-                >
-                  <View
-                    style={
-                      {
-                        "alignItems": "center",
-                        "flexDirection": "row",
-                      }
-                    }
-                  >
-                    <View
-                      style={
-                        {
-                          "alignItems": "center",
-                          "flexDirection": "row",
-                          "opacity": 1,
-                        }
-                      }
-                    >
-                      <View
-                        style={
-                          {
-                            "backgroundColor": "#ffffff",
-                            "borderRadius": 8,
-                            "height": 32,
-                            "marginRight": 16,
-                            "overflow": "hidden",
-                            "width": 32,
-                          }
-                        }
-                        testID="cellbase-avatar"
-                      >
-                        <View
-                          style={
-                            {
-                              "height": 32,
-                              "width": 32,
-                            }
-                          }
-                        />
-                      </View>
-                      <View
-                        style={
-                          {
-                            "alignItems": "flex-start",
-                            "flex": 1,
-                          }
-                        }
-                      >
-                        <Text
-                          accessibilityRole="text"
-                          numberOfLines={1}
-                          style={
-                            {
-                              "color": "#121314",
-                              "fontFamily": "Geist-Medium",
-                              "fontSize": 16,
-                              "fontWeight": "500",
-                              "letterSpacing": 0,
-                              "lineHeight": 24,
-                            }
-                          }
-                          testID="cellbase-avatar-title"
-                        >
-                          Account 2
-                        </Text>
-                        <View
-                          style={
-                            {
-                              "alignItems": "flex-start",
-                              "flexDirection": "row",
-                              "marginBottom": 0,
-                              "zIndex": 1,
-                            }
-                          }
-                        >
-                          <Text
-                            accessibilityRole="text"
-                            numberOfLines={1}
-                            style={
-                              {
-                                "color": "#686e7d",
-                                "fontFamily": "Geist-Regular",
-                                "fontSize": 16,
-                                "letterSpacing": 0,
-                                "lineHeight": 24,
-                              }
-                            }
-                          >
-                            0xd0185...a78E7
-                          </Text>
-                        </View>
-                      </View>
-                      <View
-                        style={
-                          {
-                            "marginLeft": 16,
-                          }
-                        }
-                      >
-                        <View
-                          style={
-                            {
-                              "alignItems": "flex-end",
-                              "flexDirection": "column",
-                            }
-                          }
-                          testID="account-balance-by-address-0xd018538C87232FF95acbCe4870629b75640a78E7"
-                        >
-                          <Text
-                            accessibilityRole="text"
-                            style={
-                              {
-                                "color": "#121314",
-                                "fontFamily": "Geist-Medium",
-                                "fontSize": 16,
-                                "fontWeight": "500",
-                                "letterSpacing": 0,
-                                "lineHeight": 24,
-                                "textAlign": "right",
-                              }
-                            }
-                          >
-                            $6400.00
-                          </Text>
-                          <View
-                            style={
-                              {
-                                "marginTop": 4,
-                              }
-                            }
-                            testID="network-container"
-                          >
-                            <View
-                              style={
-                                {
-                                  "alignItems": "center",
-                                  "flexDirection": "row",
-                                }
-                              }
-                              testID="avatar-group-container"
-                            />
-                          </View>
-                        </View>
-                      </View>
-                    </View>
-                  </View>
-                </View>
-              </TouchableOpacity>
-              <View
-                style={
-                  {
-                    "paddingRight": 8,
-                  }
-                }
-              >
-                <TouchableOpacity
-                  accessibilityRole="button"
-                  accessible={true}
-                  activeOpacity={1}
-                  disabled={false}
-                  onPress={[Function]}
-                  onPressIn={[Function]}
-                  onPressOut={[Function]}
-                  style={
-                    {
-                      "alignItems": "center",
-                      "borderRadius": 8,
-                      "height": 28,
-                      "justifyContent": "center",
-                      "opacity": 1,
-                      "width": 28,
-                    }
-                  }
-                  testID="multichain-account-cell-menu"
-                >
-                  <SvgMock
-                    color="#121314"
-                    fill="currentColor"
-                    height={20}
-                    name="MoreVertical"
-                    style={
-                      {
-                        "height": 20,
-                        "width": 20,
-                      }
-                    }
-                    width={20}
-                  />
-                </TouchableOpacity>
-              </View>
-            </View>
-          </View>
-        </View>
-      </View>
-    </RCTScrollView>
-  </View>
-</View>
-`;
diff --git a/app/components/UI/EvmAccountSelectorList/index.ts b/app/components/UI/EvmAccountSelectorList/index.ts
deleted file mode 100644
index 77db49739d2e..000000000000
--- a/app/components/UI/EvmAccountSelectorList/index.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-export { default } from './EvmAccountSelectorList';
-export type { EvmAccountSelectorListProps } from './EvmAccountSelectorList.types';
diff --git a/app/components/UI/FundActionMenu/FundActionMenu.test.tsx b/app/components/UI/FundActionMenu/FundActionMenu.test.tsx
index bd7d76e357b9..b02990626423 100644
--- a/app/components/UI/FundActionMenu/FundActionMenu.test.tsx
+++ b/app/components/UI/FundActionMenu/FundActionMenu.test.tsx
@@ -64,6 +64,7 @@ jest.mock('../../hooks/useMetrics');
 jest.mock('../Ramp/Aggregator/hooks/useRampNetwork');
 jest.mock('../Ramp/Deposit/hooks/useDepositEnabled');
 jest.mock('../Ramp/hooks/useRampsUnifiedV1Enabled');
+jest.mock('../Ramp/hooks/useRampsUnifiedV2Enabled');
 jest.mock('../Ramp/hooks/useRampNavigation');
 jest.mock('../../../util/trace');
 jest.mock('../../../util/networks', () => ({
@@ -464,7 +465,7 @@ describe('FundActionMenu', () => {
       );
       expect(mockAddProperties).toHaveBeenCalledWith(
         expect.objectContaining({
-          text: 'Deposit',
+          button_text: 'Deposit',
           location: 'FundActionMenu',
           chain_id_destination: 1,
           ramp_type: 'DEPOSIT',
@@ -490,7 +491,7 @@ describe('FundActionMenu', () => {
           MetaMetricsEvents.RAMPS_BUTTON_CLICKED,
         );
         expect(mockAddProperties).toHaveBeenCalledWith({
-          text: 'Buy',
+          button_text: 'Buy',
           location: 'FundActionMenu',
           chain_id_destination: 1,
           ramp_type: 'BUY',
@@ -539,7 +540,7 @@ describe('FundActionMenu', () => {
 
       await waitFor(() => {
         expect(mockAddProperties).toHaveBeenCalledWith({
-          text: 'Buy',
+          button_text: 'Buy',
           location: 'FundActionMenu',
           chain_id_destination: 137,
           ramp_type: 'BUY',
diff --git a/app/components/UI/FundActionMenu/FundActionMenu.tsx b/app/components/UI/FundActionMenu/FundActionMenu.tsx
index 2afca6efcf8f..56aa7f88caad 100644
--- a/app/components/UI/FundActionMenu/FundActionMenu.tsx
+++ b/app/components/UI/FundActionMenu/FundActionMenu.tsx
@@ -31,6 +31,7 @@ import type {
 } from './FundActionMenu.types';
 import { getDetectedGeolocation } from '../../../reducers/fiatOrders';
 import useRampsUnifiedV1Enabled from '../Ramp/hooks/useRampsUnifiedV1Enabled';
+import useRampsUnifiedV2Enabled from '../Ramp/hooks/useRampsUnifiedV2Enabled';
 import { useRampsButtonClickData } from '../Ramp/hooks/useRampsButtonClickData';
 
 const FundActionMenu = () => {
@@ -48,6 +49,7 @@ const FundActionMenu = () => {
   const canSignTransactions = useSelector(selectCanSignTransactions);
   const rampGeodetectedRegion = useSelector(getDetectedGeolocation);
   const rampUnifiedV1Enabled = useRampsUnifiedV1Enabled();
+  const isV2UnifiedEnabled = useRampsUnifiedV2Enabled();
   const { goToBuy, goToAggregator, goToSell, goToDeposit } =
     useRampNavigation();
   const rampsButtonClickData = useRampsButtonClickData();
@@ -115,10 +117,10 @@ const FundActionMenu = () => {
           isVisible: rampUnifiedV1Enabled,
           analyticsEvent: MetaMetricsEvents.RAMPS_BUTTON_CLICKED,
           analyticsProperties: {
-            text: 'Buy',
+            button_text: 'Buy',
             location: 'FundActionMenu',
             chain_id_destination: getChainIdForAsset(),
-            ramp_type: 'UNIFIED_BUY',
+            ramp_type: isV2UnifiedEnabled ? 'UNIFIED_BUY_2' : 'UNIFIED_BUY',
             region: rampGeodetectedRegion,
             ramp_routing: rampsButtonClickData.ramp_routing,
             is_authenticated: rampsButtonClickData.is_authenticated,
@@ -142,7 +144,7 @@ const FundActionMenu = () => {
           isVisible: isDepositEnabled && !rampUnifiedV1Enabled,
           analyticsEvent: MetaMetricsEvents.RAMPS_BUTTON_CLICKED,
           analyticsProperties: {
-            text: 'Deposit',
+            button_text: 'Deposit',
             location: 'FundActionMenu',
             chain_id_destination: getDecimalChainId(chainId),
             ramp_type: 'DEPOSIT',
@@ -164,7 +166,7 @@ const FundActionMenu = () => {
           isVisible: !rampUnifiedV1Enabled,
           analyticsEvent: MetaMetricsEvents.RAMPS_BUTTON_CLICKED,
           analyticsProperties: {
-            text: 'Buy',
+            button_text: 'Buy',
             location: 'FundActionMenu',
             chain_id_destination: getChainIdForAsset(),
             ramp_type: 'BUY',
@@ -194,7 +196,7 @@ const FundActionMenu = () => {
           isDisabled: !canSignTransactions,
           analyticsEvent: MetaMetricsEvents.RAMPS_BUTTON_CLICKED,
           analyticsProperties: {
-            text: 'Sell',
+            button_text: 'Sell',
             location: 'FundActionMenu',
             chain_id_source: getDecimalChainId(chainId),
             ramp_type: 'SELL',
@@ -212,6 +214,7 @@ const FundActionMenu = () => {
     [
       isDepositEnabled,
       rampUnifiedV1Enabled,
+      isV2UnifiedEnabled,
       chainId,
       rampGeodetectedRegion,
       getChainIdForAsset,
diff --git a/app/components/UI/HintModal/__snapshots__/index.test.tsx.snap b/app/components/UI/HintModal/__snapshots__/index.test.tsx.snap
index 7926907bf5c9..c3772ac618ab 100644
--- a/app/components/UI/HintModal/__snapshots__/index.test.tsx.snap
+++ b/app/components/UI/HintModal/__snapshots__/index.test.tsx.snap
@@ -89,13 +89,13 @@ exports[`HintModal should render correctly 1`] = `
         multiline={true}
         onChangeText={[Function]}
         placeholder="e.g. Mom's house"
-        placeholderTextColor="#b7bbc8"
+        placeholderTextColor="#babbbe"
         style={
           {
-            "borderColor": "#b7bbc8",
+            "borderColor": "#949596",
             "borderRadius": 6,
             "borderWidth": 1,
-            "color": "#121314",
+            "color": "#131416",
             "minHeight": 76,
             "padding": 16,
             "paddingTop": 16,
diff --git a/app/components/UI/Identicon/__snapshots__/index.test.tsx.snap b/app/components/UI/Identicon/__snapshots__/index.test.tsx.snap
index 7d4c37c5cb55..130ac9c57bdf 100644
--- a/app/components/UI/Identicon/__snapshots__/index.test.tsx.snap
+++ b/app/components/UI/Identicon/__snapshots__/index.test.tsx.snap
@@ -4,7 +4,7 @@ exports[`Identicon renders Blockie from address 1`] = `
 <View
   placeholderStyle={
     {
-      "backgroundColor": "#f3f5f9",
+      "backgroundColor": "#f3f3f4",
     }
   }
   useNativeDriver={true}
@@ -60,7 +60,7 @@ exports[`Identicon renders Blockie from address 1`] = `
             "backgroundColor": "#eee",
           },
           {
-            "backgroundColor": "#f3f5f9",
+            "backgroundColor": "#f3f3f4",
           },
         ]
       }
@@ -73,7 +73,7 @@ exports[`Identicon renders Jazzicon 1`] = `
 <View
   placeholderStyle={
     {
-      "backgroundColor": "#f3f5f9",
+      "backgroundColor": "#f3f3f4",
     }
   }
   useNativeDriver={true}
@@ -242,7 +242,7 @@ exports[`Identicon renders Jazzicon 1`] = `
             "backgroundColor": "#eee",
           },
           {
-            "backgroundColor": "#f3f5f9",
+            "backgroundColor": "#f3f3f4",
           },
         ]
       }
@@ -255,7 +255,7 @@ exports[`Identicon renders Maskicon 1`] = `
 <View
   placeholderStyle={
     {
-      "backgroundColor": "#f3f5f9",
+      "backgroundColor": "#f3f3f4",
     }
   }
   useNativeDriver={true}
@@ -302,7 +302,7 @@ exports[`Identicon renders Maskicon 1`] = `
             "backgroundColor": "#eee",
           },
           {
-            "backgroundColor": "#f3f5f9",
+            "backgroundColor": "#f3f3f4",
           },
         ]
       }
@@ -315,7 +315,7 @@ exports[`Identicon renders custom URI 1`] = `
 <View
   placeholderStyle={
     {
-      "backgroundColor": "#f3f5f9",
+      "backgroundColor": "#f3f3f4",
     }
   }
   useNativeDriver={true}
@@ -363,7 +363,7 @@ exports[`Identicon renders custom URI 1`] = `
             "backgroundColor": "#eee",
           },
           {
-            "backgroundColor": "#f3f5f9",
+            "backgroundColor": "#f3f3f4",
           },
         ]
       }
diff --git a/app/components/UI/Identity/BackupAndSyncFeaturesToggles/__snapshots__/BackupAndSyncFeaturesToggles.test.tsx.snap b/app/components/UI/Identity/BackupAndSyncFeaturesToggles/__snapshots__/BackupAndSyncFeaturesToggles.test.tsx.snap
index dfc8f043f2ff..f5e2519cb9b3 100644
--- a/app/components/UI/Identity/BackupAndSyncFeaturesToggles/__snapshots__/BackupAndSyncFeaturesToggles.test.tsx.snap
+++ b/app/components/UI/Identity/BackupAndSyncFeaturesToggles/__snapshots__/BackupAndSyncFeaturesToggles.test.tsx.snap
@@ -4,7 +4,7 @@ exports[`BackupAndSyncToggle renders correctly 1`] = `
 <View
   style={
     {
-      "borderTopColor": "#858b9a33",
+      "borderTopColor": "#ffffff14",
       "borderTopWidth": 1,
       "marginTop": 8,
       "paddingTop": 16,
@@ -23,7 +23,7 @@ exports[`BackupAndSyncToggle renders correctly 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Bold",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -37,7 +37,7 @@ exports[`BackupAndSyncToggle renders correctly 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#686e7d",
+          "color": "#66676a",
           "fontFamily": "Geist-Regular",
           "fontSize": 14,
           "letterSpacing": 0,
@@ -67,7 +67,7 @@ exports[`BackupAndSyncToggle renders correctly 1`] = `
       }
     >
       <SvgMock
-        color="#121314"
+        color="#131416"
         fill="currentColor"
         height={20}
         name="UserCircle"
@@ -83,7 +83,7 @@ exports[`BackupAndSyncToggle renders correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -99,7 +99,7 @@ exports[`BackupAndSyncToggle renders correctly 1`] = `
       onChange={[Function]}
       onResponderTerminationRequest={[Function]}
       onStartShouldSetResponder={[Function]}
-      onTintColor="#b7bbc866"
+      onTintColor="#b4b4b566"
       style={
         [
           {
@@ -107,14 +107,14 @@ exports[`BackupAndSyncToggle renders correctly 1`] = `
             "width": 51,
           },
           {
-            "backgroundColor": "#b7bbc866",
+            "backgroundColor": "#b4b4b566",
             "borderRadius": 16,
           },
         ]
       }
       testID="toggle-accountSyncing"
       thumbTintColor="#ffffff"
-      tintColor="#b7bbc866"
+      tintColor="#b4b4b566"
       value={false}
     />
   </View>
@@ -137,7 +137,7 @@ exports[`BackupAndSyncToggle renders correctly 1`] = `
       }
     >
       <SvgMock
-        color="#121314"
+        color="#131416"
         fill="currentColor"
         height={20}
         name="Book"
@@ -153,7 +153,7 @@ exports[`BackupAndSyncToggle renders correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -169,7 +169,7 @@ exports[`BackupAndSyncToggle renders correctly 1`] = `
       onChange={[Function]}
       onResponderTerminationRequest={[Function]}
       onStartShouldSetResponder={[Function]}
-      onTintColor="#b7bbc866"
+      onTintColor="#b4b4b566"
       style={
         [
           {
@@ -177,14 +177,14 @@ exports[`BackupAndSyncToggle renders correctly 1`] = `
             "width": 51,
           },
           {
-            "backgroundColor": "#b7bbc866",
+            "backgroundColor": "#b4b4b566",
             "borderRadius": 16,
           },
         ]
       }
       testID="toggle-contactSyncing"
       thumbTintColor="#ffffff"
-      tintColor="#b7bbc866"
+      tintColor="#b4b4b566"
       value={false}
     />
   </View>
diff --git a/app/components/UI/Identity/BackupAndSyncToggle/__snapshots__/BackupAndSyncToggle.test.tsx.snap b/app/components/UI/Identity/BackupAndSyncToggle/__snapshots__/BackupAndSyncToggle.test.tsx.snap
index 396a7e139f63..a2fb6be1452b 100644
--- a/app/components/UI/Identity/BackupAndSyncToggle/__snapshots__/BackupAndSyncToggle.test.tsx.snap
+++ b/app/components/UI/Identity/BackupAndSyncToggle/__snapshots__/BackupAndSyncToggle.test.tsx.snap
@@ -22,7 +22,7 @@ exports[`BackupAndSyncToggle renders correctly 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Bold",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -45,14 +45,14 @@ exports[`BackupAndSyncToggle renders correctly 1`] = `
             "width": 51,
           },
           {
-            "backgroundColor": "#b7bbc866",
+            "backgroundColor": "#b4b4b566",
             "borderRadius": 16,
           },
         ]
       }
       testID="toggle-backupAndSync"
       thumbTintColor="#ffffff"
-      tintColor="#b7bbc866"
+      tintColor="#b4b4b566"
       value={true}
     />
   </View>
@@ -60,7 +60,7 @@ exports[`BackupAndSyncToggle renders correctly 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#686e7d",
+        "color": "#66676a",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
diff --git a/app/components/UI/Identity/ConfirmTurnOnBackupAndSyncModal/__snapshots__/ConfirmTurnOnBackupAndSyncModal.test.tsx.snap b/app/components/UI/Identity/ConfirmTurnOnBackupAndSyncModal/__snapshots__/ConfirmTurnOnBackupAndSyncModal.test.tsx.snap
index 95dbc5ffadb1..e0e2b0f56d2d 100644
--- a/app/components/UI/Identity/ConfirmTurnOnBackupAndSyncModal/__snapshots__/ConfirmTurnOnBackupAndSyncModal.test.tsx.snap
+++ b/app/components/UI/Identity/ConfirmTurnOnBackupAndSyncModal/__snapshots__/ConfirmTurnOnBackupAndSyncModal.test.tsx.snap
@@ -23,7 +23,7 @@ exports[`ConfirmTurnOnBackupAndSyncModal renders correctly 1`] = `
     style={
       [
         {
-          "backgroundColor": "#3f434a66",
+          "backgroundColor": "#0a0d135c",
           "bottom": 0,
           "left": 0,
           "position": "absolute",
@@ -73,7 +73,7 @@ exports[`ConfirmTurnOnBackupAndSyncModal renders correctly 1`] = `
         [
           {
             "backgroundColor": "#ffffff",
-            "borderColor": "#b7bbc866",
+            "borderColor": "#b4b4b566",
             "borderTopLeftRadius": 24,
             "borderTopRightRadius": 24,
             "borderWidth": 1,
@@ -110,7 +110,7 @@ exports[`ConfirmTurnOnBackupAndSyncModal renders correctly 1`] = `
         <View
           style={
             {
-              "backgroundColor": "#b7bbc866",
+              "backgroundColor": "#b4b4b566",
               "borderRadius": 2,
               "height": 4,
               "width": 40,
@@ -146,9 +146,9 @@ exports[`ConfirmTurnOnBackupAndSyncModal renders correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Bold",
-              "fontSize": 18,
+              "fontSize": 20,
               "letterSpacing": 0,
               "lineHeight": 24,
               "textAlign": "center",
@@ -162,7 +162,7 @@ exports[`ConfirmTurnOnBackupAndSyncModal renders correctly 1`] = `
           style={
             {
               "alignSelf": "flex-start",
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -200,7 +200,7 @@ exports[`ConfirmTurnOnBackupAndSyncModal renders correctly 1`] = `
                 {
                   "alignItems": "center",
                   "alignSelf": "flex-start",
-                  "backgroundColor": "#3c4d9d0f",
+                  "backgroundColor": "#b4b4b528",
                   "borderColor": "transparent",
                   "borderRadius": 12,
                   "borderWidth": 1,
@@ -217,7 +217,7 @@ exports[`ConfirmTurnOnBackupAndSyncModal renders correctly 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Medium",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -247,7 +247,7 @@ exports[`ConfirmTurnOnBackupAndSyncModal renders correctly 1`] = `
                 {
                   "alignItems": "center",
                   "alignSelf": "flex-start",
-                  "backgroundColor": "#121314",
+                  "backgroundColor": "#131416",
                   "borderRadius": 12,
                   "flex": 1,
                   "flexDirection": "row",
diff --git a/app/components/UI/LedgerModals/Steps/__snapshots__/OpenETHAppStep.test.tsx.snap b/app/components/UI/LedgerModals/Steps/__snapshots__/OpenETHAppStep.test.tsx.snap
index 407655750bab..154cfcf19f9f 100644
--- a/app/components/UI/LedgerModals/Steps/__snapshots__/OpenETHAppStep.test.tsx.snap
+++ b/app/components/UI/LedgerModals/Steps/__snapshots__/OpenETHAppStep.test.tsx.snap
@@ -26,7 +26,7 @@ exports[`OpenETHAppStep matches snapshot 1`] = `
       style={
         [
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 30,
             "marginVertical": 2,
@@ -79,7 +79,7 @@ exports[`OpenETHAppStep matches snapshot 1`] = `
       style={
         [
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 30,
             "marginVertical": 2,
@@ -115,7 +115,7 @@ exports[`OpenETHAppStep matches snapshot 1`] = `
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 30,
               "marginVertical": 2,
@@ -153,7 +153,7 @@ exports[`OpenETHAppStep matches snapshot 1`] = `
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 30,
               "marginVertical": 2,
@@ -206,7 +206,7 @@ exports[`OpenETHAppStep matches snapshot 1`] = `
           },
           {
             "backgroundColor": "#ffffff",
-            "borderColor": "#686e7d",
+            "borderColor": "#66676a",
             "borderWidth": 1,
           },
           undefined,
@@ -232,7 +232,7 @@ exports[`OpenETHAppStep matches snapshot 1`] = `
               "textAlign": "center",
             },
             {
-              "color": "#686e7d",
+              "color": "#66676a",
             },
             {
               "width": 600,
diff --git a/app/components/UI/LedgerModals/Steps/__snapshots__/SearchingForDeviceStep.test.tsx.snap b/app/components/UI/LedgerModals/Steps/__snapshots__/SearchingForDeviceStep.test.tsx.snap
index 7e9615461166..fafdf7befbd6 100644
--- a/app/components/UI/LedgerModals/Steps/__snapshots__/SearchingForDeviceStep.test.tsx.snap
+++ b/app/components/UI/LedgerModals/Steps/__snapshots__/SearchingForDeviceStep.test.tsx.snap
@@ -34,7 +34,7 @@ exports[`SearchingForDeviceStep matches snapshot for Android < 12 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Bold",
           "fontSize": 22,
           "letterSpacing": 0,
@@ -65,7 +65,7 @@ exports[`SearchingForDeviceStep matches snapshot for Android < 12 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -79,7 +79,7 @@ exports[`SearchingForDeviceStep matches snapshot for Android < 12 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -94,7 +94,7 @@ exports[`SearchingForDeviceStep matches snapshot for Android < 12 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -109,7 +109,7 @@ exports[`SearchingForDeviceStep matches snapshot for Android < 12 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -124,7 +124,7 @@ exports[`SearchingForDeviceStep matches snapshot for Android < 12 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -139,7 +139,7 @@ exports[`SearchingForDeviceStep matches snapshot for Android < 12 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -154,7 +154,7 @@ exports[`SearchingForDeviceStep matches snapshot for Android < 12 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -227,7 +227,7 @@ exports[`SearchingForDeviceStep matches snapshot for Android 12+ 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Bold",
           "fontSize": 22,
           "letterSpacing": 0,
@@ -258,7 +258,7 @@ exports[`SearchingForDeviceStep matches snapshot for Android 12+ 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -272,7 +272,7 @@ exports[`SearchingForDeviceStep matches snapshot for Android 12+ 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -287,7 +287,7 @@ exports[`SearchingForDeviceStep matches snapshot for Android 12+ 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -302,7 +302,7 @@ exports[`SearchingForDeviceStep matches snapshot for Android 12+ 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -317,7 +317,7 @@ exports[`SearchingForDeviceStep matches snapshot for Android 12+ 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -332,7 +332,7 @@ exports[`SearchingForDeviceStep matches snapshot for Android 12+ 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -347,7 +347,7 @@ exports[`SearchingForDeviceStep matches snapshot for Android 12+ 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
diff --git a/app/components/UI/LedgerModals/__snapshots__/LedgerConfirmationModal.test.tsx.snap b/app/components/UI/LedgerModals/__snapshots__/LedgerConfirmationModal.test.tsx.snap
index 9407830cc2e2..a361b9a6b546 100644
--- a/app/components/UI/LedgerModals/__snapshots__/LedgerConfirmationModal.test.tsx.snap
+++ b/app/components/UI/LedgerModals/__snapshots__/LedgerConfirmationModal.test.tsx.snap
@@ -53,7 +53,7 @@ exports[`LedgerConfirmationModal render matches latest snapshot 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Bold",
               "fontSize": 22,
               "letterSpacing": 0,
@@ -84,7 +84,7 @@ exports[`LedgerConfirmationModal render matches latest snapshot 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -98,7 +98,7 @@ exports[`LedgerConfirmationModal render matches latest snapshot 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -113,7 +113,7 @@ exports[`LedgerConfirmationModal render matches latest snapshot 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -128,7 +128,7 @@ exports[`LedgerConfirmationModal render matches latest snapshot 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -143,7 +143,7 @@ exports[`LedgerConfirmationModal render matches latest snapshot 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -158,7 +158,7 @@ exports[`LedgerConfirmationModal render matches latest snapshot 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
diff --git a/app/components/UI/LedgerModals/__snapshots__/LedgerMessageSignModal.test.tsx.snap b/app/components/UI/LedgerModals/__snapshots__/LedgerMessageSignModal.test.tsx.snap
index 86e5f7c791d9..cdb04f5e9392 100644
--- a/app/components/UI/LedgerModals/__snapshots__/LedgerMessageSignModal.test.tsx.snap
+++ b/app/components/UI/LedgerModals/__snapshots__/LedgerMessageSignModal.test.tsx.snap
@@ -341,7 +341,7 @@ exports[`LedgerMessageSignModal should render correctly 1`] = `
                           style={
                             [
                               {
-                                "backgroundColor": "#3f434a66",
+                                "backgroundColor": "#0a0d135c",
                                 "bottom": 0,
                                 "left": 0,
                                 "position": "absolute",
@@ -453,7 +453,7 @@ exports[`LedgerMessageSignModal should render correctly 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 22,
                                         "letterSpacing": 0,
@@ -484,7 +484,7 @@ exports[`LedgerMessageSignModal should render correctly 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -498,7 +498,7 @@ exports[`LedgerMessageSignModal should render correctly 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -513,7 +513,7 @@ exports[`LedgerMessageSignModal should render correctly 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -528,7 +528,7 @@ exports[`LedgerMessageSignModal should render correctly 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -543,7 +543,7 @@ exports[`LedgerMessageSignModal should render correctly 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -558,7 +558,7 @@ exports[`LedgerMessageSignModal should render correctly 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
diff --git a/app/components/UI/ManageNetworks/ManageNetworks.tsx b/app/components/UI/ManageNetworks/ManageNetworks.tsx
index 00985e59f1cf..cfc020a52def 100644
--- a/app/components/UI/ManageNetworks/ManageNetworks.tsx
+++ b/app/components/UI/ManageNetworks/ManageNetworks.tsx
@@ -13,7 +13,7 @@ import {
 } from '../../../selectors/networkInfos';
 import { useNavigation } from '@react-navigation/native';
 import Routes from '../../../constants/navigation/Routes';
-import { useMetrics } from '../../../components/hooks/useMetrics';
+import { useAnalytics } from '../../../components/hooks/useAnalytics/useAnalytics';
 import { MetaMetricsEvents } from '../../../core/Analytics';
 import { ConnectedAccountsSelectorsIDs } from '../../Views/AccountConnect/ConnectedAccountModal.testIds';
 import AppConstants from '../../../core/AppConstants';
@@ -21,7 +21,7 @@ import styles from './ManageNetworks.styles';
 
 export default function ManageNetworksComponent() {
   const navigation = useNavigation();
-  const { trackEvent, createEventBuilder } = useMetrics();
+  const { trackEvent, createEventBuilder } = useAnalytics();
 
   const networkImageSource = useSelector(selectNetworkImageSource);
   const networkName = useSelector(selectNetworkName);
diff --git a/app/components/UI/ManageNetworks/__snapshots__/ManageNetworks.test.js.snap b/app/components/UI/ManageNetworks/__snapshots__/ManageNetworks.test.js.snap
index a04a77e3b189..835033b8f015 100644
--- a/app/components/UI/ManageNetworks/__snapshots__/ManageNetworks.test.js.snap
+++ b/app/components/UI/ManageNetworks/__snapshots__/ManageNetworks.test.js.snap
@@ -21,7 +21,7 @@ exports[`ManageNetworks should render correctly 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Bold",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -36,7 +36,7 @@ exports[`ManageNetworks should render correctly 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#686e7d",
+        "color": "#66676a",
         "fontFamily": "Geist-Regular",
         "fontSize": 14,
         "fontWeight": "400",
@@ -89,7 +89,7 @@ exports[`ManageNetworks should render correctly 1`] = `
       {
         "alignItems": "center",
         "alignSelf": "flex-start",
-        "backgroundColor": "#f3f5f9",
+        "backgroundColor": "#f3f3f4",
         "borderRadius": 16,
         "flexDirection": "row",
         "height": 32,
@@ -107,7 +107,7 @@ exports[`ManageNetworks should render correctly 1`] = `
         style={
           {
             "alignItems": "center",
-            "backgroundColor": "#f3f5f9",
+            "backgroundColor": "#f3f3f4",
             "borderRadius": 8,
             "borderWidth": 1,
             "height": 16,
@@ -122,7 +122,7 @@ exports[`ManageNetworks should render correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 10,
               "letterSpacing": 0,
@@ -139,7 +139,7 @@ exports[`ManageNetworks should render correctly 1`] = `
       numberOfLines={1}
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "flexShrink": 1,
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
@@ -153,7 +153,7 @@ exports[`ManageNetworks should render correctly 1`] = `
       Ethereum Main Network
     </Text>
     <SvgMock
-      color="#121314"
+      color="#131416"
       fill="currentColor"
       height={12}
       name="ArrowDown"
diff --git a/app/components/UI/MarketInsights/Views/MarketInsightsView/MarketInsightsView.test.tsx b/app/components/UI/MarketInsights/Views/MarketInsightsView/MarketInsightsView.test.tsx
index d32e61768a1d..c876aace8d38 100644
--- a/app/components/UI/MarketInsights/Views/MarketInsightsView/MarketInsightsView.test.tsx
+++ b/app/components/UI/MarketInsights/Views/MarketInsightsView/MarketInsightsView.test.tsx
@@ -5,8 +5,10 @@ import renderWithProvider from '../../../../../util/test/renderWithProvider';
 import MarketInsightsView from './MarketInsightsView';
 import { MarketInsightsSelectorsIDs } from '../../MarketInsights.testIds';
 import { MetaMetricsEvents } from '../../../../../core/Analytics/MetaMetrics.events';
+import Routes from '../../../../../constants/navigation/Routes';
 
 const mockGoBack = jest.fn();
+const mockNavigate = jest.fn();
 const mockGoToSwaps = jest.fn();
 const mockUseMarketInsights = jest.fn();
 const mockTrendSourcesBottomSheet = jest.fn();
@@ -28,7 +30,6 @@ let mockRouteParams = {
   assetSymbol: 'ETH',
   caip19Id: 'eip155:1/erc20:0x123',
   tokenImageUrl: 'https://example.com/eth.png',
-  pricePercentChange: 4.2,
   tokenAddress: '0x123',
   tokenDecimals: 18,
   tokenName: 'Ethereum',
@@ -41,7 +42,7 @@ jest.mock('@react-navigation/native', () => {
     ...actualNav,
     useNavigation: () => ({
       goBack: mockGoBack,
-      navigate: jest.fn(),
+      navigate: mockNavigate,
     }),
     useRoute: () => ({
       params: mockRouteParams,
@@ -107,71 +108,6 @@ jest.mock('../../components/MarketInsightsTweetCard', () => {
   return TweetCard;
 });
 
-jest.mock('../../components/MarketInsightsSourcesFooter', () => {
-  const {
-    View: MockView,
-    Pressable: MockPressable,
-    Text: MockText,
-  } = jest.requireActual('react-native');
-
-  const SourcesFooter = ({
-    testID,
-    onSourcesPress,
-    onThumbsUp,
-    onThumbsDown,
-  }: {
-    testID?: string;
-    onSourcesPress?: () => void;
-    onThumbsUp?: () => void;
-    onThumbsDown?: () => void;
-  }) => (
-    <MockView testID={testID ?? 'sources-footer'}>
-      <MockPressable
-        testID="market-insights-open-sources-button"
-        onPress={onSourcesPress}
-      >
-        <MockText>open-sources</MockText>
-      </MockPressable>
-      <MockPressable
-        testID="market-insights-thumbs-up-button"
-        onPress={onThumbsUp}
-      >
-        <MockText>thumbs-up</MockText>
-      </MockPressable>
-      <MockPressable
-        testID="market-insights-thumbs-down-button"
-        onPress={onThumbsDown}
-      >
-        <MockText>thumbs-down</MockText>
-      </MockPressable>
-    </MockView>
-  );
-
-  const SourcesBottomSheet = (
-    props: { onSourcePress?: (url: string) => void } | unknown,
-  ) => {
-    const typedProps = props as { onSourcePress?: (url: string) => void };
-    return (
-      <MockView testID="market-insights-sources-bottom-sheet">
-        <MockPressable
-          testID="market-insights-source-link-button"
-          onPress={() =>
-            typedProps.onSourcePress?.('https://coindesk.com/article-1')
-          }
-        >
-          <MockText>source-link</MockText>
-        </MockPressable>
-      </MockView>
-    );
-  };
-
-  return {
-    __esModule: true,
-    default: SourcesFooter,
-    MarketInsightsSourcesBottomSheet: SourcesBottomSheet,
-  };
-});
-
 jest.mock('../../components/MarketInsightsTrendSourcesBottomSheet', () => {
   const {
     View: MockView,
@@ -271,7 +207,6 @@ describe('MarketInsightsView', () => {
       assetSymbol: 'ETH',
       caip19Id: 'eip155:1/erc20:0x123',
       tokenImageUrl: 'https://example.com/eth.png',
-      pricePercentChange: 4.2,
       tokenAddress: '0x123',
       tokenDecimals: 18,
       tokenName: 'Ethereum',
@@ -308,6 +243,40 @@ describe('MarketInsightsView', () => {
     expect(queryByTestId(MarketInsightsSelectorsIDs.VIEW_CONTAINER)).toBeNull();
   });
 
+  it('does not render loading skeleton during error transition', () => {
+    jest.useFakeTimers();
+
+    mockUseMarketInsights.mockReturnValue({
+      report: null,
+      isLoading: true,
+      error: null,
+      timeAgo: '',
+    });
+
+    const { queryByTestId, rerender } = renderWithProvider(
+      <MarketInsightsView />,
+    );
+
+    act(() => {
+      jest.advanceTimersByTime(160);
+    });
+
+    expect(
+      queryByTestId(MarketInsightsSelectorsIDs.VIEW_SKELETON),
+    ).toBeOnTheScreen();
+
+    mockUseMarketInsights.mockReturnValue({
+      report: null,
+      isLoading: false,
+      error: 'request failed',
+      timeAgo: '',
+    });
+
+    rerender(<MarketInsightsView />);
+
+    expect(queryByTestId(MarketInsightsSelectorsIDs.VIEW_SKELETON)).toBeNull();
+  });
+
   it('returns null when market insights report is unavailable', () => {
     mockUseMarketInsights.mockReturnValue({
       report: null,
@@ -362,7 +331,13 @@ describe('MarketInsightsView', () => {
             ],
           },
         ],
-        sources: [],
+        sources: [
+          {
+            name: 'coindesk.com',
+            type: 'article',
+            url: 'https://www.coindesk.com',
+          },
+        ],
       },
       isLoading: false,
       error: null,
@@ -385,7 +360,8 @@ describe('MarketInsightsView', () => {
     expect(
       getByTestId(MarketInsightsSelectorsIDs.SOURCES_FOOTER),
     ).toBeOnTheScreen();
-    expect(getByText('AI summary • Not financial advice')).toBeOnTheScreen();
+    expect(getByText('Was this helpful?')).toBeOnTheScreen();
+    expect(getByText('AI summary for information only')).toBeOnTheScreen();
 
     fireEvent.press(getByTestId(`${MarketInsightsSelectorsIDs.TWEET_CARD}-0`));
     expect(Linking.openURL).toHaveBeenCalledWith(
@@ -418,8 +394,6 @@ describe('MarketInsightsView', () => {
       getByTestId('market-insights-feedback-bottom-sheet'),
     ).toBeOnTheScreen();
     fireEvent.press(getByTestId('market-insights-feedback-submit-button'));
-    fireEvent.press(getByTestId('market-insights-open-sources-button'));
-    fireEvent.press(getByTestId('market-insights-source-link-button'));
     fireEvent.press(getByTestId('market-insights-trend-source-link-button'));
 
     expect(mockCreateEventBuilder).toHaveBeenCalledWith(
@@ -463,15 +437,6 @@ describe('MarketInsightsView', () => {
         }),
       }),
     );
-    expect(mockTrackEvent).toHaveBeenCalledWith(
-      expect.objectContaining({
-        category: MetaMetricsEvents.MARKET_INSIGHTS_INTERACTION,
-        properties: expect.objectContaining({
-          interaction_type: 'source_click',
-          source: 'https://coindesk.com/article-1',
-        }),
-      }),
-    );
     expect(mockTrackEvent).toHaveBeenCalledWith(
       expect.objectContaining({
         category: MetaMetricsEvents.MARKET_INSIGHTS_INTERACTION,
@@ -481,6 +446,13 @@ describe('MarketInsightsView', () => {
         }),
       }),
     );
+    expect(mockNavigate).toHaveBeenCalledWith(Routes.BROWSER.HOME, {
+      screen: Routes.BROWSER.VIEW,
+      params: expect.objectContaining({
+        newTabUrl: 'https://www.coindesk.com/article',
+        fromTrending: true,
+      }),
+    });
   });
 
   it('opens trend sources sheet for tweet-only trend and passes tweet sources', () => {
diff --git a/app/components/UI/MarketInsights/Views/MarketInsightsView/MarketInsightsView.tsx b/app/components/UI/MarketInsights/Views/MarketInsightsView/MarketInsightsView.tsx
index f42756202fa5..9baacd39883b 100644
--- a/app/components/UI/MarketInsights/Views/MarketInsightsView/MarketInsightsView.tsx
+++ b/app/components/UI/MarketInsights/Views/MarketInsightsView/MarketInsightsView.tsx
@@ -28,17 +28,14 @@ import {
   BoxAlignItems,
   FontWeight,
 } from '@metamask/design-system-react-native';
-import AvatarToken from '../../../../../component-library/components/Avatars/Avatar/variants/AvatarToken';
-import { AvatarSize } from '../../../../../component-library/components/Avatars/Avatar/Avatar.types';
 import { strings } from '../../../../../../locales/i18n';
+import Routes from '../../../../../constants/navigation/Routes';
 import { useMarketInsights } from '../../hooks/useMarketInsights';
 import MarketInsightsTrendItem from '../../components/MarketInsightsTrendItem';
 import MarketInsightsTweetCard from '../../components/MarketInsightsTweetCard';
-import MarketInsightsSourcesFooter, {
-  MarketInsightsSourcesBottomSheet,
-} from '../../components/MarketInsightsSourcesFooter';
 import MarketInsightsTrendSourcesBottomSheet from '../../components/MarketInsightsTrendSourcesBottomSheet';
 import { MarketInsightsSelectorsIDs } from '../../MarketInsights.testIds';
+import { isSafeUrl } from '../../utils/marketInsightsFormatting';
 import { useAnalytics } from '../../../../hooks/useAnalytics/useAnalytics';
 import {
   useSwapBridgeNavigation,
@@ -51,8 +48,9 @@ import type {
 } from '@metamask/ai-controllers';
 import { selectMarketInsightsEnabled } from '../../../../../selectors/featureFlagController/marketInsights';
 import { endTrace, TraceName } from '../../../../../util/trace';
-import { Skeleton } from '../../../../../component-library/components/Skeleton';
 import { MetaMetricsEvents } from '../../../../hooks/useMetrics';
+import MarketInsightsViewSkeleton from './MarketInsightsViewSkeleton';
+import MarketInsightsViewHeader from './MarketInsightsViewHeader';
 import {
   ToastContext,
   ToastVariants,
@@ -71,7 +69,6 @@ const SECTION_ANIMATION_DELAYS_MS = {
   closerLook: 80,
   whatsBeingSaid: 160,
 };
-
 interface AnimatedSectionProps {
   children: React.ReactNode;
   delay?: number;
@@ -119,115 +116,10 @@ const AnimatedSection: React.FC<AnimatedSectionProps> = ({
   );
 };
 
-interface MarketInsightsViewSkeletonProps {
-  insets: { top: number; bottom: number };
-  onBackPress: () => void;
-}
-
-const MarketInsightsViewSkeleton: React.FC<MarketInsightsViewSkeletonProps> = ({
-  insets,
-  onBackPress,
-}) => {
-  const tw = useTailwind();
-
-  return (
-    <Box
-      twClassName={`flex-1 bg-default pt-[${insets.top}px]`}
-      testID={MarketInsightsSelectorsIDs.VIEW_SKELETON}
-    >
-      <Box
-        flexDirection={BoxFlexDirection.Row}
-        alignItems={BoxAlignItems.Center}
-        twClassName="px-1 py-2"
-      >
-        <Pressable onPress={onBackPress} style={tw.style('p-2')} hitSlop={8}>
-          <Icon
-            name={IconName.ArrowLeft}
-            size={IconSize.Md}
-            color={IconColor.IconDefault}
-          />
-        </Pressable>
-        <Box twClassName="flex-1 items-center">
-          <Text variant={TextVariant.HeadingSm} fontWeight={FontWeight.Bold}>
-            {strings('market_insights.title')}
-          </Text>
-        </Box>
-        <Box twClassName="w-10" />
-      </Box>
-
-      <ScrollView
-        contentContainerStyle={tw.style(`pb-[${insets.bottom + 80}px]`)}
-        showsVerticalScrollIndicator={false}
-      >
-        <Box twClassName="px-4 pt-4 pb-4">
-          <Skeleton height={26} width={110} style={tw.style('rounded-full')} />
-        </Box>
-
-        <Box twClassName="px-4 pb-3" gap={2}>
-          <Skeleton height={28} width="90%" />
-          <Skeleton height={28} width="62%" />
-        </Box>
-
-        <Box twClassName="px-4 pb-6" gap={2}>
-          <Skeleton height={16} width="94%" />
-          <Skeleton height={16} width="85%" />
-          <Skeleton height={16} width="88%" />
-          <Skeleton height={16} width="56%" />
-        </Box>
-
-        <Box twClassName="pb-6">
-          <Box twClassName="px-4 py-4">
-            <Skeleton height={16} width={140} />
-          </Box>
-
-          <Box twClassName="px-4" gap={3}>
-            <Skeleton height={64} width="100%" style={tw.style('rounded-xl')} />
-            <Skeleton height={64} width="100%" style={tw.style('rounded-xl')} />
-            <Skeleton height={64} width="100%" style={tw.style('rounded-xl')} />
-          </Box>
-        </Box>
-
-        <Box twClassName="pb-6">
-          <Box twClassName="px-4 py-4">
-            <Skeleton height={16} width={150} />
-          </Box>
-
-          <Box twClassName="px-4" gap={3}>
-            <Skeleton
-              height={120}
-              width="100%"
-              style={tw.style('rounded-2xl bg-alternative')}
-            />
-            <Skeleton
-              height={120}
-              width="100%"
-              style={tw.style('rounded-2xl bg-alternative')}
-            />
-          </Box>
-        </Box>
-      </ScrollView>
-
-      <Box
-        twClassName={`absolute bottom-0 left-0 right-0 bg-default px-4 pt-4 pb-[${insets.bottom + 8}px]`}
-      >
-        <Button
-          variant={ButtonVariant.Primary}
-          size={ButtonSize.Lg}
-          isFullWidth
-          isDisabled
-        >
-          {strings('market_insights.trade_button')}
-        </Button>
-      </Box>
-    </Box>
-  );
-};
-
 interface MarketInsightsRouteParams {
   assetSymbol: string;
   caip19Id: string;
   tokenImageUrl?: string;
-  pricePercentChange?: number;
   /** Token address for swap navigation */
   tokenAddress?: string;
   /** Token decimals for swap navigation */
@@ -241,11 +133,11 @@ interface MarketInsightsRouteParams {
 /**
  * MarketInsightsView is the full-page Market Insights screen.
  * It displays the AI-generated market report including:
- * - Price change indicator with token logo
  * - Headline and summary
  * - "A closer look" trends section
+ * - Consolidated trends sources pill
  * - "What's being said" social section
- * - Sources footer with feedback buttons
+ * - Feedback row with thumbs actions
  * - Trade CTA button (navigates to Swaps with asset pre-filled)
  */
 const MarketInsightsView: React.FC = () => {
@@ -259,7 +151,6 @@ const MarketInsightsView: React.FC = () => {
     assetSymbol,
     caip19Id,
     tokenImageUrl,
-    pricePercentChange,
     tokenAddress,
     tokenDecimals,
     tokenName,
@@ -280,7 +171,6 @@ const MarketInsightsView: React.FC = () => {
   const loadingSkeletonTimeoutRef = useRef<ReturnType<
     typeof setTimeout
   > | null>(null);
-  const [isSourcesSheetVisible, setIsSourcesSheetVisible] = useState(false);
   const [isFeedbackSheetVisible, setIsFeedbackSheetVisible] = useState(false);
 
   // Build BridgeToken from route params for swap navigation
@@ -309,25 +199,19 @@ const MarketInsightsView: React.FC = () => {
     sourceToken,
   });
 
-  // Determine if price change is positive or negative
-  const isPricePositive = (pricePercentChange ?? 0) >= 0;
-  const formattedPercentChange =
-    pricePercentChange != null
-      ? `${isPricePositive ? '+' : ''}${pricePercentChange.toFixed(2)}%`
-      : null;
-
   // Collect all tweets from all trends for the "What people are saying" section
   const allTweets: MarketInsightsTweet[] = useMemo(() => {
     if (!report) return [];
     return report.trends.flatMap((trend) => trend.tweets).slice(0, 4);
   }, [report]);
-
   const handleBackPress = useCallback(() => {
     navigation.goBack();
   }, [navigation]);
 
   const handleTweetPress = useCallback((url: string) => {
-    Linking.openURL(url);
+    if (isSafeUrl(url)) {
+      Linking.openURL(url);
+    }
   }, []);
 
   const handleTradePress = useCallback(() => {
@@ -371,7 +255,7 @@ const MarketInsightsView: React.FC = () => {
     }
 
     setShowLoadingSkeleton(false);
-  }, [isLoading, report]);
+  }, [isLoading, report, error]);
 
   useEffect(
     () => () => {
@@ -381,14 +265,6 @@ const MarketInsightsView: React.FC = () => {
     },
     [],
   );
-  const handleOpenSources = useCallback(() => {
-    setIsSourcesSheetVisible(true);
-  }, []);
-
-  const handleCloseSources = useCallback(() => {
-    setIsSourcesSheetVisible(false);
-  }, []);
-
   const trackMarketInsightsInteraction = useCallback(
     (
       interactionType: 'thumbs_up' | 'thumbs_down' | 'source_click',
@@ -467,9 +343,23 @@ const MarketInsightsView: React.FC = () => {
 
   const handleSourcePress = useCallback(
     (url: string) => {
+      if (!isSafeUrl(url)) {
+        return;
+      }
       trackMarketInsightsInteraction('source_click', { source: url });
+      navigation.navigate(
+        Routes.BROWSER.HOME as never,
+        {
+          screen: Routes.BROWSER.VIEW,
+          params: {
+            newTabUrl: url,
+            timestamp: Date.now(),
+            fromTrending: true,
+          },
+        } as never,
+      );
     },
-    [trackMarketInsightsInteraction],
+    [trackMarketInsightsInteraction, navigation],
   );
 
   useEffect(() => {
@@ -488,7 +378,7 @@ const MarketInsightsView: React.FC = () => {
     hasTrackedViewRef.current = true;
   }, [report, caip19Id, trackEvent, createEventBuilder]);
 
-  if (showLoadingSkeleton && !report) {
+  if (showLoadingSkeleton && !report && !error) {
     return (
       <MarketInsightsViewSkeleton
         insets={insets}
@@ -506,79 +396,16 @@ const MarketInsightsView: React.FC = () => {
       twClassName={`flex-1 bg-default pt-[${insets.top}px]`}
       testID={MarketInsightsSelectorsIDs.VIEW_CONTAINER}
     >
-      <Box
-        flexDirection={BoxFlexDirection.Row}
-        alignItems={BoxAlignItems.Center}
-        twClassName="px-1 py-2"
-        testID={MarketInsightsSelectorsIDs.VIEW_HEADER}
-      >
-        <Pressable
-          onPress={handleBackPress}
-          style={tw.style('p-2')}
-          hitSlop={8}
-        >
-          <Icon
-            name={IconName.ArrowLeft}
-            size={IconSize.Md}
-            color={IconColor.IconDefault}
-          />
-        </Pressable>
-        <Box twClassName="flex-1 items-center">
-          <Text variant={TextVariant.HeadingSm} fontWeight={FontWeight.Bold}>
-            {strings('market_insights.title')}
-          </Text>
-        </Box>
-        <Box twClassName="w-10" />
-      </Box>
+      <MarketInsightsViewHeader onBackPress={handleBackPress} />
 
       <ScrollView
-        contentContainerStyle={tw.style('pb-6')}
+        style={tw.style('flex-1')}
+        contentContainerStyle={tw.style(`pb-4`)}
         showsVerticalScrollIndicator={false}
       >
         <AnimatedSection delay={SECTION_ANIMATION_DELAYS_MS.topArticle}>
           <Box twClassName="px-4 pt-4 pb-3">
-            <Box
-              flexDirection={BoxFlexDirection.Row}
-              alignItems={BoxAlignItems.Center}
-              twClassName={`self-start rounded-full px-2 py-1 ${
-                isPricePositive ? 'bg-success-muted' : 'bg-error-muted'
-              }`}
-              gap={1}
-            >
-              {tokenImageUrl ? (
-                <AvatarToken
-                  name={report.asset.toUpperCase()}
-                  imageSource={{ uri: tokenImageUrl }}
-                  size={AvatarSize.Xs}
-                />
-              ) : null}
-              {formattedPercentChange ? (
-                <Text
-                  variant={TextVariant.BodySm}
-                  fontWeight={FontWeight.Medium}
-                  color={
-                    isPricePositive
-                      ? TextColor.SuccessDefault
-                      : TextColor.ErrorDefault
-                  }
-                >
-                  {formattedPercentChange}
-                </Text>
-              ) : null}
-              <Icon
-                name={isPricePositive ? IconName.Arrow2Up : IconName.Arrow2Down}
-                size={IconSize.Sm}
-                color={
-                  isPricePositive
-                    ? IconColor.SuccessDefault
-                    : IconColor.ErrorDefault
-                }
-              />
-            </Box>
-          </Box>
-
-          <Box twClassName="px-4 pb-3">
-            <Text variant={TextVariant.HeadingLg}>{report.headline}</Text>
+            <Text variant={TextVariant.HeadingMd}>{report.headline}</Text>
           </Box>
 
           <Box twClassName="px-4 pb-6">
@@ -594,26 +421,6 @@ const MarketInsightsView: React.FC = () => {
         <AnimatedSection delay={SECTION_ANIMATION_DELAYS_MS.closerLook}>
           {/* "A closer look" section */}
           <Box twClassName="pb-6">
-            <Box
-              flexDirection={BoxFlexDirection.Row}
-              alignItems={BoxAlignItems.Center}
-              gap={2}
-              twClassName="px-4 py-4"
-            >
-              <Icon
-                name={IconName.Description}
-                size={IconSize.Md}
-                color={IconColor.IconAlternative}
-              />
-              <Text
-                variant={TextVariant.BodySm}
-                fontWeight={FontWeight.Medium}
-                color={TextColor.TextAlternative}
-              >
-                {strings('market_insights.a_closer_look')}
-              </Text>
-            </Box>
-
             {report.trends.map((trend, index) => (
               <MarketInsightsTrendItem
                 key={`trend-${index}`}
@@ -628,22 +435,12 @@ const MarketInsightsView: React.FC = () => {
         {/* "What's being said" section */}
         {allTweets.length > 0 && (
           <AnimatedSection delay={SECTION_ANIMATION_DELAYS_MS.whatsBeingSaid}>
+            <Box twClassName="h-4 border-t border-muted" />
             <Box twClassName="pb-6">
-              <Box
-                flexDirection={BoxFlexDirection.Row}
-                alignItems={BoxAlignItems.Center}
-                gap={2}
-                twClassName="px-4 py-4"
-              >
-                <Icon
-                  name={IconName.Messages}
-                  size={IconSize.Md}
-                  color={IconColor.IconAlternative}
-                />
+              <Box twClassName="px-4 py-4">
                 <Text
-                  variant={TextVariant.BodySm}
-                  fontWeight={FontWeight.Medium}
-                  color={TextColor.TextAlternative}
+                  variant={TextVariant.HeadingMd}
+                  fontWeight={FontWeight.Bold}
                 >
                   {strings('market_insights.whats_being_said')}
                 </Text>
@@ -662,34 +459,76 @@ const MarketInsightsView: React.FC = () => {
             </Box>
           </AnimatedSection>
         )}
-      </ScrollView>
 
-      <Box twClassName={`bg-default pt-2 pb-[${insets.bottom}px]`}>
-        <MarketInsightsSourcesFooter
-          sources={report.sources}
-          onSourcesPress={handleOpenSources}
-          onThumbsUp={handleThumbsUpPress}
-          onThumbsDown={handleThumbsDownPress}
+        <Box
+          alignItems={BoxAlignItems.Center}
+          twClassName="border-t border-muted px-4 pt-4"
           testID={MarketInsightsSelectorsIDs.SOURCES_FOOTER}
-        />
-        <Box twClassName="px-4">
-          <Button
-            variant={ButtonVariant.Primary}
-            size={ButtonSize.Lg}
-            isFullWidth
-            onPress={handleTradePress}
-            testID={MarketInsightsSelectorsIDs.TRADE_BUTTON}
+        >
+          <Box
+            flexDirection={BoxFlexDirection.Row}
+            alignItems={BoxAlignItems.Center}
+            gap={3}
           >
-            {strings('market_insights.trade_button')}
-          </Button>
-          <Box twClassName="pt-3" alignItems={BoxAlignItems.Center}>
-            <Text
-              variant={TextVariant.BodyMd}
-              color={TextColor.TextAlternative}
+            <Pressable
+              onPress={handleThumbsUpPress}
+              style={({ pressed }) =>
+                tw.style(
+                  'h-12 w-12 items-center justify-center rounded-full bg-muted',
+                  pressed && 'opacity-70',
+                )
+              }
+              testID={MarketInsightsSelectorsIDs.THUMBS_UP_BUTTON}
             >
-              {strings('market_insights.fixed_footer_disclaimer')}
-            </Text>
+              <Icon
+                name={IconName.ThumbUp}
+                size={IconSize.Md}
+                color={IconColor.IconAlternative}
+              />
+            </Pressable>
+            <Pressable
+              onPress={handleThumbsDownPress}
+              style={({ pressed }) =>
+                tw.style(
+                  'h-12 w-12 items-center justify-center rounded-full bg-muted',
+                  pressed && 'opacity-70',
+                )
+              }
+              testID={MarketInsightsSelectorsIDs.THUMBS_DOWN_BUTTON}
+            >
+              <Icon
+                name={IconName.ThumbDown}
+                size={IconSize.Md}
+                color={IconColor.IconAlternative}
+              />
+            </Pressable>
           </Box>
+          <Text
+            variant={TextVariant.BodySm}
+            color={TextColor.TextAlternative}
+            twClassName="pt-3"
+          >
+            {strings('market_insights.helpful_prompt')}
+          </Text>
+        </Box>
+      </ScrollView>
+
+      <Box
+        twClassName={`border-t border-muted bg-default px-4 pt-4 pb-[${insets.bottom + 8}px]`}
+      >
+        <Button
+          variant={ButtonVariant.Primary}
+          size={ButtonSize.Lg}
+          isFullWidth
+          onPress={handleTradePress}
+          testID={MarketInsightsSelectorsIDs.TRADE_BUTTON}
+        >
+          {strings('market_insights.trade_button')}
+        </Button>
+        <Box twClassName="pt-3" alignItems={BoxAlignItems.Center}>
+          <Text variant={TextVariant.BodySm} color={TextColor.TextAlternative}>
+            {strings('market_insights.footer_disclaimer')}
+          </Text>
         </Box>
       </Box>
 
@@ -704,15 +543,6 @@ const MarketInsightsView: React.FC = () => {
         />
       ) : null}
 
-      {isSourcesSheetVisible ? (
-        <MarketInsightsSourcesBottomSheet
-          isVisible
-          onClose={handleCloseSources}
-          sources={report.sources}
-          onSourcePress={handleSourcePress}
-        />
-      ) : null}
-
       {isFeedbackSheetVisible ? (
         <MarketInsightsFeedbackBottomSheet
           isVisible
diff --git a/app/components/UI/MarketInsights/Views/MarketInsightsView/MarketInsightsViewHeader.tsx b/app/components/UI/MarketInsights/Views/MarketInsightsView/MarketInsightsViewHeader.tsx
new file mode 100644
index 000000000000..d473435a5aea
--- /dev/null
+++ b/app/components/UI/MarketInsights/Views/MarketInsightsView/MarketInsightsViewHeader.tsx
@@ -0,0 +1,52 @@
+import React from 'react';
+import { Pressable } from 'react-native';
+import { useTailwind } from '@metamask/design-system-twrnc-preset';
+import {
+  Box,
+  Text,
+  TextVariant,
+  Icon,
+  IconName,
+  IconSize,
+  IconColor,
+  BoxFlexDirection,
+  BoxAlignItems,
+  FontWeight,
+} from '@metamask/design-system-react-native';
+import { strings } from '../../../../../../locales/i18n';
+import { MarketInsightsSelectorsIDs } from '../../MarketInsights.testIds';
+
+interface MarketInsightsViewHeaderProps {
+  onBackPress: () => void;
+}
+
+const MarketInsightsViewHeader: React.FC<MarketInsightsViewHeaderProps> = ({
+  onBackPress,
+}) => {
+  const tw = useTailwind();
+
+  return (
+    <Box
+      flexDirection={BoxFlexDirection.Row}
+      alignItems={BoxAlignItems.Center}
+      twClassName="px-1 py-2"
+      testID={MarketInsightsSelectorsIDs.VIEW_HEADER}
+    >
+      <Pressable onPress={onBackPress} style={tw.style('p-2')} hitSlop={8}>
+        <Icon
+          name={IconName.ArrowLeft}
+          size={IconSize.Md}
+          color={IconColor.IconDefault}
+        />
+      </Pressable>
+      <Box twClassName="flex-1 items-center">
+        <Text variant={TextVariant.HeadingSm} fontWeight={FontWeight.Bold}>
+          {strings('market_insights.title')}
+        </Text>
+      </Box>
+      <Box twClassName="w-10" />
+    </Box>
+  );
+};
+
+export default MarketInsightsViewHeader;
diff --git a/app/components/UI/MarketInsights/Views/MarketInsightsView/MarketInsightsViewSkeleton.tsx b/app/components/UI/MarketInsights/Views/MarketInsightsView/MarketInsightsViewSkeleton.tsx
new file mode 100644
index 000000000000..460fef2b30ad
--- /dev/null
+++ b/app/components/UI/MarketInsights/Views/MarketInsightsView/MarketInsightsViewSkeleton.tsx
@@ -0,0 +1,74 @@
+import React from 'react';
+import { ScrollView } from 'react-native';
+import { useTailwind } from '@metamask/design-system-twrnc-preset';
+import { Box } from '@metamask/design-system-react-native';
+import { Skeleton } from '../../../../../component-library/components/Skeleton';
+import { MarketInsightsSelectorsIDs } from '../../MarketInsights.testIds';
+import MarketInsightsViewHeader from './MarketInsightsViewHeader';
+
+interface MarketInsightsViewSkeletonProps {
+  insets: { top: number; bottom: number };
+  onBackPress: () => void;
+}
+
+const MarketInsightsViewSkeleton: React.FC<MarketInsightsViewSkeletonProps> = ({
+  insets,
+  onBackPress,
+}) => {
+  const tw = useTailwind();
+
+  return (
+    <Box
+      twClassName={`flex-1 bg-default pt-[${insets.top}px]`}
+      testID={MarketInsightsSelectorsIDs.VIEW_SKELETON}
+    >
+      <MarketInsightsViewHeader onBackPress={onBackPress} />
+
+      <ScrollView
+        contentContainerStyle={tw.style(`pb-[${insets.bottom + 8}px]`)}
+        showsVerticalScrollIndicator={false}
+      >
+        <Box twClassName="px-4 pt-4 pb-3" gap={2}>
+          <Skeleton height={28} width="90%" />
+          <Skeleton height={28} width="62%" />
+        </Box>
+
+        <Box twClassName="px-4 pb-6" gap={2}>
+          <Skeleton height={16} width="94%" />
+          <Skeleton height={16} width="85%" />
+          <Skeleton height={16} width="88%" />
+          <Skeleton height={16} width="56%" />
+        </Box>
+
+        <Box twClassName="pb-6">
+          <Box twClassName="px-4" gap={3}>
+            <Skeleton height={64} width="100%" style={tw.style('rounded-xl')} />
+            <Skeleton height={64} width="100%" style={tw.style('rounded-xl')} />
+            <Skeleton height={64} width="100%" style={tw.style('rounded-xl')} />
+          </Box>
+        </Box>
+
+        <Box twClassName="pb-6">
+          <Box twClassName="px-4 py-4">
+            <Skeleton height={16} width={150} />
+          </Box>
+
+          <Box twClassName="px-4" gap={3}>
+            <Skeleton
+              height={120}
+              width="100%"
+              style={tw.style('rounded-2xl bg-alternative')}
+            />
+            <Skeleton
+              height={120}
+              width="100%"
+              style={tw.style('rounded-2xl bg-alternative')}
+            />
+          </Box>
+        </Box>
+      </ScrollView>
+    </Box>
+  );
+};
+
+export default MarketInsightsViewSkeleton;
diff --git a/app/components/UI/MarketInsights/components/MarketInsightsEntryCard/MarketInsightsEntryCard.tsx b/app/components/UI/MarketInsights/components/MarketInsightsEntryCard/MarketInsightsEntryCard.tsx
index 8842870ce72e..a9a415be7afb 100644
--- a/app/components/UI/MarketInsights/components/MarketInsightsEntryCard/MarketInsightsEntryCard.tsx
+++ b/app/components/UI/MarketInsights/components/MarketInsightsEntryCard/MarketInsightsEntryCard.tsx
@@ -1,5 +1,5 @@
 import React, { useEffect, useMemo, useRef } from 'react';
-import { Animated, Image, Pressable } from 'react-native';
+import { Animated, Pressable } from 'react-native';
 import { useTailwind } from '@metamask/design-system-twrnc-preset';
 import {
   Box,
@@ -12,15 +12,14 @@ import {
   IconColor,
   BoxFlexDirection,
   BoxAlignItems,
+  BoxJustifyContent,
   FontWeight,
 } from '@metamask/design-system-react-native';
-import type { MarketInsightsSource } from '@metamask/ai-controllers';
 import { strings } from '../../../../../../locales/i18n';
 import type { MarketInsightsEntryCardProps } from './MarketInsightsEntryCard.types';
+import { getUniqueSourcesByFavicon } from '../../utils/marketInsightsFormatting';
 import { endTrace, TraceName } from '../../../../../util/trace';
-import { getFaviconUrl } from '../../utils/marketInsightsFormatting';
-
-const MAX_VISIBLE_SOURCE_LOGOS = 3;
+import SourceLogoGroup from '../SourceLogoGroup';
 
 const SparkleIcon: React.FC = () => {
   const opacity = useRef(new Animated.Value(0.45)).current;
@@ -57,46 +56,6 @@ const SparkleIcon: React.FC = () => {
   );
 };
 
-const SourceLogoGroup: React.FC<{ sources?: MarketInsightsSource[] }> = ({
-  sources,
-}) => {
-  const tw = useTailwind();
-
-  const uniqueSources = useMemo(() => {
-    const seenFaviconUrls = new Set<string>();
-    return (sources ?? []).filter((source) => {
-      const faviconUrl = getFaviconUrl(source.url);
-      if (seenFaviconUrls.has(faviconUrl)) {
-        return false;
-      }
-      seenFaviconUrls.add(faviconUrl);
-      return true;
-    });
-  }, [sources]);
-
-  if (uniqueSources.length === 0) {
-    return null;
-  }
-
-  return (
-    <Box flexDirection={BoxFlexDirection.Row} alignItems={BoxAlignItems.Center}>
-      {uniqueSources.slice(0, MAX_VISIBLE_SOURCE_LOGOS).map((source, index) => (
-        <Box
-          key={source.name}
-          twClassName={`h-4 w-4 rounded-full border border-muted bg-default overflow-hidden ${
-            index > 0 ? '-ml-1' : ''
-          }`}
-        >
-          <Image
-            source={{ uri: getFaviconUrl(source.url) }}
-            style={tw.style('h-4 w-4 rounded-full')}
-          />
-        </Box>
-      ))}
-    </Box>
-  );
-};
-
 /**
  * MarketInsightsEntryCard is the entry point card shown on the token details page.
  * Tapping navigates to the full Market Insights view.
@@ -109,6 +68,10 @@ const MarketInsightsEntryCard: React.FC<MarketInsightsEntryCardProps> = ({
   testID,
 }) => {
   const tw = useTailwind();
+  const uniqueSources = useMemo(
+    () => getUniqueSourcesByFavicon(report.sources ?? []),
+    [report.sources],
+  );
 
   useEffect(() => {
     // End the trace started by the parent (AssetOverviewContent) to measure
@@ -123,45 +86,66 @@ const MarketInsightsEntryCard: React.FC<MarketInsightsEntryCardProps> = ({
     <Pressable
       onPress={onPress}
       style={({ pressed }) =>
-        tw.style('mx-4 rounded-2xl bg-muted p-4', pressed && 'opacity-80')
+        tw.style('px-4 mt-2 mb-4', pressed && 'opacity-80')
       }
       testID={testID}
     >
-      <Box twClassName="mb-3">
+      <Box gap={2}>
         <Box
           flexDirection={BoxFlexDirection.Row}
           alignItems={BoxAlignItems.Center}
-          gap={1}
+          justifyContent={BoxJustifyContent.Between}
         >
-          <SparkleIcon />
-          <Text variant={TextVariant.HeadingSm} fontWeight={FontWeight.Medium}>
-            {strings('market_insights.title')}
-          </Text>
+          <Box
+            flexDirection={BoxFlexDirection.Row}
+            alignItems={BoxAlignItems.Center}
+            gap={2}
+          >
+            <Text variant={TextVariant.HeadingMd} fontWeight={FontWeight.Bold}>
+              {strings('market_insights.title')}
+            </Text>
+            <SparkleIcon />
+          </Box>
           <Icon
             name={IconName.ArrowRight}
-            size={IconSize.Sm}
+            size={IconSize.Md}
             color={IconColor.IconAlternative}
           />
         </Box>
-      </Box>
 
-      <Text variant={TextVariant.BodyMd} color={TextColor.TextAlternative}>
-        {report.summary}
-      </Text>
+        <Box gap={3}>
+          <Text variant={TextVariant.BodyMd} color={TextColor.TextAlternative}>
+            {report.summary}
+          </Text>
 
-      <Box twClassName="mt-3">
-        <SourceLogoGroup sources={report.sources ?? []} />
+          <SourceLogoGroup sources={uniqueSources} />
+
+          <Box
+            flexDirection={BoxFlexDirection.Row}
+            alignItems={BoxAlignItems.Center}
+            gap={1}
+          >
+            <Text
+              variant={TextVariant.BodySm}
+              color={TextColor.TextAlternative}
+            >
+              {strings('market_insights.footer_disclaimer')}
+            </Text>
+            <Text
+              variant={TextVariant.BodySm}
+              color={TextColor.TextAlternative}
+            >
+              {'•'}
+            </Text>
+            <Text
+              variant={TextVariant.BodySm}
+              color={TextColor.TextAlternative}
+            >
+              {timeAgo}
+            </Text>
+          </Box>
+        </Box>
       </Box>
-
-      <Text
-        variant={TextVariant.BodyXs}
-        color={TextColor.TextMuted}
-        twClassName="mt-3"
-      >
-        {strings('market_insights.disclaimer')}
-        {'  •  '}
-        {timeAgo}
-      </Text>
     </Pressable>
   );
 };
diff --git a/app/components/UI/MarketInsights/components/MarketInsightsSourcesFooter/MarketInsightsSourcesFooter.test.tsx b/app/components/UI/MarketInsights/components/MarketInsightsSourcesFooter/MarketInsightsSourcesFooter.test.tsx
deleted file mode 100644
index 0454a1612c2a..000000000000
--- a/app/components/UI/MarketInsights/components/MarketInsightsSourcesFooter/MarketInsightsSourcesFooter.test.tsx
+++ /dev/null
@@ -1,60 +0,0 @@
-import React from 'react';
-import { fireEvent } from '@testing-library/react-native';
-import renderWithProvider from '../../../../../util/test/renderWithProvider';
-import MarketInsightsSourcesFooter from './MarketInsightsSourcesFooter';
-import { MarketInsightsSelectorsIDs } from '../../MarketInsights.testIds';
-
-describe('MarketInsightsSourcesFooter', () => {
-  it('calls sources callback when sources pill is pressed', () => {
-    const onSourcesPress = jest.fn();
-    const sources = [
-      { name: 'CoinDesk', type: 'news', url: 'https://coindesk.com/article-1' },
-      { name: 'The Block', type: 'news', url: 'https://theblock.co/article-2' },
-      { name: 'Decrypt', type: 'news', url: 'https://decrypt.co/article-3' },
-      {
-        name: 'Bitcoin Magazine',
-        type: 'social',
-        url: 'https://bitcoinmagazine.com/article-4',
-      },
-      {
-        name: 'CoinMarketCap',
-        type: 'data',
-        url: 'https://coinmarketcap.com/article-5',
-      },
-    ];
-
-    const { getByText } = renderWithProvider(
-      <MarketInsightsSourcesFooter
-        sources={sources as never}
-        onSourcesPress={onSourcesPress}
-        testID="sources"
-      />,
-    );
-
-    fireEvent.press(getByText('+1 sources'));
-    expect(onSourcesPress).toHaveBeenCalledTimes(1);
-  });
-
-  it('calls thumbs callbacks when thumb buttons are pressed', () => {
-    const onThumbsUp = jest.fn();
-    const onThumbsDown = jest.fn();
-    const sources = [
-      { name: 'CoinDesk', type: 'news', url: 'https://coindesk.com/article-1' },
-    ];
-
-    const { getByTestId } = renderWithProvider(
-      <MarketInsightsSourcesFooter
-        sources={sources as never}
-        onThumbsUp={onThumbsUp}
-        onThumbsDown={onThumbsDown}
-        testID="sources"
-      />,
-    );
-
-    fireEvent.press(getByTestId(MarketInsightsSelectorsIDs.THUMBS_UP_BUTTON));
-    fireEvent.press(getByTestId(MarketInsightsSelectorsIDs.THUMBS_DOWN_BUTTON));
-
-    expect(onThumbsUp).toHaveBeenCalledTimes(1);
-    expect(onThumbsDown).toHaveBeenCalledTimes(1);
-  });
-});
diff --git a/app/components/UI/MarketInsights/components/MarketInsightsSourcesFooter/MarketInsightsSourcesFooter.tsx b/app/components/UI/MarketInsights/components/MarketInsightsSourcesFooter/MarketInsightsSourcesFooter.tsx
deleted file mode 100644
index 409f802b61fb..000000000000
--- a/app/components/UI/MarketInsights/components/MarketInsightsSourcesFooter/MarketInsightsSourcesFooter.tsx
+++ /dev/null
@@ -1,225 +0,0 @@
-import React, { useCallback, useEffect, useRef } from 'react';
-import { Image, Linking, Pressable, ScrollView } from 'react-native';
-import { useTailwind } from '@metamask/design-system-twrnc-preset';
-import {
-  Box,
-  Text,
-  TextVariant,
-  TextColor,
-  BoxFlexDirection,
-  BoxAlignItems,
-  BoxJustifyContent,
-  Icon,
-  IconName,
-  IconSize,
-  IconColor,
-  FontWeight,
-} from '@metamask/design-system-react-native';
-import BottomSheet, {
-  BottomSheetRef,
-} from '../../../../../component-library/components/BottomSheets/BottomSheet';
-import BottomSheetHeader from '../../../../../component-library/components/BottomSheets/BottomSheetHeader';
-import { strings } from '../../../../../../locales/i18n';
-import type {
-  MarketInsightsSourcesFooterProps,
-  MarketInsightsSourcesBottomSheetProps,
-} from './MarketInsightsSourcesFooter.types';
-import type { MarketInsightsSource } from '@metamask/ai-controllers';
-import { getFaviconUrl } from '../../utils/marketInsightsFormatting';
-import { MarketInsightsSelectorsIDs } from '../../MarketInsights.testIds';
-
-// Maximum number of source icons to show in the pill before "+N"
-const MAX_VISIBLE_SOURCES = 4;
-
-// SourceIcon renders a small circular favicon for a source.
-const SourceIcon: React.FC<{
-  source: MarketInsightsSource;
-  index: number;
-  isStacked?: boolean;
-}> = ({ source, index, isStacked = false }) => {
-  const tw = useTailwind();
-  return (
-    <Box
-      twClassName={`w-5 h-5 rounded-full bg-default border border-muted overflow-hidden ${
-        isStacked && index > 0 ? '-ml-2' : ''
-      }`}
-    >
-      <Image
-        source={{ uri: getFaviconUrl(source.url) }}
-        style={tw.style('w-5 h-5 rounded-full')}
-      />
-    </Box>
-  );
-};
-
-// MarketInsightsSourcesBottomSheet renders a scrollable list of all sources
-export const MarketInsightsSourcesBottomSheet: React.FC<
-  MarketInsightsSourcesBottomSheetProps
-> = ({ isVisible, onClose, sources, onSourcePress }) => {
-  const tw = useTailwind();
-  const bottomSheetRef = useRef<BottomSheetRef>(null);
-
-  useEffect(() => {
-    const sheet = bottomSheetRef.current;
-    if (isVisible) {
-      sheet?.onOpenBottomSheet();
-    } else {
-      sheet?.onCloseBottomSheet();
-    }
-  }, [isVisible]);
-
-  const handleSourcePress = useCallback(
-    (url: string) => {
-      onSourcePress?.(url);
-      Linking.openURL(url);
-    },
-    [onSourcePress],
-  );
-
-  const uniqueSources = sources.reduce<MarketInsightsSource[]>(
-    (acc, source) => {
-      if (!acc.find((s) => s.name === source.name)) {
-        acc.push(source);
-      }
-      return acc;
-    },
-    [],
-  );
-
-  return (
-    <BottomSheet
-      ref={bottomSheetRef}
-      shouldNavigateBack={false}
-      onClose={onClose}
-      style={tw.style('max-h-[600px]')}
-    >
-      <BottomSheetHeader onClose={onClose}>
-        <Text variant={TextVariant.HeadingSm} fontWeight={FontWeight.Bold}>
-          {strings('market_insights.sources_title')}
-        </Text>
-      </BottomSheetHeader>
-      <ScrollView
-        style={tw.style('px-4')}
-        contentContainerStyle={tw.style('pb-24')}
-      >
-        {uniqueSources.map((source) => (
-          <Pressable
-            key={source.name}
-            onPress={() => handleSourcePress(source.url)}
-            style={({ pressed }) =>
-              tw.style(
-                'flex-row items-center py-3 border-b border-muted',
-                pressed && 'opacity-70',
-              )
-            }
-          >
-            <Box twClassName="w-8 h-8 rounded-full overflow-hidden mr-3">
-              <Image
-                source={{ uri: getFaviconUrl(source.url) }}
-                style={tw.style('w-8 h-8 rounded-full')}
-              />
-            </Box>
-            <Box twClassName="flex-1">
-              <Text variant={TextVariant.BodyMd} fontWeight={FontWeight.Medium}>
-                {source.name}
-              </Text>
-              <Text
-                variant={TextVariant.BodyXs}
-                color={TextColor.TextAlternative}
-              >
-                {source.type}
-              </Text>
-            </Box>
-            <Icon
-              name={IconName.Export}
-              size={IconSize.Sm}
-              color={IconColor.IconAlternative}
-            />
-          </Pressable>
-        ))}
-      </ScrollView>
-    </BottomSheet>
-  );
-};
-
-const MarketInsightsSourcesFooter: React.FC<
-  MarketInsightsSourcesFooterProps
-> = ({ sources, onSourcesPress, onThumbsUp, onThumbsDown, testID }) => {
-  const tw = useTailwind();
-
-  const visibleCount = Math.min(sources.length, MAX_VISIBLE_SOURCES);
-  const remainingCount = Math.max(sources.length - MAX_VISIBLE_SOURCES, 0);
-
-  return (
-    <Box
-      flexDirection={BoxFlexDirection.Row}
-      alignItems={BoxAlignItems.Center}
-      justifyContent={BoxJustifyContent.Between}
-      twClassName="px-4 pt-3 pb-3"
-      testID={testID}
-    >
-      <Pressable
-        onPress={onSourcesPress}
-        style={({ pressed }) =>
-          tw.style(
-            'flex-row items-center bg-muted rounded-full px-3 py-2',
-            pressed && 'opacity-70',
-          )
-        }
-      >
-        <Box flexDirection={BoxFlexDirection.Row} twClassName="pr-2">
-          {sources.slice(0, visibleCount).map((source, index) => (
-            <SourceIcon
-              key={source.name}
-              source={source}
-              index={index}
-              isStacked
-            />
-          ))}
-        </Box>
-        {remainingCount > 0 ? (
-          <Text
-            variant={TextVariant.BodySm}
-            fontWeight={FontWeight.Medium}
-            color={TextColor.TextAlternative}
-          >
-            {strings('market_insights.sources_count', {
-              count: String(remainingCount),
-            })}
-          </Text>
-        ) : null}
-      </Pressable>
-
-      <Box
-        flexDirection={BoxFlexDirection.Row}
-        alignItems={BoxAlignItems.Center}
-        gap={4}
-      >
-        <Pressable
-          onPress={onThumbsUp}
-          style={({ pressed }) => tw.style(pressed && 'opacity-70')}
-          testID={MarketInsightsSelectorsIDs.THUMBS_UP_BUTTON}
-        >
-          <Icon
-            name={IconName.ThumbUp}
-            size={IconSize.Md}
-            color={IconColor.IconAlternative}
-          />
-        </Pressable>
-        <Pressable
-          onPress={onThumbsDown}
-          style={({ pressed }) => tw.style(pressed && 'opacity-70')}
-          testID={MarketInsightsSelectorsIDs.THUMBS_DOWN_BUTTON}
-        >
-          <Icon
-            name={IconName.ThumbDown}
-            size={IconSize.Md}
-            color={IconColor.IconAlternative}
-          />
-        </Pressable>
-      </Box>
-    </Box>
-  );
-};
-
-export default MarketInsightsSourcesFooter;
diff --git a/app/components/UI/MarketInsights/components/MarketInsightsSourcesFooter/MarketInsightsSourcesFooter.types.ts b/app/components/UI/MarketInsights/components/MarketInsightsSourcesFooter/MarketInsightsSourcesFooter.types.ts
deleted file mode 100644
index 89f0b7d85337..000000000000
--- a/app/components/UI/MarketInsights/components/MarketInsightsSourcesFooter/MarketInsightsSourcesFooter.types.ts
+++ /dev/null
@@ -1,25 +0,0 @@
-import type { MarketInsightsSource } from '@metamask/ai-controllers';
-
-export interface MarketInsightsSourcesFooterProps {
-  /** List of sources used for the report */
-  sources: MarketInsightsSource[];
-  /** Callback when sources pill is pressed */
-  onSourcesPress?: () => void;
-  /** Callback for thumbs up interaction */
-  onThumbsUp?: () => void;
-  /** Callback for thumbs down interaction */
-  onThumbsDown?: () => void;
-  /** Optional test ID */
-  testID?: string;
-}
-
-export interface MarketInsightsSourcesBottomSheetProps {
-  /** Whether the bottom sheet is visible */
-  isVisible: boolean;
-  /** Callback when the bottom sheet is closed */
-  onClose: () => void;
-  /** List of sources to display */
-  sources: MarketInsightsSource[];
-  /** Callback when a source URL is pressed */
-  onSourcePress?: (url: string) => void;
-}
diff --git a/app/components/UI/MarketInsights/components/MarketInsightsSourcesFooter/index.ts b/app/components/UI/MarketInsights/components/MarketInsightsSourcesFooter/index.ts
deleted file mode 100644
index 8f74905ef17d..000000000000
--- a/app/components/UI/MarketInsights/components/MarketInsightsSourcesFooter/index.ts
+++ /dev/null
@@ -1,3 +0,0 @@
-export { default } from './MarketInsightsSourcesFooter';
-export { MarketInsightsSourcesBottomSheet } from './MarketInsightsSourcesFooter';
-export type { MarketInsightsSourcesFooterProps } from './MarketInsightsSourcesFooter.types';
diff --git a/app/components/UI/MarketInsights/components/MarketInsightsTrendItem/MarketInsightsTrendItem.test.tsx b/app/components/UI/MarketInsights/components/MarketInsightsTrendItem/MarketInsightsTrendItem.test.tsx
index 64d723ed3428..03e369a902c1 100644
--- a/app/components/UI/MarketInsights/components/MarketInsightsTrendItem/MarketInsightsTrendItem.test.tsx
+++ b/app/components/UI/MarketInsights/components/MarketInsightsTrendItem/MarketInsightsTrendItem.test.tsx
@@ -5,7 +5,7 @@ import renderWithProvider from '../../../../../util/test/renderWithProvider';
 import MarketInsightsTrendItem from './MarketInsightsTrendItem';
 
 describe('MarketInsightsTrendItem', () => {
-  it('renders trend text and deduplicates source icons', () => {
+  it('renders trend title and description', () => {
     const trend = {
       title: 'Macro liquidity supports risk assets',
       description: 'Broad risk-on sentiment is supporting ETH and BTC.',
@@ -14,8 +14,43 @@ describe('MarketInsightsTrendItem', () => {
           source: 'Cointelegraph',
           url: 'https://cointelegraph.com/news/market-update-1',
         },
+        { source: 'theblock.co', url: 'https://www.theblock.co/post/1234' },
+      ],
+    };
+
+    const { getByText } = renderWithProvider(
+      <MarketInsightsTrendItem trend={trend as never} testID="trend-item" />,
+    );
+
+    expect(getByText(trend.title)).toBeOnTheScreen();
+    expect(getByText(trend.description)).toBeOnTheScreen();
+  });
+
+  it('shows source name label for a single source', () => {
+    const trend = {
+      title: 'Institutional inflows drive BTC demand',
+      description: 'Large funds keep adding BTC exposure.',
+      articles: [{ source: 'Coindesk', url: 'https://coindesk.com/news/1' }],
+    };
+
+    const { getByText } = renderWithProvider(
+      <MarketInsightsTrendItem trend={trend as never} testID="trend-item" />,
+    );
+
+    expect(getByText('Coindesk')).toBeOnTheScreen();
+  });
+
+  it('shows first source name and remaining count for multiple sources', () => {
+    const trend = {
+      title: 'Macro liquidity supports risk assets',
+      description: 'Broad risk-on sentiment is supporting ETH and BTC.',
+      articles: [
         {
-          source: 'https://cointelegraph.com/news/market-update-2',
+          source: 'Cointelegraph',
+          url: 'https://cointelegraph.com/news/market-update-1',
+        },
+        {
+          source: 'Cointelegraph duplicate',
           url: 'https://cointelegraph.com/news/market-update-2',
         },
         { source: 'theblock.co', url: 'https://www.theblock.co/post/1234' },
@@ -26,11 +61,33 @@ describe('MarketInsightsTrendItem', () => {
       <MarketInsightsTrendItem trend={trend as never} testID="trend-item" />,
     );
 
-    expect(getByText(trend.title)).toBeOnTheScreen();
-    expect(getByText(trend.description)).toBeOnTheScreen();
+    // Cointelegraph entries dedupe to one favicon, plus The Block = 2 unique sources.
+    // Label: "Cointelegraph +1" (2 sources - 1 named = 1 remaining).
+    expect(getByText('Cointelegraph +1')).toBeOnTheScreen();
+    expect(UNSAFE_getAllByType(Image)).toHaveLength(2);
+  });
 
-    const sourceIcons = UNSAFE_getAllByType(Image);
-    expect(sourceIcons).toHaveLength(2);
+  it('renders X icon for tweet sources instead of a favicon Image', () => {
+    const trend = {
+      title: 'Cycle discussion',
+      description: 'Traders discuss repeating patterns on X.',
+      articles: [],
+      tweets: [
+        {
+          author: 'ardizor',
+          contentSummary: 'Same cycle playbook.',
+          date: '2026-02-17',
+          url: 'https://x.com/ardizor/status/123',
+        },
+      ],
+    };
+
+    const { UNSAFE_queryAllByType } = renderWithProvider(
+      <MarketInsightsTrendItem trend={trend as never} testID="trend-item" />,
+    );
+
+    // X source uses Icon component, not Image.
+    expect(UNSAFE_queryAllByType(Image)).toHaveLength(0);
   });
 
   it('calls onPress when trend item is tapped', () => {
@@ -54,28 +111,4 @@ describe('MarketInsightsTrendItem', () => {
     fireEvent.press(getByTestId('trend-item'));
     expect(onPress).toHaveBeenCalledTimes(1);
   });
-
-  it('shows X icon when trend has only tweets and no articles', () => {
-    const trend = {
-      title: 'Developer debates',
-      description: 'Discussions heat up on consensus.',
-      articles: [],
-      tweets: [
-        {
-          author: 'adam3us',
-          contentSummary: 'Minority protections matter.',
-          date: '2026-02-17',
-          url: 'https://x.com/adam3us/status/123',
-        },
-      ],
-    };
-
-    const { getByText, UNSAFE_getAllByType } = renderWithProvider(
-      <MarketInsightsTrendItem trend={trend as never} testID="trend-item" />,
-    );
-
-    expect(getByText(trend.title)).toBeOnTheScreen();
-    const sourceIcons = UNSAFE_getAllByType(Image);
-    expect(sourceIcons).toHaveLength(1);
-  });
 });
diff --git a/app/components/UI/MarketInsights/components/MarketInsightsTrendItem/MarketInsightsTrendItem.tsx b/app/components/UI/MarketInsights/components/MarketInsightsTrendItem/MarketInsightsTrendItem.tsx
index 677b9be6749a..3d61970bc633 100644
--- a/app/components/UI/MarketInsights/components/MarketInsightsTrendItem/MarketInsightsTrendItem.tsx
+++ b/app/components/UI/MarketInsights/components/MarketInsightsTrendItem/MarketInsightsTrendItem.tsx
@@ -1,42 +1,19 @@
 import React, { useMemo } from 'react';
-import { Image, Pressable } from 'react-native';
+import { Pressable } from 'react-native';
 import { useTailwind } from '@metamask/design-system-twrnc-preset';
 import {
   Box,
+  BoxAlignItems,
+  BoxFlexDirection,
   Text,
-  TextVariant,
-  TextColor,
   FontWeight,
-  BoxFlexDirection,
-  BoxAlignItems,
+  TextColor,
+  TextVariant,
 } from '@metamask/design-system-react-native';
+import type { MarketInsightsSource } from '@metamask/ai-controllers';
 import type { MarketInsightsTrendItemProps } from './MarketInsightsTrendItem.types';
-import { getFaviconUrl } from '../../utils/marketInsightsFormatting';
-
-const SOURCE_ICON_IMAGE_STYLE = { width: 16, height: 16, borderRadius: 8 };
-
-// StackedSourceIcons renders overlapping circular favicons for article sources.
-const StackedSourceIcons: React.FC<{ sources: string[] }> = ({ sources }) => (
-  <Box
-    flexDirection={BoxFlexDirection.Row}
-    alignItems={BoxAlignItems.Center}
-    twClassName="mt-2"
-  >
-    {sources.map((source, index) => (
-      <Box
-        key={source}
-        twClassName={`w-5 h-5 rounded-full bg-default border border-muted overflow-hidden ${
-          index > 0 ? '-ml-1.5' : ''
-        }`}
-      >
-        <Image
-          source={{ uri: getFaviconUrl(source) }}
-          style={SOURCE_ICON_IMAGE_STYLE}
-        />
-      </Box>
-    ))}
-  </Box>
-);
+import { getUniqueSourcesByFavicon } from '../../utils/marketInsightsFormatting';
+import SourceLogoGroup from '../SourceLogoGroup';
 
 const MarketInsightsTrendItem: React.FC<MarketInsightsTrendItemProps> = ({
   trend,
@@ -45,26 +22,34 @@ const MarketInsightsTrendItem: React.FC<MarketInsightsTrendItemProps> = ({
 }) => {
   const tw = useTailwind();
   const uniqueSources = useMemo(() => {
-    const seenFaviconUrls = new Set<string>();
-    const fromArticles = trend.articles.reduce<string[]>((acc, article) => {
-      const sourceSeed = article.url || article.source;
-      const faviconUrl = getFaviconUrl(sourceSeed);
-      if (seenFaviconUrls.has(faviconUrl)) {
-        return acc;
-      }
-      seenFaviconUrls.add(faviconUrl);
-      acc.push(sourceSeed);
-      return acc;
-    }, []);
-
-    const hasTweets = (trend.tweets?.length ?? 0) > 0;
-    if (hasTweets && !seenFaviconUrls.has(getFaviconUrl('x.com'))) {
-      return [...fromArticles, 'x.com'];
-    }
+    const articleSources: MarketInsightsSource[] = trend.articles.map(
+      (article) => ({
+        name: article.source,
+        type: 'news',
+        url: article.url || article.source,
+      }),
+    );
+    const tweetSources: MarketInsightsSource[] = (trend.tweets ?? []).map(
+      (tweet) => ({
+        name: 'X',
+        type: 'social',
+        url: tweet.url || 'https://x.com',
+      }),
+    );
 
-    return fromArticles;
+    return getUniqueSourcesByFavicon([...articleSources, ...tweetSources]);
   }, [trend.articles, trend.tweets]);
 
+  const firstSource = uniqueSources[0];
+  const remainingCount = Math.max(0, uniqueSources.length - 1);
+  const sourceLabel = (() => {
+    if (!firstSource) return null;
+    if (firstSource.name === 'X' && remainingCount === 0) return null;
+    return remainingCount > 0
+      ? `${firstSource.name} +${remainingCount}`
+      : firstSource.name;
+  })();
+
   return (
     <Pressable
       onPress={onPress}
@@ -75,7 +60,7 @@ const MarketInsightsTrendItem: React.FC<MarketInsightsTrendItemProps> = ({
       accessibilityRole={onPress ? 'button' : undefined}
     >
       <Text
-        variant={TextVariant.BodyMd}
+        variant={TextVariant.HeadingSm}
         fontWeight={FontWeight.Medium}
         twClassName="mb-2"
       >
@@ -84,9 +69,23 @@ const MarketInsightsTrendItem: React.FC<MarketInsightsTrendItemProps> = ({
       <Text variant={TextVariant.BodyMd} color={TextColor.TextAlternative}>
         {trend.description}
       </Text>
-      {uniqueSources.length > 0 ? (
-        <StackedSourceIcons sources={uniqueSources} />
-      ) : null}
+      {uniqueSources.length > 0 && (
+        <Box
+          flexDirection={BoxFlexDirection.Row}
+          alignItems={BoxAlignItems.Center}
+          twClassName="pt-2 gap-2"
+        >
+          <SourceLogoGroup sources={uniqueSources} />
+          {sourceLabel ? (
+            <Text
+              variant={TextVariant.BodySm}
+              color={TextColor.TextAlternative}
+            >
+              {sourceLabel}
+            </Text>
+          ) : null}
+        </Box>
+      )}
     </Pressable>
   );
 };
diff --git a/app/components/UI/MarketInsights/components/MarketInsightsTrendSourcesBottomSheet.test.tsx b/app/components/UI/MarketInsights/components/MarketInsightsTrendSourcesBottomSheet.test.tsx
index 6c303c8e8635..d9dd7ac0f94d 100644
--- a/app/components/UI/MarketInsights/components/MarketInsightsTrendSourcesBottomSheet.test.tsx
+++ b/app/components/UI/MarketInsights/components/MarketInsightsTrendSourcesBottomSheet.test.tsx
@@ -1,5 +1,4 @@
 import React from 'react';
-import { Linking } from 'react-native';
 import { fireEvent } from '@testing-library/react-native';
 import renderWithProvider from '../../../../util/test/renderWithProvider';
 import MarketInsightsTrendSourcesBottomSheet from './MarketInsightsTrendSourcesBottomSheet';
@@ -39,15 +38,7 @@ jest.mock(
 );
 
 describe('MarketInsightsTrendSourcesBottomSheet', () => {
-  beforeEach(() => {
-    jest.spyOn(Linking, 'openURL').mockResolvedValue(undefined);
-  });
-
-  afterEach(() => {
-    jest.restoreAllMocks();
-  });
-
-  it('renders article and tweet sources and opens their URLs', () => {
+  it('renders article and tweet sources and triggers source callback', () => {
     const onClose = jest.fn();
     const onSourcePress = jest.fn();
     const articleUrl = 'https://www.coindesk.com/article';
@@ -88,11 +79,9 @@ describe('MarketInsightsTrendSourcesBottomSheet', () => {
 
     fireEvent.press(getByText('coindesk.com'));
     expect(onSourcePress).toHaveBeenCalledWith(articleUrl);
-    expect(Linking.openURL).toHaveBeenCalledWith(articleUrl);
 
     fireEvent.press(getByText('@adam3us'));
     expect(onSourcePress).toHaveBeenCalledWith(tweetUrl);
-    expect(Linking.openURL).toHaveBeenCalledWith(tweetUrl);
   });
 
   it('renders safely when hidden and has no callbacks', () => {
diff --git a/app/components/UI/MarketInsights/components/MarketInsightsTrendSourcesBottomSheet.tsx b/app/components/UI/MarketInsights/components/MarketInsightsTrendSourcesBottomSheet.tsx
index 508a3bd9bf45..9033a0b7d44b 100644
--- a/app/components/UI/MarketInsights/components/MarketInsightsTrendSourcesBottomSheet.tsx
+++ b/app/components/UI/MarketInsights/components/MarketInsightsTrendSourcesBottomSheet.tsx
@@ -1,5 +1,5 @@
 import React, { useCallback, useEffect, useRef } from 'react';
-import { Image, Linking, Pressable, ScrollView } from 'react-native';
+import { Image, Pressable, ScrollView } from 'react-native';
 import { useTailwind } from '@metamask/design-system-twrnc-preset';
 import {
   Box,
@@ -13,7 +13,6 @@ import {
   FontWeight,
   BoxFlexDirection,
   BoxAlignItems,
-  BoxJustifyContent,
 } from '@metamask/design-system-react-native';
 import type {
   MarketInsightsArticle,
@@ -24,7 +23,11 @@ import BottomSheet, {
 } from '../../../../component-library/components/BottomSheets/BottomSheet';
 import BottomSheetHeader from '../../../../component-library/components/BottomSheets/BottomSheetHeader';
 import { strings } from '../../../../../locales/i18n';
-import { getFaviconUrl } from '../utils/marketInsightsFormatting';
+import {
+  formatRelativeTime,
+  getFaviconUrl,
+  getNormalizedHandle,
+} from '../utils/marketInsightsFormatting';
 
 interface MarketInsightsTrendSourcesBottomSheetProps {
   isVisible: boolean;
@@ -60,7 +63,6 @@ const MarketInsightsTrendSourcesBottomSheet: React.FC<
   const handleSourcePress = useCallback(
     (url: string) => {
       onSourcePress?.(url);
-      Linking.openURL(url);
     },
     [onSourcePress],
   );
@@ -93,34 +95,76 @@ const MarketInsightsTrendSourcesBottomSheet: React.FC<
             onPress={() => handleSourcePress(article.url)}
             style={({ pressed }) =>
               tw.style(
-                'flex-row items-center py-3 border-b border-muted',
+                'flex-row items-start py-3 border-b border-muted',
                 pressed && 'opacity-70',
               )
             }
           >
-            <Box twClassName="w-8 h-8 rounded-full overflow-hidden mr-3">
-              <Image
-                source={{ uri: getFaviconUrl(article.url || article.source) }}
-                style={tw.style('w-8 h-8 rounded-full')}
-              />
-            </Box>
             <Box twClassName="flex-1">
-              <Text variant={TextVariant.BodyMd} fontWeight={FontWeight.Medium}>
-                {article.source}
-              </Text>
-              <Text
-                variant={TextVariant.BodyXs}
-                color={TextColor.TextAlternative}
-                numberOfLines={2}
+              <Box
+                flexDirection={BoxFlexDirection.Row}
+                alignItems={BoxAlignItems.Start}
+                twClassName="pr-1"
+              >
+                <Text
+                  variant={TextVariant.BodyMd}
+                  color={TextColor.TextDefault}
+                  twClassName="flex-1 pr-2"
+                >
+                  {article.title}
+                </Text>
+                <Box paddingTop={1}>
+                  <Icon
+                    name={IconName.Export}
+                    size={IconSize.Sm}
+                    color={IconColor.IconAlternative}
+                  />
+                </Box>
+              </Box>
+              <Box
+                flexDirection={BoxFlexDirection.Row}
+                alignItems={BoxAlignItems.Center}
+                twClassName="pt-1"
               >
-                {article.title}
-              </Text>
+                <Box twClassName="w-4 h-4 rounded-full overflow-hidden mr-2">
+                  <Image
+                    source={{
+                      uri: getFaviconUrl(article.url || article.source),
+                    }}
+                    style={tw.style('w-4 h-4 rounded-full')}
+                  />
+                </Box>
+                <Box
+                  flexDirection={BoxFlexDirection.Row}
+                  alignItems={BoxAlignItems.Center}
+                  gap={1}
+                >
+                  <Text
+                    variant={TextVariant.BodySm}
+                    fontWeight={FontWeight.Medium}
+                    color={TextColor.TextAlternative}
+                  >
+                    {article.source}
+                  </Text>
+                  {article.date ? (
+                    <>
+                      <Text
+                        variant={TextVariant.BodySm}
+                        color={TextColor.TextAlternative}
+                      >
+                        {'•'}
+                      </Text>
+                      <Text
+                        variant={TextVariant.BodySm}
+                        color={TextColor.TextAlternative}
+                      >
+                        {formatRelativeTime(article.date, { nowLabel: 'now' })}
+                      </Text>
+                    </>
+                  ) : null}
+                </Box>
+              </Box>
             </Box>
-            <Icon
-              name={IconName.Export}
-              size={IconSize.Sm}
-              color={IconColor.IconAlternative}
-            />
           </Pressable>
         ))}
 
@@ -130,40 +174,76 @@ const MarketInsightsTrendSourcesBottomSheet: React.FC<
             onPress={() => handleSourcePress(tweet.url)}
             style={({ pressed }) =>
               tw.style(
-                'flex-row items-center py-3 border-b border-muted',
+                'flex-row items-start py-3 border-b border-muted',
                 pressed && 'opacity-70',
               )
             }
           >
-            <Box
-              flexDirection={BoxFlexDirection.Row}
-              alignItems={BoxAlignItems.Center}
-              justifyContent={BoxJustifyContent.Center}
-              twClassName="w-8 h-8 rounded-full bg-muted mr-3"
-            >
-              <Icon
-                name={IconName.X}
-                size={IconSize.Sm}
-                color={IconColor.IconAlternative}
-              />
-            </Box>
             <Box twClassName="flex-1">
-              <Text variant={TextVariant.BodyMd} fontWeight={FontWeight.Medium}>
-                @{tweet.author}
-              </Text>
-              <Text
-                variant={TextVariant.BodyXs}
-                color={TextColor.TextAlternative}
-                numberOfLines={2}
+              <Box
+                flexDirection={BoxFlexDirection.Row}
+                alignItems={BoxAlignItems.Start}
+                twClassName="pr-1"
+              >
+                <Text
+                  variant={TextVariant.BodyMd}
+                  color={TextColor.TextDefault}
+                  numberOfLines={2}
+                  twClassName="flex-1 pr-2"
+                >
+                  {tweet.contentSummary}
+                </Text>
+                <Box paddingTop={1}>
+                  <Icon
+                    name={IconName.Export}
+                    size={IconSize.Sm}
+                    color={IconColor.IconAlternative}
+                  />
+                </Box>
+              </Box>
+              <Box
+                flexDirection={BoxFlexDirection.Row}
+                alignItems={BoxAlignItems.Center}
+                twClassName="pt-1"
               >
-                {tweet.contentSummary}
-              </Text>
+                <Box twClassName="w-6 h-6 rounded-full items-center justify-center bg-muted mr-2">
+                  <Icon
+                    name={IconName.X}
+                    size={IconSize.Sm}
+                    color={IconColor.IconAlternative}
+                  />
+                </Box>
+                <Box
+                  flexDirection={BoxFlexDirection.Row}
+                  alignItems={BoxAlignItems.Center}
+                  gap={1}
+                >
+                  <Text
+                    variant={TextVariant.BodySm}
+                    fontWeight={FontWeight.Medium}
+                    color={TextColor.TextAlternative}
+                  >
+                    {getNormalizedHandle(tweet.author)}
+                  </Text>
+                  {tweet.date ? (
+                    <>
+                      <Text
+                        variant={TextVariant.BodySm}
+                        color={TextColor.TextAlternative}
+                      >
+                        {'•'}
+                      </Text>
+                      <Text
+                        variant={TextVariant.BodySm}
+                        color={TextColor.TextAlternative}
+                      >
+                        {formatRelativeTime(tweet.date, { nowLabel: 'now' })}
+                      </Text>
+                    </>
+                  ) : null}
+                </Box>
+              </Box>
             </Box>
-            <Icon
-              name={IconName.Export}
-              size={IconSize.Sm}
-              color={IconColor.IconAlternative}
-            />
           </Pressable>
         ))}
       </ScrollView>
diff --git a/app/components/UI/MarketInsights/components/MarketInsightsTweetCard/MarketInsightsTweetCard.test.tsx b/app/components/UI/MarketInsights/components/MarketInsightsTweetCard/MarketInsightsTweetCard.test.tsx
index 8afbd26669db..03d9040ce0bd 100644
--- a/app/components/UI/MarketInsights/components/MarketInsightsTweetCard/MarketInsightsTweetCard.test.tsx
+++ b/app/components/UI/MarketInsights/components/MarketInsightsTweetCard/MarketInsightsTweetCard.test.tsx
@@ -4,15 +4,6 @@ import renderWithProvider from '../../../../../util/test/renderWithProvider';
 import MarketInsightsTweetCard from './MarketInsightsTweetCard';
 
 describe('MarketInsightsTweetCard', () => {
-  beforeEach(() => {
-    jest.useFakeTimers();
-    jest.setSystemTime(new Date('2026-02-17T12:00:00.000Z'));
-  });
-
-  afterEach(() => {
-    jest.useRealTimers();
-  });
-
   it('renders tweet metadata and handles card press', () => {
     const onPress = jest.fn();
 
@@ -31,8 +22,7 @@ describe('MarketInsightsTweetCard', () => {
       />,
     );
 
-    expect(getByText('analyst_alpha')).toBeOnTheScreen();
-    expect(getByText('1h ago')).toBeOnTheScreen();
+    expect(getByText('@analyst_alpha')).toBeOnTheScreen();
 
     fireEvent.press(getByTestId('market-insights-tweet-card'));
     expect(onPress).toHaveBeenCalledTimes(1);
diff --git a/app/components/UI/MarketInsights/components/MarketInsightsTweetCard/MarketInsightsTweetCard.tsx b/app/components/UI/MarketInsights/components/MarketInsightsTweetCard/MarketInsightsTweetCard.tsx
index 7af3ffdb1e85..b74cc6f412a4 100644
--- a/app/components/UI/MarketInsights/components/MarketInsightsTweetCard/MarketInsightsTweetCard.tsx
+++ b/app/components/UI/MarketInsights/components/MarketInsightsTweetCard/MarketInsightsTweetCard.tsx
@@ -16,31 +16,30 @@ import {
   FontWeight,
 } from '@metamask/design-system-react-native';
 import type { MarketInsightsTweetCardProps } from './MarketInsightsTweetCard.types';
-import { formatRelativeTime } from '../../utils/marketInsightsFormatting';
+import {
+  getNormalizedHandle,
+  formatRelativeTime,
+} from '../../utils/marketInsightsFormatting';
 
-// MarketInsightsTweetCard renders a social media post card.
 const MarketInsightsTweetCard: React.FC<MarketInsightsTweetCardProps> = ({
   tweet,
   onPress,
   testID,
 }) => {
   const tw = useTailwind();
-  const relativeTime = useMemo(
-    () => formatRelativeTime(tweet.date, { nowLabel: 'now' }),
-    [tweet.date],
-  );
+  const timeAgo = useMemo(() => formatRelativeTime(tweet.date), [tweet.date]);
 
   return (
     <Pressable
       onPress={onPress}
       style={({ pressed }) =>
-        tw.style('rounded-2xl bg-muted p-3', pressed && 'opacity-80')
+        tw.style('rounded-2xl bg-muted p-4', pressed && 'opacity-80')
       }
       testID={testID}
     >
       <Text
-        variant={TextVariant.BodySm}
-        color={TextColor.TextAlternative}
+        variant={TextVariant.BodyMd}
+        color={TextColor.TextDefault}
         twClassName="mb-3"
       >
         {tweet.contentSummary}
@@ -53,19 +52,35 @@ const MarketInsightsTweetCard: React.FC<MarketInsightsTweetCardProps> = ({
         <Box
           flexDirection={BoxFlexDirection.Row}
           alignItems={BoxAlignItems.Center}
-          gap={2}
+          gap={1}
+          twClassName="flex-1"
         >
-          <Text variant={TextVariant.BodySm} fontWeight={FontWeight.Medium}>
-            {tweet.author}
+          <Text
+            variant={TextVariant.BodySm}
+            fontWeight={FontWeight.Medium}
+            color={TextColor.TextAlternative}
+          >
+            {getNormalizedHandle(tweet.author)}
+          </Text>
+          <Text
+            variant={TextVariant.BodySm}
+            fontWeight={FontWeight.Medium}
+            color={TextColor.TextAlternative}
+          >
+            {'•'}
           </Text>
-          <Text variant={TextVariant.BodySm} color={TextColor.TextAlternative}>
-            {relativeTime}
+          <Text
+            variant={TextVariant.BodySm}
+            fontWeight={FontWeight.Medium}
+            color={TextColor.TextAlternative}
+          >
+            {timeAgo}
           </Text>
         </Box>
         <Icon
           name={IconName.X}
-          size={IconSize.Sm}
-          color={IconColor.IconAlternative}
+          size={IconSize.Md}
+          color={IconColor.IconDefault}
         />
       </Box>
     </Pressable>
diff --git a/app/components/UI/MarketInsights/components/SourceLogoGroup.tsx b/app/components/UI/MarketInsights/components/SourceLogoGroup.tsx
new file mode 100644
index 000000000000..90b6fb7e7d6e
--- /dev/null
+++ b/app/components/UI/MarketInsights/components/SourceLogoGroup.tsx
@@ -0,0 +1,62 @@
+import React from 'react';
+import { Image } from 'react-native';
+import { useTailwind } from '@metamask/design-system-twrnc-preset';
+import {
+  Box,
+  BoxFlexDirection,
+  Icon,
+  IconName,
+  IconSize,
+  IconColor,
+} from '@metamask/design-system-react-native';
+import type { MarketInsightsSource } from '@metamask/ai-controllers';
+import { getFaviconUrl, isXSourceUrl } from '../utils/marketInsightsFormatting';
+
+const MAX_VISIBLE_SOURCE_LOGOS = 3;
+
+interface SourceLogoGroupProps {
+  /** Pre-deduplicated sources; only the first MAX_VISIBLE_SOURCE_LOGOS are shown. */
+  sources: MarketInsightsSource[];
+}
+
+/**
+ * Renders a stacked row of up to three circular source logos.
+ */
+const SourceLogoGroup: React.FC<SourceLogoGroupProps> = ({ sources }) => {
+  const tw = useTailwind();
+  const visibleLogos = sources.slice(0, MAX_VISIBLE_SOURCE_LOGOS);
+
+  if (visibleLogos.length === 0) {
+    return null;
+  }
+
+  return (
+    <Box flexDirection={BoxFlexDirection.Row}>
+      {visibleLogos.map((source, index) => (
+        <Box
+          key={`${source.name}-${source.url}`}
+          twClassName={`h-4 w-4 rounded-full border border-muted bg-default overflow-hidden ${
+            index > 0 ? '-ml-1' : ''
+          }`}
+        >
+          {isXSourceUrl(source.url) ? (
+            <Box twClassName="h-4 w-4 items-center justify-center rounded-full">
+              <Icon
+                name={IconName.X}
+                size={IconSize.Sm}
+                color={IconColor.IconDefault}
+              />
+            </Box>
+          ) : (
+            <Image
+              source={{ uri: getFaviconUrl(source.url) }}
+              style={tw.style('h-4 w-4 rounded-full')}
+            />
+          )}
+        </Box>
+      ))}
+    </Box>
+  );
+};
+
+export default SourceLogoGroup;
diff --git a/app/components/UI/MarketInsights/hooks/useMarketInsights.ts b/app/components/UI/MarketInsights/hooks/useMarketInsights.ts
index 6ef4e254e11c..b49f228397d1 100644
--- a/app/components/UI/MarketInsights/hooks/useMarketInsights.ts
+++ b/app/components/UI/MarketInsights/hooks/useMarketInsights.ts
@@ -32,7 +32,7 @@ export const useMarketInsights = (
   isEnabled = false,
 ): UseMarketInsightsResult => {
   const [report, setReport] = useState<MarketInsightsReport | null>(null);
-  const [isLoading, setIsLoading] = useState(false);
+  const [isLoading, setIsLoading] = useState(Boolean(isEnabled && caip19Id));
   const [error, setError] = useState<string | null>(null);
 
   const fetchInsights = useCallback(async () => {
diff --git a/app/components/UI/MarketInsights/utils/marketInsightsFormatting.test.ts b/app/components/UI/MarketInsights/utils/marketInsightsFormatting.test.ts
index e3d9ec622d5a..b966d8f3e76f 100644
--- a/app/components/UI/MarketInsights/utils/marketInsightsFormatting.test.ts
+++ b/app/components/UI/MarketInsights/utils/marketInsightsFormatting.test.ts
@@ -1,4 +1,4 @@
-import { getFaviconUrl } from './marketInsightsFormatting';
+import { getFaviconUrl, isXSourceUrl } from './marketInsightsFormatting';
 
 describe('getFaviconUrl', () => {
   it('uses hostname when source is a full URL', () => {
@@ -13,3 +13,32 @@ describe('getFaviconUrl', () => {
     );
   });
 });
+
+describe('isXSourceUrl', () => {
+  it('matches bare x and twitter strings', () => {
+    expect(isXSourceUrl('x')).toBe(true);
+    expect(isXSourceUrl('twitter')).toBe(true);
+    expect(isXSourceUrl('X')).toBe(true);
+    expect(isXSourceUrl('Twitter')).toBe(true);
+  });
+
+  it('matches x.com and twitter.com URLs', () => {
+    expect(isXSourceUrl('https://x.com/user/status/123')).toBe(true);
+    expect(isXSourceUrl('https://twitter.com/user/status/123')).toBe(true);
+    expect(isXSourceUrl('https://www.x.com/user')).toBe(true);
+    expect(isXSourceUrl('x.com')).toBe(true);
+  });
+
+  it('does not match domains that contain x.com as a substring', () => {
+    expect(isXSourceUrl('https://box.com')).toBe(false);
+    expect(isXSourceUrl('https://max.com')).toBe(false);
+    expect(isXSourceUrl('https://coindesk.com/article-about-x.com')).toBe(
+      false,
+    );
+  });
+
+  it('does not match unrelated domains', () => {
+    expect(isXSourceUrl('https://coindesk.com')).toBe(false);
+    expect(isXSourceUrl('https://theblock.co')).toBe(false);
+  });
+});
diff --git a/app/components/UI/MarketInsights/utils/marketInsightsFormatting.ts b/app/components/UI/MarketInsights/utils/marketInsightsFormatting.ts
index aec495bf6395..08df00e09db2 100644
--- a/app/components/UI/MarketInsights/utils/marketInsightsFormatting.ts
+++ b/app/components/UI/MarketInsights/utils/marketInsightsFormatting.ts
@@ -1,3 +1,5 @@
+import type { MarketInsightsSource } from '@metamask/ai-controllers';
+
 export interface RelativeTimeOptions {
   nowLabel?: string;
 }
@@ -38,3 +40,58 @@ export const formatRelativeTime = (
   if (diffHours < 24) return `${diffHours}h ago`;
   return `${diffDays}d ago`;
 };
+
+export const getNormalizedHandle = (author: string): string =>
+  `@${author.replace(/^@+/, '')}`;
+
+export const isXSourceUrl = (source: string): boolean => {
+  const trimmedSource = source.trim();
+  const normalized = trimmedSource.toLowerCase();
+
+  if (normalized === 'x' || normalized === 'twitter') {
+    return true;
+  }
+
+  try {
+    const normalizedSource = trimmedSource.includes('://')
+      ? trimmedSource
+      : `https://${trimmedSource}`;
+    const hostname = new URL(normalizedSource).hostname
+      .replace(/^www\./, '')
+      .toLowerCase();
+    return (
+      hostname === 'x.com' ||
+      hostname.endsWith('.x.com') ||
+      hostname === 'twitter.com' ||
+      hostname.endsWith('.twitter.com')
+    );
+  } catch {
+    return false;
+  }
+};
+
+const SAFE_URL_SCHEMES = ['http:', 'https:'];
+
+export const isSafeUrl = (url: string): boolean => {
+  try {
+    const parsed = new URL(url);
+    return SAFE_URL_SCHEMES.includes(parsed.protocol);
+  } catch {
+    return false;
+  }
+};
+
+export const getUniqueSourcesByFavicon = (
+  sources: MarketInsightsSource[],
+): MarketInsightsSource[] => {
+  const seenFaviconUrls = new Set<string>();
+
+  return sources.filter((source) => {
+    const faviconUrl = getFaviconUrl(source.url);
+    if (seenFaviconUrls.has(faviconUrl)) {
+      return false;
+    }
+    seenFaviconUrls.add(faviconUrl);
+    return true;
+  });
+};
diff --git a/app/components/UI/Name/__snapshots__/Name.test.tsx.snap b/app/components/UI/Name/__snapshots__/Name.test.tsx.snap
index 70a0fc277d60..d5007926157e 100644
--- a/app/components/UI/Name/__snapshots__/Name.test.tsx.snap
+++ b/app/components/UI/Name/__snapshots__/Name.test.tsx.snap
@@ -51,7 +51,7 @@ exports[`Name recognized address renders account wallet name 1`] = `
     <View
       placeholderStyle={
         {
-          "backgroundColor": "#f3f5f9",
+          "backgroundColor": "#f3f3f4",
         }
       }
       useNativeDriver={true}
@@ -98,7 +98,7 @@ exports[`Name recognized address renders account wallet name 1`] = `
                 "backgroundColor": "#eee",
               },
               {
-                "backgroundColor": "#f3f5f9",
+                "backgroundColor": "#f3f3f4",
               },
             ]
           }
@@ -118,7 +118,7 @@ exports[`Name recognized address renders account wallet name 1`] = `
         numberOfLines={1}
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "flexShrink": 1,
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
@@ -134,7 +134,7 @@ exports[`Name recognized address renders account wallet name 1`] = `
         numberOfLines={1}
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 14,
             "letterSpacing": 0,
@@ -200,7 +200,7 @@ exports[`Name recognized address renders image 1`] = `
     <View
       placeholderStyle={
         {
-          "backgroundColor": "#f3f5f9",
+          "backgroundColor": "#f3f3f4",
         }
       }
       useNativeDriver={true}
@@ -252,7 +252,7 @@ exports[`Name recognized address renders image 1`] = `
                 "backgroundColor": "#eee",
               },
               {
-                "backgroundColor": "#f3f5f9",
+                "backgroundColor": "#f3f3f4",
               },
             ]
           }
@@ -272,7 +272,7 @@ exports[`Name recognized address renders image 1`] = `
         numberOfLines={1}
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "flexShrink": 1,
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
@@ -339,7 +339,7 @@ exports[`Name recognized address returns name 1`] = `
     <View
       placeholderStyle={
         {
-          "backgroundColor": "#f3f5f9",
+          "backgroundColor": "#f3f3f4",
         }
       }
       useNativeDriver={true}
@@ -386,7 +386,7 @@ exports[`Name recognized address returns name 1`] = `
                 "backgroundColor": "#eee",
               },
               {
-                "backgroundColor": "#f3f5f9",
+                "backgroundColor": "#f3f3f4",
               },
             ]
           }
@@ -406,7 +406,7 @@ exports[`Name recognized address returns name 1`] = `
         numberOfLines={1}
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "flexShrink": 1,
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
@@ -441,7 +441,7 @@ exports[`Name unknown address displays checksummed address 1`] = `
   <View
     placeholderStyle={
       {
-        "backgroundColor": "#f3f5f9",
+        "backgroundColor": "#f3f3f4",
       }
     }
     useNativeDriver={true}
@@ -488,7 +488,7 @@ exports[`Name unknown address displays checksummed address 1`] = `
               "backgroundColor": "#eee",
             },
             {
-              "backgroundColor": "#f3f5f9",
+              "backgroundColor": "#f3f3f4",
             },
           ]
         }
@@ -501,7 +501,7 @@ exports[`Name unknown address displays checksummed address 1`] = `
     numberOfLines={1}
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "flexShrink": 1,
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
diff --git a/app/components/UI/Navbar/index.js b/app/components/UI/Navbar/index.js
index 7f4c5b7ae8f6..0756aba20f71 100644
--- a/app/components/UI/Navbar/index.js
+++ b/app/components/UI/Navbar/index.js
@@ -48,12 +48,6 @@ import HeaderBase, {
 } from '../../../component-library/components/HeaderBase';
 import getHeaderCompactStandardNavbarOptions from '../../../component-library/components-temp/HeaderCompactStandard/getHeaderCompactStandardNavbarOptions';
 import BottomSheetHeader from '../../../component-library/components/BottomSheets/BottomSheetHeader';
-import AvatarToken from '../../../component-library/components/Avatars/Avatar/variants/AvatarToken';
-import { AvatarSize } from '../../../component-library/components/Avatars/Avatar';
-import BadgeNetwork from '../../../component-library/components/Badges/Badge/variants/BadgeNetwork';
-import BadgeWrapperComponent, {
-  BadgePosition,
-} from '../../../component-library/components/Badges/BadgeWrapper';
 import AddressCopy from '../AddressCopy';
 import PickerAccount from '../../../component-library/components/Pickers/PickerAccount';
 import { createAccountSelectorNavDetails } from '../../../components/Views/AccountSelector';
@@ -74,7 +68,6 @@ import {
 import { withMetaMetrics } from '../Stake/utils/metaMetrics/withMetaMetrics';
 import { BridgeViewMode } from '../Bridge/types';
 import CardButton from '../Card/components/CardButton';
-import { Skeleton } from '../../../component-library/components/Skeleton';
 
 const styles = StyleSheet.create({
   hitSlop: {
@@ -256,7 +249,7 @@ export function getNavigationOptionsTitle(
     headerLeft: () =>
       isFullScreenModal ? null : (
         <ButtonIcon
-          size={ButtonIconSize.Lg}
+          size={ButtonIconSize.Md}
           iconName={IconName.ArrowLeft}
           onPress={navigationPop}
           style={innerStyles.accessories}
@@ -1249,7 +1242,7 @@ export function getNetworkNavbarOptions(
             style={styles.headerLeftButton}
             onPress={() => navigation.pop()}
             testID={CommonSelectorsIDs.BACK_ARROW_BUTTON}
-            size={ButtonIconSize.Lg}
+            size={ButtonIconSize.Md}
             iconName={IconName.ArrowLeft}
             iconColor={IconColor.Default}
           />
@@ -1651,7 +1644,7 @@ export function getPerpsTransactionsDetailsNavbar(navigation, title) {
       <ButtonIcon
         iconName={IconName.Arrow2Left}
         onPress={leftAction}
-        size={ButtonIconSize.Lg}
+        size={ButtonIconSize.Md}
       />
     ),
     headerRight: () => <View style={innerStyles.rightSpacer} />,
@@ -1684,7 +1677,7 @@ export function getPerpsMarketDetailsNavbar(navigation, title) {
       <ButtonIcon
         iconName={IconName.Arrow2Left}
         onPress={leftAction}
-        size={ButtonIconSize.Lg}
+        size={ButtonIconSize.Md}
       />
     ),
   };
@@ -1901,7 +1894,7 @@ export function getStakingNavbar(
     headerLeft: () =>
       hasBackButton ? (
         <ButtonIcon
-          size={ButtonIconSize.Lg}
+          size={ButtonIconSize.Md}
           iconName={IconName.ArrowLeft}
           onPress={handleBackPress}
           style={innerStyles.headerLeft}
@@ -1947,7 +1940,7 @@ export function getDeFiProtocolPositionDetailsNavbarOptions(navigation) {
         style={styles.headerLeftButton}
         onPress={() => navigation.pop()}
         testID={CommonSelectorsIDs.BACK_ARROW_BUTTON}
-        size={ButtonIconSize.Lg}
+        size={ButtonIconSize.Md}
         iconName={IconName.ArrowLeft}
         iconColor={IconColor.Default}
       />
@@ -1955,146 +1948,11 @@ export function getDeFiProtocolPositionDetailsNavbarOptions(navigation) {
   };
 }
 
-/**
- * Function that returns the navigation options for the Ramps Build Quote screen
- *
- * @param {Object} navigation - Navigation object required to navigate between screens
- * @param {Object} options - Options for the navbar
- * @param {string} [options.tokenName] - Name of the selected token (used for avatar)
- * @param {string} [options.tokenSymbol] - Symbol/ticker of the selected token (e.g., "ETH")
- * @param {string} [options.tokenIconUrl] - URL for the token icon
- * @param {string} [options.networkName] - Name of the network
- * @param {Object} [options.networkImageSource] - Image source for the network icon
- * @param {Function} [options.onSettingsPress] - Callback for settings button press
- * @returns {Object} - Navigation options object
- */
-export function getRampsBuildQuoteNavbarOptions(
-  navigation,
-  {
-    tokenName,
-    tokenSymbol,
-    tokenIconUrl,
-    networkName,
-    networkImageSource,
-    onSettingsPress,
-  } = {},
-) {
-  const innerStyles = StyleSheet.create({
-    centerContainer: {
-      flexDirection: 'row',
-      alignItems: 'center',
-      gap: 16,
-    },
-    labelsContainer: {
-      gap: 0,
-      marginTop: -2,
-    },
-    backButton: {
-      marginLeft: 16,
-    },
-    skeletonAvatar: {
-      borderRadius: 20,
-    },
-    skeletonTitle: {
-      borderRadius: 4,
-    },
-    skeletonSubtitle: {
-      borderRadius: 4,
-      marginTop: 4,
-    },
-  });
-
-  const isLoading = !tokenName || !tokenSymbol || !networkName;
-
-  return {
-    header: () => (
-      <HeaderBase
-        includesTopInset
-        variant={HeaderBaseVariant.Display}
-        twClassName="gap-2"
-        startAccessory={
-          <ButtonIcon
-            style={innerStyles.backButton}
-            onPress={() => navigation.goBack()}
-            size={ButtonIconSize.Lg}
-            iconName={IconName.ArrowLeft}
-            iconColor={IconColor.Default}
-            testID="build-quote-back-button"
-          />
-        }
-        endAccessory={
-          <ButtonIcon
-            style={styles.headerRightButton}
-            onPress={onSettingsPress}
-            size={ButtonIconSize.Lg}
-            iconName={IconName.Setting}
-            iconColor={IconColor.Default}
-            testID="build-quote-settings-button"
-          />
-        }
-      >
-        <View style={innerStyles.centerContainer}>
-          {isLoading ? (
-            <>
-              <Skeleton
-                width={40}
-                height={40}
-                style={innerStyles.skeletonAvatar}
-              />
-              <View style={innerStyles.labelsContainer}>
-                <Skeleton
-                  width={80}
-                  height={20}
-                  style={innerStyles.skeletonTitle}
-                />
-                <Skeleton
-                  width={100}
-                  height={16}
-                  style={innerStyles.skeletonSubtitle}
-                />
-              </View>
-            </>
-          ) : (
-            <>
-              <BadgeWrapperComponent
-                badgePosition={BadgePosition.BottomRight}
-                badgeElement={
-                  <BadgeNetwork
-                    name={networkName}
-                    imageSource={networkImageSource}
-                  />
-                }
-              >
-                <AvatarToken
-                  name={tokenName}
-                  imageSource={{ uri: tokenIconUrl }}
-                  size={AvatarSize.Lg}
-                />
-              </BadgeWrapperComponent>
-              <View style={innerStyles.labelsContainer}>
-                <MorphText variant={TextVariant.HeadingSM}>
-                  {strings('fiat_on_ramp.buy', { ticker: tokenSymbol })}
-                </MorphText>
-                <MorphText
-                  variant={TextVariant.BodySM}
-                  color={TextColor.Alternative}
-                >
-                  {strings('fiat_on_ramp.on_network', { networkName })}
-                </MorphText>
-              </View>
-            </>
-          )}
-        </View>
-      </HeaderBase>
-    ),
-  };
-}
-
 export function getRampsOrderDetailsNavbarOptions(
   navigation,
   { title, showBack = true },
   theme,
-  onClose = undefined,
+  onClose,
 ) {
   let startButtonIconProps;
   if (showBack) {
diff --git a/app/components/UI/NavbarBrowserTitle/__snapshots__/index.test.tsx.snap b/app/components/UI/NavbarBrowserTitle/__snapshots__/index.test.tsx.snap
index 341e1674b1ab..c6d500052cb1 100644
--- a/app/components/UI/NavbarBrowserTitle/__snapshots__/index.test.tsx.snap
+++ b/app/components/UI/NavbarBrowserTitle/__snapshots__/index.test.tsx.snap
@@ -27,7 +27,7 @@ exports[`NavbarBrowserTitle should render correctly 1`] = `
       style={
         [
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 14,
             "textAlign": "center",
@@ -48,7 +48,7 @@ exports[`NavbarBrowserTitle should render correctly 1`] = `
             "fontSize": 14,
           },
           {
-            "color": "#121314",
+            "color": "#131416",
             "marginLeft": 10,
             "marginTop": 2,
           },
@@ -92,7 +92,7 @@ exports[`NavbarBrowserTitle should render correctly 1`] = `
       numberOfLines={1}
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 11,
           "lineHeight": 11,
diff --git a/app/components/UI/NetworkImages/__snapshots__/index.test.tsx.snap b/app/components/UI/NetworkImages/__snapshots__/index.test.tsx.snap
index dd59c30e8439..da14fc2281fe 100644
--- a/app/components/UI/NetworkImages/__snapshots__/index.test.tsx.snap
+++ b/app/components/UI/NetworkImages/__snapshots__/index.test.tsx.snap
@@ -37,7 +37,7 @@ exports[`NetworkImageComponent should render correctly 1`] = `
     testID="button-icon-test-id"
   >
     <SvgMock
-      color="#121314"
+      color="#131416"
       fill="currentColor"
       height={20}
       name="ArrowDown"
diff --git a/app/components/UI/NetworkInfo/__snapshots__/index.test.tsx.snap b/app/components/UI/NetworkInfo/__snapshots__/index.test.tsx.snap
index 9cfefd58de7b..2b24dd7fd05f 100644
--- a/app/components/UI/NetworkInfo/__snapshots__/index.test.tsx.snap
+++ b/app/components/UI/NetworkInfo/__snapshots__/index.test.tsx.snap
@@ -20,7 +20,7 @@ exports[`NetworkInfo render correctly 1`] = `
     <Text
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Bold",
           "fontSize": 16,
           "marginVertical": 10,
@@ -42,7 +42,7 @@ exports[`NetworkInfo render correctly 1`] = `
         style={
           {
             "alignItems": "center",
-            "backgroundColor": "#b7bbc866",
+            "backgroundColor": "#b4b4b566",
             "borderRadius": 40,
             "flexDirection": "row",
             "justifyContent": "center",
@@ -79,7 +79,7 @@ exports[`NetworkInfo render correctly 1`] = `
         <Text
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontSize": 15,
               "marginLeft": 8,
               "paddingRight": 10,
@@ -95,7 +95,7 @@ exports[`NetworkInfo render correctly 1`] = `
     <Text
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Bold",
           "fontSize": 14,
           "marginBottom": 15,
@@ -132,7 +132,7 @@ exports[`NetworkInfo render correctly 1`] = `
           <Text
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "marginRight": 10,
               }
             }
@@ -143,7 +143,7 @@ exports[`NetworkInfo render correctly 1`] = `
           <Text
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "width": "94%",
               }
             }
@@ -173,7 +173,7 @@ exports[`NetworkInfo render correctly 1`] = `
           <Text
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "marginRight": 10,
               }
             }
@@ -184,7 +184,7 @@ exports[`NetworkInfo render correctly 1`] = `
           <Text
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "width": "94%",
               }
             }
@@ -224,7 +224,7 @@ exports[`NetworkInfo render correctly 1`] = `
           <Text
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "marginRight": 10,
               }
             }
@@ -235,7 +235,7 @@ exports[`NetworkInfo render correctly 1`] = `
           <Text
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "width": "94%",
               }
             }
@@ -275,7 +275,7 @@ exports[`NetworkInfo render correctly 1`] = `
               "minHeight": 50,
             },
             {
-              "borderColor": "#b7bbc866",
+              "borderColor": "#b4b4b566",
               "marginVertical": 20,
             },
           ],
@@ -336,7 +336,7 @@ exports[`NetworkInfo render correctly with EVM network without ticker 1`] = `
     <Text
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Bold",
           "fontSize": 16,
           "marginVertical": 10,
@@ -358,7 +358,7 @@ exports[`NetworkInfo render correctly with EVM network without ticker 1`] = `
         style={
           {
             "alignItems": "center",
-            "backgroundColor": "#b7bbc866",
+            "backgroundColor": "#b4b4b566",
             "borderRadius": 40,
             "flexDirection": "row",
             "justifyContent": "center",
@@ -370,7 +370,7 @@ exports[`NetworkInfo render correctly with EVM network without ticker 1`] = `
           style={
             {
               "alignItems": "center",
-              "backgroundColor": "#f3f5f9",
+              "backgroundColor": "#f3f3f4",
               "borderRadius": 16,
               "borderWidth": 1,
               "height": 32,
@@ -384,7 +384,7 @@ exports[`NetworkInfo render correctly with EVM network without ticker 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -398,7 +398,7 @@ exports[`NetworkInfo render correctly with EVM network without ticker 1`] = `
         <Text
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontSize": 15,
               "marginLeft": 8,
               "paddingRight": 10,
@@ -413,7 +413,7 @@ exports[`NetworkInfo render correctly with EVM network without ticker 1`] = `
       <Text
         style={
           {
-            "color": "#b7bbc866",
+            "color": "#b4b4b566",
             "fontFamily": "Geist-Regular",
             "fontSize": 10,
             "paddingVertical": 5,
@@ -427,7 +427,7 @@ exports[`NetworkInfo render correctly with EVM network without ticker 1`] = `
     <Text
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Bold",
           "fontSize": 14,
           "marginBottom": 15,
@@ -464,7 +464,7 @@ exports[`NetworkInfo render correctly with EVM network without ticker 1`] = `
           <Text
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "marginRight": 10,
               }
             }
@@ -475,7 +475,7 @@ exports[`NetworkInfo render correctly with EVM network without ticker 1`] = `
           <Text
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "width": "94%",
               }
             }
@@ -505,7 +505,7 @@ exports[`NetworkInfo render correctly with EVM network without ticker 1`] = `
           <Text
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "marginRight": 10,
               }
             }
@@ -516,7 +516,7 @@ exports[`NetworkInfo render correctly with EVM network without ticker 1`] = `
           <Text
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "width": "94%",
               }
             }
@@ -556,7 +556,7 @@ exports[`NetworkInfo render correctly with EVM network without ticker 1`] = `
           <Text
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "marginRight": 10,
               }
             }
@@ -567,7 +567,7 @@ exports[`NetworkInfo render correctly with EVM network without ticker 1`] = `
           <Text
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "width": "94%",
               }
             }
@@ -607,7 +607,7 @@ exports[`NetworkInfo render correctly with EVM network without ticker 1`] = `
               "minHeight": 50,
             },
             {
-              "borderColor": "#b7bbc866",
+              "borderColor": "#b4b4b566",
               "marginVertical": 20,
             },
           ],
@@ -668,7 +668,7 @@ exports[`NetworkInfo render correctly with non-EVM selected 1`] = `
     <Text
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Bold",
           "fontSize": 16,
           "marginVertical": 10,
@@ -690,7 +690,7 @@ exports[`NetworkInfo render correctly with non-EVM selected 1`] = `
         style={
           {
             "alignItems": "center",
-            "backgroundColor": "#b7bbc866",
+            "backgroundColor": "#b4b4b566",
             "borderRadius": 40,
             "flexDirection": "row",
             "justifyContent": "center",
@@ -727,7 +727,7 @@ exports[`NetworkInfo render correctly with non-EVM selected 1`] = `
         <Text
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontSize": 15,
               "marginLeft": 8,
               "paddingRight": 10,
@@ -743,7 +743,7 @@ exports[`NetworkInfo render correctly with non-EVM selected 1`] = `
     <Text
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Bold",
           "fontSize": 14,
           "marginBottom": 15,
@@ -780,7 +780,7 @@ exports[`NetworkInfo render correctly with non-EVM selected 1`] = `
           <Text
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "marginRight": 10,
               }
             }
@@ -791,7 +791,7 @@ exports[`NetworkInfo render correctly with non-EVM selected 1`] = `
           <Text
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "width": "94%",
               }
             }
@@ -821,7 +821,7 @@ exports[`NetworkInfo render correctly with non-EVM selected 1`] = `
           <Text
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "marginRight": 10,
               }
             }
@@ -832,7 +832,7 @@ exports[`NetworkInfo render correctly with non-EVM selected 1`] = `
           <Text
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "width": "94%",
               }
             }
@@ -862,7 +862,7 @@ exports[`NetworkInfo render correctly with non-EVM selected 1`] = `
               "minHeight": 50,
             },
             {
-              "borderColor": "#b7bbc866",
+              "borderColor": "#b4b4b566",
               "marginVertical": 20,
             },
           ],
diff --git a/app/components/UI/NetworkManager/index.test.tsx b/app/components/UI/NetworkManager/index.test.tsx
index aca35c37399e..6649bf751bb0 100644
--- a/app/components/UI/NetworkManager/index.test.tsx
+++ b/app/components/UI/NetworkManager/index.test.tsx
@@ -7,6 +7,7 @@ import NetworkManager from './index';
 import { useNetworksByNamespace } from '../../hooks/useNetworksByNamespace/useNetworksByNamespace';
 import { useNetworkEnablement } from '../../hooks/useNetworkEnablement/useNetworkEnablement';
 import Engine from '../../../core/Engine';
+import { MetaMetricsEvents } from '../../../core/Analytics/MetaMetrics.events';
 
 // Create mock functions that we can spy on
 const mockNavigate = jest.fn();
@@ -128,16 +129,12 @@ jest.mock('../../../component-library/hooks/useStyles', () => ({
   }),
 }));
 
-jest.mock('../../hooks/useMetrics', () => ({
-  useMetrics: () => ({
+jest.mock('../../hooks/useAnalytics/useAnalytics', () => ({
+  useAnalytics: () => ({
     trackEvent: mockTrackEvent,
     createEventBuilder: mockCreateEventBuilder,
     addTraitsToUser: mockAddTraitsToUser,
   }),
-  MetaMetricsEvents: {
-    ASSET_FILTER_SELECTED: 'asset_filter_selected',
-    ASSET_FILTER_CUSTOM_SELECTED: 'asset_filter_custom_selected',
-  },
 }));
 
 jest.mock('../../hooks/useNetworksByNamespace/useNetworksByNamespace', () => ({
@@ -259,14 +256,6 @@ jest.mock('../../../core/Engine', () => ({
   },
 }));
 
-jest.mock('../../../core/Analytics', () => ({
-  MetaMetrics: {
-    getInstance: () => ({
-      addTraitsToUser: mockAddTraitsToUser,
-    }),
-  },
-}));
-
 jest.mock('../../../util/metrics/MultichainAPI/networkMetricUtils', () => ({
   removeItemFromChainIdList: (chainId: string) => ({ removedChainId: chainId }),
 }));
@@ -799,7 +788,7 @@ describe('NetworkManager Component', () => {
       // Assert - Analytics event is tracked
       expect(mockTrackEvent).toHaveBeenCalledWith({ type: 'test_event' });
       expect(mockCreateEventBuilder).toHaveBeenCalledWith(
-        'asset_filter_selected',
+        MetaMetricsEvents.ASSET_FILTER_SELECTED,
       );
     });
   });
diff --git a/app/components/UI/NetworkManager/index.tsx b/app/components/UI/NetworkManager/index.tsx
index 5c7a712f0e9e..10c172d7a93d 100644
--- a/app/components/UI/NetworkManager/index.tsx
+++ b/app/components/UI/NetworkManager/index.tsx
@@ -14,7 +14,8 @@ import { toHex } from '@metamask/controller-utils';
 import Engine from '../../../core/Engine';
 import { removeItemFromChainIdList } from '../../../util/metrics/MultichainAPI/networkMetricUtils';
 import { useTheme } from '../../../util/theme';
-import { MetaMetricsEvents, useMetrics } from '../../hooks/useMetrics';
+import { useAnalytics } from '../../hooks/useAnalytics/useAnalytics';
+import { MetaMetricsEvents } from '../../../core/Analytics/MetaMetrics.events';
 import { strings } from '../../../../locales/i18n';
 import BottomSheetHeader from '../../../component-library/components/BottomSheets/BottomSheetHeader/BottomSheetHeader';
 import HeaderCompactStandard from '../../../component-library/components-temp/HeaderCompactStandard';
@@ -82,7 +83,7 @@ const NetworkManager = () => {
   const navigation = useNavigation();
   const { colors } = useTheme();
   const { styles } = useStyles(createStyles, { colors });
-  const { trackEvent, createEventBuilder, addTraitsToUser } = useMetrics();
+  const { trackEvent, createEventBuilder, addTraitsToUser } = useAnalytics();
   const { disableNetwork, enabledNetworksByNamespace } = useNetworkEnablement();
 
   const enabledNetworks = useMemo(() => {
diff --git a/app/components/UI/NetworkModal/__snapshots__/index.test.tsx.snap b/app/components/UI/NetworkModal/__snapshots__/index.test.tsx.snap
index 9617f9a86482..f31bd1e7c4dd 100644
--- a/app/components/UI/NetworkModal/__snapshots__/index.test.tsx.snap
+++ b/app/components/UI/NetworkModal/__snapshots__/index.test.tsx.snap
@@ -125,7 +125,7 @@ exports[`NetworkDetails renders correctly 1`] = `
             <View
               style={
                 {
-                  "backgroundColor": "#b7bbc866",
+                  "backgroundColor": "#b4b4b566",
                   "borderRadius": 2,
                   "height": 4,
                   "width": 40,
@@ -181,9 +181,9 @@ exports[`NetworkDetails renders correctly 1`] = `
                     accessibilityRole="text"
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Bold",
-                        "fontSize": 18,
+                        "fontSize": 20,
                         "letterSpacing": 0,
                         "lineHeight": 24,
                       }
@@ -213,7 +213,7 @@ exports[`NetworkDetails renders correctly 1`] = `
                       {
                         "alignItems": "center",
                         "alignSelf": "center",
-                        "backgroundColor": "#f3f5f9",
+                        "backgroundColor": "#f3f3f4",
                         "borderRadius": 16,
                         "flexDirection": "row",
                         "height": 32,
@@ -259,7 +259,7 @@ exports[`NetworkDetails renders correctly 1`] = `
                       numberOfLines={1}
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "flexShrink": 1,
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
@@ -277,7 +277,7 @@ exports[`NetworkDetails renders correctly 1`] = `
                     accessibilityRole="text"
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -293,7 +293,7 @@ exports[`NetworkDetails renders correctly 1`] = `
                       onPress={[Function]}
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -318,7 +318,7 @@ exports[`NetworkDetails renders correctly 1`] = `
                     onGestureHandlerStateChange={[Function]}
                     style={
                       {
-                        "borderColor": "#b7bbc8",
+                        "borderColor": "#949596",
                         "borderRadius": 10,
                         "borderWidth": 1,
                         "flex": 1,
@@ -332,7 +332,7 @@ exports[`NetworkDetails renders correctly 1`] = `
                         accessibilityRole="text"
                         style={
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "fontFamily": "Geist-Medium",
                             "fontSize": 16,
                             "letterSpacing": 0,
@@ -346,7 +346,7 @@ exports[`NetworkDetails renders correctly 1`] = `
                         accessibilityRole="text"
                         style={
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "fontFamily": "Geist-Regular",
                             "fontSize": 16,
                             "letterSpacing": 0,
@@ -370,7 +370,7 @@ exports[`NetworkDetails renders correctly 1`] = `
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#121314",
+                              "color": "#131416",
                               "fontFamily": "Geist-Medium",
                               "fontSize": 16,
                               "letterSpacing": 0,
@@ -385,7 +385,7 @@ exports[`NetworkDetails renders correctly 1`] = `
                         accessibilityRole="text"
                         style={
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "fontFamily": "Geist-Regular",
                             "fontSize": 16,
                             "letterSpacing": 0,
@@ -400,7 +400,7 @@ exports[`NetworkDetails renders correctly 1`] = `
                         accessibilityRole="text"
                         style={
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "fontFamily": "Geist-Medium",
                             "fontSize": 16,
                             "letterSpacing": 0,
@@ -414,7 +414,7 @@ exports[`NetworkDetails renders correctly 1`] = `
                         accessibilityRole="text"
                         style={
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "fontFamily": "Geist-Regular",
                             "fontSize": 16,
                             "letterSpacing": 0,
@@ -429,7 +429,7 @@ exports[`NetworkDetails renders correctly 1`] = `
                         accessibilityRole="text"
                         style={
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "fontFamily": "Geist-Medium",
                             "fontSize": 16,
                             "letterSpacing": 0,
@@ -443,7 +443,7 @@ exports[`NetworkDetails renders correctly 1`] = `
                         accessibilityRole="text"
                         style={
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "fontFamily": "Geist-Regular",
                             "fontSize": 16,
                             "letterSpacing": 0,
@@ -458,7 +458,7 @@ exports[`NetworkDetails renders correctly 1`] = `
                         accessibilityRole="text"
                         style={
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "fontFamily": "Geist-Medium",
                             "fontSize": 16,
                             "letterSpacing": 0,
@@ -472,7 +472,7 @@ exports[`NetworkDetails renders correctly 1`] = `
                         accessibilityRole="text"
                         style={
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "fontFamily": "Geist-Regular",
                             "fontSize": 16,
                             "letterSpacing": 0,
@@ -507,7 +507,7 @@ exports[`NetworkDetails renders correctly 1`] = `
                     {
                       "alignItems": "center",
                       "alignSelf": "flex-start",
-                      "backgroundColor": "#3c4d9d0f",
+                      "backgroundColor": "#b4b4b528",
                       "borderColor": "transparent",
                       "borderRadius": 12,
                       "borderWidth": 1,
@@ -525,7 +525,7 @@ exports[`NetworkDetails renders correctly 1`] = `
                     accessibilityRole="text"
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Medium",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -547,7 +547,7 @@ exports[`NetworkDetails renders correctly 1`] = `
                     {
                       "alignItems": "center",
                       "alignSelf": "flex-start",
-                      "backgroundColor": "#121314",
+                      "backgroundColor": "#131416",
                       "borderRadius": 12,
                       "flex": 1,
                       "flexDirection": "row",
diff --git a/app/components/UI/NetworkMultiSelector/NetworkMultiSelector.test.tsx b/app/components/UI/NetworkMultiSelector/NetworkMultiSelector.test.tsx
index 0eb1876f3a45..2f600284f2b1 100644
--- a/app/components/UI/NetworkMultiSelector/NetworkMultiSelector.test.tsx
+++ b/app/components/UI/NetworkMultiSelector/NetworkMultiSelector.test.tsx
@@ -16,7 +16,8 @@ import NetworkMultiSelector from './NetworkMultiSelector';
 import { NETWORK_MULTI_SELECTOR_TEST_IDS } from './NetworkMultiSelector.constants';
 import { selectSelectedInternalAccountByScope } from '../../../selectors/multichainAccounts/accounts';
 import { InternalAccount } from '@metamask/keyring-internal-api';
-import { useMetrics } from '../../hooks/useMetrics';
+import { useAnalytics } from '../../hooks/useAnalytics/useAnalytics';
+import { createMockUseAnalyticsHook } from '../../../util/test/analyticsMock';
 import { MetaMetricsEvents } from '../../../core/Analytics';
 import {
   selectEvmNetworkConfigurationsByChainId,
@@ -115,8 +116,8 @@ jest.mock('../../../util/networks/customNetworks', () => ({
   PopularList: [],
 }));
 
-jest.mock('../../hooks/useMetrics', () => ({
-  useMetrics: jest.fn(),
+jest.mock('../../hooks/useAnalytics/useAnalytics', () => ({
+  useAnalytics: jest.fn(),
 }));
 
 jest.mock('../../../core/Engine', () => ({
@@ -216,7 +217,7 @@ describe('NetworkMultiSelector', () => {
     typeof useNetworksToUse
   >;
   const mockUseSelector = jest.mocked(useSelector);
-  const mockUseMetrics = useMetrics as jest.MockedFunction<typeof useMetrics>;
+  const mockUseAnalytics = jest.mocked(useAnalytics);
 
   // Shared helper functions for all tests
   const createMockNetwork = (
@@ -461,19 +462,12 @@ describe('NetworkMultiSelector', () => {
       build: mockBuild,
     });
 
-    mockUseMetrics.mockReturnValue({
-      trackEvent: mockTrackEvent,
-      createEventBuilder: mockCreateEventBuilder,
-      isEnabled: () => true,
-      enable: jest.fn(),
-      addTraitsToUser: jest.fn(),
-      createDataDeletionTask: jest.fn(),
-      checkDataDeleteStatus: jest.fn(),
-      getDeleteRegulationCreationDate: jest.fn(),
-      getDeleteRegulationId: jest.fn(),
-      isDataRecorded: jest.fn(),
-      getMetaMetricsId: jest.fn(),
-    });
+    mockUseAnalytics.mockReturnValue(
+      createMockUseAnalyticsHook({
+        trackEvent: mockTrackEvent,
+        createEventBuilder: mockCreateEventBuilder,
+      }),
+    );
   });
 
   // TODO: Refactor tests - they aren't up to par
diff --git a/app/components/UI/NetworkMultiSelector/NetworkMultiSelector.tsx b/app/components/UI/NetworkMultiSelector/NetworkMultiSelector.tsx
index 8561e92a1962..376323262486 100644
--- a/app/components/UI/NetworkMultiSelector/NetworkMultiSelector.tsx
+++ b/app/components/UI/NetworkMultiSelector/NetworkMultiSelector.tsx
@@ -36,7 +36,7 @@ import {
   selectIsEvmNetworkSelected,
   selectSelectedNonEvmNetworkChainId,
 } from '../../../selectors/multichainNetworkController';
-import { useMetrics } from '../../hooks/useMetrics';
+import { useAnalytics } from '../../hooks/useAnalytics/useAnalytics';
 import { MetaMetricsEvents } from '../../../core/Analytics';
 import { getDecimalChainId } from '../../../util/networks';
 import { toHex } from '@metamask/controller-utils';
@@ -94,7 +94,7 @@ const NetworkMultiSelector = ({
   const nonEvmNetworkConfigurations = useSelector(
     selectNonEvmNetworkConfigurationsByChainId,
   );
-  const { trackEvent, createEventBuilder } = useMetrics();
+  const { trackEvent, createEventBuilder } = useAnalytics();
   const isEvmSelected = useSelector(selectIsEvmNetworkSelected);
   const selectedNonEvmChainId = useSelector(selectSelectedNonEvmNetworkChainId);
   const currentEvmChainId = useSelector(selectEvmChainId);
diff --git a/app/components/UI/NetworkMultiSelectorList/NetworkMultiSelectorList.styles.ts b/app/components/UI/NetworkMultiSelectorList/NetworkMultiSelectorList.styles.ts
index 181b8ed0e06b..ffb039e413cc 100644
--- a/app/components/UI/NetworkMultiSelectorList/NetworkMultiSelectorList.styles.ts
+++ b/app/components/UI/NetworkMultiSelectorList/NetworkMultiSelectorList.styles.ts
@@ -27,7 +27,6 @@ const createStyles = (params: { theme: Theme }) => {
     },
     noNetworkFeeContainer: {
       alignSelf: 'center',
-      height: 22,
     },
   });
 };
diff --git a/app/components/UI/NetworkMultiSelectorList/NetworkMultiSelectorList.tsx b/app/components/UI/NetworkMultiSelectorList/NetworkMultiSelectorList.tsx
index 34c373ba32c7..0211b8ac400b 100644
--- a/app/components/UI/NetworkMultiSelectorList/NetworkMultiSelectorList.tsx
+++ b/app/components/UI/NetworkMultiSelectorList/NetworkMultiSelectorList.tsx
@@ -29,7 +29,6 @@ import Cell, {
 } from '../../../component-library/components/Cells/Cell/index.ts';
 import Text, {
   TextVariant,
-  TextColor,
 } from '../../../component-library/components/Texts/Text/index.ts';
 import { isTestNet } from '../../../util/networks/index.js';
 import hideProtocolFromUrl from '../../../util/hideProtocolFromUrl';
@@ -284,13 +283,17 @@ const NetworkMultiSelectList = ({
                   <TagColored
                     color={TagColor.Success}
                     style={styles.noNetworkFeeContainer}
+                    labelProps={{
+                      variant: TextVariant.BodySM,
+                      style: {
+                        textTransform: 'none',
+                        textAlign: 'center',
+                        bottom: 1,
+                        fontWeight: 'normal',
+                      },
+                    }}
                   >
-                    <Text
-                      variant={TextVariant.BodySM}
-                      color={TextColor.Success}
-                    >
-                      {strings('networks.no_network_fee')}
-                    </Text>
+                    {strings('networks.no_network_fee')}
                   </TagColored>
                 </Box>
               ) : (
diff --git a/app/components/UI/NetworkSelectorList/__snapshots__/NetworkSelectorList.test.tsx.snap b/app/components/UI/NetworkSelectorList/__snapshots__/NetworkSelectorList.test.tsx.snap
index 47f51cb0876e..f4d37e1f85f3 100644
--- a/app/components/UI/NetworkSelectorList/__snapshots__/NetworkSelectorList.test.tsx.snap
+++ b/app/components/UI/NetworkSelectorList/__snapshots__/NetworkSelectorList.test.tsx.snap
@@ -113,7 +113,7 @@ exports[`NetworkSelectorList renders correctly with default props 1`] = `
                       {
                         "alignItems": "center",
                         "backgroundColor": "#ffffff",
-                        "borderColor": "#b7bbc8",
+                        "borderColor": "#949596",
                         "borderRadius": 4,
                         "borderWidth": 2,
                         "height": 20,
@@ -186,7 +186,7 @@ exports[`NetworkSelectorList renders correctly with default props 1`] = `
                     numberOfLines={1}
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -350,7 +350,7 @@ exports[`NetworkSelectorList renders correctly with default props 1`] = `
                     numberOfLines={1}
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -370,7 +370,7 @@ exports[`NetworkSelectorList renders correctly with default props 1`] = `
             accessible={true}
             style={
               {
-                "backgroundColor": "#3c4d9d0f",
+                "backgroundColor": "#b4b4b528",
                 "bottom": 0,
                 "flexDirection": "row",
                 "left": 0,
diff --git a/app/components/UI/NetworkVerificationInfo/__snapshots__/NetworkVerificationInfo.test.tsx.snap b/app/components/UI/NetworkVerificationInfo/__snapshots__/NetworkVerificationInfo.test.tsx.snap
index 241cd29a5fc4..10b38dec4d98 100644
--- a/app/components/UI/NetworkVerificationInfo/__snapshots__/NetworkVerificationInfo.test.tsx.snap
+++ b/app/components/UI/NetworkVerificationInfo/__snapshots__/NetworkVerificationInfo.test.tsx.snap
@@ -39,9 +39,9 @@ exports[`NetworkVerificationInfo renders correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Bold",
-            "fontSize": 18,
+            "fontSize": 20,
             "letterSpacing": 0,
             "lineHeight": 24,
           }
@@ -71,7 +71,7 @@ exports[`NetworkVerificationInfo renders correctly 1`] = `
           {
             "alignItems": "center",
             "alignSelf": "center",
-            "backgroundColor": "#f3f5f9",
+            "backgroundColor": "#f3f3f4",
             "borderRadius": 16,
             "flexDirection": "row",
             "height": 32,
@@ -117,7 +117,7 @@ exports[`NetworkVerificationInfo renders correctly 1`] = `
           numberOfLines={1}
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "flexShrink": 1,
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
@@ -179,11 +179,11 @@ exports[`NetworkVerificationInfo renders correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
-                "fontSize": 16,
+                "fontSize": 14,
                 "letterSpacing": 0,
-                "lineHeight": 24,
+                "lineHeight": 22,
               }
             }
           >
@@ -217,7 +217,7 @@ exports[`NetworkVerificationInfo renders correctly 1`] = `
             testID="banner-close-button-icon"
           >
             <SvgMock
-              color="#121314"
+              color="#131416"
               fill="currentColor"
               height={16}
               name="Close"
@@ -236,7 +236,7 @@ exports[`NetworkVerificationInfo renders correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -252,7 +252,7 @@ exports[`NetworkVerificationInfo renders correctly 1`] = `
           onPress={[Function]}
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -277,7 +277,7 @@ exports[`NetworkVerificationInfo renders correctly 1`] = `
         onGestureHandlerStateChange={[Function]}
         style={
           {
-            "borderColor": "#b7bbc8",
+            "borderColor": "#949596",
             "borderRadius": 10,
             "borderWidth": 1,
             "flex": 1,
@@ -291,7 +291,7 @@ exports[`NetworkVerificationInfo renders correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Medium",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -305,7 +305,7 @@ exports[`NetworkVerificationInfo renders correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -329,7 +329,7 @@ exports[`NetworkVerificationInfo renders correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Medium",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -344,7 +344,7 @@ exports[`NetworkVerificationInfo renders correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -359,7 +359,7 @@ exports[`NetworkVerificationInfo renders correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Medium",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -373,7 +373,7 @@ exports[`NetworkVerificationInfo renders correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -388,7 +388,7 @@ exports[`NetworkVerificationInfo renders correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Medium",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -402,7 +402,7 @@ exports[`NetworkVerificationInfo renders correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -417,7 +417,7 @@ exports[`NetworkVerificationInfo renders correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Medium",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -431,7 +431,7 @@ exports[`NetworkVerificationInfo renders correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -466,7 +466,7 @@ exports[`NetworkVerificationInfo renders correctly 1`] = `
         {
           "alignItems": "center",
           "alignSelf": "flex-start",
-          "backgroundColor": "#3c4d9d0f",
+          "backgroundColor": "#b4b4b528",
           "borderColor": "transparent",
           "borderRadius": 12,
           "borderWidth": 1,
@@ -484,7 +484,7 @@ exports[`NetworkVerificationInfo renders correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -506,7 +506,7 @@ exports[`NetworkVerificationInfo renders correctly 1`] = `
         {
           "alignItems": "center",
           "alignSelf": "flex-start",
-          "backgroundColor": "#121314",
+          "backgroundColor": "#131416",
           "borderRadius": 12,
           "flex": 1,
           "flexDirection": "row",
@@ -578,9 +578,9 @@ exports[`NetworkVerificationInfo renders updated details when isNetworkRpcUpdate
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Bold",
-            "fontSize": 18,
+            "fontSize": 20,
             "letterSpacing": 0,
             "lineHeight": 24,
           }
@@ -610,7 +610,7 @@ exports[`NetworkVerificationInfo renders updated details when isNetworkRpcUpdate
           {
             "alignItems": "center",
             "alignSelf": "center",
-            "backgroundColor": "#f3f5f9",
+            "backgroundColor": "#f3f3f4",
             "borderRadius": 16,
             "flexDirection": "row",
             "height": 32,
@@ -656,7 +656,7 @@ exports[`NetworkVerificationInfo renders updated details when isNetworkRpcUpdate
           numberOfLines={1}
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "flexShrink": 1,
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
@@ -674,7 +674,7 @@ exports[`NetworkVerificationInfo renders updated details when isNetworkRpcUpdate
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -687,7 +687,7 @@ exports[`NetworkVerificationInfo renders updated details when isNetworkRpcUpdate
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -712,7 +712,7 @@ exports[`NetworkVerificationInfo renders updated details when isNetworkRpcUpdate
         onGestureHandlerStateChange={[Function]}
         style={
           {
-            "borderColor": "#b7bbc8",
+            "borderColor": "#949596",
             "borderRadius": 10,
             "borderWidth": 1,
             "flex": 1,
@@ -726,7 +726,7 @@ exports[`NetworkVerificationInfo renders updated details when isNetworkRpcUpdate
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Medium",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -740,7 +740,7 @@ exports[`NetworkVerificationInfo renders updated details when isNetworkRpcUpdate
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -849,7 +849,7 @@ exports[`NetworkVerificationInfo renders updated details when isNetworkRpcUpdate
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -864,7 +864,7 @@ exports[`NetworkVerificationInfo renders updated details when isNetworkRpcUpdate
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Medium",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -878,7 +878,7 @@ exports[`NetworkVerificationInfo renders updated details when isNetworkRpcUpdate
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -893,7 +893,7 @@ exports[`NetworkVerificationInfo renders updated details when isNetworkRpcUpdate
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Medium",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -907,7 +907,7 @@ exports[`NetworkVerificationInfo renders updated details when isNetworkRpcUpdate
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -922,7 +922,7 @@ exports[`NetworkVerificationInfo renders updated details when isNetworkRpcUpdate
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Medium",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -936,7 +936,7 @@ exports[`NetworkVerificationInfo renders updated details when isNetworkRpcUpdate
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -969,7 +969,7 @@ exports[`NetworkVerificationInfo renders updated details when isNetworkRpcUpdate
         {
           "alignItems": "center",
           "alignSelf": "flex-start",
-          "backgroundColor": "#3c4d9d0f",
+          "backgroundColor": "#b4b4b528",
           "borderColor": "transparent",
           "borderRadius": 12,
           "borderWidth": 1,
@@ -987,7 +987,7 @@ exports[`NetworkVerificationInfo renders updated details when isNetworkRpcUpdate
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -1009,7 +1009,7 @@ exports[`NetworkVerificationInfo renders updated details when isNetworkRpcUpdate
         {
           "alignItems": "center",
           "alignSelf": "flex-start",
-          "backgroundColor": "#121314",
+          "backgroundColor": "#131416",
           "borderRadius": 12,
           "flex": 1,
           "flexDirection": "row",
diff --git a/app/components/UI/NftGrid/NftGrid.test.tsx b/app/components/UI/NftGrid/NftGrid.test.tsx
index 3495f1892d2a..8e7c234eb571 100644
--- a/app/components/UI/NftGrid/NftGrid.test.tsx
+++ b/app/components/UI/NftGrid/NftGrid.test.tsx
@@ -1063,4 +1063,172 @@ describe('NftGrid', () => {
 
     expect(mockAbortDetection).not.toHaveBeenCalled();
   });
+
+  it('tracks Position Screen Viewed event when isFullView is true and data is loaded', async () => {
+    const mockCollectibles = { '0x1': [mockNft] };
+    const store = mockStore(initialState);
+
+    // Simulate fetch cycle: fetching true (detection started) then false (data loaded)
+    setupSelectorMocks({
+      isHomepageRedesignEnabled: false,
+      collectibles: mockCollectibles,
+      isNftFetching: true,
+    });
+    const { rerender } = render(
+      <Provider store={store}>
+        <NftGrid isFullView />
+      </Provider>,
+    );
+    act(() => {
+      jest.advanceTimersByTime(0);
+    });
+    setupSelectorMocks({
+      isHomepageRedesignEnabled: false,
+      collectibles: mockCollectibles,
+      isNftFetching: false,
+    });
+    rerender(
+      <Provider store={store}>
+        <NftGrid isFullView />
+      </Provider>,
+    );
+
+    await waitFor(() => {
+      expect(mockTrackEvent).toHaveBeenCalledWith(
+        expect.objectContaining({
+          properties: expect.objectContaining({
+            item_count: 1,
+            location: 'homepage',
+            is_empty: false,
+            screen_type: 'nfts',
+          }),
+        }),
+      );
+    });
+  });
+
+  it('tracks Position Screen Viewed with is_empty true when user has no NFTs', async () => {
+    const store = mockStore(initialState);
+
+    // Simulate fetch cycle: fetching true then false (data loaded, empty)
+    setupSelectorMocks({
+      isHomepageRedesignEnabled: false,
+      collectibles: {},
+      isNftFetching: true,
+    });
+    const { rerender } = render(
+      <Provider store={store}>
+        <NftGrid isFullView />
+      </Provider>,
+    );
+    act(() => {
+      jest.advanceTimersByTime(0);
+    });
+    setupSelectorMocks({
+      isHomepageRedesignEnabled: false,
+      collectibles: {},
+      isNftFetching: false,
+    });
+    rerender(
+      <Provider store={store}>
+        <NftGrid isFullView />
+      </Provider>,
+    );
+
+    await waitFor(() => {
+      expect(mockTrackEvent).toHaveBeenCalledWith(
+        expect.objectContaining({
+          properties: expect.objectContaining({
+            item_count: 0,
+            is_empty: true,
+            screen_type: 'nfts',
+          }),
+        }),
+      );
+    });
+  });
+
+  it('does not track Position Screen Viewed on initial mount before any fetch has run', async () => {
+    setupSelectorMocks({
+      isHomepageRedesignEnabled: false,
+      collectibles: {},
+      isNftFetching: false,
+    });
+    const store = mockStore(initialState);
+
+    render(
+      <Provider store={store}>
+        <NftGrid isFullView />
+      </Provider>,
+    );
+
+    act(() => {
+      jest.advanceTimersByTime(100);
+    });
+
+    const positionScreenViewedCalls = mockTrackEvent.mock.calls.filter(
+      (call) =>
+        call[0]?.properties?.screen_type === 'nfts' &&
+        call[0]?.properties?.location === 'homepage',
+    );
+    expect(positionScreenViewedCalls).toHaveLength(0);
+  });
+
+  it('does not track Position Screen Viewed when isFullView is false', async () => {
+    const mockCollectibles = { '0x1': [mockNft] };
+    setupSelectorMocks({
+      isHomepageRedesignEnabled: false,
+      collectibles: mockCollectibles,
+      isNftFetching: false,
+    });
+    const store = mockStore(initialState);
+
+    render(
+      <Provider store={store}>
+        <NftGrid isFullView={false} />
+      </Provider>,
+    );
+
+    act(() => {
+      jest.advanceTimersByTime(100);
+    });
+
+    await waitFor(() => {
+      const positionScreenViewedCalls = mockTrackEvent.mock.calls.filter(
+        (call) =>
+          call[0]?.properties?.screen_type === 'nfts' &&
+          call[0]?.properties?.location === 'homepage',
+      );
+      expect(positionScreenViewedCalls).toHaveLength(0);
+    });
+  });
+
+  it('does not track Position Screen Viewed while NFTs are still fetching', async () => {
+    const mockCollectibles = { '0x1': [mockNft] };
+    setupSelectorMocks({
+      isHomepageRedesignEnabled: false,
+      collectibles: mockCollectibles,
+      isNftFetching: true,
+    });
+    const store = mockStore(initialState);
+
+    render(
+      <Provider store={store}>
+        <NftGrid isFullView />
+      </Provider>,
+    );
+
+    act(() => {
+      jest.advanceTimersByTime(100);
+    });
+
+    await waitFor(() => {
+      const positionScreenViewedCalls = mockTrackEvent.mock.calls.filter(
+        (call) =>
+          call[0]?.properties?.screen_type === 'nfts' &&
+          call[0]?.properties?.location === 'homepage',
+      );
+      expect(positionScreenViewedCalls).toHaveLength(0);
+    });
+  });
 });
diff --git a/app/components/UI/NftGrid/NftGrid.tsx b/app/components/UI/NftGrid/NftGrid.tsx
index 367f5efdebd1..a2a1c2645f89 100644
--- a/app/components/UI/NftGrid/NftGrid.tsx
+++ b/app/components/UI/NftGrid/NftGrid.tsx
@@ -114,6 +114,19 @@ const NftGrid = forwardRef<TabRefreshHandle, NftGridProps>(
       useNftDetection();
 
     const isInitialMount = useRef(true);
+    const hasTrackedScreenViewRef = useRef(false);
+    const hasSeenNftFetchingRef = useRef(false);
+
+    const isNftFetchingProgress = useSelector(isNftFetchingProgressSelector);
+
+    // Mark that a fetch has been initiated (useFocusEffect/detectNfts sets isNftFetchingProgress
+    // to true). Only track "Position Screen Viewed" after at least one fetch cycle, so we don't
+    // fire with stale empty data before detection runs (isNftFetchingProgress defaults to false).
+    useEffect(() => {
+      if (isNftFetchingProgress) {
+        hasSeenNftFetchingRef.current = true;
+      }
+    }, [isNftFetchingProgress]);
 
     const allFilteredCollectibles: Nft[] = useMemo(() => {
       trace({ name: TraceName.LoadCollectibles });
@@ -140,6 +153,33 @@ const NftGrid = forwardRef<TabRefreshHandle, NftGridProps>(
       return itemsToProcess;
     }, [allFilteredCollectibles, maxItems]);
 
+    useEffect(() => {
+      if (
+        !isFullView ||
+        isNftFetchingProgress ||
+        !hasSeenNftFetchingRef.current ||
+        hasTrackedScreenViewRef.current
+      )
+        return;
+      hasTrackedScreenViewRef.current = true;
+      trackEvent(
+        createEventBuilder(MetaMetricsEvents.POSITION_SCREEN_VIEWED)
+          .addProperties({
+            item_count: allFilteredCollectibles.length,
+            location: 'homepage',
+            is_empty: allFilteredCollectibles.length === 0,
+            screen_type: 'nfts',
+          })
+          .build(),
+      );
+    }, [
+      isFullView,
+      isNftFetchingProgress,
+      allFilteredCollectibles.length,
+      trackEvent,
+      createEventBuilder,
+    ]);
+
     // Trigger NFT detection when enabled networks change (after initial mount)
     useEffect(() => {
       if (isInitialMount.current) {
diff --git a/app/components/UI/Notification/BaseNotification/__snapshots__/index.test.jsx.snap b/app/components/UI/Notification/BaseNotification/__snapshots__/index.test.jsx.snap
index fbe47f95ae28..9fb350dafdea 100644
--- a/app/components/UI/Notification/BaseNotification/__snapshots__/index.test.jsx.snap
+++ b/app/components/UI/Notification/BaseNotification/__snapshots__/index.test.jsx.snap
@@ -21,7 +21,7 @@ exports[`BaseNotification gets icon correctly for each status 1`] = `
       activeOpacity={0.8}
       style={
         {
-          "backgroundColor": "#000000cc",
+          "backgroundColor": "#0a0d1392",
           "borderRadius": 8,
           "flex": 1,
           "flexDirection": "row",
@@ -39,7 +39,7 @@ exports[`BaseNotification gets icon correctly for each status 1`] = `
         <View
           style={
             {
-              "borderColor": "#f3f5f9",
+              "borderColor": "#f3f3f4",
               "borderRadius": 64,
               "borderWidth": 3.5,
               "height": 36,
@@ -101,7 +101,7 @@ exports[`BaseNotification gets icon correctly for each status 1`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 30,
                 "marginVertical": 2,
@@ -147,7 +147,7 @@ exports[`BaseNotification gets icon correctly for each status 1`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 30,
                 "marginVertical": 2,
@@ -214,7 +214,7 @@ exports[`BaseNotification gets icon correctly for each status 2`] = `
       activeOpacity={0.8}
       style={
         {
-          "backgroundColor": "#000000cc",
+          "backgroundColor": "#0a0d1392",
           "borderRadius": 8,
           "flex": 1,
           "flexDirection": "row",
@@ -232,7 +232,7 @@ exports[`BaseNotification gets icon correctly for each status 2`] = `
         <View
           style={
             {
-              "borderColor": "#f3f5f9",
+              "borderColor": "#f3f3f4",
               "borderRadius": 64,
               "borderWidth": 3.5,
               "height": 36,
@@ -294,7 +294,7 @@ exports[`BaseNotification gets icon correctly for each status 2`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 30,
                 "marginVertical": 2,
@@ -340,7 +340,7 @@ exports[`BaseNotification gets icon correctly for each status 2`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 30,
                 "marginVertical": 2,
@@ -407,7 +407,7 @@ exports[`BaseNotification gets icon correctly for each status 3`] = `
       activeOpacity={0.8}
       style={
         {
-          "backgroundColor": "#000000cc",
+          "backgroundColor": "#0a0d1392",
           "borderRadius": 8,
           "flex": 1,
           "flexDirection": "row",
@@ -425,7 +425,7 @@ exports[`BaseNotification gets icon correctly for each status 3`] = `
         <View
           style={
             {
-              "borderColor": "#f3f5f9",
+              "borderColor": "#f3f3f4",
               "borderRadius": 64,
               "borderWidth": 3.5,
               "height": 36,
@@ -487,7 +487,7 @@ exports[`BaseNotification gets icon correctly for each status 3`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 30,
                 "marginVertical": 2,
@@ -533,7 +533,7 @@ exports[`BaseNotification gets icon correctly for each status 3`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 30,
                 "marginVertical": 2,
@@ -600,7 +600,7 @@ exports[`BaseNotification gets icon correctly for each status 4`] = `
       activeOpacity={0.8}
       style={
         {
-          "backgroundColor": "#000000cc",
+          "backgroundColor": "#0a0d1392",
           "borderRadius": 8,
           "flex": 1,
           "flexDirection": "row",
@@ -650,7 +650,7 @@ exports[`BaseNotification gets icon correctly for each status 4`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 30,
                 "marginVertical": 2,
@@ -696,7 +696,7 @@ exports[`BaseNotification gets icon correctly for each status 4`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 30,
                 "marginVertical": 2,
@@ -763,7 +763,7 @@ exports[`BaseNotification gets icon correctly for each status 5`] = `
       activeOpacity={0.8}
       style={
         {
-          "backgroundColor": "#000000cc",
+          "backgroundColor": "#0a0d1392",
           "borderRadius": 8,
           "flex": 1,
           "flexDirection": "row",
@@ -813,7 +813,7 @@ exports[`BaseNotification gets icon correctly for each status 5`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 30,
                 "marginVertical": 2,
@@ -859,7 +859,7 @@ exports[`BaseNotification gets icon correctly for each status 5`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 30,
                 "marginVertical": 2,
@@ -926,7 +926,7 @@ exports[`BaseNotification gets icon correctly for each status 6`] = `
       activeOpacity={0.8}
       style={
         {
-          "backgroundColor": "#000000cc",
+          "backgroundColor": "#0a0d1392",
           "borderRadius": 8,
           "flex": 1,
           "flexDirection": "row",
@@ -976,7 +976,7 @@ exports[`BaseNotification gets icon correctly for each status 6`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 30,
                 "marginVertical": 2,
@@ -1022,7 +1022,7 @@ exports[`BaseNotification gets icon correctly for each status 6`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 30,
                 "marginVertical": 2,
@@ -1089,7 +1089,7 @@ exports[`BaseNotification gets icon correctly for each status 7`] = `
       activeOpacity={0.8}
       style={
         {
-          "backgroundColor": "#000000cc",
+          "backgroundColor": "#0a0d1392",
           "borderRadius": 8,
           "flex": 1,
           "flexDirection": "row",
@@ -1139,7 +1139,7 @@ exports[`BaseNotification gets icon correctly for each status 7`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 30,
                 "marginVertical": 2,
@@ -1185,7 +1185,7 @@ exports[`BaseNotification gets icon correctly for each status 7`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 30,
                 "marginVertical": 2,
@@ -1252,7 +1252,7 @@ exports[`BaseNotification gets icon correctly for each status 8`] = `
       activeOpacity={0.8}
       style={
         {
-          "backgroundColor": "#000000cc",
+          "backgroundColor": "#0a0d1392",
           "borderRadius": 8,
           "flex": 1,
           "flexDirection": "row",
@@ -1302,7 +1302,7 @@ exports[`BaseNotification gets icon correctly for each status 8`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 30,
                 "marginVertical": 2,
@@ -1348,7 +1348,7 @@ exports[`BaseNotification gets icon correctly for each status 8`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 30,
                 "marginVertical": 2,
@@ -1415,7 +1415,7 @@ exports[`BaseNotification gets icon correctly for each status 9`] = `
       activeOpacity={0.8}
       style={
         {
-          "backgroundColor": "#000000cc",
+          "backgroundColor": "#0a0d1392",
           "borderRadius": 8,
           "flex": 1,
           "flexDirection": "row",
@@ -1465,7 +1465,7 @@ exports[`BaseNotification gets icon correctly for each status 9`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 30,
                 "marginVertical": 2,
@@ -1511,7 +1511,7 @@ exports[`BaseNotification gets icon correctly for each status 9`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 30,
                 "marginVertical": 2,
diff --git a/app/components/UI/Notification/Empty/__snapshots__/index.test.tsx.snap b/app/components/UI/Notification/Empty/__snapshots__/index.test.tsx.snap
index 0f7bac88032c..0487c873acf2 100644
--- a/app/components/UI/Notification/Empty/__snapshots__/index.test.tsx.snap
+++ b/app/components/UI/Notification/Empty/__snapshots__/index.test.tsx.snap
@@ -11,7 +11,7 @@ exports[`Empty should render correctly 1`] = `
   }
 >
   <SvgMock
-    color="#121314"
+    color="#131416"
     fill="currentColor"
     height={32}
     name="Notification"
@@ -30,9 +30,9 @@ exports[`Empty should render correctly 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Bold",
-        "fontSize": 18,
+        "fontSize": 20,
         "letterSpacing": 0,
         "lineHeight": 24,
         "marginBottom": 8,
@@ -47,7 +47,7 @@ exports[`Empty should render correctly 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
diff --git a/app/components/UI/Notification/ResetNotificationsModal/ResetNotificationsModal.test.tsx b/app/components/UI/Notification/ResetNotificationsModal/ResetNotificationsModal.test.tsx
deleted file mode 100644
index 969fd092c4a8..000000000000
--- a/app/components/UI/Notification/ResetNotificationsModal/ResetNotificationsModal.test.tsx
+++ /dev/null
@@ -1,42 +0,0 @@
-// Third party dependencies.
-import React from 'react';
-
-// Internal dependencies.
-import ResetNotificationsModal from '.';
-import renderWithProvider from '../../../../util/test/renderWithProvider';
-
-jest.mock('react-native-safe-area-context', () => {
-  const inset = { top: 0, right: 0, bottom: 0, left: 0 };
-  const frame = { width: 0, height: 0, x: 0, y: 0 };
-  return {
-    SafeAreaProvider: jest.fn().mockImplementation(({ children }) => children),
-    SafeAreaConsumer: jest
-      .fn()
-      .mockImplementation(({ children }) => children(inset)),
-    useSafeAreaInsets: jest.fn().mockImplementation(() => inset),
-    useSafeAreaFrame: jest.fn().mockImplementation(() => frame),
-  };
-});
-
-jest.mock('@react-navigation/native', () => {
-  const actualReactNavigation = jest.requireActual('@react-navigation/native');
-  return {
-    ...actualReactNavigation,
-    useNavigation: () => ({
-      navigate: jest.fn(),
-      setOptions: jest.fn(),
-      goBack: jest.fn(),
-      reset: jest.fn(),
-      dangerouslyGetParent: () => ({
-        pop: jest.fn(),
-      }),
-    }),
-  };
-});
-
-describe('ResetNotificationsModal', () => {
-  it('should render correctly', () => {
-    const { toJSON } = renderWithProvider(<ResetNotificationsModal />);
-    expect(toJSON()).toMatchSnapshot();
-  });
-});
diff --git a/app/components/UI/Notification/ResetNotificationsModal/__snapshots__/ResetNotificationsModal.test.tsx.snap b/app/components/UI/Notification/ResetNotificationsModal/__snapshots__/ResetNotificationsModal.test.tsx.snap
deleted file mode 100644
index 42f00d0079be..000000000000
--- a/app/components/UI/Notification/ResetNotificationsModal/__snapshots__/ResetNotificationsModal.test.tsx.snap
+++ /dev/null
@@ -1,283 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`ResetNotificationsModal should render correctly 1`] = `
-<View
-  onLayout={[Function]}
-  style={
-    [
-      {
-        "bottom": 0,
-        "justifyContent": "flex-end",
-        "left": 0,
-        "position": "absolute",
-        "right": 0,
-        "top": 0,
-      },
-      {
-        "paddingBottom": 0,
-      },
-    ]
-  }
->
-  <View
-    style={
-      [
-        {
-          "backgroundColor": "#3f434a66",
-          "bottom": 0,
-          "left": 0,
-          "position": "absolute",
-          "right": 0,
-          "top": 0,
-        },
-        {
-          "opacity": 0,
-        },
-      ]
-    }
-  >
-    <TouchableOpacity
-      onPress={[Function]}
-      style={
-        {
-          "flex": 1,
-        }
-      }
-    />
-  </View>
-  <View
-    onLayout={[Function]}
-    style={
-      [
-        {
-          "bottom": 0,
-          "left": 0,
-          "position": "absolute",
-          "right": 0,
-        },
-        {
-          "paddingBottom": 0,
-        },
-      ]
-    }
-  >
-    <View
-      collapsable={false}
-      enabled={true}
-      handlerTag={-1}
-      handlerType="PanGestureHandler"
-      onGestureHandlerEvent={[Function]}
-      onGestureHandlerStateChange={[Function]}
-      onLayout={[Function]}
-      style={
-        [
-          {
-            "backgroundColor": "#ffffff",
-            "borderColor": "#b7bbc866",
-            "borderTopLeftRadius": 24,
-            "borderTopRightRadius": 24,
-            "borderWidth": 1,
-            "maxHeight": 0,
-            "overflow": "hidden",
-            "paddingBottom": 0,
-            "shadowColor": "#0000001a",
-            "shadowOffset": {
-              "height": 2,
-              "width": 0,
-            },
-            "shadowOpacity": 1,
-            "shadowRadius": 40,
-          },
-          {
-            "transform": [
-              {
-                "translateY": 0,
-              },
-            ],
-          },
-        ]
-      }
-    >
-      <View
-        style={
-          {
-            "alignItems": "center",
-            "alignSelf": "stretch",
-            "padding": 4,
-          }
-        }
-      >
-        <View
-          style={
-            {
-              "backgroundColor": "#b7bbc866",
-              "borderRadius": 2,
-              "height": 4,
-              "width": 40,
-            }
-          }
-        />
-      </View>
-      <View
-        style={
-          {
-            "alignSelf": "center",
-            "justifyContent": "center",
-            "padding": 16,
-          }
-        }
-      >
-        <SvgMock
-          color="#ca3542"
-          fill="currentColor"
-          height={32}
-          name="Danger"
-          style={
-            {
-              "alignSelf": "center",
-              "height": 32,
-              "marginBottom": 10,
-              "width": 32,
-            }
-          }
-          width={32}
-        />
-        <Text
-          accessibilityRole="text"
-          style={
-            {
-              "color": "#121314",
-              "fontFamily": "Geist-Bold",
-              "fontSize": 18,
-              "letterSpacing": 0,
-              "lineHeight": 24,
-              "textAlign": "center",
-            }
-          }
-        >
-          Reset notifications
-        </Text>
-        <Text
-          accessibilityRole="text"
-          style={
-            {
-              "alignSelf": "flex-start",
-              "color": "#121314",
-              "fontFamily": "Geist-Regular",
-              "fontSize": 16,
-              "letterSpacing": 0,
-              "lineHeight": 24,
-              "paddingBottom": 10,
-              "paddingTop": 16,
-            }
-          }
-        >
-          Resetting notifications, means you're deleting your notifications storage keys and resetting all your notification history. Are you sure you want to do this?
-        </Text>
-        <View
-          style={
-            {
-              "paddingTop": 20,
-            }
-          }
-        >
-          <View
-            style={
-              {
-                "flexDirection": "row",
-                "paddingTop": 24,
-              }
-            }
-          >
-            <TouchableOpacity
-              accessibilityRole="button"
-              accessible={true}
-              activeOpacity={1}
-              onPress={[Function]}
-              onPressIn={[Function]}
-              onPressOut={[Function]}
-              style={
-                {
-                  "alignItems": "center",
-                  "alignSelf": "flex-start",
-                  "backgroundColor": "#3c4d9d0f",
-                  "borderColor": "transparent",
-                  "borderRadius": 12,
-                  "borderWidth": 1,
-                  "flex": 1,
-                  "flexDirection": "row",
-                  "height": 48,
-                  "justifyContent": "center",
-                  "overflow": "hidden",
-                  "paddingHorizontal": 16,
-                }
-              }
-            >
-              <Text
-                accessibilityRole="text"
-                style={
-                  {
-                    "color": "#121314",
-                    "fontFamily": "Geist-Medium",
-                    "fontSize": 16,
-                    "letterSpacing": 0,
-                    "lineHeight": 24,
-                  }
-                }
-              >
-                Cancel
-              </Text>
-            </TouchableOpacity>
-            <View
-              style={
-                {
-                  "width": 20,
-                }
-              }
-            />
-            <TouchableOpacity
-              accessibilityRole="button"
-              accessible={true}
-              activeOpacity={1}
-              disabled={false}
-              loading={false}
-              onPress={[Function]}
-              onPressIn={[Function]}
-              onPressOut={[Function]}
-              style={
-                {
-                  "alignItems": "center",
-                  "alignSelf": "flex-start",
-                  "backgroundColor": "#121314",
-                  "borderRadius": 12,
-                  "flex": 1,
-                  "flexDirection": "row",
-                  "height": 48,
-                  "justifyContent": "center",
-                  "overflow": "hidden",
-                  "paddingHorizontal": 16,
-                }
-              }
-            >
-              <Text
-                accessibilityRole="text"
-                style={
-                  {
-                    "color": "#ffffff",
-                    "fontFamily": "Geist-Medium",
-                    "fontSize": 16,
-                    "letterSpacing": 0,
-                    "lineHeight": 24,
-                  }
-                }
-              >
-                Reset
-              </Text>
-            </TouchableOpacity>
-          </View>
-        </View>
-      </View>
-    </View>
-  </View>
-</View>
-`;
diff --git a/app/components/UI/Notification/ResetNotificationsModal/index.tsx b/app/components/UI/Notification/ResetNotificationsModal/index.tsx
deleted file mode 100644
index e66fdb3fd8ab..000000000000
--- a/app/components/UI/Notification/ResetNotificationsModal/index.tsx
+++ /dev/null
@@ -1,75 +0,0 @@
-// Third party dependencies.
-import React, { useContext, useEffect, useRef } from 'react';
-
-// External dependencies.
-import BottomSheet, {
-  BottomSheetRef,
-} from '../../../../component-library/components/BottomSheets/BottomSheet';
-import { strings } from '../../../../../locales/i18n';
-
-import {
-  IconColor,
-  IconName,
-  IconSize,
-} from '../../../../component-library/components/Icons/Icon';
-import { useResetNotifications } from '../../../../util/notifications/hooks/useNotifications';
-import ModalContent from '../Modal';
-import { ToastContext } from '../../../../component-library/components/Toast';
-import { ToastVariants } from '../../../../component-library/components/Toast/Toast.types';
-
-const ResetNotificationsModal = () => {
-  const bottomSheetRef = useRef<BottomSheetRef>(null);
-  const [isChecked, setIsChecked] = React.useState(false);
-  const { resetNotifications, loading } = useResetNotifications();
-  const { toastRef } = useContext(ToastContext);
-  const closeBottomSheet = () => bottomSheetRef.current?.onCloseBottomSheet();
-
-  const showResultToast = () => {
-    toastRef?.current?.showToast({
-      variant: ToastVariants.Plain,
-      labelOptions: [
-        {
-          label: strings('app_settings.reset_notifications_success'),
-          isBold: false,
-        },
-      ],
-      hasNoTimeout: false,
-    });
-  };
-
-  const handleCta = async () => {
-    await resetNotifications().then(() => {
-      showResultToast();
-    });
-  };
-
-  const prevLoading = useRef(loading);
-  useEffect(() => {
-    if (prevLoading.current && !loading) {
-      closeBottomSheet();
-    }
-    prevLoading.current = loading;
-  }, [loading]);
-
-  return (
-    <BottomSheet ref={bottomSheetRef}>
-      <ModalContent
-        title={strings('app_settings.reset_notifications_title')}
-        message={strings('app_settings.reset_notifications_description')}
-        iconName={IconName.Danger}
-        iconColor={IconColor.Error}
-        iconSize={IconSize.Xl}
-        checkBoxLabel={strings('default_settings.sheet.checkbox_label')}
-        btnLabelCancel={strings('default_settings.sheet.buttons.cancel')}
-        btnLabelCta={strings('default_settings.sheet.buttons.reset')}
-        isChecked={isChecked}
-        setIsChecked={setIsChecked}
-        handleCta={handleCta}
-        handleCancel={closeBottomSheet}
-        loading={loading}
-      />
-    </BottomSheet>
-  );
-};
-
-export default ResetNotificationsModal;
diff --git a/app/components/UI/OptinMetrics/__snapshots__/index.test.tsx.snap b/app/components/UI/OptinMetrics/__snapshots__/index.test.tsx.snap
index 0a58d52ca2f6..8fbe0760b376 100644
--- a/app/components/UI/OptinMetrics/__snapshots__/index.test.tsx.snap
+++ b/app/components/UI/OptinMetrics/__snapshots__/index.test.tsx.snap
@@ -267,7 +267,7 @@ exports[`OptinMetrics Snapshots android render matches snapshot 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Bold",
                                   "fontSize": 32,
                                   "fontWeight": "700",
@@ -284,7 +284,7 @@ exports[`OptinMetrics Snapshots android render matches snapshot 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#686e7d",
+                                  "color": "#66676a",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -301,7 +301,7 @@ exports[`OptinMetrics Snapshots android render matches snapshot 1`] = `
                                 onPress={[Function]}
                                 style={
                                   {
-                                    "backgroundColor": "#f3f5f9",
+                                    "backgroundColor": "#f3f3f4",
                                     "borderRadius": 12,
                                     "marginBottom": 16,
                                     "padding": 16,
@@ -331,7 +331,7 @@ exports[`OptinMetrics Snapshots android render matches snapshot 1`] = `
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Medium",
                                           "fontSize": 14,
                                           "letterSpacing": 0,
@@ -395,7 +395,7 @@ exports[`OptinMetrics Snapshots android render matches snapshot 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#686e7d",
+                                      "color": "#66676a",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 14,
                                       "letterSpacing": 0,
@@ -430,7 +430,7 @@ exports[`OptinMetrics Snapshots android render matches snapshot 1`] = `
                                 style={
                                   [
                                     {
-                                      "backgroundColor": "#f3f5f9",
+                                      "backgroundColor": "#f3f3f4",
                                       "borderRadius": 12,
                                       "marginBottom": 16,
                                       "padding": 16,
@@ -461,7 +461,7 @@ exports[`OptinMetrics Snapshots android render matches snapshot 1`] = `
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Medium",
                                           "fontSize": 14,
                                           "letterSpacing": 0,
@@ -492,7 +492,7 @@ exports[`OptinMetrics Snapshots android render matches snapshot 1`] = `
                                         {
                                           "alignItems": "center",
                                           "backgroundColor": "#ffffff",
-                                          "borderColor": "#b7bbc8",
+                                          "borderColor": "#949596",
                                           "borderRadius": 4,
                                           "borderWidth": 2,
                                           "height": 20,
@@ -507,7 +507,7 @@ exports[`OptinMetrics Snapshots android render matches snapshot 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#686e7d",
+                                      "color": "#66676a",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 14,
                                       "letterSpacing": 0,
@@ -544,7 +544,7 @@ exports[`OptinMetrics Snapshots android render matches snapshot 1`] = `
                             {
                               "alignItems": "center",
                               "alignSelf": "flex-start",
-                              "backgroundColor": "#121314",
+                              "backgroundColor": "#131416",
                               "borderRadius": 12,
                               "flex": 1,
                               "flexDirection": "row",
@@ -958,7 +958,7 @@ exports[`OptinMetrics Snapshots android render matches snapshot with status bar
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Bold",
                                   "fontSize": 32,
                                   "fontWeight": "700",
@@ -975,7 +975,7 @@ exports[`OptinMetrics Snapshots android render matches snapshot with status bar
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#686e7d",
+                                  "color": "#66676a",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -992,7 +992,7 @@ exports[`OptinMetrics Snapshots android render matches snapshot with status bar
                                 onPress={[Function]}
                                 style={
                                   {
-                                    "backgroundColor": "#f3f5f9",
+                                    "backgroundColor": "#f3f3f4",
                                     "borderRadius": 12,
                                     "marginBottom": 16,
                                     "padding": 16,
@@ -1022,7 +1022,7 @@ exports[`OptinMetrics Snapshots android render matches snapshot with status bar
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Medium",
                                           "fontSize": 14,
                                           "letterSpacing": 0,
@@ -1086,7 +1086,7 @@ exports[`OptinMetrics Snapshots android render matches snapshot with status bar
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#686e7d",
+                                      "color": "#66676a",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 14,
                                       "letterSpacing": 0,
@@ -1121,7 +1121,7 @@ exports[`OptinMetrics Snapshots android render matches snapshot with status bar
                                 style={
                                   [
                                     {
-                                      "backgroundColor": "#f3f5f9",
+                                      "backgroundColor": "#f3f3f4",
                                       "borderRadius": 12,
                                       "marginBottom": 16,
                                       "padding": 16,
@@ -1152,7 +1152,7 @@ exports[`OptinMetrics Snapshots android render matches snapshot with status bar
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Medium",
                                           "fontSize": 14,
                                           "letterSpacing": 0,
@@ -1183,7 +1183,7 @@ exports[`OptinMetrics Snapshots android render matches snapshot with status bar
                                         {
                                           "alignItems": "center",
                                           "backgroundColor": "#ffffff",
-                                          "borderColor": "#b7bbc8",
+                                          "borderColor": "#949596",
                                           "borderRadius": 4,
                                           "borderWidth": 2,
                                           "height": 20,
@@ -1198,7 +1198,7 @@ exports[`OptinMetrics Snapshots android render matches snapshot with status bar
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#686e7d",
+                                      "color": "#66676a",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 14,
                                       "letterSpacing": 0,
@@ -1235,7 +1235,7 @@ exports[`OptinMetrics Snapshots android render matches snapshot with status bar
                             {
                               "alignItems": "center",
                               "alignSelf": "flex-start",
-                              "backgroundColor": "#121314",
+                              "backgroundColor": "#131416",
                               "borderRadius": 12,
                               "flex": 1,
                               "flexDirection": "row",
@@ -1761,7 +1761,7 @@ exports[`OptinMetrics Snapshots iOS renders correctly 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Bold",
                                   "fontSize": 32,
                                   "fontWeight": "700",
@@ -1778,7 +1778,7 @@ exports[`OptinMetrics Snapshots iOS renders correctly 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#686e7d",
+                                  "color": "#66676a",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -1795,7 +1795,7 @@ exports[`OptinMetrics Snapshots iOS renders correctly 1`] = `
                                 onPress={[Function]}
                                 style={
                                   {
-                                    "backgroundColor": "#f3f5f9",
+                                    "backgroundColor": "#f3f3f4",
                                     "borderRadius": 12,
                                     "marginBottom": 16,
                                     "padding": 16,
@@ -1825,7 +1825,7 @@ exports[`OptinMetrics Snapshots iOS renders correctly 1`] = `
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Medium",
                                           "fontSize": 14,
                                           "letterSpacing": 0,
@@ -1889,7 +1889,7 @@ exports[`OptinMetrics Snapshots iOS renders correctly 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#686e7d",
+                                      "color": "#66676a",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 14,
                                       "letterSpacing": 0,
@@ -1924,7 +1924,7 @@ exports[`OptinMetrics Snapshots iOS renders correctly 1`] = `
                                 style={
                                   [
                                     {
-                                      "backgroundColor": "#f3f5f9",
+                                      "backgroundColor": "#f3f3f4",
                                       "borderRadius": 12,
                                       "marginBottom": 16,
                                       "padding": 16,
@@ -1955,7 +1955,7 @@ exports[`OptinMetrics Snapshots iOS renders correctly 1`] = `
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Medium",
                                           "fontSize": 14,
                                           "letterSpacing": 0,
@@ -1986,7 +1986,7 @@ exports[`OptinMetrics Snapshots iOS renders correctly 1`] = `
                                         {
                                           "alignItems": "center",
                                           "backgroundColor": "#ffffff",
-                                          "borderColor": "#b7bbc8",
+                                          "borderColor": "#949596",
                                           "borderRadius": 4,
                                           "borderWidth": 2,
                                           "height": 20,
@@ -2001,7 +2001,7 @@ exports[`OptinMetrics Snapshots iOS renders correctly 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#686e7d",
+                                      "color": "#66676a",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 14,
                                       "letterSpacing": 0,
@@ -2038,7 +2038,7 @@ exports[`OptinMetrics Snapshots iOS renders correctly 1`] = `
                             {
                               "alignItems": "center",
                               "alignSelf": "flex-start",
-                              "backgroundColor": "#121314",
+                              "backgroundColor": "#131416",
                               "borderRadius": 12,
                               "flex": 1,
                               "flexDirection": "row",
diff --git a/app/components/UI/OptinMetrics/index.test.tsx b/app/components/UI/OptinMetrics/index.test.tsx
index 2c7de19cf4e7..b356913ad727 100644
--- a/app/components/UI/OptinMetrics/index.test.tsx
+++ b/app/components/UI/OptinMetrics/index.test.tsx
@@ -5,6 +5,7 @@ import { strings } from '../../../../locales/i18n';
 import { MetaMetricsOptInSelectorsIDs } from './MetaMetricsOptIn.testIds';
 import { Platform } from 'react-native';
 import Device from '../../../util/device';
+import { MetaMetricsEvents } from '../../../core/Analytics';
 
 const { InteractionManager } = jest.requireActual('react-native');
 
@@ -275,6 +276,94 @@ describe('OptinMetrics', () => {
         expect(mockAnalytics.optOut).toHaveBeenCalled();
       });
     });
+
+    it('tracks METRICS_OPT_OUT when user navigates out with basic usage unchecked', async () => {
+      renderScreen(OptinMetrics, { name: 'OptinMetrics' }, { state: {} });
+
+      const basicUsageCheckbox = screen.getByText(
+        strings('privacy_policy.gather_basic_usage_title'),
+      );
+
+      fireEvent.press(basicUsageCheckbox);
+
+      fireEvent.press(screen.getByText(strings('privacy_policy.continue')));
+
+      await waitFor(() => {
+        expect(mockAnalytics.trackEvent).toHaveBeenCalledWith(
+          expect.objectContaining({
+            name: MetaMetricsEvents.METRICS_OPT_OUT.category,
+            properties: expect.objectContaining({
+              updated_after_onboarding: false,
+              location: 'onboarding_metametrics',
+            }),
+          }),
+        );
+      });
+    });
+
+    it('tracks METRICS_OPT_OUT when navigating out via checkbox component uncheck', async () => {
+      renderScreen(OptinMetrics, { name: 'OptinMetrics' }, { state: {} });
+
+      const checkboxes = screen.getAllByRole('checkbox');
+      const basicUsageCheckbox = checkboxes[0];
+
+      fireEvent.press(basicUsageCheckbox);
+
+      fireEvent.press(screen.getByText(strings('privacy_policy.continue')));
+
+      await waitFor(() => {
+        expect(mockAnalytics.trackEvent).toHaveBeenCalledWith(
+          expect.objectContaining({
+            name: MetaMetricsEvents.METRICS_OPT_OUT.category,
+            properties: expect.objectContaining({
+              updated_after_onboarding: false,
+              location: 'onboarding_metametrics',
+            }),
+          }),
+        );
+      });
+    });
+
+    it('unchecks marketing when basic usage is unchecked and fires METRICS_OPT_OUT on navigate out', async () => {
+      renderScreen(OptinMetrics, { name: 'OptinMetrics' }, { state: {} });
+
+      const marketingCheckbox = screen.getByText(
+        strings('privacy_policy.checkbox_marketing'),
+      );
+      fireEvent.press(marketingCheckbox);
+
+      const basicUsageCheckbox = screen.getByText(
+        strings('privacy_policy.gather_basic_usage_title'),
+      );
+      fireEvent.press(basicUsageCheckbox);
+
+      fireEvent.press(screen.getByText(strings('privacy_policy.continue')));
+
+      await waitFor(() => {
+        expect(mockAnalytics.trackEvent).toHaveBeenCalledWith(
+          expect.objectContaining({
+            name: MetaMetricsEvents.METRICS_OPT_OUT.category,
+            properties: expect.objectContaining({
+              updated_after_onboarding: false,
+              location: 'onboarding_metametrics',
+            }),
+          }),
+        );
+      });
+
+      fireEvent.press(screen.getByText(strings('privacy_policy.continue')));
+
+      await waitFor(() => {
+        expect(mockAnalytics.trackEvent).toHaveBeenCalledWith(
+          expect.objectContaining({
+            properties: expect.objectContaining({
+              has_marketing_consent: false,
+              is_metrics_opted_in: false,
+            }),
+          }),
+        );
+      });
+    });
   });
 
   describe('Learn more functionality', () => {
diff --git a/app/components/UI/OptinMetrics/index.tsx b/app/components/UI/OptinMetrics/index.tsx
index 1354a98917e2..6188ec382673 100644
--- a/app/components/UI/OptinMetrics/index.tsx
+++ b/app/components/UI/OptinMetrics/index.tsx
@@ -152,7 +152,19 @@ const OptinMetrics = () => {
 
     dispatch(setDataCollectionForMarketing(isMarketingChecked));
 
-    // Track the analytics preference event first
+    // Track opt-out event if user opted out of metrics
+    if (!isBasicUsageChecked) {
+      metrics.trackEvent(
+        metrics
+          .createEventBuilder(MetaMetricsEvents.METRICS_OPT_OUT)
+          .addProperties({
+            updated_after_onboarding: false,
+            location: 'onboarding_metametrics',
+          })
+          .build(),
+      );
+    }
+
     metrics.trackEvent(
       metrics
         .createEventBuilder(MetaMetricsEvents.ANALYTICS_PREFERENCE_SELECTED)
@@ -228,9 +240,8 @@ const OptinMetrics = () => {
   );
 
   const handleBasicUsageToggle = useCallback(() => {
-    setIsBasicUsageChecked((prev) => {
-      const newValue = !prev;
-      // If unchecking basic usage, also uncheck marketing
+    setIsBasicUsageChecked((prevValue) => {
+      const newValue = !prevValue;
       if (!newValue) {
         setIsMarketingChecked(false);
       }
diff --git a/app/components/UI/PaymentRequest/__snapshots__/index.test.tsx.snap b/app/components/UI/PaymentRequest/__snapshots__/index.test.tsx.snap
index 5b310290f55b..86cc6ba76a92 100644
--- a/app/components/UI/PaymentRequest/__snapshots__/index.test.tsx.snap
+++ b/app/components/UI/PaymentRequest/__snapshots__/index.test.tsx.snap
@@ -17,7 +17,7 @@ exports[`PaymentRequest renders correctly 1`] = `
         {
           "alignItems": "center",
           "alignSelf": "center",
-          "backgroundColor": "#f3f5f9",
+          "backgroundColor": "#f3f3f4",
           "borderRadius": 16,
           "flexDirection": "row",
           "height": 32,
@@ -61,7 +61,7 @@ exports[`PaymentRequest renders correctly 1`] = `
         numberOfLines={1}
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "flexShrink": 1,
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
@@ -73,7 +73,7 @@ exports[`PaymentRequest renders correctly 1`] = `
         testID="open-networks-text"
       />
       <SvgMock
-        color="#121314"
+        color="#131416"
         fill="currentColor"
         height={12}
         name="ArrowDown"
@@ -136,7 +136,7 @@ exports[`PaymentRequest renders correctly 1`] = `
           <Text
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
               }
@@ -149,7 +149,7 @@ exports[`PaymentRequest renders correctly 1`] = `
           style={
             {
               "backgroundColor": "#ffffff",
-              "borderColor": "#b7bbc8",
+              "borderColor": "#949596",
               "borderRadius": 8,
               "borderWidth": 1,
               "flexDirection": "row",
@@ -163,7 +163,7 @@ exports[`PaymentRequest renders correctly 1`] = `
             style={
               [
                 {
-                  "color": "#b7bbc8",
+                  "color": "#babbbe",
                   "fontSize": 18,
                 },
                 {
@@ -190,12 +190,12 @@ exports[`PaymentRequest renders correctly 1`] = `
             onChangeText={[Function]}
             onSubmitEditing={[Function]}
             placeholder="Search assets"
-            placeholderTextColor="#b7bbc8"
+            placeholderTextColor="#babbbe"
             returnKeyType="go"
             style={
               [
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "flex": 1,
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
@@ -223,7 +223,7 @@ exports[`PaymentRequest renders correctly 1`] = `
           <Text
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "marginBottom": 8,
@@ -259,7 +259,7 @@ exports[`PaymentRequest renders correctly 1`] = `
                       "borderWidth": 1,
                     },
                     {
-                      "borderColor": "#b7bbc8",
+                      "borderColor": "#949596",
                       "borderRadius": 8,
                       "borderWidth": 1,
                       "marginBottom": 8,
@@ -301,7 +301,7 @@ exports[`PaymentRequest renders correctly 1`] = `
                   <Text
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 16,
                         "paddingBottom": 4,
@@ -313,7 +313,7 @@ exports[`PaymentRequest renders correctly 1`] = `
                   <Text
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                       }
                     }
@@ -342,7 +342,7 @@ exports[`PaymentRequest renders correctly 1`] = `
                       "borderWidth": 1,
                     },
                     {
-                      "borderColor": "#b7bbc8",
+                      "borderColor": "#949596",
                       "borderRadius": 8,
                       "borderWidth": 1,
                       "marginBottom": 8,
@@ -374,7 +374,7 @@ exports[`PaymentRequest renders correctly 1`] = `
                   <View
                     placeholderStyle={
                       {
-                        "backgroundColor": "#f3f5f9",
+                        "backgroundColor": "#f3f3f4",
                       }
                     }
                     useNativeDriver={true}
@@ -421,7 +421,7 @@ exports[`PaymentRequest renders correctly 1`] = `
                               "backgroundColor": "#eee",
                             },
                             {
-                              "backgroundColor": "#f3f5f9",
+                              "backgroundColor": "#f3f3f4",
                             },
                           ]
                         }
@@ -442,7 +442,7 @@ exports[`PaymentRequest renders correctly 1`] = `
                   <Text
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 16,
                         "paddingBottom": 4,
@@ -454,7 +454,7 @@ exports[`PaymentRequest renders correctly 1`] = `
                   <Text
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                       }
                     }
@@ -489,7 +489,7 @@ exports[`PaymentRequest renders correctly with network picker when feature flag
         {
           "alignItems": "center",
           "alignSelf": "center",
-          "backgroundColor": "#f3f5f9",
+          "backgroundColor": "#f3f3f4",
           "borderRadius": 16,
           "flexDirection": "row",
           "height": 32,
@@ -533,7 +533,7 @@ exports[`PaymentRequest renders correctly with network picker when feature flag
         numberOfLines={1}
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "flexShrink": 1,
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
@@ -545,7 +545,7 @@ exports[`PaymentRequest renders correctly with network picker when feature flag
         testID="open-networks-text"
       />
       <SvgMock
-        color="#121314"
+        color="#131416"
         fill="currentColor"
         height={12}
         name="ArrowDown"
@@ -608,7 +608,7 @@ exports[`PaymentRequest renders correctly with network picker when feature flag
           <Text
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
               }
@@ -621,7 +621,7 @@ exports[`PaymentRequest renders correctly with network picker when feature flag
           style={
             {
               "backgroundColor": "#ffffff",
-              "borderColor": "#b7bbc8",
+              "borderColor": "#949596",
               "borderRadius": 8,
               "borderWidth": 1,
               "flexDirection": "row",
@@ -635,7 +635,7 @@ exports[`PaymentRequest renders correctly with network picker when feature flag
             style={
               [
                 {
-                  "color": "#b7bbc8",
+                  "color": "#babbbe",
                   "fontSize": 18,
                 },
                 {
@@ -662,12 +662,12 @@ exports[`PaymentRequest renders correctly with network picker when feature flag
             onChangeText={[Function]}
             onSubmitEditing={[Function]}
             placeholder="Search assets"
-            placeholderTextColor="#b7bbc8"
+            placeholderTextColor="#babbbe"
             returnKeyType="go"
             style={
               [
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "flex": 1,
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
@@ -695,7 +695,7 @@ exports[`PaymentRequest renders correctly with network picker when feature flag
           <Text
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "marginBottom": 8,
@@ -731,7 +731,7 @@ exports[`PaymentRequest renders correctly with network picker when feature flag
                       "borderWidth": 1,
                     },
                     {
-                      "borderColor": "#b7bbc8",
+                      "borderColor": "#949596",
                       "borderRadius": 8,
                       "borderWidth": 1,
                       "marginBottom": 8,
@@ -773,7 +773,7 @@ exports[`PaymentRequest renders correctly with network picker when feature flag
                   <Text
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 16,
                         "paddingBottom": 4,
@@ -785,7 +785,7 @@ exports[`PaymentRequest renders correctly with network picker when feature flag
                   <Text
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                       }
                     }
@@ -814,7 +814,7 @@ exports[`PaymentRequest renders correctly with network picker when feature flag
                       "borderWidth": 1,
                     },
                     {
-                      "borderColor": "#b7bbc8",
+                      "borderColor": "#949596",
                       "borderRadius": 8,
                       "borderWidth": 1,
                       "marginBottom": 8,
@@ -846,7 +846,7 @@ exports[`PaymentRequest renders correctly with network picker when feature flag
                   <View
                     placeholderStyle={
                       {
-                        "backgroundColor": "#f3f5f9",
+                        "backgroundColor": "#f3f3f4",
                       }
                     }
                     useNativeDriver={true}
@@ -893,7 +893,7 @@ exports[`PaymentRequest renders correctly with network picker when feature flag
                               "backgroundColor": "#eee",
                             },
                             {
-                              "backgroundColor": "#f3f5f9",
+                              "backgroundColor": "#f3f3f4",
                             },
                           ]
                         }
@@ -914,7 +914,7 @@ exports[`PaymentRequest renders correctly with network picker when feature flag
                   <Text
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 16,
                         "paddingBottom": 4,
@@ -926,7 +926,7 @@ exports[`PaymentRequest renders correctly with network picker when feature flag
                   <Text
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                       }
                     }
diff --git a/app/components/UI/PermissionsSummary/__snapshots__/PermissionsSummary.test.tsx.snap b/app/components/UI/PermissionsSummary/__snapshots__/PermissionsSummary.test.tsx.snap
index 41c533e64d9a..acc8ad8018d9 100644
--- a/app/components/UI/PermissionsSummary/__snapshots__/PermissionsSummary.test.tsx.snap
+++ b/app/components/UI/PermissionsSummary/__snapshots__/PermissionsSummary.test.tsx.snap
@@ -4,7 +4,7 @@ exports[`PermissionsSummary should render correctly 1`] = `
 <RCTSafeAreaView
   style={
     {
-      "backgroundColor": "#f3f5f9",
+      "backgroundColor": "#f3f3f4",
     }
   }
 >
@@ -12,7 +12,7 @@ exports[`PermissionsSummary should render correctly 1`] = `
     style={
       [
         {
-          "backgroundColor": "#f3f5f9",
+          "backgroundColor": "#f3f3f4",
           "borderTopLeftRadius": 20,
           "borderTopRightRadius": 20,
           "height": undefined,
@@ -96,8 +96,8 @@ exports[`PermissionsSummary should render correctly 1`] = `
                     style={
                       {
                         "alignItems": "center",
-                        "backgroundColor": "#f3f5f9",
-                        "borderColor": "#b7bbc866",
+                        "backgroundColor": "#f3f3f4",
+                        "borderColor": "#b4b4b566",
                         "borderRadius": 16,
                         "borderWidth": 1,
                         "height": 32,
@@ -111,7 +111,7 @@ exports[`PermissionsSummary should render correctly 1`] = `
                       accessibilityRole="text"
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -231,9 +231,9 @@ exports[`PermissionsSummary should render correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Bold",
-              "fontSize": 18,
+              "fontSize": 20,
               "letterSpacing": 0,
               "lineHeight": 24,
               "textAlign": "center",
@@ -246,7 +246,7 @@ exports[`PermissionsSummary should render correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -331,7 +331,7 @@ exports[`PermissionsSummary should render correctly 1`] = `
                     style={
                       {
                         "backgroundColor": "#ffffff",
-                        "borderColor": "#b7bbc8",
+                        "borderColor": "#949596",
                         "borderRadius": 4,
                         "borderWidth": 0,
                         "height": 75,
@@ -383,7 +383,7 @@ exports[`PermissionsSummary should render correctly 1`] = `
                           numberOfLines={1}
                           style={
                             {
-                              "color": "#121314",
+                              "color": "#131416",
                               "fontFamily": "Geist-Regular",
                               "fontSize": 16,
                               "letterSpacing": 0,
@@ -397,7 +397,7 @@ exports[`PermissionsSummary should render correctly 1`] = `
                           numberOfLines={1}
                           style={
                             {
-                              "color": "#686e7d",
+                              "color": "#66676a",
                               "fontFamily": "Geist-Regular",
                               "fontSize": 16,
                               "letterSpacing": 0,
@@ -428,7 +428,7 @@ exports[`PermissionsSummary should render correctly 1`] = `
                             accessibilityRole="text"
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Regular",
                                 "fontSize": 16,
                                 "letterSpacing": 0,
@@ -574,7 +574,7 @@ exports[`PermissionsSummary should render correctly 1`] = `
                 }
               >
                 <SvgMock
-                  color="#686e7d"
+                  color="#66676a"
                   fill="currentColor"
                   height={20}
                   name="Wallet"
@@ -599,7 +599,7 @@ exports[`PermissionsSummary should render correctly 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -631,7 +631,7 @@ exports[`PermissionsSummary should render correctly 1`] = `
                       numberOfLines={1}
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -644,7 +644,7 @@ exports[`PermissionsSummary should render correctly 1`] = `
                         accessibilityRole="text"
                         style={
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "fontFamily": "Geist-Regular",
                             "fontSize": 14,
                             "letterSpacing": 0,
@@ -714,7 +714,7 @@ exports[`PermissionsSummary should render correctly 1`] = `
                 testID="connection-details-button"
               >
                 <SvgMock
-                  color="#121314"
+                  color="#131416"
                   fill="currentColor"
                   height={20}
                   name="ArrowRight"
@@ -759,7 +759,7 @@ exports[`PermissionsSummary should render correctly 1`] = `
                 }
               >
                 <SvgMock
-                  color="#686e7d"
+                  color="#66676a"
                   fill="currentColor"
                   height={20}
                   name="Data"
@@ -784,7 +784,7 @@ exports[`PermissionsSummary should render correctly 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -816,7 +816,7 @@ exports[`PermissionsSummary should render correctly 1`] = `
                       numberOfLines={1}
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -828,7 +828,7 @@ exports[`PermissionsSummary should render correctly 1`] = `
                         accessibilityRole="text"
                         style={
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "fontFamily": "Geist-Regular",
                             "fontSize": 14,
                             "letterSpacing": 0,
@@ -909,7 +909,7 @@ exports[`PermissionsSummary should render correctly 1`] = `
                 testID="connection-details-button"
               >
                 <SvgMock
-                  color="#121314"
+                  color="#131416"
                   fill="currentColor"
                   height={20}
                   name="ArrowRight"
@@ -954,7 +954,7 @@ exports[`PermissionsSummary should render correctly 1`] = `
             {
               "alignItems": "center",
               "alignSelf": "flex-start",
-              "backgroundColor": "#3c4d9d0f",
+              "backgroundColor": "#b4b4b528",
               "borderColor": "transparent",
               "borderRadius": 12,
               "borderWidth": 1,
@@ -1024,7 +1024,7 @@ exports[`PermissionsSummary should render correctly 1`] = `
                 },
                 {
                   "backgroundColor": "#ffffff",
-                  "borderColor": "#686e7d",
+                  "borderColor": "#66676a",
                   "borderWidth": 1,
                 },
                 [
@@ -1058,7 +1058,7 @@ exports[`PermissionsSummary should render correctly 1`] = `
                     "textAlign": "center",
                   },
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                   },
                   undefined,
                 ],
@@ -1139,7 +1139,7 @@ exports[`PermissionsSummary should render correctly for network switch 1`] = `
 <RCTSafeAreaView
   style={
     {
-      "backgroundColor": "#f3f5f9",
+      "backgroundColor": "#f3f3f4",
     }
   }
 >
@@ -1147,7 +1147,7 @@ exports[`PermissionsSummary should render correctly for network switch 1`] = `
     style={
       [
         {
-          "backgroundColor": "#f3f5f9",
+          "backgroundColor": "#f3f3f4",
           "borderTopLeftRadius": 20,
           "borderTopRightRadius": 20,
           "height": undefined,
@@ -1231,8 +1231,8 @@ exports[`PermissionsSummary should render correctly for network switch 1`] = `
                     style={
                       {
                         "alignItems": "center",
-                        "backgroundColor": "#f3f5f9",
-                        "borderColor": "#b7bbc866",
+                        "backgroundColor": "#f3f3f4",
+                        "borderColor": "#b4b4b566",
                         "borderRadius": 16,
                         "borderWidth": 1,
                         "height": 32,
@@ -1246,7 +1246,7 @@ exports[`PermissionsSummary should render correctly for network switch 1`] = `
                       accessibilityRole="text"
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -1366,9 +1366,9 @@ exports[`PermissionsSummary should render correctly for network switch 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Bold",
-              "fontSize": 18,
+              "fontSize": 20,
               "letterSpacing": 0,
               "lineHeight": 24,
               "textAlign": "center",
@@ -1381,7 +1381,7 @@ exports[`PermissionsSummary should render correctly for network switch 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -1519,7 +1519,7 @@ exports[`PermissionsSummary should render correctly for network switch 1`] = `
                 }
               >
                 <SvgMock
-                  color="#686e7d"
+                  color="#66676a"
                   fill="currentColor"
                   height={20}
                   name="Data"
@@ -1544,7 +1544,7 @@ exports[`PermissionsSummary should render correctly for network switch 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -1576,7 +1576,7 @@ exports[`PermissionsSummary should render correctly for network switch 1`] = `
                       numberOfLines={1}
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -1588,7 +1588,7 @@ exports[`PermissionsSummary should render correctly for network switch 1`] = `
                         accessibilityRole="text"
                         style={
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "fontFamily": "Geist-Regular",
                             "fontSize": 14,
                             "letterSpacing": 0,
@@ -1602,7 +1602,7 @@ exports[`PermissionsSummary should render correctly for network switch 1`] = `
                         accessibilityRole="text"
                         style={
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "fontFamily": "Geist-Medium",
                             "fontSize": 14,
                             "letterSpacing": 0,
@@ -1674,7 +1674,7 @@ exports[`PermissionsSummary should render correctly for network switch 1`] = `
             {
               "alignItems": "center",
               "alignSelf": "flex-start",
-              "backgroundColor": "#3c4d9d0f",
+              "backgroundColor": "#b4b4b528",
               "borderColor": "transparent",
               "borderRadius": 12,
               "borderWidth": 1,
@@ -1744,7 +1744,7 @@ exports[`PermissionsSummary should render correctly for network switch 1`] = `
                 },
                 {
                   "backgroundColor": "#ffffff",
-                  "borderColor": "#686e7d",
+                  "borderColor": "#66676a",
                   "borderWidth": 1,
                 },
                 [
@@ -1778,7 +1778,7 @@ exports[`PermissionsSummary should render correctly for network switch 1`] = `
                     "textAlign": "center",
                   },
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                   },
                   undefined,
                 ],
@@ -1859,7 +1859,7 @@ exports[`PermissionsSummary should render only the account permissions card when
 <RCTSafeAreaView
   style={
     {
-      "backgroundColor": "#f3f5f9",
+      "backgroundColor": "#f3f3f4",
     }
   }
 >
@@ -1867,7 +1867,7 @@ exports[`PermissionsSummary should render only the account permissions card when
     style={
       [
         {
-          "backgroundColor": "#f3f5f9",
+          "backgroundColor": "#f3f3f4",
           "borderTopLeftRadius": 20,
           "borderTopRightRadius": 20,
           "height": 325,
@@ -1951,8 +1951,8 @@ exports[`PermissionsSummary should render only the account permissions card when
                     style={
                       {
                         "alignItems": "center",
-                        "backgroundColor": "#f3f5f9",
-                        "borderColor": "#b7bbc866",
+                        "backgroundColor": "#f3f3f4",
+                        "borderColor": "#b4b4b566",
                         "borderRadius": 16,
                         "borderWidth": 1,
                         "height": 32,
@@ -1966,7 +1966,7 @@ exports[`PermissionsSummary should render only the account permissions card when
                       accessibilityRole="text"
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -2086,9 +2086,9 @@ exports[`PermissionsSummary should render only the account permissions card when
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Bold",
-              "fontSize": 18,
+              "fontSize": 20,
               "letterSpacing": 0,
               "lineHeight": 24,
               "textAlign": "center",
@@ -2101,7 +2101,7 @@ exports[`PermissionsSummary should render only the account permissions card when
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -2154,7 +2154,7 @@ exports[`PermissionsSummary should render only the account permissions card when
               }
             >
               <SvgMock
-                color="#686e7d"
+                color="#66676a"
                 fill="currentColor"
                 height={20}
                 name="Wallet"
@@ -2179,7 +2179,7 @@ exports[`PermissionsSummary should render only the account permissions card when
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -2211,7 +2211,7 @@ exports[`PermissionsSummary should render only the account permissions card when
                     numberOfLines={1}
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -2224,7 +2224,7 @@ exports[`PermissionsSummary should render only the account permissions card when
                       accessibilityRole="text"
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 14,
                           "letterSpacing": 0,
@@ -2294,7 +2294,7 @@ exports[`PermissionsSummary should render only the account permissions card when
               testID="connection-details-button"
             >
               <SvgMock
-                color="#121314"
+                color="#131416"
                 fill="currentColor"
                 height={20}
                 name="ArrowRight"
@@ -2338,7 +2338,7 @@ exports[`PermissionsSummary should render only the account permissions card when
             {
               "alignItems": "center",
               "alignSelf": "flex-start",
-              "backgroundColor": "#3c4d9d0f",
+              "backgroundColor": "#b4b4b528",
               "borderColor": "transparent",
               "borderRadius": 12,
               "borderWidth": 1,
@@ -2408,7 +2408,7 @@ exports[`PermissionsSummary should render only the account permissions card when
                 },
                 {
                   "backgroundColor": "#ffffff",
-                  "borderColor": "#686e7d",
+                  "borderColor": "#66676a",
                   "borderWidth": 1,
                 },
                 [
@@ -2442,7 +2442,7 @@ exports[`PermissionsSummary should render only the account permissions card when
                     "textAlign": "center",
                   },
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                   },
                   undefined,
                 ],
@@ -2523,7 +2523,7 @@ exports[`PermissionsSummary should render only the network permissions card when
 <RCTSafeAreaView
   style={
     {
-      "backgroundColor": "#f3f5f9",
+      "backgroundColor": "#f3f3f4",
     }
   }
 >
@@ -2531,7 +2531,7 @@ exports[`PermissionsSummary should render only the network permissions card when
     style={
       [
         {
-          "backgroundColor": "#f3f5f9",
+          "backgroundColor": "#f3f3f4",
           "borderTopLeftRadius": 20,
           "borderTopRightRadius": 20,
           "height": 325,
@@ -2612,7 +2612,7 @@ exports[`PermissionsSummary should render only the network permissions card when
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 24,
                       "textAlign": "center",
@@ -2653,9 +2653,9 @@ exports[`PermissionsSummary should render only the network permissions card when
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Bold",
-              "fontSize": 18,
+              "fontSize": 20,
               "letterSpacing": 0,
               "lineHeight": 24,
               "textAlign": "center",
@@ -2668,7 +2668,7 @@ exports[`PermissionsSummary should render only the network permissions card when
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -2720,7 +2720,7 @@ exports[`PermissionsSummary should render only the network permissions card when
               }
             >
               <SvgMock
-                color="#686e7d"
+                color="#66676a"
                 fill="currentColor"
                 height={20}
                 name="Data"
@@ -2745,7 +2745,7 @@ exports[`PermissionsSummary should render only the network permissions card when
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -2777,7 +2777,7 @@ exports[`PermissionsSummary should render only the network permissions card when
                     numberOfLines={1}
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -2789,7 +2789,7 @@ exports[`PermissionsSummary should render only the network permissions card when
                       accessibilityRole="text"
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 14,
                           "letterSpacing": 0,
@@ -2870,7 +2870,7 @@ exports[`PermissionsSummary should render only the network permissions card when
               testID="connection-details-button"
             >
               <SvgMock
-                color="#121314"
+                color="#131416"
                 fill="currentColor"
                 height={20}
                 name="ArrowRight"
@@ -2914,7 +2914,7 @@ exports[`PermissionsSummary should render only the network permissions card when
             {
               "alignItems": "center",
               "alignSelf": "flex-start",
-              "backgroundColor": "#3c4d9d0f",
+              "backgroundColor": "#b4b4b528",
               "borderColor": "transparent",
               "borderRadius": 12,
               "borderWidth": 1,
@@ -2984,7 +2984,7 @@ exports[`PermissionsSummary should render only the network permissions card when
                 },
                 {
                   "backgroundColor": "#ffffff",
-                  "borderColor": "#686e7d",
+                  "borderColor": "#66676a",
                   "borderWidth": 1,
                 },
                 [
@@ -3018,7 +3018,7 @@ exports[`PermissionsSummary should render only the network permissions card when
                     "textAlign": "center",
                   },
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                   },
                   undefined,
                 ],
@@ -3099,7 +3099,7 @@ exports[`PermissionsSummary should render the tab view when both showAccountsOnl
 <RCTSafeAreaView
   style={
     {
-      "backgroundColor": "#f3f5f9",
+      "backgroundColor": "#f3f3f4",
     }
   }
 >
@@ -3107,7 +3107,7 @@ exports[`PermissionsSummary should render the tab view when both showAccountsOnl
     style={
       [
         {
-          "backgroundColor": "#f3f5f9",
+          "backgroundColor": "#f3f3f4",
           "borderTopLeftRadius": 20,
           "borderTopRightRadius": 20,
           "height": undefined,
@@ -3191,8 +3191,8 @@ exports[`PermissionsSummary should render the tab view when both showAccountsOnl
                     style={
                       {
                         "alignItems": "center",
-                        "backgroundColor": "#f3f5f9",
-                        "borderColor": "#b7bbc866",
+                        "backgroundColor": "#f3f3f4",
+                        "borderColor": "#b4b4b566",
                         "borderRadius": 16,
                         "borderWidth": 1,
                         "height": 32,
@@ -3206,7 +3206,7 @@ exports[`PermissionsSummary should render the tab view when both showAccountsOnl
                       accessibilityRole="text"
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -3326,9 +3326,9 @@ exports[`PermissionsSummary should render the tab view when both showAccountsOnl
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Bold",
-              "fontSize": 18,
+              "fontSize": 20,
               "letterSpacing": 0,
               "lineHeight": 24,
               "textAlign": "center",
@@ -3341,7 +3341,7 @@ exports[`PermissionsSummary should render the tab view when both showAccountsOnl
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -3426,7 +3426,7 @@ exports[`PermissionsSummary should render the tab view when both showAccountsOnl
                     style={
                       {
                         "backgroundColor": "#ffffff",
-                        "borderColor": "#b7bbc8",
+                        "borderColor": "#949596",
                         "borderRadius": 4,
                         "borderWidth": 0,
                         "height": 75,
@@ -3478,7 +3478,7 @@ exports[`PermissionsSummary should render the tab view when both showAccountsOnl
                           numberOfLines={1}
                           style={
                             {
-                              "color": "#121314",
+                              "color": "#131416",
                               "fontFamily": "Geist-Regular",
                               "fontSize": 16,
                               "letterSpacing": 0,
@@ -3492,7 +3492,7 @@ exports[`PermissionsSummary should render the tab view when both showAccountsOnl
                           numberOfLines={1}
                           style={
                             {
-                              "color": "#686e7d",
+                              "color": "#66676a",
                               "fontFamily": "Geist-Regular",
                               "fontSize": 16,
                               "letterSpacing": 0,
@@ -3523,7 +3523,7 @@ exports[`PermissionsSummary should render the tab view when both showAccountsOnl
                             accessibilityRole="text"
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Regular",
                                 "fontSize": 16,
                                 "letterSpacing": 0,
@@ -3669,7 +3669,7 @@ exports[`PermissionsSummary should render the tab view when both showAccountsOnl
                 }
               >
                 <SvgMock
-                  color="#686e7d"
+                  color="#66676a"
                   fill="currentColor"
                   height={20}
                   name="Wallet"
@@ -3694,7 +3694,7 @@ exports[`PermissionsSummary should render the tab view when both showAccountsOnl
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -3726,7 +3726,7 @@ exports[`PermissionsSummary should render the tab view when both showAccountsOnl
                       numberOfLines={1}
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -3739,7 +3739,7 @@ exports[`PermissionsSummary should render the tab view when both showAccountsOnl
                         accessibilityRole="text"
                         style={
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "fontFamily": "Geist-Regular",
                             "fontSize": 14,
                             "letterSpacing": 0,
@@ -3809,7 +3809,7 @@ exports[`PermissionsSummary should render the tab view when both showAccountsOnl
                 testID="connection-details-button"
               >
                 <SvgMock
-                  color="#121314"
+                  color="#131416"
                   fill="currentColor"
                   height={20}
                   name="ArrowRight"
@@ -3854,7 +3854,7 @@ exports[`PermissionsSummary should render the tab view when both showAccountsOnl
                 }
               >
                 <SvgMock
-                  color="#686e7d"
+                  color="#66676a"
                   fill="currentColor"
                   height={20}
                   name="Data"
@@ -3879,7 +3879,7 @@ exports[`PermissionsSummary should render the tab view when both showAccountsOnl
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -3911,7 +3911,7 @@ exports[`PermissionsSummary should render the tab view when both showAccountsOnl
                       numberOfLines={1}
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -3923,7 +3923,7 @@ exports[`PermissionsSummary should render the tab view when both showAccountsOnl
                         accessibilityRole="text"
                         style={
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "fontFamily": "Geist-Regular",
                             "fontSize": 14,
                             "letterSpacing": 0,
@@ -4004,7 +4004,7 @@ exports[`PermissionsSummary should render the tab view when both showAccountsOnl
                 testID="connection-details-button"
               >
                 <SvgMock
-                  color="#121314"
+                  color="#131416"
                   fill="currentColor"
                   height={20}
                   name="ArrowRight"
@@ -4049,7 +4049,7 @@ exports[`PermissionsSummary should render the tab view when both showAccountsOnl
             {
               "alignItems": "center",
               "alignSelf": "flex-start",
-              "backgroundColor": "#3c4d9d0f",
+              "backgroundColor": "#b4b4b528",
               "borderColor": "transparent",
               "borderRadius": 12,
               "borderWidth": 1,
@@ -4119,7 +4119,7 @@ exports[`PermissionsSummary should render the tab view when both showAccountsOnl
                 },
                 {
                   "backgroundColor": "#ffffff",
-                  "borderColor": "#686e7d",
+                  "borderColor": "#66676a",
                   "borderWidth": 1,
                 },
                 [
@@ -4153,7 +4153,7 @@ exports[`PermissionsSummary should render the tab view when both showAccountsOnl
                     "textAlign": "center",
                   },
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                   },
                   undefined,
                 ],
@@ -4234,7 +4234,7 @@ exports[`PermissionsSummary should render with the correct initial tab based on
 <RCTSafeAreaView
   style={
     {
-      "backgroundColor": "#f3f5f9",
+      "backgroundColor": "#f3f3f4",
     }
   }
 >
@@ -4242,7 +4242,7 @@ exports[`PermissionsSummary should render with the correct initial tab based on
     style={
       [
         {
-          "backgroundColor": "#f3f5f9",
+          "backgroundColor": "#f3f3f4",
           "borderTopLeftRadius": 20,
           "borderTopRightRadius": 20,
           "height": undefined,
@@ -4326,8 +4326,8 @@ exports[`PermissionsSummary should render with the correct initial tab based on
                     style={
                       {
                         "alignItems": "center",
-                        "backgroundColor": "#f3f5f9",
-                        "borderColor": "#b7bbc866",
+                        "backgroundColor": "#f3f3f4",
+                        "borderColor": "#b4b4b566",
                         "borderRadius": 16,
                         "borderWidth": 1,
                         "height": 32,
@@ -4341,7 +4341,7 @@ exports[`PermissionsSummary should render with the correct initial tab based on
                       accessibilityRole="text"
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -4461,9 +4461,9 @@ exports[`PermissionsSummary should render with the correct initial tab based on
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Bold",
-              "fontSize": 18,
+              "fontSize": 20,
               "letterSpacing": 0,
               "lineHeight": 24,
               "textAlign": "center",
@@ -4476,7 +4476,7 @@ exports[`PermissionsSummary should render with the correct initial tab based on
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -4561,7 +4561,7 @@ exports[`PermissionsSummary should render with the correct initial tab based on
                     style={
                       {
                         "backgroundColor": "#ffffff",
-                        "borderColor": "#b7bbc8",
+                        "borderColor": "#949596",
                         "borderRadius": 4,
                         "borderWidth": 0,
                         "height": 75,
@@ -4613,7 +4613,7 @@ exports[`PermissionsSummary should render with the correct initial tab based on
                           numberOfLines={1}
                           style={
                             {
-                              "color": "#121314",
+                              "color": "#131416",
                               "fontFamily": "Geist-Regular",
                               "fontSize": 16,
                               "letterSpacing": 0,
@@ -4627,7 +4627,7 @@ exports[`PermissionsSummary should render with the correct initial tab based on
                           numberOfLines={1}
                           style={
                             {
-                              "color": "#686e7d",
+                              "color": "#66676a",
                               "fontFamily": "Geist-Regular",
                               "fontSize": 16,
                               "letterSpacing": 0,
@@ -4658,7 +4658,7 @@ exports[`PermissionsSummary should render with the correct initial tab based on
                             accessibilityRole="text"
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Regular",
                                 "fontSize": 16,
                                 "letterSpacing": 0,
@@ -4804,7 +4804,7 @@ exports[`PermissionsSummary should render with the correct initial tab based on
                 }
               >
                 <SvgMock
-                  color="#686e7d"
+                  color="#66676a"
                   fill="currentColor"
                   height={20}
                   name="Wallet"
@@ -4829,7 +4829,7 @@ exports[`PermissionsSummary should render with the correct initial tab based on
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -4861,7 +4861,7 @@ exports[`PermissionsSummary should render with the correct initial tab based on
                       numberOfLines={1}
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -4874,7 +4874,7 @@ exports[`PermissionsSummary should render with the correct initial tab based on
                         accessibilityRole="text"
                         style={
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "fontFamily": "Geist-Regular",
                             "fontSize": 14,
                             "letterSpacing": 0,
@@ -4944,7 +4944,7 @@ exports[`PermissionsSummary should render with the correct initial tab based on
                 testID="connection-details-button"
               >
                 <SvgMock
-                  color="#121314"
+                  color="#131416"
                   fill="currentColor"
                   height={20}
                   name="ArrowRight"
@@ -4989,7 +4989,7 @@ exports[`PermissionsSummary should render with the correct initial tab based on
                 }
               >
                 <SvgMock
-                  color="#686e7d"
+                  color="#66676a"
                   fill="currentColor"
                   height={20}
                   name="Data"
@@ -5014,7 +5014,7 @@ exports[`PermissionsSummary should render with the correct initial tab based on
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -5046,7 +5046,7 @@ exports[`PermissionsSummary should render with the correct initial tab based on
                       numberOfLines={1}
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -5058,7 +5058,7 @@ exports[`PermissionsSummary should render with the correct initial tab based on
                         accessibilityRole="text"
                         style={
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "fontFamily": "Geist-Regular",
                             "fontSize": 14,
                             "letterSpacing": 0,
@@ -5139,7 +5139,7 @@ exports[`PermissionsSummary should render with the correct initial tab based on
                 testID="connection-details-button"
               >
                 <SvgMock
-                  color="#121314"
+                  color="#131416"
                   fill="currentColor"
                   height={20}
                   name="ArrowRight"
@@ -5184,7 +5184,7 @@ exports[`PermissionsSummary should render with the correct initial tab based on
             {
               "alignItems": "center",
               "alignSelf": "flex-start",
-              "backgroundColor": "#3c4d9d0f",
+              "backgroundColor": "#b4b4b528",
               "borderColor": "transparent",
               "borderRadius": 12,
               "borderWidth": 1,
@@ -5254,7 +5254,7 @@ exports[`PermissionsSummary should render with the correct initial tab based on
                 },
                 {
                   "backgroundColor": "#ffffff",
-                  "borderColor": "#686e7d",
+                  "borderColor": "#66676a",
                   "borderWidth": 1,
                 },
                 [
@@ -5288,7 +5288,7 @@ exports[`PermissionsSummary should render with the correct initial tab based on
                     "textAlign": "center",
                   },
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                   },
                   undefined,
                 ],
diff --git a/app/components/UI/Perps/Views/PerpsHeroCardView/PerpsHeroCardView.test.tsx b/app/components/UI/Perps/Views/PerpsHeroCardView/PerpsHeroCardView.test.tsx
index f9ac416afb41..3b1250cf7323 100644
--- a/app/components/UI/Perps/Views/PerpsHeroCardView/PerpsHeroCardView.test.tsx
+++ b/app/components/UI/Perps/Views/PerpsHeroCardView/PerpsHeroCardView.test.tsx
@@ -270,7 +270,7 @@ describe('PerpsHeroCardView', () => {
 
       const pnlText = getByTestId(getPerpsHeroCardViewSelector.pnlText(0));
 
-      expect(pnlText).toHaveTextContent('+10.0%');
+      expect(pnlText).toHaveTextContent('+10.00%');
     });
   });
 
@@ -627,7 +627,7 @@ describe('PerpsHeroCardView', () => {
 
       const pnlText = getByTestId(getPerpsHeroCardViewSelector.pnlText(0));
 
-      expect(pnlText).toHaveTextContent('-10.0%');
+      expect(pnlText).toHaveTextContent('-10.00%');
     });
   });
 });
diff --git a/app/components/UI/Perps/Views/PerpsHeroCardView/PerpsHeroCardView.tsx b/app/components/UI/Perps/Views/PerpsHeroCardView/PerpsHeroCardView.tsx
index 36dbdd5f240d..8f058e4d75c1 100644
--- a/app/components/UI/Perps/Views/PerpsHeroCardView/PerpsHeroCardView.tsx
+++ b/app/components/UI/Perps/Views/PerpsHeroCardView/PerpsHeroCardView.tsx
@@ -195,7 +195,7 @@ const PerpsHeroCardView: React.FC = () => {
   };
 
   const pnlSign = data.pnl >= 0 ? '+' : '';
-  const pnlDisplay = `${pnlSign}${data.roe.toFixed(1)}%`;
+  const pnlDisplay = `${pnlSign}${data.roe.toFixed(2)}%`;
   const directionText =
     data.direction.charAt(0).toUpperCase() + data.direction.slice(1);
   const directionBadgeText = data.leverage
diff --git a/app/components/UI/Perps/Views/PerpsHomeView/PerpsHomeView.test.tsx b/app/components/UI/Perps/Views/PerpsHomeView/PerpsHomeView.test.tsx
index 2651ce163de6..87b5af4f31cf 100644
--- a/app/components/UI/Perps/Views/PerpsHomeView/PerpsHomeView.test.tsx
+++ b/app/components/UI/Perps/Views/PerpsHomeView/PerpsHomeView.test.tsx
@@ -560,9 +560,7 @@ describe('PerpsHomeView', () => {
     // Act - Press search toggle
     fireEvent.press(getByTestId('perps-home-search-toggle'));
 
-    // Assert - Should navigate to MarketListView with search enabled and 'all' category
     expect(mockNavigateToMarketList).toHaveBeenCalledWith({
-      defaultSearchVisible: true,
       defaultMarketTypeFilter: 'all',
       source: PERPS_EVENT_VALUE.SOURCE.HOMESCREEN_TAB,
       fromHome: true,
diff --git a/app/components/UI/Perps/Views/PerpsHomeView/PerpsHomeView.tsx b/app/components/UI/Perps/Views/PerpsHomeView/PerpsHomeView.tsx
index 3de5b5e2bf77..e1b30cdbd255 100644
--- a/app/components/UI/Perps/Views/PerpsHomeView/PerpsHomeView.tsx
+++ b/app/components/UI/Perps/Views/PerpsHomeView/PerpsHomeView.tsx
@@ -231,10 +231,7 @@ const PerpsHomeView = () => {
         })
         .build(),
     );
-    // Navigate to MarketListView with search enabled and 'all' category
-    // When user closes search, they should see all markets (not a specific category)
     perpsNavigation.navigateToMarketList({
-      defaultSearchVisible: true,
       defaultMarketTypeFilter: 'all',
       source: PERPS_EVENT_VALUE.SOURCE.HOMESCREEN_TAB,
       fromHome: true,
diff --git a/app/components/UI/Perps/Views/PerpsMarketListView/PerpsMarketListView.styles.ts b/app/components/UI/Perps/Views/PerpsMarketListView/PerpsMarketListView.styles.ts
index 1e42557dff13..c362a8395477 100644
--- a/app/components/UI/Perps/Views/PerpsMarketListView/PerpsMarketListView.styles.ts
+++ b/app/components/UI/Perps/Views/PerpsMarketListView/PerpsMarketListView.styles.ts
@@ -135,6 +135,11 @@ const styleSheet = (params: { theme: Theme }) => {
     animatedListContainer: {
       flex: 1,
     },
+    searchBarRow: {
+      paddingHorizontal: 16,
+      paddingTop: 12,
+      paddingBottom: 8,
+    },
     searchContainer: {
       paddingTop: 16,
       paddingHorizontal: 16,
diff --git a/app/components/UI/Perps/Views/PerpsMarketListView/PerpsMarketListView.test.tsx b/app/components/UI/Perps/Views/PerpsMarketListView/PerpsMarketListView.test.tsx
index 2c202a3530aa..67a8d7300136 100644
--- a/app/components/UI/Perps/Views/PerpsMarketListView/PerpsMarketListView.test.tsx
+++ b/app/components/UI/Perps/Views/PerpsMarketListView/PerpsMarketListView.test.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { screen, fireEvent, act, waitFor } from '@testing-library/react-native';
+import { screen, fireEvent, waitFor } from '@testing-library/react-native';
 import {
   NavigationProp,
   ParamListBase,
@@ -76,22 +76,14 @@ jest.mock('../../hooks/stream', () => ({
 
 // Mock variables to hold state that will be set in beforeEach
 const mockMarketDataForHook: PerpsMarketData[] = [];
-let mockSearchVisible = false;
 let mockSearchQuery = '';
 
 // Create persistent mock functions that update the shared state
 const mockSetSearchQuery = jest.fn((q: string) => {
   mockSearchQuery = q;
 });
-const mockSetIsSearchVisible = jest.fn((v: boolean) => {
-  mockSearchVisible = v;
-});
-const mockToggleSearchVisibility = jest.fn(() => {
-  mockSearchVisible = !mockSearchVisible;
-});
 const mockClearSearch = jest.fn(() => {
   mockSearchQuery = '';
-  mockSearchVisible = false;
 });
 
 jest.mock('../../hooks', () => ({
@@ -151,9 +143,6 @@ jest.mock('../../hooks', () => ({
       searchState: {
         searchQuery: mockSearchQuery,
         setSearchQuery: mockSetSearchQuery,
-        isSearchVisible: mockSearchVisible, // This will be read fresh each render
-        setIsSearchVisible: mockSetIsSearchVisible,
-        toggleSearchVisibility: mockToggleSearchVisibility,
         clearSearch: mockClearSearch,
       },
       sortState: {
@@ -308,128 +297,6 @@ jest.mock('./components/PerpsMarketFiltersBar', () => {
   };
 });
 
-jest.mock(
-  '../../../../../component-library/components/Form/TextFieldSearch',
-  () => {
-    const {
-      TextInput,
-      View,
-      TouchableOpacity: RNTouchableOpacity,
-    } = jest.requireActual('react-native');
-    return function MockTextFieldSearch({
-      value,
-      onChangeText,
-      placeholder,
-      testID,
-      onPressClearButton,
-    }: {
-      value: string;
-      onChangeText: (text: string) => void;
-      placeholder: string;
-      testID: string;
-      onPressClearButton?: () => void;
-    }) {
-      return (
-        <View>
-          <TextInput
-            value={value}
-            onChangeText={onChangeText}
-            placeholder={placeholder}
-            testID={testID}
-          />
-          {!!value && (
-            <RNTouchableOpacity
-              onPress={onPressClearButton}
-              testID={`${testID}-clear`}
-            />
-          )}
-        </View>
-      );
-    };
-  },
-);
-
-// Mock PerpsMarketListHeader
-jest.mock('../../components/PerpsMarketListHeader', () => {
-  const ReactActual = jest.requireActual('react');
-  const { View, TouchableOpacity, TextInput, Pressable, Text } =
-    jest.requireActual('react-native');
-  return {
-    __esModule: true,
-    default: function PerpsMarketListHeader({
-      title,
-      isSearchVisible,
-      searchQuery,
-      onSearchQueryChange,
-      onBack,
-      onSearchToggle,
-      testID,
-    }: {
-      title?: string;
-      isSearchVisible?: boolean;
-      searchQuery?: string;
-      onSearchQueryChange?: (text: string) => void;
-      onSearchClear?: () => void;
-      onBack?: () => void;
-      onSearchToggle?: () => void;
-      testID?: string;
-    }) {
-      if (isSearchVisible) {
-        return ReactActual.createElement(
-          View,
-          { testID },
-          ReactActual.createElement(
-            View,
-            { testID: `${testID}-search-bar-container` },
-            ReactActual.createElement(View, { testID: 'search-icon' }),
-            ReactActual.createElement(TextInput, {
-              testID: `${testID}-search-input`,
-              placeholder: 'Search by token symbol',
-              value: searchQuery || '',
-              onChangeText: onSearchQueryChange,
-            }),
-            onSearchToggle &&
-              ReactActual.createElement(
-                Pressable,
-                {
-                  testID: `${testID}-search-close`,
-                  onPress: onSearchToggle,
-                },
-                ReactActual.createElement(Text, null, 'Cancel'),
-              ),
-          ),
-        );
-      }
-
-      return ReactActual.createElement(
-        View,
-        { testID },
-        ReactActual.createElement(
-          TouchableOpacity,
-          {
-            testID: `${testID}-back-button`,
-            onPress: onBack,
-          },
-          ReactActual.createElement(Text, null, '<'),
-        ),
-        ReactActual.createElement(
-          Text,
-          { testID: `${testID}-title` },
-          title || 'Perps',
-        ),
-        ReactActual.createElement(
-          TouchableOpacity,
-          {
-            testID: `${testID}-search-toggle`,
-            onPress: onSearchToggle,
-          },
-          ReactActual.createElement(Text, null, 'Search'),
-        ),
-      );
-    },
-  };
-});
-
 jest.mock('../../../../Views/confirmations/hooks/useConfirmNavigation', () => ({
   useConfirmNavigation: jest.fn(() => ({
     navigateToConfirmation: jest.fn(),
@@ -459,121 +326,6 @@ jest.mock('@metamask/design-system-twrnc-preset', () => ({
   }),
 }));
 
-// Mock design system - needed because real module requires tailwind setup
-jest.mock('@metamask/design-system-react-native', () => {
-  const {
-    View,
-    TouchableOpacity,
-    Text: RNText,
-  } = jest.requireActual('react-native');
-  const React = jest.requireActual('react');
-  return {
-    ...jest.requireActual('@metamask/design-system-react-native'),
-    Box: ({
-      children,
-      testID,
-    }: {
-      children: React.ReactNode;
-      testID?: string;
-    }) => React.createElement(View, { testID }, children),
-    ButtonIcon: ({
-      testID,
-      onPress,
-    }: {
-      testID?: string;
-      onPress?: () => void;
-    }) => React.createElement(TouchableOpacity, { testID, onPress }),
-    Text: ({
-      children,
-      testID,
-    }: {
-      children?: React.ReactNode;
-      testID?: string;
-    }) => React.createElement(RNText, { testID }, children),
-  };
-});
-
-jest.mock(
-  '../../../../../component-library/components/Navigation/TabBarItem',
-  () => {
-    const { TouchableOpacity: MockTouchable, Text: MockText } =
-      jest.requireActual('react-native');
-    return jest.fn(({ label, onPress, testID }) => (
-      <MockTouchable onPress={onPress} testID={testID}>
-        <MockText>{label}</MockText>
-      </MockTouchable>
-    ));
-  },
-);
-
-// Mock TabsBar and Tab components
-jest.mock(
-  '../../../../../component-library/components-temp/Tabs/TabsBar',
-  () => {
-    const ReactActual = jest.requireActual('react');
-    const { View, TouchableOpacity, Text } = jest.requireActual('react-native');
-    return {
-      __esModule: true,
-      default: function TabsBar({
-        tabs,
-        onTabPress,
-        testID,
-      }: {
-        tabs: { key: string; label: string }[];
-        activeIndex: number;
-        onTabPress: (index: number) => void;
-        testID?: string;
-      }) {
-        return ReactActual.createElement(
-          View,
-          { testID },
-          tabs.map((tab, index) =>
-            ReactActual.createElement(
-              TouchableOpacity,
-              {
-                key: tab.key,
-                testID: testID ? `${testID}-tab-${index}` : undefined,
-                onPress: () => onTabPress(index),
-              },
-              ReactActual.createElement(Text, null, tab.label),
-            ),
-          ),
-        );
-      },
-    };
-  },
-);
-
-jest.mock('../../../../../component-library/components-temp/Tabs/Tab', () => {
-  const ReactActual = jest.requireActual('react');
-  const { View, Pressable, Text } = jest.requireActual('react-native');
-  return {
-    __esModule: true,
-    default: function Tab({
-      label,
-      onPress,
-      testID,
-      onLayout,
-    }: {
-      label: string;
-      isActive?: boolean;
-      onPress?: () => void;
-      testID?: string;
-      onLayout?: (event: unknown) => void;
-    }) {
-      return ReactActual.createElement(
-        View,
-        { testID, onLayout },
-        ReactActual.createElement(
-          Pressable,
-          { onPress },
-          ReactActual.createElement(Text, null, label),
-        ),
-      );
-    },
-  };
-});
-
 // Mock Animated to prevent act() warnings
 jest.mock('react-native', () => {
   const RN = jest.requireActual('react-native');
@@ -635,30 +387,6 @@ jest.mock('../../hooks/usePerpsAssetsMetadata', () => ({
   })),
 }));
 
-// Mock component-library Text component with FontWeight
-jest.mock('../../../../../component-library/components/Texts/Text', () => {
-  const { Text } = jest.requireActual('react-native');
-  return {
-    __esModule: true,
-    default: Text,
-    TextVariant: {
-      BodyMd: 'BodyMd',
-      BodySM: 'BodySM',
-      HeadingMD: 'HeadingMD',
-      HeadingSM: 'HeadingSM',
-    },
-    TextColor: {
-      Default: 'Default',
-      Alternative: 'Alternative',
-    },
-    FontWeight: {
-      Bold: 'bold',
-      Medium: 'medium',
-      Regular: 'regular',
-    },
-  };
-});
-
 interface FlashListProps {
   data: PerpsMarketData[];
   renderItem: ({
@@ -822,11 +550,8 @@ describe('PerpsMarketListView', () => {
     mockMarketDataForHook.push(...mockMarketData);
 
     // Reset search state
-    mockSearchVisible = false;
     mockSearchQuery = '';
     mockSetSearchQuery.mockClear();
-    mockSetIsSearchVisible.mockClear();
-    mockToggleSearchVisibility.mockClear();
     mockClearSearch.mockClear();
 
     // Suppress console warnings for Animated during tests
@@ -868,17 +593,14 @@ describe('PerpsMarketListView', () => {
   });
 
   describe('Component Rendering', () => {
-    it('renders the component with header and search button', async () => {
+    it('renders the component with header and search bar', async () => {
       renderWithProvider(<PerpsMarketListView />, { state: mockState });
 
       expect(screen.getByText('Markets')).toBeOnTheScreen();
       expect(
-        screen.getByTestId(
-          `${PerpsMarketListViewSelectorsIDs.CLOSE_BUTTON}-search-toggle`,
-        ),
+        screen.getByTestId(PerpsMarketListViewSelectorsIDs.SEARCH_BAR),
       ).toBeOnTheScreen();
 
-      // Wait for filter bar to render (it renders when tabs exist and markets are available)
       await waitFor(() => {
         expect(screen.getByText('Volume')).toBeOnTheScreen();
       });
@@ -900,11 +622,8 @@ describe('PerpsMarketListView', () => {
     it('renders interactive elements', async () => {
       renderWithProvider(<PerpsMarketListView />, { state: mockState });
 
-      // Should have search toggle button and market rows
       expect(
-        screen.getByTestId(
-          `${PerpsMarketListViewSelectorsIDs.CLOSE_BUTTON}-search-toggle`,
-        ),
+        screen.getByTestId(PerpsMarketListViewSelectorsIDs.SEARCH_BAR),
       ).toBeOnTheScreen();
 
       await waitFor(() => {
@@ -919,194 +638,32 @@ describe('PerpsMarketListView', () => {
   });
 
   describe('Search Functionality', () => {
-    it('shows search input when search button is pressed', async () => {
-      const { rerender } = renderWithProvider(<PerpsMarketListView />, {
-        state: mockState,
-      });
+    it('shows search bar always visible', async () => {
+      renderWithProvider(<PerpsMarketListView />, { state: mockState });
 
-      // Initially search should not be visible
       expect(
-        screen.queryByPlaceholderText('Search by token symbol'),
-      ).not.toBeOnTheScreen();
-
-      // Click search toggle button
-      const searchButton = screen.getByTestId(
-        `${PerpsMarketListViewSelectorsIDs.CLOSE_BUTTON}-search-toggle`,
-      );
-      await act(async () => {
-        fireEvent.press(searchButton);
-        rerender(<PerpsMarketListView />);
-      });
-
-      // Now search input should be visible
-      await waitFor(() => {
-        expect(
-          screen.getByPlaceholderText('Search by token symbol'),
-        ).toBeOnTheScreen();
-      });
-    });
-
-    it('shows all markets when search is visible with empty query', async () => {
-      const { rerender } = renderWithProvider(<PerpsMarketListView />, {
-        state: mockState,
-      });
-
-      const btcRows = screen.queryAllByTestId('market-row-BTC');
-      const ethRows = screen.queryAllByTestId('market-row-ETH');
-      const solRows = screen.queryAllByTestId('market-row-SOL');
-      expect(btcRows.length).toBeGreaterThan(0);
-      expect(ethRows.length).toBeGreaterThan(0);
-      expect(solRows.length).toBeGreaterThan(0);
-
-      const searchButton = screen.getByTestId(
-        `${PerpsMarketListViewSelectorsIDs.CLOSE_BUTTON}-search-toggle`,
-      );
-      await act(async () => {
-        fireEvent.press(searchButton);
-        rerender(<PerpsMarketListView />);
-      });
-
-      await waitFor(() => {
-        expect(
-          screen.getByPlaceholderText('Search by token symbol'),
-        ).toBeOnTheScreen();
-      });
-
-      // Markets should still be visible with empty search query
-      const btcRowsAfter = screen.queryAllByTestId('market-row-BTC');
-      const ethRowsAfter = screen.queryAllByTestId('market-row-ETH');
-      const solRowsAfter = screen.queryAllByTestId('market-row-SOL');
-      expect(btcRowsAfter.length).toBeGreaterThan(0);
-      expect(ethRowsAfter.length).toBeGreaterThan(0);
-      expect(solRowsAfter.length).toBeGreaterThan(0);
-    });
-
-    it('hides PerpsMarketBalanceActions when search is visible', async () => {
-      const { rerender } = renderWithProvider(<PerpsMarketListView />, {
-        state: mockState,
-      });
-
-      // Initially balance actions should be visible
+        screen.getByTestId(PerpsMarketListViewSelectorsIDs.SEARCH_BAR),
+      ).toBeOnTheScreen();
       expect(
-        screen.getByTestId('perps-market-balance-actions'),
+        screen.getByPlaceholderText('Search by token symbol'),
       ).toBeOnTheScreen();
-
-      // Click search toggle button to show search
-      const searchButton = screen.getByTestId(
-        `${PerpsMarketListViewSelectorsIDs.CLOSE_BUTTON}-search-toggle`,
-      );
-      await act(async () => {
-        fireEvent.press(searchButton);
-        rerender(<PerpsMarketListView />);
-      });
-
-      // Balance actions should now be hidden (component hides it when search is visible)
-      await waitFor(() => {
-        expect(
-          screen.queryByTestId('perps-market-balance-actions'),
-        ).not.toBeOnTheScreen();
-      });
-
-      // Search input should be visible
-      await waitFor(() => {
-        expect(
-          screen.getByPlaceholderText('Search by token symbol'),
-        ).toBeOnTheScreen();
-      });
     });
 
-    it('shows search input when search toggle is pressed', async () => {
-      const { rerender } = renderWithProvider(<PerpsMarketListView />, {
-        state: mockState,
-      });
+    it('shows all markets when search query is empty', async () => {
+      renderWithProvider(<PerpsMarketListView />, { state: mockState });
 
-      // Initially search should not be visible
       expect(
-        screen.queryByPlaceholderText('Search by token symbol'),
-      ).not.toBeOnTheScreen();
-
-      // Click search toggle button to show search
-      const searchButton = screen.getByTestId(
-        `${PerpsMarketListViewSelectorsIDs.CLOSE_BUTTON}-search-toggle`,
-      );
-      await act(async () => {
-        fireEvent.press(searchButton);
-        rerender(<PerpsMarketListView />);
-      });
-
-      // Search input should be visible
-      await waitFor(() => {
-        expect(
-          screen.getByPlaceholderText('Search by token symbol'),
-        ).toBeOnTheScreen();
-      });
-    });
-
-    it('hides search when cancel is pressed while search is visible', async () => {
-      const { rerender } = renderWithProvider(<PerpsMarketListView />, {
-        state: mockState,
-      });
-
-      // Click search toggle button to show search
-      const searchButton = screen.getByTestId(
-        `${PerpsMarketListViewSelectorsIDs.CLOSE_BUTTON}-search-toggle`,
-      );
-      await act(async () => {
-        fireEvent.press(searchButton);
-        rerender(<PerpsMarketListView />);
-      });
-
-      // Search input should be visible
-      await waitFor(() => {
-        expect(
-          screen.getByPlaceholderText('Search by token symbol'),
-        ).toBeOnTheScreen();
-      });
-
-      // Click the cancel button to close search
-      const cancelButton = screen.getByTestId(
-        `${PerpsMarketListViewSelectorsIDs.CLOSE_BUTTON}-search-close`,
-      );
-      await act(async () => {
-        fireEvent.press(cancelButton);
-        rerender(<PerpsMarketListView />);
-      });
-
-      // Search should be hidden
-      await waitFor(() => {
-        expect(
-          screen.queryByPlaceholderText('Search by token symbol'),
-        ).not.toBeOnTheScreen();
-      });
-    });
-
-    it('handles keyboard dismissal while search is visible', async () => {
-      const { rerender } = renderWithProvider(<PerpsMarketListView />, {
-        state: mockState,
-      });
-
-      // Click search toggle button to show search
-      const searchButton = screen.getByTestId(
-        `${PerpsMarketListViewSelectorsIDs.CLOSE_BUTTON}-search-toggle`,
-      );
-      await act(async () => {
-        fireEvent.press(searchButton);
-        rerender(<PerpsMarketListView />);
-      });
+        screen.getByTestId(PerpsMarketListViewSelectorsIDs.SEARCH_BAR),
+      ).toBeOnTheScreen();
 
-      // Search input should be visible
       await waitFor(() => {
-        expect(
-          screen.getByPlaceholderText('Search by token symbol'),
-        ).toBeOnTheScreen();
+        const btcRows = screen.queryAllByTestId('market-row-BTC');
+        const ethRows = screen.queryAllByTestId('market-row-ETH');
+        const solRows = screen.queryAllByTestId('market-row-SOL');
+        expect(btcRows.length).toBeGreaterThan(0);
+        expect(ethRows.length).toBeGreaterThan(0);
+        expect(solRows.length).toBeGreaterThan(0);
       });
-
-      // Note: PerpsMarketListHeader doesn't use Keyboard.addListener.
-      // It uses Keyboard.dismiss() directly in the Pressable onPress handler.
-      // This test verifies that search remains visible (which it does).
-      expect(
-        screen.getByPlaceholderText('Search by token symbol'),
-      ).toBeOnTheScreen();
     });
   });
 
@@ -1196,14 +753,13 @@ describe('PerpsMarketListView', () => {
 
   describe('Navigation', () => {
     it('does not navigate back when canGoBack returns false', () => {
-      const { TouchableOpacity } = jest.requireActual('react-native');
       mockNavigation.canGoBack.mockReturnValue(false);
       renderWithProvider(<PerpsMarketListView />, { state: mockState });
 
-      // Find close button (first TouchableOpacity after the market rows)
-      const touchableElements = screen.root.findAllByType(TouchableOpacity);
-      const closeButton = touchableElements[0]; // Close button is the first one
-      fireEvent.press(closeButton);
+      const backButton = screen.getByTestId(
+        `${PerpsMarketListViewSelectorsIDs.CLOSE_BUTTON}-back-button`,
+      );
+      fireEvent.press(backButton);
 
       expect(mockNavigation.goBack).not.toHaveBeenCalled();
     });
@@ -1242,8 +798,6 @@ describe('PerpsMarketListView', () => {
     it('filters markets with whitespace-only query', async () => {
       const { usePerpsMarketListView } = jest.requireMock('../../hooks');
 
-      // Start with search visible
-      mockSearchVisible = true;
       mockSearchQuery = '   ';
 
       // Mock to return empty results when search query is whitespace
@@ -1252,9 +806,6 @@ describe('PerpsMarketListView', () => {
         searchState: {
           searchQuery: '   ',
           setSearchQuery: mockSetSearchQuery,
-          isSearchVisible: true,
-          setIsSearchVisible: mockSetIsSearchVisible,
-          toggleSearchVisibility: mockToggleSearchVisibility,
           clearSearch: mockClearSearch,
         },
         sortState: {
diff --git a/app/components/UI/Perps/Views/PerpsMarketListView/PerpsMarketListView.tsx b/app/components/UI/Perps/Views/PerpsMarketListView/PerpsMarketListView.tsx
index 589fa2ffb9e0..c665775e0da9 100644
--- a/app/components/UI/Perps/Views/PerpsMarketListView/PerpsMarketListView.tsx
+++ b/app/components/UI/Perps/Views/PerpsMarketListView/PerpsMarketListView.tsx
@@ -7,12 +7,12 @@ import React, {
 } from 'react';
 import { View, Animated } from 'react-native';
 import { useStyles } from '../../../../../component-library/hooks';
-import { IconName as DSIconName } from '@metamask/design-system-react-native';
 import Icon, {
   IconName,
   IconSize,
 } from '../../../../../component-library/components/Icons/Icon';
 import HeaderCompactStandard from '../../../../../component-library/components-temp/HeaderCompactStandard';
+import TextFieldSearch from '../../../../../component-library/components/Form/TextFieldSearch/TextFieldSearch';
 import { strings } from '../../../../../../locales/i18n';
 import Text, {
   TextVariant,
@@ -44,7 +44,6 @@ import { TraceName } from '../../../../../util/trace';
 import { MetaMetricsEvents } from '../../../../../core/Analytics';
 import { usePerpsEventTracking } from '../../hooks/usePerpsEventTracking';
 import { PerpsNavigationParamList } from '../../types/navigation';
-import PerpsMarketListHeader from '../../components/PerpsMarketListHeader';
 
 const PerpsMarketListView = ({
   onMarketSelect,
@@ -52,23 +51,18 @@ const PerpsMarketListView = ({
   variant: propVariant,
   title: propTitle,
   showBalanceActions: propShowBalanceActions,
-  defaultSearchVisible: propDefaultSearchVisible,
   showWatchlistOnly: propShowWatchlistOnly,
 }: PerpsMarketListViewProps) => {
   const { styles, theme } = useStyles(styleSheet, {});
   const route =
     useRoute<RouteProp<PerpsNavigationParamList, 'PerpsMarketListView'>>();
 
-  // Use centralized navigation hook
   const perpsNavigation = usePerpsNavigation();
 
-  // Merge route params with props (route params take precedence)
   const variant = route.params?.variant ?? propVariant ?? 'full';
   const title = route.params?.title ?? propTitle;
   const showBalanceActions =
     route.params?.showBalanceActions ?? propShowBalanceActions ?? true;
-  const defaultSearchVisible =
-    route.params?.defaultSearchVisible ?? propDefaultSearchVisible ?? false;
   const showWatchlistOnly =
     route.params?.showWatchlistOnly ?? propShowWatchlistOnly ?? false;
   const defaultMarketTypeFilter =
@@ -77,10 +71,6 @@ const PerpsMarketListView = ({
   const fadeAnimation = useRef(new Animated.Value(0)).current;
   const [isSortFieldSheetVisible, setIsSortFieldSheetVisible] = useState(false);
 
-  // Store the market type filter before entering search, so we can restore it when exiting
-  const preSearchFilterRef = useRef<MarketTypeFilter>(defaultMarketTypeFilter);
-
-  // Use the combined market list view hook for all business logic
   const {
     markets: filteredMarkets,
     searchState,
@@ -91,21 +81,13 @@ const PerpsMarketListView = ({
     isLoading: isLoadingMarkets,
     error,
   } = usePerpsMarketListView({
-    defaultSearchVisible,
     enablePolling: false,
     showWatchlistOnly,
     defaultMarketTypeFilter,
-    showZeroVolume: __DEV__, // Only show $0.00 volume markets in development
+    showZeroVolume: __DEV__,
   });
 
-  // Destructure search state for easier access
-  const {
-    searchQuery,
-    setSearchQuery,
-    isSearchVisible,
-    toggleSearchVisibility,
-    clearSearch,
-  } = searchState;
+  const { searchQuery, setSearchQuery } = searchState;
 
   // Destructure sort state for easier access
   const { selectedOptionId, sortBy, direction, handleOptionChange } = sortState;
@@ -179,35 +161,8 @@ const PerpsMarketListView = ({
     }
   }, [filteredMarkets.length, fadeAnimation]);
 
-  // Use navigation hook for back button
   const handleBackPressed = perpsNavigation.navigateBack;
 
-  const handleSearchToggle = useCallback(() => {
-    // Toggle search visibility
-    toggleSearchVisibility();
-
-    if (isSearchVisible) {
-      // When disabling search, clear the query and restore the filter to what it was before search
-      clearSearch();
-      setMarketTypeFilter(preSearchFilterRef.current);
-    } else {
-      // When enabling search, store the current filter so we can restore it when exiting
-      preSearchFilterRef.current = marketTypeFilter;
-      // Track the event
-      track(MetaMetricsEvents.PERPS_UI_INTERACTION, {
-        [PERPS_EVENT_PROPERTY.INTERACTION_TYPE]:
-          PERPS_EVENT_VALUE.INTERACTION_TYPE.SEARCH_CLICKED,
-      });
-    }
-  }, [
-    isSearchVisible,
-    toggleSearchVisibility,
-    clearSearch,
-    track,
-    setMarketTypeFilter,
-    marketTypeFilter,
-  ]);
-
   // Performance tracking: Measure screen load time until market data is displayed
   usePerpsMeasurement({
     traceName: TraceName.PerpsMarketListView,
@@ -309,8 +264,8 @@ const PerpsMarketListView = ({
       );
     }
 
-    // Empty search results - show when search is visible and no markets match
-    if (isSearchVisible && filteredMarkets.length === 0) {
+    // Empty search results - show when user has typed and no markets match
+    if (searchQuery.trim() && filteredMarkets.length === 0) {
       return (
         <View style={styles.emptyStateContainer}>
           <Icon
@@ -349,7 +304,7 @@ const PerpsMarketListView = ({
           onMarketPress={handleMarketPress}
           sortBy={sortBy}
           showBadge={false}
-          filterKey={`${marketTypeFilter}-${isSearchVisible ? 'search' : 'list'}`}
+          filterKey={marketTypeFilter}
           testID={PerpsMarketListViewSelectorsIDs.MARKET_LIST}
         />
       </Animated.View>
@@ -358,43 +313,35 @@ const PerpsMarketListView = ({
 
   return (
     <SafeAreaView style={styles.container}>
-      {/* Header */}
-      {isSearchVisible ? (
-        <PerpsMarketListHeader
-          title={title}
-          isSearchVisible
-          searchQuery={searchQuery}
-          onSearchQueryChange={setSearchQuery}
-          onSearchClear={() => setSearchQuery('')}
-          onBack={handleBackPressed}
-          onSearchToggle={handleSearchToggle}
-          testID={PerpsMarketListViewSelectorsIDs.CLOSE_BUTTON}
-        />
-      ) : (
-        <HeaderCompactStandard
-          title={title || strings('perps.home.markets')}
-          onBack={handleBackPressed}
-          backButtonProps={{
-            testID: `${PerpsMarketListViewSelectorsIDs.CLOSE_BUTTON}-back-button`,
-          }}
-          endButtonIconProps={[
-            {
-              iconName: DSIconName.Search,
-              onPress: handleSearchToggle,
-              testID: `${PerpsMarketListViewSelectorsIDs.CLOSE_BUTTON}-search-toggle`,
-            },
-          ]}
-          testID={PerpsMarketListViewSelectorsIDs.CLOSE_BUTTON}
-        />
-      )}
+      <HeaderCompactStandard
+        title={title || strings('perps.home.markets')}
+        onBack={handleBackPressed}
+        backButtonProps={{
+          testID: `${PerpsMarketListViewSelectorsIDs.CLOSE_BUTTON}-back-button`,
+        }}
+        testID={PerpsMarketListViewSelectorsIDs.CLOSE_BUTTON}
+      />
 
-      {/* Balance Actions Component - Only show in full variant when search not visible */}
-      {!isSearchVisible && showBalanceActions && variant === 'full' && (
+      {showBalanceActions && variant === 'full' && (
         <PerpsMarketBalanceActions />
       )}
 
-      {/* Filter Bar - Show when not loading and no error */}
-      {!isSearchVisible && !isLoadingMarkets && !error && (
+      {!isLoadingMarkets && !error && (
+        <View style={styles.searchBarRow}>
+          <TextFieldSearch
+            value={searchQuery}
+            onChangeText={setSearchQuery}
+            onPressClearButton={() => setSearchQuery('')}
+            placeholder={strings('perps.search_by_token_symbol')}
+            testID={PerpsMarketListViewSelectorsIDs.SEARCH_BAR}
+            clearButtonProps={{
+              testID: PerpsMarketListViewSelectorsIDs.SEARCH_CLEAR_BUTTON,
+            }}
+          />
+        </View>
+      )}
+
+      {!isLoadingMarkets && !error && (
         <PerpsMarketFiltersBar
           selectedOptionId={selectedOptionId}
           onSortPress={() => setIsSortFieldSheetVisible(true)}
diff --git a/app/components/UI/Perps/Views/PerpsMarketListView/PerpsMarketListView.types.ts b/app/components/UI/Perps/Views/PerpsMarketListView/PerpsMarketListView.types.ts
index e4f63caccbbc..2bfb4d4bd6c9 100644
--- a/app/components/UI/Perps/Views/PerpsMarketListView/PerpsMarketListView.types.ts
+++ b/app/components/UI/Perps/Views/PerpsMarketListView/PerpsMarketListView.types.ts
@@ -39,7 +39,6 @@ export interface PerpsMarketListViewProps {
   title?: string;
   /**
    * Show balance actions component (deposit/withdraw)
-   * Only applicable when search is not visible
    * @default true
    */
   showBalanceActions?: boolean;
@@ -48,11 +47,6 @@ export interface PerpsMarketListViewProps {
    * @default true
    */
   showBottomNav?: boolean;
-  /**
-   * Start with search bar visible
-   * @default false
-   */
-  defaultSearchVisible?: boolean;
   /**
    * Start with watchlist filter enabled (show only watchlisted markets)
    * @default false
diff --git a/app/components/UI/Perps/Views/PerpsMarketListView/PerpsMarketListView.view.test.tsx b/app/components/UI/Perps/Views/PerpsMarketListView/PerpsMarketListView.view.test.tsx
index 0c833ef79fbf..a98a4d76ac7c 100644
--- a/app/components/UI/Perps/Views/PerpsMarketListView/PerpsMarketListView.view.test.tsx
+++ b/app/components/UI/Perps/Views/PerpsMarketListView/PerpsMarketListView.view.test.tsx
@@ -80,14 +80,8 @@ describe('PerpsMarketListView', () => {
         streamOverrides: { marketData: marketDataWithCategories },
       });
 
-      const searchToggle = await screen.findByTestId(
-        `${PerpsMarketListViewSelectorsIDs.CLOSE_BUTTON}-search-toggle`,
-      );
-
-      fireEvent.press(searchToggle);
-
       const searchInput = await screen.findByTestId(
-        `${PerpsMarketListViewSelectorsIDs.CLOSE_BUTTON}-search-bar`,
+        PerpsMarketListViewSelectorsIDs.SEARCH_BAR,
       );
       fireEvent.changeText(searchInput, 'ZZZ-NOT-FOUND');
 
diff --git a/app/components/UI/Perps/Views/PerpsOrderBookView/PerpsOrderBookView.tsx b/app/components/UI/Perps/Views/PerpsOrderBookView/PerpsOrderBookView.tsx
index 69bd174f6c6c..229fb2c9c263 100644
--- a/app/components/UI/Perps/Views/PerpsOrderBookView/PerpsOrderBookView.tsx
+++ b/app/components/UI/Perps/Views/PerpsOrderBookView/PerpsOrderBookView.tsx
@@ -499,7 +499,7 @@ const PerpsOrderBookView: React.FC<PerpsOrderBookViewProps> = ({
             <ButtonIcon
               iconName={IconName.ArrowLeft}
               iconColor={IconColor.Default}
-              size={ButtonIconSizes.Lg}
+              size={ButtonIconSizes.Md}
               onPress={handleBack}
               testID={PerpsOrderBookViewSelectorsIDs.BACK_BUTTON}
             />
diff --git a/app/components/UI/Perps/Views/PerpsOrderLifecycleFlow.view.test.tsx b/app/components/UI/Perps/Views/PerpsOrderLifecycleFlow.view.test.tsx
index 3fc92129bfe6..c1d5a7164757 100644
--- a/app/components/UI/Perps/Views/PerpsOrderLifecycleFlow.view.test.tsx
+++ b/app/components/UI/Perps/Views/PerpsOrderLifecycleFlow.view.test.tsx
@@ -181,11 +181,13 @@ describe('Order Lifecycle & Funds Flow', () => {
       screen.getByText(strings('perps.provider_selector.title')),
     ).toBeOnTheScreen();
     expect(
-      screen.getByTestId('perps-select-provider-sheet-option-hyperliquid'),
+      screen.getByTestId(
+        'perps-select-provider-sheet-option-hyperliquid-mainnet',
+      ),
     ).toBeOnTheScreen();
     // MYX option hidden when feature flag is disabled
     expect(
-      screen.queryByTestId('perps-select-provider-sheet-option-myx'),
+      screen.queryByTestId('perps-select-provider-sheet-option-myx-mainnet'),
     ).not.toBeOnTheScreen();
 
     // With MYX enabled + aggregated provider → HyperLiquid shows selected
@@ -203,11 +205,11 @@ describe('Order Lifecycle & Funds Flow', () => {
     });
     expect(
       await screen.findByTestId(
-        'perps-select-provider-sheet-check-hyperliquid',
+        'perps-select-provider-sheet-check-aggregated-mainnet',
       ),
     ).toBeOnTheScreen();
     expect(
-      screen.queryByTestId('perps-select-provider-sheet-check-myx'),
+      screen.queryByTestId('perps-select-provider-sheet-check-myx-mainnet'),
     ).not.toBeOnTheScreen();
 
     // Trader selects MYX provider — switchProvider is called
@@ -216,7 +218,7 @@ describe('Order Lifecycle & Funds Flow', () => {
       .switchProvider as jest.Mock;
     renderPerpsSelectProviderView({ overrides: myxEnabledOverrides });
     const myxOption = await screen.findByTestId(
-      'perps-select-provider-sheet-option-myx',
+      'perps-select-provider-sheet-option-myx-mainnet',
     );
     fireEvent.press(myxOption);
     await waitFor(() => {
diff --git a/app/components/UI/Perps/Views/PerpsOrderView/PerpsOrderView.test.tsx b/app/components/UI/Perps/Views/PerpsOrderView/PerpsOrderView.test.tsx
index e21aed6c640e..3786c9869fa4 100644
--- a/app/components/UI/Perps/Views/PerpsOrderView/PerpsOrderView.test.tsx
+++ b/app/components/UI/Perps/Views/PerpsOrderView/PerpsOrderView.test.tsx
@@ -600,8 +600,9 @@ jest.mock('../../components/PerpsNotificationTooltip', () => {
   };
 });
 
-// Mock network utils - these are external utilities that should be mocked
+// Mock network utils - spread actual to satisfy transitive deps (e.g. stakeableTokens.getDecimalChainId), override only what we need
 jest.mock('../../../../../util/networks', () => ({
+  ...jest.requireActual('../../../../../util/networks'),
   getDefaultNetworkByChainId: jest.fn(() => ({ name: 'Arbitrum' })),
   getNetworkImageSource: jest.fn(() => ({ uri: 'network-icon' })),
 }));
diff --git a/app/components/UI/Perps/Views/PerpsOrderView/PerpsPayRow.test.tsx b/app/components/UI/Perps/Views/PerpsOrderView/PerpsPayRow.test.tsx
index ed7d374fbc73..808fd880830c 100644
--- a/app/components/UI/Perps/Views/PerpsOrderView/PerpsPayRow.test.tsx
+++ b/app/components/UI/Perps/Views/PerpsOrderView/PerpsPayRow.test.tsx
@@ -64,6 +64,7 @@ jest.mock('../../../../Views/confirmations/hooks/useConfirmNavigation', () => ({
 jest.mock('../../../../../util/address');
 jest.mock('../../../../Base/TokenIcon', () => jest.fn(() => null));
 jest.mock('../../../../../util/networks', () => ({
+  ...jest.requireActual('../../../../../util/networks'),
   getNetworkImageSource: jest.fn(() => ({ uri: 'network-icon.png' })),
 }));
 
diff --git a/app/components/UI/Perps/Views/PerpsSelectProviderView/PerpsSelectProviderView.test.tsx b/app/components/UI/Perps/Views/PerpsSelectProviderView/PerpsSelectProviderView.test.tsx
new file mode 100644
index 000000000000..d10a101f2f35
--- /dev/null
+++ b/app/components/UI/Perps/Views/PerpsSelectProviderView/PerpsSelectProviderView.test.tsx
@@ -0,0 +1,224 @@
+import React from 'react';
+import { render, act } from '@testing-library/react-native';
+import { useNavigation } from '@react-navigation/native';
+import { useSelector } from 'react-redux';
+import { usePerpsProvider } from '../../hooks/usePerpsProvider';
+import { usePerpsNetworkConfig } from '../../hooks/usePerpsNetworkConfig';
+import PerpsSelectProviderView from './PerpsSelectProviderView';
+
+jest.mock('@react-navigation/native', () => ({
+  useNavigation: jest.fn(),
+}));
+
+jest.mock('react-redux', () => ({
+  useSelector: jest.fn(),
+}));
+
+jest.mock('../../hooks/usePerpsProvider', () => ({
+  usePerpsProvider: jest.fn(),
+}));
+
+jest.mock('../../hooks/usePerpsNetworkConfig', () => ({
+  usePerpsNetworkConfig: jest.fn(),
+}));
+
+jest.mock('../../../../../util/Logger', () => ({
+  error: jest.fn(),
+}));
+
+// Configurable option for the sheet mock — set per-test to drive onOptionSelect
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+let mockSheetOption: any = {
+  id: 'myx-mainnet',
+  providerId: 'myx',
+  isTestnet: false,
+  name: 'MYX',
+  network: 'Mainnet',
+  description: '',
+};
+
+// Mock the sheet component so we can inspect the props passed to it
+jest.mock(
+  '../../components/PerpsProviderSelector/PerpsProviderSelectorSheet',
+  () => {
+    const { View, TouchableOpacity, Text } = jest.requireActual('react-native');
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    return {
+      __esModule: true,
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      default: ({ onClose, onOptionSelect, selectedOptionId, testID }: any) => (
+        <View testID={testID}>
+          <TouchableOpacity testID="btn-close" onPress={onClose} />
+          <TouchableOpacity
+            testID="btn-select-option"
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            onPress={() => onOptionSelect(mockSheetOption)}
+          />
+          <Text testID="selected-option-id">{selectedOptionId}</Text>
+        </View>
+      ),
+    };
+  },
+);
+
+const mockGoBack = jest.fn();
+const mockSwitchProvider = jest.fn();
+const mockToggleTestnet = jest.fn();
+const mockUseSelector = useSelector as jest.Mock;
+const mockUsePerpsProvider = usePerpsProvider as jest.Mock;
+const mockUsePerpsNetworkConfig = usePerpsNetworkConfig as jest.Mock;
+
+beforeEach(() => {
+  jest.clearAllMocks();
+  (useNavigation as jest.Mock).mockReturnValue({ goBack: mockGoBack });
+  mockUseSelector.mockReturnValue('mainnet');
+  mockUsePerpsProvider.mockReturnValue({
+    activeProvider: 'hyperliquid',
+    switchProvider: mockSwitchProvider,
+  });
+  mockUsePerpsNetworkConfig.mockReturnValue({
+    toggleTestnet: mockToggleTestnet,
+  });
+  mockSwitchProvider.mockResolvedValue({ success: true });
+  mockToggleTestnet.mockResolvedValue({ success: true });
+  // Default: select myx (provider changes, no network change)
+  mockSheetOption = {
+    id: 'myx-mainnet',
+    providerId: 'myx',
+    isTestnet: false,
+    name: 'MYX',
+    network: 'Mainnet',
+    description: '',
+  };
+});
+
+describe('PerpsSelectProviderView', () => {
+  it('renders the sheet with isVisible=true', () => {
+    const { getByTestId } = render(<PerpsSelectProviderView />);
+
+    expect(getByTestId('perps-select-provider-sheet')).toBeTruthy();
+  });
+
+  it('shows selectedOptionId as hyperliquid-mainnet by default', () => {
+    const { getByTestId } = render(<PerpsSelectProviderView />);
+
+    expect(getByTestId('selected-option-id').props.children).toBe(
+      'hyperliquid-mainnet',
+    );
+  });
+
+  it('shows testnet suffix when network is testnet', () => {
+    mockUseSelector.mockReturnValue('testnet');
+
+    const { getByTestId } = render(<PerpsSelectProviderView />);
+
+    expect(getByTestId('selected-option-id').props.children).toBe(
+      'hyperliquid-testnet',
+    );
+  });
+
+  it('calls navigation.goBack when onClose is triggered', () => {
+    const { getByTestId } = render(<PerpsSelectProviderView />);
+
+    act(() => {
+      getByTestId('btn-close').props.onPress();
+    });
+
+    expect(mockGoBack).toHaveBeenCalled();
+  });
+
+  it('calls switchProvider when provider changes', async () => {
+    const { getByTestId } = render(<PerpsSelectProviderView />);
+
+    await act(async () => {
+      getByTestId('btn-select-option').props.onPress();
+    });
+
+    expect(mockSwitchProvider).toHaveBeenCalledWith('myx');
+  });
+
+  it('does not call switchProvider or toggleTestnet when nothing changes', async () => {
+    // Same provider, same network → no-op
+    mockSheetOption = {
+      id: 'hyperliquid-mainnet',
+      providerId: 'hyperliquid',
+      isTestnet: false,
+      name: 'HyperLiquid',
+      network: 'Mainnet',
+      description: '',
+    };
+
+    const { getByTestId } = render(<PerpsSelectProviderView />);
+
+    await act(async () => {
+      getByTestId('btn-select-option').props.onPress();
+    });
+
+    expect(mockSwitchProvider).not.toHaveBeenCalled();
+    expect(mockToggleTestnet).not.toHaveBeenCalled();
+  });
+
+  it('calls toggleTestnet when only network changes (same provider)', async () => {
+    // Same provider, different network → only toggleTestnet
+    mockSheetOption = {
+      id: 'hyperliquid-testnet',
+      providerId: 'hyperliquid',
+      isTestnet: true,
+      name: 'HyperLiquid',
+      network: 'Testnet',
+      description: '',
+    };
+
+    const { getByTestId } = render(<PerpsSelectProviderView />);
+
+    await act(async () => {
+      getByTestId('btn-select-option').props.onPress();
+    });
+
+    expect(mockSwitchProvider).not.toHaveBeenCalled();
+    expect(mockToggleTestnet).toHaveBeenCalled();
+  });
+
+  it('logs error when switchProvider fails', async () => {
+    const Logger = jest.requireMock('../../../../../util/Logger');
+    mockSwitchProvider.mockResolvedValue({
+      success: false,
+      error: 'Switch failed',
+    });
+
+    const { getByTestId } = render(<PerpsSelectProviderView />);
+
+    await act(async () => {
+      getByTestId('btn-select-option').props.onPress();
+    });
+
+    expect(Logger.error).toHaveBeenCalled();
+  });
+
+  it('logs error when toggleTestnet fails', async () => {
+    const Logger = jest.requireMock('../../../../../util/Logger');
+    mockToggleTestnet.mockResolvedValue({
+      success: false,
+      error: 'Toggle failed',
+    });
+
+    // Network-only change: same provider, different isTestnet
+    mockSheetOption = {
+      id: 'hyperliquid-testnet',
+      providerId: 'hyperliquid',
+      isTestnet: true,
+      name: 'HyperLiquid',
+      network: 'Testnet',
+      description: '',
+    };
+
+    const { getByTestId } = render(<PerpsSelectProviderView />);
+
+    await act(async () => {
+      getByTestId('btn-select-option').props.onPress();
+    });
+
+    expect(mockToggleTestnet).toHaveBeenCalled();
+    expect(Logger.error).toHaveBeenCalled();
+  });
+});
diff --git a/app/components/UI/Perps/Views/PerpsSelectProviderView/PerpsSelectProviderView.tsx b/app/components/UI/Perps/Views/PerpsSelectProviderView/PerpsSelectProviderView.tsx
index a95d25b7cf93..de7b7a07b600 100644
--- a/app/components/UI/Perps/Views/PerpsSelectProviderView/PerpsSelectProviderView.tsx
+++ b/app/components/UI/Perps/Views/PerpsSelectProviderView/PerpsSelectProviderView.tsx
@@ -1,49 +1,78 @@
-import React, { useCallback } from 'react';
+import React, { useCallback, useMemo } from 'react';
 import { useNavigation } from '@react-navigation/native';
+import { useSelector } from 'react-redux';
 import Logger from '../../../../../util/Logger';
 import { usePerpsProvider } from '../../hooks/usePerpsProvider';
+import { usePerpsNetworkConfig } from '../../hooks/usePerpsNetworkConfig';
+import { selectPerpsNetwork } from '../../selectors/perpsController';
 import PerpsProviderSelectorSheet from '../../components/PerpsProviderSelector/PerpsProviderSelectorSheet';
-import type { PerpsProviderType } from '@metamask/perps-controller';
+import type { ProviderNetworkOption } from '../../components/PerpsProviderSelector/PerpsProviderSelector.types';
 
 /**
  * PerpsSelectProviderView
  *
  * Navigation-based wrapper for the provider selector bottom sheet.
- * This ensures the sheet renders at full-screen level rather than
- * being constrained by parent container bounds.
+ * Handles combined provider + network switching.
  */
 const PerpsSelectProviderView: React.FC = () => {
   const navigation = useNavigation();
   const { activeProvider, switchProvider } = usePerpsProvider();
+  const { toggleTestnet } = usePerpsNetworkConfig();
+  const network = useSelector(selectPerpsNetwork);
+  const isTestnet = network === 'testnet';
 
   const handleClose = useCallback(() => {
     navigation.goBack();
   }, [navigation]);
 
-  const handleProviderSelect = useCallback(
-    async (providerId: PerpsProviderType) => {
-      const result = await switchProvider(providerId);
-      if (!result.success) {
-        Logger.error(
-          new Error(`Failed to switch perps provider to ${providerId}`),
-          { message: result.error },
-        );
+  const selectedOptionId = useMemo(
+    () => `${activeProvider}-${isTestnet ? 'testnet' : 'mainnet'}`,
+    [activeProvider, isTestnet],
+  );
+
+  const handleOptionSelect = useCallback(
+    async (option: ProviderNetworkOption) => {
+      const providerChanged = option.providerId !== activeProvider;
+      const networkChanged = option.isTestnet !== isTestnet;
+
+      if (!providerChanged && !networkChanged) {
+        return;
+      }
+
+      // Switch provider first if needed
+      if (providerChanged) {
+        const result = await switchProvider(option.providerId);
+        if (!result.success) {
+          Logger.error(
+            new Error(
+              `Failed to switch perps provider to ${option.providerId}`,
+            ),
+            { message: result.error },
+          );
+          return;
+        }
+      }
+
+      // Then toggle network if needed
+      if (networkChanged) {
+        const result = await toggleTestnet();
+        if (!result.success) {
+          Logger.error(new Error(`Failed to toggle perps testnet`), {
+            message: result.error,
+          });
+          return;
+        }
       }
-      // Navigation is handled by handleClose when bottom sheet closes
     },
-    [switchProvider],
+    [activeProvider, isTestnet, switchProvider, toggleTestnet],
   );
 
-  // Determine selected provider, defaulting to hyperliquid for aggregated mode
-  const selectedProvider =
-    activeProvider !== 'aggregated' ? activeProvider : 'hyperliquid';
-
   return (
     <PerpsProviderSelectorSheet
       isVisible
       onClose={handleClose}
-      selectedProvider={selectedProvider}
-      onProviderSelect={handleProviderSelect}
+      selectedOptionId={selectedOptionId}
+      onOptionSelect={handleOptionSelect}
       testID="perps-select-provider-sheet"
     />
   );
diff --git a/app/components/UI/Perps/__mocks__/serviceMocks.ts b/app/components/UI/Perps/__mocks__/serviceMocks.ts
index 1117c9af2134..ae4edc0217ff 100644
--- a/app/components/UI/Perps/__mocks__/serviceMocks.ts
+++ b/app/components/UI/Perps/__mocks__/serviceMocks.ts
@@ -11,6 +11,23 @@ import {
   type PerpsPlatformDependencies,
 } from '@metamask/perps-controller';
 
+/**
+ * Create a mock EVM account (KeyringAccount)
+ */
+export const createMockEvmAccount = () => ({
+  id: '00000000-0000-0000-0000-000000000000',
+  address: '0x1234567890abcdef1234567890abcdef12345678' as `0x${string}`,
+  type: 'eip155:eoa' as const,
+  options: {},
+  scopes: ['eip155:1'],
+  methods: ['eth_signTransaction', 'eth_sign'],
+  metadata: {
+    name: 'Test Account',
+    importTime: Date.now(),
+    keyring: { type: 'HD Key Tree' },
+  },
+});
+
 /**
  * Create a mock PerpsPlatformDependencies instance.
  * Returns a type-safe mock with jest.Mock functions for all methods.
@@ -53,11 +70,6 @@ export const createMockInfrastructure =
         clearAllChannels: jest.fn(),
       },
 
-      // === Rewards (no standard messenger action in core) ===
-      rewards: {
-        getFeeDiscount: jest.fn().mockResolvedValue(0),
-      },
-
       // === Feature Flags (platform-specific version gating) ===
       featureFlags: {
         validateVersionGated: jest.fn().mockReturnValue(undefined),
@@ -76,6 +88,11 @@ export const createMockInfrastructure =
         invalidate: jest.fn(),
         invalidateAll: jest.fn(),
       },
+
+      // === Rewards (DI — no RewardsController in Core yet) ===
+      rewards: {
+        getPerpsDiscountForAccount: jest.fn().mockResolvedValue(0),
+      },
     }) as unknown as jest.Mocked<PerpsPlatformDependencies>;
 
 /**
@@ -128,13 +145,8 @@ export const createMockPerpsControllerState = (
   lastUpdateTimestamp: Date.now(),
   hip3ConfigVersion: 0,
   selectedPaymentToken: null,
-  cachedMarketData: null,
-  cachedMarketDataTimestamp: 0,
-  cachedPositions: null,
-  cachedOrders: null,
-  cachedAccountState: null,
-  cachedUserDataTimestamp: 0,
-  cachedUserDataAddress: null,
+  cachedMarketDataByProvider: {},
+  cachedUserDataByProvider: {},
   ...overrides,
 });
 
@@ -161,23 +173,6 @@ export const createMockServiceContext = (
   ...overrides,
 });
 
-/**
- * Create a mock EVM account (KeyringAccount)
- */
-export const createMockEvmAccount = () => ({
-  id: '00000000-0000-0000-0000-000000000000',
-  address: '0x1234567890abcdef1234567890abcdef12345678' as `0x${string}`,
-  type: 'eip155:eoa' as const,
-  options: {},
-  scopes: ['eip155:1'],
-  methods: ['eth_signTransaction', 'eth_sign'],
-  metadata: {
-    name: 'Test Account',
-    importTime: Date.now(),
-    keyring: { type: 'HD Key Tree' },
-  },
-});
-
 /**
  * Create a mock PerpsControllerMessenger for testing inter-controller communication.
  * The messenger.call() method should be configured in each test to return appropriate values.
diff --git a/app/components/UI/Perps/adapters/mobileInfrastructure.test.ts b/app/components/UI/Perps/adapters/mobileInfrastructure.test.ts
index baad6cc4f596..eb70ccec4720 100644
--- a/app/components/UI/Perps/adapters/mobileInfrastructure.test.ts
+++ b/app/components/UI/Perps/adapters/mobileInfrastructure.test.ts
@@ -3,6 +3,7 @@ import { AnalyticsEventBuilder } from '../../../../util/analytics/AnalyticsEvent
 import { analytics } from '../../../../util/analytics/analytics';
 import type { PerpsAnalyticsEvent } from '@metamask/perps-controller';
 import { createMobileInfrastructure } from './mobileInfrastructure';
+import Engine from '../../../../core/Engine';
 
 jest.mock('../../../../util/analytics/analytics', () => ({
   analytics: {
@@ -55,7 +56,7 @@ jest.mock('../providers/PerpsStreamManager', () => ({
 jest.mock('../../../../core/Engine', () => ({
   context: {
     RewardsController: {
-      getPerpsDiscountForAccount: jest.fn(),
+      getPerpsDiscountForAccount: jest.fn().mockResolvedValue(5),
     },
   },
 }));
@@ -159,4 +160,20 @@ describe('createMobileInfrastructure', () => {
       });
     });
   });
+
+  describe('rewards', () => {
+    it('delegates getPerpsDiscountForAccount to RewardsController', async () => {
+      const infra = createMobileInfrastructure();
+      const caipAccountId =
+        'eip155:42161:0x1234' as `${string}:${string}:${string}`;
+
+      const result =
+        await infra.rewards.getPerpsDiscountForAccount(caipAccountId);
+
+      expect(
+        Engine.context.RewardsController.getPerpsDiscountForAccount,
+      ).toHaveBeenCalledWith(caipAccountId);
+      expect(result).toBe(5);
+    });
+  });
 });
diff --git a/app/components/UI/Perps/adapters/mobileInfrastructure.ts b/app/components/UI/Perps/adapters/mobileInfrastructure.ts
index 91e873d26126..2e51bee9e55c 100644
--- a/app/components/UI/Perps/adapters/mobileInfrastructure.ts
+++ b/app/components/UI/Perps/adapters/mobileInfrastructure.ts
@@ -216,14 +216,6 @@ export function createMobileInfrastructure(): PerpsPlatformDependencies {
     // === Platform Services ===
     streamManager: createStreamManagerAdapter(),
 
-    // === Rewards ===
-    rewards: {
-      getFeeDiscount: (caipAccountId: `${string}:${string}:${string}`) =>
-        Engine.context.RewardsController.getPerpsDiscountForAccount(
-          caipAccountId,
-        ),
-    },
-
     // === Feature Flags ===
     featureFlags: {
       validateVersionGated(flag: VersionGatedFeatureFlag): boolean | undefined {
@@ -236,6 +228,17 @@ export function createMobileInfrastructure(): PerpsPlatformDependencies {
 
     // === Cache Invalidation ===
     cacheInvalidator: createCacheInvalidatorAdapter(),
+
+    // === Rewards (DI — no RewardsController in Core yet) ===
+    rewards: {
+      getPerpsDiscountForAccount(
+        caipAccountId: `${string}:${string}:${string}`,
+      ) {
+        return Engine.context.RewardsController.getPerpsDiscountForAccount(
+          caipAccountId,
+        );
+      },
+    },
   };
 }
 
diff --git a/app/components/UI/Perps/components/PerpsConnectionErrorView/PerpsConnectionErrorView.test.tsx b/app/components/UI/Perps/components/PerpsConnectionErrorView/PerpsConnectionErrorView.test.tsx
index b17feae1289e..038341bcf9fb 100644
--- a/app/components/UI/Perps/components/PerpsConnectionErrorView/PerpsConnectionErrorView.test.tsx
+++ b/app/components/UI/Perps/components/PerpsConnectionErrorView/PerpsConnectionErrorView.test.tsx
@@ -109,6 +109,12 @@ jest.mock('../../../../../component-library/components/Texts/Text', () => {
   };
 });
 
+// Mock usePerpsEventTracking
+const mockTrack = jest.fn();
+jest.mock('../../hooks/usePerpsEventTracking', () => ({
+  usePerpsEventTracking: jest.fn(() => ({ track: mockTrack })),
+}));
+
 // Mock ScreenView
 jest.mock('../../../../Base/ScreenView', () => {
   const { View } = jest.requireActual('react-native');
@@ -219,6 +225,30 @@ describe('PerpsConnectionErrorView', () => {
     expect(backButton).toBeTruthy();
   });
 
+  it('navigates back and tracks event when back button is pressed', () => {
+    const { getByText } = render(
+      <PerpsConnectionErrorView
+        error="Test error"
+        onRetry={mockOnRetry}
+        showBackButton
+        retryAttempts={2}
+      />,
+    );
+
+    const backButton = getByText('perps.errors.connectionFailed.go_back');
+    if (backButton.parent) {
+      fireEvent.press(backButton.parent);
+    }
+
+    expect(mockTrack).toHaveBeenCalledWith(
+      expect.anything(),
+      expect.objectContaining({
+        action: 'connection_go_back',
+      }),
+    );
+    expect(mockGoBack).toHaveBeenCalledTimes(1);
+  });
+
   it('should hide back button when showBackButton is false', () => {
     const { queryByText } = render(
       <PerpsConnectionErrorView
diff --git a/app/components/UI/Perps/components/PerpsConnectionErrorView/PerpsConnectionErrorView.tsx b/app/components/UI/Perps/components/PerpsConnectionErrorView/PerpsConnectionErrorView.tsx
index 95d2344a9e51..02bc28f2cc1f 100644
--- a/app/components/UI/Perps/components/PerpsConnectionErrorView/PerpsConnectionErrorView.tsx
+++ b/app/components/UI/Perps/components/PerpsConnectionErrorView/PerpsConnectionErrorView.tsx
@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useEffect } from 'react';
 import { View } from 'react-native';
 import { useNavigation } from '@react-navigation/native';
 import Button, {
@@ -45,13 +45,24 @@ const PerpsConnectionErrorView: React.FC<PerpsConnectionErrorViewProps> = ({
   const navigation = useNavigation();
   const { track } = usePerpsEventTracking();
 
-  // Track error screen view
-  usePerpsEventTracking({
-    eventName: MetaMetricsEvents.PERPS_SCREEN_VIEWED,
-    properties: {
+  const errorMessage =
+    (typeof error === 'string' ? error : error?.message) ||
+    PERPS_EVENT_VALUE.ERROR_MESSAGE_KEY.UNKNOWN;
+
+  // Track error screen view on mount and after each retry.
+  // Uses imperative track() in a useEffect keyed on retryAttempts so the event
+  // fires reliably every time, unlike the declarative resetConditions API which
+  // can skip renders when the reset condition stays true across retries.
+  useEffect(() => {
+    track(MetaMetricsEvents.PERPS_SCREEN_VIEWED, {
       [PERPS_EVENT_PROPERTY.SCREEN_TYPE]: PERPS_EVENT_VALUE.SCREEN_TYPE.ERROR,
-    },
-  });
+      [PERPS_EVENT_PROPERTY.SCREEN_NAME]:
+        PERPS_EVENT_VALUE.SCREEN_NAME.CONNECTION_ERROR,
+      [PERPS_EVENT_PROPERTY.ERROR_TYPE]: PERPS_EVENT_VALUE.ERROR_TYPE.NETWORK,
+      [PERPS_EVENT_PROPERTY.ERROR_MESSAGE]: errorMessage,
+      [PERPS_EVENT_PROPERTY.RETRY_ATTEMPTS]: retryAttempts,
+    });
+  }, [retryAttempts, errorMessage, track]);
 
   // Filter debug messages in production - show generic error message
   const shouldShowDebugDetails =
@@ -122,6 +133,7 @@ const PerpsConnectionErrorView: React.FC<PerpsConnectionErrorViewProps> = ({
               [PERPS_EVENT_PROPERTY.ACTION]:
                 PERPS_EVENT_VALUE.ACTION.CONNECTION_RETRY,
               [PERPS_EVENT_PROPERTY.ATTEMPT_NUMBER]: retryAttempts + 1,
+              [PERPS_EVENT_PROPERTY.ERROR_MESSAGE]: errorMessage,
             });
             onRetry();
           }}
@@ -135,7 +147,17 @@ const PerpsConnectionErrorView: React.FC<PerpsConnectionErrorViewProps> = ({
             size={ButtonSize.Lg}
             width={ButtonWidthTypes.Full}
             label={strings('perps.errors.connectionFailed.go_back')}
-            onPress={handleGoBack}
+            onPress={() => {
+              track(MetaMetricsEvents.PERPS_UI_INTERACTION, {
+                [PERPS_EVENT_PROPERTY.INTERACTION_TYPE]:
+                  PERPS_EVENT_VALUE.INTERACTION_TYPE.TAP,
+                [PERPS_EVENT_PROPERTY.ACTION]:
+                  PERPS_EVENT_VALUE.ACTION.CONNECTION_GO_BACK,
+                [PERPS_EVENT_PROPERTY.ATTEMPT_NUMBER]: retryAttempts,
+                [PERPS_EVENT_PROPERTY.ERROR_MESSAGE]: errorMessage,
+              });
+              handleGoBack();
+            }}
             style={styles.backButton}
           />
         )}
diff --git a/app/components/UI/Perps/components/PerpsDeveloperOptionsSection/__snapshots__/PerpsDeveloperOptionsSection.test.tsx.snap b/app/components/UI/Perps/components/PerpsDeveloperOptionsSection/__snapshots__/PerpsDeveloperOptionsSection.test.tsx.snap
index 57023eb97800..0706ce69c1b5 100644
--- a/app/components/UI/Perps/components/PerpsDeveloperOptionsSection/__snapshots__/PerpsDeveloperOptionsSection.test.tsx.snap
+++ b/app/components/UI/Perps/components/PerpsDeveloperOptionsSection/__snapshots__/PerpsDeveloperOptionsSection.test.tsx.snap
@@ -13,7 +13,7 @@ exports[`PerpsDeveloperOptionsSection renders correctly 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Bold",
         "fontSize": 24,
         "letterSpacing": 0,
@@ -38,7 +38,7 @@ exports[`PerpsDeveloperOptionsSection renders correctly 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#686e7d",
+          "color": "#66676a",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -66,7 +66,7 @@ exports[`PerpsDeveloperOptionsSection renders correctly 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#686e7d",
+          "color": "#66676a",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
diff --git a/app/components/UI/Perps/components/PerpsDeveloperOptionsSection/__snapshots__/PerpsTestnetToggle.test.tsx.snap b/app/components/UI/Perps/components/PerpsDeveloperOptionsSection/__snapshots__/PerpsTestnetToggle.test.tsx.snap
index 7e275618cda9..7d92401459e3 100644
--- a/app/components/UI/Perps/components/PerpsDeveloperOptionsSection/__snapshots__/PerpsTestnetToggle.test.tsx.snap
+++ b/app/components/UI/Perps/components/PerpsDeveloperOptionsSection/__snapshots__/PerpsTestnetToggle.test.tsx.snap
@@ -15,7 +15,7 @@ exports[`PerpsTestnetToggle renders correctly with testnet network 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#686e7d",
+        "color": "#66676a",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
@@ -43,7 +43,7 @@ exports[`PerpsTestnetToggle renders correctly with testnet network 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#686e7d",
+        "color": "#66676a",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
diff --git a/app/components/UI/Perps/components/PerpsHomeHeader/PerpsHomeHeader.styles.ts b/app/components/UI/Perps/components/PerpsHomeHeader/PerpsHomeHeader.styles.ts
index b66f937a1d8e..9eff224de697 100644
--- a/app/components/UI/Perps/components/PerpsHomeHeader/PerpsHomeHeader.styles.ts
+++ b/app/components/UI/Perps/components/PerpsHomeHeader/PerpsHomeHeader.styles.ts
@@ -44,6 +44,22 @@ const styleSheet = (params: { theme: Theme }) => {
       flex: 1,
       marginRight: 8,
     },
+    testnetBadge: {
+      flexDirection: 'row',
+      alignItems: 'center',
+      paddingHorizontal: 8,
+      paddingVertical: 4,
+      borderRadius: 16,
+      backgroundColor: theme.colors.warning.muted,
+      marginLeft: 8,
+      gap: 4,
+    },
+    testnetDot: {
+      width: 6,
+      height: 6,
+      borderRadius: 3,
+      backgroundColor: theme.colors.warning.default,
+    },
   });
 };
 
diff --git a/app/components/UI/Perps/components/PerpsHomeHeader/PerpsHomeHeader.tsx b/app/components/UI/Perps/components/PerpsHomeHeader/PerpsHomeHeader.tsx
index fd3b391a7679..b704ccc503da 100644
--- a/app/components/UI/Perps/components/PerpsHomeHeader/PerpsHomeHeader.tsx
+++ b/app/components/UI/Perps/components/PerpsHomeHeader/PerpsHomeHeader.tsx
@@ -22,8 +22,9 @@ import { strings } from '../../../../../../locales/i18n';
 import { useTheme } from '../../../../../util/theme';
 import type { PerpsHomeHeaderProps } from './PerpsHomeHeader.types';
 import styleSheet from './PerpsHomeHeader.styles';
-import { selectPerpsMYXProviderEnabledFlag } from '../../selectors/featureFlags';
+import { selectPerpsNetwork } from '../../selectors/perpsController';
 import { PerpsProviderSelectorBadge } from '../PerpsProviderSelector';
+import { usePerpsProvider } from '../../hooks/usePerpsProvider';
 
 /**
  * PerpsHomeHeader Component
@@ -68,7 +69,9 @@ const PerpsHomeHeader: React.FC<PerpsHomeHeaderProps> = ({
   const tw = useTailwind();
   const { colors } = useTheme();
   const navigation = useNavigation();
-  const isMYXProviderEnabled = useSelector(selectPerpsMYXProviderEnabledFlag);
+  const { isMultiProviderEnabled } = usePerpsProvider();
+  const network = useSelector(selectPerpsNetwork);
+  const isTestnet = network === 'testnet';
 
   // Default back handler
   const defaultHandleBack = useCallback(() => {
@@ -154,11 +157,22 @@ const PerpsHomeHeader: React.FC<PerpsHomeHeaderProps> = ({
               >
                 {title || strings('perps.title')}
               </Text>
-              {isMYXProviderEnabled && (
+              {isMultiProviderEnabled && (
                 <PerpsProviderSelectorBadge
                   testID={testID ? `${testID}-provider-badge` : undefined}
                 />
               )}
+              {isTestnet && !isMultiProviderEnabled && (
+                <View
+                  style={styles.testnetBadge}
+                  testID={testID ? `${testID}-testnet-badge` : undefined}
+                >
+                  <View style={styles.testnetDot} />
+                  <Text variant={TextVariant.BodySM} color={TextColor.Warning}>
+                    Testnet
+                  </Text>
+                </View>
+              )}
             </Box>
           </View>
 
diff --git a/app/components/UI/Perps/components/PerpsPositionCard/PerpsPositionCard.tsx b/app/components/UI/Perps/components/PerpsPositionCard/PerpsPositionCard.tsx
index 61d0e16cf543..338568674186 100644
--- a/app/components/UI/Perps/components/PerpsPositionCard/PerpsPositionCard.tsx
+++ b/app/components/UI/Perps/components/PerpsPositionCard/PerpsPositionCard.tsx
@@ -120,7 +120,7 @@ const PerpsPositionCard: React.FC<PerpsPositionCardProps> = ({
 
   const pnlNum = parseFloat(position.unrealizedPnl);
 
-  // ROE is always stored as a decimal (e.g., 0.171 for 17.1%)
+  // ROE is always stored as a decimal (e.g., 0.171 for 17.10%)
   // Convert to percentage for display
   const roeValue = parseFloat(position.returnOnEquity || '0');
   const roe = isNaN(roeValue) ? 0 : roeValue * 100;
@@ -203,7 +203,7 @@ const PerpsPositionCard: React.FC<PerpsPositionCardProps> = ({
     const roeRaw = Number.parseFloat(position.returnOnEquity || '');
     const hasValidRoe = !Number.isNaN(roeRaw) && Number.isFinite(roeRaw);
     const roeDisplay = hasValidRoe
-      ? formatPercentage(roeRaw * 100, 1)
+      ? formatPercentage(roeRaw * 100, 2)
       : PERPS_CONSTANTS.FallbackPercentageDisplay;
 
     const isPositionVariant = compactVariant === 'position';
diff --git a/app/components/UI/Perps/components/PerpsProviderSelector/PerpsProviderSelector.constants.ts b/app/components/UI/Perps/components/PerpsProviderSelector/PerpsProviderSelector.constants.ts
index 503540c9d3bb..ce5a9415972a 100644
--- a/app/components/UI/Perps/components/PerpsProviderSelector/PerpsProviderSelector.constants.ts
+++ b/app/components/UI/Perps/components/PerpsProviderSelector/PerpsProviderSelector.constants.ts
@@ -1,11 +1,14 @@
-import type { PerpsProviderType } from '@metamask/perps-controller';
-import type { ProviderDisplayInfo } from './PerpsProviderSelector.types';
+import type { PerpsActiveProviderMode } from '@metamask/perps-controller';
+import type {
+  ProviderDisplayInfo,
+  ProviderNetworkOption,
+} from './PerpsProviderSelector.types';
 
 /**
  * Provider display configuration
  */
 export const PROVIDER_DISPLAY_INFO: Record<
-  PerpsProviderType,
+  PerpsActiveProviderMode,
   ProviderDisplayInfo
 > = {
   hyperliquid: {
@@ -18,4 +21,63 @@ export const PROVIDER_DISPLAY_INFO: Record<
     name: 'MYX',
     description: 'BNB Chain perps (Beta)',
   },
+  aggregated: {
+    id: 'aggregated',
+    name: 'All Providers',
+    description: 'Aggregated multi-provider view',
+  },
 };
+
+/**
+ * Combined provider + network options for the unified selector
+ */
+export const PROVIDER_NETWORK_OPTIONS: ProviderNetworkOption[] = [
+  {
+    id: 'aggregated-mainnet',
+    providerId: 'aggregated',
+    isTestnet: false,
+    name: 'All Providers',
+    network: 'Mainnet',
+    description: 'Aggregated multi-provider view',
+  },
+  {
+    id: 'aggregated-testnet',
+    providerId: 'aggregated',
+    isTestnet: true,
+    name: 'All Providers',
+    network: 'Testnet',
+    description: 'Aggregated multi-provider view',
+  },
+  {
+    id: 'hyperliquid-mainnet',
+    providerId: 'hyperliquid',
+    isTestnet: false,
+    name: 'HyperLiquid',
+    network: 'Mainnet',
+    description: 'High-performance L1 perps',
+  },
+  {
+    id: 'hyperliquid-testnet',
+    providerId: 'hyperliquid',
+    isTestnet: true,
+    name: 'HyperLiquid',
+    network: 'Testnet',
+    description: 'High-performance L1 perps',
+  },
+  {
+    id: 'myx-mainnet',
+    providerId: 'myx',
+    isTestnet: false,
+    name: 'MYX',
+    network: 'Mainnet',
+    description: 'BNB Chain perps (Beta)',
+  },
+  {
+    id: 'myx-testnet',
+    providerId: 'myx',
+    isTestnet: true,
+    name: 'MYX',
+    network: 'Testnet',
+    description: 'Linea Sepolia perps (Beta)',
+  },
+];
diff --git a/app/components/UI/Perps/components/PerpsProviderSelector/PerpsProviderSelector.styles.ts b/app/components/UI/Perps/components/PerpsProviderSelector/PerpsProviderSelector.styles.ts
index c1e152387f81..41fbe03ccd11 100644
--- a/app/components/UI/Perps/components/PerpsProviderSelector/PerpsProviderSelector.styles.ts
+++ b/app/components/UI/Perps/components/PerpsProviderSelector/PerpsProviderSelector.styles.ts
@@ -17,10 +17,9 @@ export const styleSheet = (params: { theme: Theme }) => {
       borderRadius: 16,
       backgroundColor: theme.colors.background.alternative,
       marginLeft: 8,
+      gap: 4,
     },
-    badgeText: {
-      marginRight: 4,
-    },
+    badgeText: {},
 
     // Bottom sheet styles
     optionsList: {
@@ -45,9 +44,28 @@ export const styleSheet = (params: { theme: Theme }) => {
     optionContent: {
       flex: 1,
     },
-    optionName: {
+    optionNameRow: {
+      flexDirection: 'row' as const,
+      alignItems: 'center' as const,
+      gap: 8,
       marginBottom: 2,
     },
+    optionName: {},
+    testnetTag: {
+      flexDirection: 'row' as const,
+      alignItems: 'center' as const,
+      gap: 4,
+      paddingHorizontal: 6,
+      paddingVertical: 2,
+      borderRadius: 8,
+      backgroundColor: theme.colors.warning.muted,
+    },
+    testnetDot: {
+      width: 6,
+      height: 6,
+      borderRadius: 3,
+      backgroundColor: theme.colors.warning.default,
+    },
     checkIcon: {
       marginLeft: 8,
     },
diff --git a/app/components/UI/Perps/components/PerpsProviderSelector/PerpsProviderSelector.types.ts b/app/components/UI/Perps/components/PerpsProviderSelector/PerpsProviderSelector.types.ts
index b357e3e0a38f..8124758871a3 100644
--- a/app/components/UI/Perps/components/PerpsProviderSelector/PerpsProviderSelector.types.ts
+++ b/app/components/UI/Perps/components/PerpsProviderSelector/PerpsProviderSelector.types.ts
@@ -1,4 +1,4 @@
-import type { PerpsProviderType } from '@metamask/perps-controller';
+import type { PerpsActiveProviderMode } from '@metamask/perps-controller';
 
 /**
  * Props for PerpsProviderSelectorBadge component
@@ -25,14 +25,14 @@ export interface PerpsProviderSelectorSheetProps {
   onClose: () => void;
 
   /**
-   * Currently selected provider
+   * Currently selected option ID (e.g. 'hyperliquid-mainnet')
    */
-  selectedProvider?: PerpsProviderType;
+  selectedOptionId?: string;
 
   /**
-   * Callback when a provider is selected
+   * Callback when an option is selected
    */
-  onProviderSelect: (providerId: PerpsProviderType) => void;
+  onOptionSelect: (option: ProviderNetworkOption) => void | Promise<void>;
 
   /**
    * Test ID for testing purposes
@@ -44,8 +44,20 @@ export interface PerpsProviderSelectorSheetProps {
  * Provider display info for UI
  */
 export interface ProviderDisplayInfo {
-  id: PerpsProviderType;
+  id: PerpsActiveProviderMode;
   name: string;
   description: string;
   iconName?: string;
 }
+
+/**
+ * Combined provider + network option for the unified selector
+ */
+export interface ProviderNetworkOption {
+  id: string;
+  providerId: PerpsActiveProviderMode;
+  isTestnet: boolean;
+  name: string;
+  network: string;
+  description: string;
+}
diff --git a/app/components/UI/Perps/components/PerpsProviderSelector/PerpsProviderSelectorBadge.test.tsx b/app/components/UI/Perps/components/PerpsProviderSelector/PerpsProviderSelectorBadge.test.tsx
index a85de4a2d5a2..525406638aad 100644
--- a/app/components/UI/Perps/components/PerpsProviderSelector/PerpsProviderSelectorBadge.test.tsx
+++ b/app/components/UI/Perps/components/PerpsProviderSelector/PerpsProviderSelectorBadge.test.tsx
@@ -1,6 +1,7 @@
 import React from 'react';
 import { render, fireEvent } from '@testing-library/react-native';
 import { useNavigation } from '@react-navigation/native';
+import { useSelector } from 'react-redux';
 import PerpsProviderSelectorBadge from './PerpsProviderSelectorBadge';
 import { usePerpsProvider } from '../../hooks/usePerpsProvider';
 import Routes from '../../../../../constants/navigation/Routes';
@@ -9,6 +10,10 @@ jest.mock('@react-navigation/native', () => ({
   useNavigation: jest.fn(),
 }));
 
+jest.mock('react-redux', () => ({
+  useSelector: jest.fn(),
+}));
+
 jest.mock('../../hooks/usePerpsProvider', () => ({
   usePerpsProvider: jest.fn(),
 }));
@@ -18,6 +23,7 @@ jest.mock('../../../../../component-library/hooks', () => ({
     styles: {
       badgeContainer: {},
       badgeText: {},
+      testnetDot: {},
     },
   }),
 }));
@@ -32,7 +38,7 @@ jest.mock('../../../../../component-library/components/Texts/Text', () => {
     __esModule: true,
     default: MockText,
     TextVariant: { BodySM: 'BodySM' },
-    TextColor: { Alternative: 'Alternative' },
+    TextColor: { Alternative: 'Alternative', Warning: 'Warning' },
   };
 });
 
@@ -45,16 +51,19 @@ jest.mock('../../../../../component-library/components/Icons/Icon', () => {
     ),
     IconName: { ArrowDown: 'ArrowDown' },
     IconSize: { Xs: 'Xs' },
-    IconColor: { Alternative: 'Alternative' },
+    IconColor: { Alternative: 'Alternative', Warning: 'Warning' },
   };
 });
 
 const mockNavigate = jest.fn();
 const mockUsePerpsProvider = usePerpsProvider as jest.Mock;
+const mockUseSelector = useSelector as jest.Mock;
 
 beforeEach(() => {
   jest.clearAllMocks();
   (useNavigation as jest.Mock).mockReturnValue({ navigate: mockNavigate });
+  // Default to mainnet
+  mockUseSelector.mockReturnValue('mainnet');
 });
 
 describe('PerpsProviderSelectorBadge', () => {
@@ -91,7 +100,7 @@ describe('PerpsProviderSelectorBadge', () => {
     expect(getByText('MYX')).toBeTruthy();
   });
 
-  it('defaults to HyperLiquid when activeProvider is aggregated', () => {
+  it('shows All Providers when activeProvider is aggregated', () => {
     mockUsePerpsProvider.mockReturnValue({
       activeProvider: 'aggregated',
       isMultiProviderEnabled: true,
@@ -99,7 +108,7 @@ describe('PerpsProviderSelectorBadge', () => {
 
     const { getByText } = render(<PerpsProviderSelectorBadge testID="badge" />);
 
-    expect(getByText('HyperLiquid')).toBeTruthy();
+    expect(getByText('All Providers')).toBeOnTheScreen();
   });
 
   it('navigates to provider selection on press', () => {
@@ -132,5 +141,21 @@ describe('PerpsProviderSelectorBadge', () => {
     const badge = getByTestId('badge');
     expect(badge.props.accessibilityRole).toBe('button');
     expect(badge.props.accessibilityLabel).toContain('MYX');
+    expect(badge.props.accessibilityLabel).toContain('Mainnet');
+  });
+
+  it('renders testnet dot and warning styling when on testnet', () => {
+    mockUseSelector.mockReturnValue('testnet');
+    mockUsePerpsProvider.mockReturnValue({
+      activeProvider: 'hyperliquid',
+      isMultiProviderEnabled: true,
+    });
+
+    const { getByTestId } = render(
+      <PerpsProviderSelectorBadge testID="badge" />,
+    );
+
+    const badge = getByTestId('badge');
+    expect(badge.props.accessibilityLabel).toContain('Testnet');
   });
 });
diff --git a/app/components/UI/Perps/components/PerpsProviderSelector/PerpsProviderSelectorBadge.tsx b/app/components/UI/Perps/components/PerpsProviderSelector/PerpsProviderSelectorBadge.tsx
index 4a51f0382994..8d6819a3d97c 100644
--- a/app/components/UI/Perps/components/PerpsProviderSelector/PerpsProviderSelectorBadge.tsx
+++ b/app/components/UI/Perps/components/PerpsProviderSelector/PerpsProviderSelectorBadge.tsx
@@ -1,6 +1,7 @@
 import React, { useCallback } from 'react';
-import { TouchableOpacity } from 'react-native';
+import { TouchableOpacity, View } from 'react-native';
 import { useNavigation } from '@react-navigation/native';
+import { useSelector } from 'react-redux';
 import { useStyles } from '../../../../../component-library/hooks';
 import Text, {
   TextVariant,
@@ -13,6 +14,7 @@ import Icon, {
 } from '../../../../../component-library/components/Icons/Icon';
 import Routes from '../../../../../constants/navigation/Routes';
 import { usePerpsProvider } from '../../hooks/usePerpsProvider';
+import { selectPerpsNetwork } from '../../selectors/perpsController';
 import type { PerpsProviderSelectorBadgeProps } from './PerpsProviderSelector.types';
 import { PROVIDER_DISPLAY_INFO } from './PerpsProviderSelector.constants';
 import { styleSheet } from './PerpsProviderSelector.styles';
@@ -20,13 +22,9 @@ import { styleSheet } from './PerpsProviderSelector.styles';
 /**
  * PerpsProviderSelectorBadge Component
  *
- * A compact badge that shows the current provider and opens selection sheet.
+ * A compact badge that shows the current provider + network and opens selection sheet.
  * Only visible when multiple providers are available.
- *
- * @example
- * ```tsx
- * <PerpsProviderSelectorBadge testID="provider-badge" />
- * ```
+ * Shows a warning dot when on testnet.
  */
 const PerpsProviderSelectorBadge: React.FC<PerpsProviderSelectorBadgeProps> = ({
   testID,
@@ -34,6 +32,8 @@ const PerpsProviderSelectorBadge: React.FC<PerpsProviderSelectorBadgeProps> = ({
   const { styles } = useStyles(styleSheet, {});
   const navigation = useNavigation();
   const { activeProvider, isMultiProviderEnabled } = usePerpsProvider();
+  const network = useSelector(selectPerpsNetwork);
+  const isTestnet = network === 'testnet';
 
   const handlePress = useCallback(() => {
     navigation.navigate(Routes.PERPS.MODALS.ROOT, {
@@ -47,10 +47,9 @@ const PerpsProviderSelectorBadge: React.FC<PerpsProviderSelectorBadgeProps> = ({
   }
 
   // Get display info for current provider
-  const currentProvider =
-    activeProvider && activeProvider !== 'aggregated'
-      ? PROVIDER_DISPLAY_INFO[activeProvider]
-      : PROVIDER_DISPLAY_INFO.hyperliquid;
+  const currentProvider = activeProvider
+    ? PROVIDER_DISPLAY_INFO[activeProvider]
+    : PROVIDER_DISPLAY_INFO.hyperliquid;
 
   return (
     <TouchableOpacity
@@ -58,11 +57,12 @@ const PerpsProviderSelectorBadge: React.FC<PerpsProviderSelectorBadgeProps> = ({
       onPress={handlePress}
       testID={testID}
       accessibilityRole="button"
-      accessibilityLabel={`Current provider: ${currentProvider.name}. Tap to change.`}
+      accessibilityLabel={`Current provider: ${currentProvider.name}, ${isTestnet ? 'Testnet' : 'Mainnet'}. Tap to change.`}
     >
+      {isTestnet && <View style={styles.testnetDot} />}
       <Text
         variant={TextVariant.BodySM}
-        color={TextColor.Alternative}
+        color={isTestnet ? TextColor.Warning : TextColor.Alternative}
         style={styles.badgeText}
       >
         {currentProvider.name}
@@ -70,7 +70,7 @@ const PerpsProviderSelectorBadge: React.FC<PerpsProviderSelectorBadgeProps> = ({
       <Icon
         name={IconName.ArrowDown}
         size={IconSize.Xs}
-        color={IconColor.Alternative}
+        color={isTestnet ? IconColor.Warning : IconColor.Alternative}
       />
     </TouchableOpacity>
   );
diff --git a/app/components/UI/Perps/components/PerpsProviderSelector/PerpsProviderSelectorSheet.test.tsx b/app/components/UI/Perps/components/PerpsProviderSelector/PerpsProviderSelectorSheet.test.tsx
new file mode 100644
index 000000000000..d9b26bd6994d
--- /dev/null
+++ b/app/components/UI/Perps/components/PerpsProviderSelector/PerpsProviderSelectorSheet.test.tsx
@@ -0,0 +1,202 @@
+import React from 'react';
+import { render, fireEvent, act } from '@testing-library/react-native';
+import { usePerpsProvider } from '../../hooks/usePerpsProvider';
+import PerpsProviderSelectorSheet from './PerpsProviderSelectorSheet';
+
+jest.mock('../../hooks/usePerpsProvider', () => ({
+  usePerpsProvider: jest.fn(),
+}));
+
+jest.mock('../../../../../../locales/i18n', () => ({
+  strings: jest.fn((key: string) => key),
+}));
+
+jest.mock('../../../../../component-library/hooks', () => ({
+  useStyles: () => ({
+    styles: {
+      optionsList: {},
+      optionRow: {},
+      optionRowSelected: {},
+      optionContent: {},
+      optionNameRow: {},
+      optionName: {},
+      testnetTag: {},
+      testnetDot: {},
+      checkIcon: {},
+    },
+  }),
+}));
+
+jest.mock('../../../../../component-library/components/Texts/Text', () => {
+  const { Text: RNText } = jest.requireActual('react-native');
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  const MockText = ({ children, ...props }: any) => (
+    <RNText {...props}>{children}</RNText>
+  );
+  MockText.displayName = 'Text';
+  return {
+    __esModule: true,
+    default: MockText,
+    TextVariant: {
+      HeadingMD: 'HeadingMD',
+      BodyMDMedium: 'BodyMDMedium',
+      BodyXS: 'BodyXS',
+      BodySM: 'BodySM',
+    },
+    TextColor: { Alternative: 'Alternative', Warning: 'Warning' },
+  };
+});
+
+jest.mock('../../../../../component-library/components/Icons/Icon', () => {
+  const { View } = jest.requireActual('react-native');
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  return {
+    __esModule: true,
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    default: (props: any) => <View testID="icon" {...props} />,
+    IconName: { Check: 'Check' },
+    IconSize: { Md: 'Md' },
+    IconColor: { Primary: 'Primary' },
+  };
+});
+
+/* eslint-disable @typescript-eslint/no-explicit-any */
+jest.mock(
+  '../../../../../component-library/components/BottomSheets/BottomSheet',
+  () => {
+    const { View } = jest.requireActual('react-native');
+    const mockReact = jest.requireActual('react') as any;
+    const MockBottomSheet = mockReact.forwardRef(
+      ({ children, onClose, testID }: any, _ref: any) => (
+        <View testID={testID} onTouchEnd={onClose}>
+          {children}
+        </View>
+      ),
+    );
+    MockBottomSheet.displayName = 'BottomSheet';
+    return { __esModule: true, default: MockBottomSheet };
+  },
+);
+/* eslint-enable @typescript-eslint/no-explicit-any */
+
+jest.mock(
+  '../../../../../component-library/components/BottomSheets/BottomSheetHeader',
+  () => {
+    const { View } = jest.requireActual('react-native');
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    return {
+      __esModule: true,
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      default: ({ children, onClose }: any) => (
+        <View>
+          {children}
+          <View testID="header-close" onTouchEnd={onClose} />
+        </View>
+      ),
+    };
+  },
+);
+
+const mockUsePerpsProvider = usePerpsProvider as jest.Mock;
+
+const defaultProps = {
+  isVisible: true,
+  onClose: jest.fn(),
+  onOptionSelect: jest.fn(),
+  testID: 'provider-sheet',
+};
+
+beforeEach(() => {
+  jest.clearAllMocks();
+  mockUsePerpsProvider.mockReturnValue({
+    availableProviders: ['hyperliquid', 'myx'],
+  });
+});
+
+describe('PerpsProviderSelectorSheet', () => {
+  it('returns null when not visible', () => {
+    const { toJSON } = render(
+      <PerpsProviderSelectorSheet {...defaultProps} isVisible={false} />,
+    );
+
+    expect(toJSON()).toBeNull();
+  });
+
+  it('renders when visible', () => {
+    const { getByTestId } = render(
+      <PerpsProviderSelectorSheet {...defaultProps} />,
+    );
+
+    expect(getByTestId('provider-sheet')).toBeTruthy();
+  });
+
+  it('renders only options matching availableProviders', () => {
+    mockUsePerpsProvider.mockReturnValue({
+      availableProviders: ['hyperliquid'],
+    });
+
+    const { getAllByText, queryByText } = render(
+      <PerpsProviderSelectorSheet {...defaultProps} />,
+    );
+
+    expect(getAllByText('HyperLiquid').length).toBeGreaterThan(0);
+    expect(queryByText('MYX')).toBeNull();
+  });
+
+  it('renders all matching options when all providers available', () => {
+    mockUsePerpsProvider.mockReturnValue({
+      availableProviders: ['hyperliquid', 'myx'],
+    });
+
+    const { getAllByText } = render(
+      <PerpsProviderSelectorSheet {...defaultProps} />,
+    );
+
+    expect(getAllByText('HyperLiquid').length).toBeGreaterThan(0);
+    expect(getAllByText('MYX').length).toBeGreaterThan(0);
+  });
+
+  it('calls onOptionSelect when an option is pressed', async () => {
+    const onOptionSelect = jest.fn().mockResolvedValue(undefined);
+
+    const { getByTestId } = render(
+      <PerpsProviderSelectorSheet
+        {...defaultProps}
+        onOptionSelect={onOptionSelect}
+      />,
+    );
+
+    await act(async () => {
+      fireEvent.press(getByTestId('provider-sheet-option-hyperliquid-mainnet'));
+    });
+
+    expect(onOptionSelect).toHaveBeenCalledWith(
+      expect.objectContaining({
+        id: 'hyperliquid-mainnet',
+        providerId: 'hyperliquid',
+      }),
+    );
+  });
+
+  it('shows check icon for selected option', () => {
+    const { getByTestId } = render(
+      <PerpsProviderSelectorSheet
+        {...defaultProps}
+        selectedOptionId="hyperliquid-mainnet"
+      />,
+    );
+
+    expect(
+      getByTestId('provider-sheet-check-hyperliquid-mainnet'),
+    ).toBeTruthy();
+  });
+
+  it('shows testnet tag for testnet options', () => {
+    const { getAllByText } = render(
+      <PerpsProviderSelectorSheet {...defaultProps} />,
+    );
+
+    // Testnet network label is rendered for testnet options
+    expect(getAllByText('Testnet').length).toBeGreaterThan(0);
+  });
+});
diff --git a/app/components/UI/Perps/components/PerpsProviderSelector/PerpsProviderSelectorSheet.tsx b/app/components/UI/Perps/components/PerpsProviderSelector/PerpsProviderSelectorSheet.tsx
index a1159510f90e..68e816b4b731 100644
--- a/app/components/UI/Perps/components/PerpsProviderSelector/PerpsProviderSelectorSheet.tsx
+++ b/app/components/UI/Perps/components/PerpsProviderSelector/PerpsProviderSelectorSheet.tsx
@@ -1,4 +1,4 @@
-import React, { useRef, useEffect, useCallback } from 'react';
+import React, { useRef, useEffect, useCallback, useMemo } from 'react';
 import { TouchableOpacity, View } from 'react-native';
 import { useStyles } from '../../../../../component-library/hooks';
 import Text, {
@@ -16,37 +16,37 @@ import BottomSheet, {
 import BottomSheetHeader from '../../../../../component-library/components/BottomSheets/BottomSheetHeader';
 import { strings } from '../../../../../../locales/i18n';
 import { usePerpsProvider } from '../../hooks/usePerpsProvider';
-import type { PerpsProviderSelectorSheetProps } from './PerpsProviderSelector.types';
-import { PROVIDER_DISPLAY_INFO } from './PerpsProviderSelector.constants';
+import type {
+  PerpsProviderSelectorSheetProps,
+  ProviderNetworkOption,
+} from './PerpsProviderSelector.types';
+import { PROVIDER_NETWORK_OPTIONS } from './PerpsProviderSelector.constants';
 import { styleSheet } from './PerpsProviderSelector.styles';
-import type { PerpsProviderType } from '@metamask/perps-controller';
 
 /**
  * PerpsProviderSelectorSheet Component
  *
- * Bottom sheet for selecting between available perps providers.
- *
- * @example
- * ```tsx
- * <PerpsProviderSelectorSheet
- *   isVisible={showSheet}
- *   onClose={() => setShowSheet(false)}
- *   selectedProvider="hyperliquid"
- *   onProviderSelect={handleProviderSelect}
- * />
- * ```
+ * Bottom sheet for selecting between available perps provider + network combinations.
  */
 const PerpsProviderSelectorSheet: React.FC<PerpsProviderSelectorSheetProps> = ({
   isVisible,
   onClose,
-  selectedProvider,
-  onProviderSelect,
+  selectedOptionId,
+  onOptionSelect,
   testID,
 }) => {
   const { styles } = useStyles(styleSheet, {});
   const bottomSheetRef = useRef<BottomSheetRef>(null);
   const { availableProviders } = usePerpsProvider();
 
+  const filteredOptions = useMemo(
+    () =>
+      PROVIDER_NETWORK_OPTIONS.filter((opt) =>
+        availableProviders.includes(opt.providerId),
+      ),
+    [availableProviders],
+  );
+
   useEffect(() => {
     const sheet = bottomSheetRef.current;
     if (isVisible) {
@@ -60,13 +60,12 @@ const PerpsProviderSelectorSheet: React.FC<PerpsProviderSelectorSheetProps> = ({
     };
   }, [isVisible]);
 
-  const handleProviderPress = useCallback(
-    async (providerId: PerpsProviderType) => {
-      await onProviderSelect(providerId);
-      // Just close the sheet - the BottomSheet's onClose prop handles navigation
+  const handleOptionPress = useCallback(
+    async (option: ProviderNetworkOption) => {
+      await onOptionSelect(option);
       bottomSheetRef.current?.onCloseBottomSheet();
     },
-    [onProviderSelect],
+    [onOptionSelect],
   );
 
   if (!isVisible) return null;
@@ -85,32 +84,51 @@ const PerpsProviderSelectorSheet: React.FC<PerpsProviderSelectorSheetProps> = ({
         </Text>
       </BottomSheetHeader>
       <View style={styles.optionsList}>
-        {availableProviders.map((providerId) => {
-          const providerInfo = PROVIDER_DISPLAY_INFO[providerId];
-          const isSelected = selectedProvider === providerId;
+        {filteredOptions.map((option) => {
+          const isSelected = selectedOptionId === option.id;
 
           return (
             <TouchableOpacity
-              key={providerId}
+              key={option.id}
               style={[styles.optionRow, isSelected && styles.optionRowSelected]}
               activeOpacity={0.7}
-              onPress={() => handleProviderPress(providerId)}
-              testID={testID ? `${testID}-option-${providerId}` : undefined}
+              onPress={() => handleOptionPress(option)}
+              testID={testID ? `${testID}-option-${option.id}` : undefined}
               accessibilityRole="radio"
               accessibilityState={{ selected: isSelected }}
             >
               <View style={styles.optionContent}>
-                <Text
-                  variant={TextVariant.BodyMDMedium}
-                  style={styles.optionName}
-                >
-                  {providerInfo.name}
-                </Text>
+                <View style={styles.optionNameRow}>
+                  <Text
+                    variant={TextVariant.BodyMDMedium}
+                    style={styles.optionName}
+                  >
+                    {option.name}
+                  </Text>
+                  {option.isTestnet ? (
+                    <View style={styles.testnetTag}>
+                      <View style={styles.testnetDot} />
+                      <Text
+                        variant={TextVariant.BodyXS}
+                        color={TextColor.Warning}
+                      >
+                        {option.network}
+                      </Text>
+                    </View>
+                  ) : (
+                    <Text
+                      variant={TextVariant.BodyXS}
+                      color={TextColor.Alternative}
+                    >
+                      {option.network}
+                    </Text>
+                  )}
+                </View>
                 <Text
                   variant={TextVariant.BodySM}
                   color={TextColor.Alternative}
                 >
-                  {providerInfo.description}
+                  {option.description}
                 </Text>
               </View>
               {isSelected && (
@@ -119,7 +137,7 @@ const PerpsProviderSelectorSheet: React.FC<PerpsProviderSelectorSheetProps> = ({
                   size={IconSize.Md}
                   color={IconColor.Primary}
                   style={styles.checkIcon}
-                  testID={testID ? `${testID}-check-${providerId}` : undefined}
+                  testID={testID ? `${testID}-check-${option.id}` : undefined}
                 />
               )}
             </TouchableOpacity>
diff --git a/app/components/UI/Perps/components/PerpsProviderSelector/index.ts b/app/components/UI/Perps/components/PerpsProviderSelector/index.ts
index c0a8b8926f7c..3809c2270ed5 100644
--- a/app/components/UI/Perps/components/PerpsProviderSelector/index.ts
+++ b/app/components/UI/Perps/components/PerpsProviderSelector/index.ts
@@ -4,5 +4,9 @@ export type {
   PerpsProviderSelectorBadgeProps,
   PerpsProviderSelectorSheetProps,
   ProviderDisplayInfo,
+  ProviderNetworkOption,
 } from './PerpsProviderSelector.types';
-export { PROVIDER_DISPLAY_INFO } from './PerpsProviderSelector.constants';
+export {
+  PROVIDER_DISPLAY_INFO,
+  PROVIDER_NETWORK_OPTIONS,
+} from './PerpsProviderSelector.constants';
diff --git a/app/components/UI/Perps/constants/perpsConfig.ts b/app/components/UI/Perps/constants/perpsConfig.ts
index be1e7362b02e..280281947dbd 100644
--- a/app/components/UI/Perps/constants/perpsConfig.ts
+++ b/app/components/UI/Perps/constants/perpsConfig.ts
@@ -6,7 +6,7 @@
  *
  * This file contains:
  * - UI-only configuration constants (layout, display, navigation)
- * - Mobile-specific exports (TokenI, @metamask/swaps-controller dependencies)
+ * - Mobile-specific exports (TokenI)
  */
 import type { Hex } from '@metamask/utils';
 import { TokenI } from '../../Tokens/types';
@@ -16,7 +16,7 @@ export const PERPS_BALANCE_PLACEHOLDER_ADDRESS =
   '0x0000000000000000000000000000000000000000' as Hex;
 
 /** Chain id used for the "Perps balance" payment option. */
-export { ARBITRUM_CHAIN_ID as PERPS_BALANCE_CHAIN_ID } from '@metamask/swaps-controller/dist/constants';
+export { ARBITRUM_MAINNET_CHAIN_ID_HEX as PERPS_BALANCE_CHAIN_ID } from '@metamask/perps-controller/constants/hyperLiquidConfig';
 
 /**
  * Minimum number of aggregators (exchanges) a token must be listed on
@@ -255,5 +255,5 @@ export const PROVIDER_CONFIG = {
   /** Default perpetual DEX provider when no explicit selection exists */
   DefaultProvider: 'hyperliquid' as const,
   /** Force MYX to testnet only (mainnet credentials not yet available) */
-  MYX_TESTNET_ONLY: true,
+  MYX_TESTNET_ONLY: false,
 } as const;
diff --git a/app/components/UI/Perps/hooks/stream/hasCachedPerpsData.test.ts b/app/components/UI/Perps/hooks/stream/hasCachedPerpsData.test.ts
index d6e57809f6c5..e4a2e07eaccf 100644
--- a/app/components/UI/Perps/hooks/stream/hasCachedPerpsData.test.ts
+++ b/app/components/UI/Perps/hooks/stream/hasCachedPerpsData.test.ts
@@ -1,124 +1,97 @@
 import { hasPreloadedData, getPreloadedData } from './hasCachedPerpsData';
 
-const mockEngineState: Record<string, unknown> = {};
-
-const mockGetAccountsFromSelectedAccountGroup = jest.fn().mockReturnValue([
-  {
-    address: '0xABCdef1234567890',
-    id: 'account-1',
-    type: 'eip155:eoa',
-    metadata: { name: 'Test', importTime: 0, keyring: { type: 'HD Key Tree' } },
-    methods: [],
-    options: {},
-    scopes: [],
-  },
-]);
+let mockCachedMarketDataForActiveProvider: unknown[] | null = null;
+let mockCachedUserDataForActiveProvider: {
+  positions: unknown[];
+  orders: unknown[];
+  accountState: unknown;
+} | null = null;
 
 jest.mock('../../../../../core/Engine', () => ({
   context: {
     PerpsController: {
-      get state() {
-        return mockEngineState;
-      },
-    },
-    AccountTreeController: {
-      getAccountsFromSelectedAccountGroup: (...args: unknown[]) =>
-        mockGetAccountsFromSelectedAccountGroup(...args),
+      getCachedMarketDataForActiveProvider: () =>
+        mockCachedMarketDataForActiveProvider,
+      getCachedUserDataForActiveProvider: () =>
+        mockCachedUserDataForActiveProvider,
     },
   },
 }));
 
-const mockFindEvmAccount = jest.fn().mockReturnValue({
-  address: '0xABCdef1234567890',
-});
-
-jest.mock('@metamask/perps-controller', () => ({
-  findEvmAccount: (...args: unknown[]) => mockFindEvmAccount(...args),
-}));
-
-/** Helper: set a recent timestamp so user data is not stale */
-function setFreshTimestamp() {
-  mockEngineState.cachedUserDataTimestamp = Date.now();
-}
-
 describe('hasPreloadedData', () => {
   beforeEach(() => {
-    // Reset to empty state
-    Object.keys(mockEngineState).forEach((key) => delete mockEngineState[key]);
-    mockFindEvmAccount.mockReturnValue({
-      address: '0xABCdef1234567890',
-    });
-    mockGetAccountsFromSelectedAccountGroup.mockReturnValue([
-      {
-        address: '0xABCdef1234567890',
-        id: 'account-1',
-        type: 'eip155:eoa',
-        metadata: {
-          name: 'Test',
-          importTime: 0,
-          keyring: { type: 'HD Key Tree' },
-        },
-        methods: [],
-        options: {},
-        scopes: [],
-      },
-    ]);
+    mockCachedMarketDataForActiveProvider = null;
+    mockCachedUserDataForActiveProvider = null;
   });
 
-  describe('cachedPositions (array field)', () => {
-    it('returns false when no cached data exists', () => {
+  describe('cachedPositions', () => {
+    it('returns false when no cached data exists (helper returns null)', () => {
       expect(hasPreloadedData('cachedPositions')).toBe(false);
     });
 
-    it('returns true when cachedPositions is empty array (valid cache)', () => {
-      mockEngineState.cachedPositions = [];
-      setFreshTimestamp();
+    it('returns true when helper returns data with empty positions (valid cache)', () => {
+      mockCachedUserDataForActiveProvider = {
+        positions: [],
+        orders: [],
+        accountState: null,
+      };
       expect(hasPreloadedData('cachedPositions')).toBe(true);
     });
 
-    it('returns false when cachedPositions is null', () => {
-      mockEngineState.cachedPositions = null;
-      expect(hasPreloadedData('cachedPositions')).toBe(false);
-    });
-
-    it('returns true when cachedPositions has items', () => {
-      mockEngineState.cachedPositions = [{ symbol: 'BTC-PERP' }];
-      setFreshTimestamp();
+    it('returns true when helper returns data with positions', () => {
+      mockCachedUserDataForActiveProvider = {
+        positions: [{ symbol: 'BTC-PERP' }],
+        orders: [],
+        accountState: null,
+      };
       expect(hasPreloadedData('cachedPositions')).toBe(true);
     });
   });
 
-  describe('cachedOrders (array field)', () => {
+  describe('cachedOrders', () => {
     it('returns false when no cached data exists', () => {
       expect(hasPreloadedData('cachedOrders')).toBe(false);
     });
 
-    it('returns true when cachedOrders has items', () => {
-      mockEngineState.cachedOrders = [{ orderId: 'order-1' }];
-      setFreshTimestamp();
+    it('returns true when helper returns data with orders', () => {
+      mockCachedUserDataForActiveProvider = {
+        positions: [],
+        orders: [{ orderId: 'order-1' }],
+        accountState: null,
+      };
       expect(hasPreloadedData('cachedOrders')).toBe(true);
     });
 
-    it('returns true when cachedOrders is empty array (valid cache)', () => {
-      mockEngineState.cachedOrders = [];
-      setFreshTimestamp();
+    it('returns true when helper returns data with empty orders (valid cache)', () => {
+      mockCachedUserDataForActiveProvider = {
+        positions: [],
+        orders: [],
+        accountState: null,
+      };
       expect(hasPreloadedData('cachedOrders')).toBe(true);
     });
   });
 
-  describe('cachedAccountState (object field)', () => {
+  describe('cachedAccountState', () => {
     it('returns false when no cached data exists', () => {
       expect(hasPreloadedData('cachedAccountState')).toBe(false);
     });
 
-    it('returns true when cachedAccountState exists', () => {
-      mockEngineState.cachedAccountState = { availableBalance: '1000' };
-      setFreshTimestamp();
+    it('returns true when helper returns data with accountState', () => {
+      mockCachedUserDataForActiveProvider = {
+        positions: [],
+        orders: [],
+        accountState: { availableBalance: '1000' },
+      };
       expect(hasPreloadedData('cachedAccountState')).toBe(true);
     });
 
-    it('returns false when cachedAccountState is null', () => {
-      mockEngineState.cachedAccountState = null;
+    it('returns false when helper returns data with null accountState', () => {
+      mockCachedUserDataForActiveProvider = {
+        positions: [],
+        orders: [],
+        accountState: null,
+      };
       expect(hasPreloadedData('cachedAccountState')).toBe(false);
     });
   });
@@ -128,249 +101,104 @@ describe('hasPreloadedData', () => {
       expect(hasPreloadedData('cachedMarketData')).toBe(false);
     });
 
-    it('returns false when cachedMarketData is null', () => {
-      mockEngineState.cachedMarketData = null;
+    it('returns false when getCachedMarketDataForActiveProvider returns null', () => {
+      mockCachedMarketDataForActiveProvider = null;
       expect(hasPreloadedData('cachedMarketData')).toBe(false);
     });
 
-    it('returns true when cachedMarketData is empty array (valid cache)', () => {
-      mockEngineState.cachedMarketData = [];
+    it('returns true when getCachedMarketDataForActiveProvider returns empty array (valid cache)', () => {
+      mockCachedMarketDataForActiveProvider = [];
       expect(hasPreloadedData('cachedMarketData')).toBe(true);
     });
 
-    it('returns true when cachedMarketData has items', () => {
-      mockEngineState.cachedMarketData = [{ symbol: 'BTC', price: '$50000' }];
+    it('returns true when getCachedMarketDataForActiveProvider returns items', () => {
+      mockCachedMarketDataForActiveProvider = [
+        { symbol: 'BTC', price: '$50000' },
+      ];
       expect(hasPreloadedData('cachedMarketData')).toBe(true);
     });
   });
 
   describe('edge cases', () => {
-    it('returns false when field is undefined (not set)', () => {
-      expect(hasPreloadedData('cachedPositions')).toBe(false);
-    });
-
-    it('returns false for user data when timestamp is missing (stale)', () => {
-      mockEngineState.cachedPositions = [{ symbol: 'BTC-PERP' }];
-      // No timestamp set — treated as stale for user data
-      expect(hasPreloadedData('cachedPositions')).toBe(false);
-    });
-  });
-
-  describe('staleness check', () => {
-    it('returns false for user data when cache is older than 60s', () => {
-      mockEngineState.cachedPositions = [{ symbol: 'BTC-PERP' }];
-      mockEngineState.cachedUserDataTimestamp = Date.now() - 61_000;
-
-      expect(hasPreloadedData('cachedPositions')).toBe(false);
-    });
-
-    it('returns true for user data when cache is within 60s', () => {
-      mockEngineState.cachedPositions = [{ symbol: 'BTC-PERP' }];
-      mockEngineState.cachedUserDataTimestamp = Date.now() - 30_000;
-
-      expect(hasPreloadedData('cachedPositions')).toBe(true);
-    });
-
-    it('does not apply staleness check to cachedMarketData', () => {
-      mockEngineState.cachedMarketData = [{ symbol: 'BTC', price: '$50000' }];
-      // No timestamp — market data is not affected by staleness check
-      expect(hasPreloadedData('cachedMarketData')).toBe(true);
-    });
-  });
-
-  describe('account validation', () => {
-    it('returns false for user data when cachedUserDataAddress does not match current account', () => {
-      mockEngineState.cachedPositions = [{ symbol: 'BTC-PERP' }];
-      mockEngineState.cachedUserDataAddress = '0xDIFFERENTADDRESS';
-      setFreshTimestamp();
-
+    it('returns false when helper returns null (no cache / stale / wrong account)', () => {
       expect(hasPreloadedData('cachedPositions')).toBe(false);
     });
-
-    it('trusts cache when cachedUserDataAddress is not set', () => {
-      mockEngineState.cachedPositions = [{ symbol: 'BTC-PERP' }];
-      // cachedUserDataAddress not set (undefined) — should trust the cache
-      setFreshTimestamp();
-
-      expect(hasPreloadedData('cachedPositions')).toBe(true);
-    });
-
-    it('trusts cache when cachedUserDataAddress is null', () => {
-      mockEngineState.cachedPositions = [{ symbol: 'BTC-PERP' }];
-      mockEngineState.cachedUserDataAddress = null;
-      setFreshTimestamp();
-
-      expect(hasPreloadedData('cachedPositions')).toBe(true);
-    });
-
-    it('trusts cache when AccountTreeController throws', () => {
-      mockEngineState.cachedPositions = [{ symbol: 'BTC-PERP' }];
-      mockEngineState.cachedUserDataAddress = '0xABCdef1234567890';
-      setFreshTimestamp();
-      mockGetAccountsFromSelectedAccountGroup.mockImplementation(() => {
-        throw new Error('Controller not initialized');
-      });
-
-      expect(hasPreloadedData('cachedPositions')).toBe(true);
-    });
-
-    it('trusts cache when no EVM account found', () => {
-      mockEngineState.cachedPositions = [{ symbol: 'BTC-PERP' }];
-      mockEngineState.cachedUserDataAddress = '0xABCdef1234567890';
-      setFreshTimestamp();
-      mockFindEvmAccount.mockReturnValue(null);
-
-      expect(hasPreloadedData('cachedPositions')).toBe(true);
-    });
-
-    it('trusts cache when EVM account has no address', () => {
-      mockEngineState.cachedPositions = [{ symbol: 'BTC-PERP' }];
-      mockEngineState.cachedUserDataAddress = '0xABCdef1234567890';
-      setFreshTimestamp();
-      mockFindEvmAccount.mockReturnValue({ address: undefined });
-
-      expect(hasPreloadedData('cachedPositions')).toBe(true);
-    });
-
-    it('skips account check for cachedMarketData (not account-specific)', () => {
-      mockEngineState.cachedMarketData = [{ symbol: 'BTC', price: '$50000' }];
-      mockEngineState.cachedUserDataAddress = '0xDIFFERENTADDRESS';
-      mockFindEvmAccount.mockReturnValue({ address: '0xABCdef1234567890' });
-
-      // Market data is not in USER_DATA_FIELDS, so account check is skipped
-      expect(hasPreloadedData('cachedMarketData')).toBe(true);
-    });
-
-    it('matches addresses case-insensitively', () => {
-      mockEngineState.cachedPositions = [{ symbol: 'BTC-PERP' }];
-      mockEngineState.cachedUserDataAddress = '0xABCDEF1234567890';
-      setFreshTimestamp();
-      mockFindEvmAccount.mockReturnValue({ address: '0xabcdef1234567890' });
-
-      expect(hasPreloadedData('cachedPositions')).toBe(true);
-    });
   });
 });
 
 describe('getPreloadedData', () => {
   beforeEach(() => {
-    Object.keys(mockEngineState).forEach((key) => delete mockEngineState[key]);
-    mockFindEvmAccount.mockReturnValue({
-      address: '0xABCdef1234567890',
-    });
-    mockGetAccountsFromSelectedAccountGroup.mockReturnValue([
-      {
-        address: '0xABCdef1234567890',
-        id: 'account-1',
-        type: 'eip155:eoa',
-        metadata: {
-          name: 'Test',
-          importTime: 0,
-          keyring: { type: 'HD Key Tree' },
-        },
-        methods: [],
-        options: {},
-        scopes: [],
-      },
-    ]);
-  });
-
-  it('returns cached data when available', () => {
-    const accountState = { availableBalance: '1000' };
-    mockEngineState.cachedAccountState = accountState;
-    setFreshTimestamp();
-    expect(getPreloadedData('cachedAccountState')).toEqual(accountState);
+    mockCachedMarketDataForActiveProvider = null;
+    mockCachedUserDataForActiveProvider = null;
   });
 
-  it('returns cached array when available', () => {
+  it('returns cached positions when available', () => {
     const positions = [{ symbol: 'BTC-PERP' }];
-    mockEngineState.cachedPositions = positions;
-    setFreshTimestamp();
+    mockCachedUserDataForActiveProvider = {
+      positions,
+      orders: [],
+      accountState: null,
+    };
     expect(getPreloadedData('cachedPositions')).toEqual(positions);
   });
 
-  it('returns empty array when field is empty array', () => {
-    mockEngineState.cachedOrders = [];
-    setFreshTimestamp();
-    expect(getPreloadedData('cachedOrders')).toEqual([]);
+  it('returns cached orders when available', () => {
+    const orders = [{ orderId: 'order-1' }];
+    mockCachedUserDataForActiveProvider = {
+      positions: [],
+      orders,
+      accountState: null,
+    };
+    expect(getPreloadedData('cachedOrders')).toEqual(orders);
   });
 
-  it('returns null when no cached data exists', () => {
-    expect(getPreloadedData('cachedPositions')).toBeNull();
+  it('returns empty array for empty positions (valid cache)', () => {
+    mockCachedUserDataForActiveProvider = {
+      positions: [],
+      orders: [],
+      accountState: null,
+    };
+    expect(getPreloadedData('cachedPositions')).toEqual([]);
+  });
+
+  it('returns cached accountState when available', () => {
+    const accountState = { availableBalance: '1000' };
+    mockCachedUserDataForActiveProvider = {
+      positions: [],
+      orders: [],
+      accountState,
+    };
+    expect(getPreloadedData('cachedAccountState')).toEqual(accountState);
   });
 
-  it('returns null when field is null', () => {
-    mockEngineState.cachedAccountState = null;
+  it('returns null for accountState when accountState is null', () => {
+    mockCachedUserDataForActiveProvider = {
+      positions: [],
+      orders: [],
+      accountState: null,
+    };
     expect(getPreloadedData('cachedAccountState')).toBeNull();
   });
 
+  it('returns null when no cached data exists (helper returns null)', () => {
+    expect(getPreloadedData('cachedPositions')).toBeNull();
+  });
+
   it('returns cached market data when available', () => {
     const marketData = [{ symbol: 'BTC', price: '$50000' }];
-    mockEngineState.cachedMarketData = marketData;
+    mockCachedMarketDataForActiveProvider = marketData;
     expect(getPreloadedData('cachedMarketData')).toEqual(marketData);
   });
 
   it('returns null when cachedMarketData is not set', () => {
+    mockCachedMarketDataForActiveProvider = null;
     expect(getPreloadedData('cachedMarketData')).toBeNull();
   });
 
-  it('returns null for user data when timestamp is missing (stale)', () => {
-    mockEngineState.cachedPositions = [{ symbol: 'BTC-PERP' }];
-    // No timestamp — treated as stale for user data
-    expect(getPreloadedData('cachedPositions')).toBeNull();
-  });
-
-  describe('staleness check', () => {
-    it('returns null for user data when cache is older than 60s', () => {
-      mockEngineState.cachedOrders = [{ orderId: 'order-1' }];
-      mockEngineState.cachedUserDataTimestamp = Date.now() - 61_000;
-
-      expect(getPreloadedData('cachedOrders')).toBeNull();
-    });
-
-    it('returns data for user data when cache is within 60s', () => {
-      const orders = [{ orderId: 'order-1' }];
-      mockEngineState.cachedOrders = orders;
-      mockEngineState.cachedUserDataTimestamp = Date.now() - 30_000;
-
-      expect(getPreloadedData('cachedOrders')).toEqual(orders);
-    });
-
-    it('does not apply staleness check to cachedMarketData', () => {
-      const marketData = [{ symbol: 'BTC', price: '$50000' }];
-      mockEngineState.cachedMarketData = marketData;
-      // No timestamp — market data is not affected by staleness check
-      expect(getPreloadedData('cachedMarketData')).toEqual(marketData);
-    });
-  });
-
-  describe('account validation', () => {
-    it('returns null for user data when address mismatch', () => {
-      mockEngineState.cachedAccountState = { availableBalance: '1000' };
-      mockEngineState.cachedUserDataAddress = '0xDIFFERENTADDRESS';
-      setFreshTimestamp();
-      mockFindEvmAccount.mockReturnValue({ address: '0xABCdef1234567890' });
-
-      expect(getPreloadedData('cachedAccountState')).toBeNull();
-    });
-
-    it('returns data when cachedUserDataAddress is not set', () => {
-      mockEngineState.cachedAccountState = { availableBalance: '1000' };
-      // No cachedUserDataAddress — should trust cache
-      setFreshTimestamp();
-
-      expect(getPreloadedData('cachedAccountState')).toEqual({
-        availableBalance: '1000',
-      });
-    });
-
-    it('returns market data regardless of address mismatch', () => {
-      const marketData = [{ symbol: 'BTC', price: '$50000' }];
-      mockEngineState.cachedMarketData = marketData;
-      mockEngineState.cachedUserDataAddress = '0xDIFFERENTADDRESS';
-      mockFindEvmAccount.mockReturnValue({ address: '0xABCdef1234567890' });
-
-      expect(getPreloadedData('cachedMarketData')).toEqual(marketData);
-    });
+  it('returns market data regardless of user data helper state', () => {
+    const marketData = [{ symbol: 'BTC', price: '$50000' }];
+    mockCachedMarketDataForActiveProvider = marketData;
+    mockCachedUserDataForActiveProvider = null; // user data is stale/missing
+    expect(getPreloadedData('cachedMarketData')).toEqual(marketData);
   });
 });
diff --git a/app/components/UI/Perps/hooks/stream/hasCachedPerpsData.ts b/app/components/UI/Perps/hooks/stream/hasCachedPerpsData.ts
index b2144b88a38b..c3c1f8ed09d7 100644
--- a/app/components/UI/Perps/hooks/stream/hasCachedPerpsData.ts
+++ b/app/components/UI/Perps/hooks/stream/hasCachedPerpsData.ts
@@ -1,6 +1,5 @@
-import { InternalAccount } from '@metamask/keyring-internal-api';
 import Engine from '../../../../../core/Engine';
-import { findEvmAccount } from '@metamask/perps-controller';
+import type { Position, Order, AccountState } from '@metamask/perps-controller';
 
 type CacheField =
   | 'cachedPositions'
@@ -8,38 +7,25 @@ type CacheField =
   | 'cachedAccountState'
   | 'cachedMarketData';
 
-const USER_DATA_FIELDS: CacheField[] = [
-  'cachedPositions',
-  'cachedOrders',
-  'cachedAccountState',
-];
-
 /**
- * Maximum age (ms) of controller-preloaded user data before it's considered stale.
- * Intentionally shorter than the controller's 5-minute refresh cycle — WebSocket
- * streams should take over within seconds, making REST preload cache irrelevant.
+ * Read per-provider market data from the controller's getCachedMarketDataForActiveProvider helper.
  */
-export const USER_DATA_CACHE_STALE_MS = 60_000;
+function getMarketDataFromController(): unknown[] | null {
+  const controller = Engine.context.PerpsController;
+  return controller?.getCachedMarketDataForActiveProvider?.() ?? null;
+}
 
 /**
- * Check if the controller's cached data belongs to the currently selected
- * EVM account.  Market data is not account-specific, so it always passes.
+ * Read per-provider user data from the controller's getCachedUserDataForActiveProvider helper.
+ * Returns positions, orders, and accountState for the active provider with TTL + address validation.
  */
-export function isCacheForCurrentAccount(controller: {
-  state?: { cachedUserDataAddress?: string | null };
-}): boolean {
-  const cachedAddr = controller?.state?.cachedUserDataAddress;
-  if (!cachedAddr) return true; // No address recorded = trust the cache
-  try {
-    const { AccountTreeController } = Engine.context;
-    const accounts =
-      AccountTreeController.getAccountsFromSelectedAccountGroup();
-    const evmAccount = findEvmAccount(accounts as InternalAccount[]);
-    if (!evmAccount?.address) return true; // Can't determine current account
-    return cachedAddr.toLowerCase() === evmAccount.address.toLowerCase();
-  } catch {
-    return true; // Error getting account = trust cache
-  }
+function getUserDataFromController(): {
+  positions: Position[];
+  orders: Order[];
+  accountState: AccountState | null;
+} | null {
+  const controller = Engine.context.PerpsController;
+  return controller?.getCachedUserDataForActiveProvider?.() ?? null;
 }
 
 /**
@@ -51,17 +37,24 @@ export function isCacheForCurrentAccount(controller: {
  * (startMarketDataPreload), not by the hooks.
  */
 export function hasPreloadedData(cacheField: CacheField): boolean {
-  const controller = Engine.context.PerpsController;
-  const preloaded = controller?.state?.[cacheField];
-  // null/undefined = not loaded yet, [] = loaded with no data (valid cache)
-  if (preloaded == null) return false;
-  if (USER_DATA_FIELDS.includes(cacheField)) {
-    const timestamp = controller?.state?.cachedUserDataTimestamp;
-    if (!timestamp || Date.now() - timestamp >= USER_DATA_CACHE_STALE_MS)
-      return false;
-    if (!isCacheForCurrentAccount(controller)) return false;
+  if (cacheField === 'cachedMarketData') {
+    const marketData = getMarketDataFromController();
+    return marketData != null;
+  }
+
+  const userData = getUserDataFromController();
+  if (!userData) return false;
+
+  if (cacheField === 'cachedPositions') {
+    return true; // positions is always an array (possibly empty = valid cache)
   }
-  return true;
+  if (cacheField === 'cachedOrders') {
+    return true; // orders is always an array (possibly empty = valid cache)
+  }
+  if (cacheField === 'cachedAccountState') {
+    return userData.accountState != null;
+  }
+  return false;
 }
 
 /**
@@ -73,14 +66,21 @@ export function hasPreloadedData(cacheField: CacheField): boolean {
  * (startMarketDataPreload), not by the hooks.
  */
 export function getPreloadedData<T>(cacheField: CacheField): T | null {
-  const controller = Engine.context.PerpsController;
-  const preloaded = (controller?.state?.[cacheField] as T) ?? null;
-  if (preloaded == null) return null;
-  if (USER_DATA_FIELDS.includes(cacheField)) {
-    const timestamp = controller?.state?.cachedUserDataTimestamp;
-    if (!timestamp || Date.now() - timestamp >= USER_DATA_CACHE_STALE_MS)
-      return null;
-    if (!isCacheForCurrentAccount(controller)) return null;
+  if (cacheField === 'cachedMarketData') {
+    return (getMarketDataFromController() as T) ?? null;
+  }
+
+  const userData = getUserDataFromController();
+  if (!userData) return null;
+
+  if (cacheField === 'cachedPositions') {
+    return userData.positions as T;
+  }
+  if (cacheField === 'cachedOrders') {
+    return userData.orders as T;
+  }
+  if (cacheField === 'cachedAccountState') {
+    return (userData.accountState as T) ?? null;
   }
-  return preloaded;
+  return null;
 }
diff --git a/app/components/UI/Perps/hooks/stream/useLivePositions.test.ts b/app/components/UI/Perps/hooks/stream/useLivePositions.test.ts
index 93522cb86fc2..4584a54f23e0 100644
--- a/app/components/UI/Perps/hooks/stream/useLivePositions.test.ts
+++ b/app/components/UI/Perps/hooks/stream/useLivePositions.test.ts
@@ -7,17 +7,16 @@ import {
 import { type Position, type PriceUpdate } from '@metamask/perps-controller';
 
 // Mock Engine for lazy isInitialLoading check
-const mockEngineState = {
-  cachedPositions: null as Position[] | null,
-  cachedUserDataTimestamp: 0,
-};
+let mockCachedUserData: {
+  positions: Position[];
+  orders: unknown[];
+  accountState: unknown;
+} | null = null;
 
 jest.mock('../../../../../core/Engine', () => ({
   context: {
     PerpsController: {
-      get state() {
-        return mockEngineState;
-      },
+      getCachedUserDataForActiveProvider: () => mockCachedUserData,
     },
   },
 }));
@@ -66,6 +65,7 @@ describe('usePerpsLivePositions', () => {
   beforeEach(() => {
     jest.clearAllMocks();
     jest.useFakeTimers();
+    mockCachedUserData = null;
   });
 
   afterEach(() => {
@@ -643,8 +643,11 @@ describe('usePerpsLivePositions', () => {
         { ...mockPosition, symbol: 'ETH-PERP', size: '10.0' },
       ];
 
-      mockEngineState.cachedPositions = cachedPositions;
-      mockEngineState.cachedUserDataTimestamp = Date.now();
+      mockCachedUserData = {
+        positions: cachedPositions,
+        orders: [],
+        accountState: null,
+      };
 
       mockPositionsSubscribe.mockReturnValue(jest.fn());
       mockPricesSubscribe.mockReturnValue(jest.fn());
@@ -655,23 +658,20 @@ describe('usePerpsLivePositions', () => {
       expect(result.current.isInitialLoading).toBe(false);
     });
 
-    it('returns empty positions for stale cache (older than 60s)', () => {
-      mockEngineState.cachedPositions = [mockPosition];
-      mockEngineState.cachedUserDataTimestamp = Date.now() - 61_000;
+    it('returns empty positions for stale cache (helper returns null)', () => {
+      mockCachedUserData = null;
 
       mockPositionsSubscribe.mockReturnValue(jest.fn());
       mockPricesSubscribe.mockReturnValue(jest.fn());
 
       const { result } = renderHook(() => usePerpsLivePositions());
 
-      // getPreloadedData enforces 60s TTL — stale cache is not used
       expect(result.current.positions).toEqual([]);
       expect(result.current.isInitialLoading).toBe(true);
     });
 
     it('returns empty positions when no cache exists', () => {
-      mockEngineState.cachedPositions = null;
-      mockEngineState.cachedUserDataTimestamp = 0;
+      mockCachedUserData = null;
 
       mockPositionsSubscribe.mockReturnValue(jest.fn());
       mockPricesSubscribe.mockReturnValue(jest.fn());
@@ -683,8 +683,7 @@ describe('usePerpsLivePositions', () => {
     });
 
     it('handles empty cached positions array (valid cache, no positions)', () => {
-      mockEngineState.cachedPositions = [];
-      mockEngineState.cachedUserDataTimestamp = Date.now();
+      mockCachedUserData = { positions: [], orders: [], accountState: null };
 
       mockPositionsSubscribe.mockReturnValue(jest.fn());
       mockPricesSubscribe.mockReturnValue(jest.fn());
diff --git a/app/components/UI/Perps/hooks/stream/usePerpsLiveAccount.test.ts b/app/components/UI/Perps/hooks/stream/usePerpsLiveAccount.test.ts
index 863e7bee02a0..a426556269b2 100644
--- a/app/components/UI/Perps/hooks/stream/usePerpsLiveAccount.test.ts
+++ b/app/components/UI/Perps/hooks/stream/usePerpsLiveAccount.test.ts
@@ -8,17 +8,16 @@ jest.mock('../../../../../../locales/i18n', () => ({
 }));
 
 // Mock Engine for lazy isInitialLoading check
-const mockEngineState = {
-  cachedAccountState: null as AccountState | null,
-  cachedUserDataTimestamp: 0,
-};
+let mockCachedUserData: {
+  positions: unknown[];
+  orders: unknown[];
+  accountState: AccountState | null;
+} | null = null;
 
 jest.mock('../../../../../core/Engine', () => ({
   context: {
     PerpsController: {
-      get state() {
-        return mockEngineState;
-      },
+      getCachedUserDataForActiveProvider: () => mockCachedUserData,
     },
   },
 }));
@@ -36,6 +35,7 @@ jest.mock('../../providers/PerpsStreamManager', () => ({
 describe('usePerpsLiveAccount', () => {
   beforeEach(() => {
     jest.clearAllMocks();
+    mockCachedUserData = null;
   });
 
   describe('default state', () => {
@@ -269,8 +269,11 @@ describe('usePerpsLiveAccount', () => {
         totalBalance: '7100',
       };
 
-      mockEngineState.cachedAccountState = cachedAccount;
-      mockEngineState.cachedUserDataTimestamp = Date.now();
+      mockCachedUserData = {
+        positions: [],
+        orders: [],
+        accountState: cachedAccount,
+      };
 
       // Mock subscription to NOT call the callback (no WebSocket data yet)
       mockSubscribe.mockImplementation(() => jest.fn());
@@ -286,11 +289,8 @@ describe('usePerpsLiveAccount', () => {
       });
     });
 
-    it('returns null for stale cached account (older than 60s)', () => {
-      mockEngineState.cachedAccountState = {
-        availableBalance: '5000',
-      } as AccountState;
-      mockEngineState.cachedUserDataTimestamp = Date.now() - 61_000;
+    it('returns null for stale cached account (helper returns null)', () => {
+      mockCachedUserData = null;
 
       mockSubscribe.mockImplementation(() => jest.fn());
 
@@ -298,7 +298,6 @@ describe('usePerpsLiveAccount', () => {
         state: {},
       });
 
-      // getPreloadedData enforces 60s TTL — stale cache is not used
       expect(result.current).toEqual({
         account: null,
         isInitialLoading: true,
@@ -306,8 +305,7 @@ describe('usePerpsLiveAccount', () => {
     });
 
     it('has null account when no cache exists', () => {
-      mockEngineState.cachedAccountState = null;
-      mockEngineState.cachedUserDataTimestamp = 0;
+      mockCachedUserData = null;
 
       mockSubscribe.mockImplementation(() => jest.fn());
 
diff --git a/app/components/UI/Perps/hooks/stream/usePerpsLiveOrders.test.ts b/app/components/UI/Perps/hooks/stream/usePerpsLiveOrders.test.ts
index db8261749ec2..8be962a520c1 100644
--- a/app/components/UI/Perps/hooks/stream/usePerpsLiveOrders.test.ts
+++ b/app/components/UI/Perps/hooks/stream/usePerpsLiveOrders.test.ts
@@ -4,17 +4,16 @@ import { usePerpsLiveOrders } from './index';
 import { type Order } from '@metamask/perps-controller';
 
 // Mock Engine for lazy isInitialLoading check
-const mockEngineState = {
-  cachedOrders: null as Order[] | null,
-  cachedUserDataTimestamp: 0,
-};
+let mockCachedUserData: {
+  positions: unknown[];
+  orders: Order[];
+  accountState: unknown;
+} | null = null;
 
 jest.mock('../../../../../core/Engine', () => ({
   context: {
     PerpsController: {
-      get state() {
-        return mockEngineState;
-      },
+      getCachedUserDataForActiveProvider: () => mockCachedUserData,
     },
   },
 }));
@@ -49,6 +48,7 @@ describe('usePerpsLiveOrders', () => {
   beforeEach(() => {
     jest.clearAllMocks();
     jest.useFakeTimers();
+    mockCachedUserData = null;
   });
 
   afterEach(() => {
@@ -209,8 +209,11 @@ describe('usePerpsLiveOrders', () => {
         { ...mockOrder, orderId: 'order-2', symbol: 'ETH-PERP' } as Order,
       ];
 
-      mockEngineState.cachedOrders = cachedOrders;
-      mockEngineState.cachedUserDataTimestamp = Date.now();
+      mockCachedUserData = {
+        positions: [],
+        orders: cachedOrders,
+        accountState: null,
+      };
 
       mockSubscribe.mockReturnValue(jest.fn());
 
@@ -220,22 +223,19 @@ describe('usePerpsLiveOrders', () => {
       expect(result.current.isInitialLoading).toBe(false);
     });
 
-    it('returns empty orders for stale cache (older than 60s)', () => {
-      mockEngineState.cachedOrders = [mockOrder];
-      mockEngineState.cachedUserDataTimestamp = Date.now() - 61_000;
+    it('returns empty orders for stale cache (helper returns null)', () => {
+      mockCachedUserData = null; // Controller helper returns null for stale/invalid cache
 
       mockSubscribe.mockReturnValue(jest.fn());
 
       const { result } = renderHook(() => usePerpsLiveOrders());
 
-      // getPreloadedData enforces 60s TTL — stale cache is not used
       expect(result.current.orders).toEqual([]);
       expect(result.current.isInitialLoading).toBe(true);
     });
 
     it('returns empty orders when no cache exists', () => {
-      mockEngineState.cachedOrders = null;
-      mockEngineState.cachedUserDataTimestamp = 0;
+      mockCachedUserData = null;
 
       mockSubscribe.mockReturnValue(jest.fn());
 
@@ -246,8 +246,7 @@ describe('usePerpsLiveOrders', () => {
     });
 
     it('handles empty cached orders array (valid cache, no orders)', () => {
-      mockEngineState.cachedOrders = [];
-      mockEngineState.cachedUserDataTimestamp = Date.now();
+      mockCachedUserData = { positions: [], orders: [], accountState: null };
 
       mockSubscribe.mockReturnValue(jest.fn());
 
diff --git a/app/components/UI/Perps/hooks/usePerpsBalanceTokenFilter.test.ts b/app/components/UI/Perps/hooks/usePerpsBalanceTokenFilter.test.ts
index d4d37e29cd71..75018cd64c3f 100644
--- a/app/components/UI/Perps/hooks/usePerpsBalanceTokenFilter.test.ts
+++ b/app/components/UI/Perps/hooks/usePerpsBalanceTokenFilter.test.ts
@@ -1,4 +1,4 @@
-import { renderHook } from '@testing-library/react-native';
+import { renderHook, waitFor } from '@testing-library/react-native';
 import { useSelector } from 'react-redux';
 import { TransactionType } from '@metamask/transaction-controller';
 import { usePerpsBalanceTokenFilter } from './usePerpsBalanceTokenFilter';
@@ -10,8 +10,12 @@ import {
   isHighlightedItemOutsideAssetList,
 } from '../../../Views/confirmations/types/token';
 import { usePerpsTrading } from './usePerpsTrading';
-import { useConfirmNavigation } from '../../../Views/confirmations/hooks/useConfirmNavigation';
 import { usePerpsPaymentToken } from './usePerpsPaymentToken';
+import Routes from '../../../../constants/navigation/Routes';
+import { useNavigation } from '@react-navigation/native';
+import useApprovalRequest from '../../../Views/confirmations/hooks/useApprovalRequest';
+import { selectPerpsAccountState } from '../selectors/perpsController';
+import { selectPerpsPayWithAnyTokenAllowlistAssets } from '../selectors/featureFlags';
 
 jest.mock('../../../../../locales/i18n', () => ({
   strings: jest.fn((key: string) => key),
@@ -22,8 +26,12 @@ jest.mock(
 );
 jest.mock('./useIsPerpsBalanceSelected');
 jest.mock('./usePerpsTrading');
-jest.mock('../../../Views/confirmations/hooks/useConfirmNavigation', () => ({
-  useConfirmNavigation: jest.fn(),
+jest.mock('../../../Views/confirmations/hooks/useApprovalRequest', () => ({
+  __esModule: true,
+  default: jest.fn(),
+}));
+jest.mock('@react-navigation/native', () => ({
+  useNavigation: jest.fn(),
 }));
 jest.mock('./usePerpsPaymentToken');
 jest.mock('./usePerpsNetworkManagement', () => ({
@@ -58,17 +66,21 @@ const mockUseSelector = useSelector as jest.MockedFunction<typeof useSelector>;
 const mockUsePerpsTrading = usePerpsTrading as jest.MockedFunction<
   typeof usePerpsTrading
 >;
-const mockUseConfirmNavigation = useConfirmNavigation as jest.MockedFunction<
-  typeof useConfirmNavigation
->;
 const mockUsePerpsPaymentToken = usePerpsPaymentToken as jest.MockedFunction<
   typeof usePerpsPaymentToken
 >;
+const mockUseNavigation = useNavigation as jest.MockedFunction<
+  typeof useNavigation
+>;
+const mockUseApprovalRequest = useApprovalRequest as jest.MockedFunction<
+  typeof useApprovalRequest
+>;
 
 describe('usePerpsBalanceTokenFilter', () => {
   const chainId = '0xa4b1';
   const mockDepositWithConfirmation = jest.fn().mockResolvedValue(undefined);
-  const mockNavigateToConfirmation = jest.fn();
+  const mockNavigate = jest.fn();
+  const mockOnReject = jest.fn();
   const mockOnPerpsPaymentTokenChange = jest.fn();
 
   beforeEach(() => {
@@ -77,10 +89,10 @@ describe('usePerpsBalanceTokenFilter', () => {
     mockUseIsPerpsBalanceSelected.mockReturnValue(false);
     mockUseSelector.mockImplementation(
       (selector: (state: unknown) => unknown) => {
-        if (selector.name === 'selectPerpsAccountState') {
+        if (selector === selectPerpsAccountState) {
           return { availableBalance: '1500.00' };
         }
-        if (selector.name === 'selectPerpsPayWithAnyTokenAllowlistAssets') {
+        if (selector === selectPerpsPayWithAnyTokenAllowlistAssets) {
           return [];
         }
         return undefined;
@@ -89,9 +101,12 @@ describe('usePerpsBalanceTokenFilter', () => {
     mockUsePerpsTrading.mockReturnValue({
       depositWithConfirmation: mockDepositWithConfirmation,
     } as unknown as ReturnType<typeof usePerpsTrading>);
-    mockUseConfirmNavigation.mockReturnValue({
-      navigateToConfirmation: mockNavigateToConfirmation,
-    } as unknown as ReturnType<typeof useConfirmNavigation>);
+    mockUseNavigation.mockReturnValue({
+      navigate: mockNavigate,
+    } as unknown as ReturnType<typeof useNavigation>);
+    mockUseApprovalRequest.mockReturnValue({
+      onReject: mockOnReject,
+    } as unknown as ReturnType<typeof useApprovalRequest>);
     mockUsePerpsPaymentToken.mockReturnValue({
       onPaymentTokenChange: mockOnPerpsPaymentTokenChange,
     } as unknown as ReturnType<typeof usePerpsPaymentToken>);
@@ -200,9 +215,8 @@ describe('usePerpsBalanceTokenFilter', () => {
     it('uses zero balance when perps account is null', () => {
       mockUseSelector.mockImplementation(
         (selector: (state: unknown) => unknown) => {
-          if (selector.name === 'selectPerpsAccountState') return null;
-          if (selector.name === 'selectPerpsPayWithAnyTokenAllowlistAssets')
-            return [];
+          if (selector === selectPerpsAccountState) return null;
+          if (selector === selectPerpsPayWithAnyTokenAllowlistAssets) return [];
           return undefined;
         },
       );
@@ -222,10 +236,9 @@ describe('usePerpsBalanceTokenFilter', () => {
     it('clears isSelected on other tokens when perps balance is selected', () => {
       mockUseSelector.mockImplementation(
         (selector: (state: unknown) => unknown) => {
-          if (selector.name === 'selectPerpsAccountState')
+          if (selector === selectPerpsAccountState)
             return { availableBalance: '1500.00' };
-          if (selector.name === 'selectPerpsPayWithAnyTokenAllowlistAssets')
-            return [];
+          if (selector === selectPerpsPayWithAnyTokenAllowlistAssets) return [];
           return undefined;
         },
       );
@@ -255,10 +268,9 @@ describe('usePerpsBalanceTokenFilter', () => {
     it('keeps token isSelected when perps balance is not selected', () => {
       mockUseSelector.mockImplementation(
         (selector: (state: unknown) => unknown) => {
-          if (selector.name === 'selectPerpsAccountState')
+          if (selector === selectPerpsAccountState)
             return { availableBalance: '1500.00' };
-          if (selector.name === 'selectPerpsPayWithAnyTokenAllowlistAssets')
-            return [];
+          if (selector === selectPerpsPayWithAnyTokenAllowlistAssets) return [];
           return undefined;
         },
       );
@@ -280,14 +292,15 @@ describe('usePerpsBalanceTokenFilter', () => {
 
     it('filters to only allowlisted tokens when allowlist is set', () => {
       const allowlistKey = `${chainId}.0xusdc`.toLowerCase();
-      let callIndex = 0;
-      mockUseSelector.mockImplementation(() => {
-        callIndex += 1;
-        // Hook calls selectPerpsAccountState first, then selectPerpsPayWithAnyTokenAllowlistAssets
-        if (callIndex === 1) return { availableBalance: '100.00' };
-        if (callIndex === 2) return [allowlistKey];
-        return [];
-      });
+      mockUseSelector.mockImplementation(
+        (selector: (state: unknown) => unknown) => {
+          if (selector === selectPerpsAccountState)
+            return { availableBalance: '100.00' };
+          if (selector === selectPerpsPayWithAnyTokenAllowlistAssets)
+            return [allowlistKey];
+          return [];
+        },
+      );
       const inputTokens: AssetType[] = [
         {
           address: '0xusdc',
@@ -314,7 +327,7 @@ describe('usePerpsBalanceTokenFilter', () => {
       expect((output[1] as AssetType).symbol).toBe('USDC');
     });
 
-    it('calls navigateToConfirmation and depositWithConfirmation when Add funds is pressed', async () => {
+    it('calls onReject, depositWithConfirmation and navigation.navigate when Add funds is pressed', async () => {
       mockUseSelector.mockReturnValue({
         availableBalance: '500.00',
       });
@@ -336,12 +349,17 @@ describe('usePerpsBalanceTokenFilter', () => {
       expect(isHighlightedItemOutsideAssetList(highlightedAction)).toBe(true);
       if (isHighlightedItemOutsideAssetList(highlightedAction)) {
         highlightedAction.actions?.[0]?.onPress();
-        // handlePerpsDepositPress is async (ensureArbitrumNetworkExists().then(...))
-        await Promise.resolve();
-        expect(mockNavigateToConfirmation).toHaveBeenCalledWith({
-          stack: expect.any(String),
-        });
-        expect(mockDepositWithConfirmation).toHaveBeenCalledTimes(1);
+        await waitFor(
+          () => {
+            expect(mockOnReject).toHaveBeenCalledTimes(1);
+            expect(mockDepositWithConfirmation).toHaveBeenCalledTimes(1);
+            expect(mockNavigate).toHaveBeenCalledWith(
+              Routes.FULL_SCREEN_CONFIRMATIONS.REDESIGNED_CONFIRMATIONS,
+              { showPerpsHeader: true },
+            );
+          },
+          { timeout: 2000 },
+        );
       }
     });
 
diff --git a/app/components/UI/Perps/hooks/usePerpsBalanceTokenFilter.ts b/app/components/UI/Perps/hooks/usePerpsBalanceTokenFilter.ts
index 659d16311de8..76b80d8cec04 100644
--- a/app/components/UI/Perps/hooks/usePerpsBalanceTokenFilter.ts
+++ b/app/components/UI/Perps/hooks/usePerpsBalanceTokenFilter.ts
@@ -19,8 +19,9 @@ import { useIsPerpsBalanceSelected } from './useIsPerpsBalanceSelected';
 import { usePerpsPaymentToken } from './usePerpsPaymentToken';
 import Routes from '../../../../constants/navigation/Routes';
 import { usePerpsTrading } from './usePerpsTrading';
+import { useNavigation } from '@react-navigation/native';
+import useApprovalRequest from '../../../Views/confirmations/hooks/useApprovalRequest';
 import { usePerpsNetworkManagement } from './usePerpsNetworkManagement';
-import { useConfirmNavigation } from '../../../Views/confirmations/hooks/useConfirmNavigation';
 
 /** URI for the perps balance token icon, shared with PerpsPayRow and pay-with modal. */
 const resolvedPerpsIcon = Image.resolveAssetSource(perpsPayTokenIcon);
@@ -46,27 +47,38 @@ export function usePerpsBalanceTokenFilter(): (
   const formatFiat = useFiatFormatter({ currency: 'usd' });
 
   const { depositWithConfirmation } = usePerpsTrading();
-  const { ensureArbitrumNetworkExists } = usePerpsNetworkManagement();
-  const { navigateToConfirmation } = useConfirmNavigation();
 
   const isPerpsDepositAndOrder = hasTransactionType(transactionMeta, [
     TransactionType.perpsDepositAndOrder,
   ]);
 
+  const { onReject: handleReject } = useApprovalRequest();
+  const { ensureArbitrumNetworkExists } = usePerpsNetworkManagement();
+
+  const navigation = useNavigation();
+
   const handlePerpsDepositPress = useCallback(() => {
     ensureArbitrumNetworkExists()
       .then(() => {
-        navigateToConfirmation({ stack: Routes.PERPS.ROOT });
+        handleReject();
         return depositWithConfirmation();
       })
-      .catch((_err) => {
+      .then(() => {
+        navigation.navigate(
+          Routes.FULL_SCREEN_CONFIRMATIONS.REDESIGNED_CONFIRMATIONS,
+          {
+            showPerpsHeader: true,
+          },
+        );
+      })
+      .catch(() => {
         // Deposit flow handles errors (e.g. user rejection or missing network).
-        // ensureArbitrumNetworkExists errors are logged inside the hook itself.
       });
   }, [
-    ensureArbitrumNetworkExists,
-    navigateToConfirmation,
+    navigation,
     depositWithConfirmation,
+    handleReject,
+    ensureArbitrumNetworkExists,
   ]);
 
   const { onPaymentTokenChange: onPerpsPaymentTokenChange } =
diff --git a/app/components/UI/Perps/hooks/usePerpsMarketListView.test.ts b/app/components/UI/Perps/hooks/usePerpsMarketListView.test.ts
index 08a2ab45ba52..2390f2de6b64 100644
--- a/app/components/UI/Perps/hooks/usePerpsMarketListView.test.ts
+++ b/app/components/UI/Perps/hooks/usePerpsMarketListView.test.ts
@@ -107,9 +107,6 @@ describe('usePerpsMarketListView', () => {
     mockUsePerpsSearch.mockReturnValue({
       searchQuery: '',
       setSearchQuery: jest.fn(),
-      isSearchVisible: false,
-      setIsSearchVisible: jest.fn(),
-      toggleSearchVisibility: jest.fn(),
       filteredMarkets: mockMarketsWithValidVolume, // Already filtered by volume
       clearSearch: jest.fn(),
     });
@@ -148,25 +145,11 @@ describe('usePerpsMarketListView', () => {
       expect(result.current.favoritesState).toBeDefined();
     });
 
-    it('respects defaultSearchVisible parameter', () => {
-      mockUsePerpsSearch.mockReturnValue({
-        searchQuery: '',
-        setSearchQuery: jest.fn(),
-        isSearchVisible: true,
-        setIsSearchVisible: jest.fn(),
-        toggleSearchVisibility: jest.fn(),
-        filteredMarkets: mockMarketsWithValidVolume,
-        clearSearch: jest.fn(),
-      });
-
-      const { result } = renderHook(() =>
-        usePerpsMarketListView({ defaultSearchVisible: true }),
-      );
+    it('passes markets to usePerpsSearch', () => {
+      renderHook(() => usePerpsMarketListView());
 
-      expect(result.current.searchState.isSearchVisible).toBe(true);
       expect(mockUsePerpsSearch).toHaveBeenCalledWith({
         markets: expect.any(Array),
-        initialSearchVisible: true,
       });
     });
 
@@ -268,9 +251,6 @@ describe('usePerpsMarketListView', () => {
       mockUsePerpsSearch.mockReturnValue({
         searchQuery: '',
         setSearchQuery: jest.fn(),
-        isSearchVisible: false,
-        setIsSearchVisible: jest.fn(),
-        toggleSearchVisibility: jest.fn(),
         filteredMarkets: [],
         clearSearch: jest.fn(),
       });
@@ -286,9 +266,6 @@ describe('usePerpsMarketListView', () => {
       const mockSearchState = {
         searchQuery: 'BTC',
         setSearchQuery: jest.fn(),
-        isSearchVisible: true,
-        setIsSearchVisible: jest.fn(),
-        toggleSearchVisibility: jest.fn(),
         filteredMarkets: [mockMarketsWithValidVolume[0]],
         clearSearch: jest.fn(),
       };
@@ -298,13 +275,9 @@ describe('usePerpsMarketListView', () => {
       const { result } = renderHook(() => usePerpsMarketListView());
 
       expect(result.current.searchState.searchQuery).toBe('BTC');
-      expect(result.current.searchState.isSearchVisible).toBe(true);
       expect(result.current.searchState.setSearchQuery).toBe(
         mockSearchState.setSearchQuery,
       );
-      expect(result.current.searchState.toggleSearchVisibility).toBe(
-        mockSearchState.toggleSearchVisibility,
-      );
       expect(result.current.searchState.clearSearch).toBe(
         mockSearchState.clearSearch,
       );
@@ -460,9 +433,6 @@ describe('usePerpsMarketListView', () => {
       mockUsePerpsSearch.mockReturnValue({
         searchQuery: 'BTC',
         setSearchQuery: jest.fn(),
-        isSearchVisible: true,
-        setIsSearchVisible: jest.fn(),
-        toggleSearchVisibility: jest.fn(),
         filteredMarkets: [mockMarketsWithValidVolume[0]], // Only BTC
         clearSearch: jest.fn(),
       });
@@ -489,9 +459,6 @@ describe('usePerpsMarketListView', () => {
       mockUsePerpsSearch.mockReturnValue({
         searchQuery: 'ETH',
         setSearchQuery: jest.fn(),
-        isSearchVisible: true,
-        setIsSearchVisible: jest.fn(),
-        toggleSearchVisibility: jest.fn(),
         filteredMarkets: [mockMarketsWithValidVolume[1]], // Only ETH
         clearSearch: jest.fn(),
       });
@@ -508,10 +475,7 @@ describe('usePerpsMarketListView', () => {
       });
 
       const { result } = renderHook(() =>
-        usePerpsMarketListView({
-          showWatchlistOnly: true,
-          defaultSearchVisible: true,
-        }),
+        usePerpsMarketListView({ showWatchlistOnly: true }),
       );
 
       // All filters applied
@@ -645,9 +609,6 @@ describe('usePerpsMarketListView', () => {
       mockUsePerpsSearch.mockReturnValue({
         searchQuery: '',
         setSearchQuery: jest.fn(),
-        isSearchVisible: false,
-        setIsSearchVisible: jest.fn(),
-        toggleSearchVisibility: jest.fn(),
         filteredMarkets: mixedMarkets,
         clearSearch: jest.fn(),
       });
@@ -675,9 +636,6 @@ describe('usePerpsMarketListView', () => {
       mockUsePerpsSearch.mockReturnValue({
         searchQuery: '',
         setSearchQuery: jest.fn(),
-        isSearchVisible: false,
-        setIsSearchVisible: jest.fn(),
-        toggleSearchVisibility: jest.fn(),
         filteredMarkets: [],
         clearSearch: jest.fn(),
       });
@@ -719,9 +677,6 @@ describe('usePerpsMarketListView', () => {
       mockUsePerpsSearch.mockReturnValue({
         searchQuery: '',
         setSearchQuery: jest.fn(),
-        isSearchVisible: false,
-        setIsSearchVisible: jest.fn(),
-        toggleSearchVisibility: jest.fn(),
         filteredMarkets: initialMarkets,
         clearSearch: jest.fn(),
       });
@@ -745,9 +700,6 @@ describe('usePerpsMarketListView', () => {
       mockUsePerpsSearch.mockReturnValue({
         searchQuery: '',
         setSearchQuery: jest.fn(),
-        isSearchVisible: false,
-        setIsSearchVisible: jest.fn(),
-        toggleSearchVisibility: jest.fn(),
         filteredMarkets: updatedMarkets,
         clearSearch: jest.fn(),
       });
@@ -799,9 +751,6 @@ describe('usePerpsMarketListView', () => {
       mockUsePerpsSearch.mockReturnValue({
         searchQuery: '',
         setSearchQuery: jest.fn(),
-        isSearchVisible: false,
-        setIsSearchVisible: jest.fn(),
-        toggleSearchVisibility: jest.fn(),
         filteredMarkets: mixedMarkets,
         clearSearch: jest.fn(),
       });
@@ -861,14 +810,11 @@ describe('usePerpsMarketListView', () => {
       ).toBe(true);
     });
 
-    it('ignores category filter when searching', () => {
+    it('applies category filter when searching', () => {
       mockUsePerpsSearch.mockReturnValue({
         searchQuery: 'BTC',
         setSearchQuery: jest.fn(),
-        isSearchVisible: true,
-        setIsSearchVisible: jest.fn(),
-        toggleSearchVisibility: jest.fn(),
-        filteredMarkets: [mixedMarkets[0]], // Only BTC from search
+        filteredMarkets: [mixedMarkets[0]], // BTC from search
         clearSearch: jest.fn(),
       });
 
@@ -876,9 +822,7 @@ describe('usePerpsMarketListView', () => {
         usePerpsMarketListView({ defaultMarketTypeFilter: 'forex' }),
       );
 
-      // When searching, should show search results regardless of category filter
-      expect(result.current.markets.length).toBe(1);
-      expect(result.current.markets[0].symbol).toBe('BTC');
+      expect(result.current.markets.length).toBe(0);
     });
 
     it('exposes market type filter state', () => {
diff --git a/app/components/UI/Perps/hooks/usePerpsMarketListView.ts b/app/components/UI/Perps/hooks/usePerpsMarketListView.ts
index 35ddcb9a85ec..f82653d22439 100644
--- a/app/components/UI/Perps/hooks/usePerpsMarketListView.ts
+++ b/app/components/UI/Perps/hooks/usePerpsMarketListView.ts
@@ -18,11 +18,6 @@ import {
 import Engine from '../../../../core/Engine';
 
 interface UsePerpsMarketListViewParams {
-  /**
-   * Initial search visibility
-   * @default false
-   */
-  defaultSearchVisible?: boolean;
   /**
    * Enable polling for markets data
    * @default false
@@ -56,9 +51,6 @@ interface UsePerpsMarketListViewReturn {
   searchState: {
     searchQuery: string;
     setSearchQuery: (query: string) => void;
-    isSearchVisible: boolean;
-    setIsSearchVisible: (visible: boolean) => void;
-    toggleSearchVisibility: () => void;
     clearSearch: () => void;
   };
   /**
@@ -133,13 +125,11 @@ interface UsePerpsMarketListViewReturn {
  *   isLoading,
  *   error,
  * } = usePerpsMarketListView({
- *   defaultSearchVisible: false,
  *   enablePolling: false,
  * });
  * ```
  */
 export const usePerpsMarketListView = ({
-  defaultSearchVisible = false,
   enablePolling = false,
   showWatchlistOnly = false,
   defaultMarketTypeFilter = 'all',
@@ -168,25 +158,13 @@ export const usePerpsMarketListView = ({
     defaultMarketTypeFilter,
   );
 
-  // Use search hook for search state and filtering
-  // Pass ALL markets to search so it can search across all market types
-  const searchHook = usePerpsSearch({
-    markets: allMarkets,
-    initialSearchVisible: defaultSearchVisible,
-  });
+  // Use search hook for search state and filtering (search bar always visible in UI)
+  const searchHook = usePerpsSearch({ markets: allMarkets });
 
-  const { filteredMarkets: searchedMarkets, searchQuery } = searchHook;
+  const { filteredMarkets: searchedMarkets } = searchHook;
 
-  // Apply market type filter AFTER search
-  // When searching: show all search results across all market types
-  // When not searching: filter by selected category
+  // Apply market type filter to search results (search + category work together)
   const marketTypeFilteredMarkets = useMemo(() => {
-    // If searching, return search results from all markets (ignore category filter)
-    if (searchQuery.trim()) {
-      return searchedMarkets;
-    }
-
-    // If 'all' selected (no category badge selected), show all markets
     if (marketTypeFilter === 'all') {
       return searchedMarkets;
     }
@@ -216,7 +194,7 @@ export const usePerpsMarketListView = ({
 
     // Fallback: return all markets for unknown filter values
     return searchedMarkets;
-  }, [searchedMarkets, searchQuery, marketTypeFilter]);
+  }, [searchedMarkets, marketTypeFilter]);
 
   // Use sorting hook for sort state and sorting logic
   const sortingHook = usePerpsSorting({
@@ -290,9 +268,6 @@ export const usePerpsMarketListView = ({
     searchState: {
       searchQuery: searchHook.searchQuery,
       setSearchQuery: searchHook.setSearchQuery,
-      isSearchVisible: searchHook.isSearchVisible,
-      setIsSearchVisible: searchHook.setIsSearchVisible,
-      toggleSearchVisibility: searchHook.toggleSearchVisibility,
       clearSearch: searchHook.clearSearch,
     },
     sortState: {
diff --git a/app/components/UI/Perps/hooks/usePerpsMarkets.test.ts b/app/components/UI/Perps/hooks/usePerpsMarkets.test.ts
index c349c8ce14e9..0bf8f922457f 100644
--- a/app/components/UI/Perps/hooks/usePerpsMarkets.test.ts
+++ b/app/components/UI/Perps/hooks/usePerpsMarkets.test.ts
@@ -9,8 +9,7 @@ jest.mock('../../../../core/Engine', () => ({
   context: {
     PerpsController: {
       state: {
-        cachedMarketData: null,
-        cachedMarketDataTimestamp: 0,
+        cachedMarketDataByProvider: {},
       },
     },
   },
diff --git a/app/components/UI/Perps/hooks/usePerpsProvider.test.ts b/app/components/UI/Perps/hooks/usePerpsProvider.test.ts
new file mode 100644
index 000000000000..cdbec4e6724d
--- /dev/null
+++ b/app/components/UI/Perps/hooks/usePerpsProvider.test.ts
@@ -0,0 +1,163 @@
+import { renderHook } from '@testing-library/react-native';
+import { useSelector } from 'react-redux';
+import Engine from '../../../../core/Engine';
+import { usePerpsProvider } from './usePerpsProvider';
+
+jest.mock('react-redux', () => ({
+  useSelector: jest.fn(),
+}));
+
+jest.mock('../../../../core/Engine', () => ({
+  context: {
+    PerpsController: {
+      switchProvider: jest.fn(),
+    },
+  },
+}));
+
+const mockUseSelector = useSelector as jest.Mock;
+
+beforeEach(() => {
+  jest.clearAllMocks();
+  // Default: hyperliquid active, MYX flag off
+  mockUseSelector.mockImplementation((selector: unknown) => {
+    const fn = selector as (s: unknown) => unknown;
+    const fakeState = {};
+    // First call = selectPerpsProvider, second = selectPerpsMYXProviderEnabledFlag
+    const result = fn(fakeState);
+    return result ?? 'hyperliquid';
+  });
+});
+
+describe('usePerpsProvider', () => {
+  describe('availableProviders', () => {
+    it('includes only hyperliquid when MYX flag is disabled', () => {
+      mockUseSelector
+        .mockReturnValueOnce('hyperliquid') // activeProvider
+        .mockReturnValueOnce(false); // isMYXProviderEnabled
+
+      const { result } = renderHook(() => usePerpsProvider());
+
+      expect(result.current.availableProviders).toEqual(['hyperliquid']);
+    });
+
+    it('includes myx and aggregated when MYX flag is enabled', () => {
+      mockUseSelector
+        .mockReturnValueOnce('myx') // activeProvider
+        .mockReturnValueOnce(true); // isMYXProviderEnabled
+
+      const { result } = renderHook(() => usePerpsProvider());
+
+      expect(result.current.availableProviders).toEqual([
+        'hyperliquid',
+        'myx',
+        'aggregated',
+      ]);
+    });
+  });
+
+  describe('activeProvider', () => {
+    it('returns current active provider from selector', () => {
+      mockUseSelector.mockReturnValueOnce('myx').mockReturnValueOnce(true);
+
+      const { result } = renderHook(() => usePerpsProvider());
+
+      expect(result.current.activeProvider).toBe('myx');
+    });
+  });
+
+  describe('switchProvider', () => {
+    it('calls PerpsController.switchProvider with the given providerId', async () => {
+      mockUseSelector
+        .mockReturnValueOnce('hyperliquid')
+        .mockReturnValueOnce(false);
+      (
+        Engine.context.PerpsController.switchProvider as jest.Mock
+      ).mockResolvedValue({ success: true });
+
+      const { result } = renderHook(() => usePerpsProvider());
+      await result.current.switchProvider('myx');
+
+      expect(
+        Engine.context.PerpsController.switchProvider,
+      ).toHaveBeenCalledWith('myx');
+    });
+
+    it('returns the result from PerpsController.switchProvider', async () => {
+      mockUseSelector
+        .mockReturnValueOnce('hyperliquid')
+        .mockReturnValueOnce(false);
+      const mockResult = { success: false, error: 'Not supported' };
+      (
+        Engine.context.PerpsController.switchProvider as jest.Mock
+      ).mockResolvedValue(mockResult);
+
+      const { result } = renderHook(() => usePerpsProvider());
+      const response = await result.current.switchProvider('myx');
+
+      expect(response).toEqual(mockResult);
+    });
+  });
+
+  describe('isProviderAvailable', () => {
+    it('returns true for available provider', () => {
+      mockUseSelector
+        .mockReturnValueOnce('hyperliquid')
+        .mockReturnValueOnce(false);
+
+      const { result } = renderHook(() => usePerpsProvider());
+
+      expect(result.current.isProviderAvailable('hyperliquid')).toBe(true);
+    });
+
+    it('returns false for unavailable provider when flag is off', () => {
+      mockUseSelector
+        .mockReturnValueOnce('hyperliquid')
+        .mockReturnValueOnce(false);
+
+      const { result } = renderHook(() => usePerpsProvider());
+
+      expect(result.current.isProviderAvailable('myx')).toBe(false);
+    });
+  });
+
+  describe('isMYXProvider / isHyperLiquidProvider / isMultiProviderEnabled', () => {
+    it('isMYXProvider is true when activeProvider is myx', () => {
+      mockUseSelector.mockReturnValueOnce('myx').mockReturnValueOnce(true);
+
+      const { result } = renderHook(() => usePerpsProvider());
+
+      expect(result.current.isMYXProvider).toBe(true);
+      expect(result.current.isHyperLiquidProvider).toBe(false);
+    });
+
+    it('isHyperLiquidProvider is true when activeProvider is hyperliquid', () => {
+      mockUseSelector
+        .mockReturnValueOnce('hyperliquid')
+        .mockReturnValueOnce(false);
+
+      const { result } = renderHook(() => usePerpsProvider());
+
+      expect(result.current.isHyperLiquidProvider).toBe(true);
+      expect(result.current.isMYXProvider).toBe(false);
+    });
+
+    it('isMultiProviderEnabled is false when only one provider available', () => {
+      mockUseSelector
+        .mockReturnValueOnce('hyperliquid')
+        .mockReturnValueOnce(false);
+
+      const { result } = renderHook(() => usePerpsProvider());
+
+      expect(result.current.isMultiProviderEnabled).toBe(false);
+    });
+
+    it('isMultiProviderEnabled is true when multiple providers available', () => {
+      mockUseSelector.mockReturnValueOnce('myx').mockReturnValueOnce(true);
+
+      const { result } = renderHook(() => usePerpsProvider());
+
+      expect(result.current.isMultiProviderEnabled).toBe(true);
+    });
+  });
+});
diff --git a/app/components/UI/Perps/hooks/usePerpsProvider.ts b/app/components/UI/Perps/hooks/usePerpsProvider.ts
index fc671d40026c..bec265200e88 100644
--- a/app/components/UI/Perps/hooks/usePerpsProvider.ts
+++ b/app/components/UI/Perps/hooks/usePerpsProvider.ts
@@ -4,7 +4,6 @@ import Engine from '../../../../core/Engine';
 import { selectPerpsProvider } from '../selectors/perpsController';
 import { selectPerpsMYXProviderEnabledFlag } from '../selectors/featureFlags';
 import type {
-  PerpsProviderType,
   PerpsActiveProviderMode,
   SwitchProviderResult,
 } from '@metamask/perps-controller';
@@ -24,11 +23,12 @@ export function usePerpsProvider() {
   /**
    * Get list of available providers based on feature flags
    */
-  const availableProviders = useMemo((): PerpsProviderType[] => {
-    const providers: PerpsProviderType[] = ['hyperliquid'];
+  const availableProviders = useMemo((): PerpsActiveProviderMode[] => {
+    const providers: PerpsActiveProviderMode[] = ['hyperliquid'];
 
     if (isMYXProviderEnabled) {
       providers.push('myx');
+      providers.push('aggregated');
     }
 
     return providers;
@@ -51,7 +51,7 @@ export function usePerpsProvider() {
    * Check if a specific provider is available
    */
   const isProviderAvailable = useCallback(
-    (providerId: PerpsProviderType): boolean =>
+    (providerId: PerpsActiveProviderMode): boolean =>
       availableProviders.includes(providerId),
     [availableProviders],
   );
diff --git a/app/components/UI/Perps/hooks/usePerpsSearch.test.ts b/app/components/UI/Perps/hooks/usePerpsSearch.test.ts
index ec3ff34d013a..e41c30123f33 100644
--- a/app/components/UI/Perps/hooks/usePerpsSearch.test.ts
+++ b/app/components/UI/Perps/hooks/usePerpsSearch.test.ts
@@ -22,22 +22,13 @@ describe('usePerpsSearch', () => {
   ];
 
   describe('initialization', () => {
-    it('returns all markets when search is not visible', () => {
+    it('returns all markets when search query is empty', () => {
       const { result } = renderHook(() =>
         usePerpsSearch({ markets: mockMarkets }),
       );
 
       expect(result.current.filteredMarkets).toEqual(mockMarkets);
       expect(result.current.searchQuery).toBe('');
-      expect(result.current.isSearchVisible).toBe(false);
-    });
-
-    it('initializes with search visible when specified', () => {
-      const { result } = renderHook(() =>
-        usePerpsSearch({ markets: mockMarkets, initialSearchVisible: true }),
-      );
-
-      expect(result.current.isSearchVisible).toBe(true);
     });
 
     it('returns empty array when markets array is empty', () => {
@@ -47,62 +38,6 @@ describe('usePerpsSearch', () => {
     });
   });
 
-  describe('search visibility', () => {
-    it('shows search when setIsSearchVisible is called with true', () => {
-      const { result } = renderHook(() =>
-        usePerpsSearch({ markets: mockMarkets }),
-      );
-
-      act(() => {
-        result.current.setIsSearchVisible(true);
-      });
-
-      expect(result.current.isSearchVisible).toBe(true);
-    });
-
-    it('hides search when setIsSearchVisible is called with false', () => {
-      const { result } = renderHook(() =>
-        usePerpsSearch({
-          markets: mockMarkets,
-          initialSearchVisible: true,
-        }),
-      );
-
-      act(() => {
-        result.current.setIsSearchVisible(false);
-      });
-
-      expect(result.current.isSearchVisible).toBe(false);
-    });
-
-    it('toggles search visibility from hidden to visible', () => {
-      const { result } = renderHook(() =>
-        usePerpsSearch({ markets: mockMarkets }),
-      );
-
-      act(() => {
-        result.current.toggleSearchVisibility();
-      });
-
-      expect(result.current.isSearchVisible).toBe(true);
-    });
-
-    it('toggles search visibility from visible to hidden', () => {
-      const { result } = renderHook(() =>
-        usePerpsSearch({
-          markets: mockMarkets,
-          initialSearchVisible: true,
-        }),
-      );
-
-      act(() => {
-        result.current.toggleSearchVisibility();
-      });
-
-      expect(result.current.isSearchVisible).toBe(false);
-    });
-  });
-
   describe('search query management', () => {
     it('updates search query when setSearchQuery is called', () => {
       const { result } = renderHook(() =>
@@ -116,12 +51,9 @@ describe('usePerpsSearch', () => {
       expect(result.current.searchQuery).toBe('BTC');
     });
 
-    it('clears search query and hides search when clearSearch is called', () => {
+    it('clears search query when clearSearch is called', () => {
       const { result } = renderHook(() =>
-        usePerpsSearch({
-          markets: mockMarkets,
-          initialSearchVisible: true,
-        }),
+        usePerpsSearch({ markets: mockMarkets }),
       );
 
       act(() => {
@@ -133,7 +65,6 @@ describe('usePerpsSearch', () => {
       });
 
       expect(result.current.searchQuery).toBe('');
-      expect(result.current.isSearchVisible).toBe(false);
     });
   });
 
@@ -144,7 +75,6 @@ describe('usePerpsSearch', () => {
       );
 
       act(() => {
-        result.current.setIsSearchVisible(true);
         result.current.setSearchQuery('BTC');
       });
 
@@ -158,7 +88,6 @@ describe('usePerpsSearch', () => {
       );
 
       act(() => {
-        result.current.setIsSearchVisible(true);
         result.current.setSearchQuery('A');
       });
 
@@ -175,7 +104,6 @@ describe('usePerpsSearch', () => {
       );
 
       act(() => {
-        result.current.setIsSearchVisible(true);
         result.current.setSearchQuery('btc');
       });
 
@@ -191,7 +119,6 @@ describe('usePerpsSearch', () => {
       );
 
       act(() => {
-        result.current.setIsSearchVisible(true);
         result.current.setSearchQuery('Bitcoin');
       });
 
@@ -205,7 +132,6 @@ describe('usePerpsSearch', () => {
       );
 
       act(() => {
-        result.current.setIsSearchVisible(true);
         result.current.setSearchQuery('Ava');
       });
 
@@ -219,7 +145,6 @@ describe('usePerpsSearch', () => {
       );
 
       act(() => {
-        result.current.setIsSearchVisible(true);
         result.current.setSearchQuery('ethereum');
       });
 
@@ -231,10 +156,7 @@ describe('usePerpsSearch', () => {
   describe('edge cases', () => {
     it('returns all markets when search query is empty string', () => {
       const { result } = renderHook(() =>
-        usePerpsSearch({
-          markets: mockMarkets,
-          initialSearchVisible: true,
-        }),
+        usePerpsSearch({ markets: mockMarkets }),
       );
 
       act(() => {
@@ -246,10 +168,7 @@ describe('usePerpsSearch', () => {
 
     it('returns all markets when search query is only whitespace', () => {
       const { result } = renderHook(() =>
-        usePerpsSearch({
-          markets: mockMarkets,
-          initialSearchVisible: true,
-        }),
+        usePerpsSearch({ markets: mockMarkets }),
       );
 
       act(() => {
@@ -261,10 +180,7 @@ describe('usePerpsSearch', () => {
 
     it('returns empty array when no markets match search', () => {
       const { result } = renderHook(() =>
-        usePerpsSearch({
-          markets: mockMarkets,
-          initialSearchVisible: true,
-        }),
+        usePerpsSearch({ markets: mockMarkets }),
       );
 
       act(() => {
@@ -274,25 +190,9 @@ describe('usePerpsSearch', () => {
       expect(result.current.filteredMarkets).toEqual([]);
     });
 
-    it('returns all markets when search is hidden regardless of query', () => {
-      const { result } = renderHook(() =>
-        usePerpsSearch({ markets: mockMarkets }),
-      );
-
-      act(() => {
-        result.current.setIsSearchVisible(false);
-        result.current.setSearchQuery('BTC');
-      });
-
-      expect(result.current.filteredMarkets).toEqual(mockMarkets);
-    });
-
     it('trims whitespace from search query', () => {
       const { result } = renderHook(() =>
-        usePerpsSearch({
-          markets: mockMarkets,
-          initialSearchVisible: true,
-        }),
+        usePerpsSearch({ markets: mockMarkets }),
       );
 
       act(() => {
@@ -313,10 +213,7 @@ describe('usePerpsSearch', () => {
       ];
 
       const { result } = renderHook(() =>
-        usePerpsSearch({
-          markets: marketsWithNullSymbol,
-          initialSearchVisible: true,
-        }),
+        usePerpsSearch({ markets: marketsWithNullSymbol }),
       );
 
       act(() => {
@@ -336,10 +233,7 @@ describe('usePerpsSearch', () => {
       ];
 
       const { result } = renderHook(() =>
-        usePerpsSearch({
-          markets: marketsWithNullName,
-          initialSearchVisible: true,
-        }),
+        usePerpsSearch({ markets: marketsWithNullName }),
       );
 
       act(() => {
@@ -353,10 +247,7 @@ describe('usePerpsSearch', () => {
   describe('filtering behavior updates', () => {
     it('updates filtered markets when query changes', () => {
       const { result } = renderHook(() =>
-        usePerpsSearch({
-          markets: mockMarkets,
-          initialSearchVisible: true,
-        }),
+        usePerpsSearch({ markets: mockMarkets }),
       );
 
       act(() => {
@@ -375,8 +266,7 @@ describe('usePerpsSearch', () => {
 
     it('updates filtered markets when markets array changes', () => {
       const { result, rerender } = renderHook(
-        ({ markets }) =>
-          usePerpsSearch({ markets, initialSearchVisible: true }),
+        ({ markets }) => usePerpsSearch({ markets }),
         { initialProps: { markets: mockMarkets } },
       );
 
@@ -395,25 +285,5 @@ describe('usePerpsSearch', () => {
 
       expect(result.current.filteredMarkets).toHaveLength(2);
     });
-
-    it('updates filtered markets when search visibility changes', () => {
-      const { result } = renderHook(() =>
-        usePerpsSearch({ markets: mockMarkets }),
-      );
-
-      act(() => {
-        result.current.setSearchQuery('BTC');
-        result.current.setIsSearchVisible(false);
-      });
-
-      expect(result.current.filteredMarkets).toEqual(mockMarkets);
-
-      act(() => {
-        result.current.setIsSearchVisible(true);
-      });
-
-      expect(result.current.filteredMarkets).toHaveLength(1);
-      expect(result.current.filteredMarkets[0].symbol).toBe('BTC');
-    });
   });
 });
diff --git a/app/components/UI/Perps/hooks/usePerpsSearch.ts b/app/components/UI/Perps/hooks/usePerpsSearch.ts
index 08a52007067e..72f4010e0265 100644
--- a/app/components/UI/Perps/hooks/usePerpsSearch.ts
+++ b/app/components/UI/Perps/hooks/usePerpsSearch.ts
@@ -9,11 +9,6 @@ interface UsePerpsSearchParams {
    * Markets to filter
    */
   markets: PerpsMarketData[];
-  /**
-   * Initial search visibility
-   * @default false
-   */
-  initialSearchVisible?: boolean;
 }
 
 interface UsePerpsSearchReturn {
@@ -25,24 +20,12 @@ interface UsePerpsSearchReturn {
    * Update search query
    */
   setSearchQuery: (query: string) => void;
-  /**
-   * Whether search bar is visible
-   */
-  isSearchVisible: boolean;
-  /**
-   * Show/hide search bar
-   */
-  setIsSearchVisible: (visible: boolean) => void;
-  /**
-   * Toggle search visibility
-   */
-  toggleSearchVisibility: () => void;
   /**
    * Markets filtered by search query
    */
   filteredMarkets: PerpsMarketData[];
   /**
-   * Clear search and hide search bar
+   * Clear search query
    */
   clearSearch: () => void;
 }
@@ -52,7 +35,6 @@ interface UsePerpsSearchReturn {
  *
  * Responsibilities:
  * - Manages search query state
- * - Manages search visibility state
  * - Filters markets by symbol/name
  * - Type-safe field access
  *
@@ -62,43 +44,30 @@ interface UsePerpsSearchReturn {
  * const {
  *   searchQuery,
  *   setSearchQuery,
- *   isSearchVisible,
- *   toggleSearchVisibility,
  *   filteredMarkets,
+ *   clearSearch,
  * } = usePerpsSearch({ markets });
  * ```
  */
 export const usePerpsSearch = ({
   markets,
-  initialSearchVisible = false,
 }: UsePerpsSearchParams): UsePerpsSearchReturn => {
   const [searchQuery, setSearchQuery] = useState('');
-  const [isSearchVisible, setIsSearchVisible] = useState(initialSearchVisible);
-
-  const toggleSearchVisibility = useCallback(() => {
-    setIsSearchVisible((prev) => !prev);
-  }, []);
 
   const clearSearch = useCallback(() => {
     setSearchQuery('');
-    setIsSearchVisible(false);
   }, []);
 
-  // Filter markets based on search query
   const filteredMarkets = useMemo(() => {
-    if (!isSearchVisible || !searchQuery.trim()) {
+    if (!searchQuery.trim()) {
       return markets;
     }
-
     return filterMarketsByQuery(markets, searchQuery);
-  }, [markets, searchQuery, isSearchVisible]);
+  }, [markets, searchQuery]);
 
   return {
     searchQuery,
     setSearchQuery,
-    isSearchVisible,
-    setIsSearchVisible,
-    toggleSearchVisibility,
     filteredMarkets,
     clearSearch,
   };
diff --git a/app/components/UI/Perps/hooks/usePerpsToasts.tsx b/app/components/UI/Perps/hooks/usePerpsToasts.tsx
index ec7e5145f69b..f93b5128e89f 100644
--- a/app/components/UI/Perps/hooks/usePerpsToasts.tsx
+++ b/app/components/UI/Perps/hooks/usePerpsToasts.tsx
@@ -747,7 +747,7 @@ const usePerpsToasts = (): {
                         }}
                       >
                         {' '}
-                        {`${roeValue.toFixed(1)}%`}
+                        {`${roeValue.toFixed(2)}%`}
                       </Text>
                     </Text>,
                   ),
@@ -818,7 +818,7 @@ const usePerpsToasts = (): {
                         }}
                       >
                         {' '}
-                        {`${roeValue.toFixed(1)}%`}
+                        {`${roeValue.toFixed(2)}%`}
                       </Text>
                     </Text>,
                   ),
diff --git a/app/components/UI/Perps/hooks/useWebSocketHealthToast.test.ts b/app/components/UI/Perps/hooks/useWebSocketHealthToast.test.ts
index feff6928c230..5c73b38afcd3 100644
--- a/app/components/UI/Perps/hooks/useWebSocketHealthToast.test.ts
+++ b/app/components/UI/Perps/hooks/useWebSocketHealthToast.test.ts
@@ -40,6 +40,16 @@ jest.mock('../../../../core/Engine', () => ({
   },
 }));
 
+// Mock PerpsConnectionManager
+const mockGetConnectionState = jest
+  .fn()
+  .mockReturnValue({ isDisconnecting: false });
+jest.mock('../services/PerpsConnectionManager', () => ({
+  PerpsConnectionManager: {
+    getConnectionState: () => mockGetConnectionState(),
+  },
+}));
+
 // Auto-retry delay constant (must match the one in the hook)
 const AUTO_RETRY_DELAY_MS = 10000;
 // Offline banner delay (must match the one in the hook)
@@ -57,6 +67,9 @@ describe('useWebSocketHealthToast', () => {
     jest.useFakeTimers();
     mockUnsubscribe = jest.fn();
 
+    // Default: not an intentional reconnect
+    mockGetConnectionState.mockReturnValue({ isDisconnecting: false });
+
     // Default mock implementation
     mockUsePerpsConnection.mockReturnValue({
       isConnected: true,
@@ -75,44 +88,55 @@ describe('useWebSocketHealthToast', () => {
   });
 
   describe('Initial mount behavior', () => {
-    it('should not show toast when initial state is CONNECTED', () => {
+    it('skips toast when first callback is CONNECTED (happy path)', () => {
       renderHook(() => useWebSocketHealthToast());
 
-      // Simulate initial callback with CONNECTED state
       act(() => {
         connectionStateCallback(WebSocketConnectionState.Connected, 0);
       });
 
-      // Should not show toast for initial CONNECTED state
       expect(mockShow).not.toHaveBeenCalled();
     });
 
-    it('should show toast when initial state is DISCONNECTED (after delay)', () => {
+    it('skips toast when first callback is DISCONNECTED (snapshot only, not a real event)', () => {
       renderHook(() => useWebSocketHealthToast());
 
-      // Simulate initial callback with DISCONNECTED state
       act(() => {
         connectionStateCallback(WebSocketConnectionState.Disconnected, 1);
       });
 
+      act(() => {
+        jest.advanceTimersByTime(OFFLINE_BANNER_DELAY_MS);
+      });
+
       expect(mockShow).not.toHaveBeenCalled();
+    });
+
+    it('skips toast when first callback is CONNECTING (snapshot only, not a real event)', () => {
+      renderHook(() => useWebSocketHealthToast());
+
+      act(() => {
+        connectionStateCallback(WebSocketConnectionState.Connecting, 2);
+      });
 
       act(() => {
         jest.advanceTimersByTime(OFFLINE_BANNER_DELAY_MS);
       });
 
-      expect(mockShow).toHaveBeenCalledWith(
-        WebSocketConnectionState.Disconnected,
-        1,
-      );
+      expect(mockShow).not.toHaveBeenCalled();
     });
 
-    it('should show toast when initial state is CONNECTING (after delay)', () => {
+    it('schedules Connecting banner after Disconnected snapshot when WS starts reconnecting', () => {
       renderHook(() => useWebSocketHealthToast());
 
-      // Simulate initial callback with CONNECTING state
+      // First callback: snapshot
       act(() => {
-        connectionStateCallback(WebSocketConnectionState.Connecting, 2);
+        connectionStateCallback(WebSocketConnectionState.Disconnected, 0);
+      });
+
+      // Second callback: real transition
+      act(() => {
+        connectionStateCallback(WebSocketConnectionState.Connecting, 1);
       });
 
       expect(mockShow).not.toHaveBeenCalled();
@@ -123,22 +147,20 @@ describe('useWebSocketHealthToast', () => {
 
       expect(mockShow).toHaveBeenCalledWith(
         WebSocketConnectionState.Connecting,
-        2,
+        1,
       );
     });
   });
 
   describe('State transitions', () => {
-    it('should show disconnected toast on CONNECTED → DISCONNECTED transition (after delay)', () => {
+    it('shows Disconnected toast after CONNECTED → DISCONNECTED transition', () => {
       renderHook(() => useWebSocketHealthToast());
 
-      // First callback: CONNECTED (initial state)
       act(() => {
         connectionStateCallback(WebSocketConnectionState.Connected, 0);
       });
       mockShow.mockClear();
 
-      // Second callback: DISCONNECTED (transition - schedules show after delay)
       act(() => {
         connectionStateCallback(WebSocketConnectionState.Disconnected, 1);
       });
@@ -155,10 +177,10 @@ describe('useWebSocketHealthToast', () => {
       );
     });
 
-    it('should show connecting toast on DISCONNECTED → CONNECTING transition (after delay)', () => {
+    it('shows Connecting toast after DISCONNECTED → CONNECTING transition', () => {
       renderHook(() => useWebSocketHealthToast());
 
-      // First callback: DISCONNECTED (initial - marks as experienced disconnection)
+      // First callback: snapshot
       act(() => {
         connectionStateCallback(WebSocketConnectionState.Disconnected, 1);
       });
@@ -167,7 +189,6 @@ describe('useWebSocketHealthToast', () => {
       });
       mockShow.mockClear();
 
-      // Second callback: CONNECTING (transition - schedules show after delay)
       act(() => {
         connectionStateCallback(WebSocketConnectionState.Connecting, 2);
       });
@@ -184,27 +205,24 @@ describe('useWebSocketHealthToast', () => {
       );
     });
 
-    it('should show success toast on reconnection (DISCONNECTED → CONNECTING → CONNECTED)', () => {
+    it('shows Connected toast on reconnection after DISCONNECTED → CONNECTING → CONNECTED', () => {
       renderHook(() => useWebSocketHealthToast());
 
-      // Initial: CONNECTED
+      // Snapshot
       act(() => {
         connectionStateCallback(WebSocketConnectionState.Connected, 0);
       });
 
-      // Disconnected (schedules show after delay; we reconnect before delay)
       act(() => {
         connectionStateCallback(WebSocketConnectionState.Disconnected, 1);
       });
       mockShow.mockClear();
 
-      // Reconnecting (schedules show after delay; we reconnect before delay)
       act(() => {
         connectionStateCallback(WebSocketConnectionState.Connecting, 2);
       });
       mockShow.mockClear();
 
-      // Reconnected successfully (clears delay, shows Connected immediately)
       act(() => {
         connectionStateCallback(WebSocketConnectionState.Connected, 0);
       });
@@ -215,10 +233,9 @@ describe('useWebSocketHealthToast', () => {
       );
     });
 
-    it('should NOT show success toast on initial connection (no prior disconnection)', () => {
+    it('omits Connected toast on initial connection with no prior disconnection', () => {
       renderHook(() => useWebSocketHealthToast());
 
-      // Initial: CONNECTED - should NOT show toast
       act(() => {
         connectionStateCallback(WebSocketConnectionState.Connected, 0);
       });
@@ -228,19 +245,17 @@ describe('useWebSocketHealthToast', () => {
   });
 
   describe('Retry callback', () => {
-    it('should register retry callback on mount', () => {
+    it('registers retry callback on mount', () => {
       renderHook(() => useWebSocketHealthToast());
 
       expect(mockSetOnRetry).toHaveBeenCalledWith(expect.any(Function));
     });
 
-    it('should call PerpsController.reconnect when retry is invoked', () => {
+    it('calls PerpsController.reconnect when retry callback is invoked', () => {
       renderHook(() => useWebSocketHealthToast());
 
-      // Get the retry callback that was registered
       const retryCallback = mockSetOnRetry.mock.calls[0][0];
 
-      // Invoke the retry callback
       act(() => {
         retryCallback();
       });
@@ -250,7 +265,7 @@ describe('useWebSocketHealthToast', () => {
   });
 
   describe('Cleanup on unmount', () => {
-    it('should unsubscribe and hide toast on unmount', () => {
+    it('calls unsubscribe and hide on unmount', () => {
       const { unmount } = renderHook(() => useWebSocketHealthToast());
 
       unmount();
@@ -261,15 +276,13 @@ describe('useWebSocketHealthToast', () => {
   });
 
   describe('Reconnection attempt tracking', () => {
-    it('should pass reconnection attempt number to show()', () => {
+    it('passes reconnection attempt number to show()', () => {
       renderHook(() => useWebSocketHealthToast());
 
-      // Initial: CONNECTED
       act(() => {
         connectionStateCallback(WebSocketConnectionState.Connected, 0);
       });
 
-      // Disconnected
       act(() => {
         connectionStateCallback(WebSocketConnectionState.Disconnected, 1);
       });
@@ -278,7 +291,6 @@ describe('useWebSocketHealthToast', () => {
       });
       mockShow.mockClear();
 
-      // Reconnecting with attempt 3 (schedules show after delay)
       act(() => {
         connectionStateCallback(WebSocketConnectionState.Connecting, 3);
       });
@@ -297,7 +309,7 @@ describe('useWebSocketHealthToast', () => {
   });
 
   describe('Subscription behavior', () => {
-    it('should not subscribe when isConnected is false', () => {
+    it('skips subscription when isConnected is false', () => {
       mockUsePerpsConnection.mockReturnValue({
         isConnected: false,
         isInitialized: true,
@@ -310,7 +322,7 @@ describe('useWebSocketHealthToast', () => {
       expect(mockSubscribeToConnectionState).not.toHaveBeenCalled();
     });
 
-    it('should not subscribe when isInitialized is false', () => {
+    it('skips subscription when isInitialized is false', () => {
       mockUsePerpsConnection.mockReturnValue({
         isConnected: true,
         isInitialized: false,
@@ -323,7 +335,7 @@ describe('useWebSocketHealthToast', () => {
       expect(mockSubscribeToConnectionState).not.toHaveBeenCalled();
     });
 
-    it('should subscribe when both isConnected and isInitialized are true', () => {
+    it('subscribes when both isConnected and isInitialized are true', () => {
       mockUsePerpsConnection.mockReturnValue({
         isConnected: true,
         isInitialized: true,
@@ -338,23 +350,21 @@ describe('useWebSocketHealthToast', () => {
   });
 
   describe('Offline banner delay (flicker prevention)', () => {
-    it('should NOT show offline banner if reconnected within delay', () => {
+    it('omits offline banner when connection restores within the delay window', () => {
       renderHook(() => useWebSocketHealthToast());
 
-      // Initial: CONNECTED
       act(() => {
         connectionStateCallback(WebSocketConnectionState.Connected, 0);
       });
       mockShow.mockClear();
 
-      // Disconnected (schedules show after 1s)
       act(() => {
         connectionStateCallback(WebSocketConnectionState.Disconnected, 1);
       });
 
       expect(mockShow).not.toHaveBeenCalled();
 
-      // Reconnect before delay expires
+      // Restore before delay expires
       act(() => {
         connectionStateCallback(WebSocketConnectionState.Connecting, 1);
       });
@@ -362,13 +372,11 @@ describe('useWebSocketHealthToast', () => {
         connectionStateCallback(WebSocketConnectionState.Connected, 0);
       });
 
-      // Advance past the banner delay - show was never scheduled for Disconnected/Connecting
-      // because we cleared the timer when we got Connected
       act(() => {
         jest.advanceTimersByTime(OFFLINE_BANNER_DELAY_MS);
       });
 
-      // Should only have shown Connected (reconnection success), not Disconnected
+      // Only the Connected (back-online) toast, not Disconnected
       expect(mockShow).toHaveBeenCalledTimes(1);
       expect(mockShow).toHaveBeenCalledWith(
         WebSocketConnectionState.Connected,
@@ -378,16 +386,14 @@ describe('useWebSocketHealthToast', () => {
   });
 
   describe('DISCONNECTING state', () => {
-    it('should not show toast for DISCONNECTING state', () => {
+    it('omits toast for DISCONNECTING state', () => {
       renderHook(() => useWebSocketHealthToast());
 
-      // Initial: CONNECTED
       act(() => {
         connectionStateCallback(WebSocketConnectionState.Connected, 0);
       });
       mockShow.mockClear();
 
-      // DISCONNECTING - no toast
       act(() => {
         connectionStateCallback(WebSocketConnectionState.Disconnecting, 0);
       });
@@ -397,42 +403,40 @@ describe('useWebSocketHealthToast', () => {
   });
 
   describe('Auto-retry behavior', () => {
-    it('should schedule auto-retry when entering DISCONNECTED state', () => {
+    it('fires reconnect after auto-retry delay on CONNECTED → DISCONNECTED transition', () => {
       renderHook(() => useWebSocketHealthToast());
 
-      // Initial: CONNECTED
       act(() => {
         connectionStateCallback(WebSocketConnectionState.Connected, 0);
       });
 
-      // Transition to DISCONNECTED
       act(() => {
         connectionStateCallback(WebSocketConnectionState.Disconnected, 1);
       });
 
-      // reconnect should not be called yet
       expect(mockReconnect).not.toHaveBeenCalled();
 
-      // Advance timers by auto-retry delay
       act(() => {
         jest.advanceTimersByTime(AUTO_RETRY_DELAY_MS);
       });
 
-      // reconnect should now be called
       expect(mockReconnect).toHaveBeenCalledTimes(1);
     });
 
-    it('should schedule auto-retry when initial state is DISCONNECTED', () => {
+    it('fires reconnect after auto-retry delay when WS transitions to DISCONNECTED after snapshot', () => {
       renderHook(() => useWebSocketHealthToast());
 
-      // Initial callback with DISCONNECTED state
+      // First callback: snapshot (no auto-retry)
+      act(() => {
+        connectionStateCallback(WebSocketConnectionState.Connected, 0);
+      });
+
       act(() => {
         connectionStateCallback(WebSocketConnectionState.Disconnected, 1);
       });
 
       expect(mockReconnect).not.toHaveBeenCalled();
 
-      // Advance timers by auto-retry delay
       act(() => {
         jest.advanceTimersByTime(AUTO_RETRY_DELAY_MS);
       });
@@ -440,100 +444,202 @@ describe('useWebSocketHealthToast', () => {
       expect(mockReconnect).toHaveBeenCalledTimes(1);
     });
 
-    it('should cancel auto-retry when entering CONNECTING state', () => {
+    it('cancels pending auto-retry on DISCONNECTED → CONNECTING transition', () => {
       renderHook(() => useWebSocketHealthToast());
 
-      // Initial: CONNECTED
       act(() => {
         connectionStateCallback(WebSocketConnectionState.Connected, 0);
       });
 
-      // Transition to DISCONNECTED (schedules auto-retry)
       act(() => {
         connectionStateCallback(WebSocketConnectionState.Disconnected, 1);
       });
 
-      // Transition to CONNECTING (should cancel auto-retry)
       act(() => {
         connectionStateCallback(WebSocketConnectionState.Connecting, 2);
       });
 
-      // Advance timers past auto-retry delay
       act(() => {
         jest.advanceTimersByTime(AUTO_RETRY_DELAY_MS + 1000);
       });
 
-      // reconnect should NOT have been called (auto-retry was cancelled)
       expect(mockReconnect).not.toHaveBeenCalled();
     });
 
-    it('should cancel auto-retry when entering CONNECTED state', () => {
+    it('cancels pending auto-retry on DISCONNECTED → CONNECTED transition', () => {
       renderHook(() => useWebSocketHealthToast());
 
-      // Initial: DISCONNECTED (schedules auto-retry)
+      // Snapshot
+      act(() => {
+        connectionStateCallback(WebSocketConnectionState.Connected, 0);
+      });
+
       act(() => {
         connectionStateCallback(WebSocketConnectionState.Disconnected, 1);
       });
 
-      // Transition to CONNECTED (should cancel auto-retry)
       act(() => {
         connectionStateCallback(WebSocketConnectionState.Connected, 0);
       });
 
-      // Advance timers past auto-retry delay
       act(() => {
         jest.advanceTimersByTime(AUTO_RETRY_DELAY_MS + 1000);
       });
 
-      // reconnect should NOT have been called (auto-retry was cancelled)
       expect(mockReconnect).not.toHaveBeenCalled();
     });
 
-    it('should cancel auto-retry when manual retry is triggered', () => {
+    it('cancels pending auto-retry when manual retry is triggered', () => {
       renderHook(() => useWebSocketHealthToast());
 
-      // Initial: DISCONNECTED (schedules auto-retry)
+      // Snapshot
+      act(() => {
+        connectionStateCallback(WebSocketConnectionState.Connected, 0);
+      });
+
       act(() => {
         connectionStateCallback(WebSocketConnectionState.Disconnected, 1);
       });
 
-      // Get the retry callback and invoke it (manual retry)
       const retryCallback = mockSetOnRetry.mock.calls[0][0];
       act(() => {
         retryCallback();
       });
 
-      // Manual retry should have called reconnect
       expect(mockReconnect).toHaveBeenCalledTimes(1);
       mockReconnect.mockClear();
 
-      // Advance timers past auto-retry delay
       act(() => {
         jest.advanceTimersByTime(AUTO_RETRY_DELAY_MS + 1000);
       });
 
-      // reconnect should NOT have been called again (auto-retry was cancelled by manual retry)
       expect(mockReconnect).not.toHaveBeenCalled();
     });
 
-    it('should cancel auto-retry on unmount', () => {
+    it('cancels pending auto-retry on unmount', () => {
       const { unmount } = renderHook(() => useWebSocketHealthToast());
 
-      // Initial: DISCONNECTED (schedules auto-retry)
+      // Snapshot
+      act(() => {
+        connectionStateCallback(WebSocketConnectionState.Connected, 0);
+      });
+
       act(() => {
         connectionStateCallback(WebSocketConnectionState.Disconnected, 1);
       });
 
-      // Unmount
       unmount();
 
-      // Advance timers past auto-retry delay
       act(() => {
         jest.advanceTimersByTime(AUTO_RETRY_DELAY_MS + 1000);
       });
 
-      // reconnect should NOT have been called (auto-retry was cancelled on unmount)
       expect(mockReconnect).not.toHaveBeenCalled();
     });
   });
+
+  describe('Intentional reconnect suppression (account/network/provider switch)', () => {
+    const setupIntentionalReconnect = () => {
+      renderHook(() => useWebSocketHealthToast());
+      // Snapshot
+      act(() => {
+        connectionStateCallback(WebSocketConnectionState.Connected, 0);
+      });
+      mockShow.mockClear();
+      mockHide.mockClear();
+      // Mark as intentional from this point on
+      mockGetConnectionState.mockReturnValue({ isDisconnecting: true });
+    };
+
+    it('suppresses offline toast on Disconnected during intentional reconnect', () => {
+      setupIntentionalReconnect();
+
+      act(() => {
+        connectionStateCallback(WebSocketConnectionState.Disconnected, 0);
+      });
+      act(() => {
+        jest.advanceTimersByTime(OFFLINE_BANNER_DELAY_MS);
+      });
+
+      expect(mockShow).not.toHaveBeenCalled();
+    });
+
+    it('suppresses reconnecting banner on Connecting during intentional reconnect', () => {
+      setupIntentionalReconnect();
+
+      act(() => {
+        connectionStateCallback(WebSocketConnectionState.Disconnected, 0);
+      });
+      act(() => {
+        connectionStateCallback(WebSocketConnectionState.Connecting, 0);
+      });
+      act(() => {
+        jest.advanceTimersByTime(OFFLINE_BANNER_DELAY_MS);
+      });
+
+      expect(mockShow).not.toHaveBeenCalled();
+      expect(mockHide).not.toHaveBeenCalled();
+    });
+
+    it('suppresses back-online toast on Connected after intentional reconnect', () => {
+      setupIntentionalReconnect();
+
+      act(() => {
+        connectionStateCallback(WebSocketConnectionState.Disconnected, 0);
+      });
+      act(() => {
+        connectionStateCallback(WebSocketConnectionState.Connecting, 0);
+      });
+      // Connection succeeds — isDisconnecting is cleared on the singleton by now
+      mockGetConnectionState.mockReturnValue({ isDisconnecting: false });
+      act(() => {
+        connectionStateCallback(WebSocketConnectionState.Connected, 0);
+      });
+
+      expect(mockShow).not.toHaveBeenCalled();
+    });
+
+    it('does not schedule auto-retry during intentional reconnect', () => {
+      setupIntentionalReconnect();
+
+      act(() => {
+        connectionStateCallback(WebSocketConnectionState.Disconnected, 0);
+      });
+      act(() => {
+        jest.advanceTimersByTime(AUTO_RETRY_DELAY_MS + 1000);
+      });
+
+      expect(mockReconnect).not.toHaveBeenCalled();
+    });
+
+    it('still shows toasts for a real disconnect after a completed intentional reconnect', () => {
+      setupIntentionalReconnect();
+
+      // Intentional cycle
+      act(() => {
+        connectionStateCallback(WebSocketConnectionState.Disconnected, 0);
+      });
+      act(() => {
+        connectionStateCallback(WebSocketConnectionState.Connecting, 0);
+      });
+      mockGetConnectionState.mockReturnValue({ isDisconnecting: false });
+      act(() => {
+        connectionStateCallback(WebSocketConnectionState.Connected, 0);
+      });
+      mockShow.mockClear();
+
+      // Now a real disconnect
+      act(() => {
+        connectionStateCallback(WebSocketConnectionState.Disconnected, 1);
+      });
+      act(() => {
+        jest.advanceTimersByTime(OFFLINE_BANNER_DELAY_MS);
+      });
+
+      expect(mockShow).toHaveBeenCalledWith(
+        WebSocketConnectionState.Disconnected,
+        1,
+      );
+    });
+  });
 });
diff --git a/app/components/UI/Perps/hooks/useWebSocketHealthToast.ts b/app/components/UI/Perps/hooks/useWebSocketHealthToast.ts
index ac7389b95494..d3608993f5ce 100644
--- a/app/components/UI/Perps/hooks/useWebSocketHealthToast.ts
+++ b/app/components/UI/Perps/hooks/useWebSocketHealthToast.ts
@@ -3,6 +3,7 @@ import { usePerpsConnection } from './usePerpsConnection';
 import Engine from '../../../../core/Engine';
 import { WebSocketConnectionState } from '@metamask/perps-controller';
 import { useWebSocketHealthToastContext } from '../components/PerpsWebSocketHealthToast';
+import { PerpsConnectionManager } from '../services/PerpsConnectionManager';
 
 /** Delay before automatically attempting to reconnect after disconnection */
 const AUTO_RETRY_DELAY_MS = 10000;
@@ -34,9 +35,13 @@ export function useWebSocketHealthToast(): void {
 
   // Track the previous WebSocket state for transition detection
   const previousWsStateRef = useRef<WebSocketConnectionState | null>(null);
-  // Track if we've experienced a disconnection after being connected
-  // This is used to distinguish initial connection from reconnection
+  // Track if we've experienced a disconnection — used to gate the "back online" toast
+  // so we only show it after a real outage, not on initial connection.
   const hasExperiencedDisconnectionRef = useRef(false);
+  // Track if the current disconnect/reconnect cycle was intentional (account/network switch).
+  // isDisconnecting is cleared on the singleton before the Connected event fires, so we
+  // latch the value here when the cycle starts and clear it on Connected.
+  const isIntentionalReconnectRef = useRef(false);
   // Timer for auto-retry
   const autoRetryTimeoutRef = useRef<ReturnType<typeof setTimeout> | null>(
     null,
@@ -111,56 +116,63 @@ export function useWebSocketHealthToast(): void {
           const isNowConnected =
             newState === WebSocketConnectionState.Connected;
 
-          // Handle first callback after mount/remount
+          // Handle first callback after mount/remount.
+          // The subscription (BehaviorSubject-style) fires immediately with the current
+          // internal state, which begins as Disconnected and only becomes Connected once
+          // the WS handshake completes. We must not show a toast on this initial snapshot
+          // because we have no prior context — we don't know if this is a genuine offline
+          // state or just a stale initial value. Wait for a real state transition instead.
           if (previousWsState === null) {
             previousWsStateRef.current = newState;
-
-            // If we mount/remount and the connection is already in a problematic state,
-            // show the toast after a delay to avoid flicker on quick reconnects.
-            if (newState === WebSocketConnectionState.Disconnected) {
-              hasExperiencedDisconnectionRef.current = true;
-              scheduleShowBanner(
-                WebSocketConnectionState.Disconnected,
-                attempt,
-              );
-              // Schedule auto-retry for disconnected state
-              scheduleAutoRetry();
-            } else if (newState === WebSocketConnectionState.Connecting) {
-              hasExperiencedDisconnectionRef.current = true;
-              scheduleShowBanner(WebSocketConnectionState.Connecting, attempt);
-              // Clear auto-retry when reconnecting (connection attempt in progress)
-              clearAutoRetryTimer();
-            }
-            // If CONNECTED on mount, this is normal initial state - no toast needed
+            // If already Connected on mount, that's the happy path — no toast needed.
+            // If Disconnected/Connecting on mount, we also skip the banner here; a real
+            // state change will trigger the switch-case below once the WS settles.
             return;
           }
 
-          // Detect any transition away from CONNECTED as a disconnection event
-          if (wasWsConnected && !isNowConnected) {
+          // Read isDisconnecting directly from the singleton — always live,
+          // no React render cycle delay.
+          const isIntentionalReconnect =
+            PerpsConnectionManager.getConnectionState().isDisconnecting;
+
+          // Latch intentional reconnect flag when the cycle starts (Disconnected/Connecting).
+          // isDisconnecting is cleared on the singleton before Connected fires, so we
+          // preserve the value in a ref for the Connected handler.
+          if (isIntentionalReconnect) {
+            isIntentionalReconnectRef.current = true;
+          }
+
+          // Track any transition away from Connected so we can show "back online" later,
+          // but only for unintentional disconnects.
+          if (wasWsConnected && !isNowConnected && !isIntentionalReconnect) {
             hasExperiencedDisconnectionRef.current = true;
           }
 
           // Handle state transitions
           switch (newState) {
             case WebSocketConnectionState.Disconnected:
-              // Show disconnected toast after delay if:
-              // 1. We were previously connected (direct disconnect), OR
-              // 2. We've been trying to reconnect and gave up (max attempts reached)
-              if (wasWsConnected || hasExperiencedDisconnectionRef.current) {
-                scheduleShowBanner(
-                  WebSocketConnectionState.Disconnected,
-                  attempt,
-                );
-                // Schedule auto-retry for disconnected state
-                scheduleAutoRetry();
+              if (isIntentionalReconnect) {
+                // Intentional reconnect (account/network/provider switch) — skip offline toast.
+                // performReconnection() manages its own timeout; no auto-retry needed here.
+                clearShowBannerDelayTimer();
+                break;
               }
+              // Any post-snapshot Disconnected state is worth showing — whether it's a
+              // direct drop from Connected or a failed reconnection attempt.
+              hasExperiencedDisconnectionRef.current = true;
+              scheduleShowBanner(
+                WebSocketConnectionState.Disconnected,
+                attempt,
+              );
+              scheduleAutoRetry();
               break;
 
             case WebSocketConnectionState.Connecting:
-              // Clear auto-retry when reconnecting (connection attempt in progress)
               clearAutoRetryTimer();
-              // Show connecting toast after delay when reconnecting (after a disconnection)
-              if (hasExperiencedDisconnectionRef.current) {
+              if (!isIntentionalReconnect) {
+                // Only arm "back online", hide any existing toast, and show banner for unintentional reconnects
+                hide();
+                hasExperiencedDisconnectionRef.current = true;
                 scheduleShowBanner(
                   WebSocketConnectionState.Connecting,
                   attempt,
@@ -173,12 +185,16 @@ export function useWebSocketHealthToast(): void {
               clearShowBannerDelayTimer();
               // Clear auto-retry when connected
               clearAutoRetryTimer();
-              // Show connected toast only if we've experienced a disconnection before
-              if (hasExperiencedDisconnectionRef.current) {
+              // Show connected toast only after a real (unintentional) outage
+              if (
+                hasExperiencedDisconnectionRef.current &&
+                !isIntentionalReconnectRef.current
+              ) {
                 show(WebSocketConnectionState.Connected, attempt);
-                // Reset the flag after successful reconnection
-                hasExperiencedDisconnectionRef.current = false;
               }
+              // Reset flags after connection restored
+              hasExperiencedDisconnectionRef.current = false;
+              isIntentionalReconnectRef.current = false;
               break;
 
             default:
diff --git a/app/components/UI/Perps/providers/PerpsConnectionProvider.test.tsx b/app/components/UI/Perps/providers/PerpsConnectionProvider.test.tsx
index c6d52c51d44d..0177c030c3bc 100644
--- a/app/components/UI/Perps/providers/PerpsConnectionProvider.test.tsx
+++ b/app/components/UI/Perps/providers/PerpsConnectionProvider.test.tsx
@@ -123,6 +123,9 @@ describe('PerpsConnectionProvider', () => {
     (PerpsConnectionManager.disconnect as jest.Mock) = mockDisconnect;
     (PerpsConnectionManager.reconnectWithNewContext as jest.Mock) =
       mockReconnectWithNewContext;
+    (PerpsConnectionManager.getActiveProviderName as jest.Mock) = jest
+      .fn()
+      .mockReturnValue('hyperliquid');
   });
 
   afterEach(() => {
diff --git a/app/components/UI/Perps/providers/PerpsConnectionProvider.tsx b/app/components/UI/Perps/providers/PerpsConnectionProvider.tsx
index e08abed6b59f..19795571ec65 100644
--- a/app/components/UI/Perps/providers/PerpsConnectionProvider.tsx
+++ b/app/components/UI/Perps/providers/PerpsConnectionProvider.tsx
@@ -6,6 +6,7 @@ import React, {
   useState,
   useRef,
 } from 'react';
+import { addBreadcrumb } from '@sentry/react-native';
 import { PerpsConnectionManager } from '../services/PerpsConnectionManager';
 import { usePerpsConnectionLifecycle } from '../hooks/usePerpsConnectionLifecycle';
 import { isE2E } from '../../../../util/test/utils';
@@ -109,9 +110,15 @@ export const PerpsConnectionProvider: React.FC<
     try {
       await PerpsConnectionManager.connect();
     } catch (err) {
+      const providerName = PerpsConnectionManager.getActiveProviderName();
       Logger.error(ensureError(err, 'PerpsConnectionProvider.connect'), {
-        message: 'PerpsConnectionProvider: Error during connect',
-        context: 'PerpsConnectionProvider.connect',
+        tags: {
+          feature: PERPS_CONSTANTS.FeatureName,
+          component: 'PerpsConnectionManager',
+          action: 'connection_connection',
+          ...(providerName && { provider: providerName }),
+        },
+        context: { name: 'PerpsConnectionProvider.connect', data: {} },
       });
     }
     // Always update state after connect attempt
@@ -137,9 +144,15 @@ export const PerpsConnectionProvider: React.FC<
     try {
       await PerpsConnectionManager.disconnect();
     } catch (err) {
+      const providerName = PerpsConnectionManager.getActiveProviderName();
       Logger.error(ensureError(err, 'PerpsConnectionProvider.disconnect'), {
-        message: 'PerpsConnectionProvider: Error during disconnect',
-        context: 'PerpsConnectionProvider.disconnect',
+        tags: {
+          feature: PERPS_CONSTANTS.FeatureName,
+          component: 'PerpsConnectionManager',
+          action: 'connection_disconnection',
+          ...(providerName && { provider: providerName }),
+        },
+        context: { name: 'PerpsConnectionProvider.disconnect', data: {} },
       });
     }
     // Always update state after disconnect attempt
@@ -175,11 +188,20 @@ export const PerpsConnectionProvider: React.FC<
         // Use the existing reconnectWithNewContext method from the singleton
         await PerpsConnectionManager.reconnectWithNewContext(options);
       } catch (err) {
+        const providerName = PerpsConnectionManager.getActiveProviderName();
         Logger.error(
           ensureError(err, 'PerpsConnectionProvider.reconnectWithNewContext'),
           {
-            message: 'PerpsConnectionProvider: Error during reconnect',
-            context: 'PerpsConnectionProvider.reconnectWithNewContext',
+            tags: {
+              feature: PERPS_CONSTANTS.FeatureName,
+              component: 'PerpsConnectionManager',
+              action: 'connection_reconnection',
+              ...(providerName && { provider: providerName }),
+            },
+            context: {
+              name: 'PerpsConnectionProvider.reconnectWithNewContext',
+              data: {},
+            },
           },
         );
       }
@@ -197,12 +219,20 @@ export const PerpsConnectionProvider: React.FC<
       try {
         await PerpsConnectionManager.connect();
       } catch (err) {
+        const providerName = PerpsConnectionManager.getActiveProviderName();
         Logger.error(
           ensureError(err, 'PerpsConnectionProvider.lifecycle.onConnect'),
           {
-            message: 'PerpsConnectionProvider: Error in lifecycle onConnect',
-            context:
-              'PerpsConnectionProvider.usePerpsConnectionLifecycle.onConnect',
+            tags: {
+              feature: PERPS_CONSTANTS.FeatureName,
+              component: 'PerpsConnectionManager',
+              action: 'connection_connection',
+              ...(providerName && { provider: providerName }),
+            },
+            context: {
+              name: 'PerpsConnectionProvider.lifecycle.onConnect',
+              data: {},
+            },
           },
         );
       }
@@ -213,12 +243,20 @@ export const PerpsConnectionProvider: React.FC<
       try {
         await PerpsConnectionManager.disconnect();
       } catch (err) {
+        const providerName = PerpsConnectionManager.getActiveProviderName();
         Logger.error(
           ensureError(err, 'PerpsConnectionProvider.lifecycle.onDisconnect'),
           {
-            message: 'PerpsConnectionProvider: Error in lifecycle onDisconnect',
-            context:
-              'PerpsConnectionProvider.usePerpsConnectionLifecycle.onDisconnect',
+            tags: {
+              feature: PERPS_CONSTANTS.FeatureName,
+              component: 'PerpsConnectionManager',
+              action: 'connection_disconnection',
+              ...(providerName && { provider: providerName }),
+            },
+            context: {
+              name: 'PerpsConnectionProvider.lifecycle.onDisconnect',
+              data: {},
+            },
           },
         );
       }
@@ -257,6 +295,25 @@ export const PerpsConnectionProvider: React.FC<
     ],
   );
 
+  // Sentry breadcrumb: makes error screen appearance visible in issue timelines
+  // Placed in useEffect to avoid firing on every re-render (polling is 100ms)
+  // retryAttempts intentionally excluded — breadcrumb should fire once per error
+  // appearance, not on every retry (retries are tracked in handleRetry breadcrumb)
+  useEffect(() => {
+    if (connectionState.error) {
+      addBreadcrumb({
+        category: 'perps.connection',
+        message: 'PerpsConnectionErrorView shown',
+        level: 'error',
+        data: {
+          errorCode: connectionState.error,
+          retryAttempts,
+        },
+      });
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [connectionState.error]);
+
   // Environment-level error handling - show error screen if connection failed
   // This ensures NO Perps screen can render when there's a connection error
   // When suppressErrorView is true, skip the error view and render children normally
@@ -280,17 +337,17 @@ export const PerpsConnectionProvider: React.FC<
         // Reset retry attempts and let polling update the state
         setRetryAttempts(0);
       } catch (err) {
-        // Keep retry attempts count for showing back button after failed attempts
-        Logger.error(
-          ensureError(err, 'PerpsConnectionProvider.initializePerps'),
-          {
-            tags: { feature: PERPS_CONSTANTS.FeatureName },
-            context: {
-              name: 'PerpsConnectionProvider.initializePerps',
-              data: { retryAttempts },
-            },
+        // Breadcrumb only — avoid flooding Sentry with a new event on every retry
+        addBreadcrumb({
+          category: 'perps.connection',
+          message: 'Retry failed',
+          level: 'warning',
+          data: {
+            error: ensureError(err, 'PerpsConnectionProvider.handleRetry')
+              .message,
+            retryAttempts,
           },
-        );
+        });
       }
 
       // Force update to get the latest error state
diff --git a/app/components/UI/Perps/providers/PerpsStreamManager.test.tsx b/app/components/UI/Perps/providers/PerpsStreamManager.test.tsx
index a4b2f3e17e40..16e8aa08bf02 100644
--- a/app/components/UI/Perps/providers/PerpsStreamManager.test.tsx
+++ b/app/components/UI/Perps/providers/PerpsStreamManager.test.tsx
@@ -92,14 +92,11 @@ describe('PerpsStreamManager', () => {
       getMarkets: jest
         .fn()
         .mockResolvedValue([{ name: 'BTC-PERP' }, { name: 'ETH-PERP' }]),
+      getCachedMarketDataForActiveProvider: jest.fn().mockReturnValue(null),
+      getCachedUserDataForActiveProvider: jest.fn().mockReturnValue(null),
       state: {
-        cachedMarketData: null,
-        cachedMarketDataTimestamp: 0,
-        cachedPositions: null,
-        cachedOrders: null,
-        cachedAccountState: null,
-        cachedUserDataTimestamp: 0,
-        cachedUserDataAddress: null,
+        cachedMarketDataByProvider: {},
+        cachedUserDataByProvider: {},
       },
     } as unknown as typeof mockEngine.context.PerpsController;
 
@@ -1680,12 +1677,16 @@ describe('PerpsStreamManager', () => {
     it('uses controller preloaded cache when fresh', async () => {
       const callback = jest.fn();
 
-      // Set up controller with fresh cached market data
+      // Set up controller with fresh cached market data via per-provider helper
+      (
+        mockEngine.context.PerpsController as unknown as Record<string, unknown>
+      ).getCachedMarketDataForActiveProvider = jest
+        .fn()
+        .mockReturnValue(mockMarketData);
       (
         mockEngine.context.PerpsController as unknown as Record<string, unknown>
       ).state = {
-        cachedMarketData: mockMarketData,
-        cachedMarketDataTimestamp: Date.now(),
+        cachedMarketDataByProvider: {},
         activeProvider: 'hyperliquid',
       };
 
@@ -1710,11 +1711,13 @@ describe('PerpsStreamManager', () => {
       unsubscribe();
 
       // Reset state for other tests
+      (
+        mockEngine.context.PerpsController as unknown as Record<string, unknown>
+      ).getCachedMarketDataForActiveProvider = jest.fn().mockReturnValue(null);
       (
         mockEngine.context.PerpsController as unknown as Record<string, unknown>
       ).state = {
-        cachedMarketData: null,
-        cachedMarketDataTimestamp: 0,
+        cachedMarketDataByProvider: {},
       };
     });
 
@@ -1725,12 +1728,16 @@ describe('PerpsStreamManager', () => {
         callTimings.push({ data, callIndex: callTimings.length });
       });
 
-      // Set up controller with fresh cached market data
+      // Set up controller with fresh cached market data via per-provider helper
+      (
+        mockEngine.context.PerpsController as unknown as Record<string, unknown>
+      ).getCachedMarketDataForActiveProvider = jest
+        .fn()
+        .mockReturnValue(mockMarketData);
       (
         mockEngine.context.PerpsController as unknown as Record<string, unknown>
       ).state = {
-        cachedMarketData: mockMarketData,
-        cachedMarketDataTimestamp: Date.now(),
+        cachedMarketDataByProvider: {},
         activeProvider: 'hyperliquid',
       };
 
@@ -1755,23 +1762,27 @@ describe('PerpsStreamManager', () => {
       unsubscribe();
 
       // Reset state for other tests
+      (
+        mockEngine.context.PerpsController as unknown as Record<string, unknown>
+      ).getCachedMarketDataForActiveProvider = jest.fn().mockReturnValue(null);
       (
         mockEngine.context.PerpsController as unknown as Record<string, unknown>
       ).state = {
-        cachedMarketData: null,
-        cachedMarketDataTimestamp: 0,
+        cachedMarketDataByProvider: {},
       };
     });
 
     it('fetches from API when controller cache is stale', async () => {
       const callback = jest.fn();
 
-      // Set up controller with stale cached market data (very old timestamp)
+      // getCachedMarketDataForActiveProvider returns null when cache is stale
+      (
+        mockEngine.context.PerpsController as unknown as Record<string, unknown>
+      ).getCachedMarketDataForActiveProvider = jest.fn().mockReturnValue(null);
       (
         mockEngine.context.PerpsController as unknown as Record<string, unknown>
       ).state = {
-        cachedMarketData: mockMarketData,
-        cachedMarketDataTimestamp: 0, // epoch = very stale
+        cachedMarketDataByProvider: {},
         activeProvider: 'hyperliquid',
       };
 
@@ -1798,11 +1809,13 @@ describe('PerpsStreamManager', () => {
       unsubscribe();
 
       // Reset state for other tests
+      (
+        mockEngine.context.PerpsController as unknown as Record<string, unknown>
+      ).getCachedMarketDataForActiveProvider = jest.fn().mockReturnValue(null);
       (
         mockEngine.context.PerpsController as unknown as Record<string, unknown>
       ).state = {
-        cachedMarketData: null,
-        cachedMarketDataTimestamp: 0,
+        cachedMarketDataByProvider: {},
       };
     });
   });
@@ -1951,10 +1964,10 @@ describe('PerpsStreamManager', () => {
 
       // Assert - DevLogger should log the discard
       expect(mockDevLogger.log).toHaveBeenCalledWith(
-        'PerpsStreamManager: Provider changed during fetch, discarding data',
+        'PerpsStreamManager: Provider/network changed during fetch, discarding data',
         expect.objectContaining({
-          fetchedFor: 'providerA',
-          currentProvider: 'providerB',
+          fetchedFor: 'providerA:mainnet',
+          current: 'providerB:mainnet',
         }),
       );
 
@@ -3266,14 +3279,14 @@ describe('PerpsStreamManager', () => {
           error: null,
         });
 
-      // Set up controller with fresh cached orders
+      // Set up controller to return fresh cached orders via helper
       (
         mockEngine.context.PerpsController as unknown as Record<string, unknown>
-      ).state = {
-        ...mockEngine.context.PerpsController.state,
-        cachedOrders: mockOrders,
-        cachedUserDataTimestamp: Date.now(),
-      };
+      ).getCachedUserDataForActiveProvider = jest.fn().mockReturnValue({
+        positions: [],
+        orders: mockOrders,
+        accountState: null,
+      });
 
       const streamManager = new PerpsStreamManager();
       const callback = jest.fn();
@@ -3300,14 +3313,14 @@ describe('PerpsStreamManager', () => {
           error: null,
         });
 
-      // Set up controller with fresh cached positions
+      // Set up controller to return fresh cached positions via helper
       (
         mockEngine.context.PerpsController as unknown as Record<string, unknown>
-      ).state = {
-        ...mockEngine.context.PerpsController.state,
-        cachedPositions: mockPositions,
-        cachedUserDataTimestamp: Date.now(),
-      };
+      ).getCachedUserDataForActiveProvider = jest.fn().mockReturnValue({
+        positions: mockPositions,
+        orders: [],
+        accountState: null,
+      });
 
       const streamManager = new PerpsStreamManager();
       const callback = jest.fn();
@@ -3333,14 +3346,14 @@ describe('PerpsStreamManager', () => {
           error: null,
         });
 
-      // Set up controller with fresh cached account state
+      // Set up controller to return fresh cached account state via helper
       (
         mockEngine.context.PerpsController as unknown as Record<string, unknown>
-      ).state = {
-        ...mockEngine.context.PerpsController.state,
-        cachedAccountState: mockAccountState,
-        cachedUserDataTimestamp: Date.now(),
-      };
+      ).getCachedUserDataForActiveProvider = jest.fn().mockReturnValue({
+        positions: [],
+        orders: [],
+        accountState: mockAccountState,
+      });
 
       const streamManager = new PerpsStreamManager();
       const callback = jest.fn();
@@ -3356,14 +3369,10 @@ describe('PerpsStreamManager', () => {
     });
 
     it('does not use stale cached orders', () => {
-      // Set up controller with stale cached orders (very old timestamp)
+      // Controller helper returns null when data is stale
       (
         mockEngine.context.PerpsController as unknown as Record<string, unknown>
-      ).state = {
-        ...mockEngine.context.PerpsController.state,
-        cachedOrders: mockOrders,
-        cachedUserDataTimestamp: 0, // epoch = very stale
-      };
+      ).getCachedUserDataForActiveProvider = jest.fn().mockReturnValue(null);
 
       const streamManager = new PerpsStreamManager();
       const callback = jest.fn();
@@ -3380,14 +3389,14 @@ describe('PerpsStreamManager', () => {
     });
 
     it('uses empty cached orders as valid cache', () => {
-      // Set up controller with empty cached orders — [] means "fetched, user has none"
+      // Controller helper returns empty orders — [] means "fetched, user has none"
       (
         mockEngine.context.PerpsController as unknown as Record<string, unknown>
-      ).state = {
-        ...mockEngine.context.PerpsController.state,
-        cachedOrders: [],
-        cachedUserDataTimestamp: Date.now(),
-      };
+      ).getCachedUserDataForActiveProvider = jest.fn().mockReturnValue({
+        positions: [],
+        orders: [],
+        accountState: null,
+      });
 
       const streamManager = new PerpsStreamManager();
       const callback = jest.fn();
@@ -3402,14 +3411,14 @@ describe('PerpsStreamManager', () => {
     });
 
     it('prefers channel cache over controller cache', () => {
-      // Set up controller with cached orders
+      // Set up controller to return cached orders via helper
       (
         mockEngine.context.PerpsController as unknown as Record<string, unknown>
-      ).state = {
-        ...mockEngine.context.PerpsController.state,
-        cachedOrders: mockOrders,
-        cachedUserDataTimestamp: Date.now(),
-      };
+      ).getCachedUserDataForActiveProvider = jest.fn().mockReturnValue({
+        positions: [],
+        orders: mockOrders,
+        accountState: null,
+      });
 
       const streamManager = new PerpsStreamManager();
       const callback1 = jest.fn();
diff --git a/app/components/UI/Perps/providers/PerpsStreamManager.tsx b/app/components/UI/Perps/providers/PerpsStreamManager.tsx
index 59c9818892b1..1db87d36515c 100644
--- a/app/components/UI/Perps/providers/PerpsStreamManager.tsx
+++ b/app/components/UI/Perps/providers/PerpsStreamManager.tsx
@@ -96,15 +96,13 @@ abstract class StreamChannel<T> {
       // This ensures callbacks fire at most once per throttleMs interval
       // WITHOUT resetting the countdown on every update (which would be debouncing)
       // The conditional check prevents timer accumulation - no memory leaks
-      if (!subscriber.timer) {
-        subscriber.timer = setTimeout(() => {
-          if (subscriber.pendingUpdate) {
-            subscriber.callback(subscriber.pendingUpdate);
-            subscriber.pendingUpdate = undefined;
-          }
-          subscriber.timer = undefined;
-        }, subscriber.throttleMs);
-      }
+      subscriber.timer ??= setTimeout(() => {
+        if (subscriber.pendingUpdate) {
+          subscriber.callback(subscriber.pendingUpdate);
+          subscriber.pendingUpdate = undefined;
+        }
+        subscriber.timer = undefined;
+      }, subscriber.throttleMs);
     });
   }
 
@@ -224,7 +222,7 @@ abstract class StreamChannel<T> {
     const noop = () => {
       /* sentinel timer */
     };
-    const sentinel = setTimeout(noop, 0) as ReturnType<typeof setTimeout>;
+    const sentinel = setTimeout(noop, 0);
     this.deferConnectTimer = sentinel;
 
     PerpsConnectionManager.waitForConnection()
@@ -349,7 +347,7 @@ abstract class StreamChannel<T> {
 
 // Specific channel for prices
 class PriceStreamChannel extends StreamChannel<Record<string, PriceUpdate>> {
-  private symbols = new Set<string>();
+  private readonly symbols = new Set<string>();
   private prewarmUnsubscribe?: () => void;
   private actualPriceUnsubscribe?: () => void;
   private allMarketSymbols: string[] = [];
@@ -484,109 +482,99 @@ class PriceStreamChannel extends StreamChannel<Record<string, PriceUpdate>> {
       return this.prewarmUnsubscribe;
     }
 
-    try {
-      const controller = Engine.context.PerpsController;
-
-      // Increment cycle ID to detect stale promises from previous prewarm cycles
-      // This prevents subscription leaks when user navigates: Perps → away → back quickly
-      this.prewarmCycleId++;
-      const currentCycleId = this.prewarmCycleId;
-
-      // Start market fetch in background (non-blocking)
-      // We need the symbols to register subscribers, but we can return immediately
-      const marketsPromise = controller.getMarkets();
-
-      // Set up subscription once markets arrive (fire-and-forget)
-      marketsPromise
-        .then((markets) => {
-          // If this promise is from a stale cycle, don't set up subscription
-          // This prevents leaks when prewarm is called multiple times rapidly
-          if (currentCycleId !== this.prewarmCycleId) {
-            DevLogger.log('PriceStreamChannel: Skipping stale prewarm cycle', {
-              currentCycleId,
-              activeCycleId: this.prewarmCycleId,
-            });
-            return;
-          }
+    const controller = Engine.context.PerpsController;
+    if (!controller) return () => undefined;
+
+    // Increment cycle ID to detect stale promises from previous prewarm cycles
+    // This prevents subscription leaks when user navigates: Perps → away → back quickly
+    this.prewarmCycleId++;
+    const currentCycleId = this.prewarmCycleId;
+
+    // Start market fetch in background (non-blocking)
+    // We need the symbols to register subscribers, but we can return immediately
+    controller
+      .getMarkets()
+      .then((markets) => {
+        // If this promise is from a stale cycle, don't set up subscription
+        // This prevents leaks when prewarm is called multiple times rapidly
+        if (currentCycleId !== this.prewarmCycleId) {
+          DevLogger.log('PriceStreamChannel: Skipping stale prewarm cycle', {
+            currentCycleId,
+            activeCycleId: this.prewarmCycleId,
+          });
+          return;
+        }
 
-          // If already cleaned up, don't set up subscription
-          if (this.prewarmUnsubscribe === undefined) {
-            return;
-          }
+        // If already cleaned up, don't set up subscription
+        if (this.prewarmUnsubscribe === undefined) {
+          return;
+        }
 
-          this.allMarketSymbols = markets.map((market) => market.name);
+        this.allMarketSymbols = markets.map((market) => market.name);
 
-          DevLogger.log(
-            'PriceStreamChannel: Pre-warming with all market symbols',
-            {
-              symbolCount: this.allMarketSymbols.length,
-              symbols: this.allMarketSymbols.slice(0, 10),
-            },
-          );
+        DevLogger.log(
+          'PriceStreamChannel: Pre-warming with all market symbols',
+          {
+            symbolCount: this.allMarketSymbols.length,
+            symbols: this.allMarketSymbols.slice(0, 10),
+          },
+        );
 
-          // Subscribe to all market prices
-          const unsub = controller.subscribeToPrices({
-            symbols: this.allMarketSymbols,
-            callback: (updates: PriceUpdate[]) => {
-              const priceMap: Record<string, PriceUpdate> = {};
-              updates.forEach((update) => {
-                const priceUpdate: PriceUpdate = {
-                  symbol: update.symbol,
-                  price: update.price,
-                  timestamp: Date.now(),
-                  percentChange24h: update.percentChange24h,
-                  bestBid: update.bestBid,
-                  bestAsk: update.bestAsk,
-                  spread: update.spread,
-                  markPrice: update.markPrice,
-                  funding: update.funding,
-                  openInterest: update.openInterest,
-                  volume24h: update.volume24h,
-                };
-                this.priceCache.set(update.symbol, priceUpdate);
-                priceMap[update.symbol] = priceUpdate;
-              });
-
-              if (this.subscribers.size > 0) {
-                this.notifySubscribers(priceMap);
-              }
-            },
-          });
+        // Subscribe to all market prices
+        const unsub = controller.subscribeToPrices({
+          symbols: this.allMarketSymbols,
+          callback: (updates: PriceUpdate[]) => {
+            const priceMap: Record<string, PriceUpdate> = {};
+            updates.forEach((update) => {
+              const priceUpdate: PriceUpdate = {
+                symbol: update.symbol,
+                price: update.price,
+                timestamp: Date.now(),
+                percentChange24h: update.percentChange24h,
+                bestBid: update.bestBid,
+                bestAsk: update.bestAsk,
+                spread: update.spread,
+                markPrice: update.markPrice,
+                funding: update.funding,
+                openInterest: update.openInterest,
+                volume24h: update.volume24h,
+              };
+              this.priceCache.set(update.symbol, priceUpdate);
+              priceMap[update.symbol] = priceUpdate;
+            });
 
-          // Store the actual unsubscribe function
-          this.actualPriceUnsubscribe = unsub;
-        })
-        .catch((error) => {
-          Logger.error(
-            ensureError(error, 'PriceStreamChannel.prewarm.backgroundFetch'),
-            {
-              context: 'PriceStreamChannel.prewarm.backgroundFetch',
-            },
-          );
-          // Reset state so subsequent prewarm/connect calls can recover
-          this.prewarmUnsubscribe = undefined;
-          this.allMarketSymbols = [];
-          // Reconnect waiting subscribers that were skipped because prewarm was pending
-          if (this.subscribers.size > 0) {
-            this.connect();
-          }
+            if (this.subscribers.size > 0) {
+              this.notifySubscribers(priceMap);
+            }
+          },
         });
 
-      // Return cleanup function immediately (before markets load)
-      this.prewarmUnsubscribe = () => {
-        DevLogger.log('PriceStreamChannel: Cleaning up prewarm subscription');
-        this.cleanupPrewarm();
-      };
-
-      return this.prewarmUnsubscribe;
-    } catch (error) {
-      Logger.error(ensureError(error, 'PriceStreamChannel.prewarm'), {
-        context: 'PriceStreamChannel.prewarm',
+        // Store the actual unsubscribe function
+        this.actualPriceUnsubscribe = unsub;
+      })
+      .catch((error) => {
+        Logger.error(
+          ensureError(error, 'PriceStreamChannel.prewarm.backgroundFetch'),
+          {
+            context: 'PriceStreamChannel.prewarm.backgroundFetch',
+          },
+        );
+        // Reset state so subsequent prewarm/connect calls can recover
+        this.prewarmUnsubscribe = undefined;
+        this.allMarketSymbols = [];
+        // Reconnect waiting subscribers that were skipped because prewarm was pending
+        if (this.subscribers.size > 0) {
+          this.connect();
+        }
       });
-      return () => {
-        // No-op
-      };
-    }
+
+    // Return cleanup function immediately (before markets load)
+    this.prewarmUnsubscribe = () => {
+      DevLogger.log('PriceStreamChannel: Cleaning up prewarm subscription');
+      this.cleanupPrewarm();
+    };
+
+    return this.prewarmUnsubscribe;
   }
 
   /**
@@ -1163,7 +1151,7 @@ class OICapStreamChannel extends StreamChannel<string[]> {
   protected getCachedData(): string[] | null {
     // Return null if no cache exists to distinguish from empty array
     const cached = this.cache.get('oiCaps');
-    return cached !== undefined ? cached : null;
+    return cached ?? null;
   }
 
   protected getClearedData(): string[] {
@@ -1324,18 +1312,22 @@ class MarketDataChannel extends StreamChannel<PerpsMarketData[]> {
       return;
     }
 
-    // Get current provider ID
+    // Get current provider ID + network as a composite key.
+    // Network changes (testnet toggle) must also invalidate the market cache.
     const controller = Engine.context.PerpsController;
     const currentProviderId =
       controller.state?.activeProvider || PROVIDER_CONFIG.DefaultProvider;
+    // Note: uses state.isTestnet directly. If PROVIDER_CONFIG.MYX_TESTNET_ONLY is
+    // ever re-enabled, this key would diverge from PerpsController.#providerIsTestnet().
+    const currentNetworkKey = `${currentProviderId}:${controller.state?.isTestnet ? 'testnet' : 'mainnet'}`;
 
-    // Invalidate cache if provider changed
-    if (this.cachedProviderId && this.cachedProviderId !== currentProviderId) {
+    // Invalidate cache if provider OR network changed
+    if (this.cachedProviderId && this.cachedProviderId !== currentNetworkKey) {
       DevLogger.log(
-        'PerpsStreamManager: Provider changed, invalidating cache',
+        'PerpsStreamManager: Provider/network changed, invalidating cache',
         {
           from: this.cachedProviderId,
-          to: currentProviderId,
+          to: currentNetworkKey,
         },
       );
       this.cache.delete('markets');
@@ -1388,31 +1380,25 @@ class MarketDataChannel extends StreamChannel<PerpsMarketData[]> {
 
         // One-time read of controller-level preloaded cache (REST snapshot).
         // This avoids an HTTP round-trip when the controller already has fresh data.
-        // Only use cache if it belongs to the currently active provider.
-        const controllerProviderId =
-          controller.state?.activeProvider || PROVIDER_CONFIG.DefaultProvider;
-        const cached = controller.state?.cachedMarketData;
-        const cacheAge =
-          Date.now() - (controller.state?.cachedMarketDataTimestamp ?? 0);
+        const controllerNetworkKey = `${controller.state?.activeProvider || PROVIDER_CONFIG.DefaultProvider}:${controller.state?.isTestnet ? 'testnet' : 'mainnet'}`;
+        const cachedForProvider =
+          controller.getCachedMarketDataForActiveProvider?.();
         if (
-          cached &&
-          cached.length > 0 &&
-          cacheAge < this.CACHE_DURATION &&
+          cachedForProvider &&
+          cachedForProvider.length > 0 &&
           (!this.cachedProviderId ||
-            this.cachedProviderId === controllerProviderId)
+            this.cachedProviderId === controllerNetworkKey)
         ) {
           DevLogger.log(
             'PerpsStreamManager: Using controller preloaded market data',
             {
-              marketCount: cached.length,
-              cacheAgeMs: cacheAge,
+              marketCount: cachedForProvider.length,
             },
           );
-          this.cache.set('markets', cached);
+          this.cache.set('markets', cachedForProvider);
           this.lastFetchTime = Date.now();
-          this.cachedProviderId =
-            controller.state?.activeProvider || PROVIDER_CONFIG.DefaultProvider;
-          this.notifySubscribers(cached);
+          this.cachedProviderId = controllerNetworkKey;
+          this.notifySubscribers(cachedForProvider);
           return;
         }
 
@@ -1420,33 +1406,31 @@ class MarketDataChannel extends StreamChannel<PerpsMarketData[]> {
           'PerpsStreamManager: Fetching fresh market data from API',
         );
 
-        // Snapshot provider ID BEFORE the async call to avoid race conditions.
-        // If the user switches providers while getMarketDataWithPrices() is
-        // in-flight, we must not tag the returned data with the new provider's ID.
-        const preFetchProviderId =
-          controller.state?.activeProvider || PROVIDER_CONFIG.DefaultProvider;
+        // Snapshot provider + network BEFORE the async call to avoid race conditions.
+        // If the user switches providers or toggles testnet while getMarketDataWithPrices()
+        // is in-flight, we must not tag the returned data with the new network key.
+        const preFetchNetworkKey = `${controller.state?.activeProvider || PROVIDER_CONFIG.DefaultProvider}:${controller.state?.isTestnet ? 'testnet' : 'mainnet'}`;
 
         const data = await controller.getMarketDataWithPrices();
         const fetchTime = Date.now() - fetchStartTime;
 
-        // If provider changed during fetch, discard stale data
-        const currentProviderId =
-          controller.state?.activeProvider || PROVIDER_CONFIG.DefaultProvider;
-        if (preFetchProviderId !== currentProviderId) {
+        // If provider or network changed during fetch, discard stale data
+        const postFetchNetworkKey = `${controller.state?.activeProvider || PROVIDER_CONFIG.DefaultProvider}:${controller.state?.isTestnet ? 'testnet' : 'mainnet'}`;
+        if (preFetchNetworkKey !== postFetchNetworkKey) {
           DevLogger.log(
-            'PerpsStreamManager: Provider changed during fetch, discarding data',
+            'PerpsStreamManager: Provider/network changed during fetch, discarding data',
             {
-              fetchedFor: preFetchProviderId,
-              currentProvider: currentProviderId,
+              fetchedFor: preFetchNetworkKey,
+              current: postFetchNetworkKey,
             },
           );
           return;
         }
 
-        // Update cache and track which provider this data came from
+        // Update cache and track which provider+network this data came from
         this.cache.set('markets', data);
         this.lastFetchTime = Date.now();
-        this.cachedProviderId = preFetchProviderId;
+        this.cachedProviderId = preFetchNetworkKey;
 
         // Notify all subscribers
         this.notifySubscribers(data);
@@ -1511,22 +1495,9 @@ class MarketDataChannel extends StreamChannel<PerpsMarketData[]> {
     const cached = this.cache.get('markets');
     if (cached !== undefined) return cached;
 
-    // Fallback: read controller preloaded cache (from REST preload)
+    // Fallback: read per-provider cache via helper
     const controller = Engine.context.PerpsController;
-    const currentProviderId =
-      controller.state?.activeProvider || PROVIDER_CONFIG.DefaultProvider;
-    // Reject preloaded cache if it belongs to a different provider
-    if (this.cachedProviderId && this.cachedProviderId !== currentProviderId) {
-      return null;
-    }
-    const preloaded = controller.state?.cachedMarketData;
-    const cacheAge =
-      Date.now() - (controller.state?.cachedMarketDataTimestamp ?? 0);
-    if (preloaded && preloaded.length > 0 && cacheAge < this.CACHE_DURATION) {
-      return preloaded;
-    }
-
-    return null;
+    return controller.getCachedMarketDataForActiveProvider?.() ?? null;
   }
 
   protected getClearedData(): PerpsMarketData[] {
diff --git a/app/components/UI/Perps/routes/index.tsx b/app/components/UI/Perps/routes/index.tsx
index 1a3eb4e6eb54..1cfc3c83370c 100644
--- a/app/components/UI/Perps/routes/index.tsx
+++ b/app/components/UI/Perps/routes/index.tsx
@@ -269,7 +269,6 @@ const PerpsScreenStack = () => {
               title: strings('perps.home.markets'),
               showBalanceActions: false,
               showBottomNav: false,
-              defaultSearchVisible: false,
             }}
           />
 
diff --git a/app/components/UI/Perps/selectors/featureFlags/index.test.ts b/app/components/UI/Perps/selectors/featureFlags/index.test.ts
index 6163f50d87ce..179b31f357cf 100644
--- a/app/components/UI/Perps/selectors/featureFlags/index.test.ts
+++ b/app/components/UI/Perps/selectors/featureFlags/index.test.ts
@@ -1667,7 +1667,7 @@ describe('Perps Feature Flag Selectors', () => {
         expect(result).toBe(true);
       });
 
-      it('uses remote flag when valid but disabled', () => {
+      it('local flag overrides remote flag when local is true', () => {
         mockHasMinimumRequiredVersion.mockReturnValue(true);
         process.env.MM_PERPS_MYX_PROVIDER_ENABLED = 'true';
 
@@ -1690,10 +1690,10 @@ describe('Perps Feature Flag Selectors', () => {
         const result = selectPerpsMYXProviderEnabledFlag(
           stateWithDisabledRemoteFlag,
         );
-        expect(result).toBe(false);
+        expect(result).toBe(true);
       });
 
-      it('uses remote flag (false) when enabled but version check fails', () => {
+      it('local flag overrides remote flag even when version check fails', () => {
         mockHasMinimumRequiredVersion.mockReturnValue(false);
         process.env.MM_PERPS_MYX_PROVIDER_ENABLED = 'true';
 
@@ -1716,6 +1716,32 @@ describe('Perps Feature Flag Selectors', () => {
         const result = selectPerpsMYXProviderEnabledFlag(
           stateWithVersionCheckFailure,
         );
+        expect(result).toBe(true);
+      });
+
+      it('uses remote flag when local is not set', () => {
+        mockHasMinimumRequiredVersion.mockReturnValue(true);
+        delete process.env.MM_PERPS_MYX_PROVIDER_ENABLED;
+
+        const stateWithDisabledRemoteFlag = {
+          engine: {
+            backgroundState: {
+              RemoteFeatureFlagController: {
+                remoteFeatureFlags: {
+                  perpsMyxProviderEnabled: {
+                    enabled: false,
+                    minimumVersion: '1.0.0',
+                  },
+                },
+                cacheTimestamp: 0,
+              },
+            },
+          },
+        };
+
+        const result = selectPerpsMYXProviderEnabledFlag(
+          stateWithDisabledRemoteFlag,
+        );
         expect(result).toBe(false);
       });
 
diff --git a/app/components/UI/Perps/selectors/featureFlags/index.ts b/app/components/UI/Perps/selectors/featureFlags/index.ts
index 3811c217cf95..c7b7648478a2 100644
--- a/app/components/UI/Perps/selectors/featureFlags/index.ts
+++ b/app/components/UI/Perps/selectors/featureFlags/index.ts
@@ -26,6 +26,7 @@ export const selectPerpsEnabledFlag = createSelector(
     const remoteFlag =
       remoteFeatureFlags?.perpsPerpTradingEnabled as unknown as VersionGatedFeatureFlag;
 
+    // Fallback to local flag if remote flag is not available
     return validatedVersionGatedFeatureFlag(remoteFlag) ?? localFlag;
   },
 );
@@ -38,6 +39,7 @@ export const selectPerpsServiceInterruptionBannerEnabledFlag = createSelector(
     const remoteFlag =
       remoteFeatureFlags?.perpsPerpTradingServiceInterruptionBannerEnabled as unknown as VersionGatedFeatureFlag;
 
+    // Fallback to local flag if remote flag is not available
     return validatedVersionGatedFeatureFlag(remoteFlag) ?? localFlag;
   },
 );
@@ -49,6 +51,7 @@ export const selectPerpsGtmOnboardingModalEnabledFlag = createSelector(
     const remoteFlag =
       remoteFeatureFlags?.perpsPerpGtmOnboardingModalEnabled as unknown as VersionGatedFeatureFlag;
 
+    // Fallback to local flag if remote flag is not available
     return validatedVersionGatedFeatureFlag(remoteFlag) ?? localFlag;
   },
 );
@@ -62,6 +65,7 @@ export const selectPerpsGtmOnboardingModalEnabledFlag = createSelector(
 export const selectPerpsOrderBookEnabledFlag = createSelector(
   selectRemoteFeatureFlags,
   (remoteFeatureFlags) => {
+    // Default to false if no flag is set (disabled by default)
     const localFlag = process.env.MM_PERPS_ORDER_BOOK_ENABLED === 'true';
     const remoteFlag =
       remoteFeatureFlags?.perpsOrderBookEnabled as unknown as VersionGatedFeatureFlag;
@@ -243,15 +247,25 @@ export const selectPerpsRewardsReferralCodeEnabledFlag = createSelector(
  * Pure utility so that both the Redux selector and the controller
  * (which reads RemoteFeatureFlagController state directly) share
  * the same logic.
+ *
+ * Local env var takes priority — if set to "true", MYX is always enabled
+ * regardless of remote flag. Remote flag only used as fallback when
+ * local is not explicitly enabled.
  */
 export function resolvePerpsMyxProviderEnabled(
   remoteFeatureFlags: Record<string, unknown> | undefined,
 ): boolean {
   const localFlag = process.env.MM_PERPS_MYX_PROVIDER_ENABLED === 'true';
+
+  // Local override always wins
+  if (localFlag) {
+    return true;
+  }
+
   const remoteFlag =
     remoteFeatureFlags?.perpsMyxProviderEnabled as VersionGatedFeatureFlag;
 
-  return validatedVersionGatedFeatureFlag(remoteFlag) ?? localFlag;
+  return validatedVersionGatedFeatureFlag(remoteFlag) ?? false;
 }
 
 /**
diff --git a/app/components/UI/Perps/services/PerpsConnectionManager.test.ts b/app/components/UI/Perps/services/PerpsConnectionManager.test.ts
index 66c5b080726f..12d356325d8d 100644
--- a/app/components/UI/Perps/services/PerpsConnectionManager.test.ts
+++ b/app/components/UI/Perps/services/PerpsConnectionManager.test.ts
@@ -27,6 +27,7 @@ jest.mock('../../../../core/Engine', () => ({
       getActiveProvider: jest.fn(() => ({
         ping: jest.fn().mockResolvedValue(undefined),
       })),
+      isCurrentlyReinitializing: jest.fn(() => false),
     },
   },
 }));
@@ -688,6 +689,64 @@ describe('PerpsConnectionManager', () => {
       );
     });
 
+    it('debounces rapid state changes into a single reconnection', async () => {
+      // Arrange
+      jest.useFakeTimers();
+      mockPerpsController.init.mockResolvedValue();
+      mockPerpsController.getAccountState.mockResolvedValue({});
+      await PerpsConnectionManager.connect();
+
+      const storeCallback = storeCallbacks[storeCallbacks.length - 1];
+
+      // Simulate two rapid state changes within 50ms
+      (selectPerpsNetwork as unknown as jest.Mock).mockReturnValue('testnet');
+      storeCallback();
+      (
+        selectSelectedInternalAccountByScope as unknown as jest.Mock
+      ).mockReturnValue(() => ({ address: '0xnew' }));
+      storeCallback();
+
+      // Advance past the 50ms debounce window
+      jest.advanceTimersByTime(60);
+      await Promise.resolve();
+
+      // Assert: reconnect was called once, not twice (debounced)
+      const initCallCount = mockPerpsController.init.mock.calls.length;
+      // init was called once for connect(); any debounced reconnect fires one more time
+      expect(initCallCount).toBeGreaterThanOrEqual(1);
+
+      jest.useRealTimers();
+    });
+
+    it('clears pending debounce timer when cleanupStateMonitoring is called', async () => {
+      // Arrange: arm the debounce timer via a state change
+      jest.useFakeTimers();
+      mockPerpsController.init.mockResolvedValue();
+      mockPerpsController.getAccountState.mockResolvedValue({});
+      await PerpsConnectionManager.connect();
+
+      const storeCallback = storeCallbacks[storeCallbacks.length - 1];
+      (selectPerpsNetwork as unknown as jest.Mock).mockReturnValue('testnet');
+      storeCallback();
+
+      const m = PerpsConnectionManager as unknown as {
+        stateChangeDebounceTimer: ReturnType<typeof setTimeout> | null;
+        cleanupStateMonitoring: () => void;
+      };
+      expect(m.stateChangeDebounceTimer).not.toBeNull();
+
+      // Act: invoke teardown directly to cover the timer-clearing branch
+      m.cleanupStateMonitoring();
+
+      // Assert: timer is cleared and no reconnect fires
+      expect(m.stateChangeDebounceTimer).toBeNull();
+      jest.advanceTimersByTime(100);
+      // init was only called once (for connect), not again from the cancelled debounce
+      expect(mockPerpsController.init).toHaveBeenCalledTimes(1);
+
+      jest.useRealTimers();
+    });
+
     it('continues monitoring state changes during grace period', async () => {
       // Setup but don't connect
       mockPerpsController.init.mockResolvedValue();
@@ -761,6 +820,33 @@ describe('PerpsConnectionManager', () => {
       expect(mockPerpsController.init).toHaveBeenCalled();
     });
 
+    it('waits for concurrent controller reinit before health-check ping', async () => {
+      // Arrange: controller reports reinitializing on first call, ready on second
+      mockPerpsController.init.mockResolvedValue();
+      const isReinitializing = (
+        Engine.context.PerpsController as unknown as {
+          isCurrentlyReinitializing: jest.Mock;
+        }
+      ).isCurrentlyReinitializing;
+      isReinitializing
+        .mockReturnValueOnce(true)
+        .mockReturnValueOnce(true)
+        .mockReturnValue(false);
+
+      // Act
+      await (
+        PerpsConnectionManager as unknown as {
+          reconnectWithNewContext: () => Promise<void>;
+        }
+      ).reconnectWithNewContext();
+
+      // Assert: polled at least twice before calling getActiveProvider
+      expect(isReinitializing.mock.calls.length).toBeGreaterThanOrEqual(2);
+      expect(
+        Engine.context.PerpsController.getActiveProvider,
+      ).toHaveBeenCalled();
+    });
+
     it('logs error and resets connecting flag when reconnection fails', async () => {
       const error = new Error('Reconnection failed');
       mockPerpsController.init.mockRejectedValueOnce(error);
@@ -1146,4 +1232,45 @@ describe('PerpsConnectionManager', () => {
       expect(m.wasOffline).toBe(true);
     });
   });
+
+  describe('getActiveProviderName', () => {
+    it('returns activeProvider from PerpsController state', () => {
+      // Arrange
+      (
+        Engine.context.PerpsController as unknown as Record<string, unknown>
+      ).state = {
+        activeProvider: 'hyperliquid',
+      };
+
+      // Act
+      const result = PerpsConnectionManager.getActiveProviderName();
+
+      // Assert
+      expect(result).toBe('hyperliquid');
+    });
+
+    it('returns undefined when Engine access throws', () => {
+      // Arrange — remove PerpsController so property access throws
+      const original = Engine.context.PerpsController;
+      Object.defineProperty(Engine.context, 'PerpsController', {
+        get: () => {
+          throw new Error('Engine not initialized');
+        },
+        configurable: true,
+      });
+
+      // Act
+      const result = PerpsConnectionManager.getActiveProviderName();
+
+      // Assert
+      expect(result).toBeUndefined();
+
+      // Cleanup
+      Object.defineProperty(Engine.context, 'PerpsController', {
+        value: original,
+        configurable: true,
+        writable: true,
+      });
+    });
+  });
 });
diff --git a/app/components/UI/Perps/services/PerpsConnectionManager.ts b/app/components/UI/Perps/services/PerpsConnectionManager.ts
index cf01bbce0267..ec39079be55d 100644
--- a/app/components/UI/Perps/services/PerpsConnectionManager.ts
+++ b/app/components/UI/Perps/services/PerpsConnectionManager.ts
@@ -2,7 +2,7 @@ import {
   addEventListener as netInfoAddEventListener,
   type NetInfoState,
 } from '@react-native-community/netinfo';
-import { captureException, setMeasurement } from '@sentry/react-native';
+import { setMeasurement } from '@sentry/react-native';
 import BackgroundTimer from 'react-native-background-timer';
 import performance from 'react-native-performance';
 import { v4 as uuidv4 } from 'uuid';
@@ -62,6 +62,7 @@ class PerpsConnectionManagerClass {
   private isInGracePeriod = false;
   private pendingReconnectPromise: Promise<void> | null = null;
   private connectionTimeoutRef: ReturnType<typeof setTimeout> | null = null;
+  private stateChangeDebounceTimer: ReturnType<typeof setTimeout> | null = null;
   private netInfoUnsubscribe: (() => void) | null = null;
   private wasOffline = false;
   private networkRestoreRetryTimer: ReturnType<typeof setTimeout> | null = null;
@@ -161,23 +162,29 @@ class PerpsConnectionManagerClass {
         streamManager.topOfBook.clearCache();
         streamManager.candles.clearCache();
 
-        // Force the controller to reconnect with new account
-        // This ensures proper WebSocket reconnection at the controller level
-        this.reconnectWithNewContext().catch((error) => {
-          Logger.error(
-            ensureError(error, 'PerpsConnectionManager.setupStateMonitoring'),
-            {
-              tags: { feature: PERPS_CONSTANTS.FeatureName },
-              context: {
-                name: 'PerpsConnectionManager.setupStateMonitoring',
-                data: {
-                  message:
-                    'Error reconnecting with new account/network context',
+        // Debounce: coalesce rapid state changes (e.g. provider switch + network
+        // toggle in the same tick) into a single reconnection attempt.
+        if (this.stateChangeDebounceTimer !== null) {
+          clearTimeout(this.stateChangeDebounceTimer);
+        }
+        this.stateChangeDebounceTimer = setTimeout(() => {
+          this.stateChangeDebounceTimer = null;
+          this.reconnectWithNewContext().catch((error) => {
+            Logger.error(
+              ensureError(error, 'PerpsConnectionManager.setupStateMonitoring'),
+              {
+                tags: { feature: PERPS_CONSTANTS.FeatureName },
+                context: {
+                  name: 'PerpsConnectionManager.setupStateMonitoring',
+                  data: {
+                    message:
+                      'Error reconnecting with new account/network context',
+                  },
                 },
               },
-            },
-          );
-        });
+            );
+          });
+        }, 50);
       }
 
       // Update tracked values
@@ -321,6 +328,10 @@ class PerpsConnectionManagerClass {
       this.wasOffline = false;
     }
     this.cancelNetworkRestoreRetry();
+    if (this.stateChangeDebounceTimer !== null) {
+      clearTimeout(this.stateChangeDebounceTimer);
+      this.stateChangeDebounceTimer = null;
+    }
     if (this.unsubscribeFromStore) {
       this.unsubscribeFromStore();
       this.unsubscribeFromStore = null;
@@ -747,25 +758,6 @@ class PerpsConnectionManagerClass {
         // Clear connection timeout on error
         this.clearConnectionTimeout();
 
-        // Capture exception with connection context
-        captureException(ensureError(error, 'PerpsConnectionManager.connect'), {
-          tags: {
-            component: 'PerpsConnectionManager',
-            action: 'connection_connection',
-            operation: 'connection_management',
-            provider: 'hyperliquid',
-          },
-          extra: {
-            connectionContext: {
-              provider: 'hyperliquid',
-              timestamp: new Date().toISOString(),
-              isTestnet:
-                Engine.context.PerpsController?.getCurrentNetwork?.() ===
-                'testnet',
-            },
-          },
-        });
-
         traceData = {
           success: false,
           error: ensureError(error, 'PerpsConnectionManager.connect').message,
@@ -894,6 +886,8 @@ class PerpsConnectionManagerClass {
       this.isInitialized = false;
       this.hasPreloaded = false;
       this.isPreloading = false;
+      // Flag intentional teardown so WS state events can be suppressed in the UI
+      this.isDisconnecting = true;
       // Clear previous errors when starting reconnection attempt
       this.clearError();
 
@@ -923,6 +917,27 @@ class PerpsConnectionManagerClass {
         : PERPS_CONSTANTS.ReconnectionDelayIosMs;
       await wait(reconnectionDelay);
 
+      // Wait for any concurrent controller reinit (e.g. toggleTestnet) to finish
+      // before calling getActiveProvider(), which throws CLIENT_REINITIALIZING while
+      // isReinitializing is true.
+      {
+        const maxWaitMs = 2000;
+        const pollIntervalMs = 50;
+        let waited = 0;
+        while (
+          Engine.context.PerpsController.isCurrentlyReinitializing() &&
+          waited < maxWaitMs
+        ) {
+          await wait(pollIntervalMs);
+          waited += pollIntervalMs;
+        }
+        if (waited > 0) {
+          DevLogger.log(
+            `PerpsConnectionManager: Waited ${waited}ms for concurrent reinit to complete`,
+          );
+        }
+      }
+
       // Validate connection with WebSocket health check ping before marking as connected
       // This ensures the WebSocket connection is actually responsive after reconnection without expensive API calls
       DevLogger.log(
@@ -955,6 +970,7 @@ class PerpsConnectionManagerClass {
       // No need to explicitly call getAccountState() - preloadSubscriptions() handles account data
       this.isConnected = true;
       this.isInitialized = true;
+      this.isDisconnecting = false;
       // Clear errors on successful reconnection
       this.clearError();
 
@@ -1019,8 +1035,9 @@ class PerpsConnectionManagerClass {
         id: traceId,
         data: traceData,
       });
-      // Always clear connecting state when done
+      // Always clear connecting/disconnecting state when done
       this.isConnecting = false;
+      this.isDisconnecting = false;
     }
   }
 
@@ -1207,6 +1224,18 @@ class PerpsConnectionManagerClass {
     );
   }
 
+  /**
+   * Returns the active provider name from the PerpsController state.
+   * Used for consistent error/breadcrumb tagging without coupling callers to Engine.
+   */
+  getActiveProviderName(): string | undefined {
+    try {
+      return Engine.context.PerpsController.state.activeProvider;
+    } catch {
+      return undefined;
+    }
+  }
+
   /**
    * Check if the manager is currently connecting
    */
diff --git a/app/components/UI/Perps/types/navigation.ts b/app/components/UI/Perps/types/navigation.ts
index 1862788381d9..8eab990c0e09 100644
--- a/app/components/UI/Perps/types/navigation.ts
+++ b/app/components/UI/Perps/types/navigation.ts
@@ -77,7 +77,6 @@ export interface PerpsNavigationParamList extends ParamListBase {
     title?: string;
     showBalanceActions?: boolean;
     showBottomNav?: boolean;
-    defaultSearchVisible?: boolean;
     showWatchlistOnly?: boolean;
     defaultMarketTypeFilter?:
       | 'all'
diff --git a/app/components/UI/Perps/utils/accountUtils.test.ts b/app/components/UI/Perps/utils/accountUtils.test.ts
index 060db48acc8d..f3bf3b73c6ea 100644
--- a/app/components/UI/Perps/utils/accountUtils.test.ts
+++ b/app/components/UI/Perps/utils/accountUtils.test.ts
@@ -8,7 +8,6 @@ import {
   getEvmAccountFromAccountGroup,
   getSelectedEvmAccount,
   calculateWeightedReturnOnEquity,
-  PerpsControllerMessenger,
 } from '@metamask/perps-controller';
 
 describe('accountUtils', () => {
@@ -242,7 +241,7 @@ describe('accountUtils', () => {
   });
 
   describe('getSelectedEvmAccount', () => {
-    it('returns EVM account when messenger returns accounts with EVM', () => {
+    it('returns EVM account when accounts array contains EVM account', () => {
       const mockAccounts = [
         {
           address: '0xabcdefabcdefabcdefabcdefabcdefabcdefabcdef',
@@ -259,27 +258,14 @@ describe('accountUtils', () => {
         },
       ] as unknown as InternalAccount[];
 
-      const mockMessenger = {
-        call: jest.fn().mockReturnValue(mockAccounts) as jest.MockedFunction<
-          (
-            action: 'AccountTreeController:getAccountsFromSelectedAccountGroup',
-          ) => InternalAccount[]
-        >,
-      };
-
-      const result = getSelectedEvmAccount(
-        mockMessenger as unknown as PerpsControllerMessenger,
-      );
-
-      expect(mockMessenger.call).toHaveBeenCalledWith(
-        'AccountTreeController:getAccountsFromSelectedAccountGroup',
-      );
+      const result = getSelectedEvmAccount(mockAccounts);
+
       expect(result).toEqual({
         address: '0xabcdefabcdefabcdefabcdefabcdefabcdefabcdef',
       });
     });
 
-    it('returns undefined when no EVM account in selected group', () => {
+    it('returns undefined when no EVM account in accounts array', () => {
       const mockAccounts = [
         {
           address: '0x1234567890123456789012345678901234567890',
@@ -296,33 +282,13 @@ describe('accountUtils', () => {
         },
       ] as unknown as InternalAccount[];
 
-      const mockMessenger = {
-        call: jest.fn().mockReturnValue(mockAccounts) as jest.MockedFunction<
-          (
-            action: 'AccountTreeController:getAccountsFromSelectedAccountGroup',
-          ) => InternalAccount[]
-        >,
-      };
-
-      const result = getSelectedEvmAccount(
-        mockMessenger as unknown as PerpsControllerMessenger,
-      );
+      const result = getSelectedEvmAccount(mockAccounts);
 
       expect(result).toBeUndefined();
     });
 
-    it('returns undefined when messenger returns empty accounts', () => {
-      const mockMessenger = {
-        call: jest.fn().mockReturnValue([]) as jest.MockedFunction<
-          (
-            action: 'AccountTreeController:getAccountsFromSelectedAccountGroup',
-          ) => InternalAccount[]
-        >,
-      };
-
-      const result = getSelectedEvmAccount(
-        mockMessenger as unknown as PerpsControllerMessenger,
-      );
+    it('returns undefined when accounts array is empty', () => {
+      const result = getSelectedEvmAccount([]);
 
       expect(result).toBeUndefined();
     });
diff --git a/app/components/UI/Perps/utils/rewardsUtils.test.ts b/app/components/UI/Perps/utils/rewardsUtils.test.ts
index 0697848fca3e..d490a5b46b60 100644
--- a/app/components/UI/Perps/utils/rewardsUtils.test.ts
+++ b/app/components/UI/Perps/utils/rewardsUtils.test.ts
@@ -8,11 +8,9 @@ import {
   handleRewardsError,
 } from '@metamask/perps-controller';
 import { toCaipAccountId, parseCaipChainId } from '@metamask/utils';
-import { formatChainIdToCaip } from '@metamask/bridge-controller';
 import { toChecksumHexAddress } from '@metamask/controller-utils';
 
 jest.mock('@metamask/utils');
-jest.mock('@metamask/bridge-controller');
 jest.mock('@metamask/controller-utils');
 
 const mockToCaipAccountId = toCaipAccountId as jest.MockedFunction<
@@ -21,9 +19,6 @@ const mockToCaipAccountId = toCaipAccountId as jest.MockedFunction<
 const mockParseCaipChainId = parseCaipChainId as jest.MockedFunction<
   typeof parseCaipChainId
 >;
-const mockFormatChainIdToCaip = formatChainIdToCaip as jest.MockedFunction<
-  typeof formatChainIdToCaip
->;
 const mockToChecksumHexAddress = toChecksumHexAddress as jest.MockedFunction<
   typeof toChecksumHexAddress
 >;
@@ -41,7 +36,6 @@ describe('rewardsUtils', () => {
       'eip155:42161:0x1234567890123456789012345678901234567890';
 
     beforeEach(() => {
-      mockFormatChainIdToCaip.mockReturnValue(mockCaipChainId);
       mockParseCaipChainId.mockReturnValue({
         namespace: 'eip155',
         reference: '42161',
@@ -57,7 +51,6 @@ describe('rewardsUtils', () => {
 
       // Assert
       expect(result).toBe(mockCaipAccountId);
-      expect(mockFormatChainIdToCaip).toHaveBeenCalledWith(mockChainId);
       expect(mockParseCaipChainId).toHaveBeenCalledWith(mockCaipChainId);
       expect(mockToCaipAccountId).toHaveBeenCalledWith(
         'eip155',
@@ -66,13 +59,7 @@ describe('rewardsUtils', () => {
       );
     });
 
-    it('returns null when formatChainIdToCaip throws', () => {
-      // Arrange
-      const error = new Error('Invalid chain ID format');
-      mockFormatChainIdToCaip.mockImplementation(() => {
-        throw error;
-      });
-
+    it('returns null when chain ID is invalid (NaN)', () => {
       // Act
       const result = formatAccountToCaipAccountId(mockAddress, 'invalid');
 
@@ -127,10 +114,8 @@ describe('rewardsUtils', () => {
       const checksummedAddress = '0x316BDE155acd07609872a56Bc32CcfB0B13201fA';
       const mixedCaseAddress = '0x316BdE155AcD07609872a56bC32CcFb0b13201Fa';
       const chainId = '1';
-      const caipChainId = 'eip155:1';
 
       beforeEach(() => {
-        mockFormatChainIdToCaip.mockReturnValue(caipChainId);
         mockParseCaipChainId.mockReturnValue({
           namespace: 'eip155',
           reference: '1',
@@ -238,9 +223,8 @@ describe('rewardsUtils', () => {
       const chainId = '1';
 
       beforeEach(() => {
-        mockFormatChainIdToCaip.mockReturnValue(
-          'bip122:000000000019d6689c085ae165831e93',
-        );
+        // parseCaipChainId receives 'eip155:1' from inlined formatChainIdToCaip,
+        // but we mock it to return a non-eip155 namespace to test the branch
         mockParseCaipChainId.mockReturnValue({
           namespace: 'bip122',
           reference: '000000000019d6689c085ae165831e93',
diff --git a/app/components/UI/Perps/utils/transactionTransforms.ts b/app/components/UI/Perps/utils/transactionTransforms.ts
index 86c0d98ee51f..0a5d1f269572 100644
--- a/app/components/UI/Perps/utils/transactionTransforms.ts
+++ b/app/components/UI/Perps/utils/transactionTransforms.ts
@@ -538,7 +538,9 @@ export function transformFundingToTransactions(
         isPositive,
         fee: amountUSDC,
         feeNumber: parseFloat(amountUsd),
-        rate: `${BigNumber(rate).multipliedBy(100).toString()}%`,
+        rate: `${BigNumber(rate ?? '0')
+          .multipliedBy(100)
+          .toString()}%`,
       },
     };
   });
diff --git a/app/components/UI/PhishingModal/__snapshots__/index.test.tsx.snap b/app/components/UI/PhishingModal/__snapshots__/index.test.tsx.snap
index 42d4bccd7e5c..8edc23826c05 100644
--- a/app/components/UI/PhishingModal/__snapshots__/index.test.tsx.snap
+++ b/app/components/UI/PhishingModal/__snapshots__/index.test.tsx.snap
@@ -4,7 +4,7 @@ exports[`PhishingModal should render correctly 1`] = `
 <View
   style={
     {
-      "backgroundColor": "#f3f5f9",
+      "backgroundColor": "#f3f3f4",
       "flex": 1,
       "justifyContent": "center",
       "marginTop": -100,
@@ -48,7 +48,7 @@ exports[`PhishingModal should render correctly 1`] = `
   <Text
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Bold",
         "fontSize": 24,
         "marginBottom": 16,
@@ -61,7 +61,7 @@ exports[`PhishingModal should render correctly 1`] = `
   <Text
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Regular",
         "fontSize": 14,
         "marginBottom": 20,
@@ -73,7 +73,7 @@ exports[`PhishingModal should render correctly 1`] = `
   <Text
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Regular",
         "fontSize": 14,
         "marginBottom": 20,
@@ -125,7 +125,7 @@ exports[`PhishingModal should render correctly 1`] = `
             "fontSize": 16,
           },
           {
-            "color": "#121314",
+            "color": "#131416",
             "textAlign": "center",
             "width": 24,
           },
@@ -143,7 +143,7 @@ exports[`PhishingModal should render correctly 1`] = `
     <Text
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 14,
           "marginLeft": 12,
@@ -184,7 +184,7 @@ exports[`PhishingModal should render correctly 1`] = `
             "fontSize": 16,
           },
           {
-            "color": "#121314",
+            "color": "#131416",
             "textAlign": "center",
             "width": 24,
           },
@@ -202,7 +202,7 @@ exports[`PhishingModal should render correctly 1`] = `
     <Text
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 14,
           "marginLeft": 12,
@@ -222,7 +222,7 @@ exports[`PhishingModal should render correctly 1`] = `
       {
         "alignItems": "center",
         "alignSelf": "stretch",
-        "backgroundColor": "#121314",
+        "backgroundColor": "#131416",
         "borderRadius": 12,
         "flexDirection": "row",
         "height": 48,
diff --git a/app/components/UI/Predict/components/PredictDetailsButtonsSkeleton/__snapshots__/PredictDetailsButtonsSkeleton.test.tsx.snap b/app/components/UI/Predict/components/PredictDetailsButtonsSkeleton/__snapshots__/PredictDetailsButtonsSkeleton.test.tsx.snap
index 12e3f2b4c122..501b2e36d19d 100644
--- a/app/components/UI/Predict/components/PredictDetailsButtonsSkeleton/__snapshots__/PredictDetailsButtonsSkeleton.test.tsx.snap
+++ b/app/components/UI/Predict/components/PredictDetailsButtonsSkeleton/__snapshots__/PredictDetailsButtonsSkeleton.test.tsx.snap
@@ -44,7 +44,7 @@ exports[`PredictDetailsButtonsSkeleton matches snapshot 1`] = `
         pointerEvents="none"
         style={
           {
-            "backgroundColor": "#686e7d",
+            "backgroundColor": "#66676a",
             "borderRadius": 4,
             "bottom": 0,
             "left": 0,
@@ -86,7 +86,7 @@ exports[`PredictDetailsButtonsSkeleton matches snapshot 1`] = `
         pointerEvents="none"
         style={
           {
-            "backgroundColor": "#686e7d",
+            "backgroundColor": "#66676a",
             "borderRadius": 4,
             "bottom": 0,
             "left": 0,
diff --git a/app/components/UI/Predict/components/PredictDetailsContentSkeleton/__snapshots__/PredictDetailsContentSkeleton.test.tsx.snap b/app/components/UI/Predict/components/PredictDetailsContentSkeleton/__snapshots__/PredictDetailsContentSkeleton.test.tsx.snap
index 3d93c1333bea..2576050fbab9 100644
--- a/app/components/UI/Predict/components/PredictDetailsContentSkeleton/__snapshots__/PredictDetailsContentSkeleton.test.tsx.snap
+++ b/app/components/UI/Predict/components/PredictDetailsContentSkeleton/__snapshots__/PredictDetailsContentSkeleton.test.tsx.snap
@@ -41,7 +41,7 @@ exports[`PredictDetailsContentSkeleton matches snapshot 1`] = `
         pointerEvents="none"
         style={
           {
-            "backgroundColor": "#686e7d",
+            "backgroundColor": "#66676a",
             "borderRadius": 4,
             "bottom": 0,
             "left": 0,
@@ -69,7 +69,7 @@ exports[`PredictDetailsContentSkeleton matches snapshot 1`] = `
         pointerEvents="none"
         style={
           {
-            "backgroundColor": "#686e7d",
+            "backgroundColor": "#66676a",
             "borderRadius": 4,
             "bottom": 0,
             "left": 0,
@@ -109,7 +109,7 @@ exports[`PredictDetailsContentSkeleton matches snapshot 1`] = `
         pointerEvents="none"
         style={
           {
-            "backgroundColor": "#686e7d",
+            "backgroundColor": "#66676a",
             "borderRadius": 4,
             "bottom": 0,
             "left": 0,
@@ -137,7 +137,7 @@ exports[`PredictDetailsContentSkeleton matches snapshot 1`] = `
         pointerEvents="none"
         style={
           {
-            "backgroundColor": "#686e7d",
+            "backgroundColor": "#66676a",
             "borderRadius": 4,
             "bottom": 0,
             "left": 0,
diff --git a/app/components/UI/Predict/components/PredictDetailsHeaderSkeleton/__snapshots__/PredictDetailsHeaderSkeleton.test.tsx.snap b/app/components/UI/Predict/components/PredictDetailsHeaderSkeleton/__snapshots__/PredictDetailsHeaderSkeleton.test.tsx.snap
index b21ec242f321..2fc292ede41d 100644
--- a/app/components/UI/Predict/components/PredictDetailsHeaderSkeleton/__snapshots__/PredictDetailsHeaderSkeleton.test.tsx.snap
+++ b/app/components/UI/Predict/components/PredictDetailsHeaderSkeleton/__snapshots__/PredictDetailsHeaderSkeleton.test.tsx.snap
@@ -58,7 +58,7 @@ exports[`PredictDetailsHeaderSkeleton matches snapshot 1`] = `
     testID="predict-details-header-skeleton-back-button"
   >
     <SvgMock
-      color="#121314"
+      color="#131416"
       fill="currentColor"
       height={24}
       name="ArrowLeft"
@@ -103,7 +103,7 @@ exports[`PredictDetailsHeaderSkeleton matches snapshot 1`] = `
         pointerEvents="none"
         style={
           {
-            "backgroundColor": "#686e7d",
+            "backgroundColor": "#66676a",
             "borderRadius": 4,
             "bottom": 0,
             "left": 0,
@@ -132,7 +132,7 @@ exports[`PredictDetailsHeaderSkeleton matches snapshot 1`] = `
       pointerEvents="none"
       style={
         {
-          "backgroundColor": "#686e7d",
+          "backgroundColor": "#66676a",
           "borderRadius": 4,
           "bottom": 0,
           "left": 0,
diff --git a/app/components/UI/Predict/components/PredictFeeBreakdownSheet/PredictFeeBreakdownSheet.test.tsx b/app/components/UI/Predict/components/PredictFeeBreakdownSheet/PredictFeeBreakdownSheet.test.tsx
index e61f8adfa8f1..bee8f2136d34 100644
--- a/app/components/UI/Predict/components/PredictFeeBreakdownSheet/PredictFeeBreakdownSheet.test.tsx
+++ b/app/components/UI/Predict/components/PredictFeeBreakdownSheet/PredictFeeBreakdownSheet.test.tsx
@@ -87,6 +87,9 @@ jest.mock('../../../../../../locales/i18n', () => ({
     if (key === 'predict.fee_summary.close') {
       return 'Close';
     }
+    if (key === 'predict.fee_summary.fak_partial_fill_note') {
+      return 'Prices shown assume your order is fully filled. Actual amounts may vary if the order is only partially filled.';
+    }
     return key;
   }),
 }));
@@ -325,4 +328,55 @@ describe('PredictFeeBreakdownSheet', () => {
       render(<TestComponent />);
     });
   });
+
+  describe('FAK partial fill note', () => {
+    it('displays partial fill note when fakOrdersEnabled is true', () => {
+      const TestComponent = () => {
+        const ref = useRef<BottomSheetRef>(null);
+        return (
+          <PredictFeeBreakdownSheet
+            ref={ref}
+            {...defaultProps}
+            fakOrdersEnabled
+          />
+        );
+      };
+
+      const { getByTestId } = render(<TestComponent />);
+
+      expect(getByTestId('predict-fak-partial-fill-note')).toBeOnTheScreen();
+    });
+
+    it('does not display partial fill note when fakOrdersEnabled is false', () => {
+      const TestComponent = () => {
+        const ref = useRef<BottomSheetRef>(null);
+        return (
+          <PredictFeeBreakdownSheet
+            ref={ref}
+            {...defaultProps}
+            fakOrdersEnabled={false}
+          />
+        );
+      };
+
+      const { queryByTestId } = render(<TestComponent />);
+
+      expect(
+        queryByTestId('predict-fak-partial-fill-note'),
+      ).not.toBeOnTheScreen();
+    });
+
+    it('does not display partial fill note by default', () => {
+      const TestComponent = () => {
+        const ref = useRef<BottomSheetRef>(null);
+        return <PredictFeeBreakdownSheet ref={ref} {...defaultProps} />;
+      };
+
+      const { queryByTestId } = render(<TestComponent />);
+
+      expect(
+        queryByTestId('predict-fak-partial-fill-note'),
+      ).not.toBeOnTheScreen();
+    });
+  });
 });
diff --git a/app/components/UI/Predict/components/PredictFeeBreakdownSheet/PredictFeeBreakdownSheet.tsx b/app/components/UI/Predict/components/PredictFeeBreakdownSheet/PredictFeeBreakdownSheet.tsx
index 6e18323635cb..f2b57f844c19 100644
--- a/app/components/UI/Predict/components/PredictFeeBreakdownSheet/PredictFeeBreakdownSheet.tsx
+++ b/app/components/UI/Predict/components/PredictFeeBreakdownSheet/PredictFeeBreakdownSheet.tsx
@@ -1,17 +1,44 @@
 import React, { forwardRef } from 'react';
-import { Box } from '@metamask/design-system-react-native';
+import {
+  Box,
+  FontWeight,
+  Text,
+  TextColor,
+  TextVariant,
+} from '@metamask/design-system-react-native';
 import BottomSheet, {
   BottomSheetRef,
 } from '../../../../../component-library/components/BottomSheets/BottomSheet';
 import SheetHeader from '../../../../../component-library/components/Sheet/SheetHeader';
-import Text, {
-  TextColor,
-  TextVariant,
-} from '../../../../../component-library/components/Texts/Text';
 import { strings } from '../../../../../../locales/i18n';
 import { formatPrice } from '../../utils/format';
 import { SLIPPAGE_BUY } from '../../providers/polymarket/constants';
 
+interface FeeRowProps {
+  title: string;
+  description: string;
+  amount: string;
+}
+
+const FeeRow = ({ title, description, amount }: FeeRowProps) => (
+  <>
+    <Box twClassName="flex-row items-start py-4">
+      <Box twClassName="flex-1 pr-4 gap-1">
+        <Text color={TextColor.TextDefault} variant={TextVariant.BodyMd}>
+          {title}
+        </Text>
+        <Text color={TextColor.TextAlternative} variant={TextVariant.BodyXs}>
+          {description}
+        </Text>
+      </Box>
+      <Text color={TextColor.TextDefault} variant={TextVariant.BodyMd}>
+        {amount}
+      </Text>
+    </Box>
+    <Box twClassName="border-t border-muted" />
+  </>
+);
+
 interface PredictFeeBreakdownSheetProps {
   providerFee: number;
   metamaskFee: number;
@@ -20,6 +47,7 @@ interface PredictFeeBreakdownSheetProps {
   betAmount: number;
   total: number;
   onClose?: () => void;
+  fakOrdersEnabled?: boolean;
 }
 
 const PredictFeeBreakdownSheet = forwardRef<
@@ -35,72 +63,65 @@ const PredictFeeBreakdownSheet = forwardRef<
       betAmount,
       total,
       onClose,
+      fakOrdersEnabled = false,
     },
     ref,
   ) => (
     <BottomSheet ref={ref} onClose={onClose} shouldNavigateBack={false}>
       <SheetHeader title={strings('predict.fee_summary.price_details')} />
       <Box twClassName="px-4 pb-6 flex-col">
-        <Box twClassName="flex-row items-start py-4">
-          <Box twClassName="flex-1 pr-4 gap-1">
-            <Text color={TextColor.Default} variant={TextVariant.BodyMD}>
-              {strings('predict.fee_summary.prediction_order')}
-            </Text>
-            <Text color={TextColor.Alternative} variant={TextVariant.BodyXS}>
-              {strings('predict.fee_summary.prediction_order_description', {
-                count: contractCount.toFixed(2),
-                price: formatPrice(sharePrice, { maximumDecimals: 2 }),
-                slippage: Math.round(SLIPPAGE_BUY * 100),
-              })}
-            </Text>
-          </Box>
-          <Text color={TextColor.Default} variant={TextVariant.BodyMD}>
-            {formatPrice(betAmount, { maximumDecimals: 2 })}
-          </Text>
-        </Box>
-
-        <Box twClassName="border-t border-muted" />
-
-        <Box twClassName="flex-row items-start py-4">
-          <Box twClassName="flex-1 pr-4 gap-1">
-            <Text color={TextColor.Default} variant={TextVariant.BodyMD}>
-              {strings('predict.fee_summary.metamask_fee')}
-            </Text>
-            <Text color={TextColor.Alternative} variant={TextVariant.BodyXS}>
-              {strings('predict.fee_summary.metamask_fee_description')}
-            </Text>
-          </Box>
-          <Text color={TextColor.Default} variant={TextVariant.BodyMD}>
-            {formatPrice(metamaskFee, { maximumDecimals: 2 })}
-          </Text>
-        </Box>
+        <FeeRow
+          title={strings('predict.fee_summary.prediction_order')}
+          description={strings(
+            'predict.fee_summary.prediction_order_description',
+            {
+              count: contractCount.toFixed(2),
+              price: formatPrice(sharePrice, { maximumDecimals: 2 }),
+              slippage: Math.round(SLIPPAGE_BUY * 100),
+            },
+          )}
+          amount={formatPrice(betAmount, { maximumDecimals: 2 })}
+        />
 
-        <Box twClassName="border-t border-muted" />
+        <FeeRow
+          title={strings('predict.fee_summary.metamask_fee')}
+          description={strings('predict.fee_summary.metamask_fee_description')}
+          amount={formatPrice(metamaskFee, { maximumDecimals: 2 })}
+        />
 
-        <Box twClassName="flex-row items-start py-4">
-          <Box twClassName="flex-1 pr-4 gap-1">
-            <Text color={TextColor.Default} variant={TextVariant.BodyMD}>
-              {strings('predict.fee_summary.exchange_fee')}
-            </Text>
-            <Text color={TextColor.Alternative} variant={TextVariant.BodyXS}>
-              {strings('predict.fee_summary.exchange_fee_description')}
-            </Text>
-          </Box>
-          <Text color={TextColor.Default} variant={TextVariant.BodyMD}>
-            {formatPrice(providerFee, { maximumDecimals: 2 })}
-          </Text>
-        </Box>
-
-        <Box twClassName="border-t border-muted" />
+        <FeeRow
+          title={strings('predict.fee_summary.exchange_fee')}
+          description={strings('predict.fee_summary.exchange_fee_description')}
+          amount={formatPrice(providerFee, { maximumDecimals: 2 })}
+        />
 
         <Box twClassName="flex-row justify-between items-center pt-4">
-          <Text color={TextColor.Default} variant={TextVariant.BodyMDBold}>
+          <Text
+            color={TextColor.TextDefault}
+            variant={TextVariant.BodyMd}
+            fontWeight={FontWeight.Bold}
+          >
             {strings('predict.fee_summary.total')}
           </Text>
-          <Text color={TextColor.Default} variant={TextVariant.BodyMDBold}>
+          <Text
+            color={TextColor.TextDefault}
+            variant={TextVariant.BodyMd}
+            fontWeight={FontWeight.Bold}
+          >
             {formatPrice(total, { maximumDecimals: 2 })}
           </Text>
         </Box>
+
+        {fakOrdersEnabled && (
+          <Text
+            testID="predict-fak-partial-fill-note"
+            color={TextColor.TextAlternative}
+            variant={TextVariant.BodyXs}
+            twClassName="mt-3"
+          >
+            {strings('predict.fee_summary.fak_partial_fill_note')}
+          </Text>
+        )}
       </Box>
     </BottomSheet>
   ),
diff --git a/app/components/UI/Predict/components/PredictGameDetailsContent/__snapshots__/PredictGameDetailsContent.test.tsx.snap b/app/components/UI/Predict/components/PredictGameDetailsContent/__snapshots__/PredictGameDetailsContent.test.tsx.snap
index 65a9bf8c1a7f..800a611b94c1 100644
--- a/app/components/UI/Predict/components/PredictGameDetailsContent/__snapshots__/PredictGameDetailsContent.test.tsx.snap
+++ b/app/components/UI/Predict/components/PredictGameDetailsContent/__snapshots__/PredictGameDetailsContent.test.tsx.snap
@@ -83,7 +83,7 @@ exports[`PredictGameDetailsContent matches snapshot 1`] = `
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "height": 24,
               "width": 24,
             },
@@ -113,9 +113,9 @@ exports[`PredictGameDetailsContent matches snapshot 1`] = `
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Bold",
-              "fontSize": 18,
+              "fontSize": 20,
               "fontWeight": 700,
               "letterSpacing": 0,
               "lineHeight": 24,
diff --git a/app/components/UI/Predict/components/PredictMarketSkeleton/__snapshots__/PredictMarketSkeleton.test.tsx.snap b/app/components/UI/Predict/components/PredictMarketSkeleton/__snapshots__/PredictMarketSkeleton.test.tsx.snap
index 5ef0a29689f5..67b45c750348 100644
--- a/app/components/UI/Predict/components/PredictMarketSkeleton/__snapshots__/PredictMarketSkeleton.test.tsx.snap
+++ b/app/components/UI/Predict/components/PredictMarketSkeleton/__snapshots__/PredictMarketSkeleton.test.tsx.snap
@@ -5,7 +5,7 @@ exports[`PredictMarketSkeleton matches snapshot 1`] = `
   style={
     [
       {
-        "backgroundColor": "#f3f5f9",
+        "backgroundColor": "#f3f3f4",
         "borderRadius": 12,
         "display": "flex",
         "marginBottom": 8,
@@ -50,7 +50,7 @@ exports[`PredictMarketSkeleton matches snapshot 1`] = `
         pointerEvents="none"
         style={
           {
-            "backgroundColor": "#686e7d",
+            "backgroundColor": "#66676a",
             "borderRadius": 4,
             "bottom": 0,
             "left": 0,
@@ -91,7 +91,7 @@ exports[`PredictMarketSkeleton matches snapshot 1`] = `
           pointerEvents="none"
           style={
             {
-              "backgroundColor": "#686e7d",
+              "backgroundColor": "#66676a",
               "borderRadius": 4,
               "bottom": 0,
               "left": 0,
@@ -122,7 +122,7 @@ exports[`PredictMarketSkeleton matches snapshot 1`] = `
       pointerEvents="none"
       style={
         {
-          "backgroundColor": "#686e7d",
+          "backgroundColor": "#66676a",
           "borderRadius": 4,
           "bottom": 0,
           "left": 0,
@@ -150,7 +150,7 @@ exports[`PredictMarketSkeleton matches snapshot 1`] = `
       pointerEvents="none"
       style={
         {
-          "backgroundColor": "#686e7d",
+          "backgroundColor": "#66676a",
           "borderRadius": 4,
           "bottom": 0,
           "left": 0,
diff --git a/app/components/UI/Predict/components/PredictPositionsHeader/PredictPositionsHeader.test.tsx b/app/components/UI/Predict/components/PredictPositionsHeader/PredictPositionsHeader.test.tsx
index 06da69f9df1f..8fa4281d4ea0 100644
--- a/app/components/UI/Predict/components/PredictPositionsHeader/PredictPositionsHeader.test.tsx
+++ b/app/components/UI/Predict/components/PredictPositionsHeader/PredictPositionsHeader.test.tsx
@@ -76,6 +76,15 @@ jest.mock('@tanstack/react-query', () => ({
   }),
 }));
 
+const mockNavigate = jest.fn();
+jest.mock('@react-navigation/native', () => ({
+  ...jest.requireActual('@react-navigation/native'),
+  useNavigation: () => ({
+    navigate: mockNavigate,
+  }),
+  useFocusEffect: jest.fn(),
+}));
+
 const mockExecuteGuardedAction = jest.fn(async (action) => await action());
 jest.mock('../../hooks/usePredictActionGuard', () => ({
   usePredictActionGuard: () => ({
@@ -87,7 +96,7 @@ jest.mock('../../hooks/usePredictActionGuard', () => ({
 const mockRefetchClaimablePositions = jest.fn();
 jest.mock('../../hooks/usePredictPositions', () => ({
   usePredictPositions: () => ({
-    data: [],
+    data: [{ id: 'position-1' }],
     isLoading: false,
     error: null,
     refetch: mockRefetchClaimablePositions,
@@ -104,14 +113,6 @@ jest.mock('../../hooks/usePredictClaim', () => ({
   }),
 }));
 
-const mockNavigate = jest.fn();
-jest.mock('@react-navigation/native', () => ({
-  ...jest.requireActual('@react-navigation/native'),
-  useNavigation: () => ({
-    navigate: mockNavigate,
-  }),
-}));
-
 jest.mock('../../../../../../locales/i18n', () => ({
   strings: jest.fn((key: string, params?: Record<string, unknown>) => {
     const mockStrings: Record<string, string> = {
@@ -191,16 +192,15 @@ describe('MarketsWonCard', () => {
     mockBalanceResult.isLoading = false;
 
     mockUseUnrealizedPnL.mockReturnValue({
-      unrealizedPnL: {
+      data: {
         user: '0x1234567890123456789012345678901234567890',
         cashUpnl: 8.63,
         percentUpnl: 3.9,
       },
       isLoading: false,
-      isRefreshing: false,
+      isFetching: false,
       error: null,
-      loadUnrealizedPnL: jest.fn(),
-    });
+    } as unknown as ReturnType<typeof useUnrealizedPnL>);
   });
 
   afterEach(() => {
@@ -265,19 +265,7 @@ describe('MarketsWonCard', () => {
   });
 
   describe('refresh', () => {
-    it('reloads balance and unrealized P&L when refresh is called', async () => {
-      const mockLoadUnrealizedPnL = jest.fn();
-      mockUseUnrealizedPnL.mockReturnValue({
-        unrealizedPnL: {
-          user: '0x1234567890123456789012345678901234567890',
-          cashUpnl: 8.63,
-          percentUpnl: 3.9,
-        },
-        isLoading: false,
-        isRefreshing: false,
-        error: null,
-        loadUnrealizedPnL: mockLoadUnrealizedPnL,
-      });
+    it('invalidates balance and unrealized P&L queries when refresh is called', async () => {
       const ref = React.createRef<{ refresh: () => Promise<void> }>();
       const state = createTestState(100.5);
 
@@ -285,7 +273,7 @@ describe('MarketsWonCard', () => {
 
       await ref.current?.refresh();
 
-      expect(mockLoadUnrealizedPnL).toHaveBeenCalledWith({ isRefresh: true });
+      expect(mockInvalidateQueries).toHaveBeenCalled();
     });
   });
 
@@ -303,16 +291,15 @@ describe('MarketsWonCard', () => {
 
     it('displays skeleton loader when unrealized P&L is loading', () => {
       mockUseUnrealizedPnL.mockReturnValue({
-        unrealizedPnL: {
+        data: {
           user: '0x1234567890123456789012345678901234567890',
           cashUpnl: 0,
           percentUpnl: 0,
         },
         isLoading: true,
-        isRefreshing: false,
+        isFetching: true,
         error: null,
-        loadUnrealizedPnL: jest.fn(),
-      });
+      } as unknown as ReturnType<typeof useUnrealizedPnL>);
       const state = createTestState(100.5);
 
       renderWithProvider(<MarketsWonCard />, { state });
@@ -326,12 +313,11 @@ describe('MarketsWonCard', () => {
       mockBalanceResult.data = undefined;
       mockBalanceResult.isLoading = false;
       mockUseUnrealizedPnL.mockReturnValue({
-        unrealizedPnL: null,
+        data: undefined,
         isLoading: false,
-        isRefreshing: false,
+        isFetching: false,
         error: null,
-        loadUnrealizedPnL: jest.fn(),
-      });
+      } as unknown as ReturnType<typeof useUnrealizedPnL>);
       const state = createTestState();
 
       const { toJSON } = renderWithProvider(<MarketsWonCard />, { state });
@@ -357,16 +343,15 @@ describe('MarketsWonCard', () => {
       mockBalanceResult.error = null;
       mockBalanceResult.data = 100.5;
       mockUseUnrealizedPnL.mockReturnValue({
-        unrealizedPnL: {
+        data: {
           user: '0x1234567890123456789012345678901234567890',
           cashUpnl: 8.63,
           percentUpnl: 3.9,
         },
         isLoading: false,
-        isRefreshing: false,
-        error: 'P&L fetch failed',
-        loadUnrealizedPnL: jest.fn(),
-      });
+        isFetching: false,
+        error: new Error('P&L fetch failed'),
+      } as unknown as ReturnType<typeof useUnrealizedPnL>);
       const state = createTestState(100.5);
 
       renderWithProvider(<MarketsWonCard onError={mockOnError} />, { state });
@@ -379,16 +364,15 @@ describe('MarketsWonCard', () => {
       mockBalanceResult.error = { message: 'Balance error' };
       mockBalanceResult.data = 100.5;
       mockUseUnrealizedPnL.mockReturnValue({
-        unrealizedPnL: {
+        data: {
           user: '0x1234567890123456789012345678901234567890',
           cashUpnl: 8.63,
           percentUpnl: 3.9,
         },
         isLoading: false,
-        isRefreshing: false,
-        error: 'P&L error',
-        loadUnrealizedPnL: jest.fn(),
-      });
+        isFetching: false,
+        error: new Error('P&L error'),
+      } as unknown as ReturnType<typeof useUnrealizedPnL>);
       const state = createTestState(100.5);
 
       renderWithProvider(<MarketsWonCard onError={mockOnError} />, { state });
diff --git a/app/components/UI/Predict/components/PredictPositionsHeader/PredictPositionsHeader.tsx b/app/components/UI/Predict/components/PredictPositionsHeader/PredictPositionsHeader.tsx
index 339e05cbfb66..c03850645334 100644
--- a/app/components/UI/Predict/components/PredictPositionsHeader/PredictPositionsHeader.tsx
+++ b/app/components/UI/Predict/components/PredictPositionsHeader/PredictPositionsHeader.tsx
@@ -8,9 +8,14 @@ import {
   ButtonSize as ButtonSizeHero,
 } from '@metamask/design-system-react-native';
 import { useTailwind } from '@metamask/design-system-twrnc-preset';
-import { NavigationProp, useNavigation } from '@react-navigation/native';
+import {
+  NavigationProp,
+  useNavigation,
+  useFocusEffect,
+} from '@react-navigation/native';
 import React, {
   forwardRef,
+  useCallback,
   useEffect,
   useImperativeHandle,
   useMemo,
@@ -41,6 +46,7 @@ import { usePredictClaim } from '../../hooks/usePredictClaim';
 import { usePredictDeposit } from '../../hooks/usePredictDeposit';
 import { useUnrealizedPnL } from '../../hooks/useUnrealizedPnL';
 import { usePredictActionGuard } from '../../hooks/usePredictActionGuard';
+import { usePredictPositions } from '../../hooks/usePredictPositions';
 import { selectPredictWonPositions } from '../../selectors/predictController';
 import { PredictPosition } from '../../types';
 import { PredictNavigationParamList } from '../../types/navigation';
@@ -89,16 +95,32 @@ const PredictPositionsHeader = forwardRef<
     selectPredictWonPositions({ address: selectedAddress }),
   );
 
+  const { data: activePositions } = usePredictPositions({ claimable: false });
+  const hasPositions = (activePositions?.length ?? 0) > 0;
+
   const {
-    unrealizedPnL,
+    data: pnlData,
     isLoading: isUnrealizedPnLLoading,
-    loadUnrealizedPnL,
     error: pnlError,
   } = useUnrealizedPnL();
 
+  // Only show P&L when the user has active (non-claimable) positions
+  const unrealizedPnL = hasPositions ? (pnlData ?? null) : null;
+
+  // Invalidate unrealized P&L query when screen comes into focus
+  const pnlQueryKey = useMemo(
+    () => predictQueries.unrealizedPnL.keys.byAddress(selectedAddress),
+    [selectedAddress],
+  );
+  useFocusEffect(
+    useCallback(() => {
+      queryClient.invalidateQueries({ queryKey: pnlQueryKey });
+    }, [queryClient, pnlQueryKey]),
+  );
+
   // Notify parent of errors while keeping state isolated
   useEffect(() => {
-    const combinedError = balanceError?.message ?? pnlError ?? null;
+    const combinedError = balanceError?.message ?? pnlError?.message ?? null;
     onError?.(combinedError);
   }, [balanceError, pnlError, onError]);
 
@@ -122,7 +144,7 @@ const PredictPositionsHeader = forwardRef<
   useImperativeHandle(ref, () => ({
     refresh: async () => {
       await Promise.all([
-        loadUnrealizedPnL({ isRefresh: true }),
+        queryClient.invalidateQueries({ queryKey: pnlQueryKey }),
         queryClient.invalidateQueries({
           queryKey: predictQueries.balance.keys.all(),
         }),
diff --git a/app/components/UI/Predict/constants/eventNames.ts b/app/components/UI/Predict/constants/eventNames.ts
index de26b01602cc..937ad44eea31 100644
--- a/app/components/UI/Predict/constants/eventNames.ts
+++ b/app/components/UI/Predict/constants/eventNames.ts
@@ -22,6 +22,7 @@ export const PredictEventProperties = {
   // Trade specific
   MARKET_TYPE: 'market_type',
   OUTCOME: 'outcome',
+  ORDER_TYPE: 'order_type',
 
   // Sensitive properties
   AMOUNT_USD: 'amount_usd',
diff --git a/app/components/UI/Predict/constants/flags.ts b/app/components/UI/Predict/constants/flags.ts
index d81c3d60b1b2..6590daaecc03 100644
--- a/app/components/UI/Predict/constants/flags.ts
+++ b/app/components/UI/Predict/constants/flags.ts
@@ -14,6 +14,8 @@ export const DEFAULT_FEE_COLLECTION_FLAG = {
   metamaskFee: 0.02, // 2%
   providerFee: 0.02, // 2%
   waiveList: [],
+  executors: [],
+  permit2Enabled: false,
 } satisfies PredictFeeCollection;
 
 export const DEFAULT_LIVE_SPORTS_FLAG: PredictLiveSportsFlag = {
diff --git a/app/components/UI/Predict/controllers/PredictController.test.ts b/app/components/UI/Predict/controllers/PredictController.test.ts
index 19add5bbd30a..630ce4b6ff79 100644
--- a/app/components/UI/Predict/controllers/PredictController.test.ts
+++ b/app/components/UI/Predict/controllers/PredictController.test.ts
@@ -498,7 +498,6 @@ describe('PredictController', () => {
         expect(controller.state.lastUpdateTimestamp).toBeGreaterThan(0);
         expect(mockPolymarketProvider.getMarketDetails).toHaveBeenCalledWith({
           marketId: 'market-1',
-          liveSportsLeagues: [],
         });
       });
     });
@@ -522,7 +521,6 @@ describe('PredictController', () => {
         expect(result).toEqual(mockMarket);
         expect(mockPolymarketProvider.getMarketDetails).toHaveBeenCalledWith({
           marketId: 'market-2',
-          liveSportsLeagues: [],
         });
       });
     });
@@ -580,7 +578,6 @@ describe('PredictController', () => {
         expect(result).toEqual(mockMarket);
         expect(mockPolymarketProvider.getMarketDetails).toHaveBeenCalledWith({
           marketId: '123',
-          liveSportsLeagues: [],
         });
       });
     });
@@ -1403,10 +1400,10 @@ describe('PredictController', () => {
           expect(result[1].id).toBe('highlight-2');
           expect(result[2].id).toBe('regular-1');
           expect(result[3].id).toBe('regular-2');
-          expect(mockPolymarketProvider.getMarketsByIds).toHaveBeenCalledWith(
-            ['highlight-1', 'highlight-2'],
-            [],
-          );
+          expect(mockPolymarketProvider.getMarketsByIds).toHaveBeenCalledWith([
+            'highlight-1',
+            'highlight-2',
+          ]);
         },
         {
           mocks: {
@@ -4201,12 +4198,6 @@ describe('PredictController', () => {
               signTypedMessage: expect.any(Function),
               signPersonalMessage: expect.any(Function),
             }),
-            feeCollection: expect.objectContaining({
-              enabled: true,
-              collector: expect.any(String),
-              metamaskFee: expect.any(Number),
-              providerFee: expect.any(Number),
-            }),
           }),
         );
       });
@@ -5872,6 +5863,36 @@ describe('PredictController', () => {
       });
     });
 
+    it('includes orderType in analytics properties when provided', async () => {
+      await withController(async ({ controller }) => {
+        await controller.trackPredictOrderEvent({
+          status: 'submitted',
+          analyticsProperties: { marketId: 'test' },
+          orderType: 'FAK',
+        });
+
+        expect(analytics.trackEvent).toHaveBeenCalledWith(
+          expect.objectContaining({
+            properties: expect.objectContaining({
+              order_type: 'FAK',
+            }),
+          }),
+        );
+      });
+    });
+
+    it('omits orderType from analytics properties when not provided', async () => {
+      await withController(async ({ controller }) => {
+        await controller.trackPredictOrderEvent({
+          status: 'submitted',
+          analyticsProperties: { marketId: 'test' },
+        });
+
+        const eventArg = (analytics.trackEvent as jest.Mock).mock.calls[0][0];
+        expect(eventArg.properties).not.toHaveProperty('order_type');
+      });
+    });
+
     it('calls analytics.trackEvent for trackMarketDetailsOpened', () => {
       withController(({ controller }) => {
         controller.trackMarketDetailsOpened({
diff --git a/app/components/UI/Predict/controllers/PredictController.ts b/app/components/UI/Predict/controllers/PredictController.ts
index 21c79df49f01..e11c74d78e11 100644
--- a/app/components/UI/Predict/controllers/PredictController.ts
+++ b/app/components/UI/Predict/controllers/PredictController.ts
@@ -79,6 +79,7 @@ import {
   PredictClaim,
   PredictClaimStatus,
   PredictMarket,
+  PredictOrderType,
   PredictPosition,
   PredictPositionStatus,
   PredictPriceHistoryPoint,
@@ -106,7 +107,7 @@ import {
 } from '../constants/flags';
 import { filterSupportedLeagues } from '../constants/sports';
 import {
-  PredictFeeCollection,
+  PredictFeatureFlags,
   PredictLiveSportsFlag,
   PredictMarketHighlightsFlag,
 } from '../types/flags';
@@ -327,7 +328,9 @@ export class PredictController extends BaseController<
       state: { ...getDefaultPredictControllerState(), ...state },
     });
 
-    this.provider = new PolymarketProvider();
+    this.provider = new PolymarketProvider({
+      getFeatureFlags: () => this.resolveFeatureFlags(),
+    });
 
     this.messenger.subscribe(
       'TransactionController:transactionStatusUpdated',
@@ -410,6 +413,51 @@ export class PredictController extends BaseController<
     };
   }
 
+  private resolveFeatureFlags(): PredictFeatureFlags {
+    const remoteFeatureFlagState = this.messenger.call(
+      'RemoteFeatureFlagController:getState',
+    );
+    const flags = remoteFeatureFlagState.remoteFeatureFlags;
+
+    const liveSportsFlag =
+      unwrapRemoteFeatureFlag<PredictLiveSportsFlag>(flags.predictLiveSports) ??
+      DEFAULT_LIVE_SPORTS_FLAG;
+    const liveSportsLeagues = liveSportsFlag.enabled
+      ? filterSupportedLeagues(liveSportsFlag.leagues ?? [])
+      : [];
+
+    const rawMarketHighlightsFlag =
+      unwrapRemoteFeatureFlag<PredictMarketHighlightsFlag>(
+        flags.predictMarketHighlights,
+      );
+    const isHighlightsFlagValid = validatedVersionGatedFeatureFlag(
+      rawMarketHighlightsFlag as unknown as VersionGatedFeatureFlag,
+    );
+    const marketHighlightsFlag =
+      isHighlightsFlagValid && rawMarketHighlightsFlag
+        ? rawMarketHighlightsFlag
+        : DEFAULT_MARKET_HIGHLIGHTS_FLAG;
+
+    const feeCollection =
+      unwrapRemoteFeatureFlag<PredictFeatureFlags['feeCollection']>(
+        flags.predictFeeCollection,
+      ) ?? DEFAULT_FEE_COLLECTION_FLAG;
+
+    const fakOrdersEnabled =
+      validatedVersionGatedFeatureFlag(
+        unwrapRemoteFeatureFlag<VersionGatedFeatureFlag>(
+          flags.predictFakOrders,
+        ),
+      ) ?? false;
+
+    return {
+      feeCollection,
+      liveSportsLeagues,
+      marketHighlightsFlag,
+      fakOrdersEnabled,
+    };
+  }
+
   private getEvmAccountAddress(): string {
     const accounts = this.messenger.call(
       'AccountTreeController:getAccountsFromSelectedAccountGroup',
@@ -467,58 +515,28 @@ export class PredictController extends BaseController<
     });
 
     try {
-      const remoteFeatureFlagState = this.messenger.call(
-        'RemoteFeatureFlagController:getState',
-      );
-      const liveSportsFlag =
-        unwrapRemoteFeatureFlag<PredictLiveSportsFlag>(
-          remoteFeatureFlagState.remoteFeatureFlags.predictLiveSports,
-        ) ?? DEFAULT_LIVE_SPORTS_FLAG;
-
-      const liveSportsLeagues = liveSportsFlag.enabled
-        ? filterSupportedLeagues(liveSportsFlag.leagues ?? [])
-        : [];
-
-      const rawMarketHighlightsFlag =
-        unwrapRemoteFeatureFlag<PredictMarketHighlightsFlag>(
-          remoteFeatureFlagState.remoteFeatureFlags.predictMarketHighlights,
-        );
-
-      const isHighlightsFlagValid = validatedVersionGatedFeatureFlag(
-        rawMarketHighlightsFlag as unknown as VersionGatedFeatureFlag,
-      );
+      const featureFlags = this.resolveFeatureFlags();
 
-      const marketHighlightsFlag: PredictMarketHighlightsFlag =
-        isHighlightsFlagValid && rawMarketHighlightsFlag
-          ? rawMarketHighlightsFlag
-          : DEFAULT_MARKET_HIGHLIGHTS_FLAG;
-
-      const paramsWithLiveSports = { ...params, liveSportsLeagues };
-
-      const allMarkets = await this.provider.getMarkets(paramsWithLiveSports);
+      const allMarkets = await this.provider.getMarkets(params);
 
       let markets = allMarkets.filter(
         (market): market is PredictMarket => market !== undefined,
       );
 
       const isFirstPage = !params.offset || params.offset === 0;
+      const highlights = featureFlags.marketHighlightsFlag.highlights ?? [];
       const shouldFetchHighlights =
-        isHighlightsFlagValid && isFirstPage && params.category && !params.q;
+        highlights.length > 0 && isFirstPage && params.category && !params.q;
 
       if (shouldFetchHighlights) {
         const highlightedMarketIds =
-          (marketHighlightsFlag.highlights ?? []).find(
-            (h) => h.category === params.category,
-          )?.markets ?? [];
+          highlights.find((h) => h.category === params.category)?.markets ?? [];
 
         if (highlightedMarketIds.length > 0) {
           const provider = this.provider;
 
           const fetchedHighlightedMarkets =
-            (await provider.getMarketsByIds?.(
-              highlightedMarketIds,
-              liveSportsLeagues,
-            )) ?? [];
+            (await provider.getMarketsByIds?.(highlightedMarketIds)) ?? [];
 
           const highlightedMarkets = fetchedHighlightedMarkets.filter(
             (market) => market.status === 'open',
@@ -608,21 +626,8 @@ export class PredictController extends BaseController<
 
     try {
       const provider = this.provider;
-
-      const remoteFeatureFlagState = this.messenger.call(
-        'RemoteFeatureFlagController:getState',
-      );
-      const liveSportsFlag =
-        unwrapRemoteFeatureFlag<PredictLiveSportsFlag>(
-          remoteFeatureFlagState.remoteFeatureFlags.predictLiveSports,
-        ) ?? DEFAULT_LIVE_SPORTS_FLAG;
-      const liveSportsLeagues = liveSportsFlag.enabled
-        ? filterSupportedLeagues(liveSportsFlag.leagues ?? [])
-        : [];
-
       const market = await provider.getMarketDetails({
         marketId: resolvedMarketId,
-        liveSportsLeagues,
       });
 
       this.update((state) => {
@@ -1042,6 +1047,7 @@ export class PredictController extends BaseController<
     failureReason,
     sharePrice,
     pnl,
+    orderType,
   }: {
     status: PredictTradeStatusValue;
     amountUsd?: number;
@@ -1050,6 +1056,7 @@ export class PredictController extends BaseController<
     failureReason?: string;
     sharePrice?: number;
     pnl?: number;
+    orderType?: PredictOrderType;
   }): Promise<void> {
     if (!analyticsProperties) {
       return;
@@ -1103,6 +1110,9 @@ export class PredictController extends BaseController<
       ...(analyticsProperties.gameClock && {
         [PredictEventProperties.GAME_CLOCK]: analyticsProperties.gameClock,
       }),
+      ...(orderType && {
+        [PredictEventProperties.ORDER_TYPE]: orderType,
+      }),
     };
 
     // Build sensitive properties
@@ -1370,17 +1380,9 @@ export class PredictController extends BaseController<
     try {
       const provider = this.provider;
 
-      const remoteFeatureFlagState = this.messenger.call(
-        'RemoteFeatureFlagController:getState',
-      );
-      const feeCollection =
-        unwrapRemoteFeatureFlag<PredictFeeCollection>(
-          remoteFeatureFlagState.remoteFeatureFlags.predictFeeCollection,
-        ) ?? DEFAULT_FEE_COLLECTION_FLAG;
-
       const signer = this.getSigner();
 
-      return provider.previewOrder({ ...params, signer, feeCollection });
+      return provider.previewOrder({ ...params, signer });
     } catch (error) {
       // Log to Sentry with preview context (no sensitive amounts)
       Logger.error(
@@ -1440,6 +1442,7 @@ export class PredictController extends BaseController<
         amountUsd,
         analyticsProperties,
         sharePrice,
+        orderType: preview.orderType,
       });
 
       // Invalidate query cache (to avoid nonce issues)
@@ -1500,6 +1503,7 @@ export class PredictController extends BaseController<
         analyticsProperties,
         completionDuration,
         sharePrice: realSharePrice,
+        orderType: preview.orderType,
       });
 
       traceData = { success: true, side: preview.side };
@@ -1519,6 +1523,7 @@ export class PredictController extends BaseController<
         sharePrice,
         completionDuration,
         failureReason: errorMessage,
+        orderType: preview.orderType,
       });
 
       // Update error state for Sentry integration
diff --git a/app/components/UI/Predict/hooks/usePredictPlaceOrder.ts b/app/components/UI/Predict/hooks/usePredictPlaceOrder.ts
index d6b9c75ad537..d3a902e9de90 100644
--- a/app/components/UI/Predict/hooks/usePredictPlaceOrder.ts
+++ b/app/components/UI/Predict/hooks/usePredictPlaceOrder.ts
@@ -194,6 +194,10 @@ export function usePredictPlaceOrder(
           queryKey: predictQueries.activity.keys.all(),
         });
 
+        queryClient.invalidateQueries({
+          queryKey: predictQueries.unrealizedPnL.keys.all(),
+        });
+
         if (side === Side.BUY) {
           showOrderPlacedToast();
         } else {
diff --git a/app/components/UI/Predict/hooks/usePredictToastRegistrations.test.tsx b/app/components/UI/Predict/hooks/usePredictToastRegistrations.test.tsx
index 2c3401d2218e..ef8a52f8623d 100644
--- a/app/components/UI/Predict/hooks/usePredictToastRegistrations.test.tsx
+++ b/app/components/UI/Predict/hooks/usePredictToastRegistrations.test.tsx
@@ -189,6 +189,11 @@ describe('usePredictToastRegistrations', () => {
           queryKey: ['predict', 'balance'],
         }),
       );
+      expect(mockInvalidateQueries).toHaveBeenCalledWith(
+        expect.objectContaining({
+          queryKey: ['predict', 'unrealizedPnL'],
+        }),
+      );
     });
 
     it('uses account ready fallback when deposit confirmed amount is missing', () => {
@@ -335,6 +340,11 @@ describe('usePredictToastRegistrations', () => {
           queryKey: ['predict', 'balance'],
         }),
       );
+      expect(mockInvalidateQueries).toHaveBeenCalledWith(
+        expect.objectContaining({
+          queryKey: ['predict', 'unrealizedPnL'],
+        }),
+      );
     });
 
     it('shows error toast with retry on failed status', async () => {
@@ -429,6 +439,11 @@ describe('usePredictToastRegistrations', () => {
           queryKey: ['predict', 'balance'],
         }),
       );
+      expect(mockInvalidateQueries).toHaveBeenCalledWith(
+        expect.objectContaining({
+          queryKey: ['predict', 'unrealizedPnL'],
+        }),
+      );
     });
 
     it('uses payload amount for withdraw success toast when state amount is unavailable', () => {
diff --git a/app/components/UI/Predict/hooks/usePredictToastRegistrations.tsx b/app/components/UI/Predict/hooks/usePredictToastRegistrations.tsx
index cc82bb50ee0a..1e31f256e3f0 100644
--- a/app/components/UI/Predict/hooks/usePredictToastRegistrations.tsx
+++ b/app/components/UI/Predict/hooks/usePredictToastRegistrations.tsx
@@ -161,6 +161,10 @@ export const usePredictToastRegistrations = (): ToastRegistration[] => {
         queryClient.invalidateQueries({
           queryKey: predictQueries.activity.keys.all(),
         });
+
+        queryClient.invalidateQueries({
+          queryKey: predictQueries.unrealizedPnL.keys.all(),
+        });
       }
 
       if (type === 'deposit') {
diff --git a/app/components/UI/Predict/hooks/useUnrealizedPnL.test.tsx b/app/components/UI/Predict/hooks/useUnrealizedPnL.test.tsx
index d7fb53f8e6cc..2bc2f950ad42 100644
--- a/app/components/UI/Predict/hooks/useUnrealizedPnL.test.tsx
+++ b/app/components/UI/Predict/hooks/useUnrealizedPnL.test.tsx
@@ -1,20 +1,15 @@
-import { act, renderHook, waitFor } from '@testing-library/react-native';
+import React from 'react';
+import { renderHook, waitFor } from '@testing-library/react-native';
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 import { useUnrealizedPnL } from './useUnrealizedPnL';
 import { UnrealizedPnL } from '../types';
-import { usePredictPositions } from './usePredictPositions';
 
 const mockSelectedAddress = '0x1234567890123456789012345678901234567890';
-jest.mock('react-redux', () => ({
-  useSelector: jest.fn(() => mockSelectedAddress),
-}));
 
-jest.mock('@react-navigation/native', () => ({
-  useFocusEffect: jest.fn(),
+jest.mock('react-redux', () => ({
+  useSelector: jest.fn(() => 'mock-account-group-id'),
 }));
 
-jest.mock('./usePredictPositions');
-const mockUsePredictPositions = usePredictPositions as jest.Mock;
-
 const mockGetUnrealizedPnL = jest.fn();
 
 jest.mock('../../../../core/SDKConnect/utils/DevLogger', () => ({
@@ -44,6 +39,15 @@ jest.mock('../../../../core/Engine', () => ({
   },
 }));
 
+const createWrapper = () => {
+  const queryClient = new QueryClient({
+    defaultOptions: { queries: { retry: false } },
+  });
+  const Wrapper = ({ children }: { children: React.ReactNode }) =>
+    React.createElement(QueryClientProvider, { client: queryClient }, children);
+  return { Wrapper, queryClient };
+};
+
 describe('useUnrealizedPnL', () => {
   const basePnL: UnrealizedPnL = {
     user: '0x1111111111111111111111111111111111111111',
@@ -53,255 +57,86 @@ describe('useUnrealizedPnL', () => {
 
   beforeEach(() => {
     jest.clearAllMocks();
-    mockUsePredictPositions.mockReturnValue({
-      data: [{ id: 'position-1' }],
-    });
   });
 
-  afterEach(() => {
-    jest.clearAllMocks();
-  });
-
-  it('returns initial state when disabled', () => {
-    const { result } = renderHook(() =>
-      useUnrealizedPnL({ loadOnMount: false }),
-    );
+  it('does not fetch when enabled is false', () => {
+    const { Wrapper } = createWrapper();
+    const { result } = renderHook(() => useUnrealizedPnL({ enabled: false }), {
+      wrapper: Wrapper,
+    });
 
-    expect(result.current.unrealizedPnL).toBeNull();
-    expect(result.current.isLoading).toBe(true);
+    expect(result.current.data).toBeUndefined();
+    expect(result.current.isLoading).toBe(false);
     expect(result.current.error).toBeNull();
-    expect(typeof result.current.loadUnrealizedPnL).toBe('function');
     expect(mockGetUnrealizedPnL).not.toHaveBeenCalled();
   });
 
   it('fetches unrealized P&L successfully with default options', async () => {
+    const { Wrapper } = createWrapper();
     mockGetUnrealizedPnL.mockResolvedValue(basePnL);
 
-    const { result } = renderHook(() => useUnrealizedPnL());
+    const { result } = renderHook(() => useUnrealizedPnL(), {
+      wrapper: Wrapper,
+    });
 
     await waitFor(() => {
       expect(result.current.isLoading).toBe(false);
-      expect(result.current.unrealizedPnL).toEqual(basePnL);
-      expect(result.current.error).toBeNull();
     });
 
+    expect(result.current.data).toEqual(basePnL);
+    expect(result.current.error).toBeNull();
     expect(mockGetUnrealizedPnL).toHaveBeenCalledWith({
       address: mockSelectedAddress,
     });
   });
 
-  it('passes provided options to getUnrealizedPnL', async () => {
+  it('uses provided address instead of selected account', async () => {
+    const { Wrapper } = createWrapper();
     mockGetUnrealizedPnL.mockResolvedValue(basePnL);
+    const customAddress = '0x2222222222222222222222222222222222222222';
 
-    const { result } = renderHook(() =>
-      useUnrealizedPnL({
-        address: '0x2222222222222222222222222222222222222222',
-      }),
+    const { result } = renderHook(
+      () => useUnrealizedPnL({ address: customAddress }),
+      { wrapper: Wrapper },
     );
 
     await waitFor(() => {
-      expect(result.current.unrealizedPnL).toEqual(basePnL);
+      expect(result.current.data).toEqual(basePnL);
     });
 
     expect(mockGetUnrealizedPnL).toHaveBeenCalledWith({
-      address: '0x2222222222222222222222222222222222222222',
+      address: customAddress,
     });
   });
 
-  it('handles null responses by clearing the data', async () => {
+  it('handles null responses', async () => {
+    const { Wrapper } = createWrapper();
     mockGetUnrealizedPnL.mockResolvedValue(null);
 
-    const { result } = renderHook(() => useUnrealizedPnL());
-
-    await waitFor(() => {
-      expect(result.current.unrealizedPnL).toBeNull();
-      expect(result.current.error).toBeNull();
-      expect(result.current.isLoading).toBe(false);
+    const { result } = renderHook(() => useUnrealizedPnL(), {
+      wrapper: Wrapper,
     });
-  });
-
-  it('surfaces errors thrown by getUnrealizedPnL', async () => {
-    mockGetUnrealizedPnL.mockRejectedValue(new Error('Network error'));
-
-    const { result } = renderHook(() => useUnrealizedPnL());
 
     await waitFor(() => {
-      expect(result.current.error).toBe('Network error');
-      expect(result.current.unrealizedPnL).toBeNull();
       expect(result.current.isLoading).toBe(false);
     });
-  });
-
-  it('maps non-Error rejections to a generic message', async () => {
-    mockGetUnrealizedPnL.mockRejectedValue('bad times');
-
-    const { result } = renderHook(() => useUnrealizedPnL());
 
-    await waitFor(() => {
-      expect(result.current.error).toBe('Failed to fetch unrealized P&L');
-    });
-  });
-
-  it('supports manual refetching', async () => {
-    mockGetUnrealizedPnL.mockResolvedValue(basePnL);
-
-    const updatedPnL: UnrealizedPnL = {
-      user: '0x9999999999999999999999999999999999999999',
-      cashUpnl: -5,
-      percentUpnl: -2,
-    };
-
-    const { result } = renderHook(() => useUnrealizedPnL());
-
-    await waitFor(() => {
-      expect(result.current.unrealizedPnL).toEqual(basePnL);
-    });
-
-    mockGetUnrealizedPnL.mockResolvedValue(updatedPnL);
-
-    await act(async () => {
-      await result.current.loadUnrealizedPnL();
-    });
-
-    await waitFor(() => {
-      expect(result.current.unrealizedPnL).toEqual(updatedPnL);
-      expect(result.current.error).toBeNull();
-    });
-
-    expect(mockGetUnrealizedPnL).toHaveBeenCalledTimes(2);
-  });
-
-  it('loads data when loadOnMount changes from false to true', async () => {
-    mockGetUnrealizedPnL.mockResolvedValue(basePnL);
-
-    const { result, rerender } = renderHook(
-      ({ loadOnMount }) => useUnrealizedPnL({ loadOnMount }),
-      {
-        initialProps: { loadOnMount: false },
-      },
-    );
-
-    expect(mockGetUnrealizedPnL).not.toHaveBeenCalled();
-
-    rerender({ loadOnMount: true });
-
-    await waitFor(() => {
-      expect(result.current.unrealizedPnL).toEqual(basePnL);
-      expect(result.current.isLoading).toBe(false);
-    });
+    expect(result.current.data).toBeNull();
+    expect(result.current.error).toBeNull();
   });
 
-  it('refetches when dependencies change', async () => {
-    mockGetUnrealizedPnL.mockResolvedValue(basePnL);
-
-    const { rerender } = renderHook(
-      ({ address }: { address?: string }) => useUnrealizedPnL({ address }),
-      {
-        initialProps: {
-          address: '0xaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa',
-        },
-      },
-    );
-
-    await waitFor(() => {
-      expect(mockGetUnrealizedPnL).toHaveBeenCalledTimes(1);
-    });
+  it('surfaces errors thrown by getUnrealizedPnL', async () => {
+    const { Wrapper } = createWrapper();
+    mockGetUnrealizedPnL.mockRejectedValue(new Error('Network error'));
 
-    rerender({
-      address: '0xbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb',
+    const { result } = renderHook(() => useUnrealizedPnL(), {
+      wrapper: Wrapper,
     });
 
     await waitFor(() => {
-      expect(mockGetUnrealizedPnL).toHaveBeenCalledTimes(2);
-    });
-
-    expect(mockGetUnrealizedPnL).toHaveBeenNthCalledWith(1, {
-      address: '0xaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa',
-    });
-    expect(mockGetUnrealizedPnL).toHaveBeenNthCalledWith(2, {
-      address: '0xbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb',
-    });
-  });
-
-  describe('positions-based visibility', () => {
-    it('returns null when user has no positions', async () => {
-      mockUsePredictPositions.mockReturnValue({ data: [] });
-      mockGetUnrealizedPnL.mockResolvedValue(basePnL);
-
-      const { result } = renderHook(() => useUnrealizedPnL());
-
-      await waitFor(() => {
-        expect(result.current.isLoading).toBe(false);
-      });
-
-      expect(result.current.unrealizedPnL).toBeNull();
-      expect(result.current.error).toBeNull();
-    });
-
-    it('returns unrealized P&L when user has positions', async () => {
-      mockUsePredictPositions.mockReturnValue({
-        data: [{ id: 'position-1' }, { id: 'position-2' }],
-      });
-      mockGetUnrealizedPnL.mockResolvedValue(basePnL);
-
-      const { result } = renderHook(() => useUnrealizedPnL());
-
-      await waitFor(() => {
-        expect(result.current.isLoading).toBe(false);
-      });
-
-      expect(result.current.unrealizedPnL).toEqual(basePnL);
-      expect(result.current.error).toBeNull();
-    });
-
-    it('calls usePredictPositions with claimable: false', () => {
-      mockGetUnrealizedPnL.mockResolvedValue(basePnL);
-
-      renderHook(() => useUnrealizedPnL());
-
-      expect(mockUsePredictPositions).toHaveBeenCalledWith({
-        claimable: false,
-      });
-    });
-
-    it('returns null when getUnrealizedPnL returns null and user has positions', async () => {
-      mockGetUnrealizedPnL.mockResolvedValue(null);
-
-      const { result } = renderHook(() => useUnrealizedPnL());
-
-      await waitFor(() => {
-        expect(result.current.isLoading).toBe(false);
-      });
-
-      expect(result.current.unrealizedPnL).toBeNull();
-      expect(result.current.error).toBeNull();
-    });
-
-    it('returns null when both getUnrealizedPnL returns null and no positions', async () => {
-      mockUsePredictPositions.mockReturnValue({ data: [] });
-      mockGetUnrealizedPnL.mockResolvedValue(null);
-
-      const { result } = renderHook(() => useUnrealizedPnL());
-
-      await waitFor(() => {
-        expect(result.current.isLoading).toBe(false);
-      });
-
-      expect(result.current.unrealizedPnL).toBeNull();
-      expect(result.current.error).toBeNull();
-    });
-
-    it('returns null when positions data is undefined', async () => {
-      mockUsePredictPositions.mockReturnValue({ data: undefined });
-      mockGetUnrealizedPnL.mockResolvedValue(basePnL);
-
-      const { result } = renderHook(() => useUnrealizedPnL());
-
-      await waitFor(() => {
-        expect(result.current.isLoading).toBe(false);
-      });
-
-      expect(result.current.unrealizedPnL).toBeNull();
+      expect(result.current.error?.message).toBe('Network error');
     });
+    expect(result.current.data).toBeUndefined();
+    expect(result.current.isLoading).toBe(false);
   });
 });
diff --git a/app/components/UI/Predict/hooks/useUnrealizedPnL.tsx b/app/components/UI/Predict/hooks/useUnrealizedPnL.tsx
index ebd8639288e6..8edf311c57c8 100644
--- a/app/components/UI/Predict/hooks/useUnrealizedPnL.tsx
+++ b/app/components/UI/Predict/hooks/useUnrealizedPnL.tsx
@@ -1,156 +1,63 @@
-import { useFocusEffect } from '@react-navigation/native';
+import { useEffect } from 'react';
+import { useQuery, type UseQueryResult } from '@tanstack/react-query';
 import { useSelector } from 'react-redux';
-import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
-import { DevLogger } from '../../../../core/SDKConnect/utils/DevLogger';
 import Logger from '../../../../util/Logger';
-import Engine from '../../../../core/Engine';
-import { UnrealizedPnL } from '../types';
-import { getEvmAccountFromSelectedAccountGroup } from '../utils/accounts';
 import { PREDICT_CONSTANTS } from '../constants/errors';
-import { ensureError } from '../utils/predictErrorHandler';
+import { getEvmAccountFromSelectedAccountGroup } from '../utils/accounts';
+import { predictQueries } from '../queries';
 import { selectSelectedAccountGroupId } from '../../../../selectors/multichainAccounts/accountTreeController';
-import { usePredictPositions } from './usePredictPositions';
+import type { UnrealizedPnL } from '../types';
+import { ensureError } from '../utils/predictErrorHandler';
 
-export interface UseUnrealizedPnLOptions {
+interface UseUnrealizedPnLOptions {
   /**
-   * The address to fetch unrealized P&L for
+   * The address to fetch unrealized P&L for.
+   * Defaults to the EVM address from the currently selected account group.
    */
   address?: string;
   /**
-   * Whether to load unrealized P&L on mount
-   * @default true
-   */
-  loadOnMount?: boolean;
-  /**
-   * Whether to refresh unrealized P&L when screen comes into focus
+   * Whether to enable the query.
    * @default true
    */
-  refreshOnFocus?: boolean;
-}
-
-export interface UseUnrealizedPnLResult {
-  unrealizedPnL: UnrealizedPnL | null;
-  isLoading: boolean;
-  isRefreshing: boolean;
-  error: string | null;
-  loadUnrealizedPnL: (options?: { isRefresh?: boolean }) => Promise<void>;
+  enabled?: boolean;
 }
 
 /**
- * Hook for managing unrealized P&L data with loading states
- * @param options Configuration options for the hook
- * @returns Unrealized P&L data and loading utilities
+ * Hook to fetch unrealized P&L data for the current account
  */
-export const useUnrealizedPnL = (
+export function useUnrealizedPnL(
   options: UseUnrealizedPnLOptions = {},
-): UseUnrealizedPnLResult => {
-  const { address, loadOnMount = true, refreshOnFocus = true } = options;
-
-  const [pnlData, setPnlData] = useState<UnrealizedPnL | null>(null);
-  const [isLoading, setIsLoading] = useState(true);
-  const [isRefreshing, setIsRefreshing] = useState(false);
-  const [error, setError] = useState<string | null>(null);
-  const isInitialMount = useRef(true);
+): UseQueryResult<UnrealizedPnL | null, Error> {
+  const { address, enabled = true } = options;
 
   // Subscribe to account group changes so the hook re-renders when the user switches accounts
   useSelector(selectSelectedAccountGroupId);
   const evmAccount = getEvmAccountFromSelectedAccountGroup();
-  const selectedInternalAccountAddress = evmAccount?.address ?? '0x0';
-
-  const { data: activePositions } = usePredictPositions({ claimable: false });
-  const hasPositions = (activePositions?.length ?? 0) > 0;
-
-  const loadUnrealizedPnL = useCallback(
-    async (loadOptions?: { isRefresh?: boolean }) => {
-      const { isRefresh = false } = loadOptions || {};
+  const resolvedAddress = address ?? evmAccount?.address ?? '0x0';
 
-      try {
-        if (isRefresh) {
-          setIsRefreshing(true);
-        } else {
-          setIsLoading(true);
-        }
-        setError(null);
+  const queryResult = useQuery({
+    ...predictQueries.unrealizedPnL.options({ address: resolvedAddress }),
+    enabled,
+  });
 
-        const unrealizedPnLResult =
-          await Engine.context.PredictController.getUnrealizedPnL({
-            address: address ?? selectedInternalAccountAddress,
-          });
-
-        setPnlData(unrealizedPnLResult ?? null);
-
-        DevLogger.log('useUnrealizedPnL: Loaded unrealized P&L', {
-          unrealizedPnL: unrealizedPnLResult,
-        });
-      } catch (err) {
-        const errorMessage =
-          err instanceof Error ? err.message : 'Failed to fetch unrealized P&L';
-        setError(errorMessage);
-        setPnlData(null);
-        DevLogger.log('useUnrealizedPnL: Error loading unrealized P&L', err);
-
-        Logger.error(ensureError(err), {
-          tags: {
-            feature: PREDICT_CONSTANTS.FEATURE_NAME,
-            component: 'useUnrealizedPnL',
-          },
-          context: {
-            name: 'useUnrealizedPnL',
-            data: {
-              method: 'loadUnrealizedPnL',
-              action: 'unrealized_pnl_load',
-              operation: 'data_fetching',
-            },
-          },
-        });
-      } finally {
-        setIsLoading(false);
-        setIsRefreshing(false);
-      }
-    },
-    [address, selectedInternalAccountAddress],
-  );
-
-  // Load unrealized P&L on mount if enabled
   useEffect(() => {
-    if (loadOnMount) {
-      loadUnrealizedPnL();
-    }
-    // eslint-disable-next-line react-compiler/react-compiler
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [loadOnMount]);
-
-  // Refresh unrealized P&L when screen comes into focus if enabled
-  useFocusEffect(
-    useCallback(() => {
-      if (refreshOnFocus) {
-        loadUnrealizedPnL({ isRefresh: true });
-      }
-    }, [refreshOnFocus, loadUnrealizedPnL]),
-  );
-
-  // Reset and reload data when address changes (but not on initial mount)
-  useEffect(() => {
-    if (isInitialMount.current) {
-      isInitialMount.current = false;
-      return;
-    }
-
-    setPnlData(null);
-    setError(null);
-    loadUnrealizedPnL();
-  }, [address, loadUnrealizedPnL]);
-
-  const unrealizedPnL = useMemo(
-    () => (hasPositions ? pnlData : null),
-    [hasPositions, pnlData],
-  );
-
-  return {
-    unrealizedPnL,
-    isLoading,
-    isRefreshing,
-    error,
-    loadUnrealizedPnL,
-  };
-};
+    if (!queryResult.error) return;
+
+    Logger.error(ensureError(queryResult.error), {
+      tags: {
+        feature: PREDICT_CONSTANTS.FEATURE_NAME,
+        component: 'useUnrealizedPnL',
+      },
+      context: {
+        name: 'useUnrealizedPnL',
+        data: {
+          method: 'queryFn',
+          action: 'unrealized_pnl_load',
+          operation: 'data_fetching',
+        },
+      },
+    });
+  }, [queryResult.error]);
+
+  return queryResult;
+}
diff --git a/app/components/UI/Predict/providers/polymarket/PolymarketProvider.test.ts b/app/components/UI/Predict/providers/polymarket/PolymarketProvider.test.ts
index 566c54511d5f..39026559732a 100644
--- a/app/components/UI/Predict/providers/polymarket/PolymarketProvider.test.ts
+++ b/app/components/UI/Predict/providers/polymarket/PolymarketProvider.test.ts
@@ -40,16 +40,19 @@ import {
 } from '../../types';
 import { PREDICT_ERROR_CODES } from '../../constants/errors';
 import { DEFAULT_FEE_COLLECTION_FLAG } from '../../constants/flags';
+import type { PredictFeatureFlags } from '../../types/flags';
 import { OrderPreview, PlaceOrderParams } from '../types';
 import { PolymarketProvider } from './PolymarketProvider';
 import {
   computeProxyAddress,
+  createPermit2FeeAuthorization,
   createSafeFeeAuthorization,
   getClaimTransaction,
   getDeployProxyWalletTransaction,
   getProxyWalletAllowancesTransaction,
   hasAllowances,
 } from './safe/utils';
+import { PERMIT2_ADDRESS } from './safe/constants';
 import {
   createApiKey,
   encodeClaim,
@@ -114,6 +117,7 @@ jest.mock('./utils', () => {
 
 jest.mock('./safe/utils', () => ({
   computeProxyAddress: jest.fn(),
+  createPermit2FeeAuthorization: jest.fn(),
   createSafeFeeAuthorization: jest.fn(),
   getClaimTransaction: jest.fn(),
   getDeployProxyWalletTransaction: jest.fn(),
@@ -208,6 +212,8 @@ const mockCreateApiKey = createApiKey as jest.Mock;
 const mockSubmitClobOrder = submitClobOrder as jest.Mock;
 const mockEncodeClaim = encodeClaim as jest.Mock;
 const mockComputeProxyAddress = computeProxyAddress as jest.Mock;
+const mockCreatePermit2FeeAuthorization =
+  createPermit2FeeAuthorization as jest.Mock;
 const mockCreateSafeFeeAuthorization = createSafeFeeAuthorization as jest.Mock;
 const mockGetClaimTransaction = getClaimTransaction as jest.Mock;
 const mockHasAllowances = hasAllowances as jest.Mock;
@@ -216,7 +222,25 @@ const mockPreviewOrder = previewOrder as jest.Mock;
 const mockGetBalance = getBalance as jest.Mock;
 
 describe('PolymarketProvider', () => {
-  const createProvider = () => new PolymarketProvider();
+  const defaultFeatureFlags: PredictFeatureFlags = {
+    feeCollection: DEFAULT_FEE_COLLECTION_FLAG,
+    liveSportsLeagues: [],
+    marketHighlightsFlag: {
+      enabled: false,
+      highlights: [],
+      minimumVersion: '7.64.0',
+    },
+    fakOrdersEnabled: false,
+  };
+  const createProvider = (
+    featureFlagsOverride?: Partial<PredictFeatureFlags>,
+  ) =>
+    new PolymarketProvider({
+      getFeatureFlags: () => ({
+        ...defaultFeatureFlags,
+        ...featureFlagsOverride,
+      }),
+    });
 
   it('exposes the correct providerId', () => {
     const provider = createProvider();
@@ -224,8 +248,6 @@ describe('PolymarketProvider', () => {
   });
 
   it('getMarkets returns an array with some length', async () => {
-    const provider = createProvider();
-
     const mockMarkets = [
       {
         id: 'market-1',
@@ -279,7 +301,9 @@ describe('PolymarketProvider', () => {
 
     mockGetMarketsFromPolymarketApi.mockResolvedValue(mockMarkets);
 
-    const markets = await provider.getMarkets({ liveSportsLeagues: ['nfl'] });
+    const markets = await createProvider({
+      liveSportsLeagues: ['nfl'],
+    }).getMarkets();
     expect(Array.isArray(markets)).toBe(true);
     expect(markets.length).toBeGreaterThan(0);
     expect(markets.length).toBe(2);
@@ -289,11 +313,12 @@ describe('PolymarketProvider', () => {
   });
 
   it('getMarkets returns empty array when API fails', async () => {
-    const provider = createProvider();
     const apiError = new Error('API request failed');
     mockGetMarketsFromPolymarketApi.mockRejectedValue(apiError);
 
-    const result = await provider.getMarkets({ liveSportsLeagues: ['nfl'] });
+    const result = await createProvider({
+      liveSportsLeagues: ['nfl'],
+    }).getMarkets();
 
     expect(result).toEqual([]);
     expect(mockGetMarketsFromPolymarketApi).toHaveBeenCalledWith(
@@ -810,7 +835,9 @@ describe('PolymarketProvider', () => {
   }
 
   // Helper function to setup place order test environment
-  function setupPlaceOrderTest() {
+  function setupPlaceOrderTest(
+    featureFlagsOverride?: Partial<PredictFeatureFlags>,
+  ) {
     const mockAddress = '0x1234567890123456789012345678901234567890';
     const mockSigner = {
       address: mockAddress,
@@ -818,7 +845,7 @@ describe('PolymarketProvider', () => {
       signPersonalMessage: mockSignPersonalMessage,
     };
 
-    const provider = createProvider();
+    const provider = createProvider(featureFlagsOverride);
 
     const mockMarket = {
       id: 'market-1',
@@ -860,6 +887,21 @@ describe('PolymarketProvider', () => {
         sig: '0xsig',
       },
     });
+    mockCreatePermit2FeeAuthorization.mockResolvedValue({
+      type: 'safe-permit2',
+      authorization: {
+        permit: {
+          permitted: {
+            token: '0xCollateralAddress',
+            amount: '40000',
+          },
+          nonce: '0',
+          deadline: '1700000000',
+        },
+        spender: '0x1111111111111111111111111111111111111111',
+        signature: '0xpermit2sig',
+      },
+    });
 
     mockPriceValid.mockReturnValue(true);
 
@@ -1317,26 +1359,90 @@ describe('PolymarketProvider', () => {
   });
 
   describe('previewOrder', () => {
+    beforeEach(() => {
+      jest.clearAllMocks();
+    });
+
+    const createPreviewSigner = () => ({
+      address: '0x1234567890123456789012345678901234567890',
+      signTypedMessage: jest.fn(),
+      signPersonalMessage: jest.fn(),
+    });
+
+    const createPreviewOrderParams = () => ({
+      marketId: 'market-123',
+      outcomeId: 'outcome-456',
+      outcomeTokenId: 'token-789',
+      side: Side.BUY,
+      size: 100,
+      signer: createPreviewSigner(),
+    });
+
+    const createPermit2PreviewProvider = (fakOrdersEnabled: boolean) =>
+      createProvider({
+        feeCollection: {
+          ...DEFAULT_FEE_COLLECTION_FLAG,
+          permit2Enabled: true,
+          executors: ['0xexecutor1'],
+        },
+        fakOrdersEnabled,
+      });
+
+    const mockPreviewOrderWithFees = () => {
+      mockPreviewOrder.mockResolvedValue({
+        fees: {
+          totalFee: 1,
+          metamaskFee: 0.5,
+          providerFee: 0.5,
+          totalFeePercentage: 1,
+          collector: DEFAULT_FEE_COLLECTION_FLAG.collector,
+        },
+      });
+    };
+
     it('calls previewOrder utility function with correct parameters', async () => {
       const provider = createProvider();
-      const mockSigner = {
-        address: '0x1234567890123456789012345678901234567890',
-        signTypedMessage: jest.fn(),
-        signPersonalMessage: jest.fn(),
-      };
       const mockParams = {
-        marketId: 'market-123',
-        outcomeId: 'outcome-456',
-        outcomeTokenId: 'token-789',
-        side: Side.BUY,
+        ...createPreviewOrderParams(),
         amount: 100,
-        size: 100,
-        signer: mockSigner,
       };
 
       await provider.previewOrder(mockParams);
 
-      expect(mockPreviewOrder).toHaveBeenCalledWith(mockParams);
+      expect(mockPreviewOrder).toHaveBeenCalledWith({
+        ...mockParams,
+        feeCollection: DEFAULT_FEE_COLLECTION_FLAG,
+      });
+    });
+    it('returns FOK orderType by default', async () => {
+      const provider = createProvider();
+      const result = await provider.previewOrder(createPreviewOrderParams());
+
+      expect(result.orderType).toBe('FOK');
+    });
+
+    it.each([
+      { fakOrdersEnabled: true, expectedOrderType: 'FAK' },
+      { fakOrdersEnabled: false, expectedOrderType: 'FOK' },
+    ] as const)(
+      'returns $expectedOrderType orderType when fakOrdersEnabled=$fakOrdersEnabled and permit2 config is active',
+      async ({ fakOrdersEnabled, expectedOrderType }) => {
+        mockPreviewOrderWithFees();
+        const provider = createPermit2PreviewProvider(fakOrdersEnabled);
+
+        const result = await provider.previewOrder(createPreviewOrderParams());
+
+        expect(result.orderType).toBe(expectedOrderType);
+      },
+    );
+
+    it('returns FAK orderType when fees are absent and FAK flags are enabled', async () => {
+      mockPreviewOrder.mockResolvedValue({});
+      const provider = createPermit2PreviewProvider(true);
+
+      const result = await provider.previewOrder(createPreviewOrderParams());
+
+      expect(result.orderType).toBe('FAK');
     });
   });
 
@@ -1358,7 +1464,7 @@ describe('PolymarketProvider', () => {
         signPersonalMessage: mockSignPersonalMessage,
       };
 
-      const provider = createProvider();
+      const provider = createProvider({ liveSportsLeagues: ['nfl'] });
 
       // Setup minimal mocks needed for placeOrder
       mockSignTypedMessage.mockResolvedValue('0xsignature');
@@ -1601,6 +1707,474 @@ describe('PolymarketProvider', () => {
         }),
       );
     });
+
+    it('uses Permit2 fee authorization when permit2Enabled and allowance is set', async () => {
+      jest.clearAllMocks();
+      const { provider, mockSigner } = setupPlaceOrderTest();
+      const preview = createMockOrderPreview({
+        side: Side.BUY,
+        fees: {
+          metamaskFee: 0.02,
+          providerFee: 0.02,
+          totalFee: 0.04,
+          totalFeePercentage: 0.04,
+          collector: DEFAULT_FEE_COLLECTION_FLAG.collector,
+          executors: ['0x1111111111111111111111111111111111111111'],
+          permit2Enabled: true,
+        },
+      });
+
+      await provider.placeOrder({ preview, signer: mockSigner });
+
+      expect(mockCreatePermit2FeeAuthorization).toHaveBeenCalledWith(
+        expect.objectContaining({
+          safeAddress: '0x9999999999999999999999999999999999999999',
+          spender: '0x1111111111111111111111111111111111111111',
+        }),
+      );
+      expect(mockCreateSafeFeeAuthorization).not.toHaveBeenCalled();
+      expect(mockSubmitClobOrder).toHaveBeenCalledWith(
+        expect.objectContaining({
+          executor: '0x1111111111111111111111111111111111111111',
+          feeAuthorization: expect.objectContaining({ type: 'safe-permit2' }),
+        }),
+      );
+    });
+
+    it('uses Permit2 fee authorization even when Permit2 allowance is not yet set on-chain', async () => {
+      jest.clearAllMocks();
+      const { provider, mockSigner } = setupPlaceOrderTest();
+      const preview = createMockOrderPreview({
+        side: Side.BUY,
+        fees: {
+          metamaskFee: 0.02,
+          providerFee: 0.02,
+          totalFee: 0.04,
+          totalFeePercentage: 0.04,
+          collector: DEFAULT_FEE_COLLECTION_FLAG.collector,
+          executors: ['0x1111111111111111111111111111111111111111'],
+          permit2Enabled: true,
+        },
+      });
+
+      await provider.placeOrder({ preview, signer: mockSigner });
+
+      expect(mockCreatePermit2FeeAuthorization).toHaveBeenCalled();
+      expect(mockCreateSafeFeeAuthorization).not.toHaveBeenCalled();
+    });
+
+    it('falls back to Safe fee authorization when permit2Enabled is false', async () => {
+      jest.clearAllMocks();
+      const { provider, mockSigner } = setupPlaceOrderTest();
+      const preview = createMockOrderPreview({
+        side: Side.BUY,
+        fees: {
+          metamaskFee: 0.02,
+          providerFee: 0.02,
+          totalFee: 0.04,
+          totalFeePercentage: 0.04,
+          collector: DEFAULT_FEE_COLLECTION_FLAG.collector,
+          executors: ['0x1111111111111111111111111111111111111111'],
+          permit2Enabled: false,
+        },
+      });
+
+      await provider.placeOrder({ preview, signer: mockSigner });
+
+      expect(mockCreatePermit2FeeAuthorization).not.toHaveBeenCalled();
+      expect(mockCreateSafeFeeAuthorization).toHaveBeenCalled();
+    });
+
+    it('falls back to Safe fee authorization when executors are missing', async () => {
+      jest.clearAllMocks();
+      const { provider, mockSigner } = setupPlaceOrderTest();
+      const preview = createMockOrderPreview({
+        side: Side.BUY,
+        fees: {
+          metamaskFee: 0.02,
+          providerFee: 0.02,
+          totalFee: 0.04,
+          totalFeePercentage: 0.04,
+          collector: DEFAULT_FEE_COLLECTION_FLAG.collector,
+          executors: [],
+          permit2Enabled: true,
+        },
+      });
+
+      await provider.placeOrder({ preview, signer: mockSigner });
+
+      expect(mockCreatePermit2FeeAuthorization).not.toHaveBeenCalled();
+      expect(mockCreateSafeFeeAuthorization).toHaveBeenCalled();
+    });
+
+    it('submits FOK order type when fakOrdersEnabled is false', async () => {
+      jest.clearAllMocks();
+      const { provider, mockSigner } = setupPlaceOrderTest();
+      const preview = createMockOrderPreview({ side: Side.BUY });
+
+      await provider.placeOrder({ preview, signer: mockSigner });
+
+      expect(mockSubmitClobOrder).toHaveBeenCalledWith(
+        expect.objectContaining({
+          clobOrder: expect.objectContaining({ orderType: 'FOK' }),
+        }),
+      );
+    });
+
+    it('submits FAK order type when Permit2 is used and fakOrdersEnabled is true', async () => {
+      jest.clearAllMocks();
+      const { provider, mockSigner } = setupPlaceOrderTest({
+        feeCollection: {
+          ...DEFAULT_FEE_COLLECTION_FLAG,
+          permit2Enabled: true,
+          executors: ['0xexecutor1'],
+        },
+        fakOrdersEnabled: true,
+      });
+      mockHasAllowances.mockResolvedValue(true);
+      const preview = createMockOrderPreview({
+        side: Side.BUY,
+        fees: {
+          metamaskFee: 0.02,
+          providerFee: 0.02,
+          totalFee: 0.04,
+          totalFeePercentage: 0.04,
+          collector: DEFAULT_FEE_COLLECTION_FLAG.collector,
+          executors: ['0xexecutor1'],
+          permit2Enabled: true,
+        },
+      });
+
+      await provider.placeOrder({ preview, signer: mockSigner });
+
+      expect(mockSubmitClobOrder).toHaveBeenCalledWith(
+        expect.objectContaining({
+          clobOrder: expect.objectContaining({ orderType: 'FAK' }),
+        }),
+      );
+    });
+
+    it('submits FOK order type when Permit2 is used but fakOrdersEnabled is false', async () => {
+      jest.clearAllMocks();
+      const { provider, mockSigner } = setupPlaceOrderTest({
+        feeCollection: {
+          ...DEFAULT_FEE_COLLECTION_FLAG,
+          permit2Enabled: true,
+          executors: ['0xexecutor1'],
+        },
+        fakOrdersEnabled: false,
+      });
+      const preview = createMockOrderPreview({
+        side: Side.BUY,
+        fees: {
+          metamaskFee: 0.02,
+          providerFee: 0.02,
+          totalFee: 0.04,
+          totalFeePercentage: 0.04,
+          collector: DEFAULT_FEE_COLLECTION_FLAG.collector,
+          executors: ['0xexecutor1'],
+          permit2Enabled: true,
+        },
+      });
+
+      await provider.placeOrder({ preview, signer: mockSigner });
+
+      expect(mockSubmitClobOrder).toHaveBeenCalledWith(
+        expect.objectContaining({
+          clobOrder: expect.objectContaining({ orderType: 'FOK' }),
+        }),
+      );
+    });
+
+    it('submits FAK order type when Permit2 fee auth and allowance are ready', async () => {
+      jest.clearAllMocks();
+      const { provider, mockSigner } = setupPlaceOrderTest({
+        feeCollection: {
+          ...DEFAULT_FEE_COLLECTION_FLAG,
+          permit2Enabled: true,
+          executors: ['0xexecutor1'],
+        },
+        fakOrdersEnabled: true,
+      });
+      mockHasAllowances.mockResolvedValue(true);
+      const preview = createMockOrderPreview({
+        side: Side.BUY,
+        fees: {
+          metamaskFee: 0.02,
+          providerFee: 0.02,
+          totalFee: 0.04,
+          totalFeePercentage: 0.04,
+          collector: DEFAULT_FEE_COLLECTION_FLAG.collector,
+          executors: ['0xexecutor1'],
+          permit2Enabled: true,
+        },
+      });
+
+      await provider.placeOrder({ preview, signer: mockSigner });
+
+      expect(mockSubmitClobOrder).toHaveBeenCalledWith(
+        expect.objectContaining({
+          clobOrder: expect.objectContaining({ orderType: 'FAK' }),
+        }),
+      );
+    });
+  });
+
+  describe('placeOrder with allowancesTx', () => {
+    beforeEach(() => {
+      jest.clearAllMocks();
+    });
+
+    function setupAllowancesTxTest(overrides?: {
+      permit2Enabled?: boolean;
+      hasAllowances?: boolean;
+      executors?: string[];
+    }) {
+      const result = setupPlaceOrderTest({
+        feeCollection: {
+          ...DEFAULT_FEE_COLLECTION_FLAG,
+          permit2Enabled: overrides?.permit2Enabled ?? true,
+          executors: overrides?.executors ?? ['0xexecutor1'],
+        },
+      });
+      mockComputeProxyAddress.mockReturnValue('0xSafeAddress');
+      (isSmartContractAddress as jest.Mock).mockResolvedValue(true);
+      mockHasAllowances.mockResolvedValue(overrides?.hasAllowances ?? false);
+      mockFindNetworkClientIdByChainId.mockReturnValue('polygon');
+      mockGetNetworkClientById.mockReturnValue({ provider: {} });
+      return result;
+    }
+
+    it('attaches allowancesTx when proxy wallet lacks allowances with fees', async () => {
+      const { provider, mockSigner } = setupAllowancesTxTest();
+      const preview = createMockOrderPreview({
+        side: Side.BUY,
+        fees: {
+          metamaskFee: 0.02,
+          providerFee: 0.02,
+          totalFee: 0.04,
+          totalFeePercentage: 0.04,
+          collector: DEFAULT_FEE_COLLECTION_FLAG.collector,
+          permit2Enabled: true,
+          executors: ['0xexecutor1'],
+        },
+      });
+      (getProxyWalletAllowancesTransaction as jest.Mock).mockResolvedValue({
+        params: { to: '0xSafe', data: '0xallowances' },
+      });
+
+      await provider.placeOrder({ preview, signer: mockSigner });
+
+      expect(mockSubmitClobOrder).toHaveBeenCalledWith(
+        expect.objectContaining({
+          allowancesTx: { to: '0xSafe', data: '0xallowances' },
+        }),
+      );
+    });
+
+    it('attaches allowancesTx when proxy wallet lacks allowances without fees', async () => {
+      const { provider, mockSigner } = setupAllowancesTxTest();
+      const preview = createMockOrderPreview({
+        side: Side.BUY,
+        fees: {
+          metamaskFee: 0,
+          providerFee: 0,
+          totalFee: 0,
+          totalFeePercentage: 0,
+          collector: DEFAULT_FEE_COLLECTION_FLAG.collector,
+          permit2Enabled: true,
+          executors: ['0xexecutor1'],
+        },
+      });
+      (getProxyWalletAllowancesTransaction as jest.Mock).mockResolvedValue({
+        params: { to: '0xSafe', data: '0xallowances' },
+      });
+
+      await provider.placeOrder({ preview, signer: mockSigner });
+
+      expect(mockSubmitClobOrder).toHaveBeenCalledWith(
+        expect.objectContaining({
+          allowancesTx: { to: '0xSafe', data: '0xallowances' },
+        }),
+      );
+    });
+
+    it('attaches allowancesTx regardless of Permit2 on-chain allowance status', async () => {
+      const { provider, mockSigner } = setupAllowancesTxTest();
+      const preview = createMockOrderPreview({
+        side: Side.BUY,
+        fees: {
+          metamaskFee: 0.02,
+          providerFee: 0.02,
+          totalFee: 0.04,
+          totalFeePercentage: 0.04,
+          collector: DEFAULT_FEE_COLLECTION_FLAG.collector,
+          permit2Enabled: true,
+          executors: ['0xexecutor1'],
+        },
+      });
+      (getProxyWalletAllowancesTransaction as jest.Mock).mockResolvedValue({
+        params: { to: '0xSafe', data: '0xallowances' },
+      });
+
+      await provider.placeOrder({ preview, signer: mockSigner });
+
+      expect(mockSubmitClobOrder).toHaveBeenCalledWith(
+        expect.objectContaining({
+          allowancesTx: { to: '0xSafe', data: '0xallowances' },
+        }),
+      );
+    });
+
+    it('does not attach allowancesTx when hasAllowances is true', async () => {
+      const { provider, mockSigner } = setupAllowancesTxTest({
+        hasAllowances: true,
+      });
+      const preview = createMockOrderPreview({
+        side: Side.BUY,
+        fees: {
+          metamaskFee: 0.02,
+          providerFee: 0.02,
+          totalFee: 0.04,
+          totalFeePercentage: 0.04,
+          collector: DEFAULT_FEE_COLLECTION_FLAG.collector,
+          permit2Enabled: true,
+          executors: ['0xexecutor1'],
+        },
+      });
+
+      await provider.placeOrder({ preview, signer: mockSigner });
+
+      expect(mockSubmitClobOrder).toHaveBeenCalledWith(
+        expect.objectContaining({
+          allowancesTx: undefined,
+        }),
+      );
+    });
+
+    it('does not attach allowancesTx when permit2 is disabled', async () => {
+      const { provider, mockSigner } = setupAllowancesTxTest({
+        permit2Enabled: false,
+        executors: [],
+      });
+      const preview = createMockOrderPreview({
+        side: Side.BUY,
+        fees: {
+          metamaskFee: 0.02,
+          providerFee: 0.02,
+          totalFee: 0.04,
+          totalFeePercentage: 0.04,
+          collector: DEFAULT_FEE_COLLECTION_FLAG.collector,
+        },
+      });
+
+      await provider.placeOrder({ preview, signer: mockSigner });
+
+      expect(mockSubmitClobOrder).toHaveBeenCalledWith(
+        expect.objectContaining({
+          allowancesTx: undefined,
+        }),
+      );
+      expect(getProxyWalletAllowancesTransaction).not.toHaveBeenCalled();
+    });
+
+    it('continues order placement when getProxyWalletAllowancesTransaction throws', async () => {
+      const { provider, mockSigner } = setupAllowancesTxTest();
+      const preview = createMockOrderPreview({
+        side: Side.BUY,
+        fees: {
+          metamaskFee: 0.02,
+          providerFee: 0.02,
+          totalFee: 0.04,
+          totalFeePercentage: 0.04,
+          collector: DEFAULT_FEE_COLLECTION_FLAG.collector,
+          permit2Enabled: true,
+          executors: ['0xexecutor1'],
+        },
+      });
+      (getProxyWalletAllowancesTransaction as jest.Mock).mockRejectedValue(
+        new Error('TX generation failed'),
+      );
+
+      const result = await provider.placeOrder({ preview, signer: mockSigner });
+
+      expect(result.success).toBe(true);
+      expect(mockSubmitClobOrder).toHaveBeenCalledWith(
+        expect.objectContaining({
+          allowancesTx: undefined,
+        }),
+      );
+    });
+
+    it('attaches allowancesTx for SELL orders', async () => {
+      const { provider, mockSigner } = setupAllowancesTxTest();
+      const preview = createMockOrderPreview({
+        side: Side.SELL,
+        fees: undefined,
+      });
+      (getProxyWalletAllowancesTransaction as jest.Mock).mockResolvedValue({
+        params: { to: '0xSafe', data: '0xallowances' },
+      });
+
+      await provider.placeOrder({ preview, signer: mockSigner });
+
+      expect(getProxyWalletAllowancesTransaction).toHaveBeenCalled();
+      expect(mockSubmitClobOrder).toHaveBeenCalledWith(
+        expect.objectContaining({
+          allowancesTx: { to: '0xSafe', data: '0xallowances' },
+        }),
+      );
+    });
+  });
+
+  describe('placeOrder FAK order type for sell orders', () => {
+    it('submits FAK order type for sell order without fees when FAK is enabled', async () => {
+      jest.clearAllMocks();
+      const { provider, mockSigner } = setupPlaceOrderTest({
+        feeCollection: {
+          ...DEFAULT_FEE_COLLECTION_FLAG,
+          permit2Enabled: true,
+          executors: ['0xexecutor1'],
+        },
+        fakOrdersEnabled: true,
+      });
+      const preview = createMockOrderPreview({
+        side: Side.SELL,
+        fees: undefined,
+      });
+
+      await provider.placeOrder({ preview, signer: mockSigner });
+
+      expect(mockSubmitClobOrder).toHaveBeenCalledWith(
+        expect.objectContaining({
+          clobOrder: expect.objectContaining({ orderType: 'FAK' }),
+        }),
+      );
+    });
+
+    it('submits FOK order type for sell order without fees when FAK is disabled', async () => {
+      jest.clearAllMocks();
+      const { provider, mockSigner } = setupPlaceOrderTest({
+        feeCollection: {
+          ...DEFAULT_FEE_COLLECTION_FLAG,
+          permit2Enabled: true,
+          executors: ['0xexecutor1'],
+        },
+        fakOrdersEnabled: false,
+      });
+      const preview = createMockOrderPreview({
+        side: Side.SELL,
+        fees: undefined,
+      });
+
+      await provider.placeOrder({ preview, signer: mockSigner });
+
+      expect(mockSubmitClobOrder).toHaveBeenCalledWith(
+        expect.objectContaining({
+          clobOrder: expect.objectContaining({ orderType: 'FOK' }),
+        }),
+      );
+    });
   });
 
   describe('placeOrder edge cases', () => {
@@ -2463,13 +3037,12 @@ describe('PolymarketProvider', () => {
     };
 
     it('get market details successfully', async () => {
-      const provider = createProvider();
+      const provider = createProvider({ liveSportsLeagues: ['nfl'] });
       mockGetMarketDetailsFromGammaApi.mockResolvedValue(mockEvent);
       mockParsePolymarketEvents.mockReturnValue([mockParsedMarket]);
 
       const result = await provider.getMarketDetails({
         marketId: 'market-1',
-        liveSportsLeagues: ['nfl'],
       });
 
       expect(result).toEqual(mockParsedMarket);
@@ -2643,10 +3216,9 @@ describe('PolymarketProvider', () => {
       expect(result[0].id).toBe('market-1');
     });
 
-    it('passes liveSportsLeagues to getMarketDetails for each market', async () => {
-      const provider = createProvider();
+    it('calls getMarketDetails for each market id', async () => {
+      const provider = createProvider({ liveSportsLeagues: ['nfl'] });
       const marketIds = ['market-1', 'market-2'];
-      const liveSportsLeagues = ['nfl'];
 
       const getMarketDetailsSpy = jest.spyOn(provider, 'getMarketDetails');
       mockGetMarketDetailsFromGammaApi.mockImplementation(({ marketId }) =>
@@ -2656,22 +3228,20 @@ describe('PolymarketProvider', () => {
         events.map((event: { id: string }) => createMockParsedMarket(event.id)),
       );
 
-      await provider.getMarketsByIds(marketIds, liveSportsLeagues);
+      await provider.getMarketsByIds(marketIds);
 
       expect(getMarketDetailsSpy).toHaveBeenCalledTimes(2);
       expect(getMarketDetailsSpy).toHaveBeenCalledWith({
         marketId: 'market-1',
-        liveSportsLeagues: ['nfl'],
       });
       expect(getMarketDetailsSpy).toHaveBeenCalledWith({
         marketId: 'market-2',
-        liveSportsLeagues: ['nfl'],
       });
 
       getMarketDetailsSpy.mockRestore();
     });
 
-    it('uses empty liveSportsLeagues by default', async () => {
+    it('calls getMarketDetails without extra params by default', async () => {
       const provider = createProvider();
       const marketIds = ['market-1'];
 
@@ -2687,7 +3257,6 @@ describe('PolymarketProvider', () => {
 
       expect(getMarketDetailsSpy).toHaveBeenCalledWith({
         marketId: 'market-1',
-        liveSportsLeagues: [],
       });
 
       getMarketDetailsSpy.mockRestore();
@@ -3609,6 +4178,27 @@ describe('PolymarketProvider', () => {
       expect(result.transactions[1].type).toBe('predictDeposit');
     });
 
+    it('passes Permit2 spender when creating allowance transaction and permit2Enabled is true', async () => {
+      const provider = createProvider({
+        feeCollection: {
+          ...DEFAULT_FEE_COLLECTION_FLAG,
+          permit2Enabled: true,
+        },
+      });
+      (isSmartContractAddress as jest.Mock).mockResolvedValue(true);
+      (hasAllowances as jest.Mock).mockResolvedValue(false);
+      (getProxyWalletAllowancesTransaction as jest.Mock).mockResolvedValue({
+        params: { to: '0xSafe', data: '0xallowances' },
+      });
+
+      await provider.prepareDeposit({ signer: mockSigner });
+
+      expect(getProxyWalletAllowancesTransaction).toHaveBeenCalledWith({
+        signer: mockSigner,
+        extraUsdcSpenders: [PERMIT2_ADDRESS],
+      });
+    });
+
     it('prepares only deposit transaction when wallet deployed and has allowances', async () => {
       // Given a fully set up wallet
       const provider = createProvider();
@@ -4025,6 +4615,25 @@ describe('PolymarketProvider', () => {
       );
       expect(hasAllowances).toHaveBeenCalledWith({
         address: '0xSafeAddress',
+        extraUsdcSpenders: [],
+      });
+    });
+
+    it('passes Permit2 spender to hasAllowances when permit2Enabled is true', async () => {
+      const provider = createProvider({
+        feeCollection: {
+          ...DEFAULT_FEE_COLLECTION_FLAG,
+          permit2Enabled: true,
+        },
+      });
+      (isSmartContractAddress as jest.Mock).mockResolvedValue(true);
+      (hasAllowances as jest.Mock).mockResolvedValue(true);
+
+      await provider.getAccountState({ ownerAddress: '0x123' });
+
+      expect(hasAllowances).toHaveBeenCalledWith({
+        address: '0xSafeAddress',
+        extraUsdcSpenders: [PERMIT2_ADDRESS],
       });
     });
 
@@ -6619,19 +7228,19 @@ describe('PolymarketProvider', () => {
 
   describe('provider interface properties', () => {
     it('exposes chainId property with value 137', () => {
-      const provider = new PolymarketProvider();
+      const provider = createProvider();
 
       expect(provider.chainId).toBe(137);
     });
 
     it('exposes name property with value Polymarket', () => {
-      const provider = new PolymarketProvider();
+      const provider = createProvider();
 
       expect(provider.name).toBe('Polymarket');
     });
 
     it('exposes providerId property with value polymarket', () => {
-      const provider = new PolymarketProvider();
+      const provider = createProvider();
 
       expect(provider.providerId).toBe(POLYMARKET_PROVIDER_ID);
     });
@@ -6649,23 +7258,23 @@ describe('PolymarketProvider', () => {
     });
 
     describe('getMarkets', () => {
-      it('applies GameCache overlay to fetched markets when liveSportsLeagues is provided', async () => {
-        const provider = new PolymarketProvider();
+      it('applies GameCache overlay to fetched markets when live sports are enabled', async () => {
+        const provider = createProvider({ liveSportsLeagues: ['nfl'] });
         const mockMarkets = [
           { id: 'market-1', title: 'Test Market 1' },
           { id: 'market-2', title: 'Test Market 2' },
         ];
         mockGetMarketsFromPolymarketApi.mockResolvedValue(mockMarkets);
 
-        await provider.getMarkets({ liveSportsLeagues: ['nfl'] });
+        await provider.getMarkets();
 
         expect(mockGameCacheInstance.overlayOnMarkets).toHaveBeenCalledWith(
           mockMarkets,
         );
       });
 
-      it('returns markets with cached game data overlay applied when liveSportsLeagues is provided', async () => {
-        const provider = new PolymarketProvider();
+      it('returns markets with cached game data overlay applied when live sports are enabled', async () => {
+        const provider = createProvider({ liveSportsLeagues: ['nfl'] });
         const mockMarkets = [{ id: 'market-1', title: 'Test Market' }];
         const overlaidMarkets = [
           {
@@ -6677,22 +7286,18 @@ describe('PolymarketProvider', () => {
         mockGetMarketsFromPolymarketApi.mockResolvedValue(mockMarkets);
         mockGameCacheInstance.overlayOnMarkets.mockReturnValue(overlaidMarkets);
 
-        const result = await provider.getMarkets({
-          liveSportsLeagues: ['nfl'],
-        });
+        const result = await provider.getMarkets();
 
         expect(result).toEqual(overlaidMarkets);
       });
 
       it('returns empty array when API fails without calling GameCache overlay', async () => {
-        const provider = new PolymarketProvider();
+        const provider = createProvider({ liveSportsLeagues: ['nfl'] });
         mockGetMarketsFromPolymarketApi.mockRejectedValue(
           new Error('API error'),
         );
 
-        const result = await provider.getMarkets({
-          liveSportsLeagues: ['nfl'],
-        });
+        const result = await provider.getMarkets();
 
         expect(result).toEqual([]);
         expect(mockGameCacheInstance.overlayOnMarkets).not.toHaveBeenCalled();
@@ -6700,8 +7305,8 @@ describe('PolymarketProvider', () => {
     });
 
     describe('getMarketDetails', () => {
-      it('applies GameCache overlay to fetched market details when liveSportsLeagues is provided', async () => {
-        const provider = new PolymarketProvider();
+      it('applies GameCache overlay to fetched market details when live sports are enabled', async () => {
+        const provider = createProvider({ liveSportsLeagues: ['nfl'] });
         const mockEvent = { id: 'market-1', question: 'Test Market?' };
         const parsedMarket = {
           id: 'market-1',
@@ -6711,18 +7316,15 @@ describe('PolymarketProvider', () => {
         mockGetMarketDetailsFromGammaApi.mockResolvedValue(mockEvent);
         mockParsePolymarketEvents.mockReturnValue([parsedMarket]);
 
-        await provider.getMarketDetails({
-          marketId: 'market-1',
-          liveSportsLeagues: ['nfl'],
-        });
+        await provider.getMarketDetails({ marketId: 'market-1' });
 
         expect(mockGameCacheInstance.overlayOnMarket).toHaveBeenCalledWith(
           parsedMarket,
         );
       });
 
-      it('returns market with cached game data overlay applied when liveSportsLeagues is provided', async () => {
-        const provider = new PolymarketProvider();
+      it('returns market with cached game data overlay applied when live sports are enabled', async () => {
+        const provider = createProvider({ liveSportsLeagues: ['nfl'] });
         const mockEvent = { id: 'market-1', question: 'Test Market?' };
         const parsedMarket = { id: 'market-1', title: 'Test Market' };
         const overlaidMarket = {
@@ -6736,22 +7338,18 @@ describe('PolymarketProvider', () => {
 
         const result = await provider.getMarketDetails({
           marketId: 'market-1',
-          liveSportsLeagues: ['nfl'],
         });
 
         expect(result).toEqual(overlaidMarket);
       });
 
       it('throws error when parsing fails without calling GameCache overlay', async () => {
-        const provider = new PolymarketProvider();
+        const provider = createProvider({ liveSportsLeagues: ['nfl'] });
         mockGetMarketDetailsFromGammaApi.mockResolvedValue({});
         mockParsePolymarketEvents.mockReturnValue([]);
 
         await expect(
-          provider.getMarketDetails({
-            marketId: 'market-1',
-            liveSportsLeagues: ['nfl'],
-          }),
+          provider.getMarketDetails({ marketId: 'market-1' }),
         ).rejects.toThrow('Failed to parse market details');
         expect(mockGameCacheInstance.overlayOnMarket).not.toHaveBeenCalled();
       });
@@ -6765,7 +7363,7 @@ describe('PolymarketProvider', () => {
 
     describe('subscribeToGameUpdates', () => {
       it('delegates to WebSocketManager.subscribeToGame', () => {
-        const provider = new PolymarketProvider();
+        const provider = createProvider();
         const mockCallback = jest.fn();
         const mockUnsubscribe = jest.fn();
         mockWebSocketManagerInstance.subscribeToGame.mockReturnValue(
@@ -6784,7 +7382,7 @@ describe('PolymarketProvider', () => {
       });
 
       it('returns unsubscribe function from WebSocketManager', () => {
-        const provider = new PolymarketProvider();
+        const provider = createProvider();
         const mockUnsubscribe = jest.fn();
         mockWebSocketManagerInstance.subscribeToGame.mockReturnValue(
           mockUnsubscribe,
@@ -6803,7 +7401,7 @@ describe('PolymarketProvider', () => {
 
     describe('subscribeToMarketPrices', () => {
       it('delegates to WebSocketManager.subscribeToMarketPrices', () => {
-        const provider = new PolymarketProvider();
+        const provider = createProvider();
         const mockCallback = jest.fn();
         const mockUnsubscribe = jest.fn();
         mockWebSocketManagerInstance.subscribeToMarketPrices.mockReturnValue(
@@ -6822,7 +7420,7 @@ describe('PolymarketProvider', () => {
       });
 
       it('returns unsubscribe function from WebSocketManager', () => {
-        const provider = new PolymarketProvider();
+        const provider = createProvider();
         const mockUnsubscribe = jest.fn();
         mockWebSocketManagerInstance.subscribeToMarketPrices.mockReturnValue(
           mockUnsubscribe,
@@ -6841,7 +7439,7 @@ describe('PolymarketProvider', () => {
 
     describe('getConnectionStatus', () => {
       it('returns connection status from WebSocketManager', () => {
-        const provider = new PolymarketProvider();
+        const provider = createProvider();
         mockWebSocketManagerInstance.getConnectionStatus.mockReturnValue({
           sportsConnected: true,
           marketConnected: false,
@@ -6858,7 +7456,7 @@ describe('PolymarketProvider', () => {
       });
 
       it('maps WebSocketManager status to ConnectionStatus interface', () => {
-        const provider = new PolymarketProvider();
+        const provider = createProvider();
         mockWebSocketManagerInstance.getConnectionStatus.mockReturnValue({
           sportsConnected: false,
           marketConnected: true,
@@ -6878,50 +7476,47 @@ describe('PolymarketProvider', () => {
     });
   });
 
-  describe('Live sports disabled (empty liveSportsLeagues)', () => {
+  describe('Live sports disabled', () => {
     beforeEach(() => {
       jest.clearAllMocks();
     });
 
     describe('getMarkets', () => {
-      it('skips TeamsCache loading when liveSportsLeagues is empty', async () => {
-        const provider = new PolymarketProvider();
+      it('skips TeamsCache loading when live sports leagues are empty', async () => {
+        const provider = createProvider();
         mockGetMarketsFromPolymarketApi.mockResolvedValue([]);
 
-        await provider.getMarkets({ liveSportsLeagues: [] });
+        await provider.getMarkets();
 
         expect(
           mockTeamsCacheInstance.ensureLeaguesLoaded,
         ).not.toHaveBeenCalled();
       });
 
-      it('skips GameCache overlay when liveSportsLeagues is empty', async () => {
-        const provider = new PolymarketProvider();
+      it('skips GameCache overlay when live sports leagues are empty', async () => {
+        const provider = createProvider();
         const mockMarkets = [{ id: 'market-1', title: 'Test Market' }];
         mockGetMarketsFromPolymarketApi.mockResolvedValue(mockMarkets);
 
-        const result = await provider.getMarkets({ liveSportsLeagues: [] });
+        const result = await provider.getMarkets();
 
         expect(mockGameCacheInstance.overlayOnMarkets).not.toHaveBeenCalled();
         expect(result).toEqual(mockMarkets);
       });
 
-      it('does not pass teamLookup when liveSportsLeagues is empty', async () => {
-        const provider = new PolymarketProvider();
+      it('does not pass teamLookup when live sports leagues are empty', async () => {
+        const provider = createProvider();
         mockGetMarketsFromPolymarketApi.mockResolvedValue([]);
 
-        await provider.getMarkets({
-          category: 'sports',
-          liveSportsLeagues: [],
-        });
+        await provider.getMarkets({ category: 'sports' });
 
         expect(mockGetMarketsFromPolymarketApi).toHaveBeenCalledWith(
           expect.objectContaining({ teamLookup: undefined }),
         );
       });
 
-      it('skips TeamsCache loading when liveSportsLeagues is undefined (default)', async () => {
-        const provider = new PolymarketProvider();
+      it('skips TeamsCache loading when live sports config is defaulted', async () => {
+        const provider = createProvider();
         mockGetMarketsFromPolymarketApi.mockResolvedValue([]);
 
         await provider.getMarkets();
@@ -6933,25 +7528,22 @@ describe('PolymarketProvider', () => {
     });
 
     describe('getMarketDetails', () => {
-      it('skips TeamsCache loading when liveSportsLeagues is empty', async () => {
-        const provider = new PolymarketProvider();
+      it('skips TeamsCache loading when live sports leagues are empty', async () => {
+        const provider = createProvider();
         const mockEvent = { id: 'market-1', question: 'Test?' };
         const parsedMarket = { id: 'market-1', title: 'Test' };
         mockGetMarketDetailsFromGammaApi.mockResolvedValue(mockEvent);
         mockParsePolymarketEvents.mockReturnValue([parsedMarket]);
 
-        await provider.getMarketDetails({
-          marketId: 'market-1',
-          liveSportsLeagues: [],
-        });
+        await provider.getMarketDetails({ marketId: 'market-1' });
 
         expect(
           mockTeamsCacheInstance.ensureLeaguesLoaded,
         ).not.toHaveBeenCalled();
       });
 
-      it('skips GameCache overlay when liveSportsLeagues is empty', async () => {
-        const provider = new PolymarketProvider();
+      it('skips GameCache overlay when live sports leagues are empty', async () => {
+        const provider = createProvider();
         const mockEvent = { id: 'market-1', question: 'Test?' };
         const parsedMarket = { id: 'market-1', title: 'Test' };
         mockGetMarketDetailsFromGammaApi.mockResolvedValue(mockEvent);
@@ -6959,24 +7551,20 @@ describe('PolymarketProvider', () => {
 
         const result = await provider.getMarketDetails({
           marketId: 'market-1',
-          liveSportsLeagues: [],
         });
 
         expect(mockGameCacheInstance.overlayOnMarket).not.toHaveBeenCalled();
         expect(result).toEqual(parsedMarket);
       });
 
-      it('does not pass teamLookup when liveSportsLeagues is empty', async () => {
-        const provider = new PolymarketProvider();
+      it('does not pass teamLookup when live sports leagues are empty', async () => {
+        const provider = createProvider();
         const mockEvent = { id: 'market-1', question: 'Test?' };
         const parsedMarket = { id: 'market-1', title: 'Test' };
         mockGetMarketDetailsFromGammaApi.mockResolvedValue(mockEvent);
         mockParsePolymarketEvents.mockReturnValue([parsedMarket]);
 
-        await provider.getMarketDetails({
-          marketId: 'market-1',
-          liveSportsLeagues: [],
-        });
+        await provider.getMarketDetails({ marketId: 'market-1' });
 
         expect(mockParsePolymarketEvents).toHaveBeenCalledWith(
           [mockEvent],
diff --git a/app/components/UI/Predict/providers/polymarket/PolymarketProvider.ts b/app/components/UI/Predict/providers/polymarket/PolymarketProvider.ts
index 62a8ec9924c9..9ea907de8259 100644
--- a/app/components/UI/Predict/providers/polymarket/PolymarketProvider.ts
+++ b/app/components/UI/Predict/providers/polymarket/PolymarketProvider.ts
@@ -63,8 +63,10 @@ import {
   ROUNDING_CONFIG,
   SAFE_EXEC_GAS_LIMIT,
 } from './constants';
+import { PERMIT2_ADDRESS } from './safe/constants';
 import {
   computeProxyAddress,
+  createPermit2FeeAuthorization,
   createSafeFeeAuthorization,
   getClaimTransaction,
   getDeployProxyWalletTransaction,
@@ -73,6 +75,7 @@ import {
   getWithdrawTransactionCallData,
   hasAllowances,
 } from './safe/utils';
+import { Permit2FeeAuthorization, SafeFeeAuthorization } from './safe/types';
 import {
   ApiKeyCreds,
   OrderData,
@@ -101,7 +104,7 @@ import {
   roundOrderAmount,
   submitClobOrder,
 } from './utils';
-import { PredictFeeCollection } from '../../types/flags';
+import { PredictFeatureFlags } from '../../types/flags';
 import { GameCache } from './GameCache';
 import { TeamsCache } from './TeamsCache';
 import { WebSocketManager } from './WebSocketManager';
@@ -135,6 +138,7 @@ export class PolymarketProvider implements PredictProvider {
   readonly providerId = POLYMARKET_PROVIDER_ID;
   readonly name = 'Polymarket';
   readonly chainId = POLYGON_MAINNET_CHAIN_ID;
+  readonly #getFeatureFlags: () => PredictFeatureFlags;
 
   #apiKeysByAddress: Map<string, ApiKeyCreds> = new Map();
   #accountStateByAddress: Map<string, AccountState> = new Map();
@@ -147,6 +151,14 @@ export class PolymarketProvider implements PredictProvider {
 
   private static readonly FALLBACK_CATEGORY: PredictCategory = 'trending';
 
+  constructor({
+    getFeatureFlags,
+  }: {
+    getFeatureFlags: () => PredictFeatureFlags;
+  }) {
+    this.#getFeatureFlags = getFeatureFlags;
+  }
+
   /**
    * Generate standard error context for Logger.error calls with searchable tags and context.
    * Enables Sentry dashboard filtering by feature and provider.
@@ -174,18 +186,43 @@ export class PolymarketProvider implements PredictProvider {
     };
   }
 
+  #hasPermit2Config(params: {
+    permit2Enabled?: boolean;
+    executors?: string[];
+  }): boolean {
+    return (
+      params.permit2Enabled === true &&
+      Array.isArray(params.executors) &&
+      params.executors.length > 0
+    );
+  }
+
+  #shouldUseFakOrderType({
+    permit2Enabled,
+    executors,
+    fakOrdersEnabled,
+  }: {
+    permit2Enabled?: boolean;
+    executors?: string[];
+    fakOrdersEnabled: boolean;
+  }): boolean {
+    return (
+      this.#hasPermit2Config({ permit2Enabled, executors }) &&
+      fakOrdersEnabled === true
+    );
+  }
+
   public async getMarketDetails({
     marketId,
-    liveSportsLeagues = [],
   }: {
     marketId: string;
-    liveSportsLeagues?: string[];
   }): Promise<PredictMarket> {
     if (!marketId) {
       throw new Error('marketId is required');
     }
 
     try {
+      const { liveSportsLeagues } = this.#getFeatureFlags();
       const event = await getMarketDetailsFromGammaApi({
         marketId,
       });
@@ -223,25 +260,20 @@ export class PolymarketProvider implements PredictProvider {
     }
   }
 
-  public async getMarketsByIds(
-    marketIds: string[],
-    liveSportsLeagues: string[] = [],
-  ): Promise<PredictMarket[]> {
+  public async getMarketsByIds(marketIds: string[]): Promise<PredictMarket[]> {
     if (!marketIds || marketIds.length === 0) {
       return [];
     }
 
     try {
       const marketPromises = marketIds.map((marketId) =>
-        this.getMarketDetails({ marketId, liveSportsLeagues }).catch(
-          (error) => {
-            DevLogger.log(
-              `PolymarketProvider: Failed to fetch market ${marketId}`,
-              error,
-            );
-            return null;
-          },
-        ),
+        this.getMarketDetails({ marketId }).catch((error) => {
+          DevLogger.log(
+            `PolymarketProvider: Failed to fetch market ${marketId}`,
+            error,
+          );
+          return null;
+        }),
       );
 
       const results = await Promise.all(marketPromises);
@@ -301,7 +333,7 @@ export class PolymarketProvider implements PredictProvider {
 
   public async getMarkets(params?: GetMarketsParams): Promise<PredictMarket[]> {
     try {
-      const liveSportsLeagues = params?.liveSportsLeagues ?? [];
+      const { liveSportsLeagues } = this.#getFeatureFlags();
       const liveSportsEnabled = liveSportsLeagues.length > 0;
 
       if (liveSportsEnabled) {
@@ -968,21 +1000,38 @@ export class PolymarketProvider implements PredictProvider {
   public async previewOrder(
     params: PreviewOrderParams & {
       signer: Signer;
-      feeCollection?: PredictFeeCollection;
     },
   ): Promise<OrderPreview> {
-    const basePreview = await previewOrder(params);
+    const { feeCollection, fakOrdersEnabled } = this.#getFeatureFlags();
+    const basePreview = await previewOrder({ ...params, feeCollection });
+
+    // Determine intended order type from feature flags.
+    // FAK is used when Permit2 config is active and FAK orders are enabled.
+    // placeOrder() guarantees the Permit2 allowance is set before submission,
+    // so we can always use FAK when the config allows it.
+    let orderType = OrderType.FOK;
+
+    if (
+      this.#shouldUseFakOrderType({
+        permit2Enabled: feeCollection.permit2Enabled,
+        executors: feeCollection.executors,
+        fakOrdersEnabled,
+      })
+    ) {
+      orderType = OrderType.FAK;
+    }
 
     if (params.signer) {
       if (this.isRateLimited(params.signer.address)) {
         return {
           ...basePreview,
+          orderType,
           rateLimited: true,
         };
       }
     }
 
-    return basePreview;
+    return { ...basePreview, orderType };
   }
 
   public async placeOrder(
@@ -1136,10 +1185,123 @@ export class PolymarketProvider implements PredictProvider {
 
       const signerApiKey = await this.getApiKey({ address: signer.address });
 
+      // Determine fees, permit2, and order type BEFORE building clobOrder
+      // so the HMAC signature covers the correct orderType.
+      const { feeCollection, fakOrdersEnabled } = this.#getFeatureFlags();
+      const shouldUsePermit2 = this.#hasPermit2Config({
+        permit2Enabled: fees?.permit2Enabled,
+        executors: fees?.executors,
+      });
+
+      let feeAuthorization:
+        | SafeFeeAuthorization
+        | Permit2FeeAuthorization
+        | undefined;
+      let executor: string | undefined;
+      let orderType: OrderType = OrderType.FOK;
+      let permit2FeeReady = false;
+
+      if (fees !== undefined && fees.totalFee > 0) {
+        const safeAddress = computeProxyAddress(signer.address);
+        const feeAmountInUsdc = BigInt(
+          parseUnits(fees.totalFee.toString(), 6).toString(),
+        );
+
+        if (shouldUsePermit2) {
+          // Always use Permit2 fee authorization when permit2 is enabled.
+          // The relay will submit the allowancesTx on-chain first (if
+          // attached) before redeeming the Permit2 authorization.
+          permit2FeeReady = true;
+          const executors = fees.executors ?? [];
+          const randomIndex = new Uint32Array(1);
+          global.crypto.getRandomValues(randomIndex);
+          executor = executors[randomIndex[0] % executors.length];
+          feeAuthorization = await createPermit2FeeAuthorization({
+            safeAddress,
+            signer,
+            amount: feeAmountInUsdc,
+            spender: executor,
+          });
+        } else {
+          feeAuthorization = await createSafeFeeAuthorization({
+            safeAddress,
+            signer,
+            amount: feeAmountInUsdc,
+            to: fees.collector,
+          });
+        }
+      }
+
+      let allowancesTx: { to: string; data: string } | undefined;
+      let permit2AllowanceReady = false;
+
+      // When Permit2 is enabled via feature flags, ensure the proxy wallet
+      // has the required allowances. If not, generate a signed Safe TX that
+      // the relay will submit on-chain before processing the order.
+      // This uses the feature flag (not per-order fees) so it works for
+      // both BUY orders (with fees) and SELL orders (no fees).
+      //
+      // IMPORTANT: Skip when a Safe fee authorization was already signed,
+      // because both transactions read the same on-chain Safe nonce and
+      // the relay would invalidate one when executing the other.
+      const hasSafeFeeAuth = feeAuthorization !== undefined && !permit2FeeReady;
+
+      if (feeCollection.permit2Enabled && !hasSafeFeeAuth) {
+        try {
+          const accountState = await this.getAccountState({
+            ownerAddress: signer.address,
+          });
+
+          if (accountState.hasAllowances) {
+            permit2AllowanceReady = true;
+          } else {
+            const allowanceTx = await getProxyWalletAllowancesTransaction({
+              signer,
+              extraUsdcSpenders: [PERMIT2_ADDRESS],
+            });
+
+            allowancesTx = allowanceTx.params;
+            permit2AllowanceReady = true;
+          }
+        } catch (allowanceError) {
+          // Log but don't block the order — the relay will fall back
+          // to FOK if FAK isn't viable without allowances.
+          DevLogger.log(
+            'PolymarketProvider: Failed to generate allowances transaction',
+            { error: allowanceError },
+          );
+          Logger.error(
+            allowanceError instanceof Error
+              ? allowanceError
+              : new Error(String(allowanceError)),
+            this.getErrorContext('placeOrder:allowancesTx', {
+              operation: 'generate_allowances_tx',
+            }),
+          );
+        }
+      }
+
+      // Determine order type: FAK when Permit2 config is active and
+      // FAK orders are enabled. For orders with fees, the relay also
+      // needs Permit2 allowances (either already on-chain or via
+      // the attached allowancesTx).
+      if (
+        this.#shouldUseFakOrderType({
+          permit2Enabled: feeCollection.permit2Enabled,
+          executors: feeCollection.executors,
+          fakOrdersEnabled,
+        })
+      ) {
+        const hasFees = fees !== undefined && fees.totalFee > 0;
+        if (!hasFees || (permit2FeeReady && permit2AllowanceReady)) {
+          orderType = OrderType.FAK;
+        }
+      }
+
       const clobOrder = {
         order: { ...signedOrder, side, salt: parseInt(signedOrder.salt) },
         owner: signerApiKey.apiKey,
-        orderType: OrderType.FOK,
+        orderType,
       };
 
       const body = JSON.stringify(clobOrder);
@@ -1154,24 +1316,12 @@ export class PolymarketProvider implements PredictProvider {
         apiKey: signerApiKey,
       });
 
-      let feeAuthorization;
-      if (fees !== undefined && fees.totalFee > 0) {
-        const safeAddress = computeProxyAddress(signer.address);
-        const feeAmountInUsdc = BigInt(
-          parseUnits(fees.totalFee.toString(), 6).toString(),
-        );
-        feeAuthorization = await createSafeFeeAuthorization({
-          safeAddress,
-          signer,
-          amount: feeAmountInUsdc,
-          to: fees.collector,
-        });
-      }
-
       const { success, response, error } = await submitClobOrder({
         headers,
         clobOrder,
         feeAuthorization,
+        executor,
+        allowancesTx,
       });
 
       if (!success) {
@@ -1464,8 +1614,13 @@ export class PolymarketProvider implements PredictProvider {
     }
 
     if (!accountState.hasAllowances) {
+      const { feeCollection: depositFeeCollection } = this.#getFeatureFlags();
+      const extraUsdcSpenders = depositFeeCollection.permit2Enabled
+        ? [PERMIT2_ADDRESS]
+        : [];
       const allowanceTransaction = await getProxyWalletAllowancesTransaction({
         signer,
+        extraUsdcSpenders,
       });
 
       if (!allowanceTransaction) {
@@ -1537,13 +1692,17 @@ export class PolymarketProvider implements PredictProvider {
       // Check deployment status and allowances
       let isDeployed: boolean;
       let hasAllowancesResult: boolean;
+      const { feeCollection: flagFeeCollection } = this.#getFeatureFlags();
+      const extraUsdcSpenders = flagFeeCollection.permit2Enabled
+        ? [PERMIT2_ADDRESS]
+        : [];
       try {
         [isDeployed, hasAllowancesResult] = await Promise.all([
           isSmartContractAddress(
             address,
             numberToHex(POLYGON_MAINNET_CHAIN_ID),
           ),
-          hasAllowances({ address }),
+          hasAllowances({ address, extraUsdcSpenders }),
         ]);
       } catch (error) {
         throw new Error(
diff --git a/app/components/UI/Predict/providers/polymarket/WebSocketManager.test.ts b/app/components/UI/Predict/providers/polymarket/WebSocketManager.test.ts
index 3efb0e13f79c..48baaf0f31d3 100644
--- a/app/components/UI/Predict/providers/polymarket/WebSocketManager.test.ts
+++ b/app/components/UI/Predict/providers/polymarket/WebSocketManager.test.ts
@@ -217,6 +217,7 @@ describe('WebSocketManager', () => {
 
       manager.subscribeToGame('123', callback);
       mockWebSocketInstances[0].simulateOpen();
+      mockGameCacheInstance.updateGame.mockClear();
       mockWebSocketInstances[0].simulateMessage({
         gameId: 456,
         score: '7-0',
@@ -229,6 +230,25 @@ describe('WebSocketManager', () => {
       expect(callback).not.toHaveBeenCalled();
     });
 
+    it('does not update cache for unrelated gameId', () => {
+      const manager = WebSocketManager.getInstance();
+      const callback = jest.fn();
+
+      manager.subscribeToGame('123', callback);
+      mockWebSocketInstances[0].simulateOpen();
+      mockGameCacheInstance.updateGame.mockClear();
+      mockWebSocketInstances[0].simulateMessage({
+        gameId: 456,
+        score: '7-0',
+        elapsed: '05:00',
+        period: 'Q1',
+        live: true,
+        ended: false,
+      });
+
+      expect(mockGameCacheInstance.updateGame).not.toHaveBeenCalled();
+    });
+
     it('calls multiple callbacks for same gameId', () => {
       const manager = WebSocketManager.getInstance();
       const callback1 = jest.fn();
diff --git a/app/components/UI/Predict/providers/polymarket/WebSocketManager.ts b/app/components/UI/Predict/providers/polymarket/WebSocketManager.ts
index 253422feb33c..35b3530f0e2f 100644
--- a/app/components/UI/Predict/providers/polymarket/WebSocketManager.ts
+++ b/app/components/UI/Predict/providers/polymarket/WebSocketManager.ts
@@ -161,6 +161,11 @@ export class WebSocketManager {
       const data: SportsWebSocketEvent = JSON.parse(event.data);
       const gameId = String(data.gameId);
 
+      const callbacks = this.gameSubscriptions.get(gameId);
+      if (!callbacks || callbacks.size === 0) {
+        return;
+      }
+
       const update: GameUpdate = {
         gameId,
         score: data.score,
@@ -171,11 +176,7 @@ export class WebSocketManager {
       };
 
       GameCache.getInstance().updateGame(gameId, update);
-
-      const callbacks = this.gameSubscriptions.get(gameId);
-      if (callbacks && callbacks.size > 0) {
-        callbacks.forEach((callback) => callback(update));
-      }
+      callbacks.forEach((callback) => callback(update));
     } catch (error) {
       DevLogger.log('WebSocketManager: Failed to parse sports message', {
         error,
diff --git a/app/components/UI/Predict/providers/polymarket/safe/constants.ts b/app/components/UI/Predict/providers/polymarket/safe/constants.ts
index c442b6c97221..a7c626616226 100644
--- a/app/components/UI/Predict/providers/polymarket/safe/constants.ts
+++ b/app/components/UI/Predict/providers/polymarket/safe/constants.ts
@@ -11,8 +11,11 @@ export const SAFE_MULTISEND_ADDRESS =
 // Constants from the contract
 export const SAFE_TX_TYPEHASH =
   '0xbb8310d486368db6bd6f849402fdd73ad53d316b5a4b2644ad6efe0f941286d8';
+export const SAFE_MSG_TYPEHASH =
+  '0x60b3cbf8b4a223d68d641b3b6ddf9a298e7f33710cf3d3a9d1146b5a6150fbca';
 export const DOMAIN_SEPARATOR_TYPEHASH =
   '0x47e79534a245952e8b16893a336b85a3d9ea9fa8c573f3d803afb92a79469218';
+export const PERMIT2_ADDRESS = '0x000000000022D473030F116dDEE9F6B43aC78BA3';
 
 export const usdcSpenders = [
   MATIC_CONTRACTS.conditionalTokens, // Conditional Tokens Framework
diff --git a/app/components/UI/Predict/providers/polymarket/safe/types.ts b/app/components/UI/Predict/providers/polymarket/safe/types.ts
index 994d66ca6a54..60ff992776ac 100644
--- a/app/components/UI/Predict/providers/polymarket/safe/types.ts
+++ b/app/components/UI/Predict/providers/polymarket/safe/types.ts
@@ -23,3 +23,16 @@ export interface SafeFeeAuthorization {
     sig: string; // Signature of the Safe transaction
   };
 }
+
+export interface Permit2FeeAuthorization {
+  type: 'safe-permit2';
+  authorization: {
+    permit: {
+      permitted: { token: string; amount: string };
+      nonce: string;
+      deadline: string;
+    };
+    spender: string;
+    signature: string;
+  };
+}
diff --git a/app/components/UI/Predict/providers/polymarket/safe/utils.test.ts b/app/components/UI/Predict/providers/polymarket/safe/utils.test.ts
index 010bce4c6e0c..b9c8f65eedb8 100644
--- a/app/components/UI/Predict/providers/polymarket/safe/utils.test.ts
+++ b/app/components/UI/Predict/providers/polymarket/safe/utils.test.ts
@@ -5,10 +5,17 @@ import {
   POLYGON_MAINNET_CHAIN_ID,
   POLYMARKET_PROVIDER_ID,
 } from '../constants';
-import { SAFE_FACTORY_ADDRESS, SAFE_MULTISEND_ADDRESS } from './constants';
+import {
+  PERMIT2_ADDRESS,
+  SAFE_FACTORY_ADDRESS,
+  SAFE_MULTISEND_ADDRESS,
+  usdcSpenders,
+} from './constants';
 import {
   computeProxyAddress,
+  createPermit2FeeAuthorization,
   createSafeFeeAuthorization,
+  getPermit2Nonce,
   getDeployProxyWalletTypedData,
   encodeCreateProxy,
   getDeployProxyWalletTransaction,
@@ -18,6 +25,7 @@ import {
   aggregateTransaction,
   createAllowancesSafeTransaction,
   hasAllowances,
+  hasPermit2Allowance,
   createClaimSafeTransaction,
   getSafeTransactionCallData,
   getProxyWalletAllowancesTransaction,
@@ -405,6 +413,72 @@ describe('safe utils', () => {
     });
   });
 
+  describe('getPermit2Nonce', () => {
+    it('returns a numeric string', async () => {
+      const nonce = await getPermit2Nonce();
+
+      expect(nonce).toMatch(/^\d+$/);
+    });
+
+    it('generates nonce from crypto.getRandomValues', async () => {
+      const spy = jest.spyOn(global.crypto, 'getRandomValues');
+
+      await getPermit2Nonce();
+
+      expect(spy).toHaveBeenCalledWith(expect.any(Uint32Array));
+      spy.mockRestore();
+    });
+  });
+
+  describe('hasPermit2Allowance', () => {
+    it('returns true when Permit2 allowance is greater than zero', async () => {
+      mockGetAllowance.mockResolvedValueOnce(1n);
+
+      const result = await hasPermit2Allowance({ address: TEST_SAFE_ADDRESS });
+
+      expect(result).toBe(true);
+      expect(mockGetAllowance).toHaveBeenCalledWith({
+        tokenAddress: MATIC_CONTRACTS.collateral,
+        owner: TEST_SAFE_ADDRESS,
+        spender: PERMIT2_ADDRESS,
+      });
+    });
+
+    it('returns false when Permit2 allowance is zero', async () => {
+      mockGetAllowance.mockResolvedValueOnce(0n);
+
+      const result = await hasPermit2Allowance({ address: TEST_SAFE_ADDRESS });
+
+      expect(result).toBe(false);
+    });
+  });
+
+  describe('createPermit2FeeAuthorization', () => {
+    it('creates safe-permit2 authorization payload', async () => {
+      mockSignPersonalMessage.mockResolvedValue(
+        '0xaabbccddeeff00112233445566778899aabbccddeeff00112233445566778899aabbccddeeff00112233445566778899aabbccddeeff0011223344556677889900',
+      );
+
+      const authorization = await createPermit2FeeAuthorization({
+        safeAddress: TEST_SAFE_ADDRESS,
+        signer: buildSigner(),
+        amount: 1_000_000n,
+        spender: TEST_TO_ADDRESS,
+      });
+
+      expect(authorization.type).toBe('safe-permit2');
+      expect(authorization.authorization.permit.permitted.token).toBe(
+        MATIC_CONTRACTS.collateral,
+      );
+      expect(authorization.authorization.permit.permitted.amount).toBe(
+        '1000000',
+      );
+      expect(authorization.authorization.permit.nonce).toMatch(/^\d+$/);
+      expect(authorization.authorization.spender).toBe(TEST_TO_ADDRESS);
+      expect(authorization.authorization.signature).toMatch(/^0x[a-f0-9]+$/);
+    });
+  });
+
   describe('getDeployProxyWalletTypedData', () => {
     it('returns correct typed data structure', async () => {
       const typedData = await getDeployProxyWalletTypedData();
@@ -660,6 +734,18 @@ describe('safe utils', () => {
       expect(safeTxn.data).toBeDefined();
       expect(typeof safeTxn.data).toBe('string');
     });
+
+    it('includes extra USDC spenders when provided', () => {
+      const defaultSafeTxn = createAllowancesSafeTransaction();
+      const safeTxnWithExtra = createAllowancesSafeTransaction({
+        extraUsdcSpenders: [PERMIT2_ADDRESS],
+      });
+
+      expect(safeTxnWithExtra.data).toBeDefined();
+      expect(safeTxnWithExtra.data.length).toBeGreaterThan(
+        defaultSafeTxn.data.length,
+      );
+    });
   });
 
   describe('hasAllowances', () => {
@@ -693,6 +779,22 @@ describe('safe utils', () => {
 
       expect(result).toBe(false);
     });
+
+    it('checks allowances for extra USDC spenders', async () => {
+      mockGetAllowance.mockResolvedValue(100n);
+      mockGetIsApprovedForAll.mockResolvedValue(true);
+
+      const result = await hasAllowances({
+        address: TEST_ADDRESS,
+        extraUsdcSpenders: [PERMIT2_ADDRESS],
+      });
+
+      expect(result).toBe(true);
+      expect(mockGetAllowance).toHaveBeenCalledWith(
+        expect.objectContaining({ spender: PERMIT2_ADDRESS }),
+      );
+      expect(mockGetAllowance).toHaveBeenCalledTimes(usdcSpenders.length + 1);
+    });
   });
 
   describe('createClaimSafeTransaction', () => {
diff --git a/app/components/UI/Predict/providers/polymarket/safe/utils.ts b/app/components/UI/Predict/providers/polymarket/safe/utils.ts
index b85e2a7002c3..6e121b739016 100644
--- a/app/components/UI/Predict/providers/polymarket/safe/utils.ts
+++ b/app/components/UI/Predict/providers/polymarket/safe/utils.ts
@@ -44,15 +44,18 @@ import {
   DOMAIN_SEPARATOR_TYPEHASH,
   MASTER_COPY_ADDRESS,
   outcomeTokenSpenders,
+  PERMIT2_ADDRESS,
   PROXY_CREATION_CODE,
   SAFE_FACTORY_ADDRESS,
   SAFE_FACTORY_NAME,
+  SAFE_MSG_TYPEHASH,
   SAFE_MULTISEND_ADDRESS,
   SAFE_TX_TYPEHASH,
   usdcSpenders,
 } from './constants';
 import {
   OperationType,
+  Permit2FeeAuthorization,
   SafeFeeAuthorization,
   SafeTransaction,
   SplitSignature,
@@ -171,6 +174,18 @@ const getNonce = async ({
   return BigInt(res);
 };
 
+/**
+ * Generate a random Permit2 nonce. Uses a random 32-bit value instead of
+ * reading the on-chain nonce bitmap to avoid an RPC round-trip and prevent
+ * nonce collisions on back-to-back orders whose fee collection hasn't
+ * settled on-chain yet.
+ */
+export const getPermit2Nonce = async (): Promise<string> => {
+  const arr = new Uint32Array(1);
+  global.crypto.getRandomValues(arr);
+  return arr[0].toString();
+};
+
 const getTransactionHash = ({
   safeAddress,
   to,
@@ -313,6 +328,91 @@ export const createSafeFeeAuthorization = async ({
   };
 };
 
+export const createPermit2FeeAuthorization = async ({
+  safeAddress,
+  signer,
+  amount,
+  spender,
+}: {
+  safeAddress: Hex;
+  signer: Signer;
+  amount: bigint;
+  spender: string;
+}): Promise<Permit2FeeAuthorization> => {
+  const nonce = await getPermit2Nonce();
+  const deadline = (Math.floor(Date.now() / 1000) + 3600).toString();
+  const token = MATIC_CONTRACTS.collateral;
+
+  const domain = {
+    name: 'Permit2',
+    chainId: POLYGON_MAINNET_CHAIN_ID,
+    verifyingContract: PERMIT2_ADDRESS,
+  };
+  const types = {
+    PermitTransferFrom: [
+      { name: 'permitted', type: 'TokenPermissions' },
+      { name: 'spender', type: 'address' },
+      { name: 'nonce', type: 'uint256' },
+      { name: 'deadline', type: 'uint256' },
+    ],
+    TokenPermissions: [
+      { name: 'token', type: 'address' },
+      { name: 'amount', type: 'uint256' },
+    ],
+  };
+  const message = {
+    permitted: { token, amount: amount.toString() },
+    spender,
+    nonce,
+    deadline,
+  };
+
+  const { _TypedDataEncoder } = ethers.utils;
+  const permit2Hash = _TypedDataEncoder.hash(domain, types, message);
+
+  const safeDomainSeparator = keccak256(
+    new AbiCoder().encode(
+      ['bytes32', 'uint256', 'address'],
+      [DOMAIN_SEPARATOR_TYPEHASH, POLYGON_MAINNET_CHAIN_ID, safeAddress],
+    ),
+  );
+
+  const encodedPermit2Hash = new AbiCoder().encode(['bytes32'], [permit2Hash]);
+  const safeMessageHash = keccak256(
+    new AbiCoder().encode(
+      ['bytes32', 'bytes32'],
+      [SAFE_MSG_TYPEHASH, keccak256(encodedPermit2Hash)],
+    ),
+  );
+
+  const finalHash = keccak256(
+    solidityPack(
+      ['bytes1', 'bytes1', 'bytes32', 'bytes32'],
+      ['0x19', '0x01', safeDomainSeparator, safeMessageHash],
+    ),
+  ) as Hex;
+
+  const rsvSignature = await signTransactionHash(signer, finalHash);
+  const signature = abiEncodePacked(
+    { type: 'uint256', value: rsvSignature.r },
+    { type: 'uint256', value: rsvSignature.s },
+    { type: 'uint8', value: rsvSignature.v },
+  );
+
+  return {
+    type: 'safe-permit2',
+    authorization: {
+      permit: {
+        permitted: { token, amount: amount.toString() },
+        nonce,
+        deadline,
+      },
+      spender,
+      signature,
+    },
+  };
+};
+
 export const getDeployProxyWalletTypedData = () => {
   const domain = {
     name: SAFE_FACTORY_NAME,
@@ -482,10 +582,16 @@ export const aggregateTransaction = (
   return transaction;
 };
 
-export const createAllowancesSafeTransaction = () => {
+export const createAllowancesSafeTransaction = (options?: {
+  extraUsdcSpenders?: string[];
+}) => {
   const safeTxns: SafeTransaction[] = [];
+  const allUsdcSpenders = [
+    ...usdcSpenders,
+    ...(options?.extraUsdcSpenders ?? []),
+  ];
 
-  for (const spender of usdcSpenders) {
+  for (const spender of allUsdcSpenders) {
     safeTxns.push({
       to: MATIC_CONTRACTS.collateral,
       data: encodeApprove({
@@ -576,12 +682,14 @@ export const getSafeTransactionCallData = async ({
 
 export const getProxyWalletAllowancesTransaction = async ({
   signer,
+  extraUsdcSpenders,
 }: {
   signer: Signer;
+  extraUsdcSpenders?: string[];
 }) => {
   try {
     const safeAddress = computeProxyAddress(signer.address);
-    const safeTxn = createAllowancesSafeTransaction();
+    const safeTxn = createAllowancesSafeTransaction({ extraUsdcSpenders });
     const callData = await getSafeTransactionCallData({
       signer,
       safeAddress,
@@ -624,10 +732,17 @@ export const getProxyWalletAllowancesTransaction = async ({
   }
 };
 
-export const hasAllowances = async ({ address }: { address: string }) => {
+export const hasAllowances = async ({
+  address,
+  extraUsdcSpenders = [],
+}: {
+  address: string;
+  extraUsdcSpenders?: string[];
+}) => {
   const allowanceCalls = [];
   const isApprovedForAllCalls = [];
-  for (const spender of usdcSpenders) {
+  const allUsdcSpenders = [...usdcSpenders, ...extraUsdcSpenders];
+  for (const spender of allUsdcSpenders) {
     allowanceCalls.push(
       getAllowance({
         tokenAddress: MATIC_CONTRACTS.collateral,
@@ -652,6 +767,19 @@ export const hasAllowances = async ({ address }: { address: string }) => {
   );
 };
 
+export const hasPermit2Allowance = async ({
+  address,
+}: {
+  address: string;
+}): Promise<boolean> => {
+  const allowance = await getAllowance({
+    tokenAddress: MATIC_CONTRACTS.collateral,
+    owner: address,
+    spender: PERMIT2_ADDRESS,
+  });
+  return allowance > 0;
+};
+
 export const createClaimSafeTransaction = (
   positions: PredictPosition[],
   includeTransfer?: {
diff --git a/app/components/UI/Predict/providers/polymarket/types.ts b/app/components/UI/Predict/providers/polymarket/types.ts
index 3116bf791e1a..21d5863203a2 100644
--- a/app/components/UI/Predict/providers/polymarket/types.ts
+++ b/app/components/UI/Predict/providers/polymarket/types.ts
@@ -1,5 +1,5 @@
 import { PredictGamePeriod, Side } from '../../types';
-import { SafeFeeAuthorization } from './safe/types';
+import { Permit2FeeAuthorization, SafeFeeAuthorization } from './safe/types';
 
 export interface PolymarketPosition {
   conditionId: string;
@@ -119,7 +119,7 @@ export type ClobHeaders = {
 export interface PolymarketOffchainTradeParams {
   clobOrder: ClobOrderObject;
   headers: ClobHeaders;
-  feeAuthorization?: SafeFeeAuthorization;
+  feeAuthorization?: SafeFeeAuthorization | Permit2FeeAuthorization;
 }
 
 // Polymarket API response types
diff --git a/app/components/UI/Predict/providers/polymarket/utils.test.ts b/app/components/UI/Predict/providers/polymarket/utils.test.ts
index 5839e5d15205..311a40ec4e7b 100644
--- a/app/components/UI/Predict/providers/polymarket/utils.test.ts
+++ b/app/components/UI/Predict/providers/polymarket/utils.test.ts
@@ -976,6 +976,81 @@ describe('polymarket utils', () => {
         },
       );
     });
+
+    it('includes executor in request body when provided', async () => {
+      await submitClobOrder({
+        headers: mockHeaders,
+        clobOrder: mockClobOrder,
+        executor: '0x1111111111111111111111111111111111111111',
+      });
+
+      const callArgs = mockFetch.mock.calls[0];
+      const bodyString = callArgs[1].body;
+      const parsedBody = JSON.parse(bodyString);
+
+      expect(parsedBody.executor).toBe(
+        '0x1111111111111111111111111111111111111111',
+      );
+    });
+
+    it('supports Permit2 fee authorization payload in request body', async () => {
+      const feeAuthorization = {
+        type: 'safe-permit2' as const,
+        authorization: {
+          permit: {
+            permitted: {
+              token: '0x2791Bca1f2de4661ED88A30C99A7a9449Aa84174',
+              amount: '1000000',
+            },
+            nonce: '0',
+            deadline: '1700000000',
+          },
+          spender: '0x1111111111111111111111111111111111111111',
+          signature: '0xabc',
+        },
+      };
+
+      await submitClobOrder({
+        headers: mockHeaders,
+        clobOrder: mockClobOrder,
+        feeAuthorization,
+      });
+
+      const callArgs = mockFetch.mock.calls[0];
+      const bodyString = callArgs[1].body;
+      const parsedBody = JSON.parse(bodyString);
+
+      expect(parsedBody.feeAuthorization).toEqual(feeAuthorization);
+    });
+
+    it('includes allowancesTx in request body when provided', async () => {
+      const allowancesTx = { to: '0xSafeAddress', data: '0xallowanceData' };
+
+      await submitClobOrder({
+        headers: mockHeaders,
+        clobOrder: mockClobOrder,
+        allowancesTx,
+      });
+
+      const callArgs = mockFetch.mock.calls[0];
+      const bodyString = callArgs[1].body;
+      const parsedBody = JSON.parse(bodyString);
+
+      expect(parsedBody.allowancesTx).toEqual(allowancesTx);
+    });
+
+    it('omits allowancesTx from request body when not provided', async () => {
+      await submitClobOrder({
+        headers: mockHeaders,
+        clobOrder: mockClobOrder,
+      });
+
+      const callArgs = mockFetch.mock.calls[0];
+      const bodyString = callArgs[1].body;
+      const parsedBody = JSON.parse(bodyString);
+
+      expect(parsedBody).not.toHaveProperty('allowancesTx');
+    });
   });
 
   describe('parsePolymarketEvents', () => {
@@ -2787,6 +2862,8 @@ describe('polymarket utils', () => {
       expect(fees.metamaskFee).toBe(expectedMetamaskFee);
       expect(fees.totalFeePercentage).toBe(totalFeePercentage);
       expect(fees.collector).toBe(feeCollection.collector);
+      expect(fees.executors).toEqual(feeCollection.executors ?? []);
+      expect(fees.permit2Enabled).toBe(feeCollection.permit2Enabled ?? false);
     });
 
     it('calculates fees correctly for various amounts', async () => {
@@ -2863,6 +2940,8 @@ describe('polymarket utils', () => {
       expect(fees.totalFee).toBe(0);
       expect(fees.totalFeePercentage).toBe(0);
       expect(fees.collector).toBe('0x0');
+      expect(fees.executors).toEqual([]);
+      expect(fees.permit2Enabled).toBe(false);
     });
 
     it('waives fees for markets in waiveList', async () => {
@@ -2893,6 +2972,27 @@ describe('polymarket utils', () => {
       expect(fees.totalFee).toBe(0);
       expect(fees.totalFeePercentage).toBe(0);
       expect(fees.collector).toBe('0x0');
+      expect(fees.executors).toEqual([]);
+      expect(fees.permit2Enabled).toBe(false);
+    });
+
+    it('returns executors and permit2Enabled from feeCollection config', async () => {
+      const params = {
+        feeCollection: {
+          ...feeCollection,
+          executors: ['0x1111111111111111111111111111111111111111'],
+          permit2Enabled: true,
+        },
+        marketId: 'market-1',
+        userBetAmount: 100,
+      };
+
+      const fees = await calculateFees(params);
+
+      expect(fees.executors).toEqual([
+        '0x1111111111111111111111111111111111111111',
+      ]);
+      expect(fees.permit2Enabled).toBe(true);
     });
   });
 
diff --git a/app/components/UI/Predict/providers/polymarket/utils.ts b/app/components/UI/Predict/providers/polymarket/utils.ts
index c94f9b590df4..a881b50aa4a9 100644
--- a/app/components/UI/Predict/providers/polymarket/utils.ts
+++ b/app/components/UI/Predict/providers/polymarket/utils.ts
@@ -45,7 +45,7 @@ import {
   SLIPPAGE_SELL,
   POLYMARKET_PROVIDER_ID,
 } from './constants';
-import { SafeFeeAuthorization } from './safe/types';
+import { Permit2FeeAuthorization, SafeFeeAuthorization } from './safe/types';
 import {
   ApiKeyCreds,
   ClobHeaders,
@@ -394,16 +394,26 @@ export const submitClobOrder = async ({
   headers,
   clobOrder,
   feeAuthorization,
+  executor,
+  allowancesTx,
 }: {
   headers: ClobHeaders;
   clobOrder: ClobOrderObject;
-  feeAuthorization?: SafeFeeAuthorization;
+  feeAuthorization?: SafeFeeAuthorization | Permit2FeeAuthorization;
+  executor?: string;
+  allowancesTx?: { to: string; data: string };
 }): Promise<Result<OrderResponse>> => {
   const { CLOB_RELAYER } = getPolymarketEndpoints();
   const url = `${CLOB_RELAYER}/order`;
-  const body: ClobOrderObject & { feeAuthorization?: SafeFeeAuthorization } = {
+  const body: ClobOrderObject & {
+    feeAuthorization?: SafeFeeAuthorization | Permit2FeeAuthorization;
+    executor?: string;
+    allowancesTx?: { to: string; data: string };
+  } = {
     ...clobOrder,
     feeAuthorization,
+    ...(executor && { executor }),
+    ...(allowancesTx && { allowancesTx }),
   };
 
   // For our relayer, we need to replace the underscores with dashes
@@ -734,7 +744,7 @@ export const parsePolymarketEvents = (
         recurrence: getRecurrence(event.series),
         endDate: event.endDate,
         category,
-        tags: tags.map((t) => t.label),
+        tags: tags.map((t) => t.slug),
         outcomes: markets.map((market: PolymarketApiMarket) =>
           parsePolymarketMarket(market, event),
         ),
@@ -1069,7 +1079,7 @@ async function waiveFees({
   const market = await getMarketDetailsFromGammaApi({ marketId });
   const { tags } = market;
   const slugs = tags?.map((t) => t.slug);
-  return slugs?.some((slug) => waiveList.includes(slug)) ?? false;
+  return slugs?.some((slug) => waiveList?.includes(slug)) ?? false;
 }
 
 export async function calculateFees({
@@ -1091,21 +1101,19 @@ export async function calculateFees({
       totalFee: 0,
       totalFeePercentage: 0,
       collector: '0x0',
+      executors: [],
+      permit2Enabled: false,
     };
   }
 
   const totalFeePercentage =
     (feeCollection.metamaskFee + feeCollection.providerFee) * 100;
 
-  let metamaskFee = userBetAmount * feeCollection.metamaskFee;
-  let providerFee = userBetAmount * feeCollection.providerFee;
+  const metamaskFee = userBetAmount * feeCollection.metamaskFee;
+  const providerFee = userBetAmount * feeCollection.providerFee;
 
-  // Round to 3 decimals
-  metamaskFee = Math.round(metamaskFee * 1000) / 1000;
-  providerFee = Math.round(providerFee * 1000) / 1000;
-
-  // Rounded to 4 decimals
-  const totalFee = metamaskFee + providerFee;
+  // Rounded to 6 decimals
+  const totalFee = Math.round((metamaskFee + providerFee) * 1000000) / 1000000;
 
   return {
     metamaskFee,
@@ -1113,6 +1121,8 @@ export async function calculateFees({
     totalFee,
     totalFeePercentage,
     collector: feeCollection.collector,
+    executors: feeCollection.executors ?? [],
+    permit2Enabled: feeCollection.permit2Enabled ?? false,
   };
 }
 
@@ -1506,7 +1516,7 @@ export const previewOrder = async (
       fees: await calculateFees({
         feeCollection,
         marketId,
-        userBetAmount: size,
+        userBetAmount: makerAmount,
       }),
     };
   }
diff --git a/app/components/UI/Predict/providers/types.ts b/app/components/UI/Predict/providers/types.ts
index ace26d8cd6dc..0d15ba18cd5a 100644
--- a/app/components/UI/Predict/providers/types.ts
+++ b/app/components/UI/Predict/providers/types.ts
@@ -24,7 +24,7 @@ import {
 } from '../types';
 import { Hex } from '@metamask/utils';
 import { TransactionType } from '@metamask/transaction-controller';
-import { PredictFeeCollection } from '../types/flags';
+import { PredictFeatureFlags } from '../types/flags';
 
 // Re-export shared types so existing provider-layer imports continue to work
 export type {
@@ -42,6 +42,7 @@ export type {
   PreviewOrderParams,
   PriceUpdateCallback,
 };
+export type { PredictFeatureFlags };
 
 export interface Signer {
   address: string;
@@ -121,14 +122,8 @@ export interface PredictProvider {
   readonly chainId: number;
 
   getMarkets(params: GetMarketsParams): Promise<PredictMarket[]>;
-  getMarketsByIds?(
-    marketIds: string[],
-    liveSportsLeagues?: string[],
-  ): Promise<PredictMarket[]>;
-  getMarketDetails(params: {
-    marketId: string;
-    liveSportsLeagues?: string[];
-  }): Promise<PredictMarket>;
+  getMarketsByIds?(marketIds: string[]): Promise<PredictMarket[]>;
+  getMarketDetails(params: { marketId: string }): Promise<PredictMarket>;
   getPriceHistory(
     params: GetPriceHistoryParams,
   ): Promise<PredictPriceHistoryPoint[]>;
@@ -143,7 +138,6 @@ export interface PredictProvider {
   previewOrder(
     params: PreviewOrderParams & {
       signer: Signer;
-      feeCollection?: PredictFeeCollection;
     },
   ): Promise<OrderPreview>;
   placeOrder(
diff --git a/app/components/UI/Predict/queries/index.ts b/app/components/UI/Predict/queries/index.ts
index fc150fc152b5..26b0d84657ea 100644
--- a/app/components/UI/Predict/queries/index.ts
+++ b/app/components/UI/Predict/queries/index.ts
@@ -1,6 +1,10 @@
 import { predictActivityKeys, predictActivityOptions } from './activity';
 import { predictBalanceKeys, predictBalanceOptions } from './balance';
 import { predictPositionsKeys, predictPositionsOptions } from './positions';
+import {
+  predictUnrealizedPnLKeys,
+  predictUnrealizedPnLOptions,
+} from './unrealizedPnL';
 
 export const predictQueries = {
   activity: {
@@ -15,4 +19,8 @@ export const predictQueries = {
     keys: predictPositionsKeys,
     options: predictPositionsOptions,
   },
+  unrealizedPnL: {
+    keys: predictUnrealizedPnLKeys,
+    options: predictUnrealizedPnLOptions,
+  },
 };
diff --git a/app/components/UI/Predict/queries/unrealizedPnL.ts b/app/components/UI/Predict/queries/unrealizedPnL.ts
new file mode 100644
index 000000000000..98f02cb25d30
--- /dev/null
+++ b/app/components/UI/Predict/queries/unrealizedPnL.ts
@@ -0,0 +1,27 @@
+import { queryOptions } from '@tanstack/react-query';
+import Engine from '../../../../core/Engine';
+import { DevLogger } from '../../../../core/SDKConnect/utils/DevLogger';
+import type { UnrealizedPnL } from '../types';
+
+export const predictUnrealizedPnLKeys = {
+  all: () => ['predict', 'unrealizedPnL'] as const,
+  byAddress: (address: string) =>
+    [...predictUnrealizedPnLKeys.all(), address] as const,
+};
+
+export const predictUnrealizedPnLOptions = ({ address }: { address: string }) =>
+  queryOptions({
+    queryKey: predictUnrealizedPnLKeys.byAddress(address),
+    queryFn: async (): Promise<UnrealizedPnL | null> => {
+      const result = await Engine.context.PredictController.getUnrealizedPnL({
+        address,
+      });
+
+      DevLogger.log('useUnrealizedPnL: Loaded unrealized P&L', {
+        unrealizedPnL: result,
+      });
+
+      return result ?? null;
+    },
+    staleTime: 10_000,
+  });
diff --git a/app/components/UI/Predict/selectors/featureFlags/index.test.ts b/app/components/UI/Predict/selectors/featureFlags/index.test.ts
index 08fe65e96666..436b0493870d 100644
--- a/app/components/UI/Predict/selectors/featureFlags/index.test.ts
+++ b/app/components/UI/Predict/selectors/featureFlags/index.test.ts
@@ -1,6 +1,7 @@
 import {
   selectPredictEnabledFlag,
-  selectPredictGtmOnboardingModalEnabledFlag,
+  selectPredictFakOrdersEnabledFlag,
+  selectPredictFeeCollectionFlag,
   selectPredictHotTabFlag,
 } from '.';
 import mockedEngine from '../../../../../core/__mocks__/MockedEngine';
@@ -36,7 +37,6 @@ describe('Predict Feature Flag Selectors', () => {
   beforeEach(() => {
     jest.clearAllMocks();
     delete process.env.MM_PREDICT_ENABLED;
-    delete process.env.MM_PREDICT_GTM_MODAL_ENABLED;
     mockHasMinimumRequiredVersion = jest.spyOn(
       remoteFeatureFlagModule,
       'hasMinimumRequiredVersion',
@@ -46,7 +46,6 @@ describe('Predict Feature Flag Selectors', () => {
 
   afterEach(() => {
     delete process.env.MM_PREDICT_ENABLED;
-    delete process.env.MM_PREDICT_GTM_MODAL_ENABLED;
     mockHasMinimumRequiredVersion?.mockRestore();
   });
 
@@ -192,79 +191,6 @@ describe('Predict Feature Flag Selectors', () => {
     });
   });
 
-  describe('selectPredictGtmOnboardingModalEnabledFlag', () => {
-    it('returns true when remote flag is enabled (VersionGated shape from builds.yml)', () => {
-      const state = {
-        engine: {
-          backgroundState: {
-            RemoteFeatureFlagController: {
-              remoteFeatureFlags: {
-                predictGtmOnboardingModalEnabled: {
-                  enabled: true,
-                  minimumVersion: '0.0.0',
-                },
-              },
-              cacheTimestamp: 0,
-            },
-          },
-        },
-      };
-      expect(selectPredictGtmOnboardingModalEnabledFlag(state)).toBe(true);
-    });
-
-    it('returns false when remote flag is disabled (VersionGated shape from builds.yml)', () => {
-      const state = {
-        engine: {
-          backgroundState: {
-            RemoteFeatureFlagController: {
-              remoteFeatureFlags: {
-                predictGtmOnboardingModalEnabled: {
-                  enabled: false,
-                  minimumVersion: '0.0.0',
-                },
-              },
-              cacheTimestamp: 0,
-            },
-          },
-        },
-      };
-      expect(selectPredictGtmOnboardingModalEnabledFlag(state)).toBe(false);
-    });
-
-    it('falls back to process.env.MM_PREDICT_GTM_MODAL_ENABLED when remote flag is absent', () => {
-      const emptyRemoteState = {
-        engine: {
-          backgroundState: {
-            RemoteFeatureFlagController: {
-              remoteFeatureFlags: {},
-              cacheTimestamp: 0,
-            },
-          },
-        },
-      };
-      const emptyRemoteState2 = {
-        engine: {
-          backgroundState: {
-            RemoteFeatureFlagController: {
-              remoteFeatureFlags: {},
-              cacheTimestamp: 1,
-            },
-          },
-        },
-      };
-
-      process.env.MM_PREDICT_GTM_MODAL_ENABLED = 'true';
-      expect(selectPredictGtmOnboardingModalEnabledFlag(emptyRemoteState)).toBe(
-        true,
-      );
-
-      process.env.MM_PREDICT_GTM_MODAL_ENABLED = 'false';
-      expect(
-        selectPredictGtmOnboardingModalEnabledFlag(emptyRemoteState2),
-      ).toBe(false);
-    });
-  });
-
   describe('selectPredictHotTabFlag', () => {
     it('returns hot tab flag when present in remote feature flags', () => {
       const stateWithHotTabFlag = {
@@ -717,4 +643,285 @@ describe('Predict Feature Flag Selectors', () => {
       });
     });
   });
+
+  describe('selectPredictFeeCollectionFlag', () => {
+    it('returns fee collection config when present in remote feature flags', () => {
+      const feeCollectionConfig = {
+        enabled: true,
+        collector: '0xe6a2026d58eaff3c7ad7ba9386fb143388002382',
+        metamaskFee: 0.03,
+        providerFee: 0.01,
+        waiveList: ['middle-east'],
+        executors: ['0x1234'],
+        permit2Enabled: true,
+      };
+      const stateWithFeeCollection = {
+        engine: {
+          backgroundState: {
+            RemoteFeatureFlagController: {
+              remoteFeatureFlags: {
+                predictFeeCollection: feeCollectionConfig,
+              },
+              cacheTimestamp: 0,
+            },
+          },
+        },
+      };
+
+      const result = selectPredictFeeCollectionFlag(stateWithFeeCollection);
+
+      expect(result).toEqual(feeCollectionConfig);
+    });
+
+    it('returns default flag when remote flag is missing', () => {
+      const result = selectPredictFeeCollectionFlag(mockedEmptyFlagsState);
+
+      expect(result).toEqual({
+        enabled: true,
+        collector: expect.any(String),
+        metamaskFee: 0.02,
+        providerFee: 0.02,
+        waiveList: [],
+        executors: [],
+        permit2Enabled: false,
+      });
+    });
+
+    it('returns default flag when remote flag is null', () => {
+      const stateWithNullFlag = {
+        engine: {
+          backgroundState: {
+            RemoteFeatureFlagController: {
+              remoteFeatureFlags: {
+                predictFeeCollection: null,
+              },
+              cacheTimestamp: 0,
+            },
+          },
+        },
+      };
+
+      const result = selectPredictFeeCollectionFlag(stateWithNullFlag);
+
+      expect(result).toEqual({
+        enabled: true,
+        collector: expect.any(String),
+        metamaskFee: 0.02,
+        providerFee: 0.02,
+        waiveList: [],
+        executors: [],
+        permit2Enabled: false,
+      });
+    });
+
+    it('returns default flag when controller is undefined', () => {
+      const stateWithUndefinedController = {
+        engine: {
+          backgroundState: {
+            RemoteFeatureFlagController: undefined,
+          },
+        },
+      };
+
+      const result = selectPredictFeeCollectionFlag(
+        stateWithUndefinedController,
+      );
+
+      expect(result).toEqual({
+        enabled: true,
+        collector: expect.any(String),
+        metamaskFee: 0.02,
+        providerFee: 0.02,
+        waiveList: [],
+        executors: [],
+        permit2Enabled: false,
+      });
+    });
+
+    it('returns remote config with custom waiveList', () => {
+      const stateWithWaiveList = {
+        engine: {
+          backgroundState: {
+            RemoteFeatureFlagController: {
+              remoteFeatureFlags: {
+                predictFeeCollection: {
+                  enabled: true,
+                  collector: '0xabc',
+                  metamaskFee: 0.05,
+                  providerFee: 0.03,
+                  waiveList: ['middle-east', 'humanitarian'],
+                  executors: [],
+                  permit2Enabled: false,
+                },
+              },
+              cacheTimestamp: 0,
+            },
+          },
+        },
+      };
+
+      const result = selectPredictFeeCollectionFlag(stateWithWaiveList);
+
+      expect(result.waiveList).toEqual(['middle-east', 'humanitarian']);
+      expect(result.metamaskFee).toBe(0.05);
+      expect(result.providerFee).toBe(0.03);
+    });
+
+    it('returns remote config when fee collection is disabled', () => {
+      const stateWithDisabledFees = {
+        engine: {
+          backgroundState: {
+            RemoteFeatureFlagController: {
+              remoteFeatureFlags: {
+                predictFeeCollection: {
+                  enabled: false,
+                  collector: '0x0',
+                  metamaskFee: 0,
+                  providerFee: 0,
+                  waiveList: [],
+                },
+              },
+              cacheTimestamp: 0,
+            },
+          },
+        },
+      };
+
+      const result = selectPredictFeeCollectionFlag(stateWithDisabledFees);
+
+      expect(result.enabled).toBe(false);
+    });
+  });
+
+  describe('selectPredictFakOrdersEnabledFlag', () => {
+    it('returns true when remote flag is enabled and version check passes', () => {
+      mockHasMinimumRequiredVersion.mockReturnValue(true);
+      const state = {
+        engine: {
+          backgroundState: {
+            RemoteFeatureFlagController: {
+              remoteFeatureFlags: {
+                predictFakOrders: {
+                  enabled: true,
+                  minimumVersion: '1.0.0',
+                },
+              },
+              cacheTimestamp: 0,
+            },
+          },
+        },
+      };
+
+      const result = selectPredictFakOrdersEnabledFlag(state);
+
+      expect(result).toBe(true);
+    });
+
+    it('returns false when remote flag is disabled', () => {
+      mockHasMinimumRequiredVersion.mockReturnValue(true);
+      const state = {
+        engine: {
+          backgroundState: {
+            RemoteFeatureFlagController: {
+              remoteFeatureFlags: {
+                predictFakOrders: {
+                  enabled: false,
+                  minimumVersion: '1.0.0',
+                },
+              },
+              cacheTimestamp: 0,
+            },
+          },
+        },
+      };
+
+      const result = selectPredictFakOrdersEnabledFlag(state);
+
+      expect(result).toBe(false);
+    });
+
+    it('returns false when app version is below minimum required version', () => {
+      mockHasMinimumRequiredVersion.mockReturnValue(false);
+      const state = {
+        engine: {
+          backgroundState: {
+            RemoteFeatureFlagController: {
+              remoteFeatureFlags: {
+                predictFakOrders: {
+                  enabled: true,
+                  minimumVersion: '99.0.0',
+                },
+              },
+              cacheTimestamp: 0,
+            },
+          },
+        },
+      };
+
+      const result = selectPredictFakOrdersEnabledFlag(state);
+
+      expect(result).toBe(false);
+    });
+
+    it('defaults to false when remote flag is null', () => {
+      const state = {
+        engine: {
+          backgroundState: {
+            RemoteFeatureFlagController: {
+              remoteFeatureFlags: {
+                predictFakOrders: null,
+              },
+              cacheTimestamp: 0,
+            },
+          },
+        },
+      };
+
+      const result = selectPredictFakOrdersEnabledFlag(state);
+
+      expect(result).toBe(false);
+    });
+
+    it('defaults to false when remote feature flags are empty', () => {
+      const result = selectPredictFakOrdersEnabledFlag(mockedEmptyFlagsState);
+
+      expect(result).toBe(false);
+    });
+
+    it('defaults to false when controller is undefined', () => {
+      const state = {
+        engine: {
+          backgroundState: {
+            RemoteFeatureFlagController: undefined,
+          },
+        },
+      };
+
+      const result = selectPredictFakOrdersEnabledFlag(state);
+
+      expect(result).toBe(false);
+    });
+
+    it('defaults to false when remote flag is invalid', () => {
+      const state = {
+        engine: {
+          backgroundState: {
+            RemoteFeatureFlagController: {
+              remoteFeatureFlags: {
+                predictFakOrders: {
+                  enabled: 'invalid',
+                  minimumVersion: 123,
+                },
+              },
+              cacheTimestamp: 0,
+            },
+          },
+        },
+      };
+
+      const result = selectPredictFakOrdersEnabledFlag(state);
+
+      expect(result).toBe(false);
+    });
+  });
 });
diff --git a/app/components/UI/Predict/selectors/featureFlags/index.ts b/app/components/UI/Predict/selectors/featureFlags/index.ts
index b2865f2548ea..c8cfee9e2831 100644
--- a/app/components/UI/Predict/selectors/featureFlags/index.ts
+++ b/app/components/UI/Predict/selectors/featureFlags/index.ts
@@ -4,8 +4,11 @@ import {
   VersionGatedFeatureFlag,
   validatedVersionGatedFeatureFlag,
 } from '../../../../../util/remoteFeatureFlag';
-import { PredictHotTabFlag } from '../../types/flags';
-import { DEFAULT_HOT_TAB_FLAG } from '../../constants/flags';
+import { PredictFeatureFlags, PredictHotTabFlag } from '../../types/flags';
+import {
+  DEFAULT_FEE_COLLECTION_FLAG,
+  DEFAULT_HOT_TAB_FLAG,
+} from '../../constants/flags';
 import { unwrapRemoteFeatureFlag } from '../../utils/flags';
 
 /**
@@ -38,6 +41,7 @@ export const selectPredictGtmOnboardingModalEnabledFlag = createSelector(
       remoteFeatureFlags?.predictGtmOnboardingModalEnabled,
     );
 
+    // Fallback to local flag if remote flag is not available
     return validatedVersionGatedFeatureFlag(remoteFlag) ?? localFlag;
   },
 );
@@ -108,3 +112,39 @@ export const selectPredictHotTabFlag = createSelector(
     return flag;
   },
 );
+
+/**
+ * Selector for Predict fee collection config flag
+ */
+export const selectPredictFeeCollectionFlag = createSelector(
+  selectRemoteFeatureFlags,
+  (remoteFeatureFlags) => {
+    const flag = unwrapRemoteFeatureFlag<PredictFeatureFlags['feeCollection']>(
+      remoteFeatureFlags?.predictFeeCollection,
+    );
+
+    if (!flag) {
+      return DEFAULT_FEE_COLLECTION_FLAG;
+    }
+
+    return flag;
+  },
+);
+
+/**
+ * Selector for Predict FAK (Fill-And-Kill) orders enablement
+ *
+ * Uses version-gated feature flag `predictFakOrders` from remote config.
+ * Falls back to `false` if remote flag is unavailable or invalid.
+ *
+ * @returns {boolean} True if FAK orders are enabled and version requirement is met
+ */
+export const selectPredictFakOrdersEnabledFlag = createSelector(
+  selectRemoteFeatureFlags,
+  (remoteFeatureFlags) =>
+    validatedVersionGatedFeatureFlag(
+      unwrapRemoteFeatureFlag<VersionGatedFeatureFlag>(
+        remoteFeatureFlags?.predictFakOrders,
+      ),
+    ) ?? false,
+);
diff --git a/app/components/UI/Predict/types/flags.ts b/app/components/UI/Predict/types/flags.ts
index 9444940b7c54..54e60d1ac9ca 100644
--- a/app/components/UI/Predict/types/flags.ts
+++ b/app/components/UI/Predict/types/flags.ts
@@ -7,6 +7,8 @@ export interface PredictFeeCollection {
   metamaskFee: number;
   providerFee: number;
   waiveList: string[];
+  executors?: string[];
+  permit2Enabled?: boolean;
 }
 
 export interface PredictLiveSportsFlag {
@@ -23,6 +25,13 @@ export interface PredictMarketHighlightsFlag extends VersionGatedFeatureFlag {
   highlights: PredictMarketHighlight[];
 }
 
+export interface PredictFeatureFlags {
+  feeCollection: PredictFeeCollection;
+  liveSportsLeagues: string[];
+  marketHighlightsFlag: PredictMarketHighlightsFlag;
+  fakOrdersEnabled: boolean;
+}
+
 export interface PredictHotTabFlag extends VersionGatedFeatureFlag {
   queryParams?: string; // Raw query params WITHOUT leading &: "tag_id=149&tag_id=100995&order=volume24hr"
 }
diff --git a/app/components/UI/Predict/types/index.ts b/app/components/UI/Predict/types/index.ts
index 6191a2279a48..51464d2ee186 100644
--- a/app/components/UI/Predict/types/index.ts
+++ b/app/components/UI/Predict/types/index.ts
@@ -7,6 +7,8 @@ export enum Side {
   SELL = 'SELL',
 }
 
+export type PredictOrderType = 'FOK' | 'FAK';
+
 export enum PredictPriceHistoryInterval {
   ONE_HOUR = '1h',
   SIX_HOUR = '6h',
@@ -420,7 +422,6 @@ export interface GetMarketsParams {
   sortDirection?: 'asc' | 'desc';
   offset?: number;
   limit?: number;
-  liveSportsLeagues?: string[];
   customQueryParams?: string;
 }
 
@@ -434,6 +435,8 @@ export interface PredictFees {
   totalFee: number;
   totalFeePercentage: number;
   collector: Hex;
+  executors?: string[];
+  permit2Enabled?: boolean;
 }
 
 /**
@@ -469,6 +472,7 @@ export interface OrderPreview {
   // For sell orders, we can store the position ID
   // so we can perform optimistic updates
   positionId?: string;
+  orderType?: PredictOrderType;
 }
 
 export type OrderResult = Result<{
@@ -540,3 +544,5 @@ export interface GetAccountStateParams {}
 
 // eslint-disable-next-line @typescript-eslint/no-empty-interface
 export interface PrepareWithdrawParams {}
+
+export type { PredictFeatureFlags } from './flags';
diff --git a/app/components/UI/Predict/utils/format.test.ts b/app/components/UI/Predict/utils/format.test.ts
index bcef0ca9d88f..483a3941a7f2 100644
--- a/app/components/UI/Predict/utils/format.test.ts
+++ b/app/components/UI/Predict/utils/format.test.ts
@@ -1980,21 +1980,101 @@ describe('format utils', () => {
       });
     });
 
-    describe('Negative values', () => {
-      it('formats negative regular price', () => {
+    describe('with currencyCode param', () => {
+      it('defaults to USD when no currencyCode is provided', () => {
         // Arrange & Act
-        const result = formatPriceWithSubscriptNotation(-1.99);
+        const result = formatPriceWithSubscriptNotation(1.99);
+
+        // Assert
+        expect(result).toBe('$1.99');
+      });
+
+      it('formats regular price with EUR', () => {
+        // Arrange & Act
+        const result = formatPriceWithSubscriptNotation(1.99, 'EUR');
+
+        // Assert
+        expect(result).toBe('€1.99');
+      });
+
+      it('formats price with up to 4 decimal places with EUR', () => {
+        // Arrange & Act
+        const result = formatPriceWithSubscriptNotation(0.144566, 'EUR');
+
+        // Assert
+        expect(result).toBe('€0.1446');
+      });
+
+      it('formats large price with GBP (not in symbol map, uses suffix)', () => {
+        // Arrange & Act
+        const result = formatPriceWithSubscriptNotation(1234.56, 'GBP');
+
+        // Assert
+        expect(result).toBe('1,234.56 GBP');
+      });
+
+      it('accepts lowercase currency code', () => {
+        // Arrange & Act
+        const result = formatPriceWithSubscriptNotation(99.99, 'eur');
+
+        // Assert
+        expect(result).toBe('€99.99');
+      });
+
+      it('formats subscript value with EUR symbol', () => {
+        // Arrange & Act
+        const result = formatPriceWithSubscriptNotation(0.00000614, 'EUR');
+
+        // Assert
+        expect(result).toBe('€0.0₅614');
+      });
+
+      it('formats subscript value with GBP (not in symbol map, uses suffix)', () => {
+        // Arrange & Act
+        const result = formatPriceWithSubscriptNotation(0.00001, 'GBP');
+
+        // Assert
+        expect(result).toBe('0.0₄1 GBP');
+      });
+
+      it('returns dash for zero regardless of currency', () => {
+        // Arrange & Act
+        const result = formatPriceWithSubscriptNotation(0, 'EUR');
+
+        // Assert
+        expect(result).toBe('—');
+      });
+
+      it('formats whole number with EUR showing 2 decimals', () => {
+        // Arrange & Act
+        const result = formatPriceWithSubscriptNotation(100, 'EUR');
+
+        // Assert
+        expect(result).toBe('€100.00');
+      });
+
+      it('uses currency code as suffix for currencies not in the symbol map (e.g. PLN)', () => {
+        // Arrange & Act
+        const result = formatPriceWithSubscriptNotation(0.00001263, 'PLN');
+
+        // Assert
+        expect(result).toBe('0.0₄1263 PLN');
+      });
+
+      it('uses currency code as suffix for subscript values with unknown currency', () => {
+        // Arrange & Act
+        const result = formatPriceWithSubscriptNotation(0.00000614, 'CHF');
 
         // Assert
-        expect(result).toBe('-$1.99');
+        expect(result).toBe('0.0₅614 CHF');
       });
 
-      it('formats negative large price', () => {
+      it('accepts lowercase unknown currency code and uppercases it as suffix', () => {
         // Arrange & Act
-        const result = formatPriceWithSubscriptNotation(-1234.56);
+        const result = formatPriceWithSubscriptNotation(0.00001, 'pln');
 
         // Assert
-        expect(result).toBe('-$1,234.56');
+        expect(result).toBe('0.0₄1 PLN');
       });
     });
 
@@ -2017,8 +2097,6 @@ describe('format utils', () => {
       [0.00000614, '$0.0₅614'],
       [0.0000001234, '$0.0₆1234'],
       [0.000000001, '$0.0₈1'],
-      [-1.99, '-$1.99'],
-      [-1234.56, '-$1,234.56'],
     ])('formats %f as %s', (input, expected) => {
       expect(formatPriceWithSubscriptNotation(input)).toBe(expected);
     });
diff --git a/app/components/UI/Predict/utils/format.ts b/app/components/UI/Predict/utils/format.ts
index a941e060e35e..45122edcc98a 100644
--- a/app/components/UI/Predict/utils/format.ts
+++ b/app/components/UI/Predict/utils/format.ts
@@ -1,6 +1,7 @@
 import { Dimensions } from 'react-native';
 import { PredictSeries, Recurrence } from '../types';
 import { formatSubscriptNotation } from '../../../../util/number/subscriptNotation';
+import currencySymbols from '../../../../util/currency-symbols.json';
 
 /**
  * Formats a percentage value
@@ -109,20 +110,23 @@ export const formatPrice = (
 };
 
 /**
- * Formats a price value for trending tokens with subscript notation for very small values
+ * Formats a price value with subscript notation for very small values
  * - Uses subscript notation for values with 4+ leading zeros (e.g., 0.00000614 → $0.0₅614)
  * - The subscript indicates the number of leading zeros after the decimal point
  * - Returns "—" for zero values
  * - Uses min 2, max 4 decimal places for regular values
  * @param price - The price value to format (string or number)
- * @returns Formatted price string with $ prefix or "—" for zero
+ * @param currencyCode - ISO 4217 currency code (e.g. 'USD', 'EUR'). Defaults to 'USD'.
+ * @returns Formatted price string with currency symbol or "—" for zero
  * @example formatPriceWithSubscriptNotation(1.99) => "$1.99"
  * @example formatPriceWithSubscriptNotation(0.144566) => "$0.1446"
  * @example formatPriceWithSubscriptNotation(0.00000614) => "$0.0₅614"
  * @example formatPriceWithSubscriptNotation(0) => "—"
+ * @example formatPriceWithSubscriptNotation(1.2345, 'EUR') => "€1.2345"
  */
 export const formatPriceWithSubscriptNotation = (
   price: string | number,
+  currencyCode = 'USD',
 ): string => {
   const num = typeof price === 'string' ? parseFloat(price) : price;
 
@@ -134,12 +138,22 @@ export const formatPriceWithSubscriptNotation = (
     return '—';
   }
 
-  const subscript = formatSubscriptNotation(num);
-  if (subscript) {
-    return `$${subscript}`;
-  }
+  // Known symbol (e.g. $, €) → prefix; unknown code (e.g. PLN) → suffix
+  // Matches addCurrencySymbol convention used elsewhere in the app
+  const symbol =
+    currencySymbols[currencyCode.toLowerCase() as keyof typeof currencySymbols];
+  const addSymbol = (n: string) =>
+    symbol ? `${symbol}${n}` : `${n} ${currencyCode.toUpperCase()}`;
 
-  return formatPrice(num, { minimumDecimals: 2, maximumDecimals: 4 });
+  const subscript = formatSubscriptNotation(num);
+  if (subscript) return addSymbol(subscript);
+
+  const formattedNumber = new Intl.NumberFormat('en-US', {
+    style: 'decimal',
+    minimumFractionDigits: 2,
+    maximumFractionDigits: 4,
+  }).format(num);
+  return addSymbol(formattedNumber);
 };
 
 /**
diff --git a/app/components/UI/Predict/views/PredictBuyPreview/PredictBuyPreview.tsx b/app/components/UI/Predict/views/PredictBuyPreview/PredictBuyPreview.tsx
index 60621002bf84..8c3d284b4b69 100644
--- a/app/components/UI/Predict/views/PredictBuyPreview/PredictBuyPreview.tsx
+++ b/app/components/UI/Predict/views/PredictBuyPreview/PredictBuyPreview.tsx
@@ -34,6 +34,7 @@ import {
   ScrollView,
   TouchableOpacity,
 } from 'react-native';
+import { useSelector } from 'react-redux';
 import Button, {
   ButtonSize,
   ButtonVariants,
@@ -78,7 +79,7 @@ import { TraceName } from '../../../../../util/trace';
 import { usePredictMeasurement } from '../../hooks/usePredictMeasurement';
 import { PredictBuyPreviewSelectorsIDs } from '../../Predict.testIds';
 import { usePredictOrderRetry } from '../../hooks/usePredictOrderRetry';
-
+import { selectPredictFakOrdersEnabledFlag } from '../../selectors/featureFlags';
 export const MINIMUM_BET = 1; // $1 minimum bet
 
 const PredictBuyPreview = () => {
@@ -131,6 +132,7 @@ const PredictBuyPreview = () => {
     usePredictBalance();
 
   const { deposit } = usePredictDeposit();
+  const fakOrdersEnabled = useSelector(selectPredictFakOrdersEnabledFlag);
 
   const [currentValue, setCurrentValue] = useState(0);
   const [currentValueUSDString, setCurrentValueUSDString] = useState('');
@@ -653,6 +655,7 @@ const PredictBuyPreview = () => {
           betAmount={currentValue}
           total={total}
           onClose={handleFeeBreakdownClose}
+          fakOrdersEnabled={fakOrdersEnabled}
         />
       )}
       <PredictOrderRetrySheet
diff --git a/app/components/UI/Predict/views/PredictMarketDetails/PredictMarketDetails.test.tsx b/app/components/UI/Predict/views/PredictMarketDetails/PredictMarketDetails.test.tsx
index 1e569da50316..8c9a3974b61b 100644
--- a/app/components/UI/Predict/views/PredictMarketDetails/PredictMarketDetails.test.tsx
+++ b/app/components/UI/Predict/views/PredictMarketDetails/PredictMarketDetails.test.tsx
@@ -592,6 +592,20 @@ function setupPredictMarketDetailsTest(
           PreferencesController: {
             privacyMode: false,
           },
+          RemoteFeatureFlagController: {
+            remoteFeatureFlags: {
+              predictFeeCollection: {
+                enabled: true,
+                collector: '0xe6a2026d58eaff3c7ad7ba9386fb143388002382',
+                metamaskFee: 0.02,
+                providerFee: 0.02,
+                waiveList: ['middle-east'],
+                executors: [],
+                permit2Enabled: false,
+              },
+            },
+            cacheTimestamp: 0,
+          },
         },
       },
     },
@@ -3197,10 +3211,10 @@ describe('PredictMarketDetails', () => {
   });
 
   describe('Fee Exemption Display', () => {
-    it('displays fee exemption message when market has Middle East tag', () => {
-      const marketWithMiddleEastTag = createMockMarket({
+    it('displays fee exemption message when market tag matches waiveList', () => {
+      const marketWithWaivedTag = createMockMarket({
         status: 'open',
-        tags: ['Middle East'],
+        tags: ['middle-east'],
         outcomes: [
           {
             id: 'outcome-1',
@@ -3214,17 +3228,17 @@ describe('PredictMarketDetails', () => {
         ],
       });
 
-      setupPredictMarketDetailsTest(marketWithMiddleEastTag);
+      setupPredictMarketDetailsTest(marketWithWaivedTag);
 
       expect(
         screen.getByText('predict.market_details.fee_exemption'),
       ).toBeOnTheScreen();
     });
 
-    it('hides fee exemption message when market does not have Middle East tag', () => {
-      const marketWithoutMiddleEastTag = createMockMarket({
+    it('hides fee exemption message when market tags do not match waiveList', () => {
+      const marketWithNonWaivedTags = createMockMarket({
         status: 'open',
-        tags: ['Sports', 'Politics'],
+        tags: ['sports', 'politics'],
         outcomes: [
           {
             id: 'outcome-1',
@@ -3238,7 +3252,7 @@ describe('PredictMarketDetails', () => {
         ],
       });
 
-      setupPredictMarketDetailsTest(marketWithoutMiddleEastTag);
+      setupPredictMarketDetailsTest(marketWithNonWaivedTags);
 
       expect(
         screen.queryByText('predict.market_details.fee_exemption'),
@@ -3293,10 +3307,10 @@ describe('PredictMarketDetails', () => {
       ).not.toBeOnTheScreen();
     });
 
-    it('displays fee exemption message when Middle East tag exists among multiple tags', () => {
+    it('displays fee exemption message when waiveList tag exists among multiple tags', () => {
       const marketWithMultipleTags = createMockMarket({
         status: 'open',
-        tags: ['Politics', 'Middle East', 'International'],
+        tags: ['politics', 'middle-east', 'international'],
         outcomes: [
           {
             id: 'outcome-1',
@@ -3317,10 +3331,10 @@ describe('PredictMarketDetails', () => {
       ).toBeOnTheScreen();
     });
 
-    it('displays fee exemption message when market is closed with Middle East tag', () => {
-      const closedMarketWithMiddleEastTag = createMockMarket({
+    it('displays fee exemption message when market is closed with waiveList tag', () => {
+      const closedMarketWithWaivedTag = createMockMarket({
         status: 'closed',
-        tags: ['Middle East'],
+        tags: ['middle-east'],
         outcomes: [
           {
             id: 'outcome-1',
@@ -3331,23 +3345,23 @@ describe('PredictMarketDetails', () => {
         ],
       });
 
-      setupPredictMarketDetailsTest(closedMarketWithMiddleEastTag);
+      setupPredictMarketDetailsTest(closedMarketWithWaivedTag);
 
-      // Note: The component currently shows the fee exemption message for closed markets
-      // if they have the Middle East tag. This behavior matches the current implementation.
+      // Note: The component shows the fee exemption message for closed markets
+      // if they have a tag matching the waiveList. This matches the current implementation.
       expect(
         screen.getByText('predict.market_details.fee_exemption'),
       ).toBeOnTheScreen();
     });
 
-    it('removes fee exemption message when market updates without Middle East tag', async () => {
+    it('removes fee exemption message when market updates without waiveList tag', async () => {
       const { usePredictMarket } = jest.requireMock(
         '../../hooks/usePredictMarket',
       );
 
-      const marketWithMiddleEastTag = createMockMarket({
+      const marketWithWaivedTag = createMockMarket({
         status: 'open',
-        tags: ['Middle East', 'Politics'],
+        tags: ['middle-east', 'politics'],
         outcomes: [
           {
             id: 'outcome-1',
@@ -3361,17 +3375,15 @@ describe('PredictMarketDetails', () => {
         ],
       });
 
-      const { rerender } = setupPredictMarketDetailsTest(
-        marketWithMiddleEastTag,
-      );
+      const { rerender } = setupPredictMarketDetailsTest(marketWithWaivedTag);
 
       expect(
         screen.getByText('predict.market_details.fee_exemption'),
       ).toBeOnTheScreen();
 
-      const marketWithoutMiddleEastTag = createMockMarket({
+      const marketWithoutWaivedTag = createMockMarket({
         status: 'open',
-        tags: ['Politics'],
+        tags: ['politics'],
         outcomes: [
           {
             id: 'outcome-1',
@@ -3386,7 +3398,7 @@ describe('PredictMarketDetails', () => {
       });
 
       usePredictMarket.mockReturnValue({
-        market: marketWithoutMiddleEastTag,
+        market: marketWithoutWaivedTag,
         isFetching: false,
         refetch: jest.fn(),
       });
diff --git a/app/components/UI/Predict/views/PredictMarketDetails/PredictMarketDetails.tsx b/app/components/UI/Predict/views/PredictMarketDetails/PredictMarketDetails.tsx
index 42a4daa54a48..022226b9ea4c 100644
--- a/app/components/UI/Predict/views/PredictMarketDetails/PredictMarketDetails.tsx
+++ b/app/components/UI/Predict/views/PredictMarketDetails/PredictMarketDetails.tsx
@@ -47,6 +47,8 @@ import PredictMarketDetailsTabContent from './components/PredictMarketDetailsTab
 import { useChartData } from './hooks/useChartData';
 import { useOutcomeResolution } from './hooks/useOutcomeResolution';
 import { useOpenOutcomes } from './hooks/useOpenOutcomes';
+import { useSelector } from 'react-redux';
+import { selectPredictFeeCollectionFlag } from '../../selectors/featureFlags';
 
 // Use theme tokens instead of hex values for multi-series charts
 
@@ -128,8 +130,11 @@ const PredictMarketDetails: React.FC<PredictMarketDetailsProps> = () => {
     enabled: !isMarketFetching && Boolean(resolvedMarketId),
   });
 
-  // check if market has fee exemption (note: worth moveing to a const or util at some point))
-  const isFeeExemption = market?.tags?.includes('Middle East') ?? false;
+  const feeCollectionConfig = useSelector(selectPredictFeeCollectionFlag);
+  const isFeeExemption =
+    market?.tags?.some((slug) =>
+      feeCollectionConfig.waiveList?.includes(slug),
+    ) ?? false;
 
   // Tabs become ready when both market and positions queries have resolved
   const tabsReady = useMemo(
diff --git a/app/components/UI/ProtectYourWalletModal/__snapshots__/index.test.tsx.snap b/app/components/UI/ProtectYourWalletModal/__snapshots__/index.test.tsx.snap
index d363f5abbe6c..11bfb3da4e81 100644
--- a/app/components/UI/ProtectYourWalletModal/__snapshots__/index.test.tsx.snap
+++ b/app/components/UI/ProtectYourWalletModal/__snapshots__/index.test.tsx.snap
@@ -53,7 +53,7 @@ exports[`ProtectYourWalletModal render matches snapshot 1`] = `
       onStartShouldSetResponder={[Function]}
       style={
         {
-          "backgroundColor": "#3f434a66",
+          "backgroundColor": "#0a0d135c",
           "bottom": 0,
           "height": 1334,
           "left": 0,
@@ -218,7 +218,7 @@ exports[`ProtectYourWalletModal render matches snapshot 1`] = `
                   <Text
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "flex": 1,
                         "fontFamily": "Geist-Bold",
                         "fontSize": 20,
@@ -254,7 +254,7 @@ exports[`ProtectYourWalletModal render matches snapshot 1`] = `
                             "fontSize": 12,
                           },
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "fontSize": 16,
                           },
                           {
@@ -293,7 +293,7 @@ exports[`ProtectYourWalletModal render matches snapshot 1`] = `
                 <Text
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 14,
                       "marginBottom": 24,
diff --git a/app/components/UI/QRHardware/AnimatedQRScanner.test.tsx b/app/components/UI/QRHardware/AnimatedQRScanner.test.tsx
index 889d1d627bf9..3758215fb125 100644
--- a/app/components/UI/QRHardware/AnimatedQRScanner.test.tsx
+++ b/app/components/UI/QRHardware/AnimatedQRScanner.test.tsx
@@ -1,5 +1,6 @@
 import React from 'react';
 import { render, waitFor, act } from '@testing-library/react-native';
+import { AppState, AppStateStatus, Linking } from 'react-native';
 import AnimatedQRScannerModal from './AnimatedQRScanner';
 import { QrScanRequestType } from '@metamask/eth-qr-keyring';
 import { URRegistryDecoder } from '@keystonehq/ur-decoder';
@@ -601,25 +602,91 @@ describe('AnimatedQRScannerModal - Metrics', () => {
   });
 
   describe('Camera Permission Error', () => {
-    it('calls onScanError only after requestPermission resolves with denial', async () => {
+    it('re-requests camera permission when app returns to foreground', async () => {
       const mockUseCameraPermission = jest.requireMock(
         'react-native-vision-camera',
       ).useCameraPermission;
-
       const mockRequestPermission = jest.fn().mockResolvedValue(false);
       mockUseCameraPermission.mockReturnValue({
         hasPermission: false,
         requestPermission: mockRequestPermission,
       });
 
+      let appStateChangeHandler:
+        | ((nextAppState: AppStateStatus) => void)
+        | null = null;
+      const addEventListenerSpy = jest
+        .spyOn(AppState, 'addEventListener')
+        .mockImplementation((eventType, listener) => {
+          if (eventType === 'change') {
+            appStateChangeHandler = listener;
+          }
+          return { remove: jest.fn() };
+        });
+
       render(<AnimatedQRScannerModal {...defaultProps} />);
 
+      await waitFor(() => {
+        expect(mockRequestPermission).toHaveBeenCalledTimes(1);
+      });
+
+      expect(addEventListenerSpy).toHaveBeenCalledWith(
+        'change',
+        expect.any(Function),
+      );
+      expect(appStateChangeHandler).not.toBeNull();
+
+      act(() => {
+        appStateChangeHandler?.('background');
+      });
+
+      await waitFor(() => {
+        expect(mockRequestPermission).toHaveBeenCalledTimes(1);
+      });
+
+      act(() => {
+        appStateChangeHandler?.('active');
+      });
+
+      await waitFor(() => {
+        expect(mockRequestPermission).toHaveBeenCalledTimes(2);
+      });
+
+      addEventListenerSpy.mockRestore();
+    });
+
+    it('keeps modal open with settings button when permission is denied', async () => {
+      const mockUseCameraPermission = jest.requireMock(
+        'react-native-vision-camera',
+      ).useCameraPermission;
+      const openSettingsSpy = jest
+        .spyOn(Linking, 'openSettings')
+        .mockResolvedValue();
+
+      const mockRequestPermission = jest.fn().mockResolvedValue(false);
+      mockUseCameraPermission.mockReturnValue({
+        hasPermission: false,
+        requestPermission: mockRequestPermission,
+      });
+
+      const { getByTestId, getByText } = render(
+        <AnimatedQRScannerModal {...defaultProps} />,
+      );
+
       await waitFor(() => {
         expect(mockRequestPermission).toHaveBeenCalled();
-        expect(mockOnScanError).toHaveBeenCalledWith(
-          'transaction.no_camera_permission',
-        );
       });
+
+      expect(mockOnScanError).not.toHaveBeenCalled();
+      expect(getByText('transaction.no_camera_permission')).toBeOnTheScreen();
+      expect(getByTestId('open-settings-button')).toBeOnTheScreen();
+
+      await act(async () => {
+        getByTestId('open-settings-button').props.onPress();
+      });
+      expect(openSettingsSpy).toHaveBeenCalledTimes(1);
+
+      openSettingsSpy.mockRestore();
     });
 
     it('does not call onScanError when requestPermission is granted', async () => {
@@ -662,7 +729,7 @@ describe('AnimatedQRScannerModal - Metrics', () => {
       expect(mockOnScanError).not.toHaveBeenCalled();
     });
 
-    it('does not call onScanError when modal is not visible', async () => {
+    it('does not request permission when modal is not visible', async () => {
       const mockUseCameraPermission = jest.requireMock(
         'react-native-vision-camera',
       ).useCameraPermission;
@@ -681,7 +748,6 @@ describe('AnimatedQRScannerModal - Metrics', () => {
         expect(mockOnScanError).not.toHaveBeenCalled();
       });
 
-      // requestPermission should not have been called since modal is not visible
       expect(mockRequestPermission).not.toHaveBeenCalled();
     });
   });
diff --git a/app/components/UI/QRHardware/AnimatedQRScanner.tsx b/app/components/UI/QRHardware/AnimatedQRScanner.tsx
index ecbe23096210..a049512eb1ad 100644
--- a/app/components/UI/QRHardware/AnimatedQRScanner.tsx
+++ b/app/components/UI/QRHardware/AnimatedQRScanner.tsx
@@ -2,8 +2,23 @@
 /* eslint @typescript-eslint/no-require-imports: "off" */
 
 'use strict';
-import React, { useCallback, useState, useEffect, useMemo } from 'react';
-import { Image, Text, TouchableOpacity, View, StyleSheet } from 'react-native';
+import React, {
+  useCallback,
+  useState,
+  useEffect,
+  useMemo,
+  useRef,
+} from 'react';
+import {
+  AppState,
+  AppStateStatus,
+  Image,
+  Linking,
+  Text,
+  TouchableOpacity,
+  View,
+  StyleSheet,
+} from 'react-native';
 import {
   Camera,
   useCameraDevice,
@@ -110,6 +125,21 @@ const createStyles = (theme: Theme) =>
       flex: 1,
       justifyContent: 'center',
       alignItems: 'center',
+      paddingHorizontal: 24,
+    },
+    openSettingsButton: {
+      marginTop: 24,
+      paddingHorizontal: 24,
+      paddingVertical: 12,
+      borderRadius: 40,
+      borderWidth: 1,
+      borderColor: theme.brandColors.white,
+    },
+    openSettingsText: {
+      color: theme.brandColors.white,
+      fontSize: 16,
+      textAlign: 'center',
+      ...fontStyles.normal,
     },
   });
 
@@ -142,6 +172,7 @@ const AnimatedQRScannerModal = (props: AnimatedQRScannerProps) => {
 
   const cameraDevice = useCameraDevice('back');
   const { hasPermission, requestPermission } = useCameraPermission();
+  const appState = useRef(AppState.currentState);
 
   let expectedURTypes: string[];
   if (purpose === QrScanRequestType.PAIR) {
@@ -153,19 +184,42 @@ const AnimatedQRScannerModal = (props: AnimatedQRScannerProps) => {
     expectedURTypes = [SUPPORTED_UR_TYPE.ETH_SIGNATURE];
   }
 
+  const refreshCameraPermission = useCallback(() => {
+    if (!visible || hasPermission) {
+      return;
+    }
+
+    requestPermission();
+  }, [hasPermission, requestPermission, visible]);
+
   useEffect(() => {
-    let cancelled = false;
-    if (!hasPermission && visible) {
-      requestPermission().then((granted) => {
-        if (!cancelled && !granted) {
-          onScanError(strings('transaction.no_camera_permission'));
-        }
-      });
+    refreshCameraPermission();
+  }, [refreshCameraPermission]);
+
+  useEffect(() => {
+    if (!visible) {
+      return undefined;
     }
+
+    const subscription = AppState.addEventListener(
+      'change',
+      (nextAppState: AppStateStatus) => {
+        const hasReturnedToForeground =
+          /inactive|background/.test(appState.current) &&
+          nextAppState === 'active';
+
+        appState.current = nextAppState;
+
+        if (hasReturnedToForeground) {
+          refreshCameraPermission();
+        }
+      },
+    );
+
     return () => {
-      cancelled = true;
+      subscription?.remove?.();
     };
-  }, [hasPermission, requestPermission, visible, onScanError]);
+  }, [refreshCameraPermission, visible]);
 
   const reset = useCallback(() => {
     setURDecoder(new URRegistryDecoder());
@@ -336,6 +390,15 @@ const AnimatedQRScannerModal = (props: AnimatedQRScannerProps) => {
               <Text style={styles.scanningText}>
                 {strings('transaction.no_camera_permission')}
               </Text>
+              <TouchableOpacity
+                style={styles.openSettingsButton}
+                onPress={() => Linking.openSettings()}
+                testID="open-settings-button"
+              >
+                <Text style={styles.openSettingsText}>
+                  {strings('qr_scanner.open_settings')}
+                </Text>
+              </TouchableOpacity>
             </View>
           </View>
         )}
diff --git a/app/components/UI/QRHardware/QRSigningDetails.tsx b/app/components/UI/QRHardware/QRSigningDetails.tsx
index b38a92d91f3d..894fea8e4426 100644
--- a/app/components/UI/QRHardware/QRSigningDetails.tsx
+++ b/app/components/UI/QRHardware/QRSigningDetails.tsx
@@ -1,16 +1,6 @@
 import React, { Fragment, useCallback, useEffect, useState } from 'react';
 import Engine from '../../../core/Engine';
-import {
-  StyleSheet,
-  Text,
-  View,
-  ScrollView,
-  // eslint-disable-next-line react-native/split-platform-components
-  PermissionsAndroid,
-  Linking,
-  AppState,
-  AppStateStatus,
-} from 'react-native';
+import { StyleSheet, Text, View, ScrollView } from 'react-native';
 import { strings } from '../../../../locales/i18n';
 import AnimatedQRCode from './AnimatedQRCode';
 import AnimatedQRScannerModal from './AnimatedQRScanner';
@@ -25,7 +15,6 @@ import { MetaMetricsEvents } from '../../../core/Analytics';
 
 import { useNavigation } from '@react-navigation/native';
 import { useTheme } from '../../../util/theme';
-import Device from '../../../util/device';
 import { useMetrics } from '../../../components/hooks/useMetrics';
 import { QrScanRequest, QrScanRequestType } from '@metamask/eth-qr-keyring';
 
@@ -39,7 +28,6 @@ interface IQRSigningDetails {
   tighten?: boolean;
   showHint?: boolean;
   shouldStartAnimated?: boolean;
-  bypassAndroidCameraAccessCheck?: boolean;
   fromAddress: string;
 }
 
@@ -120,7 +108,6 @@ const QRSigningDetails = ({
   tighten = false,
   showHint = true,
   shouldStartAnimated = true,
-  bypassAndroidCameraAccessCheck = true,
   fromAddress,
 }: IQRSigningDetails) => {
   const { colors } = useTheme();
@@ -130,50 +117,6 @@ const QRSigningDetails = ({
   const [scannerVisible, setScannerVisible] = useState(false);
   const [errorMessage, setErrorMessage] = useState('');
   const [shouldPause, setShouldPause] = useState(false);
-  const [cameraError, setCameraError] = useState('');
-
-  // ios handled camera perfectly in this situation, we just need to check permission with android.
-  const [hasCameraPermission, setCameraPermission] = useState(
-    Device.isIos() || bypassAndroidCameraAccessCheck,
-  );
-
-  const checkAndroidCamera = useCallback(() => {
-    if (Device.isAndroid() && !hasCameraPermission) {
-      PermissionsAndroid.check(PermissionsAndroid.PERMISSIONS.CAMERA).then(
-        (_hasPermission) => {
-          setCameraPermission(_hasPermission);
-          if (!_hasPermission) {
-            setCameraError(strings('transaction.no_camera_permission_android'));
-          } else {
-            setCameraError('');
-          }
-        },
-      );
-    }
-  }, [hasCameraPermission]);
-
-  const handleAppState = useCallback(
-    (appState: AppStateStatus) => {
-      if (appState === 'active') {
-        checkAndroidCamera();
-      }
-    },
-    [checkAndroidCamera],
-  );
-
-  useEffect(() => {
-    checkAndroidCamera();
-  }, [checkAndroidCamera]);
-
-  useEffect(() => {
-    const appStateListener = AppState.addEventListener(
-      'change',
-      handleAppState,
-    );
-    return () => {
-      appStateListener.remove();
-    };
-  }, [handleAppState]);
 
   const [hasSentOrCanceled, setSentOrCanceled] = useState(false);
 
@@ -269,23 +212,12 @@ const QRSigningDetails = ({
       </Alert>
     );
 
-  const renderCameraAlert = () =>
-    cameraError !== '' && (
-      <Alert
-        type={AlertType.Error}
-        style={styles.alert}
-        onPress={Linking.openSettings}
-      >
-        <Text style={styles.errorText}>{cameraError}</Text>
-      </Alert>
-    );
-
   return (
     <Fragment>
       {pendingScanRequest?.request && (
         <ScrollView contentContainerStyle={styles.wrapper}>
           <ActionView
-            confirmDisabled={!hasCameraPermission}
+            confirmDisabled={false}
             showCancelButton={showCancelButton}
             confirmButtonMode={confirmButtonMode}
             cancelText={strings('transaction.reject')}
@@ -306,7 +238,6 @@ const QRSigningDetails = ({
                 />
               </View>
               {renderAlert()}
-              {renderCameraAlert()}
               <View
                 style={[
                   styles.title,
diff --git a/app/components/UI/QRHardware/QRSigningModal/index.tsx b/app/components/UI/QRHardware/QRSigningModal/index.tsx
index 40d2834c469a..6a4678f00d3f 100644
--- a/app/components/UI/QRHardware/QRSigningModal/index.tsx
+++ b/app/components/UI/QRHardware/QRSigningModal/index.tsx
@@ -85,7 +85,6 @@ const QRSigningModal = ({
           successCallback={handleSuccess}
           cancelCallback={handleCancel}
           failureCallback={handleFailure}
-          bypassAndroidCameraAccessCheck={false}
           fromAddress={selectedAccount?.address ?? ''}
         />
       </View>
diff --git a/app/components/UI/QRHardware/QRSigningTransactionModal.test.tsx b/app/components/UI/QRHardware/QRSigningTransactionModal.test.tsx
index 22ae09f88204..44a1af937e36 100644
--- a/app/components/UI/QRHardware/QRSigningTransactionModal.test.tsx
+++ b/app/components/UI/QRHardware/QRSigningTransactionModal.test.tsx
@@ -232,9 +232,6 @@ describe('QRSigningTransactionModal', () => {
     expect(qrSigningDetailsElement.props.tighten).toBe(true);
     expect(qrSigningDetailsElement.props.showHint).toBe(true);
     expect(qrSigningDetailsElement.props.shouldStartAnimated).toBe(true);
-    expect(qrSigningDetailsElement.props.bypassAndroidCameraAccessCheck).toBe(
-      false,
-    );
     expect(qrSigningDetailsElement.props.fromAddress).toBe(
       mockSelectedAccount.address,
     );
diff --git a/app/components/UI/QRHardware/QRSigningTransactionModal.tsx b/app/components/UI/QRHardware/QRSigningTransactionModal.tsx
index 41260f462868..0d9dc6c28ae5 100644
--- a/app/components/UI/QRHardware/QRSigningTransactionModal.tsx
+++ b/app/components/UI/QRHardware/QRSigningTransactionModal.tsx
@@ -110,7 +110,6 @@ const QRSigningTransactionModal = () => {
             }}
             cancelCallback={onRejection}
             failureCallback={onRejection}
-            bypassAndroidCameraAccessCheck={false}
             fromAddress={selectedAccount?.address ?? ''}
           />
         )}
diff --git a/app/components/UI/Ramp/Aggregator/Views/BuildQuote/__snapshots__/BuildQuote.test.tsx.snap b/app/components/UI/Ramp/Aggregator/Views/BuildQuote/__snapshots__/BuildQuote.test.tsx.snap
index 5196c2425095..62b44e3ca882 100644
--- a/app/components/UI/Ramp/Aggregator/Views/BuildQuote/__snapshots__/BuildQuote.test.tsx.snap
+++ b/app/components/UI/Ramp/Aggregator/Views/BuildQuote/__snapshots__/BuildQuote.test.tsx.snap
@@ -117,7 +117,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -158,7 +158,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -236,7 +236,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -544,7 +544,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                     style={
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 100,
                                         "flexDirection": "row",
                                         "justifyContent": "center",
@@ -579,7 +579,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                       numberOfLines={1}
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "flexShrink": 1,
                                           "fontFamily": "Geist-Medium",
                                           "fontSize": 16,
@@ -591,7 +591,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                       }
                                     />
                                     <SvgMock
-                                      color="#686e7d"
+                                      color="#66676a"
                                       fill="currentColor"
                                       height={16}
                                       name="ArrowDown"
@@ -623,7 +623,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                     style={
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 100,
                                         "flexDirection": "row",
                                         "justifyContent": "center",
@@ -636,7 +636,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -649,7 +649,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                       🇨🇱
                                     </Text>
                                     <SvgMock
-                                      color="#686e7d"
+                                      color="#66676a"
                                       fill="currentColor"
                                       height={16}
                                       name="ArrowDown"
@@ -669,7 +669,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -691,7 +691,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                   style={
                                     [
                                       {
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 8,
                                         "padding": 16,
                                       },
@@ -746,7 +746,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                                   [
                                                     {
                                                       "alignItems": "center",
-                                                      "backgroundColor": "#f3f5f9",
+                                                      "backgroundColor": "#f3f3f4",
                                                       "borderRadius": 9999,
                                                       "height": 40,
                                                       "justifyContent": "center",
@@ -880,9 +880,9 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                             numberOfLines={1}
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Medium",
-                                                "fontSize": 18,
+                                                "fontSize": 20,
                                                 "letterSpacing": 0,
                                                 "lineHeight": 24,
                                               }
@@ -924,7 +924,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Bold",
                                                   "fontSize": 16,
                                                   "letterSpacing": 0,
@@ -935,7 +935,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                               ETH
                                             </Text>
                                             <SvgMock
-                                              color="#686e7d"
+                                              color="#66676a"
                                               fill="currentColor"
                                               height={16}
                                               name="ArrowDown"
@@ -971,7 +971,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#686e7d",
+                                      "color": "#66676a",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 14,
                                       "letterSpacing": 0,
@@ -990,7 +990,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -1010,7 +1010,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                   style={
                                     [
                                       {
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 8,
                                         "padding": 16,
                                       },
@@ -1068,7 +1068,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                             numberOfLines={1}
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Medium",
                                                 "fontSize": 24,
                                                 "letterSpacing": 0,
@@ -1130,7 +1130,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Bold",
                                                   "fontSize": 16,
                                                   "letterSpacing": 0,
@@ -1141,7 +1141,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                               USD
                                             </Text>
                                             <SvgMock
-                                              color="#686e7d"
+                                              color="#66676a"
                                               fill="currentColor"
                                               height={16}
                                               name="ArrowDown"
@@ -1208,7 +1208,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -1230,7 +1230,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                     style={
                                       [
                                         {
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 8,
                                           "padding": 16,
                                         },
@@ -1274,7 +1274,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                             style={
                                               [
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontSize": 20,
                                                 },
                                                 undefined,
@@ -1311,9 +1311,9 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Medium",
-                                                "fontSize": 18,
+                                                "fontSize": 20,
                                                 "letterSpacing": 0,
                                                 "lineHeight": 24,
                                               }
@@ -1347,7 +1347,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Bold",
                                                 "fontSize": 16,
                                                 "letterSpacing": 0,
@@ -1358,7 +1358,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                             Change
                                           </Text>
                                           <SvgMock
-                                            color="#686e7d"
+                                            color="#66676a"
                                             fill="currentColor"
                                             height={16}
                                             name="ArrowDown"
@@ -1377,7 +1377,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                     <View
                                       style={
                                         {
-                                          "backgroundColor": "#b7bbc866",
+                                          "backgroundColor": "#b4b4b566",
                                           "height": 1,
                                           "marginLeft": 16,
                                           "marginRight": 16,
@@ -1480,7 +1480,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                   {
                                     "alignItems": "center",
                                     "alignSelf": "stretch",
-                                    "backgroundColor": "#121314",
+                                    "backgroundColor": "#131416",
                                     "borderRadius": 12,
                                     "flexDirection": "row",
                                     "height": 48,
@@ -1514,7 +1514,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                           style={
                             [
                               {
-                                "backgroundColor": "#f3f5f9",
+                                "backgroundColor": "#f3f3f4",
                                 "bottom": 0,
                                 "left": 0,
                                 "paddingBottom": 50,
@@ -1534,7 +1534,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                           <View
                             style={
                               {
-                                "backgroundColor": "#f3f5f9",
+                                "backgroundColor": "#f3f3f4",
                                 "paddingVertical": 12,
                               }
                             }
@@ -1561,7 +1561,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderColor": "transparent",
                                       "borderRadius": 12,
                                       "borderWidth": 1,
@@ -1579,7 +1579,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Medium",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -1601,7 +1601,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderColor": "transparent",
                                       "borderRadius": 12,
                                       "borderWidth": 1,
@@ -1619,7 +1619,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Medium",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -1641,7 +1641,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderColor": "transparent",
                                       "borderRadius": 12,
                                       "borderWidth": 1,
@@ -1659,7 +1659,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Medium",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -1720,7 +1720,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -1735,7 +1735,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -1772,7 +1772,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -1787,7 +1787,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -1824,7 +1824,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -1839,7 +1839,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -1890,7 +1890,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -1905,7 +1905,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -1942,7 +1942,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -1957,7 +1957,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -1994,7 +1994,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -2009,7 +2009,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -2060,7 +2060,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -2075,7 +2075,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -2112,7 +2112,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -2127,7 +2127,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -2164,7 +2164,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -2179,7 +2179,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -2230,7 +2230,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -2247,7 +2247,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -2284,7 +2284,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -2299,7 +2299,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -2354,7 +2354,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "height": 32,
                                           "width": 32,
                                         },
@@ -2389,7 +2389,7 @@ exports[`BuildQuote View Balance display displays balance from useBalance for no
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
@@ -2547,7 +2547,7 @@ exports[`BuildQuote View Crypto Currency Data renders a special error page if cr
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -2588,7 +2588,7 @@ exports[`BuildQuote View Crypto Currency Data renders a special error page if cr
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -2666,7 +2666,7 @@ exports[`BuildQuote View Crypto Currency Data renders a special error page if cr
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -2965,7 +2965,7 @@ exports[`BuildQuote View Crypto Currency Data renders a special error page if cr
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 18,
                                       "letterSpacing": 0,
@@ -2989,7 +2989,7 @@ exports[`BuildQuote View Crypto Currency Data renders a special error page if cr
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 30,
                                         "marginVertical": 2,
@@ -3003,7 +3003,7 @@ exports[`BuildQuote View Crypto Currency Data renders a special error page if cr
                                       undefined,
                                       undefined,
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                       },
                                       undefined,
                                       undefined,
@@ -3046,7 +3046,7 @@ exports[`BuildQuote View Crypto Currency Data renders a special error page if cr
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "stretch",
-                                      "backgroundColor": "#121314",
+                                      "backgroundColor": "#131416",
                                       "borderRadius": 12,
                                       "flexDirection": "row",
                                       "height": 48,
@@ -3206,7 +3206,7 @@ exports[`BuildQuote View Crypto Currency Data renders a special error page if cr
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -3247,7 +3247,7 @@ exports[`BuildQuote View Crypto Currency Data renders a special error page if cr
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -3555,7 +3555,7 @@ exports[`BuildQuote View Crypto Currency Data renders a special error page if cr
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 18,
                                       "letterSpacing": 0,
@@ -3579,7 +3579,7 @@ exports[`BuildQuote View Crypto Currency Data renders a special error page if cr
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 30,
                                         "marginVertical": 2,
@@ -3593,7 +3593,7 @@ exports[`BuildQuote View Crypto Currency Data renders a special error page if cr
                                       undefined,
                                       undefined,
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                       },
                                       undefined,
                                       undefined,
@@ -3636,7 +3636,7 @@ exports[`BuildQuote View Crypto Currency Data renders a special error page if cr
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "stretch",
-                                      "backgroundColor": "#121314",
+                                      "backgroundColor": "#131416",
                                       "borderRadius": 12,
                                       "flexDirection": "row",
                                       "height": 48,
@@ -3796,7 +3796,7 @@ exports[`BuildQuote View Crypto Currency Data renders an error page when there i
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -3837,7 +3837,7 @@ exports[`BuildQuote View Crypto Currency Data renders an error page when there i
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -3915,7 +3915,7 @@ exports[`BuildQuote View Crypto Currency Data renders an error page when there i
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -4214,7 +4214,7 @@ exports[`BuildQuote View Crypto Currency Data renders an error page when there i
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 18,
                                       "letterSpacing": 0,
@@ -4238,7 +4238,7 @@ exports[`BuildQuote View Crypto Currency Data renders an error page when there i
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 30,
                                         "marginVertical": 2,
@@ -4252,7 +4252,7 @@ exports[`BuildQuote View Crypto Currency Data renders an error page when there i
                                       undefined,
                                       undefined,
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                       },
                                       undefined,
                                       undefined,
@@ -4295,7 +4295,7 @@ exports[`BuildQuote View Crypto Currency Data renders an error page when there i
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "stretch",
-                                      "backgroundColor": "#121314",
+                                      "backgroundColor": "#131416",
                                       "borderRadius": 12,
                                       "flexDirection": "row",
                                       "height": 48,
@@ -4455,7 +4455,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -4496,7 +4496,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -4574,7 +4574,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -4882,7 +4882,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                     style={
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 100,
                                         "flexDirection": "row",
                                         "justifyContent": "center",
@@ -4917,7 +4917,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                       numberOfLines={1}
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "flexShrink": 1,
                                           "fontFamily": "Geist-Medium",
                                           "fontSize": 16,
@@ -4929,7 +4929,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                       }
                                     />
                                     <SvgMock
-                                      color="#686e7d"
+                                      color="#66676a"
                                       fill="currentColor"
                                       height={16}
                                       name="ArrowDown"
@@ -4961,7 +4961,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                     style={
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 100,
                                         "flexDirection": "row",
                                         "justifyContent": "center",
@@ -4974,7 +4974,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -4987,7 +4987,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                       🇨🇱
                                     </Text>
                                     <SvgMock
-                                      color="#686e7d"
+                                      color="#66676a"
                                       fill="currentColor"
                                       height={16}
                                       name="ArrowDown"
@@ -5007,7 +5007,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -5027,7 +5027,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                   style={
                                     [
                                       {
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 8,
                                         "padding": 16,
                                       },
@@ -5071,7 +5071,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                               [
                                                 {
                                                   "alignItems": "center",
-                                                  "backgroundColor": "#858b9a14",
+                                                  "backgroundColor": "#b4b4b528",
                                                   "borderRadius": 9999,
                                                   "height": 48,
                                                   "justifyContent": "center",
@@ -5104,7 +5104,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                             style={
                                               [
                                                 {
-                                                  "backgroundColor": "#858b9a14",
+                                                  "backgroundColor": "#b4b4b528",
                                                   "borderRadius": 30,
                                                   "padding": 14,
                                                 },
@@ -5149,7 +5149,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                             style={
                                               [
                                                 {
-                                                  "backgroundColor": "#858b9a14",
+                                                  "backgroundColor": "#b4b4b528",
                                                   "borderRadius": 30,
                                                   "padding": 14,
                                                 },
@@ -5194,7 +5194,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                   style={
                                     [
                                       {
-                                        "backgroundColor": "#858b9a14",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 30,
                                         "padding": 14,
                                       },
@@ -5224,7 +5224,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -5244,7 +5244,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                   style={
                                     [
                                       {
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 8,
                                         "padding": 16,
                                       },
@@ -5302,7 +5302,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                             numberOfLines={1}
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Medium",
                                                 "fontSize": 24,
                                                 "letterSpacing": 0,
@@ -5364,7 +5364,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Bold",
                                                   "fontSize": 16,
                                                   "letterSpacing": 0,
@@ -5375,7 +5375,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                               USD
                                             </Text>
                                             <SvgMock
-                                              color="#686e7d"
+                                              color="#66676a"
                                               fill="currentColor"
                                               height={16}
                                               name="ArrowDown"
@@ -5442,7 +5442,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -5462,7 +5462,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                     style={
                                       [
                                         {
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 8,
                                           "padding": 16,
                                         },
@@ -5504,7 +5504,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                             style={
                                               [
                                                 {
-                                                  "backgroundColor": "#858b9a14",
+                                                  "backgroundColor": "#b4b4b528",
                                                   "borderRadius": 30,
                                                   "padding": 14,
                                                 },
@@ -5549,7 +5549,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                             style={
                                               [
                                                 {
-                                                  "backgroundColor": "#858b9a14",
+                                                  "backgroundColor": "#b4b4b528",
                                                   "borderRadius": 30,
                                                   "padding": 14,
                                                 },
@@ -5576,7 +5576,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                     <View
                                       style={
                                         {
-                                          "backgroundColor": "#b7bbc866",
+                                          "backgroundColor": "#b4b4b566",
                                           "height": 1,
                                           "marginLeft": 16,
                                           "marginRight": 16,
@@ -5595,7 +5595,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                         style={
                                           [
                                             {
-                                              "backgroundColor": "#858b9a14",
+                                              "backgroundColor": "#b4b4b528",
                                               "borderRadius": 30,
                                               "padding": 14,
                                             },
@@ -5664,7 +5664,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                   {
                                     "alignItems": "center",
                                     "alignSelf": "stretch",
-                                    "backgroundColor": "#121314",
+                                    "backgroundColor": "#131416",
                                     "borderRadius": 12,
                                     "flexDirection": "row",
                                     "height": 48,
@@ -5698,7 +5698,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                           style={
                             [
                               {
-                                "backgroundColor": "#f3f5f9",
+                                "backgroundColor": "#f3f3f4",
                                 "bottom": 0,
                                 "left": 0,
                                 "paddingBottom": 50,
@@ -5718,7 +5718,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                           <View
                             style={
                               {
-                                "backgroundColor": "#f3f5f9",
+                                "backgroundColor": "#f3f3f4",
                                 "paddingVertical": 12,
                               }
                             }
@@ -5745,7 +5745,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderColor": "transparent",
                                       "borderRadius": 12,
                                       "borderWidth": 1,
@@ -5763,7 +5763,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Medium",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -5785,7 +5785,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderColor": "transparent",
                                       "borderRadius": 12,
                                       "borderWidth": 1,
@@ -5803,7 +5803,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Medium",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -5825,7 +5825,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderColor": "transparent",
                                       "borderRadius": 12,
                                       "borderWidth": 1,
@@ -5843,7 +5843,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Medium",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -5904,7 +5904,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -5919,7 +5919,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -5956,7 +5956,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -5971,7 +5971,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -6008,7 +6008,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -6023,7 +6023,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -6074,7 +6074,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -6089,7 +6089,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -6126,7 +6126,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -6141,7 +6141,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -6178,7 +6178,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -6193,7 +6193,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -6244,7 +6244,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -6259,7 +6259,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -6296,7 +6296,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -6311,7 +6311,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -6348,7 +6348,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -6363,7 +6363,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -6414,7 +6414,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -6431,7 +6431,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -6468,7 +6468,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -6483,7 +6483,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -6538,7 +6538,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "height": 32,
                                           "width": 32,
                                         },
@@ -6573,7 +6573,7 @@ exports[`BuildQuote View Crypto Currency Data renders the loading page when cryp
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
@@ -6731,7 +6731,7 @@ exports[`BuildQuote View Fiat Currency Data renders an error page when there is
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -6772,7 +6772,7 @@ exports[`BuildQuote View Fiat Currency Data renders an error page when there is
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -6850,7 +6850,7 @@ exports[`BuildQuote View Fiat Currency Data renders an error page when there is
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -7149,7 +7149,7 @@ exports[`BuildQuote View Fiat Currency Data renders an error page when there is
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 18,
                                       "letterSpacing": 0,
@@ -7173,7 +7173,7 @@ exports[`BuildQuote View Fiat Currency Data renders an error page when there is
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 30,
                                         "marginVertical": 2,
@@ -7187,7 +7187,7 @@ exports[`BuildQuote View Fiat Currency Data renders an error page when there is
                                       undefined,
                                       undefined,
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                       },
                                       undefined,
                                       undefined,
@@ -7230,7 +7230,7 @@ exports[`BuildQuote View Fiat Currency Data renders an error page when there is
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "stretch",
-                                      "backgroundColor": "#121314",
+                                      "backgroundColor": "#131416",
                                       "borderRadius": 12,
                                       "flexDirection": "row",
                                       "height": 48,
@@ -7390,7 +7390,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -7431,7 +7431,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -7509,7 +7509,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -7817,7 +7817,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                     style={
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 100,
                                         "flexDirection": "row",
                                         "justifyContent": "center",
@@ -7852,7 +7852,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                       numberOfLines={1}
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "flexShrink": 1,
                                           "fontFamily": "Geist-Medium",
                                           "fontSize": 16,
@@ -7864,7 +7864,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                       }
                                     />
                                     <SvgMock
-                                      color="#686e7d"
+                                      color="#66676a"
                                       fill="currentColor"
                                       height={16}
                                       name="ArrowDown"
@@ -7896,7 +7896,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                     style={
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 100,
                                         "flexDirection": "row",
                                         "justifyContent": "center",
@@ -7909,7 +7909,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -7922,7 +7922,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                       🇨🇱
                                     </Text>
                                     <SvgMock
-                                      color="#686e7d"
+                                      color="#66676a"
                                       fill="currentColor"
                                       height={16}
                                       name="ArrowDown"
@@ -7942,7 +7942,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -7962,7 +7962,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                   style={
                                     [
                                       {
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 8,
                                         "padding": 16,
                                       },
@@ -8006,7 +8006,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                               [
                                                 {
                                                   "alignItems": "center",
-                                                  "backgroundColor": "#858b9a14",
+                                                  "backgroundColor": "#b4b4b528",
                                                   "borderRadius": 9999,
                                                   "height": 48,
                                                   "justifyContent": "center",
@@ -8039,7 +8039,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                             style={
                                               [
                                                 {
-                                                  "backgroundColor": "#858b9a14",
+                                                  "backgroundColor": "#b4b4b528",
                                                   "borderRadius": 30,
                                                   "padding": 14,
                                                 },
@@ -8084,7 +8084,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                             style={
                                               [
                                                 {
-                                                  "backgroundColor": "#858b9a14",
+                                                  "backgroundColor": "#b4b4b528",
                                                   "borderRadius": 30,
                                                   "padding": 14,
                                                 },
@@ -8129,7 +8129,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                   style={
                                     [
                                       {
-                                        "backgroundColor": "#858b9a14",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 30,
                                         "padding": 14,
                                       },
@@ -8159,7 +8159,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -8179,7 +8179,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                   style={
                                     [
                                       {
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 8,
                                         "padding": 16,
                                       },
@@ -8235,7 +8235,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                             style={
                                               [
                                                 {
-                                                  "backgroundColor": "#858b9a14",
+                                                  "backgroundColor": "#b4b4b528",
                                                   "borderRadius": 30,
                                                   "padding": 14,
                                                 },
@@ -8282,7 +8282,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                           style={
                                             [
                                               {
-                                                "backgroundColor": "#858b9a14",
+                                                "backgroundColor": "#b4b4b528",
                                                 "borderRadius": 30,
                                                 "padding": 14,
                                               },
@@ -8357,7 +8357,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -8377,7 +8377,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                     style={
                                       [
                                         {
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 8,
                                           "padding": 16,
                                         },
@@ -8419,7 +8419,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                             style={
                                               [
                                                 {
-                                                  "backgroundColor": "#858b9a14",
+                                                  "backgroundColor": "#b4b4b528",
                                                   "borderRadius": 30,
                                                   "padding": 14,
                                                 },
@@ -8464,7 +8464,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                             style={
                                               [
                                                 {
-                                                  "backgroundColor": "#858b9a14",
+                                                  "backgroundColor": "#b4b4b528",
                                                   "borderRadius": 30,
                                                   "padding": 14,
                                                 },
@@ -8491,7 +8491,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                     <View
                                       style={
                                         {
-                                          "backgroundColor": "#b7bbc866",
+                                          "backgroundColor": "#b4b4b566",
                                           "height": 1,
                                           "marginLeft": 16,
                                           "marginRight": 16,
@@ -8510,7 +8510,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                         style={
                                           [
                                             {
-                                              "backgroundColor": "#858b9a14",
+                                              "backgroundColor": "#b4b4b528",
                                               "borderRadius": 30,
                                               "padding": 14,
                                             },
@@ -8579,7 +8579,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                   {
                                     "alignItems": "center",
                                     "alignSelf": "stretch",
-                                    "backgroundColor": "#121314",
+                                    "backgroundColor": "#131416",
                                     "borderRadius": 12,
                                     "flexDirection": "row",
                                     "height": 48,
@@ -8613,7 +8613,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                           style={
                             [
                               {
-                                "backgroundColor": "#f3f5f9",
+                                "backgroundColor": "#f3f3f4",
                                 "bottom": 0,
                                 "left": 0,
                                 "paddingBottom": 50,
@@ -8633,7 +8633,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                           <View
                             style={
                               {
-                                "backgroundColor": "#f3f5f9",
+                                "backgroundColor": "#f3f3f4",
                                 "paddingVertical": 12,
                               }
                             }
@@ -8660,7 +8660,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderColor": "transparent",
                                       "borderRadius": 12,
                                       "borderWidth": 1,
@@ -8678,7 +8678,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Medium",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -8700,7 +8700,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderColor": "transparent",
                                       "borderRadius": 12,
                                       "borderWidth": 1,
@@ -8718,7 +8718,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Medium",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -8740,7 +8740,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderColor": "transparent",
                                       "borderRadius": 12,
                                       "borderWidth": 1,
@@ -8758,7 +8758,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Medium",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -8819,7 +8819,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -8834,7 +8834,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -8871,7 +8871,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -8886,7 +8886,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -8923,7 +8923,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -8938,7 +8938,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -8989,7 +8989,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -9004,7 +9004,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -9041,7 +9041,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -9056,7 +9056,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -9093,7 +9093,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -9108,7 +9108,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -9159,7 +9159,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -9174,7 +9174,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -9211,7 +9211,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -9226,7 +9226,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -9263,7 +9263,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -9278,7 +9278,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -9329,7 +9329,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -9346,7 +9346,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -9383,7 +9383,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -9398,7 +9398,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -9453,7 +9453,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "height": 32,
                                           "width": 32,
                                         },
@@ -9488,7 +9488,7 @@ exports[`BuildQuote View Fiat Currency Data renders the loading page when fiats
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
@@ -9646,7 +9646,7 @@ exports[`BuildQuote View Payment Method Data renders an error page when there is
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -9687,7 +9687,7 @@ exports[`BuildQuote View Payment Method Data renders an error page when there is
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -9765,7 +9765,7 @@ exports[`BuildQuote View Payment Method Data renders an error page when there is
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -10064,7 +10064,7 @@ exports[`BuildQuote View Payment Method Data renders an error page when there is
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 18,
                                       "letterSpacing": 0,
@@ -10088,7 +10088,7 @@ exports[`BuildQuote View Payment Method Data renders an error page when there is
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 30,
                                         "marginVertical": 2,
@@ -10102,7 +10102,7 @@ exports[`BuildQuote View Payment Method Data renders an error page when there is
                                       undefined,
                                       undefined,
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                       },
                                       undefined,
                                       undefined,
@@ -10145,7 +10145,7 @@ exports[`BuildQuote View Payment Method Data renders an error page when there is
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "stretch",
-                                      "backgroundColor": "#121314",
+                                      "backgroundColor": "#131416",
                                       "borderRadius": 12,
                                       "flexDirection": "row",
                                       "height": 48,
@@ -10305,7 +10305,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -10346,7 +10346,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -10424,7 +10424,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -10732,7 +10732,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                     style={
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 100,
                                         "flexDirection": "row",
                                         "justifyContent": "center",
@@ -10767,7 +10767,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                       numberOfLines={1}
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "flexShrink": 1,
                                           "fontFamily": "Geist-Medium",
                                           "fontSize": 16,
@@ -10779,7 +10779,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                       }
                                     />
                                     <SvgMock
-                                      color="#686e7d"
+                                      color="#66676a"
                                       fill="currentColor"
                                       height={16}
                                       name="ArrowDown"
@@ -10811,7 +10811,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                     style={
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 100,
                                         "flexDirection": "row",
                                         "justifyContent": "center",
@@ -10824,7 +10824,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -10837,7 +10837,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                       🇨🇱
                                     </Text>
                                     <SvgMock
-                                      color="#686e7d"
+                                      color="#66676a"
                                       fill="currentColor"
                                       height={16}
                                       name="ArrowDown"
@@ -10857,7 +10857,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -10879,7 +10879,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                   style={
                                     [
                                       {
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 8,
                                         "padding": 16,
                                       },
@@ -10934,7 +10934,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                                   [
                                                     {
                                                       "alignItems": "center",
-                                                      "backgroundColor": "#f3f5f9",
+                                                      "backgroundColor": "#f3f3f4",
                                                       "borderRadius": 9999,
                                                       "height": 40,
                                                       "justifyContent": "center",
@@ -11068,9 +11068,9 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                             numberOfLines={1}
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Medium",
-                                                "fontSize": 18,
+                                                "fontSize": 20,
                                                 "letterSpacing": 0,
                                                 "lineHeight": 24,
                                               }
@@ -11112,7 +11112,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Bold",
                                                   "fontSize": 16,
                                                   "letterSpacing": 0,
@@ -11123,7 +11123,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                               ETH
                                             </Text>
                                             <SvgMock
-                                              color="#686e7d"
+                                              color="#66676a"
                                               fill="currentColor"
                                               height={16}
                                               name="ArrowDown"
@@ -11159,7 +11159,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#686e7d",
+                                      "color": "#66676a",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 14,
                                       "letterSpacing": 0,
@@ -11178,7 +11178,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -11198,7 +11198,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                   style={
                                     [
                                       {
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 8,
                                         "padding": 16,
                                       },
@@ -11256,7 +11256,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                             numberOfLines={1}
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Medium",
                                                 "fontSize": 24,
                                                 "letterSpacing": 0,
@@ -11318,7 +11318,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Bold",
                                                   "fontSize": 16,
                                                   "letterSpacing": 0,
@@ -11329,7 +11329,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                               USD
                                             </Text>
                                             <SvgMock
-                                              color="#686e7d"
+                                              color="#66676a"
                                               fill="currentColor"
                                               height={16}
                                               name="ArrowDown"
@@ -11396,7 +11396,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -11418,7 +11418,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                     style={
                                       [
                                         {
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 8,
                                           "padding": 16,
                                         },
@@ -11462,7 +11462,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                             style={
                                               [
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontSize": 20,
                                                 },
                                                 undefined,
@@ -11499,9 +11499,9 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Medium",
-                                                "fontSize": 18,
+                                                "fontSize": 20,
                                                 "letterSpacing": 0,
                                                 "lineHeight": 24,
                                               }
@@ -11535,7 +11535,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Bold",
                                                 "fontSize": 16,
                                                 "letterSpacing": 0,
@@ -11546,7 +11546,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                             Change
                                           </Text>
                                           <SvgMock
-                                            color="#686e7d"
+                                            color="#66676a"
                                             fill="currentColor"
                                             height={16}
                                             name="ArrowDown"
@@ -11565,7 +11565,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                     <View
                                       style={
                                         {
-                                          "backgroundColor": "#b7bbc866",
+                                          "backgroundColor": "#b4b4b566",
                                           "height": 1,
                                           "marginLeft": 16,
                                           "marginRight": 16,
@@ -11625,7 +11625,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                   {
                                     "alignItems": "center",
                                     "alignSelf": "stretch",
-                                    "backgroundColor": "#121314",
+                                    "backgroundColor": "#131416",
                                     "borderRadius": 12,
                                     "flexDirection": "row",
                                     "height": 48,
@@ -11659,7 +11659,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                           style={
                             [
                               {
-                                "backgroundColor": "#f3f5f9",
+                                "backgroundColor": "#f3f3f4",
                                 "bottom": 0,
                                 "left": 0,
                                 "paddingBottom": 50,
@@ -11679,7 +11679,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                           <View
                             style={
                               {
-                                "backgroundColor": "#f3f5f9",
+                                "backgroundColor": "#f3f3f4",
                                 "paddingVertical": 12,
                               }
                             }
@@ -11706,7 +11706,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderColor": "transparent",
                                       "borderRadius": 12,
                                       "borderWidth": 1,
@@ -11724,7 +11724,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Medium",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -11746,7 +11746,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderColor": "transparent",
                                       "borderRadius": 12,
                                       "borderWidth": 1,
@@ -11764,7 +11764,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Medium",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -11786,7 +11786,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderColor": "transparent",
                                       "borderRadius": 12,
                                       "borderWidth": 1,
@@ -11804,7 +11804,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Medium",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -11865,7 +11865,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -11880,7 +11880,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -11917,7 +11917,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -11932,7 +11932,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -11969,7 +11969,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -11984,7 +11984,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -12035,7 +12035,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -12050,7 +12050,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -12087,7 +12087,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -12102,7 +12102,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -12139,7 +12139,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -12154,7 +12154,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -12205,7 +12205,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -12220,7 +12220,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -12257,7 +12257,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -12272,7 +12272,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -12309,7 +12309,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -12324,7 +12324,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -12375,7 +12375,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -12392,7 +12392,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -12429,7 +12429,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -12444,7 +12444,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -12499,7 +12499,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "height": 32,
                                           "width": 32,
                                         },
@@ -12534,7 +12534,7 @@ exports[`BuildQuote View Payment Method Data renders no icons if there are no pa
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
@@ -12692,7 +12692,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -12733,7 +12733,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -12811,7 +12811,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -13119,7 +13119,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                     style={
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 100,
                                         "flexDirection": "row",
                                         "justifyContent": "center",
@@ -13154,7 +13154,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                       numberOfLines={1}
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "flexShrink": 1,
                                           "fontFamily": "Geist-Medium",
                                           "fontSize": 16,
@@ -13166,7 +13166,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                       }
                                     />
                                     <SvgMock
-                                      color="#686e7d"
+                                      color="#66676a"
                                       fill="currentColor"
                                       height={16}
                                       name="ArrowDown"
@@ -13198,7 +13198,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                     style={
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 100,
                                         "flexDirection": "row",
                                         "justifyContent": "center",
@@ -13211,7 +13211,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -13224,7 +13224,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                       🇨🇱
                                     </Text>
                                     <SvgMock
-                                      color="#686e7d"
+                                      color="#66676a"
                                       fill="currentColor"
                                       height={16}
                                       name="ArrowDown"
@@ -13244,7 +13244,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -13266,7 +13266,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                   style={
                                     [
                                       {
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 8,
                                         "padding": 16,
                                       },
@@ -13321,7 +13321,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                                   [
                                                     {
                                                       "alignItems": "center",
-                                                      "backgroundColor": "#f3f5f9",
+                                                      "backgroundColor": "#f3f3f4",
                                                       "borderRadius": 9999,
                                                       "height": 40,
                                                       "justifyContent": "center",
@@ -13455,9 +13455,9 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                             numberOfLines={1}
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Medium",
-                                                "fontSize": 18,
+                                                "fontSize": 20,
                                                 "letterSpacing": 0,
                                                 "lineHeight": 24,
                                               }
@@ -13499,7 +13499,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Bold",
                                                   "fontSize": 16,
                                                   "letterSpacing": 0,
@@ -13510,7 +13510,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                               ETH
                                             </Text>
                                             <SvgMock
-                                              color="#686e7d"
+                                              color="#66676a"
                                               fill="currentColor"
                                               height={16}
                                               name="ArrowDown"
@@ -13546,7 +13546,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#686e7d",
+                                      "color": "#66676a",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 14,
                                       "letterSpacing": 0,
@@ -13565,7 +13565,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -13585,7 +13585,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                   style={
                                     [
                                       {
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 8,
                                         "padding": 16,
                                       },
@@ -13643,7 +13643,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                             numberOfLines={1}
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Medium",
                                                 "fontSize": 24,
                                                 "letterSpacing": 0,
@@ -13705,7 +13705,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Bold",
                                                   "fontSize": 16,
                                                   "letterSpacing": 0,
@@ -13716,7 +13716,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                               USD
                                             </Text>
                                             <SvgMock
-                                              color="#686e7d"
+                                              color="#66676a"
                                               fill="currentColor"
                                               height={16}
                                               name="ArrowDown"
@@ -13783,7 +13783,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -13803,7 +13803,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                     style={
                                       [
                                         {
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 8,
                                           "padding": 16,
                                         },
@@ -13845,7 +13845,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                             style={
                                               [
                                                 {
-                                                  "backgroundColor": "#858b9a14",
+                                                  "backgroundColor": "#b4b4b528",
                                                   "borderRadius": 30,
                                                   "padding": 14,
                                                 },
@@ -13890,7 +13890,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                             style={
                                               [
                                                 {
-                                                  "backgroundColor": "#858b9a14",
+                                                  "backgroundColor": "#b4b4b528",
                                                   "borderRadius": 30,
                                                   "padding": 14,
                                                 },
@@ -13917,7 +13917,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                     <View
                                       style={
                                         {
-                                          "backgroundColor": "#b7bbc866",
+                                          "backgroundColor": "#b4b4b566",
                                           "height": 1,
                                           "marginLeft": 16,
                                           "marginRight": 16,
@@ -13936,7 +13936,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                         style={
                                           [
                                             {
-                                              "backgroundColor": "#858b9a14",
+                                              "backgroundColor": "#b4b4b528",
                                               "borderRadius": 30,
                                               "padding": 14,
                                             },
@@ -14005,7 +14005,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                   {
                                     "alignItems": "center",
                                     "alignSelf": "stretch",
-                                    "backgroundColor": "#121314",
+                                    "backgroundColor": "#131416",
                                     "borderRadius": 12,
                                     "flexDirection": "row",
                                     "height": 48,
@@ -14039,7 +14039,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                           style={
                             [
                               {
-                                "backgroundColor": "#f3f5f9",
+                                "backgroundColor": "#f3f3f4",
                                 "bottom": 0,
                                 "left": 0,
                                 "paddingBottom": 50,
@@ -14059,7 +14059,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                           <View
                             style={
                               {
-                                "backgroundColor": "#f3f5f9",
+                                "backgroundColor": "#f3f3f4",
                                 "paddingVertical": 12,
                               }
                             }
@@ -14086,7 +14086,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderColor": "transparent",
                                       "borderRadius": 12,
                                       "borderWidth": 1,
@@ -14104,7 +14104,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Medium",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -14126,7 +14126,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderColor": "transparent",
                                       "borderRadius": 12,
                                       "borderWidth": 1,
@@ -14144,7 +14144,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Medium",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -14166,7 +14166,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderColor": "transparent",
                                       "borderRadius": 12,
                                       "borderWidth": 1,
@@ -14184,7 +14184,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Medium",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -14245,7 +14245,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -14260,7 +14260,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -14297,7 +14297,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -14312,7 +14312,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -14349,7 +14349,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -14364,7 +14364,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -14415,7 +14415,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -14430,7 +14430,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -14467,7 +14467,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -14482,7 +14482,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -14519,7 +14519,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -14534,7 +14534,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -14585,7 +14585,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -14600,7 +14600,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -14637,7 +14637,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -14652,7 +14652,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -14689,7 +14689,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -14704,7 +14704,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -14755,7 +14755,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -14772,7 +14772,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -14809,7 +14809,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -14824,7 +14824,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -14879,7 +14879,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "height": 32,
                                           "width": 32,
                                         },
@@ -14914,7 +14914,7 @@ exports[`BuildQuote View Payment Method Data renders the loading page when payme
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
@@ -15072,7 +15072,7 @@ exports[`BuildQuote View Regions data renders an error page when there is a regi
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -15113,7 +15113,7 @@ exports[`BuildQuote View Regions data renders an error page when there is a regi
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -15191,7 +15191,7 @@ exports[`BuildQuote View Regions data renders an error page when there is a regi
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -15490,7 +15490,7 @@ exports[`BuildQuote View Regions data renders an error page when there is a regi
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 18,
                                       "letterSpacing": 0,
@@ -15514,7 +15514,7 @@ exports[`BuildQuote View Regions data renders an error page when there is a regi
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 30,
                                         "marginVertical": 2,
@@ -15528,7 +15528,7 @@ exports[`BuildQuote View Regions data renders an error page when there is a regi
                                       undefined,
                                       undefined,
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                       },
                                       undefined,
                                       undefined,
@@ -15571,7 +15571,7 @@ exports[`BuildQuote View Regions data renders an error page when there is a regi
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "stretch",
-                                      "backgroundColor": "#121314",
+                                      "backgroundColor": "#131416",
                                       "borderRadius": 12,
                                       "flexDirection": "row",
                                       "height": 48,
@@ -15731,7 +15731,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -15772,7 +15772,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -15850,7 +15850,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -16158,7 +16158,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                                     style={
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 100,
                                         "flexDirection": "row",
                                         "justifyContent": "center",
@@ -16193,7 +16193,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                                       numberOfLines={1}
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "flexShrink": 1,
                                           "fontFamily": "Geist-Medium",
                                           "fontSize": 16,
@@ -16205,7 +16205,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                                       }
                                     />
                                     <SvgMock
-                                      color="#686e7d"
+                                      color="#66676a"
                                       fill="currentColor"
                                       height={16}
                                       name="ArrowDown"
@@ -16231,7 +16231,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                                   style={
                                     [
                                       {
-                                        "backgroundColor": "#858b9a14",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 30,
                                         "padding": 14,
                                       },
@@ -16259,7 +16259,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -16279,7 +16279,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                                   style={
                                     [
                                       {
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 8,
                                         "padding": 16,
                                       },
@@ -16323,7 +16323,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                                               [
                                                 {
                                                   "alignItems": "center",
-                                                  "backgroundColor": "#858b9a14",
+                                                  "backgroundColor": "#b4b4b528",
                                                   "borderRadius": 9999,
                                                   "height": 48,
                                                   "justifyContent": "center",
@@ -16356,7 +16356,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                                             style={
                                               [
                                                 {
-                                                  "backgroundColor": "#858b9a14",
+                                                  "backgroundColor": "#b4b4b528",
                                                   "borderRadius": 30,
                                                   "padding": 14,
                                                 },
@@ -16401,7 +16401,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                                             style={
                                               [
                                                 {
-                                                  "backgroundColor": "#858b9a14",
+                                                  "backgroundColor": "#b4b4b528",
                                                   "borderRadius": 30,
                                                   "padding": 14,
                                                 },
@@ -16446,7 +16446,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                                   style={
                                     [
                                       {
-                                        "backgroundColor": "#858b9a14",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 30,
                                         "padding": 14,
                                       },
@@ -16476,7 +16476,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -16496,7 +16496,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                                   style={
                                     [
                                       {
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 8,
                                         "padding": 16,
                                       },
@@ -16552,7 +16552,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                                             style={
                                               [
                                                 {
-                                                  "backgroundColor": "#858b9a14",
+                                                  "backgroundColor": "#b4b4b528",
                                                   "borderRadius": 30,
                                                   "padding": 14,
                                                 },
@@ -16599,7 +16599,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                                           style={
                                             [
                                               {
-                                                "backgroundColor": "#858b9a14",
+                                                "backgroundColor": "#b4b4b528",
                                                 "borderRadius": 30,
                                                 "padding": 14,
                                               },
@@ -16674,7 +16674,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -16694,7 +16694,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                                     style={
                                       [
                                         {
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 8,
                                           "padding": 16,
                                         },
@@ -16736,7 +16736,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                                             style={
                                               [
                                                 {
-                                                  "backgroundColor": "#858b9a14",
+                                                  "backgroundColor": "#b4b4b528",
                                                   "borderRadius": 30,
                                                   "padding": 14,
                                                 },
@@ -16781,7 +16781,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                                             style={
                                               [
                                                 {
-                                                  "backgroundColor": "#858b9a14",
+                                                  "backgroundColor": "#b4b4b528",
                                                   "borderRadius": 30,
                                                   "padding": 14,
                                                 },
@@ -16808,7 +16808,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                                     <View
                                       style={
                                         {
-                                          "backgroundColor": "#b7bbc866",
+                                          "backgroundColor": "#b4b4b566",
                                           "height": 1,
                                           "marginLeft": 16,
                                           "marginRight": 16,
@@ -16827,7 +16827,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                                         style={
                                           [
                                             {
-                                              "backgroundColor": "#858b9a14",
+                                              "backgroundColor": "#b4b4b528",
                                               "borderRadius": 30,
                                               "padding": 14,
                                             },
@@ -16896,7 +16896,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                                   {
                                     "alignItems": "center",
                                     "alignSelf": "stretch",
-                                    "backgroundColor": "#121314",
+                                    "backgroundColor": "#131416",
                                     "borderRadius": 12,
                                     "flexDirection": "row",
                                     "height": 48,
@@ -16930,7 +16930,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                           style={
                             [
                               {
-                                "backgroundColor": "#f3f5f9",
+                                "backgroundColor": "#f3f3f4",
                                 "bottom": 0,
                                 "left": 0,
                                 "paddingBottom": 50,
@@ -16950,7 +16950,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                           <View
                             style={
                               {
-                                "backgroundColor": "#f3f5f9",
+                                "backgroundColor": "#f3f3f4",
                                 "paddingVertical": 12,
                               }
                             }
@@ -16977,7 +16977,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderColor": "transparent",
                                       "borderRadius": 12,
                                       "borderWidth": 1,
@@ -16995,7 +16995,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Medium",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -17017,7 +17017,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderColor": "transparent",
                                       "borderRadius": 12,
                                       "borderWidth": 1,
@@ -17035,7 +17035,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Medium",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -17057,7 +17057,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderColor": "transparent",
                                       "borderRadius": 12,
                                       "borderWidth": 1,
@@ -17075,7 +17075,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Medium",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -17136,7 +17136,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -17151,7 +17151,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -17188,7 +17188,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -17203,7 +17203,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -17240,7 +17240,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -17255,7 +17255,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -17306,7 +17306,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -17321,7 +17321,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -17358,7 +17358,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -17373,7 +17373,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -17410,7 +17410,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -17425,7 +17425,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -17476,7 +17476,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -17491,7 +17491,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -17528,7 +17528,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -17543,7 +17543,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -17580,7 +17580,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -17595,7 +17595,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -17646,7 +17646,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -17663,7 +17663,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -17700,7 +17700,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -17715,7 +17715,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -17770,7 +17770,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "height": 32,
                                           "width": 32,
                                         },
@@ -17805,7 +17805,7 @@ exports[`BuildQuote View Regions data renders the loading page when regions are
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
@@ -17963,7 +17963,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -18004,7 +18004,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -18082,7 +18082,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -18390,7 +18390,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                     style={
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 100,
                                         "flexDirection": "row",
                                         "justifyContent": "center",
@@ -18425,7 +18425,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                       numberOfLines={1}
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "flexShrink": 1,
                                           "fontFamily": "Geist-Medium",
                                           "fontSize": 16,
@@ -18437,7 +18437,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                       }
                                     />
                                     <SvgMock
-                                      color="#686e7d"
+                                      color="#66676a"
                                       fill="currentColor"
                                       height={16}
                                       name="ArrowDown"
@@ -18469,7 +18469,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                     style={
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 100,
                                         "flexDirection": "row",
                                         "justifyContent": "center",
@@ -18482,7 +18482,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -18495,7 +18495,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                       🇨🇱
                                     </Text>
                                     <SvgMock
-                                      color="#686e7d"
+                                      color="#66676a"
                                       fill="currentColor"
                                       height={16}
                                       name="ArrowDown"
@@ -18515,7 +18515,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -18537,7 +18537,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                   style={
                                     [
                                       {
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 8,
                                         "padding": 16,
                                       },
@@ -18592,7 +18592,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                                   [
                                                     {
                                                       "alignItems": "center",
-                                                      "backgroundColor": "#f3f5f9",
+                                                      "backgroundColor": "#f3f3f4",
                                                       "borderRadius": 9999,
                                                       "height": 40,
                                                       "justifyContent": "center",
@@ -18726,9 +18726,9 @@ exports[`BuildQuote View renders correctly 1`] = `
                                             numberOfLines={1}
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Medium",
-                                                "fontSize": 18,
+                                                "fontSize": 20,
                                                 "letterSpacing": 0,
                                                 "lineHeight": 24,
                                               }
@@ -18770,7 +18770,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Bold",
                                                   "fontSize": 16,
                                                   "letterSpacing": 0,
@@ -18781,7 +18781,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                               ETH
                                             </Text>
                                             <SvgMock
-                                              color="#686e7d"
+                                              color="#66676a"
                                               fill="currentColor"
                                               height={16}
                                               name="ArrowDown"
@@ -18817,7 +18817,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#686e7d",
+                                      "color": "#66676a",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 14,
                                       "letterSpacing": 0,
@@ -18836,7 +18836,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -18856,7 +18856,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                   style={
                                     [
                                       {
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 8,
                                         "padding": 16,
                                       },
@@ -18914,7 +18914,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                             numberOfLines={1}
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Medium",
                                                 "fontSize": 24,
                                                 "letterSpacing": 0,
@@ -18976,7 +18976,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Bold",
                                                   "fontSize": 16,
                                                   "letterSpacing": 0,
@@ -18987,7 +18987,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                               USD
                                             </Text>
                                             <SvgMock
-                                              color="#686e7d"
+                                              color="#66676a"
                                               fill="currentColor"
                                               height={16}
                                               name="ArrowDown"
@@ -19054,7 +19054,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -19076,7 +19076,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                     style={
                                       [
                                         {
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 8,
                                           "padding": 16,
                                         },
@@ -19120,7 +19120,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                             style={
                                               [
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontSize": 20,
                                                 },
                                                 undefined,
@@ -19157,9 +19157,9 @@ exports[`BuildQuote View renders correctly 1`] = `
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Medium",
-                                                "fontSize": 18,
+                                                "fontSize": 20,
                                                 "letterSpacing": 0,
                                                 "lineHeight": 24,
                                               }
@@ -19193,7 +19193,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Bold",
                                                 "fontSize": 16,
                                                 "letterSpacing": 0,
@@ -19204,7 +19204,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                             Change
                                           </Text>
                                           <SvgMock
-                                            color="#686e7d"
+                                            color="#66676a"
                                             fill="currentColor"
                                             height={16}
                                             name="ArrowDown"
@@ -19223,7 +19223,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                     <View
                                       style={
                                         {
-                                          "backgroundColor": "#b7bbc866",
+                                          "backgroundColor": "#b4b4b566",
                                           "height": 1,
                                           "marginLeft": 16,
                                           "marginRight": 16,
@@ -19326,7 +19326,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                   {
                                     "alignItems": "center",
                                     "alignSelf": "stretch",
-                                    "backgroundColor": "#121314",
+                                    "backgroundColor": "#131416",
                                     "borderRadius": 12,
                                     "flexDirection": "row",
                                     "height": 48,
@@ -19360,7 +19360,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                           style={
                             [
                               {
-                                "backgroundColor": "#f3f5f9",
+                                "backgroundColor": "#f3f3f4",
                                 "bottom": 0,
                                 "left": 0,
                                 "paddingBottom": 50,
@@ -19380,7 +19380,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                           <View
                             style={
                               {
-                                "backgroundColor": "#f3f5f9",
+                                "backgroundColor": "#f3f3f4",
                                 "paddingVertical": 12,
                               }
                             }
@@ -19407,7 +19407,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderColor": "transparent",
                                       "borderRadius": 12,
                                       "borderWidth": 1,
@@ -19425,7 +19425,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Medium",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -19447,7 +19447,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderColor": "transparent",
                                       "borderRadius": 12,
                                       "borderWidth": 1,
@@ -19465,7 +19465,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Medium",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -19487,7 +19487,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderColor": "transparent",
                                       "borderRadius": 12,
                                       "borderWidth": 1,
@@ -19505,7 +19505,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Medium",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -19566,7 +19566,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -19581,7 +19581,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -19618,7 +19618,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -19633,7 +19633,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -19670,7 +19670,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -19685,7 +19685,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -19736,7 +19736,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -19751,7 +19751,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -19788,7 +19788,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -19803,7 +19803,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -19840,7 +19840,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -19855,7 +19855,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -19906,7 +19906,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -19921,7 +19921,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -19958,7 +19958,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -19973,7 +19973,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -20010,7 +20010,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -20025,7 +20025,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -20076,7 +20076,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -20093,7 +20093,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -20130,7 +20130,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -20145,7 +20145,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -20200,7 +20200,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "height": 32,
                                           "width": 32,
                                         },
@@ -20235,7 +20235,7 @@ exports[`BuildQuote View renders correctly 1`] = `
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
@@ -20393,7 +20393,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -20434,7 +20434,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -20751,7 +20751,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                     style={
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 100,
                                         "flexDirection": "row",
                                         "justifyContent": "center",
@@ -20786,7 +20786,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                       numberOfLines={1}
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "flexShrink": 1,
                                           "fontFamily": "Geist-Medium",
                                           "fontSize": 16,
@@ -20798,7 +20798,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                       }
                                     />
                                     <SvgMock
-                                      color="#686e7d"
+                                      color="#66676a"
                                       fill="currentColor"
                                       height={16}
                                       name="ArrowDown"
@@ -20830,7 +20830,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                     style={
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 100,
                                         "flexDirection": "row",
                                         "justifyContent": "center",
@@ -20843,7 +20843,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -20856,7 +20856,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                       🇨🇱
                                     </Text>
                                     <SvgMock
-                                      color="#686e7d"
+                                      color="#66676a"
                                       fill="currentColor"
                                       height={16}
                                       name="ArrowDown"
@@ -20887,7 +20887,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                     style={
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 100,
                                         "flexDirection": "row",
                                         "justifyContent": "center",
@@ -20900,9 +20900,9 @@ exports[`BuildQuote View renders correctly 2`] = `
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Medium",
-                                          "fontSize": 18,
+                                          "fontSize": 20,
                                           "letterSpacing": 0,
                                           "lineHeight": 24,
                                         }
@@ -20911,7 +20911,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                       USD
                                     </Text>
                                     <SvgMock
-                                      color="#686e7d"
+                                      color="#66676a"
                                       fill="currentColor"
                                       height={16}
                                       name="ArrowDown"
@@ -20931,7 +20931,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -20953,7 +20953,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                   style={
                                     [
                                       {
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 8,
                                         "padding": 16,
                                       },
@@ -21008,7 +21008,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                                   [
                                                     {
                                                       "alignItems": "center",
-                                                      "backgroundColor": "#f3f5f9",
+                                                      "backgroundColor": "#f3f3f4",
                                                       "borderRadius": 9999,
                                                       "height": 40,
                                                       "justifyContent": "center",
@@ -21142,9 +21142,9 @@ exports[`BuildQuote View renders correctly 2`] = `
                                             numberOfLines={1}
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Medium",
-                                                "fontSize": 18,
+                                                "fontSize": 20,
                                                 "letterSpacing": 0,
                                                 "lineHeight": 24,
                                               }
@@ -21186,7 +21186,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Bold",
                                                   "fontSize": 16,
                                                   "letterSpacing": 0,
@@ -21197,7 +21197,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                               ETH
                                             </Text>
                                             <SvgMock
-                                              color="#686e7d"
+                                              color="#66676a"
                                               fill="currentColor"
                                               height={16}
                                               name="ArrowDown"
@@ -21233,7 +21233,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#686e7d",
+                                      "color": "#66676a",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 14,
                                       "letterSpacing": 0,
@@ -21252,7 +21252,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -21272,7 +21272,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                   style={
                                     [
                                       {
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 8,
                                         "padding": 16,
                                       },
@@ -21330,7 +21330,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                             numberOfLines={1}
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Medium",
                                                 "fontSize": 24,
                                                 "letterSpacing": 0,
@@ -21390,7 +21390,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -21412,7 +21412,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                     style={
                                       [
                                         {
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 8,
                                           "padding": 16,
                                         },
@@ -21456,7 +21456,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                             style={
                                               [
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontSize": 20,
                                                 },
                                                 undefined,
@@ -21493,9 +21493,9 @@ exports[`BuildQuote View renders correctly 2`] = `
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Medium",
-                                                "fontSize": 18,
+                                                "fontSize": 20,
                                                 "letterSpacing": 0,
                                                 "lineHeight": 24,
                                               }
@@ -21529,7 +21529,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Bold",
                                                 "fontSize": 16,
                                                 "letterSpacing": 0,
@@ -21540,7 +21540,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                             Change
                                           </Text>
                                           <SvgMock
-                                            color="#686e7d"
+                                            color="#66676a"
                                             fill="currentColor"
                                             height={16}
                                             name="ArrowDown"
@@ -21559,7 +21559,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                     <View
                                       style={
                                         {
-                                          "backgroundColor": "#b7bbc866",
+                                          "backgroundColor": "#b4b4b566",
                                           "height": 1,
                                           "marginLeft": 16,
                                           "marginRight": 16,
@@ -21662,7 +21662,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                   {
                                     "alignItems": "center",
                                     "alignSelf": "stretch",
-                                    "backgroundColor": "#121314",
+                                    "backgroundColor": "#131416",
                                     "borderRadius": 12,
                                     "flexDirection": "row",
                                     "height": 48,
@@ -21696,7 +21696,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                           style={
                             [
                               {
-                                "backgroundColor": "#f3f5f9",
+                                "backgroundColor": "#f3f3f4",
                                 "bottom": 0,
                                 "left": 0,
                                 "paddingBottom": 50,
@@ -21716,7 +21716,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                           <View
                             style={
                               {
-                                "backgroundColor": "#f3f5f9",
+                                "backgroundColor": "#f3f3f4",
                                 "paddingVertical": 12,
                               }
                             }
@@ -21743,7 +21743,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderColor": "transparent",
                                       "borderRadius": 12,
                                       "borderWidth": 1,
@@ -21761,7 +21761,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Medium",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -21783,7 +21783,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderColor": "transparent",
                                       "borderRadius": 12,
                                       "borderWidth": 1,
@@ -21801,7 +21801,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Medium",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -21823,7 +21823,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderColor": "transparent",
                                       "borderRadius": 12,
                                       "borderWidth": 1,
@@ -21841,7 +21841,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Medium",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -21863,7 +21863,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderColor": "transparent",
                                       "borderRadius": 12,
                                       "borderWidth": 1,
@@ -21881,7 +21881,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Medium",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -21942,7 +21942,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -21957,7 +21957,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -21994,7 +21994,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -22009,7 +22009,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -22046,7 +22046,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -22061,7 +22061,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -22112,7 +22112,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -22127,7 +22127,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -22164,7 +22164,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -22179,7 +22179,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -22216,7 +22216,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -22231,7 +22231,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -22282,7 +22282,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -22297,7 +22297,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -22334,7 +22334,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -22349,7 +22349,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -22386,7 +22386,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -22401,7 +22401,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -22452,7 +22452,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -22469,7 +22469,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -22506,7 +22506,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                     [
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "borderRadius": 12,
                                         "height": 48,
                                         "justifyContent": "center",
@@ -22521,7 +22521,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Bold",
                                           "fontSize": 32,
                                           "fontWeight": "500",
@@ -22576,7 +22576,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "height": 32,
                                           "width": 32,
                                         },
@@ -22611,7 +22611,7 @@ exports[`BuildQuote View renders correctly 2`] = `
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
@@ -22769,7 +22769,7 @@ exports[`BuildQuote View renders correctly when sdkError is present 1`] = `
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -22810,7 +22810,7 @@ exports[`BuildQuote View renders correctly when sdkError is present 1`] = `
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -22888,7 +22888,7 @@ exports[`BuildQuote View renders correctly when sdkError is present 1`] = `
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -23187,7 +23187,7 @@ exports[`BuildQuote View renders correctly when sdkError is present 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 18,
                                       "letterSpacing": 0,
@@ -23211,7 +23211,7 @@ exports[`BuildQuote View renders correctly when sdkError is present 1`] = `
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 30,
                                         "marginVertical": 2,
@@ -23225,7 +23225,7 @@ exports[`BuildQuote View renders correctly when sdkError is present 1`] = `
                                       undefined,
                                       undefined,
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                       },
                                       undefined,
                                       undefined,
@@ -23268,7 +23268,7 @@ exports[`BuildQuote View renders correctly when sdkError is present 1`] = `
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "stretch",
-                                      "backgroundColor": "#121314",
+                                      "backgroundColor": "#131416",
                                       "borderRadius": 12,
                                       "flexDirection": "row",
                                       "height": 48,
@@ -23428,7 +23428,7 @@ exports[`BuildQuote View renders correctly when sdkError is present 2`] = `
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -23469,7 +23469,7 @@ exports[`BuildQuote View renders correctly when sdkError is present 2`] = `
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -23777,7 +23777,7 @@ exports[`BuildQuote View renders correctly when sdkError is present 2`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 18,
                                       "letterSpacing": 0,
@@ -23801,7 +23801,7 @@ exports[`BuildQuote View renders correctly when sdkError is present 2`] = `
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 30,
                                         "marginVertical": 2,
@@ -23815,7 +23815,7 @@ exports[`BuildQuote View renders correctly when sdkError is present 2`] = `
                                       undefined,
                                       undefined,
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                       },
                                       undefined,
                                       undefined,
@@ -23858,7 +23858,7 @@ exports[`BuildQuote View renders correctly when sdkError is present 2`] = `
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "stretch",
-                                      "backgroundColor": "#121314",
+                                      "backgroundColor": "#131416",
                                       "borderRadius": 12,
                                       "flexDirection": "row",
                                       "height": 48,
diff --git a/app/components/UI/Ramp/Aggregator/Views/Checkout/__snapshots__/Checkout.test.tsx.snap b/app/components/UI/Ramp/Aggregator/Views/Checkout/__snapshots__/Checkout.test.tsx.snap
index 5ab5b7a5fcfd..a475b6e2e661 100644
--- a/app/components/UI/Ramp/Aggregator/Views/Checkout/__snapshots__/Checkout.test.tsx.snap
+++ b/app/components/UI/Ramp/Aggregator/Views/Checkout/__snapshots__/Checkout.test.tsx.snap
@@ -334,7 +334,7 @@ exports[`Checkout displays WebView when url is present and no errors 1`] = `
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -384,7 +384,7 @@ exports[`Checkout displays WebView when url is present and no errors 1`] = `
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -422,7 +422,7 @@ exports[`Checkout displays WebView when url is present and no errors 1`] = `
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -491,7 +491,7 @@ exports[`Checkout displays WebView when url is present and no errors 1`] = `
                                   testID="checkout-close-button"
                                 >
                                   <SvgMock
-                                    color="#121314"
+                                    color="#131416"
                                     fill="currentColor"
                                     height={24}
                                     name="Close"
@@ -876,7 +876,7 @@ exports[`Checkout displays and tracks error if no url or errors 1`] = `
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -926,7 +926,7 @@ exports[`Checkout displays and tracks error if no url or errors 1`] = `
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -964,7 +964,7 @@ exports[`Checkout displays and tracks error if no url or errors 1`] = `
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -1033,7 +1033,7 @@ exports[`Checkout displays and tracks error if no url or errors 1`] = `
                                   testID="checkout-close-button"
                                 >
                                   <SvgMock
-                                    color="#121314"
+                                    color="#131416"
                                     fill="currentColor"
                                     height={24}
                                     name="Close"
@@ -1153,7 +1153,7 @@ exports[`Checkout displays and tracks error if no url or errors 1`] = `
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 18,
                                             "letterSpacing": 0,
@@ -1177,7 +1177,7 @@ exports[`Checkout displays and tracks error if no url or errors 1`] = `
                                         style={
                                           [
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 30,
                                               "marginVertical": 2,
@@ -1191,7 +1191,7 @@ exports[`Checkout displays and tracks error if no url or errors 1`] = `
                                             undefined,
                                             undefined,
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                             },
                                             undefined,
                                             undefined,
@@ -1570,7 +1570,7 @@ exports[`Checkout displays sdkError when present 1`] = `
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -1620,7 +1620,7 @@ exports[`Checkout displays sdkError when present 1`] = `
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -1658,7 +1658,7 @@ exports[`Checkout displays sdkError when present 1`] = `
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -1727,7 +1727,7 @@ exports[`Checkout displays sdkError when present 1`] = `
                                   testID="checkout-close-button"
                                 >
                                   <SvgMock
-                                    color="#121314"
+                                    color="#131416"
                                     fill="currentColor"
                                     height={24}
                                     name="Close"
@@ -1847,7 +1847,7 @@ exports[`Checkout displays sdkError when present 1`] = `
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 18,
                                             "letterSpacing": 0,
@@ -1871,7 +1871,7 @@ exports[`Checkout displays sdkError when present 1`] = `
                                         style={
                                           [
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 30,
                                               "marginVertical": 2,
@@ -1885,7 +1885,7 @@ exports[`Checkout displays sdkError when present 1`] = `
                                             undefined,
                                             undefined,
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                             },
                                             undefined,
                                             undefined,
@@ -1928,7 +1928,7 @@ exports[`Checkout displays sdkError when present 1`] = `
                                           {
                                             "alignItems": "center",
                                             "alignSelf": "stretch",
-                                            "backgroundColor": "#121314",
+                                            "backgroundColor": "#131416",
                                             "borderRadius": 12,
                                             "flexDirection": "row",
                                             "height": 48,
@@ -2308,7 +2308,7 @@ exports[`Checkout displays sell WebView when url is present and no errors 1`] =
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -2358,7 +2358,7 @@ exports[`Checkout displays sell WebView when url is present and no errors 1`] =
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -2396,7 +2396,7 @@ exports[`Checkout displays sell WebView when url is present and no errors 1`] =
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -2465,7 +2465,7 @@ exports[`Checkout displays sell WebView when url is present and no errors 1`] =
                                   testID="checkout-close-button"
                                 >
                                   <SvgMock
-                                    color="#121314"
+                                    color="#131416"
                                     fill="currentColor"
                                     height={24}
                                     name="Close"
@@ -2850,7 +2850,7 @@ exports[`Checkout handles get order error gracefully 1`] = `
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -2900,7 +2900,7 @@ exports[`Checkout handles get order error gracefully 1`] = `
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -2938,7 +2938,7 @@ exports[`Checkout handles get order error gracefully 1`] = `
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -3007,7 +3007,7 @@ exports[`Checkout handles get order error gracefully 1`] = `
                                   testID="checkout-close-button"
                                 >
                                   <SvgMock
-                                    color="#121314"
+                                    color="#131416"
                                     fill="currentColor"
                                     height={24}
                                     name="Close"
@@ -3127,7 +3127,7 @@ exports[`Checkout handles get order error gracefully 1`] = `
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 18,
                                             "letterSpacing": 0,
@@ -3151,7 +3151,7 @@ exports[`Checkout handles get order error gracefully 1`] = `
                                         style={
                                           [
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 30,
                                               "marginVertical": 2,
@@ -3165,7 +3165,7 @@ exports[`Checkout handles get order error gracefully 1`] = `
                                             undefined,
                                             undefined,
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                             },
                                             undefined,
                                             undefined,
@@ -3208,7 +3208,7 @@ exports[`Checkout handles get order error gracefully 1`] = `
                                           {
                                             "alignItems": "center",
                                             "alignSelf": "stretch",
-                                            "backgroundColor": "#121314",
+                                            "backgroundColor": "#131416",
                                             "borderRadius": 12,
                                             "flexDirection": "row",
                                             "height": 48,
@@ -3588,7 +3588,7 @@ exports[`Checkout handles undefined order gracefully 1`] = `
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -3638,7 +3638,7 @@ exports[`Checkout handles undefined order gracefully 1`] = `
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -3676,7 +3676,7 @@ exports[`Checkout handles undefined order gracefully 1`] = `
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -3745,7 +3745,7 @@ exports[`Checkout handles undefined order gracefully 1`] = `
                                   testID="checkout-close-button"
                                 >
                                   <SvgMock
-                                    color="#121314"
+                                    color="#131416"
                                     fill="currentColor"
                                     height={24}
                                     name="Close"
@@ -3865,7 +3865,7 @@ exports[`Checkout handles undefined order gracefully 1`] = `
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 18,
                                             "letterSpacing": 0,
@@ -3889,7 +3889,7 @@ exports[`Checkout handles undefined order gracefully 1`] = `
                                         style={
                                           [
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 30,
                                               "marginVertical": 2,
@@ -3903,7 +3903,7 @@ exports[`Checkout handles undefined order gracefully 1`] = `
                                             undefined,
                                             undefined,
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                             },
                                             undefined,
                                             undefined,
@@ -3946,7 +3946,7 @@ exports[`Checkout handles undefined order gracefully 1`] = `
                                           {
                                             "alignItems": "center",
                                             "alignSelf": "stretch",
-                                            "backgroundColor": "#121314",
+                                            "backgroundColor": "#131416",
                                             "borderRadius": 12,
                                             "flexDirection": "row",
                                             "height": 48,
@@ -4326,7 +4326,7 @@ exports[`Checkout ignores irrelevant error on http error in WebView for callback
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -4376,7 +4376,7 @@ exports[`Checkout ignores irrelevant error on http error in WebView for callback
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -4414,7 +4414,7 @@ exports[`Checkout ignores irrelevant error on http error in WebView for callback
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -4483,7 +4483,7 @@ exports[`Checkout ignores irrelevant error on http error in WebView for callback
                                   testID="checkout-close-button"
                                 >
                                   <SvgMock
-                                    color="#121314"
+                                    color="#131416"
                                     fill="currentColor"
                                     height={24}
                                     name="Close"
@@ -4868,7 +4868,7 @@ exports[`Checkout sets and displays error on http error in WebView 1`] = `
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -4918,7 +4918,7 @@ exports[`Checkout sets and displays error on http error in WebView 1`] = `
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -4956,7 +4956,7 @@ exports[`Checkout sets and displays error on http error in WebView 1`] = `
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -5025,7 +5025,7 @@ exports[`Checkout sets and displays error on http error in WebView 1`] = `
                                   testID="checkout-close-button"
                                 >
                                   <SvgMock
-                                    color="#121314"
+                                    color="#131416"
                                     fill="currentColor"
                                     height={24}
                                     name="Close"
@@ -5145,7 +5145,7 @@ exports[`Checkout sets and displays error on http error in WebView 1`] = `
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 18,
                                             "letterSpacing": 0,
@@ -5169,7 +5169,7 @@ exports[`Checkout sets and displays error on http error in WebView 1`] = `
                                         style={
                                           [
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 30,
                                               "marginVertical": 2,
@@ -5183,7 +5183,7 @@ exports[`Checkout sets and displays error on http error in WebView 1`] = `
                                             undefined,
                                             undefined,
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                             },
                                             undefined,
                                             undefined,
@@ -5226,7 +5226,7 @@ exports[`Checkout sets and displays error on http error in WebView 1`] = `
                                           {
                                             "alignItems": "center",
                                             "alignSelf": "stretch",
-                                            "backgroundColor": "#121314",
+                                            "backgroundColor": "#131416",
                                             "borderRadius": 12,
                                             "flexDirection": "row",
                                             "height": 48,
@@ -5606,7 +5606,7 @@ exports[`Checkout sets and displays error on http error in WebView for callback
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -5656,7 +5656,7 @@ exports[`Checkout sets and displays error on http error in WebView for callback
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -5694,7 +5694,7 @@ exports[`Checkout sets and displays error on http error in WebView for callback
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -5763,7 +5763,7 @@ exports[`Checkout sets and displays error on http error in WebView for callback
                                   testID="checkout-close-button"
                                 >
                                   <SvgMock
-                                    color="#121314"
+                                    color="#131416"
                                     fill="currentColor"
                                     height={24}
                                     name="Close"
@@ -5883,7 +5883,7 @@ exports[`Checkout sets and displays error on http error in WebView for callback
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 18,
                                             "letterSpacing": 0,
@@ -5907,7 +5907,7 @@ exports[`Checkout sets and displays error on http error in WebView for callback
                                         style={
                                           [
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 30,
                                               "marginVertical": 2,
@@ -5921,7 +5921,7 @@ exports[`Checkout sets and displays error on http error in WebView for callback
                                             undefined,
                                             undefined,
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                             },
                                             undefined,
                                             undefined,
@@ -5964,7 +5964,7 @@ exports[`Checkout sets and displays error on http error in WebView for callback
                                           {
                                             "alignItems": "center",
                                             "alignSelf": "stretch",
-                                            "backgroundColor": "#121314",
+                                            "backgroundColor": "#131416",
                                             "borderRadius": 12,
                                             "flexDirection": "row",
                                             "height": 48,
@@ -6344,7 +6344,7 @@ exports[`Checkout sets error when handling url navigation state change and selec
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -6394,7 +6394,7 @@ exports[`Checkout sets error when handling url navigation state change and selec
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -6432,7 +6432,7 @@ exports[`Checkout sets error when handling url navigation state change and selec
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -6501,7 +6501,7 @@ exports[`Checkout sets error when handling url navigation state change and selec
                                   testID="checkout-close-button"
                                 >
                                   <SvgMock
-                                    color="#121314"
+                                    color="#131416"
                                     fill="currentColor"
                                     height={24}
                                     name="Close"
@@ -6621,7 +6621,7 @@ exports[`Checkout sets error when handling url navigation state change and selec
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 18,
                                             "letterSpacing": 0,
@@ -6645,7 +6645,7 @@ exports[`Checkout sets error when handling url navigation state change and selec
                                         style={
                                           [
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 30,
                                               "marginVertical": 2,
@@ -6659,7 +6659,7 @@ exports[`Checkout sets error when handling url navigation state change and selec
                                             undefined,
                                             undefined,
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                             },
                                             undefined,
                                             undefined,
@@ -6702,7 +6702,7 @@ exports[`Checkout sets error when handling url navigation state change and selec
                                           {
                                             "alignItems": "center",
                                             "alignSelf": "stretch",
-                                            "backgroundColor": "#121314",
+                                            "backgroundColor": "#131416",
                                             "borderRadius": 12,
                                             "flexDirection": "row",
                                             "height": 48,
diff --git a/app/components/UI/Ramp/Aggregator/Views/Modals/Settings/__snapshots__/SettingsModal.test.tsx.snap b/app/components/UI/Ramp/Aggregator/Views/Modals/Settings/__snapshots__/SettingsModal.test.tsx.snap
index aa9fdbadd7fd..e74adcf69d60 100644
--- a/app/components/UI/Ramp/Aggregator/Views/Modals/Settings/__snapshots__/SettingsModal.test.tsx.snap
+++ b/app/components/UI/Ramp/Aggregator/Views/Modals/Settings/__snapshots__/SettingsModal.test.tsx.snap
@@ -334,7 +334,7 @@ exports[`SettingsModal renders snapshot correctly 1`] = `
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -384,7 +384,7 @@ exports[`SettingsModal renders snapshot correctly 1`] = `
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -421,7 +421,7 @@ exports[`SettingsModal renders snapshot correctly 1`] = `
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -470,7 +470,7 @@ exports[`SettingsModal renders snapshot correctly 1`] = `
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 16,
                                       "fontWeight": 700,
@@ -510,7 +510,7 @@ exports[`SettingsModal renders snapshot correctly 1`] = `
                                   }
                                 >
                                   <SvgMock
-                                    color="#121314"
+                                    color="#131416"
                                     fill="currentColor"
                                     height={24}
                                     name="Close"
@@ -565,7 +565,7 @@ exports[`SettingsModal renders snapshot correctly 1`] = `
                                   testID="listitemcolumn"
                                 >
                                   <SvgMock
-                                    color="#121314"
+                                    color="#131416"
                                     fill="currentColor"
                                     height={20}
                                     name="Clock"
@@ -599,7 +599,7 @@ exports[`SettingsModal renders snapshot correctly 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Medium",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -652,7 +652,7 @@ exports[`SettingsModal renders snapshot correctly 1`] = `
                                   testID="listitemcolumn"
                                 >
                                   <SvgMock
-                                    color="#121314"
+                                    color="#131416"
                                     fill="currentColor"
                                     height={20}
                                     name="Add"
@@ -686,7 +686,7 @@ exports[`SettingsModal renders snapshot correctly 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Medium",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -700,7 +700,7 @@ exports[`SettingsModal renders snapshot correctly 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 14,
                                         "letterSpacing": 0,
diff --git a/app/components/UI/Ramp/Aggregator/Views/OrderDetails/OrderDetails.tsx b/app/components/UI/Ramp/Aggregator/Views/OrderDetails/OrderDetails.tsx
index db23e327d24e..8423ce3ea2df 100644
--- a/app/components/UI/Ramp/Aggregator/Views/OrderDetails/OrderDetails.tsx
+++ b/app/components/UI/Ramp/Aggregator/Views/OrderDetails/OrderDetails.tsx
@@ -163,7 +163,7 @@ const OrderDetails = () => {
       } catch (fetchError) {
         Logger.error(fetchError as Error, {
           message: 'FiatOrders::OrderDetails error while processing order',
-          order,
+          orderId: order.id,
         });
         setError((fetchError as Error).message || 'An error as occurred');
       } finally {
diff --git a/app/components/UI/Ramp/Aggregator/Views/OrderDetails/__snapshots__/OrderDetails.test.tsx.snap b/app/components/UI/Ramp/Aggregator/Views/OrderDetails/__snapshots__/OrderDetails.test.tsx.snap
index 6afbc6d4f5f5..86d02eae154a 100644
--- a/app/components/UI/Ramp/Aggregator/Views/OrderDetails/__snapshots__/OrderDetails.test.tsx.snap
+++ b/app/components/UI/Ramp/Aggregator/Views/OrderDetails/__snapshots__/OrderDetails.test.tsx.snap
@@ -309,7 +309,7 @@ exports[`OrderDetails renders a cancelled order 1`] = `
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "height": 24,
                                         "width": 24,
                                       },
@@ -350,7 +350,7 @@ exports[`OrderDetails renders a cancelled order 1`] = `
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 16,
                                       "fontWeight": 400,
@@ -386,7 +386,7 @@ exports[`OrderDetails renders a cancelled order 1`] = `
                               }
                               onRefresh={[Function]}
                               refreshing={false}
-                              tintColor="#121314"
+                              tintColor="#131416"
                             />
                           }
                         >
@@ -443,9 +443,9 @@ exports[`OrderDetails renders a cancelled order 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                               "textAlign": "center",
@@ -458,7 +458,7 @@ exports[`OrderDetails renders a cancelled order 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 14,
                                               "letterSpacing": 0,
@@ -482,7 +482,7 @@ exports[`OrderDetails renders a cancelled order 1`] = `
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Medium",
                                             "fontSize": 24,
                                             "letterSpacing": 0,
@@ -499,7 +499,7 @@ exports[`OrderDetails renders a cancelled order 1`] = `
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#686e7d",
+                                            "color": "#66676a",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 14,
                                             "letterSpacing": 0,
@@ -528,7 +528,7 @@ exports[`OrderDetails renders a cancelled order 1`] = `
                                         style={
                                           [
                                             {
-                                              "backgroundColor": "#3c4d9d0f",
+                                              "backgroundColor": "#b4b4b528",
                                               "borderRadius": 8,
                                               "padding": 16,
                                             },
@@ -555,7 +555,7 @@ exports[`OrderDetails renders a cancelled order 1`] = `
                                               [
                                                 {
                                                   "alignItems": "center",
-                                                  "backgroundColor": "#f3f5f9",
+                                                  "backgroundColor": "#f3f3f4",
                                                   "borderRadius": 100,
                                                   "flexDirection": "row",
                                                   "flexShrink": 1,
@@ -574,7 +574,7 @@ exports[`OrderDetails renders a cancelled order 1`] = `
                                             <View
                                               placeholderStyle={
                                                 {
-                                                  "backgroundColor": "#f3f5f9",
+                                                  "backgroundColor": "#f3f3f4",
                                                 }
                                               }
                                               useNativeDriver={true}
@@ -621,7 +621,7 @@ exports[`OrderDetails renders a cancelled order 1`] = `
                                                         "backgroundColor": "#eee",
                                                       },
                                                       {
-                                                        "backgroundColor": "#f3f5f9",
+                                                        "backgroundColor": "#f3f3f4",
                                                       },
                                                     ]
                                                   }
@@ -633,7 +633,7 @@ exports[`OrderDetails renders a cancelled order 1`] = `
                                               style={
                                                 [
                                                   {
-                                                    "color": "#121314",
+                                                    "color": "#131416",
                                                     "fontFamily": "Geist-Regular",
                                                     "fontSize": 30,
                                                     "marginVertical": 2,
@@ -651,7 +651,7 @@ exports[`OrderDetails renders a cancelled order 1`] = `
                                                   undefined,
                                                   undefined,
                                                   {
-                                                    "color": "#121314",
+                                                    "color": "#131416",
                                                   },
                                                   undefined,
                                                   undefined,
@@ -722,7 +722,7 @@ exports[`OrderDetails renders a cancelled order 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Regular",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -755,7 +755,7 @@ exports[`OrderDetails renders a cancelled order 1`] = `
                                                   selectable={true}
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Bold",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -805,7 +805,7 @@ exports[`OrderDetails renders a cancelled order 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Regular",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -837,7 +837,7 @@ exports[`OrderDetails renders a cancelled order 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Bold",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -882,7 +882,7 @@ exports[`OrderDetails renders a cancelled order 1`] = `
                                                 accessibilityRole="text"
                                                 style={
                                                   {
-                                                    "color": "#121314",
+                                                    "color": "#131416",
                                                     "fontFamily": "Geist-Regular",
                                                     "fontSize": 14,
                                                     "letterSpacing": 0,
@@ -932,7 +932,7 @@ exports[`OrderDetails renders a cancelled order 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Regular",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -964,7 +964,7 @@ exports[`OrderDetails renders a cancelled order 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Bold",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -1024,7 +1024,7 @@ exports[`OrderDetails renders a cancelled order 1`] = `
                                                     accessibilityRole="text"
                                                     style={
                                                       {
-                                                        "color": "#121314",
+                                                        "color": "#131416",
                                                         "fontFamily": "Geist-Regular",
                                                         "fontSize": 14,
                                                         "letterSpacing": 0,
@@ -1056,7 +1056,7 @@ exports[`OrderDetails renders a cancelled order 1`] = `
                                                     accessibilityRole="text"
                                                     style={
                                                       {
-                                                        "color": "#121314",
+                                                        "color": "#131416",
                                                         "fontFamily": "Geist-Bold",
                                                         "fontSize": 14,
                                                         "letterSpacing": 0,
@@ -1107,7 +1107,7 @@ exports[`OrderDetails renders a cancelled order 1`] = `
                                                     accessibilityRole="text"
                                                     style={
                                                       {
-                                                        "color": "#121314",
+                                                        "color": "#131416",
                                                         "fontFamily": "Geist-Regular",
                                                         "fontSize": 14,
                                                         "letterSpacing": 0,
@@ -1141,7 +1141,7 @@ exports[`OrderDetails renders a cancelled order 1`] = `
                                                     accessibilityRole="text"
                                                     style={
                                                       {
-                                                        "color": "#121314",
+                                                        "color": "#131416",
                                                         "fontFamily": "Geist-Bold",
                                                         "fontSize": 14,
                                                         "letterSpacing": 0,
@@ -1193,7 +1193,7 @@ exports[`OrderDetails renders a cancelled order 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Regular",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -1225,7 +1225,7 @@ exports[`OrderDetails renders a cancelled order 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Bold",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -1242,7 +1242,7 @@ exports[`OrderDetails renders a cancelled order 1`] = `
                                         <View
                                           style={
                                             {
-                                              "backgroundColor": "#b7bbc866",
+                                              "backgroundColor": "#b4b4b566",
                                               "height": 1,
                                               "marginVertical": 12,
                                             }
@@ -1285,7 +1285,7 @@ exports[`OrderDetails renders a cancelled order 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Regular",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -1317,7 +1317,7 @@ exports[`OrderDetails renders a cancelled order 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Bold",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -1361,7 +1361,7 @@ exports[`OrderDetails renders a cancelled order 1`] = `
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "stretch",
-                                      "backgroundColor": "#121314",
+                                      "backgroundColor": "#131416",
                                       "borderRadius": 12,
                                       "flexDirection": "row",
                                       "height": 48,
@@ -1727,7 +1727,7 @@ exports[`OrderDetails renders a completed order 1`] = `
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "height": 24,
                                         "width": 24,
                                       },
@@ -1768,7 +1768,7 @@ exports[`OrderDetails renders a completed order 1`] = `
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 16,
                                       "fontWeight": 400,
@@ -1804,7 +1804,7 @@ exports[`OrderDetails renders a completed order 1`] = `
                               }
                               onRefresh={[Function]}
                               refreshing={false}
-                              tintColor="#121314"
+                              tintColor="#131416"
                             />
                           }
                         >
@@ -1879,9 +1879,9 @@ exports[`OrderDetails renders a completed order 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                               "textAlign": "center",
@@ -1894,7 +1894,7 @@ exports[`OrderDetails renders a completed order 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 14,
                                               "letterSpacing": 0,
@@ -1918,7 +1918,7 @@ exports[`OrderDetails renders a completed order 1`] = `
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Medium",
                                             "fontSize": 24,
                                             "letterSpacing": 0,
@@ -1935,7 +1935,7 @@ exports[`OrderDetails renders a completed order 1`] = `
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#686e7d",
+                                            "color": "#66676a",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 14,
                                             "letterSpacing": 0,
@@ -1964,7 +1964,7 @@ exports[`OrderDetails renders a completed order 1`] = `
                                         style={
                                           [
                                             {
-                                              "backgroundColor": "#3c4d9d0f",
+                                              "backgroundColor": "#b4b4b528",
                                               "borderRadius": 8,
                                               "padding": 16,
                                             },
@@ -1991,7 +1991,7 @@ exports[`OrderDetails renders a completed order 1`] = `
                                               [
                                                 {
                                                   "alignItems": "center",
-                                                  "backgroundColor": "#f3f5f9",
+                                                  "backgroundColor": "#f3f3f4",
                                                   "borderRadius": 100,
                                                   "flexDirection": "row",
                                                   "flexShrink": 1,
@@ -2010,7 +2010,7 @@ exports[`OrderDetails renders a completed order 1`] = `
                                             <View
                                               placeholderStyle={
                                                 {
-                                                  "backgroundColor": "#f3f5f9",
+                                                  "backgroundColor": "#f3f3f4",
                                                 }
                                               }
                                               useNativeDriver={true}
@@ -2057,7 +2057,7 @@ exports[`OrderDetails renders a completed order 1`] = `
                                                         "backgroundColor": "#eee",
                                                       },
                                                       {
-                                                        "backgroundColor": "#f3f5f9",
+                                                        "backgroundColor": "#f3f3f4",
                                                       },
                                                     ]
                                                   }
@@ -2069,7 +2069,7 @@ exports[`OrderDetails renders a completed order 1`] = `
                                               style={
                                                 [
                                                   {
-                                                    "color": "#121314",
+                                                    "color": "#131416",
                                                     "fontFamily": "Geist-Regular",
                                                     "fontSize": 30,
                                                     "marginVertical": 2,
@@ -2087,7 +2087,7 @@ exports[`OrderDetails renders a completed order 1`] = `
                                                   undefined,
                                                   undefined,
                                                   {
-                                                    "color": "#121314",
+                                                    "color": "#131416",
                                                   },
                                                   undefined,
                                                   undefined,
@@ -2158,7 +2158,7 @@ exports[`OrderDetails renders a completed order 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Regular",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -2191,7 +2191,7 @@ exports[`OrderDetails renders a completed order 1`] = `
                                                   selectable={true}
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Bold",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -2241,7 +2241,7 @@ exports[`OrderDetails renders a completed order 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Regular",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -2273,7 +2273,7 @@ exports[`OrderDetails renders a completed order 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Bold",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -2318,7 +2318,7 @@ exports[`OrderDetails renders a completed order 1`] = `
                                                 accessibilityRole="text"
                                                 style={
                                                   {
-                                                    "color": "#121314",
+                                                    "color": "#131416",
                                                     "fontFamily": "Geist-Regular",
                                                     "fontSize": 14,
                                                     "letterSpacing": 0,
@@ -2368,7 +2368,7 @@ exports[`OrderDetails renders a completed order 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Regular",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -2400,7 +2400,7 @@ exports[`OrderDetails renders a completed order 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Bold",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -2460,7 +2460,7 @@ exports[`OrderDetails renders a completed order 1`] = `
                                                     accessibilityRole="text"
                                                     style={
                                                       {
-                                                        "color": "#121314",
+                                                        "color": "#131416",
                                                         "fontFamily": "Geist-Regular",
                                                         "fontSize": 14,
                                                         "letterSpacing": 0,
@@ -2492,7 +2492,7 @@ exports[`OrderDetails renders a completed order 1`] = `
                                                     accessibilityRole="text"
                                                     style={
                                                       {
-                                                        "color": "#121314",
+                                                        "color": "#131416",
                                                         "fontFamily": "Geist-Bold",
                                                         "fontSize": 14,
                                                         "letterSpacing": 0,
@@ -2543,7 +2543,7 @@ exports[`OrderDetails renders a completed order 1`] = `
                                                     accessibilityRole="text"
                                                     style={
                                                       {
-                                                        "color": "#121314",
+                                                        "color": "#131416",
                                                         "fontFamily": "Geist-Regular",
                                                         "fontSize": 14,
                                                         "letterSpacing": 0,
@@ -2577,7 +2577,7 @@ exports[`OrderDetails renders a completed order 1`] = `
                                                     accessibilityRole="text"
                                                     style={
                                                       {
-                                                        "color": "#121314",
+                                                        "color": "#131416",
                                                         "fontFamily": "Geist-Bold",
                                                         "fontSize": 14,
                                                         "letterSpacing": 0,
@@ -2629,7 +2629,7 @@ exports[`OrderDetails renders a completed order 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Regular",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -2661,7 +2661,7 @@ exports[`OrderDetails renders a completed order 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Bold",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -2678,7 +2678,7 @@ exports[`OrderDetails renders a completed order 1`] = `
                                         <View
                                           style={
                                             {
-                                              "backgroundColor": "#b7bbc866",
+                                              "backgroundColor": "#b4b4b566",
                                               "height": 1,
                                               "marginVertical": 12,
                                             }
@@ -2721,7 +2721,7 @@ exports[`OrderDetails renders a completed order 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Regular",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -2753,7 +2753,7 @@ exports[`OrderDetails renders a completed order 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Bold",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -2797,7 +2797,7 @@ exports[`OrderDetails renders a completed order 1`] = `
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "stretch",
-                                      "backgroundColor": "#121314",
+                                      "backgroundColor": "#131416",
                                       "borderRadius": 12,
                                       "flexDirection": "row",
                                       "height": 48,
@@ -3163,7 +3163,7 @@ exports[`OrderDetails renders a created order 1`] = `
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "height": 24,
                                         "width": 24,
                                       },
@@ -3204,7 +3204,7 @@ exports[`OrderDetails renders a created order 1`] = `
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 16,
                                       "fontWeight": 400,
@@ -3240,7 +3240,7 @@ exports[`OrderDetails renders a created order 1`] = `
                               }
                               onRefresh={[Function]}
                               refreshing={false}
-                              tintColor="#121314"
+                              tintColor="#131416"
                             />
                           }
                         >
@@ -3286,7 +3286,7 @@ exports[`OrderDetails renders a created order 1`] = `
                                       <View
                                         style={
                                           {
-                                            "borderColor": "#f3f5f9",
+                                            "borderColor": "#f3f3f4",
                                             "borderRadius": 64,
                                             "borderWidth": 3.5,
                                             "height": 36,
@@ -3345,9 +3345,9 @@ exports[`OrderDetails renders a created order 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                               "textAlign": "center",
@@ -3369,7 +3369,7 @@ exports[`OrderDetails renders a created order 1`] = `
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Medium",
                                             "fontSize": 24,
                                             "letterSpacing": 0,
@@ -3386,7 +3386,7 @@ exports[`OrderDetails renders a created order 1`] = `
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#686e7d",
+                                            "color": "#66676a",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 14,
                                             "letterSpacing": 0,
@@ -3415,7 +3415,7 @@ exports[`OrderDetails renders a created order 1`] = `
                                         style={
                                           [
                                             {
-                                              "backgroundColor": "#3c4d9d0f",
+                                              "backgroundColor": "#b4b4b528",
                                               "borderRadius": 8,
                                               "padding": 16,
                                             },
@@ -3442,7 +3442,7 @@ exports[`OrderDetails renders a created order 1`] = `
                                               [
                                                 {
                                                   "alignItems": "center",
-                                                  "backgroundColor": "#f3f5f9",
+                                                  "backgroundColor": "#f3f3f4",
                                                   "borderRadius": 100,
                                                   "flexDirection": "row",
                                                   "flexShrink": 1,
@@ -3461,7 +3461,7 @@ exports[`OrderDetails renders a created order 1`] = `
                                             <View
                                               placeholderStyle={
                                                 {
-                                                  "backgroundColor": "#f3f5f9",
+                                                  "backgroundColor": "#f3f3f4",
                                                 }
                                               }
                                               useNativeDriver={true}
@@ -3508,7 +3508,7 @@ exports[`OrderDetails renders a created order 1`] = `
                                                         "backgroundColor": "#eee",
                                                       },
                                                       {
-                                                        "backgroundColor": "#f3f5f9",
+                                                        "backgroundColor": "#f3f3f4",
                                                       },
                                                     ]
                                                   }
@@ -3520,7 +3520,7 @@ exports[`OrderDetails renders a created order 1`] = `
                                               style={
                                                 [
                                                   {
-                                                    "color": "#121314",
+                                                    "color": "#131416",
                                                     "fontFamily": "Geist-Regular",
                                                     "fontSize": 30,
                                                     "marginVertical": 2,
@@ -3538,7 +3538,7 @@ exports[`OrderDetails renders a created order 1`] = `
                                                   undefined,
                                                   undefined,
                                                   {
-                                                    "color": "#121314",
+                                                    "color": "#131416",
                                                   },
                                                   undefined,
                                                   undefined,
@@ -3609,7 +3609,7 @@ exports[`OrderDetails renders a created order 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Regular",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -3642,7 +3642,7 @@ exports[`OrderDetails renders a created order 1`] = `
                                                   selectable={true}
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Bold",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -3692,7 +3692,7 @@ exports[`OrderDetails renders a created order 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Regular",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -3724,7 +3724,7 @@ exports[`OrderDetails renders a created order 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Bold",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -3769,7 +3769,7 @@ exports[`OrderDetails renders a created order 1`] = `
                                                 accessibilityRole="text"
                                                 style={
                                                   {
-                                                    "color": "#121314",
+                                                    "color": "#131416",
                                                     "fontFamily": "Geist-Regular",
                                                     "fontSize": 14,
                                                     "letterSpacing": 0,
@@ -3819,7 +3819,7 @@ exports[`OrderDetails renders a created order 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Regular",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -3851,7 +3851,7 @@ exports[`OrderDetails renders a created order 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Bold",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -3911,7 +3911,7 @@ exports[`OrderDetails renders a created order 1`] = `
                                                     accessibilityRole="text"
                                                     style={
                                                       {
-                                                        "color": "#121314",
+                                                        "color": "#131416",
                                                         "fontFamily": "Geist-Regular",
                                                         "fontSize": 14,
                                                         "letterSpacing": 0,
@@ -3943,7 +3943,7 @@ exports[`OrderDetails renders a created order 1`] = `
                                                     accessibilityRole="text"
                                                     style={
                                                       {
-                                                        "color": "#121314",
+                                                        "color": "#131416",
                                                         "fontFamily": "Geist-Bold",
                                                         "fontSize": 14,
                                                         "letterSpacing": 0,
@@ -3994,7 +3994,7 @@ exports[`OrderDetails renders a created order 1`] = `
                                                     accessibilityRole="text"
                                                     style={
                                                       {
-                                                        "color": "#121314",
+                                                        "color": "#131416",
                                                         "fontFamily": "Geist-Regular",
                                                         "fontSize": 14,
                                                         "letterSpacing": 0,
@@ -4028,7 +4028,7 @@ exports[`OrderDetails renders a created order 1`] = `
                                                     accessibilityRole="text"
                                                     style={
                                                       {
-                                                        "color": "#121314",
+                                                        "color": "#131416",
                                                         "fontFamily": "Geist-Bold",
                                                         "fontSize": 14,
                                                         "letterSpacing": 0,
@@ -4080,7 +4080,7 @@ exports[`OrderDetails renders a created order 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Regular",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -4112,7 +4112,7 @@ exports[`OrderDetails renders a created order 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Bold",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -4129,7 +4129,7 @@ exports[`OrderDetails renders a created order 1`] = `
                                         <View
                                           style={
                                             {
-                                              "backgroundColor": "#b7bbc866",
+                                              "backgroundColor": "#b4b4b566",
                                               "height": 1,
                                               "marginVertical": 12,
                                             }
@@ -4172,7 +4172,7 @@ exports[`OrderDetails renders a created order 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Regular",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -4204,7 +4204,7 @@ exports[`OrderDetails renders a created order 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Bold",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -4577,7 +4577,7 @@ exports[`OrderDetails renders a failed order 1`] = `
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "height": 24,
                                         "width": 24,
                                       },
@@ -4618,7 +4618,7 @@ exports[`OrderDetails renders a failed order 1`] = `
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 16,
                                       "fontWeight": 400,
@@ -4654,7 +4654,7 @@ exports[`OrderDetails renders a failed order 1`] = `
                               }
                               onRefresh={[Function]}
                               refreshing={false}
-                              tintColor="#121314"
+                              tintColor="#131416"
                             />
                           }
                         >
@@ -4711,9 +4711,9 @@ exports[`OrderDetails renders a failed order 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                               "textAlign": "center",
@@ -4726,7 +4726,7 @@ exports[`OrderDetails renders a failed order 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 14,
                                               "letterSpacing": 0,
@@ -4750,7 +4750,7 @@ exports[`OrderDetails renders a failed order 1`] = `
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Medium",
                                             "fontSize": 24,
                                             "letterSpacing": 0,
@@ -4767,7 +4767,7 @@ exports[`OrderDetails renders a failed order 1`] = `
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#686e7d",
+                                            "color": "#66676a",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 14,
                                             "letterSpacing": 0,
@@ -4796,7 +4796,7 @@ exports[`OrderDetails renders a failed order 1`] = `
                                         style={
                                           [
                                             {
-                                              "backgroundColor": "#3c4d9d0f",
+                                              "backgroundColor": "#b4b4b528",
                                               "borderRadius": 8,
                                               "padding": 16,
                                             },
@@ -4823,7 +4823,7 @@ exports[`OrderDetails renders a failed order 1`] = `
                                               [
                                                 {
                                                   "alignItems": "center",
-                                                  "backgroundColor": "#f3f5f9",
+                                                  "backgroundColor": "#f3f3f4",
                                                   "borderRadius": 100,
                                                   "flexDirection": "row",
                                                   "flexShrink": 1,
@@ -4842,7 +4842,7 @@ exports[`OrderDetails renders a failed order 1`] = `
                                             <View
                                               placeholderStyle={
                                                 {
-                                                  "backgroundColor": "#f3f5f9",
+                                                  "backgroundColor": "#f3f3f4",
                                                 }
                                               }
                                               useNativeDriver={true}
@@ -4889,7 +4889,7 @@ exports[`OrderDetails renders a failed order 1`] = `
                                                         "backgroundColor": "#eee",
                                                       },
                                                       {
-                                                        "backgroundColor": "#f3f5f9",
+                                                        "backgroundColor": "#f3f3f4",
                                                       },
                                                     ]
                                                   }
@@ -4901,7 +4901,7 @@ exports[`OrderDetails renders a failed order 1`] = `
                                               style={
                                                 [
                                                   {
-                                                    "color": "#121314",
+                                                    "color": "#131416",
                                                     "fontFamily": "Geist-Regular",
                                                     "fontSize": 30,
                                                     "marginVertical": 2,
@@ -4919,7 +4919,7 @@ exports[`OrderDetails renders a failed order 1`] = `
                                                   undefined,
                                                   undefined,
                                                   {
-                                                    "color": "#121314",
+                                                    "color": "#131416",
                                                   },
                                                   undefined,
                                                   undefined,
@@ -4990,7 +4990,7 @@ exports[`OrderDetails renders a failed order 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Regular",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -5023,7 +5023,7 @@ exports[`OrderDetails renders a failed order 1`] = `
                                                   selectable={true}
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Bold",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -5073,7 +5073,7 @@ exports[`OrderDetails renders a failed order 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Regular",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -5105,7 +5105,7 @@ exports[`OrderDetails renders a failed order 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Bold",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -5150,7 +5150,7 @@ exports[`OrderDetails renders a failed order 1`] = `
                                                 accessibilityRole="text"
                                                 style={
                                                   {
-                                                    "color": "#121314",
+                                                    "color": "#131416",
                                                     "fontFamily": "Geist-Regular",
                                                     "fontSize": 14,
                                                     "letterSpacing": 0,
@@ -5200,7 +5200,7 @@ exports[`OrderDetails renders a failed order 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Regular",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -5232,7 +5232,7 @@ exports[`OrderDetails renders a failed order 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Bold",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -5292,7 +5292,7 @@ exports[`OrderDetails renders a failed order 1`] = `
                                                     accessibilityRole="text"
                                                     style={
                                                       {
-                                                        "color": "#121314",
+                                                        "color": "#131416",
                                                         "fontFamily": "Geist-Regular",
                                                         "fontSize": 14,
                                                         "letterSpacing": 0,
@@ -5324,7 +5324,7 @@ exports[`OrderDetails renders a failed order 1`] = `
                                                     accessibilityRole="text"
                                                     style={
                                                       {
-                                                        "color": "#121314",
+                                                        "color": "#131416",
                                                         "fontFamily": "Geist-Bold",
                                                         "fontSize": 14,
                                                         "letterSpacing": 0,
@@ -5375,7 +5375,7 @@ exports[`OrderDetails renders a failed order 1`] = `
                                                     accessibilityRole="text"
                                                     style={
                                                       {
-                                                        "color": "#121314",
+                                                        "color": "#131416",
                                                         "fontFamily": "Geist-Regular",
                                                         "fontSize": 14,
                                                         "letterSpacing": 0,
@@ -5409,7 +5409,7 @@ exports[`OrderDetails renders a failed order 1`] = `
                                                     accessibilityRole="text"
                                                     style={
                                                       {
-                                                        "color": "#121314",
+                                                        "color": "#131416",
                                                         "fontFamily": "Geist-Bold",
                                                         "fontSize": 14,
                                                         "letterSpacing": 0,
@@ -5461,7 +5461,7 @@ exports[`OrderDetails renders a failed order 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Regular",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -5493,7 +5493,7 @@ exports[`OrderDetails renders a failed order 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Bold",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -5510,7 +5510,7 @@ exports[`OrderDetails renders a failed order 1`] = `
                                         <View
                                           style={
                                             {
-                                              "backgroundColor": "#b7bbc866",
+                                              "backgroundColor": "#b4b4b566",
                                               "height": 1,
                                               "marginVertical": 12,
                                             }
@@ -5553,7 +5553,7 @@ exports[`OrderDetails renders a failed order 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Regular",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -5585,7 +5585,7 @@ exports[`OrderDetails renders a failed order 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Bold",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -5629,7 +5629,7 @@ exports[`OrderDetails renders a failed order 1`] = `
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "stretch",
-                                      "backgroundColor": "#121314",
+                                      "backgroundColor": "#131416",
                                       "borderRadius": 12,
                                       "flexDirection": "row",
                                       "height": 48,
@@ -5995,7 +5995,7 @@ exports[`OrderDetails renders a pending order 1`] = `
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "height": 24,
                                         "width": 24,
                                       },
@@ -6036,7 +6036,7 @@ exports[`OrderDetails renders a pending order 1`] = `
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 16,
                                       "fontWeight": 400,
@@ -6072,7 +6072,7 @@ exports[`OrderDetails renders a pending order 1`] = `
                               }
                               onRefresh={[Function]}
                               refreshing={false}
-                              tintColor="#121314"
+                              tintColor="#131416"
                             />
                           }
                         >
@@ -6118,7 +6118,7 @@ exports[`OrderDetails renders a pending order 1`] = `
                                       <View
                                         style={
                                           {
-                                            "borderColor": "#f3f5f9",
+                                            "borderColor": "#f3f3f4",
                                             "borderRadius": 64,
                                             "borderWidth": 3.5,
                                             "height": 36,
@@ -6177,9 +6177,9 @@ exports[`OrderDetails renders a pending order 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                               "textAlign": "center",
@@ -6201,7 +6201,7 @@ exports[`OrderDetails renders a pending order 1`] = `
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Medium",
                                             "fontSize": 24,
                                             "letterSpacing": 0,
@@ -6218,7 +6218,7 @@ exports[`OrderDetails renders a pending order 1`] = `
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#686e7d",
+                                            "color": "#66676a",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 14,
                                             "letterSpacing": 0,
@@ -6247,7 +6247,7 @@ exports[`OrderDetails renders a pending order 1`] = `
                                         style={
                                           [
                                             {
-                                              "backgroundColor": "#3c4d9d0f",
+                                              "backgroundColor": "#b4b4b528",
                                               "borderRadius": 8,
                                               "padding": 16,
                                             },
@@ -6274,7 +6274,7 @@ exports[`OrderDetails renders a pending order 1`] = `
                                               [
                                                 {
                                                   "alignItems": "center",
-                                                  "backgroundColor": "#f3f5f9",
+                                                  "backgroundColor": "#f3f3f4",
                                                   "borderRadius": 100,
                                                   "flexDirection": "row",
                                                   "flexShrink": 1,
@@ -6293,7 +6293,7 @@ exports[`OrderDetails renders a pending order 1`] = `
                                             <View
                                               placeholderStyle={
                                                 {
-                                                  "backgroundColor": "#f3f5f9",
+                                                  "backgroundColor": "#f3f3f4",
                                                 }
                                               }
                                               useNativeDriver={true}
@@ -6340,7 +6340,7 @@ exports[`OrderDetails renders a pending order 1`] = `
                                                         "backgroundColor": "#eee",
                                                       },
                                                       {
-                                                        "backgroundColor": "#f3f5f9",
+                                                        "backgroundColor": "#f3f3f4",
                                                       },
                                                     ]
                                                   }
@@ -6352,7 +6352,7 @@ exports[`OrderDetails renders a pending order 1`] = `
                                               style={
                                                 [
                                                   {
-                                                    "color": "#121314",
+                                                    "color": "#131416",
                                                     "fontFamily": "Geist-Regular",
                                                     "fontSize": 30,
                                                     "marginVertical": 2,
@@ -6370,7 +6370,7 @@ exports[`OrderDetails renders a pending order 1`] = `
                                                   undefined,
                                                   undefined,
                                                   {
-                                                    "color": "#121314",
+                                                    "color": "#131416",
                                                   },
                                                   undefined,
                                                   undefined,
@@ -6441,7 +6441,7 @@ exports[`OrderDetails renders a pending order 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Regular",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -6474,7 +6474,7 @@ exports[`OrderDetails renders a pending order 1`] = `
                                                   selectable={true}
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Bold",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -6524,7 +6524,7 @@ exports[`OrderDetails renders a pending order 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Regular",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -6556,7 +6556,7 @@ exports[`OrderDetails renders a pending order 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Bold",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -6601,7 +6601,7 @@ exports[`OrderDetails renders a pending order 1`] = `
                                                 accessibilityRole="text"
                                                 style={
                                                   {
-                                                    "color": "#121314",
+                                                    "color": "#131416",
                                                     "fontFamily": "Geist-Regular",
                                                     "fontSize": 14,
                                                     "letterSpacing": 0,
@@ -6651,7 +6651,7 @@ exports[`OrderDetails renders a pending order 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Regular",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -6683,7 +6683,7 @@ exports[`OrderDetails renders a pending order 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Bold",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -6743,7 +6743,7 @@ exports[`OrderDetails renders a pending order 1`] = `
                                                     accessibilityRole="text"
                                                     style={
                                                       {
-                                                        "color": "#121314",
+                                                        "color": "#131416",
                                                         "fontFamily": "Geist-Regular",
                                                         "fontSize": 14,
                                                         "letterSpacing": 0,
@@ -6775,7 +6775,7 @@ exports[`OrderDetails renders a pending order 1`] = `
                                                     accessibilityRole="text"
                                                     style={
                                                       {
-                                                        "color": "#121314",
+                                                        "color": "#131416",
                                                         "fontFamily": "Geist-Bold",
                                                         "fontSize": 14,
                                                         "letterSpacing": 0,
@@ -6826,7 +6826,7 @@ exports[`OrderDetails renders a pending order 1`] = `
                                                     accessibilityRole="text"
                                                     style={
                                                       {
-                                                        "color": "#121314",
+                                                        "color": "#131416",
                                                         "fontFamily": "Geist-Regular",
                                                         "fontSize": 14,
                                                         "letterSpacing": 0,
@@ -6860,7 +6860,7 @@ exports[`OrderDetails renders a pending order 1`] = `
                                                     accessibilityRole="text"
                                                     style={
                                                       {
-                                                        "color": "#121314",
+                                                        "color": "#131416",
                                                         "fontFamily": "Geist-Bold",
                                                         "fontSize": 14,
                                                         "letterSpacing": 0,
@@ -6912,7 +6912,7 @@ exports[`OrderDetails renders a pending order 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Regular",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -6944,7 +6944,7 @@ exports[`OrderDetails renders a pending order 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Bold",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -6961,7 +6961,7 @@ exports[`OrderDetails renders a pending order 1`] = `
                                         <View
                                           style={
                                             {
-                                              "backgroundColor": "#b7bbc866",
+                                              "backgroundColor": "#b4b4b566",
                                               "height": 1,
                                               "marginVertical": 12,
                                             }
@@ -7004,7 +7004,7 @@ exports[`OrderDetails renders a pending order 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Regular",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -7036,7 +7036,7 @@ exports[`OrderDetails renders a pending order 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Bold",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -7409,7 +7409,7 @@ exports[`OrderDetails renders an empty screen layout if there is no order 1`] =
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "height": 24,
                                         "width": 24,
                                       },
@@ -7450,7 +7450,7 @@ exports[`OrderDetails renders an empty screen layout if there is no order 1`] =
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 16,
                                       "fontWeight": 400,
@@ -7808,7 +7808,7 @@ exports[`OrderDetails renders an error screen if a CREATED order cannot be polle
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "height": 24,
                                         "width": 24,
                                       },
@@ -7849,7 +7849,7 @@ exports[`OrderDetails renders an error screen if a CREATED order cannot be polle
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 16,
                                       "fontWeight": 400,
@@ -7948,7 +7948,7 @@ exports[`OrderDetails renders an error screen if a CREATED order cannot be polle
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 18,
                                       "letterSpacing": 0,
@@ -7972,7 +7972,7 @@ exports[`OrderDetails renders an error screen if a CREATED order cannot be polle
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 30,
                                         "marginVertical": 2,
@@ -7986,7 +7986,7 @@ exports[`OrderDetails renders an error screen if a CREATED order cannot be polle
                                       undefined,
                                       undefined,
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                       },
                                       undefined,
                                       undefined,
@@ -8029,7 +8029,7 @@ exports[`OrderDetails renders an error screen if a CREATED order cannot be polle
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "stretch",
-                                      "backgroundColor": "#121314",
+                                      "backgroundColor": "#131416",
                                       "borderRadius": 12,
                                       "flexDirection": "row",
                                       "height": 48,
@@ -8395,7 +8395,7 @@ exports[`OrderDetails renders non-transacted orders 1`] = `
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "height": 24,
                                         "width": 24,
                                       },
@@ -8436,7 +8436,7 @@ exports[`OrderDetails renders non-transacted orders 1`] = `
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 16,
                                       "fontWeight": 400,
@@ -8472,7 +8472,7 @@ exports[`OrderDetails renders non-transacted orders 1`] = `
                               }
                               onRefresh={[Function]}
                               refreshing={false}
-                              tintColor="#121314"
+                              tintColor="#131416"
                             />
                           }
                         >
@@ -8518,7 +8518,7 @@ exports[`OrderDetails renders non-transacted orders 1`] = `
                                       <View
                                         style={
                                           {
-                                            "borderColor": "#f3f5f9",
+                                            "borderColor": "#f3f3f4",
                                             "borderRadius": 64,
                                             "borderWidth": 3.5,
                                             "height": 36,
@@ -8577,9 +8577,9 @@ exports[`OrderDetails renders non-transacted orders 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                               "textAlign": "center",
@@ -8592,7 +8592,7 @@ exports[`OrderDetails renders non-transacted orders 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 14,
                                               "letterSpacing": 0,
@@ -8616,7 +8616,7 @@ exports[`OrderDetails renders non-transacted orders 1`] = `
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Medium",
                                             "fontSize": 24,
                                             "letterSpacing": 0,
@@ -8633,7 +8633,7 @@ exports[`OrderDetails renders non-transacted orders 1`] = `
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#686e7d",
+                                            "color": "#66676a",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 14,
                                             "letterSpacing": 0,
@@ -8662,7 +8662,7 @@ exports[`OrderDetails renders non-transacted orders 1`] = `
                                         style={
                                           [
                                             {
-                                              "backgroundColor": "#3c4d9d0f",
+                                              "backgroundColor": "#b4b4b528",
                                               "borderRadius": 8,
                                               "padding": 16,
                                             },
@@ -8689,7 +8689,7 @@ exports[`OrderDetails renders non-transacted orders 1`] = `
                                               [
                                                 {
                                                   "alignItems": "center",
-                                                  "backgroundColor": "#f3f5f9",
+                                                  "backgroundColor": "#f3f3f4",
                                                   "borderRadius": 100,
                                                   "flexDirection": "row",
                                                   "flexShrink": 1,
@@ -8708,7 +8708,7 @@ exports[`OrderDetails renders non-transacted orders 1`] = `
                                             <View
                                               placeholderStyle={
                                                 {
-                                                  "backgroundColor": "#f3f5f9",
+                                                  "backgroundColor": "#f3f3f4",
                                                 }
                                               }
                                               useNativeDriver={true}
@@ -8755,7 +8755,7 @@ exports[`OrderDetails renders non-transacted orders 1`] = `
                                                         "backgroundColor": "#eee",
                                                       },
                                                       {
-                                                        "backgroundColor": "#f3f5f9",
+                                                        "backgroundColor": "#f3f3f4",
                                                       },
                                                     ]
                                                   }
@@ -8767,7 +8767,7 @@ exports[`OrderDetails renders non-transacted orders 1`] = `
                                               style={
                                                 [
                                                   {
-                                                    "color": "#121314",
+                                                    "color": "#131416",
                                                     "fontFamily": "Geist-Regular",
                                                     "fontSize": 30,
                                                     "marginVertical": 2,
@@ -8785,7 +8785,7 @@ exports[`OrderDetails renders non-transacted orders 1`] = `
                                                   undefined,
                                                   undefined,
                                                   {
-                                                    "color": "#121314",
+                                                    "color": "#131416",
                                                   },
                                                   undefined,
                                                   undefined,
@@ -8856,7 +8856,7 @@ exports[`OrderDetails renders non-transacted orders 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Regular",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -8889,7 +8889,7 @@ exports[`OrderDetails renders non-transacted orders 1`] = `
                                                   selectable={true}
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Bold",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -8939,7 +8939,7 @@ exports[`OrderDetails renders non-transacted orders 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Regular",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -8971,7 +8971,7 @@ exports[`OrderDetails renders non-transacted orders 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Bold",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -9016,7 +9016,7 @@ exports[`OrderDetails renders non-transacted orders 1`] = `
                                                 accessibilityRole="text"
                                                 style={
                                                   {
-                                                    "color": "#121314",
+                                                    "color": "#131416",
                                                     "fontFamily": "Geist-Regular",
                                                     "fontSize": 14,
                                                     "letterSpacing": 0,
@@ -9066,7 +9066,7 @@ exports[`OrderDetails renders non-transacted orders 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Regular",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -9098,7 +9098,7 @@ exports[`OrderDetails renders non-transacted orders 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Bold",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -9158,7 +9158,7 @@ exports[`OrderDetails renders non-transacted orders 1`] = `
                                                     accessibilityRole="text"
                                                     style={
                                                       {
-                                                        "color": "#121314",
+                                                        "color": "#131416",
                                                         "fontFamily": "Geist-Regular",
                                                         "fontSize": 14,
                                                         "letterSpacing": 0,
@@ -9190,7 +9190,7 @@ exports[`OrderDetails renders non-transacted orders 1`] = `
                                                     accessibilityRole="text"
                                                     style={
                                                       {
-                                                        "color": "#121314",
+                                                        "color": "#131416",
                                                         "fontFamily": "Geist-Bold",
                                                         "fontSize": 14,
                                                         "letterSpacing": 0,
@@ -9241,7 +9241,7 @@ exports[`OrderDetails renders non-transacted orders 1`] = `
                                                     accessibilityRole="text"
                                                     style={
                                                       {
-                                                        "color": "#121314",
+                                                        "color": "#131416",
                                                         "fontFamily": "Geist-Regular",
                                                         "fontSize": 14,
                                                         "letterSpacing": 0,
@@ -9275,7 +9275,7 @@ exports[`OrderDetails renders non-transacted orders 1`] = `
                                                     accessibilityRole="text"
                                                     style={
                                                       {
-                                                        "color": "#121314",
+                                                        "color": "#131416",
                                                         "fontFamily": "Geist-Bold",
                                                         "fontSize": 14,
                                                         "letterSpacing": 0,
@@ -9327,7 +9327,7 @@ exports[`OrderDetails renders non-transacted orders 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Regular",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -9359,7 +9359,7 @@ exports[`OrderDetails renders non-transacted orders 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Bold",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -9376,7 +9376,7 @@ exports[`OrderDetails renders non-transacted orders 1`] = `
                                         <View
                                           style={
                                             {
-                                              "backgroundColor": "#b7bbc866",
+                                              "backgroundColor": "#b4b4b566",
                                               "height": 1,
                                               "marginVertical": 12,
                                             }
@@ -9419,7 +9419,7 @@ exports[`OrderDetails renders non-transacted orders 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Regular",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -9451,7 +9451,7 @@ exports[`OrderDetails renders non-transacted orders 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Bold",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -9507,7 +9507,7 @@ exports[`OrderDetails renders non-transacted orders 1`] = `
                                       {
                                         "alignItems": "center",
                                         "alignSelf": "stretch",
-                                        "backgroundColor": "#121314",
+                                        "backgroundColor": "#131416",
                                         "borderRadius": 12,
                                         "flexDirection": "row",
                                         "height": 48,
@@ -9874,7 +9874,7 @@ exports[`OrderDetails renders the support links if the provider has them 1`] = `
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "height": 24,
                                         "width": 24,
                                       },
@@ -9915,7 +9915,7 @@ exports[`OrderDetails renders the support links if the provider has them 1`] = `
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 16,
                                       "fontWeight": 400,
@@ -9951,7 +9951,7 @@ exports[`OrderDetails renders the support links if the provider has them 1`] = `
                               }
                               onRefresh={[Function]}
                               refreshing={false}
-                              tintColor="#121314"
+                              tintColor="#131416"
                             />
                           }
                         >
@@ -10026,9 +10026,9 @@ exports[`OrderDetails renders the support links if the provider has them 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                               "textAlign": "center",
@@ -10041,7 +10041,7 @@ exports[`OrderDetails renders the support links if the provider has them 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 14,
                                               "letterSpacing": 0,
@@ -10065,7 +10065,7 @@ exports[`OrderDetails renders the support links if the provider has them 1`] = `
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Medium",
                                             "fontSize": 24,
                                             "letterSpacing": 0,
@@ -10082,7 +10082,7 @@ exports[`OrderDetails renders the support links if the provider has them 1`] = `
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#686e7d",
+                                            "color": "#66676a",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 14,
                                             "letterSpacing": 0,
@@ -10138,7 +10138,7 @@ exports[`OrderDetails renders the support links if the provider has them 1`] = `
                                         style={
                                           [
                                             {
-                                              "backgroundColor": "#3c4d9d0f",
+                                              "backgroundColor": "#b4b4b528",
                                               "borderRadius": 8,
                                               "padding": 16,
                                             },
@@ -10165,7 +10165,7 @@ exports[`OrderDetails renders the support links if the provider has them 1`] = `
                                               [
                                                 {
                                                   "alignItems": "center",
-                                                  "backgroundColor": "#f3f5f9",
+                                                  "backgroundColor": "#f3f3f4",
                                                   "borderRadius": 100,
                                                   "flexDirection": "row",
                                                   "flexShrink": 1,
@@ -10184,7 +10184,7 @@ exports[`OrderDetails renders the support links if the provider has them 1`] = `
                                             <View
                                               placeholderStyle={
                                                 {
-                                                  "backgroundColor": "#f3f5f9",
+                                                  "backgroundColor": "#f3f3f4",
                                                 }
                                               }
                                               useNativeDriver={true}
@@ -10231,7 +10231,7 @@ exports[`OrderDetails renders the support links if the provider has them 1`] = `
                                                         "backgroundColor": "#eee",
                                                       },
                                                       {
-                                                        "backgroundColor": "#f3f5f9",
+                                                        "backgroundColor": "#f3f3f4",
                                                       },
                                                     ]
                                                   }
@@ -10243,7 +10243,7 @@ exports[`OrderDetails renders the support links if the provider has them 1`] = `
                                               style={
                                                 [
                                                   {
-                                                    "color": "#121314",
+                                                    "color": "#131416",
                                                     "fontFamily": "Geist-Regular",
                                                     "fontSize": 30,
                                                     "marginVertical": 2,
@@ -10261,7 +10261,7 @@ exports[`OrderDetails renders the support links if the provider has them 1`] = `
                                                   undefined,
                                                   undefined,
                                                   {
-                                                    "color": "#121314",
+                                                    "color": "#131416",
                                                   },
                                                   undefined,
                                                   undefined,
@@ -10332,7 +10332,7 @@ exports[`OrderDetails renders the support links if the provider has them 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Regular",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -10365,7 +10365,7 @@ exports[`OrderDetails renders the support links if the provider has them 1`] = `
                                                   selectable={true}
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Bold",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -10415,7 +10415,7 @@ exports[`OrderDetails renders the support links if the provider has them 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Regular",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -10447,7 +10447,7 @@ exports[`OrderDetails renders the support links if the provider has them 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Bold",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -10492,7 +10492,7 @@ exports[`OrderDetails renders the support links if the provider has them 1`] = `
                                                 accessibilityRole="text"
                                                 style={
                                                   {
-                                                    "color": "#121314",
+                                                    "color": "#131416",
                                                     "fontFamily": "Geist-Regular",
                                                     "fontSize": 14,
                                                     "letterSpacing": 0,
@@ -10509,7 +10509,7 @@ exports[`OrderDetails renders the support links if the provider has them 1`] = `
                                                   onPress={[Function]}
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Regular",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -10561,7 +10561,7 @@ exports[`OrderDetails renders the support links if the provider has them 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Regular",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -10593,7 +10593,7 @@ exports[`OrderDetails renders the support links if the provider has them 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Bold",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -10653,7 +10653,7 @@ exports[`OrderDetails renders the support links if the provider has them 1`] = `
                                                     accessibilityRole="text"
                                                     style={
                                                       {
-                                                        "color": "#121314",
+                                                        "color": "#131416",
                                                         "fontFamily": "Geist-Regular",
                                                         "fontSize": 14,
                                                         "letterSpacing": 0,
@@ -10685,7 +10685,7 @@ exports[`OrderDetails renders the support links if the provider has them 1`] = `
                                                     accessibilityRole="text"
                                                     style={
                                                       {
-                                                        "color": "#121314",
+                                                        "color": "#131416",
                                                         "fontFamily": "Geist-Bold",
                                                         "fontSize": 14,
                                                         "letterSpacing": 0,
@@ -10736,7 +10736,7 @@ exports[`OrderDetails renders the support links if the provider has them 1`] = `
                                                     accessibilityRole="text"
                                                     style={
                                                       {
-                                                        "color": "#121314",
+                                                        "color": "#131416",
                                                         "fontFamily": "Geist-Regular",
                                                         "fontSize": 14,
                                                         "letterSpacing": 0,
@@ -10770,7 +10770,7 @@ exports[`OrderDetails renders the support links if the provider has them 1`] = `
                                                     accessibilityRole="text"
                                                     style={
                                                       {
-                                                        "color": "#121314",
+                                                        "color": "#131416",
                                                         "fontFamily": "Geist-Bold",
                                                         "fontSize": 14,
                                                         "letterSpacing": 0,
@@ -10822,7 +10822,7 @@ exports[`OrderDetails renders the support links if the provider has them 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Regular",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -10854,7 +10854,7 @@ exports[`OrderDetails renders the support links if the provider has them 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Bold",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -10871,7 +10871,7 @@ exports[`OrderDetails renders the support links if the provider has them 1`] = `
                                         <View
                                           style={
                                             {
-                                              "backgroundColor": "#b7bbc866",
+                                              "backgroundColor": "#b4b4b566",
                                               "height": 1,
                                               "marginVertical": 12,
                                             }
@@ -10914,7 +10914,7 @@ exports[`OrderDetails renders the support links if the provider has them 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Regular",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -10946,7 +10946,7 @@ exports[`OrderDetails renders the support links if the provider has them 1`] = `
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Bold",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -10990,7 +10990,7 @@ exports[`OrderDetails renders the support links if the provider has them 1`] = `
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "stretch",
-                                      "backgroundColor": "#121314",
+                                      "backgroundColor": "#131416",
                                       "borderRadius": 12,
                                       "flexDirection": "row",
                                       "height": 48,
@@ -11356,7 +11356,7 @@ exports[`OrderDetails renders transacted orders that do not have timeDescription
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "height": 24,
                                         "width": 24,
                                       },
@@ -11397,7 +11397,7 @@ exports[`OrderDetails renders transacted orders that do not have timeDescription
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 16,
                                       "fontWeight": 400,
@@ -11433,7 +11433,7 @@ exports[`OrderDetails renders transacted orders that do not have timeDescription
                               }
                               onRefresh={[Function]}
                               refreshing={false}
-                              tintColor="#121314"
+                              tintColor="#131416"
                             />
                           }
                         >
@@ -11479,7 +11479,7 @@ exports[`OrderDetails renders transacted orders that do not have timeDescription
                                       <View
                                         style={
                                           {
-                                            "borderColor": "#f3f5f9",
+                                            "borderColor": "#f3f3f4",
                                             "borderRadius": 64,
                                             "borderWidth": 3.5,
                                             "height": 36,
@@ -11538,9 +11538,9 @@ exports[`OrderDetails renders transacted orders that do not have timeDescription
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                               "textAlign": "center",
@@ -11562,7 +11562,7 @@ exports[`OrderDetails renders transacted orders that do not have timeDescription
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Medium",
                                             "fontSize": 24,
                                             "letterSpacing": 0,
@@ -11579,7 +11579,7 @@ exports[`OrderDetails renders transacted orders that do not have timeDescription
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#686e7d",
+                                            "color": "#66676a",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 14,
                                             "letterSpacing": 0,
@@ -11608,7 +11608,7 @@ exports[`OrderDetails renders transacted orders that do not have timeDescription
                                         style={
                                           [
                                             {
-                                              "backgroundColor": "#3c4d9d0f",
+                                              "backgroundColor": "#b4b4b528",
                                               "borderRadius": 8,
                                               "padding": 16,
                                             },
@@ -11635,7 +11635,7 @@ exports[`OrderDetails renders transacted orders that do not have timeDescription
                                               [
                                                 {
                                                   "alignItems": "center",
-                                                  "backgroundColor": "#f3f5f9",
+                                                  "backgroundColor": "#f3f3f4",
                                                   "borderRadius": 100,
                                                   "flexDirection": "row",
                                                   "flexShrink": 1,
@@ -11654,7 +11654,7 @@ exports[`OrderDetails renders transacted orders that do not have timeDescription
                                             <View
                                               placeholderStyle={
                                                 {
-                                                  "backgroundColor": "#f3f5f9",
+                                                  "backgroundColor": "#f3f3f4",
                                                 }
                                               }
                                               useNativeDriver={true}
@@ -11701,7 +11701,7 @@ exports[`OrderDetails renders transacted orders that do not have timeDescription
                                                         "backgroundColor": "#eee",
                                                       },
                                                       {
-                                                        "backgroundColor": "#f3f5f9",
+                                                        "backgroundColor": "#f3f3f4",
                                                       },
                                                     ]
                                                   }
@@ -11713,7 +11713,7 @@ exports[`OrderDetails renders transacted orders that do not have timeDescription
                                               style={
                                                 [
                                                   {
-                                                    "color": "#121314",
+                                                    "color": "#131416",
                                                     "fontFamily": "Geist-Regular",
                                                     "fontSize": 30,
                                                     "marginVertical": 2,
@@ -11731,7 +11731,7 @@ exports[`OrderDetails renders transacted orders that do not have timeDescription
                                                   undefined,
                                                   undefined,
                                                   {
-                                                    "color": "#121314",
+                                                    "color": "#131416",
                                                   },
                                                   undefined,
                                                   undefined,
@@ -11802,7 +11802,7 @@ exports[`OrderDetails renders transacted orders that do not have timeDescription
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Regular",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -11835,7 +11835,7 @@ exports[`OrderDetails renders transacted orders that do not have timeDescription
                                                   selectable={true}
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Bold",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -11885,7 +11885,7 @@ exports[`OrderDetails renders transacted orders that do not have timeDescription
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Regular",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -11917,7 +11917,7 @@ exports[`OrderDetails renders transacted orders that do not have timeDescription
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Bold",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -11962,7 +11962,7 @@ exports[`OrderDetails renders transacted orders that do not have timeDescription
                                                 accessibilityRole="text"
                                                 style={
                                                   {
-                                                    "color": "#121314",
+                                                    "color": "#131416",
                                                     "fontFamily": "Geist-Regular",
                                                     "fontSize": 14,
                                                     "letterSpacing": 0,
@@ -12012,7 +12012,7 @@ exports[`OrderDetails renders transacted orders that do not have timeDescription
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Regular",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -12044,7 +12044,7 @@ exports[`OrderDetails renders transacted orders that do not have timeDescription
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Bold",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -12104,7 +12104,7 @@ exports[`OrderDetails renders transacted orders that do not have timeDescription
                                                     accessibilityRole="text"
                                                     style={
                                                       {
-                                                        "color": "#121314",
+                                                        "color": "#131416",
                                                         "fontFamily": "Geist-Regular",
                                                         "fontSize": 14,
                                                         "letterSpacing": 0,
@@ -12136,7 +12136,7 @@ exports[`OrderDetails renders transacted orders that do not have timeDescription
                                                     accessibilityRole="text"
                                                     style={
                                                       {
-                                                        "color": "#121314",
+                                                        "color": "#131416",
                                                         "fontFamily": "Geist-Bold",
                                                         "fontSize": 14,
                                                         "letterSpacing": 0,
@@ -12187,7 +12187,7 @@ exports[`OrderDetails renders transacted orders that do not have timeDescription
                                                     accessibilityRole="text"
                                                     style={
                                                       {
-                                                        "color": "#121314",
+                                                        "color": "#131416",
                                                         "fontFamily": "Geist-Regular",
                                                         "fontSize": 14,
                                                         "letterSpacing": 0,
@@ -12221,7 +12221,7 @@ exports[`OrderDetails renders transacted orders that do not have timeDescription
                                                     accessibilityRole="text"
                                                     style={
                                                       {
-                                                        "color": "#121314",
+                                                        "color": "#131416",
                                                         "fontFamily": "Geist-Bold",
                                                         "fontSize": 14,
                                                         "letterSpacing": 0,
@@ -12273,7 +12273,7 @@ exports[`OrderDetails renders transacted orders that do not have timeDescription
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Regular",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -12305,7 +12305,7 @@ exports[`OrderDetails renders transacted orders that do not have timeDescription
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Bold",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -12322,7 +12322,7 @@ exports[`OrderDetails renders transacted orders that do not have timeDescription
                                         <View
                                           style={
                                             {
-                                              "backgroundColor": "#b7bbc866",
+                                              "backgroundColor": "#b4b4b566",
                                               "height": 1,
                                               "marginVertical": 12,
                                             }
@@ -12365,7 +12365,7 @@ exports[`OrderDetails renders transacted orders that do not have timeDescription
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Regular",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -12397,7 +12397,7 @@ exports[`OrderDetails renders transacted orders that do not have timeDescription
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Bold",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -12770,7 +12770,7 @@ exports[`OrderDetails renders transacted orders that have timeDescriptionPending
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "height": 24,
                                         "width": 24,
                                       },
@@ -12811,7 +12811,7 @@ exports[`OrderDetails renders transacted orders that have timeDescriptionPending
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 16,
                                       "fontWeight": 400,
@@ -12847,7 +12847,7 @@ exports[`OrderDetails renders transacted orders that have timeDescriptionPending
                               }
                               onRefresh={[Function]}
                               refreshing={false}
-                              tintColor="#121314"
+                              tintColor="#131416"
                             />
                           }
                         >
@@ -12893,7 +12893,7 @@ exports[`OrderDetails renders transacted orders that have timeDescriptionPending
                                       <View
                                         style={
                                           {
-                                            "borderColor": "#f3f5f9",
+                                            "borderColor": "#f3f3f4",
                                             "borderRadius": 64,
                                             "borderWidth": 3.5,
                                             "height": 36,
@@ -12952,9 +12952,9 @@ exports[`OrderDetails renders transacted orders that have timeDescriptionPending
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                               "textAlign": "center",
@@ -12967,7 +12967,7 @@ exports[`OrderDetails renders transacted orders that have timeDescriptionPending
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 14,
                                               "letterSpacing": 0,
@@ -12991,7 +12991,7 @@ exports[`OrderDetails renders transacted orders that have timeDescriptionPending
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Medium",
                                             "fontSize": 24,
                                             "letterSpacing": 0,
@@ -13008,7 +13008,7 @@ exports[`OrderDetails renders transacted orders that have timeDescriptionPending
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#686e7d",
+                                            "color": "#66676a",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 14,
                                             "letterSpacing": 0,
@@ -13037,7 +13037,7 @@ exports[`OrderDetails renders transacted orders that have timeDescriptionPending
                                         style={
                                           [
                                             {
-                                              "backgroundColor": "#3c4d9d0f",
+                                              "backgroundColor": "#b4b4b528",
                                               "borderRadius": 8,
                                               "padding": 16,
                                             },
@@ -13064,7 +13064,7 @@ exports[`OrderDetails renders transacted orders that have timeDescriptionPending
                                               [
                                                 {
                                                   "alignItems": "center",
-                                                  "backgroundColor": "#f3f5f9",
+                                                  "backgroundColor": "#f3f3f4",
                                                   "borderRadius": 100,
                                                   "flexDirection": "row",
                                                   "flexShrink": 1,
@@ -13083,7 +13083,7 @@ exports[`OrderDetails renders transacted orders that have timeDescriptionPending
                                             <View
                                               placeholderStyle={
                                                 {
-                                                  "backgroundColor": "#f3f5f9",
+                                                  "backgroundColor": "#f3f3f4",
                                                 }
                                               }
                                               useNativeDriver={true}
@@ -13130,7 +13130,7 @@ exports[`OrderDetails renders transacted orders that have timeDescriptionPending
                                                         "backgroundColor": "#eee",
                                                       },
                                                       {
-                                                        "backgroundColor": "#f3f5f9",
+                                                        "backgroundColor": "#f3f3f4",
                                                       },
                                                     ]
                                                   }
@@ -13142,7 +13142,7 @@ exports[`OrderDetails renders transacted orders that have timeDescriptionPending
                                               style={
                                                 [
                                                   {
-                                                    "color": "#121314",
+                                                    "color": "#131416",
                                                     "fontFamily": "Geist-Regular",
                                                     "fontSize": 30,
                                                     "marginVertical": 2,
@@ -13160,7 +13160,7 @@ exports[`OrderDetails renders transacted orders that have timeDescriptionPending
                                                   undefined,
                                                   undefined,
                                                   {
-                                                    "color": "#121314",
+                                                    "color": "#131416",
                                                   },
                                                   undefined,
                                                   undefined,
@@ -13231,7 +13231,7 @@ exports[`OrderDetails renders transacted orders that have timeDescriptionPending
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Regular",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -13264,7 +13264,7 @@ exports[`OrderDetails renders transacted orders that have timeDescriptionPending
                                                   selectable={true}
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Bold",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -13314,7 +13314,7 @@ exports[`OrderDetails renders transacted orders that have timeDescriptionPending
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Regular",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -13346,7 +13346,7 @@ exports[`OrderDetails renders transacted orders that have timeDescriptionPending
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Bold",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -13391,7 +13391,7 @@ exports[`OrderDetails renders transacted orders that have timeDescriptionPending
                                                 accessibilityRole="text"
                                                 style={
                                                   {
-                                                    "color": "#121314",
+                                                    "color": "#131416",
                                                     "fontFamily": "Geist-Regular",
                                                     "fontSize": 14,
                                                     "letterSpacing": 0,
@@ -13441,7 +13441,7 @@ exports[`OrderDetails renders transacted orders that have timeDescriptionPending
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Regular",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -13473,7 +13473,7 @@ exports[`OrderDetails renders transacted orders that have timeDescriptionPending
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Bold",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -13533,7 +13533,7 @@ exports[`OrderDetails renders transacted orders that have timeDescriptionPending
                                                     accessibilityRole="text"
                                                     style={
                                                       {
-                                                        "color": "#121314",
+                                                        "color": "#131416",
                                                         "fontFamily": "Geist-Regular",
                                                         "fontSize": 14,
                                                         "letterSpacing": 0,
@@ -13565,7 +13565,7 @@ exports[`OrderDetails renders transacted orders that have timeDescriptionPending
                                                     accessibilityRole="text"
                                                     style={
                                                       {
-                                                        "color": "#121314",
+                                                        "color": "#131416",
                                                         "fontFamily": "Geist-Bold",
                                                         "fontSize": 14,
                                                         "letterSpacing": 0,
@@ -13616,7 +13616,7 @@ exports[`OrderDetails renders transacted orders that have timeDescriptionPending
                                                     accessibilityRole="text"
                                                     style={
                                                       {
-                                                        "color": "#121314",
+                                                        "color": "#131416",
                                                         "fontFamily": "Geist-Regular",
                                                         "fontSize": 14,
                                                         "letterSpacing": 0,
@@ -13650,7 +13650,7 @@ exports[`OrderDetails renders transacted orders that have timeDescriptionPending
                                                     accessibilityRole="text"
                                                     style={
                                                       {
-                                                        "color": "#121314",
+                                                        "color": "#131416",
                                                         "fontFamily": "Geist-Bold",
                                                         "fontSize": 14,
                                                         "letterSpacing": 0,
@@ -13702,7 +13702,7 @@ exports[`OrderDetails renders transacted orders that have timeDescriptionPending
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Regular",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -13734,7 +13734,7 @@ exports[`OrderDetails renders transacted orders that have timeDescriptionPending
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Bold",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -13751,7 +13751,7 @@ exports[`OrderDetails renders transacted orders that have timeDescriptionPending
                                         <View
                                           style={
                                             {
-                                              "backgroundColor": "#b7bbc866",
+                                              "backgroundColor": "#b4b4b566",
                                               "height": 1,
                                               "marginVertical": 12,
                                             }
@@ -13794,7 +13794,7 @@ exports[`OrderDetails renders transacted orders that have timeDescriptionPending
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Regular",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
@@ -13826,7 +13826,7 @@ exports[`OrderDetails renders transacted orders that have timeDescriptionPending
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Bold",
                                                       "fontSize": 14,
                                                       "letterSpacing": 0,
diff --git a/app/components/UI/Ramp/Aggregator/Views/OrdersList/OrdersList.test.tsx b/app/components/UI/Ramp/Aggregator/Views/OrdersList/OrdersList.test.tsx
index 15478afef9fb..eab9a80b695d 100644
--- a/app/components/UI/Ramp/Aggregator/Views/OrdersList/OrdersList.test.tsx
+++ b/app/components/UI/Ramp/Aggregator/Views/OrdersList/OrdersList.test.tsx
@@ -111,6 +111,26 @@ const testOrders: DeepPartial<FiatOrder>[] = [
       },
     },
   },
+  {
+    id: 'test-ramps-v2-order-1',
+    account: MOCK_ADDRESS,
+    network: '1',
+    cryptoAmount: '0.5',
+    orderType: 'BUY',
+    state: FIAT_ORDER_STATES.COMPLETED,
+    createdAt: 1697242033399,
+    provider: FIAT_ORDER_PROVIDERS.RAMPS_V2,
+    cryptocurrency: 'ETH',
+    amount: '1000',
+    currency: 'USD',
+    data: {
+      cryptoCurrency: {
+        decimals: 18,
+        name: 'Ethereum',
+        symbol: 'ETH',
+      },
+    },
+  },
   {
     id: 'test-deposit-order-1',
     account: MOCK_ADDRESS,
@@ -219,6 +239,11 @@ jest.mock('../../../hooks/useRampNavigation', () => ({
 }));
 
 describe('OrdersList', () => {
+  beforeEach(() => {
+    mockNavigate.mockClear();
+    mockGoToDeposit.mockClear();
+  });
+
   it('renders correctly', () => {
     render(<OrdersList />);
     expect(screen.toJSON()).toMatchSnapshot();
@@ -279,29 +304,21 @@ describe('OrdersList', () => {
     `);
   });
 
+  it('navigates to ramps order details when pressing RAMPS_V2 order item', () => {
+    render(<OrdersList />, [testOrders[4]]);
+
+    fireEvent.press(screen.getByRole('button', { name: /Purchased ETH/ }));
+    expect(mockNavigate).toHaveBeenCalledWith('RampsOrderDetails', {
+      orderId: 'test-ramps-v2-order-1',
+    });
+  });
+
   it('navigates to deposit order details when pressing deposit order item', () => {
     render(<OrdersList />);
 
     fireEvent.press(screen.getByRole('button', { name: 'Purchased' }));
-    fireEvent.press(screen.getByRole('button', { name: /USDC Deposit/ }));
-    expect(mockNavigate).toHaveBeenCalled();
-    expect(mockNavigate.mock.calls).toMatchInlineSnapshot(`
-      [
-        [
-          "OrderDetails",
-          {
-            "orderId": "test-order-2",
-          },
-        ],
-        [
-          "RampsOrderDetails",
-          {
-            "orderId": "test-deposit-order-1",
-          },
-        ],
-      ]
-    `);
-    expect(mockNavigate).toHaveBeenCalledWith('RampsOrderDetails', {
+    fireEvent.press(screen.getByRole('button', { name: /Purchased USDC/ }));
+    expect(mockNavigate).toHaveBeenCalledWith('DepositOrderDetails', {
       orderId: 'test-deposit-order-1',
     });
   });
@@ -310,7 +327,7 @@ describe('OrdersList', () => {
     render(<OrdersList />);
 
     fireEvent.press(screen.getByRole('button', { name: 'Purchased' }));
-    fireEvent.press(screen.getByRole('button', { name: /USDT Deposit/ }));
+    fireEvent.press(screen.getByRole('button', { name: /Purchased USDT/ }));
 
     expect(mockGoToDeposit).toHaveBeenCalledWith();
   });
diff --git a/app/components/UI/Ramp/Aggregator/Views/OrdersList/OrdersList.testIds.ts b/app/components/UI/Ramp/Aggregator/Views/OrdersList/OrdersList.testIds.ts
new file mode 100644
index 000000000000..86b14cac06ea
--- /dev/null
+++ b/app/components/UI/Ramp/Aggregator/Views/OrdersList/OrdersList.testIds.ts
@@ -0,0 +1,14 @@
+export type RampsOrderTypeSlug = 'buy' | 'sell' | 'deposit';
+
+export const getOrderRowTestId = (type: RampsOrderTypeSlug, index: number) =>
+  `orders-list-row-${type}-${index}`;
+
+export const getOrderRowCryptoAmountTestId = (
+  type: RampsOrderTypeSlug,
+  index: number,
+) => `orders-list-crypto-amount-${type}-${index}`;
+
+export const getOrderRowFiatAmountTestId = (
+  type: RampsOrderTypeSlug,
+  index: number,
+) => `orders-list-fiat-amount-${type}-${index}`;
diff --git a/app/components/UI/Ramp/Aggregator/Views/OrdersList/OrdersList.tsx b/app/components/UI/Ramp/Aggregator/Views/OrdersList/OrdersList.tsx
index 0352acf668aa..69d549095ba4 100644
--- a/app/components/UI/Ramp/Aggregator/Views/OrdersList/OrdersList.tsx
+++ b/app/components/UI/Ramp/Aggregator/Views/OrdersList/OrdersList.tsx
@@ -1,4 +1,4 @@
-import React, { useCallback, useState } from 'react';
+import React, { useCallback, useMemo, useState } from 'react';
 import { FlatList, TouchableHighlight } from 'react-native';
 import { ScrollView } from 'react-native-gesture-handler';
 import { useNavigation } from '@react-navigation/native';
@@ -7,8 +7,8 @@ import { OrderOrderTypeEnum } from '@consensys/on-ramp-sdk/dist/API';
 
 import { createOrderDetailsNavDetails } from '../OrderDetails/OrderDetails';
 import { createRampsOrderDetailsNavDetails } from '../../../Views/OrderDetails';
+import { createDepositOrderDetailsNavDetails } from '../../../Deposit/Views/DepositOrderDetails/DepositOrderDetails';
 import { useRampNavigation } from '../../../hooks/useRampNavigation';
-import OrderListItem from '../../components/OrderListItem';
 import createStyles from './OrdersList.styles';
 import { TabEmptyState } from '../../../../../../component-library/components-temp/TabEmptyState';
 
@@ -16,7 +16,7 @@ import {
   FIAT_ORDER_PROVIDERS,
   FIAT_ORDER_STATES,
 } from '../../../../../../constants/on-ramp';
-import { FiatOrder, getOrders } from '../../../../../../reducers/fiatOrders';
+import { getOrders } from '../../../../../../reducers/fiatOrders';
 import { strings } from '../../../../../../../locales/i18n';
 import { useTheme } from '../../../../../../util/theme';
 import ButtonFilter from '../../../../../../component-library/components-temp/ButtonFilter';
@@ -25,29 +25,187 @@ import {
   ButtonSize as ButtonBaseSize,
 } from '@metamask/design-system-react-native';
 import { useTailwind } from '@metamask/design-system-twrnc-preset';
+import { useRampsOrders } from '../../../hooks/useRampsOrders';
+import {
+  mergeDisplayOrders,
+  type DisplayOrder,
+} from '../../../utils/displayOrder';
+import { toDateFormat } from '../../../../../../util/date';
+import { addCurrencySymbol, renderFiat } from '../../../../../../util/number';
+import Text, {
+  TextColor,
+  TextVariant,
+} from '../../../../../../component-library/components/Texts/Text';
+import ListItem from '../../../../../../component-library/components/List/ListItem';
+import ListItemColumn, {
+  WidthType,
+} from '../../../../../../component-library/components/List/ListItemColumn';
+import ListItemColumnEnd from '../../components/ListItemColumnEnd';
+import {
+  getOrderRowTestId,
+  getOrderRowCryptoAmountTestId,
+  getOrderRowFiatAmountTestId,
+  type RampsOrderTypeSlug,
+} from './OrdersList.testIds';
 
 type filterType = 'ALL' | 'PURCHASE' | 'SELL';
 
+function getStatusColorAndText(
+  status: string,
+  orderType: string,
+): [TextColor, string] {
+  let statusColor;
+  switch (status) {
+    case 'CANCELLED':
+    case 'FAILED':
+      statusColor = TextColor.Error;
+      break;
+    case 'COMPLETED':
+      statusColor = TextColor.Success;
+      break;
+    case 'PENDING':
+      statusColor = TextColor.Primary;
+      break;
+    case 'CREATED':
+    default:
+      statusColor = TextColor.Default;
+      break;
+  }
+
+  let statusText;
+  switch (status) {
+    case 'CANCELLED':
+      statusText = strings('fiat_on_ramp_aggregator.order_status_cancelled');
+      break;
+    case 'FAILED':
+      statusText = strings('fiat_on_ramp_aggregator.order_status_failed');
+      break;
+    case 'COMPLETED':
+      statusText = strings('fiat_on_ramp_aggregator.order_status_completed');
+      break;
+    case 'PENDING':
+      statusText =
+        orderType === 'BUY'
+          ? strings('fiat_on_ramp_aggregator.order_status_pending')
+          : strings('fiat_on_ramp_aggregator.order_status_processing');
+      break;
+    case 'CREATED':
+    default:
+      statusText = strings('fiat_on_ramp_aggregator.order_status_pending');
+      break;
+  }
+
+  return [statusColor, statusText];
+}
+
+function getOrderTypeSlug(orderType: string): RampsOrderTypeSlug {
+  if (orderType === 'DEPOSIT') return 'deposit';
+  if (orderType === 'SELL') return 'sell';
+  return 'buy';
+}
+
+function DisplayOrderListItem({
+  item,
+  index,
+}: {
+  item: DisplayOrder;
+  index: number;
+}) {
+  const isBuy = item.orderType === 'BUY' || item.orderType === 'DEPOSIT';
+  const [statusColor, statusText] = getStatusColorAndText(
+    item.status,
+    item.orderType,
+  );
+  const typeSlug = getOrderTypeSlug(item.orderType);
+
+  const title = item.providerName
+    ? `${item.providerName}: ${strings(
+        isBuy
+          ? 'fiat_on_ramp_aggregator.purchased_currency'
+          : 'fiat_on_ramp_aggregator.sold_currency',
+        { currency: item.cryptoCurrencySymbol },
+      )}`
+    : strings(
+        isBuy
+          ? 'fiat_on_ramp_aggregator.purchased_currency'
+          : 'fiat_on_ramp_aggregator.sold_currency',
+        { currency: item.cryptoCurrencySymbol },
+      );
+
+  return (
+    <ListItem
+      topAccessory={
+        <Text variant={TextVariant.BodySM}>{toDateFormat(item.createdAt)}</Text>
+      }
+      topAccessoryGap={10}
+    >
+      <ListItemColumn widthType={WidthType.Fill}>
+        <Text variant={TextVariant.BodyMD}>{title}</Text>
+        <Text variant={TextVariant.BodySMBold} color={statusColor}>
+          {statusText}
+        </Text>
+      </ListItemColumn>
+
+      <ListItemColumnEnd>
+        <Text
+          testID={getOrderRowCryptoAmountTestId(typeSlug, index)}
+          variant={TextVariant.BodyMD}
+        >
+          {item.cryptoAmount} {item.cryptoCurrencySymbol}
+        </Text>
+        <Text
+          testID={getOrderRowFiatAmountTestId(typeSlug, index)}
+          variant={TextVariant.BodySM}
+          color={TextColor.Alternative}
+        >
+          {item.fiatAmount == null
+            ? '...'
+            : addCurrencySymbol(
+                renderFiat(Number(item.fiatAmount), ''),
+                item.fiatCurrencyCode,
+              )}
+        </Text>
+      </ListItemColumnEnd>
+    </ListItem>
+  );
+}
+
+/**
+ * Merges legacy FiatOrder[] from Redux with V2 RampsOrder[] from controller into a single list
+ * Routes to the appropriate detail screen based on order source.
+ */
 function OrdersList() {
   const { colors } = useTheme();
   const styles = createStyles(colors);
   const navigation = useNavigation();
-  const allOrders = useSelector(getOrders);
+  const allLegacyOrders = useSelector(getOrders);
+  const { orders: v2Orders } = useRampsOrders();
   const [currentFilter, setCurrentFilter] = useState<filterType>('ALL');
   const { goToDeposit } = useRampNavigation();
   const tw = useTailwind();
-  const orders = allOrders.filter((order) => {
-    if (currentFilter === 'PURCHASE') {
-      return (
-        order.orderType === OrderOrderTypeEnum.Buy ||
-        order.orderType === 'DEPOSIT'
-      );
-    }
-    if (currentFilter === 'SELL') {
-      return order.orderType === OrderOrderTypeEnum.Sell;
-    }
-    return true;
-  });
+
+  const displayOrders = useMemo(
+    () => mergeDisplayOrders(allLegacyOrders, v2Orders),
+    [allLegacyOrders, v2Orders],
+  );
+
+  const filteredOrders = useMemo(
+    () =>
+      displayOrders.filter((order) => {
+        if (currentFilter === 'PURCHASE') {
+          return (
+            order.orderType === OrderOrderTypeEnum.Buy ||
+            order.orderType === 'DEPOSIT' ||
+            order.orderType === 'BUY'
+          );
+        }
+        if (currentFilter === 'SELL') {
+          return order.orderType === OrderOrderTypeEnum.Sell;
+        }
+        return true;
+      }),
+    [displayOrders, currentFilter],
+  );
 
   const handleNavigateToAggregatorTxDetails = useCallback(
     (orderId: string) => {
@@ -73,44 +231,74 @@ function OrdersList() {
 
   const handleNavigateToDepositTxDetails = useCallback(
     (orderId: string) => {
-      const order = orders.find((o) => o.id === orderId);
+      const order = allLegacyOrders.find((o) => o.id === orderId);
 
-      // CREATED state means the order is at the bank details step,
-      // which requires the DepositSDKProvider context for cancel/confirm actions
       if (
         order?.state === FIAT_ORDER_STATES.CREATED &&
         order?.provider === FIAT_ORDER_PROVIDERS.DEPOSIT
       ) {
         goToDeposit();
-      } else {
+      } else if (order?.provider === FIAT_ORDER_PROVIDERS.DEPOSIT) {
         navigation.navigate(
-          ...createRampsOrderDetailsNavDetails({
+          ...createDepositOrderDetailsNavDetails({
             orderId,
           }),
         );
+      } else {
+        handleNavigateToAggregatorTxDetails(orderId);
       }
     },
-    [navigation, orders, goToDeposit],
+    [
+      allLegacyOrders,
+      goToDeposit,
+      handleNavigateToAggregatorTxDetails,
+      navigation,
+    ],
   );
 
-  const renderItem = ({ item }: { item: FiatOrder }) => (
+  const handleItemPress = useCallback(
+    (item: DisplayOrder) => {
+      if (item.source === 'v2') {
+        handleNavigateToRampsTxDetails(item.id);
+        return;
+      }
+
+      const legacyOrder = allLegacyOrders.find((o) => o.id === item.id);
+      if (!legacyOrder) return;
+
+      if (legacyOrder.provider === FIAT_ORDER_PROVIDERS.DEPOSIT) {
+        handleNavigateToDepositTxDetails(item.id);
+      } else if (legacyOrder.provider === FIAT_ORDER_PROVIDERS.RAMPS_V2) {
+        handleNavigateToRampsTxDetails(item.id);
+      } else {
+        handleNavigateToAggregatorTxDetails(item.id);
+      }
+    },
+    [
+      allLegacyOrders,
+      handleNavigateToAggregatorTxDetails,
+      handleNavigateToRampsTxDetails,
+      handleNavigateToDepositTxDetails,
+    ],
+  );
+
+  const renderItem = ({
+    item,
+    index,
+  }: {
+    item: DisplayOrder;
+    index: number;
+  }) => (
     <TouchableHighlight
+      testID={getOrderRowTestId(getOrderTypeSlug(item.orderType), index + 1)}
       accessibilityRole="button"
       accessible
       style={styles.row}
-      onPress={
-        item.provider === FIAT_ORDER_PROVIDERS.AGGREGATOR
-          ? () => handleNavigateToAggregatorTxDetails(item.id)
-          : item.provider === FIAT_ORDER_PROVIDERS.RAMPS_V2
-            ? () => handleNavigateToRampsTxDetails(item.id)
-            : item.provider === FIAT_ORDER_PROVIDERS.DEPOSIT
-              ? () => handleNavigateToDepositTxDetails(item.id)
-              : undefined
-      }
+      onPress={() => handleItemPress(item)}
       underlayColor={colors.background.alternative}
       activeOpacity={1}
     >
-      <OrderListItem order={item} />
+      <DisplayOrderListItem item={item} index={index + 1} />
     </TouchableHighlight>
   );
 
@@ -150,9 +338,9 @@ function OrdersList() {
           </ScrollView>
         </Box>
       }
-      data={orders}
+      data={filteredOrders}
       renderItem={renderItem}
-      keyExtractor={(item) => item.id}
+      keyExtractor={(item) => `${item.source}-${item.id}`}
       ListEmptyComponent={
         <Box twClassName="w-full items-center py-10">
           <TabEmptyState
diff --git a/app/components/UI/Ramp/Aggregator/Views/OrdersList/__snapshots__/OrdersList.test.tsx.snap b/app/components/UI/Ramp/Aggregator/Views/OrdersList/__snapshots__/OrdersList.test.tsx.snap
index 9c36b5b11638..5091ad05fb18 100644
--- a/app/components/UI/Ramp/Aggregator/Views/OrdersList/__snapshots__/OrdersList.test.tsx.snap
+++ b/app/components/UI/Ramp/Aggregator/Views/OrdersList/__snapshots__/OrdersList.test.tsx.snap
@@ -56,117 +56,87 @@ exports[`OrdersList renders buy only correctly when pressing buy filter 1`] = `
     [
       {
         "account": "0xe64dD0AB5ad7e8C5F2bf6Ce75C34e187af8b920A",
-        "amount": "34.23",
         "createdAt": 1697242033399,
         "cryptoAmount": "0.01231324",
-        "cryptocurrency": "ETH",
-        "currency": "USD",
-        "data": {
-          "cryptoCurrency": {
-            "decimals": 18,
-            "name": "Ethereum",
-            "symbol": "ETH",
-          },
-          "provider": {
-            "name": "Test Provider",
-          },
-        },
+        "cryptoCurrencySymbol": "ETH",
+        "fiatAmount": "34.23",
+        "fiatCurrencyCode": "USD",
         "id": "test-order-1",
         "network": "1",
         "orderType": "BUY",
-        "provider": "AGGREGATOR",
-        "state": "COMPLETED",
+        "providerName": "Test Provider",
+        "source": "legacy",
+        "status": "COMPLETED",
       },
       {
         "account": "0xe64dD0AB5ad7e8C5F2bf6Ce75C34e187af8b920A",
-        "amount": "34.23",
         "createdAt": 1697242033399,
         "cryptoAmount": "0.01231324",
-        "cryptocurrency": "ETH",
-        "currency": "USD",
-        "data": {
-          "cryptoCurrency": {
-            "decimals": 18,
-            "name": "Ethereum",
-            "symbol": "ETH",
-          },
-          "provider": {
-            "name": "Test Provider",
-          },
-        },
+        "cryptoCurrencySymbol": "ETH",
+        "fiatAmount": "34.23",
+        "fiatCurrencyCode": "USD",
         "id": "test-order-3",
         "network": "1",
         "orderType": "BUY",
-        "provider": "AGGREGATOR",
-        "state": "PENDING",
+        "providerName": "Test Provider",
+        "source": "legacy",
+        "status": "PENDING",
       },
       {
         "account": "0xe64dD0AB5ad7e8C5F2bf6Ce75C34e187af8b920A",
-        "cryptocurrency": "ETH",
-        "currency": "USD",
-        "data": {
-          "cryptoCurrency": {
-            "decimals": 18,
-            "name": "Ethereum",
-            "symbol": "ETH",
-          },
-          "provider": {
-            "name": "Test Provider",
-          },
-        },
-        "id": "test-order-4",
+        "createdAt": 1697242033399,
+        "cryptoAmount": "0.5",
+        "cryptoCurrencySymbol": "ETH",
+        "fiatAmount": "1000",
+        "fiatCurrencyCode": "USD",
+        "id": "test-ramps-v2-order-1",
         "network": "1",
         "orderType": "BUY",
-        "provider": "AGGREGATOR",
-        "state": "PENDING",
+        "providerName": "...",
+        "source": "legacy",
+        "status": "COMPLETED",
       },
       {
         "account": "0xe64dD0AB5ad7e8C5F2bf6Ce75C34e187af8b920A",
-        "amount": "100",
         "createdAt": 1697242033399,
         "cryptoAmount": "100",
-        "cryptocurrency": "USDC",
-        "currency": "USD",
-        "data": {
-          "cryptoCurrency": {
-            "assetId": "eip155:1/erc20:0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48",
-            "chainId": "eip155:1",
-            "decimals": 6,
-            "iconUrl": "https://static.cx.metamask.io/api/v2/tokenIcons/assets/eip155/1/erc20/0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48.png",
-            "name": "USD Coin",
-            "symbol": "USDC",
-          },
-          "providerOrderLink": "https://transak.com/order/123",
-        },
+        "cryptoCurrencySymbol": "USDC",
+        "fiatAmount": "100",
+        "fiatCurrencyCode": "USD",
         "id": "test-deposit-order-1",
         "network": "1",
         "orderType": "DEPOSIT",
-        "provider": "DEPOSIT",
-        "state": "COMPLETED",
+        "providerName": "Transak",
+        "source": "legacy",
+        "status": "COMPLETED",
       },
       {
         "account": "0xe64dD0AB5ad7e8C5F2bf6Ce75C34e187af8b920A",
-        "amount": "20",
         "createdAt": 1697242033399,
         "cryptoAmount": "20",
-        "cryptocurrency": "USDT",
-        "currency": "USD",
-        "data": {
-          "cryptoCurrency": {
-            "assetId": "eip155:1/erc20:0xdAC17F958D2ee523a2206206994597C13D831ec7",
-            "chainId": "eip155:1",
-            "decimals": 6,
-            "iconUrl": "https://static.cx.metamask.io/api/v2/tokenIcons/assets/eip155/1/erc20/0xdAC17F958D2ee523a2206206994597C13D831ec7.png",
-            "name": "Tether USD",
-            "symbol": "USDT",
-            "unsupported": true,
-          },
-        },
+        "cryptoCurrencySymbol": "USDT",
+        "fiatAmount": "20",
+        "fiatCurrencyCode": "USD",
         "id": "test-deposit-order-2",
         "network": "1",
         "orderType": "DEPOSIT",
-        "provider": "DEPOSIT",
-        "state": "CREATED",
+        "providerName": "Transak",
+        "source": "legacy",
+        "status": "CREATED",
+      },
+      {
+        "account": "0xe64dD0AB5ad7e8C5F2bf6Ce75C34e187af8b920A",
+        "createdAt": 0,
+        "cryptoAmount": 0,
+        "cryptoCurrencySymbol": "ETH",
+        "fiatAmount": undefined,
+        "fiatCurrencyCode": "USD",
+        "id": "test-order-4",
+        "network": "1",
+        "orderType": "BUY",
+        "providerName": "Test Provider",
+        "source": "legacy",
+        "status": "PENDING",
       },
     ]
   }
@@ -259,7 +229,7 @@ exports[`OrdersList renders buy only correctly when pressing buy filter 1`] = `
                   {
                     "alignItems": "center",
                     "alignSelf": "flex-start",
-                    "backgroundColor": "#3c4d9d0f",
+                    "backgroundColor": "#b4b4b528",
                     "borderRadius": 12,
                     "columnGap": 8,
                     "flexDirection": "row",
@@ -273,7 +243,7 @@ exports[`OrdersList renders buy only correctly when pressing buy filter 1`] = `
                   },
                   [
                     {
-                      "backgroundColor": "#3c4d9d0f",
+                      "backgroundColor": "#b4b4b528",
                     },
                     undefined,
                   ],
@@ -292,7 +262,7 @@ exports[`OrdersList renders buy only correctly when pressing buy filter 1`] = `
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "flexGrow": 0,
                       "flexShrink": 1,
                       "flexWrap": "wrap",
@@ -347,7 +317,7 @@ exports[`OrdersList renders buy only correctly when pressing buy filter 1`] = `
                   {
                     "alignItems": "center",
                     "alignSelf": "flex-start",
-                    "backgroundColor": "#3c4d9d0f",
+                    "backgroundColor": "#b4b4b528",
                     "borderRadius": 12,
                     "columnGap": 8,
                     "flexDirection": "row",
@@ -361,7 +331,7 @@ exports[`OrdersList renders buy only correctly when pressing buy filter 1`] = `
                   },
                   [
                     {
-                      "backgroundColor": "#121314",
+                      "backgroundColor": "#131416",
                     },
                     undefined,
                   ],
@@ -435,7 +405,7 @@ exports[`OrdersList renders buy only correctly when pressing buy filter 1`] = `
                   {
                     "alignItems": "center",
                     "alignSelf": "flex-start",
-                    "backgroundColor": "#3c4d9d0f",
+                    "backgroundColor": "#b4b4b528",
                     "borderRadius": 12,
                     "columnGap": 8,
                     "flexDirection": "row",
@@ -449,7 +419,7 @@ exports[`OrdersList renders buy only correctly when pressing buy filter 1`] = `
                   },
                   [
                     {
-                      "backgroundColor": "#3c4d9d0f",
+                      "backgroundColor": "#b4b4b528",
                     },
                     undefined,
                   ],
@@ -468,7 +438,7 @@ exports[`OrdersList renders buy only correctly when pressing buy filter 1`] = `
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "flexGrow": 0,
                       "flexShrink": 1,
                       "flexWrap": "wrap",
@@ -503,10 +473,11 @@ exports[`OrdersList renders buy only correctly when pressing buy filter 1`] = `
         style={
           {
             "borderBottomWidth": 0.5,
-            "borderColor": "#b7bbc866",
+            "borderColor": "#b4b4b566",
           }
         }
-        underlayColor="#f3f5f9"
+        testID="orders-list-row-buy-1"
+        underlayColor="#f3f3f4"
       >
         <View
           accessibilityRole="none"
@@ -528,7 +499,7 @@ exports[`OrdersList renders buy only correctly when pressing buy filter 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 14,
                   "letterSpacing": 0,
@@ -547,125 +518,6 @@ exports[`OrdersList renders buy only correctly when pressing buy filter 1`] = `
               }
             }
           >
-            <View
-              style={
-                {
-                  "flex": -1,
-                }
-              }
-              testID="listitemcolumn"
-            >
-              <View
-                onLayout={[Function]}
-                style={
-                  {
-                    "alignSelf": "flex-start",
-                    "position": "relative",
-                  }
-                }
-                testID="badge-wrapper-badge"
-              >
-                <View>
-                  <Image
-                    resizeMode="stretch"
-                    source={1}
-                    style={
-                      {
-                        "height": 28,
-                        "width": 28,
-                      }
-                    }
-                  />
-                </View>
-                <View
-                  style={
-                    {
-                      "alignItems": "center",
-                      "aspectRatio": 1,
-                      "height": 0,
-                      "justifyContent": "center",
-                      "position": "absolute",
-                      "right": 0,
-                      "top": 0,
-                      "transform": [
-                        {
-                          "translateX": 0,
-                        },
-                        {
-                          "translateY": -0,
-                        },
-                      ],
-                    }
-                  }
-                >
-                  <View
-                    onLayout={[Function]}
-                    style={
-                      {
-                        "alignItems": "center",
-                        "aspectRatio": 1,
-                        "height": "50%",
-                        "justifyContent": "center",
-                        "maxHeight": 24,
-                        "minHeight": 8,
-                        "opacity": 0,
-                      }
-                    }
-                    testID="badgenetwork"
-                  >
-                    <View
-                      style={
-                        {
-                          "alignItems": "center",
-                          "backgroundColor": "#ffffff",
-                          "borderColor": "#ffffff",
-                          "borderRadius": 8,
-                          "borderWidth": 2,
-                          "height": 32,
-                          "justifyContent": "center",
-                          "overflow": "hidden",
-                          "shadowColor": "#0000001a",
-                          "shadowOffset": {
-                            "height": 2,
-                            "width": 0,
-                          },
-                          "shadowOpacity": 1,
-                          "shadowRadius": 4,
-                          "transform": [
-                            {
-                              "scale": 1,
-                            },
-                          ],
-                          "width": 32,
-                        }
-                      }
-                    >
-                      <Image
-                        onError={[Function]}
-                        resizeMode="contain"
-                        source={1}
-                        style={
-                          {
-                            "height": 32,
-                            "width": 32,
-                          }
-                        }
-                        testID="network-avatar-image"
-                      />
-                    </View>
-                  </View>
-                </View>
-              </View>
-            </View>
-            <View
-              accessible={false}
-              style={
-                {
-                  "width": 16,
-                }
-              }
-              testID="listitem-gap"
-            />
             <View
               style={
                 {
@@ -678,7 +530,7 @@ exports[`OrdersList renders buy only correctly when pressing buy filter 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -725,15 +577,16 @@ exports[`OrdersList renders buy only correctly when pressing buy filter 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
                     "lineHeight": 24,
                   }
                 }
+                testID="orders-list-crypto-amount-buy-1"
               >
-                0.01231
+                0.01231324
                  
                 ETH
               </Text>
@@ -741,13 +594,14 @@ exports[`OrdersList renders buy only correctly when pressing buy filter 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 14,
                     "letterSpacing": 0,
                     "lineHeight": 22,
                   }
                 }
+                testID="orders-list-fiat-amount-buy-1"
               >
                 $34.23 
               </Text>
@@ -769,10 +623,11 @@ exports[`OrdersList renders buy only correctly when pressing buy filter 1`] = `
         style={
           {
             "borderBottomWidth": 0.5,
-            "borderColor": "#b7bbc866",
+            "borderColor": "#b4b4b566",
           }
         }
-        underlayColor="#f3f5f9"
+        testID="orders-list-row-buy-2"
+        underlayColor="#f3f3f4"
       >
         <View
           accessibilityRole="none"
@@ -794,7 +649,7 @@ exports[`OrdersList renders buy only correctly when pressing buy filter 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 14,
                   "letterSpacing": 0,
@@ -813,125 +668,6 @@ exports[`OrdersList renders buy only correctly when pressing buy filter 1`] = `
               }
             }
           >
-            <View
-              style={
-                {
-                  "flex": -1,
-                }
-              }
-              testID="listitemcolumn"
-            >
-              <View
-                onLayout={[Function]}
-                style={
-                  {
-                    "alignSelf": "flex-start",
-                    "position": "relative",
-                  }
-                }
-                testID="badge-wrapper-badge"
-              >
-                <View>
-                  <Image
-                    resizeMode="stretch"
-                    source={1}
-                    style={
-                      {
-                        "height": 28,
-                        "width": 28,
-                      }
-                    }
-                  />
-                </View>
-                <View
-                  style={
-                    {
-                      "alignItems": "center",
-                      "aspectRatio": 1,
-                      "height": 0,
-                      "justifyContent": "center",
-                      "position": "absolute",
-                      "right": 0,
-                      "top": 0,
-                      "transform": [
-                        {
-                          "translateX": 0,
-                        },
-                        {
-                          "translateY": -0,
-                        },
-                      ],
-                    }
-                  }
-                >
-                  <View
-                    onLayout={[Function]}
-                    style={
-                      {
-                        "alignItems": "center",
-                        "aspectRatio": 1,
-                        "height": "50%",
-                        "justifyContent": "center",
-                        "maxHeight": 24,
-                        "minHeight": 8,
-                        "opacity": 0,
-                      }
-                    }
-                    testID="badgenetwork"
-                  >
-                    <View
-                      style={
-                        {
-                          "alignItems": "center",
-                          "backgroundColor": "#ffffff",
-                          "borderColor": "#ffffff",
-                          "borderRadius": 8,
-                          "borderWidth": 2,
-                          "height": 32,
-                          "justifyContent": "center",
-                          "overflow": "hidden",
-                          "shadowColor": "#0000001a",
-                          "shadowOffset": {
-                            "height": 2,
-                            "width": 0,
-                          },
-                          "shadowOpacity": 1,
-                          "shadowRadius": 4,
-                          "transform": [
-                            {
-                              "scale": 1,
-                            },
-                          ],
-                          "width": 32,
-                        }
-                      }
-                    >
-                      <Image
-                        onError={[Function]}
-                        resizeMode="contain"
-                        source={1}
-                        style={
-                          {
-                            "height": 32,
-                            "width": 32,
-                          }
-                        }
-                        testID="network-avatar-image"
-                      />
-                    </View>
-                  </View>
-                </View>
-              </View>
-            </View>
-            <View
-              accessible={false}
-              style={
-                {
-                  "width": 16,
-                }
-              }
-              testID="listitem-gap"
-            />
             <View
               style={
                 {
@@ -944,7 +680,7 @@ exports[`OrdersList renders buy only correctly when pressing buy filter 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -991,15 +727,16 @@ exports[`OrdersList renders buy only correctly when pressing buy filter 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
                     "lineHeight": 24,
                   }
                 }
+                testID="orders-list-crypto-amount-buy-2"
               >
-                0.01231
+                0.01231324
                  
                 ETH
               </Text>
@@ -1007,13 +744,14 @@ exports[`OrdersList renders buy only correctly when pressing buy filter 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 14,
                     "letterSpacing": 0,
                     "lineHeight": 22,
                   }
                 }
+                testID="orders-list-fiat-amount-buy-2"
               >
                 $34.23 
               </Text>
@@ -1035,10 +773,11 @@ exports[`OrdersList renders buy only correctly when pressing buy filter 1`] = `
         style={
           {
             "borderBottomWidth": 0.5,
-            "borderColor": "#b7bbc866",
+            "borderColor": "#b4b4b566",
           }
         }
-        underlayColor="#f3f5f9"
+        testID="orders-list-row-buy-3"
+        underlayColor="#f3f3f4"
       >
         <View
           accessibilityRole="none"
@@ -1060,7 +799,7 @@ exports[`OrdersList renders buy only correctly when pressing buy filter 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 14,
                   "letterSpacing": 0,
@@ -1068,7 +807,7 @@ exports[`OrdersList renders buy only correctly when pressing buy filter 1`] = `
                 }
               }
             >
-              [missing "en.date.months.NaN" translation] NaN at 12:NaN am
+              Oct 13 at 8:07 pm
             </Text>
           </View>
           <View
@@ -1079,125 +818,6 @@ exports[`OrdersList renders buy only correctly when pressing buy filter 1`] = `
               }
             }
           >
-            <View
-              style={
-                {
-                  "flex": -1,
-                }
-              }
-              testID="listitemcolumn"
-            >
-              <View
-                onLayout={[Function]}
-                style={
-                  {
-                    "alignSelf": "flex-start",
-                    "position": "relative",
-                  }
-                }
-                testID="badge-wrapper-badge"
-              >
-                <View>
-                  <Image
-                    resizeMode="stretch"
-                    source={1}
-                    style={
-                      {
-                        "height": 28,
-                        "width": 28,
-                      }
-                    }
-                  />
-                </View>
-                <View
-                  style={
-                    {
-                      "alignItems": "center",
-                      "aspectRatio": 1,
-                      "height": 0,
-                      "justifyContent": "center",
-                      "position": "absolute",
-                      "right": 0,
-                      "top": 0,
-                      "transform": [
-                        {
-                          "translateX": 0,
-                        },
-                        {
-                          "translateY": -0,
-                        },
-                      ],
-                    }
-                  }
-                >
-                  <View
-                    onLayout={[Function]}
-                    style={
-                      {
-                        "alignItems": "center",
-                        "aspectRatio": 1,
-                        "height": "50%",
-                        "justifyContent": "center",
-                        "maxHeight": 24,
-                        "minHeight": 8,
-                        "opacity": 0,
-                      }
-                    }
-                    testID="badgenetwork"
-                  >
-                    <View
-                      style={
-                        {
-                          "alignItems": "center",
-                          "backgroundColor": "#ffffff",
-                          "borderColor": "#ffffff",
-                          "borderRadius": 8,
-                          "borderWidth": 2,
-                          "height": 32,
-                          "justifyContent": "center",
-                          "overflow": "hidden",
-                          "shadowColor": "#0000001a",
-                          "shadowOffset": {
-                            "height": 2,
-                            "width": 0,
-                          },
-                          "shadowOpacity": 1,
-                          "shadowRadius": 4,
-                          "transform": [
-                            {
-                              "scale": 1,
-                            },
-                          ],
-                          "width": 32,
-                        }
-                      }
-                    >
-                      <Image
-                        onError={[Function]}
-                        resizeMode="contain"
-                        source={1}
-                        style={
-                          {
-                            "height": 32,
-                            "width": 32,
-                          }
-                        }
-                        testID="network-avatar-image"
-                      />
-                    </View>
-                  </View>
-                </View>
-              </View>
-            </View>
-            <View
-              accessible={false}
-              style={
-                {
-                  "width": 16,
-                }
-              }
-              testID="listitem-gap"
-            />
             <View
               style={
                 {
@@ -1210,7 +830,7 @@ exports[`OrdersList renders buy only correctly when pressing buy filter 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -1218,13 +838,13 @@ exports[`OrdersList renders buy only correctly when pressing buy filter 1`] = `
                   }
                 }
               >
-                Test Provider: Purchased ETH
+                ...: Purchased ETH
               </Text>
               <Text
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#4459ff",
+                    "color": "#457a39",
                     "fontFamily": "Geist-Bold",
                     "fontSize": 14,
                     "letterSpacing": 0,
@@ -1232,7 +852,7 @@ exports[`OrdersList renders buy only correctly when pressing buy filter 1`] = `
                   }
                 }
               >
-                Pending
+                Completed
               </Text>
             </View>
             <View
@@ -1257,15 +877,16 @@ exports[`OrdersList renders buy only correctly when pressing buy filter 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
                     "lineHeight": 24,
                   }
                 }
+                testID="orders-list-crypto-amount-buy-3"
               >
-                ...
+                0.5
                  
                 ETH
               </Text>
@@ -1273,15 +894,16 @@ exports[`OrdersList renders buy only correctly when pressing buy filter 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 14,
                     "letterSpacing": 0,
                     "lineHeight": 22,
                   }
                 }
+                testID="orders-list-fiat-amount-buy-3"
               >
-                ...
+                $1000 
               </Text>
             </View>
           </View>
@@ -1301,10 +923,11 @@ exports[`OrdersList renders buy only correctly when pressing buy filter 1`] = `
         style={
           {
             "borderBottomWidth": 0.5,
-            "borderColor": "#b7bbc866",
+            "borderColor": "#b4b4b566",
           }
         }
-        underlayColor="#f3f5f9"
+        testID="orders-list-row-deposit-4"
+        underlayColor="#f3f3f4"
       >
         <View
           accessibilityRole="none"
@@ -1326,7 +949,7 @@ exports[`OrdersList renders buy only correctly when pressing buy filter 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 14,
                   "letterSpacing": 0,
@@ -1345,125 +968,6 @@ exports[`OrdersList renders buy only correctly when pressing buy filter 1`] = `
               }
             }
           >
-            <View
-              style={
-                {
-                  "flex": -1,
-                }
-              }
-              testID="listitemcolumn"
-            >
-              <View
-                onLayout={[Function]}
-                style={
-                  {
-                    "alignSelf": "flex-start",
-                    "position": "relative",
-                  }
-                }
-                testID="badge-wrapper-badge"
-              >
-                <View>
-                  <Image
-                    resizeMode="stretch"
-                    source={1}
-                    style={
-                      {
-                        "height": 28,
-                        "width": 28,
-                      }
-                    }
-                  />
-                </View>
-                <View
-                  style={
-                    {
-                      "alignItems": "center",
-                      "aspectRatio": 1,
-                      "height": 0,
-                      "justifyContent": "center",
-                      "position": "absolute",
-                      "right": 0,
-                      "top": 0,
-                      "transform": [
-                        {
-                          "translateX": 0,
-                        },
-                        {
-                          "translateY": -0,
-                        },
-                      ],
-                    }
-                  }
-                >
-                  <View
-                    onLayout={[Function]}
-                    style={
-                      {
-                        "alignItems": "center",
-                        "aspectRatio": 1,
-                        "height": "50%",
-                        "justifyContent": "center",
-                        "maxHeight": 24,
-                        "minHeight": 8,
-                        "opacity": 0,
-                      }
-                    }
-                    testID="badgenetwork"
-                  >
-                    <View
-                      style={
-                        {
-                          "alignItems": "center",
-                          "backgroundColor": "#ffffff",
-                          "borderColor": "#ffffff",
-                          "borderRadius": 8,
-                          "borderWidth": 2,
-                          "height": 32,
-                          "justifyContent": "center",
-                          "overflow": "hidden",
-                          "shadowColor": "#0000001a",
-                          "shadowOffset": {
-                            "height": 2,
-                            "width": 0,
-                          },
-                          "shadowOpacity": 1,
-                          "shadowRadius": 4,
-                          "transform": [
-                            {
-                              "scale": 1,
-                            },
-                          ],
-                          "width": 32,
-                        }
-                      }
-                    >
-                      <Image
-                        onError={[Function]}
-                        resizeMode="contain"
-                        source={1}
-                        style={
-                          {
-                            "height": 32,
-                            "width": 32,
-                          }
-                        }
-                        testID="network-avatar-image"
-                      />
-                    </View>
-                  </View>
-                </View>
-              </View>
-            </View>
-            <View
-              accessible={false}
-              style={
-                {
-                  "width": 16,
-                }
-              }
-              testID="listitem-gap"
-            />
             <View
               style={
                 {
@@ -1476,7 +980,7 @@ exports[`OrdersList renders buy only correctly when pressing buy filter 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -1484,7 +988,7 @@ exports[`OrdersList renders buy only correctly when pressing buy filter 1`] = `
                   }
                 }
               >
-                USDC Deposit
+                Transak: Purchased USDC
               </Text>
               <Text
                 accessibilityRole="text"
@@ -1523,13 +1027,14 @@ exports[`OrdersList renders buy only correctly when pressing buy filter 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
                     "lineHeight": 24,
                   }
                 }
+                testID="orders-list-crypto-amount-deposit-4"
               >
                 100
                  
@@ -1539,13 +1044,14 @@ exports[`OrdersList renders buy only correctly when pressing buy filter 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 14,
                     "letterSpacing": 0,
                     "lineHeight": 22,
                   }
                 }
+                testID="orders-list-fiat-amount-deposit-4"
               >
                 $100 
               </Text>
@@ -1567,10 +1073,11 @@ exports[`OrdersList renders buy only correctly when pressing buy filter 1`] = `
         style={
           {
             "borderBottomWidth": 0.5,
-            "borderColor": "#b7bbc866",
+            "borderColor": "#b4b4b566",
           }
         }
-        underlayColor="#f3f5f9"
+        testID="orders-list-row-deposit-5"
+        underlayColor="#f3f3f4"
       >
         <View
           accessibilityRole="none"
@@ -1592,7 +1099,7 @@ exports[`OrdersList renders buy only correctly when pressing buy filter 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 14,
                   "letterSpacing": 0,
@@ -1611,125 +1118,6 @@ exports[`OrdersList renders buy only correctly when pressing buy filter 1`] = `
               }
             }
           >
-            <View
-              style={
-                {
-                  "flex": -1,
-                }
-              }
-              testID="listitemcolumn"
-            >
-              <View
-                onLayout={[Function]}
-                style={
-                  {
-                    "alignSelf": "flex-start",
-                    "position": "relative",
-                  }
-                }
-                testID="badge-wrapper-badge"
-              >
-                <View>
-                  <Image
-                    resizeMode="stretch"
-                    source={1}
-                    style={
-                      {
-                        "height": 28,
-                        "width": 28,
-                      }
-                    }
-                  />
-                </View>
-                <View
-                  style={
-                    {
-                      "alignItems": "center",
-                      "aspectRatio": 1,
-                      "height": 0,
-                      "justifyContent": "center",
-                      "position": "absolute",
-                      "right": 0,
-                      "top": 0,
-                      "transform": [
-                        {
-                          "translateX": 0,
-                        },
-                        {
-                          "translateY": -0,
-                        },
-                      ],
-                    }
-                  }
-                >
-                  <View
-                    onLayout={[Function]}
-                    style={
-                      {
-                        "alignItems": "center",
-                        "aspectRatio": 1,
-                        "height": "50%",
-                        "justifyContent": "center",
-                        "maxHeight": 24,
-                        "minHeight": 8,
-                        "opacity": 0,
-                      }
-                    }
-                    testID="badgenetwork"
-                  >
-                    <View
-                      style={
-                        {
-                          "alignItems": "center",
-                          "backgroundColor": "#ffffff",
-                          "borderColor": "#ffffff",
-                          "borderRadius": 8,
-                          "borderWidth": 2,
-                          "height": 32,
-                          "justifyContent": "center",
-                          "overflow": "hidden",
-                          "shadowColor": "#0000001a",
-                          "shadowOffset": {
-                            "height": 2,
-                            "width": 0,
-                          },
-                          "shadowOpacity": 1,
-                          "shadowRadius": 4,
-                          "transform": [
-                            {
-                              "scale": 1,
-                            },
-                          ],
-                          "width": 32,
-                        }
-                      }
-                    >
-                      <Image
-                        onError={[Function]}
-                        resizeMode="contain"
-                        source={1}
-                        style={
-                          {
-                            "height": 32,
-                            "width": 32,
-                          }
-                        }
-                        testID="network-avatar-image"
-                      />
-                    </View>
-                  </View>
-                </View>
-              </View>
-            </View>
-            <View
-              accessible={false}
-              style={
-                {
-                  "width": 16,
-                }
-              }
-              testID="listitem-gap"
-            />
             <View
               style={
                 {
@@ -1742,7 +1130,7 @@ exports[`OrdersList renders buy only correctly when pressing buy filter 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -1750,13 +1138,13 @@ exports[`OrdersList renders buy only correctly when pressing buy filter 1`] = `
                   }
                 }
               >
-                USDT Deposit
+                Transak: Purchased USDT
               </Text>
               <Text
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Bold",
                     "fontSize": 14,
                     "letterSpacing": 0,
@@ -1789,13 +1177,14 @@ exports[`OrdersList renders buy only correctly when pressing buy filter 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
                     "lineHeight": 24,
                   }
                 }
+                testID="orders-list-crypto-amount-deposit-5"
               >
                 20
                  
@@ -1805,13 +1194,14 @@ exports[`OrdersList renders buy only correctly when pressing buy filter 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 14,
                     "letterSpacing": 0,
                     "lineHeight": 22,
                   }
                 }
+                testID="orders-list-fiat-amount-deposit-5"
               >
                 $20 
               </Text>
@@ -1820,200 +1210,311 @@ exports[`OrdersList renders buy only correctly when pressing buy filter 1`] = `
         </View>
       </TouchableHighlight>
     </View>
-  </View>
-</RCTScrollView>
-`;
-
-exports[`OrdersList renders correctly 1`] = `
-<RCTScrollView
-  ListEmptyComponent={
-    <Box
-      twClassName="w-full items-center py-10"
-    >
-      <TabEmptyState
-        description="No bank or card transfers yet."
-      />
-    </Box>
-  }
-  ListHeaderComponent={
-    <Box
-      twClassName="px-4 py-2 bg-default"
+    <View
+      onFocusCapture={[Function]}
+      onLayout={[Function]}
+      style={null}
     >
-      <ForwardRef
-        contentContainerStyle={
+      <TouchableHighlight
+        accessibilityRole="button"
+        accessible={true}
+        activeOpacity={1}
+        onPress={[Function]}
+        style={
           {
-            "flexDirection": "row",
-            "gap": 12,
+            "borderBottomWidth": 0.5,
+            "borderColor": "#b4b4b566",
           }
         }
-        horizontal={true}
-        showsHorizontalScrollIndicator={false}
+        testID="orders-list-row-buy-6"
+        underlayColor="#f3f3f4"
       >
-        <ButtonFilter
-          accessibilityLabel="All"
-          isActive={true}
-          onPress={[Function]}
-          size="md"
-        >
-          All
-        </ButtonFilter>
-        <ButtonFilter
-          accessibilityLabel="Purchased"
-          isActive={false}
-          onPress={[Function]}
-          size="md"
-        >
-          Purchased
-        </ButtonFilter>
-        <ButtonFilter
-          accessibilityLabel="Sold"
-          isActive={false}
-          onPress={[Function]}
-          size="md"
+        <View
+          accessibilityRole="none"
+          accessible={true}
+          style={
+            {
+              "padding": 16,
+            }
+          }
         >
-          Sold
-        </ButtonFilter>
-      </ForwardRef>
-    </Box>
-  }
-  data={
-    [
-      {
-        "account": "0xe64dD0AB5ad7e8C5F2bf6Ce75C34e187af8b920A",
-        "amount": "34.23",
-        "createdAt": 1697242033399,
-        "cryptoAmount": "0.01231324",
-        "cryptocurrency": "ETH",
-        "currency": "USD",
-        "data": {
-          "cryptoCurrency": {
-            "decimals": 18,
-            "name": "Ethereum",
-            "symbol": "ETH",
-          },
-          "provider": {
-            "name": "Test Provider",
-          },
-        },
-        "id": "test-order-1",
-        "network": "1",
-        "orderType": "BUY",
-        "provider": "AGGREGATOR",
-        "state": "COMPLETED",
-      },
-      {
-        "account": "0xe64dD0AB5ad7e8C5F2bf6Ce75C34e187af8b920A",
-        "amount": "34.23",
-        "createdAt": 1697242033399,
-        "cryptoAmount": "0.01231324",
-        "cryptocurrency": "ETH",
-        "currency": "USD",
-        "data": {
-          "cryptoCurrency": {
-            "decimals": 18,
-            "name": "Ethereum",
-            "symbol": "ETH",
-          },
-          "provider": {
-            "name": "Test Provider",
-          },
-        },
-        "id": "test-order-2",
-        "network": "1",
-        "orderType": "SELL",
-        "provider": "AGGREGATOR",
-        "state": "PENDING",
-      },
-      {
+          <View
+            style={
+              {
+                "marginBottom": 10,
+              }
+            }
+          >
+            <Text
+              accessibilityRole="text"
+              style={
+                {
+                  "color": "#131416",
+                  "fontFamily": "Geist-Regular",
+                  "fontSize": 14,
+                  "letterSpacing": 0,
+                  "lineHeight": 22,
+                }
+              }
+            >
+              Dec 31 at 7:00 pm
+            </Text>
+          </View>
+          <View
+            style={
+              {
+                "alignItems": "center",
+                "flexDirection": "row",
+              }
+            }
+          >
+            <View
+              style={
+                {
+                  "flex": 1,
+                }
+              }
+              testID="listitemcolumn"
+            >
+              <Text
+                accessibilityRole="text"
+                style={
+                  {
+                    "color": "#131416",
+                    "fontFamily": "Geist-Regular",
+                    "fontSize": 16,
+                    "letterSpacing": 0,
+                    "lineHeight": 24,
+                  }
+                }
+              >
+                Test Provider: Purchased ETH
+              </Text>
+              <Text
+                accessibilityRole="text"
+                style={
+                  {
+                    "color": "#4459ff",
+                    "fontFamily": "Geist-Bold",
+                    "fontSize": 14,
+                    "letterSpacing": 0,
+                    "lineHeight": 22,
+                  }
+                }
+              >
+                Pending
+              </Text>
+            </View>
+            <View
+              accessible={false}
+              style={
+                {
+                  "width": 16,
+                }
+              }
+              testID="listitem-gap"
+            />
+            <View
+              style={
+                {
+                  "alignItems": "flex-end",
+                  "flex": -1,
+                }
+              }
+              testID="listitemcolumn"
+            >
+              <Text
+                accessibilityRole="text"
+                style={
+                  {
+                    "color": "#131416",
+                    "fontFamily": "Geist-Regular",
+                    "fontSize": 16,
+                    "letterSpacing": 0,
+                    "lineHeight": 24,
+                  }
+                }
+                testID="orders-list-crypto-amount-buy-6"
+              >
+                0
+                 
+                ETH
+              </Text>
+              <Text
+                accessibilityRole="text"
+                style={
+                  {
+                    "color": "#66676a",
+                    "fontFamily": "Geist-Regular",
+                    "fontSize": 14,
+                    "letterSpacing": 0,
+                    "lineHeight": 22,
+                  }
+                }
+                testID="orders-list-fiat-amount-buy-6"
+              >
+                ...
+              </Text>
+            </View>
+          </View>
+        </View>
+      </TouchableHighlight>
+    </View>
+  </View>
+</RCTScrollView>
+`;
+
+exports[`OrdersList renders correctly 1`] = `
+<RCTScrollView
+  ListEmptyComponent={
+    <Box
+      twClassName="w-full items-center py-10"
+    >
+      <TabEmptyState
+        description="No bank or card transfers yet."
+      />
+    </Box>
+  }
+  ListHeaderComponent={
+    <Box
+      twClassName="px-4 py-2 bg-default"
+    >
+      <ForwardRef
+        contentContainerStyle={
+          {
+            "flexDirection": "row",
+            "gap": 12,
+          }
+        }
+        horizontal={true}
+        showsHorizontalScrollIndicator={false}
+      >
+        <ButtonFilter
+          accessibilityLabel="All"
+          isActive={true}
+          onPress={[Function]}
+          size="md"
+        >
+          All
+        </ButtonFilter>
+        <ButtonFilter
+          accessibilityLabel="Purchased"
+          isActive={false}
+          onPress={[Function]}
+          size="md"
+        >
+          Purchased
+        </ButtonFilter>
+        <ButtonFilter
+          accessibilityLabel="Sold"
+          isActive={false}
+          onPress={[Function]}
+          size="md"
+        >
+          Sold
+        </ButtonFilter>
+      </ForwardRef>
+    </Box>
+  }
+  data={
+    [
+      {
         "account": "0xe64dD0AB5ad7e8C5F2bf6Ce75C34e187af8b920A",
-        "amount": "34.23",
         "createdAt": 1697242033399,
         "cryptoAmount": "0.01231324",
-        "cryptocurrency": "ETH",
-        "currency": "USD",
-        "data": {
-          "cryptoCurrency": {
-            "decimals": 18,
-            "name": "Ethereum",
-            "symbol": "ETH",
-          },
-          "provider": {
-            "name": "Test Provider",
-          },
-        },
+        "cryptoCurrencySymbol": "ETH",
+        "fiatAmount": "34.23",
+        "fiatCurrencyCode": "USD",
+        "id": "test-order-1",
+        "network": "1",
+        "orderType": "BUY",
+        "providerName": "Test Provider",
+        "source": "legacy",
+        "status": "COMPLETED",
+      },
+      {
+        "account": "0xe64dD0AB5ad7e8C5F2bf6Ce75C34e187af8b920A",
+        "createdAt": 1697242033399,
+        "cryptoAmount": "0.01231324",
+        "cryptoCurrencySymbol": "ETH",
+        "fiatAmount": "34.23",
+        "fiatCurrencyCode": "USD",
+        "id": "test-order-2",
+        "network": "1",
+        "orderType": "SELL",
+        "providerName": "Test Provider",
+        "source": "legacy",
+        "status": "PENDING",
+      },
+      {
+        "account": "0xe64dD0AB5ad7e8C5F2bf6Ce75C34e187af8b920A",
+        "createdAt": 1697242033399,
+        "cryptoAmount": "0.01231324",
+        "cryptoCurrencySymbol": "ETH",
+        "fiatAmount": "34.23",
+        "fiatCurrencyCode": "USD",
         "id": "test-order-3",
         "network": "1",
         "orderType": "BUY",
-        "provider": "AGGREGATOR",
-        "state": "PENDING",
+        "providerName": "Test Provider",
+        "source": "legacy",
+        "status": "PENDING",
       },
       {
         "account": "0xe64dD0AB5ad7e8C5F2bf6Ce75C34e187af8b920A",
-        "cryptocurrency": "ETH",
-        "currency": "USD",
-        "data": {
-          "cryptoCurrency": {
-            "decimals": 18,
-            "name": "Ethereum",
-            "symbol": "ETH",
-          },
-          "provider": {
-            "name": "Test Provider",
-          },
-        },
-        "id": "test-order-4",
+        "createdAt": 1697242033399,
+        "cryptoAmount": "0.5",
+        "cryptoCurrencySymbol": "ETH",
+        "fiatAmount": "1000",
+        "fiatCurrencyCode": "USD",
+        "id": "test-ramps-v2-order-1",
         "network": "1",
         "orderType": "BUY",
-        "provider": "AGGREGATOR",
-        "state": "PENDING",
+        "providerName": "...",
+        "source": "legacy",
+        "status": "COMPLETED",
       },
       {
         "account": "0xe64dD0AB5ad7e8C5F2bf6Ce75C34e187af8b920A",
-        "amount": "100",
         "createdAt": 1697242033399,
         "cryptoAmount": "100",
-        "cryptocurrency": "USDC",
-        "currency": "USD",
-        "data": {
-          "cryptoCurrency": {
-            "assetId": "eip155:1/erc20:0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48",
-            "chainId": "eip155:1",
-            "decimals": 6,
-            "iconUrl": "https://static.cx.metamask.io/api/v2/tokenIcons/assets/eip155/1/erc20/0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48.png",
-            "name": "USD Coin",
-            "symbol": "USDC",
-          },
-          "providerOrderLink": "https://transak.com/order/123",
-        },
+        "cryptoCurrencySymbol": "USDC",
+        "fiatAmount": "100",
+        "fiatCurrencyCode": "USD",
         "id": "test-deposit-order-1",
         "network": "1",
         "orderType": "DEPOSIT",
-        "provider": "DEPOSIT",
-        "state": "COMPLETED",
+        "providerName": "Transak",
+        "source": "legacy",
+        "status": "COMPLETED",
       },
       {
         "account": "0xe64dD0AB5ad7e8C5F2bf6Ce75C34e187af8b920A",
-        "amount": "20",
         "createdAt": 1697242033399,
         "cryptoAmount": "20",
-        "cryptocurrency": "USDT",
-        "currency": "USD",
-        "data": {
-          "cryptoCurrency": {
-            "assetId": "eip155:1/erc20:0xdAC17F958D2ee523a2206206994597C13D831ec7",
-            "chainId": "eip155:1",
-            "decimals": 6,
-            "iconUrl": "https://static.cx.metamask.io/api/v2/tokenIcons/assets/eip155/1/erc20/0xdAC17F958D2ee523a2206206994597C13D831ec7.png",
-            "name": "Tether USD",
-            "symbol": "USDT",
-            "unsupported": true,
-          },
-        },
+        "cryptoCurrencySymbol": "USDT",
+        "fiatAmount": "20",
+        "fiatCurrencyCode": "USD",
         "id": "test-deposit-order-2",
         "network": "1",
         "orderType": "DEPOSIT",
-        "provider": "DEPOSIT",
-        "state": "CREATED",
+        "providerName": "Transak",
+        "source": "legacy",
+        "status": "CREATED",
+      },
+      {
+        "account": "0xe64dD0AB5ad7e8C5F2bf6Ce75C34e187af8b920A",
+        "createdAt": 0,
+        "cryptoAmount": 0,
+        "cryptoCurrencySymbol": "ETH",
+        "fiatAmount": undefined,
+        "fiatCurrencyCode": "USD",
+        "id": "test-order-4",
+        "network": "1",
+        "orderType": "BUY",
+        "providerName": "Test Provider",
+        "source": "legacy",
+        "status": "PENDING",
       },
     ]
   }
@@ -2106,7 +1607,7 @@ exports[`OrdersList renders correctly 1`] = `
                   {
                     "alignItems": "center",
                     "alignSelf": "flex-start",
-                    "backgroundColor": "#3c4d9d0f",
+                    "backgroundColor": "#b4b4b528",
                     "borderRadius": 12,
                     "columnGap": 8,
                     "flexDirection": "row",
@@ -2120,7 +1621,7 @@ exports[`OrdersList renders correctly 1`] = `
                   },
                   [
                     {
-                      "backgroundColor": "#121314",
+                      "backgroundColor": "#131416",
                     },
                     undefined,
                   ],
@@ -2194,7 +1695,7 @@ exports[`OrdersList renders correctly 1`] = `
                   {
                     "alignItems": "center",
                     "alignSelf": "flex-start",
-                    "backgroundColor": "#3c4d9d0f",
+                    "backgroundColor": "#b4b4b528",
                     "borderRadius": 12,
                     "columnGap": 8,
                     "flexDirection": "row",
@@ -2208,7 +1709,7 @@ exports[`OrdersList renders correctly 1`] = `
                   },
                   [
                     {
-                      "backgroundColor": "#3c4d9d0f",
+                      "backgroundColor": "#b4b4b528",
                     },
                     undefined,
                   ],
@@ -2227,7 +1728,7 @@ exports[`OrdersList renders correctly 1`] = `
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "flexGrow": 0,
                       "flexShrink": 1,
                       "flexWrap": "wrap",
@@ -2282,7 +1783,7 @@ exports[`OrdersList renders correctly 1`] = `
                   {
                     "alignItems": "center",
                     "alignSelf": "flex-start",
-                    "backgroundColor": "#3c4d9d0f",
+                    "backgroundColor": "#b4b4b528",
                     "borderRadius": 12,
                     "columnGap": 8,
                     "flexDirection": "row",
@@ -2296,7 +1797,7 @@ exports[`OrdersList renders correctly 1`] = `
                   },
                   [
                     {
-                      "backgroundColor": "#3c4d9d0f",
+                      "backgroundColor": "#b4b4b528",
                     },
                     undefined,
                   ],
@@ -2315,7 +1816,7 @@ exports[`OrdersList renders correctly 1`] = `
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "flexGrow": 0,
                       "flexShrink": 1,
                       "flexWrap": "wrap",
@@ -2350,10 +1851,11 @@ exports[`OrdersList renders correctly 1`] = `
         style={
           {
             "borderBottomWidth": 0.5,
-            "borderColor": "#b7bbc866",
+            "borderColor": "#b4b4b566",
           }
         }
-        underlayColor="#f3f5f9"
+        testID="orders-list-row-buy-1"
+        underlayColor="#f3f3f4"
       >
         <View
           accessibilityRole="none"
@@ -2375,7 +1877,7 @@ exports[`OrdersList renders correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 14,
                   "letterSpacing": 0,
@@ -2394,125 +1896,6 @@ exports[`OrdersList renders correctly 1`] = `
               }
             }
           >
-            <View
-              style={
-                {
-                  "flex": -1,
-                }
-              }
-              testID="listitemcolumn"
-            >
-              <View
-                onLayout={[Function]}
-                style={
-                  {
-                    "alignSelf": "flex-start",
-                    "position": "relative",
-                  }
-                }
-                testID="badge-wrapper-badge"
-              >
-                <View>
-                  <Image
-                    resizeMode="stretch"
-                    source={1}
-                    style={
-                      {
-                        "height": 28,
-                        "width": 28,
-                      }
-                    }
-                  />
-                </View>
-                <View
-                  style={
-                    {
-                      "alignItems": "center",
-                      "aspectRatio": 1,
-                      "height": 0,
-                      "justifyContent": "center",
-                      "position": "absolute",
-                      "right": 0,
-                      "top": 0,
-                      "transform": [
-                        {
-                          "translateX": 0,
-                        },
-                        {
-                          "translateY": -0,
-                        },
-                      ],
-                    }
-                  }
-                >
-                  <View
-                    onLayout={[Function]}
-                    style={
-                      {
-                        "alignItems": "center",
-                        "aspectRatio": 1,
-                        "height": "50%",
-                        "justifyContent": "center",
-                        "maxHeight": 24,
-                        "minHeight": 8,
-                        "opacity": 0,
-                      }
-                    }
-                    testID="badgenetwork"
-                  >
-                    <View
-                      style={
-                        {
-                          "alignItems": "center",
-                          "backgroundColor": "#ffffff",
-                          "borderColor": "#ffffff",
-                          "borderRadius": 8,
-                          "borderWidth": 2,
-                          "height": 32,
-                          "justifyContent": "center",
-                          "overflow": "hidden",
-                          "shadowColor": "#0000001a",
-                          "shadowOffset": {
-                            "height": 2,
-                            "width": 0,
-                          },
-                          "shadowOpacity": 1,
-                          "shadowRadius": 4,
-                          "transform": [
-                            {
-                              "scale": 1,
-                            },
-                          ],
-                          "width": 32,
-                        }
-                      }
-                    >
-                      <Image
-                        onError={[Function]}
-                        resizeMode="contain"
-                        source={1}
-                        style={
-                          {
-                            "height": 32,
-                            "width": 32,
-                          }
-                        }
-                        testID="network-avatar-image"
-                      />
-                    </View>
-                  </View>
-                </View>
-              </View>
-            </View>
-            <View
-              accessible={false}
-              style={
-                {
-                  "width": 16,
-                }
-              }
-              testID="listitem-gap"
-            />
             <View
               style={
                 {
@@ -2525,7 +1908,7 @@ exports[`OrdersList renders correctly 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -2572,15 +1955,16 @@ exports[`OrdersList renders correctly 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
                     "lineHeight": 24,
                   }
                 }
+                testID="orders-list-crypto-amount-buy-1"
               >
-                0.01231
+                0.01231324
                  
                 ETH
               </Text>
@@ -2588,13 +1972,14 @@ exports[`OrdersList renders correctly 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 14,
                     "letterSpacing": 0,
                     "lineHeight": 22,
                   }
                 }
+                testID="orders-list-fiat-amount-buy-1"
               >
                 $34.23 
               </Text>
@@ -2616,10 +2001,11 @@ exports[`OrdersList renders correctly 1`] = `
         style={
           {
             "borderBottomWidth": 0.5,
-            "borderColor": "#b7bbc866",
+            "borderColor": "#b4b4b566",
           }
         }
-        underlayColor="#f3f5f9"
+        testID="orders-list-row-sell-2"
+        underlayColor="#f3f3f4"
       >
         <View
           accessibilityRole="none"
@@ -2641,7 +2027,7 @@ exports[`OrdersList renders correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 14,
                   "letterSpacing": 0,
@@ -2660,125 +2046,6 @@ exports[`OrdersList renders correctly 1`] = `
               }
             }
           >
-            <View
-              style={
-                {
-                  "flex": -1,
-                }
-              }
-              testID="listitemcolumn"
-            >
-              <View
-                onLayout={[Function]}
-                style={
-                  {
-                    "alignSelf": "flex-start",
-                    "position": "relative",
-                  }
-                }
-                testID="badge-wrapper-badge"
-              >
-                <View>
-                  <Image
-                    resizeMode="stretch"
-                    source={1}
-                    style={
-                      {
-                        "height": 28,
-                        "width": 28,
-                      }
-                    }
-                  />
-                </View>
-                <View
-                  style={
-                    {
-                      "alignItems": "center",
-                      "aspectRatio": 1,
-                      "height": 0,
-                      "justifyContent": "center",
-                      "position": "absolute",
-                      "right": 0,
-                      "top": 0,
-                      "transform": [
-                        {
-                          "translateX": 0,
-                        },
-                        {
-                          "translateY": -0,
-                        },
-                      ],
-                    }
-                  }
-                >
-                  <View
-                    onLayout={[Function]}
-                    style={
-                      {
-                        "alignItems": "center",
-                        "aspectRatio": 1,
-                        "height": "50%",
-                        "justifyContent": "center",
-                        "maxHeight": 24,
-                        "minHeight": 8,
-                        "opacity": 0,
-                      }
-                    }
-                    testID="badgenetwork"
-                  >
-                    <View
-                      style={
-                        {
-                          "alignItems": "center",
-                          "backgroundColor": "#ffffff",
-                          "borderColor": "#ffffff",
-                          "borderRadius": 8,
-                          "borderWidth": 2,
-                          "height": 32,
-                          "justifyContent": "center",
-                          "overflow": "hidden",
-                          "shadowColor": "#0000001a",
-                          "shadowOffset": {
-                            "height": 2,
-                            "width": 0,
-                          },
-                          "shadowOpacity": 1,
-                          "shadowRadius": 4,
-                          "transform": [
-                            {
-                              "scale": 1,
-                            },
-                          ],
-                          "width": 32,
-                        }
-                      }
-                    >
-                      <Image
-                        onError={[Function]}
-                        resizeMode="contain"
-                        source={1}
-                        style={
-                          {
-                            "height": 32,
-                            "width": 32,
-                          }
-                        }
-                        testID="network-avatar-image"
-                      />
-                    </View>
-                  </View>
-                </View>
-              </View>
-            </View>
-            <View
-              accessible={false}
-              style={
-                {
-                  "width": 16,
-                }
-              }
-              testID="listitem-gap"
-            />
             <View
               style={
                 {
@@ -2791,7 +2058,7 @@ exports[`OrdersList renders correctly 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -2838,15 +2105,16 @@ exports[`OrdersList renders correctly 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
                     "lineHeight": 24,
                   }
                 }
+                testID="orders-list-crypto-amount-sell-2"
               >
-                0.01231
+                0.01231324
                  
                 ETH
               </Text>
@@ -2854,13 +2122,14 @@ exports[`OrdersList renders correctly 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 14,
                     "letterSpacing": 0,
                     "lineHeight": 22,
                   }
                 }
+                testID="orders-list-fiat-amount-sell-2"
               >
                 $34.23 
               </Text>
@@ -2882,10 +2151,11 @@ exports[`OrdersList renders correctly 1`] = `
         style={
           {
             "borderBottomWidth": 0.5,
-            "borderColor": "#b7bbc866",
+            "borderColor": "#b4b4b566",
           }
         }
-        underlayColor="#f3f5f9"
+        testID="orders-list-row-buy-3"
+        underlayColor="#f3f3f4"
       >
         <View
           accessibilityRole="none"
@@ -2907,7 +2177,7 @@ exports[`OrdersList renders correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 14,
                   "letterSpacing": 0,
@@ -2926,125 +2196,6 @@ exports[`OrdersList renders correctly 1`] = `
               }
             }
           >
-            <View
-              style={
-                {
-                  "flex": -1,
-                }
-              }
-              testID="listitemcolumn"
-            >
-              <View
-                onLayout={[Function]}
-                style={
-                  {
-                    "alignSelf": "flex-start",
-                    "position": "relative",
-                  }
-                }
-                testID="badge-wrapper-badge"
-              >
-                <View>
-                  <Image
-                    resizeMode="stretch"
-                    source={1}
-                    style={
-                      {
-                        "height": 28,
-                        "width": 28,
-                      }
-                    }
-                  />
-                </View>
-                <View
-                  style={
-                    {
-                      "alignItems": "center",
-                      "aspectRatio": 1,
-                      "height": 0,
-                      "justifyContent": "center",
-                      "position": "absolute",
-                      "right": 0,
-                      "top": 0,
-                      "transform": [
-                        {
-                          "translateX": 0,
-                        },
-                        {
-                          "translateY": -0,
-                        },
-                      ],
-                    }
-                  }
-                >
-                  <View
-                    onLayout={[Function]}
-                    style={
-                      {
-                        "alignItems": "center",
-                        "aspectRatio": 1,
-                        "height": "50%",
-                        "justifyContent": "center",
-                        "maxHeight": 24,
-                        "minHeight": 8,
-                        "opacity": 0,
-                      }
-                    }
-                    testID="badgenetwork"
-                  >
-                    <View
-                      style={
-                        {
-                          "alignItems": "center",
-                          "backgroundColor": "#ffffff",
-                          "borderColor": "#ffffff",
-                          "borderRadius": 8,
-                          "borderWidth": 2,
-                          "height": 32,
-                          "justifyContent": "center",
-                          "overflow": "hidden",
-                          "shadowColor": "#0000001a",
-                          "shadowOffset": {
-                            "height": 2,
-                            "width": 0,
-                          },
-                          "shadowOpacity": 1,
-                          "shadowRadius": 4,
-                          "transform": [
-                            {
-                              "scale": 1,
-                            },
-                          ],
-                          "width": 32,
-                        }
-                      }
-                    >
-                      <Image
-                        onError={[Function]}
-                        resizeMode="contain"
-                        source={1}
-                        style={
-                          {
-                            "height": 32,
-                            "width": 32,
-                          }
-                        }
-                        testID="network-avatar-image"
-                      />
-                    </View>
-                  </View>
-                </View>
-              </View>
-            </View>
-            <View
-              accessible={false}
-              style={
-                {
-                  "width": 16,
-                }
-              }
-              testID="listitem-gap"
-            />
             <View
               style={
                 {
@@ -3057,7 +2208,7 @@ exports[`OrdersList renders correctly 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -3104,15 +2255,16 @@ exports[`OrdersList renders correctly 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
                     "lineHeight": 24,
                   }
                 }
+                testID="orders-list-crypto-amount-buy-3"
               >
-                0.01231
+                0.01231324
                  
                 ETH
               </Text>
@@ -3120,13 +2272,14 @@ exports[`OrdersList renders correctly 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 14,
                     "letterSpacing": 0,
                     "lineHeight": 22,
                   }
                 }
+                testID="orders-list-fiat-amount-buy-3"
               >
                 $34.23 
               </Text>
@@ -3148,10 +2301,11 @@ exports[`OrdersList renders correctly 1`] = `
         style={
           {
             "borderBottomWidth": 0.5,
-            "borderColor": "#b7bbc866",
+            "borderColor": "#b4b4b566",
           }
         }
-        underlayColor="#f3f5f9"
+        testID="orders-list-row-buy-4"
+        underlayColor="#f3f3f4"
       >
         <View
           accessibilityRole="none"
@@ -3173,7 +2327,7 @@ exports[`OrdersList renders correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 14,
                   "letterSpacing": 0,
@@ -3181,7 +2335,7 @@ exports[`OrdersList renders correctly 1`] = `
                 }
               }
             >
-              [missing "en.date.months.NaN" translation] NaN at 12:NaN am
+              Oct 13 at 8:07 pm
             </Text>
           </View>
           <View
@@ -3192,125 +2346,6 @@ exports[`OrdersList renders correctly 1`] = `
               }
             }
           >
-            <View
-              style={
-                {
-                  "flex": -1,
-                }
-              }
-              testID="listitemcolumn"
-            >
-              <View
-                onLayout={[Function]}
-                style={
-                  {
-                    "alignSelf": "flex-start",
-                    "position": "relative",
-                  }
-                }
-                testID="badge-wrapper-badge"
-              >
-                <View>
-                  <Image
-                    resizeMode="stretch"
-                    source={1}
-                    style={
-                      {
-                        "height": 28,
-                        "width": 28,
-                      }
-                    }
-                  />
-                </View>
-                <View
-                  style={
-                    {
-                      "alignItems": "center",
-                      "aspectRatio": 1,
-                      "height": 0,
-                      "justifyContent": "center",
-                      "position": "absolute",
-                      "right": 0,
-                      "top": 0,
-                      "transform": [
-                        {
-                          "translateX": 0,
-                        },
-                        {
-                          "translateY": -0,
-                        },
-                      ],
-                    }
-                  }
-                >
-                  <View
-                    onLayout={[Function]}
-                    style={
-                      {
-                        "alignItems": "center",
-                        "aspectRatio": 1,
-                        "height": "50%",
-                        "justifyContent": "center",
-                        "maxHeight": 24,
-                        "minHeight": 8,
-                        "opacity": 0,
-                      }
-                    }
-                    testID="badgenetwork"
-                  >
-                    <View
-                      style={
-                        {
-                          "alignItems": "center",
-                          "backgroundColor": "#ffffff",
-                          "borderColor": "#ffffff",
-                          "borderRadius": 8,
-                          "borderWidth": 2,
-                          "height": 32,
-                          "justifyContent": "center",
-                          "overflow": "hidden",
-                          "shadowColor": "#0000001a",
-                          "shadowOffset": {
-                            "height": 2,
-                            "width": 0,
-                          },
-                          "shadowOpacity": 1,
-                          "shadowRadius": 4,
-                          "transform": [
-                            {
-                              "scale": 1,
-                            },
-                          ],
-                          "width": 32,
-                        }
-                      }
-                    >
-                      <Image
-                        onError={[Function]}
-                        resizeMode="contain"
-                        source={1}
-                        style={
-                          {
-                            "height": 32,
-                            "width": 32,
-                          }
-                        }
-                        testID="network-avatar-image"
-                      />
-                    </View>
-                  </View>
-                </View>
-              </View>
-            </View>
-            <View
-              accessible={false}
-              style={
-                {
-                  "width": 16,
-                }
-              }
-              testID="listitem-gap"
-            />
             <View
               style={
                 {
@@ -3323,7 +2358,7 @@ exports[`OrdersList renders correctly 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -3331,13 +2366,13 @@ exports[`OrdersList renders correctly 1`] = `
                   }
                 }
               >
-                Test Provider: Purchased ETH
+                ...: Purchased ETH
               </Text>
               <Text
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#4459ff",
+                    "color": "#457a39",
                     "fontFamily": "Geist-Bold",
                     "fontSize": 14,
                     "letterSpacing": 0,
@@ -3345,7 +2380,7 @@ exports[`OrdersList renders correctly 1`] = `
                   }
                 }
               >
-                Pending
+                Completed
               </Text>
             </View>
             <View
@@ -3370,15 +2405,16 @@ exports[`OrdersList renders correctly 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
                     "lineHeight": 24,
                   }
                 }
+                testID="orders-list-crypto-amount-buy-4"
               >
-                ...
+                0.5
                  
                 ETH
               </Text>
@@ -3386,15 +2422,16 @@ exports[`OrdersList renders correctly 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 14,
                     "letterSpacing": 0,
                     "lineHeight": 22,
                   }
                 }
+                testID="orders-list-fiat-amount-buy-4"
               >
-                ...
+                $1000 
               </Text>
             </View>
           </View>
@@ -3414,10 +2451,11 @@ exports[`OrdersList renders correctly 1`] = `
         style={
           {
             "borderBottomWidth": 0.5,
-            "borderColor": "#b7bbc866",
+            "borderColor": "#b4b4b566",
           }
         }
-        underlayColor="#f3f5f9"
+        testID="orders-list-row-deposit-5"
+        underlayColor="#f3f3f4"
       >
         <View
           accessibilityRole="none"
@@ -3439,7 +2477,7 @@ exports[`OrdersList renders correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 14,
                   "letterSpacing": 0,
@@ -3461,112 +2499,39 @@ exports[`OrdersList renders correctly 1`] = `
             <View
               style={
                 {
-                  "flex": -1,
+                  "flex": 1,
                 }
               }
               testID="listitemcolumn"
             >
-              <View
-                onLayout={[Function]}
+              <Text
+                accessibilityRole="text"
                 style={
                   {
-                    "alignSelf": "flex-start",
-                    "position": "relative",
+                    "color": "#131416",
+                    "fontFamily": "Geist-Regular",
+                    "fontSize": 16,
+                    "letterSpacing": 0,
+                    "lineHeight": 24,
                   }
                 }
-                testID="badge-wrapper-badge"
               >
-                <View>
-                  <Image
-                    resizeMode="stretch"
-                    source={1}
-                    style={
-                      {
-                        "height": 28,
-                        "width": 28,
-                      }
-                    }
-                  />
-                </View>
-                <View
-                  style={
-                    {
-                      "alignItems": "center",
-                      "aspectRatio": 1,
-                      "height": 0,
-                      "justifyContent": "center",
-                      "position": "absolute",
-                      "right": 0,
-                      "top": 0,
-                      "transform": [
-                        {
-                          "translateX": 0,
-                        },
-                        {
-                          "translateY": -0,
-                        },
-                      ],
-                    }
+                Transak: Purchased USDC
+              </Text>
+              <Text
+                accessibilityRole="text"
+                style={
+                  {
+                    "color": "#457a39",
+                    "fontFamily": "Geist-Bold",
+                    "fontSize": 14,
+                    "letterSpacing": 0,
+                    "lineHeight": 22,
                   }
-                >
-                  <View
-                    onLayout={[Function]}
-                    style={
-                      {
-                        "alignItems": "center",
-                        "aspectRatio": 1,
-                        "height": "50%",
-                        "justifyContent": "center",
-                        "maxHeight": 24,
-                        "minHeight": 8,
-                        "opacity": 0,
-                      }
-                    }
-                    testID="badgenetwork"
-                  >
-                    <View
-                      style={
-                        {
-                          "alignItems": "center",
-                          "backgroundColor": "#ffffff",
-                          "borderColor": "#ffffff",
-                          "borderRadius": 8,
-                          "borderWidth": 2,
-                          "height": 32,
-                          "justifyContent": "center",
-                          "overflow": "hidden",
-                          "shadowColor": "#0000001a",
-                          "shadowOffset": {
-                            "height": 2,
-                            "width": 0,
-                          },
-                          "shadowOpacity": 1,
-                          "shadowRadius": 4,
-                          "transform": [
-                            {
-                              "scale": 1,
-                            },
-                          ],
-                          "width": 32,
-                        }
-                      }
-                    >
-                      <Image
-                        onError={[Function]}
-                        resizeMode="contain"
-                        source={1}
-                        style={
-                          {
-                            "height": 32,
-                            "width": 32,
-                          }
-                        }
-                        testID="network-avatar-image"
-                      />
-                    </View>
-                  </View>
-                </View>
-              </View>
+                }
+              >
+                Completed
+              </Text>
             </View>
             <View
               accessible={false}
@@ -3577,6 +2542,110 @@ exports[`OrdersList renders correctly 1`] = `
               }
               testID="listitem-gap"
             />
+            <View
+              style={
+                {
+                  "alignItems": "flex-end",
+                  "flex": -1,
+                }
+              }
+              testID="listitemcolumn"
+            >
+              <Text
+                accessibilityRole="text"
+                style={
+                  {
+                    "color": "#131416",
+                    "fontFamily": "Geist-Regular",
+                    "fontSize": 16,
+                    "letterSpacing": 0,
+                    "lineHeight": 24,
+                  }
+                }
+                testID="orders-list-crypto-amount-deposit-5"
+              >
+                100
+                 
+                USDC
+              </Text>
+              <Text
+                accessibilityRole="text"
+                style={
+                  {
+                    "color": "#66676a",
+                    "fontFamily": "Geist-Regular",
+                    "fontSize": 14,
+                    "letterSpacing": 0,
+                    "lineHeight": 22,
+                  }
+                }
+                testID="orders-list-fiat-amount-deposit-5"
+              >
+                $100 
+              </Text>
+            </View>
+          </View>
+        </View>
+      </TouchableHighlight>
+    </View>
+    <View
+      onFocusCapture={[Function]}
+      onLayout={[Function]}
+      style={null}
+    >
+      <TouchableHighlight
+        accessibilityRole="button"
+        accessible={true}
+        activeOpacity={1}
+        onPress={[Function]}
+        style={
+          {
+            "borderBottomWidth": 0.5,
+            "borderColor": "#b4b4b566",
+          }
+        }
+        testID="orders-list-row-deposit-6"
+        underlayColor="#f3f3f4"
+      >
+        <View
+          accessibilityRole="none"
+          accessible={true}
+          style={
+            {
+              "padding": 16,
+            }
+          }
+        >
+          <View
+            style={
+              {
+                "marginBottom": 10,
+              }
+            }
+          >
+            <Text
+              accessibilityRole="text"
+              style={
+                {
+                  "color": "#131416",
+                  "fontFamily": "Geist-Regular",
+                  "fontSize": 14,
+                  "letterSpacing": 0,
+                  "lineHeight": 22,
+                }
+              }
+            >
+              Oct 13 at 8:07 pm
+            </Text>
+          </View>
+          <View
+            style={
+              {
+                "alignItems": "center",
+                "flexDirection": "row",
+              }
+            }
+          >
             <View
               style={
                 {
@@ -3589,7 +2658,7 @@ exports[`OrdersList renders correctly 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -3597,13 +2666,13 @@ exports[`OrdersList renders correctly 1`] = `
                   }
                 }
               >
-                USDC Deposit
+                Transak: Purchased USDT
               </Text>
               <Text
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#457a39",
+                    "color": "#131416",
                     "fontFamily": "Geist-Bold",
                     "fontSize": 14,
                     "letterSpacing": 0,
@@ -3611,7 +2680,7 @@ exports[`OrdersList renders correctly 1`] = `
                   }
                 }
               >
-                Completed
+                Pending
               </Text>
             </View>
             <View
@@ -3636,31 +2705,33 @@ exports[`OrdersList renders correctly 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
                     "lineHeight": 24,
                   }
                 }
+                testID="orders-list-crypto-amount-deposit-6"
               >
-                100
+                20
                  
-                USDC
+                USDT
               </Text>
               <Text
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 14,
                     "letterSpacing": 0,
                     "lineHeight": 22,
                   }
                 }
+                testID="orders-list-fiat-amount-deposit-6"
               >
-                $100 
+                $20 
               </Text>
             </View>
           </View>
@@ -3680,10 +2751,11 @@ exports[`OrdersList renders correctly 1`] = `
         style={
           {
             "borderBottomWidth": 0.5,
-            "borderColor": "#b7bbc866",
+            "borderColor": "#b4b4b566",
           }
         }
-        underlayColor="#f3f5f9"
+        testID="orders-list-row-buy-7"
+        underlayColor="#f3f3f4"
       >
         <View
           accessibilityRole="none"
@@ -3705,7 +2777,7 @@ exports[`OrdersList renders correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 14,
                   "letterSpacing": 0,
@@ -3713,7 +2785,7 @@ exports[`OrdersList renders correctly 1`] = `
                 }
               }
             >
-              Oct 13 at 8:07 pm
+              Dec 31 at 7:00 pm
             </Text>
           </View>
           <View
@@ -3724,125 +2796,6 @@ exports[`OrdersList renders correctly 1`] = `
               }
             }
           >
-            <View
-              style={
-                {
-                  "flex": -1,
-                }
-              }
-              testID="listitemcolumn"
-            >
-              <View
-                onLayout={[Function]}
-                style={
-                  {
-                    "alignSelf": "flex-start",
-                    "position": "relative",
-                  }
-                }
-                testID="badge-wrapper-badge"
-              >
-                <View>
-                  <Image
-                    resizeMode="stretch"
-                    source={1}
-                    style={
-                      {
-                        "height": 28,
-                        "width": 28,
-                      }
-                    }
-                  />
-                </View>
-                <View
-                  style={
-                    {
-                      "alignItems": "center",
-                      "aspectRatio": 1,
-                      "height": 0,
-                      "justifyContent": "center",
-                      "position": "absolute",
-                      "right": 0,
-                      "top": 0,
-                      "transform": [
-                        {
-                          "translateX": 0,
-                        },
-                        {
-                          "translateY": -0,
-                        },
-                      ],
-                    }
-                  }
-                >
-                  <View
-                    onLayout={[Function]}
-                    style={
-                      {
-                        "alignItems": "center",
-                        "aspectRatio": 1,
-                        "height": "50%",
-                        "justifyContent": "center",
-                        "maxHeight": 24,
-                        "minHeight": 8,
-                        "opacity": 0,
-                      }
-                    }
-                    testID="badgenetwork"
-                  >
-                    <View
-                      style={
-                        {
-                          "alignItems": "center",
-                          "backgroundColor": "#ffffff",
-                          "borderColor": "#ffffff",
-                          "borderRadius": 8,
-                          "borderWidth": 2,
-                          "height": 32,
-                          "justifyContent": "center",
-                          "overflow": "hidden",
-                          "shadowColor": "#0000001a",
-                          "shadowOffset": {
-                            "height": 2,
-                            "width": 0,
-                          },
-                          "shadowOpacity": 1,
-                          "shadowRadius": 4,
-                          "transform": [
-                            {
-                              "scale": 1,
-                            },
-                          ],
-                          "width": 32,
-                        }
-                      }
-                    >
-                      <Image
-                        onError={[Function]}
-                        resizeMode="contain"
-                        source={1}
-                        style={
-                          {
-                            "height": 32,
-                            "width": 32,
-                          }
-                        }
-                        testID="network-avatar-image"
-                      />
-                    </View>
-                  </View>
-                </View>
-              </View>
-            </View>
-            <View
-              accessible={false}
-              style={
-                {
-                  "width": 16,
-                }
-              }
-              testID="listitem-gap"
-            />
             <View
               style={
                 {
@@ -3855,7 +2808,7 @@ exports[`OrdersList renders correctly 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -3863,13 +2816,13 @@ exports[`OrdersList renders correctly 1`] = `
                   }
                 }
               >
-                USDT Deposit
+                Test Provider: Purchased ETH
               </Text>
               <Text
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#4459ff",
                     "fontFamily": "Geist-Bold",
                     "fontSize": 14,
                     "letterSpacing": 0,
@@ -3902,31 +2855,33 @@ exports[`OrdersList renders correctly 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
                     "lineHeight": 24,
                   }
                 }
+                testID="orders-list-crypto-amount-buy-7"
               >
-                20
+                0
                  
-                USDT
+                ETH
               </Text>
               <Text
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 14,
                     "letterSpacing": 0,
                     "lineHeight": 22,
                   }
                 }
+                testID="orders-list-fiat-amount-buy-7"
               >
-                $20 
+                ...
               </Text>
             </View>
           </View>
@@ -4079,7 +3034,7 @@ exports[`OrdersList renders empty buy message 1`] = `
                   {
                     "alignItems": "center",
                     "alignSelf": "flex-start",
-                    "backgroundColor": "#3c4d9d0f",
+                    "backgroundColor": "#b4b4b528",
                     "borderRadius": 12,
                     "columnGap": 8,
                     "flexDirection": "row",
@@ -4093,7 +3048,7 @@ exports[`OrdersList renders empty buy message 1`] = `
                   },
                   [
                     {
-                      "backgroundColor": "#3c4d9d0f",
+                      "backgroundColor": "#b4b4b528",
                     },
                     undefined,
                   ],
@@ -4112,7 +3067,7 @@ exports[`OrdersList renders empty buy message 1`] = `
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "flexGrow": 0,
                       "flexShrink": 1,
                       "flexWrap": "wrap",
@@ -4167,7 +3122,7 @@ exports[`OrdersList renders empty buy message 1`] = `
                   {
                     "alignItems": "center",
                     "alignSelf": "flex-start",
-                    "backgroundColor": "#3c4d9d0f",
+                    "backgroundColor": "#b4b4b528",
                     "borderRadius": 12,
                     "columnGap": 8,
                     "flexDirection": "row",
@@ -4181,7 +3136,7 @@ exports[`OrdersList renders empty buy message 1`] = `
                   },
                   [
                     {
-                      "backgroundColor": "#121314",
+                      "backgroundColor": "#131416",
                     },
                     undefined,
                   ],
@@ -4255,7 +3210,7 @@ exports[`OrdersList renders empty buy message 1`] = `
                   {
                     "alignItems": "center",
                     "alignSelf": "flex-start",
-                    "backgroundColor": "#3c4d9d0f",
+                    "backgroundColor": "#b4b4b528",
                     "borderRadius": 12,
                     "columnGap": 8,
                     "flexDirection": "row",
@@ -4269,7 +3224,7 @@ exports[`OrdersList renders empty buy message 1`] = `
                   },
                   [
                     {
-                      "backgroundColor": "#3c4d9d0f",
+                      "backgroundColor": "#b4b4b528",
                     },
                     undefined,
                   ],
@@ -4288,7 +3243,7 @@ exports[`OrdersList renders empty buy message 1`] = `
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "flexGrow": 0,
                       "flexShrink": 1,
                       "flexWrap": "wrap",
@@ -4346,7 +3301,7 @@ exports[`OrdersList renders empty buy message 1`] = `
           style={
             [
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -4508,7 +3463,7 @@ exports[`OrdersList renders empty sell message 1`] = `
                   {
                     "alignItems": "center",
                     "alignSelf": "flex-start",
-                    "backgroundColor": "#3c4d9d0f",
+                    "backgroundColor": "#b4b4b528",
                     "borderRadius": 12,
                     "columnGap": 8,
                     "flexDirection": "row",
@@ -4522,7 +3477,7 @@ exports[`OrdersList renders empty sell message 1`] = `
                   },
                   [
                     {
-                      "backgroundColor": "#3c4d9d0f",
+                      "backgroundColor": "#b4b4b528",
                     },
                     undefined,
                   ],
@@ -4541,7 +3496,7 @@ exports[`OrdersList renders empty sell message 1`] = `
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "flexGrow": 0,
                       "flexShrink": 1,
                       "flexWrap": "wrap",
@@ -4596,7 +3551,7 @@ exports[`OrdersList renders empty sell message 1`] = `
                   {
                     "alignItems": "center",
                     "alignSelf": "flex-start",
-                    "backgroundColor": "#3c4d9d0f",
+                    "backgroundColor": "#b4b4b528",
                     "borderRadius": 12,
                     "columnGap": 8,
                     "flexDirection": "row",
@@ -4610,7 +3565,7 @@ exports[`OrdersList renders empty sell message 1`] = `
                   },
                   [
                     {
-                      "backgroundColor": "#3c4d9d0f",
+                      "backgroundColor": "#b4b4b528",
                     },
                     undefined,
                   ],
@@ -4629,7 +3584,7 @@ exports[`OrdersList renders empty sell message 1`] = `
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "flexGrow": 0,
                       "flexShrink": 1,
                       "flexWrap": "wrap",
@@ -4684,7 +3639,7 @@ exports[`OrdersList renders empty sell message 1`] = `
                   {
                     "alignItems": "center",
                     "alignSelf": "flex-start",
-                    "backgroundColor": "#3c4d9d0f",
+                    "backgroundColor": "#b4b4b528",
                     "borderRadius": 12,
                     "columnGap": 8,
                     "flexDirection": "row",
@@ -4698,7 +3653,7 @@ exports[`OrdersList renders empty sell message 1`] = `
                   },
                   [
                     {
-                      "backgroundColor": "#121314",
+                      "backgroundColor": "#131416",
                     },
                     undefined,
                   ],
@@ -4775,7 +3730,7 @@ exports[`OrdersList renders empty sell message 1`] = `
           style={
             [
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -4851,26 +3806,17 @@ exports[`OrdersList renders sell only correctly when pressing sell filter 1`] =
     [
       {
         "account": "0xe64dD0AB5ad7e8C5F2bf6Ce75C34e187af8b920A",
-        "amount": "34.23",
         "createdAt": 1697242033399,
         "cryptoAmount": "0.01231324",
-        "cryptocurrency": "ETH",
-        "currency": "USD",
-        "data": {
-          "cryptoCurrency": {
-            "decimals": 18,
-            "name": "Ethereum",
-            "symbol": "ETH",
-          },
-          "provider": {
-            "name": "Test Provider",
-          },
-        },
+        "cryptoCurrencySymbol": "ETH",
+        "fiatAmount": "34.23",
+        "fiatCurrencyCode": "USD",
         "id": "test-order-2",
         "network": "1",
         "orderType": "SELL",
-        "provider": "AGGREGATOR",
-        "state": "PENDING",
+        "providerName": "Test Provider",
+        "source": "legacy",
+        "status": "PENDING",
       },
     ]
   }
@@ -4963,7 +3909,7 @@ exports[`OrdersList renders sell only correctly when pressing sell filter 1`] =
                   {
                     "alignItems": "center",
                     "alignSelf": "flex-start",
-                    "backgroundColor": "#3c4d9d0f",
+                    "backgroundColor": "#b4b4b528",
                     "borderRadius": 12,
                     "columnGap": 8,
                     "flexDirection": "row",
@@ -4977,7 +3923,7 @@ exports[`OrdersList renders sell only correctly when pressing sell filter 1`] =
                   },
                   [
                     {
-                      "backgroundColor": "#3c4d9d0f",
+                      "backgroundColor": "#b4b4b528",
                     },
                     undefined,
                   ],
@@ -4996,7 +3942,7 @@ exports[`OrdersList renders sell only correctly when pressing sell filter 1`] =
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "flexGrow": 0,
                       "flexShrink": 1,
                       "flexWrap": "wrap",
@@ -5051,7 +3997,7 @@ exports[`OrdersList renders sell only correctly when pressing sell filter 1`] =
                   {
                     "alignItems": "center",
                     "alignSelf": "flex-start",
-                    "backgroundColor": "#3c4d9d0f",
+                    "backgroundColor": "#b4b4b528",
                     "borderRadius": 12,
                     "columnGap": 8,
                     "flexDirection": "row",
@@ -5065,7 +4011,7 @@ exports[`OrdersList renders sell only correctly when pressing sell filter 1`] =
                   },
                   [
                     {
-                      "backgroundColor": "#3c4d9d0f",
+                      "backgroundColor": "#b4b4b528",
                     },
                     undefined,
                   ],
@@ -5084,7 +4030,7 @@ exports[`OrdersList renders sell only correctly when pressing sell filter 1`] =
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "flexGrow": 0,
                       "flexShrink": 1,
                       "flexWrap": "wrap",
@@ -5139,7 +4085,7 @@ exports[`OrdersList renders sell only correctly when pressing sell filter 1`] =
                   {
                     "alignItems": "center",
                     "alignSelf": "flex-start",
-                    "backgroundColor": "#3c4d9d0f",
+                    "backgroundColor": "#b4b4b528",
                     "borderRadius": 12,
                     "columnGap": 8,
                     "flexDirection": "row",
@@ -5153,7 +4099,7 @@ exports[`OrdersList renders sell only correctly when pressing sell filter 1`] =
                   },
                   [
                     {
-                      "backgroundColor": "#121314",
+                      "backgroundColor": "#131416",
                     },
                     undefined,
                   ],
@@ -5207,10 +4153,11 @@ exports[`OrdersList renders sell only correctly when pressing sell filter 1`] =
         style={
           {
             "borderBottomWidth": 0.5,
-            "borderColor": "#b7bbc866",
+            "borderColor": "#b4b4b566",
           }
         }
-        underlayColor="#f3f5f9"
+        testID="orders-list-row-sell-1"
+        underlayColor="#f3f3f4"
       >
         <View
           accessibilityRole="none"
@@ -5232,7 +4179,7 @@ exports[`OrdersList renders sell only correctly when pressing sell filter 1`] =
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 14,
                   "letterSpacing": 0,
@@ -5251,125 +4198,6 @@ exports[`OrdersList renders sell only correctly when pressing sell filter 1`] =
               }
             }
           >
-            <View
-              style={
-                {
-                  "flex": -1,
-                }
-              }
-              testID="listitemcolumn"
-            >
-              <View
-                onLayout={[Function]}
-                style={
-                  {
-                    "alignSelf": "flex-start",
-                    "position": "relative",
-                  }
-                }
-                testID="badge-wrapper-badge"
-              >
-                <View>
-                  <Image
-                    resizeMode="stretch"
-                    source={1}
-                    style={
-                      {
-                        "height": 28,
-                        "width": 28,
-                      }
-                    }
-                  />
-                </View>
-                <View
-                  style={
-                    {
-                      "alignItems": "center",
-                      "aspectRatio": 1,
-                      "height": 0,
-                      "justifyContent": "center",
-                      "position": "absolute",
-                      "right": 0,
-                      "top": 0,
-                      "transform": [
-                        {
-                          "translateX": 0,
-                        },
-                        {
-                          "translateY": -0,
-                        },
-                      ],
-                    }
-                  }
-                >
-                  <View
-                    onLayout={[Function]}
-                    style={
-                      {
-                        "alignItems": "center",
-                        "aspectRatio": 1,
-                        "height": "50%",
-                        "justifyContent": "center",
-                        "maxHeight": 24,
-                        "minHeight": 8,
-                        "opacity": 0,
-                      }
-                    }
-                    testID="badgenetwork"
-                  >
-                    <View
-                      style={
-                        {
-                          "alignItems": "center",
-                          "backgroundColor": "#ffffff",
-                          "borderColor": "#ffffff",
-                          "borderRadius": 8,
-                          "borderWidth": 2,
-                          "height": 32,
-                          "justifyContent": "center",
-                          "overflow": "hidden",
-                          "shadowColor": "#0000001a",
-                          "shadowOffset": {
-                            "height": 2,
-                            "width": 0,
-                          },
-                          "shadowOpacity": 1,
-                          "shadowRadius": 4,
-                          "transform": [
-                            {
-                              "scale": 1,
-                            },
-                          ],
-                          "width": 32,
-                        }
-                      }
-                    >
-                      <Image
-                        onError={[Function]}
-                        resizeMode="contain"
-                        source={1}
-                        style={
-                          {
-                            "height": 32,
-                            "width": 32,
-                          }
-                        }
-                        testID="network-avatar-image"
-                      />
-                    </View>
-                  </View>
-                </View>
-              </View>
-            </View>
-            <View
-              accessible={false}
-              style={
-                {
-                  "width": 16,
-                }
-              }
-              testID="listitem-gap"
-            />
             <View
               style={
                 {
@@ -5382,7 +4210,7 @@ exports[`OrdersList renders sell only correctly when pressing sell filter 1`] =
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -5429,15 +4257,16 @@ exports[`OrdersList renders sell only correctly when pressing sell filter 1`] =
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
                     "lineHeight": 24,
                   }
                 }
+                testID="orders-list-crypto-amount-sell-1"
               >
-                0.01231
+                0.01231324
                  
                 ETH
               </Text>
@@ -5445,13 +4274,14 @@ exports[`OrdersList renders sell only correctly when pressing sell filter 1`] =
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 14,
                     "letterSpacing": 0,
                     "lineHeight": 22,
                   }
                 }
+                testID="orders-list-fiat-amount-sell-1"
               >
                 $34.23 
               </Text>
@@ -5520,26 +4350,17 @@ exports[`OrdersList resets filter to all after other filter was set 1`] = `
     [
       {
         "account": "0xe64dD0AB5ad7e8C5F2bf6Ce75C34e187af8b920A",
-        "amount": "34.23",
         "createdAt": 1697242033399,
         "cryptoAmount": "0.01231324",
-        "cryptocurrency": "ETH",
-        "currency": "USD",
-        "data": {
-          "cryptoCurrency": {
-            "decimals": 18,
-            "name": "Ethereum",
-            "symbol": "ETH",
-          },
-          "provider": {
-            "name": "Test Provider",
-          },
-        },
+        "cryptoCurrencySymbol": "ETH",
+        "fiatAmount": "34.23",
+        "fiatCurrencyCode": "USD",
         "id": "test-order-2",
         "network": "1",
         "orderType": "SELL",
-        "provider": "AGGREGATOR",
-        "state": "PENDING",
+        "providerName": "Test Provider",
+        "source": "legacy",
+        "status": "PENDING",
       },
     ]
   }
@@ -5632,7 +4453,7 @@ exports[`OrdersList resets filter to all after other filter was set 1`] = `
                   {
                     "alignItems": "center",
                     "alignSelf": "flex-start",
-                    "backgroundColor": "#3c4d9d0f",
+                    "backgroundColor": "#b4b4b528",
                     "borderRadius": 12,
                     "columnGap": 8,
                     "flexDirection": "row",
@@ -5646,7 +4467,7 @@ exports[`OrdersList resets filter to all after other filter was set 1`] = `
                   },
                   [
                     {
-                      "backgroundColor": "#3c4d9d0f",
+                      "backgroundColor": "#b4b4b528",
                     },
                     undefined,
                   ],
@@ -5665,7 +4486,7 @@ exports[`OrdersList resets filter to all after other filter was set 1`] = `
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "flexGrow": 0,
                       "flexShrink": 1,
                       "flexWrap": "wrap",
@@ -5720,7 +4541,7 @@ exports[`OrdersList resets filter to all after other filter was set 1`] = `
                   {
                     "alignItems": "center",
                     "alignSelf": "flex-start",
-                    "backgroundColor": "#3c4d9d0f",
+                    "backgroundColor": "#b4b4b528",
                     "borderRadius": 12,
                     "columnGap": 8,
                     "flexDirection": "row",
@@ -5734,7 +4555,7 @@ exports[`OrdersList resets filter to all after other filter was set 1`] = `
                   },
                   [
                     {
-                      "backgroundColor": "#3c4d9d0f",
+                      "backgroundColor": "#b4b4b528",
                     },
                     undefined,
                   ],
@@ -5753,7 +4574,7 @@ exports[`OrdersList resets filter to all after other filter was set 1`] = `
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "flexGrow": 0,
                       "flexShrink": 1,
                       "flexWrap": "wrap",
@@ -5808,7 +4629,7 @@ exports[`OrdersList resets filter to all after other filter was set 1`] = `
                   {
                     "alignItems": "center",
                     "alignSelf": "flex-start",
-                    "backgroundColor": "#3c4d9d0f",
+                    "backgroundColor": "#b4b4b528",
                     "borderRadius": 12,
                     "columnGap": 8,
                     "flexDirection": "row",
@@ -5822,7 +4643,7 @@ exports[`OrdersList resets filter to all after other filter was set 1`] = `
                   },
                   [
                     {
-                      "backgroundColor": "#121314",
+                      "backgroundColor": "#131416",
                     },
                     undefined,
                   ],
@@ -5876,10 +4697,11 @@ exports[`OrdersList resets filter to all after other filter was set 1`] = `
         style={
           {
             "borderBottomWidth": 0.5,
-            "borderColor": "#b7bbc866",
+            "borderColor": "#b4b4b566",
           }
         }
-        underlayColor="#f3f5f9"
+        testID="orders-list-row-sell-1"
+        underlayColor="#f3f3f4"
       >
         <View
           accessibilityRole="none"
@@ -5901,7 +4723,7 @@ exports[`OrdersList resets filter to all after other filter was set 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 14,
                   "letterSpacing": 0,
@@ -5920,125 +4742,6 @@ exports[`OrdersList resets filter to all after other filter was set 1`] = `
               }
             }
           >
-            <View
-              style={
-                {
-                  "flex": -1,
-                }
-              }
-              testID="listitemcolumn"
-            >
-              <View
-                onLayout={[Function]}
-                style={
-                  {
-                    "alignSelf": "flex-start",
-                    "position": "relative",
-                  }
-                }
-                testID="badge-wrapper-badge"
-              >
-                <View>
-                  <Image
-                    resizeMode="stretch"
-                    source={1}
-                    style={
-                      {
-                        "height": 28,
-                        "width": 28,
-                      }
-                    }
-                  />
-                </View>
-                <View
-                  style={
-                    {
-                      "alignItems": "center",
-                      "aspectRatio": 1,
-                      "height": 0,
-                      "justifyContent": "center",
-                      "position": "absolute",
-                      "right": 0,
-                      "top": 0,
-                      "transform": [
-                        {
-                          "translateX": 0,
-                        },
-                        {
-                          "translateY": -0,
-                        },
-                      ],
-                    }
-                  }
-                >
-                  <View
-                    onLayout={[Function]}
-                    style={
-                      {
-                        "alignItems": "center",
-                        "aspectRatio": 1,
-                        "height": "50%",
-                        "justifyContent": "center",
-                        "maxHeight": 24,
-                        "minHeight": 8,
-                        "opacity": 0,
-                      }
-                    }
-                    testID="badgenetwork"
-                  >
-                    <View
-                      style={
-                        {
-                          "alignItems": "center",
-                          "backgroundColor": "#ffffff",
-                          "borderColor": "#ffffff",
-                          "borderRadius": 8,
-                          "borderWidth": 2,
-                          "height": 32,
-                          "justifyContent": "center",
-                          "overflow": "hidden",
-                          "shadowColor": "#0000001a",
-                          "shadowOffset": {
-                            "height": 2,
-                            "width": 0,
-                          },
-                          "shadowOpacity": 1,
-                          "shadowRadius": 4,
-                          "transform": [
-                            {
-                              "scale": 1,
-                            },
-                          ],
-                          "width": 32,
-                        }
-                      }
-                    >
-                      <Image
-                        onError={[Function]}
-                        resizeMode="contain"
-                        source={1}
-                        style={
-                          {
-                            "height": 32,
-                            "width": 32,
-                          }
-                        }
-                        testID="network-avatar-image"
-                      />
-                    </View>
-                  </View>
-                </View>
-              </View>
-            </View>
-            <View
-              accessible={false}
-              style={
-                {
-                  "width": 16,
-                }
-              }
-              testID="listitem-gap"
-            />
             <View
               style={
                 {
@@ -6051,7 +4754,7 @@ exports[`OrdersList resets filter to all after other filter was set 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -6098,15 +4801,16 @@ exports[`OrdersList resets filter to all after other filter was set 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
                     "lineHeight": 24,
                   }
                 }
+                testID="orders-list-crypto-amount-sell-1"
               >
-                0.01231
+                0.01231324
                  
                 ETH
               </Text>
@@ -6114,13 +4818,14 @@ exports[`OrdersList resets filter to all after other filter was set 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 14,
                     "letterSpacing": 0,
                     "lineHeight": 22,
                   }
                 }
+                testID="orders-list-fiat-amount-sell-1"
               >
                 $34.23 
               </Text>
@@ -6189,140 +4894,101 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
     [
       {
         "account": "0xe64dD0AB5ad7e8C5F2bf6Ce75C34e187af8b920A",
-        "amount": "34.23",
         "createdAt": 1697242033399,
         "cryptoAmount": "0.01231324",
-        "cryptocurrency": "ETH",
-        "currency": "USD",
-        "data": {
-          "cryptoCurrency": {
-            "decimals": 18,
-            "name": "Ethereum",
-            "symbol": "ETH",
-          },
-          "provider": {
-            "name": "Test Provider",
-          },
-        },
+        "cryptoCurrencySymbol": "ETH",
+        "fiatAmount": "34.23",
+        "fiatCurrencyCode": "USD",
         "id": "test-order-1",
         "network": "1",
         "orderType": "BUY",
-        "provider": "AGGREGATOR",
-        "state": "COMPLETED",
+        "providerName": "Test Provider",
+        "source": "legacy",
+        "status": "COMPLETED",
       },
       {
         "account": "0xe64dD0AB5ad7e8C5F2bf6Ce75C34e187af8b920A",
-        "amount": "34.23",
         "createdAt": 1697242033399,
         "cryptoAmount": "0.01231324",
-        "cryptocurrency": "ETH",
-        "currency": "USD",
-        "data": {
-          "cryptoCurrency": {
-            "decimals": 18,
-            "name": "Ethereum",
-            "symbol": "ETH",
-          },
-          "provider": {
-            "name": "Test Provider",
-          },
-        },
+        "cryptoCurrencySymbol": "ETH",
+        "fiatAmount": "34.23",
+        "fiatCurrencyCode": "USD",
         "id": "test-order-2",
         "network": "1",
         "orderType": "SELL",
-        "provider": "AGGREGATOR",
-        "state": "PENDING",
+        "providerName": "Test Provider",
+        "source": "legacy",
+        "status": "PENDING",
       },
       {
         "account": "0xe64dD0AB5ad7e8C5F2bf6Ce75C34e187af8b920A",
-        "amount": "34.23",
         "createdAt": 1697242033399,
         "cryptoAmount": "0.01231324",
-        "cryptocurrency": "ETH",
-        "currency": "USD",
-        "data": {
-          "cryptoCurrency": {
-            "decimals": 18,
-            "name": "Ethereum",
-            "symbol": "ETH",
-          },
-          "provider": {
-            "name": "Test Provider",
-          },
-        },
+        "cryptoCurrencySymbol": "ETH",
+        "fiatAmount": "34.23",
+        "fiatCurrencyCode": "USD",
         "id": "test-order-3",
         "network": "1",
         "orderType": "BUY",
-        "provider": "AGGREGATOR",
-        "state": "PENDING",
+        "providerName": "Test Provider",
+        "source": "legacy",
+        "status": "PENDING",
       },
       {
         "account": "0xe64dD0AB5ad7e8C5F2bf6Ce75C34e187af8b920A",
-        "cryptocurrency": "ETH",
-        "currency": "USD",
-        "data": {
-          "cryptoCurrency": {
-            "decimals": 18,
-            "name": "Ethereum",
-            "symbol": "ETH",
-          },
-          "provider": {
-            "name": "Test Provider",
-          },
-        },
-        "id": "test-order-4",
+        "createdAt": 1697242033399,
+        "cryptoAmount": "0.5",
+        "cryptoCurrencySymbol": "ETH",
+        "fiatAmount": "1000",
+        "fiatCurrencyCode": "USD",
+        "id": "test-ramps-v2-order-1",
         "network": "1",
         "orderType": "BUY",
-        "provider": "AGGREGATOR",
-        "state": "PENDING",
+        "providerName": "...",
+        "source": "legacy",
+        "status": "COMPLETED",
       },
       {
         "account": "0xe64dD0AB5ad7e8C5F2bf6Ce75C34e187af8b920A",
-        "amount": "100",
         "createdAt": 1697242033399,
         "cryptoAmount": "100",
-        "cryptocurrency": "USDC",
-        "currency": "USD",
-        "data": {
-          "cryptoCurrency": {
-            "assetId": "eip155:1/erc20:0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48",
-            "chainId": "eip155:1",
-            "decimals": 6,
-            "iconUrl": "https://static.cx.metamask.io/api/v2/tokenIcons/assets/eip155/1/erc20/0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48.png",
-            "name": "USD Coin",
-            "symbol": "USDC",
-          },
-          "providerOrderLink": "https://transak.com/order/123",
-        },
+        "cryptoCurrencySymbol": "USDC",
+        "fiatAmount": "100",
+        "fiatCurrencyCode": "USD",
         "id": "test-deposit-order-1",
         "network": "1",
         "orderType": "DEPOSIT",
-        "provider": "DEPOSIT",
-        "state": "COMPLETED",
+        "providerName": "Transak",
+        "source": "legacy",
+        "status": "COMPLETED",
       },
       {
         "account": "0xe64dD0AB5ad7e8C5F2bf6Ce75C34e187af8b920A",
-        "amount": "20",
         "createdAt": 1697242033399,
         "cryptoAmount": "20",
-        "cryptocurrency": "USDT",
-        "currency": "USD",
-        "data": {
-          "cryptoCurrency": {
-            "assetId": "eip155:1/erc20:0xdAC17F958D2ee523a2206206994597C13D831ec7",
-            "chainId": "eip155:1",
-            "decimals": 6,
-            "iconUrl": "https://static.cx.metamask.io/api/v2/tokenIcons/assets/eip155/1/erc20/0xdAC17F958D2ee523a2206206994597C13D831ec7.png",
-            "name": "Tether USD",
-            "symbol": "USDT",
-            "unsupported": true,
-          },
-        },
+        "cryptoCurrencySymbol": "USDT",
+        "fiatAmount": "20",
+        "fiatCurrencyCode": "USD",
         "id": "test-deposit-order-2",
         "network": "1",
         "orderType": "DEPOSIT",
-        "provider": "DEPOSIT",
-        "state": "CREATED",
+        "providerName": "Transak",
+        "source": "legacy",
+        "status": "CREATED",
+      },
+      {
+        "account": "0xe64dD0AB5ad7e8C5F2bf6Ce75C34e187af8b920A",
+        "createdAt": 0,
+        "cryptoAmount": 0,
+        "cryptoCurrencySymbol": "ETH",
+        "fiatAmount": undefined,
+        "fiatCurrencyCode": "USD",
+        "id": "test-order-4",
+        "network": "1",
+        "orderType": "BUY",
+        "providerName": "Test Provider",
+        "source": "legacy",
+        "status": "PENDING",
       },
     ]
   }
@@ -6415,7 +5081,7 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
                   {
                     "alignItems": "center",
                     "alignSelf": "flex-start",
-                    "backgroundColor": "#3c4d9d0f",
+                    "backgroundColor": "#b4b4b528",
                     "borderRadius": 12,
                     "columnGap": 8,
                     "flexDirection": "row",
@@ -6429,7 +5095,7 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
                   },
                   [
                     {
-                      "backgroundColor": "#121314",
+                      "backgroundColor": "#131416",
                     },
                     undefined,
                   ],
@@ -6503,7 +5169,7 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
                   {
                     "alignItems": "center",
                     "alignSelf": "flex-start",
-                    "backgroundColor": "#3c4d9d0f",
+                    "backgroundColor": "#b4b4b528",
                     "borderRadius": 12,
                     "columnGap": 8,
                     "flexDirection": "row",
@@ -6517,7 +5183,7 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
                   },
                   [
                     {
-                      "backgroundColor": "#3c4d9d0f",
+                      "backgroundColor": "#b4b4b528",
                     },
                     undefined,
                   ],
@@ -6536,7 +5202,7 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "flexGrow": 0,
                       "flexShrink": 1,
                       "flexWrap": "wrap",
@@ -6591,7 +5257,7 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
                   {
                     "alignItems": "center",
                     "alignSelf": "flex-start",
-                    "backgroundColor": "#3c4d9d0f",
+                    "backgroundColor": "#b4b4b528",
                     "borderRadius": 12,
                     "columnGap": 8,
                     "flexDirection": "row",
@@ -6605,7 +5271,7 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
                   },
                   [
                     {
-                      "backgroundColor": "#3c4d9d0f",
+                      "backgroundColor": "#b4b4b528",
                     },
                     undefined,
                   ],
@@ -6622,29 +5288,179 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
               <Text
                 accessibilityRole="text"
                 style={
-                  [
-                    {
-                      "color": "#121314",
-                      "flexGrow": 0,
-                      "flexShrink": 1,
-                      "flexWrap": "wrap",
-                      "fontFamily": "Geist-Medium",
-                      "fontSize": 16,
-                      "fontWeight": 400,
-                      "letterSpacing": 0,
-                      "lineHeight": 24,
-                      "textAlign": "center",
-                    },
-                    undefined,
-                  ]
+                  [
+                    {
+                      "color": "#131416",
+                      "flexGrow": 0,
+                      "flexShrink": 1,
+                      "flexWrap": "wrap",
+                      "fontFamily": "Geist-Medium",
+                      "fontSize": 16,
+                      "fontWeight": 400,
+                      "letterSpacing": 0,
+                      "lineHeight": 24,
+                      "textAlign": "center",
+                    },
+                    undefined,
+                  ]
+                }
+              >
+                Sold
+              </Text>
+            </View>
+          </View>
+        </RCTScrollView>
+      </View>
+    </View>
+    <View
+      onFocusCapture={[Function]}
+      onLayout={[Function]}
+      style={null}
+    >
+      <TouchableHighlight
+        accessibilityRole="button"
+        accessible={true}
+        activeOpacity={1}
+        onPress={[Function]}
+        style={
+          {
+            "borderBottomWidth": 0.5,
+            "borderColor": "#b4b4b566",
+          }
+        }
+        testID="orders-list-row-buy-1"
+        underlayColor="#f3f3f4"
+      >
+        <View
+          accessibilityRole="none"
+          accessible={true}
+          style={
+            {
+              "padding": 16,
+            }
+          }
+        >
+          <View
+            style={
+              {
+                "marginBottom": 10,
+              }
+            }
+          >
+            <Text
+              accessibilityRole="text"
+              style={
+                {
+                  "color": "#131416",
+                  "fontFamily": "Geist-Regular",
+                  "fontSize": 14,
+                  "letterSpacing": 0,
+                  "lineHeight": 22,
+                }
+              }
+            >
+              Oct 13 at 8:07 pm
+            </Text>
+          </View>
+          <View
+            style={
+              {
+                "alignItems": "center",
+                "flexDirection": "row",
+              }
+            }
+          >
+            <View
+              style={
+                {
+                  "flex": 1,
+                }
+              }
+              testID="listitemcolumn"
+            >
+              <Text
+                accessibilityRole="text"
+                style={
+                  {
+                    "color": "#131416",
+                    "fontFamily": "Geist-Regular",
+                    "fontSize": 16,
+                    "letterSpacing": 0,
+                    "lineHeight": 24,
+                  }
+                }
+              >
+                Test Provider: Purchased ETH
+              </Text>
+              <Text
+                accessibilityRole="text"
+                style={
+                  {
+                    "color": "#457a39",
+                    "fontFamily": "Geist-Bold",
+                    "fontSize": 14,
+                    "letterSpacing": 0,
+                    "lineHeight": 22,
+                  }
+                }
+              >
+                Completed
+              </Text>
+            </View>
+            <View
+              accessible={false}
+              style={
+                {
+                  "width": 16,
+                }
+              }
+              testID="listitem-gap"
+            />
+            <View
+              style={
+                {
+                  "alignItems": "flex-end",
+                  "flex": -1,
+                }
+              }
+              testID="listitemcolumn"
+            >
+              <Text
+                accessibilityRole="text"
+                style={
+                  {
+                    "color": "#131416",
+                    "fontFamily": "Geist-Regular",
+                    "fontSize": 16,
+                    "letterSpacing": 0,
+                    "lineHeight": 24,
+                  }
                 }
+                testID="orders-list-crypto-amount-buy-1"
               >
-                Sold
+                0.01231324
+                 
+                ETH
+              </Text>
+              <Text
+                accessibilityRole="text"
+                style={
+                  {
+                    "color": "#66676a",
+                    "fontFamily": "Geist-Regular",
+                    "fontSize": 14,
+                    "letterSpacing": 0,
+                    "lineHeight": 22,
+                  }
+                }
+                testID="orders-list-fiat-amount-buy-1"
+              >
+                $34.23 
               </Text>
             </View>
           </View>
-        </RCTScrollView>
-      </View>
+        </View>
+      </TouchableHighlight>
     </View>
     <View
       onFocusCapture={[Function]}
@@ -6659,10 +5475,11 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
         style={
           {
             "borderBottomWidth": 0.5,
-            "borderColor": "#b7bbc866",
+            "borderColor": "#b4b4b566",
           }
         }
-        underlayColor="#f3f5f9"
+        testID="orders-list-row-sell-2"
+        underlayColor="#f3f3f4"
       >
         <View
           accessibilityRole="none"
@@ -6684,7 +5501,7 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 14,
                   "letterSpacing": 0,
@@ -6703,125 +5520,6 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
               }
             }
           >
-            <View
-              style={
-                {
-                  "flex": -1,
-                }
-              }
-              testID="listitemcolumn"
-            >
-              <View
-                onLayout={[Function]}
-                style={
-                  {
-                    "alignSelf": "flex-start",
-                    "position": "relative",
-                  }
-                }
-                testID="badge-wrapper-badge"
-              >
-                <View>
-                  <Image
-                    resizeMode="stretch"
-                    source={1}
-                    style={
-                      {
-                        "height": 28,
-                        "width": 28,
-                      }
-                    }
-                  />
-                </View>
-                <View
-                  style={
-                    {
-                      "alignItems": "center",
-                      "aspectRatio": 1,
-                      "height": 0,
-                      "justifyContent": "center",
-                      "position": "absolute",
-                      "right": 0,
-                      "top": 0,
-                      "transform": [
-                        {
-                          "translateX": 0,
-                        },
-                        {
-                          "translateY": -0,
-                        },
-                      ],
-                    }
-                  }
-                >
-                  <View
-                    onLayout={[Function]}
-                    style={
-                      {
-                        "alignItems": "center",
-                        "aspectRatio": 1,
-                        "height": "50%",
-                        "justifyContent": "center",
-                        "maxHeight": 24,
-                        "minHeight": 8,
-                        "opacity": 0,
-                      }
-                    }
-                    testID="badgenetwork"
-                  >
-                    <View
-                      style={
-                        {
-                          "alignItems": "center",
-                          "backgroundColor": "#ffffff",
-                          "borderColor": "#ffffff",
-                          "borderRadius": 8,
-                          "borderWidth": 2,
-                          "height": 32,
-                          "justifyContent": "center",
-                          "overflow": "hidden",
-                          "shadowColor": "#0000001a",
-                          "shadowOffset": {
-                            "height": 2,
-                            "width": 0,
-                          },
-                          "shadowOpacity": 1,
-                          "shadowRadius": 4,
-                          "transform": [
-                            {
-                              "scale": 1,
-                            },
-                          ],
-                          "width": 32,
-                        }
-                      }
-                    >
-                      <Image
-                        onError={[Function]}
-                        resizeMode="contain"
-                        source={1}
-                        style={
-                          {
-                            "height": 32,
-                            "width": 32,
-                          }
-                        }
-                        testID="network-avatar-image"
-                      />
-                    </View>
-                  </View>
-                </View>
-              </View>
-            </View>
-            <View
-              accessible={false}
-              style={
-                {
-                  "width": 16,
-                }
-              }
-              testID="listitem-gap"
-            />
             <View
               style={
                 {
@@ -6834,7 +5532,7 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -6842,13 +5540,13 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
                   }
                 }
               >
-                Test Provider: Purchased ETH
+                Test Provider: Sold ETH
               </Text>
               <Text
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#457a39",
+                    "color": "#4459ff",
                     "fontFamily": "Geist-Bold",
                     "fontSize": 14,
                     "letterSpacing": 0,
@@ -6856,7 +5554,7 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
                   }
                 }
               >
-                Completed
+                Processing
               </Text>
             </View>
             <View
@@ -6881,15 +5579,16 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
                     "lineHeight": 24,
                   }
                 }
+                testID="orders-list-crypto-amount-sell-2"
               >
-                0.01231
+                0.01231324
                  
                 ETH
               </Text>
@@ -6897,13 +5596,14 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 14,
                     "letterSpacing": 0,
                     "lineHeight": 22,
                   }
                 }
+                testID="orders-list-fiat-amount-sell-2"
               >
                 $34.23 
               </Text>
@@ -6925,10 +5625,11 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
         style={
           {
             "borderBottomWidth": 0.5,
-            "borderColor": "#b7bbc866",
+            "borderColor": "#b4b4b566",
           }
         }
-        underlayColor="#f3f5f9"
+        testID="orders-list-row-buy-3"
+        underlayColor="#f3f3f4"
       >
         <View
           accessibilityRole="none"
@@ -6950,7 +5651,7 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 14,
                   "letterSpacing": 0,
@@ -6969,125 +5670,6 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
               }
             }
           >
-            <View
-              style={
-                {
-                  "flex": -1,
-                }
-              }
-              testID="listitemcolumn"
-            >
-              <View
-                onLayout={[Function]}
-                style={
-                  {
-                    "alignSelf": "flex-start",
-                    "position": "relative",
-                  }
-                }
-                testID="badge-wrapper-badge"
-              >
-                <View>
-                  <Image
-                    resizeMode="stretch"
-                    source={1}
-                    style={
-                      {
-                        "height": 28,
-                        "width": 28,
-                      }
-                    }
-                  />
-                </View>
-                <View
-                  style={
-                    {
-                      "alignItems": "center",
-                      "aspectRatio": 1,
-                      "height": 0,
-                      "justifyContent": "center",
-                      "position": "absolute",
-                      "right": 0,
-                      "top": 0,
-                      "transform": [
-                        {
-                          "translateX": 0,
-                        },
-                        {
-                          "translateY": -0,
-                        },
-                      ],
-                    }
-                  }
-                >
-                  <View
-                    onLayout={[Function]}
-                    style={
-                      {
-                        "alignItems": "center",
-                        "aspectRatio": 1,
-                        "height": "50%",
-                        "justifyContent": "center",
-                        "maxHeight": 24,
-                        "minHeight": 8,
-                        "opacity": 0,
-                      }
-                    }
-                    testID="badgenetwork"
-                  >
-                    <View
-                      style={
-                        {
-                          "alignItems": "center",
-                          "backgroundColor": "#ffffff",
-                          "borderColor": "#ffffff",
-                          "borderRadius": 8,
-                          "borderWidth": 2,
-                          "height": 32,
-                          "justifyContent": "center",
-                          "overflow": "hidden",
-                          "shadowColor": "#0000001a",
-                          "shadowOffset": {
-                            "height": 2,
-                            "width": 0,
-                          },
-                          "shadowOpacity": 1,
-                          "shadowRadius": 4,
-                          "transform": [
-                            {
-                              "scale": 1,
-                            },
-                          ],
-                          "width": 32,
-                        }
-                      }
-                    >
-                      <Image
-                        onError={[Function]}
-                        resizeMode="contain"
-                        source={1}
-                        style={
-                          {
-                            "height": 32,
-                            "width": 32,
-                          }
-                        }
-                        testID="network-avatar-image"
-                      />
-                    </View>
-                  </View>
-                </View>
-              </View>
-            </View>
-            <View
-              accessible={false}
-              style={
-                {
-                  "width": 16,
-                }
-              }
-              testID="listitem-gap"
-            />
             <View
               style={
                 {
@@ -7100,7 +5682,7 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -7108,7 +5690,7 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
                   }
                 }
               >
-                Test Provider: Sold ETH
+                Test Provider: Purchased ETH
               </Text>
               <Text
                 accessibilityRole="text"
@@ -7122,7 +5704,7 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
                   }
                 }
               >
-                Processing
+                Pending
               </Text>
             </View>
             <View
@@ -7147,15 +5729,16 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
                     "lineHeight": 24,
                   }
                 }
+                testID="orders-list-crypto-amount-buy-3"
               >
-                0.01231
+                0.01231324
                  
                 ETH
               </Text>
@@ -7163,13 +5746,14 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 14,
                     "letterSpacing": 0,
                     "lineHeight": 22,
                   }
                 }
+                testID="orders-list-fiat-amount-buy-3"
               >
                 $34.23 
               </Text>
@@ -7191,10 +5775,11 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
         style={
           {
             "borderBottomWidth": 0.5,
-            "borderColor": "#b7bbc866",
+            "borderColor": "#b4b4b566",
           }
         }
-        underlayColor="#f3f5f9"
+        testID="orders-list-row-buy-4"
+        underlayColor="#f3f3f4"
       >
         <View
           accessibilityRole="none"
@@ -7216,7 +5801,7 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 14,
                   "letterSpacing": 0,
@@ -7235,125 +5820,6 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
               }
             }
           >
-            <View
-              style={
-                {
-                  "flex": -1,
-                }
-              }
-              testID="listitemcolumn"
-            >
-              <View
-                onLayout={[Function]}
-                style={
-                  {
-                    "alignSelf": "flex-start",
-                    "position": "relative",
-                  }
-                }
-                testID="badge-wrapper-badge"
-              >
-                <View>
-                  <Image
-                    resizeMode="stretch"
-                    source={1}
-                    style={
-                      {
-                        "height": 28,
-                        "width": 28,
-                      }
-                    }
-                  />
-                </View>
-                <View
-                  style={
-                    {
-                      "alignItems": "center",
-                      "aspectRatio": 1,
-                      "height": 0,
-                      "justifyContent": "center",
-                      "position": "absolute",
-                      "right": 0,
-                      "top": 0,
-                      "transform": [
-                        {
-                          "translateX": 0,
-                        },
-                        {
-                          "translateY": -0,
-                        },
-                      ],
-                    }
-                  }
-                >
-                  <View
-                    onLayout={[Function]}
-                    style={
-                      {
-                        "alignItems": "center",
-                        "aspectRatio": 1,
-                        "height": "50%",
-                        "justifyContent": "center",
-                        "maxHeight": 24,
-                        "minHeight": 8,
-                        "opacity": 0,
-                      }
-                    }
-                    testID="badgenetwork"
-                  >
-                    <View
-                      style={
-                        {
-                          "alignItems": "center",
-                          "backgroundColor": "#ffffff",
-                          "borderColor": "#ffffff",
-                          "borderRadius": 8,
-                          "borderWidth": 2,
-                          "height": 32,
-                          "justifyContent": "center",
-                          "overflow": "hidden",
-                          "shadowColor": "#0000001a",
-                          "shadowOffset": {
-                            "height": 2,
-                            "width": 0,
-                          },
-                          "shadowOpacity": 1,
-                          "shadowRadius": 4,
-                          "transform": [
-                            {
-                              "scale": 1,
-                            },
-                          ],
-                          "width": 32,
-                        }
-                      }
-                    >
-                      <Image
-                        onError={[Function]}
-                        resizeMode="contain"
-                        source={1}
-                        style={
-                          {
-                            "height": 32,
-                            "width": 32,
-                          }
-                        }
-                        testID="network-avatar-image"
-                      />
-                    </View>
-                  </View>
-                </View>
-              </View>
-            </View>
-            <View
-              accessible={false}
-              style={
-                {
-                  "width": 16,
-                }
-              }
-              testID="listitem-gap"
-            />
             <View
               style={
                 {
@@ -7366,7 +5832,7 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -7374,13 +5840,13 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
                   }
                 }
               >
-                Test Provider: Purchased ETH
+                ...: Purchased ETH
               </Text>
               <Text
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#4459ff",
+                    "color": "#457a39",
                     "fontFamily": "Geist-Bold",
                     "fontSize": 14,
                     "letterSpacing": 0,
@@ -7388,7 +5854,7 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
                   }
                 }
               >
-                Pending
+                Completed
               </Text>
             </View>
             <View
@@ -7413,15 +5879,16 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
                     "lineHeight": 24,
                   }
                 }
+                testID="orders-list-crypto-amount-buy-4"
               >
-                0.01231
+                0.5
                  
                 ETH
               </Text>
@@ -7429,15 +5896,16 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 14,
                     "letterSpacing": 0,
                     "lineHeight": 22,
                   }
                 }
+                testID="orders-list-fiat-amount-buy-4"
               >
-                $34.23 
+                $1000 
               </Text>
             </View>
           </View>
@@ -7457,10 +5925,11 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
         style={
           {
             "borderBottomWidth": 0.5,
-            "borderColor": "#b7bbc866",
+            "borderColor": "#b4b4b566",
           }
         }
-        underlayColor="#f3f5f9"
+        testID="orders-list-row-deposit-5"
+        underlayColor="#f3f3f4"
       >
         <View
           accessibilityRole="none"
@@ -7482,7 +5951,7 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 14,
                   "letterSpacing": 0,
@@ -7490,7 +5959,7 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
                 }
               }
             >
-              [missing "en.date.months.NaN" translation] NaN at 12:NaN am
+              Oct 13 at 8:07 pm
             </Text>
           </View>
           <View
@@ -7501,125 +5970,6 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
               }
             }
           >
-            <View
-              style={
-                {
-                  "flex": -1,
-                }
-              }
-              testID="listitemcolumn"
-            >
-              <View
-                onLayout={[Function]}
-                style={
-                  {
-                    "alignSelf": "flex-start",
-                    "position": "relative",
-                  }
-                }
-                testID="badge-wrapper-badge"
-              >
-                <View>
-                  <Image
-                    resizeMode="stretch"
-                    source={1}
-                    style={
-                      {
-                        "height": 28,
-                        "width": 28,
-                      }
-                    }
-                  />
-                </View>
-                <View
-                  style={
-                    {
-                      "alignItems": "center",
-                      "aspectRatio": 1,
-                      "height": 0,
-                      "justifyContent": "center",
-                      "position": "absolute",
-                      "right": 0,
-                      "top": 0,
-                      "transform": [
-                        {
-                          "translateX": 0,
-                        },
-                        {
-                          "translateY": -0,
-                        },
-                      ],
-                    }
-                  }
-                >
-                  <View
-                    onLayout={[Function]}
-                    style={
-                      {
-                        "alignItems": "center",
-                        "aspectRatio": 1,
-                        "height": "50%",
-                        "justifyContent": "center",
-                        "maxHeight": 24,
-                        "minHeight": 8,
-                        "opacity": 0,
-                      }
-                    }
-                    testID="badgenetwork"
-                  >
-                    <View
-                      style={
-                        {
-                          "alignItems": "center",
-                          "backgroundColor": "#ffffff",
-                          "borderColor": "#ffffff",
-                          "borderRadius": 8,
-                          "borderWidth": 2,
-                          "height": 32,
-                          "justifyContent": "center",
-                          "overflow": "hidden",
-                          "shadowColor": "#0000001a",
-                          "shadowOffset": {
-                            "height": 2,
-                            "width": 0,
-                          },
-                          "shadowOpacity": 1,
-                          "shadowRadius": 4,
-                          "transform": [
-                            {
-                              "scale": 1,
-                            },
-                          ],
-                          "width": 32,
-                        }
-                      }
-                    >
-                      <Image
-                        onError={[Function]}
-                        resizeMode="contain"
-                        source={1}
-                        style={
-                          {
-                            "height": 32,
-                            "width": 32,
-                          }
-                        }
-                        testID="network-avatar-image"
-                      />
-                    </View>
-                  </View>
-                </View>
-              </View>
-            </View>
-            <View
-              accessible={false}
-              style={
-                {
-                  "width": 16,
-                }
-              }
-              testID="listitem-gap"
-            />
             <View
               style={
                 {
@@ -7632,7 +5982,7 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -7640,13 +5990,13 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
                   }
                 }
               >
-                Test Provider: Purchased ETH
+                Transak: Purchased USDC
               </Text>
               <Text
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#4459ff",
+                    "color": "#457a39",
                     "fontFamily": "Geist-Bold",
                     "fontSize": 14,
                     "letterSpacing": 0,
@@ -7654,7 +6004,7 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
                   }
                 }
               >
-                Pending
+                Completed
               </Text>
             </View>
             <View
@@ -7679,31 +6029,33 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
                     "lineHeight": 24,
                   }
                 }
+                testID="orders-list-crypto-amount-deposit-5"
               >
-                ...
+                100
                  
-                ETH
+                USDC
               </Text>
               <Text
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 14,
                     "letterSpacing": 0,
                     "lineHeight": 22,
                   }
                 }
+                testID="orders-list-fiat-amount-deposit-5"
               >
-                ...
+                $100 
               </Text>
             </View>
           </View>
@@ -7723,10 +6075,11 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
         style={
           {
             "borderBottomWidth": 0.5,
-            "borderColor": "#b7bbc866",
+            "borderColor": "#b4b4b566",
           }
         }
-        underlayColor="#f3f5f9"
+        testID="orders-list-row-deposit-6"
+        underlayColor="#f3f3f4"
       >
         <View
           accessibilityRole="none"
@@ -7748,7 +6101,7 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 14,
                   "letterSpacing": 0,
@@ -7767,125 +6120,6 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
               }
             }
           >
-            <View
-              style={
-                {
-                  "flex": -1,
-                }
-              }
-              testID="listitemcolumn"
-            >
-              <View
-                onLayout={[Function]}
-                style={
-                  {
-                    "alignSelf": "flex-start",
-                    "position": "relative",
-                  }
-                }
-                testID="badge-wrapper-badge"
-              >
-                <View>
-                  <Image
-                    resizeMode="stretch"
-                    source={1}
-                    style={
-                      {
-                        "height": 28,
-                        "width": 28,
-                      }
-                    }
-                  />
-                </View>
-                <View
-                  style={
-                    {
-                      "alignItems": "center",
-                      "aspectRatio": 1,
-                      "height": 0,
-                      "justifyContent": "center",
-                      "position": "absolute",
-                      "right": 0,
-                      "top": 0,
-                      "transform": [
-                        {
-                          "translateX": 0,
-                        },
-                        {
-                          "translateY": -0,
-                        },
-                      ],
-                    }
-                  }
-                >
-                  <View
-                    onLayout={[Function]}
-                    style={
-                      {
-                        "alignItems": "center",
-                        "aspectRatio": 1,
-                        "height": "50%",
-                        "justifyContent": "center",
-                        "maxHeight": 24,
-                        "minHeight": 8,
-                        "opacity": 0,
-                      }
-                    }
-                    testID="badgenetwork"
-                  >
-                    <View
-                      style={
-                        {
-                          "alignItems": "center",
-                          "backgroundColor": "#ffffff",
-                          "borderColor": "#ffffff",
-                          "borderRadius": 8,
-                          "borderWidth": 2,
-                          "height": 32,
-                          "justifyContent": "center",
-                          "overflow": "hidden",
-                          "shadowColor": "#0000001a",
-                          "shadowOffset": {
-                            "height": 2,
-                            "width": 0,
-                          },
-                          "shadowOpacity": 1,
-                          "shadowRadius": 4,
-                          "transform": [
-                            {
-                              "scale": 1,
-                            },
-                          ],
-                          "width": 32,
-                        }
-                      }
-                    >
-                      <Image
-                        onError={[Function]}
-                        resizeMode="contain"
-                        source={1}
-                        style={
-                          {
-                            "height": 32,
-                            "width": 32,
-                          }
-                        }
-                        testID="network-avatar-image"
-                      />
-                    </View>
-                  </View>
-                </View>
-              </View>
-            </View>
-            <View
-              accessible={false}
-              style={
-                {
-                  "width": 16,
-                }
-              }
-              testID="listitem-gap"
-            />
             <View
               style={
                 {
@@ -7898,7 +6132,7 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -7906,13 +6140,13 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
                   }
                 }
               >
-                USDC Deposit
+                Transak: Purchased USDT
               </Text>
               <Text
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#457a39",
+                    "color": "#131416",
                     "fontFamily": "Geist-Bold",
                     "fontSize": 14,
                     "letterSpacing": 0,
@@ -7920,7 +6154,7 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
                   }
                 }
               >
-                Completed
+                Pending
               </Text>
             </View>
             <View
@@ -7945,31 +6179,33 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
                     "lineHeight": 24,
                   }
                 }
+                testID="orders-list-crypto-amount-deposit-6"
               >
-                100
+                20
                  
-                USDC
+                USDT
               </Text>
               <Text
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 14,
                     "letterSpacing": 0,
                     "lineHeight": 22,
                   }
                 }
+                testID="orders-list-fiat-amount-deposit-6"
               >
-                $100 
+                $20 
               </Text>
             </View>
           </View>
@@ -7989,10 +6225,11 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
         style={
           {
             "borderBottomWidth": 0.5,
-            "borderColor": "#b7bbc866",
+            "borderColor": "#b4b4b566",
           }
         }
-        underlayColor="#f3f5f9"
+        testID="orders-list-row-buy-7"
+        underlayColor="#f3f3f4"
       >
         <View
           accessibilityRole="none"
@@ -8014,7 +6251,7 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 14,
                   "letterSpacing": 0,
@@ -8022,7 +6259,7 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
                 }
               }
             >
-              Oct 13 at 8:07 pm
+              Dec 31 at 7:00 pm
             </Text>
           </View>
           <View
@@ -8033,125 +6270,6 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
               }
             }
           >
-            <View
-              style={
-                {
-                  "flex": -1,
-                }
-              }
-              testID="listitemcolumn"
-            >
-              <View
-                onLayout={[Function]}
-                style={
-                  {
-                    "alignSelf": "flex-start",
-                    "position": "relative",
-                  }
-                }
-                testID="badge-wrapper-badge"
-              >
-                <View>
-                  <Image
-                    resizeMode="stretch"
-                    source={1}
-                    style={
-                      {
-                        "height": 28,
-                        "width": 28,
-                      }
-                    }
-                  />
-                </View>
-                <View
-                  style={
-                    {
-                      "alignItems": "center",
-                      "aspectRatio": 1,
-                      "height": 0,
-                      "justifyContent": "center",
-                      "position": "absolute",
-                      "right": 0,
-                      "top": 0,
-                      "transform": [
-                        {
-                          "translateX": 0,
-                        },
-                        {
-                          "translateY": -0,
-                        },
-                      ],
-                    }
-                  }
-                >
-                  <View
-                    onLayout={[Function]}
-                    style={
-                      {
-                        "alignItems": "center",
-                        "aspectRatio": 1,
-                        "height": "50%",
-                        "justifyContent": "center",
-                        "maxHeight": 24,
-                        "minHeight": 8,
-                        "opacity": 0,
-                      }
-                    }
-                    testID="badgenetwork"
-                  >
-                    <View
-                      style={
-                        {
-                          "alignItems": "center",
-                          "backgroundColor": "#ffffff",
-                          "borderColor": "#ffffff",
-                          "borderRadius": 8,
-                          "borderWidth": 2,
-                          "height": 32,
-                          "justifyContent": "center",
-                          "overflow": "hidden",
-                          "shadowColor": "#0000001a",
-                          "shadowOffset": {
-                            "height": 2,
-                            "width": 0,
-                          },
-                          "shadowOpacity": 1,
-                          "shadowRadius": 4,
-                          "transform": [
-                            {
-                              "scale": 1,
-                            },
-                          ],
-                          "width": 32,
-                        }
-                      }
-                    >
-                      <Image
-                        onError={[Function]}
-                        resizeMode="contain"
-                        source={1}
-                        style={
-                          {
-                            "height": 32,
-                            "width": 32,
-                          }
-                        }
-                        testID="network-avatar-image"
-                      />
-                    </View>
-                  </View>
-                </View>
-              </View>
-            </View>
-            <View
-              accessible={false}
-              style={
-                {
-                  "width": 16,
-                }
-              }
-              testID="listitem-gap"
-            />
             <View
               style={
                 {
@@ -8164,7 +6282,7 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -8172,13 +6290,13 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
                   }
                 }
               >
-                USDT Deposit
+                Test Provider: Purchased ETH
               </Text>
               <Text
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#4459ff",
                     "fontFamily": "Geist-Bold",
                     "fontSize": 14,
                     "letterSpacing": 0,
@@ -8211,31 +6329,33 @@ exports[`OrdersList resets filter to all after other filter was set 2`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
                     "lineHeight": 24,
                   }
                 }
+                testID="orders-list-crypto-amount-buy-7"
               >
-                20
+                0
                  
-                USDT
+                ETH
               </Text>
               <Text
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 14,
                     "letterSpacing": 0,
                     "lineHeight": 22,
                   }
                 }
+                testID="orders-list-fiat-amount-buy-7"
               >
-                $20 
+                ...
               </Text>
             </View>
           </View>
diff --git a/app/components/UI/Ramp/Aggregator/Views/Quotes/__snapshots__/Quotes.test.tsx.snap b/app/components/UI/Ramp/Aggregator/Views/Quotes/__snapshots__/Quotes.test.tsx.snap
index 6aa5b9de2bdc..72c64b7c7fc4 100644
--- a/app/components/UI/Ramp/Aggregator/Views/Quotes/__snapshots__/Quotes.test.tsx.snap
+++ b/app/components/UI/Ramp/Aggregator/Views/Quotes/__snapshots__/Quotes.test.tsx.snap
@@ -24,7 +24,7 @@ exports[`LoadingQuotes component renders correctly 1`] = `
         style={
           [
             {
-              "backgroundColor": "#3c4d9d0f",
+              "backgroundColor": "#b4b4b528",
               "borderRadius": 8,
               "padding": 16,
             },
@@ -66,7 +66,7 @@ exports[`LoadingQuotes component renders correctly 1`] = `
                 style={
                   [
                     {
-                      "backgroundColor": "#858b9a14",
+                      "backgroundColor": "#b4b4b528",
                       "borderRadius": 30,
                       "padding": 14,
                     },
@@ -112,7 +112,7 @@ exports[`LoadingQuotes component renders correctly 1`] = `
                 style={
                   [
                     {
-                      "backgroundColor": "#858b9a14",
+                      "backgroundColor": "#b4b4b528",
                       "borderRadius": 30,
                       "padding": 14,
                     },
@@ -167,7 +167,7 @@ exports[`LoadingQuotes component renders correctly 1`] = `
                 style={
                   [
                     {
-                      "backgroundColor": "#858b9a14",
+                      "backgroundColor": "#b4b4b528",
                       "borderRadius": 30,
                       "padding": 14,
                     },
@@ -213,7 +213,7 @@ exports[`LoadingQuotes component renders correctly 1`] = `
                 style={
                   [
                     {
-                      "backgroundColor": "#858b9a14",
+                      "backgroundColor": "#b4b4b528",
                       "borderRadius": 30,
                       "padding": 14,
                     },
@@ -264,7 +264,7 @@ exports[`LoadingQuotes component renders correctly 1`] = `
         style={
           [
             {
-              "backgroundColor": "#3c4d9d0f",
+              "backgroundColor": "#b4b4b528",
               "borderRadius": 8,
               "padding": 16,
             },
@@ -306,7 +306,7 @@ exports[`LoadingQuotes component renders correctly 1`] = `
                 style={
                   [
                     {
-                      "backgroundColor": "#858b9a14",
+                      "backgroundColor": "#b4b4b528",
                       "borderRadius": 30,
                       "padding": 14,
                     },
@@ -352,7 +352,7 @@ exports[`LoadingQuotes component renders correctly 1`] = `
                 style={
                   [
                     {
-                      "backgroundColor": "#858b9a14",
+                      "backgroundColor": "#b4b4b528",
                       "borderRadius": 30,
                       "padding": 14,
                     },
@@ -401,7 +401,7 @@ exports[`LoadingQuotes component renders correctly 1`] = `
         style={
           [
             {
-              "backgroundColor": "#3c4d9d0f",
+              "backgroundColor": "#b4b4b528",
               "borderRadius": 8,
               "padding": 16,
             },
@@ -443,7 +443,7 @@ exports[`LoadingQuotes component renders correctly 1`] = `
                 style={
                   [
                     {
-                      "backgroundColor": "#858b9a14",
+                      "backgroundColor": "#b4b4b528",
                       "borderRadius": 30,
                       "padding": 14,
                     },
@@ -489,7 +489,7 @@ exports[`LoadingQuotes component renders correctly 1`] = `
                 style={
                   [
                     {
-                      "backgroundColor": "#858b9a14",
+                      "backgroundColor": "#b4b4b528",
                       "borderRadius": 30,
                       "padding": 14,
                     },
@@ -638,7 +638,7 @@ exports[`Quotes custom action renders correctly after animation with the recomme
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -679,7 +679,7 @@ exports[`Quotes custom action renders correctly after animation with the recomme
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -905,7 +905,7 @@ exports[`Quotes custom action renders correctly after animation with the recomme
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -955,7 +955,7 @@ exports[`Quotes custom action renders correctly after animation with the recomme
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -992,7 +992,7 @@ exports[`Quotes custom action renders correctly after animation with the recomme
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -1052,7 +1052,7 @@ exports[`Quotes custom action renders correctly after animation with the recomme
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 16,
                                         "fontWeight": 400,
@@ -1130,7 +1130,7 @@ exports[`Quotes custom action renders correctly after animation with the recomme
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "height": 24,
                                           "width": 24,
                                         },
@@ -1147,7 +1147,7 @@ exports[`Quotes custom action renders correctly after animation with the recomme
                               {
                                 "alignItems": "center",
                                 "alignSelf": "center",
-                                "backgroundColor": "#3c4d9d0f",
+                                "backgroundColor": "#b4b4b528",
                                 "borderRadius": 20,
                                 "flexDirection": "row",
                                 "marginBottom": 8,
@@ -1160,7 +1160,7 @@ exports[`Quotes custom action renders correctly after animation with the recomme
                               style={
                                 [
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 30,
                                     "marginVertical": 2,
@@ -1178,7 +1178,7 @@ exports[`Quotes custom action renders correctly after animation with the recomme
                                   undefined,
                                   undefined,
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                   },
                                   undefined,
                                   undefined,
@@ -1202,7 +1202,7 @@ exports[`Quotes custom action renders correctly after animation with the recomme
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 30,
                                       "marginVertical": 2,
@@ -1220,7 +1220,7 @@ exports[`Quotes custom action renders correctly after animation with the recomme
                                     undefined,
                                     undefined,
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                     },
                                     undefined,
                                     undefined,
@@ -1292,7 +1292,7 @@ exports[`Quotes custom action renders correctly after animation with the recomme
                                       style={
                                         [
                                           {
-                                            "backgroundColor": "#3c4d9d0f",
+                                            "backgroundColor": "#b4b4b528",
                                             "borderRadius": 8,
                                             "padding": 16,
                                           },
@@ -1357,7 +1357,7 @@ exports[`Quotes custom action renders correctly after animation with the recomme
                                                       "fontSize": 12,
                                                     },
                                                     {
-                                                      "color": "#686e7d",
+                                                      "color": "#66676a",
                                                       "marginLeft": 8,
                                                     },
                                                     {
@@ -1422,7 +1422,7 @@ exports[`Quotes custom action renders correctly after animation with the recomme
                                                   {
                                                     "alignItems": "center",
                                                     "alignSelf": "stretch",
-                                                    "backgroundColor": "#121314",
+                                                    "backgroundColor": "#131416",
                                                     "borderRadius": 12,
                                                     "flexDirection": "row",
                                                     "height": 48,
@@ -1638,7 +1638,7 @@ exports[`Quotes renders animation on first fetching 1`] = `
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -1679,7 +1679,7 @@ exports[`Quotes renders animation on first fetching 1`] = `
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -1905,7 +1905,7 @@ exports[`Quotes renders animation on first fetching 1`] = `
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -1955,7 +1955,7 @@ exports[`Quotes renders animation on first fetching 1`] = `
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -1992,7 +1992,7 @@ exports[`Quotes renders animation on first fetching 1`] = `
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -2022,7 +2022,7 @@ exports[`Quotes renders animation on first fetching 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Bold",
                                     "fontSize": 18,
                                     "letterSpacing": 0,
@@ -2675,7 +2675,7 @@ exports[`Quotes renders correctly after animation with expanded quotes 2`] = `
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -2716,7 +2716,7 @@ exports[`Quotes renders correctly after animation with expanded quotes 2`] = `
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -2942,7 +2942,7 @@ exports[`Quotes renders correctly after animation with expanded quotes 2`] = `
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -2992,7 +2992,7 @@ exports[`Quotes renders correctly after animation with expanded quotes 2`] = `
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -3070,7 +3070,7 @@ exports[`Quotes renders correctly after animation with expanded quotes 2`] = `
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 16,
                                         "fontWeight": 400,
@@ -3148,7 +3148,7 @@ exports[`Quotes renders correctly after animation with expanded quotes 2`] = `
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "height": 24,
                                           "width": 24,
                                         },
@@ -3202,7 +3202,7 @@ exports[`Quotes renders correctly after animation with expanded quotes 2`] = `
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 20,
                                       "flexDirection": "row",
                                       "marginBottom": 8,
@@ -3215,7 +3215,7 @@ exports[`Quotes renders correctly after animation with expanded quotes 2`] = `
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 30,
                                           "marginVertical": 2,
@@ -3233,7 +3233,7 @@ exports[`Quotes renders correctly after animation with expanded quotes 2`] = `
                                         undefined,
                                         undefined,
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                         },
                                         undefined,
                                         undefined,
@@ -3257,7 +3257,7 @@ exports[`Quotes renders correctly after animation with expanded quotes 2`] = `
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 30,
                                             "marginVertical": 2,
@@ -3275,7 +3275,7 @@ exports[`Quotes renders correctly after animation with expanded quotes 2`] = `
                                           undefined,
                                           undefined,
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                           },
                                           undefined,
                                           undefined,
@@ -3322,7 +3322,7 @@ exports[`Quotes renders correctly after animation with expanded quotes 2`] = `
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 30,
                                           "marginVertical": 2,
@@ -3336,7 +3336,7 @@ exports[`Quotes renders correctly after animation with expanded quotes 2`] = `
                                         undefined,
                                         undefined,
                                         {
-                                          "color": "#686e7d",
+                                          "color": "#66676a",
                                         },
                                         undefined,
                                         undefined,
@@ -3377,7 +3377,7 @@ exports[`Quotes renders correctly after animation with expanded quotes 2`] = `
                                   style={
                                     [
                                       {
-                                        "backgroundColor": "#b7bbc8",
+                                        "backgroundColor": "#949596",
                                         "height": 1,
                                         "width": "100%",
                                       },
@@ -3438,7 +3438,7 @@ exports[`Quotes renders correctly after animation with expanded quotes 2`] = `
                                               style={
                                                 [
                                                   {
-                                                    "backgroundColor": "#3c4d9d0f",
+                                                    "backgroundColor": "#b4b4b528",
                                                     "borderRadius": 8,
                                                     "padding": 16,
                                                   },
@@ -3549,7 +3549,7 @@ exports[`Quotes renders correctly after animation with expanded quotes 2`] = `
                                                               "fontSize": 12,
                                                             },
                                                             {
-                                                              "color": "#686e7d",
+                                                              "color": "#66676a",
                                                               "marginLeft": 8,
                                                             },
                                                             {
@@ -3586,9 +3586,9 @@ exports[`Quotes renders correctly after animation with expanded quotes 2`] = `
                                                       accessibilityRole="text"
                                                       style={
                                                         {
-                                                          "color": "#121314",
+                                                          "color": "#131416",
                                                           "fontFamily": "Geist-Medium",
-                                                          "fontSize": 18,
+                                                          "fontSize": 20,
                                                           "letterSpacing": 0,
                                                           "lineHeight": 24,
                                                         }
@@ -3620,9 +3620,9 @@ exports[`Quotes renders correctly after animation with expanded quotes 2`] = `
                                                       accessibilityRole="text"
                                                       style={
                                                         {
-                                                          "color": "#121314",
+                                                          "color": "#131416",
                                                           "fontFamily": "Geist-Medium",
-                                                          "fontSize": 18,
+                                                          "fontSize": 20,
                                                           "letterSpacing": 0,
                                                           "lineHeight": 24,
                                                         }
@@ -3675,7 +3675,7 @@ exports[`Quotes renders correctly after animation with expanded quotes 2`] = `
                                                           {
                                                             "alignItems": "center",
                                                             "alignSelf": "stretch",
-                                                            "backgroundColor": "#121314",
+                                                            "backgroundColor": "#131416",
                                                             "borderRadius": 12,
                                                             "flexDirection": "row",
                                                             "height": 48,
@@ -3740,7 +3740,7 @@ exports[`Quotes renders correctly after animation with expanded quotes 2`] = `
                                               style={
                                                 [
                                                   {
-                                                    "backgroundColor": "#3c4d9d0f",
+                                                    "backgroundColor": "#b4b4b528",
                                                     "borderRadius": 8,
                                                     "padding": 16,
                                                   },
@@ -3880,7 +3880,7 @@ exports[`Quotes renders correctly after animation with expanded quotes 2`] = `
                                                               "fontSize": 12,
                                                             },
                                                             {
-                                                              "color": "#686e7d",
+                                                              "color": "#66676a",
                                                               "marginLeft": 8,
                                                             },
                                                             {
@@ -3917,9 +3917,9 @@ exports[`Quotes renders correctly after animation with expanded quotes 2`] = `
                                                       accessibilityRole="text"
                                                       style={
                                                         {
-                                                          "color": "#121314",
+                                                          "color": "#131416",
                                                           "fontFamily": "Geist-Medium",
-                                                          "fontSize": 18,
+                                                          "fontSize": 20,
                                                           "letterSpacing": 0,
                                                           "lineHeight": 24,
                                                         }
@@ -3951,9 +3951,9 @@ exports[`Quotes renders correctly after animation with expanded quotes 2`] = `
                                                       accessibilityRole="text"
                                                       style={
                                                         {
-                                                          "color": "#121314",
+                                                          "color": "#131416",
                                                           "fontFamily": "Geist-Medium",
-                                                          "fontSize": 18,
+                                                          "fontSize": 20,
                                                           "letterSpacing": 0,
                                                           "lineHeight": 24,
                                                         }
@@ -4006,7 +4006,7 @@ exports[`Quotes renders correctly after animation with expanded quotes 2`] = `
                                                           {
                                                             "alignItems": "center",
                                                             "alignSelf": "stretch",
-                                                            "backgroundColor": "#121314",
+                                                            "backgroundColor": "#131416",
                                                             "borderRadius": 12,
                                                             "flexDirection": "row",
                                                             "height": 48,
@@ -4071,7 +4071,7 @@ exports[`Quotes renders correctly after animation with expanded quotes 2`] = `
                                               style={
                                                 [
                                                   {
-                                                    "backgroundColor": "#3c4d9d0f",
+                                                    "backgroundColor": "#b4b4b528",
                                                     "borderRadius": 8,
                                                     "padding": 16,
                                                   },
@@ -4136,7 +4136,7 @@ exports[`Quotes renders correctly after animation with expanded quotes 2`] = `
                                                               "fontSize": 12,
                                                             },
                                                             {
-                                                              "color": "#686e7d",
+                                                              "color": "#66676a",
                                                               "marginLeft": 8,
                                                             },
                                                             {
@@ -4173,9 +4173,9 @@ exports[`Quotes renders correctly after animation with expanded quotes 2`] = `
                                                       accessibilityRole="text"
                                                       style={
                                                         {
-                                                          "color": "#121314",
+                                                          "color": "#131416",
                                                           "fontFamily": "Geist-Medium",
-                                                          "fontSize": 18,
+                                                          "fontSize": 20,
                                                           "letterSpacing": 0,
                                                           "lineHeight": 24,
                                                         }
@@ -4207,9 +4207,9 @@ exports[`Quotes renders correctly after animation with expanded quotes 2`] = `
                                                       accessibilityRole="text"
                                                       style={
                                                         {
-                                                          "color": "#121314",
+                                                          "color": "#131416",
                                                           "fontFamily": "Geist-Medium",
-                                                          "fontSize": 18,
+                                                          "fontSize": 20,
                                                           "letterSpacing": 0,
                                                           "lineHeight": 24,
                                                         }
@@ -4262,7 +4262,7 @@ exports[`Quotes renders correctly after animation with expanded quotes 2`] = `
                                                           {
                                                             "alignItems": "center",
                                                             "alignSelf": "stretch",
-                                                            "backgroundColor": "#121314",
+                                                            "backgroundColor": "#131416",
                                                             "borderRadius": 12,
                                                             "flexDirection": "row",
                                                             "height": 48,
@@ -4433,7 +4433,7 @@ exports[`Quotes renders correctly after animation with the recommended quote 1`]
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -4474,7 +4474,7 @@ exports[`Quotes renders correctly after animation with the recommended quote 1`]
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -4700,7 +4700,7 @@ exports[`Quotes renders correctly after animation with the recommended quote 1`]
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -4750,7 +4750,7 @@ exports[`Quotes renders correctly after animation with the recommended quote 1`]
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -4787,7 +4787,7 @@ exports[`Quotes renders correctly after animation with the recommended quote 1`]
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -4847,7 +4847,7 @@ exports[`Quotes renders correctly after animation with the recommended quote 1`]
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 16,
                                         "fontWeight": 400,
@@ -4925,7 +4925,7 @@ exports[`Quotes renders correctly after animation with the recommended quote 1`]
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "height": 24,
                                           "width": 24,
                                         },
@@ -4942,7 +4942,7 @@ exports[`Quotes renders correctly after animation with the recommended quote 1`]
                               {
                                 "alignItems": "center",
                                 "alignSelf": "center",
-                                "backgroundColor": "#3c4d9d0f",
+                                "backgroundColor": "#b4b4b528",
                                 "borderRadius": 20,
                                 "flexDirection": "row",
                                 "marginBottom": 8,
@@ -4955,7 +4955,7 @@ exports[`Quotes renders correctly after animation with the recommended quote 1`]
                               style={
                                 [
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 30,
                                     "marginVertical": 2,
@@ -4973,7 +4973,7 @@ exports[`Quotes renders correctly after animation with the recommended quote 1`]
                                   undefined,
                                   undefined,
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                   },
                                   undefined,
                                   undefined,
@@ -4997,7 +4997,7 @@ exports[`Quotes renders correctly after animation with the recommended quote 1`]
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 30,
                                       "marginVertical": 2,
@@ -5015,7 +5015,7 @@ exports[`Quotes renders correctly after animation with the recommended quote 1`]
                                     undefined,
                                     undefined,
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                     },
                                     undefined,
                                     undefined,
@@ -5097,7 +5097,7 @@ exports[`Quotes renders correctly after animation with the recommended quote 1`]
                                         style={
                                           [
                                             {
-                                              "backgroundColor": "#3c4d9d0f",
+                                              "backgroundColor": "#b4b4b528",
                                               "borderRadius": 8,
                                               "padding": 16,
                                             },
@@ -5240,7 +5240,7 @@ exports[`Quotes renders correctly after animation with the recommended quote 1`]
                                                         "fontSize": 12,
                                                       },
                                                       {
-                                                        "color": "#686e7d",
+                                                        "color": "#66676a",
                                                         "marginLeft": 8,
                                                       },
                                                       {
@@ -5277,9 +5277,9 @@ exports[`Quotes renders correctly after animation with the recommended quote 1`]
                                                 accessibilityRole="text"
                                                 style={
                                                   {
-                                                    "color": "#121314",
+                                                    "color": "#131416",
                                                     "fontFamily": "Geist-Medium",
-                                                    "fontSize": 18,
+                                                    "fontSize": 20,
                                                     "letterSpacing": 0,
                                                     "lineHeight": 24,
                                                   }
@@ -5311,9 +5311,9 @@ exports[`Quotes renders correctly after animation with the recommended quote 1`]
                                                 accessibilityRole="text"
                                                 style={
                                                   {
-                                                    "color": "#121314",
+                                                    "color": "#131416",
                                                     "fontFamily": "Geist-Medium",
-                                                    "fontSize": 18,
+                                                    "fontSize": 20,
                                                     "letterSpacing": 0,
                                                     "lineHeight": 24,
                                                   }
@@ -5366,7 +5366,7 @@ exports[`Quotes renders correctly after animation with the recommended quote 1`]
                                                     {
                                                       "alignItems": "center",
                                                       "alignSelf": "stretch",
-                                                      "backgroundColor": "#121314",
+                                                      "backgroundColor": "#131416",
                                                       "borderRadius": 12,
                                                       "flexDirection": "row",
                                                       "height": 48,
@@ -5583,7 +5583,7 @@ exports[`Quotes renders correctly after animation without quotes 1`] = `
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -5624,7 +5624,7 @@ exports[`Quotes renders correctly after animation without quotes 1`] = `
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -5850,7 +5850,7 @@ exports[`Quotes renders correctly after animation without quotes 1`] = `
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -5900,7 +5900,7 @@ exports[`Quotes renders correctly after animation without quotes 1`] = `
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -5937,7 +5937,7 @@ exports[`Quotes renders correctly after animation without quotes 1`] = `
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -6013,7 +6013,7 @@ exports[`Quotes renders correctly after animation without quotes 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 18,
                                       "letterSpacing": 0,
@@ -6037,7 +6037,7 @@ exports[`Quotes renders correctly after animation without quotes 1`] = `
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 30,
                                         "marginVertical": 2,
@@ -6051,7 +6051,7 @@ exports[`Quotes renders correctly after animation without quotes 1`] = `
                                       undefined,
                                       undefined,
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                       },
                                       undefined,
                                       undefined,
@@ -6094,7 +6094,7 @@ exports[`Quotes renders correctly after animation without quotes 1`] = `
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "stretch",
-                                      "backgroundColor": "#121314",
+                                      "backgroundColor": "#131416",
                                       "borderRadius": 12,
                                       "flexDirection": "row",
                                       "height": 48,
@@ -6254,7 +6254,7 @@ exports[`Quotes renders correctly when fetching quotes errors 1`] = `
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -6295,7 +6295,7 @@ exports[`Quotes renders correctly when fetching quotes errors 1`] = `
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -6521,7 +6521,7 @@ exports[`Quotes renders correctly when fetching quotes errors 1`] = `
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -6571,7 +6571,7 @@ exports[`Quotes renders correctly when fetching quotes errors 1`] = `
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -6608,7 +6608,7 @@ exports[`Quotes renders correctly when fetching quotes errors 1`] = `
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -6684,7 +6684,7 @@ exports[`Quotes renders correctly when fetching quotes errors 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 18,
                                       "letterSpacing": 0,
@@ -6708,7 +6708,7 @@ exports[`Quotes renders correctly when fetching quotes errors 1`] = `
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 30,
                                         "marginVertical": 2,
@@ -6722,7 +6722,7 @@ exports[`Quotes renders correctly when fetching quotes errors 1`] = `
                                       undefined,
                                       undefined,
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                       },
                                       undefined,
                                       undefined,
@@ -6765,7 +6765,7 @@ exports[`Quotes renders correctly when fetching quotes errors 1`] = `
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "stretch",
-                                      "backgroundColor": "#121314",
+                                      "backgroundColor": "#131416",
                                       "borderRadius": 12,
                                       "flexDirection": "row",
                                       "height": 48,
@@ -6925,7 +6925,7 @@ exports[`Quotes renders correctly with sdkError 1`] = `
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -6966,7 +6966,7 @@ exports[`Quotes renders correctly with sdkError 1`] = `
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -7192,7 +7192,7 @@ exports[`Quotes renders correctly with sdkError 1`] = `
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -7242,7 +7242,7 @@ exports[`Quotes renders correctly with sdkError 1`] = `
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -7279,7 +7279,7 @@ exports[`Quotes renders correctly with sdkError 1`] = `
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -7355,7 +7355,7 @@ exports[`Quotes renders correctly with sdkError 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 18,
                                       "letterSpacing": 0,
@@ -7379,7 +7379,7 @@ exports[`Quotes renders correctly with sdkError 1`] = `
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 30,
                                         "marginVertical": 2,
@@ -7393,7 +7393,7 @@ exports[`Quotes renders correctly with sdkError 1`] = `
                                       undefined,
                                       undefined,
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                       },
                                       undefined,
                                       undefined,
@@ -7436,7 +7436,7 @@ exports[`Quotes renders correctly with sdkError 1`] = `
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "stretch",
-                                      "backgroundColor": "#121314",
+                                      "backgroundColor": "#131416",
                                       "borderRadius": 12,
                                       "flexDirection": "row",
                                       "height": 48,
@@ -7596,7 +7596,7 @@ exports[`Quotes renders quotes expired screen 1`] = `
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -7637,7 +7637,7 @@ exports[`Quotes renders quotes expired screen 1`] = `
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -7863,7 +7863,7 @@ exports[`Quotes renders quotes expired screen 1`] = `
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -7913,7 +7913,7 @@ exports[`Quotes renders quotes expired screen 1`] = `
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -7950,7 +7950,7 @@ exports[`Quotes renders quotes expired screen 1`] = `
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -8026,7 +8026,7 @@ exports[`Quotes renders quotes expired screen 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 18,
                                       "letterSpacing": 0,
@@ -8050,7 +8050,7 @@ exports[`Quotes renders quotes expired screen 1`] = `
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 30,
                                         "marginVertical": 2,
@@ -8064,7 +8064,7 @@ exports[`Quotes renders quotes expired screen 1`] = `
                                       undefined,
                                       undefined,
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                       },
                                       undefined,
                                       undefined,
@@ -8107,7 +8107,7 @@ exports[`Quotes renders quotes expired screen 1`] = `
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "stretch",
-                                      "backgroundColor": "#121314",
+                                      "backgroundColor": "#131416",
                                       "borderRadius": 12,
                                       "flexDirection": "row",
                                       "height": 48,
@@ -8156,7 +8156,7 @@ exports[`Timer component renders correctly with isFetchingQuotes=false, pollingC
     {
       "alignItems": "center",
       "alignSelf": "center",
-      "backgroundColor": "#3c4d9d0f",
+      "backgroundColor": "#b4b4b528",
       "borderRadius": 20,
       "flexDirection": "row",
       "marginBottom": 8,
@@ -8169,7 +8169,7 @@ exports[`Timer component renders correctly with isFetchingQuotes=false, pollingC
     style={
       [
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 30,
           "marginVertical": 2,
@@ -8187,7 +8187,7 @@ exports[`Timer component renders correctly with isFetchingQuotes=false, pollingC
         undefined,
         undefined,
         {
-          "color": "#121314",
+          "color": "#131416",
         },
         undefined,
         undefined,
@@ -8211,7 +8211,7 @@ exports[`Timer component renders correctly with isFetchingQuotes=false, pollingC
       style={
         [
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 30,
             "marginVertical": 2,
@@ -8229,7 +8229,7 @@ exports[`Timer component renders correctly with isFetchingQuotes=false, pollingC
           undefined,
           undefined,
           {
-            "color": "#121314",
+            "color": "#131416",
           },
           undefined,
           undefined,
@@ -8266,7 +8266,7 @@ exports[`Timer component renders correctly with isFetchingQuotes=false, pollingC
     {
       "alignItems": "center",
       "alignSelf": "center",
-      "backgroundColor": "#3c4d9d0f",
+      "backgroundColor": "#b4b4b528",
       "borderRadius": 20,
       "flexDirection": "row",
       "marginBottom": 8,
@@ -8279,7 +8279,7 @@ exports[`Timer component renders correctly with isFetchingQuotes=false, pollingC
     style={
       [
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 30,
           "marginVertical": 2,
@@ -8297,7 +8297,7 @@ exports[`Timer component renders correctly with isFetchingQuotes=false, pollingC
         undefined,
         undefined,
         {
-          "color": "#121314",
+          "color": "#131416",
         },
         undefined,
         undefined,
@@ -8321,7 +8321,7 @@ exports[`Timer component renders correctly with isFetchingQuotes=false, pollingC
       style={
         [
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 30,
             "marginVertical": 2,
@@ -8339,7 +8339,7 @@ exports[`Timer component renders correctly with isFetchingQuotes=false, pollingC
           undefined,
           undefined,
           {
-            "color": "#121314",
+            "color": "#131416",
           },
           undefined,
           undefined,
@@ -8376,7 +8376,7 @@ exports[`Timer component renders correctly with isFetchingQuotes=false, pollingC
     {
       "alignItems": "center",
       "alignSelf": "center",
-      "backgroundColor": "#3c4d9d0f",
+      "backgroundColor": "#b4b4b528",
       "borderRadius": 20,
       "flexDirection": "row",
       "marginBottom": 8,
@@ -8389,7 +8389,7 @@ exports[`Timer component renders correctly with isFetchingQuotes=false, pollingC
     style={
       [
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 30,
           "marginVertical": 2,
@@ -8407,7 +8407,7 @@ exports[`Timer component renders correctly with isFetchingQuotes=false, pollingC
         undefined,
         undefined,
         {
-          "color": "#121314",
+          "color": "#131416",
         },
         undefined,
         undefined,
@@ -8431,7 +8431,7 @@ exports[`Timer component renders correctly with isFetchingQuotes=false, pollingC
       style={
         [
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 30,
             "marginVertical": 2,
@@ -8449,7 +8449,7 @@ exports[`Timer component renders correctly with isFetchingQuotes=false, pollingC
           undefined,
           undefined,
           {
-            "color": "#121314",
+            "color": "#131416",
           },
           undefined,
           undefined,
@@ -8486,7 +8486,7 @@ exports[`Timer component renders correctly with isFetchingQuotes=false, pollingC
     {
       "alignItems": "center",
       "alignSelf": "center",
-      "backgroundColor": "#3c4d9d0f",
+      "backgroundColor": "#b4b4b528",
       "borderRadius": 20,
       "flexDirection": "row",
       "marginBottom": 8,
@@ -8499,7 +8499,7 @@ exports[`Timer component renders correctly with isFetchingQuotes=false, pollingC
     style={
       [
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 30,
           "marginVertical": 2,
@@ -8517,7 +8517,7 @@ exports[`Timer component renders correctly with isFetchingQuotes=false, pollingC
         undefined,
         undefined,
         {
-          "color": "#121314",
+          "color": "#131416",
         },
         undefined,
         undefined,
@@ -8541,7 +8541,7 @@ exports[`Timer component renders correctly with isFetchingQuotes=false, pollingC
       style={
         [
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 30,
             "marginVertical": 2,
@@ -8559,7 +8559,7 @@ exports[`Timer component renders correctly with isFetchingQuotes=false, pollingC
           undefined,
           undefined,
           {
-            "color": "#121314",
+            "color": "#131416",
           },
           undefined,
           undefined,
@@ -8596,7 +8596,7 @@ exports[`Timer component renders correctly with isFetchingQuotes=false, pollingC
     {
       "alignItems": "center",
       "alignSelf": "center",
-      "backgroundColor": "#3c4d9d0f",
+      "backgroundColor": "#b4b4b528",
       "borderRadius": 20,
       "flexDirection": "row",
       "marginBottom": 8,
@@ -8609,7 +8609,7 @@ exports[`Timer component renders correctly with isFetchingQuotes=false, pollingC
     style={
       [
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 30,
           "marginVertical": 2,
@@ -8627,7 +8627,7 @@ exports[`Timer component renders correctly with isFetchingQuotes=false, pollingC
         undefined,
         undefined,
         {
-          "color": "#121314",
+          "color": "#131416",
         },
         undefined,
         undefined,
@@ -8651,7 +8651,7 @@ exports[`Timer component renders correctly with isFetchingQuotes=false, pollingC
       style={
         [
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 30,
             "marginVertical": 2,
@@ -8669,7 +8669,7 @@ exports[`Timer component renders correctly with isFetchingQuotes=false, pollingC
           undefined,
           undefined,
           {
-            "color": "#121314",
+            "color": "#131416",
           },
           undefined,
           undefined,
@@ -8706,7 +8706,7 @@ exports[`Timer component renders correctly with isFetchingQuotes=true, pollingCy
     {
       "alignItems": "center",
       "alignSelf": "center",
-      "backgroundColor": "#3c4d9d0f",
+      "backgroundColor": "#b4b4b528",
       "borderRadius": 20,
       "flexDirection": "row",
       "marginBottom": 8,
@@ -8722,7 +8722,7 @@ exports[`Timer component renders correctly with isFetchingQuotes=true, pollingCy
     style={
       [
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 30,
           "marginVertical": 2,
@@ -8766,7 +8766,7 @@ exports[`Timer component renders correctly with isFetchingQuotes=true, pollingCy
     {
       "alignItems": "center",
       "alignSelf": "center",
-      "backgroundColor": "#3c4d9d0f",
+      "backgroundColor": "#b4b4b528",
       "borderRadius": 20,
       "flexDirection": "row",
       "marginBottom": 8,
@@ -8782,7 +8782,7 @@ exports[`Timer component renders correctly with isFetchingQuotes=true, pollingCy
     style={
       [
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 30,
           "marginVertical": 2,
@@ -8826,7 +8826,7 @@ exports[`Timer component renders correctly with isFetchingQuotes=true, pollingCy
     {
       "alignItems": "center",
       "alignSelf": "center",
-      "backgroundColor": "#3c4d9d0f",
+      "backgroundColor": "#b4b4b528",
       "borderRadius": 20,
       "flexDirection": "row",
       "marginBottom": 8,
@@ -8842,7 +8842,7 @@ exports[`Timer component renders correctly with isFetchingQuotes=true, pollingCy
     style={
       [
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 30,
           "marginVertical": 2,
@@ -8886,7 +8886,7 @@ exports[`Timer component renders correctly with isFetchingQuotes=true, pollingCy
     {
       "alignItems": "center",
       "alignSelf": "center",
-      "backgroundColor": "#3c4d9d0f",
+      "backgroundColor": "#b4b4b528",
       "borderRadius": 20,
       "flexDirection": "row",
       "marginBottom": 8,
@@ -8902,7 +8902,7 @@ exports[`Timer component renders correctly with isFetchingQuotes=true, pollingCy
     style={
       [
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 30,
           "marginVertical": 2,
diff --git a/app/components/UI/Ramp/Aggregator/Views/SendTransaction/__snapshots__/SendTransaction.test.tsx.snap b/app/components/UI/Ramp/Aggregator/Views/SendTransaction/__snapshots__/SendTransaction.test.tsx.snap
index 5215dee5e6bb..5c0cfecdab8e 100644
--- a/app/components/UI/Ramp/Aggregator/Views/SendTransaction/__snapshots__/SendTransaction.test.tsx.snap
+++ b/app/components/UI/Ramp/Aggregator/Views/SendTransaction/__snapshots__/SendTransaction.test.tsx.snap
@@ -117,7 +117,7 @@ exports[`SendTransaction View renders correctly 1`] = `
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -158,7 +158,7 @@ exports[`SendTransaction View renders correctly 1`] = `
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -445,9 +445,9 @@ exports[`SendTransaction View renders correctly 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
-                                        "fontSize": 18,
+                                        "fontSize": 20,
                                         "fontWeight": "normal",
                                         "letterSpacing": 0,
                                         "lineHeight": 24,
@@ -460,9 +460,9 @@ exports[`SendTransaction View renders correctly 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
-                                        "fontSize": 18,
+                                        "fontSize": 20,
                                         "letterSpacing": 0,
                                         "lineHeight": 24,
                                       }
@@ -499,9 +499,9 @@ exports[`SendTransaction View renders correctly 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
-                                        "fontSize": 18,
+                                        "fontSize": 20,
                                         "letterSpacing": 0,
                                         "lineHeight": 24,
                                       }
@@ -524,7 +524,7 @@ exports[`SendTransaction View renders correctly 1`] = `
                                 }
                               >
                                 <SvgMock
-                                  color="#686e7d"
+                                  color="#66676a"
                                   fill="currentColor"
                                   height={24}
                                   name="Arrow2Down"
@@ -576,7 +576,7 @@ exports[`SendTransaction View renders correctly 1`] = `
                                 }
                               >
                                 <SvgMock
-                                  color="#686e7d"
+                                  color="#66676a"
                                   fill="currentColor"
                                   height={24}
                                   name="Arrow2Down"
@@ -617,7 +617,7 @@ exports[`SendTransaction View renders correctly 1`] = `
                                     style={
                                       [
                                         {
-                                          "color": "#686e7d",
+                                          "color": "#66676a",
                                           "fontSize": 20,
                                         },
                                         undefined,
@@ -636,9 +636,9 @@ exports[`SendTransaction View renders correctly 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
-                                        "fontSize": 18,
+                                        "fontSize": 20,
                                         "fontWeight": "normal",
                                         "letterSpacing": 0,
                                         "lineHeight": 24,
@@ -683,7 +683,7 @@ exports[`SendTransaction View renders correctly 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -719,7 +719,7 @@ exports[`SendTransaction View renders correctly 1`] = `
                                   {
                                     "alignItems": "center",
                                     "alignSelf": "stretch",
-                                    "backgroundColor": "#121314",
+                                    "backgroundColor": "#131416",
                                     "borderRadius": 12,
                                     "flexDirection": "row",
                                     "height": 48,
@@ -735,7 +735,7 @@ exports[`SendTransaction View renders correctly 1`] = `
                                     {
                                       "color": "#ffffff",
                                       "fontFamily": "Geist-Medium",
-                                      "fontSize": 18,
+                                      "fontSize": 20,
                                       "letterSpacing": 0,
                                       "lineHeight": 24,
                                     }
@@ -878,7 +878,7 @@ exports[`SendTransaction View renders correctly for custom action payment method
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -919,7 +919,7 @@ exports[`SendTransaction View renders correctly for custom action payment method
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -1206,9 +1206,9 @@ exports[`SendTransaction View renders correctly for custom action payment method
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
-                                        "fontSize": 18,
+                                        "fontSize": 20,
                                         "fontWeight": "normal",
                                         "letterSpacing": 0,
                                         "lineHeight": 24,
@@ -1221,9 +1221,9 @@ exports[`SendTransaction View renders correctly for custom action payment method
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
-                                        "fontSize": 18,
+                                        "fontSize": 20,
                                         "letterSpacing": 0,
                                         "lineHeight": 24,
                                       }
@@ -1264,9 +1264,9 @@ exports[`SendTransaction View renders correctly for custom action payment method
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
-                                        "fontSize": 18,
+                                        "fontSize": 20,
                                         "letterSpacing": 0,
                                         "lineHeight": 24,
                                       }
@@ -1289,7 +1289,7 @@ exports[`SendTransaction View renders correctly for custom action payment method
                                 }
                               >
                                 <SvgMock
-                                  color="#686e7d"
+                                  color="#66676a"
                                   fill="currentColor"
                                   height={24}
                                   name="Arrow2Down"
@@ -1362,7 +1362,7 @@ exports[`SendTransaction View renders correctly for custom action payment method
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -1398,7 +1398,7 @@ exports[`SendTransaction View renders correctly for custom action payment method
                                   {
                                     "alignItems": "center",
                                     "alignSelf": "stretch",
-                                    "backgroundColor": "#121314",
+                                    "backgroundColor": "#131416",
                                     "borderRadius": 12,
                                     "flexDirection": "row",
                                     "height": 48,
@@ -1414,7 +1414,7 @@ exports[`SendTransaction View renders correctly for custom action payment method
                                     {
                                       "color": "#ffffff",
                                       "fontFamily": "Geist-Medium",
-                                      "fontSize": 18,
+                                      "fontSize": 20,
                                       "letterSpacing": 0,
                                       "lineHeight": 24,
                                     }
@@ -1557,7 +1557,7 @@ exports[`SendTransaction View renders correctly for token 1`] = `
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -1598,7 +1598,7 @@ exports[`SendTransaction View renders correctly for token 1`] = `
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -1885,9 +1885,9 @@ exports[`SendTransaction View renders correctly for token 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
-                                        "fontSize": 18,
+                                        "fontSize": 20,
                                         "fontWeight": "normal",
                                         "letterSpacing": 0,
                                         "lineHeight": 24,
@@ -1900,9 +1900,9 @@ exports[`SendTransaction View renders correctly for token 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
-                                        "fontSize": 18,
+                                        "fontSize": 20,
                                         "letterSpacing": 0,
                                         "lineHeight": 24,
                                       }
@@ -1943,9 +1943,9 @@ exports[`SendTransaction View renders correctly for token 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
-                                        "fontSize": 18,
+                                        "fontSize": 20,
                                         "letterSpacing": 0,
                                         "lineHeight": 24,
                                       }
@@ -1968,7 +1968,7 @@ exports[`SendTransaction View renders correctly for token 1`] = `
                                 }
                               >
                                 <SvgMock
-                                  color="#686e7d"
+                                  color="#66676a"
                                   fill="currentColor"
                                   height={24}
                                   name="Arrow2Down"
@@ -2020,7 +2020,7 @@ exports[`SendTransaction View renders correctly for token 1`] = `
                                 }
                               >
                                 <SvgMock
-                                  color="#686e7d"
+                                  color="#66676a"
                                   fill="currentColor"
                                   height={24}
                                   name="Arrow2Down"
@@ -2061,7 +2061,7 @@ exports[`SendTransaction View renders correctly for token 1`] = `
                                     style={
                                       [
                                         {
-                                          "color": "#686e7d",
+                                          "color": "#66676a",
                                           "fontSize": 20,
                                         },
                                         undefined,
@@ -2080,9 +2080,9 @@ exports[`SendTransaction View renders correctly for token 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
-                                        "fontSize": 18,
+                                        "fontSize": 20,
                                         "fontWeight": "normal",
                                         "letterSpacing": 0,
                                         "lineHeight": 24,
@@ -2127,7 +2127,7 @@ exports[`SendTransaction View renders correctly for token 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -2163,7 +2163,7 @@ exports[`SendTransaction View renders correctly for token 1`] = `
                                   {
                                     "alignItems": "center",
                                     "alignSelf": "stretch",
-                                    "backgroundColor": "#121314",
+                                    "backgroundColor": "#131416",
                                     "borderRadius": 12,
                                     "flexDirection": "row",
                                     "height": 48,
@@ -2179,7 +2179,7 @@ exports[`SendTransaction View renders correctly for token 1`] = `
                                     {
                                       "color": "#ffffff",
                                       "fontFamily": "Geist-Medium",
-                                      "fontSize": 18,
+                                      "fontSize": 20,
                                       "letterSpacing": 0,
                                       "lineHeight": 24,
                                     }
diff --git a/app/components/UI/Ramp/Aggregator/Views/Settings/Settings.test.tsx b/app/components/UI/Ramp/Aggregator/Views/Settings/Settings.test.tsx
index deb11dd47f23..e1bfd11ab872 100644
--- a/app/components/UI/Ramp/Aggregator/Views/Settings/Settings.test.tsx
+++ b/app/components/UI/Ramp/Aggregator/Views/Settings/Settings.test.tsx
@@ -138,6 +138,12 @@ const mockUseRampsControllerInitialValues: ReturnType<
   paymentMethodsError: null,
   getQuotes: jest.fn(),
   getWidgetUrl: jest.fn(),
+  orders: [],
+  getOrderById: jest.fn(),
+  addOrder: jest.fn(),
+  removeOrder: jest.fn(),
+  refreshOrder: jest.fn(),
+  getOrderFromCallback: jest.fn(),
 };
 
 let mockUseRampsControllerValues = mockUseRampsControllerInitialValues;
diff --git a/app/components/UI/Ramp/Aggregator/Views/Settings/__snapshots__/ActivationKeyForm.test.tsx.snap b/app/components/UI/Ramp/Aggregator/Views/Settings/__snapshots__/ActivationKeyForm.test.tsx.snap
index f3630fa28c0c..8dd3a538df2a 100644
--- a/app/components/UI/Ramp/Aggregator/Views/Settings/__snapshots__/ActivationKeyForm.test.tsx.snap
+++ b/app/components/UI/Ramp/Aggregator/Views/Settings/__snapshots__/ActivationKeyForm.test.tsx.snap
@@ -407,7 +407,7 @@ exports[`AddActivationKey renders correctly 1`] = `
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "height": 24,
                                       "width": 24,
                                     },
@@ -448,7 +448,7 @@ exports[`AddActivationKey renders correctly 1`] = `
                               style={
                                 [
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Bold",
                                     "fontSize": 16,
                                     "fontWeight": 400,
@@ -533,7 +533,7 @@ exports[`AddActivationKey renders correctly 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -577,8 +577,8 @@ exports[`AddActivationKey renders correctly 1`] = `
                                   style={
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
-                                      "borderColor": "#b7bbc8",
+                                      "backgroundColor": "#b4b4b528",
+                                      "borderColor": "#949596",
                                       "borderRadius": 12,
                                       "borderWidth": 1,
                                       "flexDirection": "row",
@@ -607,19 +607,20 @@ exports[`AddActivationKey renders correctly 1`] = `
                                       onFocus={[Function]}
                                       onSubmitEditing={[Function]}
                                       placeholder="Add a label to this key"
-                                      placeholderTextColor="#686e7d"
+                                      placeholderTextColor="#66676a"
                                       returnKeyType="done"
                                       style={
                                         {
                                           "backgroundColor": "inherit",
                                           "borderColor": "transparent",
                                           "borderWidth": 1,
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "fontWeight": "400",
                                           "height": 46,
                                           "letterSpacing": 0,
+                                          "lineHeight": 0,
                                           "opacity": 1,
                                         }
                                       }
@@ -644,7 +645,7 @@ exports[`AddActivationKey renders correctly 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -688,8 +689,8 @@ exports[`AddActivationKey renders correctly 1`] = `
                                   style={
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
-                                      "borderColor": "#b7bbc8",
+                                      "backgroundColor": "#b4b4b528",
+                                      "borderColor": "#949596",
                                       "borderRadius": 12,
                                       "borderWidth": 1,
                                       "flexDirection": "row",
@@ -719,7 +720,7 @@ exports[`AddActivationKey renders correctly 1`] = `
                                       onFocus={[Function]}
                                       onSubmitEditing={[Function]}
                                       placeholder="Paste or type an activation key"
-                                      placeholderTextColor="#686e7d"
+                                      placeholderTextColor="#66676a"
                                       returnKeyType="done"
                                       spellCheck={false}
                                       style={
@@ -727,12 +728,13 @@ exports[`AddActivationKey renders correctly 1`] = `
                                           "backgroundColor": "inherit",
                                           "borderColor": "transparent",
                                           "borderWidth": 1,
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "fontWeight": "400",
                                           "height": 46,
                                           "letterSpacing": 0,
+                                          "lineHeight": 0,
                                           "opacity": 1,
                                         }
                                       }
@@ -767,7 +769,7 @@ exports[`AddActivationKey renders correctly 1`] = `
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderColor": "transparent",
                                       "borderRadius": 12,
                                       "borderWidth": 1,
@@ -784,7 +786,7 @@ exports[`AddActivationKey renders correctly 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Medium",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -807,7 +809,7 @@ exports[`AddActivationKey renders correctly 1`] = `
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
-                                      "backgroundColor": "#121314",
+                                      "backgroundColor": "#131416",
                                       "borderRadius": 12,
                                       "flex": 1,
                                       "flexDirection": "row",
diff --git a/app/components/UI/Ramp/Aggregator/Views/Settings/__snapshots__/Settings.test.tsx.snap b/app/components/UI/Ramp/Aggregator/Views/Settings/__snapshots__/Settings.test.tsx.snap
index 786d7a080ba1..1a4b6771b551 100644
--- a/app/components/UI/Ramp/Aggregator/Views/Settings/__snapshots__/Settings.test.tsx.snap
+++ b/app/components/UI/Ramp/Aggregator/Views/Settings/__snapshots__/Settings.test.tsx.snap
@@ -407,7 +407,7 @@ exports[`Settings Activation Keys renders correctly when is loading 1`] = `
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "height": 24,
                                       "width": 24,
                                     },
@@ -448,7 +448,7 @@ exports[`Settings Activation Keys renders correctly when is loading 1`] = `
                               style={
                                 [
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Bold",
                                     "fontSize": 16,
                                     "fontWeight": 400,
@@ -549,9 +549,9 @@ exports[`Settings Activation Keys renders correctly when is loading 1`] = `
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Medium",
-                                          "fontSize": 18,
+                                          "fontSize": 20,
                                           "letterSpacing": 0,
                                           "lineHeight": 24,
                                         }
@@ -588,7 +588,7 @@ exports[`Settings Activation Keys renders correctly when is loading 1`] = `
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Regular",
                                                 "fontSize": 16,
                                                 "letterSpacing": 0,
@@ -620,7 +620,7 @@ exports[`Settings Activation Keys renders correctly when is loading 1`] = `
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Regular",
                                                 "fontSize": 16,
                                                 "letterSpacing": 0,
@@ -644,7 +644,7 @@ exports[`Settings Activation Keys renders correctly when is loading 1`] = `
                                         {
                                           "alignItems": "center",
                                           "alignSelf": "stretch",
-                                          "backgroundColor": "#121314",
+                                          "backgroundColor": "#131416",
                                           "borderRadius": 12,
                                           "flexDirection": "row",
                                           "height": 48,
@@ -686,7 +686,7 @@ exports[`Settings Activation Keys renders correctly when is loading 1`] = `
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -698,9 +698,9 @@ exports[`Settings Activation Keys renders correctly when is loading 1`] = `
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Medium",
-                                            "fontSize": 18,
+                                            "fontSize": 20,
                                             "letterSpacing": 0,
                                             "lineHeight": 24,
                                           }
@@ -712,7 +712,7 @@ exports[`Settings Activation Keys renders correctly when is loading 1`] = `
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 16,
                                             "letterSpacing": 0,
@@ -742,7 +742,7 @@ exports[`Settings Activation Keys renders correctly when is loading 1`] = `
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#686e7d",
+                                            "color": "#66676a",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 16,
                                             "letterSpacing": 0,
@@ -792,13 +792,13 @@ exports[`Settings Activation Keys renders correctly when is loading 1`] = `
                                                   "width": 51,
                                                 },
                                                 {
-                                                  "backgroundColor": "#b7bbc866",
+                                                  "backgroundColor": "#b4b4b566",
                                                   "borderRadius": 16,
                                                 },
                                               ]
                                             }
                                             thumbTintColor="#ffffff"
-                                            tintColor="#b7bbc866"
+                                            tintColor="#b4b4b566"
                                             value={true}
                                           />
                                         </View>
@@ -824,7 +824,7 @@ exports[`Settings Activation Keys renders correctly when is loading 1`] = `
                                             selectable={true}
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Regular",
                                                 "fontSize": 16,
                                                 "letterSpacing": 0,
@@ -839,7 +839,7 @@ exports[`Settings Activation Keys renders correctly when is loading 1`] = `
                                             selectable={true}
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Regular",
                                                 "fontSize": 16,
                                                 "letterSpacing": 0,
@@ -1011,13 +1011,13 @@ exports[`Settings Activation Keys renders correctly when is loading 1`] = `
                                                   "width": 51,
                                                 },
                                                 {
-                                                  "backgroundColor": "#b7bbc866",
+                                                  "backgroundColor": "#b4b4b566",
                                                   "borderRadius": 16,
                                                 },
                                               ]
                                             }
                                             thumbTintColor="#ffffff"
-                                            tintColor="#b7bbc866"
+                                            tintColor="#b4b4b566"
                                             value={false}
                                           />
                                         </View>
@@ -1043,7 +1043,7 @@ exports[`Settings Activation Keys renders correctly when is loading 1`] = `
                                             selectable={true}
                                             style={
                                               {
-                                                "color": "#b7bbc8",
+                                                "color": "#babbbe",
                                                 "fontFamily": "Geist-Regular",
                                                 "fontSize": 16,
                                                 "letterSpacing": 0,
@@ -1058,7 +1058,7 @@ exports[`Settings Activation Keys renders correctly when is loading 1`] = `
                                             selectable={true}
                                             style={
                                               {
-                                                "color": "#b7bbc8",
+                                                "color": "#babbbe",
                                                 "fontFamily": "Geist-Regular",
                                                 "fontSize": 16,
                                                 "letterSpacing": 0,
@@ -1215,7 +1215,7 @@ exports[`Settings Activation Keys renders correctly when is loading 1`] = `
                                           {
                                             "alignItems": "center",
                                             "alignSelf": "stretch",
-                                            "backgroundColor": "#3c4d9d0f",
+                                            "backgroundColor": "#b4b4b528",
                                             "borderColor": "transparent",
                                             "borderRadius": 12,
                                             "borderWidth": 1,
@@ -1232,7 +1232,7 @@ exports[`Settings Activation Keys renders correctly when is loading 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -1671,7 +1671,7 @@ exports[`Settings Activation Keys renders correctly when there are no keys 1`] =
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "height": 24,
                                       "width": 24,
                                     },
@@ -1712,7 +1712,7 @@ exports[`Settings Activation Keys renders correctly when there are no keys 1`] =
                               style={
                                 [
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Bold",
                                     "fontSize": 16,
                                     "fontWeight": 400,
@@ -1813,9 +1813,9 @@ exports[`Settings Activation Keys renders correctly when there are no keys 1`] =
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Medium",
-                                          "fontSize": 18,
+                                          "fontSize": 20,
                                           "letterSpacing": 0,
                                           "lineHeight": 24,
                                         }
@@ -1852,7 +1852,7 @@ exports[`Settings Activation Keys renders correctly when there are no keys 1`] =
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Regular",
                                                 "fontSize": 16,
                                                 "letterSpacing": 0,
@@ -1884,7 +1884,7 @@ exports[`Settings Activation Keys renders correctly when there are no keys 1`] =
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Regular",
                                                 "fontSize": 16,
                                                 "letterSpacing": 0,
@@ -1908,7 +1908,7 @@ exports[`Settings Activation Keys renders correctly when there are no keys 1`] =
                                         {
                                           "alignItems": "center",
                                           "alignSelf": "stretch",
-                                          "backgroundColor": "#121314",
+                                          "backgroundColor": "#131416",
                                           "borderRadius": 12,
                                           "flexDirection": "row",
                                           "height": 48,
@@ -1950,7 +1950,7 @@ exports[`Settings Activation Keys renders correctly when there are no keys 1`] =
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -1962,9 +1962,9 @@ exports[`Settings Activation Keys renders correctly when there are no keys 1`] =
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Medium",
-                                            "fontSize": 18,
+                                            "fontSize": 20,
                                             "letterSpacing": 0,
                                             "lineHeight": 24,
                                           }
@@ -1976,7 +1976,7 @@ exports[`Settings Activation Keys renders correctly when there are no keys 1`] =
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 16,
                                             "letterSpacing": 0,
@@ -2003,7 +2003,7 @@ exports[`Settings Activation Keys renders correctly when there are no keys 1`] =
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#686e7d",
+                                            "color": "#66676a",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 16,
                                             "letterSpacing": 0,
@@ -2038,7 +2038,7 @@ exports[`Settings Activation Keys renders correctly when there are no keys 1`] =
                                           {
                                             "alignItems": "center",
                                             "alignSelf": "stretch",
-                                            "backgroundColor": "#3c4d9d0f",
+                                            "backgroundColor": "#b4b4b528",
                                             "borderColor": "transparent",
                                             "borderRadius": 12,
                                             "borderWidth": 1,
@@ -2054,7 +2054,7 @@ exports[`Settings Activation Keys renders correctly when there are no keys 1`] =
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -2493,7 +2493,7 @@ exports[`Settings Region V2 disabled (Original) renders correctly when region is
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "height": 24,
                                       "width": 24,
                                     },
@@ -2534,7 +2534,7 @@ exports[`Settings Region V2 disabled (Original) renders correctly when region is
                               style={
                                 [
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Bold",
                                     "fontSize": 16,
                                     "fontWeight": 400,
@@ -2635,9 +2635,9 @@ exports[`Settings Region V2 disabled (Original) renders correctly when region is
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Medium",
-                                          "fontSize": 18,
+                                          "fontSize": 20,
                                           "letterSpacing": 0,
                                           "lineHeight": 24,
                                         }
@@ -2674,7 +2674,7 @@ exports[`Settings Region V2 disabled (Original) renders correctly when region is
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Regular",
                                                 "fontSize": 16,
                                                 "letterSpacing": 0,
@@ -2706,7 +2706,7 @@ exports[`Settings Region V2 disabled (Original) renders correctly when region is
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Regular",
                                                 "fontSize": 16,
                                                 "letterSpacing": 0,
@@ -3146,7 +3146,7 @@ exports[`Settings Region V2 disabled (Original) renders correctly when region is
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "height": 24,
                                       "width": 24,
                                     },
@@ -3187,7 +3187,7 @@ exports[`Settings Region V2 disabled (Original) renders correctly when region is
                               style={
                                 [
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Bold",
                                     "fontSize": 16,
                                     "fontWeight": 400,
@@ -3288,9 +3288,9 @@ exports[`Settings Region V2 disabled (Original) renders correctly when region is
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Medium",
-                                          "fontSize": 18,
+                                          "fontSize": 20,
                                           "letterSpacing": 0,
                                           "lineHeight": 24,
                                         }
@@ -3327,7 +3327,7 @@ exports[`Settings Region V2 disabled (Original) renders correctly when region is
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Regular",
                                                 "fontSize": 16,
                                                 "letterSpacing": 0,
@@ -3359,7 +3359,7 @@ exports[`Settings Region V2 disabled (Original) renders correctly when region is
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Regular",
                                                 "fontSize": 16,
                                                 "letterSpacing": 0,
@@ -3383,7 +3383,7 @@ exports[`Settings Region V2 disabled (Original) renders correctly when region is
                                         {
                                           "alignItems": "center",
                                           "alignSelf": "stretch",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderColor": "transparent",
                                           "borderRadius": 12,
                                           "borderWidth": 1,
@@ -3399,7 +3399,7 @@ exports[`Settings Region V2 disabled (Original) renders correctly when region is
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Medium",
                                             "fontSize": 16,
                                             "letterSpacing": 0,
@@ -3837,7 +3837,7 @@ exports[`Settings Region V2 enabled renders correctly when region has state 1`]
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "height": 24,
                                       "width": 24,
                                     },
@@ -3878,7 +3878,7 @@ exports[`Settings Region V2 enabled renders correctly when region has state 1`]
                               style={
                                 [
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Bold",
                                     "fontSize": 16,
                                     "fontWeight": 400,
@@ -3979,9 +3979,9 @@ exports[`Settings Region V2 enabled renders correctly when region has state 1`]
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Medium",
-                                          "fontSize": 18,
+                                          "fontSize": 20,
                                           "letterSpacing": 0,
                                           "lineHeight": 24,
                                         }
@@ -4018,7 +4018,7 @@ exports[`Settings Region V2 enabled renders correctly when region has state 1`]
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Regular",
                                                 "fontSize": 16,
                                                 "letterSpacing": 0,
@@ -4050,7 +4050,7 @@ exports[`Settings Region V2 enabled renders correctly when region has state 1`]
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Regular",
                                                 "fontSize": 16,
                                                 "letterSpacing": 0,
@@ -4074,7 +4074,7 @@ exports[`Settings Region V2 enabled renders correctly when region has state 1`]
                                         {
                                           "alignItems": "center",
                                           "alignSelf": "stretch",
-                                          "backgroundColor": "#121314",
+                                          "backgroundColor": "#131416",
                                           "borderRadius": 12,
                                           "flexDirection": "row",
                                           "height": 48,
@@ -4526,7 +4526,7 @@ exports[`Settings Region V2 enabled renders correctly when region is country onl
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "height": 24,
                                       "width": 24,
                                     },
@@ -4567,7 +4567,7 @@ exports[`Settings Region V2 enabled renders correctly when region is country onl
                               style={
                                 [
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Bold",
                                     "fontSize": 16,
                                     "fontWeight": 400,
@@ -4668,9 +4668,9 @@ exports[`Settings Region V2 enabled renders correctly when region is country onl
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Medium",
-                                          "fontSize": 18,
+                                          "fontSize": 20,
                                           "letterSpacing": 0,
                                           "lineHeight": 24,
                                         }
@@ -4707,7 +4707,7 @@ exports[`Settings Region V2 enabled renders correctly when region is country onl
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Regular",
                                                 "fontSize": 16,
                                                 "letterSpacing": 0,
@@ -4739,7 +4739,7 @@ exports[`Settings Region V2 enabled renders correctly when region is country onl
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Regular",
                                                 "fontSize": 16,
                                                 "letterSpacing": 0,
@@ -4763,7 +4763,7 @@ exports[`Settings Region V2 enabled renders correctly when region is country onl
                                         {
                                           "alignItems": "center",
                                           "alignSelf": "stretch",
-                                          "backgroundColor": "#121314",
+                                          "backgroundColor": "#131416",
                                           "borderRadius": 12,
                                           "flexDirection": "row",
                                           "height": 48,
@@ -5215,7 +5215,7 @@ exports[`Settings Region V2 enabled renders correctly when region is not set 1`]
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "height": 24,
                                       "width": 24,
                                     },
@@ -5256,7 +5256,7 @@ exports[`Settings Region V2 enabled renders correctly when region is not set 1`]
                               style={
                                 [
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Bold",
                                     "fontSize": 16,
                                     "fontWeight": 400,
@@ -5357,9 +5357,9 @@ exports[`Settings Region V2 enabled renders correctly when region is not set 1`]
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Medium",
-                                          "fontSize": 18,
+                                          "fontSize": 20,
                                           "letterSpacing": 0,
                                           "lineHeight": 24,
                                         }
@@ -5396,7 +5396,7 @@ exports[`Settings Region V2 enabled renders correctly when region is not set 1`]
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Regular",
                                                 "fontSize": 16,
                                                 "letterSpacing": 0,
@@ -5428,7 +5428,7 @@ exports[`Settings Region V2 enabled renders correctly when region is not set 1`]
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Regular",
                                                 "fontSize": 16,
                                                 "letterSpacing": 0,
@@ -5452,7 +5452,7 @@ exports[`Settings Region V2 enabled renders correctly when region is not set 1`]
                                         {
                                           "alignItems": "center",
                                           "alignSelf": "stretch",
-                                          "backgroundColor": "#121314",
+                                          "backgroundColor": "#131416",
                                           "borderRadius": 12,
                                           "flexDirection": "row",
                                           "height": 48,
@@ -5904,7 +5904,7 @@ exports[`Settings Region V2 enabled renders correctly when region is set 1`] = `
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "height": 24,
                                       "width": 24,
                                     },
@@ -5945,7 +5945,7 @@ exports[`Settings Region V2 enabled renders correctly when region is set 1`] = `
                               style={
                                 [
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Bold",
                                     "fontSize": 16,
                                     "fontWeight": 400,
@@ -6046,9 +6046,9 @@ exports[`Settings Region V2 enabled renders correctly when region is set 1`] = `
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Medium",
-                                          "fontSize": 18,
+                                          "fontSize": 20,
                                           "letterSpacing": 0,
                                           "lineHeight": 24,
                                         }
@@ -6085,7 +6085,7 @@ exports[`Settings Region V2 enabled renders correctly when region is set 1`] = `
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Regular",
                                                 "fontSize": 16,
                                                 "letterSpacing": 0,
@@ -6117,7 +6117,7 @@ exports[`Settings Region V2 enabled renders correctly when region is set 1`] = `
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Regular",
                                                 "fontSize": 16,
                                                 "letterSpacing": 0,
@@ -6141,7 +6141,7 @@ exports[`Settings Region V2 enabled renders correctly when region is set 1`] = `
                                         {
                                           "alignItems": "center",
                                           "alignSelf": "stretch",
-                                          "backgroundColor": "#121314",
+                                          "backgroundColor": "#131416",
                                           "borderRadius": 12,
                                           "flexDirection": "row",
                                           "height": 48,
@@ -6593,7 +6593,7 @@ exports[`Settings renders correctly 1`] = `
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "height": 24,
                                       "width": 24,
                                     },
@@ -6634,7 +6634,7 @@ exports[`Settings renders correctly 1`] = `
                               style={
                                 [
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Bold",
                                     "fontSize": 16,
                                     "fontWeight": 400,
@@ -6735,9 +6735,9 @@ exports[`Settings renders correctly 1`] = `
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Medium",
-                                          "fontSize": 18,
+                                          "fontSize": 20,
                                           "letterSpacing": 0,
                                           "lineHeight": 24,
                                         }
@@ -6774,7 +6774,7 @@ exports[`Settings renders correctly 1`] = `
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Regular",
                                                 "fontSize": 16,
                                                 "letterSpacing": 0,
@@ -6806,7 +6806,7 @@ exports[`Settings renders correctly 1`] = `
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Regular",
                                                 "fontSize": 16,
                                                 "letterSpacing": 0,
@@ -6830,7 +6830,7 @@ exports[`Settings renders correctly 1`] = `
                                         {
                                           "alignItems": "center",
                                           "alignSelf": "stretch",
-                                          "backgroundColor": "#121314",
+                                          "backgroundColor": "#131416",
                                           "borderRadius": 12,
                                           "flexDirection": "row",
                                           "height": 48,
@@ -7282,7 +7282,7 @@ exports[`Settings renders correctly for internal builds 1`] = `
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "height": 24,
                                       "width": 24,
                                     },
@@ -7323,7 +7323,7 @@ exports[`Settings renders correctly for internal builds 1`] = `
                               style={
                                 [
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Bold",
                                     "fontSize": 16,
                                     "fontWeight": 400,
@@ -7424,9 +7424,9 @@ exports[`Settings renders correctly for internal builds 1`] = `
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Medium",
-                                          "fontSize": 18,
+                                          "fontSize": 20,
                                           "letterSpacing": 0,
                                           "lineHeight": 24,
                                         }
@@ -7463,7 +7463,7 @@ exports[`Settings renders correctly for internal builds 1`] = `
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Regular",
                                                 "fontSize": 16,
                                                 "letterSpacing": 0,
@@ -7495,7 +7495,7 @@ exports[`Settings renders correctly for internal builds 1`] = `
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Regular",
                                                 "fontSize": 16,
                                                 "letterSpacing": 0,
@@ -7519,7 +7519,7 @@ exports[`Settings renders correctly for internal builds 1`] = `
                                         {
                                           "alignItems": "center",
                                           "alignSelf": "stretch",
-                                          "backgroundColor": "#121314",
+                                          "backgroundColor": "#131416",
                                           "borderRadius": 12,
                                           "flexDirection": "row",
                                           "height": 48,
@@ -7561,7 +7561,7 @@ exports[`Settings renders correctly for internal builds 1`] = `
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -7573,9 +7573,9 @@ exports[`Settings renders correctly for internal builds 1`] = `
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Medium",
-                                            "fontSize": 18,
+                                            "fontSize": 20,
                                             "letterSpacing": 0,
                                             "lineHeight": 24,
                                           }
@@ -7587,7 +7587,7 @@ exports[`Settings renders correctly for internal builds 1`] = `
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 16,
                                             "letterSpacing": 0,
@@ -7614,7 +7614,7 @@ exports[`Settings renders correctly for internal builds 1`] = `
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#686e7d",
+                                            "color": "#66676a",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 16,
                                             "letterSpacing": 0,
@@ -7664,13 +7664,13 @@ exports[`Settings renders correctly for internal builds 1`] = `
                                                   "width": 51,
                                                 },
                                                 {
-                                                  "backgroundColor": "#b7bbc866",
+                                                  "backgroundColor": "#b4b4b566",
                                                   "borderRadius": 16,
                                                 },
                                               ]
                                             }
                                             thumbTintColor="#ffffff"
-                                            tintColor="#b7bbc866"
+                                            tintColor="#b4b4b566"
                                             value={true}
                                           />
                                         </View>
@@ -7696,7 +7696,7 @@ exports[`Settings renders correctly for internal builds 1`] = `
                                             selectable={true}
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Regular",
                                                 "fontSize": 16,
                                                 "letterSpacing": 0,
@@ -7711,7 +7711,7 @@ exports[`Settings renders correctly for internal builds 1`] = `
                                             selectable={true}
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Regular",
                                                 "fontSize": 16,
                                                 "letterSpacing": 0,
@@ -7883,13 +7883,13 @@ exports[`Settings renders correctly for internal builds 1`] = `
                                                   "width": 51,
                                                 },
                                                 {
-                                                  "backgroundColor": "#b7bbc866",
+                                                  "backgroundColor": "#b4b4b566",
                                                   "borderRadius": 16,
                                                 },
                                               ]
                                             }
                                             thumbTintColor="#ffffff"
-                                            tintColor="#b7bbc866"
+                                            tintColor="#b4b4b566"
                                             value={false}
                                           />
                                         </View>
@@ -7915,7 +7915,7 @@ exports[`Settings renders correctly for internal builds 1`] = `
                                             selectable={true}
                                             style={
                                               {
-                                                "color": "#b7bbc8",
+                                                "color": "#babbbe",
                                                 "fontFamily": "Geist-Regular",
                                                 "fontSize": 16,
                                                 "letterSpacing": 0,
@@ -7930,7 +7930,7 @@ exports[`Settings renders correctly for internal builds 1`] = `
                                             selectable={true}
                                             style={
                                               {
-                                                "color": "#b7bbc8",
+                                                "color": "#babbbe",
                                                 "fontFamily": "Geist-Regular",
                                                 "fontSize": 16,
                                                 "letterSpacing": 0,
@@ -8087,7 +8087,7 @@ exports[`Settings renders correctly for internal builds 1`] = `
                                           {
                                             "alignItems": "center",
                                             "alignSelf": "stretch",
-                                            "backgroundColor": "#3c4d9d0f",
+                                            "backgroundColor": "#b4b4b528",
                                             "borderColor": "transparent",
                                             "borderRadius": 12,
                                             "borderWidth": 1,
@@ -8103,7 +8103,7 @@ exports[`Settings renders correctly for internal builds 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
diff --git a/app/components/UI/Ramp/Aggregator/components/CustomAction/__snapshots__/CustomAction.test.tsx.snap b/app/components/UI/Ramp/Aggregator/components/CustomAction/__snapshots__/CustomAction.test.tsx.snap
index fe0f732c171f..856c95346c2e 100644
--- a/app/components/UI/Ramp/Aggregator/components/CustomAction/__snapshots__/CustomAction.test.tsx.snap
+++ b/app/components/UI/Ramp/Aggregator/components/CustomAction/__snapshots__/CustomAction.test.tsx.snap
@@ -19,7 +19,7 @@ exports[`CustomAction Component shows loading indicator when isLoading is true 1
       style={
         [
           {
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderRadius": 8,
             "padding": 16,
           },
@@ -84,7 +84,7 @@ exports[`CustomAction Component shows loading indicator when isLoading is true 1
                       "fontSize": 12,
                     },
                     {
-                      "color": "#686e7d",
+                      "color": "#66676a",
                       "marginLeft": 8,
                     },
                     {
@@ -149,7 +149,7 @@ exports[`CustomAction Component shows loading indicator when isLoading is true 1
                   {
                     "alignItems": "center",
                     "alignSelf": "stretch",
-                    "backgroundColor": "#121314",
+                    "backgroundColor": "#131416",
                     "borderRadius": 12,
                     "flexDirection": "row",
                     "height": 48,
diff --git a/app/components/UI/Ramp/Aggregator/components/FiatSelectorModal/__snapshots__/FiatSelectorModal.test.tsx.snap b/app/components/UI/Ramp/Aggregator/components/FiatSelectorModal/__snapshots__/FiatSelectorModal.test.tsx.snap
index c9cafe5212d7..3babdfca1f8a 100644
--- a/app/components/UI/Ramp/Aggregator/components/FiatSelectorModal/__snapshots__/FiatSelectorModal.test.tsx.snap
+++ b/app/components/UI/Ramp/Aggregator/components/FiatSelectorModal/__snapshots__/FiatSelectorModal.test.tsx.snap
@@ -334,7 +334,7 @@ exports[`FiatSelectorModal renders the modal with currency list 1`] = `
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -384,7 +384,7 @@ exports[`FiatSelectorModal renders the modal with currency list 1`] = `
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -421,7 +421,7 @@ exports[`FiatSelectorModal renders the modal with currency list 1`] = `
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -481,7 +481,7 @@ exports[`FiatSelectorModal renders the modal with currency list 1`] = `
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 16,
                                         "fontWeight": 400,
@@ -559,7 +559,7 @@ exports[`FiatSelectorModal renders the modal with currency list 1`] = `
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "height": 24,
                                           "width": 24,
                                         },
@@ -612,8 +612,8 @@ exports[`FiatSelectorModal renders the modal with currency list 1`] = `
                               style={
                                 {
                                   "alignItems": "center",
-                                  "backgroundColor": "#3c4d9d0f",
-                                  "borderColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b528",
+                                  "borderColor": "#b4b4b566",
                                   "borderRadius": 24,
                                   "borderWidth": 1,
                                   "flexDirection": "row",
@@ -633,7 +633,7 @@ exports[`FiatSelectorModal renders the modal with currency list 1`] = `
                                 testID="textfield-startacccessory"
                               >
                                 <SvgMock
-                                  color="#686e7d"
+                                  color="#66676a"
                                   fill="currentColor"
                                   height={20}
                                   name="Search"
@@ -662,18 +662,19 @@ exports[`FiatSelectorModal renders the modal with currency list 1`] = `
                                   onChangeText={[Function]}
                                   onFocus={[Function]}
                                   placeholder="Search for a currency"
-                                  placeholderTextColor="#686e7d"
+                                  placeholderTextColor="#66676a"
                                   style={
                                     {
                                       "backgroundColor": "inherit",
                                       "borderColor": "transparent",
                                       "borderWidth": 1,
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "fontWeight": "400",
                                       "height": 46,
                                       "letterSpacing": 0,
+                                      "lineHeight": 0,
                                       "opacity": 1,
                                     }
                                   }
@@ -788,9 +789,9 @@ exports[`FiatSelectorModal renders the modal with currency list 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -802,7 +803,7 @@ exports[`FiatSelectorModal renders the modal with currency list 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -865,9 +866,9 @@ exports[`FiatSelectorModal renders the modal with currency list 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -879,7 +880,7 @@ exports[`FiatSelectorModal renders the modal with currency list 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -942,9 +943,9 @@ exports[`FiatSelectorModal renders the modal with currency list 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -956,7 +957,7 @@ exports[`FiatSelectorModal renders the modal with currency list 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -1322,7 +1323,7 @@ exports[`FiatSelectorModal search displays filtered currencies when search strin
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -1372,7 +1373,7 @@ exports[`FiatSelectorModal search displays filtered currencies when search strin
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -1409,7 +1410,7 @@ exports[`FiatSelectorModal search displays filtered currencies when search strin
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -1469,7 +1470,7 @@ exports[`FiatSelectorModal search displays filtered currencies when search strin
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 16,
                                         "fontWeight": 400,
@@ -1547,7 +1548,7 @@ exports[`FiatSelectorModal search displays filtered currencies when search strin
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "height": 24,
                                           "width": 24,
                                         },
@@ -1600,8 +1601,8 @@ exports[`FiatSelectorModal search displays filtered currencies when search strin
                               style={
                                 {
                                   "alignItems": "center",
-                                  "backgroundColor": "#3c4d9d0f",
-                                  "borderColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b528",
+                                  "borderColor": "#b4b4b566",
                                   "borderRadius": 24,
                                   "borderWidth": 1,
                                   "flexDirection": "row",
@@ -1621,7 +1622,7 @@ exports[`FiatSelectorModal search displays filtered currencies when search strin
                                 testID="textfield-startacccessory"
                               >
                                 <SvgMock
-                                  color="#686e7d"
+                                  color="#66676a"
                                   fill="currentColor"
                                   height={20}
                                   name="Search"
@@ -1650,18 +1651,19 @@ exports[`FiatSelectorModal search displays filtered currencies when search strin
                                   onChangeText={[Function]}
                                   onFocus={[Function]}
                                   placeholder="Search for a currency"
-                                  placeholderTextColor="#686e7d"
+                                  placeholderTextColor="#66676a"
                                   style={
                                     {
                                       "backgroundColor": "inherit",
                                       "borderColor": "transparent",
                                       "borderWidth": 1,
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "fontWeight": "400",
                                       "height": 46,
                                       "letterSpacing": 0,
+                                      "lineHeight": 0,
                                       "opacity": 1,
                                     }
                                   }
@@ -1776,9 +1778,9 @@ exports[`FiatSelectorModal search displays filtered currencies when search strin
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -1790,7 +1792,7 @@ exports[`FiatSelectorModal search displays filtered currencies when search strin
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -1853,9 +1855,9 @@ exports[`FiatSelectorModal search displays filtered currencies when search strin
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -1867,7 +1869,7 @@ exports[`FiatSelectorModal search displays filtered currencies when search strin
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -1930,9 +1932,9 @@ exports[`FiatSelectorModal search displays filtered currencies when search strin
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -1944,7 +1946,7 @@ exports[`FiatSelectorModal search displays filtered currencies when search strin
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -2310,7 +2312,7 @@ exports[`FiatSelectorModal search displays filtered currencies when search strin
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -2360,7 +2362,7 @@ exports[`FiatSelectorModal search displays filtered currencies when search strin
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -2397,7 +2399,7 @@ exports[`FiatSelectorModal search displays filtered currencies when search strin
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -2457,7 +2459,7 @@ exports[`FiatSelectorModal search displays filtered currencies when search strin
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 16,
                                         "fontWeight": 400,
@@ -2535,7 +2537,7 @@ exports[`FiatSelectorModal search displays filtered currencies when search strin
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "height": 24,
                                           "width": 24,
                                         },
@@ -2588,8 +2590,8 @@ exports[`FiatSelectorModal search displays filtered currencies when search strin
                               style={
                                 {
                                   "alignItems": "center",
-                                  "backgroundColor": "#3c4d9d0f",
-                                  "borderColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b528",
+                                  "borderColor": "#b4b4b566",
                                   "borderRadius": 24,
                                   "borderWidth": 1,
                                   "flexDirection": "row",
@@ -2609,7 +2611,7 @@ exports[`FiatSelectorModal search displays filtered currencies when search strin
                                 testID="textfield-startacccessory"
                               >
                                 <SvgMock
-                                  color="#686e7d"
+                                  color="#66676a"
                                   fill="currentColor"
                                   height={20}
                                   name="Search"
@@ -2638,18 +2640,19 @@ exports[`FiatSelectorModal search displays filtered currencies when search strin
                                   onChangeText={[Function]}
                                   onFocus={[Function]}
                                   placeholder="Search for a currency"
-                                  placeholderTextColor="#686e7d"
+                                  placeholderTextColor="#66676a"
                                   style={
                                     {
                                       "backgroundColor": "inherit",
                                       "borderColor": "transparent",
                                       "borderWidth": 1,
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "fontWeight": "400",
                                       "height": 46,
                                       "letterSpacing": 0,
+                                      "lineHeight": 0,
                                       "opacity": 1,
                                     }
                                   }
@@ -2764,9 +2767,9 @@ exports[`FiatSelectorModal search displays filtered currencies when search strin
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -2778,7 +2781,7 @@ exports[`FiatSelectorModal search displays filtered currencies when search strin
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -2841,9 +2844,9 @@ exports[`FiatSelectorModal search displays filtered currencies when search strin
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -2855,7 +2858,7 @@ exports[`FiatSelectorModal search displays filtered currencies when search strin
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -2918,9 +2921,9 @@ exports[`FiatSelectorModal search displays filtered currencies when search strin
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -2932,7 +2935,7 @@ exports[`FiatSelectorModal search displays filtered currencies when search strin
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -3298,7 +3301,7 @@ exports[`FiatSelectorModal search displays max 20 results 1`] = `
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -3348,7 +3351,7 @@ exports[`FiatSelectorModal search displays max 20 results 1`] = `
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -3385,7 +3388,7 @@ exports[`FiatSelectorModal search displays max 20 results 1`] = `
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -3445,7 +3448,7 @@ exports[`FiatSelectorModal search displays max 20 results 1`] = `
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 16,
                                         "fontWeight": 400,
@@ -3523,7 +3526,7 @@ exports[`FiatSelectorModal search displays max 20 results 1`] = `
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "height": 24,
                                           "width": 24,
                                         },
@@ -3576,8 +3579,8 @@ exports[`FiatSelectorModal search displays max 20 results 1`] = `
                               style={
                                 {
                                   "alignItems": "center",
-                                  "backgroundColor": "#3c4d9d0f",
-                                  "borderColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b528",
+                                  "borderColor": "#b4b4b566",
                                   "borderRadius": 24,
                                   "borderWidth": 1,
                                   "flexDirection": "row",
@@ -3597,7 +3600,7 @@ exports[`FiatSelectorModal search displays max 20 results 1`] = `
                                 testID="textfield-startacccessory"
                               >
                                 <SvgMock
-                                  color="#686e7d"
+                                  color="#66676a"
                                   fill="currentColor"
                                   height={20}
                                   name="Search"
@@ -3626,18 +3629,19 @@ exports[`FiatSelectorModal search displays max 20 results 1`] = `
                                   onChangeText={[Function]}
                                   onFocus={[Function]}
                                   placeholder="Search for a currency"
-                                  placeholderTextColor="#686e7d"
+                                  placeholderTextColor="#66676a"
                                   style={
                                     {
                                       "backgroundColor": "inherit",
                                       "borderColor": "transparent",
                                       "borderWidth": 1,
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "fontWeight": "400",
                                       "height": 46,
                                       "letterSpacing": 0,
+                                      "lineHeight": 0,
                                       "opacity": 1,
                                     }
                                   }
@@ -3752,9 +3756,9 @@ exports[`FiatSelectorModal search displays max 20 results 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -3766,7 +3770,7 @@ exports[`FiatSelectorModal search displays max 20 results 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -3829,9 +3833,9 @@ exports[`FiatSelectorModal search displays max 20 results 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -3843,7 +3847,7 @@ exports[`FiatSelectorModal search displays max 20 results 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -3906,9 +3910,9 @@ exports[`FiatSelectorModal search displays max 20 results 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -3920,7 +3924,7 @@ exports[`FiatSelectorModal search displays max 20 results 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
diff --git a/app/components/UI/Ramp/Aggregator/components/IncompatibleAccountTokenModal/__snapshots__/IncompatibleAccountTokenModal.test.tsx.snap b/app/components/UI/Ramp/Aggregator/components/IncompatibleAccountTokenModal/__snapshots__/IncompatibleAccountTokenModal.test.tsx.snap
index 9d6127be393c..d5e5b5ebd87b 100644
--- a/app/components/UI/Ramp/Aggregator/components/IncompatibleAccountTokenModal/__snapshots__/IncompatibleAccountTokenModal.test.tsx.snap
+++ b/app/components/UI/Ramp/Aggregator/components/IncompatibleAccountTokenModal/__snapshots__/IncompatibleAccountTokenModal.test.tsx.snap
@@ -334,7 +334,7 @@ exports[`IncompatibleAccountTokenModal renders the modal with the correct title
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -384,7 +384,7 @@ exports[`IncompatibleAccountTokenModal renders the modal with the correct title
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -421,7 +421,7 @@ exports[`IncompatibleAccountTokenModal renders the modal with the correct title
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -469,9 +469,9 @@ exports[`IncompatibleAccountTokenModal renders the modal with the correct title
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Bold",
-                                    "fontSize": 18,
+                                    "fontSize": 20,
                                     "letterSpacing": 0,
                                     "lineHeight": 24,
                                     "textAlign": "center",
@@ -504,7 +504,7 @@ exports[`IncompatibleAccountTokenModal renders the modal with the correct title
                                   }
                                 >
                                   <SvgMock
-                                    color="#121314"
+                                    color="#131416"
                                     fill="currentColor"
                                     height={24}
                                     name="Close"
@@ -532,7 +532,7 @@ exports[`IncompatibleAccountTokenModal renders the modal with the correct title
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -553,7 +553,7 @@ exports[`IncompatibleAccountTokenModal renders the modal with the correct title
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
diff --git a/app/components/UI/Ramp/Aggregator/components/OrderListItem/__snapshots__/OrderListItem.test.tsx.snap b/app/components/UI/Ramp/Aggregator/components/OrderListItem/__snapshots__/OrderListItem.test.tsx.snap
index 02aaca5fdd03..6d6d8bed8153 100644
--- a/app/components/UI/Ramp/Aggregator/components/OrderListItem/__snapshots__/OrderListItem.test.tsx.snap
+++ b/app/components/UI/Ramp/Aggregator/components/OrderListItem/__snapshots__/OrderListItem.test.tsx.snap
@@ -21,7 +21,7 @@ exports[`OrderListItem should render correctly 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 14,
           "letterSpacing": 0,
@@ -171,7 +171,7 @@ exports[`OrderListItem should render correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -218,7 +218,7 @@ exports[`OrderListItem should render correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -234,7 +234,7 @@ exports[`OrderListItem should render correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 14,
             "letterSpacing": 0,
@@ -270,7 +270,7 @@ exports[`OrderListItem should render correctly 2`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 14,
           "letterSpacing": 0,
@@ -420,7 +420,7 @@ exports[`OrderListItem should render correctly 2`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -467,7 +467,7 @@ exports[`OrderListItem should render correctly 2`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -483,7 +483,7 @@ exports[`OrderListItem should render correctly 2`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 14,
             "letterSpacing": 0,
@@ -519,7 +519,7 @@ exports[`OrderListItem should render correctly 3`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 14,
           "letterSpacing": 0,
@@ -669,7 +669,7 @@ exports[`OrderListItem should render correctly 3`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -683,7 +683,7 @@ exports[`OrderListItem should render correctly 3`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Bold",
             "fontSize": 14,
             "letterSpacing": 0,
@@ -716,7 +716,7 @@ exports[`OrderListItem should render correctly 3`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -732,7 +732,7 @@ exports[`OrderListItem should render correctly 3`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 14,
             "letterSpacing": 0,
@@ -768,7 +768,7 @@ exports[`OrderListItem should render correctly 4`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 14,
           "letterSpacing": 0,
@@ -918,7 +918,7 @@ exports[`OrderListItem should render correctly 4`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -932,7 +932,7 @@ exports[`OrderListItem should render correctly 4`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Bold",
             "fontSize": 14,
             "letterSpacing": 0,
@@ -965,7 +965,7 @@ exports[`OrderListItem should render correctly 4`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -981,7 +981,7 @@ exports[`OrderListItem should render correctly 4`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 14,
             "letterSpacing": 0,
@@ -1017,7 +1017,7 @@ exports[`OrderListItem should render correctly 5`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 14,
           "letterSpacing": 0,
@@ -1167,7 +1167,7 @@ exports[`OrderListItem should render correctly 5`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -1214,7 +1214,7 @@ exports[`OrderListItem should render correctly 5`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -1230,7 +1230,7 @@ exports[`OrderListItem should render correctly 5`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 14,
             "letterSpacing": 0,
@@ -1266,7 +1266,7 @@ exports[`OrderListItem should render correctly 6`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 14,
           "letterSpacing": 0,
@@ -1416,7 +1416,7 @@ exports[`OrderListItem should render correctly 6`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -1463,7 +1463,7 @@ exports[`OrderListItem should render correctly 6`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -1479,7 +1479,7 @@ exports[`OrderListItem should render correctly 6`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 14,
             "letterSpacing": 0,
@@ -1515,7 +1515,7 @@ exports[`OrderListItem should render correctly 7`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 14,
           "letterSpacing": 0,
@@ -1665,7 +1665,7 @@ exports[`OrderListItem should render correctly 7`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -1712,7 +1712,7 @@ exports[`OrderListItem should render correctly 7`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -1728,7 +1728,7 @@ exports[`OrderListItem should render correctly 7`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 14,
             "letterSpacing": 0,
@@ -1764,7 +1764,7 @@ exports[`OrderListItem should render correctly 8`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 14,
           "letterSpacing": 0,
@@ -1914,7 +1914,7 @@ exports[`OrderListItem should render correctly 8`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -1961,7 +1961,7 @@ exports[`OrderListItem should render correctly 8`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -1977,7 +1977,7 @@ exports[`OrderListItem should render correctly 8`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 14,
             "letterSpacing": 0,
@@ -2013,7 +2013,7 @@ exports[`OrderListItem should render correctly 9`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 14,
           "letterSpacing": 0,
@@ -2106,7 +2106,7 @@ exports[`OrderListItem should render correctly 9`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -2153,7 +2153,7 @@ exports[`OrderListItem should render correctly 9`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -2169,7 +2169,7 @@ exports[`OrderListItem should render correctly 9`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 14,
             "letterSpacing": 0,
@@ -2205,7 +2205,7 @@ exports[`OrderListItem should render correctly 10`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 14,
           "letterSpacing": 0,
@@ -2298,7 +2298,7 @@ exports[`OrderListItem should render correctly 10`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -2345,7 +2345,7 @@ exports[`OrderListItem should render correctly 10`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -2361,7 +2361,7 @@ exports[`OrderListItem should render correctly 10`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 14,
             "letterSpacing": 0,
@@ -2397,7 +2397,7 @@ exports[`OrderListItem should render correctly 11`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 14,
           "letterSpacing": 0,
@@ -2547,7 +2547,7 @@ exports[`OrderListItem should render correctly 11`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -2594,7 +2594,7 @@ exports[`OrderListItem should render correctly 11`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -2610,7 +2610,7 @@ exports[`OrderListItem should render correctly 11`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 14,
             "letterSpacing": 0,
diff --git a/app/components/UI/Ramp/Aggregator/components/PaymentMethodSelectorModal/PaymentMethodSelectorModal.test.tsx b/app/components/UI/Ramp/Aggregator/components/PaymentMethodSelectorModal/PaymentMethodSelectorModal.test.tsx
index ba8f2a2a7086..41b55bb8b616 100644
--- a/app/components/UI/Ramp/Aggregator/components/PaymentMethodSelectorModal/PaymentMethodSelectorModal.test.tsx
+++ b/app/components/UI/Ramp/Aggregator/components/PaymentMethodSelectorModal/PaymentMethodSelectorModal.test.tsx
@@ -110,7 +110,34 @@ describe('PaymentMethodSelectorModal', () => {
     expect(toJSON()).toMatchSnapshot();
   });
 
-  it('tracks RAMPS_PAYMENT_METHOD_SELECTED event when payment method is selected', () => {
+  it('tracks OFFRAMP_PAYMENT_METHOD_SELECTED event when payment method is selected in sell flow', () => {
+    mockUseParams.mockReturnValue({
+      ...defaultParams,
+      location: 'Amount to Sell Screen' as const,
+    });
+    mockUseRampSDKValues = {
+      ...mockUseRampSDKInitialValues,
+      rampType: RampType.SELL,
+      isBuy: false,
+    };
+
+    const { getByText } = render(PaymentMethodSelectorModal);
+
+    const paymentMethodElement = getByText('Bank Transfer');
+    fireEvent.press(paymentMethodElement);
+
+    expect(mockTrackEvent).toHaveBeenCalledWith(
+      'OFFRAMP_PAYMENT_METHOD_SELECTED',
+      {
+        payment_method_id: 'payment-method-2',
+        available_payment_method_ids: ['payment-method-1', 'payment-method-2'],
+        region: 'US',
+        location: 'Amount to Sell Screen',
+      },
+    );
+  });
+
+  it('tracks ONRAMP_PAYMENT_METHOD_SELECTED event when payment method is selected in buy flow', () => {
     const { getByText } = render(PaymentMethodSelectorModal);
 
     const paymentMethodElement = getByText('Bank Transfer');
@@ -126,7 +153,7 @@ describe('PaymentMethodSelectorModal', () => {
       },
     );
   });
-  it('does not track RAMPS_PAYMENT_METHOD_SELECTED event when the same payment method is selected', () => {
+  it('does not track ONRAMP_PAYMENT_METHOD_SELECTED event when the same payment method is selected', () => {
     const { getByText } = render(PaymentMethodSelectorModal);
 
     const paymentMethodElement = getByText('Credit Card');
diff --git a/app/components/UI/Ramp/Aggregator/components/PaymentMethodSelectorModal/__snapshots__/PaymentMethodSelectorModal.test.tsx.snap b/app/components/UI/Ramp/Aggregator/components/PaymentMethodSelectorModal/__snapshots__/PaymentMethodSelectorModal.test.tsx.snap
index 2b96ed2bab6a..28d9429380b0 100644
--- a/app/components/UI/Ramp/Aggregator/components/PaymentMethodSelectorModal/__snapshots__/PaymentMethodSelectorModal.test.tsx.snap
+++ b/app/components/UI/Ramp/Aggregator/components/PaymentMethodSelectorModal/__snapshots__/PaymentMethodSelectorModal.test.tsx.snap
@@ -334,7 +334,7 @@ exports[`PaymentMethodSelectorModal renders correctly 1`] = `
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -384,7 +384,7 @@ exports[`PaymentMethodSelectorModal renders correctly 1`] = `
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -421,7 +421,7 @@ exports[`PaymentMethodSelectorModal renders correctly 1`] = `
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -481,7 +481,7 @@ exports[`PaymentMethodSelectorModal renders correctly 1`] = `
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 16,
                                         "fontWeight": 400,
@@ -559,7 +559,7 @@ exports[`PaymentMethodSelectorModal renders correctly 1`] = `
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "height": 24,
                                           "width": 24,
                                         },
@@ -609,7 +609,7 @@ exports[`PaymentMethodSelectorModal renders correctly 1`] = `
                                       style={
                                         [
                                           {
-                                            "backgroundColor": "#3c4d9d0f",
+                                            "backgroundColor": "#b4b4b528",
                                             "borderRadius": 8,
                                             "padding": 16,
                                           },
@@ -654,7 +654,7 @@ exports[`PaymentMethodSelectorModal renders correctly 1`] = `
                                                 [
                                                   {
                                                     "alignItems": "center",
-                                                    "backgroundColor": "#f3f5f9",
+                                                    "backgroundColor": "#f3f3f4",
                                                     "borderRadius": 6,
                                                     "height": 38,
                                                     "justifyContent": "center",
@@ -678,7 +678,7 @@ exports[`PaymentMethodSelectorModal renders correctly 1`] = `
                                                       "fontSize": 13,
                                                     },
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                     },
                                                     {
                                                       "fontFamily": "Material Icons",
@@ -714,9 +714,9 @@ exports[`PaymentMethodSelectorModal renders correctly 1`] = `
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Medium",
-                                                  "fontSize": 18,
+                                                  "fontSize": 20,
                                                   "letterSpacing": 0,
                                                   "lineHeight": 24,
                                                   "marginBottom": 4,
@@ -777,7 +777,7 @@ exports[`PaymentMethodSelectorModal renders correctly 1`] = `
                                             style={
                                               [
                                                 {
-                                                  "backgroundColor": "#b7bbc866",
+                                                  "backgroundColor": "#b4b4b566",
                                                   "height": 1,
                                                   "marginVertical": 12,
                                                 },
@@ -792,7 +792,7 @@ exports[`PaymentMethodSelectorModal renders correctly 1`] = `
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Regular",
                                                 "fontSize": 14,
                                                 "letterSpacing": 0,
@@ -829,7 +829,7 @@ exports[`PaymentMethodSelectorModal renders correctly 1`] = `
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#b7bbc8",
+                                                  "color": "#babbbe",
                                                   "fontFamily": "Geist-Regular",
                                                   "fontSize": 16,
                                                   "letterSpacing": 0,
@@ -843,7 +843,7 @@ exports[`PaymentMethodSelectorModal renders correctly 1`] = `
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#b7bbc8",
+                                                  "color": "#babbbe",
                                                   "fontFamily": "Geist-Regular",
                                                   "fontSize": 16,
                                                   "letterSpacing": 0,
@@ -857,7 +857,7 @@ exports[`PaymentMethodSelectorModal renders correctly 1`] = `
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#b7bbc8",
+                                                  "color": "#babbbe",
                                                   "fontFamily": "Geist-Regular",
                                                   "fontSize": 16,
                                                   "letterSpacing": 0,
@@ -892,7 +892,7 @@ exports[`PaymentMethodSelectorModal renders correctly 1`] = `
                                       style={
                                         [
                                           {
-                                            "backgroundColor": "#3c4d9d0f",
+                                            "backgroundColor": "#b4b4b528",
                                             "borderRadius": 8,
                                             "padding": 16,
                                           },
@@ -935,7 +935,7 @@ exports[`PaymentMethodSelectorModal renders correctly 1`] = `
                                                 [
                                                   {
                                                     "alignItems": "center",
-                                                    "backgroundColor": "#f3f5f9",
+                                                    "backgroundColor": "#f3f3f4",
                                                     "borderRadius": 6,
                                                     "height": 38,
                                                     "justifyContent": "center",
@@ -959,7 +959,7 @@ exports[`PaymentMethodSelectorModal renders correctly 1`] = `
                                                       "fontSize": 13,
                                                     },
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                     },
                                                     {
                                                       "fontFamily": "Material Design Icons",
@@ -995,9 +995,9 @@ exports[`PaymentMethodSelectorModal renders correctly 1`] = `
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Medium",
-                                                  "fontSize": 18,
+                                                  "fontSize": 20,
                                                   "letterSpacing": 0,
                                                   "lineHeight": 24,
                                                   "marginBottom": 4,
@@ -1058,7 +1058,7 @@ exports[`PaymentMethodSelectorModal renders correctly 1`] = `
                                             style={
                                               [
                                                 {
-                                                  "backgroundColor": "#b7bbc866",
+                                                  "backgroundColor": "#b4b4b566",
                                                   "height": 1,
                                                   "marginVertical": 12,
                                                 },
@@ -1073,7 +1073,7 @@ exports[`PaymentMethodSelectorModal renders correctly 1`] = `
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Regular",
                                                 "fontSize": 14,
                                                 "letterSpacing": 0,
@@ -1110,7 +1110,7 @@ exports[`PaymentMethodSelectorModal renders correctly 1`] = `
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Regular",
                                                   "fontSize": 16,
                                                   "letterSpacing": 0,
@@ -1124,7 +1124,7 @@ exports[`PaymentMethodSelectorModal renders correctly 1`] = `
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#b7bbc8",
+                                                  "color": "#babbbe",
                                                   "fontFamily": "Geist-Regular",
                                                   "fontSize": 16,
                                                   "letterSpacing": 0,
@@ -1138,7 +1138,7 @@ exports[`PaymentMethodSelectorModal renders correctly 1`] = `
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#b7bbc8",
+                                                  "color": "#babbbe",
                                                   "fontFamily": "Geist-Regular",
                                                   "fontSize": 16,
                                                   "letterSpacing": 0,
@@ -1168,7 +1168,7 @@ exports[`PaymentMethodSelectorModal renders correctly 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 14,
                                         "letterSpacing": 0,
@@ -1532,7 +1532,7 @@ exports[`PaymentMethodSelectorModal renders for sell flow 1`] = `
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -1582,7 +1582,7 @@ exports[`PaymentMethodSelectorModal renders for sell flow 1`] = `
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -1619,7 +1619,7 @@ exports[`PaymentMethodSelectorModal renders for sell flow 1`] = `
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -1679,7 +1679,7 @@ exports[`PaymentMethodSelectorModal renders for sell flow 1`] = `
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 16,
                                         "fontWeight": 400,
@@ -1757,7 +1757,7 @@ exports[`PaymentMethodSelectorModal renders for sell flow 1`] = `
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "height": 24,
                                           "width": 24,
                                         },
@@ -1807,7 +1807,7 @@ exports[`PaymentMethodSelectorModal renders for sell flow 1`] = `
                                       style={
                                         [
                                           {
-                                            "backgroundColor": "#3c4d9d0f",
+                                            "backgroundColor": "#b4b4b528",
                                             "borderRadius": 8,
                                             "padding": 16,
                                           },
@@ -1852,7 +1852,7 @@ exports[`PaymentMethodSelectorModal renders for sell flow 1`] = `
                                                 [
                                                   {
                                                     "alignItems": "center",
-                                                    "backgroundColor": "#f3f5f9",
+                                                    "backgroundColor": "#f3f3f4",
                                                     "borderRadius": 6,
                                                     "height": 38,
                                                     "justifyContent": "center",
@@ -1876,7 +1876,7 @@ exports[`PaymentMethodSelectorModal renders for sell flow 1`] = `
                                                       "fontSize": 13,
                                                     },
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                     },
                                                     {
                                                       "fontFamily": "Material Icons",
@@ -1912,9 +1912,9 @@ exports[`PaymentMethodSelectorModal renders for sell flow 1`] = `
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Medium",
-                                                  "fontSize": 18,
+                                                  "fontSize": 20,
                                                   "letterSpacing": 0,
                                                   "lineHeight": 24,
                                                   "marginBottom": 4,
@@ -1975,7 +1975,7 @@ exports[`PaymentMethodSelectorModal renders for sell flow 1`] = `
                                             style={
                                               [
                                                 {
-                                                  "backgroundColor": "#b7bbc866",
+                                                  "backgroundColor": "#b4b4b566",
                                                   "height": 1,
                                                   "marginVertical": 12,
                                                 },
@@ -1990,7 +1990,7 @@ exports[`PaymentMethodSelectorModal renders for sell flow 1`] = `
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Regular",
                                                 "fontSize": 14,
                                                 "letterSpacing": 0,
@@ -2027,7 +2027,7 @@ exports[`PaymentMethodSelectorModal renders for sell flow 1`] = `
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#b7bbc8",
+                                                  "color": "#babbbe",
                                                   "fontFamily": "Geist-Regular",
                                                   "fontSize": 16,
                                                   "letterSpacing": 0,
@@ -2041,7 +2041,7 @@ exports[`PaymentMethodSelectorModal renders for sell flow 1`] = `
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#b7bbc8",
+                                                  "color": "#babbbe",
                                                   "fontFamily": "Geist-Regular",
                                                   "fontSize": 16,
                                                   "letterSpacing": 0,
@@ -2055,7 +2055,7 @@ exports[`PaymentMethodSelectorModal renders for sell flow 1`] = `
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#b7bbc8",
+                                                  "color": "#babbbe",
                                                   "fontFamily": "Geist-Regular",
                                                   "fontSize": 16,
                                                   "letterSpacing": 0,
@@ -2090,7 +2090,7 @@ exports[`PaymentMethodSelectorModal renders for sell flow 1`] = `
                                       style={
                                         [
                                           {
-                                            "backgroundColor": "#3c4d9d0f",
+                                            "backgroundColor": "#b4b4b528",
                                             "borderRadius": 8,
                                             "padding": 16,
                                           },
@@ -2133,7 +2133,7 @@ exports[`PaymentMethodSelectorModal renders for sell flow 1`] = `
                                                 [
                                                   {
                                                     "alignItems": "center",
-                                                    "backgroundColor": "#f3f5f9",
+                                                    "backgroundColor": "#f3f3f4",
                                                     "borderRadius": 6,
                                                     "height": 38,
                                                     "justifyContent": "center",
@@ -2157,7 +2157,7 @@ exports[`PaymentMethodSelectorModal renders for sell flow 1`] = `
                                                       "fontSize": 13,
                                                     },
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                     },
                                                     {
                                                       "fontFamily": "Material Design Icons",
@@ -2193,9 +2193,9 @@ exports[`PaymentMethodSelectorModal renders for sell flow 1`] = `
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Medium",
-                                                  "fontSize": 18,
+                                                  "fontSize": 20,
                                                   "letterSpacing": 0,
                                                   "lineHeight": 24,
                                                   "marginBottom": 4,
@@ -2256,7 +2256,7 @@ exports[`PaymentMethodSelectorModal renders for sell flow 1`] = `
                                             style={
                                               [
                                                 {
-                                                  "backgroundColor": "#b7bbc866",
+                                                  "backgroundColor": "#b4b4b566",
                                                   "height": 1,
                                                   "marginVertical": 12,
                                                 },
@@ -2271,7 +2271,7 @@ exports[`PaymentMethodSelectorModal renders for sell flow 1`] = `
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Regular",
                                                 "fontSize": 14,
                                                 "letterSpacing": 0,
@@ -2308,7 +2308,7 @@ exports[`PaymentMethodSelectorModal renders for sell flow 1`] = `
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Regular",
                                                   "fontSize": 16,
                                                   "letterSpacing": 0,
@@ -2322,7 +2322,7 @@ exports[`PaymentMethodSelectorModal renders for sell flow 1`] = `
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#b7bbc8",
+                                                  "color": "#babbbe",
                                                   "fontFamily": "Geist-Regular",
                                                   "fontSize": 16,
                                                   "letterSpacing": 0,
@@ -2336,7 +2336,7 @@ exports[`PaymentMethodSelectorModal renders for sell flow 1`] = `
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#b7bbc8",
+                                                  "color": "#babbbe",
                                                   "fontFamily": "Geist-Regular",
                                                   "fontSize": 16,
                                                   "letterSpacing": 0,
@@ -2366,7 +2366,7 @@ exports[`PaymentMethodSelectorModal renders for sell flow 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 14,
                                         "letterSpacing": 0,
@@ -2730,7 +2730,7 @@ exports[`PaymentMethodSelectorModal renders without disclaimer when selected pay
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -2780,7 +2780,7 @@ exports[`PaymentMethodSelectorModal renders without disclaimer when selected pay
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -2817,7 +2817,7 @@ exports[`PaymentMethodSelectorModal renders without disclaimer when selected pay
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -2877,7 +2877,7 @@ exports[`PaymentMethodSelectorModal renders without disclaimer when selected pay
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 16,
                                         "fontWeight": 400,
@@ -2955,7 +2955,7 @@ exports[`PaymentMethodSelectorModal renders without disclaimer when selected pay
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "height": 24,
                                           "width": 24,
                                         },
@@ -3005,7 +3005,7 @@ exports[`PaymentMethodSelectorModal renders without disclaimer when selected pay
                                       style={
                                         [
                                           {
-                                            "backgroundColor": "#3c4d9d0f",
+                                            "backgroundColor": "#b4b4b528",
                                             "borderRadius": 8,
                                             "padding": 16,
                                           },
@@ -3048,7 +3048,7 @@ exports[`PaymentMethodSelectorModal renders without disclaimer when selected pay
                                                 [
                                                   {
                                                     "alignItems": "center",
-                                                    "backgroundColor": "#f3f5f9",
+                                                    "backgroundColor": "#f3f3f4",
                                                     "borderRadius": 6,
                                                     "height": 38,
                                                     "justifyContent": "center",
@@ -3072,7 +3072,7 @@ exports[`PaymentMethodSelectorModal renders without disclaimer when selected pay
                                                       "fontSize": 13,
                                                     },
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                     },
                                                     {
                                                       "fontFamily": "Material Icons",
@@ -3108,9 +3108,9 @@ exports[`PaymentMethodSelectorModal renders without disclaimer when selected pay
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Medium",
-                                                  "fontSize": 18,
+                                                  "fontSize": 20,
                                                   "letterSpacing": 0,
                                                   "lineHeight": 24,
                                                   "marginBottom": 4,
@@ -3171,7 +3171,7 @@ exports[`PaymentMethodSelectorModal renders without disclaimer when selected pay
                                             style={
                                               [
                                                 {
-                                                  "backgroundColor": "#b7bbc866",
+                                                  "backgroundColor": "#b4b4b566",
                                                   "height": 1,
                                                   "marginVertical": 12,
                                                 },
@@ -3186,7 +3186,7 @@ exports[`PaymentMethodSelectorModal renders without disclaimer when selected pay
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Regular",
                                                 "fontSize": 14,
                                                 "letterSpacing": 0,
@@ -3223,7 +3223,7 @@ exports[`PaymentMethodSelectorModal renders without disclaimer when selected pay
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#b7bbc8",
+                                                  "color": "#babbbe",
                                                   "fontFamily": "Geist-Regular",
                                                   "fontSize": 16,
                                                   "letterSpacing": 0,
@@ -3237,7 +3237,7 @@ exports[`PaymentMethodSelectorModal renders without disclaimer when selected pay
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#b7bbc8",
+                                                  "color": "#babbbe",
                                                   "fontFamily": "Geist-Regular",
                                                   "fontSize": 16,
                                                   "letterSpacing": 0,
@@ -3251,7 +3251,7 @@ exports[`PaymentMethodSelectorModal renders without disclaimer when selected pay
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#b7bbc8",
+                                                  "color": "#babbbe",
                                                   "fontFamily": "Geist-Regular",
                                                   "fontSize": 16,
                                                   "letterSpacing": 0,
@@ -3286,7 +3286,7 @@ exports[`PaymentMethodSelectorModal renders without disclaimer when selected pay
                                       style={
                                         [
                                           {
-                                            "backgroundColor": "#3c4d9d0f",
+                                            "backgroundColor": "#b4b4b528",
                                             "borderRadius": 8,
                                             "padding": 16,
                                           },
@@ -3331,7 +3331,7 @@ exports[`PaymentMethodSelectorModal renders without disclaimer when selected pay
                                                 [
                                                   {
                                                     "alignItems": "center",
-                                                    "backgroundColor": "#f3f5f9",
+                                                    "backgroundColor": "#f3f3f4",
                                                     "borderRadius": 6,
                                                     "height": 38,
                                                     "justifyContent": "center",
@@ -3355,7 +3355,7 @@ exports[`PaymentMethodSelectorModal renders without disclaimer when selected pay
                                                       "fontSize": 13,
                                                     },
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                     },
                                                     {
                                                       "fontFamily": "Material Design Icons",
@@ -3391,9 +3391,9 @@ exports[`PaymentMethodSelectorModal renders without disclaimer when selected pay
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Medium",
-                                                  "fontSize": 18,
+                                                  "fontSize": 20,
                                                   "letterSpacing": 0,
                                                   "lineHeight": 24,
                                                   "marginBottom": 4,
@@ -3454,7 +3454,7 @@ exports[`PaymentMethodSelectorModal renders without disclaimer when selected pay
                                             style={
                                               [
                                                 {
-                                                  "backgroundColor": "#b7bbc866",
+                                                  "backgroundColor": "#b4b4b566",
                                                   "height": 1,
                                                   "marginVertical": 12,
                                                 },
@@ -3469,7 +3469,7 @@ exports[`PaymentMethodSelectorModal renders without disclaimer when selected pay
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Regular",
                                                 "fontSize": 14,
                                                 "letterSpacing": 0,
@@ -3506,7 +3506,7 @@ exports[`PaymentMethodSelectorModal renders without disclaimer when selected pay
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Regular",
                                                   "fontSize": 16,
                                                   "letterSpacing": 0,
@@ -3520,7 +3520,7 @@ exports[`PaymentMethodSelectorModal renders without disclaimer when selected pay
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#b7bbc8",
+                                                  "color": "#babbbe",
                                                   "fontFamily": "Geist-Regular",
                                                   "fontSize": 16,
                                                   "letterSpacing": 0,
@@ -3534,7 +3534,7 @@ exports[`PaymentMethodSelectorModal renders without disclaimer when selected pay
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#b7bbc8",
+                                                  "color": "#babbbe",
                                                   "fontFamily": "Geist-Regular",
                                                   "fontSize": 16,
                                                   "letterSpacing": 0,
diff --git a/app/components/UI/Ramp/Aggregator/components/Quote/__snapshots__/Quote.test.tsx.snap b/app/components/UI/Ramp/Aggregator/components/Quote/__snapshots__/Quote.test.tsx.snap
index 31a16c1b66df..539407d600ae 100644
--- a/app/components/UI/Ramp/Aggregator/components/Quote/__snapshots__/Quote.test.tsx.snap
+++ b/app/components/UI/Ramp/Aggregator/components/Quote/__snapshots__/Quote.test.tsx.snap
@@ -19,7 +19,7 @@ exports[`Quote Component shows loading indicator when isLoading is true 1`] = `
       style={
         [
           {
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderRadius": 8,
             "padding": 16,
           },
@@ -159,7 +159,7 @@ exports[`Quote Component shows loading indicator when isLoading is true 1`] = `
                       "fontSize": 12,
                     },
                     {
-                      "color": "#686e7d",
+                      "color": "#66676a",
                       "marginLeft": 8,
                     },
                     {
@@ -196,9 +196,9 @@ exports[`Quote Component shows loading indicator when isLoading is true 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Medium",
-                  "fontSize": 18,
+                  "fontSize": 20,
                   "letterSpacing": 0,
                   "lineHeight": 24,
                 }
@@ -230,9 +230,9 @@ exports[`Quote Component shows loading indicator when isLoading is true 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Medium",
-                  "fontSize": 18,
+                  "fontSize": 20,
                   "letterSpacing": 0,
                   "lineHeight": 24,
                 }
@@ -285,7 +285,7 @@ exports[`Quote Component shows loading indicator when isLoading is true 1`] = `
                   {
                     "alignItems": "center",
                     "alignSelf": "stretch",
-                    "backgroundColor": "#121314",
+                    "backgroundColor": "#131416",
                     "borderRadius": 12,
                     "flexDirection": "row",
                     "height": 48,
diff --git a/app/components/UI/Ramp/Aggregator/components/TokenSelectModal/__snapshots__/TokenSelectModal.test.tsx.snap b/app/components/UI/Ramp/Aggregator/components/TokenSelectModal/__snapshots__/TokenSelectModal.test.tsx.snap
index 418b2b393431..7ea1718fdb8c 100644
--- a/app/components/UI/Ramp/Aggregator/components/TokenSelectModal/__snapshots__/TokenSelectModal.test.tsx.snap
+++ b/app/components/UI/Ramp/Aggregator/components/TokenSelectModal/__snapshots__/TokenSelectModal.test.tsx.snap
@@ -334,7 +334,7 @@ exports[`TokenSelectModal renders the modal with token list 1`] = `
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -384,7 +384,7 @@ exports[`TokenSelectModal renders the modal with token list 1`] = `
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -421,7 +421,7 @@ exports[`TokenSelectModal renders the modal with token list 1`] = `
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -481,7 +481,7 @@ exports[`TokenSelectModal renders the modal with token list 1`] = `
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 16,
                                         "fontWeight": 400,
@@ -559,7 +559,7 @@ exports[`TokenSelectModal renders the modal with token list 1`] = `
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "height": 24,
                                           "width": 24,
                                         },
@@ -599,7 +599,7 @@ exports[`TokenSelectModal renders the modal with token list 1`] = `
                                   {
                                     "alignItems": "center",
                                     "alignSelf": "flex-start",
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "borderColor": "transparent",
                                     "borderRadius": 12,
                                     "borderWidth": 1,
@@ -730,7 +730,7 @@ exports[`TokenSelectModal renders the modal with token list 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -741,7 +741,7 @@ exports[`TokenSelectModal renders the modal with token list 1`] = `
                                     All networks
                                   </Text>
                                   <SvgMock
-                                    color="#121314"
+                                    color="#131416"
                                     fill="currentColor"
                                     height={12}
                                     name="ArrowDown"
@@ -798,8 +798,8 @@ exports[`TokenSelectModal renders the modal with token list 1`] = `
                               style={
                                 {
                                   "alignItems": "center",
-                                  "backgroundColor": "#3c4d9d0f",
-                                  "borderColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b528",
+                                  "borderColor": "#b4b4b566",
                                   "borderRadius": 24,
                                   "borderWidth": 1,
                                   "flexDirection": "row",
@@ -819,7 +819,7 @@ exports[`TokenSelectModal renders the modal with token list 1`] = `
                                 testID="textfield-startacccessory"
                               >
                                 <SvgMock
-                                  color="#686e7d"
+                                  color="#66676a"
                                   fill="currentColor"
                                   height={20}
                                   name="Search"
@@ -848,18 +848,19 @@ exports[`TokenSelectModal renders the modal with token list 1`] = `
                                   onChangeText={[Function]}
                                   onFocus={[Function]}
                                   placeholder="Search by cryptocurrency"
-                                  placeholderTextColor="#686e7d"
+                                  placeholderTextColor="#66676a"
                                   style={
                                     {
                                       "backgroundColor": "inherit",
                                       "borderColor": "transparent",
                                       "borderWidth": 1,
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "fontWeight": "400",
                                       "height": 46,
                                       "letterSpacing": 0,
+                                      "lineHeight": 0,
                                       "opacity": 1,
                                     }
                                   }
@@ -1009,7 +1010,7 @@ exports[`TokenSelectModal renders the modal with token list 1`] = `
                                                 [
                                                   {
                                                     "alignItems": "center",
-                                                    "backgroundColor": "#f3f5f9",
+                                                    "backgroundColor": "#f3f3f4",
                                                     "borderRadius": 9999,
                                                     "height": 40,
                                                     "justifyContent": "center",
@@ -1141,9 +1142,9 @@ exports[`TokenSelectModal renders the modal with token list 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -1155,7 +1156,7 @@ exports[`TokenSelectModal renders the modal with token list 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -1230,7 +1231,7 @@ exports[`TokenSelectModal renders the modal with token list 1`] = `
                                                 [
                                                   {
                                                     "alignItems": "center",
-                                                    "backgroundColor": "#f3f5f9",
+                                                    "backgroundColor": "#f3f3f4",
                                                     "borderRadius": 9999,
                                                     "height": 40,
                                                     "justifyContent": "center",
@@ -1362,9 +1363,9 @@ exports[`TokenSelectModal renders the modal with token list 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -1376,7 +1377,7 @@ exports[`TokenSelectModal renders the modal with token list 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -1451,7 +1452,7 @@ exports[`TokenSelectModal renders the modal with token list 1`] = `
                                                 [
                                                   {
                                                     "alignItems": "center",
-                                                    "backgroundColor": "#f3f5f9",
+                                                    "backgroundColor": "#f3f3f4",
                                                     "borderRadius": 9999,
                                                     "height": 40,
                                                     "justifyContent": "center",
@@ -1583,9 +1584,9 @@ exports[`TokenSelectModal renders the modal with token list 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -1597,7 +1598,7 @@ exports[`TokenSelectModal renders the modal with token list 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -1672,7 +1673,7 @@ exports[`TokenSelectModal renders the modal with token list 1`] = `
                                                 [
                                                   {
                                                     "alignItems": "center",
-                                                    "backgroundColor": "#f3f5f9",
+                                                    "backgroundColor": "#f3f3f4",
                                                     "borderRadius": 9999,
                                                     "height": 40,
                                                     "justifyContent": "center",
@@ -1804,9 +1805,9 @@ exports[`TokenSelectModal renders the modal with token list 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -1818,7 +1819,7 @@ exports[`TokenSelectModal renders the modal with token list 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
diff --git a/app/components/UI/Ramp/Aggregator/components/UnsupportedRegionModal/__snapshots__/UnsupportedRegionModal.test.tsx.snap b/app/components/UI/Ramp/Aggregator/components/UnsupportedRegionModal/__snapshots__/UnsupportedRegionModal.test.tsx.snap
index 54ae671c7fd6..39a7dd84f8af 100644
--- a/app/components/UI/Ramp/Aggregator/components/UnsupportedRegionModal/__snapshots__/UnsupportedRegionModal.test.tsx.snap
+++ b/app/components/UI/Ramp/Aggregator/components/UnsupportedRegionModal/__snapshots__/UnsupportedRegionModal.test.tsx.snap
@@ -334,7 +334,7 @@ exports[`UnsupportedRegionModal renders correctly for buy flow 1`] = `
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -384,7 +384,7 @@ exports[`UnsupportedRegionModal renders correctly for buy flow 1`] = `
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -444,9 +444,9 @@ exports[`UnsupportedRegionModal renders correctly for buy flow 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Bold",
-                                    "fontSize": 18,
+                                    "fontSize": 20,
                                     "letterSpacing": 0,
                                     "lineHeight": 24,
                                   }
@@ -467,7 +467,7 @@ exports[`UnsupportedRegionModal renders correctly for buy flow 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -490,9 +490,9 @@ exports[`UnsupportedRegionModal renders correctly for buy flow 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Medium",
-                                    "fontSize": 18,
+                                    "fontSize": 20,
                                     "letterSpacing": 0,
                                     "lineHeight": 24,
                                   }
@@ -504,9 +504,9 @@ exports[`UnsupportedRegionModal renders correctly for buy flow 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Medium",
-                                    "fontSize": 18,
+                                    "fontSize": 20,
                                     "letterSpacing": 0,
                                     "lineHeight": 24,
                                     "marginLeft": 8,
@@ -555,7 +555,7 @@ exports[`UnsupportedRegionModal renders correctly for buy flow 1`] = `
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
@@ -930,7 +930,7 @@ exports[`UnsupportedRegionModal renders correctly for sell flow 1`] = `
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -980,7 +980,7 @@ exports[`UnsupportedRegionModal renders correctly for sell flow 1`] = `
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -1040,9 +1040,9 @@ exports[`UnsupportedRegionModal renders correctly for sell flow 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Bold",
-                                    "fontSize": 18,
+                                    "fontSize": 20,
                                     "letterSpacing": 0,
                                     "lineHeight": 24,
                                   }
@@ -1063,7 +1063,7 @@ exports[`UnsupportedRegionModal renders correctly for sell flow 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -1086,9 +1086,9 @@ exports[`UnsupportedRegionModal renders correctly for sell flow 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Medium",
-                                    "fontSize": 18,
+                                    "fontSize": 20,
                                     "letterSpacing": 0,
                                     "lineHeight": 24,
                                   }
@@ -1100,9 +1100,9 @@ exports[`UnsupportedRegionModal renders correctly for sell flow 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Medium",
-                                    "fontSize": 18,
+                                    "fontSize": 20,
                                     "letterSpacing": 0,
                                     "lineHeight": 24,
                                     "marginLeft": 8,
@@ -1151,7 +1151,7 @@ exports[`UnsupportedRegionModal renders correctly for sell flow 1`] = `
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
diff --git a/app/components/UI/Ramp/Aggregator/components/__snapshots__/AccountSelector.test.tsx.snap b/app/components/UI/Ramp/Aggregator/components/__snapshots__/AccountSelector.test.tsx.snap
index 00fcbd0cb4b0..6425b3c44e3c 100644
--- a/app/components/UI/Ramp/Aggregator/components/__snapshots__/AccountSelector.test.tsx.snap
+++ b/app/components/UI/Ramp/Aggregator/components/__snapshots__/AccountSelector.test.tsx.snap
@@ -14,7 +14,7 @@ exports[`AccountSelector renders correctly with selected address 1`] = `
     style={
       {
         "alignItems": "center",
-        "backgroundColor": "#3c4d9d0f",
+        "backgroundColor": "#b4b4b528",
         "borderRadius": 100,
         "flexDirection": "row",
         "justifyContent": "center",
@@ -49,7 +49,7 @@ exports[`AccountSelector renders correctly with selected address 1`] = `
       numberOfLines={1}
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "flexShrink": 1,
           "fontFamily": "Geist-Medium",
           "fontSize": 16,
@@ -63,7 +63,7 @@ exports[`AccountSelector renders correctly with selected address 1`] = `
       Test Account
     </Text>
     <SvgMock
-      color="#686e7d"
+      color="#66676a"
       fill="currentColor"
       height={16}
       name="ArrowDown"
diff --git a/app/components/UI/Ramp/Aggregator/components/__snapshots__/AmountInput.test.tsx.snap b/app/components/UI/Ramp/Aggregator/components/__snapshots__/AmountInput.test.tsx.snap
index 02cd329946f5..266f6e24c3bb 100644
--- a/app/components/UI/Ramp/Aggregator/components/__snapshots__/AmountInput.test.tsx.snap
+++ b/app/components/UI/Ramp/Aggregator/components/__snapshots__/AmountInput.test.tsx.snap
@@ -6,7 +6,7 @@ exports[`AmountInput renders correctly 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
@@ -26,7 +26,7 @@ exports[`AmountInput renders correctly 1`] = `
       style={
         [
           {
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderRadius": 8,
             "padding": 16,
           },
@@ -83,7 +83,7 @@ exports[`AmountInput renders correctly 1`] = `
                 numberOfLines={1}
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Medium",
                     "fontSize": 24,
                     "letterSpacing": 0,
@@ -109,7 +109,7 @@ exports[`AmountInput renders correctly with currency selector 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
@@ -129,7 +129,7 @@ exports[`AmountInput renders correctly with currency selector 1`] = `
       style={
         [
           {
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderRadius": 8,
             "padding": 16,
           },
@@ -186,7 +186,7 @@ exports[`AmountInput renders correctly with currency selector 1`] = `
                 numberOfLines={1}
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Medium",
                     "fontSize": 24,
                     "letterSpacing": 0,
@@ -248,7 +248,7 @@ exports[`AmountInput renders correctly with currency selector 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -259,7 +259,7 @@ exports[`AmountInput renders correctly with currency selector 1`] = `
                   USD
                 </Text>
                 <SvgMock
-                  color="#686e7d"
+                  color="#66676a"
                   fill="currentColor"
                   height={16}
                   name="ArrowDown"
@@ -288,7 +288,7 @@ exports[`AmountInput renders loading state correctly 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
@@ -308,7 +308,7 @@ exports[`AmountInput renders loading state correctly 1`] = `
       style={
         [
           {
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderRadius": 8,
             "padding": 16,
           },
@@ -363,7 +363,7 @@ exports[`AmountInput renders loading state correctly 1`] = `
                 style={
                   [
                     {
-                      "backgroundColor": "#858b9a14",
+                      "backgroundColor": "#b4b4b528",
                       "borderRadius": 30,
                       "padding": 14,
                     },
@@ -401,7 +401,7 @@ exports[`AmountInput renders loading state correctly with currency selector 1`]
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
@@ -421,7 +421,7 @@ exports[`AmountInput renders loading state correctly with currency selector 1`]
       style={
         [
           {
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderRadius": 8,
             "padding": 16,
           },
@@ -476,7 +476,7 @@ exports[`AmountInput renders loading state correctly with currency selector 1`]
                 style={
                   [
                     {
-                      "backgroundColor": "#858b9a14",
+                      "backgroundColor": "#b4b4b528",
                       "borderRadius": 30,
                       "padding": 14,
                     },
@@ -523,7 +523,7 @@ exports[`AmountInput renders loading state correctly with currency selector 1`]
               style={
                 [
                   {
-                    "backgroundColor": "#858b9a14",
+                    "backgroundColor": "#b4b4b528",
                     "borderRadius": 30,
                     "padding": 14,
                   },
diff --git a/app/components/UI/Ramp/Aggregator/components/__snapshots__/AssetSelectorButton.test.tsx.snap b/app/components/UI/Ramp/Aggregator/components/__snapshots__/AssetSelectorButton.test.tsx.snap
index 0763d40108dc..8b715ea93125 100644
--- a/app/components/UI/Ramp/Aggregator/components/__snapshots__/AssetSelectorButton.test.tsx.snap
+++ b/app/components/UI/Ramp/Aggregator/components/__snapshots__/AssetSelectorButton.test.tsx.snap
@@ -6,7 +6,7 @@ exports[`AssetSelectorButton renders correctly 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
@@ -26,7 +26,7 @@ exports[`AssetSelectorButton renders correctly 1`] = `
       style={
         [
           {
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderRadius": 8,
             "padding": 16,
           },
@@ -96,9 +96,9 @@ exports[`AssetSelectorButton renders correctly 1`] = `
                 numberOfLines={1}
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Medium",
-                    "fontSize": 18,
+                    "fontSize": 20,
                     "letterSpacing": 0,
                     "lineHeight": 24,
                   }
@@ -140,7 +140,7 @@ exports[`AssetSelectorButton renders correctly 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -151,7 +151,7 @@ exports[`AssetSelectorButton renders correctly 1`] = `
                   ETH
                 </Text>
                 <SvgMock
-                  color="#686e7d"
+                  color="#66676a"
                   fill="currentColor"
                   height={16}
                   name="ArrowDown"
@@ -180,7 +180,7 @@ exports[`AssetSelectorButton renders correctly without icon 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
@@ -200,7 +200,7 @@ exports[`AssetSelectorButton renders correctly without icon 1`] = `
       style={
         [
           {
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderRadius": 8,
             "padding": 16,
           },
@@ -245,9 +245,9 @@ exports[`AssetSelectorButton renders correctly without icon 1`] = `
                 numberOfLines={1}
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Medium",
-                    "fontSize": 18,
+                    "fontSize": 20,
                     "letterSpacing": 0,
                     "lineHeight": 24,
                   }
@@ -289,7 +289,7 @@ exports[`AssetSelectorButton renders correctly without icon 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -300,7 +300,7 @@ exports[`AssetSelectorButton renders correctly without icon 1`] = `
                   ETH
                 </Text>
                 <SvgMock
-                  color="#686e7d"
+                  color="#66676a"
                   fill="currentColor"
                   height={16}
                   name="ArrowDown"
@@ -329,7 +329,7 @@ exports[`AssetSelectorButton renders loading state correctly 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
@@ -349,7 +349,7 @@ exports[`AssetSelectorButton renders loading state correctly 1`] = `
       style={
         [
           {
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderRadius": 8,
             "padding": 16,
           },
@@ -393,7 +393,7 @@ exports[`AssetSelectorButton renders loading state correctly 1`] = `
                   [
                     {
                       "alignItems": "center",
-                      "backgroundColor": "#858b9a14",
+                      "backgroundColor": "#b4b4b528",
                       "borderRadius": 9999,
                       "height": 48,
                       "justifyContent": "center",
@@ -426,7 +426,7 @@ exports[`AssetSelectorButton renders loading state correctly 1`] = `
                 style={
                   [
                     {
-                      "backgroundColor": "#858b9a14",
+                      "backgroundColor": "#b4b4b528",
                       "borderRadius": 30,
                       "padding": 14,
                     },
@@ -471,7 +471,7 @@ exports[`AssetSelectorButton renders loading state correctly 1`] = `
                 style={
                   [
                     {
-                      "backgroundColor": "#858b9a14",
+                      "backgroundColor": "#b4b4b528",
                       "borderRadius": 30,
                       "padding": 14,
                     },
diff --git a/app/components/UI/Ramp/Aggregator/components/__snapshots__/PaymentMethodSelector.test.tsx.snap b/app/components/UI/Ramp/Aggregator/components/__snapshots__/PaymentMethodSelector.test.tsx.snap
index 9918ff4e6507..30da3041f7b6 100644
--- a/app/components/UI/Ramp/Aggregator/components/__snapshots__/PaymentMethodSelector.test.tsx.snap
+++ b/app/components/UI/Ramp/Aggregator/components/__snapshots__/PaymentMethodSelector.test.tsx.snap
@@ -6,7 +6,7 @@ exports[`PaymentMethodSelector renders correctly 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
@@ -26,7 +26,7 @@ exports[`PaymentMethodSelector renders correctly 1`] = `
       style={
         [
           {
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderRadius": 8,
             "padding": 16,
           },
@@ -93,9 +93,9 @@ exports[`PaymentMethodSelector renders correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Medium",
-                  "fontSize": 18,
+                  "fontSize": 20,
                   "letterSpacing": 0,
                   "lineHeight": 24,
                 }
@@ -129,7 +129,7 @@ exports[`PaymentMethodSelector renders correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Bold",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -140,7 +140,7 @@ exports[`PaymentMethodSelector renders correctly 1`] = `
               Change
             </Text>
             <SvgMock
-              color="#686e7d"
+              color="#66676a"
               fill="currentColor"
               height={16}
               name="ArrowDown"
@@ -159,7 +159,7 @@ exports[`PaymentMethodSelector renders correctly 1`] = `
       <View
         style={
           {
-            "backgroundColor": "#b7bbc866",
+            "backgroundColor": "#b4b4b566",
             "height": 1,
             "marginLeft": 16,
             "marginRight": 16,
@@ -214,7 +214,7 @@ exports[`PaymentMethodSelector renders correctly if there are no icons 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
@@ -234,7 +234,7 @@ exports[`PaymentMethodSelector renders correctly if there are no icons 1`] = `
       style={
         [
           {
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderRadius": 8,
             "padding": 16,
           },
@@ -301,9 +301,9 @@ exports[`PaymentMethodSelector renders correctly if there are no icons 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Medium",
-                  "fontSize": 18,
+                  "fontSize": 20,
                   "letterSpacing": 0,
                   "lineHeight": 24,
                 }
@@ -337,7 +337,7 @@ exports[`PaymentMethodSelector renders correctly if there are no icons 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Bold",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -348,7 +348,7 @@ exports[`PaymentMethodSelector renders correctly if there are no icons 1`] = `
               Change
             </Text>
             <SvgMock
-              color="#686e7d"
+              color="#66676a"
               fill="currentColor"
               height={16}
               name="ArrowDown"
@@ -367,7 +367,7 @@ exports[`PaymentMethodSelector renders correctly if there are no icons 1`] = `
       <View
         style={
           {
-            "backgroundColor": "#b7bbc866",
+            "backgroundColor": "#b4b4b566",
             "height": 1,
             "marginLeft": 16,
             "marginRight": 16,
@@ -393,7 +393,7 @@ exports[`PaymentMethodSelector renders loading state correctly 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
@@ -413,7 +413,7 @@ exports[`PaymentMethodSelector renders loading state correctly 1`] = `
       style={
         [
           {
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderRadius": 8,
             "padding": 16,
           },
@@ -455,7 +455,7 @@ exports[`PaymentMethodSelector renders loading state correctly 1`] = `
               style={
                 [
                   {
-                    "backgroundColor": "#858b9a14",
+                    "backgroundColor": "#b4b4b528",
                     "borderRadius": 30,
                     "padding": 14,
                   },
@@ -500,7 +500,7 @@ exports[`PaymentMethodSelector renders loading state correctly 1`] = `
               style={
                 [
                   {
-                    "backgroundColor": "#858b9a14",
+                    "backgroundColor": "#b4b4b528",
                     "borderRadius": 30,
                     "padding": 14,
                   },
@@ -527,7 +527,7 @@ exports[`PaymentMethodSelector renders loading state correctly 1`] = `
       <View
         style={
           {
-            "backgroundColor": "#b7bbc866",
+            "backgroundColor": "#b4b4b566",
             "height": 1,
             "marginLeft": 16,
             "marginRight": 16,
@@ -546,7 +546,7 @@ exports[`PaymentMethodSelector renders loading state correctly 1`] = `
           style={
             [
               {
-                "backgroundColor": "#858b9a14",
+                "backgroundColor": "#b4b4b528",
                 "borderRadius": 30,
                 "padding": 14,
               },
diff --git a/app/components/UI/Ramp/Aggregator/orderProcessor/aggregator.ts b/app/components/UI/Ramp/Aggregator/orderProcessor/aggregator.ts
index d809a2dcc879..97eeb5f69368 100644
--- a/app/components/UI/Ramp/Aggregator/orderProcessor/aggregator.ts
+++ b/app/components/UI/Ramp/Aggregator/orderProcessor/aggregator.ts
@@ -137,7 +137,11 @@ export async function processAggregatorOrder(
   } catch (error) {
     Logger.error(error as Error, {
       message: 'FiatOrders::AggregatorProcessor error while processing order',
-      order,
+      orderId: order.id,
+      provider: order.provider,
+      orderType: order.orderType,
+      state: order.state,
+      network: order.network,
     });
     return order as FiatOrder;
   }
diff --git a/app/components/UI/Ramp/Aggregator/sdk/getSdkEnvironment.test.ts b/app/components/UI/Ramp/Aggregator/sdk/getSdkEnvironment.test.ts
index 7b8f2aeb78f0..8313e65da28d 100644
--- a/app/components/UI/Ramp/Aggregator/sdk/getSdkEnvironment.test.ts
+++ b/app/components/UI/Ramp/Aggregator/sdk/getSdkEnvironment.test.ts
@@ -3,12 +3,12 @@ import { getSdkEnvironment } from './getSdkEnvironment';
 
 describe('getSdkEnvironment', () => {
   const originalProcessEnv = process.env;
-  const originalGithubActions = process.env.GITHUB_ACTIONS;
+  const originalBuildsEnabled =
+    process.env.BUILDS_ENABLED_WITH_GH_ACTIONS_TEMPORARY;
   const originalRampsEnvironment = process.env.RAMPS_ENVIRONMENT;
-  const originalE2e = process.env.E2E;
 
   beforeEach(() => {
-    process.env.GITHUB_ACTIONS = 'false';
+    process.env.BUILDS_ENABLED_WITH_GH_ACTIONS_TEMPORARY = 'false';
   });
 
   afterAll(() => {
@@ -16,27 +16,22 @@ describe('getSdkEnvironment', () => {
   });
 
   afterEach(() => {
-    if (originalGithubActions !== undefined) {
-      process.env.GITHUB_ACTIONS = originalGithubActions;
+    if (originalBuildsEnabled !== undefined) {
+      process.env.BUILDS_ENABLED_WITH_GH_ACTIONS_TEMPORARY =
+        originalBuildsEnabled;
     } else {
-      delete process.env.GITHUB_ACTIONS;
+      delete process.env.BUILDS_ENABLED_WITH_GH_ACTIONS_TEMPORARY;
     }
     if (originalRampsEnvironment !== undefined) {
       process.env.RAMPS_ENVIRONMENT = originalRampsEnvironment;
     } else {
       delete process.env.RAMPS_ENVIRONMENT;
     }
-    if (originalE2e !== undefined) {
-      process.env.E2E = originalE2e;
-    } else {
-      delete process.env.E2E;
-    }
   });
 
-  describe('when GITHUB_ACTIONS (builds.yml path)', () => {
+  describe('when BUILDS_ENABLED_WITH_GH_ACTIONS_TEMPORARY (builds.yml path)', () => {
     beforeEach(() => {
-      process.env.GITHUB_ACTIONS = 'true';
-      delete process.env.E2E;
+      process.env.BUILDS_ENABLED_WITH_GH_ACTIONS_TEMPORARY = 'true';
     });
 
     it('returns Production when RAMPS_ENVIRONMENT is production', () => {
@@ -59,14 +54,6 @@ describe('getSdkEnvironment', () => {
       process.env.RAMPS_ENVIRONMENT = 'staging';
       expect(getSdkEnvironment()).toBe(Environment.Staging);
     });
-
-    it('uses METAMASK_ENVIRONMENT when E2E is true (E2E path)', () => {
-      process.env.GITHUB_ACTIONS = 'true';
-      process.env.E2E = 'true';
-      process.env.RAMPS_ENVIRONMENT = 'staging';
-      process.env.METAMASK_ENVIRONMENT = 'production';
-      expect(getSdkEnvironment()).toBe(Environment.Production);
-    });
   });
 
   describe('Production environments', () => {
diff --git a/app/components/UI/Ramp/Aggregator/sdk/getSdkEnvironment.ts b/app/components/UI/Ramp/Aggregator/sdk/getSdkEnvironment.ts
index fbdf32d93716..380e38451708 100644
--- a/app/components/UI/Ramp/Aggregator/sdk/getSdkEnvironment.ts
+++ b/app/components/UI/Ramp/Aggregator/sdk/getSdkEnvironment.ts
@@ -1,11 +1,11 @@
 import { Environment } from '@consensys/on-ramp-sdk';
 
 /**
- * When GITHUB_ACTIONS (and not E2E), uses RAMPS_ENVIRONMENT (set by builds.yml).
+ * When BUILDS_ENABLED_WITH_GH_ACTIONS_TEMPORARY (and not E2E), uses RAMPS_ENVIRONMENT (set by builds.yml).
  * When not (Bitrise / .js.env / E2E), uses METAMASK_ENVIRONMENT switch.
  */
 export function getSdkEnvironment() {
-  if (process.env.GITHUB_ACTIONS === 'true' && process.env.E2E !== 'true') {
+  if (process.env.BUILDS_ENABLED_WITH_GH_ACTIONS_TEMPORARY === 'true') {
     const rampsEnv = process.env.RAMPS_ENVIRONMENT;
     return rampsEnv === 'production'
       ? Environment.Production
diff --git a/app/components/UI/Ramp/Deposit/Views/AdditionalVerification/__snapshots__/AdditionalVerification.test.tsx.snap b/app/components/UI/Ramp/Deposit/Views/AdditionalVerification/__snapshots__/AdditionalVerification.test.tsx.snap
index 20bee4832795..868df4fbd152 100644
--- a/app/components/UI/Ramp/Deposit/Views/AdditionalVerification/__snapshots__/AdditionalVerification.test.tsx.snap
+++ b/app/components/UI/Ramp/Deposit/Views/AdditionalVerification/__snapshots__/AdditionalVerification.test.tsx.snap
@@ -117,7 +117,7 @@ exports[`AdditionalVerification Component render matches snapshot 1`] = `
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -158,7 +158,7 @@ exports[`AdditionalVerification Component render matches snapshot 1`] = `
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -427,7 +427,7 @@ exports[`AdditionalVerification Component render matches snapshot 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Bold",
                                   "fontSize": 24,
                                   "fontWeight": "bold",
@@ -443,7 +443,7 @@ exports[`AdditionalVerification Component render matches snapshot 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -458,7 +458,7 @@ exports[`AdditionalVerification Component render matches snapshot 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -497,7 +497,7 @@ exports[`AdditionalVerification Component render matches snapshot 1`] = `
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
@@ -527,7 +527,7 @@ exports[`AdditionalVerification Component render matches snapshot 1`] = `
                               name="powered-by-transak-logo"
                               style={
                                 {
-                                  "color": "#686e7d",
+                                  "color": "#66676a",
                                   "height": 24,
                                 }
                               }
diff --git a/app/components/UI/Ramp/Deposit/Views/BankDetails/__snapshots__/BankDetails.test.tsx.snap b/app/components/UI/Ramp/Deposit/Views/BankDetails/__snapshots__/BankDetails.test.tsx.snap
index ecc16abbd877..e4edebb99d16 100644
--- a/app/components/UI/Ramp/Deposit/Views/BankDetails/__snapshots__/BankDetails.test.tsx.snap
+++ b/app/components/UI/Ramp/Deposit/Views/BankDetails/__snapshots__/BankDetails.test.tsx.snap
@@ -117,7 +117,7 @@ exports[`BankDetails Component render matches snapshot 1`] = `
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -158,7 +158,7 @@ exports[`BankDetails Component render matches snapshot 1`] = `
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -403,7 +403,7 @@ exports[`BankDetails Component render matches snapshot 1`] = `
                               }
                               onRefresh={[Function]}
                               refreshing={true}
-                              tintColor="#121314"
+                              tintColor="#131416"
                             />
                           }
                           testID="bank-details-refresh-control-scrollview"
@@ -447,9 +447,9 @@ exports[`BankDetails Component render matches snapshot 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
-                                        "fontSize": 18,
+                                        "fontSize": 20,
                                         "letterSpacing": 0,
                                         "lineHeight": 24,
                                       }
@@ -461,7 +461,7 @@ exports[`BankDetails Component render matches snapshot 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -475,7 +475,7 @@ exports[`BankDetails Component render matches snapshot 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -489,7 +489,7 @@ exports[`BankDetails Component render matches snapshot 1`] = `
                                 <View
                                   style={
                                     {
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 8,
                                       "gap": 16,
                                       "padding": 16,
@@ -508,7 +508,7 @@ exports[`BankDetails Component render matches snapshot 1`] = `
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -534,7 +534,7 @@ exports[`BankDetails Component render matches snapshot 1`] = `
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#686e7d",
+                                            "color": "#66676a",
                                             "flex": 1,
                                             "flexWrap": "wrap",
                                             "fontFamily": "Geist-Regular",
@@ -552,7 +552,7 @@ exports[`BankDetails Component render matches snapshot 1`] = `
                                         testID="copy-button"
                                       >
                                         <SvgMock
-                                          color="#686e7d"
+                                          color="#66676a"
                                           fill="currentColor"
                                           height={16}
                                           name="Copy"
@@ -579,7 +579,7 @@ exports[`BankDetails Component render matches snapshot 1`] = `
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -605,7 +605,7 @@ exports[`BankDetails Component render matches snapshot 1`] = `
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#686e7d",
+                                            "color": "#66676a",
                                             "flex": 1,
                                             "flexWrap": "wrap",
                                             "fontFamily": "Geist-Regular",
@@ -623,7 +623,7 @@ exports[`BankDetails Component render matches snapshot 1`] = `
                                         testID="copy-button"
                                       >
                                         <SvgMock
-                                          color="#686e7d"
+                                          color="#66676a"
                                           fill="currentColor"
                                           height={16}
                                           name="Copy"
@@ -650,7 +650,7 @@ exports[`BankDetails Component render matches snapshot 1`] = `
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -676,7 +676,7 @@ exports[`BankDetails Component render matches snapshot 1`] = `
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#686e7d",
+                                            "color": "#66676a",
                                             "flex": 1,
                                             "flexWrap": "wrap",
                                             "fontFamily": "Geist-Regular",
@@ -694,7 +694,7 @@ exports[`BankDetails Component render matches snapshot 1`] = `
                                         testID="copy-button"
                                       >
                                         <SvgMock
-                                          color="#686e7d"
+                                          color="#66676a"
                                           fill="currentColor"
                                           height={16}
                                           name="Copy"
@@ -778,7 +778,7 @@ exports[`BankDetails Component render matches snapshot 1`] = `
                                 accessible={true}
                                 style={
                                   {
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "borderRadius": 8,
                                     "marginVertical": 8,
                                     "padding": 16,
@@ -803,7 +803,7 @@ exports[`BankDetails Component render matches snapshot 1`] = `
                                     testID="listitemcolumn"
                                   >
                                     <SvgMock
-                                      color="#686e7d"
+                                      color="#66676a"
                                       fill="currentColor"
                                       height={24}
                                       name="SecurityKey"
@@ -837,7 +837,7 @@ exports[`BankDetails Component render matches snapshot 1`] = `
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#686e7d",
+                                          "color": "#66676a",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 12,
                                           "letterSpacing": 0.25,
@@ -871,7 +871,7 @@ exports[`BankDetails Component render matches snapshot 1`] = `
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderColor": "transparent",
                                       "borderRadius": 12,
                                       "borderWidth": 1,
@@ -888,7 +888,7 @@ exports[`BankDetails Component render matches snapshot 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Medium",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -912,7 +912,7 @@ exports[`BankDetails Component render matches snapshot 1`] = `
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
-                                      "backgroundColor": "#121314",
+                                      "backgroundColor": "#131416",
                                       "borderRadius": 12,
                                       "flex": 1,
                                       "flexDirection": "row",
@@ -1074,7 +1074,7 @@ exports[`BankDetails Component render matches snapshot with bank info shown 1`]
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -1115,7 +1115,7 @@ exports[`BankDetails Component render matches snapshot with bank info shown 1`]
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -1360,7 +1360,7 @@ exports[`BankDetails Component render matches snapshot with bank info shown 1`]
                               }
                               onRefresh={[Function]}
                               refreshing={true}
-                              tintColor="#121314"
+                              tintColor="#131416"
                             />
                           }
                           testID="bank-details-refresh-control-scrollview"
@@ -1404,9 +1404,9 @@ exports[`BankDetails Component render matches snapshot with bank info shown 1`]
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
-                                        "fontSize": 18,
+                                        "fontSize": 20,
                                         "letterSpacing": 0,
                                         "lineHeight": 24,
                                       }
@@ -1418,7 +1418,7 @@ exports[`BankDetails Component render matches snapshot with bank info shown 1`]
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -1432,7 +1432,7 @@ exports[`BankDetails Component render matches snapshot with bank info shown 1`]
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -1446,7 +1446,7 @@ exports[`BankDetails Component render matches snapshot with bank info shown 1`]
                                 <View
                                   style={
                                     {
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 8,
                                       "gap": 16,
                                       "padding": 16,
@@ -1465,7 +1465,7 @@ exports[`BankDetails Component render matches snapshot with bank info shown 1`]
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -1491,7 +1491,7 @@ exports[`BankDetails Component render matches snapshot with bank info shown 1`]
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#686e7d",
+                                            "color": "#66676a",
                                             "flex": 1,
                                             "flexWrap": "wrap",
                                             "fontFamily": "Geist-Regular",
@@ -1509,7 +1509,7 @@ exports[`BankDetails Component render matches snapshot with bank info shown 1`]
                                         testID="copy-button"
                                       >
                                         <SvgMock
-                                          color="#686e7d"
+                                          color="#66676a"
                                           fill="currentColor"
                                           height={16}
                                           name="Copy"
@@ -1536,7 +1536,7 @@ exports[`BankDetails Component render matches snapshot with bank info shown 1`]
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -1562,7 +1562,7 @@ exports[`BankDetails Component render matches snapshot with bank info shown 1`]
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#686e7d",
+                                            "color": "#66676a",
                                             "flex": 1,
                                             "flexWrap": "wrap",
                                             "fontFamily": "Geist-Regular",
@@ -1580,7 +1580,7 @@ exports[`BankDetails Component render matches snapshot with bank info shown 1`]
                                         testID="copy-button"
                                       >
                                         <SvgMock
-                                          color="#686e7d"
+                                          color="#66676a"
                                           fill="currentColor"
                                           height={16}
                                           name="Copy"
@@ -1607,7 +1607,7 @@ exports[`BankDetails Component render matches snapshot with bank info shown 1`]
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -1633,7 +1633,7 @@ exports[`BankDetails Component render matches snapshot with bank info shown 1`]
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#686e7d",
+                                            "color": "#66676a",
                                             "flex": 1,
                                             "flexWrap": "wrap",
                                             "fontFamily": "Geist-Regular",
@@ -1651,7 +1651,7 @@ exports[`BankDetails Component render matches snapshot with bank info shown 1`]
                                         testID="copy-button"
                                       >
                                         <SvgMock
-                                          color="#686e7d"
+                                          color="#66676a"
                                           fill="currentColor"
                                           height={16}
                                           name="Copy"
@@ -1678,7 +1678,7 @@ exports[`BankDetails Component render matches snapshot with bank info shown 1`]
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -1704,7 +1704,7 @@ exports[`BankDetails Component render matches snapshot with bank info shown 1`]
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#686e7d",
+                                            "color": "#66676a",
                                             "flex": 1,
                                             "flexWrap": "wrap",
                                             "fontFamily": "Geist-Regular",
@@ -1722,7 +1722,7 @@ exports[`BankDetails Component render matches snapshot with bank info shown 1`]
                                         testID="copy-button"
                                       >
                                         <SvgMock
-                                          color="#686e7d"
+                                          color="#66676a"
                                           fill="currentColor"
                                           height={16}
                                           name="Copy"
@@ -1749,7 +1749,7 @@ exports[`BankDetails Component render matches snapshot with bank info shown 1`]
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -1775,7 +1775,7 @@ exports[`BankDetails Component render matches snapshot with bank info shown 1`]
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#686e7d",
+                                            "color": "#66676a",
                                             "flex": 1,
                                             "flexWrap": "wrap",
                                             "fontFamily": "Geist-Regular",
@@ -1793,7 +1793,7 @@ exports[`BankDetails Component render matches snapshot with bank info shown 1`]
                                         testID="copy-button"
                                       >
                                         <SvgMock
-                                          color="#686e7d"
+                                          color="#66676a"
                                           fill="currentColor"
                                           height={16}
                                           name="Copy"
@@ -1820,7 +1820,7 @@ exports[`BankDetails Component render matches snapshot with bank info shown 1`]
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -1846,7 +1846,7 @@ exports[`BankDetails Component render matches snapshot with bank info shown 1`]
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#686e7d",
+                                            "color": "#66676a",
                                             "flex": 1,
                                             "flexWrap": "wrap",
                                             "fontFamily": "Geist-Regular",
@@ -1864,7 +1864,7 @@ exports[`BankDetails Component render matches snapshot with bank info shown 1`]
                                         testID="copy-button"
                                       >
                                         <SvgMock
-                                          color="#686e7d"
+                                          color="#66676a"
                                           fill="currentColor"
                                           height={16}
                                           name="Copy"
@@ -1948,7 +1948,7 @@ exports[`BankDetails Component render matches snapshot with bank info shown 1`]
                                 accessible={true}
                                 style={
                                   {
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "borderRadius": 8,
                                     "marginVertical": 8,
                                     "padding": 16,
@@ -1973,7 +1973,7 @@ exports[`BankDetails Component render matches snapshot with bank info shown 1`]
                                     testID="listitemcolumn"
                                   >
                                     <SvgMock
-                                      color="#686e7d"
+                                      color="#66676a"
                                       fill="currentColor"
                                       height={24}
                                       name="SecurityKey"
@@ -2007,7 +2007,7 @@ exports[`BankDetails Component render matches snapshot with bank info shown 1`]
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#686e7d",
+                                          "color": "#66676a",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 12,
                                           "letterSpacing": 0.25,
@@ -2041,7 +2041,7 @@ exports[`BankDetails Component render matches snapshot with bank info shown 1`]
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderColor": "transparent",
                                       "borderRadius": 12,
                                       "borderWidth": 1,
@@ -2058,7 +2058,7 @@ exports[`BankDetails Component render matches snapshot with bank info shown 1`]
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Medium",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -2082,7 +2082,7 @@ exports[`BankDetails Component render matches snapshot with bank info shown 1`]
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
-                                      "backgroundColor": "#121314",
+                                      "backgroundColor": "#131416",
                                       "borderRadius": 12,
                                       "flex": 1,
                                       "flexDirection": "row",
diff --git a/app/components/UI/Ramp/Deposit/Views/BasicInfo/__snapshots__/BasicInfo.test.tsx.snap b/app/components/UI/Ramp/Deposit/Views/BasicInfo/__snapshots__/BasicInfo.test.tsx.snap
index 2b40c9890b17..644e7bddeff7 100644
--- a/app/components/UI/Ramp/Deposit/Views/BasicInfo/__snapshots__/BasicInfo.test.tsx.snap
+++ b/app/components/UI/Ramp/Deposit/Views/BasicInfo/__snapshots__/BasicInfo.test.tsx.snap
@@ -117,7 +117,7 @@ exports[`BasicInfo Component navigates to address page when form is valid and co
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -158,7 +158,7 @@ exports[`BasicInfo Component navigates to address page when form is valid and co
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -523,7 +523,7 @@ exports[`BasicInfo Component navigates to address page when form is valid and co
                                             "height": 4,
                                           },
                                           {
-                                            "backgroundColor": "#b7bbc8",
+                                            "backgroundColor": "#babbbe",
                                           },
                                         ],
                                         undefined,
@@ -536,9 +536,9 @@ exports[`BasicInfo Component navigates to address page when form is valid and co
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
-                                      "fontSize": 18,
+                                      "fontSize": 20,
                                       "letterSpacing": 0,
                                       "lineHeight": 24,
                                       "marginBottom": 4,
@@ -552,7 +552,7 @@ exports[`BasicInfo Component navigates to address page when form is valid and co
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#686e7d",
+                                      "color": "#66676a",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -589,7 +589,7 @@ exports[`BasicInfo Component navigates to address page when form is valid and co
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -634,8 +634,8 @@ exports[`BasicInfo Component navigates to address page when form is valid and co
                                       style={
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
-                                          "borderColor": "#b7bbc866",
+                                          "backgroundColor": "#b4b4b528",
+                                          "borderColor": "#b4b4b566",
                                           "borderRadius": 12,
                                           "borderWidth": 1,
                                           "flexDirection": "row",
@@ -666,14 +666,14 @@ exports[`BasicInfo Component navigates to address page when form is valid and co
                                           onFocus={[Function]}
                                           onSubmitEditing={[Function]}
                                           placeholder="First name"
-                                          placeholderTextColor="#686e7d"
+                                          placeholderTextColor="#66676a"
                                           returnKeyType="next"
                                           style={
                                             {
                                               "backgroundColor": "inherit",
                                               "borderColor": "transparent",
                                               "borderWidth": 1,
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "fontWeight": "400",
@@ -706,7 +706,7 @@ exports[`BasicInfo Component navigates to address page when form is valid and co
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -751,8 +751,8 @@ exports[`BasicInfo Component navigates to address page when form is valid and co
                                       style={
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
-                                          "borderColor": "#b7bbc866",
+                                          "backgroundColor": "#b4b4b528",
+                                          "borderColor": "#b4b4b566",
                                           "borderRadius": 12,
                                           "borderWidth": 1,
                                           "flexDirection": "row",
@@ -783,14 +783,14 @@ exports[`BasicInfo Component navigates to address page when form is valid and co
                                           onFocus={[Function]}
                                           onSubmitEditing={[Function]}
                                           placeholder="Last name"
-                                          placeholderTextColor="#686e7d"
+                                          placeholderTextColor="#66676a"
                                           returnKeyType="next"
                                           style={
                                             {
                                               "backgroundColor": "inherit",
                                               "borderColor": "transparent",
                                               "borderWidth": 1,
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "fontWeight": "400",
@@ -822,7 +822,7 @@ exports[`BasicInfo Component navigates to address page when form is valid and co
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -867,8 +867,8 @@ exports[`BasicInfo Component navigates to address page when form is valid and co
                                     style={
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
-                                        "borderColor": "#b7bbc866",
+                                        "backgroundColor": "#b4b4b528",
+                                        "borderColor": "#b4b4b566",
                                         "borderRadius": 12,
                                         "borderWidth": 1,
                                         "flexDirection": "row",
@@ -902,7 +902,7 @@ exports[`BasicInfo Component navigates to address page when form is valid and co
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -916,7 +916,7 @@ exports[`BasicInfo Component navigates to address page when form is valid and co
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#b7bbc8",
+                                              "color": "#babbbe",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 14,
                                               "letterSpacing": 0,
@@ -949,13 +949,13 @@ exports[`BasicInfo Component navigates to address page when form is valid and co
                                         onFocus={[Function]}
                                         onSubmitEditing={[Function]}
                                         placeholder="(555) 123-4567"
-                                        placeholderTextColor="#686e7d"
+                                        placeholderTextColor="#66676a"
                                         style={
                                           {
                                             "backgroundColor": "inherit",
                                             "borderColor": "transparent",
                                             "borderWidth": 1,
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 16,
                                             "fontWeight": "400",
@@ -986,7 +986,7 @@ exports[`BasicInfo Component navigates to address page when form is valid and co
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -1031,8 +1031,8 @@ exports[`BasicInfo Component navigates to address page when form is valid and co
                                     style={
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
-                                        "borderColor": "#b7bbc866",
+                                        "backgroundColor": "#b4b4b528",
+                                        "borderColor": "#b4b4b566",
                                         "borderRadius": 12,
                                         "borderWidth": 1,
                                         "flexDirection": "row",
@@ -1052,7 +1052,7 @@ exports[`BasicInfo Component navigates to address page when form is valid and co
                                       testID="textfield-startacccessory"
                                     >
                                       <SvgMock
-                                        color="#121314"
+                                        color="#131416"
                                         fill="currentColor"
                                         height={20}
                                         name="Calendar"
@@ -1085,11 +1085,11 @@ exports[`BasicInfo Component navigates to address page when form is valid and co
                                         <TextInput
                                           editable={false}
                                           placeholder="01/01/2000"
-                                          placeholderTextColor="#b7bbc8"
+                                          placeholderTextColor="#babbbe"
                                           pointerEvents="none"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "flex": 1,
                                               "fontSize": 16,
                                               "height": "100%",
@@ -1134,7 +1134,7 @@ exports[`BasicInfo Component navigates to address page when form is valid and co
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 16,
                                             "letterSpacing": 0,
@@ -1149,7 +1149,7 @@ exports[`BasicInfo Component navigates to address page when form is valid and co
                                         testID="ssn-info-button"
                                       >
                                         <SvgMock
-                                          color="#686e7d"
+                                          color="#66676a"
                                           fill="currentColor"
                                           height={16}
                                           name="Info"
@@ -1197,8 +1197,8 @@ exports[`BasicInfo Component navigates to address page when form is valid and co
                                     style={
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
-                                        "borderColor": "#b7bbc866",
+                                        "backgroundColor": "#b4b4b528",
+                                        "borderColor": "#b4b4b566",
                                         "borderRadius": 12,
                                         "borderWidth": 1,
                                         "flexDirection": "row",
@@ -1230,7 +1230,7 @@ exports[`BasicInfo Component navigates to address page when form is valid and co
                                         onFocus={[Function]}
                                         onSubmitEditing={[Function]}
                                         placeholder="XXX-XX-XXXX"
-                                        placeholderTextColor="#686e7d"
+                                        placeholderTextColor="#66676a"
                                         returnKeyType="done"
                                         secureTextEntry={true}
                                         style={
@@ -1238,7 +1238,7 @@ exports[`BasicInfo Component navigates to address page when form is valid and co
                                             "backgroundColor": "inherit",
                                             "borderColor": "transparent",
                                             "borderWidth": 1,
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 16,
                                             "fontWeight": "400",
@@ -1278,7 +1278,7 @@ exports[`BasicInfo Component navigates to address page when form is valid and co
                               accessible={true}
                               style={
                                 {
-                                  "backgroundColor": "#3c4d9d0f",
+                                  "backgroundColor": "#b4b4b528",
                                   "borderRadius": 8,
                                   "marginVertical": 8,
                                   "padding": 16,
@@ -1303,7 +1303,7 @@ exports[`BasicInfo Component navigates to address page when form is valid and co
                                   testID="listitemcolumn"
                                 >
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={24}
                                     name="SecurityKey"
@@ -1337,7 +1337,7 @@ exports[`BasicInfo Component navigates to address page when form is valid and co
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 12,
                                         "letterSpacing": 0.25,
@@ -1351,7 +1351,7 @@ exports[`BasicInfo Component navigates to address page when form is valid and co
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 12,
                                         "letterSpacing": 0.25,
@@ -1377,7 +1377,7 @@ exports[`BasicInfo Component navigates to address page when form is valid and co
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
@@ -1408,7 +1408,7 @@ exports[`BasicInfo Component navigates to address page when form is valid and co
                               name="powered-by-transak-logo"
                               style={
                                 {
-                                  "color": "#686e7d",
+                                  "color": "#66676a",
                                   "height": 24,
                                 }
                               }
@@ -1546,7 +1546,7 @@ exports[`BasicInfo Component passes regions to DepositPhoneField component 1`] =
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -1587,7 +1587,7 @@ exports[`BasicInfo Component passes regions to DepositPhoneField component 1`] =
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -1952,7 +1952,7 @@ exports[`BasicInfo Component passes regions to DepositPhoneField component 1`] =
                                             "height": 4,
                                           },
                                           {
-                                            "backgroundColor": "#b7bbc8",
+                                            "backgroundColor": "#babbbe",
                                           },
                                         ],
                                         undefined,
@@ -1965,9 +1965,9 @@ exports[`BasicInfo Component passes regions to DepositPhoneField component 1`] =
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
-                                      "fontSize": 18,
+                                      "fontSize": 20,
                                       "letterSpacing": 0,
                                       "lineHeight": 24,
                                       "marginBottom": 4,
@@ -1981,7 +1981,7 @@ exports[`BasicInfo Component passes regions to DepositPhoneField component 1`] =
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#686e7d",
+                                      "color": "#66676a",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -2018,7 +2018,7 @@ exports[`BasicInfo Component passes regions to DepositPhoneField component 1`] =
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -2063,8 +2063,8 @@ exports[`BasicInfo Component passes regions to DepositPhoneField component 1`] =
                                       style={
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
-                                          "borderColor": "#b7bbc866",
+                                          "backgroundColor": "#b4b4b528",
+                                          "borderColor": "#b4b4b566",
                                           "borderRadius": 12,
                                           "borderWidth": 1,
                                           "flexDirection": "row",
@@ -2095,14 +2095,14 @@ exports[`BasicInfo Component passes regions to DepositPhoneField component 1`] =
                                           onFocus={[Function]}
                                           onSubmitEditing={[Function]}
                                           placeholder="First name"
-                                          placeholderTextColor="#686e7d"
+                                          placeholderTextColor="#66676a"
                                           returnKeyType="next"
                                           style={
                                             {
                                               "backgroundColor": "inherit",
                                               "borderColor": "transparent",
                                               "borderWidth": 1,
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "fontWeight": "400",
@@ -2135,7 +2135,7 @@ exports[`BasicInfo Component passes regions to DepositPhoneField component 1`] =
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -2180,8 +2180,8 @@ exports[`BasicInfo Component passes regions to DepositPhoneField component 1`] =
                                       style={
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
-                                          "borderColor": "#b7bbc866",
+                                          "backgroundColor": "#b4b4b528",
+                                          "borderColor": "#b4b4b566",
                                           "borderRadius": 12,
                                           "borderWidth": 1,
                                           "flexDirection": "row",
@@ -2212,14 +2212,14 @@ exports[`BasicInfo Component passes regions to DepositPhoneField component 1`] =
                                           onFocus={[Function]}
                                           onSubmitEditing={[Function]}
                                           placeholder="Last name"
-                                          placeholderTextColor="#686e7d"
+                                          placeholderTextColor="#66676a"
                                           returnKeyType="next"
                                           style={
                                             {
                                               "backgroundColor": "inherit",
                                               "borderColor": "transparent",
                                               "borderWidth": 1,
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "fontWeight": "400",
@@ -2251,7 +2251,7 @@ exports[`BasicInfo Component passes regions to DepositPhoneField component 1`] =
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -2296,8 +2296,8 @@ exports[`BasicInfo Component passes regions to DepositPhoneField component 1`] =
                                     style={
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
-                                        "borderColor": "#b7bbc866",
+                                        "backgroundColor": "#b4b4b528",
+                                        "borderColor": "#b4b4b566",
                                         "borderRadius": 12,
                                         "borderWidth": 1,
                                         "flexDirection": "row",
@@ -2331,7 +2331,7 @@ exports[`BasicInfo Component passes regions to DepositPhoneField component 1`] =
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -2345,7 +2345,7 @@ exports[`BasicInfo Component passes regions to DepositPhoneField component 1`] =
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#b7bbc8",
+                                              "color": "#babbbe",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 14,
                                               "letterSpacing": 0,
@@ -2378,13 +2378,13 @@ exports[`BasicInfo Component passes regions to DepositPhoneField component 1`] =
                                         onFocus={[Function]}
                                         onSubmitEditing={[Function]}
                                         placeholder="(555) 123-4567"
-                                        placeholderTextColor="#686e7d"
+                                        placeholderTextColor="#66676a"
                                         style={
                                           {
                                             "backgroundColor": "inherit",
                                             "borderColor": "transparent",
                                             "borderWidth": 1,
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 16,
                                             "fontWeight": "400",
@@ -2415,7 +2415,7 @@ exports[`BasicInfo Component passes regions to DepositPhoneField component 1`] =
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -2460,8 +2460,8 @@ exports[`BasicInfo Component passes regions to DepositPhoneField component 1`] =
                                     style={
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
-                                        "borderColor": "#b7bbc866",
+                                        "backgroundColor": "#b4b4b528",
+                                        "borderColor": "#b4b4b566",
                                         "borderRadius": 12,
                                         "borderWidth": 1,
                                         "flexDirection": "row",
@@ -2481,7 +2481,7 @@ exports[`BasicInfo Component passes regions to DepositPhoneField component 1`] =
                                       testID="textfield-startacccessory"
                                     >
                                       <SvgMock
-                                        color="#121314"
+                                        color="#131416"
                                         fill="currentColor"
                                         height={20}
                                         name="Calendar"
@@ -2514,11 +2514,11 @@ exports[`BasicInfo Component passes regions to DepositPhoneField component 1`] =
                                         <TextInput
                                           editable={false}
                                           placeholder="01/01/2000"
-                                          placeholderTextColor="#b7bbc8"
+                                          placeholderTextColor="#babbbe"
                                           pointerEvents="none"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "flex": 1,
                                               "fontSize": 16,
                                               "height": "100%",
@@ -2563,7 +2563,7 @@ exports[`BasicInfo Component passes regions to DepositPhoneField component 1`] =
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 16,
                                             "letterSpacing": 0,
@@ -2578,7 +2578,7 @@ exports[`BasicInfo Component passes regions to DepositPhoneField component 1`] =
                                         testID="ssn-info-button"
                                       >
                                         <SvgMock
-                                          color="#686e7d"
+                                          color="#66676a"
                                           fill="currentColor"
                                           height={16}
                                           name="Info"
@@ -2626,8 +2626,8 @@ exports[`BasicInfo Component passes regions to DepositPhoneField component 1`] =
                                     style={
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
-                                        "borderColor": "#b7bbc866",
+                                        "backgroundColor": "#b4b4b528",
+                                        "borderColor": "#b4b4b566",
                                         "borderRadius": 12,
                                         "borderWidth": 1,
                                         "flexDirection": "row",
@@ -2659,7 +2659,7 @@ exports[`BasicInfo Component passes regions to DepositPhoneField component 1`] =
                                         onFocus={[Function]}
                                         onSubmitEditing={[Function]}
                                         placeholder="XXX-XX-XXXX"
-                                        placeholderTextColor="#686e7d"
+                                        placeholderTextColor="#66676a"
                                         returnKeyType="done"
                                         secureTextEntry={true}
                                         style={
@@ -2667,12 +2667,13 @@ exports[`BasicInfo Component passes regions to DepositPhoneField component 1`] =
                                             "backgroundColor": "inherit",
                                             "borderColor": "transparent",
                                             "borderWidth": 1,
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 16,
                                             "fontWeight": "400",
                                             "height": 46,
                                             "letterSpacing": 0,
+                                            "lineHeight": 0,
                                             "opacity": 1,
                                           }
                                         }
@@ -2707,7 +2708,7 @@ exports[`BasicInfo Component passes regions to DepositPhoneField component 1`] =
                               accessible={true}
                               style={
                                 {
-                                  "backgroundColor": "#3c4d9d0f",
+                                  "backgroundColor": "#b4b4b528",
                                   "borderRadius": 8,
                                   "marginVertical": 8,
                                   "padding": 16,
@@ -2732,7 +2733,7 @@ exports[`BasicInfo Component passes regions to DepositPhoneField component 1`] =
                                   testID="listitemcolumn"
                                 >
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={24}
                                     name="SecurityKey"
@@ -2766,7 +2767,7 @@ exports[`BasicInfo Component passes regions to DepositPhoneField component 1`] =
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 12,
                                         "letterSpacing": 0.25,
@@ -2780,7 +2781,7 @@ exports[`BasicInfo Component passes regions to DepositPhoneField component 1`] =
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 12,
                                         "letterSpacing": 0.25,
@@ -2806,7 +2807,7 @@ exports[`BasicInfo Component passes regions to DepositPhoneField component 1`] =
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
@@ -2837,7 +2838,7 @@ exports[`BasicInfo Component passes regions to DepositPhoneField component 1`] =
                               name="powered-by-transak-logo"
                               style={
                                 {
-                                  "color": "#686e7d",
+                                  "color": "#66676a",
                                   "height": 24,
                                 }
                               }
@@ -2975,7 +2976,7 @@ exports[`BasicInfo Component prefills form data when previousFormData is provide
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -3016,7 +3017,7 @@ exports[`BasicInfo Component prefills form data when previousFormData is provide
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -3381,7 +3382,7 @@ exports[`BasicInfo Component prefills form data when previousFormData is provide
                                             "height": 4,
                                           },
                                           {
-                                            "backgroundColor": "#b7bbc8",
+                                            "backgroundColor": "#babbbe",
                                           },
                                         ],
                                         undefined,
@@ -3394,9 +3395,9 @@ exports[`BasicInfo Component prefills form data when previousFormData is provide
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
-                                      "fontSize": 18,
+                                      "fontSize": 20,
                                       "letterSpacing": 0,
                                       "lineHeight": 24,
                                       "marginBottom": 4,
@@ -3410,7 +3411,7 @@ exports[`BasicInfo Component prefills form data when previousFormData is provide
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#686e7d",
+                                      "color": "#66676a",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -3447,7 +3448,7 @@ exports[`BasicInfo Component prefills form data when previousFormData is provide
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -3492,8 +3493,8 @@ exports[`BasicInfo Component prefills form data when previousFormData is provide
                                       style={
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
-                                          "borderColor": "#b7bbc866",
+                                          "backgroundColor": "#b4b4b528",
+                                          "borderColor": "#b4b4b566",
                                           "borderRadius": 12,
                                           "borderWidth": 1,
                                           "flexDirection": "row",
@@ -3524,14 +3525,14 @@ exports[`BasicInfo Component prefills form data when previousFormData is provide
                                           onFocus={[Function]}
                                           onSubmitEditing={[Function]}
                                           placeholder="First name"
-                                          placeholderTextColor="#686e7d"
+                                          placeholderTextColor="#66676a"
                                           returnKeyType="next"
                                           style={
                                             {
                                               "backgroundColor": "inherit",
                                               "borderColor": "transparent",
                                               "borderWidth": 1,
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "fontWeight": "400",
@@ -3564,7 +3565,7 @@ exports[`BasicInfo Component prefills form data when previousFormData is provide
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -3609,8 +3610,8 @@ exports[`BasicInfo Component prefills form data when previousFormData is provide
                                       style={
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
-                                          "borderColor": "#b7bbc866",
+                                          "backgroundColor": "#b4b4b528",
+                                          "borderColor": "#b4b4b566",
                                           "borderRadius": 12,
                                           "borderWidth": 1,
                                           "flexDirection": "row",
@@ -3641,14 +3642,14 @@ exports[`BasicInfo Component prefills form data when previousFormData is provide
                                           onFocus={[Function]}
                                           onSubmitEditing={[Function]}
                                           placeholder="Last name"
-                                          placeholderTextColor="#686e7d"
+                                          placeholderTextColor="#66676a"
                                           returnKeyType="next"
                                           style={
                                             {
                                               "backgroundColor": "inherit",
                                               "borderColor": "transparent",
                                               "borderWidth": 1,
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "fontWeight": "400",
@@ -3680,7 +3681,7 @@ exports[`BasicInfo Component prefills form data when previousFormData is provide
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -3725,8 +3726,8 @@ exports[`BasicInfo Component prefills form data when previousFormData is provide
                                     style={
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
-                                        "borderColor": "#b7bbc866",
+                                        "backgroundColor": "#b4b4b528",
+                                        "borderColor": "#b4b4b566",
                                         "borderRadius": 12,
                                         "borderWidth": 1,
                                         "flexDirection": "row",
@@ -3760,7 +3761,7 @@ exports[`BasicInfo Component prefills form data when previousFormData is provide
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -3774,7 +3775,7 @@ exports[`BasicInfo Component prefills form data when previousFormData is provide
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#b7bbc8",
+                                              "color": "#babbbe",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 14,
                                               "letterSpacing": 0,
@@ -3807,13 +3808,13 @@ exports[`BasicInfo Component prefills form data when previousFormData is provide
                                         onFocus={[Function]}
                                         onSubmitEditing={[Function]}
                                         placeholder="(555) 123-4567"
-                                        placeholderTextColor="#686e7d"
+                                        placeholderTextColor="#66676a"
                                         style={
                                           {
                                             "backgroundColor": "inherit",
                                             "borderColor": "transparent",
                                             "borderWidth": 1,
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 16,
                                             "fontWeight": "400",
@@ -3844,7 +3845,7 @@ exports[`BasicInfo Component prefills form data when previousFormData is provide
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -3889,8 +3890,8 @@ exports[`BasicInfo Component prefills form data when previousFormData is provide
                                     style={
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
-                                        "borderColor": "#b7bbc866",
+                                        "backgroundColor": "#b4b4b528",
+                                        "borderColor": "#b4b4b566",
                                         "borderRadius": 12,
                                         "borderWidth": 1,
                                         "flexDirection": "row",
@@ -3910,7 +3911,7 @@ exports[`BasicInfo Component prefills form data when previousFormData is provide
                                       testID="textfield-startacccessory"
                                     >
                                       <SvgMock
-                                        color="#121314"
+                                        color="#131416"
                                         fill="currentColor"
                                         height={20}
                                         name="Calendar"
@@ -3943,11 +3944,11 @@ exports[`BasicInfo Component prefills form data when previousFormData is provide
                                         <TextInput
                                           editable={false}
                                           placeholder="01/01/2000"
-                                          placeholderTextColor="#b7bbc8"
+                                          placeholderTextColor="#babbbe"
                                           pointerEvents="none"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "flex": 1,
                                               "fontSize": 16,
                                               "height": "100%",
@@ -3992,7 +3993,7 @@ exports[`BasicInfo Component prefills form data when previousFormData is provide
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 16,
                                             "letterSpacing": 0,
@@ -4007,7 +4008,7 @@ exports[`BasicInfo Component prefills form data when previousFormData is provide
                                         testID="ssn-info-button"
                                       >
                                         <SvgMock
-                                          color="#686e7d"
+                                          color="#66676a"
                                           fill="currentColor"
                                           height={16}
                                           name="Info"
@@ -4055,8 +4056,8 @@ exports[`BasicInfo Component prefills form data when previousFormData is provide
                                     style={
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
-                                        "borderColor": "#b7bbc866",
+                                        "backgroundColor": "#b4b4b528",
+                                        "borderColor": "#b4b4b566",
                                         "borderRadius": 12,
                                         "borderWidth": 1,
                                         "flexDirection": "row",
@@ -4088,7 +4089,7 @@ exports[`BasicInfo Component prefills form data when previousFormData is provide
                                         onFocus={[Function]}
                                         onSubmitEditing={[Function]}
                                         placeholder="XXX-XX-XXXX"
-                                        placeholderTextColor="#686e7d"
+                                        placeholderTextColor="#66676a"
                                         returnKeyType="done"
                                         secureTextEntry={true}
                                         style={
@@ -4096,12 +4097,13 @@ exports[`BasicInfo Component prefills form data when previousFormData is provide
                                             "backgroundColor": "inherit",
                                             "borderColor": "transparent",
                                             "borderWidth": 1,
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 16,
                                             "fontWeight": "400",
                                             "height": 46,
                                             "letterSpacing": 0,
+                                            "lineHeight": 0,
                                             "opacity": 1,
                                           }
                                         }
@@ -4136,7 +4138,7 @@ exports[`BasicInfo Component prefills form data when previousFormData is provide
                               accessible={true}
                               style={
                                 {
-                                  "backgroundColor": "#3c4d9d0f",
+                                  "backgroundColor": "#b4b4b528",
                                   "borderRadius": 8,
                                   "marginVertical": 8,
                                   "padding": 16,
@@ -4161,7 +4163,7 @@ exports[`BasicInfo Component prefills form data when previousFormData is provide
                                   testID="listitemcolumn"
                                 >
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={24}
                                     name="SecurityKey"
@@ -4195,7 +4197,7 @@ exports[`BasicInfo Component prefills form data when previousFormData is provide
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 12,
                                         "letterSpacing": 0.25,
@@ -4209,7 +4211,7 @@ exports[`BasicInfo Component prefills form data when previousFormData is provide
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 12,
                                         "letterSpacing": 0.25,
@@ -4235,7 +4237,7 @@ exports[`BasicInfo Component prefills form data when previousFormData is provide
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
@@ -4266,7 +4268,7 @@ exports[`BasicInfo Component prefills form data when previousFormData is provide
                               name="powered-by-transak-logo"
                               style={
                                 {
-                                  "color": "#686e7d",
+                                  "color": "#66676a",
                                   "height": 24,
                                 }
                               }
@@ -4404,7 +4406,7 @@ exports[`BasicInfo Component render matches snapshot 1`] = `
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -4445,7 +4447,7 @@ exports[`BasicInfo Component render matches snapshot 1`] = `
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -4810,7 +4812,7 @@ exports[`BasicInfo Component render matches snapshot 1`] = `
                                             "height": 4,
                                           },
                                           {
-                                            "backgroundColor": "#b7bbc8",
+                                            "backgroundColor": "#babbbe",
                                           },
                                         ],
                                         undefined,
@@ -4823,9 +4825,9 @@ exports[`BasicInfo Component render matches snapshot 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
-                                      "fontSize": 18,
+                                      "fontSize": 20,
                                       "letterSpacing": 0,
                                       "lineHeight": 24,
                                       "marginBottom": 4,
@@ -4839,7 +4841,7 @@ exports[`BasicInfo Component render matches snapshot 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#686e7d",
+                                      "color": "#66676a",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -4876,7 +4878,7 @@ exports[`BasicInfo Component render matches snapshot 1`] = `
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -4921,8 +4923,8 @@ exports[`BasicInfo Component render matches snapshot 1`] = `
                                       style={
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
-                                          "borderColor": "#b7bbc866",
+                                          "backgroundColor": "#b4b4b528",
+                                          "borderColor": "#b4b4b566",
                                           "borderRadius": 12,
                                           "borderWidth": 1,
                                           "flexDirection": "row",
@@ -4953,19 +4955,20 @@ exports[`BasicInfo Component render matches snapshot 1`] = `
                                           onFocus={[Function]}
                                           onSubmitEditing={[Function]}
                                           placeholder="First name"
-                                          placeholderTextColor="#686e7d"
+                                          placeholderTextColor="#66676a"
                                           returnKeyType="next"
                                           style={
                                             {
                                               "backgroundColor": "inherit",
                                               "borderColor": "transparent",
                                               "borderWidth": 1,
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "fontWeight": "400",
                                               "height": 46,
                                               "letterSpacing": 0,
+                                              "lineHeight": 0,
                                               "opacity": 1,
                                             }
                                           }
@@ -4993,7 +4996,7 @@ exports[`BasicInfo Component render matches snapshot 1`] = `
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -5038,8 +5041,8 @@ exports[`BasicInfo Component render matches snapshot 1`] = `
                                       style={
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
-                                          "borderColor": "#b7bbc866",
+                                          "backgroundColor": "#b4b4b528",
+                                          "borderColor": "#b4b4b566",
                                           "borderRadius": 12,
                                           "borderWidth": 1,
                                           "flexDirection": "row",
@@ -5070,19 +5073,20 @@ exports[`BasicInfo Component render matches snapshot 1`] = `
                                           onFocus={[Function]}
                                           onSubmitEditing={[Function]}
                                           placeholder="Last name"
-                                          placeholderTextColor="#686e7d"
+                                          placeholderTextColor="#66676a"
                                           returnKeyType="next"
                                           style={
                                             {
                                               "backgroundColor": "inherit",
                                               "borderColor": "transparent",
                                               "borderWidth": 1,
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "fontWeight": "400",
                                               "height": 46,
                                               "letterSpacing": 0,
+                                              "lineHeight": 0,
                                               "opacity": 1,
                                             }
                                           }
@@ -5109,7 +5113,7 @@ exports[`BasicInfo Component render matches snapshot 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -5154,8 +5158,8 @@ exports[`BasicInfo Component render matches snapshot 1`] = `
                                     style={
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
-                                        "borderColor": "#b7bbc866",
+                                        "backgroundColor": "#b4b4b528",
+                                        "borderColor": "#b4b4b566",
                                         "borderRadius": 12,
                                         "borderWidth": 1,
                                         "flexDirection": "row",
@@ -5189,7 +5193,7 @@ exports[`BasicInfo Component render matches snapshot 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -5203,7 +5207,7 @@ exports[`BasicInfo Component render matches snapshot 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#b7bbc8",
+                                              "color": "#babbbe",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 14,
                                               "letterSpacing": 0,
@@ -5236,18 +5240,19 @@ exports[`BasicInfo Component render matches snapshot 1`] = `
                                         onFocus={[Function]}
                                         onSubmitEditing={[Function]}
                                         placeholder="(555) 123-4567"
-                                        placeholderTextColor="#686e7d"
+                                        placeholderTextColor="#66676a"
                                         style={
                                           {
                                             "backgroundColor": "inherit",
                                             "borderColor": "transparent",
                                             "borderWidth": 1,
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 16,
                                             "fontWeight": "400",
                                             "height": 46,
                                             "letterSpacing": 0,
+                                            "lineHeight": 0,
                                             "opacity": 1,
                                           }
                                         }
@@ -5273,7 +5278,7 @@ exports[`BasicInfo Component render matches snapshot 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -5318,8 +5323,8 @@ exports[`BasicInfo Component render matches snapshot 1`] = `
                                     style={
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
-                                        "borderColor": "#b7bbc866",
+                                        "backgroundColor": "#b4b4b528",
+                                        "borderColor": "#b4b4b566",
                                         "borderRadius": 12,
                                         "borderWidth": 1,
                                         "flexDirection": "row",
@@ -5339,7 +5344,7 @@ exports[`BasicInfo Component render matches snapshot 1`] = `
                                       testID="textfield-startacccessory"
                                     >
                                       <SvgMock
-                                        color="#121314"
+                                        color="#131416"
                                         fill="currentColor"
                                         height={20}
                                         name="Calendar"
@@ -5372,11 +5377,11 @@ exports[`BasicInfo Component render matches snapshot 1`] = `
                                         <TextInput
                                           editable={false}
                                           placeholder="01/01/2000"
-                                          placeholderTextColor="#b7bbc8"
+                                          placeholderTextColor="#babbbe"
                                           pointerEvents="none"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "flex": 1,
                                               "fontSize": 16,
                                               "height": "100%",
@@ -5421,7 +5426,7 @@ exports[`BasicInfo Component render matches snapshot 1`] = `
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 16,
                                             "letterSpacing": 0,
@@ -5436,7 +5441,7 @@ exports[`BasicInfo Component render matches snapshot 1`] = `
                                         testID="ssn-info-button"
                                       >
                                         <SvgMock
-                                          color="#686e7d"
+                                          color="#66676a"
                                           fill="currentColor"
                                           height={16}
                                           name="Info"
@@ -5484,8 +5489,8 @@ exports[`BasicInfo Component render matches snapshot 1`] = `
                                     style={
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
-                                        "borderColor": "#b7bbc866",
+                                        "backgroundColor": "#b4b4b528",
+                                        "borderColor": "#b4b4b566",
                                         "borderRadius": 12,
                                         "borderWidth": 1,
                                         "flexDirection": "row",
@@ -5517,7 +5522,7 @@ exports[`BasicInfo Component render matches snapshot 1`] = `
                                         onFocus={[Function]}
                                         onSubmitEditing={[Function]}
                                         placeholder="XXX-XX-XXXX"
-                                        placeholderTextColor="#686e7d"
+                                        placeholderTextColor="#66676a"
                                         returnKeyType="done"
                                         secureTextEntry={true}
                                         style={
@@ -5525,12 +5530,13 @@ exports[`BasicInfo Component render matches snapshot 1`] = `
                                             "backgroundColor": "inherit",
                                             "borderColor": "transparent",
                                             "borderWidth": 1,
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 16,
                                             "fontWeight": "400",
                                             "height": 46,
                                             "letterSpacing": 0,
+                                            "lineHeight": 0,
                                             "opacity": 1,
                                           }
                                         }
@@ -5565,7 +5571,7 @@ exports[`BasicInfo Component render matches snapshot 1`] = `
                               accessible={true}
                               style={
                                 {
-                                  "backgroundColor": "#3c4d9d0f",
+                                  "backgroundColor": "#b4b4b528",
                                   "borderRadius": 8,
                                   "marginVertical": 8,
                                   "padding": 16,
@@ -5590,7 +5596,7 @@ exports[`BasicInfo Component render matches snapshot 1`] = `
                                   testID="listitemcolumn"
                                 >
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={24}
                                     name="SecurityKey"
@@ -5624,7 +5630,7 @@ exports[`BasicInfo Component render matches snapshot 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 12,
                                         "letterSpacing": 0.25,
@@ -5638,7 +5644,7 @@ exports[`BasicInfo Component render matches snapshot 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 12,
                                         "letterSpacing": 0.25,
@@ -5664,7 +5670,7 @@ exports[`BasicInfo Component render matches snapshot 1`] = `
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
@@ -5695,7 +5701,7 @@ exports[`BasicInfo Component render matches snapshot 1`] = `
                               name="powered-by-transak-logo"
                               style={
                                 {
-                                  "color": "#686e7d",
+                                  "color": "#66676a",
                                   "height": 24,
                                 }
                               }
@@ -5833,7 +5839,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -5874,7 +5880,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -6239,7 +6245,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                             "height": 4,
                                           },
                                           {
-                                            "backgroundColor": "#b7bbc8",
+                                            "backgroundColor": "#babbbe",
                                           },
                                         ],
                                         undefined,
@@ -6252,9 +6258,9 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
-                                      "fontSize": 18,
+                                      "fontSize": 20,
                                       "letterSpacing": 0,
                                       "lineHeight": 24,
                                       "marginBottom": 4,
@@ -6268,7 +6274,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#686e7d",
+                                      "color": "#66676a",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -6305,7 +6311,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -6350,8 +6356,8 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                       style={
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
-                                          "borderColor": "#b7bbc866",
+                                          "backgroundColor": "#b4b4b528",
+                                          "borderColor": "#b4b4b566",
                                           "borderRadius": 12,
                                           "borderWidth": 1,
                                           "flexDirection": "row",
@@ -6382,19 +6388,20 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                           onFocus={[Function]}
                                           onSubmitEditing={[Function]}
                                           placeholder="First name"
-                                          placeholderTextColor="#686e7d"
+                                          placeholderTextColor="#66676a"
                                           returnKeyType="next"
                                           style={
                                             {
                                               "backgroundColor": "inherit",
                                               "borderColor": "transparent",
                                               "borderWidth": 1,
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "fontWeight": "400",
                                               "height": 46,
                                               "letterSpacing": 0,
+                                              "lineHeight": 0,
                                               "opacity": 1,
                                             }
                                           }
@@ -6437,7 +6444,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -6482,8 +6489,8 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                       style={
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
-                                          "borderColor": "#b7bbc866",
+                                          "backgroundColor": "#b4b4b528",
+                                          "borderColor": "#b4b4b566",
                                           "borderRadius": 12,
                                           "borderWidth": 1,
                                           "flexDirection": "row",
@@ -6514,19 +6521,20 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                           onFocus={[Function]}
                                           onSubmitEditing={[Function]}
                                           placeholder="Last name"
-                                          placeholderTextColor="#686e7d"
+                                          placeholderTextColor="#66676a"
                                           returnKeyType="next"
                                           style={
                                             {
                                               "backgroundColor": "inherit",
                                               "borderColor": "transparent",
                                               "borderWidth": 1,
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "fontWeight": "400",
                                               "height": 46,
                                               "letterSpacing": 0,
+                                              "lineHeight": 0,
                                               "opacity": 1,
                                             }
                                           }
@@ -6568,7 +6576,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -6613,8 +6621,8 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                     style={
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
-                                        "borderColor": "#b7bbc866",
+                                        "backgroundColor": "#b4b4b528",
+                                        "borderColor": "#b4b4b566",
                                         "borderRadius": 12,
                                         "borderWidth": 1,
                                         "flexDirection": "row",
@@ -6648,7 +6656,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -6662,7 +6670,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#b7bbc8",
+                                              "color": "#babbbe",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 14,
                                               "letterSpacing": 0,
@@ -6695,18 +6703,19 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                         onFocus={[Function]}
                                         onSubmitEditing={[Function]}
                                         placeholder="(555) 123-4567"
-                                        placeholderTextColor="#686e7d"
+                                        placeholderTextColor="#66676a"
                                         style={
                                           {
                                             "backgroundColor": "inherit",
                                             "borderColor": "transparent",
                                             "borderWidth": 1,
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 16,
                                             "fontWeight": "400",
                                             "height": 46,
                                             "letterSpacing": 0,
+                                            "lineHeight": 0,
                                             "opacity": 1,
                                           }
                                         }
@@ -6747,7 +6756,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -6792,8 +6801,8 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                     style={
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
-                                        "borderColor": "#b7bbc866",
+                                        "backgroundColor": "#b4b4b528",
+                                        "borderColor": "#b4b4b566",
                                         "borderRadius": 12,
                                         "borderWidth": 1,
                                         "flexDirection": "row",
@@ -6813,7 +6822,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                       testID="textfield-startacccessory"
                                     >
                                       <SvgMock
-                                        color="#121314"
+                                        color="#131416"
                                         fill="currentColor"
                                         height={20}
                                         name="Calendar"
@@ -6846,11 +6855,11 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                         <TextInput
                                           editable={false}
                                           placeholder="01/01/2000"
-                                          placeholderTextColor="#b7bbc8"
+                                          placeholderTextColor="#babbbe"
                                           pointerEvents="none"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "flex": 1,
                                               "fontSize": 16,
                                               "height": "100%",
@@ -6895,7 +6904,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 16,
                                             "letterSpacing": 0,
@@ -6910,7 +6919,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                         testID="ssn-info-button"
                                       >
                                         <SvgMock
-                                          color="#686e7d"
+                                          color="#66676a"
                                           fill="currentColor"
                                           height={16}
                                           name="Info"
@@ -6958,8 +6967,8 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                     style={
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
-                                        "borderColor": "#b7bbc866",
+                                        "backgroundColor": "#b4b4b528",
+                                        "borderColor": "#b4b4b566",
                                         "borderRadius": 12,
                                         "borderWidth": 1,
                                         "flexDirection": "row",
@@ -6991,7 +7000,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                         onFocus={[Function]}
                                         onSubmitEditing={[Function]}
                                         placeholder="XXX-XX-XXXX"
-                                        placeholderTextColor="#686e7d"
+                                        placeholderTextColor="#66676a"
                                         returnKeyType="done"
                                         secureTextEntry={true}
                                         style={
@@ -6999,12 +7008,13 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                             "backgroundColor": "inherit",
                                             "borderColor": "transparent",
                                             "borderWidth": 1,
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 16,
                                             "fontWeight": "400",
                                             "height": 46,
                                             "letterSpacing": 0,
+                                            "lineHeight": 0,
                                             "opacity": 1,
                                           }
                                         }
@@ -7054,7 +7064,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                               accessible={true}
                               style={
                                 {
-                                  "backgroundColor": "#3c4d9d0f",
+                                  "backgroundColor": "#b4b4b528",
                                   "borderRadius": 8,
                                   "marginVertical": 8,
                                   "padding": 16,
@@ -7079,7 +7089,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                   testID="listitemcolumn"
                                 >
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={24}
                                     name="SecurityKey"
@@ -7113,7 +7123,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 12,
                                         "letterSpacing": 0.25,
@@ -7127,7 +7137,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 12,
                                         "letterSpacing": 0.25,
@@ -7153,7 +7163,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
@@ -7184,7 +7194,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                               name="powered-by-transak-logo"
                               style={
                                 {
-                                  "color": "#686e7d",
+                                  "color": "#66676a",
                                   "height": 24,
                                 }
                               }
@@ -7322,7 +7332,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -7363,7 +7373,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -7728,7 +7738,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                             "height": 4,
                                           },
                                           {
-                                            "backgroundColor": "#b7bbc8",
+                                            "backgroundColor": "#babbbe",
                                           },
                                         ],
                                         undefined,
@@ -7741,9 +7751,9 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
-                                      "fontSize": 18,
+                                      "fontSize": 20,
                                       "letterSpacing": 0,
                                       "lineHeight": 24,
                                       "marginBottom": 4,
@@ -7757,7 +7767,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#686e7d",
+                                      "color": "#66676a",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -7794,7 +7804,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -7839,8 +7849,8 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                       style={
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
-                                          "borderColor": "#b7bbc866",
+                                          "backgroundColor": "#b4b4b528",
+                                          "borderColor": "#b4b4b566",
                                           "borderRadius": 12,
                                           "borderWidth": 1,
                                           "flexDirection": "row",
@@ -7871,14 +7881,14 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                           onFocus={[Function]}
                                           onSubmitEditing={[Function]}
                                           placeholder="First name"
-                                          placeholderTextColor="#686e7d"
+                                          placeholderTextColor="#66676a"
                                           returnKeyType="next"
                                           style={
                                             {
                                               "backgroundColor": "inherit",
                                               "borderColor": "transparent",
                                               "borderWidth": 1,
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "fontWeight": "400",
@@ -7926,7 +7936,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -7971,8 +7981,8 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                       style={
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
-                                          "borderColor": "#b7bbc866",
+                                          "backgroundColor": "#b4b4b528",
+                                          "borderColor": "#b4b4b566",
                                           "borderRadius": 12,
                                           "borderWidth": 1,
                                           "flexDirection": "row",
@@ -8003,14 +8013,14 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                           onFocus={[Function]}
                                           onSubmitEditing={[Function]}
                                           placeholder="Last name"
-                                          placeholderTextColor="#686e7d"
+                                          placeholderTextColor="#66676a"
                                           returnKeyType="next"
                                           style={
                                             {
                                               "backgroundColor": "inherit",
                                               "borderColor": "transparent",
                                               "borderWidth": 1,
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "fontWeight": "400",
@@ -8057,7 +8067,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -8102,8 +8112,8 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                     style={
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
-                                        "borderColor": "#b7bbc866",
+                                        "backgroundColor": "#b4b4b528",
+                                        "borderColor": "#b4b4b566",
                                         "borderRadius": 12,
                                         "borderWidth": 1,
                                         "flexDirection": "row",
@@ -8137,7 +8147,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -8151,7 +8161,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#b7bbc8",
+                                              "color": "#babbbe",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 14,
                                               "letterSpacing": 0,
@@ -8184,13 +8194,13 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                         onFocus={[Function]}
                                         onSubmitEditing={[Function]}
                                         placeholder="(555) 123-4567"
-                                        placeholderTextColor="#686e7d"
+                                        placeholderTextColor="#66676a"
                                         style={
                                           {
                                             "backgroundColor": "inherit",
                                             "borderColor": "transparent",
                                             "borderWidth": 1,
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 16,
                                             "fontWeight": "400",
@@ -8221,7 +8231,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -8266,8 +8276,8 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                     style={
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
-                                        "borderColor": "#b7bbc866",
+                                        "backgroundColor": "#b4b4b528",
+                                        "borderColor": "#b4b4b566",
                                         "borderRadius": 12,
                                         "borderWidth": 1,
                                         "flexDirection": "row",
@@ -8287,7 +8297,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                       testID="textfield-startacccessory"
                                     >
                                       <SvgMock
-                                        color="#121314"
+                                        color="#131416"
                                         fill="currentColor"
                                         height={20}
                                         name="Calendar"
@@ -8320,11 +8330,11 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                         <TextInput
                                           editable={false}
                                           placeholder="01/01/2000"
-                                          placeholderTextColor="#b7bbc8"
+                                          placeholderTextColor="#babbbe"
                                           pointerEvents="none"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "flex": 1,
                                               "fontSize": 16,
                                               "height": "100%",
@@ -8369,7 +8379,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 16,
                                             "letterSpacing": 0,
@@ -8384,7 +8394,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                         testID="ssn-info-button"
                                       >
                                         <SvgMock
-                                          color="#686e7d"
+                                          color="#66676a"
                                           fill="currentColor"
                                           height={16}
                                           name="Info"
@@ -8432,8 +8442,8 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                     style={
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
-                                        "borderColor": "#b7bbc866",
+                                        "backgroundColor": "#b4b4b528",
+                                        "borderColor": "#b4b4b566",
                                         "borderRadius": 12,
                                         "borderWidth": 1,
                                         "flexDirection": "row",
@@ -8465,7 +8475,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                         onFocus={[Function]}
                                         onSubmitEditing={[Function]}
                                         placeholder="XXX-XX-XXXX"
-                                        placeholderTextColor="#686e7d"
+                                        placeholderTextColor="#66676a"
                                         returnKeyType="done"
                                         secureTextEntry={true}
                                         style={
@@ -8473,12 +8483,13 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                             "backgroundColor": "inherit",
                                             "borderColor": "transparent",
                                             "borderWidth": 1,
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 16,
                                             "fontWeight": "400",
                                             "height": 46,
                                             "letterSpacing": 0,
+                                            "lineHeight": 0,
                                             "opacity": 1,
                                           }
                                         }
@@ -8528,7 +8539,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                               accessible={true}
                               style={
                                 {
-                                  "backgroundColor": "#3c4d9d0f",
+                                  "backgroundColor": "#b4b4b528",
                                   "borderRadius": 8,
                                   "marginVertical": 8,
                                   "padding": 16,
@@ -8553,7 +8564,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                   testID="listitemcolumn"
                                 >
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={24}
                                     name="SecurityKey"
@@ -8587,7 +8598,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 12,
                                         "letterSpacing": 0.25,
@@ -8601,7 +8612,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 12,
                                         "letterSpacing": 0.25,
@@ -8627,7 +8638,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
@@ -8658,7 +8669,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                               name="powered-by-transak-logo"
                               style={
                                 {
-                                  "color": "#686e7d",
+                                  "color": "#66676a",
                                   "height": 24,
                                 }
                               }
@@ -8796,7 +8807,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -8837,7 +8848,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -9202,7 +9213,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                             "height": 4,
                                           },
                                           {
-                                            "backgroundColor": "#b7bbc8",
+                                            "backgroundColor": "#babbbe",
                                           },
                                         ],
                                         undefined,
@@ -9215,9 +9226,9 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
-                                      "fontSize": 18,
+                                      "fontSize": 20,
                                       "letterSpacing": 0,
                                       "lineHeight": 24,
                                       "marginBottom": 4,
@@ -9231,7 +9242,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#686e7d",
+                                      "color": "#66676a",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -9268,7 +9279,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -9313,8 +9324,8 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                       style={
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
-                                          "borderColor": "#b7bbc866",
+                                          "backgroundColor": "#b4b4b528",
+                                          "borderColor": "#b4b4b566",
                                           "borderRadius": 12,
                                           "borderWidth": 1,
                                           "flexDirection": "row",
@@ -9345,14 +9356,14 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                           onFocus={[Function]}
                                           onSubmitEditing={[Function]}
                                           placeholder="First name"
-                                          placeholderTextColor="#686e7d"
+                                          placeholderTextColor="#66676a"
                                           returnKeyType="next"
                                           style={
                                             {
                                               "backgroundColor": "inherit",
                                               "borderColor": "transparent",
                                               "borderWidth": 1,
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "fontWeight": "400",
@@ -9400,7 +9411,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -9445,8 +9456,8 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                       style={
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
-                                          "borderColor": "#b7bbc866",
+                                          "backgroundColor": "#b4b4b528",
+                                          "borderColor": "#b4b4b566",
                                           "borderRadius": 12,
                                           "borderWidth": 1,
                                           "flexDirection": "row",
@@ -9477,14 +9488,14 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                           onFocus={[Function]}
                                           onSubmitEditing={[Function]}
                                           placeholder="Last name"
-                                          placeholderTextColor="#686e7d"
+                                          placeholderTextColor="#66676a"
                                           returnKeyType="next"
                                           style={
                                             {
                                               "backgroundColor": "inherit",
                                               "borderColor": "transparent",
                                               "borderWidth": 1,
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "fontWeight": "400",
@@ -9531,7 +9542,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -9576,8 +9587,8 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                     style={
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
-                                        "borderColor": "#b7bbc866",
+                                        "backgroundColor": "#b4b4b528",
+                                        "borderColor": "#b4b4b566",
                                         "borderRadius": 12,
                                         "borderWidth": 1,
                                         "flexDirection": "row",
@@ -9611,7 +9622,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -9625,7 +9636,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#b7bbc8",
+                                              "color": "#babbbe",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 14,
                                               "letterSpacing": 0,
@@ -9658,13 +9669,13 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                         onFocus={[Function]}
                                         onSubmitEditing={[Function]}
                                         placeholder="(555) 123-4567"
-                                        placeholderTextColor="#686e7d"
+                                        placeholderTextColor="#66676a"
                                         style={
                                           {
                                             "backgroundColor": "inherit",
                                             "borderColor": "transparent",
                                             "borderWidth": 1,
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 16,
                                             "fontWeight": "400",
@@ -9695,7 +9706,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -9740,8 +9751,8 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                     style={
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
-                                        "borderColor": "#b7bbc866",
+                                        "backgroundColor": "#b4b4b528",
+                                        "borderColor": "#b4b4b566",
                                         "borderRadius": 12,
                                         "borderWidth": 1,
                                         "flexDirection": "row",
@@ -9761,7 +9772,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                       testID="textfield-startacccessory"
                                     >
                                       <SvgMock
-                                        color="#121314"
+                                        color="#131416"
                                         fill="currentColor"
                                         height={20}
                                         name="Calendar"
@@ -9794,11 +9805,11 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                         <TextInput
                                           editable={false}
                                           placeholder="01/01/2000"
-                                          placeholderTextColor="#b7bbc8"
+                                          placeholderTextColor="#babbbe"
                                           pointerEvents="none"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "flex": 1,
                                               "fontSize": 16,
                                               "height": "100%",
@@ -9836,7 +9847,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                               accessible={true}
                               style={
                                 {
-                                  "backgroundColor": "#3c4d9d0f",
+                                  "backgroundColor": "#b4b4b528",
                                   "borderRadius": 8,
                                   "marginVertical": 8,
                                   "padding": 16,
@@ -9861,7 +9872,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                   testID="listitemcolumn"
                                 >
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={24}
                                     name="SecurityKey"
@@ -9895,7 +9906,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 12,
                                         "letterSpacing": 0.25,
@@ -9909,7 +9920,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 12,
                                         "letterSpacing": 0.25,
@@ -9935,7 +9946,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
@@ -9966,7 +9977,7 @@ exports[`BasicInfo Component snapshot matches validation errors when continue is
                               name="powered-by-transak-logo"
                               style={
                                 {
-                                  "color": "#686e7d",
+                                  "color": "#66676a",
                                   "height": 24,
                                 }
                               }
diff --git a/app/components/UI/Ramp/Deposit/Views/BuildQuote/__snapshots__/BuildQuote.test.tsx.snap b/app/components/UI/Ramp/Deposit/Views/BuildQuote/__snapshots__/BuildQuote.test.tsx.snap
index d5c18cb1595e..d72845e94c59 100644
--- a/app/components/UI/Ramp/Deposit/Views/BuildQuote/__snapshots__/BuildQuote.test.tsx.snap
+++ b/app/components/UI/Ramp/Deposit/Views/BuildQuote/__snapshots__/BuildQuote.test.tsx.snap
@@ -117,7 +117,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -158,7 +158,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -236,7 +236,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -497,7 +497,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                   {
                                     "alignItems": "center",
                                     "alignSelf": "flex-start",
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "borderRadius": 12,
                                     "flexDirection": "row",
                                     "flexShrink": 1,
@@ -512,7 +512,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -528,7 +528,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                 onPress={[Function]}
                                 style={
                                   {
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "borderRadius": 12,
                                     "paddingHorizontal": 16,
                                     "paddingVertical": 8,
@@ -548,7 +548,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -562,7 +562,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -573,7 +573,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                     US
                                   </Text>
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={16}
                                     name="ArrowDown"
@@ -605,7 +605,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                   numberOfLines={1}
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 64,
                                       "fontWeight": 400,
@@ -626,7 +626,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                   style={
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 100,
                                       "flexDirection": "row",
                                       "gap": 8,
@@ -760,7 +760,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 24,
                                         "letterSpacing": 0,
@@ -771,7 +771,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                     USDC
                                   </Text>
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={16}
                                     name="ArrowDown"
@@ -849,7 +849,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                         onTextLayout={[Function]}
                                         style={
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 14,
                                             "letterSpacing": 0,
@@ -869,7 +869,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                               onPress={[Function]}
                               style={
                                 {
-                                  "backgroundColor": "#3c4d9d0f",
+                                  "backgroundColor": "#b4b4b528",
                                   "borderRadius": 12,
                                   "marginBottom": 16,
                                 }
@@ -904,7 +904,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -918,7 +918,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#686e7d",
+                                          "color": "#66676a",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 14,
                                           "letterSpacing": 0,
@@ -954,10 +954,10 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                         {
                                           "alignSelf": "flex-start",
                                           "backgroundColor": "#ffffff",
-                                          "borderColor": "#b7bbc8",
+                                          "borderColor": "#949596",
                                           "borderRadius": 999,
                                           "borderWidth": 0,
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "padding": 16,
                                           "paddingHorizontal": 8,
                                           "paddingVertical": 2,
@@ -977,7 +977,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 14,
                                               "letterSpacing": 0,
@@ -1009,7 +1009,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                     testID="listitemcolumn"
                                   >
                                     <SvgMock
-                                      color="#686e7d"
+                                      color="#66676a"
                                       fill="currentColor"
                                       height={20}
                                       name="ArrowRight"
@@ -1070,7 +1070,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -1085,7 +1085,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -1122,7 +1122,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -1137,7 +1137,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -1174,7 +1174,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -1189,7 +1189,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -1240,7 +1240,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -1255,7 +1255,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -1292,7 +1292,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -1307,7 +1307,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -1344,7 +1344,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -1359,7 +1359,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -1410,7 +1410,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -1425,7 +1425,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -1462,7 +1462,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -1477,7 +1477,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -1514,7 +1514,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -1529,7 +1529,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -1580,7 +1580,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -1597,7 +1597,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -1632,7 +1632,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -1647,7 +1647,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -1702,7 +1702,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "height": 32,
                                             "width": 32,
                                           },
@@ -1742,7 +1742,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
@@ -1901,7 +1901,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -1942,7 +1942,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -2020,7 +2020,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -2281,7 +2281,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                   {
                                     "alignItems": "center",
                                     "alignSelf": "flex-start",
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "borderRadius": 12,
                                     "flexDirection": "row",
                                     "flexShrink": 1,
@@ -2296,7 +2296,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -2312,7 +2312,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                 onPress={[Function]}
                                 style={
                                   {
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "borderRadius": 12,
                                     "paddingHorizontal": 16,
                                     "paddingVertical": 8,
@@ -2332,7 +2332,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -2346,7 +2346,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -2357,7 +2357,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                     US
                                   </Text>
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={16}
                                     name="ArrowDown"
@@ -2389,7 +2389,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                   numberOfLines={1}
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 64,
                                       "fontWeight": 400,
@@ -2410,7 +2410,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                   style={
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 100,
                                       "flexDirection": "row",
                                       "gap": 8,
@@ -2544,7 +2544,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 24,
                                         "letterSpacing": 0,
@@ -2555,7 +2555,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                     USDC
                                   </Text>
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={16}
                                     name="ArrowDown"
@@ -2633,7 +2633,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                         onTextLayout={[Function]}
                                         style={
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 14,
                                             "letterSpacing": 0,
@@ -2653,7 +2653,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                               onPress={[Function]}
                               style={
                                 {
-                                  "backgroundColor": "#3c4d9d0f",
+                                  "backgroundColor": "#b4b4b528",
                                   "borderRadius": 12,
                                   "marginBottom": 16,
                                 }
@@ -2688,7 +2688,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -2702,7 +2702,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#686e7d",
+                                          "color": "#66676a",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 14,
                                           "letterSpacing": 0,
@@ -2738,10 +2738,10 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                         {
                                           "alignSelf": "flex-start",
                                           "backgroundColor": "#ffffff",
-                                          "borderColor": "#b7bbc8",
+                                          "borderColor": "#949596",
                                           "borderRadius": 999,
                                           "borderWidth": 0,
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "padding": 16,
                                           "paddingHorizontal": 8,
                                           "paddingVertical": 2,
@@ -2761,7 +2761,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 14,
                                               "letterSpacing": 0,
@@ -2793,7 +2793,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                     testID="listitemcolumn"
                                   >
                                     <SvgMock
-                                      color="#686e7d"
+                                      color="#66676a"
                                       fill="currentColor"
                                       height={20}
                                       name="ArrowRight"
@@ -2854,7 +2854,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -2869,7 +2869,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -2906,7 +2906,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -2921,7 +2921,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -2958,7 +2958,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -2973,7 +2973,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -3024,7 +3024,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -3039,7 +3039,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -3076,7 +3076,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -3091,7 +3091,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -3128,7 +3128,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -3143,7 +3143,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -3194,7 +3194,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -3209,7 +3209,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -3246,7 +3246,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -3261,7 +3261,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -3298,7 +3298,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -3313,7 +3313,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -3364,7 +3364,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -3381,7 +3381,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -3416,7 +3416,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -3431,7 +3431,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -3486,7 +3486,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "height": 32,
                                             "width": 32,
                                           },
@@ -3526,7 +3526,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
@@ -3685,7 +3685,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -3726,7 +3726,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -3804,7 +3804,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -4065,7 +4065,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                   {
                                     "alignItems": "center",
                                     "alignSelf": "flex-start",
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "borderRadius": 12,
                                     "flexDirection": "row",
                                     "flexShrink": 1,
@@ -4080,7 +4080,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -4096,7 +4096,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                 onPress={[Function]}
                                 style={
                                   {
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "borderRadius": 12,
                                     "paddingHorizontal": 16,
                                     "paddingVertical": 8,
@@ -4116,7 +4116,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -4130,7 +4130,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -4141,7 +4141,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                     US
                                   </Text>
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={16}
                                     name="ArrowDown"
@@ -4173,7 +4173,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                   numberOfLines={1}
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 64,
                                       "fontWeight": 400,
@@ -4194,7 +4194,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                   style={
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 100,
                                       "flexDirection": "row",
                                       "gap": 8,
@@ -4328,7 +4328,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 24,
                                         "letterSpacing": 0,
@@ -4339,7 +4339,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                     USDC
                                   </Text>
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={16}
                                     name="ArrowDown"
@@ -4417,7 +4417,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                         onTextLayout={[Function]}
                                         style={
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 14,
                                             "letterSpacing": 0,
@@ -4437,7 +4437,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                               onPress={[Function]}
                               style={
                                 {
-                                  "backgroundColor": "#3c4d9d0f",
+                                  "backgroundColor": "#b4b4b528",
                                   "borderRadius": 12,
                                   "marginBottom": 16,
                                 }
@@ -4472,7 +4472,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -4486,7 +4486,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#686e7d",
+                                          "color": "#66676a",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 14,
                                           "letterSpacing": 0,
@@ -4522,10 +4522,10 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                         {
                                           "alignSelf": "flex-start",
                                           "backgroundColor": "#ffffff",
-                                          "borderColor": "#b7bbc8",
+                                          "borderColor": "#949596",
                                           "borderRadius": 999,
                                           "borderWidth": 0,
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "padding": 16,
                                           "paddingHorizontal": 8,
                                           "paddingVertical": 2,
@@ -4545,7 +4545,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 14,
                                               "letterSpacing": 0,
@@ -4577,7 +4577,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                     testID="listitemcolumn"
                                   >
                                     <SvgMock
-                                      color="#686e7d"
+                                      color="#66676a"
                                       fill="currentColor"
                                       height={20}
                                       name="ArrowRight"
@@ -4638,7 +4638,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -4653,7 +4653,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -4690,7 +4690,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -4705,7 +4705,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -4742,7 +4742,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -4757,7 +4757,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -4808,7 +4808,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -4823,7 +4823,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -4860,7 +4860,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -4875,7 +4875,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -4912,7 +4912,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -4927,7 +4927,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -4978,7 +4978,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -4993,7 +4993,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -5030,7 +5030,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -5045,7 +5045,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -5082,7 +5082,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -5097,7 +5097,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -5148,7 +5148,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -5165,7 +5165,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -5200,7 +5200,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -5215,7 +5215,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -5270,7 +5270,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "height": 32,
                                             "width": 32,
                                           },
@@ -5310,7 +5310,7 @@ exports[`BuildQuote Component Continue button functionality displays error when
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
@@ -5469,7 +5469,7 @@ exports[`BuildQuote Component Keypad Functionality displays converted token amou
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -5510,7 +5510,7 @@ exports[`BuildQuote Component Keypad Functionality displays converted token amou
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -5588,7 +5588,7 @@ exports[`BuildQuote Component Keypad Functionality displays converted token amou
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -5849,7 +5849,7 @@ exports[`BuildQuote Component Keypad Functionality displays converted token amou
                                   {
                                     "alignItems": "center",
                                     "alignSelf": "flex-start",
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "borderRadius": 12,
                                     "flexDirection": "row",
                                     "flexShrink": 1,
@@ -5864,7 +5864,7 @@ exports[`BuildQuote Component Keypad Functionality displays converted token amou
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -5880,7 +5880,7 @@ exports[`BuildQuote Component Keypad Functionality displays converted token amou
                                 onPress={[Function]}
                                 style={
                                   {
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "borderRadius": 12,
                                     "paddingHorizontal": 16,
                                     "paddingVertical": 8,
@@ -5900,7 +5900,7 @@ exports[`BuildQuote Component Keypad Functionality displays converted token amou
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -5914,7 +5914,7 @@ exports[`BuildQuote Component Keypad Functionality displays converted token amou
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -5925,7 +5925,7 @@ exports[`BuildQuote Component Keypad Functionality displays converted token amou
                                     US
                                   </Text>
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={16}
                                     name="ArrowDown"
@@ -5957,7 +5957,7 @@ exports[`BuildQuote Component Keypad Functionality displays converted token amou
                                   numberOfLines={1}
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 64,
                                       "fontWeight": 400,
@@ -5973,7 +5973,7 @@ exports[`BuildQuote Component Keypad Functionality displays converted token amou
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#686e7d",
+                                      "color": "#66676a",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -5995,7 +5995,7 @@ exports[`BuildQuote Component Keypad Functionality displays converted token amou
                                   style={
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 100,
                                       "flexDirection": "row",
                                       "gap": 8,
@@ -6129,7 +6129,7 @@ exports[`BuildQuote Component Keypad Functionality displays converted token amou
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 24,
                                         "letterSpacing": 0,
@@ -6140,7 +6140,7 @@ exports[`BuildQuote Component Keypad Functionality displays converted token amou
                                     USDC
                                   </Text>
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={16}
                                     name="ArrowDown"
@@ -6160,7 +6160,7 @@ exports[`BuildQuote Component Keypad Functionality displays converted token amou
                               onPress={[Function]}
                               style={
                                 {
-                                  "backgroundColor": "#3c4d9d0f",
+                                  "backgroundColor": "#b4b4b528",
                                   "borderRadius": 12,
                                   "marginBottom": 16,
                                 }
@@ -6195,7 +6195,7 @@ exports[`BuildQuote Component Keypad Functionality displays converted token amou
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -6209,7 +6209,7 @@ exports[`BuildQuote Component Keypad Functionality displays converted token amou
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#686e7d",
+                                          "color": "#66676a",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 14,
                                           "letterSpacing": 0,
@@ -6245,10 +6245,10 @@ exports[`BuildQuote Component Keypad Functionality displays converted token amou
                                         {
                                           "alignSelf": "flex-start",
                                           "backgroundColor": "#ffffff",
-                                          "borderColor": "#b7bbc8",
+                                          "borderColor": "#949596",
                                           "borderRadius": 999,
                                           "borderWidth": 0,
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "padding": 16,
                                           "paddingHorizontal": 8,
                                           "paddingVertical": 2,
@@ -6268,7 +6268,7 @@ exports[`BuildQuote Component Keypad Functionality displays converted token amou
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 14,
                                               "letterSpacing": 0,
@@ -6300,7 +6300,7 @@ exports[`BuildQuote Component Keypad Functionality displays converted token amou
                                     testID="listitemcolumn"
                                   >
                                     <SvgMock
-                                      color="#686e7d"
+                                      color="#66676a"
                                       fill="currentColor"
                                       height={20}
                                       name="ArrowRight"
@@ -6361,7 +6361,7 @@ exports[`BuildQuote Component Keypad Functionality displays converted token amou
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -6376,7 +6376,7 @@ exports[`BuildQuote Component Keypad Functionality displays converted token amou
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -6413,7 +6413,7 @@ exports[`BuildQuote Component Keypad Functionality displays converted token amou
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -6428,7 +6428,7 @@ exports[`BuildQuote Component Keypad Functionality displays converted token amou
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -6465,7 +6465,7 @@ exports[`BuildQuote Component Keypad Functionality displays converted token amou
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -6480,7 +6480,7 @@ exports[`BuildQuote Component Keypad Functionality displays converted token amou
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -6531,7 +6531,7 @@ exports[`BuildQuote Component Keypad Functionality displays converted token amou
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -6546,7 +6546,7 @@ exports[`BuildQuote Component Keypad Functionality displays converted token amou
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -6583,7 +6583,7 @@ exports[`BuildQuote Component Keypad Functionality displays converted token amou
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -6598,7 +6598,7 @@ exports[`BuildQuote Component Keypad Functionality displays converted token amou
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -6635,7 +6635,7 @@ exports[`BuildQuote Component Keypad Functionality displays converted token amou
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -6650,7 +6650,7 @@ exports[`BuildQuote Component Keypad Functionality displays converted token amou
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -6701,7 +6701,7 @@ exports[`BuildQuote Component Keypad Functionality displays converted token amou
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -6716,7 +6716,7 @@ exports[`BuildQuote Component Keypad Functionality displays converted token amou
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -6753,7 +6753,7 @@ exports[`BuildQuote Component Keypad Functionality displays converted token amou
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -6768,7 +6768,7 @@ exports[`BuildQuote Component Keypad Functionality displays converted token amou
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -6805,7 +6805,7 @@ exports[`BuildQuote Component Keypad Functionality displays converted token amou
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -6820,7 +6820,7 @@ exports[`BuildQuote Component Keypad Functionality displays converted token amou
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -6871,7 +6871,7 @@ exports[`BuildQuote Component Keypad Functionality displays converted token amou
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -6888,7 +6888,7 @@ exports[`BuildQuote Component Keypad Functionality displays converted token amou
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -6923,7 +6923,7 @@ exports[`BuildQuote Component Keypad Functionality displays converted token amou
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -6938,7 +6938,7 @@ exports[`BuildQuote Component Keypad Functionality displays converted token amou
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -6993,7 +6993,7 @@ exports[`BuildQuote Component Keypad Functionality displays converted token amou
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "height": 32,
                                             "width": 32,
                                           },
@@ -7033,7 +7033,7 @@ exports[`BuildQuote Component Keypad Functionality displays converted token amou
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
@@ -7192,7 +7192,7 @@ exports[`BuildQuote Component Keypad Functionality updates amount when keypad is
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -7233,7 +7233,7 @@ exports[`BuildQuote Component Keypad Functionality updates amount when keypad is
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -7311,7 +7311,7 @@ exports[`BuildQuote Component Keypad Functionality updates amount when keypad is
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -7572,7 +7572,7 @@ exports[`BuildQuote Component Keypad Functionality updates amount when keypad is
                                   {
                                     "alignItems": "center",
                                     "alignSelf": "flex-start",
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "borderRadius": 12,
                                     "flexDirection": "row",
                                     "flexShrink": 1,
@@ -7587,7 +7587,7 @@ exports[`BuildQuote Component Keypad Functionality updates amount when keypad is
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -7603,7 +7603,7 @@ exports[`BuildQuote Component Keypad Functionality updates amount when keypad is
                                 onPress={[Function]}
                                 style={
                                   {
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "borderRadius": 12,
                                     "paddingHorizontal": 16,
                                     "paddingVertical": 8,
@@ -7623,7 +7623,7 @@ exports[`BuildQuote Component Keypad Functionality updates amount when keypad is
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -7637,7 +7637,7 @@ exports[`BuildQuote Component Keypad Functionality updates amount when keypad is
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -7648,7 +7648,7 @@ exports[`BuildQuote Component Keypad Functionality updates amount when keypad is
                                     US
                                   </Text>
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={16}
                                     name="ArrowDown"
@@ -7680,7 +7680,7 @@ exports[`BuildQuote Component Keypad Functionality updates amount when keypad is
                                   numberOfLines={1}
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 64,
                                       "fontWeight": 400,
@@ -7696,7 +7696,7 @@ exports[`BuildQuote Component Keypad Functionality updates amount when keypad is
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#686e7d",
+                                      "color": "#66676a",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -7718,7 +7718,7 @@ exports[`BuildQuote Component Keypad Functionality updates amount when keypad is
                                   style={
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 100,
                                       "flexDirection": "row",
                                       "gap": 8,
@@ -7852,7 +7852,7 @@ exports[`BuildQuote Component Keypad Functionality updates amount when keypad is
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 24,
                                         "letterSpacing": 0,
@@ -7863,7 +7863,7 @@ exports[`BuildQuote Component Keypad Functionality updates amount when keypad is
                                     USDC
                                   </Text>
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={16}
                                     name="ArrowDown"
@@ -7883,7 +7883,7 @@ exports[`BuildQuote Component Keypad Functionality updates amount when keypad is
                               onPress={[Function]}
                               style={
                                 {
-                                  "backgroundColor": "#3c4d9d0f",
+                                  "backgroundColor": "#b4b4b528",
                                   "borderRadius": 12,
                                   "marginBottom": 16,
                                 }
@@ -7918,7 +7918,7 @@ exports[`BuildQuote Component Keypad Functionality updates amount when keypad is
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -7932,7 +7932,7 @@ exports[`BuildQuote Component Keypad Functionality updates amount when keypad is
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#686e7d",
+                                          "color": "#66676a",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 14,
                                           "letterSpacing": 0,
@@ -7968,10 +7968,10 @@ exports[`BuildQuote Component Keypad Functionality updates amount when keypad is
                                         {
                                           "alignSelf": "flex-start",
                                           "backgroundColor": "#ffffff",
-                                          "borderColor": "#b7bbc8",
+                                          "borderColor": "#949596",
                                           "borderRadius": 999,
                                           "borderWidth": 0,
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "padding": 16,
                                           "paddingHorizontal": 8,
                                           "paddingVertical": 2,
@@ -7991,7 +7991,7 @@ exports[`BuildQuote Component Keypad Functionality updates amount when keypad is
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 14,
                                               "letterSpacing": 0,
@@ -8023,7 +8023,7 @@ exports[`BuildQuote Component Keypad Functionality updates amount when keypad is
                                     testID="listitemcolumn"
                                   >
                                     <SvgMock
-                                      color="#686e7d"
+                                      color="#66676a"
                                       fill="currentColor"
                                       height={20}
                                       name="ArrowRight"
@@ -8084,7 +8084,7 @@ exports[`BuildQuote Component Keypad Functionality updates amount when keypad is
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -8099,7 +8099,7 @@ exports[`BuildQuote Component Keypad Functionality updates amount when keypad is
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -8136,7 +8136,7 @@ exports[`BuildQuote Component Keypad Functionality updates amount when keypad is
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -8151,7 +8151,7 @@ exports[`BuildQuote Component Keypad Functionality updates amount when keypad is
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -8188,7 +8188,7 @@ exports[`BuildQuote Component Keypad Functionality updates amount when keypad is
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -8203,7 +8203,7 @@ exports[`BuildQuote Component Keypad Functionality updates amount when keypad is
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -8254,7 +8254,7 @@ exports[`BuildQuote Component Keypad Functionality updates amount when keypad is
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -8269,7 +8269,7 @@ exports[`BuildQuote Component Keypad Functionality updates amount when keypad is
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -8306,7 +8306,7 @@ exports[`BuildQuote Component Keypad Functionality updates amount when keypad is
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -8321,7 +8321,7 @@ exports[`BuildQuote Component Keypad Functionality updates amount when keypad is
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -8358,7 +8358,7 @@ exports[`BuildQuote Component Keypad Functionality updates amount when keypad is
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -8373,7 +8373,7 @@ exports[`BuildQuote Component Keypad Functionality updates amount when keypad is
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -8424,7 +8424,7 @@ exports[`BuildQuote Component Keypad Functionality updates amount when keypad is
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -8439,7 +8439,7 @@ exports[`BuildQuote Component Keypad Functionality updates amount when keypad is
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -8476,7 +8476,7 @@ exports[`BuildQuote Component Keypad Functionality updates amount when keypad is
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -8491,7 +8491,7 @@ exports[`BuildQuote Component Keypad Functionality updates amount when keypad is
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -8528,7 +8528,7 @@ exports[`BuildQuote Component Keypad Functionality updates amount when keypad is
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -8543,7 +8543,7 @@ exports[`BuildQuote Component Keypad Functionality updates amount when keypad is
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -8594,7 +8594,7 @@ exports[`BuildQuote Component Keypad Functionality updates amount when keypad is
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -8611,7 +8611,7 @@ exports[`BuildQuote Component Keypad Functionality updates amount when keypad is
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -8646,7 +8646,7 @@ exports[`BuildQuote Component Keypad Functionality updates amount when keypad is
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -8661,7 +8661,7 @@ exports[`BuildQuote Component Keypad Functionality updates amount when keypad is
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -8716,7 +8716,7 @@ exports[`BuildQuote Component Keypad Functionality updates amount when keypad is
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "height": 32,
                                             "width": 32,
                                           },
@@ -8756,7 +8756,7 @@ exports[`BuildQuote Component Keypad Functionality updates amount when keypad is
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
@@ -8914,7 +8914,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -8955,7 +8955,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -9033,7 +9033,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -9294,7 +9294,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                   {
                                     "alignItems": "center",
                                     "alignSelf": "flex-start",
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "borderRadius": 12,
                                     "flexDirection": "row",
                                     "flexShrink": 1,
@@ -9309,7 +9309,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -9325,7 +9325,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                 onPress={[Function]}
                                 style={
                                   {
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "borderRadius": 12,
                                     "paddingHorizontal": 16,
                                     "paddingVertical": 8,
@@ -9345,7 +9345,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -9359,7 +9359,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -9370,7 +9370,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                     US
                                   </Text>
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={16}
                                     name="ArrowDown"
@@ -9402,7 +9402,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                   numberOfLines={1}
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 64,
                                       "fontWeight": 400,
@@ -9418,7 +9418,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#686e7d",
+                                      "color": "#66676a",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -9440,7 +9440,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                   style={
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 100,
                                       "flexDirection": "row",
                                       "gap": 8,
@@ -9574,7 +9574,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 24,
                                         "letterSpacing": 0,
@@ -9585,7 +9585,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                     USDC
                                   </Text>
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={16}
                                     name="ArrowDown"
@@ -9605,7 +9605,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                               onPress={[Function]}
                               style={
                                 {
-                                  "backgroundColor": "#3c4d9d0f",
+                                  "backgroundColor": "#b4b4b528",
                                   "borderRadius": 12,
                                   "marginBottom": 16,
                                 }
@@ -9640,7 +9640,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -9654,7 +9654,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#686e7d",
+                                          "color": "#66676a",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 14,
                                           "letterSpacing": 0,
@@ -9690,10 +9690,10 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                         {
                                           "alignSelf": "flex-start",
                                           "backgroundColor": "#ffffff",
-                                          "borderColor": "#b7bbc8",
+                                          "borderColor": "#949596",
                                           "borderRadius": 999,
                                           "borderWidth": 0,
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "padding": 16,
                                           "paddingHorizontal": 8,
                                           "paddingVertical": 2,
@@ -9713,7 +9713,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 14,
                                               "letterSpacing": 0,
@@ -9745,7 +9745,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                     testID="listitemcolumn"
                                   >
                                     <SvgMock
-                                      color="#686e7d"
+                                      color="#66676a"
                                       fill="currentColor"
                                       height={20}
                                       name="ArrowRight"
@@ -9806,7 +9806,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -9821,7 +9821,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -9858,7 +9858,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -9873,7 +9873,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -9910,7 +9910,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -9925,7 +9925,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -9976,7 +9976,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -9991,7 +9991,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -10028,7 +10028,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -10043,7 +10043,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -10080,7 +10080,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -10095,7 +10095,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -10146,7 +10146,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -10161,7 +10161,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -10198,7 +10198,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -10213,7 +10213,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -10250,7 +10250,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -10265,7 +10265,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -10316,7 +10316,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -10333,7 +10333,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -10368,7 +10368,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -10383,7 +10383,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -10438,7 +10438,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "height": 32,
                                             "width": 32,
                                           },
@@ -10478,7 +10478,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
@@ -10637,7 +10637,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -10678,7 +10678,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -10756,7 +10756,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -11017,7 +11017,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                   {
                                     "alignItems": "center",
                                     "alignSelf": "flex-start",
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "borderRadius": 12,
                                     "flexDirection": "row",
                                     "flexShrink": 1,
@@ -11032,7 +11032,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -11048,7 +11048,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                 onPress={[Function]}
                                 style={
                                   {
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "borderRadius": 12,
                                     "paddingHorizontal": 16,
                                     "paddingVertical": 8,
@@ -11068,7 +11068,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -11082,7 +11082,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -11093,7 +11093,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                     US
                                   </Text>
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={16}
                                     name="ArrowDown"
@@ -11125,7 +11125,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                   numberOfLines={1}
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 64,
                                       "fontWeight": 400,
@@ -11141,7 +11141,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#686e7d",
+                                      "color": "#66676a",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -11163,7 +11163,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                   style={
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 100,
                                       "flexDirection": "row",
                                       "gap": 8,
@@ -11297,7 +11297,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 24,
                                         "letterSpacing": 0,
@@ -11308,7 +11308,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                     USDC
                                   </Text>
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={16}
                                     name="ArrowDown"
@@ -11368,7 +11368,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 14,
                                         "letterSpacing": 0,
@@ -11389,7 +11389,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                     style={
                                       {
                                         "backgroundColor": "transparent",
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -11421,7 +11421,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                               onPress={[Function]}
                               style={
                                 {
-                                  "backgroundColor": "#3c4d9d0f",
+                                  "backgroundColor": "#b4b4b528",
                                   "borderRadius": 12,
                                   "marginBottom": 16,
                                 }
@@ -11456,7 +11456,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -11470,7 +11470,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#686e7d",
+                                          "color": "#66676a",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 14,
                                           "letterSpacing": 0,
@@ -11506,10 +11506,10 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                         {
                                           "alignSelf": "flex-start",
                                           "backgroundColor": "#ffffff",
-                                          "borderColor": "#b7bbc8",
+                                          "borderColor": "#949596",
                                           "borderRadius": 999,
                                           "borderWidth": 0,
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "padding": 16,
                                           "paddingHorizontal": 8,
                                           "paddingVertical": 2,
@@ -11529,7 +11529,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 14,
                                               "letterSpacing": 0,
@@ -11561,7 +11561,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                     testID="listitemcolumn"
                                   >
                                     <SvgMock
-                                      color="#686e7d"
+                                      color="#66676a"
                                       fill="currentColor"
                                       height={20}
                                       name="ArrowRight"
@@ -11622,7 +11622,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -11637,7 +11637,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -11674,7 +11674,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -11689,7 +11689,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -11726,7 +11726,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -11741,7 +11741,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -11792,7 +11792,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -11807,7 +11807,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -11844,7 +11844,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -11859,7 +11859,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -11896,7 +11896,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -11911,7 +11911,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -11962,7 +11962,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -11977,7 +11977,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -12014,7 +12014,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -12029,7 +12029,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -12066,7 +12066,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -12081,7 +12081,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -12132,7 +12132,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -12149,7 +12149,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -12184,7 +12184,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -12199,7 +12199,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -12254,7 +12254,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "height": 32,
                                             "width": 32,
                                           },
@@ -12294,7 +12294,7 @@ exports[`BuildQuote Component Payment Method Selection does not open payment met
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
@@ -12453,7 +12453,7 @@ exports[`BuildQuote Component Payment Method Selection does not show the duratio
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -12494,7 +12494,7 @@ exports[`BuildQuote Component Payment Method Selection does not show the duratio
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -12572,7 +12572,7 @@ exports[`BuildQuote Component Payment Method Selection does not show the duratio
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -12833,7 +12833,7 @@ exports[`BuildQuote Component Payment Method Selection does not show the duratio
                                   {
                                     "alignItems": "center",
                                     "alignSelf": "flex-start",
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "borderRadius": 12,
                                     "flexDirection": "row",
                                     "flexShrink": 1,
@@ -12848,7 +12848,7 @@ exports[`BuildQuote Component Payment Method Selection does not show the duratio
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -12864,7 +12864,7 @@ exports[`BuildQuote Component Payment Method Selection does not show the duratio
                                 onPress={[Function]}
                                 style={
                                   {
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "borderRadius": 12,
                                     "paddingHorizontal": 16,
                                     "paddingVertical": 8,
@@ -12884,7 +12884,7 @@ exports[`BuildQuote Component Payment Method Selection does not show the duratio
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -12898,7 +12898,7 @@ exports[`BuildQuote Component Payment Method Selection does not show the duratio
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -12909,7 +12909,7 @@ exports[`BuildQuote Component Payment Method Selection does not show the duratio
                                     US
                                   </Text>
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={16}
                                     name="ArrowDown"
@@ -12941,7 +12941,7 @@ exports[`BuildQuote Component Payment Method Selection does not show the duratio
                                   numberOfLines={1}
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 64,
                                       "fontWeight": 400,
@@ -12957,7 +12957,7 @@ exports[`BuildQuote Component Payment Method Selection does not show the duratio
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#686e7d",
+                                      "color": "#66676a",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -12979,7 +12979,7 @@ exports[`BuildQuote Component Payment Method Selection does not show the duratio
                                   style={
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 100,
                                       "flexDirection": "row",
                                       "gap": 8,
@@ -13113,7 +13113,7 @@ exports[`BuildQuote Component Payment Method Selection does not show the duratio
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 24,
                                         "letterSpacing": 0,
@@ -13124,7 +13124,7 @@ exports[`BuildQuote Component Payment Method Selection does not show the duratio
                                     USDC
                                   </Text>
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={16}
                                     name="ArrowDown"
@@ -13144,7 +13144,7 @@ exports[`BuildQuote Component Payment Method Selection does not show the duratio
                               onPress={[Function]}
                               style={
                                 {
-                                  "backgroundColor": "#3c4d9d0f",
+                                  "backgroundColor": "#b4b4b528",
                                   "borderRadius": 12,
                                   "marginBottom": 16,
                                 }
@@ -13179,7 +13179,7 @@ exports[`BuildQuote Component Payment Method Selection does not show the duratio
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -13193,7 +13193,7 @@ exports[`BuildQuote Component Payment Method Selection does not show the duratio
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#686e7d",
+                                          "color": "#66676a",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 14,
                                           "letterSpacing": 0,
@@ -13239,7 +13239,7 @@ exports[`BuildQuote Component Payment Method Selection does not show the duratio
                                     testID="listitemcolumn"
                                   >
                                     <SvgMock
-                                      color="#686e7d"
+                                      color="#66676a"
                                       fill="currentColor"
                                       height={20}
                                       name="ArrowRight"
@@ -13300,7 +13300,7 @@ exports[`BuildQuote Component Payment Method Selection does not show the duratio
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -13315,7 +13315,7 @@ exports[`BuildQuote Component Payment Method Selection does not show the duratio
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -13352,7 +13352,7 @@ exports[`BuildQuote Component Payment Method Selection does not show the duratio
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -13367,7 +13367,7 @@ exports[`BuildQuote Component Payment Method Selection does not show the duratio
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -13404,7 +13404,7 @@ exports[`BuildQuote Component Payment Method Selection does not show the duratio
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -13419,7 +13419,7 @@ exports[`BuildQuote Component Payment Method Selection does not show the duratio
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -13470,7 +13470,7 @@ exports[`BuildQuote Component Payment Method Selection does not show the duratio
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -13485,7 +13485,7 @@ exports[`BuildQuote Component Payment Method Selection does not show the duratio
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -13522,7 +13522,7 @@ exports[`BuildQuote Component Payment Method Selection does not show the duratio
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -13537,7 +13537,7 @@ exports[`BuildQuote Component Payment Method Selection does not show the duratio
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -13574,7 +13574,7 @@ exports[`BuildQuote Component Payment Method Selection does not show the duratio
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -13589,7 +13589,7 @@ exports[`BuildQuote Component Payment Method Selection does not show the duratio
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -13640,7 +13640,7 @@ exports[`BuildQuote Component Payment Method Selection does not show the duratio
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -13655,7 +13655,7 @@ exports[`BuildQuote Component Payment Method Selection does not show the duratio
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -13692,7 +13692,7 @@ exports[`BuildQuote Component Payment Method Selection does not show the duratio
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -13707,7 +13707,7 @@ exports[`BuildQuote Component Payment Method Selection does not show the duratio
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -13744,7 +13744,7 @@ exports[`BuildQuote Component Payment Method Selection does not show the duratio
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -13759,7 +13759,7 @@ exports[`BuildQuote Component Payment Method Selection does not show the duratio
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -13810,7 +13810,7 @@ exports[`BuildQuote Component Payment Method Selection does not show the duratio
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -13827,7 +13827,7 @@ exports[`BuildQuote Component Payment Method Selection does not show the duratio
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -13862,7 +13862,7 @@ exports[`BuildQuote Component Payment Method Selection does not show the duratio
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -13877,7 +13877,7 @@ exports[`BuildQuote Component Payment Method Selection does not show the duratio
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -13932,7 +13932,7 @@ exports[`BuildQuote Component Payment Method Selection does not show the duratio
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "height": 32,
                                             "width": 32,
                                           },
@@ -13972,7 +13972,7 @@ exports[`BuildQuote Component Payment Method Selection does not show the duratio
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
@@ -14131,7 +14131,7 @@ exports[`BuildQuote Component Payment Method Selection shows the right duration
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -14172,7 +14172,7 @@ exports[`BuildQuote Component Payment Method Selection shows the right duration
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -14250,7 +14250,7 @@ exports[`BuildQuote Component Payment Method Selection shows the right duration
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -14511,7 +14511,7 @@ exports[`BuildQuote Component Payment Method Selection shows the right duration
                                   {
                                     "alignItems": "center",
                                     "alignSelf": "flex-start",
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "borderRadius": 12,
                                     "flexDirection": "row",
                                     "flexShrink": 1,
@@ -14526,7 +14526,7 @@ exports[`BuildQuote Component Payment Method Selection shows the right duration
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -14542,7 +14542,7 @@ exports[`BuildQuote Component Payment Method Selection shows the right duration
                                 onPress={[Function]}
                                 style={
                                   {
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "borderRadius": 12,
                                     "paddingHorizontal": 16,
                                     "paddingVertical": 8,
@@ -14562,7 +14562,7 @@ exports[`BuildQuote Component Payment Method Selection shows the right duration
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -14576,7 +14576,7 @@ exports[`BuildQuote Component Payment Method Selection shows the right duration
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -14587,7 +14587,7 @@ exports[`BuildQuote Component Payment Method Selection shows the right duration
                                     US
                                   </Text>
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={16}
                                     name="ArrowDown"
@@ -14619,7 +14619,7 @@ exports[`BuildQuote Component Payment Method Selection shows the right duration
                                   numberOfLines={1}
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 64,
                                       "fontWeight": 400,
@@ -14635,7 +14635,7 @@ exports[`BuildQuote Component Payment Method Selection shows the right duration
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#686e7d",
+                                      "color": "#66676a",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -14657,7 +14657,7 @@ exports[`BuildQuote Component Payment Method Selection shows the right duration
                                   style={
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 100,
                                       "flexDirection": "row",
                                       "gap": 8,
@@ -14791,7 +14791,7 @@ exports[`BuildQuote Component Payment Method Selection shows the right duration
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 24,
                                         "letterSpacing": 0,
@@ -14802,7 +14802,7 @@ exports[`BuildQuote Component Payment Method Selection shows the right duration
                                     USDC
                                   </Text>
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={16}
                                     name="ArrowDown"
@@ -14822,7 +14822,7 @@ exports[`BuildQuote Component Payment Method Selection shows the right duration
                               onPress={[Function]}
                               style={
                                 {
-                                  "backgroundColor": "#3c4d9d0f",
+                                  "backgroundColor": "#b4b4b528",
                                   "borderRadius": 12,
                                   "marginBottom": 16,
                                 }
@@ -14857,7 +14857,7 @@ exports[`BuildQuote Component Payment Method Selection shows the right duration
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -14871,7 +14871,7 @@ exports[`BuildQuote Component Payment Method Selection shows the right duration
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#686e7d",
+                                          "color": "#66676a",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 14,
                                           "letterSpacing": 0,
@@ -14907,10 +14907,10 @@ exports[`BuildQuote Component Payment Method Selection shows the right duration
                                         {
                                           "alignSelf": "flex-start",
                                           "backgroundColor": "#ffffff",
-                                          "borderColor": "#b7bbc8",
+                                          "borderColor": "#949596",
                                           "borderRadius": 999,
                                           "borderWidth": 0,
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "padding": 16,
                                           "paddingHorizontal": 8,
                                           "paddingVertical": 2,
@@ -14930,7 +14930,7 @@ exports[`BuildQuote Component Payment Method Selection shows the right duration
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 14,
                                               "letterSpacing": 0,
@@ -14962,7 +14962,7 @@ exports[`BuildQuote Component Payment Method Selection shows the right duration
                                     testID="listitemcolumn"
                                   >
                                     <SvgMock
-                                      color="#686e7d"
+                                      color="#66676a"
                                       fill="currentColor"
                                       height={20}
                                       name="ArrowRight"
@@ -15023,7 +15023,7 @@ exports[`BuildQuote Component Payment Method Selection shows the right duration
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -15038,7 +15038,7 @@ exports[`BuildQuote Component Payment Method Selection shows the right duration
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -15075,7 +15075,7 @@ exports[`BuildQuote Component Payment Method Selection shows the right duration
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -15090,7 +15090,7 @@ exports[`BuildQuote Component Payment Method Selection shows the right duration
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -15127,7 +15127,7 @@ exports[`BuildQuote Component Payment Method Selection shows the right duration
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -15142,7 +15142,7 @@ exports[`BuildQuote Component Payment Method Selection shows the right duration
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -15193,7 +15193,7 @@ exports[`BuildQuote Component Payment Method Selection shows the right duration
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -15208,7 +15208,7 @@ exports[`BuildQuote Component Payment Method Selection shows the right duration
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -15245,7 +15245,7 @@ exports[`BuildQuote Component Payment Method Selection shows the right duration
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -15260,7 +15260,7 @@ exports[`BuildQuote Component Payment Method Selection shows the right duration
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -15297,7 +15297,7 @@ exports[`BuildQuote Component Payment Method Selection shows the right duration
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -15312,7 +15312,7 @@ exports[`BuildQuote Component Payment Method Selection shows the right duration
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -15363,7 +15363,7 @@ exports[`BuildQuote Component Payment Method Selection shows the right duration
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -15378,7 +15378,7 @@ exports[`BuildQuote Component Payment Method Selection shows the right duration
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -15415,7 +15415,7 @@ exports[`BuildQuote Component Payment Method Selection shows the right duration
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -15430,7 +15430,7 @@ exports[`BuildQuote Component Payment Method Selection shows the right duration
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -15467,7 +15467,7 @@ exports[`BuildQuote Component Payment Method Selection shows the right duration
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -15482,7 +15482,7 @@ exports[`BuildQuote Component Payment Method Selection shows the right duration
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -15533,7 +15533,7 @@ exports[`BuildQuote Component Payment Method Selection shows the right duration
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -15550,7 +15550,7 @@ exports[`BuildQuote Component Payment Method Selection shows the right duration
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -15585,7 +15585,7 @@ exports[`BuildQuote Component Payment Method Selection shows the right duration
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -15600,7 +15600,7 @@ exports[`BuildQuote Component Payment Method Selection shows the right duration
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -15655,7 +15655,7 @@ exports[`BuildQuote Component Payment Method Selection shows the right duration
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "height": 32,
                                             "width": 32,
                                           },
@@ -15695,7 +15695,7 @@ exports[`BuildQuote Component Payment Method Selection shows the right duration
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
@@ -15854,7 +15854,7 @@ exports[`BuildQuote Component Region Selection displays EUR currency when select
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -15895,7 +15895,7 @@ exports[`BuildQuote Component Region Selection displays EUR currency when select
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -15973,7 +15973,7 @@ exports[`BuildQuote Component Region Selection displays EUR currency when select
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -16234,7 +16234,7 @@ exports[`BuildQuote Component Region Selection displays EUR currency when select
                                   {
                                     "alignItems": "center",
                                     "alignSelf": "flex-start",
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "borderRadius": 12,
                                     "flexDirection": "row",
                                     "flexShrink": 1,
@@ -16249,7 +16249,7 @@ exports[`BuildQuote Component Region Selection displays EUR currency when select
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -16265,7 +16265,7 @@ exports[`BuildQuote Component Region Selection displays EUR currency when select
                                 onPress={[Function]}
                                 style={
                                   {
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "borderRadius": 12,
                                     "paddingHorizontal": 16,
                                     "paddingVertical": 8,
@@ -16285,7 +16285,7 @@ exports[`BuildQuote Component Region Selection displays EUR currency when select
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -16299,7 +16299,7 @@ exports[`BuildQuote Component Region Selection displays EUR currency when select
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -16310,7 +16310,7 @@ exports[`BuildQuote Component Region Selection displays EUR currency when select
                                     DE
                                   </Text>
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={16}
                                     name="ArrowDown"
@@ -16342,7 +16342,7 @@ exports[`BuildQuote Component Region Selection displays EUR currency when select
                                   numberOfLines={1}
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 64,
                                       "fontWeight": 400,
@@ -16358,7 +16358,7 @@ exports[`BuildQuote Component Region Selection displays EUR currency when select
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#686e7d",
+                                      "color": "#66676a",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -16380,7 +16380,7 @@ exports[`BuildQuote Component Region Selection displays EUR currency when select
                                   style={
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 100,
                                       "flexDirection": "row",
                                       "gap": 8,
@@ -16514,7 +16514,7 @@ exports[`BuildQuote Component Region Selection displays EUR currency when select
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 24,
                                         "letterSpacing": 0,
@@ -16525,7 +16525,7 @@ exports[`BuildQuote Component Region Selection displays EUR currency when select
                                     USDC
                                   </Text>
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={16}
                                     name="ArrowDown"
@@ -16545,7 +16545,7 @@ exports[`BuildQuote Component Region Selection displays EUR currency when select
                               onPress={[Function]}
                               style={
                                 {
-                                  "backgroundColor": "#3c4d9d0f",
+                                  "backgroundColor": "#b4b4b528",
                                   "borderRadius": 12,
                                   "marginBottom": 16,
                                 }
@@ -16580,7 +16580,7 @@ exports[`BuildQuote Component Region Selection displays EUR currency when select
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -16594,7 +16594,7 @@ exports[`BuildQuote Component Region Selection displays EUR currency when select
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#686e7d",
+                                          "color": "#66676a",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 14,
                                           "letterSpacing": 0,
@@ -16630,10 +16630,10 @@ exports[`BuildQuote Component Region Selection displays EUR currency when select
                                         {
                                           "alignSelf": "flex-start",
                                           "backgroundColor": "#ffffff",
-                                          "borderColor": "#b7bbc8",
+                                          "borderColor": "#949596",
                                           "borderRadius": 999,
                                           "borderWidth": 0,
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "padding": 16,
                                           "paddingHorizontal": 8,
                                           "paddingVertical": 2,
@@ -16653,7 +16653,7 @@ exports[`BuildQuote Component Region Selection displays EUR currency when select
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 14,
                                               "letterSpacing": 0,
@@ -16685,7 +16685,7 @@ exports[`BuildQuote Component Region Selection displays EUR currency when select
                                     testID="listitemcolumn"
                                   >
                                     <SvgMock
-                                      color="#686e7d"
+                                      color="#66676a"
                                       fill="currentColor"
                                       height={20}
                                       name="ArrowRight"
@@ -16746,7 +16746,7 @@ exports[`BuildQuote Component Region Selection displays EUR currency when select
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -16761,7 +16761,7 @@ exports[`BuildQuote Component Region Selection displays EUR currency when select
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -16798,7 +16798,7 @@ exports[`BuildQuote Component Region Selection displays EUR currency when select
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -16813,7 +16813,7 @@ exports[`BuildQuote Component Region Selection displays EUR currency when select
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -16850,7 +16850,7 @@ exports[`BuildQuote Component Region Selection displays EUR currency when select
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -16865,7 +16865,7 @@ exports[`BuildQuote Component Region Selection displays EUR currency when select
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -16916,7 +16916,7 @@ exports[`BuildQuote Component Region Selection displays EUR currency when select
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -16931,7 +16931,7 @@ exports[`BuildQuote Component Region Selection displays EUR currency when select
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -16968,7 +16968,7 @@ exports[`BuildQuote Component Region Selection displays EUR currency when select
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -16983,7 +16983,7 @@ exports[`BuildQuote Component Region Selection displays EUR currency when select
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -17020,7 +17020,7 @@ exports[`BuildQuote Component Region Selection displays EUR currency when select
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -17035,7 +17035,7 @@ exports[`BuildQuote Component Region Selection displays EUR currency when select
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -17086,7 +17086,7 @@ exports[`BuildQuote Component Region Selection displays EUR currency when select
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -17101,7 +17101,7 @@ exports[`BuildQuote Component Region Selection displays EUR currency when select
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -17138,7 +17138,7 @@ exports[`BuildQuote Component Region Selection displays EUR currency when select
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -17153,7 +17153,7 @@ exports[`BuildQuote Component Region Selection displays EUR currency when select
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -17190,7 +17190,7 @@ exports[`BuildQuote Component Region Selection displays EUR currency when select
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -17205,7 +17205,7 @@ exports[`BuildQuote Component Region Selection displays EUR currency when select
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -17256,7 +17256,7 @@ exports[`BuildQuote Component Region Selection displays EUR currency when select
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -17273,7 +17273,7 @@ exports[`BuildQuote Component Region Selection displays EUR currency when select
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -17308,7 +17308,7 @@ exports[`BuildQuote Component Region Selection displays EUR currency when select
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -17323,7 +17323,7 @@ exports[`BuildQuote Component Region Selection displays EUR currency when select
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -17378,7 +17378,7 @@ exports[`BuildQuote Component Region Selection displays EUR currency when select
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "height": 32,
                                             "width": 32,
                                           },
@@ -17418,7 +17418,7 @@ exports[`BuildQuote Component Region Selection displays EUR currency when select
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
@@ -17577,7 +17577,7 @@ exports[`BuildQuote Component Region Selection displays default US region on ini
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -17618,7 +17618,7 @@ exports[`BuildQuote Component Region Selection displays default US region on ini
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -17696,7 +17696,7 @@ exports[`BuildQuote Component Region Selection displays default US region on ini
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -17957,7 +17957,7 @@ exports[`BuildQuote Component Region Selection displays default US region on ini
                                   {
                                     "alignItems": "center",
                                     "alignSelf": "flex-start",
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "borderRadius": 12,
                                     "flexDirection": "row",
                                     "flexShrink": 1,
@@ -17972,7 +17972,7 @@ exports[`BuildQuote Component Region Selection displays default US region on ini
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -17988,7 +17988,7 @@ exports[`BuildQuote Component Region Selection displays default US region on ini
                                 onPress={[Function]}
                                 style={
                                   {
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "borderRadius": 12,
                                     "paddingHorizontal": 16,
                                     "paddingVertical": 8,
@@ -18008,7 +18008,7 @@ exports[`BuildQuote Component Region Selection displays default US region on ini
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -18022,7 +18022,7 @@ exports[`BuildQuote Component Region Selection displays default US region on ini
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -18033,7 +18033,7 @@ exports[`BuildQuote Component Region Selection displays default US region on ini
                                     US
                                   </Text>
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={16}
                                     name="ArrowDown"
@@ -18065,7 +18065,7 @@ exports[`BuildQuote Component Region Selection displays default US region on ini
                                   numberOfLines={1}
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 64,
                                       "fontWeight": 400,
@@ -18081,7 +18081,7 @@ exports[`BuildQuote Component Region Selection displays default US region on ini
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#686e7d",
+                                      "color": "#66676a",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -18103,7 +18103,7 @@ exports[`BuildQuote Component Region Selection displays default US region on ini
                                   style={
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 100,
                                       "flexDirection": "row",
                                       "gap": 8,
@@ -18237,7 +18237,7 @@ exports[`BuildQuote Component Region Selection displays default US region on ini
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 24,
                                         "letterSpacing": 0,
@@ -18248,7 +18248,7 @@ exports[`BuildQuote Component Region Selection displays default US region on ini
                                     USDC
                                   </Text>
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={16}
                                     name="ArrowDown"
@@ -18268,7 +18268,7 @@ exports[`BuildQuote Component Region Selection displays default US region on ini
                               onPress={[Function]}
                               style={
                                 {
-                                  "backgroundColor": "#3c4d9d0f",
+                                  "backgroundColor": "#b4b4b528",
                                   "borderRadius": 12,
                                   "marginBottom": 16,
                                 }
@@ -18303,7 +18303,7 @@ exports[`BuildQuote Component Region Selection displays default US region on ini
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -18317,7 +18317,7 @@ exports[`BuildQuote Component Region Selection displays default US region on ini
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#686e7d",
+                                          "color": "#66676a",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 14,
                                           "letterSpacing": 0,
@@ -18353,10 +18353,10 @@ exports[`BuildQuote Component Region Selection displays default US region on ini
                                         {
                                           "alignSelf": "flex-start",
                                           "backgroundColor": "#ffffff",
-                                          "borderColor": "#b7bbc8",
+                                          "borderColor": "#949596",
                                           "borderRadius": 999,
                                           "borderWidth": 0,
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "padding": 16,
                                           "paddingHorizontal": 8,
                                           "paddingVertical": 2,
@@ -18376,7 +18376,7 @@ exports[`BuildQuote Component Region Selection displays default US region on ini
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 14,
                                               "letterSpacing": 0,
@@ -18408,7 +18408,7 @@ exports[`BuildQuote Component Region Selection displays default US region on ini
                                     testID="listitemcolumn"
                                   >
                                     <SvgMock
-                                      color="#686e7d"
+                                      color="#66676a"
                                       fill="currentColor"
                                       height={20}
                                       name="ArrowRight"
@@ -18469,7 +18469,7 @@ exports[`BuildQuote Component Region Selection displays default US region on ini
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -18484,7 +18484,7 @@ exports[`BuildQuote Component Region Selection displays default US region on ini
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -18521,7 +18521,7 @@ exports[`BuildQuote Component Region Selection displays default US region on ini
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -18536,7 +18536,7 @@ exports[`BuildQuote Component Region Selection displays default US region on ini
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -18573,7 +18573,7 @@ exports[`BuildQuote Component Region Selection displays default US region on ini
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -18588,7 +18588,7 @@ exports[`BuildQuote Component Region Selection displays default US region on ini
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -18639,7 +18639,7 @@ exports[`BuildQuote Component Region Selection displays default US region on ini
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -18654,7 +18654,7 @@ exports[`BuildQuote Component Region Selection displays default US region on ini
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -18691,7 +18691,7 @@ exports[`BuildQuote Component Region Selection displays default US region on ini
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -18706,7 +18706,7 @@ exports[`BuildQuote Component Region Selection displays default US region on ini
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -18743,7 +18743,7 @@ exports[`BuildQuote Component Region Selection displays default US region on ini
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -18758,7 +18758,7 @@ exports[`BuildQuote Component Region Selection displays default US region on ini
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -18809,7 +18809,7 @@ exports[`BuildQuote Component Region Selection displays default US region on ini
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -18824,7 +18824,7 @@ exports[`BuildQuote Component Region Selection displays default US region on ini
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -18861,7 +18861,7 @@ exports[`BuildQuote Component Region Selection displays default US region on ini
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -18876,7 +18876,7 @@ exports[`BuildQuote Component Region Selection displays default US region on ini
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -18913,7 +18913,7 @@ exports[`BuildQuote Component Region Selection displays default US region on ini
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -18928,7 +18928,7 @@ exports[`BuildQuote Component Region Selection displays default US region on ini
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -18979,7 +18979,7 @@ exports[`BuildQuote Component Region Selection displays default US region on ini
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -18996,7 +18996,7 @@ exports[`BuildQuote Component Region Selection displays default US region on ini
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -19031,7 +19031,7 @@ exports[`BuildQuote Component Region Selection displays default US region on ini
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -19046,7 +19046,7 @@ exports[`BuildQuote Component Region Selection displays default US region on ini
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -19101,7 +19101,7 @@ exports[`BuildQuote Component Region Selection displays default US region on ini
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "height": 32,
                                             "width": 32,
                                           },
@@ -19141,7 +19141,7 @@ exports[`BuildQuote Component Region Selection displays default US region on ini
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
@@ -19300,7 +19300,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -19341,7 +19341,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -19419,7 +19419,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -19680,7 +19680,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                   {
                                     "alignItems": "center",
                                     "alignSelf": "flex-start",
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "borderRadius": 12,
                                     "flexDirection": "row",
                                     "flexShrink": 1,
@@ -19695,7 +19695,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -19711,7 +19711,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                 onPress={[Function]}
                                 style={
                                   {
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "borderRadius": 12,
                                     "paddingHorizontal": 16,
                                     "paddingVertical": 8,
@@ -19731,7 +19731,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -19745,7 +19745,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -19756,7 +19756,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                     US
                                   </Text>
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={16}
                                     name="ArrowDown"
@@ -19788,7 +19788,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                   numberOfLines={1}
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 64,
                                       "fontWeight": 400,
@@ -19804,7 +19804,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#686e7d",
+                                      "color": "#66676a",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -19826,7 +19826,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                   style={
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 100,
                                       "flexDirection": "row",
                                       "gap": 8,
@@ -19960,7 +19960,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 24,
                                         "letterSpacing": 0,
@@ -19971,7 +19971,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                     USDC
                                   </Text>
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={16}
                                     name="ArrowDown"
@@ -19991,7 +19991,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                               onPress={[Function]}
                               style={
                                 {
-                                  "backgroundColor": "#3c4d9d0f",
+                                  "backgroundColor": "#b4b4b528",
                                   "borderRadius": 12,
                                   "marginBottom": 16,
                                 }
@@ -20026,7 +20026,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -20040,7 +20040,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#686e7d",
+                                          "color": "#66676a",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 14,
                                           "letterSpacing": 0,
@@ -20076,10 +20076,10 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                         {
                                           "alignSelf": "flex-start",
                                           "backgroundColor": "#ffffff",
-                                          "borderColor": "#b7bbc8",
+                                          "borderColor": "#949596",
                                           "borderRadius": 999,
                                           "borderWidth": 0,
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "padding": 16,
                                           "paddingHorizontal": 8,
                                           "paddingVertical": 2,
@@ -20099,7 +20099,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 14,
                                               "letterSpacing": 0,
@@ -20131,7 +20131,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                     testID="listitemcolumn"
                                   >
                                     <SvgMock
-                                      color="#686e7d"
+                                      color="#66676a"
                                       fill="currentColor"
                                       height={20}
                                       name="ArrowRight"
@@ -20192,7 +20192,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -20207,7 +20207,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -20244,7 +20244,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -20259,7 +20259,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -20296,7 +20296,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -20311,7 +20311,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -20362,7 +20362,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -20377,7 +20377,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -20414,7 +20414,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -20429,7 +20429,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -20466,7 +20466,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -20481,7 +20481,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -20532,7 +20532,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -20547,7 +20547,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -20584,7 +20584,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -20599,7 +20599,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -20636,7 +20636,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -20651,7 +20651,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -20702,7 +20702,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -20719,7 +20719,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -20754,7 +20754,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -20769,7 +20769,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -20824,7 +20824,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "height": 32,
                                             "width": 32,
                                           },
@@ -20864,7 +20864,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
@@ -21023,7 +21023,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -21064,7 +21064,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -21142,7 +21142,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -21403,7 +21403,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                   {
                                     "alignItems": "center",
                                     "alignSelf": "flex-start",
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "borderRadius": 12,
                                     "flexDirection": "row",
                                     "flexShrink": 1,
@@ -21418,7 +21418,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -21434,7 +21434,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                 onPress={[Function]}
                                 style={
                                   {
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "borderRadius": 12,
                                     "paddingHorizontal": 16,
                                     "paddingVertical": 8,
@@ -21454,7 +21454,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -21468,7 +21468,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -21479,7 +21479,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                     US
                                   </Text>
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={16}
                                     name="ArrowDown"
@@ -21511,7 +21511,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                   numberOfLines={1}
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 64,
                                       "fontWeight": 400,
@@ -21527,7 +21527,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#686e7d",
+                                      "color": "#66676a",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -21549,7 +21549,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                   style={
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 100,
                                       "flexDirection": "row",
                                       "gap": 8,
@@ -21683,7 +21683,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 24,
                                         "letterSpacing": 0,
@@ -21694,7 +21694,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                     USDC
                                   </Text>
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={16}
                                     name="ArrowDown"
@@ -21754,7 +21754,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 14,
                                         "letterSpacing": 0,
@@ -21775,7 +21775,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                     style={
                                       {
                                         "backgroundColor": "transparent",
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -21807,7 +21807,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                               onPress={[Function]}
                               style={
                                 {
-                                  "backgroundColor": "#3c4d9d0f",
+                                  "backgroundColor": "#b4b4b528",
                                   "borderRadius": 12,
                                   "marginBottom": 16,
                                 }
@@ -21842,7 +21842,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -21856,7 +21856,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#686e7d",
+                                          "color": "#66676a",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 14,
                                           "letterSpacing": 0,
@@ -21892,10 +21892,10 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                         {
                                           "alignSelf": "flex-start",
                                           "backgroundColor": "#ffffff",
-                                          "borderColor": "#b7bbc8",
+                                          "borderColor": "#949596",
                                           "borderRadius": 999,
                                           "borderWidth": 0,
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "padding": 16,
                                           "paddingHorizontal": 8,
                                           "paddingVertical": 2,
@@ -21915,7 +21915,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 14,
                                               "letterSpacing": 0,
@@ -21947,7 +21947,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                     testID="listitemcolumn"
                                   >
                                     <SvgMock
-                                      color="#686e7d"
+                                      color="#66676a"
                                       fill="currentColor"
                                       height={20}
                                       name="ArrowRight"
@@ -22008,7 +22008,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -22023,7 +22023,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -22060,7 +22060,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -22075,7 +22075,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -22112,7 +22112,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -22127,7 +22127,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -22178,7 +22178,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -22193,7 +22193,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -22230,7 +22230,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -22245,7 +22245,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -22282,7 +22282,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -22297,7 +22297,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -22348,7 +22348,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -22363,7 +22363,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -22400,7 +22400,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -22415,7 +22415,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -22452,7 +22452,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -22467,7 +22467,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -22518,7 +22518,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -22535,7 +22535,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -22570,7 +22570,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -22585,7 +22585,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -22640,7 +22640,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "height": 32,
                                             "width": 32,
                                           },
@@ -22680,7 +22680,7 @@ exports[`BuildQuote Component Region Selection does not open region modal when r
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
@@ -22839,7 +22839,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -22880,7 +22880,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -22958,7 +22958,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -23219,7 +23219,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                   {
                                     "alignItems": "center",
                                     "alignSelf": "flex-start",
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "borderRadius": 12,
                                     "flexDirection": "row",
                                     "flexShrink": 1,
@@ -23234,7 +23234,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -23250,7 +23250,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                 onPress={[Function]}
                                 style={
                                   {
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "borderRadius": 12,
                                     "paddingHorizontal": 16,
                                     "paddingVertical": 8,
@@ -23270,7 +23270,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -23284,7 +23284,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -23295,7 +23295,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                     US
                                   </Text>
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={16}
                                     name="ArrowDown"
@@ -23327,7 +23327,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                   numberOfLines={1}
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 64,
                                       "fontWeight": 400,
@@ -23343,7 +23343,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#686e7d",
+                                      "color": "#66676a",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -23363,7 +23363,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                   style={
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 100,
                                       "flexDirection": "row",
                                       "gap": 8,
@@ -23497,7 +23497,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 24,
                                         "letterSpacing": 0,
@@ -23508,7 +23508,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                     USDC
                                   </Text>
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={16}
                                     name="ArrowDown"
@@ -23528,7 +23528,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                               onPress={[Function]}
                               style={
                                 {
-                                  "backgroundColor": "#3c4d9d0f",
+                                  "backgroundColor": "#b4b4b528",
                                   "borderRadius": 12,
                                   "marginBottom": 16,
                                 }
@@ -23563,7 +23563,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -23577,7 +23577,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#686e7d",
+                                          "color": "#66676a",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 14,
                                           "letterSpacing": 0,
@@ -23613,10 +23613,10 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                         {
                                           "alignSelf": "flex-start",
                                           "backgroundColor": "#ffffff",
-                                          "borderColor": "#b7bbc8",
+                                          "borderColor": "#949596",
                                           "borderRadius": 999,
                                           "borderWidth": 0,
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "padding": 16,
                                           "paddingHorizontal": 8,
                                           "paddingVertical": 2,
@@ -23636,7 +23636,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 14,
                                               "letterSpacing": 0,
@@ -23668,7 +23668,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                     testID="listitemcolumn"
                                   >
                                     <SvgMock
-                                      color="#686e7d"
+                                      color="#66676a"
                                       fill="currentColor"
                                       height={20}
                                       name="ArrowRight"
@@ -23729,7 +23729,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -23744,7 +23744,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -23781,7 +23781,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -23796,7 +23796,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -23833,7 +23833,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -23848,7 +23848,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -23899,7 +23899,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -23914,7 +23914,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -23951,7 +23951,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -23966,7 +23966,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -24003,7 +24003,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -24018,7 +24018,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -24069,7 +24069,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -24084,7 +24084,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -24121,7 +24121,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -24136,7 +24136,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -24173,7 +24173,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -24188,7 +24188,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -24239,7 +24239,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -24256,7 +24256,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -24291,7 +24291,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -24306,7 +24306,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -24361,7 +24361,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "height": 32,
                                             "width": 32,
                                           },
@@ -24401,7 +24401,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
@@ -24560,7 +24560,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -24601,7 +24601,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -24679,7 +24679,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -24940,7 +24940,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                   {
                                     "alignItems": "center",
                                     "alignSelf": "flex-start",
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "borderRadius": 12,
                                     "flexDirection": "row",
                                     "flexShrink": 1,
@@ -24955,7 +24955,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -24971,7 +24971,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                 onPress={[Function]}
                                 style={
                                   {
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "borderRadius": 12,
                                     "paddingHorizontal": 16,
                                     "paddingVertical": 8,
@@ -24991,7 +24991,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -25005,7 +25005,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -25016,7 +25016,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                     US
                                   </Text>
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={16}
                                     name="ArrowDown"
@@ -25048,7 +25048,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                   numberOfLines={1}
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 64,
                                       "fontWeight": 400,
@@ -25064,7 +25064,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#686e7d",
+                                      "color": "#66676a",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -25084,7 +25084,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                   style={
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 100,
                                       "flexDirection": "row",
                                       "gap": 8,
@@ -25218,7 +25218,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 24,
                                         "letterSpacing": 0,
@@ -25229,7 +25229,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                     USDC
                                   </Text>
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={16}
                                     name="ArrowDown"
@@ -25289,7 +25289,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 14,
                                         "letterSpacing": 0,
@@ -25310,7 +25310,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                     style={
                                       {
                                         "backgroundColor": "transparent",
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -25342,7 +25342,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                               onPress={[Function]}
                               style={
                                 {
-                                  "backgroundColor": "#3c4d9d0f",
+                                  "backgroundColor": "#b4b4b528",
                                   "borderRadius": 12,
                                   "marginBottom": 16,
                                 }
@@ -25377,7 +25377,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -25391,7 +25391,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#686e7d",
+                                          "color": "#66676a",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 14,
                                           "letterSpacing": 0,
@@ -25427,10 +25427,10 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                         {
                                           "alignSelf": "flex-start",
                                           "backgroundColor": "#ffffff",
-                                          "borderColor": "#b7bbc8",
+                                          "borderColor": "#949596",
                                           "borderRadius": 999,
                                           "borderWidth": 0,
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "padding": 16,
                                           "paddingHorizontal": 8,
                                           "paddingVertical": 2,
@@ -25450,7 +25450,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 14,
                                               "letterSpacing": 0,
@@ -25482,7 +25482,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                     testID="listitemcolumn"
                                   >
                                     <SvgMock
-                                      color="#686e7d"
+                                      color="#66676a"
                                       fill="currentColor"
                                       height={20}
                                       name="ArrowRight"
@@ -25543,7 +25543,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -25558,7 +25558,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -25595,7 +25595,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -25610,7 +25610,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -25647,7 +25647,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -25662,7 +25662,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -25713,7 +25713,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -25728,7 +25728,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -25765,7 +25765,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -25780,7 +25780,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -25817,7 +25817,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -25832,7 +25832,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -25883,7 +25883,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -25898,7 +25898,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -25935,7 +25935,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -25950,7 +25950,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -25987,7 +25987,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -26002,7 +26002,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -26053,7 +26053,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -26070,7 +26070,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -26105,7 +26105,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -26120,7 +26120,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -26175,7 +26175,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "height": 32,
                                             "width": 32,
                                           },
@@ -26215,7 +26215,7 @@ exports[`BuildQuote Component Token Selection does not open token modal when cry
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
@@ -26374,7 +26374,7 @@ exports[`BuildQuote Component User Details Error displays user details error ale
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -26415,7 +26415,7 @@ exports[`BuildQuote Component User Details Error displays user details error ale
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -26493,7 +26493,7 @@ exports[`BuildQuote Component User Details Error displays user details error ale
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -26754,7 +26754,7 @@ exports[`BuildQuote Component User Details Error displays user details error ale
                                   {
                                     "alignItems": "center",
                                     "alignSelf": "flex-start",
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "borderRadius": 12,
                                     "flexDirection": "row",
                                     "flexShrink": 1,
@@ -26769,7 +26769,7 @@ exports[`BuildQuote Component User Details Error displays user details error ale
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -26785,7 +26785,7 @@ exports[`BuildQuote Component User Details Error displays user details error ale
                                 onPress={[Function]}
                                 style={
                                   {
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "borderRadius": 12,
                                     "paddingHorizontal": 16,
                                     "paddingVertical": 8,
@@ -26805,7 +26805,7 @@ exports[`BuildQuote Component User Details Error displays user details error ale
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -26819,7 +26819,7 @@ exports[`BuildQuote Component User Details Error displays user details error ale
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -26830,7 +26830,7 @@ exports[`BuildQuote Component User Details Error displays user details error ale
                                     US
                                   </Text>
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={16}
                                     name="ArrowDown"
@@ -26862,7 +26862,7 @@ exports[`BuildQuote Component User Details Error displays user details error ale
                                   numberOfLines={1}
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 64,
                                       "fontWeight": 400,
@@ -26878,7 +26878,7 @@ exports[`BuildQuote Component User Details Error displays user details error ale
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#686e7d",
+                                      "color": "#66676a",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -26900,7 +26900,7 @@ exports[`BuildQuote Component User Details Error displays user details error ale
                                   style={
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 100,
                                       "flexDirection": "row",
                                       "gap": 8,
@@ -27034,7 +27034,7 @@ exports[`BuildQuote Component User Details Error displays user details error ale
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 24,
                                         "letterSpacing": 0,
@@ -27045,7 +27045,7 @@ exports[`BuildQuote Component User Details Error displays user details error ale
                                     USDC
                                   </Text>
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={16}
                                     name="ArrowDown"
@@ -27105,7 +27105,7 @@ exports[`BuildQuote Component User Details Error displays user details error ale
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 14,
                                         "letterSpacing": 0,
@@ -27126,7 +27126,7 @@ exports[`BuildQuote Component User Details Error displays user details error ale
                                     style={
                                       {
                                         "backgroundColor": "transparent",
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -27158,7 +27158,7 @@ exports[`BuildQuote Component User Details Error displays user details error ale
                               onPress={[Function]}
                               style={
                                 {
-                                  "backgroundColor": "#3c4d9d0f",
+                                  "backgroundColor": "#b4b4b528",
                                   "borderRadius": 12,
                                   "marginBottom": 16,
                                 }
@@ -27193,7 +27193,7 @@ exports[`BuildQuote Component User Details Error displays user details error ale
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -27207,7 +27207,7 @@ exports[`BuildQuote Component User Details Error displays user details error ale
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#686e7d",
+                                          "color": "#66676a",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 14,
                                           "letterSpacing": 0,
@@ -27243,10 +27243,10 @@ exports[`BuildQuote Component User Details Error displays user details error ale
                                         {
                                           "alignSelf": "flex-start",
                                           "backgroundColor": "#ffffff",
-                                          "borderColor": "#b7bbc8",
+                                          "borderColor": "#949596",
                                           "borderRadius": 999,
                                           "borderWidth": 0,
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "padding": 16,
                                           "paddingHorizontal": 8,
                                           "paddingVertical": 2,
@@ -27266,7 +27266,7 @@ exports[`BuildQuote Component User Details Error displays user details error ale
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 14,
                                               "letterSpacing": 0,
@@ -27298,7 +27298,7 @@ exports[`BuildQuote Component User Details Error displays user details error ale
                                     testID="listitemcolumn"
                                   >
                                     <SvgMock
-                                      color="#686e7d"
+                                      color="#66676a"
                                       fill="currentColor"
                                       height={20}
                                       name="ArrowRight"
@@ -27359,7 +27359,7 @@ exports[`BuildQuote Component User Details Error displays user details error ale
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -27374,7 +27374,7 @@ exports[`BuildQuote Component User Details Error displays user details error ale
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -27411,7 +27411,7 @@ exports[`BuildQuote Component User Details Error displays user details error ale
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -27426,7 +27426,7 @@ exports[`BuildQuote Component User Details Error displays user details error ale
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -27463,7 +27463,7 @@ exports[`BuildQuote Component User Details Error displays user details error ale
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -27478,7 +27478,7 @@ exports[`BuildQuote Component User Details Error displays user details error ale
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -27529,7 +27529,7 @@ exports[`BuildQuote Component User Details Error displays user details error ale
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -27544,7 +27544,7 @@ exports[`BuildQuote Component User Details Error displays user details error ale
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -27581,7 +27581,7 @@ exports[`BuildQuote Component User Details Error displays user details error ale
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -27596,7 +27596,7 @@ exports[`BuildQuote Component User Details Error displays user details error ale
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -27633,7 +27633,7 @@ exports[`BuildQuote Component User Details Error displays user details error ale
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -27648,7 +27648,7 @@ exports[`BuildQuote Component User Details Error displays user details error ale
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -27699,7 +27699,7 @@ exports[`BuildQuote Component User Details Error displays user details error ale
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -27714,7 +27714,7 @@ exports[`BuildQuote Component User Details Error displays user details error ale
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -27751,7 +27751,7 @@ exports[`BuildQuote Component User Details Error displays user details error ale
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -27766,7 +27766,7 @@ exports[`BuildQuote Component User Details Error displays user details error ale
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -27803,7 +27803,7 @@ exports[`BuildQuote Component User Details Error displays user details error ale
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -27818,7 +27818,7 @@ exports[`BuildQuote Component User Details Error displays user details error ale
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -27869,7 +27869,7 @@ exports[`BuildQuote Component User Details Error displays user details error ale
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -27886,7 +27886,7 @@ exports[`BuildQuote Component User Details Error displays user details error ale
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -27921,7 +27921,7 @@ exports[`BuildQuote Component User Details Error displays user details error ale
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -27936,7 +27936,7 @@ exports[`BuildQuote Component User Details Error displays user details error ale
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -27991,7 +27991,7 @@ exports[`BuildQuote Component User Details Error displays user details error ale
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "height": 32,
                                             "width": 32,
                                           },
@@ -28031,7 +28031,7 @@ exports[`BuildQuote Component User Details Error displays user details error ale
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
@@ -28190,7 +28190,7 @@ exports[`BuildQuote Component render matches snapshot 1`] = `
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -28231,7 +28231,7 @@ exports[`BuildQuote Component render matches snapshot 1`] = `
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -28309,7 +28309,7 @@ exports[`BuildQuote Component render matches snapshot 1`] = `
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -28570,7 +28570,7 @@ exports[`BuildQuote Component render matches snapshot 1`] = `
                                   {
                                     "alignItems": "center",
                                     "alignSelf": "flex-start",
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "borderRadius": 12,
                                     "flexDirection": "row",
                                     "flexShrink": 1,
@@ -28585,7 +28585,7 @@ exports[`BuildQuote Component render matches snapshot 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -28601,7 +28601,7 @@ exports[`BuildQuote Component render matches snapshot 1`] = `
                                 onPress={[Function]}
                                 style={
                                   {
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "borderRadius": 12,
                                     "paddingHorizontal": 16,
                                     "paddingVertical": 8,
@@ -28621,7 +28621,7 @@ exports[`BuildQuote Component render matches snapshot 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -28635,7 +28635,7 @@ exports[`BuildQuote Component render matches snapshot 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -28646,7 +28646,7 @@ exports[`BuildQuote Component render matches snapshot 1`] = `
                                     US
                                   </Text>
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={16}
                                     name="ArrowDown"
@@ -28678,7 +28678,7 @@ exports[`BuildQuote Component render matches snapshot 1`] = `
                                   numberOfLines={1}
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 64,
                                       "fontWeight": 400,
@@ -28694,7 +28694,7 @@ exports[`BuildQuote Component render matches snapshot 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#686e7d",
+                                      "color": "#66676a",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -28716,7 +28716,7 @@ exports[`BuildQuote Component render matches snapshot 1`] = `
                                   style={
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderRadius": 100,
                                       "flexDirection": "row",
                                       "gap": 8,
@@ -28850,7 +28850,7 @@ exports[`BuildQuote Component render matches snapshot 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 24,
                                         "letterSpacing": 0,
@@ -28861,7 +28861,7 @@ exports[`BuildQuote Component render matches snapshot 1`] = `
                                     USDC
                                   </Text>
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={16}
                                     name="ArrowDown"
@@ -28881,7 +28881,7 @@ exports[`BuildQuote Component render matches snapshot 1`] = `
                               onPress={[Function]}
                               style={
                                 {
-                                  "backgroundColor": "#3c4d9d0f",
+                                  "backgroundColor": "#b4b4b528",
                                   "borderRadius": 12,
                                   "marginBottom": 16,
                                 }
@@ -28916,7 +28916,7 @@ exports[`BuildQuote Component render matches snapshot 1`] = `
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -28930,7 +28930,7 @@ exports[`BuildQuote Component render matches snapshot 1`] = `
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#686e7d",
+                                          "color": "#66676a",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 14,
                                           "letterSpacing": 0,
@@ -28966,10 +28966,10 @@ exports[`BuildQuote Component render matches snapshot 1`] = `
                                         {
                                           "alignSelf": "flex-start",
                                           "backgroundColor": "#ffffff",
-                                          "borderColor": "#b7bbc8",
+                                          "borderColor": "#949596",
                                           "borderRadius": 999,
                                           "borderWidth": 0,
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "padding": 16,
                                           "paddingHorizontal": 8,
                                           "paddingVertical": 2,
@@ -28989,7 +28989,7 @@ exports[`BuildQuote Component render matches snapshot 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 14,
                                               "letterSpacing": 0,
@@ -29021,7 +29021,7 @@ exports[`BuildQuote Component render matches snapshot 1`] = `
                                     testID="listitemcolumn"
                                   >
                                     <SvgMock
-                                      color="#686e7d"
+                                      color="#66676a"
                                       fill="currentColor"
                                       height={20}
                                       name="ArrowRight"
@@ -29082,7 +29082,7 @@ exports[`BuildQuote Component render matches snapshot 1`] = `
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -29097,7 +29097,7 @@ exports[`BuildQuote Component render matches snapshot 1`] = `
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -29134,7 +29134,7 @@ exports[`BuildQuote Component render matches snapshot 1`] = `
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -29149,7 +29149,7 @@ exports[`BuildQuote Component render matches snapshot 1`] = `
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -29186,7 +29186,7 @@ exports[`BuildQuote Component render matches snapshot 1`] = `
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -29201,7 +29201,7 @@ exports[`BuildQuote Component render matches snapshot 1`] = `
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -29252,7 +29252,7 @@ exports[`BuildQuote Component render matches snapshot 1`] = `
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -29267,7 +29267,7 @@ exports[`BuildQuote Component render matches snapshot 1`] = `
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -29304,7 +29304,7 @@ exports[`BuildQuote Component render matches snapshot 1`] = `
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -29319,7 +29319,7 @@ exports[`BuildQuote Component render matches snapshot 1`] = `
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -29356,7 +29356,7 @@ exports[`BuildQuote Component render matches snapshot 1`] = `
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -29371,7 +29371,7 @@ exports[`BuildQuote Component render matches snapshot 1`] = `
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -29422,7 +29422,7 @@ exports[`BuildQuote Component render matches snapshot 1`] = `
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -29437,7 +29437,7 @@ exports[`BuildQuote Component render matches snapshot 1`] = `
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -29474,7 +29474,7 @@ exports[`BuildQuote Component render matches snapshot 1`] = `
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -29489,7 +29489,7 @@ exports[`BuildQuote Component render matches snapshot 1`] = `
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -29526,7 +29526,7 @@ exports[`BuildQuote Component render matches snapshot 1`] = `
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -29541,7 +29541,7 @@ exports[`BuildQuote Component render matches snapshot 1`] = `
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -29592,7 +29592,7 @@ exports[`BuildQuote Component render matches snapshot 1`] = `
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -29609,7 +29609,7 @@ exports[`BuildQuote Component render matches snapshot 1`] = `
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -29644,7 +29644,7 @@ exports[`BuildQuote Component render matches snapshot 1`] = `
                                       [
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
+                                          "backgroundColor": "#b4b4b528",
                                           "borderRadius": 12,
                                           "height": 48,
                                           "justifyContent": "center",
@@ -29659,7 +29659,7 @@ exports[`BuildQuote Component render matches snapshot 1`] = `
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 32,
                                             "fontWeight": "500",
@@ -29714,7 +29714,7 @@ exports[`BuildQuote Component render matches snapshot 1`] = `
                                       style={
                                         [
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "height": 32,
                                             "width": 32,
                                           },
@@ -29754,7 +29754,7 @@ exports[`BuildQuote Component render matches snapshot 1`] = `
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
diff --git a/app/components/UI/Ramp/Deposit/Views/DepositOrderDetails/DepositOrderDetails.tsx b/app/components/UI/Ramp/Deposit/Views/DepositOrderDetails/DepositOrderDetails.tsx
index 7a76c6448d0e..f5b0164f2b84 100644
--- a/app/components/UI/Ramp/Deposit/Views/DepositOrderDetails/DepositOrderDetails.tsx
+++ b/app/components/UI/Ramp/Deposit/Views/DepositOrderDetails/DepositOrderDetails.tsx
@@ -88,7 +88,7 @@ const DepositOrderDetails = () => {
         Logger.error(fetchError as Error, {
           message:
             'FiatOrders::DepositOrderDetails error while processing order',
-          order,
+          orderId: order.id,
         });
         setError(
           fetchError instanceof Error && fetchError.message
diff --git a/app/components/UI/Ramp/Deposit/Views/DepositOrderDetails/__snapshots__/DepositOrderDetails.test.tsx.snap b/app/components/UI/Ramp/Deposit/Views/DepositOrderDetails/__snapshots__/DepositOrderDetails.test.tsx.snap
index b1f5f1bef334..88c5d4b958c4 100644
--- a/app/components/UI/Ramp/Deposit/Views/DepositOrderDetails/__snapshots__/DepositOrderDetails.test.tsx.snap
+++ b/app/components/UI/Ramp/Deposit/Views/DepositOrderDetails/__snapshots__/DepositOrderDetails.test.tsx.snap
@@ -112,7 +112,7 @@ exports[`DepositOrderDetails Component renders an error screen if a CREATED orde
                 {
                   "color": "#ca3542",
                   "fontFamily": "Geist-Bold",
-                  "fontSize": 18,
+                  "fontSize": 20,
                   "letterSpacing": 0,
                   "lineHeight": 24,
                   "textAlign": "center",
@@ -125,7 +125,7 @@ exports[`DepositOrderDetails Component renders an error screen if a CREATED orde
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -147,7 +147,7 @@ exports[`DepositOrderDetails Component renders an error screen if a CREATED orde
                 {
                   "alignItems": "center",
                   "alignSelf": "center",
-                  "backgroundColor": "#121314",
+                  "backgroundColor": "#131416",
                   "borderRadius": 12,
                   "flexDirection": "row",
                   "height": 48,
@@ -222,7 +222,7 @@ exports[`DepositOrderDetails Component renders error state correctly 1`] = `
           }
           onRefresh={[Function]}
           refreshing={false}
-          tintColor="#121314"
+          tintColor="#131416"
         />
       }
     >
@@ -420,7 +420,7 @@ exports[`DepositOrderDetails Component renders error state correctly 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Bold",
                     "fontSize": 40,
                     "letterSpacing": 0,
@@ -439,7 +439,7 @@ exports[`DepositOrderDetails Component renders error state correctly 1`] = `
               style={
                 {
                   "backgroundColor": "#ffffff",
-                  "borderColor": "#b7bbc866",
+                  "borderColor": "#b4b4b566",
                   "borderRadius": 8,
                   "borderWidth": 1,
                   "marginBottom": 16,
@@ -462,7 +462,7 @@ exports[`DepositOrderDetails Component renders error state correctly 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#686e7d",
+                      "color": "#66676a",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -476,7 +476,7 @@ exports[`DepositOrderDetails Component renders error state correctly 1`] = `
                   style={
                     {
                       "alignItems": "center",
-                      "backgroundColor": "#3c4d9d0f",
+                      "backgroundColor": "#b4b4b528",
                       "borderRadius": 36,
                       "flexDirection": "row",
                       "gap": 4,
@@ -489,7 +489,7 @@ exports[`DepositOrderDetails Component renders error state correctly 1`] = `
                     accessibilityRole="text"
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -513,7 +513,7 @@ exports[`DepositOrderDetails Component renders error state correctly 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#686e7d",
+                      "color": "#66676a",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -548,7 +548,7 @@ exports[`DepositOrderDetails Component renders error state correctly 1`] = `
                     accessibilityRole="text"
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -574,7 +574,7 @@ exports[`DepositOrderDetails Component renders error state correctly 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#686e7d",
+                      "color": "#66676a",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -598,7 +598,7 @@ exports[`DepositOrderDetails Component renders error state correctly 1`] = `
                     accessibilityRole="text"
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -610,7 +610,7 @@ exports[`DepositOrderDetails Component renders error state correctly 1`] = `
                     ak_123
                   </Text>
                   <SvgMock
-                    color="#121314"
+                    color="#131416"
                     fill="currentColor"
                     height={24}
                     name="Copy"
@@ -627,7 +627,7 @@ exports[`DepositOrderDetails Component renders error state correctly 1`] = `
               <View
                 style={
                   {
-                    "backgroundColor": "#b7bbc866",
+                    "backgroundColor": "#b4b4b566",
                     "height": 1,
                     "marginHorizontal": -16,
                     "marginVertical": 8,
@@ -648,7 +648,7 @@ exports[`DepositOrderDetails Component renders error state correctly 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#686e7d",
+                      "color": "#66676a",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -662,7 +662,7 @@ exports[`DepositOrderDetails Component renders error state correctly 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -687,7 +687,7 @@ exports[`DepositOrderDetails Component renders error state correctly 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#686e7d",
+                      "color": "#66676a",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -701,7 +701,7 @@ exports[`DepositOrderDetails Component renders error state correctly 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -849,7 +849,7 @@ exports[`DepositOrderDetails Component renders processing state correctly 1`] =
           }
           onRefresh={[Function]}
           refreshing={false}
-          tintColor="#121314"
+          tintColor="#131416"
         />
       }
     >
@@ -1051,7 +1051,7 @@ exports[`DepositOrderDetails Component renders processing state correctly 1`] =
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Bold",
                     "fontSize": 40,
                     "letterSpacing": 0,
@@ -1070,7 +1070,7 @@ exports[`DepositOrderDetails Component renders processing state correctly 1`] =
               style={
                 {
                   "backgroundColor": "#ffffff",
-                  "borderColor": "#b7bbc866",
+                  "borderColor": "#b4b4b566",
                   "borderRadius": 8,
                   "borderWidth": 1,
                   "marginBottom": 16,
@@ -1093,7 +1093,7 @@ exports[`DepositOrderDetails Component renders processing state correctly 1`] =
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#686e7d",
+                      "color": "#66676a",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -1107,7 +1107,7 @@ exports[`DepositOrderDetails Component renders processing state correctly 1`] =
                   style={
                     {
                       "alignItems": "center",
-                      "backgroundColor": "#3c4d9d0f",
+                      "backgroundColor": "#b4b4b528",
                       "borderRadius": 36,
                       "flexDirection": "row",
                       "gap": 4,
@@ -1120,7 +1120,7 @@ exports[`DepositOrderDetails Component renders processing state correctly 1`] =
                     accessibilityRole="text"
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -1144,7 +1144,7 @@ exports[`DepositOrderDetails Component renders processing state correctly 1`] =
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#686e7d",
+                      "color": "#66676a",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -1179,7 +1179,7 @@ exports[`DepositOrderDetails Component renders processing state correctly 1`] =
                     accessibilityRole="text"
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -1205,7 +1205,7 @@ exports[`DepositOrderDetails Component renders processing state correctly 1`] =
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#686e7d",
+                      "color": "#66676a",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -1229,7 +1229,7 @@ exports[`DepositOrderDetails Component renders processing state correctly 1`] =
                     accessibilityRole="text"
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -1241,7 +1241,7 @@ exports[`DepositOrderDetails Component renders processing state correctly 1`] =
                     ak_123
                   </Text>
                   <SvgMock
-                    color="#121314"
+                    color="#131416"
                     fill="currentColor"
                     height={24}
                     name="Copy"
@@ -1258,7 +1258,7 @@ exports[`DepositOrderDetails Component renders processing state correctly 1`] =
               <View
                 style={
                   {
-                    "backgroundColor": "#b7bbc866",
+                    "backgroundColor": "#b4b4b566",
                     "height": 1,
                     "marginHorizontal": -16,
                     "marginVertical": 8,
@@ -1279,7 +1279,7 @@ exports[`DepositOrderDetails Component renders processing state correctly 1`] =
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#686e7d",
+                      "color": "#66676a",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -1293,7 +1293,7 @@ exports[`DepositOrderDetails Component renders processing state correctly 1`] =
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -1318,7 +1318,7 @@ exports[`DepositOrderDetails Component renders processing state correctly 1`] =
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#686e7d",
+                      "color": "#66676a",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -1332,7 +1332,7 @@ exports[`DepositOrderDetails Component renders processing state correctly 1`] =
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -1394,7 +1394,7 @@ exports[`DepositOrderDetails Component renders success state correctly 1`] = `
           }
           onRefresh={[Function]}
           refreshing={false}
-          tintColor="#121314"
+          tintColor="#131416"
         />
       }
     >
@@ -1592,7 +1592,7 @@ exports[`DepositOrderDetails Component renders success state correctly 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Bold",
                     "fontSize": 40,
                     "letterSpacing": 0,
@@ -1611,7 +1611,7 @@ exports[`DepositOrderDetails Component renders success state correctly 1`] = `
               style={
                 {
                   "backgroundColor": "#ffffff",
-                  "borderColor": "#b7bbc866",
+                  "borderColor": "#b4b4b566",
                   "borderRadius": 8,
                   "borderWidth": 1,
                   "marginBottom": 16,
@@ -1634,7 +1634,7 @@ exports[`DepositOrderDetails Component renders success state correctly 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#686e7d",
+                      "color": "#66676a",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -1648,7 +1648,7 @@ exports[`DepositOrderDetails Component renders success state correctly 1`] = `
                   style={
                     {
                       "alignItems": "center",
-                      "backgroundColor": "#3c4d9d0f",
+                      "backgroundColor": "#b4b4b528",
                       "borderRadius": 36,
                       "flexDirection": "row",
                       "gap": 4,
@@ -1661,7 +1661,7 @@ exports[`DepositOrderDetails Component renders success state correctly 1`] = `
                     accessibilityRole="text"
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -1685,7 +1685,7 @@ exports[`DepositOrderDetails Component renders success state correctly 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#686e7d",
+                      "color": "#66676a",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -1720,7 +1720,7 @@ exports[`DepositOrderDetails Component renders success state correctly 1`] = `
                     accessibilityRole="text"
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -1746,7 +1746,7 @@ exports[`DepositOrderDetails Component renders success state correctly 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#686e7d",
+                      "color": "#66676a",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -1770,7 +1770,7 @@ exports[`DepositOrderDetails Component renders success state correctly 1`] = `
                     accessibilityRole="text"
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -1782,7 +1782,7 @@ exports[`DepositOrderDetails Component renders success state correctly 1`] = `
                     ak_123
                   </Text>
                   <SvgMock
-                    color="#121314"
+                    color="#131416"
                     fill="currentColor"
                     height={24}
                     name="Copy"
@@ -1799,7 +1799,7 @@ exports[`DepositOrderDetails Component renders success state correctly 1`] = `
               <View
                 style={
                   {
-                    "backgroundColor": "#b7bbc866",
+                    "backgroundColor": "#b4b4b566",
                     "height": 1,
                     "marginHorizontal": -16,
                     "marginVertical": 8,
@@ -1820,7 +1820,7 @@ exports[`DepositOrderDetails Component renders success state correctly 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#686e7d",
+                      "color": "#66676a",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -1834,7 +1834,7 @@ exports[`DepositOrderDetails Component renders success state correctly 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -1859,7 +1859,7 @@ exports[`DepositOrderDetails Component renders success state correctly 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#686e7d",
+                      "color": "#66676a",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -1873,7 +1873,7 @@ exports[`DepositOrderDetails Component renders success state correctly 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
diff --git a/app/components/UI/Ramp/Deposit/Views/EnterAddress/__snapshots__/EnterAddress.test.tsx.snap b/app/components/UI/Ramp/Deposit/Views/EnterAddress/__snapshots__/EnterAddress.test.tsx.snap
index e74a5fcf9115..3f0f36881046 100644
--- a/app/components/UI/Ramp/Deposit/Views/EnterAddress/__snapshots__/EnterAddress.test.tsx.snap
+++ b/app/components/UI/Ramp/Deposit/Views/EnterAddress/__snapshots__/EnterAddress.test.tsx.snap
@@ -117,7 +117,7 @@ exports[`EnterAddress Component displays form validation errors when continue is
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -158,7 +158,7 @@ exports[`EnterAddress Component displays form validation errors when continue is
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -547,7 +547,7 @@ exports[`EnterAddress Component displays form validation errors when continue is
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 24,
                                         "letterSpacing": 0,
@@ -561,7 +561,7 @@ exports[`EnterAddress Component displays form validation errors when continue is
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -587,7 +587,7 @@ exports[`EnterAddress Component displays form validation errors when continue is
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -632,8 +632,8 @@ exports[`EnterAddress Component displays form validation errors when continue is
                                     style={
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
-                                        "borderColor": "#b7bbc866",
+                                        "backgroundColor": "#b4b4b528",
+                                        "borderColor": "#b4b4b566",
                                         "borderRadius": 12,
                                         "borderWidth": 1,
                                         "flexDirection": "row",
@@ -664,19 +664,20 @@ exports[`EnterAddress Component displays form validation errors when continue is
                                         onFocus={[Function]}
                                         onSubmitEditing={[Function]}
                                         placeholder="Address line 1"
-                                        placeholderTextColor="#686e7d"
+                                        placeholderTextColor="#66676a"
                                         returnKeyType="next"
                                         style={
                                           {
                                             "backgroundColor": "inherit",
                                             "borderColor": "transparent",
                                             "borderWidth": 1,
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 16,
                                             "fontWeight": "400",
                                             "height": 46,
                                             "letterSpacing": 0,
+                                            "lineHeight": 0,
                                             "opacity": 1,
                                           }
                                         }
@@ -717,7 +718,7 @@ exports[`EnterAddress Component displays form validation errors when continue is
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -762,8 +763,8 @@ exports[`EnterAddress Component displays form validation errors when continue is
                                     style={
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
-                                        "borderColor": "#b7bbc866",
+                                        "backgroundColor": "#b4b4b528",
+                                        "borderColor": "#b4b4b566",
                                         "borderRadius": 12,
                                         "borderWidth": 1,
                                         "flexDirection": "row",
@@ -794,19 +795,20 @@ exports[`EnterAddress Component displays form validation errors when continue is
                                         onFocus={[Function]}
                                         onSubmitEditing={[Function]}
                                         placeholder="Address line 2 (optional)"
-                                        placeholderTextColor="#686e7d"
+                                        placeholderTextColor="#66676a"
                                         returnKeyType="next"
                                         style={
                                           {
                                             "backgroundColor": "inherit",
                                             "borderColor": "transparent",
                                             "borderWidth": 1,
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 16,
                                             "fontWeight": "400",
                                             "height": 46,
                                             "letterSpacing": 0,
+                                            "lineHeight": 0,
                                             "opacity": 1,
                                           }
                                         }
@@ -843,7 +845,7 @@ exports[`EnterAddress Component displays form validation errors when continue is
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -888,8 +890,8 @@ exports[`EnterAddress Component displays form validation errors when continue is
                                       style={
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
-                                          "borderColor": "#b7bbc866",
+                                          "backgroundColor": "#b4b4b528",
+                                          "borderColor": "#b4b4b566",
                                           "borderRadius": 12,
                                           "borderWidth": 1,
                                           "flexDirection": "row",
@@ -919,19 +921,20 @@ exports[`EnterAddress Component displays form validation errors when continue is
                                           onFocus={[Function]}
                                           onSubmitEditing={[Function]}
                                           placeholder="City"
-                                          placeholderTextColor="#686e7d"
+                                          placeholderTextColor="#66676a"
                                           returnKeyType="next"
                                           style={
                                             {
                                               "backgroundColor": "inherit",
                                               "borderColor": "transparent",
                                               "borderWidth": 1,
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "fontWeight": "400",
                                               "height": 46,
                                               "letterSpacing": 0,
+                                              "lineHeight": 0,
                                               "opacity": 1,
                                             }
                                           }
@@ -974,7 +977,7 @@ exports[`EnterAddress Component displays form validation errors when continue is
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -1000,7 +1003,7 @@ exports[`EnterAddress Component displays form validation errors when continue is
                                           {
                                             "alignItems": "center",
                                             "backgroundColor": "#ffffff",
-                                            "borderColor": "#b7bbc8",
+                                            "borderColor": "#949596",
                                             "borderRadius": 8,
                                             "borderWidth": 1,
                                             "flexDirection": "row",
@@ -1018,15 +1021,15 @@ exports[`EnterAddress Component displays form validation errors when continue is
                                           style={
                                             {
                                               "0": {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "flex": 1,
                                                 "fontSize": 16,
                                               },
                                               "1": {
-                                                "color": "#b7bbc8",
+                                                "color": "#babbbe",
                                                 "fontSize": 16,
                                               },
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -1037,7 +1040,7 @@ exports[`EnterAddress Component displays form validation errors when continue is
                                           Select state
                                         </Text>
                                         <SvgMock
-                                          color="#686e7d"
+                                          color="#66676a"
                                           fill="currentColor"
                                           height={16}
                                           name="ArrowDown"
@@ -1095,7 +1098,7 @@ exports[`EnterAddress Component displays form validation errors when continue is
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -1140,8 +1143,8 @@ exports[`EnterAddress Component displays form validation errors when continue is
                                       style={
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
-                                          "borderColor": "#b7bbc866",
+                                          "backgroundColor": "#b4b4b528",
+                                          "borderColor": "#b4b4b566",
                                           "borderRadius": 12,
                                           "borderWidth": 1,
                                           "flexDirection": "row",
@@ -1172,19 +1175,20 @@ exports[`EnterAddress Component displays form validation errors when continue is
                                           onFocus={[Function]}
                                           onSubmitEditing={[Function]}
                                           placeholder="Postal code"
-                                          placeholderTextColor="#686e7d"
+                                          placeholderTextColor="#66676a"
                                           returnKeyType="done"
                                           style={
                                             {
                                               "backgroundColor": "inherit",
                                               "borderColor": "transparent",
                                               "borderWidth": 1,
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "fontWeight": "400",
                                               "height": 46,
                                               "letterSpacing": 0,
+                                              "lineHeight": 0,
                                               "opacity": 1,
                                             }
                                           }
@@ -1227,7 +1231,7 @@ exports[`EnterAddress Component displays form validation errors when continue is
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -1272,8 +1276,8 @@ exports[`EnterAddress Component displays form validation errors when continue is
                                       style={
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
-                                          "borderColor": "#b7bbc866",
+                                          "backgroundColor": "#b4b4b528",
+                                          "borderColor": "#b4b4b566",
                                           "borderRadius": 12,
                                           "borderWidth": 1,
                                           "flexDirection": "row",
@@ -1296,7 +1300,7 @@ exports[`EnterAddress Component displays form validation errors when continue is
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -1323,14 +1327,14 @@ exports[`EnterAddress Component displays form validation errors when continue is
                                           onBlur={[Function]}
                                           onFocus={[Function]}
                                           placeholder="Country"
-                                          placeholderTextColor="#686e7d"
+                                          placeholderTextColor="#66676a"
                                           returnKeyType="done"
                                           style={
                                             {
                                               "backgroundColor": "inherit",
                                               "borderColor": "transparent",
                                               "borderWidth": 1,
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "fontWeight": "400",
@@ -1369,7 +1373,7 @@ exports[`EnterAddress Component displays form validation errors when continue is
                                 accessible={true}
                                 style={
                                   {
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "borderRadius": 8,
                                     "marginVertical": 8,
                                     "padding": 16,
@@ -1394,7 +1398,7 @@ exports[`EnterAddress Component displays form validation errors when continue is
                                     testID="listitemcolumn"
                                   >
                                     <SvgMock
-                                      color="#686e7d"
+                                      color="#66676a"
                                       fill="currentColor"
                                       height={24}
                                       name="SecurityKey"
@@ -1428,7 +1432,7 @@ exports[`EnterAddress Component displays form validation errors when continue is
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#686e7d",
+                                          "color": "#66676a",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 12,
                                           "letterSpacing": 0.25,
@@ -1442,7 +1446,7 @@ exports[`EnterAddress Component displays form validation errors when continue is
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#686e7d",
+                                          "color": "#66676a",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 12,
                                           "letterSpacing": 0.25,
@@ -1468,7 +1472,7 @@ exports[`EnterAddress Component displays form validation errors when continue is
                                   {
                                     "alignItems": "center",
                                     "alignSelf": "stretch",
-                                    "backgroundColor": "#121314",
+                                    "backgroundColor": "#131416",
                                     "borderRadius": 12,
                                     "flexDirection": "row",
                                     "height": 48,
@@ -1499,7 +1503,7 @@ exports[`EnterAddress Component displays form validation errors when continue is
                                 name="powered-by-transak-logo"
                                 style={
                                   {
-                                    "color": "#686e7d",
+                                    "color": "#66676a",
                                     "height": 24,
                                   }
                                 }
@@ -1638,7 +1642,7 @@ exports[`EnterAddress Component prefills form data when previousFormData is prov
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -1679,7 +1683,7 @@ exports[`EnterAddress Component prefills form data when previousFormData is prov
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -2068,7 +2072,7 @@ exports[`EnterAddress Component prefills form data when previousFormData is prov
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 24,
                                         "letterSpacing": 0,
@@ -2082,7 +2086,7 @@ exports[`EnterAddress Component prefills form data when previousFormData is prov
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -2108,7 +2112,7 @@ exports[`EnterAddress Component prefills form data when previousFormData is prov
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -2153,8 +2157,8 @@ exports[`EnterAddress Component prefills form data when previousFormData is prov
                                     style={
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
-                                        "borderColor": "#b7bbc866",
+                                        "backgroundColor": "#b4b4b528",
+                                        "borderColor": "#b4b4b566",
                                         "borderRadius": 12,
                                         "borderWidth": 1,
                                         "flexDirection": "row",
@@ -2185,14 +2189,14 @@ exports[`EnterAddress Component prefills form data when previousFormData is prov
                                         onFocus={[Function]}
                                         onSubmitEditing={[Function]}
                                         placeholder="Address line 1"
-                                        placeholderTextColor="#686e7d"
+                                        placeholderTextColor="#66676a"
                                         returnKeyType="next"
                                         style={
                                           {
                                             "backgroundColor": "inherit",
                                             "borderColor": "transparent",
                                             "borderWidth": 1,
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 16,
                                             "fontWeight": "400",
@@ -2223,7 +2227,7 @@ exports[`EnterAddress Component prefills form data when previousFormData is prov
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -2268,8 +2272,8 @@ exports[`EnterAddress Component prefills form data when previousFormData is prov
                                     style={
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
-                                        "borderColor": "#b7bbc866",
+                                        "backgroundColor": "#b4b4b528",
+                                        "borderColor": "#b4b4b566",
                                         "borderRadius": 12,
                                         "borderWidth": 1,
                                         "flexDirection": "row",
@@ -2300,14 +2304,14 @@ exports[`EnterAddress Component prefills form data when previousFormData is prov
                                         onFocus={[Function]}
                                         onSubmitEditing={[Function]}
                                         placeholder="Address line 2 (optional)"
-                                        placeholderTextColor="#686e7d"
+                                        placeholderTextColor="#66676a"
                                         returnKeyType="next"
                                         style={
                                           {
                                             "backgroundColor": "inherit",
                                             "borderColor": "transparent",
                                             "borderWidth": 1,
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 16,
                                             "fontWeight": "400",
@@ -2349,7 +2353,7 @@ exports[`EnterAddress Component prefills form data when previousFormData is prov
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -2394,8 +2398,8 @@ exports[`EnterAddress Component prefills form data when previousFormData is prov
                                       style={
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
-                                          "borderColor": "#b7bbc866",
+                                          "backgroundColor": "#b4b4b528",
+                                          "borderColor": "#b4b4b566",
                                           "borderRadius": 12,
                                           "borderWidth": 1,
                                           "flexDirection": "row",
@@ -2425,14 +2429,14 @@ exports[`EnterAddress Component prefills form data when previousFormData is prov
                                           onFocus={[Function]}
                                           onSubmitEditing={[Function]}
                                           placeholder="City"
-                                          placeholderTextColor="#686e7d"
+                                          placeholderTextColor="#66676a"
                                           returnKeyType="next"
                                           style={
                                             {
                                               "backgroundColor": "inherit",
                                               "borderColor": "transparent",
                                               "borderWidth": 1,
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "fontWeight": "400",
@@ -2465,7 +2469,7 @@ exports[`EnterAddress Component prefills form data when previousFormData is prov
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -2491,7 +2495,7 @@ exports[`EnterAddress Component prefills form data when previousFormData is prov
                                           {
                                             "alignItems": "center",
                                             "backgroundColor": "#ffffff",
-                                            "borderColor": "#b7bbc8",
+                                            "borderColor": "#949596",
                                             "borderRadius": 8,
                                             "borderWidth": 1,
                                             "flexDirection": "row",
@@ -2508,7 +2512,7 @@ exports[`EnterAddress Component prefills form data when previousFormData is prov
                                           numberOfLines={1}
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "flex": 1,
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
@@ -2520,7 +2524,7 @@ exports[`EnterAddress Component prefills form data when previousFormData is prov
                                           New York
                                         </Text>
                                         <SvgMock
-                                          color="#686e7d"
+                                          color="#66676a"
                                           fill="currentColor"
                                           height={16}
                                           name="ArrowDown"
@@ -2563,7 +2567,7 @@ exports[`EnterAddress Component prefills form data when previousFormData is prov
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -2608,8 +2612,8 @@ exports[`EnterAddress Component prefills form data when previousFormData is prov
                                       style={
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
-                                          "borderColor": "#b7bbc866",
+                                          "backgroundColor": "#b4b4b528",
+                                          "borderColor": "#b4b4b566",
                                           "borderRadius": 12,
                                           "borderWidth": 1,
                                           "flexDirection": "row",
@@ -2640,14 +2644,14 @@ exports[`EnterAddress Component prefills form data when previousFormData is prov
                                           onFocus={[Function]}
                                           onSubmitEditing={[Function]}
                                           placeholder="Postal code"
-                                          placeholderTextColor="#686e7d"
+                                          placeholderTextColor="#66676a"
                                           returnKeyType="done"
                                           style={
                                             {
                                               "backgroundColor": "inherit",
                                               "borderColor": "transparent",
                                               "borderWidth": 1,
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "fontWeight": "400",
@@ -2680,7 +2684,7 @@ exports[`EnterAddress Component prefills form data when previousFormData is prov
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -2725,8 +2729,8 @@ exports[`EnterAddress Component prefills form data when previousFormData is prov
                                       style={
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
-                                          "borderColor": "#b7bbc866",
+                                          "backgroundColor": "#b4b4b528",
+                                          "borderColor": "#b4b4b566",
                                           "borderRadius": 12,
                                           "borderWidth": 1,
                                           "flexDirection": "row",
@@ -2749,7 +2753,7 @@ exports[`EnterAddress Component prefills form data when previousFormData is prov
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -2776,14 +2780,14 @@ exports[`EnterAddress Component prefills form data when previousFormData is prov
                                           onBlur={[Function]}
                                           onFocus={[Function]}
                                           placeholder="Country"
-                                          placeholderTextColor="#686e7d"
+                                          placeholderTextColor="#66676a"
                                           returnKeyType="done"
                                           style={
                                             {
                                               "backgroundColor": "inherit",
                                               "borderColor": "transparent",
                                               "borderWidth": 1,
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "fontWeight": "400",
@@ -2822,7 +2826,7 @@ exports[`EnterAddress Component prefills form data when previousFormData is prov
                                 accessible={true}
                                 style={
                                   {
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "borderRadius": 8,
                                     "marginVertical": 8,
                                     "padding": 16,
@@ -2847,7 +2851,7 @@ exports[`EnterAddress Component prefills form data when previousFormData is prov
                                     testID="listitemcolumn"
                                   >
                                     <SvgMock
-                                      color="#686e7d"
+                                      color="#66676a"
                                       fill="currentColor"
                                       height={24}
                                       name="SecurityKey"
@@ -2881,7 +2885,7 @@ exports[`EnterAddress Component prefills form data when previousFormData is prov
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#686e7d",
+                                          "color": "#66676a",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 12,
                                           "letterSpacing": 0.25,
@@ -2895,7 +2899,7 @@ exports[`EnterAddress Component prefills form data when previousFormData is prov
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#686e7d",
+                                          "color": "#66676a",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 12,
                                           "letterSpacing": 0.25,
@@ -2921,7 +2925,7 @@ exports[`EnterAddress Component prefills form data when previousFormData is prov
                                   {
                                     "alignItems": "center",
                                     "alignSelf": "stretch",
-                                    "backgroundColor": "#121314",
+                                    "backgroundColor": "#131416",
                                     "borderRadius": 12,
                                     "flexDirection": "row",
                                     "height": 48,
@@ -2952,7 +2956,7 @@ exports[`EnterAddress Component prefills form data when previousFormData is prov
                                 name="powered-by-transak-logo"
                                 style={
                                   {
-                                    "color": "#686e7d",
+                                    "color": "#66676a",
                                     "height": 24,
                                   }
                                 }
@@ -3091,7 +3095,7 @@ exports[`EnterAddress Component render matches snapshot 1`] = `
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -3132,7 +3136,7 @@ exports[`EnterAddress Component render matches snapshot 1`] = `
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -3521,7 +3525,7 @@ exports[`EnterAddress Component render matches snapshot 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 24,
                                         "letterSpacing": 0,
@@ -3535,7 +3539,7 @@ exports[`EnterAddress Component render matches snapshot 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -3561,7 +3565,7 @@ exports[`EnterAddress Component render matches snapshot 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -3606,8 +3610,8 @@ exports[`EnterAddress Component render matches snapshot 1`] = `
                                     style={
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
-                                        "borderColor": "#b7bbc866",
+                                        "backgroundColor": "#b4b4b528",
+                                        "borderColor": "#b4b4b566",
                                         "borderRadius": 12,
                                         "borderWidth": 1,
                                         "flexDirection": "row",
@@ -3638,19 +3642,20 @@ exports[`EnterAddress Component render matches snapshot 1`] = `
                                         onFocus={[Function]}
                                         onSubmitEditing={[Function]}
                                         placeholder="Address line 1"
-                                        placeholderTextColor="#686e7d"
+                                        placeholderTextColor="#66676a"
                                         returnKeyType="next"
                                         style={
                                           {
                                             "backgroundColor": "inherit",
                                             "borderColor": "transparent",
                                             "borderWidth": 1,
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 16,
                                             "fontWeight": "400",
                                             "height": 46,
                                             "letterSpacing": 0,
+                                            "lineHeight": 0,
                                             "opacity": 1,
                                           }
                                         }
@@ -3676,7 +3681,7 @@ exports[`EnterAddress Component render matches snapshot 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -3721,8 +3726,8 @@ exports[`EnterAddress Component render matches snapshot 1`] = `
                                     style={
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
-                                        "borderColor": "#b7bbc866",
+                                        "backgroundColor": "#b4b4b528",
+                                        "borderColor": "#b4b4b566",
                                         "borderRadius": 12,
                                         "borderWidth": 1,
                                         "flexDirection": "row",
@@ -3753,19 +3758,20 @@ exports[`EnterAddress Component render matches snapshot 1`] = `
                                         onFocus={[Function]}
                                         onSubmitEditing={[Function]}
                                         placeholder="Address line 2 (optional)"
-                                        placeholderTextColor="#686e7d"
+                                        placeholderTextColor="#66676a"
                                         returnKeyType="next"
                                         style={
                                           {
                                             "backgroundColor": "inherit",
                                             "borderColor": "transparent",
                                             "borderWidth": 1,
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 16,
                                             "fontWeight": "400",
                                             "height": 46,
                                             "letterSpacing": 0,
+                                            "lineHeight": 0,
                                             "opacity": 1,
                                           }
                                         }
@@ -3802,7 +3808,7 @@ exports[`EnterAddress Component render matches snapshot 1`] = `
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -3847,8 +3853,8 @@ exports[`EnterAddress Component render matches snapshot 1`] = `
                                       style={
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
-                                          "borderColor": "#b7bbc866",
+                                          "backgroundColor": "#b4b4b528",
+                                          "borderColor": "#b4b4b566",
                                           "borderRadius": 12,
                                           "borderWidth": 1,
                                           "flexDirection": "row",
@@ -3878,19 +3884,20 @@ exports[`EnterAddress Component render matches snapshot 1`] = `
                                           onFocus={[Function]}
                                           onSubmitEditing={[Function]}
                                           placeholder="City"
-                                          placeholderTextColor="#686e7d"
+                                          placeholderTextColor="#66676a"
                                           returnKeyType="next"
                                           style={
                                             {
                                               "backgroundColor": "inherit",
                                               "borderColor": "transparent",
                                               "borderWidth": 1,
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "fontWeight": "400",
                                               "height": 46,
                                               "letterSpacing": 0,
+                                              "lineHeight": 0,
                                               "opacity": 1,
                                             }
                                           }
@@ -3918,7 +3925,7 @@ exports[`EnterAddress Component render matches snapshot 1`] = `
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -3944,7 +3951,7 @@ exports[`EnterAddress Component render matches snapshot 1`] = `
                                           {
                                             "alignItems": "center",
                                             "backgroundColor": "#ffffff",
-                                            "borderColor": "#b7bbc8",
+                                            "borderColor": "#949596",
                                             "borderRadius": 8,
                                             "borderWidth": 1,
                                             "flexDirection": "row",
@@ -3962,15 +3969,15 @@ exports[`EnterAddress Component render matches snapshot 1`] = `
                                           style={
                                             {
                                               "0": {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "flex": 1,
                                                 "fontSize": 16,
                                               },
                                               "1": {
-                                                "color": "#b7bbc8",
+                                                "color": "#babbbe",
                                                 "fontSize": 16,
                                               },
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -3981,7 +3988,7 @@ exports[`EnterAddress Component render matches snapshot 1`] = `
                                           Select state
                                         </Text>
                                         <SvgMock
-                                          color="#686e7d"
+                                          color="#66676a"
                                           fill="currentColor"
                                           height={16}
                                           name="ArrowDown"
@@ -4024,7 +4031,7 @@ exports[`EnterAddress Component render matches snapshot 1`] = `
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -4069,8 +4076,8 @@ exports[`EnterAddress Component render matches snapshot 1`] = `
                                       style={
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
-                                          "borderColor": "#b7bbc866",
+                                          "backgroundColor": "#b4b4b528",
+                                          "borderColor": "#b4b4b566",
                                           "borderRadius": 12,
                                           "borderWidth": 1,
                                           "flexDirection": "row",
@@ -4101,19 +4108,20 @@ exports[`EnterAddress Component render matches snapshot 1`] = `
                                           onFocus={[Function]}
                                           onSubmitEditing={[Function]}
                                           placeholder="Postal code"
-                                          placeholderTextColor="#686e7d"
+                                          placeholderTextColor="#66676a"
                                           returnKeyType="done"
                                           style={
                                             {
                                               "backgroundColor": "inherit",
                                               "borderColor": "transparent",
                                               "borderWidth": 1,
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "fontWeight": "400",
                                               "height": 46,
                                               "letterSpacing": 0,
+                                              "lineHeight": 0,
                                               "opacity": 1,
                                             }
                                           }
@@ -4141,7 +4149,7 @@ exports[`EnterAddress Component render matches snapshot 1`] = `
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -4186,8 +4194,8 @@ exports[`EnterAddress Component render matches snapshot 1`] = `
                                       style={
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
-                                          "borderColor": "#b7bbc866",
+                                          "backgroundColor": "#b4b4b528",
+                                          "borderColor": "#b4b4b566",
                                           "borderRadius": 12,
                                           "borderWidth": 1,
                                           "flexDirection": "row",
@@ -4210,7 +4218,7 @@ exports[`EnterAddress Component render matches snapshot 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -4237,14 +4245,14 @@ exports[`EnterAddress Component render matches snapshot 1`] = `
                                           onBlur={[Function]}
                                           onFocus={[Function]}
                                           placeholder="Country"
-                                          placeholderTextColor="#686e7d"
+                                          placeholderTextColor="#66676a"
                                           returnKeyType="done"
                                           style={
                                             {
                                               "backgroundColor": "inherit",
                                               "borderColor": "transparent",
                                               "borderWidth": 1,
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "fontWeight": "400",
@@ -4283,7 +4291,7 @@ exports[`EnterAddress Component render matches snapshot 1`] = `
                                 accessible={true}
                                 style={
                                   {
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "borderRadius": 8,
                                     "marginVertical": 8,
                                     "padding": 16,
@@ -4308,7 +4316,7 @@ exports[`EnterAddress Component render matches snapshot 1`] = `
                                     testID="listitemcolumn"
                                   >
                                     <SvgMock
-                                      color="#686e7d"
+                                      color="#66676a"
                                       fill="currentColor"
                                       height={24}
                                       name="SecurityKey"
@@ -4342,7 +4350,7 @@ exports[`EnterAddress Component render matches snapshot 1`] = `
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#686e7d",
+                                          "color": "#66676a",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 12,
                                           "letterSpacing": 0.25,
@@ -4356,7 +4364,7 @@ exports[`EnterAddress Component render matches snapshot 1`] = `
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#686e7d",
+                                          "color": "#66676a",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 12,
                                           "letterSpacing": 0.25,
@@ -4382,7 +4390,7 @@ exports[`EnterAddress Component render matches snapshot 1`] = `
                                   {
                                     "alignItems": "center",
                                     "alignSelf": "stretch",
-                                    "backgroundColor": "#121314",
+                                    "backgroundColor": "#131416",
                                     "borderRadius": 12,
                                     "flexDirection": "row",
                                     "height": 48,
@@ -4413,7 +4421,7 @@ exports[`EnterAddress Component render matches snapshot 1`] = `
                                 name="powered-by-transak-logo"
                                 style={
                                   {
-                                    "color": "#686e7d",
+                                    "color": "#66676a",
                                     "height": 24,
                                   }
                                 }
@@ -4552,7 +4560,7 @@ exports[`EnterAddress Component shows text input for state when region is not US
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -4593,7 +4601,7 @@ exports[`EnterAddress Component shows text input for state when region is not US
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -4982,7 +4990,7 @@ exports[`EnterAddress Component shows text input for state when region is not US
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 24,
                                         "letterSpacing": 0,
@@ -4996,7 +5004,7 @@ exports[`EnterAddress Component shows text input for state when region is not US
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -5022,7 +5030,7 @@ exports[`EnterAddress Component shows text input for state when region is not US
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -5067,8 +5075,8 @@ exports[`EnterAddress Component shows text input for state when region is not US
                                     style={
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
-                                        "borderColor": "#b7bbc866",
+                                        "backgroundColor": "#b4b4b528",
+                                        "borderColor": "#b4b4b566",
                                         "borderRadius": 12,
                                         "borderWidth": 1,
                                         "flexDirection": "row",
@@ -5099,19 +5107,20 @@ exports[`EnterAddress Component shows text input for state when region is not US
                                         onFocus={[Function]}
                                         onSubmitEditing={[Function]}
                                         placeholder="Address line 1"
-                                        placeholderTextColor="#686e7d"
+                                        placeholderTextColor="#66676a"
                                         returnKeyType="next"
                                         style={
                                           {
                                             "backgroundColor": "inherit",
                                             "borderColor": "transparent",
                                             "borderWidth": 1,
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 16,
                                             "fontWeight": "400",
                                             "height": 46,
                                             "letterSpacing": 0,
+                                            "lineHeight": 0,
                                             "opacity": 1,
                                           }
                                         }
@@ -5137,7 +5146,7 @@ exports[`EnterAddress Component shows text input for state when region is not US
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -5182,8 +5191,8 @@ exports[`EnterAddress Component shows text input for state when region is not US
                                     style={
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#3c4d9d0f",
-                                        "borderColor": "#b7bbc866",
+                                        "backgroundColor": "#b4b4b528",
+                                        "borderColor": "#b4b4b566",
                                         "borderRadius": 12,
                                         "borderWidth": 1,
                                         "flexDirection": "row",
@@ -5214,19 +5223,20 @@ exports[`EnterAddress Component shows text input for state when region is not US
                                         onFocus={[Function]}
                                         onSubmitEditing={[Function]}
                                         placeholder="Address line 2 (optional)"
-                                        placeholderTextColor="#686e7d"
+                                        placeholderTextColor="#66676a"
                                         returnKeyType="next"
                                         style={
                                           {
                                             "backgroundColor": "inherit",
                                             "borderColor": "transparent",
                                             "borderWidth": 1,
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 16,
                                             "fontWeight": "400",
                                             "height": 46,
                                             "letterSpacing": 0,
+                                            "lineHeight": 0,
                                             "opacity": 1,
                                           }
                                         }
@@ -5263,7 +5273,7 @@ exports[`EnterAddress Component shows text input for state when region is not US
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -5308,8 +5318,8 @@ exports[`EnterAddress Component shows text input for state when region is not US
                                       style={
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
-                                          "borderColor": "#b7bbc866",
+                                          "backgroundColor": "#b4b4b528",
+                                          "borderColor": "#b4b4b566",
                                           "borderRadius": 12,
                                           "borderWidth": 1,
                                           "flexDirection": "row",
@@ -5339,19 +5349,20 @@ exports[`EnterAddress Component shows text input for state when region is not US
                                           onFocus={[Function]}
                                           onSubmitEditing={[Function]}
                                           placeholder="City"
-                                          placeholderTextColor="#686e7d"
+                                          placeholderTextColor="#66676a"
                                           returnKeyType="next"
                                           style={
                                             {
                                               "backgroundColor": "inherit",
                                               "borderColor": "transparent",
                                               "borderWidth": 1,
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "fontWeight": "400",
                                               "height": 46,
                                               "letterSpacing": 0,
+                                              "lineHeight": 0,
                                               "opacity": 1,
                                             }
                                           }
@@ -5379,7 +5390,7 @@ exports[`EnterAddress Component shows text input for state when region is not US
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -5424,8 +5435,8 @@ exports[`EnterAddress Component shows text input for state when region is not US
                                       style={
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
-                                          "borderColor": "#b7bbc866",
+                                          "backgroundColor": "#b4b4b528",
+                                          "borderColor": "#b4b4b566",
                                           "borderRadius": 12,
                                           "borderWidth": 1,
                                           "flexDirection": "row",
@@ -5455,19 +5466,20 @@ exports[`EnterAddress Component shows text input for state when region is not US
                                           onFocus={[Function]}
                                           onSubmitEditing={[Function]}
                                           placeholder="State/Region"
-                                          placeholderTextColor="#686e7d"
+                                          placeholderTextColor="#66676a"
                                           returnKeyType="next"
                                           style={
                                             {
                                               "backgroundColor": "inherit",
                                               "borderColor": "transparent",
                                               "borderWidth": 1,
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "fontWeight": "400",
                                               "height": 46,
                                               "letterSpacing": 0,
+                                              "lineHeight": 0,
                                               "opacity": 1,
                                             }
                                           }
@@ -5505,7 +5517,7 @@ exports[`EnterAddress Component shows text input for state when region is not US
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -5550,8 +5562,8 @@ exports[`EnterAddress Component shows text input for state when region is not US
                                       style={
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
-                                          "borderColor": "#b7bbc866",
+                                          "backgroundColor": "#b4b4b528",
+                                          "borderColor": "#b4b4b566",
                                           "borderRadius": 12,
                                           "borderWidth": 1,
                                           "flexDirection": "row",
@@ -5582,19 +5594,20 @@ exports[`EnterAddress Component shows text input for state when region is not US
                                           onFocus={[Function]}
                                           onSubmitEditing={[Function]}
                                           placeholder="Postal code"
-                                          placeholderTextColor="#686e7d"
+                                          placeholderTextColor="#66676a"
                                           returnKeyType="done"
                                           style={
                                             {
                                               "backgroundColor": "inherit",
                                               "borderColor": "transparent",
                                               "borderWidth": 1,
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "fontWeight": "400",
                                               "height": 46,
                                               "letterSpacing": 0,
+                                              "lineHeight": 0,
                                               "opacity": 1,
                                             }
                                           }
@@ -5622,7 +5635,7 @@ exports[`EnterAddress Component shows text input for state when region is not US
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 16,
                                           "letterSpacing": 0,
@@ -5667,8 +5680,8 @@ exports[`EnterAddress Component shows text input for state when region is not US
                                       style={
                                         {
                                           "alignItems": "center",
-                                          "backgroundColor": "#3c4d9d0f",
-                                          "borderColor": "#b7bbc866",
+                                          "backgroundColor": "#b4b4b528",
+                                          "borderColor": "#b4b4b566",
                                           "borderRadius": 12,
                                           "borderWidth": 1,
                                           "flexDirection": "row",
@@ -5691,7 +5704,7 @@ exports[`EnterAddress Component shows text input for state when region is not US
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -5718,14 +5731,14 @@ exports[`EnterAddress Component shows text input for state when region is not US
                                           onBlur={[Function]}
                                           onFocus={[Function]}
                                           placeholder="Country"
-                                          placeholderTextColor="#686e7d"
+                                          placeholderTextColor="#66676a"
                                           returnKeyType="done"
                                           style={
                                             {
                                               "backgroundColor": "inherit",
                                               "borderColor": "transparent",
                                               "borderWidth": 1,
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "fontWeight": "400",
@@ -5764,7 +5777,7 @@ exports[`EnterAddress Component shows text input for state when region is not US
                                 accessible={true}
                                 style={
                                   {
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "borderRadius": 8,
                                     "marginVertical": 8,
                                     "padding": 16,
@@ -5789,7 +5802,7 @@ exports[`EnterAddress Component shows text input for state when region is not US
                                     testID="listitemcolumn"
                                   >
                                     <SvgMock
-                                      color="#686e7d"
+                                      color="#66676a"
                                       fill="currentColor"
                                       height={24}
                                       name="SecurityKey"
@@ -5823,7 +5836,7 @@ exports[`EnterAddress Component shows text input for state when region is not US
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#686e7d",
+                                          "color": "#66676a",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 12,
                                           "letterSpacing": 0.25,
@@ -5837,7 +5850,7 @@ exports[`EnterAddress Component shows text input for state when region is not US
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#686e7d",
+                                          "color": "#66676a",
                                           "fontFamily": "Geist-Regular",
                                           "fontSize": 12,
                                           "letterSpacing": 0.25,
@@ -5863,7 +5876,7 @@ exports[`EnterAddress Component shows text input for state when region is not US
                                   {
                                     "alignItems": "center",
                                     "alignSelf": "stretch",
-                                    "backgroundColor": "#121314",
+                                    "backgroundColor": "#131416",
                                     "borderRadius": 12,
                                     "flexDirection": "row",
                                     "height": 48,
@@ -5894,7 +5907,7 @@ exports[`EnterAddress Component shows text input for state when region is not US
                                 name="powered-by-transak-logo"
                                 style={
                                   {
-                                    "color": "#686e7d",
+                                    "color": "#66676a",
                                     "height": 24,
                                   }
                                 }
diff --git a/app/components/UI/Ramp/Deposit/Views/EnterEmail/__snapshots__/EnterEmail.test.tsx.snap b/app/components/UI/Ramp/Deposit/Views/EnterEmail/__snapshots__/EnterEmail.test.tsx.snap
index 2ceb5fe26790..21cb46ee5ff8 100644
--- a/app/components/UI/Ramp/Deposit/Views/EnterEmail/__snapshots__/EnterEmail.test.tsx.snap
+++ b/app/components/UI/Ramp/Deposit/Views/EnterEmail/__snapshots__/EnterEmail.test.tsx.snap
@@ -117,7 +117,7 @@ exports[`EnterEmail Component render matches snapshot 1`] = `
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -158,7 +158,7 @@ exports[`EnterEmail Component render matches snapshot 1`] = `
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -454,7 +454,7 @@ exports[`EnterEmail Component render matches snapshot 1`] = `
                                         "height": 4,
                                       },
                                       {
-                                        "backgroundColor": "#b7bbc8",
+                                        "backgroundColor": "#babbbe",
                                       },
                                     ],
                                     {
@@ -474,7 +474,7 @@ exports[`EnterEmail Component render matches snapshot 1`] = `
                                         "height": 4,
                                       },
                                       {
-                                        "backgroundColor": "#b7bbc8",
+                                        "backgroundColor": "#babbbe",
                                       },
                                     ],
                                     {
@@ -494,7 +494,7 @@ exports[`EnterEmail Component render matches snapshot 1`] = `
                                         "height": 4,
                                       },
                                       {
-                                        "backgroundColor": "#b7bbc8",
+                                        "backgroundColor": "#babbbe",
                                       },
                                     ],
                                     undefined,
@@ -515,7 +515,7 @@ exports[`EnterEmail Component render matches snapshot 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Bold",
                                     "fontSize": 24,
                                     "fontWeight": "bold",
@@ -530,7 +530,7 @@ exports[`EnterEmail Component render matches snapshot 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#686e7d",
+                                    "color": "#66676a",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -573,8 +573,8 @@ exports[`EnterEmail Component render matches snapshot 1`] = `
                                 style={
                                   {
                                     "alignItems": "center",
-                                    "backgroundColor": "#3c4d9d0f",
-                                    "borderColor": "#b7bbc866",
+                                    "backgroundColor": "#b4b4b528",
+                                    "borderColor": "#b4b4b566",
                                     "borderRadius": 12,
                                     "borderWidth": 1,
                                     "flexDirection": "row",
@@ -606,19 +606,20 @@ exports[`EnterEmail Component render matches snapshot 1`] = `
                                     onFocus={[Function]}
                                     onSubmitEditing={[Function]}
                                     placeholder="name@domain.com"
-                                    placeholderTextColor="#686e7d"
+                                    placeholderTextColor="#66676a"
                                     returnKeyType="done"
                                     style={
                                       {
                                         "backgroundColor": "inherit",
                                         "borderColor": "transparent",
                                         "borderWidth": 1,
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "fontWeight": "400",
                                         "height": 46,
                                         "letterSpacing": 0,
+                                        "lineHeight": 0,
                                         "opacity": 1,
                                       }
                                     }
@@ -657,7 +658,7 @@ exports[`EnterEmail Component render matches snapshot 1`] = `
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
@@ -687,7 +688,7 @@ exports[`EnterEmail Component render matches snapshot 1`] = `
                               name="powered-by-transak-logo"
                               style={
                                 {
-                                  "color": "#686e7d",
+                                  "color": "#66676a",
                                   "height": 24,
                                 }
                               }
@@ -825,7 +826,7 @@ exports[`EnterEmail Component renders error message snapshot when API call fails
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -866,7 +867,7 @@ exports[`EnterEmail Component renders error message snapshot when API call fails
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -1162,7 +1163,7 @@ exports[`EnterEmail Component renders error message snapshot when API call fails
                                         "height": 4,
                                       },
                                       {
-                                        "backgroundColor": "#b7bbc8",
+                                        "backgroundColor": "#babbbe",
                                       },
                                     ],
                                     {
@@ -1182,7 +1183,7 @@ exports[`EnterEmail Component renders error message snapshot when API call fails
                                         "height": 4,
                                       },
                                       {
-                                        "backgroundColor": "#b7bbc8",
+                                        "backgroundColor": "#babbbe",
                                       },
                                     ],
                                     {
@@ -1202,7 +1203,7 @@ exports[`EnterEmail Component renders error message snapshot when API call fails
                                         "height": 4,
                                       },
                                       {
-                                        "backgroundColor": "#b7bbc8",
+                                        "backgroundColor": "#babbbe",
                                       },
                                     ],
                                     undefined,
@@ -1223,7 +1224,7 @@ exports[`EnterEmail Component renders error message snapshot when API call fails
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Bold",
                                     "fontSize": 24,
                                     "fontWeight": "bold",
@@ -1238,7 +1239,7 @@ exports[`EnterEmail Component renders error message snapshot when API call fails
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#686e7d",
+                                    "color": "#66676a",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -1281,8 +1282,8 @@ exports[`EnterEmail Component renders error message snapshot when API call fails
                                 style={
                                   {
                                     "alignItems": "center",
-                                    "backgroundColor": "#3c4d9d0f",
-                                    "borderColor": "#b7bbc866",
+                                    "backgroundColor": "#b4b4b528",
+                                    "borderColor": "#b4b4b566",
                                     "borderRadius": 12,
                                     "borderWidth": 1,
                                     "flexDirection": "row",
@@ -1314,14 +1315,14 @@ exports[`EnterEmail Component renders error message snapshot when API call fails
                                     onFocus={[Function]}
                                     onSubmitEditing={[Function]}
                                     placeholder="name@domain.com"
-                                    placeholderTextColor="#686e7d"
+                                    placeholderTextColor="#66676a"
                                     returnKeyType="done"
                                     style={
                                       {
                                         "backgroundColor": "inherit",
                                         "borderColor": "transparent",
                                         "borderWidth": 1,
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "fontWeight": "400",
@@ -1379,7 +1380,7 @@ exports[`EnterEmail Component renders error message snapshot when API call fails
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
@@ -1409,7 +1410,7 @@ exports[`EnterEmail Component renders error message snapshot when API call fails
                               name="powered-by-transak-logo"
                               style={
                                 {
-                                  "color": "#686e7d",
+                                  "color": "#66676a",
                                   "height": 24,
                                 }
                               }
@@ -1547,7 +1548,7 @@ exports[`EnterEmail Component renders loading state snapshot 1`] = `
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -1588,7 +1589,7 @@ exports[`EnterEmail Component renders loading state snapshot 1`] = `
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -1884,7 +1885,7 @@ exports[`EnterEmail Component renders loading state snapshot 1`] = `
                                         "height": 4,
                                       },
                                       {
-                                        "backgroundColor": "#b7bbc8",
+                                        "backgroundColor": "#babbbe",
                                       },
                                     ],
                                     {
@@ -1904,7 +1905,7 @@ exports[`EnterEmail Component renders loading state snapshot 1`] = `
                                         "height": 4,
                                       },
                                       {
-                                        "backgroundColor": "#b7bbc8",
+                                        "backgroundColor": "#babbbe",
                                       },
                                     ],
                                     {
@@ -1924,7 +1925,7 @@ exports[`EnterEmail Component renders loading state snapshot 1`] = `
                                         "height": 4,
                                       },
                                       {
-                                        "backgroundColor": "#b7bbc8",
+                                        "backgroundColor": "#babbbe",
                                       },
                                     ],
                                     undefined,
@@ -1945,7 +1946,7 @@ exports[`EnterEmail Component renders loading state snapshot 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Bold",
                                     "fontSize": 24,
                                     "fontWeight": "bold",
@@ -1960,7 +1961,7 @@ exports[`EnterEmail Component renders loading state snapshot 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#686e7d",
+                                    "color": "#66676a",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -2003,8 +2004,8 @@ exports[`EnterEmail Component renders loading state snapshot 1`] = `
                                 style={
                                   {
                                     "alignItems": "center",
-                                    "backgroundColor": "#3c4d9d0f",
-                                    "borderColor": "#b7bbc866",
+                                    "backgroundColor": "#b4b4b528",
+                                    "borderColor": "#b4b4b566",
                                     "borderRadius": 12,
                                     "borderWidth": 1,
                                     "flexDirection": "row",
@@ -2036,19 +2037,20 @@ exports[`EnterEmail Component renders loading state snapshot 1`] = `
                                     onFocus={[Function]}
                                     onSubmitEditing={[Function]}
                                     placeholder="name@domain.com"
-                                    placeholderTextColor="#686e7d"
+                                    placeholderTextColor="#66676a"
                                     returnKeyType="done"
                                     style={
                                       {
                                         "backgroundColor": "inherit",
                                         "borderColor": "transparent",
                                         "borderWidth": 1,
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "fontWeight": "400",
                                         "height": 46,
                                         "letterSpacing": 0,
+                                        "lineHeight": 0,
                                         "opacity": 1,
                                       }
                                     }
@@ -2087,7 +2089,7 @@ exports[`EnterEmail Component renders loading state snapshot 1`] = `
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
@@ -2117,7 +2119,7 @@ exports[`EnterEmail Component renders loading state snapshot 1`] = `
                               name="powered-by-transak-logo"
                               style={
                                 {
-                                  "color": "#686e7d",
+                                  "color": "#66676a",
                                   "height": 24,
                                 }
                               }
@@ -2255,7 +2257,7 @@ exports[`EnterEmail Component renders validation error snapshot invalid email 1`
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -2296,7 +2298,7 @@ exports[`EnterEmail Component renders validation error snapshot invalid email 1`
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -2592,7 +2594,7 @@ exports[`EnterEmail Component renders validation error snapshot invalid email 1`
                                         "height": 4,
                                       },
                                       {
-                                        "backgroundColor": "#b7bbc8",
+                                        "backgroundColor": "#babbbe",
                                       },
                                     ],
                                     {
@@ -2612,7 +2614,7 @@ exports[`EnterEmail Component renders validation error snapshot invalid email 1`
                                         "height": 4,
                                       },
                                       {
-                                        "backgroundColor": "#b7bbc8",
+                                        "backgroundColor": "#babbbe",
                                       },
                                     ],
                                     {
@@ -2632,7 +2634,7 @@ exports[`EnterEmail Component renders validation error snapshot invalid email 1`
                                         "height": 4,
                                       },
                                       {
-                                        "backgroundColor": "#b7bbc8",
+                                        "backgroundColor": "#babbbe",
                                       },
                                     ],
                                     undefined,
@@ -2653,7 +2655,7 @@ exports[`EnterEmail Component renders validation error snapshot invalid email 1`
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Bold",
                                     "fontSize": 24,
                                     "fontWeight": "bold",
@@ -2668,7 +2670,7 @@ exports[`EnterEmail Component renders validation error snapshot invalid email 1`
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#686e7d",
+                                    "color": "#66676a",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -2711,8 +2713,8 @@ exports[`EnterEmail Component renders validation error snapshot invalid email 1`
                                 style={
                                   {
                                     "alignItems": "center",
-                                    "backgroundColor": "#3c4d9d0f",
-                                    "borderColor": "#b7bbc866",
+                                    "backgroundColor": "#b4b4b528",
+                                    "borderColor": "#b4b4b566",
                                     "borderRadius": 12,
                                     "borderWidth": 1,
                                     "flexDirection": "row",
@@ -2744,14 +2746,14 @@ exports[`EnterEmail Component renders validation error snapshot invalid email 1`
                                     onFocus={[Function]}
                                     onSubmitEditing={[Function]}
                                     placeholder="name@domain.com"
-                                    placeholderTextColor="#686e7d"
+                                    placeholderTextColor="#66676a"
                                     returnKeyType="done"
                                     style={
                                       {
                                         "backgroundColor": "inherit",
                                         "borderColor": "transparent",
                                         "borderWidth": 1,
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "fontWeight": "400",
@@ -2809,7 +2811,7 @@ exports[`EnterEmail Component renders validation error snapshot invalid email 1`
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
@@ -2839,7 +2841,7 @@ exports[`EnterEmail Component renders validation error snapshot invalid email 1`
                               name="powered-by-transak-logo"
                               style={
                                 {
-                                  "color": "#686e7d",
+                                  "color": "#66676a",
                                   "height": 24,
                                 }
                               }
diff --git a/app/components/UI/Ramp/Deposit/Views/KycProcessing/__snapshots__/KycProcessing.test.tsx.snap b/app/components/UI/Ramp/Deposit/Views/KycProcessing/__snapshots__/KycProcessing.test.tsx.snap
index 54703bced4b2..d82bfa5a1ded 100644
--- a/app/components/UI/Ramp/Deposit/Views/KycProcessing/__snapshots__/KycProcessing.test.tsx.snap
+++ b/app/components/UI/Ramp/Deposit/Views/KycProcessing/__snapshots__/KycProcessing.test.tsx.snap
@@ -117,7 +117,7 @@ exports[`KycProcessing Component render matches snapshot 1`] = `
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -158,7 +158,7 @@ exports[`KycProcessing Component render matches snapshot 1`] = `
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -522,7 +522,7 @@ exports[`KycProcessing Component render matches snapshot 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Bold",
                                     "fontSize": 16,
                                     "fontWeight": "bold",
@@ -540,7 +540,7 @@ exports[`KycProcessing Component render matches snapshot 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -574,7 +574,7 @@ exports[`KycProcessing Component render matches snapshot 1`] = `
                               name="powered-by-transak-logo"
                               style={
                                 {
-                                  "color": "#686e7d",
+                                  "color": "#66676a",
                                   "height": 24,
                                 }
                               }
@@ -712,7 +712,7 @@ exports[`KycProcessing Component renders approved state snapshot 1`] = `
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -753,7 +753,7 @@ exports[`KycProcessing Component renders approved state snapshot 1`] = `
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -1139,7 +1139,7 @@ exports[`KycProcessing Component renders approved state snapshot 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Bold",
                                     "fontSize": 16,
                                     "fontWeight": "bold",
@@ -1157,7 +1157,7 @@ exports[`KycProcessing Component renders approved state snapshot 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -1197,7 +1197,7 @@ exports[`KycProcessing Component renders approved state snapshot 1`] = `
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
@@ -1227,7 +1227,7 @@ exports[`KycProcessing Component renders approved state snapshot 1`] = `
                               name="powered-by-transak-logo"
                               style={
                                 {
-                                  "color": "#686e7d",
+                                  "color": "#66676a",
                                   "height": 24,
                                 }
                               }
@@ -1365,7 +1365,7 @@ exports[`KycProcessing Component renders error state snapshot 1`] = `
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -1406,7 +1406,7 @@ exports[`KycProcessing Component renders error state snapshot 1`] = `
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -1778,7 +1778,7 @@ exports[`KycProcessing Component renders error state snapshot 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Bold",
                                     "fontSize": 16,
                                     "fontWeight": "bold",
@@ -1796,7 +1796,7 @@ exports[`KycProcessing Component renders error state snapshot 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -1836,7 +1836,7 @@ exports[`KycProcessing Component renders error state snapshot 1`] = `
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
@@ -1866,7 +1866,7 @@ exports[`KycProcessing Component renders error state snapshot 1`] = `
                               name="powered-by-transak-logo"
                               style={
                                 {
-                                  "color": "#686e7d",
+                                  "color": "#66676a",
                                   "height": 24,
                                 }
                               }
@@ -2004,7 +2004,7 @@ exports[`KycProcessing Component renders loading state snapshot 1`] = `
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -2045,7 +2045,7 @@ exports[`KycProcessing Component renders loading state snapshot 1`] = `
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -2409,7 +2409,7 @@ exports[`KycProcessing Component renders loading state snapshot 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Bold",
                                     "fontSize": 16,
                                     "fontWeight": "bold",
@@ -2427,7 +2427,7 @@ exports[`KycProcessing Component renders loading state snapshot 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -2461,7 +2461,7 @@ exports[`KycProcessing Component renders loading state snapshot 1`] = `
                               name="powered-by-transak-logo"
                               style={
                                 {
-                                  "color": "#686e7d",
+                                  "color": "#66676a",
                                   "height": 24,
                                 }
                               }
@@ -2599,7 +2599,7 @@ exports[`KycProcessing Component renders pending forms state snapshot 1`] = `
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -2640,7 +2640,7 @@ exports[`KycProcessing Component renders pending forms state snapshot 1`] = `
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -3012,7 +3012,7 @@ exports[`KycProcessing Component renders pending forms state snapshot 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Bold",
                                     "fontSize": 16,
                                     "fontWeight": "bold",
@@ -3030,7 +3030,7 @@ exports[`KycProcessing Component renders pending forms state snapshot 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -3070,7 +3070,7 @@ exports[`KycProcessing Component renders pending forms state snapshot 1`] = `
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
@@ -3100,7 +3100,7 @@ exports[`KycProcessing Component renders pending forms state snapshot 1`] = `
                               name="powered-by-transak-logo"
                               style={
                                 {
-                                  "color": "#686e7d",
+                                  "color": "#66676a",
                                   "height": 24,
                                 }
                               }
@@ -3238,7 +3238,7 @@ exports[`KycProcessing Component renders rejected state snapshot 1`] = `
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "height": 24,
                         "width": 24,
                       },
@@ -3279,7 +3279,7 @@ exports[`KycProcessing Component renders rejected state snapshot 1`] = `
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -3651,7 +3651,7 @@ exports[`KycProcessing Component renders rejected state snapshot 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Bold",
                                     "fontSize": 16,
                                     "fontWeight": "bold",
@@ -3669,7 +3669,7 @@ exports[`KycProcessing Component renders rejected state snapshot 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -3709,7 +3709,7 @@ exports[`KycProcessing Component renders rejected state snapshot 1`] = `
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
@@ -3739,7 +3739,7 @@ exports[`KycProcessing Component renders rejected state snapshot 1`] = `
                               name="powered-by-transak-logo"
                               style={
                                 {
-                                  "color": "#686e7d",
+                                  "color": "#66676a",
                                   "height": 24,
                                 }
                               }
diff --git a/app/components/UI/Ramp/Deposit/Views/Modals/ConfigurationModal/__snapshots__/ConfigurationModal.test.tsx.snap b/app/components/UI/Ramp/Deposit/Views/Modals/ConfigurationModal/__snapshots__/ConfigurationModal.test.tsx.snap
index de1d8fef4553..192f369902b2 100644
--- a/app/components/UI/Ramp/Deposit/Views/Modals/ConfigurationModal/__snapshots__/ConfigurationModal.test.tsx.snap
+++ b/app/components/UI/Ramp/Deposit/Views/Modals/ConfigurationModal/__snapshots__/ConfigurationModal.test.tsx.snap
@@ -334,7 +334,7 @@ exports[`ConfigurationModal render matches snapshot 1`] = `
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -384,7 +384,7 @@ exports[`ConfigurationModal render matches snapshot 1`] = `
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -421,7 +421,7 @@ exports[`ConfigurationModal render matches snapshot 1`] = `
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -470,7 +470,7 @@ exports[`ConfigurationModal render matches snapshot 1`] = `
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 16,
                                       "fontWeight": 700,
@@ -510,7 +510,7 @@ exports[`ConfigurationModal render matches snapshot 1`] = `
                                   }
                                 >
                                   <SvgMock
-                                    color="#121314"
+                                    color="#131416"
                                     fill="currentColor"
                                     height={24}
                                     name="Close"
@@ -565,7 +565,7 @@ exports[`ConfigurationModal render matches snapshot 1`] = `
                                   testID="listitemcolumn"
                                 >
                                   <SvgMock
-                                    color="#121314"
+                                    color="#131416"
                                     fill="currentColor"
                                     height={20}
                                     name="Clock"
@@ -599,7 +599,7 @@ exports[`ConfigurationModal render matches snapshot 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Medium",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -652,7 +652,7 @@ exports[`ConfigurationModal render matches snapshot 1`] = `
                                   testID="listitemcolumn"
                                 >
                                   <SvgMock
-                                    color="#121314"
+                                    color="#131416"
                                     fill="currentColor"
                                     height={20}
                                     name="Messages"
@@ -686,7 +686,7 @@ exports[`ConfigurationModal render matches snapshot 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Medium",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -739,7 +739,7 @@ exports[`ConfigurationModal render matches snapshot 1`] = `
                                   testID="listitemcolumn"
                                 >
                                   <SvgMock
-                                    color="#121314"
+                                    color="#131416"
                                     fill="currentColor"
                                     height={20}
                                     name="Money"
@@ -773,7 +773,7 @@ exports[`ConfigurationModal render matches snapshot 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Medium",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -787,7 +787,7 @@ exports[`ConfigurationModal render matches snapshot 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 14,
                                         "letterSpacing": 0,
diff --git a/app/components/UI/Ramp/Deposit/Views/Modals/ErrorDetailsModal/__snapshots__/ErrorDetailsModal.test.tsx.snap b/app/components/UI/Ramp/Deposit/Views/Modals/ErrorDetailsModal/__snapshots__/ErrorDetailsModal.test.tsx.snap
index 7220ac843c3f..03e87c0db7e1 100644
--- a/app/components/UI/Ramp/Deposit/Views/Modals/ErrorDetailsModal/__snapshots__/ErrorDetailsModal.test.tsx.snap
+++ b/app/components/UI/Ramp/Deposit/Views/Modals/ErrorDetailsModal/__snapshots__/ErrorDetailsModal.test.tsx.snap
@@ -334,7 +334,7 @@ exports[`ErrorDetailsModal renders correctly and matches snapshot 1`] = `
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -384,7 +384,7 @@ exports[`ErrorDetailsModal renders correctly and matches snapshot 1`] = `
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -421,7 +421,7 @@ exports[`ErrorDetailsModal renders correctly and matches snapshot 1`] = `
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -491,9 +491,9 @@ exports[`ErrorDetailsModal renders correctly and matches snapshot 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
-                                      "fontSize": 18,
+                                      "fontSize": 20,
                                       "letterSpacing": 0,
                                       "lineHeight": 24,
                                     }
@@ -526,7 +526,7 @@ exports[`ErrorDetailsModal renders correctly and matches snapshot 1`] = `
                                   }
                                 >
                                   <SvgMock
-                                    color="#121314"
+                                    color="#131416"
                                     fill="currentColor"
                                     height={24}
                                     name="Close"
@@ -562,7 +562,7 @@ exports[`ErrorDetailsModal renders correctly and matches snapshot 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
diff --git a/app/components/UI/Ramp/Deposit/Views/Modals/IncompatibleAccountTokenModal/__snapshots__/IncompatibleAccountTokenModal.test.tsx.snap b/app/components/UI/Ramp/Deposit/Views/Modals/IncompatibleAccountTokenModal/__snapshots__/IncompatibleAccountTokenModal.test.tsx.snap
index 10fa3533c94d..a5b74ed560b6 100644
--- a/app/components/UI/Ramp/Deposit/Views/Modals/IncompatibleAccountTokenModal/__snapshots__/IncompatibleAccountTokenModal.test.tsx.snap
+++ b/app/components/UI/Ramp/Deposit/Views/Modals/IncompatibleAccountTokenModal/__snapshots__/IncompatibleAccountTokenModal.test.tsx.snap
@@ -334,7 +334,7 @@ exports[`IncompatibleAccountTokenModal renders the modal with the correct title
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -384,7 +384,7 @@ exports[`IncompatibleAccountTokenModal renders the modal with the correct title
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -421,7 +421,7 @@ exports[`IncompatibleAccountTokenModal renders the modal with the correct title
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -469,9 +469,9 @@ exports[`IncompatibleAccountTokenModal renders the modal with the correct title
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Bold",
-                                    "fontSize": 18,
+                                    "fontSize": 20,
                                     "letterSpacing": 0,
                                     "lineHeight": 24,
                                     "textAlign": "center",
@@ -504,7 +504,7 @@ exports[`IncompatibleAccountTokenModal renders the modal with the correct title
                                   }
                                 >
                                   <SvgMock
-                                    color="#121314"
+                                    color="#131416"
                                     fill="currentColor"
                                     height={24}
                                     name="Close"
@@ -532,7 +532,7 @@ exports[`IncompatibleAccountTokenModal renders the modal with the correct title
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -553,7 +553,7 @@ exports[`IncompatibleAccountTokenModal renders the modal with the correct title
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
diff --git a/app/components/UI/Ramp/Deposit/Views/Modals/PaymentMethodSelectorModal/__snapshots__/PaymentMethodSelectorModal.test.tsx.snap b/app/components/UI/Ramp/Deposit/Views/Modals/PaymentMethodSelectorModal/__snapshots__/PaymentMethodSelectorModal.test.tsx.snap
index f430becea232..ba2e23a2f9c5 100644
--- a/app/components/UI/Ramp/Deposit/Views/Modals/PaymentMethodSelectorModal/__snapshots__/PaymentMethodSelectorModal.test.tsx.snap
+++ b/app/components/UI/Ramp/Deposit/Views/Modals/PaymentMethodSelectorModal/__snapshots__/PaymentMethodSelectorModal.test.tsx.snap
@@ -334,7 +334,7 @@ exports[`PaymentMethodSelectorModal Component renders correctly and matches snap
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -384,7 +384,7 @@ exports[`PaymentMethodSelectorModal Component renders correctly and matches snap
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -421,7 +421,7 @@ exports[`PaymentMethodSelectorModal Component renders correctly and matches snap
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -481,7 +481,7 @@ exports[`PaymentMethodSelectorModal Component renders correctly and matches snap
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 16,
                                         "fontWeight": 400,
@@ -559,7 +559,7 @@ exports[`PaymentMethodSelectorModal Component renders correctly and matches snap
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "height": 24,
                                           "width": 24,
                                         },
@@ -668,7 +668,7 @@ exports[`PaymentMethodSelectorModal Component renders correctly and matches snap
                                         testID="listitemcolumn"
                                       >
                                         <SvgMock
-                                          color="#121314"
+                                          color="#131416"
                                           fill="currentColor"
                                           height={20}
                                           name="Card"
@@ -702,9 +702,9 @@ exports[`PaymentMethodSelectorModal Component renders correctly and matches snap
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -734,7 +734,7 @@ exports[`PaymentMethodSelectorModal Component renders correctly and matches snap
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -752,7 +752,7 @@ exports[`PaymentMethodSelectorModal Component renders correctly and matches snap
                                     accessible={true}
                                     style={
                                       {
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "bottom": 0,
                                         "flexDirection": "row",
                                         "left": 0,
@@ -843,9 +843,9 @@ exports[`PaymentMethodSelectorModal Component renders correctly and matches snap
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -875,7 +875,7 @@ exports[`PaymentMethodSelectorModal Component renders correctly and matches snap
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
diff --git a/app/components/UI/Ramp/Deposit/Views/Modals/RegionSelectorModal/__snapshots__/RegionSelectorModal.test.tsx.snap b/app/components/UI/Ramp/Deposit/Views/Modals/RegionSelectorModal/__snapshots__/RegionSelectorModal.test.tsx.snap
index 32ed89494c89..ddfd97d4aab5 100644
--- a/app/components/UI/Ramp/Deposit/Views/Modals/RegionSelectorModal/__snapshots__/RegionSelectorModal.test.tsx.snap
+++ b/app/components/UI/Ramp/Deposit/Views/Modals/RegionSelectorModal/__snapshots__/RegionSelectorModal.test.tsx.snap
@@ -334,7 +334,7 @@ exports[`RegionSelectorModal Component handles empty regions array from navigati
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -384,7 +384,7 @@ exports[`RegionSelectorModal Component handles empty regions array from navigati
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -421,7 +421,7 @@ exports[`RegionSelectorModal Component handles empty regions array from navigati
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -481,7 +481,7 @@ exports[`RegionSelectorModal Component handles empty regions array from navigati
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 16,
                                         "fontWeight": 400,
@@ -559,7 +559,7 @@ exports[`RegionSelectorModal Component handles empty regions array from navigati
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "height": 24,
                                           "width": 24,
                                         },
@@ -612,8 +612,8 @@ exports[`RegionSelectorModal Component handles empty regions array from navigati
                               style={
                                 {
                                   "alignItems": "center",
-                                  "backgroundColor": "#3c4d9d0f",
-                                  "borderColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b528",
+                                  "borderColor": "#b4b4b566",
                                   "borderRadius": 24,
                                   "borderWidth": 1,
                                   "flexDirection": "row",
@@ -633,7 +633,7 @@ exports[`RegionSelectorModal Component handles empty regions array from navigati
                                 testID="textfield-startacccessory"
                               >
                                 <SvgMock
-                                  color="#686e7d"
+                                  color="#66676a"
                                   fill="currentColor"
                                   height={20}
                                   name="Search"
@@ -662,18 +662,19 @@ exports[`RegionSelectorModal Component handles empty regions array from navigati
                                   onChangeText={[Function]}
                                   onFocus={[Function]}
                                   placeholder="Search by country"
-                                  placeholderTextColor="#686e7d"
+                                  placeholderTextColor="#66676a"
                                   style={
                                     {
                                       "backgroundColor": "inherit",
                                       "borderColor": "transparent",
                                       "borderWidth": 1,
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "fontWeight": "400",
                                       "height": 46,
                                       "letterSpacing": 0,
+                                      "lineHeight": 0,
                                       "opacity": 1,
                                     }
                                   }
@@ -729,9 +730,9 @@ exports[`RegionSelectorModal Component handles empty regions array from navigati
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Medium",
-                                      "fontSize": 18,
+                                      "fontSize": 20,
                                       "letterSpacing": 0,
                                       "lineHeight": 24,
                                     }
@@ -1091,7 +1092,7 @@ exports[`RegionSelectorModal Component receives and uses regions from navigation
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -1141,7 +1142,7 @@ exports[`RegionSelectorModal Component receives and uses regions from navigation
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -1178,7 +1179,7 @@ exports[`RegionSelectorModal Component receives and uses regions from navigation
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -1238,7 +1239,7 @@ exports[`RegionSelectorModal Component receives and uses regions from navigation
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 16,
                                         "fontWeight": 400,
@@ -1316,7 +1317,7 @@ exports[`RegionSelectorModal Component receives and uses regions from navigation
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "height": 24,
                                           "width": 24,
                                         },
@@ -1369,8 +1370,8 @@ exports[`RegionSelectorModal Component receives and uses regions from navigation
                               style={
                                 {
                                   "alignItems": "center",
-                                  "backgroundColor": "#3c4d9d0f",
-                                  "borderColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b528",
+                                  "borderColor": "#b4b4b566",
                                   "borderRadius": 24,
                                   "borderWidth": 1,
                                   "flexDirection": "row",
@@ -1390,7 +1391,7 @@ exports[`RegionSelectorModal Component receives and uses regions from navigation
                                 testID="textfield-startacccessory"
                               >
                                 <SvgMock
-                                  color="#686e7d"
+                                  color="#66676a"
                                   fill="currentColor"
                                   height={20}
                                   name="Search"
@@ -1419,18 +1420,19 @@ exports[`RegionSelectorModal Component receives and uses regions from navigation
                                   onChangeText={[Function]}
                                   onFocus={[Function]}
                                   placeholder="Search by country"
-                                  placeholderTextColor="#686e7d"
+                                  placeholderTextColor="#66676a"
                                   style={
                                     {
                                       "backgroundColor": "inherit",
                                       "borderColor": "transparent",
                                       "borderWidth": 1,
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "fontWeight": "400",
                                       "height": 46,
                                       "letterSpacing": 0,
+                                      "lineHeight": 0,
                                       "opacity": 1,
                                     }
                                   }
@@ -1564,9 +1566,9 @@ exports[`RegionSelectorModal Component receives and uses regions from navigation
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Medium",
-                                                  "fontSize": 18,
+                                                  "fontSize": 20,
                                                   "letterSpacing": 0,
                                                   "lineHeight": 24,
                                                 }
@@ -1580,9 +1582,9 @@ exports[`RegionSelectorModal Component receives and uses regions from navigation
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Medium",
-                                                  "fontSize": 18,
+                                                  "fontSize": 20,
                                                   "letterSpacing": 0,
                                                   "lineHeight": 24,
                                                 }
@@ -1660,9 +1662,9 @@ exports[`RegionSelectorModal Component receives and uses regions from navigation
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Medium",
-                                                  "fontSize": 18,
+                                                  "fontSize": 20,
                                                   "letterSpacing": 0,
                                                   "lineHeight": 24,
                                                 }
@@ -1676,9 +1678,9 @@ exports[`RegionSelectorModal Component receives and uses regions from navigation
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Medium",
-                                                  "fontSize": 18,
+                                                  "fontSize": 20,
                                                   "letterSpacing": 0,
                                                   "lineHeight": 24,
                                                 }
@@ -2044,7 +2046,7 @@ exports[`RegionSelectorModal Component render matches snapshot 1`] = `
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -2094,7 +2096,7 @@ exports[`RegionSelectorModal Component render matches snapshot 1`] = `
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -2131,7 +2133,7 @@ exports[`RegionSelectorModal Component render matches snapshot 1`] = `
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -2191,7 +2193,7 @@ exports[`RegionSelectorModal Component render matches snapshot 1`] = `
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 16,
                                         "fontWeight": 400,
@@ -2269,7 +2271,7 @@ exports[`RegionSelectorModal Component render matches snapshot 1`] = `
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "height": 24,
                                           "width": 24,
                                         },
@@ -2322,8 +2324,8 @@ exports[`RegionSelectorModal Component render matches snapshot 1`] = `
                               style={
                                 {
                                   "alignItems": "center",
-                                  "backgroundColor": "#3c4d9d0f",
-                                  "borderColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b528",
+                                  "borderColor": "#b4b4b566",
                                   "borderRadius": 24,
                                   "borderWidth": 1,
                                   "flexDirection": "row",
@@ -2343,7 +2345,7 @@ exports[`RegionSelectorModal Component render matches snapshot 1`] = `
                                 testID="textfield-startacccessory"
                               >
                                 <SvgMock
-                                  color="#686e7d"
+                                  color="#66676a"
                                   fill="currentColor"
                                   height={20}
                                   name="Search"
@@ -2372,18 +2374,19 @@ exports[`RegionSelectorModal Component render matches snapshot 1`] = `
                                   onChangeText={[Function]}
                                   onFocus={[Function]}
                                   placeholder="Search by country"
-                                  placeholderTextColor="#686e7d"
+                                  placeholderTextColor="#66676a"
                                   style={
                                     {
                                       "backgroundColor": "inherit",
                                       "borderColor": "transparent",
                                       "borderWidth": 1,
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "fontWeight": "400",
                                       "height": 46,
                                       "letterSpacing": 0,
+                                      "lineHeight": 0,
                                       "opacity": 1,
                                     }
                                   }
@@ -2542,9 +2545,9 @@ exports[`RegionSelectorModal Component render matches snapshot 1`] = `
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Medium",
-                                                  "fontSize": 18,
+                                                  "fontSize": 20,
                                                   "letterSpacing": 0,
                                                   "lineHeight": 24,
                                                 }
@@ -2558,9 +2561,9 @@ exports[`RegionSelectorModal Component render matches snapshot 1`] = `
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Medium",
-                                                  "fontSize": 18,
+                                                  "fontSize": 20,
                                                   "letterSpacing": 0,
                                                   "lineHeight": 24,
                                                 }
@@ -2578,7 +2581,7 @@ exports[`RegionSelectorModal Component render matches snapshot 1`] = `
                                     accessible={true}
                                     style={
                                       {
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "bottom": 0,
                                         "flexDirection": "row",
                                         "left": 0,
@@ -2653,9 +2656,9 @@ exports[`RegionSelectorModal Component render matches snapshot 1`] = `
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Medium",
-                                                  "fontSize": 18,
+                                                  "fontSize": 20,
                                                   "letterSpacing": 0,
                                                   "lineHeight": 24,
                                                 }
@@ -2669,9 +2672,9 @@ exports[`RegionSelectorModal Component render matches snapshot 1`] = `
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Medium",
-                                                  "fontSize": 18,
+                                                  "fontSize": 20,
                                                   "letterSpacing": 0,
                                                   "lineHeight": 24,
                                                 }
@@ -2749,9 +2752,9 @@ exports[`RegionSelectorModal Component render matches snapshot 1`] = `
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#686e7d",
+                                                  "color": "#66676a",
                                                   "fontFamily": "Geist-Medium",
-                                                  "fontSize": 18,
+                                                  "fontSize": 20,
                                                   "letterSpacing": 0,
                                                   "lineHeight": 24,
                                                 }
@@ -2765,9 +2768,9 @@ exports[`RegionSelectorModal Component render matches snapshot 1`] = `
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#686e7d",
+                                                  "color": "#66676a",
                                                   "fontFamily": "Geist-Medium",
-                                                  "fontSize": 18,
+                                                  "fontSize": 20,
                                                   "letterSpacing": 0,
                                                   "lineHeight": 24,
                                                 }
@@ -2845,9 +2848,9 @@ exports[`RegionSelectorModal Component render matches snapshot 1`] = `
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Medium",
-                                                  "fontSize": 18,
+                                                  "fontSize": 20,
                                                   "letterSpacing": 0,
                                                   "lineHeight": 24,
                                                 }
@@ -2861,9 +2864,9 @@ exports[`RegionSelectorModal Component render matches snapshot 1`] = `
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Medium",
-                                                  "fontSize": 18,
+                                                  "fontSize": 20,
                                                   "letterSpacing": 0,
                                                   "lineHeight": 24,
                                                 }
@@ -3229,7 +3232,7 @@ exports[`RegionSelectorModal Component render matches snapshot when search has n
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -3279,7 +3282,7 @@ exports[`RegionSelectorModal Component render matches snapshot when search has n
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -3316,7 +3319,7 @@ exports[`RegionSelectorModal Component render matches snapshot when search has n
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -3376,7 +3379,7 @@ exports[`RegionSelectorModal Component render matches snapshot when search has n
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 16,
                                         "fontWeight": 400,
@@ -3454,7 +3457,7 @@ exports[`RegionSelectorModal Component render matches snapshot when search has n
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "height": 24,
                                           "width": 24,
                                         },
@@ -3507,8 +3510,8 @@ exports[`RegionSelectorModal Component render matches snapshot when search has n
                               style={
                                 {
                                   "alignItems": "center",
-                                  "backgroundColor": "#3c4d9d0f",
-                                  "borderColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b528",
+                                  "borderColor": "#b4b4b566",
                                   "borderRadius": 24,
                                   "borderWidth": 1,
                                   "flexDirection": "row",
@@ -3528,7 +3531,7 @@ exports[`RegionSelectorModal Component render matches snapshot when search has n
                                 testID="textfield-startacccessory"
                               >
                                 <SvgMock
-                                  color="#686e7d"
+                                  color="#66676a"
                                   fill="currentColor"
                                   height={20}
                                   name="Search"
@@ -3557,13 +3560,13 @@ exports[`RegionSelectorModal Component render matches snapshot when search has n
                                   onChangeText={[Function]}
                                   onFocus={[Function]}
                                   placeholder="Search by country"
-                                  placeholderTextColor="#686e7d"
+                                  placeholderTextColor="#66676a"
                                   style={
                                     {
                                       "backgroundColor": "inherit",
                                       "borderColor": "transparent",
                                       "borderWidth": 1,
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "fontWeight": "400",
@@ -3603,7 +3606,7 @@ exports[`RegionSelectorModal Component render matches snapshot when search has n
                                   }
                                 >
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={20}
                                     name="CircleX"
@@ -3665,9 +3668,9 @@ exports[`RegionSelectorModal Component render matches snapshot when search has n
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Medium",
-                                      "fontSize": 18,
+                                      "fontSize": 20,
                                       "letterSpacing": 0,
                                       "lineHeight": 24,
                                     }
@@ -4027,7 +4030,7 @@ exports[`RegionSelectorModal Component render matches snapshot when searching fo
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -4077,7 +4080,7 @@ exports[`RegionSelectorModal Component render matches snapshot when searching fo
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -4114,7 +4117,7 @@ exports[`RegionSelectorModal Component render matches snapshot when searching fo
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -4174,7 +4177,7 @@ exports[`RegionSelectorModal Component render matches snapshot when searching fo
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 16,
                                         "fontWeight": 400,
@@ -4252,7 +4255,7 @@ exports[`RegionSelectorModal Component render matches snapshot when searching fo
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "height": 24,
                                           "width": 24,
                                         },
@@ -4305,8 +4308,8 @@ exports[`RegionSelectorModal Component render matches snapshot when searching fo
                               style={
                                 {
                                   "alignItems": "center",
-                                  "backgroundColor": "#3c4d9d0f",
-                                  "borderColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b528",
+                                  "borderColor": "#b4b4b566",
                                   "borderRadius": 24,
                                   "borderWidth": 1,
                                   "flexDirection": "row",
@@ -4326,7 +4329,7 @@ exports[`RegionSelectorModal Component render matches snapshot when searching fo
                                 testID="textfield-startacccessory"
                               >
                                 <SvgMock
-                                  color="#686e7d"
+                                  color="#66676a"
                                   fill="currentColor"
                                   height={20}
                                   name="Search"
@@ -4355,13 +4358,13 @@ exports[`RegionSelectorModal Component render matches snapshot when searching fo
                                   onChangeText={[Function]}
                                   onFocus={[Function]}
                                   placeholder="Search by country"
-                                  placeholderTextColor="#686e7d"
+                                  placeholderTextColor="#66676a"
                                   style={
                                     {
                                       "backgroundColor": "inherit",
                                       "borderColor": "transparent",
                                       "borderWidth": 1,
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "fontWeight": "400",
@@ -4401,7 +4404,7 @@ exports[`RegionSelectorModal Component render matches snapshot when searching fo
                                   }
                                 >
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={20}
                                     name="CircleX"
@@ -4529,9 +4532,9 @@ exports[`RegionSelectorModal Component render matches snapshot when searching fo
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Medium",
-                                                  "fontSize": 18,
+                                                  "fontSize": 20,
                                                   "letterSpacing": 0,
                                                   "lineHeight": 24,
                                                 }
@@ -4545,9 +4548,9 @@ exports[`RegionSelectorModal Component render matches snapshot when searching fo
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Medium",
-                                                  "fontSize": 18,
+                                                  "fontSize": 20,
                                                   "letterSpacing": 0,
                                                   "lineHeight": 24,
                                                 }
@@ -4913,7 +4916,7 @@ exports[`RegionSelectorModal Component render matches snapshot with allRegionsSe
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -4963,7 +4966,7 @@ exports[`RegionSelectorModal Component render matches snapshot with allRegionsSe
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -5000,7 +5003,7 @@ exports[`RegionSelectorModal Component render matches snapshot with allRegionsSe
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -5060,7 +5063,7 @@ exports[`RegionSelectorModal Component render matches snapshot with allRegionsSe
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 16,
                                         "fontWeight": 400,
@@ -5138,7 +5141,7 @@ exports[`RegionSelectorModal Component render matches snapshot with allRegionsSe
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "height": 24,
                                           "width": 24,
                                         },
@@ -5191,8 +5194,8 @@ exports[`RegionSelectorModal Component render matches snapshot with allRegionsSe
                               style={
                                 {
                                   "alignItems": "center",
-                                  "backgroundColor": "#3c4d9d0f",
-                                  "borderColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b528",
+                                  "borderColor": "#b4b4b566",
                                   "borderRadius": 24,
                                   "borderWidth": 1,
                                   "flexDirection": "row",
@@ -5212,7 +5215,7 @@ exports[`RegionSelectorModal Component render matches snapshot with allRegionsSe
                                 testID="textfield-startacccessory"
                               >
                                 <SvgMock
-                                  color="#686e7d"
+                                  color="#66676a"
                                   fill="currentColor"
                                   height={20}
                                   name="Search"
@@ -5241,18 +5244,19 @@ exports[`RegionSelectorModal Component render matches snapshot with allRegionsSe
                                   onChangeText={[Function]}
                                   onFocus={[Function]}
                                   placeholder="Search by country"
-                                  placeholderTextColor="#686e7d"
+                                  placeholderTextColor="#66676a"
                                   style={
                                     {
                                       "backgroundColor": "inherit",
                                       "borderColor": "transparent",
                                       "borderWidth": 1,
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "fontWeight": "400",
                                       "height": 46,
                                       "letterSpacing": 0,
+                                      "lineHeight": 0,
                                       "opacity": 1,
                                     }
                                   }
@@ -5411,9 +5415,9 @@ exports[`RegionSelectorModal Component render matches snapshot with allRegionsSe
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Medium",
-                                                  "fontSize": 18,
+                                                  "fontSize": 20,
                                                   "letterSpacing": 0,
                                                   "lineHeight": 24,
                                                 }
@@ -5427,9 +5431,9 @@ exports[`RegionSelectorModal Component render matches snapshot with allRegionsSe
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Medium",
-                                                  "fontSize": 18,
+                                                  "fontSize": 20,
                                                   "letterSpacing": 0,
                                                   "lineHeight": 24,
                                                 }
@@ -5447,7 +5451,7 @@ exports[`RegionSelectorModal Component render matches snapshot with allRegionsSe
                                     accessible={true}
                                     style={
                                       {
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "bottom": 0,
                                         "flexDirection": "row",
                                         "left": 0,
@@ -5522,9 +5526,9 @@ exports[`RegionSelectorModal Component render matches snapshot with allRegionsSe
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Medium",
-                                                  "fontSize": 18,
+                                                  "fontSize": 20,
                                                   "letterSpacing": 0,
                                                   "lineHeight": 24,
                                                 }
@@ -5538,9 +5542,9 @@ exports[`RegionSelectorModal Component render matches snapshot with allRegionsSe
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Medium",
-                                                  "fontSize": 18,
+                                                  "fontSize": 20,
                                                   "letterSpacing": 0,
                                                   "lineHeight": 24,
                                                 }
@@ -5618,9 +5622,9 @@ exports[`RegionSelectorModal Component render matches snapshot with allRegionsSe
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Medium",
-                                                  "fontSize": 18,
+                                                  "fontSize": 20,
                                                   "letterSpacing": 0,
                                                   "lineHeight": 24,
                                                 }
@@ -5634,9 +5638,9 @@ exports[`RegionSelectorModal Component render matches snapshot with allRegionsSe
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Medium",
-                                                  "fontSize": 18,
+                                                  "fontSize": 20,
                                                   "letterSpacing": 0,
                                                   "lineHeight": 24,
                                                 }
@@ -5714,9 +5718,9 @@ exports[`RegionSelectorModal Component render matches snapshot with allRegionsSe
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Medium",
-                                                  "fontSize": 18,
+                                                  "fontSize": 20,
                                                   "letterSpacing": 0,
                                                   "lineHeight": 24,
                                                 }
@@ -5730,9 +5734,9 @@ exports[`RegionSelectorModal Component render matches snapshot with allRegionsSe
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Medium",
-                                                  "fontSize": 18,
+                                                  "fontSize": 20,
                                                   "letterSpacing": 0,
                                                   "lineHeight": 24,
                                                 }
@@ -6098,7 +6102,7 @@ exports[`RegionSelectorModal Component render matches snapshot with custom selec
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -6148,7 +6152,7 @@ exports[`RegionSelectorModal Component render matches snapshot with custom selec
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -6185,7 +6189,7 @@ exports[`RegionSelectorModal Component render matches snapshot with custom selec
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -6245,7 +6249,7 @@ exports[`RegionSelectorModal Component render matches snapshot with custom selec
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 16,
                                         "fontWeight": 400,
@@ -6323,7 +6327,7 @@ exports[`RegionSelectorModal Component render matches snapshot with custom selec
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "height": 24,
                                           "width": 24,
                                         },
@@ -6376,8 +6380,8 @@ exports[`RegionSelectorModal Component render matches snapshot with custom selec
                               style={
                                 {
                                   "alignItems": "center",
-                                  "backgroundColor": "#3c4d9d0f",
-                                  "borderColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b528",
+                                  "borderColor": "#b4b4b566",
                                   "borderRadius": 24,
                                   "borderWidth": 1,
                                   "flexDirection": "row",
@@ -6397,7 +6401,7 @@ exports[`RegionSelectorModal Component render matches snapshot with custom selec
                                 testID="textfield-startacccessory"
                               >
                                 <SvgMock
-                                  color="#686e7d"
+                                  color="#66676a"
                                   fill="currentColor"
                                   height={20}
                                   name="Search"
@@ -6426,18 +6430,19 @@ exports[`RegionSelectorModal Component render matches snapshot with custom selec
                                   onChangeText={[Function]}
                                   onFocus={[Function]}
                                   placeholder="Search by country"
-                                  placeholderTextColor="#686e7d"
+                                  placeholderTextColor="#66676a"
                                   style={
                                     {
                                       "backgroundColor": "inherit",
                                       "borderColor": "transparent",
                                       "borderWidth": 1,
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "fontWeight": "400",
                                       "height": 46,
                                       "letterSpacing": 0,
+                                      "lineHeight": 0,
                                       "opacity": 1,
                                     }
                                   }
@@ -6596,9 +6601,9 @@ exports[`RegionSelectorModal Component render matches snapshot with custom selec
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Medium",
-                                                  "fontSize": 18,
+                                                  "fontSize": 20,
                                                   "letterSpacing": 0,
                                                   "lineHeight": 24,
                                                 }
@@ -6612,9 +6617,9 @@ exports[`RegionSelectorModal Component render matches snapshot with custom selec
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Medium",
-                                                  "fontSize": 18,
+                                                  "fontSize": 20,
                                                   "letterSpacing": 0,
                                                   "lineHeight": 24,
                                                 }
@@ -6692,9 +6697,9 @@ exports[`RegionSelectorModal Component render matches snapshot with custom selec
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Medium",
-                                                  "fontSize": 18,
+                                                  "fontSize": 20,
                                                   "letterSpacing": 0,
                                                   "lineHeight": 24,
                                                 }
@@ -6708,9 +6713,9 @@ exports[`RegionSelectorModal Component render matches snapshot with custom selec
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Medium",
-                                                  "fontSize": 18,
+                                                  "fontSize": 20,
                                                   "letterSpacing": 0,
                                                   "lineHeight": 24,
                                                 }
@@ -6728,7 +6733,7 @@ exports[`RegionSelectorModal Component render matches snapshot with custom selec
                                     accessible={true}
                                     style={
                                       {
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "bottom": 0,
                                         "flexDirection": "row",
                                         "left": 0,
@@ -6803,9 +6808,9 @@ exports[`RegionSelectorModal Component render matches snapshot with custom selec
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#686e7d",
+                                                  "color": "#66676a",
                                                   "fontFamily": "Geist-Medium",
-                                                  "fontSize": 18,
+                                                  "fontSize": 20,
                                                   "letterSpacing": 0,
                                                   "lineHeight": 24,
                                                 }
@@ -6819,9 +6824,9 @@ exports[`RegionSelectorModal Component render matches snapshot with custom selec
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#686e7d",
+                                                  "color": "#66676a",
                                                   "fontFamily": "Geist-Medium",
-                                                  "fontSize": 18,
+                                                  "fontSize": 20,
                                                   "letterSpacing": 0,
                                                   "lineHeight": 24,
                                                 }
@@ -6899,9 +6904,9 @@ exports[`RegionSelectorModal Component render matches snapshot with custom selec
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Medium",
-                                                  "fontSize": 18,
+                                                  "fontSize": 20,
                                                   "letterSpacing": 0,
                                                   "lineHeight": 24,
                                                 }
@@ -6915,9 +6920,9 @@ exports[`RegionSelectorModal Component render matches snapshot with custom selec
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Medium",
-                                                  "fontSize": 18,
+                                                  "fontSize": 20,
                                                   "letterSpacing": 0,
                                                   "lineHeight": 24,
                                                 }
@@ -7283,7 +7288,7 @@ exports[`RegionSelectorModal Component sorts recommended regions to the top when
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -7333,7 +7338,7 @@ exports[`RegionSelectorModal Component sorts recommended regions to the top when
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -7370,7 +7375,7 @@ exports[`RegionSelectorModal Component sorts recommended regions to the top when
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -7430,7 +7435,7 @@ exports[`RegionSelectorModal Component sorts recommended regions to the top when
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 16,
                                         "fontWeight": 400,
@@ -7508,7 +7513,7 @@ exports[`RegionSelectorModal Component sorts recommended regions to the top when
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "height": 24,
                                           "width": 24,
                                         },
@@ -7561,8 +7566,8 @@ exports[`RegionSelectorModal Component sorts recommended regions to the top when
                               style={
                                 {
                                   "alignItems": "center",
-                                  "backgroundColor": "#3c4d9d0f",
-                                  "borderColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b528",
+                                  "borderColor": "#b4b4b566",
                                   "borderRadius": 24,
                                   "borderWidth": 1,
                                   "flexDirection": "row",
@@ -7582,7 +7587,7 @@ exports[`RegionSelectorModal Component sorts recommended regions to the top when
                                 testID="textfield-startacccessory"
                               >
                                 <SvgMock
-                                  color="#686e7d"
+                                  color="#66676a"
                                   fill="currentColor"
                                   height={20}
                                   name="Search"
@@ -7611,18 +7616,19 @@ exports[`RegionSelectorModal Component sorts recommended regions to the top when
                                   onChangeText={[Function]}
                                   onFocus={[Function]}
                                   placeholder="Search by country"
-                                  placeholderTextColor="#686e7d"
+                                  placeholderTextColor="#66676a"
                                   style={
                                     {
                                       "backgroundColor": "inherit",
                                       "borderColor": "transparent",
                                       "borderWidth": 1,
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "fontWeight": "400",
                                       "height": 46,
                                       "letterSpacing": 0,
+                                      "lineHeight": 0,
                                       "opacity": 1,
                                     }
                                   }
@@ -7781,9 +7787,9 @@ exports[`RegionSelectorModal Component sorts recommended regions to the top when
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Medium",
-                                                  "fontSize": 18,
+                                                  "fontSize": 20,
                                                   "letterSpacing": 0,
                                                   "lineHeight": 24,
                                                 }
@@ -7797,9 +7803,9 @@ exports[`RegionSelectorModal Component sorts recommended regions to the top when
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Medium",
-                                                  "fontSize": 18,
+                                                  "fontSize": 20,
                                                   "letterSpacing": 0,
                                                   "lineHeight": 24,
                                                 }
@@ -7817,7 +7823,7 @@ exports[`RegionSelectorModal Component sorts recommended regions to the top when
                                     accessible={true}
                                     style={
                                       {
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "bottom": 0,
                                         "flexDirection": "row",
                                         "left": 0,
@@ -7892,9 +7898,9 @@ exports[`RegionSelectorModal Component sorts recommended regions to the top when
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Medium",
-                                                  "fontSize": 18,
+                                                  "fontSize": 20,
                                                   "letterSpacing": 0,
                                                   "lineHeight": 24,
                                                 }
@@ -7908,9 +7914,9 @@ exports[`RegionSelectorModal Component sorts recommended regions to the top when
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Medium",
-                                                  "fontSize": 18,
+                                                  "fontSize": 20,
                                                   "letterSpacing": 0,
                                                   "lineHeight": 24,
                                                 }
@@ -7988,9 +7994,9 @@ exports[`RegionSelectorModal Component sorts recommended regions to the top when
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#686e7d",
+                                                  "color": "#66676a",
                                                   "fontFamily": "Geist-Medium",
-                                                  "fontSize": 18,
+                                                  "fontSize": 20,
                                                   "letterSpacing": 0,
                                                   "lineHeight": 24,
                                                 }
@@ -8004,9 +8010,9 @@ exports[`RegionSelectorModal Component sorts recommended regions to the top when
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#686e7d",
+                                                  "color": "#66676a",
                                                   "fontFamily": "Geist-Medium",
-                                                  "fontSize": 18,
+                                                  "fontSize": 20,
                                                   "letterSpacing": 0,
                                                   "lineHeight": 24,
                                                 }
@@ -8084,9 +8090,9 @@ exports[`RegionSelectorModal Component sorts recommended regions to the top when
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Medium",
-                                                  "fontSize": 18,
+                                                  "fontSize": 20,
                                                   "letterSpacing": 0,
                                                   "lineHeight": 24,
                                                 }
@@ -8100,9 +8106,9 @@ exports[`RegionSelectorModal Component sorts recommended regions to the top when
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Medium",
-                                                  "fontSize": 18,
+                                                  "fontSize": 20,
                                                   "letterSpacing": 0,
                                                   "lineHeight": 24,
                                                 }
diff --git a/app/components/UI/Ramp/Deposit/Views/Modals/SsnInfoModal/__snapshots__/SsnInfoModal.test.tsx.snap b/app/components/UI/Ramp/Deposit/Views/Modals/SsnInfoModal/__snapshots__/SsnInfoModal.test.tsx.snap
index 578645dcb7c2..073c2728036d 100644
--- a/app/components/UI/Ramp/Deposit/Views/Modals/SsnInfoModal/__snapshots__/SsnInfoModal.test.tsx.snap
+++ b/app/components/UI/Ramp/Deposit/Views/Modals/SsnInfoModal/__snapshots__/SsnInfoModal.test.tsx.snap
@@ -334,7 +334,7 @@ exports[`SsnInfoModal Component renders correctly and matches snapshot 1`] = `
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -384,7 +384,7 @@ exports[`SsnInfoModal Component renders correctly and matches snapshot 1`] = `
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -421,7 +421,7 @@ exports[`SsnInfoModal Component renders correctly and matches snapshot 1`] = `
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -481,7 +481,7 @@ exports[`SsnInfoModal Component renders correctly and matches snapshot 1`] = `
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 16,
                                         "fontWeight": 400,
@@ -559,7 +559,7 @@ exports[`SsnInfoModal Component renders correctly and matches snapshot 1`] = `
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "height": 24,
                                           "width": 24,
                                         },
@@ -583,7 +583,7 @@ exports[`SsnInfoModal Component renders correctly and matches snapshot 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
diff --git a/app/components/UI/Ramp/Deposit/Views/Modals/StateSelectorModal/__snapshots__/StateSelectorModal.test.tsx.snap b/app/components/UI/Ramp/Deposit/Views/Modals/StateSelectorModal/__snapshots__/StateSelectorModal.test.tsx.snap
index 0e1e20b7960c..30be8b664c91 100644
--- a/app/components/UI/Ramp/Deposit/Views/Modals/StateSelectorModal/__snapshots__/StateSelectorModal.test.tsx.snap
+++ b/app/components/UI/Ramp/Deposit/Views/Modals/StateSelectorModal/__snapshots__/StateSelectorModal.test.tsx.snap
@@ -334,7 +334,7 @@ exports[`StateSelectorModal Component Snapshot Tests renders cleared search stat
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -384,7 +384,7 @@ exports[`StateSelectorModal Component Snapshot Tests renders cleared search stat
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -421,7 +421,7 @@ exports[`StateSelectorModal Component Snapshot Tests renders cleared search stat
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -481,7 +481,7 @@ exports[`StateSelectorModal Component Snapshot Tests renders cleared search stat
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 16,
                                         "fontWeight": 400,
@@ -559,7 +559,7 @@ exports[`StateSelectorModal Component Snapshot Tests renders cleared search stat
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "height": 24,
                                           "width": 24,
                                         },
@@ -612,8 +612,8 @@ exports[`StateSelectorModal Component Snapshot Tests renders cleared search stat
                               style={
                                 {
                                   "alignItems": "center",
-                                  "backgroundColor": "#3c4d9d0f",
-                                  "borderColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b528",
+                                  "borderColor": "#b4b4b566",
                                   "borderRadius": 24,
                                   "borderWidth": 1,
                                   "flexDirection": "row",
@@ -633,7 +633,7 @@ exports[`StateSelectorModal Component Snapshot Tests renders cleared search stat
                                 testID="textfield-startacccessory"
                               >
                                 <SvgMock
-                                  color="#686e7d"
+                                  color="#66676a"
                                   fill="currentColor"
                                   height={20}
                                   name="Search"
@@ -662,13 +662,13 @@ exports[`StateSelectorModal Component Snapshot Tests renders cleared search stat
                                   onChangeText={[Function]}
                                   onFocus={[Function]}
                                   placeholder="Search by state"
-                                  placeholderTextColor="#686e7d"
+                                  placeholderTextColor="#66676a"
                                   style={
                                     {
                                       "backgroundColor": "inherit",
                                       "borderColor": "transparent",
                                       "borderWidth": 1,
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "fontWeight": "400",
@@ -708,7 +708,7 @@ exports[`StateSelectorModal Component Snapshot Tests renders cleared search stat
                                   }
                                 >
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={20}
                                     name="CircleX"
@@ -820,9 +820,9 @@ exports[`StateSelectorModal Component Snapshot Tests renders cleared search stat
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Medium",
-                                                "fontSize": 18,
+                                                "fontSize": 20,
                                                 "letterSpacing": 0,
                                                 "lineHeight": 24,
                                               }
@@ -1187,7 +1187,7 @@ exports[`StateSelectorModal Component Snapshot Tests renders empty state when no
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -1237,7 +1237,7 @@ exports[`StateSelectorModal Component Snapshot Tests renders empty state when no
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -1274,7 +1274,7 @@ exports[`StateSelectorModal Component Snapshot Tests renders empty state when no
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -1334,7 +1334,7 @@ exports[`StateSelectorModal Component Snapshot Tests renders empty state when no
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 16,
                                         "fontWeight": 400,
@@ -1412,7 +1412,7 @@ exports[`StateSelectorModal Component Snapshot Tests renders empty state when no
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "height": 24,
                                           "width": 24,
                                         },
@@ -1465,8 +1465,8 @@ exports[`StateSelectorModal Component Snapshot Tests renders empty state when no
                               style={
                                 {
                                   "alignItems": "center",
-                                  "backgroundColor": "#3c4d9d0f",
-                                  "borderColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b528",
+                                  "borderColor": "#b4b4b566",
                                   "borderRadius": 24,
                                   "borderWidth": 1,
                                   "flexDirection": "row",
@@ -1486,7 +1486,7 @@ exports[`StateSelectorModal Component Snapshot Tests renders empty state when no
                                 testID="textfield-startacccessory"
                               >
                                 <SvgMock
-                                  color="#686e7d"
+                                  color="#66676a"
                                   fill="currentColor"
                                   height={20}
                                   name="Search"
@@ -1515,13 +1515,13 @@ exports[`StateSelectorModal Component Snapshot Tests renders empty state when no
                                   onChangeText={[Function]}
                                   onFocus={[Function]}
                                   placeholder="Search by state"
-                                  placeholderTextColor="#686e7d"
+                                  placeholderTextColor="#66676a"
                                   style={
                                     {
                                       "backgroundColor": "inherit",
                                       "borderColor": "transparent",
                                       "borderWidth": 1,
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "fontWeight": "400",
@@ -1561,7 +1561,7 @@ exports[`StateSelectorModal Component Snapshot Tests renders empty state when no
                                   }
                                 >
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={20}
                                     name="CircleX"
@@ -1622,9 +1622,9 @@ exports[`StateSelectorModal Component Snapshot Tests renders empty state when no
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Medium",
-                                      "fontSize": 18,
+                                      "fontSize": 20,
                                       "letterSpacing": 0,
                                       "lineHeight": 24,
                                     }
@@ -1984,7 +1984,7 @@ exports[`StateSelectorModal Component Snapshot Tests renders filtered state when
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -2034,7 +2034,7 @@ exports[`StateSelectorModal Component Snapshot Tests renders filtered state when
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -2071,7 +2071,7 @@ exports[`StateSelectorModal Component Snapshot Tests renders filtered state when
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -2131,7 +2131,7 @@ exports[`StateSelectorModal Component Snapshot Tests renders filtered state when
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 16,
                                         "fontWeight": 400,
@@ -2209,7 +2209,7 @@ exports[`StateSelectorModal Component Snapshot Tests renders filtered state when
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "height": 24,
                                           "width": 24,
                                         },
@@ -2262,8 +2262,8 @@ exports[`StateSelectorModal Component Snapshot Tests renders filtered state when
                               style={
                                 {
                                   "alignItems": "center",
-                                  "backgroundColor": "#3c4d9d0f",
-                                  "borderColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b528",
+                                  "borderColor": "#b4b4b566",
                                   "borderRadius": 24,
                                   "borderWidth": 1,
                                   "flexDirection": "row",
@@ -2283,7 +2283,7 @@ exports[`StateSelectorModal Component Snapshot Tests renders filtered state when
                                 testID="textfield-startacccessory"
                               >
                                 <SvgMock
-                                  color="#686e7d"
+                                  color="#66676a"
                                   fill="currentColor"
                                   height={20}
                                   name="Search"
@@ -2312,13 +2312,13 @@ exports[`StateSelectorModal Component Snapshot Tests renders filtered state when
                                   onChangeText={[Function]}
                                   onFocus={[Function]}
                                   placeholder="Search by state"
-                                  placeholderTextColor="#686e7d"
+                                  placeholderTextColor="#66676a"
                                   style={
                                     {
                                       "backgroundColor": "inherit",
                                       "borderColor": "transparent",
                                       "borderWidth": 1,
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "fontWeight": "400",
@@ -2358,7 +2358,7 @@ exports[`StateSelectorModal Component Snapshot Tests renders filtered state when
                                   }
                                 >
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={20}
                                     name="CircleX"
@@ -2470,9 +2470,9 @@ exports[`StateSelectorModal Component Snapshot Tests renders filtered state when
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Medium",
-                                                "fontSize": 18,
+                                                "fontSize": 20,
                                                 "letterSpacing": 0,
                                                 "lineHeight": 24,
                                               }
@@ -2837,7 +2837,7 @@ exports[`StateSelectorModal Component Snapshot Tests renders filtered state when
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -2887,7 +2887,7 @@ exports[`StateSelectorModal Component Snapshot Tests renders filtered state when
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -2924,7 +2924,7 @@ exports[`StateSelectorModal Component Snapshot Tests renders filtered state when
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -2984,7 +2984,7 @@ exports[`StateSelectorModal Component Snapshot Tests renders filtered state when
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 16,
                                         "fontWeight": 400,
@@ -3062,7 +3062,7 @@ exports[`StateSelectorModal Component Snapshot Tests renders filtered state when
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "height": 24,
                                           "width": 24,
                                         },
@@ -3115,8 +3115,8 @@ exports[`StateSelectorModal Component Snapshot Tests renders filtered state when
                               style={
                                 {
                                   "alignItems": "center",
-                                  "backgroundColor": "#3c4d9d0f",
-                                  "borderColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b528",
+                                  "borderColor": "#b4b4b566",
                                   "borderRadius": 24,
                                   "borderWidth": 1,
                                   "flexDirection": "row",
@@ -3136,7 +3136,7 @@ exports[`StateSelectorModal Component Snapshot Tests renders filtered state when
                                 testID="textfield-startacccessory"
                               >
                                 <SvgMock
-                                  color="#686e7d"
+                                  color="#66676a"
                                   fill="currentColor"
                                   height={20}
                                   name="Search"
@@ -3165,13 +3165,13 @@ exports[`StateSelectorModal Component Snapshot Tests renders filtered state when
                                   onChangeText={[Function]}
                                   onFocus={[Function]}
                                   placeholder="Search by state"
-                                  placeholderTextColor="#686e7d"
+                                  placeholderTextColor="#66676a"
                                   style={
                                     {
                                       "backgroundColor": "inherit",
                                       "borderColor": "transparent",
                                       "borderWidth": 1,
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "fontWeight": "400",
@@ -3211,7 +3211,7 @@ exports[`StateSelectorModal Component Snapshot Tests renders filtered state when
                                   }
                                 >
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={20}
                                     name="CircleX"
@@ -3323,9 +3323,9 @@ exports[`StateSelectorModal Component Snapshot Tests renders filtered state when
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Medium",
-                                                "fontSize": 18,
+                                                "fontSize": 20,
                                                 "letterSpacing": 0,
                                                 "lineHeight": 24,
                                               }
@@ -3690,7 +3690,7 @@ exports[`StateSelectorModal Component Snapshot Tests renders initial state corre
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -3740,7 +3740,7 @@ exports[`StateSelectorModal Component Snapshot Tests renders initial state corre
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -3777,7 +3777,7 @@ exports[`StateSelectorModal Component Snapshot Tests renders initial state corre
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -3837,7 +3837,7 @@ exports[`StateSelectorModal Component Snapshot Tests renders initial state corre
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 16,
                                         "fontWeight": 400,
@@ -3915,7 +3915,7 @@ exports[`StateSelectorModal Component Snapshot Tests renders initial state corre
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "height": 24,
                                           "width": 24,
                                         },
@@ -3968,8 +3968,8 @@ exports[`StateSelectorModal Component Snapshot Tests renders initial state corre
                               style={
                                 {
                                   "alignItems": "center",
-                                  "backgroundColor": "#3c4d9d0f",
-                                  "borderColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b528",
+                                  "borderColor": "#b4b4b566",
                                   "borderRadius": 24,
                                   "borderWidth": 1,
                                   "flexDirection": "row",
@@ -3989,7 +3989,7 @@ exports[`StateSelectorModal Component Snapshot Tests renders initial state corre
                                 testID="textfield-startacccessory"
                               >
                                 <SvgMock
-                                  color="#686e7d"
+                                  color="#66676a"
                                   fill="currentColor"
                                   height={20}
                                   name="Search"
@@ -4018,18 +4018,19 @@ exports[`StateSelectorModal Component Snapshot Tests renders initial state corre
                                   onChangeText={[Function]}
                                   onFocus={[Function]}
                                   placeholder="Search by state"
-                                  placeholderTextColor="#686e7d"
+                                  placeholderTextColor="#66676a"
                                   style={
                                     {
                                       "backgroundColor": "inherit",
                                       "borderColor": "transparent",
                                       "borderWidth": 1,
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "fontWeight": "400",
                                       "height": 46,
                                       "letterSpacing": 0,
+                                      "lineHeight": 0,
                                       "opacity": 1,
                                     }
                                   }
@@ -4151,9 +4152,9 @@ exports[`StateSelectorModal Component Snapshot Tests renders initial state corre
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Medium",
-                                                "fontSize": 18,
+                                                "fontSize": 20,
                                                 "letterSpacing": 0,
                                                 "lineHeight": 24,
                                               }
@@ -4223,9 +4224,9 @@ exports[`StateSelectorModal Component Snapshot Tests renders initial state corre
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Medium",
-                                                "fontSize": 18,
+                                                "fontSize": 20,
                                                 "letterSpacing": 0,
                                                 "lineHeight": 24,
                                               }
@@ -4295,9 +4296,9 @@ exports[`StateSelectorModal Component Snapshot Tests renders initial state corre
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Medium",
-                                                "fontSize": 18,
+                                                "fontSize": 20,
                                                 "letterSpacing": 0,
                                                 "lineHeight": 24,
                                               }
@@ -4367,9 +4368,9 @@ exports[`StateSelectorModal Component Snapshot Tests renders initial state corre
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Medium",
-                                                "fontSize": 18,
+                                                "fontSize": 20,
                                                 "letterSpacing": 0,
                                                 "lineHeight": 24,
                                               }
@@ -4439,9 +4440,9 @@ exports[`StateSelectorModal Component Snapshot Tests renders initial state corre
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Medium",
-                                                "fontSize": 18,
+                                                "fontSize": 20,
                                                 "letterSpacing": 0,
                                                 "lineHeight": 24,
                                               }
@@ -4806,7 +4807,7 @@ exports[`StateSelectorModal Component Snapshot Tests renders partial search resu
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -4856,7 +4857,7 @@ exports[`StateSelectorModal Component Snapshot Tests renders partial search resu
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -4893,7 +4894,7 @@ exports[`StateSelectorModal Component Snapshot Tests renders partial search resu
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -4953,7 +4954,7 @@ exports[`StateSelectorModal Component Snapshot Tests renders partial search resu
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 16,
                                         "fontWeight": 400,
@@ -5031,7 +5032,7 @@ exports[`StateSelectorModal Component Snapshot Tests renders partial search resu
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "height": 24,
                                           "width": 24,
                                         },
@@ -5084,8 +5085,8 @@ exports[`StateSelectorModal Component Snapshot Tests renders partial search resu
                               style={
                                 {
                                   "alignItems": "center",
-                                  "backgroundColor": "#3c4d9d0f",
-                                  "borderColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b528",
+                                  "borderColor": "#b4b4b566",
                                   "borderRadius": 24,
                                   "borderWidth": 1,
                                   "flexDirection": "row",
@@ -5105,7 +5106,7 @@ exports[`StateSelectorModal Component Snapshot Tests renders partial search resu
                                 testID="textfield-startacccessory"
                               >
                                 <SvgMock
-                                  color="#686e7d"
+                                  color="#66676a"
                                   fill="currentColor"
                                   height={20}
                                   name="Search"
@@ -5134,13 +5135,13 @@ exports[`StateSelectorModal Component Snapshot Tests renders partial search resu
                                   onChangeText={[Function]}
                                   onFocus={[Function]}
                                   placeholder="Search by state"
-                                  placeholderTextColor="#686e7d"
+                                  placeholderTextColor="#66676a"
                                   style={
                                     {
                                       "backgroundColor": "inherit",
                                       "borderColor": "transparent",
                                       "borderWidth": 1,
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "fontWeight": "400",
@@ -5180,7 +5181,7 @@ exports[`StateSelectorModal Component Snapshot Tests renders partial search resu
                                   }
                                 >
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={20}
                                     name="CircleX"
@@ -5292,9 +5293,9 @@ exports[`StateSelectorModal Component Snapshot Tests renders partial search resu
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Medium",
-                                                "fontSize": 18,
+                                                "fontSize": 20,
                                                 "letterSpacing": 0,
                                                 "lineHeight": 24,
                                               }
diff --git a/app/components/UI/Ramp/Deposit/Views/Modals/TokenSelectorModal/__snapshots__/TokenSelectorModal.test.tsx.snap b/app/components/UI/Ramp/Deposit/Views/Modals/TokenSelectorModal/__snapshots__/TokenSelectorModal.test.tsx.snap
index a4f256ed8767..f973748df949 100644
--- a/app/components/UI/Ramp/Deposit/Views/Modals/TokenSelectorModal/__snapshots__/TokenSelectorModal.test.tsx.snap
+++ b/app/components/UI/Ramp/Deposit/Views/Modals/TokenSelectorModal/__snapshots__/TokenSelectorModal.test.tsx.snap
@@ -334,7 +334,7 @@ exports[`TokenSelectorModal Component displays empty state when no tokens match
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -384,7 +384,7 @@ exports[`TokenSelectorModal Component displays empty state when no tokens match
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -421,7 +421,7 @@ exports[`TokenSelectorModal Component displays empty state when no tokens match
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -481,7 +481,7 @@ exports[`TokenSelectorModal Component displays empty state when no tokens match
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 16,
                                         "fontWeight": 400,
@@ -559,7 +559,7 @@ exports[`TokenSelectorModal Component displays empty state when no tokens match
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "height": 24,
                                           "width": 24,
                                         },
@@ -599,7 +599,7 @@ exports[`TokenSelectorModal Component displays empty state when no tokens match
                                   {
                                     "alignItems": "center",
                                     "alignSelf": "flex-start",
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "borderColor": "transparent",
                                     "borderRadius": 12,
                                     "borderWidth": 1,
@@ -730,7 +730,7 @@ exports[`TokenSelectorModal Component displays empty state when no tokens match
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -741,7 +741,7 @@ exports[`TokenSelectorModal Component displays empty state when no tokens match
                                     All networks
                                   </Text>
                                   <SvgMock
-                                    color="#121314"
+                                    color="#131416"
                                     fill="currentColor"
                                     height={12}
                                     name="ArrowDown"
@@ -798,8 +798,8 @@ exports[`TokenSelectorModal Component displays empty state when no tokens match
                               style={
                                 {
                                   "alignItems": "center",
-                                  "backgroundColor": "#3c4d9d0f",
-                                  "borderColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b528",
+                                  "borderColor": "#b4b4b566",
                                   "borderRadius": 24,
                                   "borderWidth": 1,
                                   "flexDirection": "row",
@@ -819,7 +819,7 @@ exports[`TokenSelectorModal Component displays empty state when no tokens match
                                 testID="textfield-startacccessory"
                               >
                                 <SvgMock
-                                  color="#686e7d"
+                                  color="#66676a"
                                   fill="currentColor"
                                   height={20}
                                   name="Search"
@@ -848,13 +848,13 @@ exports[`TokenSelectorModal Component displays empty state when no tokens match
                                   onChangeText={[Function]}
                                   onFocus={[Function]}
                                   placeholder="Search token by name or address"
-                                  placeholderTextColor="#686e7d"
+                                  placeholderTextColor="#66676a"
                                   style={
                                     {
                                       "backgroundColor": "inherit",
                                       "borderColor": "transparent",
                                       "borderWidth": 1,
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "fontWeight": "400",
@@ -894,7 +894,7 @@ exports[`TokenSelectorModal Component displays empty state when no tokens match
                                   }
                                 >
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={20}
                                     name="CircleX"
@@ -976,9 +976,9 @@ exports[`TokenSelectorModal Component displays empty state when no tokens match
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Medium",
-                                          "fontSize": 18,
+                                          "fontSize": 20,
                                           "letterSpacing": 0,
                                           "lineHeight": 24,
                                         }
@@ -1340,7 +1340,7 @@ exports[`TokenSelectorModal Component displays network filter selector when pres
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -1390,7 +1390,7 @@ exports[`TokenSelectorModal Component displays network filter selector when pres
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -1427,7 +1427,7 @@ exports[`TokenSelectorModal Component displays network filter selector when pres
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -1487,7 +1487,7 @@ exports[`TokenSelectorModal Component displays network filter selector when pres
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 16,
                                         "fontWeight": 400,
@@ -1565,7 +1565,7 @@ exports[`TokenSelectorModal Component displays network filter selector when pres
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "height": 24,
                                           "width": 24,
                                         },
@@ -1801,7 +1801,7 @@ exports[`TokenSelectorModal Component displays network filter selector when pres
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -1968,7 +1968,7 @@ exports[`TokenSelectorModal Component displays network filter selector when pres
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -2135,7 +2135,7 @@ exports[`TokenSelectorModal Component displays network filter selector when pres
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -2171,7 +2171,7 @@ exports[`TokenSelectorModal Component displays network filter selector when pres
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
@@ -2546,7 +2546,7 @@ exports[`TokenSelectorModal Component renders correctly and matches snapshot 1`]
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -2596,7 +2596,7 @@ exports[`TokenSelectorModal Component renders correctly and matches snapshot 1`]
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -2633,7 +2633,7 @@ exports[`TokenSelectorModal Component renders correctly and matches snapshot 1`]
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -2693,7 +2693,7 @@ exports[`TokenSelectorModal Component renders correctly and matches snapshot 1`]
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 16,
                                         "fontWeight": 400,
@@ -2771,7 +2771,7 @@ exports[`TokenSelectorModal Component renders correctly and matches snapshot 1`]
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "height": 24,
                                           "width": 24,
                                         },
@@ -2811,7 +2811,7 @@ exports[`TokenSelectorModal Component renders correctly and matches snapshot 1`]
                                   {
                                     "alignItems": "center",
                                     "alignSelf": "flex-start",
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "borderColor": "transparent",
                                     "borderRadius": 12,
                                     "borderWidth": 1,
@@ -2942,7 +2942,7 @@ exports[`TokenSelectorModal Component renders correctly and matches snapshot 1`]
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -2953,7 +2953,7 @@ exports[`TokenSelectorModal Component renders correctly and matches snapshot 1`]
                                     All networks
                                   </Text>
                                   <SvgMock
-                                    color="#121314"
+                                    color="#131416"
                                     fill="currentColor"
                                     height={12}
                                     name="ArrowDown"
@@ -3010,8 +3010,8 @@ exports[`TokenSelectorModal Component renders correctly and matches snapshot 1`]
                               style={
                                 {
                                   "alignItems": "center",
-                                  "backgroundColor": "#3c4d9d0f",
-                                  "borderColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b528",
+                                  "borderColor": "#b4b4b566",
                                   "borderRadius": 24,
                                   "borderWidth": 1,
                                   "flexDirection": "row",
@@ -3031,7 +3031,7 @@ exports[`TokenSelectorModal Component renders correctly and matches snapshot 1`]
                                 testID="textfield-startacccessory"
                               >
                                 <SvgMock
-                                  color="#686e7d"
+                                  color="#66676a"
                                   fill="currentColor"
                                   height={20}
                                   name="Search"
@@ -3060,18 +3060,19 @@ exports[`TokenSelectorModal Component renders correctly and matches snapshot 1`]
                                   onChangeText={[Function]}
                                   onFocus={[Function]}
                                   placeholder="Search token by name or address"
-                                  placeholderTextColor="#686e7d"
+                                  placeholderTextColor="#66676a"
                                   style={
                                     {
                                       "backgroundColor": "inherit",
                                       "borderColor": "transparent",
                                       "borderWidth": 1,
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "fontWeight": "400",
                                       "height": 46,
                                       "letterSpacing": 0,
+                                      "lineHeight": 0,
                                       "opacity": 1,
                                     }
                                   }
@@ -3345,9 +3346,9 @@ exports[`TokenSelectorModal Component renders correctly and matches snapshot 1`]
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -3359,7 +3360,7 @@ exports[`TokenSelectorModal Component renders correctly and matches snapshot 1`]
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -3377,7 +3378,7 @@ exports[`TokenSelectorModal Component renders correctly and matches snapshot 1`]
                                     accessible={true}
                                     style={
                                       {
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "bottom": 0,
                                         "flexDirection": "row",
                                         "left": 0,
@@ -3574,9 +3575,9 @@ exports[`TokenSelectorModal Component renders correctly and matches snapshot 1`]
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -3588,7 +3589,7 @@ exports[`TokenSelectorModal Component renders correctly and matches snapshot 1`]
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -3788,9 +3789,9 @@ exports[`TokenSelectorModal Component renders correctly and matches snapshot 1`]
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -3802,7 +3803,7 @@ exports[`TokenSelectorModal Component renders correctly and matches snapshot 1`]
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -4002,9 +4003,9 @@ exports[`TokenSelectorModal Component renders correctly and matches snapshot 1`]
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -4016,7 +4017,7 @@ exports[`TokenSelectorModal Component renders correctly and matches snapshot 1`]
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -4216,9 +4217,9 @@ exports[`TokenSelectorModal Component renders correctly and matches snapshot 1`]
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -4230,7 +4231,7 @@ exports[`TokenSelectorModal Component renders correctly and matches snapshot 1`]
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
diff --git a/app/components/UI/Ramp/Deposit/Views/Modals/UnsupportedRegionModal/__snapshots__/UnsupportedRegionModal.test.tsx.snap b/app/components/UI/Ramp/Deposit/Views/Modals/UnsupportedRegionModal/__snapshots__/UnsupportedRegionModal.test.tsx.snap
index 464ad1cb4d6f..9eb1fa59b865 100644
--- a/app/components/UI/Ramp/Deposit/Views/Modals/UnsupportedRegionModal/__snapshots__/UnsupportedRegionModal.test.tsx.snap
+++ b/app/components/UI/Ramp/Deposit/Views/Modals/UnsupportedRegionModal/__snapshots__/UnsupportedRegionModal.test.tsx.snap
@@ -334,7 +334,7 @@ exports[`UnsupportedRegionModal handles missing region gracefully 1`] = `
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -384,7 +384,7 @@ exports[`UnsupportedRegionModal handles missing region gracefully 1`] = `
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -449,9 +449,9 @@ exports[`UnsupportedRegionModal handles missing region gracefully 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Bold",
-                                    "fontSize": 18,
+                                    "fontSize": 20,
                                     "letterSpacing": 0,
                                     "lineHeight": 24,
                                   }
@@ -483,7 +483,7 @@ exports[`UnsupportedRegionModal handles missing region gracefully 1`] = `
                                   }
                                 >
                                   <SvgMock
-                                    color="#121314"
+                                    color="#131416"
                                     fill="currentColor"
                                     height={24}
                                     name="Close"
@@ -510,7 +510,7 @@ exports[`UnsupportedRegionModal handles missing region gracefully 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -533,7 +533,7 @@ exports[`UnsupportedRegionModal handles missing region gracefully 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -545,7 +545,7 @@ exports[`UnsupportedRegionModal handles missing region gracefully 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -559,7 +559,7 @@ exports[`UnsupportedRegionModal handles missing region gracefully 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#686e7d",
+                                  "color": "#66676a",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -629,7 +629,7 @@ exports[`UnsupportedRegionModal handles missing region gracefully 1`] = `
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
@@ -1004,7 +1004,7 @@ exports[`UnsupportedRegionModal render match snapshot 1`] = `
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -1054,7 +1054,7 @@ exports[`UnsupportedRegionModal render match snapshot 1`] = `
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -1119,9 +1119,9 @@ exports[`UnsupportedRegionModal render match snapshot 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Bold",
-                                    "fontSize": 18,
+                                    "fontSize": 20,
                                     "letterSpacing": 0,
                                     "lineHeight": 24,
                                   }
@@ -1153,7 +1153,7 @@ exports[`UnsupportedRegionModal render match snapshot 1`] = `
                                   }
                                 >
                                   <SvgMock
-                                    color="#121314"
+                                    color="#131416"
                                     fill="currentColor"
                                     height={24}
                                     name="Close"
@@ -1180,7 +1180,7 @@ exports[`UnsupportedRegionModal render match snapshot 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -1203,7 +1203,7 @@ exports[`UnsupportedRegionModal render match snapshot 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -1217,7 +1217,7 @@ exports[`UnsupportedRegionModal render match snapshot 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -1233,7 +1233,7 @@ exports[`UnsupportedRegionModal render match snapshot 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#686e7d",
+                                  "color": "#66676a",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -1303,7 +1303,7 @@ exports[`UnsupportedRegionModal render match snapshot 1`] = `
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
diff --git a/app/components/UI/Ramp/Deposit/Views/Modals/UnsupportedStateModal/__snapshots__/UnsupportedStateModal.test.tsx.snap b/app/components/UI/Ramp/Deposit/Views/Modals/UnsupportedStateModal/__snapshots__/UnsupportedStateModal.test.tsx.snap
index 7f1669ba6125..a422fb5d9f62 100644
--- a/app/components/UI/Ramp/Deposit/Views/Modals/UnsupportedStateModal/__snapshots__/UnsupportedStateModal.test.tsx.snap
+++ b/app/components/UI/Ramp/Deposit/Views/Modals/UnsupportedStateModal/__snapshots__/UnsupportedStateModal.test.tsx.snap
@@ -334,7 +334,7 @@ exports[`UnsupportedStateModal render match snapshot 1`] = `
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -384,7 +384,7 @@ exports[`UnsupportedStateModal render match snapshot 1`] = `
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -449,9 +449,9 @@ exports[`UnsupportedStateModal render match snapshot 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Bold",
-                                    "fontSize": 18,
+                                    "fontSize": 20,
                                     "letterSpacing": 0,
                                     "lineHeight": 24,
                                   }
@@ -483,7 +483,7 @@ exports[`UnsupportedStateModal render match snapshot 1`] = `
                                   }
                                 >
                                   <SvgMock
-                                    color="#121314"
+                                    color="#131416"
                                     fill="currentColor"
                                     height={24}
                                     name="Close"
@@ -510,7 +510,7 @@ exports[`UnsupportedStateModal render match snapshot 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -534,7 +534,7 @@ exports[`UnsupportedStateModal render match snapshot 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -548,7 +548,7 @@ exports[`UnsupportedStateModal render match snapshot 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -563,7 +563,7 @@ exports[`UnsupportedStateModal render match snapshot 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#686e7d",
+                                  "color": "#66676a",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -633,7 +633,7 @@ exports[`UnsupportedStateModal render match snapshot 1`] = `
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
diff --git a/app/components/UI/Ramp/Deposit/Views/Modals/WebviewModal/__snapshots__/WebviewModal.test.tsx.snap b/app/components/UI/Ramp/Deposit/Views/Modals/WebviewModal/__snapshots__/WebviewModal.test.tsx.snap
index b4d56fbcc24b..0610149010fa 100644
--- a/app/components/UI/Ramp/Deposit/Views/Modals/WebviewModal/__snapshots__/WebviewModal.test.tsx.snap
+++ b/app/components/UI/Ramp/Deposit/Views/Modals/WebviewModal/__snapshots__/WebviewModal.test.tsx.snap
@@ -334,7 +334,7 @@ exports[`WebviewModal Component renders correctly and matches snapshot 1`] = `
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -384,7 +384,7 @@ exports[`WebviewModal Component renders correctly and matches snapshot 1`] = `
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -422,7 +422,7 @@ exports[`WebviewModal Component renders correctly and matches snapshot 1`] = `
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -529,7 +529,7 @@ exports[`WebviewModal Component renders correctly and matches snapshot 1`] = `
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "height": 24,
                                           "width": 24,
                                         },
@@ -928,7 +928,7 @@ exports[`WebviewModal Component should display error view when webview HTTP erro
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -978,7 +978,7 @@ exports[`WebviewModal Component should display error view when webview HTTP erro
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -1016,7 +1016,7 @@ exports[`WebviewModal Component should display error view when webview HTTP erro
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -1123,7 +1123,7 @@ exports[`WebviewModal Component should display error view when webview HTTP erro
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "height": 24,
                                           "width": 24,
                                         },
@@ -1246,7 +1246,7 @@ exports[`WebviewModal Component should display error view when webview HTTP erro
                                           {
                                             "color": "#ca3542",
                                             "fontFamily": "Geist-Bold",
-                                            "fontSize": 18,
+                                            "fontSize": 20,
                                             "letterSpacing": 0,
                                             "lineHeight": 24,
                                             "textAlign": "center",
@@ -1259,7 +1259,7 @@ exports[`WebviewModal Component should display error view when webview HTTP erro
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#686e7d",
+                                            "color": "#66676a",
                                             "fontFamily": "Geist-Regular",
                                             "fontSize": 16,
                                             "letterSpacing": 0,
diff --git a/app/components/UI/Ramp/Deposit/Views/OrderProcessing/__snapshots__/OrderProcessing.test.tsx.snap b/app/components/UI/Ramp/Deposit/Views/OrderProcessing/__snapshots__/OrderProcessing.test.tsx.snap
index 3ceb2e34fb43..49d826e2e626 100644
--- a/app/components/UI/Ramp/Deposit/Views/OrderProcessing/__snapshots__/OrderProcessing.test.tsx.snap
+++ b/app/components/UI/Ramp/Deposit/Views/OrderProcessing/__snapshots__/OrderProcessing.test.tsx.snap
@@ -226,7 +226,7 @@ exports[`OrderProcessing Component renders created state correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 40,
                 "letterSpacing": 0,
@@ -245,7 +245,7 @@ exports[`OrderProcessing Component renders created state correctly 1`] = `
           style={
             {
               "backgroundColor": "#ffffff",
-              "borderColor": "#b7bbc866",
+              "borderColor": "#b4b4b566",
               "borderRadius": 8,
               "borderWidth": 1,
               "marginBottom": 16,
@@ -268,7 +268,7 @@ exports[`OrderProcessing Component renders created state correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -282,7 +282,7 @@ exports[`OrderProcessing Component renders created state correctly 1`] = `
               style={
                 {
                   "alignItems": "center",
-                  "backgroundColor": "#3c4d9d0f",
+                  "backgroundColor": "#b4b4b528",
                   "borderRadius": 36,
                   "flexDirection": "row",
                   "gap": 4,
@@ -295,7 +295,7 @@ exports[`OrderProcessing Component renders created state correctly 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -319,7 +319,7 @@ exports[`OrderProcessing Component renders created state correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -354,7 +354,7 @@ exports[`OrderProcessing Component renders created state correctly 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -380,7 +380,7 @@ exports[`OrderProcessing Component renders created state correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -404,7 +404,7 @@ exports[`OrderProcessing Component renders created state correctly 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -416,7 +416,7 @@ exports[`OrderProcessing Component renders created state correctly 1`] = `
                 der-id
               </Text>
               <SvgMock
-                color="#121314"
+                color="#131416"
                 fill="currentColor"
                 height={24}
                 name="Copy"
@@ -433,7 +433,7 @@ exports[`OrderProcessing Component renders created state correctly 1`] = `
           <View
             style={
               {
-                "backgroundColor": "#b7bbc866",
+                "backgroundColor": "#b4b4b566",
                 "height": 1,
                 "marginHorizontal": -16,
                 "marginVertical": 8,
@@ -454,7 +454,7 @@ exports[`OrderProcessing Component renders created state correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -468,7 +468,7 @@ exports[`OrderProcessing Component renders created state correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -493,7 +493,7 @@ exports[`OrderProcessing Component renders created state correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -507,7 +507,7 @@ exports[`OrderProcessing Component renders created state correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -560,7 +560,7 @@ exports[`OrderProcessing Component renders created state correctly 1`] = `
                 {
                   "alignItems": "center",
                   "alignSelf": "flex-start",
-                  "backgroundColor": "#121314",
+                  "backgroundColor": "#131416",
                   "borderRadius": 12,
                   "flex": 1,
                   "flexDirection": "row",
@@ -817,7 +817,7 @@ exports[`OrderProcessing Component renders error state correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 40,
                 "letterSpacing": 0,
@@ -836,7 +836,7 @@ exports[`OrderProcessing Component renders error state correctly 1`] = `
           style={
             {
               "backgroundColor": "#ffffff",
-              "borderColor": "#b7bbc866",
+              "borderColor": "#b4b4b566",
               "borderRadius": 8,
               "borderWidth": 1,
               "marginBottom": 16,
@@ -859,7 +859,7 @@ exports[`OrderProcessing Component renders error state correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -873,7 +873,7 @@ exports[`OrderProcessing Component renders error state correctly 1`] = `
               style={
                 {
                   "alignItems": "center",
-                  "backgroundColor": "#3c4d9d0f",
+                  "backgroundColor": "#b4b4b528",
                   "borderRadius": 36,
                   "flexDirection": "row",
                   "gap": 4,
@@ -886,7 +886,7 @@ exports[`OrderProcessing Component renders error state correctly 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -910,7 +910,7 @@ exports[`OrderProcessing Component renders error state correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -945,7 +945,7 @@ exports[`OrderProcessing Component renders error state correctly 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -971,7 +971,7 @@ exports[`OrderProcessing Component renders error state correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -995,7 +995,7 @@ exports[`OrderProcessing Component renders error state correctly 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -1007,7 +1007,7 @@ exports[`OrderProcessing Component renders error state correctly 1`] = `
                 der-id
               </Text>
               <SvgMock
-                color="#121314"
+                color="#131416"
                 fill="currentColor"
                 height={24}
                 name="Copy"
@@ -1024,7 +1024,7 @@ exports[`OrderProcessing Component renders error state correctly 1`] = `
           <View
             style={
               {
-                "backgroundColor": "#b7bbc866",
+                "backgroundColor": "#b4b4b566",
                 "height": 1,
                 "marginHorizontal": -16,
                 "marginVertical": 8,
@@ -1045,7 +1045,7 @@ exports[`OrderProcessing Component renders error state correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -1059,7 +1059,7 @@ exports[`OrderProcessing Component renders error state correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -1084,7 +1084,7 @@ exports[`OrderProcessing Component renders error state correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -1098,7 +1098,7 @@ exports[`OrderProcessing Component renders error state correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -1151,7 +1151,7 @@ exports[`OrderProcessing Component renders error state correctly 1`] = `
                 {
                   "alignItems": "center",
                   "alignSelf": "flex-start",
-                  "backgroundColor": "#3c4d9d0f",
+                  "backgroundColor": "#b4b4b528",
                   "borderColor": "transparent",
                   "borderRadius": 12,
                   "borderWidth": 1,
@@ -1168,7 +1168,7 @@ exports[`OrderProcessing Component renders error state correctly 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Medium",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -1190,7 +1190,7 @@ exports[`OrderProcessing Component renders error state correctly 1`] = `
                 {
                   "alignItems": "center",
                   "alignSelf": "flex-start",
-                  "backgroundColor": "#121314",
+                  "backgroundColor": "#131416",
                   "borderRadius": 12,
                   "flex": 1,
                   "flexDirection": "row",
@@ -1501,7 +1501,7 @@ exports[`OrderProcessing Component renders processing state correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 40,
                 "letterSpacing": 0,
@@ -1520,7 +1520,7 @@ exports[`OrderProcessing Component renders processing state correctly 1`] = `
           style={
             {
               "backgroundColor": "#ffffff",
-              "borderColor": "#b7bbc866",
+              "borderColor": "#b4b4b566",
               "borderRadius": 8,
               "borderWidth": 1,
               "marginBottom": 16,
@@ -1543,7 +1543,7 @@ exports[`OrderProcessing Component renders processing state correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -1557,7 +1557,7 @@ exports[`OrderProcessing Component renders processing state correctly 1`] = `
               style={
                 {
                   "alignItems": "center",
-                  "backgroundColor": "#3c4d9d0f",
+                  "backgroundColor": "#b4b4b528",
                   "borderRadius": 36,
                   "flexDirection": "row",
                   "gap": 4,
@@ -1570,7 +1570,7 @@ exports[`OrderProcessing Component renders processing state correctly 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -1594,7 +1594,7 @@ exports[`OrderProcessing Component renders processing state correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -1629,7 +1629,7 @@ exports[`OrderProcessing Component renders processing state correctly 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -1655,7 +1655,7 @@ exports[`OrderProcessing Component renders processing state correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -1679,7 +1679,7 @@ exports[`OrderProcessing Component renders processing state correctly 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -1691,7 +1691,7 @@ exports[`OrderProcessing Component renders processing state correctly 1`] = `
                 der-id
               </Text>
               <SvgMock
-                color="#121314"
+                color="#131416"
                 fill="currentColor"
                 height={24}
                 name="Copy"
@@ -1708,7 +1708,7 @@ exports[`OrderProcessing Component renders processing state correctly 1`] = `
           <View
             style={
               {
-                "backgroundColor": "#b7bbc866",
+                "backgroundColor": "#b4b4b566",
                 "height": 1,
                 "marginHorizontal": -16,
                 "marginVertical": 8,
@@ -1729,7 +1729,7 @@ exports[`OrderProcessing Component renders processing state correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -1743,7 +1743,7 @@ exports[`OrderProcessing Component renders processing state correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -1768,7 +1768,7 @@ exports[`OrderProcessing Component renders processing state correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -1782,7 +1782,7 @@ exports[`OrderProcessing Component renders processing state correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -1835,7 +1835,7 @@ exports[`OrderProcessing Component renders processing state correctly 1`] = `
                 {
                   "alignItems": "center",
                   "alignSelf": "flex-start",
-                  "backgroundColor": "#121314",
+                  "backgroundColor": "#131416",
                   "borderRadius": 12,
                   "flex": 1,
                   "flexDirection": "row",
@@ -2092,7 +2092,7 @@ exports[`OrderProcessing Component renders success state correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 40,
                 "letterSpacing": 0,
@@ -2111,7 +2111,7 @@ exports[`OrderProcessing Component renders success state correctly 1`] = `
           style={
             {
               "backgroundColor": "#ffffff",
-              "borderColor": "#b7bbc866",
+              "borderColor": "#b4b4b566",
               "borderRadius": 8,
               "borderWidth": 1,
               "marginBottom": 16,
@@ -2134,7 +2134,7 @@ exports[`OrderProcessing Component renders success state correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -2148,7 +2148,7 @@ exports[`OrderProcessing Component renders success state correctly 1`] = `
               style={
                 {
                   "alignItems": "center",
-                  "backgroundColor": "#3c4d9d0f",
+                  "backgroundColor": "#b4b4b528",
                   "borderRadius": 36,
                   "flexDirection": "row",
                   "gap": 4,
@@ -2161,7 +2161,7 @@ exports[`OrderProcessing Component renders success state correctly 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -2185,7 +2185,7 @@ exports[`OrderProcessing Component renders success state correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -2220,7 +2220,7 @@ exports[`OrderProcessing Component renders success state correctly 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -2246,7 +2246,7 @@ exports[`OrderProcessing Component renders success state correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -2270,7 +2270,7 @@ exports[`OrderProcessing Component renders success state correctly 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -2282,7 +2282,7 @@ exports[`OrderProcessing Component renders success state correctly 1`] = `
                 der-id
               </Text>
               <SvgMock
-                color="#121314"
+                color="#131416"
                 fill="currentColor"
                 height={24}
                 name="Copy"
@@ -2299,7 +2299,7 @@ exports[`OrderProcessing Component renders success state correctly 1`] = `
           <View
             style={
               {
-                "backgroundColor": "#b7bbc866",
+                "backgroundColor": "#b4b4b566",
                 "height": 1,
                 "marginHorizontal": -16,
                 "marginVertical": 8,
@@ -2320,7 +2320,7 @@ exports[`OrderProcessing Component renders success state correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -2334,7 +2334,7 @@ exports[`OrderProcessing Component renders success state correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -2359,7 +2359,7 @@ exports[`OrderProcessing Component renders success state correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -2373,7 +2373,7 @@ exports[`OrderProcessing Component renders success state correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -2426,7 +2426,7 @@ exports[`OrderProcessing Component renders success state correctly 1`] = `
                 {
                   "alignItems": "center",
                   "alignSelf": "flex-start",
-                  "backgroundColor": "#121314",
+                  "backgroundColor": "#131416",
                   "borderRadius": 12,
                   "flex": 1,
                   "flexDirection": "row",
diff --git a/app/components/UI/Ramp/Deposit/Views/OtpCode/__snapshots__/OtpCode.test.tsx.snap b/app/components/UI/Ramp/Deposit/Views/OtpCode/__snapshots__/OtpCode.test.tsx.snap
index 1e37cf173737..95d7b6178494 100644
--- a/app/components/UI/Ramp/Deposit/Views/OtpCode/__snapshots__/OtpCode.test.tsx.snap
+++ b/app/components/UI/Ramp/Deposit/Views/OtpCode/__snapshots__/OtpCode.test.tsx.snap
@@ -424,7 +424,7 @@ exports[`OtpCode Screen calls resendOtp when resend link is clicked and properly
                                         "height": 4,
                                       },
                                       {
-                                        "backgroundColor": "#b7bbc8",
+                                        "backgroundColor": "#babbbe",
                                       },
                                     ],
                                     {
@@ -444,7 +444,7 @@ exports[`OtpCode Screen calls resendOtp when resend link is clicked and properly
                                         "height": 4,
                                       },
                                       {
-                                        "backgroundColor": "#b7bbc8",
+                                        "backgroundColor": "#babbbe",
                                       },
                                     ],
                                     undefined,
@@ -457,7 +457,7 @@ exports[`OtpCode Screen calls resendOtp when resend link is clicked and properly
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Bold",
                                   "fontSize": 24,
                                   "fontWeight": "bold",
@@ -473,7 +473,7 @@ exports[`OtpCode Screen calls resendOtp when resend link is clicked and properly
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#686e7d",
+                                  "color": "#66676a",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -532,8 +532,8 @@ exports[`OtpCode Screen calls resendOtp when resend link is clicked and properly
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
-                                      "borderColor": "#b7bbc866",
+                                      "backgroundColor": "#b4b4b528",
+                                      "borderColor": "#b4b4b566",
                                       "borderRadius": 8,
                                       "borderWidth": 1,
                                       "height": 50,
@@ -548,7 +548,7 @@ exports[`OtpCode Screen calls resendOtp when resend link is clicked and properly
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 24,
                                       "fontWeight": "bold",
@@ -565,8 +565,8 @@ exports[`OtpCode Screen calls resendOtp when resend link is clicked and properly
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
-                                      "borderColor": "#b7bbc866",
+                                      "backgroundColor": "#b4b4b528",
+                                      "borderColor": "#b4b4b566",
                                       "borderRadius": 8,
                                       "borderWidth": 1,
                                       "height": 50,
@@ -581,7 +581,7 @@ exports[`OtpCode Screen calls resendOtp when resend link is clicked and properly
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 24,
                                       "fontWeight": "bold",
@@ -598,8 +598,8 @@ exports[`OtpCode Screen calls resendOtp when resend link is clicked and properly
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
-                                      "borderColor": "#b7bbc866",
+                                      "backgroundColor": "#b4b4b528",
+                                      "borderColor": "#b4b4b566",
                                       "borderRadius": 8,
                                       "borderWidth": 1,
                                       "height": 50,
@@ -614,7 +614,7 @@ exports[`OtpCode Screen calls resendOtp when resend link is clicked and properly
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 24,
                                       "fontWeight": "bold",
@@ -631,8 +631,8 @@ exports[`OtpCode Screen calls resendOtp when resend link is clicked and properly
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
-                                      "borderColor": "#b7bbc866",
+                                      "backgroundColor": "#b4b4b528",
+                                      "borderColor": "#b4b4b566",
                                       "borderRadius": 8,
                                       "borderWidth": 1,
                                       "height": 50,
@@ -647,7 +647,7 @@ exports[`OtpCode Screen calls resendOtp when resend link is clicked and properly
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 24,
                                       "fontWeight": "bold",
@@ -664,8 +664,8 @@ exports[`OtpCode Screen calls resendOtp when resend link is clicked and properly
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
-                                      "borderColor": "#b7bbc866",
+                                      "backgroundColor": "#b4b4b528",
+                                      "borderColor": "#b4b4b566",
                                       "borderRadius": 8,
                                       "borderWidth": 1,
                                       "height": 50,
@@ -680,7 +680,7 @@ exports[`OtpCode Screen calls resendOtp when resend link is clicked and properly
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 24,
                                       "fontWeight": "bold",
@@ -697,8 +697,8 @@ exports[`OtpCode Screen calls resendOtp when resend link is clicked and properly
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
-                                      "borderColor": "#b7bbc866",
+                                      "backgroundColor": "#b4b4b528",
+                                      "borderColor": "#b4b4b566",
                                       "borderRadius": 8,
                                       "borderWidth": 1,
                                       "height": 50,
@@ -713,7 +713,7 @@ exports[`OtpCode Screen calls resendOtp when resend link is clicked and properly
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 24,
                                       "fontWeight": "bold",
@@ -775,7 +775,7 @@ exports[`OtpCode Screen calls resendOtp when resend link is clicked and properly
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#686e7d",
+                                    "color": "#66676a",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -817,7 +817,7 @@ exports[`OtpCode Screen calls resendOtp when resend link is clicked and properly
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
@@ -849,7 +849,7 @@ exports[`OtpCode Screen calls resendOtp when resend link is clicked and properly
                               name="powered-by-transak-logo"
                               style={
                                 {
-                                  "color": "#686e7d",
+                                  "color": "#66676a",
                                   "height": 24,
                                 }
                               }
@@ -1294,7 +1294,7 @@ exports[`OtpCode Screen render matches snapshot 1`] = `
                                         "height": 4,
                                       },
                                       {
-                                        "backgroundColor": "#b7bbc8",
+                                        "backgroundColor": "#babbbe",
                                       },
                                     ],
                                     {
@@ -1314,7 +1314,7 @@ exports[`OtpCode Screen render matches snapshot 1`] = `
                                         "height": 4,
                                       },
                                       {
-                                        "backgroundColor": "#b7bbc8",
+                                        "backgroundColor": "#babbbe",
                                       },
                                     ],
                                     undefined,
@@ -1327,7 +1327,7 @@ exports[`OtpCode Screen render matches snapshot 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Bold",
                                   "fontSize": 24,
                                   "fontWeight": "bold",
@@ -1343,7 +1343,7 @@ exports[`OtpCode Screen render matches snapshot 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#686e7d",
+                                  "color": "#66676a",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -1402,8 +1402,8 @@ exports[`OtpCode Screen render matches snapshot 1`] = `
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
-                                      "borderColor": "#b7bbc866",
+                                      "backgroundColor": "#b4b4b528",
+                                      "borderColor": "#b4b4b566",
                                       "borderRadius": 8,
                                       "borderWidth": 1,
                                       "height": 50,
@@ -1418,7 +1418,7 @@ exports[`OtpCode Screen render matches snapshot 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 24,
                                       "fontWeight": "bold",
@@ -1435,8 +1435,8 @@ exports[`OtpCode Screen render matches snapshot 1`] = `
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
-                                      "borderColor": "#b7bbc866",
+                                      "backgroundColor": "#b4b4b528",
+                                      "borderColor": "#b4b4b566",
                                       "borderRadius": 8,
                                       "borderWidth": 1,
                                       "height": 50,
@@ -1451,7 +1451,7 @@ exports[`OtpCode Screen render matches snapshot 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 24,
                                       "fontWeight": "bold",
@@ -1468,8 +1468,8 @@ exports[`OtpCode Screen render matches snapshot 1`] = `
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
-                                      "borderColor": "#b7bbc866",
+                                      "backgroundColor": "#b4b4b528",
+                                      "borderColor": "#b4b4b566",
                                       "borderRadius": 8,
                                       "borderWidth": 1,
                                       "height": 50,
@@ -1484,7 +1484,7 @@ exports[`OtpCode Screen render matches snapshot 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 24,
                                       "fontWeight": "bold",
@@ -1501,8 +1501,8 @@ exports[`OtpCode Screen render matches snapshot 1`] = `
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
-                                      "borderColor": "#b7bbc866",
+                                      "backgroundColor": "#b4b4b528",
+                                      "borderColor": "#b4b4b566",
                                       "borderRadius": 8,
                                       "borderWidth": 1,
                                       "height": 50,
@@ -1517,7 +1517,7 @@ exports[`OtpCode Screen render matches snapshot 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 24,
                                       "fontWeight": "bold",
@@ -1534,8 +1534,8 @@ exports[`OtpCode Screen render matches snapshot 1`] = `
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
-                                      "borderColor": "#b7bbc866",
+                                      "backgroundColor": "#b4b4b528",
+                                      "borderColor": "#b4b4b566",
                                       "borderRadius": 8,
                                       "borderWidth": 1,
                                       "height": 50,
@@ -1550,7 +1550,7 @@ exports[`OtpCode Screen render matches snapshot 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 24,
                                       "fontWeight": "bold",
@@ -1567,8 +1567,8 @@ exports[`OtpCode Screen render matches snapshot 1`] = `
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
-                                      "borderColor": "#b7bbc866",
+                                      "backgroundColor": "#b4b4b528",
+                                      "borderColor": "#b4b4b566",
                                       "borderRadius": 8,
                                       "borderWidth": 1,
                                       "height": 50,
@@ -1583,7 +1583,7 @@ exports[`OtpCode Screen render matches snapshot 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 24,
                                       "fontWeight": "bold",
@@ -1645,7 +1645,7 @@ exports[`OtpCode Screen render matches snapshot 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#686e7d",
+                                    "color": "#66676a",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -1663,7 +1663,7 @@ exports[`OtpCode Screen render matches snapshot 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#686e7d",
+                                      "color": "#66676a",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -1707,7 +1707,7 @@ exports[`OtpCode Screen render matches snapshot 1`] = `
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
@@ -1739,7 +1739,7 @@ exports[`OtpCode Screen render matches snapshot 1`] = `
                               name="powered-by-transak-logo"
                               style={
                                 {
-                                  "color": "#686e7d",
+                                  "color": "#66676a",
                                   "height": 24,
                                 }
                               }
@@ -2184,7 +2184,7 @@ exports[`OtpCode Screen renders cooldown timer snapshot after resending OTP 1`]
                                         "height": 4,
                                       },
                                       {
-                                        "backgroundColor": "#b7bbc8",
+                                        "backgroundColor": "#babbbe",
                                       },
                                     ],
                                     {
@@ -2204,7 +2204,7 @@ exports[`OtpCode Screen renders cooldown timer snapshot after resending OTP 1`]
                                         "height": 4,
                                       },
                                       {
-                                        "backgroundColor": "#b7bbc8",
+                                        "backgroundColor": "#babbbe",
                                       },
                                     ],
                                     undefined,
@@ -2217,7 +2217,7 @@ exports[`OtpCode Screen renders cooldown timer snapshot after resending OTP 1`]
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Bold",
                                   "fontSize": 24,
                                   "fontWeight": "bold",
@@ -2233,7 +2233,7 @@ exports[`OtpCode Screen renders cooldown timer snapshot after resending OTP 1`]
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#686e7d",
+                                  "color": "#66676a",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -2292,8 +2292,8 @@ exports[`OtpCode Screen renders cooldown timer snapshot after resending OTP 1`]
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
-                                      "borderColor": "#b7bbc866",
+                                      "backgroundColor": "#b4b4b528",
+                                      "borderColor": "#b4b4b566",
                                       "borderRadius": 8,
                                       "borderWidth": 1,
                                       "height": 50,
@@ -2308,7 +2308,7 @@ exports[`OtpCode Screen renders cooldown timer snapshot after resending OTP 1`]
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 24,
                                       "fontWeight": "bold",
@@ -2325,8 +2325,8 @@ exports[`OtpCode Screen renders cooldown timer snapshot after resending OTP 1`]
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
-                                      "borderColor": "#b7bbc866",
+                                      "backgroundColor": "#b4b4b528",
+                                      "borderColor": "#b4b4b566",
                                       "borderRadius": 8,
                                       "borderWidth": 1,
                                       "height": 50,
@@ -2341,7 +2341,7 @@ exports[`OtpCode Screen renders cooldown timer snapshot after resending OTP 1`]
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 24,
                                       "fontWeight": "bold",
@@ -2358,8 +2358,8 @@ exports[`OtpCode Screen renders cooldown timer snapshot after resending OTP 1`]
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
-                                      "borderColor": "#b7bbc866",
+                                      "backgroundColor": "#b4b4b528",
+                                      "borderColor": "#b4b4b566",
                                       "borderRadius": 8,
                                       "borderWidth": 1,
                                       "height": 50,
@@ -2374,7 +2374,7 @@ exports[`OtpCode Screen renders cooldown timer snapshot after resending OTP 1`]
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 24,
                                       "fontWeight": "bold",
@@ -2391,8 +2391,8 @@ exports[`OtpCode Screen renders cooldown timer snapshot after resending OTP 1`]
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
-                                      "borderColor": "#b7bbc866",
+                                      "backgroundColor": "#b4b4b528",
+                                      "borderColor": "#b4b4b566",
                                       "borderRadius": 8,
                                       "borderWidth": 1,
                                       "height": 50,
@@ -2407,7 +2407,7 @@ exports[`OtpCode Screen renders cooldown timer snapshot after resending OTP 1`]
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 24,
                                       "fontWeight": "bold",
@@ -2424,8 +2424,8 @@ exports[`OtpCode Screen renders cooldown timer snapshot after resending OTP 1`]
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
-                                      "borderColor": "#b7bbc866",
+                                      "backgroundColor": "#b4b4b528",
+                                      "borderColor": "#b4b4b566",
                                       "borderRadius": 8,
                                       "borderWidth": 1,
                                       "height": 50,
@@ -2440,7 +2440,7 @@ exports[`OtpCode Screen renders cooldown timer snapshot after resending OTP 1`]
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 24,
                                       "fontWeight": "bold",
@@ -2457,8 +2457,8 @@ exports[`OtpCode Screen renders cooldown timer snapshot after resending OTP 1`]
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
-                                      "borderColor": "#b7bbc866",
+                                      "backgroundColor": "#b4b4b528",
+                                      "borderColor": "#b4b4b566",
                                       "borderRadius": 8,
                                       "borderWidth": 1,
                                       "height": 50,
@@ -2473,7 +2473,7 @@ exports[`OtpCode Screen renders cooldown timer snapshot after resending OTP 1`]
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 24,
                                       "fontWeight": "bold",
@@ -2535,7 +2535,7 @@ exports[`OtpCode Screen renders cooldown timer snapshot after resending OTP 1`]
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#686e7d",
+                                    "color": "#66676a",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -2577,7 +2577,7 @@ exports[`OtpCode Screen renders cooldown timer snapshot after resending OTP 1`]
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
@@ -2609,7 +2609,7 @@ exports[`OtpCode Screen renders cooldown timer snapshot after resending OTP 1`]
                               name="powered-by-transak-logo"
                               style={
                                 {
-                                  "color": "#686e7d",
+                                  "color": "#66676a",
                                   "height": 24,
                                 }
                               }
@@ -3054,7 +3054,7 @@ exports[`OtpCode Screen renders error snapshot when API call fails 1`] = `
                                         "height": 4,
                                       },
                                       {
-                                        "backgroundColor": "#b7bbc8",
+                                        "backgroundColor": "#babbbe",
                                       },
                                     ],
                                     {
@@ -3074,7 +3074,7 @@ exports[`OtpCode Screen renders error snapshot when API call fails 1`] = `
                                         "height": 4,
                                       },
                                       {
-                                        "backgroundColor": "#b7bbc8",
+                                        "backgroundColor": "#babbbe",
                                       },
                                     ],
                                     undefined,
@@ -3087,7 +3087,7 @@ exports[`OtpCode Screen renders error snapshot when API call fails 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Bold",
                                   "fontSize": 24,
                                   "fontWeight": "bold",
@@ -3103,7 +3103,7 @@ exports[`OtpCode Screen renders error snapshot when API call fails 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#686e7d",
+                                  "color": "#66676a",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -3162,8 +3162,8 @@ exports[`OtpCode Screen renders error snapshot when API call fails 1`] = `
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
-                                      "borderColor": "#b7bbc866",
+                                      "backgroundColor": "#b4b4b528",
+                                      "borderColor": "#b4b4b566",
                                       "borderRadius": 8,
                                       "borderWidth": 1,
                                       "height": 50,
@@ -3178,7 +3178,7 @@ exports[`OtpCode Screen renders error snapshot when API call fails 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 24,
                                       "fontWeight": "bold",
@@ -3197,8 +3197,8 @@ exports[`OtpCode Screen renders error snapshot when API call fails 1`] = `
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
-                                      "borderColor": "#b7bbc866",
+                                      "backgroundColor": "#b4b4b528",
+                                      "borderColor": "#b4b4b566",
                                       "borderRadius": 8,
                                       "borderWidth": 1,
                                       "height": 50,
@@ -3213,7 +3213,7 @@ exports[`OtpCode Screen renders error snapshot when API call fails 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 24,
                                       "fontWeight": "bold",
@@ -3232,8 +3232,8 @@ exports[`OtpCode Screen renders error snapshot when API call fails 1`] = `
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
-                                      "borderColor": "#b7bbc866",
+                                      "backgroundColor": "#b4b4b528",
+                                      "borderColor": "#b4b4b566",
                                       "borderRadius": 8,
                                       "borderWidth": 1,
                                       "height": 50,
@@ -3248,7 +3248,7 @@ exports[`OtpCode Screen renders error snapshot when API call fails 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 24,
                                       "fontWeight": "bold",
@@ -3267,8 +3267,8 @@ exports[`OtpCode Screen renders error snapshot when API call fails 1`] = `
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
-                                      "borderColor": "#b7bbc866",
+                                      "backgroundColor": "#b4b4b528",
+                                      "borderColor": "#b4b4b566",
                                       "borderRadius": 8,
                                       "borderWidth": 1,
                                       "height": 50,
@@ -3283,7 +3283,7 @@ exports[`OtpCode Screen renders error snapshot when API call fails 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 24,
                                       "fontWeight": "bold",
@@ -3302,8 +3302,8 @@ exports[`OtpCode Screen renders error snapshot when API call fails 1`] = `
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
-                                      "borderColor": "#b7bbc866",
+                                      "backgroundColor": "#b4b4b528",
+                                      "borderColor": "#b4b4b566",
                                       "borderRadius": 8,
                                       "borderWidth": 1,
                                       "height": 50,
@@ -3318,7 +3318,7 @@ exports[`OtpCode Screen renders error snapshot when API call fails 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 24,
                                       "fontWeight": "bold",
@@ -3337,8 +3337,8 @@ exports[`OtpCode Screen renders error snapshot when API call fails 1`] = `
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
-                                      "borderColor": "#b7bbc866",
+                                      "backgroundColor": "#b4b4b528",
+                                      "borderColor": "#b4b4b566",
                                       "borderRadius": 8,
                                       "borderWidth": 1,
                                       "height": 50,
@@ -3353,7 +3353,7 @@ exports[`OtpCode Screen renders error snapshot when API call fails 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 24,
                                       "fontWeight": "bold",
@@ -3431,7 +3431,7 @@ exports[`OtpCode Screen renders error snapshot when API call fails 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#686e7d",
+                                    "color": "#66676a",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -3449,7 +3449,7 @@ exports[`OtpCode Screen renders error snapshot when API call fails 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#686e7d",
+                                      "color": "#66676a",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -3493,7 +3493,7 @@ exports[`OtpCode Screen renders error snapshot when API call fails 1`] = `
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
@@ -3524,7 +3524,7 @@ exports[`OtpCode Screen renders error snapshot when API call fails 1`] = `
                               name="powered-by-transak-logo"
                               style={
                                 {
-                                  "color": "#686e7d",
+                                  "color": "#66676a",
                                   "height": 24,
                                 }
                               }
@@ -3969,7 +3969,7 @@ exports[`OtpCode Screen renders resend error snapshot when resend fails 1`] = `
                                         "height": 4,
                                       },
                                       {
-                                        "backgroundColor": "#b7bbc8",
+                                        "backgroundColor": "#babbbe",
                                       },
                                     ],
                                     {
@@ -3989,7 +3989,7 @@ exports[`OtpCode Screen renders resend error snapshot when resend fails 1`] = `
                                         "height": 4,
                                       },
                                       {
-                                        "backgroundColor": "#b7bbc8",
+                                        "backgroundColor": "#babbbe",
                                       },
                                     ],
                                     undefined,
@@ -4002,7 +4002,7 @@ exports[`OtpCode Screen renders resend error snapshot when resend fails 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Bold",
                                   "fontSize": 24,
                                   "fontWeight": "bold",
@@ -4018,7 +4018,7 @@ exports[`OtpCode Screen renders resend error snapshot when resend fails 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#686e7d",
+                                  "color": "#66676a",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -4077,8 +4077,8 @@ exports[`OtpCode Screen renders resend error snapshot when resend fails 1`] = `
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
-                                      "borderColor": "#b7bbc866",
+                                      "backgroundColor": "#b4b4b528",
+                                      "borderColor": "#b4b4b566",
                                       "borderRadius": 8,
                                       "borderWidth": 1,
                                       "height": 50,
@@ -4093,7 +4093,7 @@ exports[`OtpCode Screen renders resend error snapshot when resend fails 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 24,
                                       "fontWeight": "bold",
@@ -4110,8 +4110,8 @@ exports[`OtpCode Screen renders resend error snapshot when resend fails 1`] = `
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
-                                      "borderColor": "#b7bbc866",
+                                      "backgroundColor": "#b4b4b528",
+                                      "borderColor": "#b4b4b566",
                                       "borderRadius": 8,
                                       "borderWidth": 1,
                                       "height": 50,
@@ -4126,7 +4126,7 @@ exports[`OtpCode Screen renders resend error snapshot when resend fails 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 24,
                                       "fontWeight": "bold",
@@ -4143,8 +4143,8 @@ exports[`OtpCode Screen renders resend error snapshot when resend fails 1`] = `
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
-                                      "borderColor": "#b7bbc866",
+                                      "backgroundColor": "#b4b4b528",
+                                      "borderColor": "#b4b4b566",
                                       "borderRadius": 8,
                                       "borderWidth": 1,
                                       "height": 50,
@@ -4159,7 +4159,7 @@ exports[`OtpCode Screen renders resend error snapshot when resend fails 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 24,
                                       "fontWeight": "bold",
@@ -4176,8 +4176,8 @@ exports[`OtpCode Screen renders resend error snapshot when resend fails 1`] = `
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
-                                      "borderColor": "#b7bbc866",
+                                      "backgroundColor": "#b4b4b528",
+                                      "borderColor": "#b4b4b566",
                                       "borderRadius": 8,
                                       "borderWidth": 1,
                                       "height": 50,
@@ -4192,7 +4192,7 @@ exports[`OtpCode Screen renders resend error snapshot when resend fails 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 24,
                                       "fontWeight": "bold",
@@ -4209,8 +4209,8 @@ exports[`OtpCode Screen renders resend error snapshot when resend fails 1`] = `
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
-                                      "borderColor": "#b7bbc866",
+                                      "backgroundColor": "#b4b4b528",
+                                      "borderColor": "#b4b4b566",
                                       "borderRadius": 8,
                                       "borderWidth": 1,
                                       "height": 50,
@@ -4225,7 +4225,7 @@ exports[`OtpCode Screen renders resend error snapshot when resend fails 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 24,
                                       "fontWeight": "bold",
@@ -4242,8 +4242,8 @@ exports[`OtpCode Screen renders resend error snapshot when resend fails 1`] = `
                                   [
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
-                                      "borderColor": "#b7bbc866",
+                                      "backgroundColor": "#b4b4b528",
+                                      "borderColor": "#b4b4b566",
                                       "borderRadius": 8,
                                       "borderWidth": 1,
                                       "height": 50,
@@ -4258,7 +4258,7 @@ exports[`OtpCode Screen renders resend error snapshot when resend fails 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 24,
                                       "fontWeight": "bold",
@@ -4320,7 +4320,7 @@ exports[`OtpCode Screen renders resend error snapshot when resend fails 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#686e7d",
+                                    "color": "#66676a",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -4338,7 +4338,7 @@ exports[`OtpCode Screen renders resend error snapshot when resend fails 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#686e7d",
+                                      "color": "#66676a",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -4382,7 +4382,7 @@ exports[`OtpCode Screen renders resend error snapshot when resend fails 1`] = `
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
@@ -4414,7 +4414,7 @@ exports[`OtpCode Screen renders resend error snapshot when resend fails 1`] = `
                               name="powered-by-transak-logo"
                               style={
                                 {
-                                  "color": "#686e7d",
+                                  "color": "#66676a",
                                   "height": 24,
                                 }
                               }
diff --git a/app/components/UI/Ramp/Deposit/Views/VerifyIdentity/__snapshots__/VerifyIdentity.test.tsx.snap b/app/components/UI/Ramp/Deposit/Views/VerifyIdentity/__snapshots__/VerifyIdentity.test.tsx.snap
index 0936eb71f430..5dfdd7f84986 100644
--- a/app/components/UI/Ramp/Deposit/Views/VerifyIdentity/__snapshots__/VerifyIdentity.test.tsx.snap
+++ b/app/components/UI/Ramp/Deposit/Views/VerifyIdentity/__snapshots__/VerifyIdentity.test.tsx.snap
@@ -386,7 +386,7 @@ exports[`VerifyIdentity Component renders verify identity screen with all conten
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 24,
                                       "fontWeight": "bold",
@@ -402,7 +402,7 @@ exports[`VerifyIdentity Component renders verify identity screen with all conten
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -417,7 +417,7 @@ exports[`VerifyIdentity Component renders verify identity screen with all conten
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -431,7 +431,7 @@ exports[`VerifyIdentity Component renders verify identity screen with all conten
                                     onPress={[Function]}
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -448,7 +448,7 @@ exports[`VerifyIdentity Component renders verify identity screen with all conten
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -463,7 +463,7 @@ exports[`VerifyIdentity Component renders verify identity screen with all conten
                                     onPress={[Function]}
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -500,7 +500,7 @@ exports[`VerifyIdentity Component renders verify identity screen with all conten
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#b7bbc8",
+                                  "color": "#babbbe",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 12,
                                   "letterSpacing": 0.25,
@@ -515,7 +515,7 @@ exports[`VerifyIdentity Component renders verify identity screen with all conten
                                 onPress={[Function]}
                                 style={
                                   {
-                                    "color": "#b7bbc8",
+                                    "color": "#babbbe",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 12,
                                     "letterSpacing": 0.25,
@@ -532,7 +532,7 @@ exports[`VerifyIdentity Component renders verify identity screen with all conten
                                 onPress={[Function]}
                                 style={
                                   {
-                                    "color": "#b7bbc8",
+                                    "color": "#babbbe",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 12,
                                     "letterSpacing": 0.25,
@@ -557,7 +557,7 @@ exports[`VerifyIdentity Component renders verify identity screen with all conten
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
@@ -587,7 +587,7 @@ exports[`VerifyIdentity Component renders verify identity screen with all conten
                               name="powered-by-transak-logo"
                               style={
                                 {
-                                  "color": "#686e7d",
+                                  "color": "#66676a",
                                   "height": 24,
                                 }
                               }
diff --git a/app/components/UI/Ramp/Deposit/components/BankDetailRow/__snapshots__/BankDetailRow.test.tsx.snap b/app/components/UI/Ramp/Deposit/components/BankDetailRow/__snapshots__/BankDetailRow.test.tsx.snap
index 518c89052134..3cef886c291f 100644
--- a/app/components/UI/Ramp/Deposit/components/BankDetailRow/__snapshots__/BankDetailRow.test.tsx.snap
+++ b/app/components/UI/Ramp/Deposit/components/BankDetailRow/__snapshots__/BankDetailRow.test.tsx.snap
@@ -13,7 +13,7 @@ exports[`BankDetailRow render matches snapshot 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
@@ -39,7 +39,7 @@ exports[`BankDetailRow render matches snapshot 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#686e7d",
+          "color": "#66676a",
           "flex": 1,
           "flexWrap": "wrap",
           "fontFamily": "Geist-Regular",
@@ -57,7 +57,7 @@ exports[`BankDetailRow render matches snapshot 1`] = `
       testID="copy-button"
     >
       <SvgMock
-        color="#686e7d"
+        color="#66676a"
         fill="currentColor"
         height={16}
         name="Copy"
@@ -87,7 +87,7 @@ exports[`BankDetailRow render matches snapshot with different values 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
@@ -113,7 +113,7 @@ exports[`BankDetailRow render matches snapshot with different values 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#686e7d",
+          "color": "#66676a",
           "flex": 1,
           "flexWrap": "wrap",
           "fontFamily": "Geist-Regular",
@@ -131,7 +131,7 @@ exports[`BankDetailRow render matches snapshot with different values 1`] = `
       testID="copy-button"
     >
       <SvgMock
-        color="#686e7d"
+        color="#66676a"
         fill="currentColor"
         height={16}
         name="Copy"
diff --git a/app/components/UI/Ramp/Deposit/components/DepositDateField/__snapshots__/DepositDateField.test.tsx.snap b/app/components/UI/Ramp/Deposit/components/DepositDateField/__snapshots__/DepositDateField.test.tsx.snap
index 06fecba92823..e9a78ad99ed3 100644
--- a/app/components/UI/Ramp/Deposit/components/DepositDateField/__snapshots__/DepositDateField.test.tsx.snap
+++ b/app/components/UI/Ramp/Deposit/components/DepositDateField/__snapshots__/DepositDateField.test.tsx.snap
@@ -16,7 +16,7 @@ exports[`DepositDateField Platform specific rendering date picker matches snapsh
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
@@ -61,8 +61,8 @@ exports[`DepositDateField Platform specific rendering date picker matches snapsh
     style={
       {
         "alignItems": "center",
-        "backgroundColor": "#3c4d9d0f",
-        "borderColor": "#b7bbc866",
+        "backgroundColor": "#b4b4b528",
+        "borderColor": "#b4b4b566",
         "borderRadius": 12,
         "borderWidth": 1,
         "flexDirection": "row",
@@ -82,7 +82,7 @@ exports[`DepositDateField Platform specific rendering date picker matches snapsh
       testID="textfield-startacccessory"
     >
       <SvgMock
-        color="#121314"
+        color="#131416"
         fill="currentColor"
         height={20}
         name="Calendar"
@@ -115,11 +115,11 @@ exports[`DepositDateField Platform specific rendering date picker matches snapsh
         <TextInput
           editable={false}
           placeholder="01/01/2000"
-          placeholderTextColor="#b7bbc8"
+          placeholderTextColor="#babbbe"
           pointerEvents="none"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "flex": 1,
               "fontSize": 16,
               "height": "100%",
@@ -150,7 +150,7 @@ exports[`DepositDateField Platform specific rendering date picker matches snapsh
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
@@ -195,8 +195,8 @@ exports[`DepositDateField Platform specific rendering date picker matches snapsh
     style={
       {
         "alignItems": "center",
-        "backgroundColor": "#3c4d9d0f",
-        "borderColor": "#b7bbc866",
+        "backgroundColor": "#b4b4b528",
+        "borderColor": "#b4b4b566",
         "borderRadius": 12,
         "borderWidth": 1,
         "flexDirection": "row",
@@ -216,7 +216,7 @@ exports[`DepositDateField Platform specific rendering date picker matches snapsh
       testID="textfield-startacccessory"
     >
       <SvgMock
-        color="#121314"
+        color="#131416"
         fill="currentColor"
         height={20}
         name="Calendar"
@@ -249,11 +249,11 @@ exports[`DepositDateField Platform specific rendering date picker matches snapsh
         <TextInput
           editable={false}
           placeholder="01/01/2000"
-          placeholderTextColor="#b7bbc8"
+          placeholderTextColor="#babbbe"
           pointerEvents="none"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "flex": 1,
               "fontSize": 16,
               "height": "100%",
@@ -284,7 +284,7 @@ exports[`DepositDateField render matches snapshot 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
@@ -329,8 +329,8 @@ exports[`DepositDateField render matches snapshot 1`] = `
     style={
       {
         "alignItems": "center",
-        "backgroundColor": "#3c4d9d0f",
-        "borderColor": "#b7bbc866",
+        "backgroundColor": "#b4b4b528",
+        "borderColor": "#b4b4b566",
         "borderRadius": 12,
         "borderWidth": 1,
         "flexDirection": "row",
@@ -350,7 +350,7 @@ exports[`DepositDateField render matches snapshot 1`] = `
       testID="textfield-startacccessory"
     >
       <SvgMock
-        color="#121314"
+        color="#131416"
         fill="currentColor"
         height={20}
         name="Calendar"
@@ -383,11 +383,11 @@ exports[`DepositDateField render matches snapshot 1`] = `
         <TextInput
           editable={false}
           placeholder="01/01/2000"
-          placeholderTextColor="#b7bbc8"
+          placeholderTextColor="#babbbe"
           pointerEvents="none"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "flex": 1,
               "fontSize": 16,
               "height": "100%",
@@ -418,7 +418,7 @@ exports[`DepositDateField render matches snapshot with a value 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
@@ -463,8 +463,8 @@ exports[`DepositDateField render matches snapshot with a value 1`] = `
     style={
       {
         "alignItems": "center",
-        "backgroundColor": "#3c4d9d0f",
-        "borderColor": "#b7bbc866",
+        "backgroundColor": "#b4b4b528",
+        "borderColor": "#b4b4b566",
         "borderRadius": 12,
         "borderWidth": 1,
         "flexDirection": "row",
@@ -484,7 +484,7 @@ exports[`DepositDateField render matches snapshot with a value 1`] = `
       testID="textfield-startacccessory"
     >
       <SvgMock
-        color="#121314"
+        color="#131416"
         fill="currentColor"
         height={20}
         name="Calendar"
@@ -517,11 +517,11 @@ exports[`DepositDateField render matches snapshot with a value 1`] = `
         <TextInput
           editable={false}
           placeholder="01/01/2000"
-          placeholderTextColor="#b7bbc8"
+          placeholderTextColor="#babbbe"
           pointerEvents="none"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "flex": 1,
               "fontSize": 16,
               "height": "100%",
@@ -552,7 +552,7 @@ exports[`DepositDateField render matches snapshot with an error 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
@@ -597,8 +597,8 @@ exports[`DepositDateField render matches snapshot with an error 1`] = `
     style={
       {
         "alignItems": "center",
-        "backgroundColor": "#3c4d9d0f",
-        "borderColor": "#b7bbc866",
+        "backgroundColor": "#b4b4b528",
+        "borderColor": "#b4b4b566",
         "borderRadius": 12,
         "borderWidth": 1,
         "flexDirection": "row",
@@ -618,7 +618,7 @@ exports[`DepositDateField render matches snapshot with an error 1`] = `
       testID="textfield-startacccessory"
     >
       <SvgMock
-        color="#121314"
+        color="#131416"
         fill="currentColor"
         height={20}
         name="Calendar"
@@ -651,11 +651,11 @@ exports[`DepositDateField render matches snapshot with an error 1`] = `
         <TextInput
           editable={false}
           placeholder="01/01/2000"
-          placeholderTextColor="#b7bbc8"
+          placeholderTextColor="#babbbe"
           pointerEvents="none"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "flex": 1,
               "fontSize": 16,
               "height": "100%",
@@ -701,7 +701,7 @@ exports[`DepositDateField render matches snapshot with empty value 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
@@ -746,8 +746,8 @@ exports[`DepositDateField render matches snapshot with empty value 1`] = `
     style={
       {
         "alignItems": "center",
-        "backgroundColor": "#3c4d9d0f",
-        "borderColor": "#b7bbc866",
+        "backgroundColor": "#b4b4b528",
+        "borderColor": "#b4b4b566",
         "borderRadius": 12,
         "borderWidth": 1,
         "flexDirection": "row",
@@ -767,7 +767,7 @@ exports[`DepositDateField render matches snapshot with empty value 1`] = `
       testID="textfield-startacccessory"
     >
       <SvgMock
-        color="#121314"
+        color="#131416"
         fill="currentColor"
         height={20}
         name="Calendar"
@@ -800,11 +800,11 @@ exports[`DepositDateField render matches snapshot with empty value 1`] = `
         <TextInput
           editable={false}
           placeholder="01/01/2000"
-          placeholderTextColor="#b7bbc8"
+          placeholderTextColor="#babbbe"
           pointerEvents="none"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "flex": 1,
               "fontSize": 16,
               "height": "100%",
diff --git a/app/components/UI/Ramp/Deposit/components/DepositOrderContent/__snapshots__/DepositOrderContent.test.tsx.snap b/app/components/UI/Ramp/Deposit/components/DepositOrderContent/__snapshots__/DepositOrderContent.test.tsx.snap
index af4236454a9d..64cd923f9e39 100644
--- a/app/components/UI/Ramp/Deposit/components/DepositOrderContent/__snapshots__/DepositOrderContent.test.tsx.snap
+++ b/app/components/UI/Ramp/Deposit/components/DepositOrderContent/__snapshots__/DepositOrderContent.test.tsx.snap
@@ -176,7 +176,7 @@ exports[`DepositOrderContent Component renders bank transfer state correctly 1`]
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Bold",
           "fontSize": 40,
           "letterSpacing": 0,
@@ -194,7 +194,7 @@ exports[`DepositOrderContent Component renders bank transfer state correctly 1`]
       accessibilityRole="text"
       style={
         {
-          "color": "#686e7d",
+          "color": "#66676a",
           "fontFamily": "Geist-Regular",
           "fontSize": 14,
           "letterSpacing": 0,
@@ -210,7 +210,7 @@ exports[`DepositOrderContent Component renders bank transfer state correctly 1`]
     style={
       {
         "backgroundColor": "#ffffff",
-        "borderColor": "#b7bbc866",
+        "borderColor": "#b4b4b566",
         "borderRadius": 8,
         "borderWidth": 1,
         "marginBottom": 16,
@@ -233,7 +233,7 @@ exports[`DepositOrderContent Component renders bank transfer state correctly 1`]
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -247,7 +247,7 @@ exports[`DepositOrderContent Component renders bank transfer state correctly 1`]
         style={
           {
             "alignItems": "center",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderRadius": 36,
             "flexDirection": "row",
             "gap": 4,
@@ -260,7 +260,7 @@ exports[`DepositOrderContent Component renders bank transfer state correctly 1`]
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -284,7 +284,7 @@ exports[`DepositOrderContent Component renders bank transfer state correctly 1`]
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -319,7 +319,7 @@ exports[`DepositOrderContent Component renders bank transfer state correctly 1`]
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -345,7 +345,7 @@ exports[`DepositOrderContent Component renders bank transfer state correctly 1`]
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -369,7 +369,7 @@ exports[`DepositOrderContent Component renders bank transfer state correctly 1`]
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -381,7 +381,7 @@ exports[`DepositOrderContent Component renders bank transfer state correctly 1`]
           123456
         </Text>
         <SvgMock
-          color="#121314"
+          color="#131416"
           fill="currentColor"
           height={24}
           name="Copy"
@@ -398,7 +398,7 @@ exports[`DepositOrderContent Component renders bank transfer state correctly 1`]
     <View
       style={
         {
-          "backgroundColor": "#b7bbc866",
+          "backgroundColor": "#b4b4b566",
           "height": 1,
           "marginHorizontal": -16,
           "marginVertical": 8,
@@ -419,7 +419,7 @@ exports[`DepositOrderContent Component renders bank transfer state correctly 1`]
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -433,7 +433,7 @@ exports[`DepositOrderContent Component renders bank transfer state correctly 1`]
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -458,7 +458,7 @@ exports[`DepositOrderContent Component renders bank transfer state correctly 1`]
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -472,7 +472,7 @@ exports[`DepositOrderContent Component renders bank transfer state correctly 1`]
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -659,7 +659,7 @@ exports[`DepositOrderContent Component renders cancelled state correctly 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Bold",
           "fontSize": 40,
           "letterSpacing": 0,
@@ -677,7 +677,7 @@ exports[`DepositOrderContent Component renders cancelled state correctly 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#686e7d",
+          "color": "#66676a",
           "fontFamily": "Geist-Regular",
           "fontSize": 14,
           "letterSpacing": 0,
@@ -693,7 +693,7 @@ exports[`DepositOrderContent Component renders cancelled state correctly 1`] = `
     style={
       {
         "backgroundColor": "#ffffff",
-        "borderColor": "#b7bbc866",
+        "borderColor": "#b4b4b566",
         "borderRadius": 8,
         "borderWidth": 1,
         "marginBottom": 16,
@@ -716,7 +716,7 @@ exports[`DepositOrderContent Component renders cancelled state correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -730,7 +730,7 @@ exports[`DepositOrderContent Component renders cancelled state correctly 1`] = `
         style={
           {
             "alignItems": "center",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderRadius": 36,
             "flexDirection": "row",
             "gap": 4,
@@ -743,7 +743,7 @@ exports[`DepositOrderContent Component renders cancelled state correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -767,7 +767,7 @@ exports[`DepositOrderContent Component renders cancelled state correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -802,7 +802,7 @@ exports[`DepositOrderContent Component renders cancelled state correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -828,7 +828,7 @@ exports[`DepositOrderContent Component renders cancelled state correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -852,7 +852,7 @@ exports[`DepositOrderContent Component renders cancelled state correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -864,7 +864,7 @@ exports[`DepositOrderContent Component renders cancelled state correctly 1`] = `
           123456
         </Text>
         <SvgMock
-          color="#121314"
+          color="#131416"
           fill="currentColor"
           height={24}
           name="Copy"
@@ -881,7 +881,7 @@ exports[`DepositOrderContent Component renders cancelled state correctly 1`] = `
     <View
       style={
         {
-          "backgroundColor": "#b7bbc866",
+          "backgroundColor": "#b4b4b566",
           "height": 1,
           "marginHorizontal": -16,
           "marginVertical": 8,
@@ -902,7 +902,7 @@ exports[`DepositOrderContent Component renders cancelled state correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -916,7 +916,7 @@ exports[`DepositOrderContent Component renders cancelled state correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -941,7 +941,7 @@ exports[`DepositOrderContent Component renders cancelled state correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -955,7 +955,7 @@ exports[`DepositOrderContent Component renders cancelled state correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -1142,7 +1142,7 @@ exports[`DepositOrderContent Component renders error state correctly with status
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Bold",
           "fontSize": 40,
           "letterSpacing": 0,
@@ -1160,7 +1160,7 @@ exports[`DepositOrderContent Component renders error state correctly with status
       accessibilityRole="text"
       style={
         {
-          "color": "#686e7d",
+          "color": "#66676a",
           "fontFamily": "Geist-Regular",
           "fontSize": 14,
           "letterSpacing": 0,
@@ -1176,7 +1176,7 @@ exports[`DepositOrderContent Component renders error state correctly with status
     style={
       {
         "backgroundColor": "#ffffff",
-        "borderColor": "#b7bbc866",
+        "borderColor": "#b4b4b566",
         "borderRadius": 8,
         "borderWidth": 1,
         "marginBottom": 16,
@@ -1199,7 +1199,7 @@ exports[`DepositOrderContent Component renders error state correctly with status
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -1213,7 +1213,7 @@ exports[`DepositOrderContent Component renders error state correctly with status
         style={
           {
             "alignItems": "center",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderRadius": 36,
             "flexDirection": "row",
             "gap": 4,
@@ -1226,7 +1226,7 @@ exports[`DepositOrderContent Component renders error state correctly with status
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -1250,7 +1250,7 @@ exports[`DepositOrderContent Component renders error state correctly with status
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -1285,7 +1285,7 @@ exports[`DepositOrderContent Component renders error state correctly with status
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -1311,7 +1311,7 @@ exports[`DepositOrderContent Component renders error state correctly with status
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -1335,7 +1335,7 @@ exports[`DepositOrderContent Component renders error state correctly with status
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -1347,7 +1347,7 @@ exports[`DepositOrderContent Component renders error state correctly with status
           123456
         </Text>
         <SvgMock
-          color="#121314"
+          color="#131416"
           fill="currentColor"
           height={24}
           name="Copy"
@@ -1364,7 +1364,7 @@ exports[`DepositOrderContent Component renders error state correctly with status
     <View
       style={
         {
-          "backgroundColor": "#b7bbc866",
+          "backgroundColor": "#b4b4b566",
           "height": 1,
           "marginHorizontal": -16,
           "marginVertical": 8,
@@ -1385,7 +1385,7 @@ exports[`DepositOrderContent Component renders error state correctly with status
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -1399,7 +1399,7 @@ exports[`DepositOrderContent Component renders error state correctly with status
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -1424,7 +1424,7 @@ exports[`DepositOrderContent Component renders error state correctly with status
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -1438,7 +1438,7 @@ exports[`DepositOrderContent Component renders error state correctly with status
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -1625,7 +1625,7 @@ exports[`DepositOrderContent Component renders error state with specific failure
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Bold",
           "fontSize": 40,
           "letterSpacing": 0,
@@ -1643,7 +1643,7 @@ exports[`DepositOrderContent Component renders error state with specific failure
       accessibilityRole="text"
       style={
         {
-          "color": "#686e7d",
+          "color": "#66676a",
           "fontFamily": "Geist-Regular",
           "fontSize": 14,
           "letterSpacing": 0,
@@ -1659,7 +1659,7 @@ exports[`DepositOrderContent Component renders error state with specific failure
     style={
       {
         "backgroundColor": "#ffffff",
-        "borderColor": "#b7bbc866",
+        "borderColor": "#b4b4b566",
         "borderRadius": 8,
         "borderWidth": 1,
         "marginBottom": 16,
@@ -1682,7 +1682,7 @@ exports[`DepositOrderContent Component renders error state with specific failure
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -1696,7 +1696,7 @@ exports[`DepositOrderContent Component renders error state with specific failure
         style={
           {
             "alignItems": "center",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderRadius": 36,
             "flexDirection": "row",
             "gap": 4,
@@ -1709,7 +1709,7 @@ exports[`DepositOrderContent Component renders error state with specific failure
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -1733,7 +1733,7 @@ exports[`DepositOrderContent Component renders error state with specific failure
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -1768,7 +1768,7 @@ exports[`DepositOrderContent Component renders error state with specific failure
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -1794,7 +1794,7 @@ exports[`DepositOrderContent Component renders error state with specific failure
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -1818,7 +1818,7 @@ exports[`DepositOrderContent Component renders error state with specific failure
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -1830,7 +1830,7 @@ exports[`DepositOrderContent Component renders error state with specific failure
           123456
         </Text>
         <SvgMock
-          color="#121314"
+          color="#131416"
           fill="currentColor"
           height={24}
           name="Copy"
@@ -1847,7 +1847,7 @@ exports[`DepositOrderContent Component renders error state with specific failure
     <View
       style={
         {
-          "backgroundColor": "#b7bbc866",
+          "backgroundColor": "#b4b4b566",
           "height": 1,
           "marginHorizontal": -16,
           "marginVertical": 8,
@@ -1868,7 +1868,7 @@ exports[`DepositOrderContent Component renders error state with specific failure
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -1882,7 +1882,7 @@ exports[`DepositOrderContent Component renders error state with specific failure
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -1907,7 +1907,7 @@ exports[`DepositOrderContent Component renders error state with specific failure
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -1921,7 +1921,7 @@ exports[`DepositOrderContent Component renders error state with specific failure
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -2108,7 +2108,7 @@ exports[`DepositOrderContent Component renders no subtitle when statusDescriptio
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Bold",
           "fontSize": 40,
           "letterSpacing": 0,
@@ -2127,7 +2127,7 @@ exports[`DepositOrderContent Component renders no subtitle when statusDescriptio
     style={
       {
         "backgroundColor": "#ffffff",
-        "borderColor": "#b7bbc866",
+        "borderColor": "#b4b4b566",
         "borderRadius": 8,
         "borderWidth": 1,
         "marginBottom": 16,
@@ -2150,7 +2150,7 @@ exports[`DepositOrderContent Component renders no subtitle when statusDescriptio
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -2164,7 +2164,7 @@ exports[`DepositOrderContent Component renders no subtitle when statusDescriptio
         style={
           {
             "alignItems": "center",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderRadius": 36,
             "flexDirection": "row",
             "gap": 4,
@@ -2177,7 +2177,7 @@ exports[`DepositOrderContent Component renders no subtitle when statusDescriptio
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -2201,7 +2201,7 @@ exports[`DepositOrderContent Component renders no subtitle when statusDescriptio
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -2236,7 +2236,7 @@ exports[`DepositOrderContent Component renders no subtitle when statusDescriptio
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -2262,7 +2262,7 @@ exports[`DepositOrderContent Component renders no subtitle when statusDescriptio
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -2286,7 +2286,7 @@ exports[`DepositOrderContent Component renders no subtitle when statusDescriptio
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -2298,7 +2298,7 @@ exports[`DepositOrderContent Component renders no subtitle when statusDescriptio
           123456
         </Text>
         <SvgMock
-          color="#121314"
+          color="#131416"
           fill="currentColor"
           height={24}
           name="Copy"
@@ -2315,7 +2315,7 @@ exports[`DepositOrderContent Component renders no subtitle when statusDescriptio
     <View
       style={
         {
-          "backgroundColor": "#b7bbc866",
+          "backgroundColor": "#b4b4b566",
           "height": 1,
           "marginHorizontal": -16,
           "marginVertical": 8,
@@ -2336,7 +2336,7 @@ exports[`DepositOrderContent Component renders no subtitle when statusDescriptio
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -2350,7 +2350,7 @@ exports[`DepositOrderContent Component renders no subtitle when statusDescriptio
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -2375,7 +2375,7 @@ exports[`DepositOrderContent Component renders no subtitle when statusDescriptio
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -2389,7 +2389,7 @@ exports[`DepositOrderContent Component renders no subtitle when statusDescriptio
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -2580,7 +2580,7 @@ exports[`DepositOrderContent Component renders no subtitle when statusDescriptio
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Bold",
           "fontSize": 40,
           "letterSpacing": 0,
@@ -2599,7 +2599,7 @@ exports[`DepositOrderContent Component renders no subtitle when statusDescriptio
     style={
       {
         "backgroundColor": "#ffffff",
-        "borderColor": "#b7bbc866",
+        "borderColor": "#b4b4b566",
         "borderRadius": 8,
         "borderWidth": 1,
         "marginBottom": 16,
@@ -2622,7 +2622,7 @@ exports[`DepositOrderContent Component renders no subtitle when statusDescriptio
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -2636,7 +2636,7 @@ exports[`DepositOrderContent Component renders no subtitle when statusDescriptio
         style={
           {
             "alignItems": "center",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderRadius": 36,
             "flexDirection": "row",
             "gap": 4,
@@ -2649,7 +2649,7 @@ exports[`DepositOrderContent Component renders no subtitle when statusDescriptio
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -2673,7 +2673,7 @@ exports[`DepositOrderContent Component renders no subtitle when statusDescriptio
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -2708,7 +2708,7 @@ exports[`DepositOrderContent Component renders no subtitle when statusDescriptio
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -2734,7 +2734,7 @@ exports[`DepositOrderContent Component renders no subtitle when statusDescriptio
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -2758,7 +2758,7 @@ exports[`DepositOrderContent Component renders no subtitle when statusDescriptio
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -2770,7 +2770,7 @@ exports[`DepositOrderContent Component renders no subtitle when statusDescriptio
           123456
         </Text>
         <SvgMock
-          color="#121314"
+          color="#131416"
           fill="currentColor"
           height={24}
           name="Copy"
@@ -2787,7 +2787,7 @@ exports[`DepositOrderContent Component renders no subtitle when statusDescriptio
     <View
       style={
         {
-          "backgroundColor": "#b7bbc866",
+          "backgroundColor": "#b4b4b566",
           "height": 1,
           "marginHorizontal": -16,
           "marginVertical": 8,
@@ -2808,7 +2808,7 @@ exports[`DepositOrderContent Component renders no subtitle when statusDescriptio
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -2822,7 +2822,7 @@ exports[`DepositOrderContent Component renders no subtitle when statusDescriptio
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -2847,7 +2847,7 @@ exports[`DepositOrderContent Component renders no subtitle when statusDescriptio
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -2861,7 +2861,7 @@ exports[`DepositOrderContent Component renders no subtitle when statusDescriptio
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -3052,7 +3052,7 @@ exports[`DepositOrderContent Component renders processing state correctly 1`] =
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Bold",
           "fontSize": 40,
           "letterSpacing": 0,
@@ -3070,7 +3070,7 @@ exports[`DepositOrderContent Component renders processing state correctly 1`] =
       accessibilityRole="text"
       style={
         {
-          "color": "#686e7d",
+          "color": "#66676a",
           "fontFamily": "Geist-Regular",
           "fontSize": 14,
           "letterSpacing": 0,
@@ -3086,7 +3086,7 @@ exports[`DepositOrderContent Component renders processing state correctly 1`] =
     style={
       {
         "backgroundColor": "#ffffff",
-        "borderColor": "#b7bbc866",
+        "borderColor": "#b4b4b566",
         "borderRadius": 8,
         "borderWidth": 1,
         "marginBottom": 16,
@@ -3109,7 +3109,7 @@ exports[`DepositOrderContent Component renders processing state correctly 1`] =
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -3123,7 +3123,7 @@ exports[`DepositOrderContent Component renders processing state correctly 1`] =
         style={
           {
             "alignItems": "center",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderRadius": 36,
             "flexDirection": "row",
             "gap": 4,
@@ -3136,7 +3136,7 @@ exports[`DepositOrderContent Component renders processing state correctly 1`] =
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -3160,7 +3160,7 @@ exports[`DepositOrderContent Component renders processing state correctly 1`] =
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -3195,7 +3195,7 @@ exports[`DepositOrderContent Component renders processing state correctly 1`] =
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -3221,7 +3221,7 @@ exports[`DepositOrderContent Component renders processing state correctly 1`] =
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -3245,7 +3245,7 @@ exports[`DepositOrderContent Component renders processing state correctly 1`] =
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -3257,7 +3257,7 @@ exports[`DepositOrderContent Component renders processing state correctly 1`] =
           123456
         </Text>
         <SvgMock
-          color="#121314"
+          color="#131416"
           fill="currentColor"
           height={24}
           name="Copy"
@@ -3274,7 +3274,7 @@ exports[`DepositOrderContent Component renders processing state correctly 1`] =
     <View
       style={
         {
-          "backgroundColor": "#b7bbc866",
+          "backgroundColor": "#b4b4b566",
           "height": 1,
           "marginHorizontal": -16,
           "marginVertical": 8,
@@ -3295,7 +3295,7 @@ exports[`DepositOrderContent Component renders processing state correctly 1`] =
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -3309,7 +3309,7 @@ exports[`DepositOrderContent Component renders processing state correctly 1`] =
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -3334,7 +3334,7 @@ exports[`DepositOrderContent Component renders processing state correctly 1`] =
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -3348,7 +3348,7 @@ exports[`DepositOrderContent Component renders processing state correctly 1`] =
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -3535,7 +3535,7 @@ exports[`DepositOrderContent Component renders success state correctly 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Bold",
           "fontSize": 40,
           "letterSpacing": 0,
@@ -3553,7 +3553,7 @@ exports[`DepositOrderContent Component renders success state correctly 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#686e7d",
+          "color": "#66676a",
           "fontFamily": "Geist-Regular",
           "fontSize": 14,
           "letterSpacing": 0,
@@ -3569,7 +3569,7 @@ exports[`DepositOrderContent Component renders success state correctly 1`] = `
     style={
       {
         "backgroundColor": "#ffffff",
-        "borderColor": "#b7bbc866",
+        "borderColor": "#b4b4b566",
         "borderRadius": 8,
         "borderWidth": 1,
         "marginBottom": 16,
@@ -3592,7 +3592,7 @@ exports[`DepositOrderContent Component renders success state correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -3606,7 +3606,7 @@ exports[`DepositOrderContent Component renders success state correctly 1`] = `
         style={
           {
             "alignItems": "center",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderRadius": 36,
             "flexDirection": "row",
             "gap": 4,
@@ -3619,7 +3619,7 @@ exports[`DepositOrderContent Component renders success state correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -3643,7 +3643,7 @@ exports[`DepositOrderContent Component renders success state correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -3678,7 +3678,7 @@ exports[`DepositOrderContent Component renders success state correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -3704,7 +3704,7 @@ exports[`DepositOrderContent Component renders success state correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -3728,7 +3728,7 @@ exports[`DepositOrderContent Component renders success state correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -3740,7 +3740,7 @@ exports[`DepositOrderContent Component renders success state correctly 1`] = `
           123456
         </Text>
         <SvgMock
-          color="#121314"
+          color="#131416"
           fill="currentColor"
           height={24}
           name="Copy"
@@ -3757,7 +3757,7 @@ exports[`DepositOrderContent Component renders success state correctly 1`] = `
     <View
       style={
         {
-          "backgroundColor": "#b7bbc866",
+          "backgroundColor": "#b4b4b566",
           "height": 1,
           "marginHorizontal": -16,
           "marginVertical": 8,
@@ -3778,7 +3778,7 @@ exports[`DepositOrderContent Component renders success state correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -3792,7 +3792,7 @@ exports[`DepositOrderContent Component renders success state correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -3817,7 +3817,7 @@ exports[`DepositOrderContent Component renders success state correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -3831,7 +3831,7 @@ exports[`DepositOrderContent Component renders success state correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -4018,7 +4018,7 @@ exports[`DepositOrderContent Component renders with crypto fee when regular fee
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Bold",
           "fontSize": 40,
           "letterSpacing": 0,
@@ -4036,7 +4036,7 @@ exports[`DepositOrderContent Component renders with crypto fee when regular fee
       accessibilityRole="text"
       style={
         {
-          "color": "#686e7d",
+          "color": "#66676a",
           "fontFamily": "Geist-Regular",
           "fontSize": 14,
           "letterSpacing": 0,
@@ -4052,7 +4052,7 @@ exports[`DepositOrderContent Component renders with crypto fee when regular fee
     style={
       {
         "backgroundColor": "#ffffff",
-        "borderColor": "#b7bbc866",
+        "borderColor": "#b4b4b566",
         "borderRadius": 8,
         "borderWidth": 1,
         "marginBottom": 16,
@@ -4075,7 +4075,7 @@ exports[`DepositOrderContent Component renders with crypto fee when regular fee
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -4089,7 +4089,7 @@ exports[`DepositOrderContent Component renders with crypto fee when regular fee
         style={
           {
             "alignItems": "center",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderRadius": 36,
             "flexDirection": "row",
             "gap": 4,
@@ -4102,7 +4102,7 @@ exports[`DepositOrderContent Component renders with crypto fee when regular fee
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -4126,7 +4126,7 @@ exports[`DepositOrderContent Component renders with crypto fee when regular fee
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -4161,7 +4161,7 @@ exports[`DepositOrderContent Component renders with crypto fee when regular fee
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -4187,7 +4187,7 @@ exports[`DepositOrderContent Component renders with crypto fee when regular fee
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -4211,7 +4211,7 @@ exports[`DepositOrderContent Component renders with crypto fee when regular fee
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -4223,7 +4223,7 @@ exports[`DepositOrderContent Component renders with crypto fee when regular fee
           123456
         </Text>
         <SvgMock
-          color="#121314"
+          color="#131416"
           fill="currentColor"
           height={24}
           name="Copy"
@@ -4240,7 +4240,7 @@ exports[`DepositOrderContent Component renders with crypto fee when regular fee
     <View
       style={
         {
-          "backgroundColor": "#b7bbc866",
+          "backgroundColor": "#b4b4b566",
           "height": 1,
           "marginHorizontal": -16,
           "marginVertical": 8,
@@ -4261,7 +4261,7 @@ exports[`DepositOrderContent Component renders with crypto fee when regular fee
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -4275,7 +4275,7 @@ exports[`DepositOrderContent Component renders with crypto fee when regular fee
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -4300,7 +4300,7 @@ exports[`DepositOrderContent Component renders with crypto fee when regular fee
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -4314,7 +4314,7 @@ exports[`DepositOrderContent Component renders with crypto fee when regular fee
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -4501,7 +4501,7 @@ exports[`DepositOrderContent Component renders without fee when fee is not provi
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Bold",
           "fontSize": 40,
           "letterSpacing": 0,
@@ -4519,7 +4519,7 @@ exports[`DepositOrderContent Component renders without fee when fee is not provi
       accessibilityRole="text"
       style={
         {
-          "color": "#686e7d",
+          "color": "#66676a",
           "fontFamily": "Geist-Regular",
           "fontSize": 14,
           "letterSpacing": 0,
@@ -4535,7 +4535,7 @@ exports[`DepositOrderContent Component renders without fee when fee is not provi
     style={
       {
         "backgroundColor": "#ffffff",
-        "borderColor": "#b7bbc866",
+        "borderColor": "#b4b4b566",
         "borderRadius": 8,
         "borderWidth": 1,
         "marginBottom": 16,
@@ -4558,7 +4558,7 @@ exports[`DepositOrderContent Component renders without fee when fee is not provi
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -4572,7 +4572,7 @@ exports[`DepositOrderContent Component renders without fee when fee is not provi
         style={
           {
             "alignItems": "center",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderRadius": 36,
             "flexDirection": "row",
             "gap": 4,
@@ -4585,7 +4585,7 @@ exports[`DepositOrderContent Component renders without fee when fee is not provi
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -4609,7 +4609,7 @@ exports[`DepositOrderContent Component renders without fee when fee is not provi
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -4644,7 +4644,7 @@ exports[`DepositOrderContent Component renders without fee when fee is not provi
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -4670,7 +4670,7 @@ exports[`DepositOrderContent Component renders without fee when fee is not provi
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -4694,7 +4694,7 @@ exports[`DepositOrderContent Component renders without fee when fee is not provi
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -4706,7 +4706,7 @@ exports[`DepositOrderContent Component renders without fee when fee is not provi
           123456
         </Text>
         <SvgMock
-          color="#121314"
+          color="#131416"
           fill="currentColor"
           height={24}
           name="Copy"
@@ -4723,7 +4723,7 @@ exports[`DepositOrderContent Component renders without fee when fee is not provi
     <View
       style={
         {
-          "backgroundColor": "#b7bbc866",
+          "backgroundColor": "#b4b4b566",
           "height": 1,
           "marginHorizontal": -16,
           "marginVertical": 8,
@@ -4744,7 +4744,7 @@ exports[`DepositOrderContent Component renders without fee when fee is not provi
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -4758,7 +4758,7 @@ exports[`DepositOrderContent Component renders without fee when fee is not provi
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -4783,7 +4783,7 @@ exports[`DepositOrderContent Component renders without fee when fee is not provi
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -4797,7 +4797,7 @@ exports[`DepositOrderContent Component renders without fee when fee is not provi
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
diff --git a/app/components/UI/Ramp/Deposit/components/DepositPhoneField/__snapshots__/DepositPhoneField.test.tsx.snap b/app/components/UI/Ramp/Deposit/components/DepositPhoneField/__snapshots__/DepositPhoneField.test.tsx.snap
index a19844ad98a0..c58ed6a5c975 100644
--- a/app/components/UI/Ramp/Deposit/components/DepositPhoneField/__snapshots__/DepositPhoneField.test.tsx.snap
+++ b/app/components/UI/Ramp/Deposit/components/DepositPhoneField/__snapshots__/DepositPhoneField.test.tsx.snap
@@ -16,7 +16,7 @@ exports[`DepositPhoneField renders correctly after flag button press 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
@@ -61,8 +61,8 @@ exports[`DepositPhoneField renders correctly after flag button press 1`] = `
     style={
       {
         "alignItems": "center",
-        "backgroundColor": "#3c4d9d0f",
-        "borderColor": "#b7bbc866",
+        "backgroundColor": "#b4b4b528",
+        "borderColor": "#b4b4b566",
         "borderRadius": 12,
         "borderWidth": 1,
         "flexDirection": "row",
@@ -96,7 +96,7 @@ exports[`DepositPhoneField renders correctly after flag button press 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -110,7 +110,7 @@ exports[`DepositPhoneField renders correctly after flag button press 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#b7bbc8",
+              "color": "#babbbe",
               "fontFamily": "Geist-Regular",
               "fontSize": 14,
               "letterSpacing": 0,
@@ -142,18 +142,19 @@ exports[`DepositPhoneField renders correctly after flag button press 1`] = `
         onChangeText={[Function]}
         onFocus={[Function]}
         placeholder="30 12345678"
-        placeholderTextColor="#686e7d"
+        placeholderTextColor="#66676a"
         style={
           {
             "backgroundColor": "inherit",
             "borderColor": "transparent",
             "borderWidth": 1,
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "fontWeight": "400",
             "height": 46,
             "letterSpacing": 0,
+            "lineHeight": 0,
             "opacity": 1,
           }
         }
@@ -182,7 +183,7 @@ exports[`DepositPhoneField renders correctly after input change 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
@@ -227,8 +228,8 @@ exports[`DepositPhoneField renders correctly after input change 1`] = `
     style={
       {
         "alignItems": "center",
-        "backgroundColor": "#3c4d9d0f",
-        "borderColor": "#b7bbc866",
+        "backgroundColor": "#b4b4b528",
+        "borderColor": "#b4b4b566",
         "borderRadius": 12,
         "borderWidth": 1,
         "flexDirection": "row",
@@ -262,7 +263,7 @@ exports[`DepositPhoneField renders correctly after input change 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -276,7 +277,7 @@ exports[`DepositPhoneField renders correctly after input change 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#b7bbc8",
+              "color": "#babbbe",
               "fontFamily": "Geist-Regular",
               "fontSize": 14,
               "letterSpacing": 0,
@@ -308,18 +309,19 @@ exports[`DepositPhoneField renders correctly after input change 1`] = `
         onChangeText={[Function]}
         onFocus={[Function]}
         placeholder="30 12345678"
-        placeholderTextColor="#686e7d"
+        placeholderTextColor="#66676a"
         style={
           {
             "backgroundColor": "inherit",
             "borderColor": "transparent",
             "borderWidth": 1,
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "fontWeight": "400",
             "height": 46,
             "letterSpacing": 0,
+            "lineHeight": 0,
             "opacity": 1,
           }
         }
@@ -348,7 +350,7 @@ exports[`DepositPhoneField renders correctly with default props 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
@@ -393,8 +395,8 @@ exports[`DepositPhoneField renders correctly with default props 1`] = `
     style={
       {
         "alignItems": "center",
-        "backgroundColor": "#3c4d9d0f",
-        "borderColor": "#b7bbc866",
+        "backgroundColor": "#b4b4b528",
+        "borderColor": "#b4b4b566",
         "borderRadius": 12,
         "borderWidth": 1,
         "flexDirection": "row",
@@ -428,7 +430,7 @@ exports[`DepositPhoneField renders correctly with default props 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -442,7 +444,7 @@ exports[`DepositPhoneField renders correctly with default props 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#b7bbc8",
+              "color": "#babbbe",
               "fontFamily": "Geist-Regular",
               "fontSize": 14,
               "letterSpacing": 0,
@@ -474,18 +476,19 @@ exports[`DepositPhoneField renders correctly with default props 1`] = `
         onChangeText={[Function]}
         onFocus={[Function]}
         placeholder="(555) 123-4567"
-        placeholderTextColor="#686e7d"
+        placeholderTextColor="#66676a"
         style={
           {
             "backgroundColor": "inherit",
             "borderColor": "transparent",
             "borderWidth": 1,
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "fontWeight": "400",
             "height": 46,
             "letterSpacing": 0,
+            "lineHeight": 0,
             "opacity": 1,
           }
         }
@@ -514,7 +517,7 @@ exports[`DepositPhoneField renders correctly with different region 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
@@ -559,8 +562,8 @@ exports[`DepositPhoneField renders correctly with different region 1`] = `
     style={
       {
         "alignItems": "center",
-        "backgroundColor": "#3c4d9d0f",
-        "borderColor": "#b7bbc866",
+        "backgroundColor": "#b4b4b528",
+        "borderColor": "#b4b4b566",
         "borderRadius": 12,
         "borderWidth": 1,
         "flexDirection": "row",
@@ -594,7 +597,7 @@ exports[`DepositPhoneField renders correctly with different region 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -608,7 +611,7 @@ exports[`DepositPhoneField renders correctly with different region 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#b7bbc8",
+              "color": "#babbbe",
               "fontFamily": "Geist-Regular",
               "fontSize": 14,
               "letterSpacing": 0,
@@ -640,18 +643,19 @@ exports[`DepositPhoneField renders correctly with different region 1`] = `
         onChangeText={[Function]}
         onFocus={[Function]}
         placeholder="30 12345678"
-        placeholderTextColor="#686e7d"
+        placeholderTextColor="#66676a"
         style={
           {
             "backgroundColor": "inherit",
             "borderColor": "transparent",
             "borderWidth": 1,
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "fontWeight": "400",
             "height": 46,
             "letterSpacing": 0,
+            "lineHeight": 0,
             "opacity": 1,
           }
         }
@@ -680,7 +684,7 @@ exports[`DepositPhoneField renders correctly with error message 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
@@ -725,8 +729,8 @@ exports[`DepositPhoneField renders correctly with error message 1`] = `
     style={
       {
         "alignItems": "center",
-        "backgroundColor": "#3c4d9d0f",
-        "borderColor": "#b7bbc866",
+        "backgroundColor": "#b4b4b528",
+        "borderColor": "#b4b4b566",
         "borderRadius": 12,
         "borderWidth": 1,
         "flexDirection": "row",
@@ -760,7 +764,7 @@ exports[`DepositPhoneField renders correctly with error message 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -774,7 +778,7 @@ exports[`DepositPhoneField renders correctly with error message 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#b7bbc8",
+              "color": "#babbbe",
               "fontFamily": "Geist-Regular",
               "fontSize": 14,
               "letterSpacing": 0,
@@ -806,18 +810,19 @@ exports[`DepositPhoneField renders correctly with error message 1`] = `
         onChangeText={[Function]}
         onFocus={[Function]}
         placeholder="(555) 123-4567"
-        placeholderTextColor="#686e7d"
+        placeholderTextColor="#66676a"
         style={
           {
             "backgroundColor": "inherit",
             "borderColor": "transparent",
             "borderWidth": 1,
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "fontWeight": "400",
             "height": 46,
             "letterSpacing": 0,
+            "lineHeight": 0,
             "opacity": 1,
           }
         }
@@ -861,7 +866,7 @@ exports[`DepositPhoneField renders correctly with long phone number 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
@@ -906,8 +911,8 @@ exports[`DepositPhoneField renders correctly with long phone number 1`] = `
     style={
       {
         "alignItems": "center",
-        "backgroundColor": "#3c4d9d0f",
-        "borderColor": "#b7bbc866",
+        "backgroundColor": "#b4b4b528",
+        "borderColor": "#b4b4b566",
         "borderRadius": 12,
         "borderWidth": 1,
         "flexDirection": "row",
@@ -941,7 +946,7 @@ exports[`DepositPhoneField renders correctly with long phone number 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -955,7 +960,7 @@ exports[`DepositPhoneField renders correctly with long phone number 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#b7bbc8",
+              "color": "#babbbe",
               "fontFamily": "Geist-Regular",
               "fontSize": 14,
               "letterSpacing": 0,
@@ -987,13 +992,13 @@ exports[`DepositPhoneField renders correctly with long phone number 1`] = `
         onChangeText={[Function]}
         onFocus={[Function]}
         placeholder="(555) 123-4567"
-        placeholderTextColor="#686e7d"
+        placeholderTextColor="#66676a"
         style={
           {
             "backgroundColor": "inherit",
             "borderColor": "transparent",
             "borderWidth": 1,
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "fontWeight": "400",
@@ -1027,7 +1032,7 @@ exports[`DepositPhoneField renders correctly with onSubmitEditing callback 1`] =
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
@@ -1072,8 +1077,8 @@ exports[`DepositPhoneField renders correctly with onSubmitEditing callback 1`] =
     style={
       {
         "alignItems": "center",
-        "backgroundColor": "#3c4d9d0f",
-        "borderColor": "#b7bbc866",
+        "backgroundColor": "#b4b4b528",
+        "borderColor": "#b4b4b566",
         "borderRadius": 12,
         "borderWidth": 1,
         "flexDirection": "row",
@@ -1107,7 +1112,7 @@ exports[`DepositPhoneField renders correctly with onSubmitEditing callback 1`] =
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -1121,7 +1126,7 @@ exports[`DepositPhoneField renders correctly with onSubmitEditing callback 1`] =
           accessibilityRole="text"
           style={
             {
-              "color": "#b7bbc8",
+              "color": "#babbbe",
               "fontFamily": "Geist-Regular",
               "fontSize": 14,
               "letterSpacing": 0,
@@ -1154,18 +1159,19 @@ exports[`DepositPhoneField renders correctly with onSubmitEditing callback 1`] =
         onFocus={[Function]}
         onSubmitEditing={[MockFunction]}
         placeholder="(555) 123-4567"
-        placeholderTextColor="#686e7d"
+        placeholderTextColor="#66676a"
         style={
           {
             "backgroundColor": "inherit",
             "borderColor": "transparent",
             "borderWidth": 1,
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "fontWeight": "400",
             "height": 46,
             "letterSpacing": 0,
+            "lineHeight": 0,
             "opacity": 1,
           }
         }
@@ -1194,7 +1200,7 @@ exports[`DepositPhoneField renders correctly with special characters in phone nu
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
@@ -1239,8 +1245,8 @@ exports[`DepositPhoneField renders correctly with special characters in phone nu
     style={
       {
         "alignItems": "center",
-        "backgroundColor": "#3c4d9d0f",
-        "borderColor": "#b7bbc866",
+        "backgroundColor": "#b4b4b528",
+        "borderColor": "#b4b4b566",
         "borderRadius": 12,
         "borderWidth": 1,
         "flexDirection": "row",
@@ -1274,7 +1280,7 @@ exports[`DepositPhoneField renders correctly with special characters in phone nu
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -1288,7 +1294,7 @@ exports[`DepositPhoneField renders correctly with special characters in phone nu
           accessibilityRole="text"
           style={
             {
-              "color": "#b7bbc8",
+              "color": "#babbbe",
               "fontFamily": "Geist-Regular",
               "fontSize": 14,
               "letterSpacing": 0,
@@ -1320,13 +1326,13 @@ exports[`DepositPhoneField renders correctly with special characters in phone nu
         onChangeText={[Function]}
         onFocus={[Function]}
         placeholder="(555) 123-4567"
-        placeholderTextColor="#686e7d"
+        placeholderTextColor="#66676a"
         style={
           {
             "backgroundColor": "inherit",
             "borderColor": "transparent",
             "borderWidth": 1,
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "fontWeight": "400",
@@ -1360,7 +1366,7 @@ exports[`DepositPhoneField renders correctly with unsupported region 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
@@ -1405,8 +1411,8 @@ exports[`DepositPhoneField renders correctly with unsupported region 1`] = `
     style={
       {
         "alignItems": "center",
-        "backgroundColor": "#3c4d9d0f",
-        "borderColor": "#b7bbc866",
+        "backgroundColor": "#b4b4b528",
+        "borderColor": "#b4b4b566",
         "borderRadius": 12,
         "borderWidth": 1,
         "flexDirection": "row",
@@ -1440,7 +1446,7 @@ exports[`DepositPhoneField renders correctly with unsupported region 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -1454,7 +1460,7 @@ exports[`DepositPhoneField renders correctly with unsupported region 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#b7bbc8",
+              "color": "#babbbe",
               "fontFamily": "Geist-Regular",
               "fontSize": 14,
               "letterSpacing": 0,
@@ -1486,18 +1492,19 @@ exports[`DepositPhoneField renders correctly with unsupported region 1`] = `
         onChangeText={[Function]}
         onFocus={[Function]}
         placeholder="(555) 123-4567"
-        placeholderTextColor="#686e7d"
+        placeholderTextColor="#66676a"
         style={
           {
             "backgroundColor": "inherit",
             "borderColor": "transparent",
             "borderWidth": 1,
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "fontWeight": "400",
             "height": 46,
             "letterSpacing": 0,
+            "lineHeight": 0,
             "opacity": 1,
           }
         }
@@ -1526,7 +1533,7 @@ exports[`DepositPhoneField renders correctly with value 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
@@ -1571,8 +1578,8 @@ exports[`DepositPhoneField renders correctly with value 1`] = `
     style={
       {
         "alignItems": "center",
-        "backgroundColor": "#3c4d9d0f",
-        "borderColor": "#b7bbc866",
+        "backgroundColor": "#b4b4b528",
+        "borderColor": "#b4b4b566",
         "borderRadius": 12,
         "borderWidth": 1,
         "flexDirection": "row",
@@ -1606,7 +1613,7 @@ exports[`DepositPhoneField renders correctly with value 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -1620,7 +1627,7 @@ exports[`DepositPhoneField renders correctly with value 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#b7bbc8",
+              "color": "#babbbe",
               "fontFamily": "Geist-Regular",
               "fontSize": 14,
               "letterSpacing": 0,
@@ -1652,13 +1659,13 @@ exports[`DepositPhoneField renders correctly with value 1`] = `
         onChangeText={[Function]}
         onFocus={[Function]}
         placeholder="(555) 123-4567"
-        placeholderTextColor="#686e7d"
+        placeholderTextColor="#66676a"
         style={
           {
             "backgroundColor": "inherit",
             "borderColor": "transparent",
             "borderWidth": 1,
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "fontWeight": "400",
@@ -1692,7 +1699,7 @@ exports[`DepositPhoneField updates phone region when region is selected from mod
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
@@ -1737,8 +1744,8 @@ exports[`DepositPhoneField updates phone region when region is selected from mod
     style={
       {
         "alignItems": "center",
-        "backgroundColor": "#3c4d9d0f",
-        "borderColor": "#b7bbc866",
+        "backgroundColor": "#b4b4b528",
+        "borderColor": "#b4b4b566",
         "borderRadius": 12,
         "borderWidth": 1,
         "flexDirection": "row",
@@ -1772,7 +1779,7 @@ exports[`DepositPhoneField updates phone region when region is selected from mod
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -1786,7 +1793,7 @@ exports[`DepositPhoneField updates phone region when region is selected from mod
           accessibilityRole="text"
           style={
             {
-              "color": "#b7bbc8",
+              "color": "#babbbe",
               "fontFamily": "Geist-Regular",
               "fontSize": 14,
               "letterSpacing": 0,
@@ -1818,18 +1825,19 @@ exports[`DepositPhoneField updates phone region when region is selected from mod
         onChangeText={[Function]}
         onFocus={[Function]}
         placeholder="30 12345678"
-        placeholderTextColor="#686e7d"
+        placeholderTextColor="#66676a"
         style={
           {
             "backgroundColor": "inherit",
             "borderColor": "transparent",
             "borderWidth": 1,
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "fontWeight": "400",
             "height": 46,
             "letterSpacing": 0,
+            "lineHeight": 0,
             "opacity": 1,
           }
         }
diff --git a/app/components/UI/Ramp/Deposit/components/ErrorView/__snapshots__/ErrorView.test.tsx.snap b/app/components/UI/Ramp/Deposit/components/ErrorView/__snapshots__/ErrorView.test.tsx.snap
index 8c8b87e9523a..15409e8d6725 100644
--- a/app/components/UI/Ramp/Deposit/components/ErrorView/__snapshots__/ErrorView.test.tsx.snap
+++ b/app/components/UI/Ramp/Deposit/components/ErrorView/__snapshots__/ErrorView.test.tsx.snap
@@ -387,7 +387,7 @@ exports[`ErrorView Component renders with all props and matches snapshot 1`] = `
                               {
                                 "color": "#ca3542",
                                 "fontFamily": "Geist-Bold",
-                                "fontSize": 18,
+                                "fontSize": 20,
                                 "letterSpacing": 0,
                                 "lineHeight": 24,
                                 "textAlign": "center",
@@ -400,7 +400,7 @@ exports[`ErrorView Component renders with all props and matches snapshot 1`] = `
                             accessibilityRole="text"
                             style={
                               {
-                                "color": "#686e7d",
+                                "color": "#66676a",
                                 "fontFamily": "Geist-Regular",
                                 "fontSize": 16,
                                 "letterSpacing": 0,
@@ -422,7 +422,7 @@ exports[`ErrorView Component renders with all props and matches snapshot 1`] = `
                               {
                                 "alignItems": "center",
                                 "alignSelf": "center",
-                                "backgroundColor": "#121314",
+                                "backgroundColor": "#131416",
                                 "borderRadius": 12,
                                 "flexDirection": "row",
                                 "height": 48,
@@ -849,7 +849,7 @@ exports[`ErrorView Component renders with default props and matches snapshot 1`]
                               {
                                 "color": "#ca3542",
                                 "fontFamily": "Geist-Bold",
-                                "fontSize": 18,
+                                "fontSize": 20,
                                 "letterSpacing": 0,
                                 "lineHeight": 24,
                                 "textAlign": "center",
@@ -862,7 +862,7 @@ exports[`ErrorView Component renders with default props and matches snapshot 1`]
                             accessibilityRole="text"
                             style={
                               {
-                                "color": "#686e7d",
+                                "color": "#66676a",
                                 "fontFamily": "Geist-Regular",
                                 "fontSize": 16,
                                 "letterSpacing": 0,
diff --git a/app/components/UI/Ramp/Deposit/components/NetworksFilterBar/__snapshots__/NetworksFilterBar.test.tsx.snap b/app/components/UI/Ramp/Deposit/components/NetworksFilterBar/__snapshots__/NetworksFilterBar.test.tsx.snap
index d6d396867283..1592ec8ab5e5 100644
--- a/app/components/UI/Ramp/Deposit/components/NetworksFilterBar/__snapshots__/NetworksFilterBar.test.tsx.snap
+++ b/app/components/UI/Ramp/Deposit/components/NetworksFilterBar/__snapshots__/NetworksFilterBar.test.tsx.snap
@@ -29,7 +29,7 @@ exports[`NetworksFilterBar renders correctly when networkFilter is a subset of u
         {
           "alignItems": "center",
           "alignSelf": "flex-start",
-          "backgroundColor": "#3c4d9d0f",
+          "backgroundColor": "#b4b4b528",
           "borderColor": "transparent",
           "borderRadius": 12,
           "borderWidth": 1,
@@ -60,7 +60,7 @@ exports[`NetworksFilterBar renders correctly when networkFilter is a subset of u
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -71,7 +71,7 @@ exports[`NetworksFilterBar renders correctly when networkFilter is a subset of u
           See all
         </Text>
         <SvgMock
-          color="#121314"
+          color="#131416"
           fill="currentColor"
           height={12}
           name="ArrowDown"
@@ -96,7 +96,7 @@ exports[`NetworksFilterBar renders correctly when networkFilter is a subset of u
         {
           "alignItems": "center",
           "alignSelf": "flex-start",
-          "backgroundColor": "#121314",
+          "backgroundColor": "#131416",
           "borderRadius": 12,
           "flexDirection": "row",
           "height": 32,
@@ -159,7 +159,7 @@ exports[`NetworksFilterBar renders correctly when networkFilter is a subset of u
         {
           "alignItems": "center",
           "alignSelf": "flex-start",
-          "backgroundColor": "#121314",
+          "backgroundColor": "#131416",
           "borderRadius": 12,
           "flexDirection": "row",
           "height": 32,
@@ -222,7 +222,7 @@ exports[`NetworksFilterBar renders correctly when networkFilter is a subset of u
         {
           "alignItems": "center",
           "alignSelf": "flex-start",
-          "backgroundColor": "#3c4d9d0f",
+          "backgroundColor": "#b4b4b528",
           "borderColor": "transparent",
           "borderRadius": 12,
           "borderWidth": 1,
@@ -238,7 +238,7 @@ exports[`NetworksFilterBar renders correctly when networkFilter is a subset of u
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -282,7 +282,7 @@ exports[`NetworksFilterBar renders correctly when networkFilter is null 1`] = `
         {
           "alignItems": "center",
           "alignSelf": "flex-start",
-          "backgroundColor": "#3c4d9d0f",
+          "backgroundColor": "#b4b4b528",
           "borderColor": "transparent",
           "borderRadius": 12,
           "borderWidth": 1,
@@ -413,7 +413,7 @@ exports[`NetworksFilterBar renders correctly when networkFilter is null 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -424,7 +424,7 @@ exports[`NetworksFilterBar renders correctly when networkFilter is null 1`] = `
           All networks
         </Text>
         <SvgMock
-          color="#121314"
+          color="#131416"
           fill="currentColor"
           height={12}
           name="ArrowDown"
@@ -471,7 +471,7 @@ exports[`NetworksFilterBar renders correctly when networkFilter is the same as u
         {
           "alignItems": "center",
           "alignSelf": "flex-start",
-          "backgroundColor": "#3c4d9d0f",
+          "backgroundColor": "#b4b4b528",
           "borderColor": "transparent",
           "borderRadius": 12,
           "borderWidth": 1,
@@ -602,7 +602,7 @@ exports[`NetworksFilterBar renders correctly when networkFilter is the same as u
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -613,7 +613,7 @@ exports[`NetworksFilterBar renders correctly when networkFilter is the same as u
           All networks
         </Text>
         <SvgMock
-          color="#121314"
+          color="#131416"
           fill="currentColor"
           height={12}
           name="ArrowDown"
diff --git a/app/components/UI/Ramp/Deposit/components/NetworksFilterSelector/__snapshots__/NetworksFilterSelector.test.tsx.snap b/app/components/UI/Ramp/Deposit/components/NetworksFilterSelector/__snapshots__/NetworksFilterSelector.test.tsx.snap
index dbce51769453..286ecd14b0b7 100644
--- a/app/components/UI/Ramp/Deposit/components/NetworksFilterSelector/__snapshots__/NetworksFilterSelector.test.tsx.snap
+++ b/app/components/UI/Ramp/Deposit/components/NetworksFilterSelector/__snapshots__/NetworksFilterSelector.test.tsx.snap
@@ -226,7 +226,7 @@ exports[`NetworksFilterSelector renders correctly when networkFilter is a subset
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -393,7 +393,7 @@ exports[`NetworksFilterSelector renders correctly when networkFilter is a subset
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -468,7 +468,7 @@ exports[`NetworksFilterSelector renders correctly when networkFilter is a subset
                       {
                         "alignItems": "center",
                         "backgroundColor": "#ffffff",
-                        "borderColor": "#b7bbc8",
+                        "borderColor": "#949596",
                         "borderRadius": 4,
                         "borderWidth": 2,
                         "height": 20,
@@ -544,7 +544,7 @@ exports[`NetworksFilterSelector renders correctly when networkFilter is a subset
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -580,7 +580,7 @@ exports[`NetworksFilterSelector renders correctly when networkFilter is a subset
         {
           "alignItems": "center",
           "alignSelf": "stretch",
-          "backgroundColor": "#121314",
+          "backgroundColor": "#131416",
           "borderRadius": 12,
           "flexDirection": "row",
           "height": 48,
@@ -743,7 +743,7 @@ exports[`NetworksFilterSelector renders correctly when networkFilter is null 1`]
                       {
                         "alignItems": "center",
                         "backgroundColor": "#ffffff",
-                        "borderColor": "#b7bbc8",
+                        "borderColor": "#949596",
                         "borderRadius": 4,
                         "borderWidth": 2,
                         "height": 20,
@@ -819,7 +819,7 @@ exports[`NetworksFilterSelector renders correctly when networkFilter is null 1`]
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -894,7 +894,7 @@ exports[`NetworksFilterSelector renders correctly when networkFilter is null 1`]
                       {
                         "alignItems": "center",
                         "backgroundColor": "#ffffff",
-                        "borderColor": "#b7bbc8",
+                        "borderColor": "#949596",
                         "borderRadius": 4,
                         "borderWidth": 2,
                         "height": 20,
@@ -970,7 +970,7 @@ exports[`NetworksFilterSelector renders correctly when networkFilter is null 1`]
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -1045,7 +1045,7 @@ exports[`NetworksFilterSelector renders correctly when networkFilter is null 1`]
                       {
                         "alignItems": "center",
                         "backgroundColor": "#ffffff",
-                        "borderColor": "#b7bbc8",
+                        "borderColor": "#949596",
                         "borderRadius": 4,
                         "borderWidth": 2,
                         "height": 20,
@@ -1121,7 +1121,7 @@ exports[`NetworksFilterSelector renders correctly when networkFilter is null 1`]
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -1157,7 +1157,7 @@ exports[`NetworksFilterSelector renders correctly when networkFilter is null 1`]
         {
           "alignItems": "center",
           "alignSelf": "stretch",
-          "backgroundColor": "#121314",
+          "backgroundColor": "#131416",
           "borderRadius": 12,
           "flexDirection": "row",
           "height": 48,
@@ -1412,7 +1412,7 @@ exports[`NetworksFilterSelector renders correctly when networkFilter is the same
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -1579,7 +1579,7 @@ exports[`NetworksFilterSelector renders correctly when networkFilter is the same
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -1746,7 +1746,7 @@ exports[`NetworksFilterSelector renders correctly when networkFilter is the same
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -1782,7 +1782,7 @@ exports[`NetworksFilterSelector renders correctly when networkFilter is the same
         {
           "alignItems": "center",
           "alignSelf": "stretch",
-          "backgroundColor": "#121314",
+          "backgroundColor": "#131416",
           "borderRadius": 12,
           "flexDirection": "row",
           "height": 48,
diff --git a/app/components/UI/Ramp/Deposit/components/SdkErrorAlert/__snapshots__/SdkErrorAlert.test.tsx.snap b/app/components/UI/Ramp/Deposit/components/SdkErrorAlert/__snapshots__/SdkErrorAlert.test.tsx.snap
index edac065b5054..f2408ad847ee 100644
--- a/app/components/UI/Ramp/Deposit/components/SdkErrorAlert/__snapshots__/SdkErrorAlert.test.tsx.snap
+++ b/app/components/UI/Ramp/Deposit/components/SdkErrorAlert/__snapshots__/SdkErrorAlert.test.tsx.snap
@@ -47,7 +47,7 @@ exports[`SdkErrorAlert disables retry button when isRetrying is true 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 14,
           "letterSpacing": 0,
@@ -68,7 +68,7 @@ exports[`SdkErrorAlert disables retry button when isRetrying is true 1`] = `
       style={
         {
           "backgroundColor": "transparent",
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -143,7 +143,7 @@ exports[`SdkErrorAlert does not render retry button when onRetry is not provided
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 14,
           "letterSpacing": 0,
@@ -204,7 +204,7 @@ exports[`SdkErrorAlert renders payment methods error message 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 14,
           "letterSpacing": 0,
@@ -225,7 +225,7 @@ exports[`SdkErrorAlert renders payment methods error message 1`] = `
       style={
         {
           "backgroundColor": "transparent",
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -300,7 +300,7 @@ exports[`SdkErrorAlert renders regions error message 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 14,
           "letterSpacing": 0,
@@ -321,7 +321,7 @@ exports[`SdkErrorAlert renders regions error message 1`] = `
       style={
         {
           "backgroundColor": "transparent",
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -396,7 +396,7 @@ exports[`SdkErrorAlert renders tokens error message 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 14,
           "letterSpacing": 0,
@@ -417,7 +417,7 @@ exports[`SdkErrorAlert renders tokens error message 1`] = `
       style={
         {
           "backgroundColor": "transparent",
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -492,7 +492,7 @@ exports[`SdkErrorAlert renders user details error message 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 14,
           "letterSpacing": 0,
@@ -513,7 +513,7 @@ exports[`SdkErrorAlert renders user details error message 1`] = `
       style={
         {
           "backgroundColor": "transparent",
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
diff --git a/app/components/UI/Ramp/Deposit/components/TruncatedError/__snapshots__/TruncatedError.test.tsx.snap b/app/components/UI/Ramp/Deposit/components/TruncatedError/__snapshots__/TruncatedError.test.tsx.snap
index 05fcdd634357..76c7b8980aaf 100644
--- a/app/components/UI/Ramp/Deposit/components/TruncatedError/__snapshots__/TruncatedError.test.tsx.snap
+++ b/app/components/UI/Ramp/Deposit/components/TruncatedError/__snapshots__/TruncatedError.test.tsx.snap
@@ -57,7 +57,7 @@ exports[`TruncatedError Basic rendering renders correctly and matches snapshot 1
         onTextLayout={[Function]}
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 14,
             "letterSpacing": 0,
@@ -129,7 +129,7 @@ exports[`TruncatedError Basic rendering renders with custom maxLines prop 1`] =
         onTextLayout={[Function]}
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 14,
             "letterSpacing": 0,
@@ -201,7 +201,7 @@ exports[`TruncatedError Long error text renders "See more" button for long error
         onTextLayout={[Function]}
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 14,
             "letterSpacing": 0,
@@ -220,7 +220,7 @@ exports[`TruncatedError Long error text renders "See more" button for long error
         style={
           {
             "backgroundColor": "transparent",
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
diff --git a/app/components/UI/Ramp/Deposit/hooks/useHandleNewOrder.ts b/app/components/UI/Ramp/Deposit/hooks/useHandleNewOrder.ts
index f48bc0fc51dc..154a4df8d149 100644
--- a/app/components/UI/Ramp/Deposit/hooks/useHandleNewOrder.ts
+++ b/app/components/UI/Ramp/Deposit/hooks/useHandleNewOrder.ts
@@ -1,12 +1,17 @@
 import { useCallback } from 'react';
+import { InteractionManager } from 'react-native';
 import stateHasOrder from '../../utils/stateHasOrder';
 import { addFiatOrder, FiatOrder } from '../../../../../reducers/fiatOrders';
 import NotificationManager from '../../../../../core/NotificationManager';
 import useThunkDispatch from '../../../../hooks/useThunkDispatch';
 import { getNotificationDetails } from '../utils';
+import { RampsOrderStatus } from '@metamask/ramps-controller';
+import useRampsUnifiedV2Enabled from '../../hooks/useRampsUnifiedV2Enabled';
+import { showV2OrderToast } from '../../utils/v2OrderToast';
 
 function useHandleNewOrder() {
   const dispatchThunk = useThunkDispatch();
+  const isV2Enabled = useRampsUnifiedV2Enabled();
 
   return useCallback(
     async (order: FiatOrder) => {
@@ -16,13 +21,24 @@ function useHandleNewOrder() {
           return;
         }
         _dispatch(addFiatOrder(order));
-        const notificationDetails = getNotificationDetails(order);
-        if (notificationDetails) {
-          NotificationManager.showSimpleNotification(notificationDetails);
-        }
+        InteractionManager.runAfterInteractions(() => {
+          if (isV2Enabled) {
+            showV2OrderToast({
+              orderId: order.id,
+              cryptocurrency: order.cryptocurrency,
+              cryptoAmount: order.cryptoAmount,
+              status: order.state as unknown as RampsOrderStatus,
+            });
+          } else {
+            const notificationDetails = getNotificationDetails(order);
+            if (notificationDetails) {
+              NotificationManager.showSimpleNotification(notificationDetails);
+            }
+          }
+        });
       });
     },
-    [dispatchThunk],
+    [dispatchThunk, isV2Enabled],
   );
 }
 
diff --git a/app/components/UI/Ramp/Deposit/orderProcessor/index.ts b/app/components/UI/Ramp/Deposit/orderProcessor/index.ts
index 1b026842317e..a3c17a7e423a 100644
--- a/app/components/UI/Ramp/Deposit/orderProcessor/index.ts
+++ b/app/components/UI/Ramp/Deposit/orderProcessor/index.ts
@@ -96,7 +96,11 @@ export async function processDepositOrder(
   } catch (error) {
     Logger.error(error as Error, {
       message: 'DepositOrder::Processor error while processing order',
-      order,
+      orderId: order.id,
+      provider: order.provider,
+      orderType: order.orderType,
+      state: order.state,
+      network: order.network,
     });
     return order;
   }
diff --git a/app/components/UI/Ramp/Deposit/sdk/getSdkEnvironment.test.ts b/app/components/UI/Ramp/Deposit/sdk/getSdkEnvironment.test.ts
index b208fcde4412..fd691818f6b6 100644
--- a/app/components/UI/Ramp/Deposit/sdk/getSdkEnvironment.test.ts
+++ b/app/components/UI/Ramp/Deposit/sdk/getSdkEnvironment.test.ts
@@ -3,37 +3,32 @@ import { getSdkEnvironment } from './getSdkEnvironment';
 
 describe('getSdkEnvironment', () => {
   const originalEnv = process.env.METAMASK_ENVIRONMENT;
-  const originalGithubActions = process.env.GITHUB_ACTIONS;
+  const originalBuildsEnabled =
+    process.env.BUILDS_ENABLED_WITH_GH_ACTIONS_TEMPORARY;
   const originalRampsEnvironment = process.env.RAMPS_ENVIRONMENT;
-  const originalE2e = process.env.E2E;
 
   beforeEach(() => {
-    process.env.GITHUB_ACTIONS = 'false';
+    process.env.BUILDS_ENABLED_WITH_GH_ACTIONS_TEMPORARY = 'false';
   });
 
   afterEach(() => {
     process.env.METAMASK_ENVIRONMENT = originalEnv;
-    if (originalGithubActions !== undefined) {
-      process.env.GITHUB_ACTIONS = originalGithubActions;
+    if (originalBuildsEnabled !== undefined) {
+      process.env.BUILDS_ENABLED_WITH_GH_ACTIONS_TEMPORARY =
+        originalBuildsEnabled;
     } else {
-      delete process.env.GITHUB_ACTIONS;
+      delete process.env.BUILDS_ENABLED_WITH_GH_ACTIONS_TEMPORARY;
     }
     if (originalRampsEnvironment !== undefined) {
       process.env.RAMPS_ENVIRONMENT = originalRampsEnvironment;
     } else {
       delete process.env.RAMPS_ENVIRONMENT;
     }
-    if (originalE2e !== undefined) {
-      process.env.E2E = originalE2e;
-    } else {
-      delete process.env.E2E;
-    }
   });
 
-  describe('when GITHUB_ACTIONS (builds.yml path)', () => {
+  describe('when BUILDS_ENABLED_WITH_GH_ACTIONS_TEMPORARY (builds.yml path)', () => {
     beforeEach(() => {
-      process.env.GITHUB_ACTIONS = 'true';
-      delete process.env.E2E;
+      process.env.BUILDS_ENABLED_WITH_GH_ACTIONS_TEMPORARY = 'true';
     });
 
     it('returns Production when RAMPS_ENVIRONMENT is production', () => {
@@ -56,14 +51,6 @@ describe('getSdkEnvironment', () => {
       process.env.RAMPS_ENVIRONMENT = 'staging';
       expect(getSdkEnvironment()).toBe(SdkEnvironment.Staging);
     });
-
-    it('uses METAMASK_ENVIRONMENT when E2E is true (E2E path)', () => {
-      process.env.GITHUB_ACTIONS = 'true';
-      process.env.E2E = 'true';
-      process.env.RAMPS_ENVIRONMENT = 'staging';
-      process.env.METAMASK_ENVIRONMENT = 'production';
-      expect(getSdkEnvironment()).toBe(SdkEnvironment.Production);
-    });
   });
 
   describe('Production Environment', () => {
diff --git a/app/components/UI/Ramp/Deposit/sdk/getSdkEnvironment.ts b/app/components/UI/Ramp/Deposit/sdk/getSdkEnvironment.ts
index 378bd9836bbb..84a18d5ab819 100644
--- a/app/components/UI/Ramp/Deposit/sdk/getSdkEnvironment.ts
+++ b/app/components/UI/Ramp/Deposit/sdk/getSdkEnvironment.ts
@@ -1,11 +1,11 @@
 import { SdkEnvironment } from '@consensys/native-ramps-sdk';
 
 /**
- * When GITHUB_ACTIONS (and not E2E), uses RAMPS_ENVIRONMENT (set by builds.yml).
+ * When BUILDS_ENABLED_WITH_GH_ACTIONS_TEMPORARY (and not E2E), uses RAMPS_ENVIRONMENT (set by builds.yml).
  * When not (Bitrise / .js.env / E2E), uses METAMASK_ENVIRONMENT switch.
  */
 export function getSdkEnvironment() {
-  if (process.env.GITHUB_ACTIONS === 'true' && process.env.E2E !== 'true') {
+  if (process.env.BUILDS_ENABLED_WITH_GH_ACTIONS_TEMPORARY === 'true') {
     const rampsEnv = process.env.RAMPS_ENVIRONMENT;
     return rampsEnv === 'production'
       ? SdkEnvironment.Production
diff --git a/app/components/UI/Ramp/Deposit/types/analytics.ts b/app/components/UI/Ramp/Deposit/types/analytics.ts
index a695e8e4fac9..82f79eb3af07 100644
--- a/app/components/UI/Ramp/Deposit/types/analytics.ts
+++ b/app/components/UI/Ramp/Deposit/types/analytics.ts
@@ -2,7 +2,7 @@ import { UnifiedRampRoutingType } from '../../../../../reducers/fiatOrders';
 
 interface RampsButtonClicked {
   quote_session_id?: string;
-  ramp_type: 'DEPOSIT' | 'SELL' | 'BUY' | 'UNIFIED BUY';
+  ramp_type: 'DEPOSIT' | 'SELL' | 'BUY' | 'UNIFIED_BUY' | 'UNIFIED_BUY_2';
   user_id?: string;
   region: string;
   location: string;
@@ -23,7 +23,7 @@ interface RampsDepositCashButtonClicked {
 
 interface RampsPaymentMethodSelected {
   quote_session_id?: string;
-  ramp_type: 'DEPOSIT';
+  ramp_type: 'DEPOSIT' | 'UNIFIED_BUY_2';
   user_id?: string;
   region: string;
   payment_method_id: string;
@@ -32,7 +32,7 @@ interface RampsPaymentMethodSelected {
 
 interface RampsTokenSelected {
   quote_session_id?: string;
-  ramp_type: 'DEPOSIT' | 'SELL' | 'BUY' | 'UNIFIED BUY';
+  ramp_type: 'DEPOSIT' | 'SELL' | 'BUY' | 'UNIFIED_BUY' | 'UNIFIED_BUY_2';
   user_id?: string;
   region: string;
   chain_id: string;
@@ -259,6 +259,147 @@ interface RampsUserDetailsFetched {
   location: string;
 }
 
+// Unified Buy v2 event interfaces
+
+interface RampsScreenViewed {
+  location: string;
+  ramp_type: 'UNIFIED_BUY_2';
+  ramp_routing?: UnifiedRampRoutingType;
+}
+
+interface RampsBackButtonClicked {
+  location: string;
+  ramp_type: 'UNIFIED_BUY_2';
+  ramp_routing?: UnifiedRampRoutingType;
+}
+
+interface RampsNetworkFilterClicked {
+  network_chain_id?: string;
+  location: string;
+  ramp_type: 'UNIFIED_BUY_2';
+}
+
+interface RampsTokenSearched {
+  search_query: string;
+  results_count?: number;
+  location: string;
+  ramp_type: 'UNIFIED_BUY_2';
+}
+
+interface RampsSettingsClicked {
+  location: string;
+  ramp_type: 'UNIFIED_BUY_2';
+}
+
+interface RampsSettingOptionClicked {
+  option: string;
+  location: string;
+  ramp_type: 'UNIFIED_BUY_2';
+}
+
+interface RampsPaymentMethodSelectorClicked {
+  current_payment_method?: string;
+  location: string;
+  ramp_type: 'UNIFIED_BUY_2';
+}
+
+interface RampsQuickAmountClicked {
+  amount: number;
+  currency_source: string;
+  location: string;
+  ramp_type: 'UNIFIED_BUY_2';
+}
+
+interface RampsChangeProviderButtonClicked {
+  current_provider?: string;
+  location: string;
+  ramp_type: 'UNIFIED_BUY_2';
+  ramp_routing?: UnifiedRampRoutingType;
+}
+
+interface RampsProviderSelected {
+  provider: string;
+  previous_provider?: string;
+  location: string;
+  ramp_type: 'UNIFIED_BUY_2';
+  ramp_routing?: UnifiedRampRoutingType;
+}
+
+interface RampsContinueButtonClicked {
+  ramp_routing: UnifiedRampRoutingType;
+  ramp_type: 'UNIFIED_BUY_2';
+  amount_source: number;
+  amount_destination?: number;
+  payment_method_id: string;
+  provider_onramp?: string;
+  region: string;
+  chain_id: string;
+  currency_destination: string;
+  currency_destination_symbol?: string;
+  currency_destination_network?: string;
+  currency_source: string;
+  is_authenticated?: boolean;
+  first_time_order?: boolean;
+  exchange_rate?: number;
+  total_fee?: number;
+  gas_fee?: number;
+  processing_fee?: number;
+}
+
+interface RampsTermsConsentClicked {
+  location: string;
+  ramp_type: 'UNIFIED_BUY_2';
+  ramp_routing?: UnifiedRampRoutingType;
+}
+
+interface RampsExternalLinkClicked {
+  location: string;
+  external_link_description: string;
+  url_domain?: string;
+  ramp_type: 'UNIFIED_BUY_2';
+}
+
+interface RampsCloseButtonClicked {
+  location: string;
+  ramp_type: 'UNIFIED_BUY_2';
+}
+
+interface RampsQuoteError {
+  error_message?: string;
+  amount?: number;
+  currency_source?: string;
+  currency_destination?: string;
+  payment_method_id?: string;
+  chain_id?: string;
+  ramp_type: 'UNIFIED_BUY_2';
+  ramp_routing?: UnifiedRampRoutingType;
+}
+
+interface RampsQuoteErrorTooltipClicked {
+  error_message?: string;
+  location: string;
+  ramp_type: 'UNIFIED_BUY_2';
+}
+
+interface RampsUnsupportedTokenTooltipClicked {
+  reason?: string;
+  token_symbol?: string;
+  chain_id?: string;
+  location: string;
+  ramp_type: 'UNIFIED_BUY_2';
+}
+
+interface RampsInfoTooltipClicked {
+  location: string;
+  ramp_type: 'UNIFIED_BUY_2';
+}
+
+interface RampsToastButtonClicked {
+  action: string;
+  location?: string;
+  ramp_type: 'UNIFIED_BUY_2';
+}
+
 export interface AnalyticsEvents {
   RAMPS_BUTTON_CLICKED: RampsButtonClicked;
   RAMPS_DEPOSIT_CASH_BUTTON_CLICKED: RampsDepositCashButtonClicked;
@@ -283,4 +424,25 @@ export interface AnalyticsEvents {
   RAMPS_KYC_APPLICATION_FAILED: RampsKycApplicationFailed;
   RAMPS_KYC_APPLICATION_APPROVED: RampsKycApplicationApproved;
   RAMPS_USER_DETAILS_FETCHED: RampsUserDetailsFetched;
+
+  // Unified Buy v2
+  RAMPS_SCREEN_VIEWED: RampsScreenViewed;
+  RAMPS_BACK_BUTTON_CLICKED: RampsBackButtonClicked;
+  RAMPS_NETWORK_FILTER_CLICKED: RampsNetworkFilterClicked;
+  RAMPS_TOKEN_SEARCHED: RampsTokenSearched;
+  RAMPS_SETTINGS_CLICKED: RampsSettingsClicked;
+  RAMPS_SETTING_OPTION_CLICKED: RampsSettingOptionClicked;
+  RAMPS_PAYMENT_METHOD_SELECTOR_CLICKED: RampsPaymentMethodSelectorClicked;
+  RAMPS_QUICK_AMOUNT_CLICKED: RampsQuickAmountClicked;
+  RAMPS_CHANGE_PROVIDER_BUTTON_CLICKED: RampsChangeProviderButtonClicked;
+  RAMPS_PROVIDER_SELECTED: RampsProviderSelected;
+  RAMPS_CONTINUE_BUTTON_CLICKED: RampsContinueButtonClicked;
+  RAMPS_TERMS_CONSENT_CLICKED: RampsTermsConsentClicked;
+  RAMPS_EXTERNAL_LINK_CLICKED: RampsExternalLinkClicked;
+  RAMPS_CLOSE_BUTTON_CLICKED: RampsCloseButtonClicked;
+  RAMPS_QUOTE_ERROR: RampsQuoteError;
+  RAMPS_QUOTE_ERROR_TOOLTIP_CLICKED: RampsQuoteErrorTooltipClicked;
+  RAMPS_UNSUPPORTED_TOKEN_TOOLTIP_CLICKED: RampsUnsupportedTokenTooltipClicked;
+  RAMPS_INFO_TOOLTIP_CLICKED: RampsInfoTooltipClicked;
+  RAMPS_TOAST_BUTTON_CLICKED: RampsToastButtonClicked;
 }
diff --git a/app/components/UI/Ramp/Views/BuildQuote/BuildQuote.test.tsx b/app/components/UI/Ramp/Views/BuildQuote/BuildQuote.test.tsx
index 7f0357b2a2af..d775e3c84719 100644
--- a/app/components/UI/Ramp/Views/BuildQuote/BuildQuote.test.tsx
+++ b/app/components/UI/Ramp/Views/BuildQuote/BuildQuote.test.tsx
@@ -44,13 +44,9 @@ const createMockToken = (overrides?: Partial<RampsToken>): RampsToken => ({
 
 const mockTokenNetworkInfo = {
   networkName: 'Ethereum Mainnet',
-  networkImageSource: { uri: 'https://example.com/eth.png' },
 };
 
 const mockGetTokenNetworkInfo = jest.fn(() => mockTokenNetworkInfo);
-const mockGetRampsBuildQuoteNavbarOptions = jest.fn(
-  (_navigation: unknown, _options: unknown) => ({}),
-);
 
 jest.mock('@react-navigation/native', () => ({
   ...jest.requireActual('@react-navigation/native'),
@@ -86,10 +82,50 @@ jest.mock('../../../../../../locales/i18n', () => ({
   },
 }));
 
-jest.mock('../../../Navbar', () => ({
-  getRampsBuildQuoteNavbarOptions: (navigation: unknown, options: unknown) =>
-    mockGetRampsBuildQuoteNavbarOptions(navigation, options),
-}));
+jest.mock(
+  '../../../../../component-library/components-temp/HeaderCompactStandard',
+  () => {
+    const { View, Text } = jest.requireActual('react-native');
+    return {
+      __esModule: true,
+      default: ({
+        title,
+        subtitle,
+        onBack,
+        backButtonProps,
+        endButtonIconProps,
+      }: {
+        title?: string;
+        subtitle?: string;
+        onBack?: () => void;
+        backButtonProps?: { testID?: string };
+        endButtonIconProps?: {
+          iconName: string;
+          onPress?: () => void;
+          testID?: string;
+        }[];
+      }) => (
+        <View testID="header-compact-standard">
+          {title ? <Text>{title}</Text> : null}
+          {subtitle ? <Text>{subtitle}</Text> : null}
+          {onBack ? (
+            <View
+              testID={backButtonProps?.testID ?? 'back-button'}
+              onTouchEnd={onBack}
+            />
+          ) : null}
+          {endButtonIconProps?.map((btn, i) => (
+            <View
+              key={i}
+              testID={btn.testID ?? `end-button-${i}`}
+              onTouchEnd={btn.onPress}
+            />
+          ))}
+        </View>
+      ),
+    };
+  },
+);
 
 jest.mock('../../../../hooks/useFormatters', () => ({
   useFormatters: () => ({
@@ -216,8 +252,21 @@ jest.mock('../../hooks/useTransakRouting', () => ({
   }),
 }));
 
-jest.mock('../NativeFlow/EnterEmail', () => ({
-  createV2EnterEmailNavDetails: (params: unknown) => ['RampEnterEmail', params],
+jest.mock('../NativeFlow/VerifyIdentity', () => ({
+  createV2VerifyIdentityNavDetails: (params: unknown) => [
+    'RampVerifyIdentity',
+    params,
+  ],
+}));
+
+jest.mock('react-redux', () => ({
+  ...jest.requireActual('react-redux'),
+  useSelector: jest.fn(() => 'aggregator'),
+}));
+
+jest.mock('../../../../../reducers/fiatOrders', () => ({
+  getRampRoutingDecision: jest.fn(),
+  UnifiedRampRoutingType: { AGGREGATOR: 'aggregator', DEPOSIT: 'deposit' },
 }));
 
 const renderWithTheme = (component: React.ReactElement) =>
@@ -262,7 +311,7 @@ describe('BuildQuote', () => {
   });
 
   afterEach(() => {
-    jest.resetAllMocks();
+    jest.clearAllMocks();
   });
 
   it('displays initial amount as $100', () => {
@@ -320,7 +369,15 @@ describe('BuildQuote', () => {
     expect(getByText('$100123')).toBeOnTheScreen();
   });
 
-  it('deletes last digit when delete button is pressed', () => {
+  it('clears the default amount when delete is pressed', () => {
+    const { getByText, getByTestId } = renderWithTheme(<BuildQuote />);
+
+    fireEvent.press(getByTestId('keypad-delete-button'));
+
+    expect(getByText('$0')).toBeOnTheScreen();
+  });
+
+  it('deletes one character when delete button is pressed after typing', () => {
     const { getByText, getByTestId } = renderWithTheme(<BuildQuote />);
 
     fireEvent.press(getByText('1'));
@@ -330,24 +387,29 @@ describe('BuildQuote', () => {
     expect(getByText('$1001')).toBeOnTheScreen();
   });
 
-  it('sets navigation options with token and network data', () => {
-    renderWithTheme(<BuildQuote />);
+  it('deletes one character when delete is pressed after user has modified amount even if value equals default', () => {
+    const { getByText, getByTestId } = renderWithTheme(<BuildQuote />);
 
-    expect(mockGetRampsBuildQuoteNavbarOptions).toHaveBeenCalledWith(
-      expect.objectContaining({
-        navigate: mockNavigate,
-        setOptions: mockSetOptions,
-        goBack: mockGoBack,
-      }),
-      expect.objectContaining({
-        tokenName: 'USD Coin',
-        tokenSymbol: 'USDC',
-        tokenIconUrl: 'https://example.com/usdc.png',
-        networkName: 'Ethereum Mainnet',
-        networkImageSource: { uri: 'https://example.com/eth.png' },
-        onSettingsPress: expect.any(Function),
-      }),
-    );
+    fireEvent.press(getByTestId('keypad-delete-button'));
+    expect(getByText('$0')).toBeOnTheScreen();
+
+    fireEvent.press(getByText('1'));
+    fireEvent.press(getByText('0'));
+    fireEvent.press(getByText('0'));
+    expect(getByText('$100')).toBeOnTheScreen();
+
+    fireEvent.press(getByTestId('keypad-delete-button'));
+    expect(getByText('$10')).toBeOnTheScreen();
+  });
+
+  it('renders inline header with token and network data', () => {
+    const { getByTestId, getByText } = renderWithTheme(<BuildQuote />);
+
+    expect(getByTestId('header-compact-standard')).toBeOnTheScreen();
+    expect(getByText('fiat_on_ramp.buy')).toBeOnTheScreen();
+    expect(getByText('fiat_on_ramp.on_network')).toBeOnTheScreen();
+    expect(getByTestId('build-quote-back-button')).toBeOnTheScreen();
+    expect(getByTestId('build-quote-settings-button')).toBeOnTheScreen();
   });
 
   it('renders the payment method pill', () => {
@@ -370,29 +432,17 @@ describe('BuildQuote', () => {
     );
   });
 
-  it('sets navigation options with undefined values when token is not found (shows skeleton)', () => {
+  it('renders inline header without title or subtitle when token is not found', () => {
     mockTokens = {
       allTokens: [],
       topTokens: [],
     };
 
-    renderWithTheme(<BuildQuote />);
+    const { getByTestId, queryByText } = renderWithTheme(<BuildQuote />);
 
-    expect(mockGetRampsBuildQuoteNavbarOptions).toHaveBeenCalledWith(
-      expect.objectContaining({
-        navigate: mockNavigate,
-        setOptions: mockSetOptions,
-        goBack: mockGoBack,
-      }),
-      expect.objectContaining({
-        tokenName: undefined,
-        tokenSymbol: undefined,
-        tokenIconUrl: undefined,
-        networkName: undefined,
-        networkImageSource: undefined,
-        onSettingsPress: expect.any(Function),
-      }),
-    );
+    expect(getByTestId('header-compact-standard')).toBeOnTheScreen();
+    expect(queryByText('fiat_on_ramp.buy')).toBeNull();
+    expect(queryByText('fiat_on_ramp.on_network')).toBeNull();
   });
 
   it('renders quick amount buttons when amount is zero', () => {
@@ -456,6 +506,30 @@ describe('BuildQuote', () => {
     expect(getByTestId('build-quote-continue-button')).toBeOnTheScreen();
   });
 
+  it('displays powered by provider text when selected provider is set', () => {
+    mockSelectedProvider = {
+      id: '/providers/transak',
+      name: 'Transak',
+      environmentType: 'PRODUCTION',
+      description: 'Test Provider',
+      hqAddress: '123 Test St',
+      links: [],
+      logos: { light: '', dark: '', height: 24, width: 79 },
+    };
+
+    const { getByText } = renderWithTheme(<BuildQuote />);
+
+    expect(getByText('fiat_on_ramp.powered_by_provider')).toBeOnTheScreen();
+  });
+
+  it('does not display powered by text when no selected provider is set', () => {
+    mockSelectedProvider = null;
+
+    const { queryByText } = renderWithTheme(<BuildQuote />);
+
+    expect(queryByText('fiat_on_ramp.powered_by_provider')).toBeNull();
+  });
+
   it('matches snapshot', () => {
     const { toJSON } = renderWithTheme(<BuildQuote />);
 
@@ -723,7 +797,7 @@ describe('BuildQuote', () => {
       );
     });
 
-    it('navigates to enter email for native provider when no existing token', async () => {
+    it('navigates to verify identity for native provider when no existing token', async () => {
       mockTransakCheckExistingToken.mockResolvedValue(false);
 
       const mockNativeQuote = {
@@ -774,7 +848,7 @@ describe('BuildQuote', () => {
 
       expect(mockTransakCheckExistingToken).toHaveBeenCalled();
       expect(mockNavigate).toHaveBeenCalledWith(
-        'RampEnterEmail',
+        'RampVerifyIdentity',
         expect.objectContaining({
           amount: '100',
           currency: 'USD',
@@ -1444,7 +1518,7 @@ describe('BuildQuote', () => {
       expect(getByTestId('build-quote-continue-button')).toBeDisabled();
     });
 
-    it('does not navigate to payment selection when amount is zero', () => {
+    it('navigates to payment selection when amount is zero', () => {
       const { getByTestId } = renderWithTheme(<BuildQuote />);
 
       fireEvent.press(getByTestId('keypad-delete-button'));
@@ -1455,7 +1529,13 @@ describe('BuildQuote', () => {
 
       fireEvent.press(getByTestId('payment-method-pill'));
 
-      expect(mockNavigate).not.toHaveBeenCalled();
+      expect(mockNavigate).toHaveBeenCalledWith(
+        'RampModals',
+        expect.objectContaining({
+          screen: 'RampPaymentSelectionModal',
+          params: { amount: 0 },
+        }),
+      );
     });
   });
 
diff --git a/app/components/UI/Ramp/Views/BuildQuote/BuildQuote.tsx b/app/components/UI/Ramp/Views/BuildQuote/BuildQuote.tsx
index 6c115f1f66b6..b1cf83689631 100644
--- a/app/components/UI/Ramp/Views/BuildQuote/BuildQuote.tsx
+++ b/app/components/UI/Ramp/Views/BuildQuote/BuildQuote.tsx
@@ -11,20 +11,22 @@ import type { CaipChainId } from '@metamask/utils';
 
 import ScreenLayout from '../../Aggregator/components/ScreenLayout';
 import { getRampCallbackBaseUrl } from '../../utils/getRampCallbackBaseUrl';
-import Keypad, { type KeypadChangeData } from '../../../../Base/Keypad';
+import Keypad, { type KeypadChangeData, Keys } from '../../../../Base/Keypad';
 import PaymentMethodPill from '../../components/PaymentMethodPill';
 import QuickAmounts from '../../components/QuickAmounts';
 import Text, {
   TextVariant,
+  TextColor,
 } from '../../../../../component-library/components/Texts/Text';
 import {
   Button,
   ButtonVariant,
   ButtonSize,
+  IconName,
 } from '@metamask/design-system-react-native';
 import { strings } from '../../../../../../locales/i18n';
 
-import { getRampsBuildQuoteNavbarOptions } from '../../../Navbar';
+import HeaderCompactStandard from '../../../../../component-library/components-temp/HeaderCompactStandard';
 import Routes from '../../../../../constants/navigation/Routes';
 import { useStyles } from '../../../../hooks/useStyles';
 import styleSheet from './BuildQuote.styles';
@@ -51,8 +53,17 @@ import BannerAlert from '../../../../../component-library/components/Banners/Ban
 import { BannerAlertSeverity } from '../../../../../component-library/components/Banners/Banner/variants/BannerAlert/BannerAlert.types';
 import { useTransakController } from '../../hooks/useTransakController';
 import { useTransakRouting } from '../../hooks/useTransakRouting';
-import { createV2EnterEmailNavDetails } from '../NativeFlow/EnterEmail';
+import { createV2VerifyIdentityNavDetails } from '../NativeFlow/VerifyIdentity';
 import { parseUserFacingError } from '../../utils/parseUserFacingError';
+import { useAnalytics } from '../../../../hooks/useAnalytics/useAnalytics';
+import { MetaMetricsEvents } from '../../../../../core/Analytics';
+import { useSelector } from 'react-redux';
+import {
+  getRampRoutingDecision,
+  UnifiedRampRoutingType,
+} from '../../../../../reducers/fiatOrders';
+import TruncatedError from '../../components/TruncatedError';
+import { PROVIDER_LINKS } from '../../Aggregator/types';
 
 export interface BuildQuoteParams {
   assetId?: string;
@@ -97,6 +108,7 @@ function BuildQuote() {
   const [amount, setAmount] = useState<string>(() => String(DEFAULT_AMOUNT));
   const [amountAsNumber, setAmountAsNumber] = useState<number>(DEFAULT_AMOUNT);
   const [userHasEnteredAmount, setUserHasEnteredAmount] = useState(false);
+  const [keyboardIsDirty, setKeyboardIsDirty] = useState(false);
   const [isOnBuildQuoteScreen, setIsOnBuildQuoteScreen] =
     useState<boolean>(true);
   const [isContinueLoading, setIsContinueLoading] = useState(false);
@@ -128,6 +140,16 @@ function BuildQuote() {
     selectedPaymentMethod,
   } = useRampsController();
 
+  const { trackEvent, createEventBuilder } = useAnalytics();
+  const rampRoutingDecision = useSelector(getRampRoutingDecision);
+  const prevSelectedProviderRef = useRef(selectedProvider);
+  useEffect(() => {
+    if (prevSelectedProviderRef.current !== selectedProvider) {
+      prevSelectedProviderRef.current = selectedProvider;
+      setNativeFlowError(null);
+    }
+  }, [selectedProvider]);
+
   const isTokenUnavailable = useMemo(
     () =>
       !!(
@@ -165,6 +187,23 @@ function BuildQuote() {
   const currency = userRegion?.country?.currency || 'USD';
   const quickAmounts = userRegion?.country?.quickAmounts ?? [50, 100, 200, 400];
 
+  const hasTrackedScreenViewRef = useRef(false);
+  useEffect(() => {
+    if (hasTrackedScreenViewRef.current) return;
+    if (rampRoutingDecision != null) {
+      hasTrackedScreenViewRef.current = true;
+      trackEvent(
+        createEventBuilder(MetaMetricsEvents.RAMPS_SCREEN_VIEWED)
+          .addProperties({
+            location: 'Amount Input',
+            ramp_type: 'UNIFIED_BUY_2',
+            ramp_routing: rampRoutingDecision,
+          })
+          .build(),
+      );
+    }
+  }, [rampRoutingDecision, trackEvent, createEventBuilder]);
+
   useEffect(() => {
     if (!userHasEnteredAmount && userRegion?.country?.defaultAmount != null) {
       const regionDefault = userRegion.country.defaultAmount;
@@ -222,6 +261,46 @@ function BuildQuote() {
     error: quoteFetchError,
   } = useRampsQuotes(quoteFetchEnabled ? quoteFetchParams : null);
 
+  const lastTrackedQuoteErrorRef = useRef<unknown>(null);
+  useEffect(() => {
+    if (
+      quoteFetchError &&
+      quoteFetchError !== lastTrackedQuoteErrorRef.current
+    ) {
+      lastTrackedQuoteErrorRef.current = quoteFetchError;
+      trackEvent(
+        createEventBuilder(MetaMetricsEvents.RAMPS_QUOTE_ERROR)
+          .addProperties({
+            error_message: parseUserFacingError(
+              quoteFetchError,
+              strings('deposit.buildQuote.quoteFetchError'),
+            ),
+            amount: amountAsNumber,
+            currency_source: currency,
+            currency_destination: selectedToken?.assetId,
+            payment_method_id: selectedPaymentMethod?.id,
+            chain_id: selectedToken?.chainId,
+            ramp_type: 'UNIFIED_BUY_2',
+            ramp_routing: rampRoutingDecision ?? undefined,
+          })
+          .build(),
+      );
+    }
+    if (!quoteFetchError) {
+      lastTrackedQuoteErrorRef.current = null;
+    }
+  }, [
+    quoteFetchError,
+    amountAsNumber,
+    currency,
+    selectedToken?.assetId,
+    selectedToken?.chainId,
+    selectedPaymentMethod?.id,
+    rampRoutingDecision,
+    trackEvent,
+    createEventBuilder,
+  ]);
+
   const selectedQuote = useMemo(() => {
     if (!quotesResponse?.success || !selectedProvider || !selectedPaymentMethod)
       return null;
@@ -247,52 +326,104 @@ function BuildQuote() {
     return getTokenNetworkInfo(selectedToken.chainId as CaipChainId);
   }, [selectedToken, getTokenNetworkInfo]);
 
-  useEffect(() => {
-    navigation.setOptions(
-      getRampsBuildQuoteNavbarOptions(navigation, {
-        tokenName: selectedToken?.name,
-        tokenSymbol: selectedToken?.symbol,
-        tokenIconUrl: selectedToken?.iconUrl,
-        networkName: networkInfo?.networkName ?? undefined,
-        networkImageSource: networkInfo?.networkImageSource,
-        onSettingsPress: () => {
-          navigation.navigate(...createSettingsModalNavDetails());
-        },
-      }),
+  const handleSettingsPress = useCallback(() => {
+    trackEvent(
+      createEventBuilder(MetaMetricsEvents.RAMPS_SETTINGS_CLICKED)
+        .addProperties({
+          location: 'Amount Input',
+          ramp_type: 'UNIFIED_BUY_2',
+        })
+        .build(),
     );
-  }, [navigation, selectedToken, networkInfo]);
+    navigation.navigate(...createSettingsModalNavDetails());
+  }, [trackEvent, createEventBuilder, navigation]);
+
+  const handleBackPress = useCallback(() => {
+    trackEvent(
+      createEventBuilder(MetaMetricsEvents.RAMPS_BACK_BUTTON_CLICKED)
+        .addProperties({
+          location: 'Amount Input',
+          ramp_type: 'UNIFIED_BUY_2',
+        })
+        .build(),
+    );
+    navigation.goBack();
+  }, [trackEvent, createEventBuilder, navigation]);
 
   const handleKeypadChange = useCallback(
-    ({ value, valueAsNumber }: KeypadChangeData) => {
+    ({ value, valueAsNumber, pressedKey }: KeypadChangeData) => {
+      if (pressedKey === Keys.Back) {
+        if (!keyboardIsDirty) {
+          setAmount('0');
+          setAmountAsNumber(0);
+        } else {
+          setAmount(value || '0');
+          setAmountAsNumber(valueAsNumber || 0);
+        }
+        setKeyboardIsDirty(true);
+        setUserHasEnteredAmount(true);
+        setNativeFlowError(null);
+        return;
+      }
+
       setAmount(value || '0');
       setAmountAsNumber(valueAsNumber || 0);
+      setKeyboardIsDirty(true);
       setUserHasEnteredAmount(true);
       setNativeFlowError(null);
     },
-    [],
+    [keyboardIsDirty],
   );
 
-  const handleQuickAmountPress = useCallback((quickAmount: number) => {
-    setAmount(String(quickAmount));
-    setAmountAsNumber(quickAmount);
-    setUserHasEnteredAmount(true);
-    setNativeFlowError(null);
-  }, []);
+  const handleQuickAmountPress = useCallback(
+    (quickAmount: number) => {
+      setAmount(String(quickAmount));
+      setAmountAsNumber(quickAmount);
+      setKeyboardIsDirty(true);
+      setUserHasEnteredAmount(true);
+      setNativeFlowError(null);
+      trackEvent(
+        createEventBuilder(MetaMetricsEvents.RAMPS_QUICK_AMOUNT_CLICKED)
+          .addProperties({
+            amount: quickAmount,
+            currency_source: currency,
+            location: 'Amount Input',
+            ramp_type: 'UNIFIED_BUY_2',
+          })
+          .build(),
+      );
+    },
+    [currency, trackEvent, createEventBuilder],
+  );
 
   const handlePaymentPillPress = useCallback(() => {
-    if (debouncedPollingAmount <= 0) {
-      return;
-    }
-
+    trackEvent(
+      createEventBuilder(
+        MetaMetricsEvents.RAMPS_PAYMENT_METHOD_SELECTOR_CLICKED,
+      )
+        .addProperties({
+          current_payment_method: selectedPaymentMethod?.id,
+          location: 'Amount Input',
+          ramp_type: 'UNIFIED_BUY_2',
+        })
+        .build(),
+    );
     navigation.navigate(
       ...createPaymentSelectionModalNavigationDetails({
         amount: debouncedPollingAmount,
       }),
     );
-  }, [debouncedPollingAmount, navigation]);
+  }, [
+    debouncedPollingAmount,
+    navigation,
+    selectedPaymentMethod?.id,
+    trackEvent,
+    createEventBuilder,
+  ]);
 
   const handleContinuePress = useCallback(async () => {
     if (!selectedQuote || !selectedProvider) return;
+    setNativeFlowError(null);
 
     const quoteAmount =
       selectedQuote.quote?.amountIn ??
@@ -319,6 +450,24 @@ function BuildQuote() {
       }
     }
 
+    trackEvent(
+      createEventBuilder(MetaMetricsEvents.RAMPS_CONTINUE_BUTTON_CLICKED)
+        .addProperties({
+          ramp_routing:
+            rampRoutingDecision ?? UnifiedRampRoutingType.AGGREGATOR,
+          ramp_type: 'UNIFIED_BUY_2',
+          amount_source: amountAsNumber,
+          payment_method_id: selectedPaymentMethod?.id ?? '',
+          provider_onramp: selectedProvider?.name,
+          region: userRegion?.regionCode ?? '',
+          chain_id: selectedToken?.chainId ?? '',
+          currency_destination: selectedToken?.assetId ?? '',
+          currency_destination_symbol: selectedToken?.symbol,
+          currency_source: currency,
+        })
+        .build(),
+    );
+
     if (isNativeProvider(selectedQuote)) {
       setIsContinueLoading(true);
       try {
@@ -338,7 +487,7 @@ function BuildQuote() {
           await transakRouteAfterAuth(quote);
         } else {
           navigation.navigate(
-            ...createV2EnterEmailNavDetails({
+            ...createV2VerifyIdentityNavDetails({
               amount: String(amountAsNumber),
               currency,
               assetId: selectedToken?.assetId,
@@ -361,7 +510,6 @@ function BuildQuote() {
       return;
     }
 
-    // V2 aggregator: get widget URL via controller and navigate to checkout
     setIsContinueLoading(true);
     try {
       const fetchedWidgetUrl = await getWidgetUrl(selectedQuote);
@@ -394,12 +542,19 @@ function BuildQuote() {
           new Error('No widget URL available for aggregator provider'),
           { provider: selectedQuote.provider },
         );
+        setNativeFlowError(strings('deposit.buildQuote.unexpectedError'));
       }
     } catch (error) {
       Logger.error(error as Error, {
         provider: selectedQuote.provider,
         message: 'Failed to fetch widget URL',
       });
+      setNativeFlowError(
+        parseUserFacingError(
+          error,
+          strings('deposit.buildQuote.unexpectedError'),
+        ),
+      );
     } finally {
       setIsContinueLoading(false);
     }
@@ -416,6 +571,10 @@ function BuildQuote() {
     transakCheckExistingToken,
     transakGetBuyQuote,
     transakRouteAfterAuth,
+    rampRoutingDecision,
+    userRegion?.regionCode,
+    trackEvent,
+    createEventBuilder,
   ]);
 
   const hasAmount = amountAsNumber > 0;
@@ -460,94 +619,150 @@ function BuildQuote() {
     quoteMatchesAmount &&
     quoteMatchesCurrentContext;
 
+  const hasNoQuotes =
+    hasAmount &&
+    !selectedQuoteLoading &&
+    !quoteFetchError &&
+    quotesResponse !== null &&
+    selectedQuote === null;
+
+  const noQuotesErrorMessage = selectedProvider
+    ? strings('fiat_on_ramp.no_quotes_error', {
+        provider: selectedProvider.name,
+      })
+    : strings('fiat_on_ramp.no_quotes_available');
+
   return (
-    <ScreenLayout>
-      <ScreenLayout.Body>
-        <ScreenLayout.Content style={styles.content}>
-          <View style={styles.centerGroup}>
-            <View style={styles.amountContainer}>
-              <Text
-                testID={BuildQuoteSelectors.AMOUNT_INPUT}
-                variant={TextVariant.HeadingLG}
-                style={styles.mainAmount}
-                numberOfLines={1}
-                adjustsFontSizeToFit
-              >
-                {formatCurrency(amountAsNumber, currency, {
-                  currencyDisplay: 'narrowSymbol',
-                })}
-              </Text>
-              <PaymentMethodPill
-                label={
-                  selectedPaymentMethod?.name ||
-                  strings('fiat_on_ramp.select_payment_method')
-                }
-                isLoading={paymentMethodsLoading}
-                onPress={handlePaymentPillPress}
-              />
+    <>
+      <HeaderCompactStandard
+        title={
+          selectedToken?.symbol
+            ? strings('fiat_on_ramp.buy', { ticker: selectedToken.symbol })
+            : undefined
+        }
+        subtitle={
+          networkInfo?.networkName
+            ? strings('fiat_on_ramp.on_network', {
+                networkName: networkInfo.networkName,
+              })
+            : undefined
+        }
+        onBack={handleBackPress}
+        backButtonProps={{ testID: 'build-quote-back-button' }}
+        endButtonIconProps={[
+          {
+            iconName: IconName.Setting,
+            onPress: handleSettingsPress,
+            testID: 'build-quote-settings-button',
+          },
+        ]}
+        includesTopInset
+      />
+      <ScreenLayout>
+        <ScreenLayout.Body>
+          <ScreenLayout.Content style={styles.content}>
+            <View style={styles.centerGroup}>
+              <View style={styles.amountContainer}>
+                <Text
+                  testID={BuildQuoteSelectors.AMOUNT_INPUT}
+                  variant={TextVariant.HeadingLG}
+                  color={
+                    nativeFlowError || hasNoQuotes || quoteFetchError
+                      ? TextColor.Error
+                      : undefined
+                  }
+                  style={styles.mainAmount}
+                  numberOfLines={1}
+                  adjustsFontSizeToFit
+                >
+                  {formatCurrency(amountAsNumber, currency, {
+                    currencyDisplay: 'narrowSymbol',
+                  })}
+                </Text>
+                <PaymentMethodPill
+                  label={
+                    selectedPaymentMethod?.name ||
+                    strings('fiat_on_ramp.select_payment_method')
+                  }
+                  isLoading={paymentMethodsLoading}
+                  onPress={handlePaymentPillPress}
+                />
+              </View>
             </View>
-          </View>
 
-          {nativeFlowError && (
-            <BannerAlert
-              severity={BannerAlertSeverity.Error}
-              description={nativeFlowError}
-            />
-          )}
-
-          {quoteFetchError && (
-            <BannerAlert
-              severity={BannerAlertSeverity.Error}
-              description={parseUserFacingError(
-                quoteFetchError,
-                strings('deposit.buildQuote.quoteFetchError'),
-              )}
-            />
-          )}
-
-          <View style={styles.actionSection}>
-            {hasAmount ? (
-              <>
-                {selectedProvider && (
-                  <Text
-                    variant={TextVariant.BodySM}
-                    style={styles.poweredByText}
-                  >
-                    {strings('fiat_on_ramp.powered_by_provider', {
-                      provider: selectedProvider.name,
-                    })}
-                  </Text>
+            {quoteFetchError && (
+              <BannerAlert
+                severity={BannerAlertSeverity.Error}
+                description={parseUserFacingError(
+                  quoteFetchError,
+                  strings('deposit.buildQuote.quoteFetchError'),
                 )}
-                <Button
-                  variant={ButtonVariant.Primary}
-                  size={ButtonSize.Lg}
-                  onPress={handleContinuePress}
-                  isFullWidth
-                  isDisabled={!canContinue}
-                  isLoading={selectedQuoteLoading || isContinueLoading}
-                  testID={BuildQuoteSelectors.CONTINUE_BUTTON}
-                >
-                  {strings('fiat_on_ramp.continue')}
-                </Button>
-              </>
-            ) : (
-              quickAmounts.length > 0 && (
-                <QuickAmounts
-                  amounts={quickAmounts}
-                  currency={currency}
-                  onAmountPress={handleQuickAmountPress}
-                />
-              )
+              />
             )}
-          </View>
-          <Keypad
-            currency={currency}
-            value={amount}
-            onChange={handleKeypadChange}
-          />
-        </ScreenLayout.Content>
-      </ScreenLayout.Body>
-    </ScreenLayout>
+
+            <View style={styles.actionSection}>
+              {hasAmount ? (
+                <>
+                  {nativeFlowError ? (
+                    <TruncatedError
+                      error={nativeFlowError}
+                      providerName={selectedProvider?.name}
+                      providerSupportUrl={
+                        selectedProvider?.links?.find(
+                          (link) => link.name === PROVIDER_LINKS.SUPPORT,
+                        )?.url
+                      }
+                    />
+                  ) : hasNoQuotes ? (
+                    <TruncatedError
+                      error={strings('fiat_on_ramp.encountered_error')}
+                      errorDetails={noQuotesErrorMessage}
+                      showChangeProvider
+                      amount={amountAsNumber}
+                    />
+                  ) : (
+                    selectedProvider && (
+                      <Text
+                        variant={TextVariant.BodySM}
+                        style={styles.poweredByText}
+                      >
+                        {strings('fiat_on_ramp.powered_by_provider', {
+                          provider: selectedProvider.name,
+                        })}
+                      </Text>
+                    )
+                  )}
+                  <Button
+                    variant={ButtonVariant.Primary}
+                    size={ButtonSize.Lg}
+                    onPress={handleContinuePress}
+                    isFullWidth
+                    isDisabled={!canContinue}
+                    isLoading={selectedQuoteLoading || isContinueLoading}
+                    testID={BuildQuoteSelectors.CONTINUE_BUTTON}
+                  >
+                    {strings('fiat_on_ramp.continue')}
+                  </Button>
+                </>
+              ) : (
+                quickAmounts.length > 0 && (
+                  <QuickAmounts
+                    amounts={quickAmounts}
+                    currency={currency}
+                    onAmountPress={handleQuickAmountPress}
+                  />
+                )
+              )}
+            </View>
+            <Keypad
+              currency={currency}
+              value={amount}
+              onChange={handleKeypadChange}
+            />
+          </ScreenLayout.Content>
+        </ScreenLayout.Body>
+      </ScreenLayout>
+    </>
   );
 }
 
diff --git a/app/components/UI/Ramp/Views/BuildQuote/__snapshots__/BuildQuote.test.tsx.snap b/app/components/UI/Ramp/Views/BuildQuote/__snapshots__/BuildQuote.test.tsx.snap
index 8343c9b50f7d..27a64293c0a3 100644
--- a/app/components/UI/Ramp/Views/BuildQuote/__snapshots__/BuildQuote.test.tsx.snap
+++ b/app/components/UI/Ramp/Views/BuildQuote/__snapshots__/BuildQuote.test.tsx.snap
@@ -1,36 +1,45 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`BuildQuote Continue button displays error banner when quote fetch fails 1`] = `
-<RNCSafeAreaView
-  edges={
-    {
-      "bottom": "additive",
-      "left": "additive",
-      "right": "additive",
-      "top": "off",
-    }
-  }
-  style={
-    {
-      "flex": 1,
-    }
-  }
->
+[
   <View
+    testID="header-compact-standard"
+  >
+    <Text>
+      fiat_on_ramp.buy
+    </Text>
+    <Text>
+      fiat_on_ramp.on_network
+    </Text>
+    <View
+      onTouchEnd={[Function]}
+      testID="build-quote-back-button"
+    />
+    <View
+      onTouchEnd={[Function]}
+      testID="build-quote-settings-button"
+    />
+  </View>,
+  <RNCSafeAreaView
+    edges={
+      {
+        "bottom": "additive",
+        "left": "additive",
+        "right": "additive",
+        "top": "off",
+      }
+    }
     style={
-      [
-        {
-          "backgroundColor": "#ffffff",
-          "flex": 1,
-        },
-        undefined,
-      ]
+      {
+        "flex": 1,
+      }
     }
   >
     <View
       style={
         [
           {
+            "backgroundColor": "#ffffff",
             "flex": 1,
           },
           undefined,
@@ -40,169 +49,203 @@ exports[`BuildQuote Continue button displays error banner when quote fetch fails
       <View
         style={
           [
-            {
-              "padding": 15,
-              "paddingHorizontal": 16,
-            },
-            undefined,
             {
               "flex": 1,
             },
+            undefined,
           ]
         }
       >
         <View
           style={
-            {
-              "alignItems": "center",
-              "flex": 1,
-              "gap": 16,
-              "justifyContent": "center",
-            }
+            [
+              {
+                "padding": 15,
+                "paddingHorizontal": 16,
+              },
+              undefined,
+              {
+                "flex": 1,
+              },
+            ]
           }
         >
           <View
             style={
               {
                 "alignItems": "center",
+                "flex": 1,
                 "gap": 16,
+                "justifyContent": "center",
               }
             }
           >
-            <Text
-              accessibilityRole="text"
-              adjustsFontSizeToFit={true}
-              numberOfLines={1}
-              style={
-                {
-                  "color": "#121314",
-                  "fontFamily": "Geist-Regular",
-                  "fontSize": 64,
-                  "fontWeight": "400",
-                  "letterSpacing": 0,
-                  "lineHeight": 72,
-                  "textAlign": "center",
-                }
-              }
-              testID="amount-input"
-            >
-              $100
-            </Text>
-            <TouchableOpacity
-              activeOpacity={0.7}
-              onPress={[Function]}
+            <View
               style={
                 {
                   "alignItems": "center",
-                  "alignSelf": "center",
-                  "backgroundColor": "#3c4d9d0f",
-                  "borderRadius": 100,
-                  "flexDirection": "row",
-                  "padding": 8,
+                  "gap": 16,
                 }
               }
-              testID="payment-method-pill"
             >
-              <View
-                style={
-                  {
-                    "padding": 4,
-                  }
-                }
-              >
-                <SvgMock
-                  color="#121314"
-                  fill="currentColor"
-                  height={16}
-                  name="Card"
-                  style={
-                    {
-                      "height": 16,
-                      "width": 16,
-                    }
-                  }
-                  width={16}
-                />
-              </View>
               <Text
                 accessibilityRole="text"
+                adjustsFontSizeToFit={true}
+                numberOfLines={1}
                 style={
                   {
-                    "color": "#121314",
-                    "fontFamily": "Geist-Medium",
-                    "fontSize": 16,
+                    "color": "#ca3542",
+                    "fontFamily": "Geist-Regular",
+                    "fontSize": 64,
+                    "fontWeight": "400",
                     "letterSpacing": 0,
-                    "lineHeight": 24,
-                    "marginLeft": 8,
-                    "marginRight": 4,
+                    "lineHeight": 72,
+                    "textAlign": "center",
                   }
                 }
+                testID="amount-input"
               >
-                Card
+                $100
               </Text>
-              <View
+              <TouchableOpacity
+                activeOpacity={0.7}
+                onPress={[Function]}
                 style={
                   {
-                    "padding": 4,
+                    "alignItems": "center",
+                    "alignSelf": "center",
+                    "backgroundColor": "#b4b4b528",
+                    "borderRadius": 100,
+                    "flexDirection": "row",
+                    "padding": 8,
                   }
                 }
+                testID="payment-method-pill"
               >
-                <SvgMock
-                  color="#121314"
-                  fill="currentColor"
-                  height={16}
-                  name="ArrowDown"
+                <View
                   style={
                     {
-                      "height": 16,
-                      "width": 16,
+                      "padding": 4,
                     }
                   }
-                  width={16}
-                />
-              </View>
-            </TouchableOpacity>
+                >
+                  <SvgMock
+                    color="#131416"
+                    fill="currentColor"
+                    height={16}
+                    name="Card"
+                    style={
+                      {
+                        "height": 16,
+                        "width": 16,
+                      }
+                    }
+                    width={16}
+                  />
+                </View>
+                <Text
+                  accessibilityRole="text"
+                  style={
+                    {
+                      "color": "#131416",
+                      "fontFamily": "Geist-Medium",
+                      "fontSize": 16,
+                      "letterSpacing": 0,
+                      "lineHeight": 24,
+                      "marginLeft": 8,
+                      "marginRight": 4,
+                    }
+                  }
+                >
+                  Card
+                </Text>
+                <View
+                  style={
+                    {
+                      "padding": 4,
+                    }
+                  }
+                >
+                  <SvgMock
+                    color="#131416"
+                    fill="currentColor"
+                    height={16}
+                    name="ArrowDown"
+                    style={
+                      {
+                        "height": 16,
+                        "width": 16,
+                      }
+                    }
+                    width={16}
+                  />
+                </View>
+              </TouchableOpacity>
+            </View>
           </View>
-        </View>
-        <View
-          style={
-            {
-              "backgroundColor": "#ca35421a",
-              "borderColor": "#ca3542",
-              "borderLeftWidth": 4,
-              "borderRadius": 4,
-              "flexDirection": "row",
-              "padding": 12,
-              "paddingLeft": 8,
-            }
-          }
-          testID="banneralert"
-        >
           <View
             style={
               {
-                "marginRight": 8,
+                "backgroundColor": "#ca35421a",
+                "borderColor": "#ca3542",
+                "borderLeftWidth": 4,
+                "borderRadius": 4,
+                "flexDirection": "row",
+                "padding": 12,
+                "paddingLeft": 8,
               }
             }
+            testID="banneralert"
           >
-            <SvgMock
-              color="#ca3542"
-              fill="currentColor"
-              height={24}
-              name="Danger"
+            <View
               style={
                 {
-                  "height": 24,
-                  "width": 24,
+                  "marginRight": 8,
                 }
               }
-              width={24}
-            />
+            >
+              <SvgMock
+                color="#ca3542"
+                fill="currentColor"
+                height={24}
+                name="Danger"
+                style={
+                  {
+                    "height": 24,
+                    "width": 24,
+                  }
+                }
+                width={24}
+              />
+            </View>
+            <View
+              style={
+                {
+                  "flex": 1,
+                }
+              }
+            >
+              <Text
+                accessibilityRole="text"
+                style={
+                  {
+                    "color": "#131416",
+                    "fontFamily": "Geist-Regular",
+                    "fontSize": 14,
+                    "letterSpacing": 0,
+                    "lineHeight": 22,
+                  }
+                }
+              >
+                Network error
+              </Text>
+            </View>
           </View>
           <View
             style={
               {
-                "flex": 1,
+                "gap": 16,
+                "paddingBottom": 16,
               }
             }
           >
@@ -210,146 +253,109 @@ exports[`BuildQuote Continue button displays error banner when quote fetch fails
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
-                  "fontSize": 16,
+                  "fontSize": 14,
                   "letterSpacing": 0,
-                  "lineHeight": 24,
+                  "lineHeight": 22,
+                  "textAlign": "center",
                 }
               }
             >
-              Network error
+              fiat_on_ramp.powered_by_provider
             </Text>
-          </View>
-        </View>
-        <View
-          style={
-            {
-              "gap": 16,
-              "paddingBottom": 16,
-            }
-          }
-        >
-          <Text
-            accessibilityRole="text"
-            style={
-              {
-                "color": "#686e7d",
-                "fontFamily": "Geist-Regular",
-                "fontSize": 14,
-                "letterSpacing": 0,
-                "lineHeight": 22,
-                "textAlign": "center",
-              }
-            }
-          >
-            fiat_on_ramp.powered_by_provider
-          </Text>
-          <View
-            accessibilityLabel="fiat_on_ramp.continue"
-            accessibilityRole="button"
-            accessibilityState={
-              {
-                "busy": undefined,
-                "checked": undefined,
-                "disabled": true,
-                "expanded": undefined,
-                "selected": undefined,
-              }
-            }
-            accessibilityValue={
-              {
-                "max": undefined,
-                "min": undefined,
-                "now": undefined,
-                "text": undefined,
-              }
-            }
-            accessible={true}
-            collapsable={false}
-            focusable={true}
-            onBlur={[Function]}
-            onClick={[Function]}
-            onFocus={[Function]}
-            onResponderGrant={[Function]}
-            onResponderMove={[Function]}
-            onResponderRelease={[Function]}
-            onResponderTerminate={[Function]}
-            onResponderTerminationRequest={[Function]}
-            onStartShouldSetResponder={[Function]}
-            style={
-              [
+            <View
+              accessibilityLabel="fiat_on_ramp.continue"
+              accessibilityRole="button"
+              accessibilityState={
                 {
-                  "alignItems": "center",
-                  "backgroundColor": "#121314",
-                  "borderRadius": 12,
-                  "columnGap": 8,
-                  "flexDirection": "row",
-                  "height": 48,
-                  "justifyContent": "center",
-                  "minWidth": 80,
-                  "opacity": 0.5,
-                  "overflow": "hidden",
-                  "paddingLeft": 16,
-                  "paddingRight": 16,
-                  "width": "100%",
-                },
+                  "busy": undefined,
+                  "checked": undefined,
+                  "disabled": true,
+                  "expanded": undefined,
+                  "selected": undefined,
+                }
+              }
+              accessibilityValue={
                 {
-                  "transform": [
-                    {
-                      "scale": 1,
-                    },
-                  ],
-                },
-              ]
-            }
-            testID="build-quote-continue-button"
-          >
-            <Text
-              accessibilityRole="text"
-              ellipsizeMode="clip"
-              numberOfLines={1}
+                  "max": undefined,
+                  "min": undefined,
+                  "now": undefined,
+                  "text": undefined,
+                }
+              }
+              accessible={true}
+              collapsable={false}
+              focusable={true}
+              onBlur={[Function]}
+              onClick={[Function]}
+              onFocus={[Function]}
+              onResponderGrant={[Function]}
+              onResponderMove={[Function]}
+              onResponderRelease={[Function]}
+              onResponderTerminate={[Function]}
+              onResponderTerminationRequest={[Function]}
+              onStartShouldSetResponder={[Function]}
               style={
                 [
                   {
-                    "color": "#ffffff",
-                    "flexGrow": 0,
-                    "flexShrink": 1,
-                    "flexWrap": "wrap",
-                    "fontFamily": "Geist-Medium",
-                    "fontSize": 16,
-                    "fontWeight": 400,
-                    "letterSpacing": 0,
-                    "lineHeight": 24,
-                    "textAlign": "center",
+                    "alignItems": "center",
+                    "backgroundColor": "#131416",
+                    "borderRadius": 12,
+                    "columnGap": 8,
+                    "flexDirection": "row",
+                    "height": 48,
+                    "justifyContent": "center",
+                    "minWidth": 80,
+                    "opacity": 0.5,
+                    "overflow": "hidden",
+                    "paddingLeft": 16,
+                    "paddingRight": 16,
+                    "width": "100%",
+                  },
+                  {
+                    "transform": [
+                      {
+                        "scale": 1,
+                      },
+                    ],
                   },
-                  undefined,
                 ]
               }
+              testID="build-quote-continue-button"
             >
-              fiat_on_ramp.continue
-            </Text>
+              <Text
+                accessibilityRole="text"
+                ellipsizeMode="clip"
+                numberOfLines={1}
+                style={
+                  [
+                    {
+                      "color": "#ffffff",
+                      "flexGrow": 0,
+                      "flexShrink": 1,
+                      "flexWrap": "wrap",
+                      "fontFamily": "Geist-Medium",
+                      "fontSize": 16,
+                      "fontWeight": 400,
+                      "letterSpacing": 0,
+                      "lineHeight": 24,
+                      "textAlign": "center",
+                    },
+                    undefined,
+                  ]
+                }
+              >
+                fiat_on_ramp.continue
+              </Text>
+            </View>
           </View>
-        </View>
-        <View
-          style={
-            [
-              {
-                "display": "flex",
-                "gap": 12,
-              },
-              undefined,
-            ]
-          }
-        >
           <View
             style={
               [
                 {
                   "display": "flex",
-                  "flexDirection": "row",
                   "gap": 12,
-                  "justifyContent": "space-between",
                 },
                 undefined,
               ]
@@ -360,705 +366,728 @@ exports[`BuildQuote Continue button displays error banner when quote fetch fails
                 [
                   {
                     "display": "flex",
-                    "flexBasis": "0%",
-                    "flexGrow": 1,
-                    "flexShrink": 1,
+                    "flexDirection": "row",
+                    "gap": 12,
+                    "justifyContent": "space-between",
                   },
                   undefined,
                 ]
               }
             >
-              <TouchableOpacity
-                accessibilityRole="button"
-                accessible={true}
-                onPress={[Function]}
+              <View
                 style={
                   [
                     {
-                      "alignItems": "center",
-                      "backgroundColor": "#3c4d9d0f",
-                      "borderRadius": 12,
-                      "height": 48,
-                      "justifyContent": "center",
-                      "paddingHorizontal": 16,
+                      "display": "flex",
+                      "flexBasis": "0%",
+                      "flexGrow": 1,
+                      "flexShrink": 1,
                     },
                     undefined,
                   ]
                 }
               >
-                <Text
-                  accessibilityRole="none"
+                <TouchableOpacity
+                  accessibilityRole="button"
+                  accessible={true}
+                  onPress={[Function]}
                   style={
                     [
                       {
-                        "color": "#121314",
-                        "fontFamily": "Geist-Bold",
-                        "fontSize": 32,
-                        "fontWeight": "500",
-                        "letterSpacing": 0,
-                        "lineHeight": 40,
-                        "textAlign": "center",
+                        "alignItems": "center",
+                        "backgroundColor": "#b4b4b528",
+                        "borderRadius": 12,
+                        "height": 48,
+                        "justifyContent": "center",
+                        "paddingHorizontal": 16,
                       },
                       undefined,
                     ]
                   }
                 >
-                  1
-                </Text>
-              </TouchableOpacity>
-            </View>
-            <View
-              style={
-                [
-                  {
-                    "display": "flex",
-                    "flexBasis": "0%",
-                    "flexGrow": 1,
-                    "flexShrink": 1,
-                  },
-                  undefined,
-                ]
-              }
-            >
-              <TouchableOpacity
-                accessibilityRole="button"
-                accessible={true}
-                onPress={[Function]}
+                  <Text
+                    accessibilityRole="none"
+                    style={
+                      [
+                        {
+                          "color": "#131416",
+                          "fontFamily": "Geist-Bold",
+                          "fontSize": 32,
+                          "fontWeight": "500",
+                          "letterSpacing": 0,
+                          "lineHeight": 40,
+                          "textAlign": "center",
+                        },
+                        undefined,
+                      ]
+                    }
+                  >
+                    1
+                  </Text>
+                </TouchableOpacity>
+              </View>
+              <View
                 style={
                   [
                     {
-                      "alignItems": "center",
-                      "backgroundColor": "#3c4d9d0f",
-                      "borderRadius": 12,
-                      "height": 48,
-                      "justifyContent": "center",
-                      "paddingHorizontal": 16,
+                      "display": "flex",
+                      "flexBasis": "0%",
+                      "flexGrow": 1,
+                      "flexShrink": 1,
                     },
                     undefined,
                   ]
                 }
               >
-                <Text
-                  accessibilityRole="none"
+                <TouchableOpacity
+                  accessibilityRole="button"
+                  accessible={true}
+                  onPress={[Function]}
                   style={
                     [
                       {
-                        "color": "#121314",
-                        "fontFamily": "Geist-Bold",
-                        "fontSize": 32,
-                        "fontWeight": "500",
-                        "letterSpacing": 0,
-                        "lineHeight": 40,
-                        "textAlign": "center",
+                        "alignItems": "center",
+                        "backgroundColor": "#b4b4b528",
+                        "borderRadius": 12,
+                        "height": 48,
+                        "justifyContent": "center",
+                        "paddingHorizontal": 16,
                       },
                       undefined,
                     ]
                   }
                 >
-                  2
-                </Text>
-              </TouchableOpacity>
-            </View>
-            <View
-              style={
-                [
-                  {
-                    "display": "flex",
-                    "flexBasis": "0%",
-                    "flexGrow": 1,
-                    "flexShrink": 1,
-                  },
-                  undefined,
-                ]
-              }
-            >
-              <TouchableOpacity
-                accessibilityRole="button"
-                accessible={true}
-                onPress={[Function]}
+                  <Text
+                    accessibilityRole="none"
+                    style={
+                      [
+                        {
+                          "color": "#131416",
+                          "fontFamily": "Geist-Bold",
+                          "fontSize": 32,
+                          "fontWeight": "500",
+                          "letterSpacing": 0,
+                          "lineHeight": 40,
+                          "textAlign": "center",
+                        },
+                        undefined,
+                      ]
+                    }
+                  >
+                    2
+                  </Text>
+                </TouchableOpacity>
+              </View>
+              <View
                 style={
                   [
                     {
-                      "alignItems": "center",
-                      "backgroundColor": "#3c4d9d0f",
-                      "borderRadius": 12,
-                      "height": 48,
-                      "justifyContent": "center",
-                      "paddingHorizontal": 16,
+                      "display": "flex",
+                      "flexBasis": "0%",
+                      "flexGrow": 1,
+                      "flexShrink": 1,
                     },
                     undefined,
                   ]
                 }
               >
-                <Text
-                  accessibilityRole="none"
+                <TouchableOpacity
+                  accessibilityRole="button"
+                  accessible={true}
+                  onPress={[Function]}
                   style={
                     [
                       {
-                        "color": "#121314",
-                        "fontFamily": "Geist-Bold",
-                        "fontSize": 32,
-                        "fontWeight": "500",
-                        "letterSpacing": 0,
-                        "lineHeight": 40,
-                        "textAlign": "center",
+                        "alignItems": "center",
+                        "backgroundColor": "#b4b4b528",
+                        "borderRadius": 12,
+                        "height": 48,
+                        "justifyContent": "center",
+                        "paddingHorizontal": 16,
                       },
                       undefined,
                     ]
                   }
                 >
-                  3
-                </Text>
-              </TouchableOpacity>
+                  <Text
+                    accessibilityRole="none"
+                    style={
+                      [
+                        {
+                          "color": "#131416",
+                          "fontFamily": "Geist-Bold",
+                          "fontSize": 32,
+                          "fontWeight": "500",
+                          "letterSpacing": 0,
+                          "lineHeight": 40,
+                          "textAlign": "center",
+                        },
+                        undefined,
+                      ]
+                    }
+                  >
+                    3
+                  </Text>
+                </TouchableOpacity>
+              </View>
             </View>
-          </View>
-          <View
-            style={
-              [
-                {
-                  "display": "flex",
-                  "flexDirection": "row",
-                  "gap": 12,
-                  "justifyContent": "space-between",
-                },
-                undefined,
-              ]
-            }
-          >
             <View
               style={
                 [
                   {
                     "display": "flex",
-                    "flexBasis": "0%",
-                    "flexGrow": 1,
-                    "flexShrink": 1,
+                    "flexDirection": "row",
+                    "gap": 12,
+                    "justifyContent": "space-between",
                   },
                   undefined,
                 ]
               }
             >
-              <TouchableOpacity
-                accessibilityRole="button"
-                accessible={true}
-                onPress={[Function]}
+              <View
                 style={
                   [
                     {
-                      "alignItems": "center",
-                      "backgroundColor": "#3c4d9d0f",
-                      "borderRadius": 12,
-                      "height": 48,
-                      "justifyContent": "center",
-                      "paddingHorizontal": 16,
+                      "display": "flex",
+                      "flexBasis": "0%",
+                      "flexGrow": 1,
+                      "flexShrink": 1,
                     },
                     undefined,
                   ]
                 }
               >
-                <Text
-                  accessibilityRole="none"
+                <TouchableOpacity
+                  accessibilityRole="button"
+                  accessible={true}
+                  onPress={[Function]}
                   style={
                     [
                       {
-                        "color": "#121314",
-                        "fontFamily": "Geist-Bold",
-                        "fontSize": 32,
-                        "fontWeight": "500",
-                        "letterSpacing": 0,
-                        "lineHeight": 40,
-                        "textAlign": "center",
+                        "alignItems": "center",
+                        "backgroundColor": "#b4b4b528",
+                        "borderRadius": 12,
+                        "height": 48,
+                        "justifyContent": "center",
+                        "paddingHorizontal": 16,
                       },
                       undefined,
                     ]
                   }
                 >
-                  4
-                </Text>
-              </TouchableOpacity>
-            </View>
-            <View
-              style={
-                [
-                  {
-                    "display": "flex",
-                    "flexBasis": "0%",
-                    "flexGrow": 1,
-                    "flexShrink": 1,
-                  },
-                  undefined,
-                ]
-              }
-            >
-              <TouchableOpacity
-                accessibilityRole="button"
-                accessible={true}
-                onPress={[Function]}
+                  <Text
+                    accessibilityRole="none"
+                    style={
+                      [
+                        {
+                          "color": "#131416",
+                          "fontFamily": "Geist-Bold",
+                          "fontSize": 32,
+                          "fontWeight": "500",
+                          "letterSpacing": 0,
+                          "lineHeight": 40,
+                          "textAlign": "center",
+                        },
+                        undefined,
+                      ]
+                    }
+                  >
+                    4
+                  </Text>
+                </TouchableOpacity>
+              </View>
+              <View
                 style={
                   [
                     {
-                      "alignItems": "center",
-                      "backgroundColor": "#3c4d9d0f",
-                      "borderRadius": 12,
-                      "height": 48,
-                      "justifyContent": "center",
-                      "paddingHorizontal": 16,
+                      "display": "flex",
+                      "flexBasis": "0%",
+                      "flexGrow": 1,
+                      "flexShrink": 1,
                     },
                     undefined,
                   ]
                 }
               >
-                <Text
-                  accessibilityRole="none"
+                <TouchableOpacity
+                  accessibilityRole="button"
+                  accessible={true}
+                  onPress={[Function]}
                   style={
                     [
                       {
-                        "color": "#121314",
-                        "fontFamily": "Geist-Bold",
-                        "fontSize": 32,
-                        "fontWeight": "500",
-                        "letterSpacing": 0,
-                        "lineHeight": 40,
-                        "textAlign": "center",
+                        "alignItems": "center",
+                        "backgroundColor": "#b4b4b528",
+                        "borderRadius": 12,
+                        "height": 48,
+                        "justifyContent": "center",
+                        "paddingHorizontal": 16,
                       },
                       undefined,
                     ]
                   }
                 >
-                  5
-                </Text>
-              </TouchableOpacity>
-            </View>
-            <View
-              style={
-                [
-                  {
-                    "display": "flex",
-                    "flexBasis": "0%",
-                    "flexGrow": 1,
-                    "flexShrink": 1,
-                  },
-                  undefined,
-                ]
-              }
-            >
-              <TouchableOpacity
-                accessibilityRole="button"
-                accessible={true}
-                onPress={[Function]}
+                  <Text
+                    accessibilityRole="none"
+                    style={
+                      [
+                        {
+                          "color": "#131416",
+                          "fontFamily": "Geist-Bold",
+                          "fontSize": 32,
+                          "fontWeight": "500",
+                          "letterSpacing": 0,
+                          "lineHeight": 40,
+                          "textAlign": "center",
+                        },
+                        undefined,
+                      ]
+                    }
+                  >
+                    5
+                  </Text>
+                </TouchableOpacity>
+              </View>
+              <View
                 style={
                   [
                     {
-                      "alignItems": "center",
-                      "backgroundColor": "#3c4d9d0f",
-                      "borderRadius": 12,
-                      "height": 48,
-                      "justifyContent": "center",
-                      "paddingHorizontal": 16,
+                      "display": "flex",
+                      "flexBasis": "0%",
+                      "flexGrow": 1,
+                      "flexShrink": 1,
                     },
                     undefined,
                   ]
                 }
               >
-                <Text
-                  accessibilityRole="none"
+                <TouchableOpacity
+                  accessibilityRole="button"
+                  accessible={true}
+                  onPress={[Function]}
                   style={
                     [
                       {
-                        "color": "#121314",
-                        "fontFamily": "Geist-Bold",
-                        "fontSize": 32,
-                        "fontWeight": "500",
-                        "letterSpacing": 0,
-                        "lineHeight": 40,
-                        "textAlign": "center",
+                        "alignItems": "center",
+                        "backgroundColor": "#b4b4b528",
+                        "borderRadius": 12,
+                        "height": 48,
+                        "justifyContent": "center",
+                        "paddingHorizontal": 16,
                       },
                       undefined,
                     ]
                   }
                 >
-                  6
-                </Text>
-              </TouchableOpacity>
+                  <Text
+                    accessibilityRole="none"
+                    style={
+                      [
+                        {
+                          "color": "#131416",
+                          "fontFamily": "Geist-Bold",
+                          "fontSize": 32,
+                          "fontWeight": "500",
+                          "letterSpacing": 0,
+                          "lineHeight": 40,
+                          "textAlign": "center",
+                        },
+                        undefined,
+                      ]
+                    }
+                  >
+                    6
+                  </Text>
+                </TouchableOpacity>
+              </View>
             </View>
-          </View>
-          <View
-            style={
-              [
-                {
-                  "display": "flex",
-                  "flexDirection": "row",
-                  "gap": 12,
-                  "justifyContent": "space-between",
-                },
-                undefined,
-              ]
-            }
-          >
             <View
               style={
                 [
                   {
                     "display": "flex",
-                    "flexBasis": "0%",
-                    "flexGrow": 1,
-                    "flexShrink": 1,
+                    "flexDirection": "row",
+                    "gap": 12,
+                    "justifyContent": "space-between",
                   },
                   undefined,
                 ]
               }
             >
-              <TouchableOpacity
-                accessibilityRole="button"
-                accessible={true}
-                onPress={[Function]}
+              <View
                 style={
                   [
                     {
-                      "alignItems": "center",
-                      "backgroundColor": "#3c4d9d0f",
-                      "borderRadius": 12,
-                      "height": 48,
-                      "justifyContent": "center",
-                      "paddingHorizontal": 16,
+                      "display": "flex",
+                      "flexBasis": "0%",
+                      "flexGrow": 1,
+                      "flexShrink": 1,
                     },
                     undefined,
                   ]
                 }
               >
-                <Text
-                  accessibilityRole="none"
+                <TouchableOpacity
+                  accessibilityRole="button"
+                  accessible={true}
+                  onPress={[Function]}
                   style={
                     [
                       {
-                        "color": "#121314",
-                        "fontFamily": "Geist-Bold",
-                        "fontSize": 32,
-                        "fontWeight": "500",
-                        "letterSpacing": 0,
-                        "lineHeight": 40,
-                        "textAlign": "center",
+                        "alignItems": "center",
+                        "backgroundColor": "#b4b4b528",
+                        "borderRadius": 12,
+                        "height": 48,
+                        "justifyContent": "center",
+                        "paddingHorizontal": 16,
                       },
                       undefined,
                     ]
                   }
                 >
-                  7
-                </Text>
-              </TouchableOpacity>
-            </View>
-            <View
-              style={
-                [
-                  {
-                    "display": "flex",
-                    "flexBasis": "0%",
-                    "flexGrow": 1,
-                    "flexShrink": 1,
-                  },
-                  undefined,
-                ]
-              }
-            >
-              <TouchableOpacity
-                accessibilityRole="button"
-                accessible={true}
-                onPress={[Function]}
+                  <Text
+                    accessibilityRole="none"
+                    style={
+                      [
+                        {
+                          "color": "#131416",
+                          "fontFamily": "Geist-Bold",
+                          "fontSize": 32,
+                          "fontWeight": "500",
+                          "letterSpacing": 0,
+                          "lineHeight": 40,
+                          "textAlign": "center",
+                        },
+                        undefined,
+                      ]
+                    }
+                  >
+                    7
+                  </Text>
+                </TouchableOpacity>
+              </View>
+              <View
                 style={
                   [
                     {
-                      "alignItems": "center",
-                      "backgroundColor": "#3c4d9d0f",
-                      "borderRadius": 12,
-                      "height": 48,
-                      "justifyContent": "center",
-                      "paddingHorizontal": 16,
+                      "display": "flex",
+                      "flexBasis": "0%",
+                      "flexGrow": 1,
+                      "flexShrink": 1,
                     },
                     undefined,
                   ]
                 }
               >
-                <Text
-                  accessibilityRole="none"
+                <TouchableOpacity
+                  accessibilityRole="button"
+                  accessible={true}
+                  onPress={[Function]}
                   style={
                     [
                       {
-                        "color": "#121314",
-                        "fontFamily": "Geist-Bold",
-                        "fontSize": 32,
-                        "fontWeight": "500",
-                        "letterSpacing": 0,
-                        "lineHeight": 40,
-                        "textAlign": "center",
+                        "alignItems": "center",
+                        "backgroundColor": "#b4b4b528",
+                        "borderRadius": 12,
+                        "height": 48,
+                        "justifyContent": "center",
+                        "paddingHorizontal": 16,
                       },
                       undefined,
                     ]
                   }
                 >
-                  8
-                </Text>
-              </TouchableOpacity>
-            </View>
-            <View
-              style={
-                [
-                  {
-                    "display": "flex",
-                    "flexBasis": "0%",
-                    "flexGrow": 1,
-                    "flexShrink": 1,
-                  },
-                  undefined,
-                ]
-              }
-            >
-              <TouchableOpacity
-                accessibilityRole="button"
-                accessible={true}
-                onPress={[Function]}
+                  <Text
+                    accessibilityRole="none"
+                    style={
+                      [
+                        {
+                          "color": "#131416",
+                          "fontFamily": "Geist-Bold",
+                          "fontSize": 32,
+                          "fontWeight": "500",
+                          "letterSpacing": 0,
+                          "lineHeight": 40,
+                          "textAlign": "center",
+                        },
+                        undefined,
+                      ]
+                    }
+                  >
+                    8
+                  </Text>
+                </TouchableOpacity>
+              </View>
+              <View
                 style={
                   [
                     {
-                      "alignItems": "center",
-                      "backgroundColor": "#3c4d9d0f",
-                      "borderRadius": 12,
-                      "height": 48,
-                      "justifyContent": "center",
-                      "paddingHorizontal": 16,
+                      "display": "flex",
+                      "flexBasis": "0%",
+                      "flexGrow": 1,
+                      "flexShrink": 1,
                     },
                     undefined,
                   ]
                 }
               >
-                <Text
-                  accessibilityRole="none"
+                <TouchableOpacity
+                  accessibilityRole="button"
+                  accessible={true}
+                  onPress={[Function]}
                   style={
                     [
                       {
-                        "color": "#121314",
-                        "fontFamily": "Geist-Bold",
-                        "fontSize": 32,
-                        "fontWeight": "500",
-                        "letterSpacing": 0,
-                        "lineHeight": 40,
-                        "textAlign": "center",
+                        "alignItems": "center",
+                        "backgroundColor": "#b4b4b528",
+                        "borderRadius": 12,
+                        "height": 48,
+                        "justifyContent": "center",
+                        "paddingHorizontal": 16,
                       },
                       undefined,
                     ]
                   }
                 >
-                  9
-                </Text>
-              </TouchableOpacity>
+                  <Text
+                    accessibilityRole="none"
+                    style={
+                      [
+                        {
+                          "color": "#131416",
+                          "fontFamily": "Geist-Bold",
+                          "fontSize": 32,
+                          "fontWeight": "500",
+                          "letterSpacing": 0,
+                          "lineHeight": 40,
+                          "textAlign": "center",
+                        },
+                        undefined,
+                      ]
+                    }
+                  >
+                    9
+                  </Text>
+                </TouchableOpacity>
+              </View>
             </View>
-          </View>
-          <View
-            style={
-              [
-                {
-                  "display": "flex",
-                  "flexDirection": "row",
-                  "gap": 12,
-                  "justifyContent": "space-between",
-                },
-                undefined,
-              ]
-            }
-          >
             <View
               style={
                 [
                   {
                     "display": "flex",
-                    "flexBasis": "0%",
-                    "flexGrow": 1,
-                    "flexShrink": 1,
+                    "flexDirection": "row",
+                    "gap": 12,
+                    "justifyContent": "space-between",
                   },
                   undefined,
                 ]
               }
             >
-              <TouchableOpacity
-                accessibilityRole="button"
-                accessible={true}
-                onPress={[Function]}
+              <View
                 style={
                   [
                     {
-                      "alignItems": "center",
-                      "backgroundColor": "#3c4d9d0f",
-                      "borderRadius": 12,
-                      "height": 48,
-                      "justifyContent": "center",
-                      "paddingHorizontal": 16,
-                    },
-                    {
-                      "backgroundColor": "transparent",
+                      "display": "flex",
+                      "flexBasis": "0%",
+                      "flexGrow": 1,
+                      "flexShrink": 1,
                     },
+                    undefined,
                   ]
                 }
               >
-                <Text
-                  accessibilityRole="none"
+                <TouchableOpacity
+                  accessibilityRole="button"
+                  accessible={true}
+                  onPress={[Function]}
                   style={
                     [
                       {
-                        "color": "#121314",
-                        "fontFamily": "Geist-Bold",
-                        "fontSize": 32,
-                        "fontWeight": "500",
-                        "letterSpacing": 0,
-                        "lineHeight": 40,
-                        "textAlign": "center",
+                        "alignItems": "center",
+                        "backgroundColor": "#b4b4b528",
+                        "borderRadius": 12,
+                        "height": 48,
+                        "justifyContent": "center",
+                        "paddingHorizontal": 16,
+                      },
+                      {
+                        "backgroundColor": "transparent",
                       },
-                      undefined,
                     ]
                   }
                 >
-                  .
-                </Text>
-              </TouchableOpacity>
-            </View>
-            <View
-              style={
-                [
-                  {
-                    "display": "flex",
-                    "flexBasis": "0%",
-                    "flexGrow": 1,
-                    "flexShrink": 1,
-                  },
-                  undefined,
-                ]
-              }
-            >
-              <TouchableOpacity
-                accessibilityRole="button"
-                accessible={true}
-                onPress={[Function]}
+                  <Text
+                    accessibilityRole="none"
+                    style={
+                      [
+                        {
+                          "color": "#131416",
+                          "fontFamily": "Geist-Bold",
+                          "fontSize": 32,
+                          "fontWeight": "500",
+                          "letterSpacing": 0,
+                          "lineHeight": 40,
+                          "textAlign": "center",
+                        },
+                        undefined,
+                      ]
+                    }
+                  >
+                    .
+                  </Text>
+                </TouchableOpacity>
+              </View>
+              <View
                 style={
                   [
                     {
-                      "alignItems": "center",
-                      "backgroundColor": "#3c4d9d0f",
-                      "borderRadius": 12,
-                      "height": 48,
-                      "justifyContent": "center",
-                      "paddingHorizontal": 16,
+                      "display": "flex",
+                      "flexBasis": "0%",
+                      "flexGrow": 1,
+                      "flexShrink": 1,
                     },
                     undefined,
                   ]
                 }
               >
-                <Text
-                  accessibilityRole="none"
+                <TouchableOpacity
+                  accessibilityRole="button"
+                  accessible={true}
+                  onPress={[Function]}
                   style={
                     [
                       {
-                        "color": "#121314",
-                        "fontFamily": "Geist-Bold",
-                        "fontSize": 32,
-                        "fontWeight": "500",
-                        "letterSpacing": 0,
-                        "lineHeight": 40,
-                        "textAlign": "center",
+                        "alignItems": "center",
+                        "backgroundColor": "#b4b4b528",
+                        "borderRadius": 12,
+                        "height": 48,
+                        "justifyContent": "center",
+                        "paddingHorizontal": 16,
                       },
                       undefined,
                     ]
                   }
                 >
-                  0
-                </Text>
-              </TouchableOpacity>
-            </View>
-            <View
-              style={
-                [
-                  {
-                    "display": "flex",
-                    "flexBasis": "0%",
-                    "flexGrow": 1,
-                    "flexShrink": 1,
-                  },
-                  undefined,
-                ]
-              }
-            >
-              <TouchableOpacity
-                accessibilityRole="button"
-                accessible={true}
-                delayLongPress={500}
-                onLongPress={[Function]}
-                onPress={[Function]}
+                  <Text
+                    accessibilityRole="none"
+                    style={
+                      [
+                        {
+                          "color": "#131416",
+                          "fontFamily": "Geist-Bold",
+                          "fontSize": 32,
+                          "fontWeight": "500",
+                          "letterSpacing": 0,
+                          "lineHeight": 40,
+                          "textAlign": "center",
+                        },
+                        undefined,
+                      ]
+                    }
+                  >
+                    0
+                  </Text>
+                </TouchableOpacity>
+              </View>
+              <View
                 style={
                   [
                     {
-                      "alignItems": "center",
-                      "borderRadius": 12,
-                      "height": 48,
-                      "justifyContent": "center",
-                      "paddingHorizontal": 16,
+                      "display": "flex",
+                      "flexBasis": "0%",
+                      "flexGrow": 1,
+                      "flexShrink": 1,
                     },
                     undefined,
                   ]
                 }
-                testID="keypad-delete-button"
               >
-                <SvgMock
-                  fill="currentColor"
-                  name="Backspace"
+                <TouchableOpacity
+                  accessibilityRole="button"
+                  accessible={true}
+                  delayLongPress={500}
+                  onLongPress={[Function]}
+                  onPress={[Function]}
                   style={
                     [
                       {
-                        "color": "#121314",
-                        "height": 32,
-                        "width": 32,
+                        "alignItems": "center",
+                        "borderRadius": 12,
+                        "height": 48,
+                        "justifyContent": "center",
+                        "paddingHorizontal": 16,
                       },
                       undefined,
                     ]
                   }
-                />
-              </TouchableOpacity>
+                  testID="keypad-delete-button"
+                >
+                  <SvgMock
+                    fill="currentColor"
+                    name="Backspace"
+                    style={
+                      [
+                        {
+                          "color": "#131416",
+                          "height": 32,
+                          "width": 32,
+                        },
+                        undefined,
+                      ]
+                    }
+                  />
+                </TouchableOpacity>
+              </View>
             </View>
           </View>
         </View>
       </View>
     </View>
-  </View>
-</RNCSafeAreaView>
+  </RNCSafeAreaView>,
+]
 `;
 
 exports[`BuildQuote matches snapshot 1`] = `
-<RNCSafeAreaView
-  edges={
-    {
-      "bottom": "additive",
-      "left": "additive",
-      "right": "additive",
-      "top": "off",
-    }
-  }
-  style={
-    {
-      "flex": 1,
-    }
-  }
->
+[
   <View
+    testID="header-compact-standard"
+  >
+    <Text>
+      fiat_on_ramp.buy
+    </Text>
+    <Text>
+      fiat_on_ramp.on_network
+    </Text>
+    <View
+      onTouchEnd={[Function]}
+      testID="build-quote-back-button"
+    />
+    <View
+      onTouchEnd={[Function]}
+      testID="build-quote-settings-button"
+    />
+  </View>,
+  <RNCSafeAreaView
+    edges={
+      {
+        "bottom": "additive",
+        "left": "additive",
+        "right": "additive",
+        "top": "off",
+      }
+    }
     style={
-      [
-        {
-          "backgroundColor": "#ffffff",
-          "flex": 1,
-        },
-        undefined,
-      ]
+      {
+        "flex": 1,
+      }
     }
   >
     <View
       style={
         [
           {
+            "backgroundColor": "#ffffff",
             "flex": 1,
           },
           undefined,
@@ -1068,243 +1097,240 @@ exports[`BuildQuote matches snapshot 1`] = `
       <View
         style={
           [
-            {
-              "padding": 15,
-              "paddingHorizontal": 16,
-            },
-            undefined,
             {
               "flex": 1,
             },
+            undefined,
           ]
         }
       >
         <View
           style={
-            {
-              "alignItems": "center",
-              "flex": 1,
-              "gap": 16,
-              "justifyContent": "center",
-            }
+            [
+              {
+                "padding": 15,
+                "paddingHorizontal": 16,
+              },
+              undefined,
+              {
+                "flex": 1,
+              },
+            ]
           }
         >
           <View
             style={
               {
                 "alignItems": "center",
+                "flex": 1,
                 "gap": 16,
+                "justifyContent": "center",
               }
             }
           >
-            <Text
-              accessibilityRole="text"
-              adjustsFontSizeToFit={true}
-              numberOfLines={1}
-              style={
-                {
-                  "color": "#121314",
-                  "fontFamily": "Geist-Regular",
-                  "fontSize": 64,
-                  "fontWeight": "400",
-                  "letterSpacing": 0,
-                  "lineHeight": 72,
-                  "textAlign": "center",
-                }
-              }
-              testID="amount-input"
-            >
-              $100
-            </Text>
-            <TouchableOpacity
-              activeOpacity={0.7}
-              onPress={[Function]}
+            <View
               style={
                 {
                   "alignItems": "center",
-                  "alignSelf": "center",
-                  "backgroundColor": "#3c4d9d0f",
-                  "borderRadius": 100,
-                  "flexDirection": "row",
-                  "padding": 8,
+                  "gap": 16,
                 }
               }
-              testID="payment-method-pill"
             >
-              <View
-                style={
-                  {
-                    "padding": 4,
-                  }
-                }
-              >
-                <SvgMock
-                  color="#121314"
-                  fill="currentColor"
-                  height={16}
-                  name="Card"
-                  style={
-                    {
-                      "height": 16,
-                      "width": 16,
-                    }
-                  }
-                  width={16}
-                />
-              </View>
               <Text
                 accessibilityRole="text"
+                adjustsFontSizeToFit={true}
+                numberOfLines={1}
                 style={
                   {
-                    "color": "#121314",
-                    "fontFamily": "Geist-Medium",
-                    "fontSize": 16,
+                    "color": "#131416",
+                    "fontFamily": "Geist-Regular",
+                    "fontSize": 64,
+                    "fontWeight": "400",
                     "letterSpacing": 0,
-                    "lineHeight": 24,
-                    "marginLeft": 8,
-                    "marginRight": 4,
+                    "lineHeight": 72,
+                    "textAlign": "center",
                   }
                 }
+                testID="amount-input"
               >
-                fiat_on_ramp.select_payment_method
+                $100
               </Text>
-              <View
+              <TouchableOpacity
+                activeOpacity={0.7}
+                onPress={[Function]}
                 style={
                   {
-                    "padding": 4,
+                    "alignItems": "center",
+                    "alignSelf": "center",
+                    "backgroundColor": "#b4b4b528",
+                    "borderRadius": 100,
+                    "flexDirection": "row",
+                    "padding": 8,
                   }
                 }
+                testID="payment-method-pill"
               >
-                <SvgMock
-                  color="#121314"
-                  fill="currentColor"
-                  height={16}
-                  name="ArrowDown"
+                <View
                   style={
                     {
-                      "height": 16,
-                      "width": 16,
+                      "padding": 4,
                     }
                   }
-                  width={16}
-                />
-              </View>
-            </TouchableOpacity>
+                >
+                  <SvgMock
+                    color="#131416"
+                    fill="currentColor"
+                    height={16}
+                    name="Card"
+                    style={
+                      {
+                        "height": 16,
+                        "width": 16,
+                      }
+                    }
+                    width={16}
+                  />
+                </View>
+                <Text
+                  accessibilityRole="text"
+                  style={
+                    {
+                      "color": "#131416",
+                      "fontFamily": "Geist-Medium",
+                      "fontSize": 16,
+                      "letterSpacing": 0,
+                      "lineHeight": 24,
+                      "marginLeft": 8,
+                      "marginRight": 4,
+                    }
+                  }
+                >
+                  fiat_on_ramp.select_payment_method
+                </Text>
+                <View
+                  style={
+                    {
+                      "padding": 4,
+                    }
+                  }
+                >
+                  <SvgMock
+                    color="#131416"
+                    fill="currentColor"
+                    height={16}
+                    name="ArrowDown"
+                    style={
+                      {
+                        "height": 16,
+                        "width": 16,
+                      }
+                    }
+                    width={16}
+                  />
+                </View>
+              </TouchableOpacity>
+            </View>
           </View>
-        </View>
-        <View
-          style={
-            {
-              "gap": 16,
-              "paddingBottom": 16,
-            }
-          }
-        >
           <View
-            accessibilityLabel="fiat_on_ramp.continue"
-            accessibilityRole="button"
-            accessibilityState={
-              {
-                "busy": undefined,
-                "checked": undefined,
-                "disabled": true,
-                "expanded": undefined,
-                "selected": undefined,
-              }
-            }
-            accessibilityValue={
+            style={
               {
-                "max": undefined,
-                "min": undefined,
-                "now": undefined,
-                "text": undefined,
+                "gap": 16,
+                "paddingBottom": 16,
               }
             }
-            accessible={true}
-            collapsable={false}
-            focusable={true}
-            onBlur={[Function]}
-            onClick={[Function]}
-            onFocus={[Function]}
-            onResponderGrant={[Function]}
-            onResponderMove={[Function]}
-            onResponderRelease={[Function]}
-            onResponderTerminate={[Function]}
-            onResponderTerminationRequest={[Function]}
-            onStartShouldSetResponder={[Function]}
-            style={
-              [
+          >
+            <View
+              accessibilityLabel="fiat_on_ramp.continue"
+              accessibilityRole="button"
+              accessibilityState={
                 {
-                  "alignItems": "center",
-                  "backgroundColor": "#121314",
-                  "borderRadius": 12,
-                  "columnGap": 8,
-                  "flexDirection": "row",
-                  "height": 48,
-                  "justifyContent": "center",
-                  "minWidth": 80,
-                  "opacity": 0.5,
-                  "overflow": "hidden",
-                  "paddingLeft": 16,
-                  "paddingRight": 16,
-                  "width": "100%",
-                },
+                  "busy": undefined,
+                  "checked": undefined,
+                  "disabled": true,
+                  "expanded": undefined,
+                  "selected": undefined,
+                }
+              }
+              accessibilityValue={
                 {
-                  "transform": [
-                    {
-                      "scale": 1,
-                    },
-                  ],
-                },
-              ]
-            }
-            testID="build-quote-continue-button"
-          >
-            <Text
-              accessibilityRole="text"
-              ellipsizeMode="clip"
-              numberOfLines={1}
+                  "max": undefined,
+                  "min": undefined,
+                  "now": undefined,
+                  "text": undefined,
+                }
+              }
+              accessible={true}
+              collapsable={false}
+              focusable={true}
+              onBlur={[Function]}
+              onClick={[Function]}
+              onFocus={[Function]}
+              onResponderGrant={[Function]}
+              onResponderMove={[Function]}
+              onResponderRelease={[Function]}
+              onResponderTerminate={[Function]}
+              onResponderTerminationRequest={[Function]}
+              onStartShouldSetResponder={[Function]}
               style={
                 [
                   {
-                    "color": "#ffffff",
-                    "flexGrow": 0,
-                    "flexShrink": 1,
-                    "flexWrap": "wrap",
-                    "fontFamily": "Geist-Medium",
-                    "fontSize": 16,
-                    "fontWeight": 400,
-                    "letterSpacing": 0,
-                    "lineHeight": 24,
-                    "textAlign": "center",
+                    "alignItems": "center",
+                    "backgroundColor": "#131416",
+                    "borderRadius": 12,
+                    "columnGap": 8,
+                    "flexDirection": "row",
+                    "height": 48,
+                    "justifyContent": "center",
+                    "minWidth": 80,
+                    "opacity": 0.5,
+                    "overflow": "hidden",
+                    "paddingLeft": 16,
+                    "paddingRight": 16,
+                    "width": "100%",
+                  },
+                  {
+                    "transform": [
+                      {
+                        "scale": 1,
+                      },
+                    ],
                   },
-                  undefined,
                 ]
               }
+              testID="build-quote-continue-button"
             >
-              fiat_on_ramp.continue
-            </Text>
+              <Text
+                accessibilityRole="text"
+                ellipsizeMode="clip"
+                numberOfLines={1}
+                style={
+                  [
+                    {
+                      "color": "#ffffff",
+                      "flexGrow": 0,
+                      "flexShrink": 1,
+                      "flexWrap": "wrap",
+                      "fontFamily": "Geist-Medium",
+                      "fontSize": 16,
+                      "fontWeight": 400,
+                      "letterSpacing": 0,
+                      "lineHeight": 24,
+                      "textAlign": "center",
+                    },
+                    undefined,
+                  ]
+                }
+              >
+                fiat_on_ramp.continue
+              </Text>
+            </View>
           </View>
-        </View>
-        <View
-          style={
-            [
-              {
-                "display": "flex",
-                "gap": 12,
-              },
-              undefined,
-            ]
-          }
-        >
           <View
             style={
               [
                 {
                   "display": "flex",
-                  "flexDirection": "row",
                   "gap": 12,
-                  "justifyContent": "space-between",
                 },
                 undefined,
               ]
@@ -1315,670 +1341,684 @@ exports[`BuildQuote matches snapshot 1`] = `
                 [
                   {
                     "display": "flex",
-                    "flexBasis": "0%",
-                    "flexGrow": 1,
-                    "flexShrink": 1,
+                    "flexDirection": "row",
+                    "gap": 12,
+                    "justifyContent": "space-between",
                   },
                   undefined,
                 ]
               }
             >
-              <TouchableOpacity
-                accessibilityRole="button"
-                accessible={true}
-                onPress={[Function]}
+              <View
                 style={
                   [
                     {
-                      "alignItems": "center",
-                      "backgroundColor": "#3c4d9d0f",
-                      "borderRadius": 12,
-                      "height": 48,
-                      "justifyContent": "center",
-                      "paddingHorizontal": 16,
+                      "display": "flex",
+                      "flexBasis": "0%",
+                      "flexGrow": 1,
+                      "flexShrink": 1,
                     },
                     undefined,
                   ]
                 }
               >
-                <Text
-                  accessibilityRole="none"
+                <TouchableOpacity
+                  accessibilityRole="button"
+                  accessible={true}
+                  onPress={[Function]}
                   style={
                     [
                       {
-                        "color": "#121314",
-                        "fontFamily": "Geist-Bold",
-                        "fontSize": 32,
-                        "fontWeight": "500",
-                        "letterSpacing": 0,
-                        "lineHeight": 40,
-                        "textAlign": "center",
+                        "alignItems": "center",
+                        "backgroundColor": "#b4b4b528",
+                        "borderRadius": 12,
+                        "height": 48,
+                        "justifyContent": "center",
+                        "paddingHorizontal": 16,
                       },
                       undefined,
                     ]
                   }
                 >
-                  1
-                </Text>
-              </TouchableOpacity>
-            </View>
-            <View
-              style={
-                [
-                  {
-                    "display": "flex",
-                    "flexBasis": "0%",
-                    "flexGrow": 1,
-                    "flexShrink": 1,
-                  },
-                  undefined,
-                ]
-              }
-            >
-              <TouchableOpacity
-                accessibilityRole="button"
-                accessible={true}
-                onPress={[Function]}
+                  <Text
+                    accessibilityRole="none"
+                    style={
+                      [
+                        {
+                          "color": "#131416",
+                          "fontFamily": "Geist-Bold",
+                          "fontSize": 32,
+                          "fontWeight": "500",
+                          "letterSpacing": 0,
+                          "lineHeight": 40,
+                          "textAlign": "center",
+                        },
+                        undefined,
+                      ]
+                    }
+                  >
+                    1
+                  </Text>
+                </TouchableOpacity>
+              </View>
+              <View
                 style={
                   [
                     {
-                      "alignItems": "center",
-                      "backgroundColor": "#3c4d9d0f",
-                      "borderRadius": 12,
-                      "height": 48,
-                      "justifyContent": "center",
-                      "paddingHorizontal": 16,
+                      "display": "flex",
+                      "flexBasis": "0%",
+                      "flexGrow": 1,
+                      "flexShrink": 1,
                     },
                     undefined,
                   ]
                 }
               >
-                <Text
-                  accessibilityRole="none"
+                <TouchableOpacity
+                  accessibilityRole="button"
+                  accessible={true}
+                  onPress={[Function]}
                   style={
                     [
                       {
-                        "color": "#121314",
-                        "fontFamily": "Geist-Bold",
-                        "fontSize": 32,
-                        "fontWeight": "500",
-                        "letterSpacing": 0,
-                        "lineHeight": 40,
-                        "textAlign": "center",
+                        "alignItems": "center",
+                        "backgroundColor": "#b4b4b528",
+                        "borderRadius": 12,
+                        "height": 48,
+                        "justifyContent": "center",
+                        "paddingHorizontal": 16,
                       },
                       undefined,
                     ]
                   }
                 >
-                  2
-                </Text>
-              </TouchableOpacity>
-            </View>
-            <View
-              style={
-                [
-                  {
-                    "display": "flex",
-                    "flexBasis": "0%",
-                    "flexGrow": 1,
-                    "flexShrink": 1,
-                  },
-                  undefined,
-                ]
-              }
-            >
-              <TouchableOpacity
-                accessibilityRole="button"
-                accessible={true}
-                onPress={[Function]}
+                  <Text
+                    accessibilityRole="none"
+                    style={
+                      [
+                        {
+                          "color": "#131416",
+                          "fontFamily": "Geist-Bold",
+                          "fontSize": 32,
+                          "fontWeight": "500",
+                          "letterSpacing": 0,
+                          "lineHeight": 40,
+                          "textAlign": "center",
+                        },
+                        undefined,
+                      ]
+                    }
+                  >
+                    2
+                  </Text>
+                </TouchableOpacity>
+              </View>
+              <View
                 style={
                   [
                     {
-                      "alignItems": "center",
-                      "backgroundColor": "#3c4d9d0f",
-                      "borderRadius": 12,
-                      "height": 48,
-                      "justifyContent": "center",
-                      "paddingHorizontal": 16,
+                      "display": "flex",
+                      "flexBasis": "0%",
+                      "flexGrow": 1,
+                      "flexShrink": 1,
                     },
                     undefined,
                   ]
                 }
               >
-                <Text
-                  accessibilityRole="none"
+                <TouchableOpacity
+                  accessibilityRole="button"
+                  accessible={true}
+                  onPress={[Function]}
                   style={
                     [
                       {
-                        "color": "#121314",
-                        "fontFamily": "Geist-Bold",
-                        "fontSize": 32,
-                        "fontWeight": "500",
-                        "letterSpacing": 0,
-                        "lineHeight": 40,
-                        "textAlign": "center",
+                        "alignItems": "center",
+                        "backgroundColor": "#b4b4b528",
+                        "borderRadius": 12,
+                        "height": 48,
+                        "justifyContent": "center",
+                        "paddingHorizontal": 16,
                       },
                       undefined,
                     ]
                   }
                 >
-                  3
-                </Text>
-              </TouchableOpacity>
+                  <Text
+                    accessibilityRole="none"
+                    style={
+                      [
+                        {
+                          "color": "#131416",
+                          "fontFamily": "Geist-Bold",
+                          "fontSize": 32,
+                          "fontWeight": "500",
+                          "letterSpacing": 0,
+                          "lineHeight": 40,
+                          "textAlign": "center",
+                        },
+                        undefined,
+                      ]
+                    }
+                  >
+                    3
+                  </Text>
+                </TouchableOpacity>
+              </View>
             </View>
-          </View>
-          <View
-            style={
-              [
-                {
-                  "display": "flex",
-                  "flexDirection": "row",
-                  "gap": 12,
-                  "justifyContent": "space-between",
-                },
-                undefined,
-              ]
-            }
-          >
             <View
               style={
                 [
                   {
                     "display": "flex",
-                    "flexBasis": "0%",
-                    "flexGrow": 1,
-                    "flexShrink": 1,
+                    "flexDirection": "row",
+                    "gap": 12,
+                    "justifyContent": "space-between",
                   },
                   undefined,
                 ]
               }
             >
-              <TouchableOpacity
-                accessibilityRole="button"
-                accessible={true}
-                onPress={[Function]}
+              <View
                 style={
                   [
                     {
-                      "alignItems": "center",
-                      "backgroundColor": "#3c4d9d0f",
-                      "borderRadius": 12,
-                      "height": 48,
-                      "justifyContent": "center",
-                      "paddingHorizontal": 16,
+                      "display": "flex",
+                      "flexBasis": "0%",
+                      "flexGrow": 1,
+                      "flexShrink": 1,
                     },
                     undefined,
                   ]
                 }
               >
-                <Text
-                  accessibilityRole="none"
+                <TouchableOpacity
+                  accessibilityRole="button"
+                  accessible={true}
+                  onPress={[Function]}
                   style={
                     [
                       {
-                        "color": "#121314",
-                        "fontFamily": "Geist-Bold",
-                        "fontSize": 32,
-                        "fontWeight": "500",
-                        "letterSpacing": 0,
-                        "lineHeight": 40,
-                        "textAlign": "center",
+                        "alignItems": "center",
+                        "backgroundColor": "#b4b4b528",
+                        "borderRadius": 12,
+                        "height": 48,
+                        "justifyContent": "center",
+                        "paddingHorizontal": 16,
                       },
                       undefined,
                     ]
                   }
                 >
-                  4
-                </Text>
-              </TouchableOpacity>
-            </View>
-            <View
-              style={
-                [
-                  {
-                    "display": "flex",
-                    "flexBasis": "0%",
-                    "flexGrow": 1,
-                    "flexShrink": 1,
-                  },
-                  undefined,
-                ]
-              }
-            >
-              <TouchableOpacity
-                accessibilityRole="button"
-                accessible={true}
-                onPress={[Function]}
+                  <Text
+                    accessibilityRole="none"
+                    style={
+                      [
+                        {
+                          "color": "#131416",
+                          "fontFamily": "Geist-Bold",
+                          "fontSize": 32,
+                          "fontWeight": "500",
+                          "letterSpacing": 0,
+                          "lineHeight": 40,
+                          "textAlign": "center",
+                        },
+                        undefined,
+                      ]
+                    }
+                  >
+                    4
+                  </Text>
+                </TouchableOpacity>
+              </View>
+              <View
                 style={
                   [
                     {
-                      "alignItems": "center",
-                      "backgroundColor": "#3c4d9d0f",
-                      "borderRadius": 12,
-                      "height": 48,
-                      "justifyContent": "center",
-                      "paddingHorizontal": 16,
+                      "display": "flex",
+                      "flexBasis": "0%",
+                      "flexGrow": 1,
+                      "flexShrink": 1,
                     },
                     undefined,
                   ]
                 }
               >
-                <Text
-                  accessibilityRole="none"
+                <TouchableOpacity
+                  accessibilityRole="button"
+                  accessible={true}
+                  onPress={[Function]}
                   style={
                     [
                       {
-                        "color": "#121314",
-                        "fontFamily": "Geist-Bold",
-                        "fontSize": 32,
-                        "fontWeight": "500",
-                        "letterSpacing": 0,
-                        "lineHeight": 40,
-                        "textAlign": "center",
+                        "alignItems": "center",
+                        "backgroundColor": "#b4b4b528",
+                        "borderRadius": 12,
+                        "height": 48,
+                        "justifyContent": "center",
+                        "paddingHorizontal": 16,
                       },
                       undefined,
                     ]
                   }
                 >
-                  5
-                </Text>
-              </TouchableOpacity>
-            </View>
-            <View
-              style={
-                [
-                  {
-                    "display": "flex",
-                    "flexBasis": "0%",
-                    "flexGrow": 1,
-                    "flexShrink": 1,
-                  },
-                  undefined,
-                ]
-              }
-            >
-              <TouchableOpacity
-                accessibilityRole="button"
-                accessible={true}
-                onPress={[Function]}
+                  <Text
+                    accessibilityRole="none"
+                    style={
+                      [
+                        {
+                          "color": "#131416",
+                          "fontFamily": "Geist-Bold",
+                          "fontSize": 32,
+                          "fontWeight": "500",
+                          "letterSpacing": 0,
+                          "lineHeight": 40,
+                          "textAlign": "center",
+                        },
+                        undefined,
+                      ]
+                    }
+                  >
+                    5
+                  </Text>
+                </TouchableOpacity>
+              </View>
+              <View
                 style={
                   [
                     {
-                      "alignItems": "center",
-                      "backgroundColor": "#3c4d9d0f",
-                      "borderRadius": 12,
-                      "height": 48,
-                      "justifyContent": "center",
-                      "paddingHorizontal": 16,
+                      "display": "flex",
+                      "flexBasis": "0%",
+                      "flexGrow": 1,
+                      "flexShrink": 1,
                     },
                     undefined,
                   ]
                 }
               >
-                <Text
-                  accessibilityRole="none"
+                <TouchableOpacity
+                  accessibilityRole="button"
+                  accessible={true}
+                  onPress={[Function]}
                   style={
                     [
                       {
-                        "color": "#121314",
-                        "fontFamily": "Geist-Bold",
-                        "fontSize": 32,
-                        "fontWeight": "500",
-                        "letterSpacing": 0,
-                        "lineHeight": 40,
-                        "textAlign": "center",
+                        "alignItems": "center",
+                        "backgroundColor": "#b4b4b528",
+                        "borderRadius": 12,
+                        "height": 48,
+                        "justifyContent": "center",
+                        "paddingHorizontal": 16,
                       },
                       undefined,
                     ]
                   }
                 >
-                  6
-                </Text>
-              </TouchableOpacity>
+                  <Text
+                    accessibilityRole="none"
+                    style={
+                      [
+                        {
+                          "color": "#131416",
+                          "fontFamily": "Geist-Bold",
+                          "fontSize": 32,
+                          "fontWeight": "500",
+                          "letterSpacing": 0,
+                          "lineHeight": 40,
+                          "textAlign": "center",
+                        },
+                        undefined,
+                      ]
+                    }
+                  >
+                    6
+                  </Text>
+                </TouchableOpacity>
+              </View>
             </View>
-          </View>
-          <View
-            style={
-              [
-                {
-                  "display": "flex",
-                  "flexDirection": "row",
-                  "gap": 12,
-                  "justifyContent": "space-between",
-                },
-                undefined,
-              ]
-            }
-          >
             <View
               style={
                 [
                   {
                     "display": "flex",
-                    "flexBasis": "0%",
-                    "flexGrow": 1,
-                    "flexShrink": 1,
+                    "flexDirection": "row",
+                    "gap": 12,
+                    "justifyContent": "space-between",
                   },
                   undefined,
                 ]
               }
             >
-              <TouchableOpacity
-                accessibilityRole="button"
-                accessible={true}
-                onPress={[Function]}
+              <View
                 style={
                   [
                     {
-                      "alignItems": "center",
-                      "backgroundColor": "#3c4d9d0f",
-                      "borderRadius": 12,
-                      "height": 48,
-                      "justifyContent": "center",
-                      "paddingHorizontal": 16,
+                      "display": "flex",
+                      "flexBasis": "0%",
+                      "flexGrow": 1,
+                      "flexShrink": 1,
                     },
                     undefined,
                   ]
                 }
               >
-                <Text
-                  accessibilityRole="none"
+                <TouchableOpacity
+                  accessibilityRole="button"
+                  accessible={true}
+                  onPress={[Function]}
                   style={
                     [
                       {
-                        "color": "#121314",
-                        "fontFamily": "Geist-Bold",
-                        "fontSize": 32,
-                        "fontWeight": "500",
-                        "letterSpacing": 0,
-                        "lineHeight": 40,
-                        "textAlign": "center",
+                        "alignItems": "center",
+                        "backgroundColor": "#b4b4b528",
+                        "borderRadius": 12,
+                        "height": 48,
+                        "justifyContent": "center",
+                        "paddingHorizontal": 16,
                       },
                       undefined,
                     ]
                   }
                 >
-                  7
-                </Text>
-              </TouchableOpacity>
-            </View>
-            <View
-              style={
-                [
-                  {
-                    "display": "flex",
-                    "flexBasis": "0%",
-                    "flexGrow": 1,
-                    "flexShrink": 1,
-                  },
-                  undefined,
-                ]
-              }
-            >
-              <TouchableOpacity
-                accessibilityRole="button"
-                accessible={true}
-                onPress={[Function]}
+                  <Text
+                    accessibilityRole="none"
+                    style={
+                      [
+                        {
+                          "color": "#131416",
+                          "fontFamily": "Geist-Bold",
+                          "fontSize": 32,
+                          "fontWeight": "500",
+                          "letterSpacing": 0,
+                          "lineHeight": 40,
+                          "textAlign": "center",
+                        },
+                        undefined,
+                      ]
+                    }
+                  >
+                    7
+                  </Text>
+                </TouchableOpacity>
+              </View>
+              <View
                 style={
                   [
                     {
-                      "alignItems": "center",
-                      "backgroundColor": "#3c4d9d0f",
-                      "borderRadius": 12,
-                      "height": 48,
-                      "justifyContent": "center",
-                      "paddingHorizontal": 16,
+                      "display": "flex",
+                      "flexBasis": "0%",
+                      "flexGrow": 1,
+                      "flexShrink": 1,
                     },
                     undefined,
                   ]
                 }
               >
-                <Text
-                  accessibilityRole="none"
+                <TouchableOpacity
+                  accessibilityRole="button"
+                  accessible={true}
+                  onPress={[Function]}
                   style={
                     [
                       {
-                        "color": "#121314",
-                        "fontFamily": "Geist-Bold",
-                        "fontSize": 32,
-                        "fontWeight": "500",
-                        "letterSpacing": 0,
-                        "lineHeight": 40,
-                        "textAlign": "center",
+                        "alignItems": "center",
+                        "backgroundColor": "#b4b4b528",
+                        "borderRadius": 12,
+                        "height": 48,
+                        "justifyContent": "center",
+                        "paddingHorizontal": 16,
                       },
                       undefined,
                     ]
                   }
                 >
-                  8
-                </Text>
-              </TouchableOpacity>
-            </View>
-            <View
-              style={
-                [
-                  {
-                    "display": "flex",
-                    "flexBasis": "0%",
-                    "flexGrow": 1,
-                    "flexShrink": 1,
-                  },
-                  undefined,
-                ]
-              }
-            >
-              <TouchableOpacity
-                accessibilityRole="button"
-                accessible={true}
-                onPress={[Function]}
+                  <Text
+                    accessibilityRole="none"
+                    style={
+                      [
+                        {
+                          "color": "#131416",
+                          "fontFamily": "Geist-Bold",
+                          "fontSize": 32,
+                          "fontWeight": "500",
+                          "letterSpacing": 0,
+                          "lineHeight": 40,
+                          "textAlign": "center",
+                        },
+                        undefined,
+                      ]
+                    }
+                  >
+                    8
+                  </Text>
+                </TouchableOpacity>
+              </View>
+              <View
                 style={
                   [
                     {
-                      "alignItems": "center",
-                      "backgroundColor": "#3c4d9d0f",
-                      "borderRadius": 12,
-                      "height": 48,
-                      "justifyContent": "center",
-                      "paddingHorizontal": 16,
+                      "display": "flex",
+                      "flexBasis": "0%",
+                      "flexGrow": 1,
+                      "flexShrink": 1,
                     },
                     undefined,
                   ]
                 }
               >
-                <Text
-                  accessibilityRole="none"
+                <TouchableOpacity
+                  accessibilityRole="button"
+                  accessible={true}
+                  onPress={[Function]}
                   style={
                     [
                       {
-                        "color": "#121314",
-                        "fontFamily": "Geist-Bold",
-                        "fontSize": 32,
-                        "fontWeight": "500",
-                        "letterSpacing": 0,
-                        "lineHeight": 40,
-                        "textAlign": "center",
+                        "alignItems": "center",
+                        "backgroundColor": "#b4b4b528",
+                        "borderRadius": 12,
+                        "height": 48,
+                        "justifyContent": "center",
+                        "paddingHorizontal": 16,
                       },
                       undefined,
                     ]
                   }
                 >
-                  9
-                </Text>
-              </TouchableOpacity>
+                  <Text
+                    accessibilityRole="none"
+                    style={
+                      [
+                        {
+                          "color": "#131416",
+                          "fontFamily": "Geist-Bold",
+                          "fontSize": 32,
+                          "fontWeight": "500",
+                          "letterSpacing": 0,
+                          "lineHeight": 40,
+                          "textAlign": "center",
+                        },
+                        undefined,
+                      ]
+                    }
+                  >
+                    9
+                  </Text>
+                </TouchableOpacity>
+              </View>
             </View>
-          </View>
-          <View
-            style={
-              [
-                {
-                  "display": "flex",
-                  "flexDirection": "row",
-                  "gap": 12,
-                  "justifyContent": "space-between",
-                },
-                undefined,
-              ]
-            }
-          >
             <View
               style={
                 [
                   {
                     "display": "flex",
-                    "flexBasis": "0%",
-                    "flexGrow": 1,
-                    "flexShrink": 1,
+                    "flexDirection": "row",
+                    "gap": 12,
+                    "justifyContent": "space-between",
                   },
                   undefined,
                 ]
               }
             >
-              <TouchableOpacity
-                accessibilityRole="button"
-                accessible={true}
-                onPress={[Function]}
+              <View
                 style={
                   [
                     {
-                      "alignItems": "center",
-                      "backgroundColor": "#3c4d9d0f",
-                      "borderRadius": 12,
-                      "height": 48,
-                      "justifyContent": "center",
-                      "paddingHorizontal": 16,
-                    },
-                    {
-                      "backgroundColor": "transparent",
+                      "display": "flex",
+                      "flexBasis": "0%",
+                      "flexGrow": 1,
+                      "flexShrink": 1,
                     },
+                    undefined,
                   ]
                 }
               >
-                <Text
-                  accessibilityRole="none"
+                <TouchableOpacity
+                  accessibilityRole="button"
+                  accessible={true}
+                  onPress={[Function]}
                   style={
                     [
                       {
-                        "color": "#121314",
-                        "fontFamily": "Geist-Bold",
-                        "fontSize": 32,
-                        "fontWeight": "500",
-                        "letterSpacing": 0,
-                        "lineHeight": 40,
-                        "textAlign": "center",
+                        "alignItems": "center",
+                        "backgroundColor": "#b4b4b528",
+                        "borderRadius": 12,
+                        "height": 48,
+                        "justifyContent": "center",
+                        "paddingHorizontal": 16,
+                      },
+                      {
+                        "backgroundColor": "transparent",
                       },
-                      undefined,
                     ]
                   }
                 >
-                  .
-                </Text>
-              </TouchableOpacity>
-            </View>
-            <View
-              style={
-                [
-                  {
-                    "display": "flex",
-                    "flexBasis": "0%",
-                    "flexGrow": 1,
-                    "flexShrink": 1,
-                  },
-                  undefined,
-                ]
-              }
-            >
-              <TouchableOpacity
-                accessibilityRole="button"
-                accessible={true}
-                onPress={[Function]}
+                  <Text
+                    accessibilityRole="none"
+                    style={
+                      [
+                        {
+                          "color": "#131416",
+                          "fontFamily": "Geist-Bold",
+                          "fontSize": 32,
+                          "fontWeight": "500",
+                          "letterSpacing": 0,
+                          "lineHeight": 40,
+                          "textAlign": "center",
+                        },
+                        undefined,
+                      ]
+                    }
+                  >
+                    .
+                  </Text>
+                </TouchableOpacity>
+              </View>
+              <View
                 style={
                   [
                     {
-                      "alignItems": "center",
-                      "backgroundColor": "#3c4d9d0f",
-                      "borderRadius": 12,
-                      "height": 48,
-                      "justifyContent": "center",
-                      "paddingHorizontal": 16,
+                      "display": "flex",
+                      "flexBasis": "0%",
+                      "flexGrow": 1,
+                      "flexShrink": 1,
                     },
                     undefined,
                   ]
                 }
               >
-                <Text
-                  accessibilityRole="none"
+                <TouchableOpacity
+                  accessibilityRole="button"
+                  accessible={true}
+                  onPress={[Function]}
                   style={
                     [
                       {
-                        "color": "#121314",
-                        "fontFamily": "Geist-Bold",
-                        "fontSize": 32,
-                        "fontWeight": "500",
-                        "letterSpacing": 0,
-                        "lineHeight": 40,
-                        "textAlign": "center",
+                        "alignItems": "center",
+                        "backgroundColor": "#b4b4b528",
+                        "borderRadius": 12,
+                        "height": 48,
+                        "justifyContent": "center",
+                        "paddingHorizontal": 16,
                       },
                       undefined,
                     ]
                   }
                 >
-                  0
-                </Text>
-              </TouchableOpacity>
-            </View>
-            <View
-              style={
-                [
-                  {
-                    "display": "flex",
-                    "flexBasis": "0%",
-                    "flexGrow": 1,
-                    "flexShrink": 1,
-                  },
-                  undefined,
-                ]
-              }
-            >
-              <TouchableOpacity
-                accessibilityRole="button"
-                accessible={true}
-                delayLongPress={500}
-                onLongPress={[Function]}
-                onPress={[Function]}
+                  <Text
+                    accessibilityRole="none"
+                    style={
+                      [
+                        {
+                          "color": "#131416",
+                          "fontFamily": "Geist-Bold",
+                          "fontSize": 32,
+                          "fontWeight": "500",
+                          "letterSpacing": 0,
+                          "lineHeight": 40,
+                          "textAlign": "center",
+                        },
+                        undefined,
+                      ]
+                    }
+                  >
+                    0
+                  </Text>
+                </TouchableOpacity>
+              </View>
+              <View
                 style={
                   [
                     {
-                      "alignItems": "center",
-                      "borderRadius": 12,
-                      "height": 48,
-                      "justifyContent": "center",
-                      "paddingHorizontal": 16,
+                      "display": "flex",
+                      "flexBasis": "0%",
+                      "flexGrow": 1,
+                      "flexShrink": 1,
                     },
                     undefined,
                   ]
                 }
-                testID="keypad-delete-button"
               >
-                <SvgMock
-                  fill="currentColor"
-                  name="Backspace"
+                <TouchableOpacity
+                  accessibilityRole="button"
+                  accessible={true}
+                  delayLongPress={500}
+                  onLongPress={[Function]}
+                  onPress={[Function]}
                   style={
                     [
                       {
-                        "color": "#121314",
-                        "height": 32,
-                        "width": 32,
+                        "alignItems": "center",
+                        "borderRadius": 12,
+                        "height": 48,
+                        "justifyContent": "center",
+                        "paddingHorizontal": 16,
                       },
                       undefined,
                     ]
                   }
-                />
-              </TouchableOpacity>
+                  testID="keypad-delete-button"
+                >
+                  <SvgMock
+                    fill="currentColor"
+                    name="Backspace"
+                    style={
+                      [
+                        {
+                          "color": "#131416",
+                          "height": 32,
+                          "width": 32,
+                        },
+                        undefined,
+                      ]
+                    }
+                  />
+                </TouchableOpacity>
+              </View>
             </View>
           </View>
         </View>
       </View>
     </View>
-  </View>
-</RNCSafeAreaView>
+  </RNCSafeAreaView>,
+]
 `;
diff --git a/app/components/UI/Ramp/Views/Checkout/Checkout.test.tsx b/app/components/UI/Ramp/Views/Checkout/Checkout.test.tsx
index e6c27bd66abf..3f4db1d34971 100644
--- a/app/components/UI/Ramp/Views/Checkout/Checkout.test.tsx
+++ b/app/components/UI/Ramp/Views/Checkout/Checkout.test.tsx
@@ -1,7 +1,6 @@
 import { act, fireEvent } from '@testing-library/react-native';
 import { renderScreen } from '../../../../../util/test/renderWithProvider';
 import Checkout from '.';
-import { createInitialFiatOrder } from './Checkout';
 import Routes from '../../../../../constants/navigation/Routes';
 import { FIAT_ORDER_PROVIDERS } from '../../../../../constants/on-ramp';
 import Logger from '../../../../../util/Logger';
@@ -36,11 +35,13 @@ jest.mock('../../../../hooks/useThunkDispatch', () => ({
 }));
 
 const mockGetOrderFromCallback = jest.fn();
+const mockAddOrder = jest.fn();
 jest.mock('../../../../../core/Engine', () => ({
   context: {
     RampsController: {
       getOrderFromCallback: (...args: unknown[]) =>
         mockGetOrderFromCallback(...args),
+      addOrder: (...args: unknown[]) => mockAddOrder(...args),
     },
   },
 }));
@@ -278,14 +279,14 @@ describe('Checkout', () => {
       ).toBeOnTheScreen();
     });
 
-    it('handles callback error when order has no ID', async () => {
+    it('navigates to order details even when order IDs are null', async () => {
       mockGetOrderFromCallback.mockResolvedValue({
         status: 'PENDING',
         id: null,
         providerOrderId: null,
       });
 
-      const { getByTestId, getByText } = render();
+      const { getByTestId } = render();
       const webview = getByTestId('checkout-webview');
 
       await act(async () => {
@@ -295,9 +296,20 @@ describe('Checkout', () => {
         });
       });
 
-      expect(
-        getByText('Order response did not contain an order ID'),
-      ).toBeOnTheScreen();
+      expect(mockAddOrder).toHaveBeenCalled();
+      expect(mockReset).toHaveBeenCalledWith(
+        expect.objectContaining({
+          routes: expect.arrayContaining([
+            expect.objectContaining({
+              name: Routes.RAMP.RAMPS_ORDER_DETAILS,
+              params: expect.objectContaining({
+                orderId: null,
+                showCloseButton: true,
+              }),
+            }),
+          ]),
+        }),
+      );
     });
 
     it('successfully creates order from callback with customOrderId', async () => {
@@ -345,7 +357,16 @@ describe('Checkout', () => {
       expect(mockDispatch).toHaveBeenCalledWith(
         expect.objectContaining({ type: 'FIAT_REMOVE_CUSTOM_ID_DATA' }),
       );
-      expect(mockDangerouslyGetParent).toHaveBeenCalled();
+      expect(mockReset).toHaveBeenCalledWith(
+        expect.objectContaining({
+          routes: expect.arrayContaining([
+            expect.objectContaining({
+              name: Routes.RAMP.RAMPS_ORDER_DETAILS,
+              params: expect.objectContaining({ showCloseButton: true }),
+            }),
+          ]),
+        }),
+      );
     });
 
     it('navigates to Ramps order details with showCloseButton when providerType is RAMPS_V2', async () => {
@@ -436,7 +457,7 @@ describe('Checkout', () => {
       );
     });
 
-    it('uses customOrderId as fallback when order IDs are missing', async () => {
+    it('navigates to order details with null orderId when order IDs are missing', async () => {
       const mockOrder = {
         id: null,
         providerOrderId: null,
@@ -468,7 +489,20 @@ describe('Checkout', () => {
         });
       });
 
-      expect(mockDangerouslyGetParent).toHaveBeenCalled();
+      expect(mockAddOrder).toHaveBeenCalledWith(mockOrder);
+      expect(mockReset).toHaveBeenCalledWith(
+        expect.objectContaining({
+          routes: expect.arrayContaining([
+            expect.objectContaining({
+              name: Routes.RAMP.RAMPS_ORDER_DETAILS,
+              params: expect.objectContaining({
+                orderId: null,
+                showCloseButton: true,
+              }),
+            }),
+          ]),
+        }),
+      );
     });
 
     it('does not process callback twice when already handled', async () => {
@@ -528,78 +562,4 @@ describe('Checkout', () => {
       });
     });
   });
-
-  describe('createInitialFiatOrder', () => {
-    const baseParams = {
-      providerCode: 'transak',
-      providerName: 'Transak',
-      orderId: 'order-123',
-      walletAddress: '0xabc',
-      network: '1',
-      currency: 'USD',
-      cryptocurrency: 'ETH',
-    };
-
-    it('builds order with nav params only (no rampsOrder)', () => {
-      const order = createInitialFiatOrder(baseParams);
-      expect(order.id).toBe('/providers/transak/orders/order-123');
-      expect(order.provider).toBe(FIAT_ORDER_PROVIDERS.RAMPS_V2);
-      expect(order.currency).toBe('USD');
-      expect(order.cryptocurrency).toBe('ETH');
-      expect(order.network).toBe('1');
-      expect(order.account).toBe('0xabc');
-    });
-
-    it('uses rampsOrder data when provided', () => {
-      const rampsOrder = {
-        id: 'ramp-order-456',
-        providerOrderId: 'provider-456',
-        status: 'COMPLETED',
-        fiatAmount: 100,
-        cryptoAmount: 0.05,
-        totalFeesFiat: 5,
-        provider: { id: 'transak', name: 'Transak', links: [] },
-        fiatCurrency: { symbol: 'EUR', decimals: 2, denomSymbol: '\u20ac' },
-        cryptoCurrency: { symbol: 'ETH', decimals: 18 },
-        createdAt: 1000,
-        walletAddress: '0xabc',
-        network: '1',
-        excludeFromPurchases: false,
-        orderType: 'BUY',
-        txHash: '0xtxhash',
-      };
-
-      const order = createInitialFiatOrder({
-        ...baseParams,
-        rampsOrder: rampsOrder as never,
-      });
-      expect(order.currency).toBe('EUR');
-      expect(order.currencySymbol).toBe('\u20ac');
-      expect(order.amount).toBe(100);
-      expect(order.txHash).toBe('0xtxhash');
-    });
-
-    it('sets forceUpdate to false for terminal states', () => {
-      const order = createInitialFiatOrder({
-        ...baseParams,
-        rampsOrder: {
-          status: 'COMPLETED',
-          fiatAmount: 100,
-          cryptoAmount: 0.05,
-          totalFeesFiat: 5,
-          createdAt: 1000,
-          walletAddress: '0xabc',
-          network: '1',
-          excludeFromPurchases: false,
-          orderType: 'BUY',
-        } as never,
-      });
-      expect(order.forceUpdate).toBe(false);
-    });
-
-    it('defaults providerType to RAMPS_V2', () => {
-      const order = createInitialFiatOrder(baseParams);
-      expect(order.provider).toBe(FIAT_ORDER_PROVIDERS.RAMPS_V2);
-    });
-  });
 });
diff --git a/app/components/UI/Ramp/Views/Checkout/Checkout.tsx b/app/components/UI/Ramp/Views/Checkout/Checkout.tsx
index 5b3065dfbf3b..fa918b8e227c 100644
--- a/app/components/UI/Ramp/Views/Checkout/Checkout.tsx
+++ b/app/components/UI/Ramp/Views/Checkout/Checkout.tsx
@@ -1,23 +1,19 @@
 import React, { useCallback, useEffect, useRef, useState } from 'react';
-import { useDispatch } from 'react-redux';
+import { useDispatch, useSelector } from 'react-redux';
 import { parseUrl } from 'query-string';
 import { WebView, WebViewNavigation } from '@metamask/react-native-webview';
 import { useNavigation } from '@react-navigation/native';
-import type { RampsOrder } from '@metamask/ramps-controller';
-import { orderStatusToFiatOrderState } from '../../orderProcessor/unifiedOrderProcessor';
+import { useAnalytics } from '../../../../hooks/useAnalytics/useAnalytics';
+import { MetaMetricsEvents } from '../../../../../core/Analytics';
 import { useTheme } from '../../../../../util/theme';
 import { getDepositNavbarOptions } from '../../../Navbar';
 import { callbackBaseUrl } from '../../Aggregator/sdk';
 import {
-  addFiatOrder,
   addFiatCustomIdData,
   removeFiatCustomIdData,
-  FiatOrder,
+  getRampRoutingDecision,
 } from '../../../../../reducers/fiatOrders';
-import {
-  FIAT_ORDER_PROVIDERS,
-  FIAT_ORDER_STATES,
-} from '../../../../../constants/on-ramp';
+import { FIAT_ORDER_PROVIDERS } from '../../../../../constants/on-ramp';
 import { CustomIdData } from '../../../../../reducers/fiatOrders/types';
 import { strings } from '../../../../../../locales/i18n';
 import Routes from '../../../../../constants/navigation/Routes';
@@ -28,16 +24,14 @@ import {
 import ScreenLayout from '../../Aggregator/components/ScreenLayout';
 import ErrorView from '../../Aggregator/components/ErrorView';
 import Logger from '../../../../../util/Logger';
-import Engine from '../../../../../core/Engine';
-import NotificationManager from '../../../../../core/NotificationManager';
-import getNotificationDetails from '../../utils/getNotificationDetails';
-import useThunkDispatch from '../../../../hooks/useThunkDispatch';
-import stateHasOrder from '../../utils/stateHasOrder';
 import { protectWalletModalVisible } from '../../../../../actions/user';
+import { useRampsOrders } from '../../hooks/useRampsOrders';
 import BottomSheet, {
   BottomSheetRef,
 } from '../../../../../component-library/components/BottomSheets/BottomSheet';
 import BottomSheetHeader from '../../../../../component-library/components/BottomSheets/BottomSheetHeader';
+import useRampsUnifiedV2Enabled from '../../hooks/useRampsUnifiedV2Enabled';
+import { showV2OrderToast } from '../../utils/v2OrderToast';
 import ButtonIcon, {
   ButtonIconSizes,
 } from '../../../../../component-library/components/Buttons/ButtonIcon';
@@ -86,128 +80,10 @@ export const createCheckoutNavDetails = createNavigationDetails<CheckoutParams>(
   Routes.RAMP.CHECKOUT,
 );
 
-/**
- * Creates the initial FiatOrder for a V2 order immediately after the provider
- * callback is received.
- *
- * Uses deposit-style ID format (/providers/{code}/orders/{id}) so that
- * extractProviderAndOrderCode in the unified processor can parse it on
- * subsequent polls without relying on data.provider.
- *
- * The V2 API now returns a full provider object (with name and links) and a
- * full fiatCurrency object (with decimals and denomSymbol) in the order
- * response, so we derive everything we can from rampsOrder and use the nav
- * params only as fallbacks for when the order is still UNKNOWN.
- */
-export function createInitialFiatOrder(params: {
-  providerCode: string;
-  providerName: string;
-  orderId: string;
-  walletAddress: string;
-  network: string;
-  currency: string;
-  cryptocurrency: string;
-  rampsOrder?: RampsOrder;
-  providerType?: FIAT_ORDER_PROVIDERS;
-}): FiatOrder {
-  const {
-    providerCode,
-    providerName,
-    orderId,
-    walletAddress,
-    network,
-    currency,
-    cryptocurrency,
-    rampsOrder,
-    providerType = FIAT_ORDER_PROVIDERS.RAMPS_V2,
-  } = params;
-
-  const id = `/providers/${providerCode}/orders/${orderId}`;
-
-  // If we have a full RampsOrder, use it directly
-  if (rampsOrder) {
-    const orderState = orderStatusToFiatOrderState(rampsOrder.status);
-    const isTerminalState =
-      orderState === FIAT_ORDER_STATES.FAILED ||
-      orderState === FIAT_ORDER_STATES.COMPLETED ||
-      orderState === FIAT_ORDER_STATES.CANCELLED;
-
-    return {
-      id,
-      provider: providerType,
-      createdAt: rampsOrder.createdAt,
-      amount: rampsOrder.fiatAmount,
-      fee: rampsOrder.totalFeesFiat,
-      cryptoAmount: rampsOrder.cryptoAmount || 0,
-      cryptoFee: rampsOrder.totalFeesFiat || 0,
-      currency: rampsOrder.fiatCurrency?.symbol || currency,
-      currencySymbol: rampsOrder.fiatCurrency?.denomSymbol || '',
-      cryptocurrency: rampsOrder.cryptoCurrency?.symbol || cryptocurrency,
-      network: rampsOrder.network?.chainId || network,
-      state: orderState,
-      forceUpdate: !isTerminalState,
-      account: walletAddress,
-      txHash: rampsOrder.txHash,
-      excludeFromPurchases: rampsOrder.excludeFromPurchases,
-      orderType: rampsOrder.orderType as FiatOrder['orderType'],
-      errorCount: 0,
-      lastTimeFetched: isTerminalState ? Date.now() : 0,
-      data: rampsOrder,
-    };
-  }
-
-  // Fallback for when rampsOrder is not yet available (UNKNOWN status)
-  return {
-    id,
-    provider: providerType,
-    createdAt: Date.now(),
-    amount: 0,
-    fee: 0,
-    cryptoAmount: 0,
-    cryptoFee: 0,
-    currency,
-    currencySymbol: '',
-    cryptocurrency,
-    network,
-    state: FIAT_ORDER_STATES.PENDING,
-    forceUpdate: true,
-    account: walletAddress,
-    excludeFromPurchases: false,
-    orderType: 'BUY' as FiatOrder['orderType'],
-    errorCount: 0,
-    lastTimeFetched: 0,
-    data: {
-      id,
-      isOnlyLink: false,
-      provider: {
-        id: `/providers/${providerCode}`,
-        name: providerName,
-      },
-      success: false,
-      cryptoAmount: 0,
-      fiatAmount: 0,
-      providerOrderId: orderId,
-      providerOrderLink: '',
-      createdAt: Date.now(),
-      totalFeesFiat: 0,
-      txHash: '',
-      walletAddress,
-      status: 'PENDING',
-      network: { chainId: network, name: '' },
-      canBeUpdated: false,
-      idHasExpired: false,
-      excludeFromPurchases: false,
-      timeDescriptionPending: '',
-      orderType: 'BUY',
-    } as RampsOrder,
-  };
-}
-
 const Checkout = () => {
   const sheetRef = useRef<BottomSheetRef>(null);
   const previousUrlRef = useRef<string | null>(null);
   const dispatch = useDispatch();
-  const dispatchThunk = useThunkDispatch();
   const [error, setError] = useState('');
   const [customIdData, setCustomIdData] = useState<CustomIdData>();
   const isRedirectionHandledRef = useRef(false);
@@ -216,6 +92,10 @@ const Checkout = () => {
   const params = useParams<CheckoutParams>();
   const theme = useTheme();
   const { styles } = useStyles(styleSheet, {});
+  const { addOrder, getOrderFromCallback } = useRampsOrders();
+  const { trackEvent, createEventBuilder } = useAnalytics();
+  const rampRoutingDecision = useSelector(getRampRoutingDecision);
+  const isV2Enabled = useRampsUnifiedV2Enabled();
 
   const {
     url: uri,
@@ -224,10 +104,7 @@ const Checkout = () => {
     customOrderId,
     walletAddress,
     network,
-    currency,
-    cryptocurrency,
     userAgent,
-    providerType,
     onNavigationStateChange,
     callbackKey,
   } = params ?? {};
@@ -253,11 +130,43 @@ const Checkout = () => {
         { title: providerName ?? headerTitle },
         theme,
         () => {
-          // Cancel analytics could go here
+          trackEvent(
+            createEventBuilder(MetaMetricsEvents.RAMPS_BACK_BUTTON_CLICKED)
+              .addProperties({
+                location: 'Checkout',
+                ramp_type: 'UNIFIED_BUY_2',
+                ramp_routing: rampRoutingDecision ?? undefined,
+              })
+              .build(),
+          );
         },
       ),
     );
-  }, [navigation, theme, providerName, headerTitle]);
+  }, [
+    navigation,
+    theme,
+    providerName,
+    headerTitle,
+    createEventBuilder,
+    trackEvent,
+    rampRoutingDecision,
+  ]);
+
+  const hasTrackedScreenViewRef = useRef(false);
+  useEffect(() => {
+    if (uri && !hasTrackedScreenViewRef.current) {
+      hasTrackedScreenViewRef.current = true;
+      trackEvent(
+        createEventBuilder(MetaMetricsEvents.RAMPS_SCREEN_VIEWED)
+          .addProperties({
+            location: 'Checkout',
+            ramp_type: 'UNIFIED_BUY_2',
+            ramp_routing: rampRoutingDecision ?? undefined,
+          })
+          .build(),
+      );
+    }
+  }, [uri, createEventBuilder, trackEvent, rampRoutingDecision]);
 
   useEffect(() => {
     if (!hasCallbackFlow || !customOrderId || !walletAddress || !network) {
@@ -276,44 +185,6 @@ const Checkout = () => {
     dispatch(addFiatCustomIdData(data));
   }, [customOrderId, walletAddress, network, dispatch, hasCallbackFlow]);
 
-  const handleOrderCreated = useCallback(
-    (order: FiatOrder) => {
-      dispatch(protectWalletModalVisible());
-
-      dispatchThunk((_dispatch, getState) => {
-        const state = getState();
-        if (stateHasOrder(state, order)) {
-          return;
-        }
-        _dispatch(addFiatOrder(order));
-        const notificationDetails = getNotificationDetails(order);
-        if (notificationDetails) {
-          NotificationManager.showSimpleNotification(notificationDetails);
-        }
-      });
-
-      if (providerType === FIAT_ORDER_PROVIDERS.RAMPS_V2) {
-        // Use reset() instead of pop() + navigate() to avoid a race condition:
-        // dangerouslyGetParent()?.pop() removes the ramp modal from the stack
-        // before navigate() can push the order details screen, sending the user
-        // to the home screen instead.
-        navigation.reset({
-          index: 0,
-          routes: [
-            {
-              name: Routes.RAMP.RAMPS_ORDER_DETAILS,
-              params: { orderId: order.id, showCloseButton: true },
-            },
-          ],
-        });
-      } else {
-        // @ts-expect-error navigation prop mismatch
-        navigation.dangerouslyGetParent()?.pop();
-      }
-    },
-    [dispatch, dispatchThunk, navigation, providerType],
-  );
-
   const handleNavigationStateChange = useCallback(
     async (navState: WebViewNavigation) => {
       if (
@@ -338,12 +209,11 @@ const Checkout = () => {
           throw new Error('No wallet address or provider code available');
         }
 
-        const rampsOrder =
-          await Engine.context.RampsController.getOrderFromCallback(
-            providerCode,
-            navState.url,
-            walletAddress,
-          );
+        const rampsOrder = await getOrderFromCallback(
+          providerCode,
+          navState.url,
+          walletAddress,
+        );
 
         if (!rampsOrder) {
           throw new Error('Order could not be retrieved from callback');
@@ -353,25 +223,31 @@ const Checkout = () => {
           dispatch(removeFiatCustomIdData(customIdData));
         }
 
-        const orderId =
-          rampsOrder.providerOrderId || rampsOrder.id || customOrderId;
-        if (!orderId) {
-          throw new Error('Order response did not contain an order ID');
+        addOrder(rampsOrder);
+        dispatch(protectWalletModalVisible());
+
+        if (isV2Enabled) {
+          showV2OrderToast({
+            orderId: rampsOrder.providerOrderId,
+            cryptocurrency:
+              rampsOrder.cryptoCurrency?.symbol ?? params?.cryptocurrency ?? '',
+            cryptoAmount: rampsOrder.cryptoAmount,
+            status: rampsOrder.status,
+          });
         }
 
-        const fiatOrder = createInitialFiatOrder({
-          providerCode,
-          providerName: providerName ?? providerCode,
-          orderId,
-          walletAddress,
-          network: network ?? '',
-          currency: currency ?? '',
-          cryptocurrency: cryptocurrency ?? '',
-          rampsOrder,
-          providerType,
+        navigation.reset({
+          index: 0,
+          routes: [
+            {
+              name: Routes.RAMP.RAMPS_ORDER_DETAILS,
+              params: {
+                orderId: rampsOrder.providerOrderId,
+                showCloseButton: true,
+              },
+            },
+          ],
         });
-
-        handleOrderCreated(fiatOrder);
       } catch (navError) {
         Logger.error(navError as Error, {
           message: 'UnifiedCheckout: error handling callback',
@@ -381,24 +257,29 @@ const Checkout = () => {
     },
     [
       hasCallbackFlow,
-      customOrderId,
       customIdData,
       providerCode,
-      providerName,
-      providerType,
       walletAddress,
-      network,
-      currency,
-      cryptocurrency,
       navigation,
       dispatch,
-      handleOrderCreated,
+      addOrder,
+      getOrderFromCallback,
+      isV2Enabled,
+      params?.cryptocurrency,
     ],
   );
 
   const handleCancelPress = useCallback(() => {
-    // TODO: Add analytics tracking when analytics events are defined for unified flow
-  }, []);
+    trackEvent(
+      createEventBuilder(MetaMetricsEvents.RAMPS_CLOSE_BUTTON_CLICKED)
+        .addProperties({
+          location: 'Checkout',
+          ramp_type: 'UNIFIED_BUY_2',
+          ramp_routing: rampRoutingDecision ?? undefined,
+        })
+        .build(),
+    );
+  }, [createEventBuilder, trackEvent, rampRoutingDecision]);
   const handleClosePress = useCallback(() => {
     handleCancelPress();
     sheetRef.current?.onCloseBottomSheet();
diff --git a/app/components/UI/Ramp/Views/Checkout/__snapshots__/Checkout.test.tsx.snap b/app/components/UI/Ramp/Views/Checkout/__snapshots__/Checkout.test.tsx.snap
index a6be1636969e..bcb33d8ac79a 100644
--- a/app/components/UI/Ramp/Views/Checkout/__snapshots__/Checkout.test.tsx.snap
+++ b/app/components/UI/Ramp/Views/Checkout/__snapshots__/Checkout.test.tsx.snap
@@ -334,7 +334,7 @@ exports[`Checkout renders error view when no URL is provided 1`] = `
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -384,7 +384,7 @@ exports[`Checkout renders error view when no URL is provided 1`] = `
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -422,7 +422,7 @@ exports[`Checkout renders error view when no URL is provided 1`] = `
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -472,7 +472,7 @@ exports[`Checkout renders error view when no URL is provided 1`] = `
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 16,
                                       "fontWeight": 700,
@@ -513,7 +513,7 @@ exports[`Checkout renders error view when no URL is provided 1`] = `
                                   testID="checkout-close-button"
                                 >
                                   <SvgMock
-                                    color="#121314"
+                                    color="#131416"
                                     fill="currentColor"
                                     height={24}
                                     name="Close"
@@ -633,7 +633,7 @@ exports[`Checkout renders error view when no URL is provided 1`] = `
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 18,
                                             "letterSpacing": 0,
@@ -657,7 +657,7 @@ exports[`Checkout renders error view when no URL is provided 1`] = `
                                         style={
                                           [
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 30,
                                               "marginVertical": 2,
@@ -671,7 +671,7 @@ exports[`Checkout renders error view when no URL is provided 1`] = `
                                             undefined,
                                             undefined,
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                             },
                                             undefined,
                                             undefined,
@@ -1050,7 +1050,7 @@ exports[`Checkout sets and displays error on http error for callback URL 1`] = `
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -1100,7 +1100,7 @@ exports[`Checkout sets and displays error on http error for callback URL 1`] = `
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -1138,7 +1138,7 @@ exports[`Checkout sets and displays error on http error for callback URL 1`] = `
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -1188,7 +1188,7 @@ exports[`Checkout sets and displays error on http error for callback URL 1`] = `
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 16,
                                       "fontWeight": 700,
@@ -1229,7 +1229,7 @@ exports[`Checkout sets and displays error on http error for callback URL 1`] = `
                                   testID="checkout-close-button"
                                 >
                                   <SvgMock
-                                    color="#121314"
+                                    color="#131416"
                                     fill="currentColor"
                                     height={24}
                                     name="Close"
@@ -1349,7 +1349,7 @@ exports[`Checkout sets and displays error on http error for callback URL 1`] = `
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Bold",
                                             "fontSize": 18,
                                             "letterSpacing": 0,
@@ -1373,7 +1373,7 @@ exports[`Checkout sets and displays error on http error for callback URL 1`] = `
                                         style={
                                           [
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 30,
                                               "marginVertical": 2,
@@ -1387,7 +1387,7 @@ exports[`Checkout sets and displays error on http error for callback URL 1`] = `
                                             undefined,
                                             undefined,
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                             },
                                             undefined,
                                             undefined,
@@ -1430,7 +1430,7 @@ exports[`Checkout sets and displays error on http error for callback URL 1`] = `
                                           {
                                             "alignItems": "center",
                                             "alignSelf": "stretch",
-                                            "backgroundColor": "#121314",
+                                            "backgroundColor": "#131416",
                                             "borderRadius": 12,
                                             "flexDirection": "row",
                                             "height": 48,
diff --git a/app/components/UI/Ramp/Views/Modals/ErrorDetailsModal/ErrorDetailsModal.styles.ts b/app/components/UI/Ramp/Views/Modals/ErrorDetailsModal/ErrorDetailsModal.styles.ts
new file mode 100644
index 000000000000..9908396192aa
--- /dev/null
+++ b/app/components/UI/Ramp/Views/Modals/ErrorDetailsModal/ErrorDetailsModal.styles.ts
@@ -0,0 +1,42 @@
+import { Theme } from '@metamask/design-tokens';
+import { StyleSheet } from 'react-native';
+
+interface ErrorDetailsModalStyleSheetVars {
+  screenHeight: number;
+}
+
+const styleSheet = (params: {
+  theme: Theme;
+  vars: ErrorDetailsModalStyleSheetVars;
+}) => {
+  const { vars } = params;
+  const { screenHeight } = vars;
+
+  return StyleSheet.create({
+    headerContainer: {
+      flexDirection: 'row',
+      alignItems: 'center',
+      gap: 8,
+    },
+    scrollView: {
+      maxHeight: screenHeight * 0.6,
+    },
+    contentContainer: {
+      paddingHorizontal: 16,
+      paddingBottom: 16,
+    },
+    errorText: {
+      lineHeight: 24,
+    },
+    buttonContainer: {
+      paddingHorizontal: 16,
+      paddingBottom: 16,
+      gap: 8,
+    },
+    button: {
+      width: '100%',
+    },
+  });
+};
+
+export default styleSheet;
diff --git a/app/components/UI/Ramp/Views/Modals/ErrorDetailsModal/ErrorDetailsModal.test.tsx b/app/components/UI/Ramp/Views/Modals/ErrorDetailsModal/ErrorDetailsModal.test.tsx
new file mode 100644
index 000000000000..ed17a480df02
--- /dev/null
+++ b/app/components/UI/Ramp/Views/Modals/ErrorDetailsModal/ErrorDetailsModal.test.tsx
@@ -0,0 +1,209 @@
+import React from 'react';
+import { fireEvent, waitFor } from '@testing-library/react-native';
+import InAppBrowser from 'react-native-inappbrowser-reborn';
+import { renderScreen } from '../../../../../../util/test/renderWithProvider';
+import Routes from '../../../../../../constants/navigation/Routes';
+import ErrorDetailsModal from './ErrorDetailsModal';
+
+const mockOnCloseBottomSheet = jest.fn((callback?: () => void) => {
+  callback?.();
+});
+const mockReplace = jest.fn();
+const mockNavigate = jest.fn();
+
+jest.mock('@react-navigation/native', () => ({
+  ...jest.requireActual('@react-navigation/native'),
+  useNavigation: () => ({
+    replace: mockReplace,
+    navigate: mockNavigate,
+  }),
+}));
+
+jest.mock('react-native-inappbrowser-reborn', () => ({
+  isAvailable: jest.fn(),
+  open: jest.fn(),
+}));
+
+jest.mock(
+  '../../../../../../component-library/components/BottomSheets/BottomSheet',
+  () => {
+    const ReactActual = jest.requireActual('react');
+    return ReactActual.forwardRef(
+      (
+        { children }: { children: React.ReactNode },
+        ref: React.Ref<{ onCloseBottomSheet: () => void }>,
+      ) => {
+        ReactActual.useImperativeHandle(ref, () => ({
+          onCloseBottomSheet: mockOnCloseBottomSheet,
+        }));
+        return <>{children}</>;
+      },
+    );
+  },
+);
+
+const mockUseParams = jest.fn();
+jest.mock('../../../../../../util/navigation/navUtils', () => ({
+  createNavigationDetails: jest.fn(),
+  useParams: () => mockUseParams(),
+}));
+
+function renderWithProvider(component: React.ComponentType) {
+  return renderScreen(component, {
+    name: 'ErrorDetailsModal',
+  });
+}
+
+describe('ErrorDetailsModal', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+    mockUseParams.mockReturnValue({
+      errorMessage: 'This is a test error message.',
+    });
+  });
+
+  it('renders correctly and matches snapshot', () => {
+    const { toJSON } = renderWithProvider(ErrorDetailsModal);
+    expect(toJSON()).toMatchSnapshot();
+  });
+
+  it('renders with a multiline error message', () => {
+    mockUseParams.mockReturnValue({
+      errorMessage:
+        'Error on line 1.\nError on line 2.\nAdditional context for debugging.',
+    });
+
+    const { toJSON } = renderWithProvider(ErrorDetailsModal);
+    expect(toJSON()).toMatchSnapshot();
+  });
+
+  it('renders with an empty error message', () => {
+    mockUseParams.mockReturnValue({
+      errorMessage: '',
+    });
+
+    const { toJSON } = renderWithProvider(ErrorDetailsModal);
+    expect(toJSON()).toMatchSnapshot();
+  });
+
+  it('renders with provider support info and matches snapshot', () => {
+    mockUseParams.mockReturnValue({
+      errorMessage: 'Provider error occurred.',
+      providerName: 'Transak',
+      providerSupportUrl: 'https://support.transak.com',
+    });
+
+    const { toJSON } = renderWithProvider(ErrorDetailsModal);
+    expect(toJSON()).toMatchSnapshot();
+  });
+
+  it('closes the modal when the close button is pressed', () => {
+    const { getByTestId } = renderWithProvider(ErrorDetailsModal);
+    const closeButton = getByTestId('error-details-close-button');
+
+    fireEvent.press(closeButton);
+
+    expect(mockOnCloseBottomSheet).toHaveBeenCalledTimes(1);
+  });
+
+  it('closes the modal when Got it button is pressed', () => {
+    const { getByText } = renderWithProvider(ErrorDetailsModal);
+
+    fireEvent.press(getByText('Got it'));
+
+    expect(mockOnCloseBottomSheet).toHaveBeenCalledTimes(1);
+  });
+
+  it('opens support URL in InAppBrowser when available', async () => {
+    (InAppBrowser.isAvailable as jest.Mock).mockResolvedValue(true);
+
+    mockUseParams.mockReturnValue({
+      errorMessage: 'Provider error occurred.',
+      providerName: 'Transak',
+      providerSupportUrl: 'https://support.transak.com',
+    });
+
+    const { getByText } = renderWithProvider(ErrorDetailsModal);
+
+    fireEvent.press(getByText('Contact Transak support'));
+
+    await waitFor(() => {
+      expect(InAppBrowser.open).toHaveBeenCalledWith(
+        'https://support.transak.com',
+      );
+    });
+    expect(mockOnCloseBottomSheet).toHaveBeenCalledTimes(1);
+  });
+
+  it('falls back to SimpleWebview when InAppBrowser is not available', async () => {
+    (InAppBrowser.isAvailable as jest.Mock).mockResolvedValue(false);
+
+    mockUseParams.mockReturnValue({
+      errorMessage: 'Provider error occurred.',
+      providerName: 'Transak',
+      providerSupportUrl: 'https://support.transak.com',
+    });
+
+    const { getByText } = renderWithProvider(ErrorDetailsModal);
+
+    fireEvent.press(getByText('Contact Transak support'));
+
+    await waitFor(() => {
+      expect(mockNavigate).toHaveBeenCalledWith('Webview', {
+        screen: 'SimpleWebview',
+        params: {
+          url: 'https://support.transak.com',
+          title: 'Transak',
+        },
+      });
+    });
+    expect(mockOnCloseBottomSheet).toHaveBeenCalledTimes(1);
+  });
+
+  it('does not render contact support button when provider info is missing', () => {
+    const { queryByText } = renderWithProvider(ErrorDetailsModal);
+
+    expect(queryByText(/Contact.*support/u)).toBeNull();
+  });
+
+  it('renders with change provider button and matches snapshot', () => {
+    mockUseParams.mockReturnValue({
+      errorMessage: 'No quotes available.',
+      showChangeProvider: true,
+    });
+
+    const { toJSON } = renderWithProvider(ErrorDetailsModal);
+    expect(toJSON()).toMatchSnapshot();
+  });
+
+  it('navigates to provider selection when Change provider is pressed', () => {
+    mockUseParams.mockReturnValue({
+      errorMessage: 'No quotes available.',
+      showChangeProvider: true,
+      amount: 250,
+    });
+
+    const { getByText } = renderWithProvider(ErrorDetailsModal);
+
+    fireEvent.press(getByText('Change provider'));
+
+    expect(mockReplace).toHaveBeenCalledWith(
+      Routes.RAMP.MODALS.PROVIDER_SELECTION,
+      { amount: 250 },
+    );
+  });
+
+  it('shows change provider instead of contact support when both flags are set', () => {
+    mockUseParams.mockReturnValue({
+      errorMessage: 'Error.',
+      providerName: 'Transak',
+      providerSupportUrl: 'https://support.transak.com',
+      showChangeProvider: true,
+    });
+
+    const { getByText, queryByText } = renderWithProvider(ErrorDetailsModal);
+
+    expect(getByText('Change provider')).toBeOnTheScreen();
+    expect(queryByText(/Contact.*support/u)).toBeNull();
+  });
+});
diff --git a/app/components/UI/Ramp/Views/Modals/ErrorDetailsModal/ErrorDetailsModal.tsx b/app/components/UI/Ramp/Views/Modals/ErrorDetailsModal/ErrorDetailsModal.tsx
new file mode 100644
index 000000000000..f6e520a6eb82
--- /dev/null
+++ b/app/components/UI/Ramp/Views/Modals/ErrorDetailsModal/ErrorDetailsModal.tsx
@@ -0,0 +1,158 @@
+import React, { useCallback, useRef } from 'react';
+import { View, ScrollView, useWindowDimensions } from 'react-native';
+import InAppBrowser from 'react-native-inappbrowser-reborn';
+import { useNavigation, type ParamListBase } from '@react-navigation/native';
+import type { StackNavigationProp } from '@react-navigation/stack';
+import Text, {
+  TextVariant,
+  TextColor,
+} from '../../../../../../component-library/components/Texts/Text';
+import BottomSheet, {
+  BottomSheetRef,
+} from '../../../../../../component-library/components/BottomSheets/BottomSheet';
+import BottomSheetHeader from '../../../../../../component-library/components/BottomSheets/BottomSheetHeader';
+import Icon, {
+  IconName,
+  IconSize,
+  IconColor,
+} from '../../../../../../component-library/components/Icons/Icon';
+import Button, {
+  ButtonSize,
+  ButtonVariants,
+} from '../../../../../../component-library/components/Buttons/Button';
+import { useStyles } from '../../../../../../component-library/hooks';
+import {
+  createNavigationDetails,
+  useParams,
+} from '../../../../../../util/navigation/navUtils';
+import Routes from '../../../../../../constants/navigation/Routes';
+import { strings } from '../../../../../../../locales/i18n';
+import Logger from '../../../../../../util/Logger';
+import styleSheet from './ErrorDetailsModal.styles';
+
+export interface ErrorDetailsModalParams {
+  errorMessage: string;
+  providerName?: string;
+  providerSupportUrl?: string;
+  showChangeProvider?: boolean;
+  amount?: number;
+}
+
+export const createErrorDetailsModalNavDetails =
+  createNavigationDetails<ErrorDetailsModalParams>(
+    Routes.RAMP.MODALS.ID,
+    Routes.RAMP.MODALS.ERROR_DETAILS,
+  );
+
+function ErrorDetailsModal() {
+  const sheetRef = useRef<BottomSheetRef>(null);
+  const navigation = useNavigation<StackNavigationProp<ParamListBase>>();
+  const { height: screenHeight } = useWindowDimensions();
+  const { styles } = useStyles(styleSheet, {
+    screenHeight,
+  });
+
+  const {
+    errorMessage,
+    providerName,
+    providerSupportUrl,
+    showChangeProvider,
+    amount,
+  } = useParams<ErrorDetailsModalParams>();
+
+  const handleClose = useCallback(() => {
+    sheetRef.current?.onCloseBottomSheet();
+  }, []);
+
+  const handleContactSupport = useCallback(async () => {
+    if (!providerSupportUrl) return;
+    try {
+      if (await InAppBrowser.isAvailable()) {
+        handleClose();
+        await InAppBrowser.open(providerSupportUrl);
+      } else {
+        handleClose();
+        navigation.navigate('Webview', {
+          screen: 'SimpleWebview',
+          params: {
+            url: providerSupportUrl,
+            title: providerName,
+          },
+        });
+      }
+    } catch (error) {
+      Logger.error(
+        error as Error,
+        'ErrorDetailsModal: Failed to open support URL',
+      );
+    }
+  }, [providerSupportUrl, providerName, handleClose, navigation]);
+
+  const handleChangeProvider = useCallback(() => {
+    navigation.replace(Routes.RAMP.MODALS.PROVIDER_SELECTION, { amount });
+  }, [navigation, amount]);
+
+  return (
+    <BottomSheet ref={sheetRef} shouldNavigateBack>
+      <BottomSheetHeader
+        onClose={handleClose}
+        closeButtonProps={{ testID: 'error-details-close-button' }}
+      >
+        <View style={styles.headerContainer}>
+          <Icon
+            name={IconName.Danger}
+            size={IconSize.Md}
+            color={IconColor.Error}
+          />
+          <Text variant={TextVariant.HeadingMD}>
+            {strings('deposit.errors.error_details_title')}
+          </Text>
+        </View>
+      </BottomSheetHeader>
+
+      <ScrollView style={styles.scrollView}>
+        <View style={styles.contentContainer}>
+          <Text
+            variant={TextVariant.BodyMD}
+            color={TextColor.Default}
+            style={styles.errorText}
+          >
+            {errorMessage}
+          </Text>
+        </View>
+      </ScrollView>
+
+      <View style={styles.buttonContainer}>
+        {showChangeProvider ? (
+          <Button
+            variant={ButtonVariants.Secondary}
+            size={ButtonSize.Lg}
+            onPress={handleChangeProvider}
+            label={strings('fiat_on_ramp.change_provider_button')}
+            style={styles.button}
+          />
+        ) : null}
+        {!showChangeProvider && providerName && providerSupportUrl ? (
+          <Button
+            variant={ButtonVariants.Secondary}
+            size={ButtonSize.Lg}
+            onPress={handleContactSupport}
+            label={strings('fiat_on_ramp.contact_provider_support', {
+              provider: providerName,
+            })}
+            style={styles.button}
+          />
+        ) : null}
+        <Button
+          variant={ButtonVariants.Primary}
+          size={ButtonSize.Lg}
+          onPress={handleClose}
+          label={strings('fiat_on_ramp.got_it')}
+          style={styles.button}
+        />
+      </View>
+    </BottomSheet>
+  );
+}
+
+export default ErrorDetailsModal;
diff --git a/app/components/UI/Ramp/Views/Modals/ErrorDetailsModal/__snapshots__/ErrorDetailsModal.test.tsx.snap b/app/components/UI/Ramp/Views/Modals/ErrorDetailsModal/__snapshots__/ErrorDetailsModal.test.tsx.snap
new file mode 100644
index 000000000000..0e93d9d6a1c0
--- /dev/null
+++ b/app/components/UI/Ramp/Views/Modals/ErrorDetailsModal/__snapshots__/ErrorDetailsModal.test.tsx.snap
@@ -0,0 +1,2669 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`ErrorDetailsModal renders correctly and matches snapshot 1`] = `
+<View
+  style={
+    {
+      "flex": 1,
+    }
+  }
+>
+  <RNCSafeAreaProvider
+    onInsetsChange={[Function]}
+    style={
+      [
+        {
+          "flex": 1,
+        },
+        undefined,
+      ]
+    }
+  >
+    <View
+      collapsable={false}
+      pointerEvents="box-none"
+      style={
+        {
+          "zIndex": 1,
+        }
+      }
+    >
+      <View
+        accessibilityElementsHidden={false}
+        importantForAccessibility="auto"
+        onLayout={[Function]}
+        pointerEvents="box-none"
+        style={null}
+      >
+        <View
+          collapsable={false}
+          pointerEvents="box-none"
+          style={
+            {
+              "bottom": 0,
+              "left": 0,
+              "opacity": 1,
+              "position": "absolute",
+              "right": 0,
+              "top": 0,
+              "zIndex": 0,
+            }
+          }
+        >
+          <View
+            collapsable={false}
+            style={
+              {
+                "backgroundColor": "rgb(255, 255, 255)",
+                "borderBottomColor": "rgb(216, 216, 216)",
+                "flex": 1,
+                "shadowColor": "rgb(216, 216, 216)",
+                "shadowOffset": {
+                  "height": 0.5,
+                  "width": 0,
+                },
+                "shadowOpacity": 0.85,
+                "shadowRadius": 0,
+              }
+            }
+          />
+        </View>
+        <View
+          collapsable={false}
+          pointerEvents="box-none"
+          style={
+            {
+              "height": 64,
+              "maxHeight": undefined,
+              "minHeight": undefined,
+              "opacity": undefined,
+              "transform": undefined,
+            }
+          }
+        >
+          <View
+            pointerEvents="none"
+            style={
+              {
+                "height": 20,
+              }
+            }
+          />
+          <View
+            pointerEvents="box-none"
+            style={
+              {
+                "alignItems": "center",
+                "flex": 1,
+                "flexDirection": "row",
+                "justifyContent": "center",
+              }
+            }
+          >
+            <View
+              collapsable={false}
+              pointerEvents="box-none"
+              style={
+                {
+                  "marginHorizontal": 16,
+                  "opacity": 1,
+                }
+              }
+            >
+              <Text
+                accessibilityRole="header"
+                aria-level="1"
+                collapsable={false}
+                numberOfLines={1}
+                onLayout={[Function]}
+                style={
+                  {
+                    "color": "rgb(28, 28, 30)",
+                    "fontSize": 17,
+                    "fontWeight": "600",
+                  }
+                }
+              >
+                ErrorDetailsModal
+              </Text>
+            </View>
+          </View>
+        </View>
+      </View>
+    </View>
+    <RNSScreenContainer
+      onLayout={[Function]}
+      style={
+        {
+          "flex": 1,
+        }
+      }
+    >
+      <RNSScreen
+        activityState={2}
+        collapsable={false}
+        gestureResponseDistance={
+          {
+            "bottom": -1,
+            "end": -1,
+            "start": -1,
+            "top": -1,
+          }
+        }
+        onGestureCancel={[Function]}
+        pointerEvents="box-none"
+        sheetAllowedDetents="large"
+        sheetCornerRadius={-1}
+        sheetExpandsWhenScrolledToEdge={true}
+        sheetGrabberVisible={false}
+        sheetLargestUndimmedDetent="all"
+        style={
+          {
+            "bottom": 0,
+            "left": 0,
+            "position": "absolute",
+            "right": 0,
+            "top": 0,
+            "zIndex": undefined,
+          }
+        }
+      >
+        <View
+          collapsable={false}
+          style={
+            {
+              "opacity": 1,
+            }
+          }
+        />
+        <View
+          accessibilityElementsHidden={false}
+          closing={false}
+          gestureVelocityImpact={0.3}
+          importantForAccessibility="auto"
+          onClose={[Function]}
+          onGestureBegin={[Function]}
+          onGestureCanceled={[Function]}
+          onGestureEnd={[Function]}
+          onOpen={[Function]}
+          onTransition={[Function]}
+          pointerEvents="box-none"
+          style={
+            [
+              {
+                "overflow": undefined,
+              },
+              {
+                "bottom": 0,
+                "left": 0,
+                "position": "absolute",
+                "right": 0,
+                "top": 0,
+              },
+            ]
+          }
+          transitionSpec={
+            {
+              "close": {
+                "animation": "spring",
+                "config": {
+                  "damping": 500,
+                  "mass": 3,
+                  "overshootClamping": true,
+                  "restDisplacementThreshold": 10,
+                  "restSpeedThreshold": 10,
+                  "stiffness": 1000,
+                },
+              },
+              "open": {
+                "animation": "spring",
+                "config": {
+                  "damping": 500,
+                  "mass": 3,
+                  "overshootClamping": true,
+                  "restDisplacementThreshold": 10,
+                  "restSpeedThreshold": 10,
+                  "stiffness": 1000,
+                },
+              },
+            }
+          }
+        >
+          <View
+            collapsable={false}
+            needsOffscreenAlphaCompositing={false}
+            pointerEvents="box-none"
+            style={
+              {
+                "flex": 1,
+              }
+            }
+          >
+            <View
+              collapsable={false}
+              enabled={false}
+              handlerTag={-1}
+              handlerType="PanGestureHandler"
+              onGestureHandlerEvent={[Function]}
+              onGestureHandlerStateChange={[Function]}
+              style={
+                {
+                  "flex": 1,
+                  "transform": [
+                    {
+                      "translateX": 0,
+                    },
+                    {
+                      "translateX": 0,
+                    },
+                  ],
+                }
+              }
+            >
+              <View
+                collapsable={false}
+                pointerEvents="none"
+                style={
+                  {
+                    "backgroundColor": "rgb(242, 242, 242)",
+                    "bottom": 0,
+                    "left": 0,
+                    "position": "absolute",
+                    "shadowColor": "#000",
+                    "shadowOffset": {
+                      "height": 1,
+                      "width": -1,
+                    },
+                    "shadowOpacity": 0.3,
+                    "shadowRadius": 5,
+                    "top": 0,
+                    "width": 3,
+                  }
+                }
+              />
+              <View
+                style={
+                  [
+                    {
+                      "flex": 1,
+                      "overflow": "hidden",
+                    },
+                    [
+                      {
+                        "backgroundColor": "rgb(242, 242, 242)",
+                      },
+                      undefined,
+                    ],
+                  ]
+                }
+              >
+                <View
+                  style={
+                    {
+                      "flex": 1,
+                      "flexDirection": "column-reverse",
+                    }
+                  }
+                >
+                  <View
+                    style={
+                      {
+                        "flex": 1,
+                      }
+                    }
+                  >
+                    <View
+                      style={
+                        [
+                          {
+                            "alignItems": "center",
+                            "flexDirection": "row",
+                            "gap": 16,
+                            "minHeight": 56,
+                          },
+                          false,
+                          {
+                            "paddingHorizontal": 16,
+                          },
+                        ]
+                      }
+                      testID="header"
+                    >
+                      <View>
+                        <View
+                          onLayout={[Function]}
+                        />
+                      </View>
+                      <View
+                        style={
+                          [
+                            {
+                              "alignItems": "center",
+                              "display": "flex",
+                              "flexBasis": "0%",
+                              "flexGrow": 1,
+                              "flexShrink": 1,
+                            },
+                            undefined,
+                          ]
+                        }
+                      >
+                        <View
+                          style={
+                            {
+                              "alignItems": "center",
+                              "flexDirection": "row",
+                              "gap": 8,
+                            }
+                          }
+                        >
+                          <SvgMock
+                            color="#ca3542"
+                            fill="currentColor"
+                            height={20}
+                            name="Danger"
+                            style={
+                              {
+                                "height": 20,
+                                "width": 20,
+                              }
+                            }
+                            width={20}
+                          />
+                          <Text
+                            accessibilityRole="text"
+                            style={
+                              {
+                                "color": "#131416",
+                                "fontFamily": "Geist-Bold",
+                                "fontSize": 20,
+                                "letterSpacing": 0,
+                                "lineHeight": 24,
+                              }
+                            }
+                          >
+                            Error details
+                          </Text>
+                        </View>
+                      </View>
+                      <View>
+                        <View
+                          onLayout={[Function]}
+                        >
+                          <TouchableOpacity
+                            accessible={true}
+                            activeOpacity={1}
+                            disabled={false}
+                            onPress={[Function]}
+                            onPressIn={[Function]}
+                            onPressOut={[Function]}
+                            style={
+                              {
+                                "alignItems": "center",
+                                "borderRadius": 8,
+                                "height": 32,
+                                "justifyContent": "center",
+                                "opacity": 1,
+                                "width": 32,
+                              }
+                            }
+                            testID="error-details-close-button"
+                          >
+                            <SvgMock
+                              color="#131416"
+                              fill="currentColor"
+                              height={24}
+                              name="Close"
+                              style={
+                                {
+                                  "height": 24,
+                                  "width": 24,
+                                }
+                              }
+                              width={24}
+                            />
+                          </TouchableOpacity>
+                        </View>
+                      </View>
+                    </View>
+                    <RCTScrollView
+                      style={
+                        {
+                          "maxHeight": 800.4,
+                        }
+                      }
+                    >
+                      <View>
+                        <View
+                          style={
+                            {
+                              "paddingBottom": 16,
+                              "paddingHorizontal": 16,
+                            }
+                          }
+                        >
+                          <Text
+                            accessibilityRole="text"
+                            style={
+                              {
+                                "color": "#131416",
+                                "fontFamily": "Geist-Regular",
+                                "fontSize": 16,
+                                "letterSpacing": 0,
+                                "lineHeight": 24,
+                              }
+                            }
+                          >
+                            This is a test error message.
+                          </Text>
+                        </View>
+                      </View>
+                    </RCTScrollView>
+                    <View
+                      style={
+                        {
+                          "gap": 8,
+                          "paddingBottom": 16,
+                          "paddingHorizontal": 16,
+                        }
+                      }
+                    >
+                      <TouchableOpacity
+                        accessibilityRole="button"
+                        accessible={true}
+                        activeOpacity={1}
+                        onPress={[Function]}
+                        onPressIn={[Function]}
+                        onPressOut={[Function]}
+                        style={
+                          {
+                            "alignItems": "center",
+                            "alignSelf": "flex-start",
+                            "backgroundColor": "#131416",
+                            "borderRadius": 12,
+                            "flexDirection": "row",
+                            "height": 48,
+                            "justifyContent": "center",
+                            "overflow": "hidden",
+                            "paddingHorizontal": 16,
+                            "width": "100%",
+                          }
+                        }
+                      >
+                        <Text
+                          accessibilityRole="text"
+                          style={
+                            {
+                              "color": "#ffffff",
+                              "fontFamily": "Geist-Medium",
+                              "fontSize": 16,
+                              "letterSpacing": 0,
+                              "lineHeight": 24,
+                            }
+                          }
+                        >
+                          Got it
+                        </Text>
+                      </TouchableOpacity>
+                    </View>
+                  </View>
+                </View>
+              </View>
+            </View>
+          </View>
+        </View>
+      </RNSScreen>
+    </RNSScreenContainer>
+  </RNCSafeAreaProvider>
+</View>
+`;
+
+exports[`ErrorDetailsModal renders with a multiline error message 1`] = `
+<View
+  style={
+    {
+      "flex": 1,
+    }
+  }
+>
+  <RNCSafeAreaProvider
+    onInsetsChange={[Function]}
+    style={
+      [
+        {
+          "flex": 1,
+        },
+        undefined,
+      ]
+    }
+  >
+    <View
+      collapsable={false}
+      pointerEvents="box-none"
+      style={
+        {
+          "zIndex": 1,
+        }
+      }
+    >
+      <View
+        accessibilityElementsHidden={false}
+        importantForAccessibility="auto"
+        onLayout={[Function]}
+        pointerEvents="box-none"
+        style={null}
+      >
+        <View
+          collapsable={false}
+          pointerEvents="box-none"
+          style={
+            {
+              "bottom": 0,
+              "left": 0,
+              "opacity": 1,
+              "position": "absolute",
+              "right": 0,
+              "top": 0,
+              "zIndex": 0,
+            }
+          }
+        >
+          <View
+            collapsable={false}
+            style={
+              {
+                "backgroundColor": "rgb(255, 255, 255)",
+                "borderBottomColor": "rgb(216, 216, 216)",
+                "flex": 1,
+                "shadowColor": "rgb(216, 216, 216)",
+                "shadowOffset": {
+                  "height": 0.5,
+                  "width": 0,
+                },
+                "shadowOpacity": 0.85,
+                "shadowRadius": 0,
+              }
+            }
+          />
+        </View>
+        <View
+          collapsable={false}
+          pointerEvents="box-none"
+          style={
+            {
+              "height": 64,
+              "maxHeight": undefined,
+              "minHeight": undefined,
+              "opacity": undefined,
+              "transform": undefined,
+            }
+          }
+        >
+          <View
+            pointerEvents="none"
+            style={
+              {
+                "height": 20,
+              }
+            }
+          />
+          <View
+            pointerEvents="box-none"
+            style={
+              {
+                "alignItems": "center",
+                "flex": 1,
+                "flexDirection": "row",
+                "justifyContent": "center",
+              }
+            }
+          >
+            <View
+              collapsable={false}
+              pointerEvents="box-none"
+              style={
+                {
+                  "marginHorizontal": 16,
+                  "opacity": 1,
+                }
+              }
+            >
+              <Text
+                accessibilityRole="header"
+                aria-level="1"
+                collapsable={false}
+                numberOfLines={1}
+                onLayout={[Function]}
+                style={
+                  {
+                    "color": "rgb(28, 28, 30)",
+                    "fontSize": 17,
+                    "fontWeight": "600",
+                  }
+                }
+              >
+                ErrorDetailsModal
+              </Text>
+            </View>
+          </View>
+        </View>
+      </View>
+    </View>
+    <RNSScreenContainer
+      onLayout={[Function]}
+      style={
+        {
+          "flex": 1,
+        }
+      }
+    >
+      <RNSScreen
+        activityState={2}
+        collapsable={false}
+        gestureResponseDistance={
+          {
+            "bottom": -1,
+            "end": -1,
+            "start": -1,
+            "top": -1,
+          }
+        }
+        onGestureCancel={[Function]}
+        pointerEvents="box-none"
+        sheetAllowedDetents="large"
+        sheetCornerRadius={-1}
+        sheetExpandsWhenScrolledToEdge={true}
+        sheetGrabberVisible={false}
+        sheetLargestUndimmedDetent="all"
+        style={
+          {
+            "bottom": 0,
+            "left": 0,
+            "position": "absolute",
+            "right": 0,
+            "top": 0,
+            "zIndex": undefined,
+          }
+        }
+      >
+        <View
+          collapsable={false}
+          style={
+            {
+              "opacity": 1,
+            }
+          }
+        />
+        <View
+          accessibilityElementsHidden={false}
+          closing={false}
+          gestureVelocityImpact={0.3}
+          importantForAccessibility="auto"
+          onClose={[Function]}
+          onGestureBegin={[Function]}
+          onGestureCanceled={[Function]}
+          onGestureEnd={[Function]}
+          onOpen={[Function]}
+          onTransition={[Function]}
+          pointerEvents="box-none"
+          style={
+            [
+              {
+                "overflow": undefined,
+              },
+              {
+                "bottom": 0,
+                "left": 0,
+                "position": "absolute",
+                "right": 0,
+                "top": 0,
+              },
+            ]
+          }
+          transitionSpec={
+            {
+              "close": {
+                "animation": "spring",
+                "config": {
+                  "damping": 500,
+                  "mass": 3,
+                  "overshootClamping": true,
+                  "restDisplacementThreshold": 10,
+                  "restSpeedThreshold": 10,
+                  "stiffness": 1000,
+                },
+              },
+              "open": {
+                "animation": "spring",
+                "config": {
+                  "damping": 500,
+                  "mass": 3,
+                  "overshootClamping": true,
+                  "restDisplacementThreshold": 10,
+                  "restSpeedThreshold": 10,
+                  "stiffness": 1000,
+                },
+              },
+            }
+          }
+        >
+          <View
+            collapsable={false}
+            needsOffscreenAlphaCompositing={false}
+            pointerEvents="box-none"
+            style={
+              {
+                "flex": 1,
+              }
+            }
+          >
+            <View
+              collapsable={false}
+              enabled={false}
+              handlerTag={-1}
+              handlerType="PanGestureHandler"
+              onGestureHandlerEvent={[Function]}
+              onGestureHandlerStateChange={[Function]}
+              style={
+                {
+                  "flex": 1,
+                  "transform": [
+                    {
+                      "translateX": 0,
+                    },
+                    {
+                      "translateX": 0,
+                    },
+                  ],
+                }
+              }
+            >
+              <View
+                collapsable={false}
+                pointerEvents="none"
+                style={
+                  {
+                    "backgroundColor": "rgb(242, 242, 242)",
+                    "bottom": 0,
+                    "left": 0,
+                    "position": "absolute",
+                    "shadowColor": "#000",
+                    "shadowOffset": {
+                      "height": 1,
+                      "width": -1,
+                    },
+                    "shadowOpacity": 0.3,
+                    "shadowRadius": 5,
+                    "top": 0,
+                    "width": 3,
+                  }
+                }
+              />
+              <View
+                style={
+                  [
+                    {
+                      "flex": 1,
+                      "overflow": "hidden",
+                    },
+                    [
+                      {
+                        "backgroundColor": "rgb(242, 242, 242)",
+                      },
+                      undefined,
+                    ],
+                  ]
+                }
+              >
+                <View
+                  style={
+                    {
+                      "flex": 1,
+                      "flexDirection": "column-reverse",
+                    }
+                  }
+                >
+                  <View
+                    style={
+                      {
+                        "flex": 1,
+                      }
+                    }
+                  >
+                    <View
+                      style={
+                        [
+                          {
+                            "alignItems": "center",
+                            "flexDirection": "row",
+                            "gap": 16,
+                            "minHeight": 56,
+                          },
+                          false,
+                          {
+                            "paddingHorizontal": 16,
+                          },
+                        ]
+                      }
+                      testID="header"
+                    >
+                      <View>
+                        <View
+                          onLayout={[Function]}
+                        />
+                      </View>
+                      <View
+                        style={
+                          [
+                            {
+                              "alignItems": "center",
+                              "display": "flex",
+                              "flexBasis": "0%",
+                              "flexGrow": 1,
+                              "flexShrink": 1,
+                            },
+                            undefined,
+                          ]
+                        }
+                      >
+                        <View
+                          style={
+                            {
+                              "alignItems": "center",
+                              "flexDirection": "row",
+                              "gap": 8,
+                            }
+                          }
+                        >
+                          <SvgMock
+                            color="#ca3542"
+                            fill="currentColor"
+                            height={20}
+                            name="Danger"
+                            style={
+                              {
+                                "height": 20,
+                                "width": 20,
+                              }
+                            }
+                            width={20}
+                          />
+                          <Text
+                            accessibilityRole="text"
+                            style={
+                              {
+                                "color": "#131416",
+                                "fontFamily": "Geist-Bold",
+                                "fontSize": 20,
+                                "letterSpacing": 0,
+                                "lineHeight": 24,
+                              }
+                            }
+                          >
+                            Error details
+                          </Text>
+                        </View>
+                      </View>
+                      <View>
+                        <View
+                          onLayout={[Function]}
+                        >
+                          <TouchableOpacity
+                            accessible={true}
+                            activeOpacity={1}
+                            disabled={false}
+                            onPress={[Function]}
+                            onPressIn={[Function]}
+                            onPressOut={[Function]}
+                            style={
+                              {
+                                "alignItems": "center",
+                                "borderRadius": 8,
+                                "height": 32,
+                                "justifyContent": "center",
+                                "opacity": 1,
+                                "width": 32,
+                              }
+                            }
+                            testID="error-details-close-button"
+                          >
+                            <SvgMock
+                              color="#131416"
+                              fill="currentColor"
+                              height={24}
+                              name="Close"
+                              style={
+                                {
+                                  "height": 24,
+                                  "width": 24,
+                                }
+                              }
+                              width={24}
+                            />
+                          </TouchableOpacity>
+                        </View>
+                      </View>
+                    </View>
+                    <RCTScrollView
+                      style={
+                        {
+                          "maxHeight": 800.4,
+                        }
+                      }
+                    >
+                      <View>
+                        <View
+                          style={
+                            {
+                              "paddingBottom": 16,
+                              "paddingHorizontal": 16,
+                            }
+                          }
+                        >
+                          <Text
+                            accessibilityRole="text"
+                            style={
+                              {
+                                "color": "#131416",
+                                "fontFamily": "Geist-Regular",
+                                "fontSize": 16,
+                                "letterSpacing": 0,
+                                "lineHeight": 24,
+                              }
+                            }
+                          >
+                            Error on line 1.
+Error on line 2.
+Additional context for debugging.
+                          </Text>
+                        </View>
+                      </View>
+                    </RCTScrollView>
+                    <View
+                      style={
+                        {
+                          "gap": 8,
+                          "paddingBottom": 16,
+                          "paddingHorizontal": 16,
+                        }
+                      }
+                    >
+                      <TouchableOpacity
+                        accessibilityRole="button"
+                        accessible={true}
+                        activeOpacity={1}
+                        onPress={[Function]}
+                        onPressIn={[Function]}
+                        onPressOut={[Function]}
+                        style={
+                          {
+                            "alignItems": "center",
+                            "alignSelf": "flex-start",
+                            "backgroundColor": "#131416",
+                            "borderRadius": 12,
+                            "flexDirection": "row",
+                            "height": 48,
+                            "justifyContent": "center",
+                            "overflow": "hidden",
+                            "paddingHorizontal": 16,
+                            "width": "100%",
+                          }
+                        }
+                      >
+                        <Text
+                          accessibilityRole="text"
+                          style={
+                            {
+                              "color": "#ffffff",
+                              "fontFamily": "Geist-Medium",
+                              "fontSize": 16,
+                              "letterSpacing": 0,
+                              "lineHeight": 24,
+                            }
+                          }
+                        >
+                          Got it
+                        </Text>
+                      </TouchableOpacity>
+                    </View>
+                  </View>
+                </View>
+              </View>
+            </View>
+          </View>
+        </View>
+      </RNSScreen>
+    </RNSScreenContainer>
+  </RNCSafeAreaProvider>
+</View>
+`;
+
+exports[`ErrorDetailsModal renders with an empty error message 1`] = `
+<View
+  style={
+    {
+      "flex": 1,
+    }
+  }
+>
+  <RNCSafeAreaProvider
+    onInsetsChange={[Function]}
+    style={
+      [
+        {
+          "flex": 1,
+        },
+        undefined,
+      ]
+    }
+  >
+    <View
+      collapsable={false}
+      pointerEvents="box-none"
+      style={
+        {
+          "zIndex": 1,
+        }
+      }
+    >
+      <View
+        accessibilityElementsHidden={false}
+        importantForAccessibility="auto"
+        onLayout={[Function]}
+        pointerEvents="box-none"
+        style={null}
+      >
+        <View
+          collapsable={false}
+          pointerEvents="box-none"
+          style={
+            {
+              "bottom": 0,
+              "left": 0,
+              "opacity": 1,
+              "position": "absolute",
+              "right": 0,
+              "top": 0,
+              "zIndex": 0,
+            }
+          }
+        >
+          <View
+            collapsable={false}
+            style={
+              {
+                "backgroundColor": "rgb(255, 255, 255)",
+                "borderBottomColor": "rgb(216, 216, 216)",
+                "flex": 1,
+                "shadowColor": "rgb(216, 216, 216)",
+                "shadowOffset": {
+                  "height": 0.5,
+                  "width": 0,
+                },
+                "shadowOpacity": 0.85,
+                "shadowRadius": 0,
+              }
+            }
+          />
+        </View>
+        <View
+          collapsable={false}
+          pointerEvents="box-none"
+          style={
+            {
+              "height": 64,
+              "maxHeight": undefined,
+              "minHeight": undefined,
+              "opacity": undefined,
+              "transform": undefined,
+            }
+          }
+        >
+          <View
+            pointerEvents="none"
+            style={
+              {
+                "height": 20,
+              }
+            }
+          />
+          <View
+            pointerEvents="box-none"
+            style={
+              {
+                "alignItems": "center",
+                "flex": 1,
+                "flexDirection": "row",
+                "justifyContent": "center",
+              }
+            }
+          >
+            <View
+              collapsable={false}
+              pointerEvents="box-none"
+              style={
+                {
+                  "marginHorizontal": 16,
+                  "opacity": 1,
+                }
+              }
+            >
+              <Text
+                accessibilityRole="header"
+                aria-level="1"
+                collapsable={false}
+                numberOfLines={1}
+                onLayout={[Function]}
+                style={
+                  {
+                    "color": "rgb(28, 28, 30)",
+                    "fontSize": 17,
+                    "fontWeight": "600",
+                  }
+                }
+              >
+                ErrorDetailsModal
+              </Text>
+            </View>
+          </View>
+        </View>
+      </View>
+    </View>
+    <RNSScreenContainer
+      onLayout={[Function]}
+      style={
+        {
+          "flex": 1,
+        }
+      }
+    >
+      <RNSScreen
+        activityState={2}
+        collapsable={false}
+        gestureResponseDistance={
+          {
+            "bottom": -1,
+            "end": -1,
+            "start": -1,
+            "top": -1,
+          }
+        }
+        onGestureCancel={[Function]}
+        pointerEvents="box-none"
+        sheetAllowedDetents="large"
+        sheetCornerRadius={-1}
+        sheetExpandsWhenScrolledToEdge={true}
+        sheetGrabberVisible={false}
+        sheetLargestUndimmedDetent="all"
+        style={
+          {
+            "bottom": 0,
+            "left": 0,
+            "position": "absolute",
+            "right": 0,
+            "top": 0,
+            "zIndex": undefined,
+          }
+        }
+      >
+        <View
+          collapsable={false}
+          style={
+            {
+              "opacity": 1,
+            }
+          }
+        />
+        <View
+          accessibilityElementsHidden={false}
+          closing={false}
+          gestureVelocityImpact={0.3}
+          importantForAccessibility="auto"
+          onClose={[Function]}
+          onGestureBegin={[Function]}
+          onGestureCanceled={[Function]}
+          onGestureEnd={[Function]}
+          onOpen={[Function]}
+          onTransition={[Function]}
+          pointerEvents="box-none"
+          style={
+            [
+              {
+                "overflow": undefined,
+              },
+              {
+                "bottom": 0,
+                "left": 0,
+                "position": "absolute",
+                "right": 0,
+                "top": 0,
+              },
+            ]
+          }
+          transitionSpec={
+            {
+              "close": {
+                "animation": "spring",
+                "config": {
+                  "damping": 500,
+                  "mass": 3,
+                  "overshootClamping": true,
+                  "restDisplacementThreshold": 10,
+                  "restSpeedThreshold": 10,
+                  "stiffness": 1000,
+                },
+              },
+              "open": {
+                "animation": "spring",
+                "config": {
+                  "damping": 500,
+                  "mass": 3,
+                  "overshootClamping": true,
+                  "restDisplacementThreshold": 10,
+                  "restSpeedThreshold": 10,
+                  "stiffness": 1000,
+                },
+              },
+            }
+          }
+        >
+          <View
+            collapsable={false}
+            needsOffscreenAlphaCompositing={false}
+            pointerEvents="box-none"
+            style={
+              {
+                "flex": 1,
+              }
+            }
+          >
+            <View
+              collapsable={false}
+              enabled={false}
+              handlerTag={-1}
+              handlerType="PanGestureHandler"
+              onGestureHandlerEvent={[Function]}
+              onGestureHandlerStateChange={[Function]}
+              style={
+                {
+                  "flex": 1,
+                  "transform": [
+                    {
+                      "translateX": 0,
+                    },
+                    {
+                      "translateX": 0,
+                    },
+                  ],
+                }
+              }
+            >
+              <View
+                collapsable={false}
+                pointerEvents="none"
+                style={
+                  {
+                    "backgroundColor": "rgb(242, 242, 242)",
+                    "bottom": 0,
+                    "left": 0,
+                    "position": "absolute",
+                    "shadowColor": "#000",
+                    "shadowOffset": {
+                      "height": 1,
+                      "width": -1,
+                    },
+                    "shadowOpacity": 0.3,
+                    "shadowRadius": 5,
+                    "top": 0,
+                    "width": 3,
+                  }
+                }
+              />
+              <View
+                style={
+                  [
+                    {
+                      "flex": 1,
+                      "overflow": "hidden",
+                    },
+                    [
+                      {
+                        "backgroundColor": "rgb(242, 242, 242)",
+                      },
+                      undefined,
+                    ],
+                  ]
+                }
+              >
+                <View
+                  style={
+                    {
+                      "flex": 1,
+                      "flexDirection": "column-reverse",
+                    }
+                  }
+                >
+                  <View
+                    style={
+                      {
+                        "flex": 1,
+                      }
+                    }
+                  >
+                    <View
+                      style={
+                        [
+                          {
+                            "alignItems": "center",
+                            "flexDirection": "row",
+                            "gap": 16,
+                            "minHeight": 56,
+                          },
+                          false,
+                          {
+                            "paddingHorizontal": 16,
+                          },
+                        ]
+                      }
+                      testID="header"
+                    >
+                      <View>
+                        <View
+                          onLayout={[Function]}
+                        />
+                      </View>
+                      <View
+                        style={
+                          [
+                            {
+                              "alignItems": "center",
+                              "display": "flex",
+                              "flexBasis": "0%",
+                              "flexGrow": 1,
+                              "flexShrink": 1,
+                            },
+                            undefined,
+                          ]
+                        }
+                      >
+                        <View
+                          style={
+                            {
+                              "alignItems": "center",
+                              "flexDirection": "row",
+                              "gap": 8,
+                            }
+                          }
+                        >
+                          <SvgMock
+                            color="#ca3542"
+                            fill="currentColor"
+                            height={20}
+                            name="Danger"
+                            style={
+                              {
+                                "height": 20,
+                                "width": 20,
+                              }
+                            }
+                            width={20}
+                          />
+                          <Text
+                            accessibilityRole="text"
+                            style={
+                              {
+                                "color": "#131416",
+                                "fontFamily": "Geist-Bold",
+                                "fontSize": 20,
+                                "letterSpacing": 0,
+                                "lineHeight": 24,
+                              }
+                            }
+                          >
+                            Error details
+                          </Text>
+                        </View>
+                      </View>
+                      <View>
+                        <View
+                          onLayout={[Function]}
+                        >
+                          <TouchableOpacity
+                            accessible={true}
+                            activeOpacity={1}
+                            disabled={false}
+                            onPress={[Function]}
+                            onPressIn={[Function]}
+                            onPressOut={[Function]}
+                            style={
+                              {
+                                "alignItems": "center",
+                                "borderRadius": 8,
+                                "height": 32,
+                                "justifyContent": "center",
+                                "opacity": 1,
+                                "width": 32,
+                              }
+                            }
+                            testID="error-details-close-button"
+                          >
+                            <SvgMock
+                              color="#131416"
+                              fill="currentColor"
+                              height={24}
+                              name="Close"
+                              style={
+                                {
+                                  "height": 24,
+                                  "width": 24,
+                                }
+                              }
+                              width={24}
+                            />
+                          </TouchableOpacity>
+                        </View>
+                      </View>
+                    </View>
+                    <RCTScrollView
+                      style={
+                        {
+                          "maxHeight": 800.4,
+                        }
+                      }
+                    >
+                      <View>
+                        <View
+                          style={
+                            {
+                              "paddingBottom": 16,
+                              "paddingHorizontal": 16,
+                            }
+                          }
+                        >
+                          <Text
+                            accessibilityRole="text"
+                            style={
+                              {
+                                "color": "#131416",
+                                "fontFamily": "Geist-Regular",
+                                "fontSize": 16,
+                                "letterSpacing": 0,
+                                "lineHeight": 24,
+                              }
+                            }
+                          />
+                        </View>
+                      </View>
+                    </RCTScrollView>
+                    <View
+                      style={
+                        {
+                          "gap": 8,
+                          "paddingBottom": 16,
+                          "paddingHorizontal": 16,
+                        }
+                      }
+                    >
+                      <TouchableOpacity
+                        accessibilityRole="button"
+                        accessible={true}
+                        activeOpacity={1}
+                        onPress={[Function]}
+                        onPressIn={[Function]}
+                        onPressOut={[Function]}
+                        style={
+                          {
+                            "alignItems": "center",
+                            "alignSelf": "flex-start",
+                            "backgroundColor": "#131416",
+                            "borderRadius": 12,
+                            "flexDirection": "row",
+                            "height": 48,
+                            "justifyContent": "center",
+                            "overflow": "hidden",
+                            "paddingHorizontal": 16,
+                            "width": "100%",
+                          }
+                        }
+                      >
+                        <Text
+                          accessibilityRole="text"
+                          style={
+                            {
+                              "color": "#ffffff",
+                              "fontFamily": "Geist-Medium",
+                              "fontSize": 16,
+                              "letterSpacing": 0,
+                              "lineHeight": 24,
+                            }
+                          }
+                        >
+                          Got it
+                        </Text>
+                      </TouchableOpacity>
+                    </View>
+                  </View>
+                </View>
+              </View>
+            </View>
+          </View>
+        </View>
+      </RNSScreen>
+    </RNSScreenContainer>
+  </RNCSafeAreaProvider>
+</View>
+`;
+
+exports[`ErrorDetailsModal renders with change provider button and matches snapshot 1`] = `
+<View
+  style={
+    {
+      "flex": 1,
+    }
+  }
+>
+  <RNCSafeAreaProvider
+    onInsetsChange={[Function]}
+    style={
+      [
+        {
+          "flex": 1,
+        },
+        undefined,
+      ]
+    }
+  >
+    <View
+      collapsable={false}
+      pointerEvents="box-none"
+      style={
+        {
+          "zIndex": 1,
+        }
+      }
+    >
+      <View
+        accessibilityElementsHidden={false}
+        importantForAccessibility="auto"
+        onLayout={[Function]}
+        pointerEvents="box-none"
+        style={null}
+      >
+        <View
+          collapsable={false}
+          pointerEvents="box-none"
+          style={
+            {
+              "bottom": 0,
+              "left": 0,
+              "opacity": 1,
+              "position": "absolute",
+              "right": 0,
+              "top": 0,
+              "zIndex": 0,
+            }
+          }
+        >
+          <View
+            collapsable={false}
+            style={
+              {
+                "backgroundColor": "rgb(255, 255, 255)",
+                "borderBottomColor": "rgb(216, 216, 216)",
+                "flex": 1,
+                "shadowColor": "rgb(216, 216, 216)",
+                "shadowOffset": {
+                  "height": 0.5,
+                  "width": 0,
+                },
+                "shadowOpacity": 0.85,
+                "shadowRadius": 0,
+              }
+            }
+          />
+        </View>
+        <View
+          collapsable={false}
+          pointerEvents="box-none"
+          style={
+            {
+              "height": 64,
+              "maxHeight": undefined,
+              "minHeight": undefined,
+              "opacity": undefined,
+              "transform": undefined,
+            }
+          }
+        >
+          <View
+            pointerEvents="none"
+            style={
+              {
+                "height": 20,
+              }
+            }
+          />
+          <View
+            pointerEvents="box-none"
+            style={
+              {
+                "alignItems": "center",
+                "flex": 1,
+                "flexDirection": "row",
+                "justifyContent": "center",
+              }
+            }
+          >
+            <View
+              collapsable={false}
+              pointerEvents="box-none"
+              style={
+                {
+                  "marginHorizontal": 16,
+                  "opacity": 1,
+                }
+              }
+            >
+              <Text
+                accessibilityRole="header"
+                aria-level="1"
+                collapsable={false}
+                numberOfLines={1}
+                onLayout={[Function]}
+                style={
+                  {
+                    "color": "rgb(28, 28, 30)",
+                    "fontSize": 17,
+                    "fontWeight": "600",
+                  }
+                }
+              >
+                ErrorDetailsModal
+              </Text>
+            </View>
+          </View>
+        </View>
+      </View>
+    </View>
+    <RNSScreenContainer
+      onLayout={[Function]}
+      style={
+        {
+          "flex": 1,
+        }
+      }
+    >
+      <RNSScreen
+        activityState={2}
+        collapsable={false}
+        gestureResponseDistance={
+          {
+            "bottom": -1,
+            "end": -1,
+            "start": -1,
+            "top": -1,
+          }
+        }
+        onGestureCancel={[Function]}
+        pointerEvents="box-none"
+        sheetAllowedDetents="large"
+        sheetCornerRadius={-1}
+        sheetExpandsWhenScrolledToEdge={true}
+        sheetGrabberVisible={false}
+        sheetLargestUndimmedDetent="all"
+        style={
+          {
+            "bottom": 0,
+            "left": 0,
+            "position": "absolute",
+            "right": 0,
+            "top": 0,
+            "zIndex": undefined,
+          }
+        }
+      >
+        <View
+          collapsable={false}
+          style={
+            {
+              "opacity": 1,
+            }
+          }
+        />
+        <View
+          accessibilityElementsHidden={false}
+          closing={false}
+          gestureVelocityImpact={0.3}
+          importantForAccessibility="auto"
+          onClose={[Function]}
+          onGestureBegin={[Function]}
+          onGestureCanceled={[Function]}
+          onGestureEnd={[Function]}
+          onOpen={[Function]}
+          onTransition={[Function]}
+          pointerEvents="box-none"
+          style={
+            [
+              {
+                "overflow": undefined,
+              },
+              {
+                "bottom": 0,
+                "left": 0,
+                "position": "absolute",
+                "right": 0,
+                "top": 0,
+              },
+            ]
+          }
+          transitionSpec={
+            {
+              "close": {
+                "animation": "spring",
+                "config": {
+                  "damping": 500,
+                  "mass": 3,
+                  "overshootClamping": true,
+                  "restDisplacementThreshold": 10,
+                  "restSpeedThreshold": 10,
+                  "stiffness": 1000,
+                },
+              },
+              "open": {
+                "animation": "spring",
+                "config": {
+                  "damping": 500,
+                  "mass": 3,
+                  "overshootClamping": true,
+                  "restDisplacementThreshold": 10,
+                  "restSpeedThreshold": 10,
+                  "stiffness": 1000,
+                },
+              },
+            }
+          }
+        >
+          <View
+            collapsable={false}
+            needsOffscreenAlphaCompositing={false}
+            pointerEvents="box-none"
+            style={
+              {
+                "flex": 1,
+              }
+            }
+          >
+            <View
+              collapsable={false}
+              enabled={false}
+              handlerTag={-1}
+              handlerType="PanGestureHandler"
+              onGestureHandlerEvent={[Function]}
+              onGestureHandlerStateChange={[Function]}
+              style={
+                {
+                  "flex": 1,
+                  "transform": [
+                    {
+                      "translateX": 0,
+                    },
+                    {
+                      "translateX": 0,
+                    },
+                  ],
+                }
+              }
+            >
+              <View
+                collapsable={false}
+                pointerEvents="none"
+                style={
+                  {
+                    "backgroundColor": "rgb(242, 242, 242)",
+                    "bottom": 0,
+                    "left": 0,
+                    "position": "absolute",
+                    "shadowColor": "#000",
+                    "shadowOffset": {
+                      "height": 1,
+                      "width": -1,
+                    },
+                    "shadowOpacity": 0.3,
+                    "shadowRadius": 5,
+                    "top": 0,
+                    "width": 3,
+                  }
+                }
+              />
+              <View
+                style={
+                  [
+                    {
+                      "flex": 1,
+                      "overflow": "hidden",
+                    },
+                    [
+                      {
+                        "backgroundColor": "rgb(242, 242, 242)",
+                      },
+                      undefined,
+                    ],
+                  ]
+                }
+              >
+                <View
+                  style={
+                    {
+                      "flex": 1,
+                      "flexDirection": "column-reverse",
+                    }
+                  }
+                >
+                  <View
+                    style={
+                      {
+                        "flex": 1,
+                      }
+                    }
+                  >
+                    <View
+                      style={
+                        [
+                          {
+                            "alignItems": "center",
+                            "flexDirection": "row",
+                            "gap": 16,
+                            "minHeight": 56,
+                          },
+                          false,
+                          {
+                            "paddingHorizontal": 16,
+                          },
+                        ]
+                      }
+                      testID="header"
+                    >
+                      <View>
+                        <View
+                          onLayout={[Function]}
+                        />
+                      </View>
+                      <View
+                        style={
+                          [
+                            {
+                              "alignItems": "center",
+                              "display": "flex",
+                              "flexBasis": "0%",
+                              "flexGrow": 1,
+                              "flexShrink": 1,
+                            },
+                            undefined,
+                          ]
+                        }
+                      >
+                        <View
+                          style={
+                            {
+                              "alignItems": "center",
+                              "flexDirection": "row",
+                              "gap": 8,
+                            }
+                          }
+                        >
+                          <SvgMock
+                            color="#ca3542"
+                            fill="currentColor"
+                            height={20}
+                            name="Danger"
+                            style={
+                              {
+                                "height": 20,
+                                "width": 20,
+                              }
+                            }
+                            width={20}
+                          />
+                          <Text
+                            accessibilityRole="text"
+                            style={
+                              {
+                                "color": "#131416",
+                                "fontFamily": "Geist-Bold",
+                                "fontSize": 20,
+                                "letterSpacing": 0,
+                                "lineHeight": 24,
+                              }
+                            }
+                          >
+                            Error details
+                          </Text>
+                        </View>
+                      </View>
+                      <View>
+                        <View
+                          onLayout={[Function]}
+                        >
+                          <TouchableOpacity
+                            accessible={true}
+                            activeOpacity={1}
+                            disabled={false}
+                            onPress={[Function]}
+                            onPressIn={[Function]}
+                            onPressOut={[Function]}
+                            style={
+                              {
+                                "alignItems": "center",
+                                "borderRadius": 8,
+                                "height": 32,
+                                "justifyContent": "center",
+                                "opacity": 1,
+                                "width": 32,
+                              }
+                            }
+                            testID="error-details-close-button"
+                          >
+                            <SvgMock
+                              color="#131416"
+                              fill="currentColor"
+                              height={24}
+                              name="Close"
+                              style={
+                                {
+                                  "height": 24,
+                                  "width": 24,
+                                }
+                              }
+                              width={24}
+                            />
+                          </TouchableOpacity>
+                        </View>
+                      </View>
+                    </View>
+                    <RCTScrollView
+                      style={
+                        {
+                          "maxHeight": 800.4,
+                        }
+                      }
+                    >
+                      <View>
+                        <View
+                          style={
+                            {
+                              "paddingBottom": 16,
+                              "paddingHorizontal": 16,
+                            }
+                          }
+                        >
+                          <Text
+                            accessibilityRole="text"
+                            style={
+                              {
+                                "color": "#131416",
+                                "fontFamily": "Geist-Regular",
+                                "fontSize": 16,
+                                "letterSpacing": 0,
+                                "lineHeight": 24,
+                              }
+                            }
+                          >
+                            No quotes available.
+                          </Text>
+                        </View>
+                      </View>
+                    </RCTScrollView>
+                    <View
+                      style={
+                        {
+                          "gap": 8,
+                          "paddingBottom": 16,
+                          "paddingHorizontal": 16,
+                        }
+                      }
+                    >
+                      <TouchableOpacity
+                        accessibilityRole="button"
+                        accessible={true}
+                        activeOpacity={1}
+                        onPress={[Function]}
+                        onPressIn={[Function]}
+                        onPressOut={[Function]}
+                        style={
+                          {
+                            "alignItems": "center",
+                            "alignSelf": "flex-start",
+                            "backgroundColor": "#b4b4b528",
+                            "borderColor": "transparent",
+                            "borderRadius": 12,
+                            "borderWidth": 1,
+                            "flexDirection": "row",
+                            "height": 48,
+                            "justifyContent": "center",
+                            "overflow": "hidden",
+                            "paddingHorizontal": 16,
+                            "width": "100%",
+                          }
+                        }
+                      >
+                        <Text
+                          accessibilityRole="text"
+                          style={
+                            {
+                              "color": "#131416",
+                              "fontFamily": "Geist-Medium",
+                              "fontSize": 16,
+                              "letterSpacing": 0,
+                              "lineHeight": 24,
+                            }
+                          }
+                        >
+                          Change provider
+                        </Text>
+                      </TouchableOpacity>
+                      <TouchableOpacity
+                        accessibilityRole="button"
+                        accessible={true}
+                        activeOpacity={1}
+                        onPress={[Function]}
+                        onPressIn={[Function]}
+                        onPressOut={[Function]}
+                        style={
+                          {
+                            "alignItems": "center",
+                            "alignSelf": "flex-start",
+                            "backgroundColor": "#131416",
+                            "borderRadius": 12,
+                            "flexDirection": "row",
+                            "height": 48,
+                            "justifyContent": "center",
+                            "overflow": "hidden",
+                            "paddingHorizontal": 16,
+                            "width": "100%",
+                          }
+                        }
+                      >
+                        <Text
+                          accessibilityRole="text"
+                          style={
+                            {
+                              "color": "#ffffff",
+                              "fontFamily": "Geist-Medium",
+                              "fontSize": 16,
+                              "letterSpacing": 0,
+                              "lineHeight": 24,
+                            }
+                          }
+                        >
+                          Got it
+                        </Text>
+                      </TouchableOpacity>
+                    </View>
+                  </View>
+                </View>
+              </View>
+            </View>
+          </View>
+        </View>
+      </RNSScreen>
+    </RNSScreenContainer>
+  </RNCSafeAreaProvider>
+</View>
+`;
+
+exports[`ErrorDetailsModal renders with provider support info and matches snapshot 1`] = `
+<View
+  style={
+    {
+      "flex": 1,
+    }
+  }
+>
+  <RNCSafeAreaProvider
+    onInsetsChange={[Function]}
+    style={
+      [
+        {
+          "flex": 1,
+        },
+        undefined,
+      ]
+    }
+  >
+    <View
+      collapsable={false}
+      pointerEvents="box-none"
+      style={
+        {
+          "zIndex": 1,
+        }
+      }
+    >
+      <View
+        accessibilityElementsHidden={false}
+        importantForAccessibility="auto"
+        onLayout={[Function]}
+        pointerEvents="box-none"
+        style={null}
+      >
+        <View
+          collapsable={false}
+          pointerEvents="box-none"
+          style={
+            {
+              "bottom": 0,
+              "left": 0,
+              "opacity": 1,
+              "position": "absolute",
+              "right": 0,
+              "top": 0,
+              "zIndex": 0,
+            }
+          }
+        >
+          <View
+            collapsable={false}
+            style={
+              {
+                "backgroundColor": "rgb(255, 255, 255)",
+                "borderBottomColor": "rgb(216, 216, 216)",
+                "flex": 1,
+                "shadowColor": "rgb(216, 216, 216)",
+                "shadowOffset": {
+                  "height": 0.5,
+                  "width": 0,
+                },
+                "shadowOpacity": 0.85,
+                "shadowRadius": 0,
+              }
+            }
+          />
+        </View>
+        <View
+          collapsable={false}
+          pointerEvents="box-none"
+          style={
+            {
+              "height": 64,
+              "maxHeight": undefined,
+              "minHeight": undefined,
+              "opacity": undefined,
+              "transform": undefined,
+            }
+          }
+        >
+          <View
+            pointerEvents="none"
+            style={
+              {
+                "height": 20,
+              }
+            }
+          />
+          <View
+            pointerEvents="box-none"
+            style={
+              {
+                "alignItems": "center",
+                "flex": 1,
+                "flexDirection": "row",
+                "justifyContent": "center",
+              }
+            }
+          >
+            <View
+              collapsable={false}
+              pointerEvents="box-none"
+              style={
+                {
+                  "marginHorizontal": 16,
+                  "opacity": 1,
+                }
+              }
+            >
+              <Text
+                accessibilityRole="header"
+                aria-level="1"
+                collapsable={false}
+                numberOfLines={1}
+                onLayout={[Function]}
+                style={
+                  {
+                    "color": "rgb(28, 28, 30)",
+                    "fontSize": 17,
+                    "fontWeight": "600",
+                  }
+                }
+              >
+                ErrorDetailsModal
+              </Text>
+            </View>
+          </View>
+        </View>
+      </View>
+    </View>
+    <RNSScreenContainer
+      onLayout={[Function]}
+      style={
+        {
+          "flex": 1,
+        }
+      }
+    >
+      <RNSScreen
+        activityState={2}
+        collapsable={false}
+        gestureResponseDistance={
+          {
+            "bottom": -1,
+            "end": -1,
+            "start": -1,
+            "top": -1,
+          }
+        }
+        onGestureCancel={[Function]}
+        pointerEvents="box-none"
+        sheetAllowedDetents="large"
+        sheetCornerRadius={-1}
+        sheetExpandsWhenScrolledToEdge={true}
+        sheetGrabberVisible={false}
+        sheetLargestUndimmedDetent="all"
+        style={
+          {
+            "bottom": 0,
+            "left": 0,
+            "position": "absolute",
+            "right": 0,
+            "top": 0,
+            "zIndex": undefined,
+          }
+        }
+      >
+        <View
+          collapsable={false}
+          style={
+            {
+              "opacity": 1,
+            }
+          }
+        />
+        <View
+          accessibilityElementsHidden={false}
+          closing={false}
+          gestureVelocityImpact={0.3}
+          importantForAccessibility="auto"
+          onClose={[Function]}
+          onGestureBegin={[Function]}
+          onGestureCanceled={[Function]}
+          onGestureEnd={[Function]}
+          onOpen={[Function]}
+          onTransition={[Function]}
+          pointerEvents="box-none"
+          style={
+            [
+              {
+                "overflow": undefined,
+              },
+              {
+                "bottom": 0,
+                "left": 0,
+                "position": "absolute",
+                "right": 0,
+                "top": 0,
+              },
+            ]
+          }
+          transitionSpec={
+            {
+              "close": {
+                "animation": "spring",
+                "config": {
+                  "damping": 500,
+                  "mass": 3,
+                  "overshootClamping": true,
+                  "restDisplacementThreshold": 10,
+                  "restSpeedThreshold": 10,
+                  "stiffness": 1000,
+                },
+              },
+              "open": {
+                "animation": "spring",
+                "config": {
+                  "damping": 500,
+                  "mass": 3,
+                  "overshootClamping": true,
+                  "restDisplacementThreshold": 10,
+                  "restSpeedThreshold": 10,
+                  "stiffness": 1000,
+                },
+              },
+            }
+          }
+        >
+          <View
+            collapsable={false}
+            needsOffscreenAlphaCompositing={false}
+            pointerEvents="box-none"
+            style={
+              {
+                "flex": 1,
+              }
+            }
+          >
+            <View
+              collapsable={false}
+              enabled={false}
+              handlerTag={-1}
+              handlerType="PanGestureHandler"
+              onGestureHandlerEvent={[Function]}
+              onGestureHandlerStateChange={[Function]}
+              style={
+                {
+                  "flex": 1,
+                  "transform": [
+                    {
+                      "translateX": 0,
+                    },
+                    {
+                      "translateX": 0,
+                    },
+                  ],
+                }
+              }
+            >
+              <View
+                collapsable={false}
+                pointerEvents="none"
+                style={
+                  {
+                    "backgroundColor": "rgb(242, 242, 242)",
+                    "bottom": 0,
+                    "left": 0,
+                    "position": "absolute",
+                    "shadowColor": "#000",
+                    "shadowOffset": {
+                      "height": 1,
+                      "width": -1,
+                    },
+                    "shadowOpacity": 0.3,
+                    "shadowRadius": 5,
+                    "top": 0,
+                    "width": 3,
+                  }
+                }
+              />
+              <View
+                style={
+                  [
+                    {
+                      "flex": 1,
+                      "overflow": "hidden",
+                    },
+                    [
+                      {
+                        "backgroundColor": "rgb(242, 242, 242)",
+                      },
+                      undefined,
+                    ],
+                  ]
+                }
+              >
+                <View
+                  style={
+                    {
+                      "flex": 1,
+                      "flexDirection": "column-reverse",
+                    }
+                  }
+                >
+                  <View
+                    style={
+                      {
+                        "flex": 1,
+                      }
+                    }
+                  >
+                    <View
+                      style={
+                        [
+                          {
+                            "alignItems": "center",
+                            "flexDirection": "row",
+                            "gap": 16,
+                            "minHeight": 56,
+                          },
+                          false,
+                          {
+                            "paddingHorizontal": 16,
+                          },
+                        ]
+                      }
+                      testID="header"
+                    >
+                      <View>
+                        <View
+                          onLayout={[Function]}
+                        />
+                      </View>
+                      <View
+                        style={
+                          [
+                            {
+                              "alignItems": "center",
+                              "display": "flex",
+                              "flexBasis": "0%",
+                              "flexGrow": 1,
+                              "flexShrink": 1,
+                            },
+                            undefined,
+                          ]
+                        }
+                      >
+                        <View
+                          style={
+                            {
+                              "alignItems": "center",
+                              "flexDirection": "row",
+                              "gap": 8,
+                            }
+                          }
+                        >
+                          <SvgMock
+                            color="#ca3542"
+                            fill="currentColor"
+                            height={20}
+                            name="Danger"
+                            style={
+                              {
+                                "height": 20,
+                                "width": 20,
+                              }
+                            }
+                            width={20}
+                          />
+                          <Text
+                            accessibilityRole="text"
+                            style={
+                              {
+                                "color": "#131416",
+                                "fontFamily": "Geist-Bold",
+                                "fontSize": 20,
+                                "letterSpacing": 0,
+                                "lineHeight": 24,
+                              }
+                            }
+                          >
+                            Error details
+                          </Text>
+                        </View>
+                      </View>
+                      <View>
+                        <View
+                          onLayout={[Function]}
+                        >
+                          <TouchableOpacity
+                            accessible={true}
+                            activeOpacity={1}
+                            disabled={false}
+                            onPress={[Function]}
+                            onPressIn={[Function]}
+                            onPressOut={[Function]}
+                            style={
+                              {
+                                "alignItems": "center",
+                                "borderRadius": 8,
+                                "height": 32,
+                                "justifyContent": "center",
+                                "opacity": 1,
+                                "width": 32,
+                              }
+                            }
+                            testID="error-details-close-button"
+                          >
+                            <SvgMock
+                              color="#131416"
+                              fill="currentColor"
+                              height={24}
+                              name="Close"
+                              style={
+                                {
+                                  "height": 24,
+                                  "width": 24,
+                                }
+                              }
+                              width={24}
+                            />
+                          </TouchableOpacity>
+                        </View>
+                      </View>
+                    </View>
+                    <RCTScrollView
+                      style={
+                        {
+                          "maxHeight": 800.4,
+                        }
+                      }
+                    >
+                      <View>
+                        <View
+                          style={
+                            {
+                              "paddingBottom": 16,
+                              "paddingHorizontal": 16,
+                            }
+                          }
+                        >
+                          <Text
+                            accessibilityRole="text"
+                            style={
+                              {
+                                "color": "#131416",
+                                "fontFamily": "Geist-Regular",
+                                "fontSize": 16,
+                                "letterSpacing": 0,
+                                "lineHeight": 24,
+                              }
+                            }
+                          >
+                            Provider error occurred.
+                          </Text>
+                        </View>
+                      </View>
+                    </RCTScrollView>
+                    <View
+                      style={
+                        {
+                          "gap": 8,
+                          "paddingBottom": 16,
+                          "paddingHorizontal": 16,
+                        }
+                      }
+                    >
+                      <TouchableOpacity
+                        accessibilityRole="button"
+                        accessible={true}
+                        activeOpacity={1}
+                        onPress={[Function]}
+                        onPressIn={[Function]}
+                        onPressOut={[Function]}
+                        style={
+                          {
+                            "alignItems": "center",
+                            "alignSelf": "flex-start",
+                            "backgroundColor": "#b4b4b528",
+                            "borderColor": "transparent",
+                            "borderRadius": 12,
+                            "borderWidth": 1,
+                            "flexDirection": "row",
+                            "height": 48,
+                            "justifyContent": "center",
+                            "overflow": "hidden",
+                            "paddingHorizontal": 16,
+                            "width": "100%",
+                          }
+                        }
+                      >
+                        <Text
+                          accessibilityRole="text"
+                          style={
+                            {
+                              "color": "#131416",
+                              "fontFamily": "Geist-Medium",
+                              "fontSize": 16,
+                              "letterSpacing": 0,
+                              "lineHeight": 24,
+                            }
+                          }
+                        >
+                          Contact Transak support
+                        </Text>
+                      </TouchableOpacity>
+                      <TouchableOpacity
+                        accessibilityRole="button"
+                        accessible={true}
+                        activeOpacity={1}
+                        onPress={[Function]}
+                        onPressIn={[Function]}
+                        onPressOut={[Function]}
+                        style={
+                          {
+                            "alignItems": "center",
+                            "alignSelf": "flex-start",
+                            "backgroundColor": "#131416",
+                            "borderRadius": 12,
+                            "flexDirection": "row",
+                            "height": 48,
+                            "justifyContent": "center",
+                            "overflow": "hidden",
+                            "paddingHorizontal": 16,
+                            "width": "100%",
+                          }
+                        }
+                      >
+                        <Text
+                          accessibilityRole="text"
+                          style={
+                            {
+                              "color": "#ffffff",
+                              "fontFamily": "Geist-Medium",
+                              "fontSize": 16,
+                              "letterSpacing": 0,
+                              "lineHeight": 24,
+                            }
+                          }
+                        >
+                          Got it
+                        </Text>
+                      </TouchableOpacity>
+                    </View>
+                  </View>
+                </View>
+              </View>
+            </View>
+          </View>
+        </View>
+      </RNSScreen>
+    </RNSScreenContainer>
+  </RNCSafeAreaProvider>
+</View>
+`;
diff --git a/app/components/UI/Ramp/Views/Modals/ErrorDetailsModal/index.ts b/app/components/UI/Ramp/Views/Modals/ErrorDetailsModal/index.ts
new file mode 100644
index 000000000000..87e9cd21eec7
--- /dev/null
+++ b/app/components/UI/Ramp/Views/Modals/ErrorDetailsModal/index.ts
@@ -0,0 +1,2 @@
+export { default } from './ErrorDetailsModal';
+export { createErrorDetailsModalNavDetails } from './ErrorDetailsModal';
diff --git a/app/components/UI/Ramp/Views/Modals/PaymentSelectionModal/PaymentMethodListItem.tsx b/app/components/UI/Ramp/Views/Modals/PaymentSelectionModal/PaymentMethodListItem.tsx
index 32e71e5d5ca0..c990ff3f02ed 100644
--- a/app/components/UI/Ramp/Views/Modals/PaymentSelectionModal/PaymentMethodListItem.tsx
+++ b/app/components/UI/Ramp/Views/Modals/PaymentSelectionModal/PaymentMethodListItem.tsx
@@ -38,6 +38,7 @@ interface PaymentMethodListItemProps {
   paymentMethod: PaymentMethod;
   onPress?: () => void;
   isSelected?: boolean;
+  showQuote?: boolean;
   quote: Quote | null;
   quoteLoading: boolean;
   quoteError: boolean;
@@ -49,6 +50,7 @@ const PaymentMethodListItem: React.FC<PaymentMethodListItemProps> = ({
   paymentMethod,
   onPress,
   isSelected = false,
+  showQuote = true,
   quote,
   quoteLoading,
   quoteError,
@@ -102,14 +104,16 @@ const PaymentMethodListItem: React.FC<PaymentMethodListItemProps> = ({
           </Text>
         ) : null}
       </ListItemColumn>
-      <ListItemColumn widthType={WidthType.Auto}>
-        <QuoteDisplay
-          cryptoAmount={cryptoAmount}
-          fiatAmount={fiatAmount}
-          isLoading={quoteLoading}
-          showWarningIcon={quoteError}
-        />
-      </ListItemColumn>
+      {showQuote ? (
+        <ListItemColumn widthType={WidthType.Auto}>
+          <QuoteDisplay
+            cryptoAmount={cryptoAmount}
+            fiatAmount={fiatAmount}
+            isLoading={quoteLoading}
+            showWarningIcon={quoteError}
+          />
+        </ListItemColumn>
+      ) : null}
     </ListItemSelect>
   );
 };
diff --git a/app/components/UI/Ramp/Views/Modals/PaymentSelectionModal/PaymentSelectionModal.tsx b/app/components/UI/Ramp/Views/Modals/PaymentSelectionModal/PaymentSelectionModal.tsx
index f803de557e51..f283c5fba98d 100644
--- a/app/components/UI/Ramp/Views/Modals/PaymentSelectionModal/PaymentSelectionModal.tsx
+++ b/app/components/UI/Ramp/Views/Modals/PaymentSelectionModal/PaymentSelectionModal.tsx
@@ -31,6 +31,8 @@ import PaymentSelectionAlert from './PaymentSelectionAlert';
 import { useRampsController } from '../../../hooks/useRampsController';
 import { useRampsQuotes } from '../../../hooks/useRampsQuotes';
 import useRampAccountAddress from '../../../hooks/useRampAccountAddress';
+import { useAnalytics } from '../../../../../hooks/useAnalytics/useAnalytics';
+import { MetaMetricsEvents } from '../../../../../../core/Analytics';
 
 export interface PaymentSelectionModalParams {
   amount?: number;
@@ -46,6 +48,7 @@ export const createPaymentSelectionModalNavigationDetails =
 const DEFAULT_QUOTE_AMOUNT = 100;
 
 function PaymentSelectionModal() {
+  const { trackEvent, createEventBuilder } = useAnalytics();
   const sheetRef = useRef<BottomSheetRef>(null);
   const { height: screenHeight } = useWindowDimensions();
   const { styles } = useStyles(styleSheet, {
@@ -79,6 +82,7 @@ function PaymentSelectionModal() {
 
   const quoteFetchParams = useMemo(
     () =>
+      amount > 0 &&
       walletAddress &&
       assetId &&
       !paymentMethodsLoading &&
@@ -106,17 +110,48 @@ function PaymentSelectionModal() {
     useRampsQuotes(quoteFetchParams);
 
   const handleChangeProviderPress = useCallback(() => {
+    trackEvent(
+      createEventBuilder(MetaMetricsEvents.RAMPS_CHANGE_PROVIDER_BUTTON_CLICKED)
+        .addProperties({
+          current_provider: selectedProvider?.name,
+          location: 'Payment Selection',
+          ramp_type: 'UNIFIED_BUY_2',
+        })
+        .build(),
+    );
     navigation.navigate(Routes.RAMP.MODALS.PROVIDER_SELECTION, { amount });
-  }, [navigation, amount]);
+  }, [
+    navigation,
+    amount,
+    selectedProvider?.name,
+    trackEvent,
+    createEventBuilder,
+  ]);
 
   const handlePaymentMethodPress = useCallback(
     (paymentMethod: PaymentMethod) => {
+      trackEvent(
+        createEventBuilder(MetaMetricsEvents.RAMPS_PAYMENT_METHOD_SELECTED)
+          .addProperties({
+            payment_method_id: paymentMethod.id,
+            ramp_type: 'UNIFIED_BUY_2',
+            region: userRegion?.regionCode ?? '',
+            is_authenticated: false,
+          })
+          .build(),
+      );
       setSelectedPaymentMethod(paymentMethod);
       sheetRef.current?.onCloseBottomSheet(() => {
         onPaymentMethodSelect?.();
       });
     },
-    [setSelectedPaymentMethod, onPaymentMethodSelect],
+    [
+      setSelectedPaymentMethod,
+      onPaymentMethodSelect,
+      userRegion?.regionCode,
+      trackEvent,
+      createEventBuilder,
+    ],
   );
 
   const currency = userRegion?.country?.currency ?? 'USD';
@@ -138,6 +173,7 @@ function PaymentSelectionModal() {
           paymentMethod={paymentMethod}
           onPress={() => handlePaymentMethodPress(paymentMethod)}
           isSelected={selectedPaymentMethod?.id === paymentMethod.id}
+          showQuote={amount > 0}
           quote={matchedQuote}
           quoteLoading={quotesLoading}
           quoteError={hasQuoteError}
@@ -149,6 +185,7 @@ function PaymentSelectionModal() {
     [
       handlePaymentMethodPress,
       selectedPaymentMethod,
+      amount,
       quotes,
       quotesLoading,
       currency,
diff --git a/app/components/UI/Ramp/Views/Modals/PaymentSelectionModal/__snapshots__/PaymentMethodListItem.test.tsx.snap b/app/components/UI/Ramp/Views/Modals/PaymentSelectionModal/__snapshots__/PaymentMethodListItem.test.tsx.snap
index 73f9f4a180f8..3a032a3a15f3 100644
--- a/app/components/UI/Ramp/Views/Modals/PaymentSelectionModal/__snapshots__/PaymentMethodListItem.test.tsx.snap
+++ b/app/components/UI/Ramp/Views/Modals/PaymentSelectionModal/__snapshots__/PaymentMethodListItem.test.tsx.snap
@@ -44,7 +44,7 @@ exports[`PaymentMethodListItem matches snapshot 1`] = `
             [
               {
                 "alignItems": "center",
-                "backgroundColor": "#3c4d9d0f",
+                "backgroundColor": "#b4b4b528",
                 "borderRadius": 22,
                 "height": 44,
                 "justifyContent": "center",
@@ -60,7 +60,7 @@ exports[`PaymentMethodListItem matches snapshot 1`] = `
             style={
               [
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontSize": 24,
                 },
                 undefined,
@@ -98,9 +98,9 @@ exports[`PaymentMethodListItem matches snapshot 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Medium",
-              "fontSize": 18,
+              "fontSize": 20,
               "letterSpacing": 0,
               "lineHeight": 24,
             }
@@ -112,7 +112,7 @@ exports[`PaymentMethodListItem matches snapshot 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "fontFamily": "Geist-Regular",
               "fontSize": 14,
               "letterSpacing": 0,
@@ -189,7 +189,7 @@ exports[`PaymentMethodListItem renders as selected when isSelected is true 1`] =
             [
               {
                 "alignItems": "center",
-                "backgroundColor": "#3c4d9d0f",
+                "backgroundColor": "#b4b4b528",
                 "borderRadius": 22,
                 "height": 44,
                 "justifyContent": "center",
@@ -245,9 +245,9 @@ exports[`PaymentMethodListItem renders as selected when isSelected is true 1`] =
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Medium",
-              "fontSize": 18,
+              "fontSize": 20,
               "letterSpacing": 0,
               "lineHeight": 24,
             }
@@ -259,7 +259,7 @@ exports[`PaymentMethodListItem renders as selected when isSelected is true 1`] =
           accessibilityRole="text"
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "fontFamily": "Geist-Regular",
               "fontSize": 14,
               "letterSpacing": 0,
@@ -294,7 +294,7 @@ exports[`PaymentMethodListItem renders as selected when isSelected is true 1`] =
     accessible={true}
     style={
       {
-        "backgroundColor": "#3c4d9d0f",
+        "backgroundColor": "#b4b4b528",
         "bottom": 0,
         "flexDirection": "row",
         "left": 0,
diff --git a/app/components/UI/Ramp/Views/Modals/PaymentSelectionModal/__snapshots__/PaymentMethodListSkeleton.test.tsx.snap b/app/components/UI/Ramp/Views/Modals/PaymentSelectionModal/__snapshots__/PaymentMethodListSkeleton.test.tsx.snap
index f429ab7ef85b..edaa242a4605 100644
--- a/app/components/UI/Ramp/Views/Modals/PaymentSelectionModal/__snapshots__/PaymentMethodListSkeleton.test.tsx.snap
+++ b/app/components/UI/Ramp/Views/Modals/PaymentSelectionModal/__snapshots__/PaymentMethodListSkeleton.test.tsx.snap
@@ -53,7 +53,7 @@ exports[`PaymentMethodListSkeleton matches snapshot 1`] = `
               pointerEvents="none"
               style={
                 {
-                  "backgroundColor": "#686e7d",
+                  "backgroundColor": "#66676a",
                   "borderRadius": 4,
                   "bottom": 0,
                   "left": 0,
@@ -105,7 +105,7 @@ exports[`PaymentMethodListSkeleton matches snapshot 1`] = `
                 pointerEvents="none"
                 style={
                   {
-                    "backgroundColor": "#686e7d",
+                    "backgroundColor": "#66676a",
                     "borderRadius": 4,
                     "bottom": 0,
                     "left": 0,
@@ -132,7 +132,7 @@ exports[`PaymentMethodListSkeleton matches snapshot 1`] = `
                 pointerEvents="none"
                 style={
                   {
-                    "backgroundColor": "#686e7d",
+                    "backgroundColor": "#66676a",
                     "borderRadius": 4,
                     "bottom": 0,
                     "left": 0,
@@ -189,7 +189,7 @@ exports[`PaymentMethodListSkeleton matches snapshot 1`] = `
                 pointerEvents="none"
                 style={
                   {
-                    "backgroundColor": "#686e7d",
+                    "backgroundColor": "#66676a",
                     "borderRadius": 4,
                     "bottom": 0,
                     "left": 0,
@@ -223,7 +223,7 @@ exports[`PaymentMethodListSkeleton matches snapshot 1`] = `
                 pointerEvents="none"
                 style={
                   {
-                    "backgroundColor": "#686e7d",
+                    "backgroundColor": "#66676a",
                     "borderRadius": 4,
                     "bottom": 0,
                     "left": 0,
@@ -291,7 +291,7 @@ exports[`PaymentMethodListSkeleton matches snapshot 1`] = `
               pointerEvents="none"
               style={
                 {
-                  "backgroundColor": "#686e7d",
+                  "backgroundColor": "#66676a",
                   "borderRadius": 4,
                   "bottom": 0,
                   "left": 0,
@@ -343,7 +343,7 @@ exports[`PaymentMethodListSkeleton matches snapshot 1`] = `
                 pointerEvents="none"
                 style={
                   {
-                    "backgroundColor": "#686e7d",
+                    "backgroundColor": "#66676a",
                     "borderRadius": 4,
                     "bottom": 0,
                     "left": 0,
@@ -370,7 +370,7 @@ exports[`PaymentMethodListSkeleton matches snapshot 1`] = `
                 pointerEvents="none"
                 style={
                   {
-                    "backgroundColor": "#686e7d",
+                    "backgroundColor": "#66676a",
                     "borderRadius": 4,
                     "bottom": 0,
                     "left": 0,
@@ -427,7 +427,7 @@ exports[`PaymentMethodListSkeleton matches snapshot 1`] = `
                 pointerEvents="none"
                 style={
                   {
-                    "backgroundColor": "#686e7d",
+                    "backgroundColor": "#66676a",
                     "borderRadius": 4,
                     "bottom": 0,
                     "left": 0,
@@ -461,7 +461,7 @@ exports[`PaymentMethodListSkeleton matches snapshot 1`] = `
                 pointerEvents="none"
                 style={
                   {
-                    "backgroundColor": "#686e7d",
+                    "backgroundColor": "#66676a",
                     "borderRadius": 4,
                     "bottom": 0,
                     "left": 0,
@@ -529,7 +529,7 @@ exports[`PaymentMethodListSkeleton matches snapshot 1`] = `
               pointerEvents="none"
               style={
                 {
-                  "backgroundColor": "#686e7d",
+                  "backgroundColor": "#66676a",
                   "borderRadius": 4,
                   "bottom": 0,
                   "left": 0,
@@ -581,7 +581,7 @@ exports[`PaymentMethodListSkeleton matches snapshot 1`] = `
                 pointerEvents="none"
                 style={
                   {
-                    "backgroundColor": "#686e7d",
+                    "backgroundColor": "#66676a",
                     "borderRadius": 4,
                     "bottom": 0,
                     "left": 0,
@@ -608,7 +608,7 @@ exports[`PaymentMethodListSkeleton matches snapshot 1`] = `
                 pointerEvents="none"
                 style={
                   {
-                    "backgroundColor": "#686e7d",
+                    "backgroundColor": "#66676a",
                     "borderRadius": 4,
                     "bottom": 0,
                     "left": 0,
@@ -665,7 +665,7 @@ exports[`PaymentMethodListSkeleton matches snapshot 1`] = `
                 pointerEvents="none"
                 style={
                   {
-                    "backgroundColor": "#686e7d",
+                    "backgroundColor": "#66676a",
                     "borderRadius": 4,
                     "bottom": 0,
                     "left": 0,
@@ -699,7 +699,7 @@ exports[`PaymentMethodListSkeleton matches snapshot 1`] = `
                 pointerEvents="none"
                 style={
                   {
-                    "backgroundColor": "#686e7d",
+                    "backgroundColor": "#66676a",
                     "borderRadius": 4,
                     "bottom": 0,
                     "left": 0,
@@ -767,7 +767,7 @@ exports[`PaymentMethodListSkeleton matches snapshot 1`] = `
               pointerEvents="none"
               style={
                 {
-                  "backgroundColor": "#686e7d",
+                  "backgroundColor": "#66676a",
                   "borderRadius": 4,
                   "bottom": 0,
                   "left": 0,
@@ -819,7 +819,7 @@ exports[`PaymentMethodListSkeleton matches snapshot 1`] = `
                 pointerEvents="none"
                 style={
                   {
-                    "backgroundColor": "#686e7d",
+                    "backgroundColor": "#66676a",
                     "borderRadius": 4,
                     "bottom": 0,
                     "left": 0,
@@ -846,7 +846,7 @@ exports[`PaymentMethodListSkeleton matches snapshot 1`] = `
                 pointerEvents="none"
                 style={
                   {
-                    "backgroundColor": "#686e7d",
+                    "backgroundColor": "#66676a",
                     "borderRadius": 4,
                     "bottom": 0,
                     "left": 0,
@@ -903,7 +903,7 @@ exports[`PaymentMethodListSkeleton matches snapshot 1`] = `
                 pointerEvents="none"
                 style={
                   {
-                    "backgroundColor": "#686e7d",
+                    "backgroundColor": "#66676a",
                     "borderRadius": 4,
                     "bottom": 0,
                     "left": 0,
@@ -937,7 +937,7 @@ exports[`PaymentMethodListSkeleton matches snapshot 1`] = `
                 pointerEvents="none"
                 style={
                   {
-                    "backgroundColor": "#686e7d",
+                    "backgroundColor": "#66676a",
                     "borderRadius": 4,
                     "bottom": 0,
                     "left": 0,
@@ -1005,7 +1005,7 @@ exports[`PaymentMethodListSkeleton matches snapshot 1`] = `
               pointerEvents="none"
               style={
                 {
-                  "backgroundColor": "#686e7d",
+                  "backgroundColor": "#66676a",
                   "borderRadius": 4,
                   "bottom": 0,
                   "left": 0,
@@ -1057,7 +1057,7 @@ exports[`PaymentMethodListSkeleton matches snapshot 1`] = `
                 pointerEvents="none"
                 style={
                   {
-                    "backgroundColor": "#686e7d",
+                    "backgroundColor": "#66676a",
                     "borderRadius": 4,
                     "bottom": 0,
                     "left": 0,
@@ -1084,7 +1084,7 @@ exports[`PaymentMethodListSkeleton matches snapshot 1`] = `
                 pointerEvents="none"
                 style={
                   {
-                    "backgroundColor": "#686e7d",
+                    "backgroundColor": "#66676a",
                     "borderRadius": 4,
                     "bottom": 0,
                     "left": 0,
@@ -1141,7 +1141,7 @@ exports[`PaymentMethodListSkeleton matches snapshot 1`] = `
                 pointerEvents="none"
                 style={
                   {
-                    "backgroundColor": "#686e7d",
+                    "backgroundColor": "#66676a",
                     "borderRadius": 4,
                     "bottom": 0,
                     "left": 0,
@@ -1175,7 +1175,7 @@ exports[`PaymentMethodListSkeleton matches snapshot 1`] = `
                 pointerEvents="none"
                 style={
                   {
-                    "backgroundColor": "#686e7d",
+                    "backgroundColor": "#66676a",
                     "borderRadius": 4,
                     "bottom": 0,
                     "left": 0,
@@ -1243,7 +1243,7 @@ exports[`PaymentMethodListSkeleton matches snapshot 1`] = `
               pointerEvents="none"
               style={
                 {
-                  "backgroundColor": "#686e7d",
+                  "backgroundColor": "#66676a",
                   "borderRadius": 4,
                   "bottom": 0,
                   "left": 0,
@@ -1295,7 +1295,7 @@ exports[`PaymentMethodListSkeleton matches snapshot 1`] = `
                 pointerEvents="none"
                 style={
                   {
-                    "backgroundColor": "#686e7d",
+                    "backgroundColor": "#66676a",
                     "borderRadius": 4,
                     "bottom": 0,
                     "left": 0,
@@ -1322,7 +1322,7 @@ exports[`PaymentMethodListSkeleton matches snapshot 1`] = `
                 pointerEvents="none"
                 style={
                   {
-                    "backgroundColor": "#686e7d",
+                    "backgroundColor": "#66676a",
                     "borderRadius": 4,
                     "bottom": 0,
                     "left": 0,
@@ -1379,7 +1379,7 @@ exports[`PaymentMethodListSkeleton matches snapshot 1`] = `
                 pointerEvents="none"
                 style={
                   {
-                    "backgroundColor": "#686e7d",
+                    "backgroundColor": "#66676a",
                     "borderRadius": 4,
                     "bottom": 0,
                     "left": 0,
@@ -1413,7 +1413,7 @@ exports[`PaymentMethodListSkeleton matches snapshot 1`] = `
                 pointerEvents="none"
                 style={
                   {
-                    "backgroundColor": "#686e7d",
+                    "backgroundColor": "#66676a",
                     "borderRadius": 4,
                     "bottom": 0,
                     "left": 0,
@@ -1481,7 +1481,7 @@ exports[`PaymentMethodListSkeleton matches snapshot 1`] = `
               pointerEvents="none"
               style={
                 {
-                  "backgroundColor": "#686e7d",
+                  "backgroundColor": "#66676a",
                   "borderRadius": 4,
                   "bottom": 0,
                   "left": 0,
@@ -1533,7 +1533,7 @@ exports[`PaymentMethodListSkeleton matches snapshot 1`] = `
                 pointerEvents="none"
                 style={
                   {
-                    "backgroundColor": "#686e7d",
+                    "backgroundColor": "#66676a",
                     "borderRadius": 4,
                     "bottom": 0,
                     "left": 0,
@@ -1560,7 +1560,7 @@ exports[`PaymentMethodListSkeleton matches snapshot 1`] = `
                 pointerEvents="none"
                 style={
                   {
-                    "backgroundColor": "#686e7d",
+                    "backgroundColor": "#66676a",
                     "borderRadius": 4,
                     "bottom": 0,
                     "left": 0,
@@ -1617,7 +1617,7 @@ exports[`PaymentMethodListSkeleton matches snapshot 1`] = `
                 pointerEvents="none"
                 style={
                   {
-                    "backgroundColor": "#686e7d",
+                    "backgroundColor": "#66676a",
                     "borderRadius": 4,
                     "bottom": 0,
                     "left": 0,
@@ -1651,7 +1651,7 @@ exports[`PaymentMethodListSkeleton matches snapshot 1`] = `
                 pointerEvents="none"
                 style={
                   {
-                    "backgroundColor": "#686e7d",
+                    "backgroundColor": "#66676a",
                     "borderRadius": 4,
                     "bottom": 0,
                     "left": 0,
@@ -1719,7 +1719,7 @@ exports[`PaymentMethodListSkeleton matches snapshot 1`] = `
               pointerEvents="none"
               style={
                 {
-                  "backgroundColor": "#686e7d",
+                  "backgroundColor": "#66676a",
                   "borderRadius": 4,
                   "bottom": 0,
                   "left": 0,
@@ -1771,7 +1771,7 @@ exports[`PaymentMethodListSkeleton matches snapshot 1`] = `
                 pointerEvents="none"
                 style={
                   {
-                    "backgroundColor": "#686e7d",
+                    "backgroundColor": "#66676a",
                     "borderRadius": 4,
                     "bottom": 0,
                     "left": 0,
@@ -1798,7 +1798,7 @@ exports[`PaymentMethodListSkeleton matches snapshot 1`] = `
                 pointerEvents="none"
                 style={
                   {
-                    "backgroundColor": "#686e7d",
+                    "backgroundColor": "#66676a",
                     "borderRadius": 4,
                     "bottom": 0,
                     "left": 0,
@@ -1855,7 +1855,7 @@ exports[`PaymentMethodListSkeleton matches snapshot 1`] = `
                 pointerEvents="none"
                 style={
                   {
-                    "backgroundColor": "#686e7d",
+                    "backgroundColor": "#66676a",
                     "borderRadius": 4,
                     "bottom": 0,
                     "left": 0,
@@ -1889,7 +1889,7 @@ exports[`PaymentMethodListSkeleton matches snapshot 1`] = `
                 pointerEvents="none"
                 style={
                   {
-                    "backgroundColor": "#686e7d",
+                    "backgroundColor": "#66676a",
                     "borderRadius": 4,
                     "bottom": 0,
                     "left": 0,
diff --git a/app/components/UI/Ramp/Views/Modals/PaymentSelectionModal/__snapshots__/PaymentSelectionAlert.test.tsx.snap b/app/components/UI/Ramp/Views/Modals/PaymentSelectionModal/__snapshots__/PaymentSelectionAlert.test.tsx.snap
index 21e3dec182e2..e596edd5bdeb 100644
--- a/app/components/UI/Ramp/Views/Modals/PaymentSelectionModal/__snapshots__/PaymentSelectionAlert.test.tsx.snap
+++ b/app/components/UI/Ramp/Views/Modals/PaymentSelectionModal/__snapshots__/PaymentSelectionAlert.test.tsx.snap
@@ -47,7 +47,7 @@ exports[`PaymentSelectionAlert matches snapshot with default severity 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 14,
           "letterSpacing": 0,
@@ -108,7 +108,7 @@ exports[`PaymentSelectionAlert matches snapshot with warning severity 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 14,
           "letterSpacing": 0,
diff --git a/app/components/UI/Ramp/Views/Modals/PaymentSelectionModal/__snapshots__/PaymentSelectionModal.test.tsx.snap b/app/components/UI/Ramp/Views/Modals/PaymentSelectionModal/__snapshots__/PaymentSelectionModal.test.tsx.snap
index 0308729f056d..a17341219114 100644
--- a/app/components/UI/Ramp/Views/Modals/PaymentSelectionModal/__snapshots__/PaymentSelectionModal.test.tsx.snap
+++ b/app/components/UI/Ramp/Views/Modals/PaymentSelectionModal/__snapshots__/PaymentSelectionModal.test.tsx.snap
@@ -348,9 +348,9 @@ exports[`PaymentSelectionModal matches snapshot 1`] = `
                             accessibilityRole="text"
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Bold",
-                                "fontSize": 18,
+                                "fontSize": 20,
                                 "letterSpacing": 0,
                                 "lineHeight": 24,
                               }
@@ -464,7 +464,7 @@ exports[`PaymentSelectionModal matches snapshot 1`] = `
                                           [
                                             {
                                               "alignItems": "center",
-                                              "backgroundColor": "#3c4d9d0f",
+                                              "backgroundColor": "#b4b4b528",
                                               "borderRadius": 22,
                                               "height": 44,
                                               "justifyContent": "center",
@@ -520,9 +520,9 @@ exports[`PaymentSelectionModal matches snapshot 1`] = `
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Medium",
-                                            "fontSize": 18,
+                                            "fontSize": 20,
                                             "letterSpacing": 0,
                                             "lineHeight": 24,
                                           }
@@ -555,7 +555,7 @@ exports[`PaymentSelectionModal matches snapshot 1`] = `
                                   accessible={true}
                                   style={
                                     {
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "bottom": 0,
                                       "flexDirection": "row",
                                       "left": 0,
@@ -616,7 +616,7 @@ exports[`PaymentSelectionModal matches snapshot 1`] = `
                                           [
                                             {
                                               "alignItems": "center",
-                                              "backgroundColor": "#3c4d9d0f",
+                                              "backgroundColor": "#b4b4b528",
                                               "borderRadius": 22,
                                               "height": 44,
                                               "justifyContent": "center",
@@ -632,7 +632,7 @@ exports[`PaymentSelectionModal matches snapshot 1`] = `
                                           style={
                                             [
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontSize": 24,
                                               },
                                               undefined,
@@ -670,9 +670,9 @@ exports[`PaymentSelectionModal matches snapshot 1`] = `
                                         accessibilityRole="text"
                                         style={
                                           {
-                                            "color": "#121314",
+                                            "color": "#131416",
                                             "fontFamily": "Geist-Medium",
-                                            "fontSize": 18,
+                                            "fontSize": 20,
                                             "letterSpacing": 0,
                                             "lineHeight": 24,
                                           }
@@ -726,7 +726,7 @@ exports[`PaymentSelectionModal matches snapshot 1`] = `
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#686e7d",
+                              "color": "#66676a",
                               "fontFamily": "Geist-Regular",
                               "fontSize": 14,
                               "letterSpacing": 0,
@@ -1114,9 +1114,9 @@ exports[`PaymentSelectionModal matches snapshot when no payment methods are avai
                             accessibilityRole="text"
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Bold",
-                                "fontSize": 18,
+                                "fontSize": 20,
                                 "letterSpacing": 0,
                                 "lineHeight": 24,
                               }
@@ -1186,7 +1186,7 @@ exports[`PaymentSelectionModal matches snapshot when no payment methods are avai
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 14,
                                       "letterSpacing": 0,
@@ -1222,7 +1222,7 @@ exports[`PaymentSelectionModal matches snapshot when no payment methods are avai
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#686e7d",
+                              "color": "#66676a",
                               "fontFamily": "Geist-Regular",
                               "fontSize": 14,
                               "letterSpacing": 0,
@@ -1610,9 +1610,9 @@ exports[`PaymentSelectionModal matches snapshot when payment methods are loading
                             accessibilityRole="text"
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Bold",
-                                "fontSize": 18,
+                                "fontSize": 20,
                                 "letterSpacing": 0,
                                 "lineHeight": 24,
                               }
@@ -1681,7 +1681,7 @@ exports[`PaymentSelectionModal matches snapshot when payment methods are loading
                                         pointerEvents="none"
                                         style={
                                           {
-                                            "backgroundColor": "#686e7d",
+                                            "backgroundColor": "#66676a",
                                             "borderRadius": 4,
                                             "bottom": 0,
                                             "left": 0,
@@ -1733,7 +1733,7 @@ exports[`PaymentSelectionModal matches snapshot when payment methods are loading
                                           pointerEvents="none"
                                           style={
                                             {
-                                              "backgroundColor": "#686e7d",
+                                              "backgroundColor": "#66676a",
                                               "borderRadius": 4,
                                               "bottom": 0,
                                               "left": 0,
@@ -1760,7 +1760,7 @@ exports[`PaymentSelectionModal matches snapshot when payment methods are loading
                                           pointerEvents="none"
                                           style={
                                             {
-                                              "backgroundColor": "#686e7d",
+                                              "backgroundColor": "#66676a",
                                               "borderRadius": 4,
                                               "bottom": 0,
                                               "left": 0,
@@ -1817,7 +1817,7 @@ exports[`PaymentSelectionModal matches snapshot when payment methods are loading
                                           pointerEvents="none"
                                           style={
                                             {
-                                              "backgroundColor": "#686e7d",
+                                              "backgroundColor": "#66676a",
                                               "borderRadius": 4,
                                               "bottom": 0,
                                               "left": 0,
@@ -1851,7 +1851,7 @@ exports[`PaymentSelectionModal matches snapshot when payment methods are loading
                                           pointerEvents="none"
                                           style={
                                             {
-                                              "backgroundColor": "#686e7d",
+                                              "backgroundColor": "#66676a",
                                               "borderRadius": 4,
                                               "bottom": 0,
                                               "left": 0,
@@ -1919,7 +1919,7 @@ exports[`PaymentSelectionModal matches snapshot when payment methods are loading
                                         pointerEvents="none"
                                         style={
                                           {
-                                            "backgroundColor": "#686e7d",
+                                            "backgroundColor": "#66676a",
                                             "borderRadius": 4,
                                             "bottom": 0,
                                             "left": 0,
@@ -1971,7 +1971,7 @@ exports[`PaymentSelectionModal matches snapshot when payment methods are loading
                                           pointerEvents="none"
                                           style={
                                             {
-                                              "backgroundColor": "#686e7d",
+                                              "backgroundColor": "#66676a",
                                               "borderRadius": 4,
                                               "bottom": 0,
                                               "left": 0,
@@ -1998,7 +1998,7 @@ exports[`PaymentSelectionModal matches snapshot when payment methods are loading
                                           pointerEvents="none"
                                           style={
                                             {
-                                              "backgroundColor": "#686e7d",
+                                              "backgroundColor": "#66676a",
                                               "borderRadius": 4,
                                               "bottom": 0,
                                               "left": 0,
@@ -2055,7 +2055,7 @@ exports[`PaymentSelectionModal matches snapshot when payment methods are loading
                                           pointerEvents="none"
                                           style={
                                             {
-                                              "backgroundColor": "#686e7d",
+                                              "backgroundColor": "#66676a",
                                               "borderRadius": 4,
                                               "bottom": 0,
                                               "left": 0,
@@ -2089,7 +2089,7 @@ exports[`PaymentSelectionModal matches snapshot when payment methods are loading
                                           pointerEvents="none"
                                           style={
                                             {
-                                              "backgroundColor": "#686e7d",
+                                              "backgroundColor": "#66676a",
                                               "borderRadius": 4,
                                               "bottom": 0,
                                               "left": 0,
@@ -2157,7 +2157,7 @@ exports[`PaymentSelectionModal matches snapshot when payment methods are loading
                                         pointerEvents="none"
                                         style={
                                           {
-                                            "backgroundColor": "#686e7d",
+                                            "backgroundColor": "#66676a",
                                             "borderRadius": 4,
                                             "bottom": 0,
                                             "left": 0,
@@ -2209,7 +2209,7 @@ exports[`PaymentSelectionModal matches snapshot when payment methods are loading
                                           pointerEvents="none"
                                           style={
                                             {
-                                              "backgroundColor": "#686e7d",
+                                              "backgroundColor": "#66676a",
                                               "borderRadius": 4,
                                               "bottom": 0,
                                               "left": 0,
@@ -2236,7 +2236,7 @@ exports[`PaymentSelectionModal matches snapshot when payment methods are loading
                                           pointerEvents="none"
                                           style={
                                             {
-                                              "backgroundColor": "#686e7d",
+                                              "backgroundColor": "#66676a",
                                               "borderRadius": 4,
                                               "bottom": 0,
                                               "left": 0,
@@ -2293,7 +2293,7 @@ exports[`PaymentSelectionModal matches snapshot when payment methods are loading
                                           pointerEvents="none"
                                           style={
                                             {
-                                              "backgroundColor": "#686e7d",
+                                              "backgroundColor": "#66676a",
                                               "borderRadius": 4,
                                               "bottom": 0,
                                               "left": 0,
@@ -2327,7 +2327,7 @@ exports[`PaymentSelectionModal matches snapshot when payment methods are loading
                                           pointerEvents="none"
                                           style={
                                             {
-                                              "backgroundColor": "#686e7d",
+                                              "backgroundColor": "#66676a",
                                               "borderRadius": 4,
                                               "bottom": 0,
                                               "left": 0,
@@ -2395,7 +2395,7 @@ exports[`PaymentSelectionModal matches snapshot when payment methods are loading
                                         pointerEvents="none"
                                         style={
                                           {
-                                            "backgroundColor": "#686e7d",
+                                            "backgroundColor": "#66676a",
                                             "borderRadius": 4,
                                             "bottom": 0,
                                             "left": 0,
@@ -2447,7 +2447,7 @@ exports[`PaymentSelectionModal matches snapshot when payment methods are loading
                                           pointerEvents="none"
                                           style={
                                             {
-                                              "backgroundColor": "#686e7d",
+                                              "backgroundColor": "#66676a",
                                               "borderRadius": 4,
                                               "bottom": 0,
                                               "left": 0,
@@ -2474,7 +2474,7 @@ exports[`PaymentSelectionModal matches snapshot when payment methods are loading
                                           pointerEvents="none"
                                           style={
                                             {
-                                              "backgroundColor": "#686e7d",
+                                              "backgroundColor": "#66676a",
                                               "borderRadius": 4,
                                               "bottom": 0,
                                               "left": 0,
@@ -2531,7 +2531,7 @@ exports[`PaymentSelectionModal matches snapshot when payment methods are loading
                                           pointerEvents="none"
                                           style={
                                             {
-                                              "backgroundColor": "#686e7d",
+                                              "backgroundColor": "#66676a",
                                               "borderRadius": 4,
                                               "bottom": 0,
                                               "left": 0,
@@ -2565,7 +2565,7 @@ exports[`PaymentSelectionModal matches snapshot when payment methods are loading
                                           pointerEvents="none"
                                           style={
                                             {
-                                              "backgroundColor": "#686e7d",
+                                              "backgroundColor": "#66676a",
                                               "borderRadius": 4,
                                               "bottom": 0,
                                               "left": 0,
@@ -2633,7 +2633,7 @@ exports[`PaymentSelectionModal matches snapshot when payment methods are loading
                                         pointerEvents="none"
                                         style={
                                           {
-                                            "backgroundColor": "#686e7d",
+                                            "backgroundColor": "#66676a",
                                             "borderRadius": 4,
                                             "bottom": 0,
                                             "left": 0,
@@ -2685,7 +2685,7 @@ exports[`PaymentSelectionModal matches snapshot when payment methods are loading
                                           pointerEvents="none"
                                           style={
                                             {
-                                              "backgroundColor": "#686e7d",
+                                              "backgroundColor": "#66676a",
                                               "borderRadius": 4,
                                               "bottom": 0,
                                               "left": 0,
@@ -2712,7 +2712,7 @@ exports[`PaymentSelectionModal matches snapshot when payment methods are loading
                                           pointerEvents="none"
                                           style={
                                             {
-                                              "backgroundColor": "#686e7d",
+                                              "backgroundColor": "#66676a",
                                               "borderRadius": 4,
                                               "bottom": 0,
                                               "left": 0,
@@ -2769,7 +2769,7 @@ exports[`PaymentSelectionModal matches snapshot when payment methods are loading
                                           pointerEvents="none"
                                           style={
                                             {
-                                              "backgroundColor": "#686e7d",
+                                              "backgroundColor": "#66676a",
                                               "borderRadius": 4,
                                               "bottom": 0,
                                               "left": 0,
@@ -2803,7 +2803,7 @@ exports[`PaymentSelectionModal matches snapshot when payment methods are loading
                                           pointerEvents="none"
                                           style={
                                             {
-                                              "backgroundColor": "#686e7d",
+                                              "backgroundColor": "#66676a",
                                               "borderRadius": 4,
                                               "bottom": 0,
                                               "left": 0,
@@ -2871,7 +2871,7 @@ exports[`PaymentSelectionModal matches snapshot when payment methods are loading
                                         pointerEvents="none"
                                         style={
                                           {
-                                            "backgroundColor": "#686e7d",
+                                            "backgroundColor": "#66676a",
                                             "borderRadius": 4,
                                             "bottom": 0,
                                             "left": 0,
@@ -2923,7 +2923,7 @@ exports[`PaymentSelectionModal matches snapshot when payment methods are loading
                                           pointerEvents="none"
                                           style={
                                             {
-                                              "backgroundColor": "#686e7d",
+                                              "backgroundColor": "#66676a",
                                               "borderRadius": 4,
                                               "bottom": 0,
                                               "left": 0,
@@ -2950,7 +2950,7 @@ exports[`PaymentSelectionModal matches snapshot when payment methods are loading
                                           pointerEvents="none"
                                           style={
                                             {
-                                              "backgroundColor": "#686e7d",
+                                              "backgroundColor": "#66676a",
                                               "borderRadius": 4,
                                               "bottom": 0,
                                               "left": 0,
@@ -3007,7 +3007,7 @@ exports[`PaymentSelectionModal matches snapshot when payment methods are loading
                                           pointerEvents="none"
                                           style={
                                             {
-                                              "backgroundColor": "#686e7d",
+                                              "backgroundColor": "#66676a",
                                               "borderRadius": 4,
                                               "bottom": 0,
                                               "left": 0,
@@ -3041,7 +3041,7 @@ exports[`PaymentSelectionModal matches snapshot when payment methods are loading
                                           pointerEvents="none"
                                           style={
                                             {
-                                              "backgroundColor": "#686e7d",
+                                              "backgroundColor": "#66676a",
                                               "borderRadius": 4,
                                               "bottom": 0,
                                               "left": 0,
@@ -3109,7 +3109,7 @@ exports[`PaymentSelectionModal matches snapshot when payment methods are loading
                                         pointerEvents="none"
                                         style={
                                           {
-                                            "backgroundColor": "#686e7d",
+                                            "backgroundColor": "#66676a",
                                             "borderRadius": 4,
                                             "bottom": 0,
                                             "left": 0,
@@ -3161,7 +3161,7 @@ exports[`PaymentSelectionModal matches snapshot when payment methods are loading
                                           pointerEvents="none"
                                           style={
                                             {
-                                              "backgroundColor": "#686e7d",
+                                              "backgroundColor": "#66676a",
                                               "borderRadius": 4,
                                               "bottom": 0,
                                               "left": 0,
@@ -3188,7 +3188,7 @@ exports[`PaymentSelectionModal matches snapshot when payment methods are loading
                                           pointerEvents="none"
                                           style={
                                             {
-                                              "backgroundColor": "#686e7d",
+                                              "backgroundColor": "#66676a",
                                               "borderRadius": 4,
                                               "bottom": 0,
                                               "left": 0,
@@ -3245,7 +3245,7 @@ exports[`PaymentSelectionModal matches snapshot when payment methods are loading
                                           pointerEvents="none"
                                           style={
                                             {
-                                              "backgroundColor": "#686e7d",
+                                              "backgroundColor": "#66676a",
                                               "borderRadius": 4,
                                               "bottom": 0,
                                               "left": 0,
@@ -3279,7 +3279,7 @@ exports[`PaymentSelectionModal matches snapshot when payment methods are loading
                                           pointerEvents="none"
                                           style={
                                             {
-                                              "backgroundColor": "#686e7d",
+                                              "backgroundColor": "#66676a",
                                               "borderRadius": 4,
                                               "bottom": 0,
                                               "left": 0,
@@ -3347,7 +3347,7 @@ exports[`PaymentSelectionModal matches snapshot when payment methods are loading
                                         pointerEvents="none"
                                         style={
                                           {
-                                            "backgroundColor": "#686e7d",
+                                            "backgroundColor": "#66676a",
                                             "borderRadius": 4,
                                             "bottom": 0,
                                             "left": 0,
@@ -3399,7 +3399,7 @@ exports[`PaymentSelectionModal matches snapshot when payment methods are loading
                                           pointerEvents="none"
                                           style={
                                             {
-                                              "backgroundColor": "#686e7d",
+                                              "backgroundColor": "#66676a",
                                               "borderRadius": 4,
                                               "bottom": 0,
                                               "left": 0,
@@ -3426,7 +3426,7 @@ exports[`PaymentSelectionModal matches snapshot when payment methods are loading
                                           pointerEvents="none"
                                           style={
                                             {
-                                              "backgroundColor": "#686e7d",
+                                              "backgroundColor": "#66676a",
                                               "borderRadius": 4,
                                               "bottom": 0,
                                               "left": 0,
@@ -3483,7 +3483,7 @@ exports[`PaymentSelectionModal matches snapshot when payment methods are loading
                                           pointerEvents="none"
                                           style={
                                             {
-                                              "backgroundColor": "#686e7d",
+                                              "backgroundColor": "#66676a",
                                               "borderRadius": 4,
                                               "bottom": 0,
                                               "left": 0,
@@ -3517,7 +3517,7 @@ exports[`PaymentSelectionModal matches snapshot when payment methods are loading
                                           pointerEvents="none"
                                           style={
                                             {
-                                              "backgroundColor": "#686e7d",
+                                              "backgroundColor": "#66676a",
                                               "borderRadius": 4,
                                               "bottom": 0,
                                               "left": 0,
@@ -3898,9 +3898,9 @@ exports[`PaymentSelectionModal matches snapshot when payment methods fail to loa
                             accessibilityRole="text"
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Bold",
-                                "fontSize": 18,
+                                "fontSize": 20,
                                 "letterSpacing": 0,
                                 "lineHeight": 24,
                               }
@@ -3970,7 +3970,7 @@ exports[`PaymentSelectionModal matches snapshot when payment methods fail to loa
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 14,
                                       "letterSpacing": 0,
@@ -4006,7 +4006,7 @@ exports[`PaymentSelectionModal matches snapshot when payment methods fail to loa
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#686e7d",
+                              "color": "#66676a",
                               "fontFamily": "Geist-Regular",
                               "fontSize": 14,
                               "letterSpacing": 0,
@@ -4020,7 +4020,7 @@ exports[`PaymentSelectionModal matches snapshot when payment methods fail to loa
                             accessibilityRole="text"
                             style={
                               {
-                                "color": "#686e7d",
+                                "color": "#66676a",
                                 "fontFamily": "Geist-Regular",
                                 "fontSize": 14,
                                 "letterSpacing": 0,
diff --git a/app/components/UI/Ramp/Views/Modals/PaymentSelectionModal/__snapshots__/QuoteDisplay.test.tsx.snap b/app/components/UI/Ramp/Views/Modals/PaymentSelectionModal/__snapshots__/QuoteDisplay.test.tsx.snap
index 3c034660e31d..e661ece54289 100644
--- a/app/components/UI/Ramp/Views/Modals/PaymentSelectionModal/__snapshots__/QuoteDisplay.test.tsx.snap
+++ b/app/components/UI/Ramp/Views/Modals/PaymentSelectionModal/__snapshots__/QuoteDisplay.test.tsx.snap
@@ -57,7 +57,7 @@ exports[`QuoteDisplay matches snapshot when quote is unavailable 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#686e7d",
+        "color": "#66676a",
         "fontFamily": "Geist-Regular",
         "fontSize": 14,
         "letterSpacing": 0,
@@ -86,7 +86,7 @@ exports[`QuoteDisplay matches snapshot with crypto and fiat 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Medium",
         "fontSize": 16,
         "letterSpacing": 0,
@@ -100,7 +100,7 @@ exports[`QuoteDisplay matches snapshot with crypto and fiat 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#686e7d",
+        "color": "#66676a",
         "fontFamily": "Geist-Regular",
         "fontSize": 14,
         "letterSpacing": 0,
@@ -129,7 +129,7 @@ exports[`QuoteDisplay matches snapshot with crypto only 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Medium",
         "fontSize": 16,
         "letterSpacing": 0,
diff --git a/app/components/UI/Ramp/Views/Modals/ProcessingInfoModal/ProcessingInfoModal.tsx b/app/components/UI/Ramp/Views/Modals/ProcessingInfoModal/ProcessingInfoModal.tsx
index d7a6f92d308b..9ed3df801088 100644
--- a/app/components/UI/Ramp/Views/Modals/ProcessingInfoModal/ProcessingInfoModal.tsx
+++ b/app/components/UI/Ramp/Views/Modals/ProcessingInfoModal/ProcessingInfoModal.tsx
@@ -21,6 +21,8 @@ import {
 } from '../../../../../../util/navigation/navUtils';
 import Routes from '../../../../../../constants/navigation/Routes';
 import { useNavigation } from '@react-navigation/native';
+import { useAnalytics } from '../../../../../hooks/useAnalytics/useAnalytics';
+import { MetaMetricsEvents } from '../../../../../../core/Analytics';
 
 export interface ProcessingInfoModalParams {
   providerName: string;
@@ -34,6 +36,7 @@ export const createProcessingInfoModalNavigationDetails =
   );
 
 function ProcessingInfoModal() {
+  const { trackEvent, createEventBuilder } = useAnalytics();
   const sheetRef = useRef<BottomSheetRef>(null);
   const navigation = useNavigation();
   const { providerName, providerSupportUrl, statusDescription } =
@@ -45,6 +48,22 @@ function ProcessingInfoModal() {
 
   const handleGoToSupport = useCallback(async () => {
     if (!providerSupportUrl) return;
+    let urlDomain: string | undefined;
+    try {
+      urlDomain = new URL(providerSupportUrl).hostname;
+    } catch {
+      urlDomain = providerSupportUrl;
+    }
+    trackEvent(
+      createEventBuilder(MetaMetricsEvents.RAMPS_EXTERNAL_LINK_CLICKED)
+        .addProperties({
+          location: 'Order Details',
+          external_link_description: 'Provider Support',
+          url_domain: urlDomain,
+          ramp_type: 'UNIFIED_BUY_2',
+        })
+        .build(),
+    );
     if (await InAppBrowser.isAvailable()) {
       // Close the sheet before the InAppBrowser overlay opens so the two don't overlap.
       handleClose();
@@ -61,7 +80,14 @@ function ProcessingInfoModal() {
         },
       });
     }
-  }, [providerSupportUrl, providerName, handleClose, navigation]);
+  }, [
+    providerSupportUrl,
+    providerName,
+    handleClose,
+    navigation,
+    trackEvent,
+    createEventBuilder,
+  ]);
 
   return (
     <BottomSheet
diff --git a/app/components/UI/Ramp/Views/Modals/ProcessingInfoModal/__snapshots__/ProcessingInfoModal.test.tsx.snap b/app/components/UI/Ramp/Views/Modals/ProcessingInfoModal/__snapshots__/ProcessingInfoModal.test.tsx.snap
index 638b011fee0a..81760c3438a0 100644
--- a/app/components/UI/Ramp/Views/Modals/ProcessingInfoModal/__snapshots__/ProcessingInfoModal.test.tsx.snap
+++ b/app/components/UI/Ramp/Views/Modals/ProcessingInfoModal/__snapshots__/ProcessingInfoModal.test.tsx.snap
@@ -24,7 +24,7 @@ exports[`ProcessingInfoModal renders correctly 1`] = `
     style={
       [
         {
-          "backgroundColor": "#3f434a66",
+          "backgroundColor": "#0a0d135c",
           "bottom": 0,
           "left": 0,
           "position": "absolute",
@@ -74,7 +74,7 @@ exports[`ProcessingInfoModal renders correctly 1`] = `
         [
           {
             "backgroundColor": "#ffffff",
-            "borderColor": "#b7bbc866",
+            "borderColor": "#b4b4b566",
             "borderTopLeftRadius": 24,
             "borderTopRightRadius": 24,
             "borderWidth": 1,
@@ -159,7 +159,7 @@ exports[`ProcessingInfoModal renders correctly 1`] = `
               testID="processing-info-modal-close-button"
             >
               <SvgMock
-                color="#121314"
+                color="#131416"
                 fill="currentColor"
                 height={24}
                 name="Close"
@@ -192,7 +192,7 @@ exports[`ProcessingInfoModal renders correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -227,7 +227,7 @@ exports[`ProcessingInfoModal renders correctly 1`] = `
             {
               "alignItems": "center",
               "alignSelf": "stretch",
-              "backgroundColor": "#3c4d9d0f",
+              "backgroundColor": "#b4b4b528",
               "borderColor": "transparent",
               "borderRadius": 12,
               "borderWidth": 1,
@@ -243,7 +243,7 @@ exports[`ProcessingInfoModal renders correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Medium",
                 "fontSize": 16,
                 "letterSpacing": 0,
diff --git a/app/components/UI/Ramp/Views/Modals/ProviderSelectionModal/ProviderSelection.test.tsx b/app/components/UI/Ramp/Views/Modals/ProviderSelectionModal/ProviderSelection.test.tsx
index cc496506ae78..1f6237ce3658 100644
--- a/app/components/UI/Ramp/Views/Modals/ProviderSelectionModal/ProviderSelection.test.tsx
+++ b/app/components/UI/Ramp/Views/Modals/ProviderSelectionModal/ProviderSelection.test.tsx
@@ -63,6 +63,12 @@ const defaultMockController: UseRampsControllerResult = {
   paymentMethodsError: null,
   getQuotes: jest.fn(),
   getWidgetUrl: jest.fn(),
+  orders: [],
+  getOrderById: jest.fn(),
+  addOrder: jest.fn(),
+  removeOrder: jest.fn(),
+  refreshOrder: jest.fn(),
+  getOrderFromCallback: jest.fn(),
 };
 
 const transakProvider: Provider = {
@@ -106,6 +112,7 @@ interface RenderOptions {
   quotes?: QuotesResponse | null;
   quotesLoading?: boolean;
   quotesError?: string | null;
+  showQuotes?: boolean;
 }
 
 function renderWithProvider(
@@ -113,7 +120,12 @@ function renderWithProvider(
   selectedProvider: Provider | null = mockProviders[0],
   options: RenderOptions = {},
 ) {
-  const { quotes = null, quotesLoading = false, quotesError = null } = options;
+  const {
+    quotes = null,
+    quotesLoading = false,
+    quotesError = null,
+    showQuotes,
+  } = options;
 
   jest.mocked(useRampsController).mockReturnValue({
     ...defaultMockController,
@@ -128,6 +140,7 @@ function renderWithProvider(
         quotesError={quotesError}
         onProviderSelect={jest.fn()}
         onBack={mockOnBack}
+        {...(showQuotes !== undefined && { showQuotes })}
       />
     ),
     {
@@ -170,7 +183,7 @@ describe('ProviderSelection', () => {
     expect(toJSON()).toMatchSnapshot();
   });
 
-  it('renders providers immediately when quotes are loading', () => {
+  it('renders skeleton loading state when quotes are loading', () => {
     jest.mocked(useRampsController).mockReturnValue({
       ...defaultMockController,
       userRegion: mockUserRegion,
@@ -178,10 +191,14 @@ describe('ProviderSelection', () => {
       providers: mockProviders,
       selectedProvider: mockProviders[0],
     });
-    const { getByText } = renderWithProvider(mockProviders, mockProviders[0], {
-      quotesLoading: true,
-    });
-    expect(getByText('Transak')).toBeOnTheScreen();
+    const { queryByText } = renderWithProvider(
+      mockProviders,
+      mockProviders[0],
+      {
+        quotesLoading: true,
+      },
+    );
+    expect(queryByText('Transak')).toBeNull();
   });
 
   it('matches snapshot when quotes fail to load', async () => {
@@ -210,6 +227,34 @@ describe('ProviderSelection', () => {
     expect(mockOnBack).toHaveBeenCalled();
   });
 
+  it('renders providers directly when quotes load but none are available', async () => {
+    jest.mocked(useRampsController).mockReturnValue({
+      ...defaultMockController,
+      userRegion: mockUserRegion,
+      selectedToken: mockSelectedToken,
+      providers: mockProviders,
+      selectedProvider: mockProviders[0],
+    });
+    const { toJSON, getByText } = renderWithProvider(
+      mockProviders,
+      mockProviders[0],
+      {
+        showQuotes: true,
+        quotes: {
+          success: [],
+          sorted: [],
+          error: [],
+          customActions: [],
+        },
+      },
+    );
+
+    await waitFor(() => {
+      expect(getByText('Transak')).toBeOnTheScreen();
+    });
+    expect(toJSON()).toMatchSnapshot();
+  });
+
   it('filters out quotes for providers not in the providers array', async () => {
     const transakQuote = createMockQuote('/providers/transak', 'Transak');
     const stripeQuote = createMockQuote('/providers/stripe', 'Stripe');
diff --git a/app/components/UI/Ramp/Views/Modals/ProviderSelectionModal/ProviderSelection.tsx b/app/components/UI/Ramp/Views/Modals/ProviderSelectionModal/ProviderSelection.tsx
index e701f5d98fac..e21facaca68e 100644
--- a/app/components/UI/Ramp/Views/Modals/ProviderSelectionModal/ProviderSelection.tsx
+++ b/app/components/UI/Ramp/Views/Modals/ProviderSelectionModal/ProviderSelection.tsx
@@ -1,16 +1,23 @@
-import React, { useCallback } from 'react';
+import React, { useCallback, useMemo } from 'react';
 import { StyleSheet } from 'react-native';
 import { FlatList } from 'react-native-gesture-handler';
-import { Box } from '@metamask/design-system-react-native';
+import {
+  Box,
+  BoxAlignItems,
+  BoxFlexDirection,
+  BoxJustifyContent,
+  Text,
+  TextVariant,
+  TextColor,
+  FontWeight,
+} from '@metamask/design-system-react-native';
+import { PaymentType } from '@consensys/on-ramp-sdk';
 import HeaderCompactStandard from '../../../../../../component-library/components-temp/HeaderCompactStandard';
 import ListItemSelect from '../../../../../../component-library/components/List/ListItemSelect';
 import ListItemColumn, {
   WidthType,
 } from '../../../../../../component-library/components/List/ListItemColumn';
-import Text, {
-  TextColor,
-  TextVariant,
-} from '../../../../../../component-library/components/Texts/Text';
+import { Skeleton } from '../../../../../../component-library/components/Skeleton';
 import type {
   Provider,
   Quote,
@@ -21,10 +28,17 @@ import { useRampsController } from '../../../hooks/useRampsController';
 import { useFormatters } from '../../../../../hooks/useFormatters';
 import QuoteDisplay from '../PaymentSelectionModal/QuoteDisplay';
 import PaymentSelectionAlert from '../PaymentSelectionModal/PaymentSelectionAlert';
+import PaymentMethodIcon from '../../../Aggregator/components/PaymentMethodIcon';
 import { BannerAlertSeverity } from '../../../../../../component-library/components/Banners/Banner/variants/BannerAlert/BannerAlert.types';
+import { useTheme } from '../../../../../../util/theme';
+
+const SKELETON_ROW_COUNT = 5;
+const SKELETON_NAME_WIDTH = 120;
+const SKELETON_NAME_HEIGHT = 18;
 
 const styles = StyleSheet.create({
   list: { flex: 1, minHeight: 0 },
+  skeleton: { borderRadius: 4 },
 });
 
 interface ProviderSelectionProps {
@@ -33,16 +47,112 @@ interface ProviderSelectionProps {
   quotesLoading: boolean;
   quotesError: string | null;
   showQuotes?: boolean;
+  showBackButton?: boolean;
+  ordersProviders?: string[];
   onBack: () => void;
   onProviderSelect: (provider: Provider) => void;
 }
 
+type ProviderListItem =
+  | { type: 'provider'; provider: Provider }
+  | { type: 'separator' };
+
+const ICON_CIRCLE_SIZE = 36;
+
+const PaymentMethodBanner: React.FC<{
+  paymentMethodName: string;
+  paymentType?: string;
+}> = ({ paymentMethodName, paymentType }) => {
+  const { colors } = useTheme();
+
+  return (
+    <Box
+      flexDirection={BoxFlexDirection.Row}
+      alignItems={BoxAlignItems.Center}
+      twClassName="mx-4 mt-1 mb-2 rounded-lg bg-background-muted px-3 py-3"
+    >
+      <Box
+        alignItems={BoxAlignItems.Center}
+        justifyContent={BoxJustifyContent.Center}
+        twClassName="mr-3 rounded-full bg-background-muted"
+        style={{ width: ICON_CIRCLE_SIZE, height: ICON_CIRCLE_SIZE }}
+      >
+        <PaymentMethodIcon
+          paymentMethodType={paymentType as PaymentType}
+          size={18}
+          color={colors.icon.default}
+        />
+      </Box>
+      <Text variant={TextVariant.BodyMd}>
+        {strings('fiat_on_ramp.quotes_displayed_for', {
+          paymentMethodName,
+        })}
+      </Text>
+    </Box>
+  );
+};
+
+const ProviderListSkeleton: React.FC = () => (
+  <>
+    {Array.from({ length: SKELETON_ROW_COUNT }).map((_, index) => (
+      <ListItemSelect
+        key={`provider-skeleton-${index}`}
+        isSelected={false}
+        isDisabled
+        onPress={undefined}
+      >
+        <ListItemColumn widthType={WidthType.Fill}>
+          <Skeleton
+            width={SKELETON_NAME_WIDTH}
+            height={SKELETON_NAME_HEIGHT}
+            style={styles.skeleton}
+          />
+        </ListItemColumn>
+        <ListItemColumn widthType={WidthType.Auto}>
+          <QuoteDisplay cryptoAmount="" fiatAmount={null} isLoading />
+        </ListItemColumn>
+      </ListItemSelect>
+    ))}
+  </>
+);
+
+const SeparatorItem: React.FC = () => (
+  <Box twClassName="px-4 py-3">
+    <Text
+      variant={TextVariant.BodySm}
+      color={TextColor.TextAlternative}
+      fontWeight={FontWeight.Medium}
+    >
+      {strings('fiat_on_ramp.other_options')}
+    </Text>
+  </Box>
+);
+
+function getProviderTag(
+  providerId: string,
+  matchedQuote: Quote | null,
+  ordersProviders: string[],
+): string | null {
+  if (ordersProviders.includes(providerId)) {
+    return strings('fiat_on_ramp.previously_used');
+  }
+  if (matchedQuote?.metadata?.tags?.isMostReliable) {
+    return strings('fiat_on_ramp.most_reliable');
+  }
+  if (matchedQuote?.metadata?.tags?.isBestRate) {
+    return strings('fiat_on_ramp.best_rate');
+  }
+  return null;
+}
+
 const ProviderSelection: React.FC<ProviderSelectionProps> = ({
   providers: providersOverride,
   quotes,
   quotesLoading,
   quotesError,
   showQuotes = true,
+  showBackButton = true,
+  ordersProviders = [],
   onBack,
   onProviderSelect,
 }) => {
@@ -60,6 +170,57 @@ const ProviderSelection: React.FC<ProviderSelectionProps> = ({
   const currency = userRegion?.country?.currency ?? 'USD';
   const symbol = selectedToken?.symbol ?? '';
 
+  const hasSuccessfulQuotes = (quotes?.success?.length ?? 0) > 0;
+  const displayQuotes = showQuotes && (quotesLoading || hasSuccessfulQuotes);
+
+  const sortedListItems = useMemo((): ProviderListItem[] => {
+    if (!displayQuotes || !quotes || quotesLoading) {
+      return providers.map((provider) => ({ type: 'provider', provider }));
+    }
+
+    const sortOrder =
+      quotes.sorted?.find((s) => s.sortBy === 'reliability')?.ids ??
+      quotes.sorted?.[0]?.ids;
+
+    const providersWithQuotes: Provider[] = [];
+    const providersWithoutQuotes: Provider[] = [];
+
+    for (const provider of providers) {
+      const hasQuote = quotes.success?.some((q) => q.provider === provider.id);
+      if (hasQuote) {
+        providersWithQuotes.push(provider);
+      } else {
+        providersWithoutQuotes.push(provider);
+      }
+    }
+
+    if (sortOrder) {
+      const orderMap = new Map(sortOrder.map((id, index) => [id, index]));
+      providersWithQuotes.sort(
+        (a, b) =>
+          (orderMap.get(a.id) ?? sortOrder.length) -
+          (orderMap.get(b.id) ?? sortOrder.length),
+      );
+    }
+
+    providersWithoutQuotes.sort((a, b) => a.name.localeCompare(b.name));
+
+    const items: ProviderListItem[] = providersWithQuotes.map((provider) => ({
+      type: 'provider',
+      provider,
+    }));
+
+    if (providersWithQuotes.length > 0 && providersWithoutQuotes.length > 0) {
+      items.push({ type: 'separator' });
+    }
+
+    for (const provider of providersWithoutQuotes) {
+      items.push({ type: 'provider', provider });
+    }
+
+    return items;
+  }, [providers, quotes, quotesLoading, displayQuotes]);
+
   const handleProviderSelect = useCallback(
     (provider: Provider, _matchedQuote: Quote | null) => {
       onProviderSelect(provider);
@@ -68,7 +229,12 @@ const ProviderSelection: React.FC<ProviderSelectionProps> = ({
   );
 
   const renderItem = useCallback(
-    ({ item: provider }: { item: Provider }) => {
+    ({ item }: { item: ProviderListItem }) => {
+      if (item.type === 'separator') {
+        return <SeparatorItem />;
+      }
+
+      const { provider } = item;
       const matchedQuote =
         quotes?.success?.find(
           (q) =>
@@ -91,6 +257,9 @@ const ProviderSelection: React.FC<ProviderSelectionProps> = ({
           ? formatCurrency(Number(matchedQuote.quote.amountOutInFiat), currency)
           : null;
       const isSelected = selectedProvider?.id === provider.id;
+      const tag = displayQuotes
+        ? getProviderTag(provider.id, matchedQuote, ordersProviders)
+        : null;
 
       return (
         <ListItemSelect
@@ -100,24 +269,24 @@ const ProviderSelection: React.FC<ProviderSelectionProps> = ({
           accessible
         >
           <ListItemColumn widthType={WidthType.Fill}>
-            <Text variant={TextVariant.BodyLGMedium}>{provider.name}</Text>
+            <Text variant={TextVariant.BodyLg} fontWeight={FontWeight.Medium}>
+              {provider.name}
+            </Text>
+            {tag ? (
+              <Text
+                variant={TextVariant.BodySm}
+                color={TextColor.TextAlternative}
+              >
+                {tag}
+              </Text>
+            ) : null}
           </ListItemColumn>
-          {showQuotes ? (
+          {displayQuotes && matchedQuote ? (
             <ListItemColumn widthType={WidthType.Auto}>
-              {quotesLoading ? (
-                <QuoteDisplay cryptoAmount="" fiatAmount={null} isLoading />
-              ) : matchedQuote ? (
-                <QuoteDisplay
-                  cryptoAmount={cryptoAmount}
-                  fiatAmount={fiatAmount}
-                />
-              ) : (
-                <QuoteDisplay
-                  cryptoAmount=""
-                  fiatAmount={null}
-                  quoteUnavailable
-                />
-              )}
+              <QuoteDisplay
+                cryptoAmount={cryptoAmount}
+                fiatAmount={fiatAmount}
+              />
             </ListItemColumn>
           ) : null}
         </ListItemSelect>
@@ -129,29 +298,33 @@ const ProviderSelection: React.FC<ProviderSelectionProps> = ({
       currency,
       selectedProvider,
       selectedPaymentMethod,
-      quotesLoading,
-      showQuotes,
+      displayQuotes,
+      ordersProviders,
       handleProviderSelect,
       formatToken,
       formatCurrency,
     ],
   );
 
-  const keyExtractor = useCallback((item: Provider) => item.id, []);
+  const keyExtractor = useCallback(
+    (item: ProviderListItem, index: number) =>
+      item.type === 'separator' ? `separator-${index}` : item.provider.id,
+    [],
+  );
 
   if (providers.length === 0) {
     return (
       <Box twClassName="flex-1 min-h-0">
         <HeaderCompactStandard
           title={strings('fiat_on_ramp.providers')}
-          onBack={onBack}
+          onBack={showBackButton ? onBack : undefined}
         />
         <Box twClassName="flex-1 px-4">
           <PaymentSelectionAlert
             message={
               showQuotes
                 ? strings('fiat_on_ramp.no_quotes_available')
-                : strings('fiat_on_ramp.no_providers_available')
+                : strings('fiat_on_ramp_aggregator.no_providers_available')
             }
             severity={BannerAlertSeverity.Error}
           />
@@ -164,16 +337,13 @@ const ProviderSelection: React.FC<ProviderSelectionProps> = ({
     <Box twClassName="flex-1 min-h-0">
       <HeaderCompactStandard
         title={strings('fiat_on_ramp.providers')}
-        onBack={onBack}
+        onBack={showBackButton ? onBack : undefined}
       />
-      {showQuotes && selectedPaymentMethod ? (
-        <Box twClassName="px-4 pt-1 pb-2">
-          <Text variant={TextVariant.BodySM} color={TextColor.Muted}>
-            {strings('fiat_on_ramp.quotes_displayed_for', {
-              paymentMethodName: selectedPaymentMethod.name,
-            })}
-          </Text>
-        </Box>
+      {displayQuotes && selectedPaymentMethod ? (
+        <PaymentMethodBanner
+          paymentMethodName={selectedPaymentMethod.name}
+          paymentType={selectedPaymentMethod.paymentType}
+        />
       ) : null}
       {quotesError ? (
         <Box twClassName="px-4">
@@ -183,14 +353,18 @@ const ProviderSelection: React.FC<ProviderSelectionProps> = ({
           />
         </Box>
       ) : null}
-      <FlatList
-        style={styles.list}
-        data={providers}
-        renderItem={renderItem}
-        keyExtractor={keyExtractor}
-        keyboardDismissMode="none"
-        keyboardShouldPersistTaps="always"
-      />
+      {displayQuotes && quotesLoading ? (
+        <ProviderListSkeleton />
+      ) : (
+        <FlatList
+          style={styles.list}
+          data={sortedListItems}
+          renderItem={renderItem}
+          keyExtractor={keyExtractor}
+          keyboardDismissMode="none"
+          keyboardShouldPersistTaps="always"
+        />
+      )}
     </Box>
   );
 };
diff --git a/app/components/UI/Ramp/Views/Modals/ProviderSelectionModal/ProviderSelectionModal.test.tsx b/app/components/UI/Ramp/Views/Modals/ProviderSelectionModal/ProviderSelectionModal.test.tsx
index 06db35c24264..a1c9c1d0c61c 100644
--- a/app/components/UI/Ramp/Views/Modals/ProviderSelectionModal/ProviderSelectionModal.test.tsx
+++ b/app/components/UI/Ramp/Views/Modals/ProviderSelectionModal/ProviderSelectionModal.test.tsx
@@ -14,9 +14,27 @@ const mockGetQuotes = jest.mocked(Engine.context.RampsController.getQuotes);
 const mockGoBack = jest.fn();
 const mockSetSelectedProvider = jest.fn();
 
+const mockNavigationState = {
+  routes: [
+    { name: Routes.RAMP.MODALS.PAYMENT_SELECTION, key: 'payment' },
+    { name: Routes.RAMP.MODALS.PROVIDER_SELECTION, key: 'provider' },
+  ],
+  index: 1,
+  key: 'modals',
+  routeNames: [
+    Routes.RAMP.MODALS.PAYMENT_SELECTION,
+    Routes.RAMP.MODALS.PROVIDER_SELECTION,
+  ],
+  type: 'stack' as const,
+  stale: false as const,
+};
+
 jest.mock('@react-navigation/native', () => ({
   ...jest.requireActual('@react-navigation/native'),
   useNavigation: () => ({ goBack: mockGoBack, navigate: jest.fn() }),
+  useNavigationState: (
+    selector: (state: typeof mockNavigationState) => unknown,
+  ) => selector(mockNavigationState),
 }));
 
 const mockUseParams = jest.fn<ProviderSelectionModalParams, []>(() => ({
diff --git a/app/components/UI/Ramp/Views/Modals/ProviderSelectionModal/ProviderSelectionModal.tsx b/app/components/UI/Ramp/Views/Modals/ProviderSelectionModal/ProviderSelectionModal.tsx
index 629ebd068830..f6260452ae67 100644
--- a/app/components/UI/Ramp/Views/Modals/ProviderSelectionModal/ProviderSelectionModal.tsx
+++ b/app/components/UI/Ramp/Views/Modals/ProviderSelectionModal/ProviderSelectionModal.tsx
@@ -2,10 +2,11 @@ import React, { useCallback, useMemo, useRef } from 'react';
 import { useWindowDimensions, View } from 'react-native';
 import type { CaipChainId } from '@metamask/utils';
 import type { Provider } from '@metamask/ramps-controller';
+import { useSelector } from 'react-redux';
 import BottomSheet, {
   BottomSheetRef,
 } from '../../../../../../component-library/components/BottomSheets/BottomSheet';
-import { useNavigation } from '@react-navigation/native';
+import { useNavigation, useNavigationState } from '@react-navigation/native';
 import {
   createNavigationDetails,
   useParams,
@@ -15,8 +16,13 @@ import ProviderSelection from './ProviderSelection';
 import { useRampsController } from '../../../hooks/useRampsController';
 import { useRampsQuotes } from '../../../hooks/useRampsQuotes';
 import useRampAccountAddress from '../../../hooks/useRampAccountAddress';
+import { getOrdersProviders } from '../../../../../../reducers/fiatOrders';
+import { selectRampsOrders } from '../../../../../../selectors/rampsController';
+import { completedOrdersFromRampsOrders } from '../../../utils/determinePreferredProvider';
 import { useStyles } from '../../../../../hooks/useStyles';
 import styleSheet from './ProviderSelectionModal.styles';
+import { useAnalytics } from '../../../../../hooks/useAnalytics/useAnalytics';
+import { MetaMetricsEvents } from '../../../../../../core/Analytics';
 
 export interface ProviderSelectionModalParams {
   amount?: number;
@@ -33,6 +39,7 @@ export const createProviderSelectionModalNavigationDetails =
 const DEFAULT_QUOTE_AMOUNT = 100;
 
 function ProviderSelectionModal() {
+  const { trackEvent, createEventBuilder } = useAnalytics();
   const sheetRef = useRef<BottomSheetRef>(null);
   const { height: screenHeight } = useWindowDimensions();
   const { styles } = useStyles(styleSheet, { screenHeight });
@@ -45,11 +52,28 @@ function ProviderSelectionModal() {
 
   const {
     providers,
+    selectedProvider,
     setSelectedProvider,
     selectedPaymentMethod,
     selectedToken,
   } = useRampsController();
 
+  const legacyOrdersProviders = useSelector(getOrdersProviders);
+  const controllerOrders = useSelector(selectRampsOrders);
+
+  const ordersProviders = useMemo(() => {
+    const v2ProviderIds = completedOrdersFromRampsOrders(controllerOrders).map(
+      (o) => o.providerId,
+    );
+    return Array.from(new Set([...legacyOrdersProviders, ...v2ProviderIds]));
+  }, [legacyOrdersProviders, controllerOrders]);
+
+  const hasPaymentModalInStack = useNavigationState((state) =>
+    state.routes.some(
+      (route) => route.name === Routes.RAMP.MODALS.PAYMENT_SELECTION,
+    ),
+  );
+
   const amount = routeAmount ?? DEFAULT_QUOTE_AMOUNT;
   const walletAddress =
     useRampAccountAddress((selectedToken?.chainId as CaipChainId) ?? null) ??
@@ -70,7 +94,7 @@ function ProviderSelectionModal() {
 
   const quoteFetchParams = useMemo(
     () =>
-      !skipQuotes && walletAddress && assetId
+      !skipQuotes && amount > 0 && walletAddress && assetId
         ? {
             amount,
             walletAddress,
@@ -104,10 +128,26 @@ function ProviderSelectionModal() {
 
   const handleProviderSelect = useCallback(
     (provider: Provider) => {
+      trackEvent(
+        createEventBuilder(MetaMetricsEvents.RAMPS_PROVIDER_SELECTED)
+          .addProperties({
+            provider: provider.name,
+            previous_provider: selectedProvider?.name,
+            location: 'Amount Input',
+            ramp_type: 'UNIFIED_BUY_2',
+          })
+          .build(),
+      );
       setSelectedProvider(provider);
       navigation.goBack();
     },
-    [setSelectedProvider, navigation],
+    [
+      setSelectedProvider,
+      navigation,
+      selectedProvider?.name,
+      trackEvent,
+      createEventBuilder,
+    ],
   );
 
   return (
@@ -118,7 +158,11 @@ function ProviderSelectionModal() {
           quotes={quotes}
           quotesLoading={quotesLoading}
           quotesError={quotesError}
-          showQuotes={!skipQuotes}
+          showQuotes={!skipQuotes && amount > 0}
+          showBackButton={hasPaymentModalInStack}
+          ordersProviders={ordersProviders.filter(
+            (id): id is string => id != null,
+          )}
           onBack={handleBack}
           onProviderSelect={handleProviderSelect}
         />
diff --git a/app/components/UI/Ramp/Views/Modals/ProviderSelectionModal/__snapshots__/ProviderSelection.test.tsx.snap b/app/components/UI/Ramp/Views/Modals/ProviderSelectionModal/__snapshots__/ProviderSelection.test.tsx.snap
index acad72ed5f18..782f2ac47526 100644
--- a/app/components/UI/Ramp/Views/Modals/ProviderSelectionModal/__snapshots__/ProviderSelection.test.tsx.snap
+++ b/app/components/UI/Ramp/Views/Modals/ProviderSelectionModal/__snapshots__/ProviderSelection.test.tsx.snap
@@ -406,7 +406,7 @@ exports[`ProviderSelection matches snapshot when no quotes are available 1`] = `
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "height": 24,
                                       "width": 24,
                                     },
@@ -447,7 +447,7 @@ exports[`ProviderSelection matches snapshot when no quotes are available 1`] = `
                               style={
                                 [
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Bold",
                                     "fontSize": 16,
                                     "fontWeight": 400,
@@ -473,18 +473,21 @@ exports[`ProviderSelection matches snapshot when no quotes are available 1`] = `
                         data={
                           [
                             {
-                              "description": "Test provider",
-                              "environmentType": "PRODUCTION",
-                              "hqAddress": "Test Address",
-                              "id": "/providers/transak",
-                              "links": [],
-                              "logos": {
-                                "dark": "https://example.com/logo-dark.png",
-                                "height": 24,
-                                "light": "https://example.com/logo-light.png",
-                                "width": 90,
+                              "provider": {
+                                "description": "Test provider",
+                                "environmentType": "PRODUCTION",
+                                "hqAddress": "Test Address",
+                                "id": "/providers/transak",
+                                "links": [],
+                                "logos": {
+                                  "dark": "https://example.com/logo-dark.png",
+                                  "height": 24,
+                                  "light": "https://example.com/logo-light.png",
+                                  "width": 90,
+                                },
+                                "name": "Transak",
                               },
-                              "name": "Transak",
+                              "type": "provider",
                             },
                           ]
                         }
@@ -557,92 +560,1322 @@ exports[`ProviderSelection matches snapshot when no quotes are available 1`] = `
                                   <View
                                     style={
                                       {
-                                        "flex": 1,
-                                      }
-                                    }
-                                    testID="listitemcolumn"
-                                  >
-                                    <Text
-                                      accessibilityRole="text"
-                                      style={
-                                        {
-                                          "color": "#121314",
-                                          "fontFamily": "Geist-Medium",
-                                          "fontSize": 18,
-                                          "letterSpacing": 0,
-                                          "lineHeight": 24,
-                                        }
-                                      }
-                                    >
-                                      Transak
-                                    </Text>
-                                  </View>
-                                  <View
-                                    accessible={false}
-                                    style={
-                                      {
-                                        "width": 16,
+                                        "flex": 1,
+                                      }
+                                    }
+                                    testID="listitemcolumn"
+                                  >
+                                    <Text
+                                      accessibilityRole="text"
+                                      style={
+                                        [
+                                          {
+                                            "color": "#131416",
+                                            "fontFamily": "Geist-Medium",
+                                            "fontSize": 20,
+                                            "fontWeight": 500,
+                                            "letterSpacing": 0,
+                                            "lineHeight": 24,
+                                          },
+                                          undefined,
+                                        ]
+                                      }
+                                    >
+                                      Transak
+                                    </Text>
+                                  </View>
+                                </View>
+                              </View>
+                              <View
+                                accessibilityRole="checkbox"
+                                accessible={true}
+                                style={
+                                  {
+                                    "backgroundColor": "#b4b4b528",
+                                    "bottom": 0,
+                                    "flexDirection": "row",
+                                    "left": 0,
+                                    "position": "absolute",
+                                    "right": 0,
+                                    "top": 0,
+                                  }
+                                }
+                              />
+                            </TouchableOpacity>
+                          </View>
+                        </View>
+                      </RCTScrollView>
+                    </View>
+                  </View>
+                </View>
+              </View>
+            </View>
+          </View>
+        </View>
+      </RNSScreen>
+    </RNSScreenContainer>
+  </RNCSafeAreaProvider>
+</View>
+`;
+
+exports[`ProviderSelection matches snapshot when quotes are loading 1`] = `
+<View
+  style={
+    {
+      "flex": 1,
+    }
+  }
+>
+  <RNCSafeAreaProvider
+    onInsetsChange={[Function]}
+    style={
+      [
+        {
+          "flex": 1,
+        },
+        undefined,
+      ]
+    }
+  >
+    <View
+      collapsable={false}
+      pointerEvents="box-none"
+      style={
+        {
+          "zIndex": 1,
+        }
+      }
+    >
+      <View
+        accessibilityElementsHidden={false}
+        importantForAccessibility="auto"
+        onLayout={[Function]}
+        pointerEvents="box-none"
+        style={null}
+      >
+        <View
+          collapsable={false}
+          pointerEvents="box-none"
+          style={
+            {
+              "bottom": 0,
+              "left": 0,
+              "opacity": 1,
+              "position": "absolute",
+              "right": 0,
+              "top": 0,
+              "zIndex": 0,
+            }
+          }
+        >
+          <View
+            collapsable={false}
+            style={
+              {
+                "backgroundColor": "rgb(255, 255, 255)",
+                "borderBottomColor": "rgb(216, 216, 216)",
+                "flex": 1,
+                "shadowColor": "rgb(216, 216, 216)",
+                "shadowOffset": {
+                  "height": 0.5,
+                  "width": 0,
+                },
+                "shadowOpacity": 0.85,
+                "shadowRadius": 0,
+              }
+            }
+          />
+        </View>
+        <View
+          collapsable={false}
+          pointerEvents="box-none"
+          style={
+            {
+              "height": 64,
+              "maxHeight": undefined,
+              "minHeight": undefined,
+              "opacity": undefined,
+              "transform": undefined,
+            }
+          }
+        >
+          <View
+            pointerEvents="none"
+            style={
+              {
+                "height": 20,
+              }
+            }
+          />
+          <View
+            pointerEvents="box-none"
+            style={
+              {
+                "alignItems": "center",
+                "flex": 1,
+                "flexDirection": "row",
+                "justifyContent": "center",
+              }
+            }
+          >
+            <View
+              collapsable={false}
+              pointerEvents="box-none"
+              style={
+                {
+                  "marginHorizontal": 16,
+                  "opacity": 1,
+                }
+              }
+            >
+              <Text
+                accessibilityRole="header"
+                aria-level="1"
+                collapsable={false}
+                numberOfLines={1}
+                onLayout={[Function]}
+                style={
+                  {
+                    "color": "rgb(28, 28, 30)",
+                    "fontSize": 17,
+                    "fontWeight": "600",
+                  }
+                }
+              >
+                ProviderSelection
+              </Text>
+            </View>
+          </View>
+        </View>
+      </View>
+    </View>
+    <RNSScreenContainer
+      onLayout={[Function]}
+      style={
+        {
+          "flex": 1,
+        }
+      }
+    >
+      <RNSScreen
+        activityState={2}
+        collapsable={false}
+        gestureResponseDistance={
+          {
+            "bottom": -1,
+            "end": -1,
+            "start": -1,
+            "top": -1,
+          }
+        }
+        onGestureCancel={[Function]}
+        pointerEvents="box-none"
+        sheetAllowedDetents="large"
+        sheetCornerRadius={-1}
+        sheetExpandsWhenScrolledToEdge={true}
+        sheetGrabberVisible={false}
+        sheetLargestUndimmedDetent="all"
+        style={
+          {
+            "bottom": 0,
+            "left": 0,
+            "position": "absolute",
+            "right": 0,
+            "top": 0,
+            "zIndex": undefined,
+          }
+        }
+      >
+        <View
+          collapsable={false}
+          style={
+            {
+              "opacity": 1,
+            }
+          }
+        />
+        <View
+          accessibilityElementsHidden={false}
+          closing={false}
+          gestureVelocityImpact={0.3}
+          importantForAccessibility="auto"
+          onClose={[Function]}
+          onGestureBegin={[Function]}
+          onGestureCanceled={[Function]}
+          onGestureEnd={[Function]}
+          onOpen={[Function]}
+          onTransition={[Function]}
+          pointerEvents="box-none"
+          style={
+            [
+              {
+                "overflow": undefined,
+              },
+              {
+                "bottom": 0,
+                "left": 0,
+                "position": "absolute",
+                "right": 0,
+                "top": 0,
+              },
+            ]
+          }
+          transitionSpec={
+            {
+              "close": {
+                "animation": "spring",
+                "config": {
+                  "damping": 500,
+                  "mass": 3,
+                  "overshootClamping": true,
+                  "restDisplacementThreshold": 10,
+                  "restSpeedThreshold": 10,
+                  "stiffness": 1000,
+                },
+              },
+              "open": {
+                "animation": "spring",
+                "config": {
+                  "damping": 500,
+                  "mass": 3,
+                  "overshootClamping": true,
+                  "restDisplacementThreshold": 10,
+                  "restSpeedThreshold": 10,
+                  "stiffness": 1000,
+                },
+              },
+            }
+          }
+        >
+          <View
+            collapsable={false}
+            needsOffscreenAlphaCompositing={false}
+            pointerEvents="box-none"
+            style={
+              {
+                "flex": 1,
+              }
+            }
+          >
+            <View
+              collapsable={false}
+              enabled={false}
+              handlerTag={-1}
+              handlerType="PanGestureHandler"
+              onGestureHandlerEvent={[Function]}
+              onGestureHandlerStateChange={[Function]}
+              style={
+                {
+                  "flex": 1,
+                  "transform": [
+                    {
+                      "translateX": 0,
+                    },
+                    {
+                      "translateX": 0,
+                    },
+                  ],
+                }
+              }
+            >
+              <View
+                collapsable={false}
+                pointerEvents="none"
+                style={
+                  {
+                    "backgroundColor": "rgb(242, 242, 242)",
+                    "bottom": 0,
+                    "left": 0,
+                    "position": "absolute",
+                    "shadowColor": "#000",
+                    "shadowOffset": {
+                      "height": 1,
+                      "width": -1,
+                    },
+                    "shadowOpacity": 0.3,
+                    "shadowRadius": 5,
+                    "top": 0,
+                    "width": 3,
+                  }
+                }
+              />
+              <View
+                style={
+                  [
+                    {
+                      "flex": 1,
+                      "overflow": "hidden",
+                    },
+                    [
+                      {
+                        "backgroundColor": "rgb(242, 242, 242)",
+                      },
+                      undefined,
+                    ],
+                  ]
+                }
+              >
+                <View
+                  style={
+                    {
+                      "flex": 1,
+                      "flexDirection": "column-reverse",
+                    }
+                  }
+                >
+                  <View
+                    style={
+                      {
+                        "flex": 1,
+                      }
+                    }
+                  >
+                    <View
+                      style={
+                        [
+                          {
+                            "display": "flex",
+                            "flexBasis": "0%",
+                            "flexGrow": 1,
+                            "flexShrink": 1,
+                            "minHeight": 0,
+                          },
+                          undefined,
+                        ]
+                      }
+                    >
+                      <View
+                        style={
+                          [
+                            {
+                              "alignItems": "center",
+                              "flexDirection": "row",
+                              "gap": 16,
+                              "minHeight": 56,
+                              "paddingLeft": 8,
+                              "paddingRight": 8,
+                            },
+                            false,
+                            undefined,
+                          ]
+                        }
+                        testID="header"
+                      >
+                        <View>
+                          <View
+                            onLayout={[Function]}
+                          >
+                            <View
+                              accessibilityState={
+                                {
+                                  "busy": undefined,
+                                  "checked": undefined,
+                                  "disabled": false,
+                                  "expanded": undefined,
+                                  "selected": undefined,
+                                }
+                              }
+                              accessibilityValue={
+                                {
+                                  "max": undefined,
+                                  "min": undefined,
+                                  "now": undefined,
+                                  "text": undefined,
+                                }
+                              }
+                              accessible={true}
+                              collapsable={false}
+                              focusable={true}
+                              onBlur={[Function]}
+                              onClick={[Function]}
+                              onFocus={[Function]}
+                              onResponderGrant={[Function]}
+                              onResponderMove={[Function]}
+                              onResponderRelease={[Function]}
+                              onResponderTerminate={[Function]}
+                              onResponderTerminationRequest={[Function]}
+                              onStartShouldSetResponder={[Function]}
+                              style={
+                                [
+                                  {
+                                    "alignItems": "center",
+                                    "backgroundColor": "transparent",
+                                    "borderRadius": 8,
+                                    "height": 32,
+                                    "justifyContent": "center",
+                                    "opacity": 1,
+                                    "width": 32,
+                                  },
+                                  undefined,
+                                  {
+                                    "transform": [
+                                      {
+                                        "scale": 1,
+                                      },
+                                    ],
+                                  },
+                                ]
+                              }
+                              testID="button-icon"
+                            >
+                              <SvgMock
+                                fill="currentColor"
+                                name="ArrowLeft"
+                                style={
+                                  [
+                                    {
+                                      "color": "#131416",
+                                      "height": 24,
+                                      "width": 24,
+                                    },
+                                    undefined,
+                                  ]
+                                }
+                              />
+                            </View>
+                          </View>
+                        </View>
+                        <View
+                          style={
+                            [
+                              {
+                                "alignItems": "center",
+                                "display": "flex",
+                                "flexBasis": "0%",
+                                "flexGrow": 1,
+                                "flexShrink": 1,
+                              },
+                              undefined,
+                            ]
+                          }
+                        >
+                          <View
+                            style={
+                              [
+                                {
+                                  "alignItems": "center",
+                                  "display": "flex",
+                                },
+                                undefined,
+                              ]
+                            }
+                          >
+                            <Text
+                              accessibilityRole="text"
+                              style={
+                                [
+                                  {
+                                    "color": "#131416",
+                                    "fontFamily": "Geist-Bold",
+                                    "fontSize": 16,
+                                    "fontWeight": 400,
+                                    "letterSpacing": 0,
+                                    "lineHeight": 24,
+                                  },
+                                  undefined,
+                                ]
+                              }
+                            >
+                              Providers
+                            </Text>
+                          </View>
+                        </View>
+                        <View>
+                          <View
+                            onLayout={[Function]}
+                          />
+                        </View>
+                      </View>
+                      <TouchableOpacity
+                        disabled={true}
+                        style={
+                          {
+                            "backgroundColor": "#ffffff",
+                            "borderRadius": 4,
+                            "opacity": 0.5,
+                            "position": "relative",
+                          }
+                        }
+                      >
+                        <View
+                          accessibilityRole="none"
+                          accessible={true}
+                          style={
+                            {
+                              "padding": 16,
+                            }
+                          }
+                        >
+                          <View
+                            style={
+                              {
+                                "alignItems": "center",
+                                "flexDirection": "row",
+                              }
+                            }
+                          >
+                            <View
+                              style={
+                                {
+                                  "flex": 1,
+                                }
+                              }
+                              testID="listitemcolumn"
+                            >
+                              <View
+                                style={
+                                  {
+                                    "borderRadius": 4,
+                                    "height": 18,
+                                    "overflow": "hidden",
+                                    "width": 120,
+                                  }
+                                }
+                              >
+                                <View
+                                  collapsable={false}
+                                  pointerEvents="none"
+                                  style={
+                                    {
+                                      "backgroundColor": "#66676a",
+                                      "borderRadius": 4,
+                                      "bottom": 0,
+                                      "left": 0,
+                                      "opacity": 0.2,
+                                      "position": "absolute",
+                                      "right": 0,
+                                      "top": 0,
+                                    }
+                                  }
+                                />
+                              </View>
+                            </View>
+                            <View
+                              accessible={false}
+                              style={
+                                {
+                                  "width": 16,
+                                }
+                              }
+                              testID="listitem-gap"
+                            />
+                            <View
+                              style={
+                                {
+                                  "flex": -1,
+                                }
+                              }
+                              testID="listitemcolumn"
+                            >
+                              <View
+                                style={
+                                  [
+                                    {
+                                      "alignItems": "flex-end",
+                                      "display": "flex",
+                                    },
+                                    undefined,
+                                  ]
+                                }
+                              >
+                                <View
+                                  style={
+                                    {
+                                      "borderRadius": 4,
+                                      "height": 16,
+                                      "overflow": "hidden",
+                                      "width": 80,
+                                    }
+                                  }
+                                >
+                                  <View
+                                    collapsable={false}
+                                    pointerEvents="none"
+                                    style={
+                                      {
+                                        "backgroundColor": "#66676a",
+                                        "borderRadius": 4,
+                                        "bottom": 0,
+                                        "left": 0,
+                                        "opacity": 0.2,
+                                        "position": "absolute",
+                                        "right": 0,
+                                        "top": 0,
+                                      }
+                                    }
+                                  />
+                                </View>
+                                <View
+                                  style={
+                                    {
+                                      "height": 6,
+                                    }
+                                  }
+                                />
+                                <View
+                                  style={
+                                    {
+                                      "borderRadius": 4,
+                                      "height": 16,
+                                      "overflow": "hidden",
+                                      "width": 60,
+                                    }
+                                  }
+                                >
+                                  <View
+                                    collapsable={false}
+                                    pointerEvents="none"
+                                    style={
+                                      {
+                                        "backgroundColor": "#66676a",
+                                        "borderRadius": 4,
+                                        "bottom": 0,
+                                        "left": 0,
+                                        "opacity": 0.2,
+                                        "position": "absolute",
+                                        "right": 0,
+                                        "top": 0,
+                                      }
+                                    }
+                                  />
+                                </View>
+                              </View>
+                            </View>
+                          </View>
+                        </View>
+                      </TouchableOpacity>
+                      <TouchableOpacity
+                        disabled={true}
+                        style={
+                          {
+                            "backgroundColor": "#ffffff",
+                            "borderRadius": 4,
+                            "opacity": 0.5,
+                            "position": "relative",
+                          }
+                        }
+                      >
+                        <View
+                          accessibilityRole="none"
+                          accessible={true}
+                          style={
+                            {
+                              "padding": 16,
+                            }
+                          }
+                        >
+                          <View
+                            style={
+                              {
+                                "alignItems": "center",
+                                "flexDirection": "row",
+                              }
+                            }
+                          >
+                            <View
+                              style={
+                                {
+                                  "flex": 1,
+                                }
+                              }
+                              testID="listitemcolumn"
+                            >
+                              <View
+                                style={
+                                  {
+                                    "borderRadius": 4,
+                                    "height": 18,
+                                    "overflow": "hidden",
+                                    "width": 120,
+                                  }
+                                }
+                              >
+                                <View
+                                  collapsable={false}
+                                  pointerEvents="none"
+                                  style={
+                                    {
+                                      "backgroundColor": "#66676a",
+                                      "borderRadius": 4,
+                                      "bottom": 0,
+                                      "left": 0,
+                                      "opacity": 0.2,
+                                      "position": "absolute",
+                                      "right": 0,
+                                      "top": 0,
+                                    }
+                                  }
+                                />
+                              </View>
+                            </View>
+                            <View
+                              accessible={false}
+                              style={
+                                {
+                                  "width": 16,
+                                }
+                              }
+                              testID="listitem-gap"
+                            />
+                            <View
+                              style={
+                                {
+                                  "flex": -1,
+                                }
+                              }
+                              testID="listitemcolumn"
+                            >
+                              <View
+                                style={
+                                  [
+                                    {
+                                      "alignItems": "flex-end",
+                                      "display": "flex",
+                                    },
+                                    undefined,
+                                  ]
+                                }
+                              >
+                                <View
+                                  style={
+                                    {
+                                      "borderRadius": 4,
+                                      "height": 16,
+                                      "overflow": "hidden",
+                                      "width": 80,
+                                    }
+                                  }
+                                >
+                                  <View
+                                    collapsable={false}
+                                    pointerEvents="none"
+                                    style={
+                                      {
+                                        "backgroundColor": "#66676a",
+                                        "borderRadius": 4,
+                                        "bottom": 0,
+                                        "left": 0,
+                                        "opacity": 0.2,
+                                        "position": "absolute",
+                                        "right": 0,
+                                        "top": 0,
+                                      }
+                                    }
+                                  />
+                                </View>
+                                <View
+                                  style={
+                                    {
+                                      "height": 6,
+                                    }
+                                  }
+                                />
+                                <View
+                                  style={
+                                    {
+                                      "borderRadius": 4,
+                                      "height": 16,
+                                      "overflow": "hidden",
+                                      "width": 60,
+                                    }
+                                  }
+                                >
+                                  <View
+                                    collapsable={false}
+                                    pointerEvents="none"
+                                    style={
+                                      {
+                                        "backgroundColor": "#66676a",
+                                        "borderRadius": 4,
+                                        "bottom": 0,
+                                        "left": 0,
+                                        "opacity": 0.2,
+                                        "position": "absolute",
+                                        "right": 0,
+                                        "top": 0,
+                                      }
+                                    }
+                                  />
+                                </View>
+                              </View>
+                            </View>
+                          </View>
+                        </View>
+                      </TouchableOpacity>
+                      <TouchableOpacity
+                        disabled={true}
+                        style={
+                          {
+                            "backgroundColor": "#ffffff",
+                            "borderRadius": 4,
+                            "opacity": 0.5,
+                            "position": "relative",
+                          }
+                        }
+                      >
+                        <View
+                          accessibilityRole="none"
+                          accessible={true}
+                          style={
+                            {
+                              "padding": 16,
+                            }
+                          }
+                        >
+                          <View
+                            style={
+                              {
+                                "alignItems": "center",
+                                "flexDirection": "row",
+                              }
+                            }
+                          >
+                            <View
+                              style={
+                                {
+                                  "flex": 1,
+                                }
+                              }
+                              testID="listitemcolumn"
+                            >
+                              <View
+                                style={
+                                  {
+                                    "borderRadius": 4,
+                                    "height": 18,
+                                    "overflow": "hidden",
+                                    "width": 120,
+                                  }
+                                }
+                              >
+                                <View
+                                  collapsable={false}
+                                  pointerEvents="none"
+                                  style={
+                                    {
+                                      "backgroundColor": "#66676a",
+                                      "borderRadius": 4,
+                                      "bottom": 0,
+                                      "left": 0,
+                                      "opacity": 0.2,
+                                      "position": "absolute",
+                                      "right": 0,
+                                      "top": 0,
+                                    }
+                                  }
+                                />
+                              </View>
+                            </View>
+                            <View
+                              accessible={false}
+                              style={
+                                {
+                                  "width": 16,
+                                }
+                              }
+                              testID="listitem-gap"
+                            />
+                            <View
+                              style={
+                                {
+                                  "flex": -1,
+                                }
+                              }
+                              testID="listitemcolumn"
+                            >
+                              <View
+                                style={
+                                  [
+                                    {
+                                      "alignItems": "flex-end",
+                                      "display": "flex",
+                                    },
+                                    undefined,
+                                  ]
+                                }
+                              >
+                                <View
+                                  style={
+                                    {
+                                      "borderRadius": 4,
+                                      "height": 16,
+                                      "overflow": "hidden",
+                                      "width": 80,
+                                    }
+                                  }
+                                >
+                                  <View
+                                    collapsable={false}
+                                    pointerEvents="none"
+                                    style={
+                                      {
+                                        "backgroundColor": "#66676a",
+                                        "borderRadius": 4,
+                                        "bottom": 0,
+                                        "left": 0,
+                                        "opacity": 0.2,
+                                        "position": "absolute",
+                                        "right": 0,
+                                        "top": 0,
+                                      }
+                                    }
+                                  />
+                                </View>
+                                <View
+                                  style={
+                                    {
+                                      "height": 6,
+                                    }
+                                  }
+                                />
+                                <View
+                                  style={
+                                    {
+                                      "borderRadius": 4,
+                                      "height": 16,
+                                      "overflow": "hidden",
+                                      "width": 60,
+                                    }
+                                  }
+                                >
+                                  <View
+                                    collapsable={false}
+                                    pointerEvents="none"
+                                    style={
+                                      {
+                                        "backgroundColor": "#66676a",
+                                        "borderRadius": 4,
+                                        "bottom": 0,
+                                        "left": 0,
+                                        "opacity": 0.2,
+                                        "position": "absolute",
+                                        "right": 0,
+                                        "top": 0,
+                                      }
+                                    }
+                                  />
+                                </View>
+                              </View>
+                            </View>
+                          </View>
+                        </View>
+                      </TouchableOpacity>
+                      <TouchableOpacity
+                        disabled={true}
+                        style={
+                          {
+                            "backgroundColor": "#ffffff",
+                            "borderRadius": 4,
+                            "opacity": 0.5,
+                            "position": "relative",
+                          }
+                        }
+                      >
+                        <View
+                          accessibilityRole="none"
+                          accessible={true}
+                          style={
+                            {
+                              "padding": 16,
+                            }
+                          }
+                        >
+                          <View
+                            style={
+                              {
+                                "alignItems": "center",
+                                "flexDirection": "row",
+                              }
+                            }
+                          >
+                            <View
+                              style={
+                                {
+                                  "flex": 1,
+                                }
+                              }
+                              testID="listitemcolumn"
+                            >
+                              <View
+                                style={
+                                  {
+                                    "borderRadius": 4,
+                                    "height": 18,
+                                    "overflow": "hidden",
+                                    "width": 120,
+                                  }
+                                }
+                              >
+                                <View
+                                  collapsable={false}
+                                  pointerEvents="none"
+                                  style={
+                                    {
+                                      "backgroundColor": "#66676a",
+                                      "borderRadius": 4,
+                                      "bottom": 0,
+                                      "left": 0,
+                                      "opacity": 0.2,
+                                      "position": "absolute",
+                                      "right": 0,
+                                      "top": 0,
+                                    }
+                                  }
+                                />
+                              </View>
+                            </View>
+                            <View
+                              accessible={false}
+                              style={
+                                {
+                                  "width": 16,
+                                }
+                              }
+                              testID="listitem-gap"
+                            />
+                            <View
+                              style={
+                                {
+                                  "flex": -1,
+                                }
+                              }
+                              testID="listitemcolumn"
+                            >
+                              <View
+                                style={
+                                  [
+                                    {
+                                      "alignItems": "flex-end",
+                                      "display": "flex",
+                                    },
+                                    undefined,
+                                  ]
+                                }
+                              >
+                                <View
+                                  style={
+                                    {
+                                      "borderRadius": 4,
+                                      "height": 16,
+                                      "overflow": "hidden",
+                                      "width": 80,
+                                    }
+                                  }
+                                >
+                                  <View
+                                    collapsable={false}
+                                    pointerEvents="none"
+                                    style={
+                                      {
+                                        "backgroundColor": "#66676a",
+                                        "borderRadius": 4,
+                                        "bottom": 0,
+                                        "left": 0,
+                                        "opacity": 0.2,
+                                        "position": "absolute",
+                                        "right": 0,
+                                        "top": 0,
+                                      }
+                                    }
+                                  />
+                                </View>
+                                <View
+                                  style={
+                                    {
+                                      "height": 6,
+                                    }
+                                  }
+                                />
+                                <View
+                                  style={
+                                    {
+                                      "borderRadius": 4,
+                                      "height": 16,
+                                      "overflow": "hidden",
+                                      "width": 60,
+                                    }
+                                  }
+                                >
+                                  <View
+                                    collapsable={false}
+                                    pointerEvents="none"
+                                    style={
+                                      {
+                                        "backgroundColor": "#66676a",
+                                        "borderRadius": 4,
+                                        "bottom": 0,
+                                        "left": 0,
+                                        "opacity": 0.2,
+                                        "position": "absolute",
+                                        "right": 0,
+                                        "top": 0,
+                                      }
+                                    }
+                                  />
+                                </View>
+                              </View>
+                            </View>
+                          </View>
+                        </View>
+                      </TouchableOpacity>
+                      <TouchableOpacity
+                        disabled={true}
+                        style={
+                          {
+                            "backgroundColor": "#ffffff",
+                            "borderRadius": 4,
+                            "opacity": 0.5,
+                            "position": "relative",
+                          }
+                        }
+                      >
+                        <View
+                          accessibilityRole="none"
+                          accessible={true}
+                          style={
+                            {
+                              "padding": 16,
+                            }
+                          }
+                        >
+                          <View
+                            style={
+                              {
+                                "alignItems": "center",
+                                "flexDirection": "row",
+                              }
+                            }
+                          >
+                            <View
+                              style={
+                                {
+                                  "flex": 1,
+                                }
+                              }
+                              testID="listitemcolumn"
+                            >
+                              <View
+                                style={
+                                  {
+                                    "borderRadius": 4,
+                                    "height": 18,
+                                    "overflow": "hidden",
+                                    "width": 120,
+                                  }
+                                }
+                              >
+                                <View
+                                  collapsable={false}
+                                  pointerEvents="none"
+                                  style={
+                                    {
+                                      "backgroundColor": "#66676a",
+                                      "borderRadius": 4,
+                                      "bottom": 0,
+                                      "left": 0,
+                                      "opacity": 0.2,
+                                      "position": "absolute",
+                                      "right": 0,
+                                      "top": 0,
+                                    }
+                                  }
+                                />
+                              </View>
+                            </View>
+                            <View
+                              accessible={false}
+                              style={
+                                {
+                                  "width": 16,
+                                }
+                              }
+                              testID="listitem-gap"
+                            />
+                            <View
+                              style={
+                                {
+                                  "flex": -1,
+                                }
+                              }
+                              testID="listitemcolumn"
+                            >
+                              <View
+                                style={
+                                  [
+                                    {
+                                      "alignItems": "flex-end",
+                                      "display": "flex",
+                                    },
+                                    undefined,
+                                  ]
+                                }
+                              >
+                                <View
+                                  style={
+                                    {
+                                      "borderRadius": 4,
+                                      "height": 16,
+                                      "overflow": "hidden",
+                                      "width": 80,
+                                    }
+                                  }
+                                >
+                                  <View
+                                    collapsable={false}
+                                    pointerEvents="none"
+                                    style={
+                                      {
+                                        "backgroundColor": "#66676a",
+                                        "borderRadius": 4,
+                                        "bottom": 0,
+                                        "left": 0,
+                                        "opacity": 0.2,
+                                        "position": "absolute",
+                                        "right": 0,
+                                        "top": 0,
                                       }
                                     }
-                                    testID="listitem-gap"
                                   />
+                                </View>
+                                <View
+                                  style={
+                                    {
+                                      "height": 6,
+                                    }
+                                  }
+                                />
+                                <View
+                                  style={
+                                    {
+                                      "borderRadius": 4,
+                                      "height": 16,
+                                      "overflow": "hidden",
+                                      "width": 60,
+                                    }
+                                  }
+                                >
                                   <View
+                                    collapsable={false}
+                                    pointerEvents="none"
                                     style={
                                       {
-                                        "flex": -1,
+                                        "backgroundColor": "#66676a",
+                                        "borderRadius": 4,
+                                        "bottom": 0,
+                                        "left": 0,
+                                        "opacity": 0.2,
+                                        "position": "absolute",
+                                        "right": 0,
+                                        "top": 0,
                                       }
                                     }
-                                    testID="listitemcolumn"
-                                  >
-                                    <View
-                                      style={
-                                        [
-                                          {
-                                            "alignItems": "flex-end",
-                                            "display": "flex",
-                                            "justifyContent": "center",
-                                          },
-                                          undefined,
-                                        ]
-                                      }
-                                    >
-                                      <Text
-                                        accessibilityRole="text"
-                                        style={
-                                          {
-                                            "color": "#686e7d",
-                                            "fontFamily": "Geist-Regular",
-                                            "fontSize": 14,
-                                            "letterSpacing": 0,
-                                            "lineHeight": 22,
-                                          }
-                                        }
-                                      >
-                                        Quote unavailable.
-                                      </Text>
-                                    </View>
-                                  </View>
+                                  />
                                 </View>
                               </View>
-                              <View
-                                accessibilityRole="checkbox"
-                                accessible={true}
-                                style={
-                                  {
-                                    "backgroundColor": "#3c4d9d0f",
-                                    "bottom": 0,
-                                    "flexDirection": "row",
-                                    "left": 0,
-                                    "position": "absolute",
-                                    "right": 0,
-                                    "top": 0,
-                                  }
-                                }
-                              />
-                            </TouchableOpacity>
+                            </View>
                           </View>
                         </View>
-                      </RCTScrollView>
+                      </TouchableOpacity>
                     </View>
                   </View>
                 </View>
@@ -656,7 +1889,7 @@ exports[`ProviderSelection matches snapshot when no quotes are available 1`] = `
 </View>
 `;
 
-exports[`ProviderSelection matches snapshot when quotes are loading 1`] = `
+exports[`ProviderSelection matches snapshot when quotes fail to load 1`] = `
 <View
   style={
     {
@@ -1062,7 +2295,7 @@ exports[`ProviderSelection matches snapshot when quotes are loading 1`] = `
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "height": 24,
                                       "width": 24,
                                     },
@@ -1103,7 +2336,7 @@ exports[`ProviderSelection matches snapshot when quotes are loading 1`] = `
                               style={
                                 [
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Bold",
                                     "fontSize": 16,
                                     "fontWeight": 400,
@@ -1124,23 +2357,97 @@ exports[`ProviderSelection matches snapshot when quotes are loading 1`] = `
                           />
                         </View>
                       </View>
+                      <View
+                        style={
+                          [
+                            {
+                              "display": "flex",
+                              "paddingLeft": 16,
+                              "paddingRight": 16,
+                            },
+                            undefined,
+                          ]
+                        }
+                      >
+                        <View
+                          style={
+                            {
+                              "backgroundColor": "#ca35421a",
+                              "borderColor": "#ca3542",
+                              "borderLeftWidth": 4,
+                              "borderRadius": 4,
+                              "flexDirection": "row",
+                              "padding": 12,
+                              "paddingLeft": 8,
+                            }
+                          }
+                          testID="banneralert"
+                        >
+                          <View
+                            style={
+                              {
+                                "marginRight": 8,
+                              }
+                            }
+                          >
+                            <SvgMock
+                              color="#ca3542"
+                              fill="currentColor"
+                              height={24}
+                              name="Danger"
+                              style={
+                                {
+                                  "height": 24,
+                                  "width": 24,
+                                }
+                              }
+                              width={24}
+                            />
+                          </View>
+                          <View
+                            style={
+                              {
+                                "flex": 1,
+                              }
+                            }
+                          >
+                            <Text
+                              accessibilityRole="text"
+                              style={
+                                {
+                                  "color": "#131416",
+                                  "fontFamily": "Geist-Regular",
+                                  "fontSize": 14,
+                                  "letterSpacing": 0,
+                                  "lineHeight": 22,
+                                }
+                              }
+                            >
+                              Failed to load quotes
+                            </Text>
+                          </View>
+                        </View>
+                      </View>
                       <RCTScrollView
                         collapsable={false}
                         data={
                           [
                             {
-                              "description": "Test provider",
-                              "environmentType": "PRODUCTION",
-                              "hqAddress": "Test Address",
-                              "id": "/providers/transak",
-                              "links": [],
-                              "logos": {
-                                "dark": "https://example.com/logo-dark.png",
-                                "height": 24,
-                                "light": "https://example.com/logo-light.png",
-                                "width": 90,
+                              "provider": {
+                                "description": "Test provider",
+                                "environmentType": "PRODUCTION",
+                                "hqAddress": "Test Address",
+                                "id": "/providers/transak",
+                                "links": [],
+                                "logos": {
+                                  "dark": "https://example.com/logo-dark.png",
+                                  "height": 24,
+                                  "light": "https://example.com/logo-light.png",
+                                  "width": 90,
+                                },
+                                "name": "Transak",
                               },
-                              "name": "Transak",
+                              "type": "provider",
                             },
                           ]
                         }
@@ -1220,109 +2527,22 @@ exports[`ProviderSelection matches snapshot when quotes are loading 1`] = `
                                   >
                                     <Text
                                       accessibilityRole="text"
-                                      style={
-                                        {
-                                          "color": "#121314",
-                                          "fontFamily": "Geist-Medium",
-                                          "fontSize": 18,
-                                          "letterSpacing": 0,
-                                          "lineHeight": 24,
-                                        }
-                                      }
-                                    >
-                                      Transak
-                                    </Text>
-                                  </View>
-                                  <View
-                                    accessible={false}
-                                    style={
-                                      {
-                                        "width": 16,
-                                      }
-                                    }
-                                    testID="listitem-gap"
-                                  />
-                                  <View
-                                    style={
-                                      {
-                                        "flex": -1,
-                                      }
-                                    }
-                                    testID="listitemcolumn"
-                                  >
-                                    <View
                                       style={
                                         [
                                           {
-                                            "alignItems": "flex-end",
-                                            "display": "flex",
+                                            "color": "#131416",
+                                            "fontFamily": "Geist-Medium",
+                                            "fontSize": 20,
+                                            "fontWeight": 500,
+                                            "letterSpacing": 0,
+                                            "lineHeight": 24,
                                           },
                                           undefined,
                                         ]
                                       }
                                     >
-                                      <View
-                                        style={
-                                          {
-                                            "borderRadius": 4,
-                                            "height": 16,
-                                            "overflow": "hidden",
-                                            "width": 80,
-                                          }
-                                        }
-                                      >
-                                        <View
-                                          collapsable={false}
-                                          pointerEvents="none"
-                                          style={
-                                            {
-                                              "backgroundColor": "#686e7d",
-                                              "borderRadius": 4,
-                                              "bottom": 0,
-                                              "left": 0,
-                                              "opacity": 0.2,
-                                              "position": "absolute",
-                                              "right": 0,
-                                              "top": 0,
-                                            }
-                                          }
-                                        />
-                                      </View>
-                                      <View
-                                        style={
-                                          {
-                                            "height": 6,
-                                          }
-                                        }
-                                      />
-                                      <View
-                                        style={
-                                          {
-                                            "borderRadius": 4,
-                                            "height": 16,
-                                            "overflow": "hidden",
-                                            "width": 60,
-                                          }
-                                        }
-                                      >
-                                        <View
-                                          collapsable={false}
-                                          pointerEvents="none"
-                                          style={
-                                            {
-                                              "backgroundColor": "#686e7d",
-                                              "borderRadius": 4,
-                                              "bottom": 0,
-                                              "left": 0,
-                                              "opacity": 0.2,
-                                              "position": "absolute",
-                                              "right": 0,
-                                              "top": 0,
-                                            }
-                                          }
-                                        />
-                                      </View>
-                                    </View>
+                                      Transak
+                                    </Text>
                                   </View>
                                 </View>
                               </View>
@@ -1331,7 +2551,7 @@ exports[`ProviderSelection matches snapshot when quotes are loading 1`] = `
                                 accessible={true}
                                 style={
                                   {
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "bottom": 0,
                                     "flexDirection": "row",
                                     "left": 0,
@@ -1358,7 +2578,7 @@ exports[`ProviderSelection matches snapshot when quotes are loading 1`] = `
 </View>
 `;
 
-exports[`ProviderSelection matches snapshot when quotes fail to load 1`] = `
+exports[`ProviderSelection renders providers directly when quotes load but none are available 1`] = `
 <View
   style={
     {
@@ -1764,7 +2984,7 @@ exports[`ProviderSelection matches snapshot when quotes fail to load 1`] = `
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "height": 24,
                                       "width": 24,
                                     },
@@ -1805,7 +3025,7 @@ exports[`ProviderSelection matches snapshot when quotes fail to load 1`] = `
                               style={
                                 [
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Bold",
                                     "fontSize": 16,
                                     "fontWeight": 400,
@@ -1826,94 +3046,26 @@ exports[`ProviderSelection matches snapshot when quotes fail to load 1`] = `
                           />
                         </View>
                       </View>
-                      <View
-                        style={
-                          [
-                            {
-                              "display": "flex",
-                              "paddingLeft": 16,
-                              "paddingRight": 16,
-                            },
-                            undefined,
-                          ]
-                        }
-                      >
-                        <View
-                          style={
-                            {
-                              "backgroundColor": "#ca35421a",
-                              "borderColor": "#ca3542",
-                              "borderLeftWidth": 4,
-                              "borderRadius": 4,
-                              "flexDirection": "row",
-                              "padding": 12,
-                              "paddingLeft": 8,
-                            }
-                          }
-                          testID="banneralert"
-                        >
-                          <View
-                            style={
-                              {
-                                "marginRight": 8,
-                              }
-                            }
-                          >
-                            <SvgMock
-                              color="#ca3542"
-                              fill="currentColor"
-                              height={24}
-                              name="Danger"
-                              style={
-                                {
-                                  "height": 24,
-                                  "width": 24,
-                                }
-                              }
-                              width={24}
-                            />
-                          </View>
-                          <View
-                            style={
-                              {
-                                "flex": 1,
-                              }
-                            }
-                          >
-                            <Text
-                              accessibilityRole="text"
-                              style={
-                                {
-                                  "color": "#121314",
-                                  "fontFamily": "Geist-Regular",
-                                  "fontSize": 14,
-                                  "letterSpacing": 0,
-                                  "lineHeight": 22,
-                                }
-                              }
-                            >
-                              Failed to load quotes
-                            </Text>
-                          </View>
-                        </View>
-                      </View>
                       <RCTScrollView
                         collapsable={false}
                         data={
                           [
                             {
-                              "description": "Test provider",
-                              "environmentType": "PRODUCTION",
-                              "hqAddress": "Test Address",
-                              "id": "/providers/transak",
-                              "links": [],
-                              "logos": {
-                                "dark": "https://example.com/logo-dark.png",
-                                "height": 24,
-                                "light": "https://example.com/logo-light.png",
-                                "width": 90,
+                              "provider": {
+                                "description": "Test provider",
+                                "environmentType": "PRODUCTION",
+                                "hqAddress": "Test Address",
+                                "id": "/providers/transak",
+                                "links": [],
+                                "logos": {
+                                  "dark": "https://example.com/logo-dark.png",
+                                  "height": 24,
+                                  "light": "https://example.com/logo-light.png",
+                                  "width": 90,
+                                },
+                                "name": "Transak",
                               },
-                              "name": "Transak",
+                              "type": "provider",
                             },
                           ]
                         }
@@ -1993,63 +3145,22 @@ exports[`ProviderSelection matches snapshot when quotes fail to load 1`] = `
                                   >
                                     <Text
                                       accessibilityRole="text"
-                                      style={
-                                        {
-                                          "color": "#121314",
-                                          "fontFamily": "Geist-Medium",
-                                          "fontSize": 18,
-                                          "letterSpacing": 0,
-                                          "lineHeight": 24,
-                                        }
-                                      }
-                                    >
-                                      Transak
-                                    </Text>
-                                  </View>
-                                  <View
-                                    accessible={false}
-                                    style={
-                                      {
-                                        "width": 16,
-                                      }
-                                    }
-                                    testID="listitem-gap"
-                                  />
-                                  <View
-                                    style={
-                                      {
-                                        "flex": -1,
-                                      }
-                                    }
-                                    testID="listitemcolumn"
-                                  >
-                                    <View
                                       style={
                                         [
                                           {
-                                            "alignItems": "flex-end",
-                                            "display": "flex",
-                                            "justifyContent": "center",
+                                            "color": "#131416",
+                                            "fontFamily": "Geist-Medium",
+                                            "fontSize": 20,
+                                            "fontWeight": 500,
+                                            "letterSpacing": 0,
+                                            "lineHeight": 24,
                                           },
                                           undefined,
                                         ]
                                       }
                                     >
-                                      <Text
-                                        accessibilityRole="text"
-                                        style={
-                                          {
-                                            "color": "#686e7d",
-                                            "fontFamily": "Geist-Regular",
-                                            "fontSize": 14,
-                                            "letterSpacing": 0,
-                                            "lineHeight": 22,
-                                          }
-                                        }
-                                      >
-                                        Quote unavailable.
-                                      </Text>
-                                    </View>
+                                      Transak
+                                    </Text>
                                   </View>
                                 </View>
                               </View>
@@ -2058,7 +3169,7 @@ exports[`ProviderSelection matches snapshot when quotes fail to load 1`] = `
                                 accessible={true}
                                 style={
                                   {
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "bottom": 0,
                                     "flexDirection": "row",
                                     "left": 0,
diff --git a/app/components/UI/Ramp/Views/Modals/ProviderSelectionModal/__snapshots__/ProviderSelectionModal.test.tsx.snap b/app/components/UI/Ramp/Views/Modals/ProviderSelectionModal/__snapshots__/ProviderSelectionModal.test.tsx.snap
index 0e4a358ece4c..2ac38e7b82d0 100644
--- a/app/components/UI/Ramp/Views/Modals/ProviderSelectionModal/__snapshots__/ProviderSelectionModal.test.tsx.snap
+++ b/app/components/UI/Ramp/Views/Modals/ProviderSelectionModal/__snapshots__/ProviderSelectionModal.test.tsx.snap
@@ -414,7 +414,7 @@ exports[`ProviderSelectionModal matches snapshot 1`] = `
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "height": 24,
                                         "width": 24,
                                       },
@@ -455,7 +455,7 @@ exports[`ProviderSelectionModal matches snapshot 1`] = `
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 16,
                                       "fontWeight": 400,
@@ -476,72 +476,49 @@ exports[`ProviderSelectionModal matches snapshot 1`] = `
                             />
                           </View>
                         </View>
-                        <View
-                          style={
-                            [
-                              {
-                                "display": "flex",
-                                "paddingBottom": 8,
-                                "paddingLeft": 16,
-                                "paddingRight": 16,
-                                "paddingTop": 4,
-                              },
-                              undefined,
-                            ]
-                          }
-                        >
-                          <Text
-                            accessibilityRole="text"
-                            style={
-                              {
-                                "color": "#b7bbc8",
-                                "fontFamily": "Geist-Regular",
-                                "fontSize": 14,
-                                "letterSpacing": 0,
-                                "lineHeight": 22,
-                              }
-                            }
-                          >
-                            fiat_on_ramp.quotes_displayed_for
-                          </Text>
-                        </View>
                         <RCTScrollView
                           collapsable={false}
                           data={
                             [
                               {
-                                "description": "Test provider",
-                                "environmentType": "PRODUCTION",
-                                "hqAddress": "Test Address",
-                                "id": "/providers/transak",
-                                "links": [],
-                                "logos": {
-                                  "dark": "https://example.com/logo-dark.png",
-                                  "height": 24,
-                                  "light": "https://example.com/logo-light.png",
-                                  "width": 90,
+                                "provider": {
+                                  "description": "Test provider",
+                                  "environmentType": "PRODUCTION",
+                                  "hqAddress": "Test Address",
+                                  "id": "/providers/transak",
+                                  "links": [],
+                                  "logos": {
+                                    "dark": "https://example.com/logo-dark.png",
+                                    "height": 24,
+                                    "light": "https://example.com/logo-light.png",
+                                    "width": 90,
+                                  },
+                                  "name": "Transak",
                                 },
-                                "name": "Transak",
+                                "type": "provider",
                               },
                               {
-                                "description": "Test provider 2",
-                                "environmentType": "PRODUCTION",
-                                "hqAddress": "Test Address 2",
-                                "id": "/providers/moonpay",
-                                "links": [],
-                                "logos": {
-                                  "dark": "https://example.com/moonpay-dark.png",
-                                  "height": 24,
-                                  "light": "https://example.com/moonpay-light.png",
-                                  "width": 90,
+                                "provider": {
+                                  "description": "Test provider 2",
+                                  "environmentType": "PRODUCTION",
+                                  "hqAddress": "Test Address 2",
+                                  "id": "/providers/moonpay",
+                                  "links": [],
+                                  "logos": {
+                                    "dark": "https://example.com/moonpay-dark.png",
+                                    "height": 24,
+                                    "light": "https://example.com/moonpay-light.png",
+                                    "width": 90,
+                                  },
+                                  "name": "MoonPay",
                                 },
-                                "name": "MoonPay",
+                                "type": "provider",
                               },
                             ]
                           }
                           getItem={[Function]}
                           getItemCount={[Function]}
-                          handlerTag={1}
+                          handlerTag={-1}
                           handlerType="NativeViewGestureHandler"
                           keyExtractor={[Function]}
                           keyboardDismissMode="none"
@@ -615,63 +592,22 @@ exports[`ProviderSelectionModal matches snapshot 1`] = `
                                     >
                                       <Text
                                         accessibilityRole="text"
-                                        style={
-                                          {
-                                            "color": "#121314",
-                                            "fontFamily": "Geist-Medium",
-                                            "fontSize": 18,
-                                            "letterSpacing": 0,
-                                            "lineHeight": 24,
-                                          }
-                                        }
-                                      >
-                                        Transak
-                                      </Text>
-                                    </View>
-                                    <View
-                                      accessible={false}
-                                      style={
-                                        {
-                                          "width": 16,
-                                        }
-                                      }
-                                      testID="listitem-gap"
-                                    />
-                                    <View
-                                      style={
-                                        {
-                                          "flex": -1,
-                                        }
-                                      }
-                                      testID="listitemcolumn"
-                                    >
-                                      <View
                                         style={
                                           [
                                             {
-                                              "alignItems": "flex-end",
-                                              "display": "flex",
-                                              "justifyContent": "center",
+                                              "color": "#131416",
+                                              "fontFamily": "Geist-Medium",
+                                              "fontSize": 20,
+                                              "fontWeight": 500,
+                                              "letterSpacing": 0,
+                                              "lineHeight": 24,
                                             },
                                             undefined,
                                           ]
                                         }
                                       >
-                                        <Text
-                                          accessibilityRole="text"
-                                          style={
-                                            {
-                                              "color": "#686e7d",
-                                              "fontFamily": "Geist-Regular",
-                                              "fontSize": 14,
-                                              "letterSpacing": 0,
-                                              "lineHeight": 22,
-                                            }
-                                          }
-                                        >
-                                          fiat_on_ramp.quote_unavailable
-                                        </Text>
-                                      </View>
+                                        Transak
+                                      </Text>
                                     </View>
                                   </View>
                                 </View>
@@ -680,7 +616,7 @@ exports[`ProviderSelectionModal matches snapshot 1`] = `
                                   accessible={true}
                                   style={
                                     {
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "bottom": 0,
                                       "flexDirection": "row",
                                       "left": 0,
@@ -738,63 +674,22 @@ exports[`ProviderSelectionModal matches snapshot 1`] = `
                                     >
                                       <Text
                                         accessibilityRole="text"
-                                        style={
-                                          {
-                                            "color": "#121314",
-                                            "fontFamily": "Geist-Medium",
-                                            "fontSize": 18,
-                                            "letterSpacing": 0,
-                                            "lineHeight": 24,
-                                          }
-                                        }
-                                      >
-                                        MoonPay
-                                      </Text>
-                                    </View>
-                                    <View
-                                      accessible={false}
-                                      style={
-                                        {
-                                          "width": 16,
-                                        }
-                                      }
-                                      testID="listitem-gap"
-                                    />
-                                    <View
-                                      style={
-                                        {
-                                          "flex": -1,
-                                        }
-                                      }
-                                      testID="listitemcolumn"
-                                    >
-                                      <View
                                         style={
                                           [
                                             {
-                                              "alignItems": "flex-end",
-                                              "display": "flex",
-                                              "justifyContent": "center",
+                                              "color": "#131416",
+                                              "fontFamily": "Geist-Medium",
+                                              "fontSize": 20,
+                                              "fontWeight": 500,
+                                              "letterSpacing": 0,
+                                              "lineHeight": 24,
                                             },
                                             undefined,
                                           ]
                                         }
                                       >
-                                        <Text
-                                          accessibilityRole="text"
-                                          style={
-                                            {
-                                              "color": "#686e7d",
-                                              "fontFamily": "Geist-Regular",
-                                              "fontSize": 14,
-                                              "letterSpacing": 0,
-                                              "lineHeight": 22,
-                                            }
-                                          }
-                                        >
-                                          fiat_on_ramp.quote_unavailable
-                                        </Text>
-                                      </View>
+                                        MoonPay
+                                      </Text>
                                     </View>
                                   </View>
                                 </View>
diff --git a/app/components/UI/Ramp/Views/Modals/SettingsModal/SettingsModal.tsx b/app/components/UI/Ramp/Views/Modals/SettingsModal/SettingsModal.tsx
index 8828df360047..3483401c0023 100644
--- a/app/components/UI/Ramp/Views/Modals/SettingsModal/SettingsModal.tsx
+++ b/app/components/UI/Ramp/Views/Modals/SettingsModal/SettingsModal.tsx
@@ -25,6 +25,8 @@ import Logger from '../../../../../../util/Logger';
 import BottomSheetHeader from '../../../../../../component-library/components/BottomSheets/BottomSheetHeader';
 import MenuItem from '../../../components/MenuItem';
 import { useRampsController } from '../../../hooks/useRampsController';
+import { useAnalytics } from '../../../../../hooks/useAnalytics/useAnalytics';
+import { MetaMetricsEvents } from '../../../../../../core/Analytics';
 import {
   getProviderToken,
   resetProviderToken,
@@ -46,6 +48,7 @@ export const createSettingsModalNavDetails = createNavigationDetails(
 );
 
 function SettingsModal() {
+  const { trackEvent, createEventBuilder } = useAnalytics();
   const sheetRef = useRef<BottomSheetRef>(null);
   const navigation = useNavigation();
   const { toastRef } = useContext(ToastContext);
@@ -92,6 +95,15 @@ function SettingsModal() {
   )?.url;
 
   const navigateToOrderHistory = useCallback(() => {
+    trackEvent(
+      createEventBuilder(MetaMetricsEvents.RAMPS_SETTING_OPTION_CLICKED)
+        .addProperties({
+          option: 'View Order History',
+          location: 'Amount Input',
+          ramp_type: 'UNIFIED_BUY_2',
+        })
+        .build(),
+    );
     sheetRef.current?.onCloseBottomSheet();
     navigation.navigate(Routes.TRANSACTIONS_VIEW, {
       screen: Routes.TRANSACTIONS_VIEW,
@@ -99,13 +111,21 @@ function SettingsModal() {
         redirectToOrders: true,
       },
     });
-  }, [navigation]);
+  }, [navigation, trackEvent, createEventBuilder]);
 
   const handleContactSupport = useCallback(async () => {
     if (!supportUrl) return;
+    trackEvent(
+      createEventBuilder(MetaMetricsEvents.RAMPS_SETTING_OPTION_CLICKED)
+        .addProperties({
+          option: 'Contact Support',
+          location: 'Amount Input',
+          ramp_type: 'UNIFIED_BUY_2',
+        })
+        .build(),
+    );
     try {
       if (await InAppBrowser.isAvailable()) {
-        // Close the sheet before the InAppBrowser overlay opens so the two don't overlap.
         sheetRef.current?.onCloseBottomSheet();
         await InAppBrowser.open(supportUrl);
       } else {
@@ -120,9 +140,18 @@ function SettingsModal() {
     } catch (error) {
       Logger.error(error as Error, 'SettingsModal: Failed to open support URL');
     }
-  }, [supportUrl, navigation]);
+  }, [supportUrl, navigation, trackEvent, createEventBuilder]);
 
   const handleLogOut = useCallback(async () => {
+    trackEvent(
+      createEventBuilder(MetaMetricsEvents.RAMPS_SETTING_OPTION_CLICKED)
+        .addProperties({
+          option: 'Log Out',
+          location: 'Amount Input',
+          ramp_type: 'UNIFIED_BUY_2',
+        })
+        .build(),
+    );
     try {
       await resetProviderToken();
       setSelectedProvider(null);
@@ -157,7 +186,7 @@ function SettingsModal() {
         hasNoTimeout: false,
       });
     }
-  }, [setSelectedProvider, toastRef]);
+  }, [setSelectedProvider, toastRef, trackEvent, createEventBuilder]);
 
   const handleClosePress = useCallback(() => {
     sheetRef.current?.onCloseBottomSheet();
diff --git a/app/components/UI/Ramp/Views/Modals/SettingsModal/__snapshots__/SettingsModal.test.tsx.snap b/app/components/UI/Ramp/Views/Modals/SettingsModal/__snapshots__/SettingsModal.test.tsx.snap
index 59f395dfa2f3..0a4824212435 100644
--- a/app/components/UI/Ramp/Views/Modals/SettingsModal/__snapshots__/SettingsModal.test.tsx.snap
+++ b/app/components/UI/Ramp/Views/Modals/SettingsModal/__snapshots__/SettingsModal.test.tsx.snap
@@ -334,7 +334,7 @@ exports[`SettingsModal render matches snapshot 1`] = `
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -384,7 +384,7 @@ exports[`SettingsModal render matches snapshot 1`] = `
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -421,7 +421,7 @@ exports[`SettingsModal render matches snapshot 1`] = `
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -470,7 +470,7 @@ exports[`SettingsModal render matches snapshot 1`] = `
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 16,
                                       "fontWeight": 700,
@@ -510,7 +510,7 @@ exports[`SettingsModal render matches snapshot 1`] = `
                                   }
                                 >
                                   <SvgMock
-                                    color="#121314"
+                                    color="#131416"
                                     fill="currentColor"
                                     height={24}
                                     name="Close"
@@ -565,7 +565,7 @@ exports[`SettingsModal render matches snapshot 1`] = `
                                   testID="listitemcolumn"
                                 >
                                   <SvgMock
-                                    color="#121314"
+                                    color="#131416"
                                     fill="currentColor"
                                     height={20}
                                     name="Clock"
@@ -599,7 +599,7 @@ exports[`SettingsModal render matches snapshot 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Medium",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -652,7 +652,7 @@ exports[`SettingsModal render matches snapshot 1`] = `
                                   testID="listitemcolumn"
                                 >
                                   <SvgMock
-                                    color="#121314"
+                                    color="#131416"
                                     fill="currentColor"
                                     height={20}
                                     name="Messages"
@@ -686,7 +686,7 @@ exports[`SettingsModal render matches snapshot 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Medium",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
diff --git a/app/components/UI/Ramp/Views/Modals/TokenNotAvailableModal/TokenNotAvailableModal.test.tsx b/app/components/UI/Ramp/Views/Modals/TokenNotAvailableModal/TokenNotAvailableModal.test.tsx
index d871bcbf29f8..b2f21fb7b7d9 100644
--- a/app/components/UI/Ramp/Views/Modals/TokenNotAvailableModal/TokenNotAvailableModal.test.tsx
+++ b/app/components/UI/Ramp/Views/Modals/TokenNotAvailableModal/TokenNotAvailableModal.test.tsx
@@ -118,7 +118,9 @@ describe('TokenNotAvailableModal', () => {
     fireEvent.press(getByText('Change token'));
 
     expect(mockOnCloseBottomSheet).toHaveBeenCalledWith(expect.any(Function));
-    expect(mockNavigate).toHaveBeenCalledWith(Routes.RAMP.TOKEN_SELECTION);
+    expect(mockNavigate).toHaveBeenCalledWith(Routes.RAMP.TOKEN_SELECTION, {
+      screen: Routes.RAMP.TOKEN_SELECTION,
+    });
   });
 
   it('navigates to provider picker when Change provider is pressed', () => {
diff --git a/app/components/UI/Ramp/Views/Modals/TokenNotAvailableModal/TokenNotAvailableModal.tsx b/app/components/UI/Ramp/Views/Modals/TokenNotAvailableModal/TokenNotAvailableModal.tsx
index 13a5b1b20234..5f972a1222fb 100644
--- a/app/components/UI/Ramp/Views/Modals/TokenNotAvailableModal/TokenNotAvailableModal.tsx
+++ b/app/components/UI/Ramp/Views/Modals/TokenNotAvailableModal/TokenNotAvailableModal.tsx
@@ -24,6 +24,8 @@ import styleSheet from './TokenNotAvailableModal.styles';
 import { useStyles } from '../../../../../hooks/useStyles';
 import { useRampsController } from '../../../hooks/useRampsController';
 import { createProviderSelectionModalNavigationDetails } from '../ProviderSelectionModal';
+import { useAnalytics } from '../../../../../hooks/useAnalytics/useAnalytics';
+import { MetaMetricsEvents } from '../../../../../../core/Analytics';
 
 export interface TokenNotAvailableModalParams {
   assetId: string;
@@ -36,6 +38,7 @@ export const createTokenNotAvailableModalNavigationDetails =
   );
 
 function TokenNotAvailableModal() {
+  const { trackEvent, createEventBuilder } = useAnalytics();
   const { assetId } = useParams<TokenNotAvailableModalParams>();
   const navigation = useNavigation();
   const sheetRef = useRef<BottomSheetRef>(null);
@@ -48,11 +51,22 @@ function TokenNotAvailableModal() {
 
   const handleChangeToken = useCallback(() => {
     sheetRef.current?.onCloseBottomSheet(() => {
-      navigation.navigate(Routes.RAMP.TOKEN_SELECTION);
+      navigation.navigate(Routes.RAMP.TOKEN_SELECTION, {
+        screen: Routes.RAMP.TOKEN_SELECTION,
+      });
     });
   }, [navigation]);
 
   const handleChangeProvider = useCallback(() => {
+    trackEvent(
+      createEventBuilder(MetaMetricsEvents.RAMPS_CHANGE_PROVIDER_BUTTON_CLICKED)
+        .addProperties({
+          current_provider: selectedProvider?.name,
+          location: 'Amount Input',
+          ramp_type: 'UNIFIED_BUY_2',
+        })
+        .build(),
+    );
     sheetRef.current?.onCloseBottomSheet(() => {
       navigation.navigate(
         ...createProviderSelectionModalNavigationDetails({
@@ -61,7 +75,13 @@ function TokenNotAvailableModal() {
         }),
       );
     });
-  }, [navigation, assetId]);
+  }, [
+    navigation,
+    assetId,
+    selectedProvider?.name,
+    trackEvent,
+    createEventBuilder,
+  ]);
 
   const handleClose = useCallback(() => {
     sheetRef.current?.onCloseBottomSheet();
diff --git a/app/components/UI/Ramp/Views/Modals/TokenNotAvailableModal/__snapshots__/TokenNotAvailableModal.test.tsx.snap b/app/components/UI/Ramp/Views/Modals/TokenNotAvailableModal/__snapshots__/TokenNotAvailableModal.test.tsx.snap
index ff6e5fef19fe..fcf5121f41c9 100644
--- a/app/components/UI/Ramp/Views/Modals/TokenNotAvailableModal/__snapshots__/TokenNotAvailableModal.test.tsx.snap
+++ b/app/components/UI/Ramp/Views/Modals/TokenNotAvailableModal/__snapshots__/TokenNotAvailableModal.test.tsx.snap
@@ -352,9 +352,9 @@ exports[`TokenNotAvailableModal matches snapshot 1`] = `
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#121314",
+                              "color": "#131416",
                               "fontFamily": "Geist-Bold",
-                              "fontSize": 18,
+                              "fontSize": 20,
                               "letterSpacing": 0,
                               "lineHeight": 24,
                             }
@@ -387,7 +387,7 @@ exports[`TokenNotAvailableModal matches snapshot 1`] = `
                             testID="bottomsheetheader-close-button"
                           >
                             <SvgMock
-                              color="#121314"
+                              color="#131416"
                               fill="currentColor"
                               height={24}
                               name="Close"
@@ -415,7 +415,7 @@ exports[`TokenNotAvailableModal matches snapshot 1`] = `
                         accessibilityRole="text"
                         style={
                           {
-                            "color": "#686e7d",
+                            "color": "#66676a",
                             "fontFamily": "Geist-Regular",
                             "fontSize": 16,
                             "letterSpacing": 0,
@@ -454,7 +454,7 @@ exports[`TokenNotAvailableModal matches snapshot 1`] = `
                             {
                               "alignItems": "center",
                               "alignSelf": "stretch",
-                              "backgroundColor": "#3c4d9d0f",
+                              "backgroundColor": "#b4b4b528",
                               "borderColor": "transparent",
                               "borderRadius": 12,
                               "borderWidth": 1,
@@ -471,7 +471,7 @@ exports[`TokenNotAvailableModal matches snapshot 1`] = `
                             accessibilityRole="text"
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Medium",
                                 "fontSize": 16,
                                 "letterSpacing": 0,
@@ -501,7 +501,7 @@ exports[`TokenNotAvailableModal matches snapshot 1`] = `
                             {
                               "alignItems": "center",
                               "alignSelf": "stretch",
-                              "backgroundColor": "#121314",
+                              "backgroundColor": "#131416",
                               "borderRadius": 12,
                               "flexDirection": "row",
                               "height": 48,
@@ -893,9 +893,9 @@ exports[`TokenNotAvailableModal matches snapshot with missing provider and token
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#121314",
+                              "color": "#131416",
                               "fontFamily": "Geist-Bold",
-                              "fontSize": 18,
+                              "fontSize": 20,
                               "letterSpacing": 0,
                               "lineHeight": 24,
                             }
@@ -928,7 +928,7 @@ exports[`TokenNotAvailableModal matches snapshot with missing provider and token
                             testID="bottomsheetheader-close-button"
                           >
                             <SvgMock
-                              color="#121314"
+                              color="#131416"
                               fill="currentColor"
                               height={24}
                               name="Close"
@@ -956,7 +956,7 @@ exports[`TokenNotAvailableModal matches snapshot with missing provider and token
                         accessibilityRole="text"
                         style={
                           {
-                            "color": "#686e7d",
+                            "color": "#66676a",
                             "fontFamily": "Geist-Regular",
                             "fontSize": 16,
                             "letterSpacing": 0,
@@ -995,7 +995,7 @@ exports[`TokenNotAvailableModal matches snapshot with missing provider and token
                             {
                               "alignItems": "center",
                               "alignSelf": "stretch",
-                              "backgroundColor": "#3c4d9d0f",
+                              "backgroundColor": "#b4b4b528",
                               "borderColor": "transparent",
                               "borderRadius": 12,
                               "borderWidth": 1,
@@ -1012,7 +1012,7 @@ exports[`TokenNotAvailableModal matches snapshot with missing provider and token
                             accessibilityRole="text"
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Medium",
                                 "fontSize": 16,
                                 "letterSpacing": 0,
@@ -1042,7 +1042,7 @@ exports[`TokenNotAvailableModal matches snapshot with missing provider and token
                             {
                               "alignItems": "center",
                               "alignSelf": "stretch",
-                              "backgroundColor": "#121314",
+                              "backgroundColor": "#131416",
                               "borderRadius": 12,
                               "flexDirection": "row",
                               "height": 48,
diff --git a/app/components/UI/Ramp/Views/Modals/UnsupportedTokenModal/__snapshots__/UnsupportedTokenModal.test.tsx.snap b/app/components/UI/Ramp/Views/Modals/UnsupportedTokenModal/__snapshots__/UnsupportedTokenModal.test.tsx.snap
index 47632f2026ab..b8a0d82e294d 100644
--- a/app/components/UI/Ramp/Views/Modals/UnsupportedTokenModal/__snapshots__/UnsupportedTokenModal.test.tsx.snap
+++ b/app/components/UI/Ramp/Views/Modals/UnsupportedTokenModal/__snapshots__/UnsupportedTokenModal.test.tsx.snap
@@ -353,7 +353,7 @@ exports[`UnsupportedTokenModal renders the modal with correct title and descript
                           style={
                             [
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Bold",
                                 "fontSize": 16,
                                 "fontWeight": 700,
@@ -394,7 +394,7 @@ exports[`UnsupportedTokenModal renders the modal with correct title and descript
                             testID="bottomsheetheader-close-button"
                           >
                             <SvgMock
-                              color="#121314"
+                              color="#131416"
                               fill="currentColor"
                               height={24}
                               name="Close"
@@ -422,7 +422,7 @@ exports[`UnsupportedTokenModal renders the modal with correct title and descript
                         accessibilityRole="text"
                         style={
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "fontFamily": "Geist-Regular",
                             "fontSize": 16,
                             "letterSpacing": 0,
diff --git a/app/components/UI/Ramp/Views/NativeFlow/BankDetails.test.tsx b/app/components/UI/Ramp/Views/NativeFlow/BankDetails.test.tsx
index a3522d0969f4..ccbf05bd0632 100644
--- a/app/components/UI/Ramp/Views/NativeFlow/BankDetails.test.tsx
+++ b/app/components/UI/Ramp/Views/NativeFlow/BankDetails.test.tsx
@@ -2,7 +2,7 @@ import React from 'react';
 import { render, fireEvent, act, waitFor } from '@testing-library/react-native';
 import V2BankDetails from './BankDetails';
 import { ThemeContext, mockTheme } from '../../../../../util/theme';
-import { FIAT_ORDER_STATES } from '../../../../../constants/on-ramp';
+import type { RampsOrder } from '@metamask/ramps-controller';
 
 const mockNavigate = jest.fn();
 const mockReplace = jest.fn();
@@ -38,13 +38,14 @@ jest.mock('../../../Navbar', () => ({
   getDepositNavbarOptions: jest.fn(() => ({})),
 }));
 
+let mockShouldUpdate = true;
 jest.mock('../../../../../util/navigation/navUtils', () => ({
   createNavigationDetails:
     (..._args: unknown[]) =>
     (params: unknown) => ['MockRoute', params],
   useParams: () => ({
     orderId: 'test-order-id',
-    shouldUpdate: true,
+    shouldUpdate: mockShouldUpdate,
   }),
 }));
 
@@ -150,27 +151,114 @@ jest.mock('../../Deposit/components/BankDetailRow', () => {
   };
 });
 
-let mockOrder: unknown = null;
+const mockGetOrderById = jest.fn();
+const mockRefreshOrder = jest.fn();
+const mockRemoveOrder = jest.fn();
+const mockAddOrder = jest.fn();
+
+jest.mock('../../hooks/useRampsOrders', () => ({
+  useRampsOrders: () => ({
+    orders: [],
+    getOrderById: mockGetOrderById,
+    addOrder: mockAddOrder,
+    removeOrder: mockRemoveOrder,
+    refreshOrder: mockRefreshOrder,
+    getOrderFromCallback: jest.fn(),
+  }),
+  default: () => ({
+    orders: [],
+    getOrderById: mockGetOrderById,
+    addOrder: mockAddOrder,
+    removeOrder: mockRemoveOrder,
+    refreshOrder: mockRefreshOrder,
+    getOrderFromCallback: jest.fn(),
+  }),
+}));
 
 jest.mock('react-redux', () => ({
   ...jest.requireActual('react-redux'),
   useSelector: (selector: unknown) => {
-    if (
-      typeof selector === 'function' &&
-      (selector as { name?: string }).name === 'selectTokens'
-    ) {
-      return {
-        data: null,
-        selected: { assetId: 'eip155:1/erc20:0x123', chainId: 'eip155:1' },
-        isLoading: false,
-        error: null,
-      };
+    if (typeof selector === 'function') {
+      return (selector as () => unknown)();
     }
-    return mockOrder;
+    return undefined;
   },
   useDispatch: () => jest.fn(),
 }));
 
+const MOCK_PAYMENT_DETAILS = [
+  {
+    fiatCurrency: 'USD',
+    paymentMethod: 'bank_transfer',
+    fields: [
+      { name: 'Amount', id: 'amount', value: '$100.00' },
+      { name: 'First Name (Beneficiary)', id: 'first_name', value: 'john' },
+      { name: 'Last Name (Beneficiary)', id: 'last_name', value: 'doe' },
+      { name: 'Account Number', id: 'account_number', value: '123456789' },
+      { name: 'Routing Number', id: 'routing_number', value: '987654321' },
+      { name: 'Account Type', id: 'account_type', value: 'checking' },
+      { name: 'Bank Name', id: 'bank_name', value: 'test bank' },
+    ],
+  },
+];
+
+function createMockV2Order(
+  overrides: Partial<RampsOrder> = {},
+): Partial<RampsOrder> {
+  return {
+    providerOrderId: 'test-order-id',
+    status: 'CREATED' as RampsOrder['status'],
+    walletAddress: '0xabc',
+    cryptoAmount: '0.05',
+    fiatAmount: 100,
+    fiatCurrency: { symbol: 'USD' },
+    exchangeRate: 2000,
+    totalFeesFiat: 5,
+    txHash: '',
+    isOnlyLink: false,
+    success: true,
+    providerOrderLink: '',
+    createdAt: Date.now(),
+    network: { name: 'Ethereum', chainId: 'eip155:1' },
+    canBeUpdated: false,
+    idHasExpired: false,
+    excludeFromPurchases: false,
+    timeDescriptionPending: '',
+    orderType: 'BUY',
+    provider: {
+      id: '/providers/transak-native',
+      name: 'Transak',
+      environmentType: 'production',
+      description: '',
+      hqAddress: '',
+      links: [],
+      logos: { light: '', dark: '', height: 0, width: 0 },
+    },
+    paymentMethod: { id: 'pm-1', shortName: 'Bank Transfer' },
+    paymentDetails: MOCK_PAYMENT_DETAILS,
+    ...overrides,
+  };
+}
+
+function createMockDepositOrder(
+  overrides: Record<string, unknown> = {},
+): Record<string, unknown> {
+  return {
+    id: 'test-order-id',
+    walletAddress: '0xabc',
+    fiatAmount: 100,
+    cryptoAmount: '0.05',
+    exchangeRate: 2000,
+    totalFeesFiat: 5,
+    fiatCurrency: 'USD',
+    paymentMethod: { id: 'pm-1', shortName: 'Bank Transfer' },
+    paymentDetails: MOCK_PAYMENT_DETAILS,
+    network: { chainId: 'eip155:1' },
+    cryptoCurrency: { assetId: 'asset1', symbol: 'ETH' },
+    ...overrides,
+  };
+}
+
 const renderWithTheme = (component: React.ReactElement) =>
   render(
     <ThemeContext.Provider value={mockTheme}>
@@ -181,121 +269,146 @@ const renderWithTheme = (component: React.ReactElement) =>
 describe('V2BankDetails', () => {
   beforeEach(() => {
     jest.clearAllMocks();
-    mockOrder = null;
+    mockShouldUpdate = true;
+    mockGetOrderById.mockReturnValue(undefined);
+    mockRefreshOrder.mockResolvedValue(undefined);
   });
 
   it('matches snapshot when order is null (loading)', () => {
-    mockOrder = null;
     const { toJSON } = renderWithTheme(<V2BankDetails />);
     expect(toJSON()).toMatchSnapshot();
   });
 
   it('renders loader when order is not available', () => {
-    mockOrder = null;
     const { getByTestId } = renderWithTheme(<V2BankDetails />);
     expect(getByTestId('loader')).toBeOnTheScreen();
   });
 
-  it('matches snapshot with order data', () => {
-    mockOrder = {
-      id: 'test-order-id',
-      state: FIAT_ORDER_STATES.CREATED,
-      account: '0xabc',
-      cryptoAmount: '0.05',
-      data: {
-        fiatAmount: '100',
-        fiatCurrency: 'USD',
-        exchangeRate: '2000',
-        totalFeesFiat: '5',
-        paymentMethod: { id: 'pm-1', shortName: 'Bank Transfer' },
+  it('matches snapshot with order data and depositOrder from refresh', async () => {
+    mockGetOrderById.mockReturnValue(createMockV2Order());
+    mockGetOrder.mockResolvedValue(createMockDepositOrder());
+
+    const { toJSON } = renderWithTheme(<V2BankDetails />);
+
+    await waitFor(() => {
+      expect(mockGetOrder).toHaveBeenCalled();
+    });
+
+    expect(toJSON()).toMatchSnapshot();
+  });
+
+  it('renders bank detail rows when order has payment details', async () => {
+    mockGetOrderById.mockReturnValue(
+      createMockV2Order({
         paymentDetails: [
           {
+            fiatCurrency: 'USD',
+            paymentMethod: 'bank_transfer',
             fields: [
-              { name: 'Amount', value: '$100.00' },
-              { name: 'First Name (Beneficiary)', value: 'john' },
-              { name: 'Last Name (Beneficiary)', value: 'doe' },
-              { name: 'Account Number', value: '123456789' },
-              { name: 'Routing Number', value: '987654321' },
-              { name: 'Account Type', value: 'checking' },
-              { name: 'Bank Name', value: 'test bank' },
+              { name: 'Amount', id: 'amount', value: '$100.00' },
+              {
+                name: 'Account Number',
+                id: 'account_number',
+                value: '123456789',
+              },
             ],
           },
         ],
-      },
-    };
-    const { toJSON } = renderWithTheme(<V2BankDetails />);
-    expect(toJSON()).toMatchSnapshot();
-  });
-
-  it('renders bank detail rows when order has payment details', () => {
-    mockOrder = {
-      id: 'test-order-id',
-      state: FIAT_ORDER_STATES.CREATED,
-      account: '0xabc',
-      cryptoAmount: '0.05',
-      data: {
-        fiatAmount: '100',
-        fiatCurrency: 'USD',
-        exchangeRate: '2000',
-        totalFeesFiat: '5',
-        paymentMethod: { id: 'pm-1', shortName: 'Bank Transfer' },
+      }),
+    );
+    mockGetOrder.mockResolvedValue(
+      createMockDepositOrder({
         paymentDetails: [
           {
+            fiatCurrency: 'USD',
+            paymentMethod: 'bank_transfer',
             fields: [
-              { name: 'Amount', value: '$100.00' },
-              { name: 'Account Number', value: '123456789' },
+              { name: 'Amount', id: 'amount', value: '$100.00' },
+              {
+                name: 'Account Number',
+                id: 'account_number',
+                value: '123456789',
+              },
             ],
           },
         ],
-      },
-    };
+      }),
+    );
+
     const { getByText } = renderWithTheme(<V2BankDetails />);
 
-    expect(getByText('deposit.bank_details.main_title')).toBeOnTheScreen();
+    await waitFor(() => {
+      expect(getByText('deposit.bank_details.main_title')).toBeOnTheScreen();
+    });
   });
 
   it('renders the refresh control scroll view', () => {
-    mockOrder = {
-      id: 'test-order-id',
-      state: FIAT_ORDER_STATES.CREATED,
-      account: '0xabc',
-      data: {
-        paymentMethod: { id: 'pm-1', shortName: 'Bank Transfer' },
-        paymentDetails: [],
-      },
-    };
+    mockGetOrderById.mockReturnValue(createMockV2Order({ paymentDetails: [] }));
+
     const { getByTestId } = renderWithTheme(<V2BankDetails />);
     expect(
       getByTestId('bank-details-refresh-control-scrollview'),
     ).toBeOnTheScreen();
   });
 
-  it('toggles bank info when show/hide button is pressed', () => {
-    mockOrder = {
-      id: 'test-order-id',
-      state: FIAT_ORDER_STATES.CREATED,
-      account: '0xabc',
-      cryptoAmount: '0.05',
-      data: {
-        fiatAmount: '100',
-        fiatCurrency: 'USD',
-        exchangeRate: '2000',
-        totalFeesFiat: '5',
-        paymentMethod: { id: 'pm-1', shortName: 'Bank Transfer' },
+  it('toggles bank info when show/hide button is pressed', async () => {
+    mockGetOrderById.mockReturnValue(
+      createMockV2Order({
         paymentDetails: [
           {
+            fiatCurrency: 'USD',
+            paymentMethod: 'bank_transfer',
             fields: [
-              { name: 'Amount', value: '$100.00' },
-              { name: 'Bank Name', value: 'test bank' },
-              { name: 'Bank Address', value: '123 Bank St' },
-              { name: 'Recipient Address', value: '456 Beneficiary Ave' },
+              { name: 'Amount', id: 'amount', value: '$100.00' },
+              { name: 'Bank Name', id: 'bank_name', value: 'test bank' },
+              {
+                name: 'Bank Address',
+                id: 'bank_address',
+                value: '123 Bank St',
+              },
+              {
+                name: 'Recipient Address',
+                id: 'recipient_address',
+                value: '456 Beneficiary Ave',
+              },
             ],
           },
         ],
-      },
-    };
+      }),
+    );
+    mockGetOrder.mockResolvedValue(
+      createMockDepositOrder({
+        paymentDetails: [
+          {
+            fiatCurrency: 'USD',
+            paymentMethod: 'bank_transfer',
+            fields: [
+              { name: 'Amount', id: 'amount', value: '$100.00' },
+              { name: 'Bank Name', id: 'bank_name', value: 'test bank' },
+              {
+                name: 'Bank Address',
+                id: 'bank_address',
+                value: '123 Bank St',
+              },
+              {
+                name: 'Recipient Address',
+                id: 'recipient_address',
+                value: '456 Beneficiary Ave',
+              },
+            ],
+          },
+        ],
+      }),
+    );
+
     const { getByText, queryByText } = renderWithTheme(<V2BankDetails />);
 
+    await waitFor(() => {
+      expect(
+        getByText('deposit.bank_details.show_bank_info'),
+      ).toBeOnTheScreen();
+    });
+
     expect(queryByText('Test Bank')).toBeNull();
 
     fireEvent.press(getByText('deposit.bank_details.show_bank_info'));
@@ -305,40 +418,15 @@ describe('V2BankDetails', () => {
 
   it('handles confirm payment button press', async () => {
     mockConfirmPayment.mockResolvedValue(undefined);
-    mockGetOrder.mockResolvedValue({
-      id: 'test-order-id',
-      walletAddress: '0xabc',
-      fiatAmount: '100',
-      cryptoAmount: '0.05',
-      exchangeRate: '2000',
-      totalFeesFiat: '5',
-      fiatCurrency: 'USD',
-      paymentMethod: { id: 'pm-1' },
-      network: { chainId: 'eip155:1' },
-      cryptoCurrency: { assetId: 'asset1', symbol: 'ETH' },
-    });
-
-    mockOrder = {
-      id: 'test-order-id',
-      state: FIAT_ORDER_STATES.CREATED,
-      account: '0xabc',
-      cryptoAmount: '0.05',
-      data: {
-        fiatAmount: '100',
-        fiatCurrency: 'USD',
-        exchangeRate: '2000',
-        totalFeesFiat: '5',
-        paymentMethod: { id: 'pm-1', shortName: 'Bank Transfer' },
-        paymentDetails: [
-          {
-            fields: [{ name: 'Amount', value: '$100.00' }],
-          },
-        ],
-      },
-    };
+    mockGetOrderById.mockReturnValue(createMockV2Order());
+    mockGetOrder.mockResolvedValue(createMockDepositOrder());
 
     const { getByTestId } = renderWithTheme(<V2BankDetails />);
 
+    await waitFor(() => {
+      expect(mockGetOrder).toHaveBeenCalled();
+    });
+
     await act(async () => {
       fireEvent.press(getByTestId('main-action-button'));
     });
@@ -350,32 +438,15 @@ describe('V2BankDetails', () => {
 
   it('handles cancel order button press', async () => {
     mockCancelOrder.mockResolvedValue(undefined);
-    mockGetOrder.mockResolvedValue({
-      id: 'test-order-id',
-      walletAddress: '0xabc',
-    });
-
-    mockOrder = {
-      id: 'test-order-id',
-      state: FIAT_ORDER_STATES.CREATED,
-      account: '0xabc',
-      cryptoAmount: '0.05',
-      data: {
-        fiatAmount: '100',
-        fiatCurrency: 'USD',
-        exchangeRate: '2000',
-        totalFeesFiat: '5',
-        paymentMethod: { id: 'pm-1', shortName: 'Bank Transfer' },
-        paymentDetails: [
-          {
-            fields: [{ name: 'Amount', value: '$100.00' }],
-          },
-        ],
-      },
-    };
+    mockGetOrderById.mockReturnValue(createMockV2Order());
+    mockGetOrder.mockResolvedValue(createMockDepositOrder());
 
     const { getByText } = renderWithTheme(<V2BankDetails />);
 
+    await waitFor(() => {
+      expect(mockGetOrder).toHaveBeenCalled();
+    });
+
     await act(async () => {
       fireEvent.press(
         getByText('deposit.order_processing.cancel_order_button'),
@@ -387,32 +458,23 @@ describe('V2BankDetails', () => {
     });
   });
 
-  it('navigates to AMOUNT_INPUT when order state is CANCELLED', () => {
-    mockOrder = {
-      id: 'test-order-id',
-      state: FIAT_ORDER_STATES.CANCELLED,
-      account: '0xabc',
-      data: {
-        paymentMethod: { id: 'pm-1', shortName: 'Bank Transfer' },
-        paymentDetails: [],
-      },
-    };
+  it('replaces current screen with RAMPS_ORDER_DETAILS when order status is CANCELLED', () => {
+    mockGetOrderById.mockReturnValue(
+      createMockV2Order({ status: 'CANCELLED' as RampsOrder['status'] }),
+    );
 
     renderWithTheme(<V2BankDetails />);
 
-    expect(mockNavigate).toHaveBeenCalledWith('RampAmountInput');
+    expect(mockReplace).toHaveBeenCalledWith('RampsOrderDetails', {
+      orderId: 'test-order-id',
+      showCloseButton: true,
+    });
   });
 
-  it('replaces current screen with RAMPS_ORDER_DETAILS when order state is PENDING', () => {
-    mockOrder = {
-      id: 'test-order-id',
-      state: FIAT_ORDER_STATES.PENDING,
-      account: '0xabc',
-      data: {
-        paymentMethod: { id: 'pm-1', shortName: 'Bank Transfer' },
-        paymentDetails: [],
-      },
-    };
+  it('replaces current screen with RAMPS_ORDER_DETAILS when order status is PENDING', () => {
+    mockGetOrderById.mockReturnValue(
+      createMockV2Order({ status: 'PENDING' as RampsOrder['status'] }),
+    );
 
     renderWithTheme(<V2BankDetails />);
 
@@ -423,31 +485,18 @@ describe('V2BankDetails', () => {
   });
 
   it('handles 401 error during confirm payment', async () => {
-    const error = { status: 401 };
+    const error = { httpStatus: 401 };
     mockConfirmPayment.mockRejectedValue(error);
     mockLogoutFromProvider.mockResolvedValue(undefined);
-
-    mockOrder = {
-      id: 'test-order-id',
-      state: FIAT_ORDER_STATES.CREATED,
-      account: '0xabc',
-      cryptoAmount: '0.05',
-      data: {
-        fiatAmount: '100',
-        fiatCurrency: 'USD',
-        exchangeRate: '2000',
-        totalFeesFiat: '5',
-        paymentMethod: { id: 'pm-1', shortName: 'Bank Transfer' },
-        paymentDetails: [
-          {
-            fields: [{ name: 'Amount', value: '$100.00' }],
-          },
-        ],
-      },
-    };
+    mockGetOrderById.mockReturnValue(createMockV2Order());
+    mockGetOrder.mockResolvedValue(createMockDepositOrder());
 
     const { getByTestId } = renderWithTheme(<V2BankDetails />);
 
+    await waitFor(() => {
+      expect(mockGetOrder).toHaveBeenCalled();
+    });
+
     await act(async () => {
       fireEvent.press(getByTestId('main-action-button'));
     });
@@ -458,31 +507,18 @@ describe('V2BankDetails', () => {
   });
 
   it('handles 401 error during cancel order', async () => {
-    const error = { status: 401 };
+    const error = { httpStatus: 401 };
     mockCancelOrder.mockRejectedValue(error);
     mockLogoutFromProvider.mockResolvedValue(undefined);
-
-    mockOrder = {
-      id: 'test-order-id',
-      state: FIAT_ORDER_STATES.CREATED,
-      account: '0xabc',
-      cryptoAmount: '0.05',
-      data: {
-        fiatAmount: '100',
-        fiatCurrency: 'USD',
-        exchangeRate: '2000',
-        totalFeesFiat: '5',
-        paymentMethod: { id: 'pm-1', shortName: 'Bank Transfer' },
-        paymentDetails: [
-          {
-            fields: [{ name: 'Amount', value: '$100.00' }],
-          },
-        ],
-      },
-    };
+    mockGetOrderById.mockReturnValue(createMockV2Order());
+    mockGetOrder.mockResolvedValue(createMockDepositOrder());
 
     const { getByText } = renderWithTheme(<V2BankDetails />);
 
+    await waitFor(() => {
+      expect(mockGetOrder).toHaveBeenCalled();
+    });
+
     await act(async () => {
       fireEvent.press(
         getByText('deposit.order_processing.cancel_order_button'),
@@ -494,58 +530,45 @@ describe('V2BankDetails', () => {
     });
   });
 
-  it('renders IBAN and BIC fields when present', () => {
-    mockOrder = {
-      id: 'test-order-id',
-      state: FIAT_ORDER_STATES.CREATED,
-      account: '0xabc',
-      cryptoAmount: '0.05',
-      data: {
-        fiatAmount: '100',
-        fiatCurrency: 'USD',
-        exchangeRate: '2000',
-        totalFeesFiat: '5',
-        paymentMethod: { id: 'pm-1', shortName: 'Bank Transfer' },
-        paymentDetails: [
-          {
-            fields: [
-              { name: 'Amount', value: '€100.00' },
-              { name: 'IBAN', value: 'DE89370400440532013000' },
-              { name: 'BIC', value: 'COBADEFFXXX' },
-            ],
-          },
+  it('renders IBAN and BIC fields when present', async () => {
+    const sepaPaymentDetails = [
+      {
+        fiatCurrency: 'EUR',
+        paymentMethod: 'sepa',
+        fields: [
+          { name: 'Amount', id: 'amount', value: '€100.00' },
+          { name: 'IBAN', id: 'iban', value: 'DE89370400440532013000' },
+          { name: 'BIC', id: 'bic', value: 'COBADEFFXXX' },
         ],
       },
-    };
+    ];
+    mockGetOrderById.mockReturnValue(
+      createMockV2Order({ paymentDetails: sepaPaymentDetails }),
+    );
+    mockGetOrder.mockResolvedValue(
+      createMockDepositOrder({ paymentDetails: sepaPaymentDetails }),
+    );
 
     const { toJSON } = renderWithTheme(<V2BankDetails />);
+
+    await waitFor(() => {
+      expect(mockGetOrder).toHaveBeenCalled();
+    });
+
     expect(toJSON()).toMatchSnapshot();
   });
 
   it('shows confirm payment error when confirmPayment fails with non-401', async () => {
     mockConfirmPayment.mockRejectedValue(new Error('Network error'));
-
-    mockOrder = {
-      id: 'test-order-id',
-      state: FIAT_ORDER_STATES.CREATED,
-      account: '0xabc',
-      cryptoAmount: '0.05',
-      data: {
-        fiatAmount: '100',
-        fiatCurrency: 'USD',
-        exchangeRate: '2000',
-        totalFeesFiat: '5',
-        paymentMethod: { id: 'pm-1', shortName: 'Bank Transfer' },
-        paymentDetails: [
-          {
-            fields: [{ name: 'Amount', value: '$100.00' }],
-          },
-        ],
-      },
-    };
+    mockGetOrderById.mockReturnValue(createMockV2Order());
+    mockGetOrder.mockResolvedValue(createMockDepositOrder());
 
     const { getByTestId, getByText } = renderWithTheme(<V2BankDetails />);
 
+    await waitFor(() => {
+      expect(mockGetOrder).toHaveBeenCalled();
+    });
+
     await act(async () => {
       fireEvent.press(getByTestId('main-action-button'));
     });
@@ -557,28 +580,15 @@ describe('V2BankDetails', () => {
 
   it('shows cancel order error when cancel fails with non-401', async () => {
     mockCancelOrder.mockRejectedValue(new Error('Cancel failed'));
-
-    mockOrder = {
-      id: 'test-order-id',
-      state: FIAT_ORDER_STATES.CREATED,
-      account: '0xabc',
-      cryptoAmount: '0.05',
-      data: {
-        fiatAmount: '100',
-        fiatCurrency: 'USD',
-        exchangeRate: '2000',
-        totalFeesFiat: '5',
-        paymentMethod: { id: 'pm-1', shortName: 'Bank Transfer' },
-        paymentDetails: [
-          {
-            fields: [{ name: 'Amount', value: '$100.00' }],
-          },
-        ],
-      },
-    };
+    mockGetOrderById.mockReturnValue(createMockV2Order());
+    mockGetOrder.mockResolvedValue(createMockDepositOrder());
 
     const { getByText } = renderWithTheme(<V2BankDetails />);
 
+    await waitFor(() => {
+      expect(mockGetOrder).toHaveBeenCalled();
+    });
+
     await act(async () => {
       fireEvent.press(
         getByText('deposit.order_processing.cancel_order_button'),
@@ -599,40 +609,15 @@ describe('V2BankDetails', () => {
         resolveConfirm = resolve;
       }),
     );
-    mockGetOrder.mockResolvedValue({
-      id: 'test-order-id',
-      walletAddress: '0xabc',
-      fiatAmount: '100',
-      cryptoAmount: '0.05',
-      exchangeRate: '2000',
-      totalFeesFiat: '5',
-      fiatCurrency: 'USD',
-      paymentMethod: { id: 'pm-1' },
-      network: { chainId: 'eip155:1' },
-      cryptoCurrency: { assetId: 'asset1', symbol: 'ETH' },
-    });
-
-    mockOrder = {
-      id: 'test-order-id',
-      state: FIAT_ORDER_STATES.CREATED,
-      account: '0xabc',
-      cryptoAmount: '0.05',
-      data: {
-        fiatAmount: '100',
-        fiatCurrency: 'USD',
-        exchangeRate: '2000',
-        totalFeesFiat: '5',
-        paymentMethod: { id: 'pm-1', shortName: 'Bank Transfer' },
-        paymentDetails: [
-          {
-            fields: [{ name: 'Amount', value: '$100.00' }],
-          },
-        ],
-      },
-    };
+    mockGetOrderById.mockReturnValue(createMockV2Order());
+    mockGetOrder.mockResolvedValue(createMockDepositOrder());
 
     const { toJSON, getByTestId } = renderWithTheme(<V2BankDetails />);
 
+    await waitFor(() => {
+      expect(mockGetOrder).toHaveBeenCalled();
+    });
+
     await act(async () => {
       fireEvent.press(getByTestId('main-action-button'));
       await Promise.resolve();
@@ -652,32 +637,15 @@ describe('V2BankDetails', () => {
         resolveCancel = resolve;
       }),
     );
-    mockGetOrder.mockResolvedValue({
-      id: 'test-order-id',
-      walletAddress: '0xabc',
-    });
-
-    mockOrder = {
-      id: 'test-order-id',
-      state: FIAT_ORDER_STATES.CREATED,
-      account: '0xabc',
-      cryptoAmount: '0.05',
-      data: {
-        fiatAmount: '100',
-        fiatCurrency: 'USD',
-        exchangeRate: '2000',
-        totalFeesFiat: '5',
-        paymentMethod: { id: 'pm-1', shortName: 'Bank Transfer' },
-        paymentDetails: [
-          {
-            fields: [{ name: 'Amount', value: '$100.00' }],
-          },
-        ],
-      },
-    };
+    mockGetOrderById.mockReturnValue(createMockV2Order());
+    mockGetOrder.mockResolvedValue(createMockDepositOrder());
 
     const { toJSON, getByText } = renderWithTheme(<V2BankDetails />);
 
+    await waitFor(() => {
+      expect(mockGetOrder).toHaveBeenCalled();
+    });
+
     await act(async () => {
       fireEvent.press(
         getByText('deposit.order_processing.cancel_order_button'),
@@ -691,4 +659,47 @@ describe('V2BankDetails', () => {
       resolveCancel();
     });
   });
+
+  describe('when shouldUpdate is false', () => {
+    beforeEach(() => {
+      mockShouldUpdate = false;
+    });
+
+    it('reads paymentDetails from the controller order without calling getDepositOrder', () => {
+      mockGetOrderById.mockReturnValue(createMockV2Order());
+
+      const { queryByTestId, getByText } = renderWithTheme(<V2BankDetails />);
+
+      expect(mockGetOrder).not.toHaveBeenCalled();
+      expect(queryByTestId('loader')).toBeNull();
+      expect(getByText('deposit.bank_details.main_title')).toBeOnTheScreen();
+    });
+
+    it('matches snapshot showing bank details from controller order', () => {
+      mockGetOrderById.mockReturnValue(createMockV2Order());
+
+      const { toJSON } = renderWithTheme(<V2BankDetails />);
+
+      expect(toJSON()).toMatchSnapshot();
+    });
+
+    it('confirms payment using paymentMethod from controller order', async () => {
+      mockConfirmPayment.mockResolvedValue(undefined);
+      mockGetOrder.mockResolvedValue(createMockDepositOrder());
+      mockGetOrderById.mockReturnValue(createMockV2Order());
+
+      const { getByTestId } = renderWithTheme(<V2BankDetails />);
+
+      await act(async () => {
+        fireEvent.press(getByTestId('main-action-button'));
+      });
+
+      await waitFor(() => {
+        expect(mockConfirmPayment).toHaveBeenCalledWith(
+          'test-order-id',
+          'pm-1',
+        );
+      });
+    });
+  });
 });
diff --git a/app/components/UI/Ramp/Views/NativeFlow/BankDetails.tsx b/app/components/UI/Ramp/Views/NativeFlow/BankDetails.tsx
index 02e24f62ae17..f9a0750f3ec9 100644
--- a/app/components/UI/Ramp/Views/NativeFlow/BankDetails.tsx
+++ b/app/components/UI/Ramp/Views/NativeFlow/BankDetails.tsx
@@ -1,7 +1,6 @@
 import React, { useCallback, useEffect, useState } from 'react';
 import { View, TouchableOpacity, RefreshControl } from 'react-native';
 import { ScrollView } from 'react-native-gesture-handler';
-import { useDispatch, useSelector } from 'react-redux';
 import styleSheet from '../../Deposit/Views/BankDetails/BankDetails.styles';
 import { useNavigation } from '@react-navigation/native';
 import { useParams } from '../../../../../util/navigation/navUtils';
@@ -21,15 +20,10 @@ import Icon, {
 import Loader from '../../../../../component-library/components-temp/Loader/Loader';
 import BankDetailRow from '../../Deposit/components/BankDetailRow';
 import {
-  FiatOrder,
-  getOrderById,
-  updateFiatOrder,
-} from '../../../../../reducers/fiatOrders';
-import { FIAT_ORDER_STATES } from '../../../../../constants/on-ramp';
+  RampsOrderStatus,
+  type TransakDepositOrder,
+} from '@metamask/ramps-controller';
 import { useTheme } from '../../../../../util/theme';
-import { RootState } from '../../../../../reducers';
-import { hasDepositOrderField } from '../../Deposit/utils';
-import { depositOrderToFiatOrder } from '../../Deposit/orderProcessor';
 import Button, {
   ButtonSize,
   ButtonVariants,
@@ -42,20 +36,32 @@ import { useTransakController } from '../../hooks/useTransakController';
 import { useRampsUserRegion } from '../../hooks/useRampsUserRegion';
 import { selectTokens } from '../../../../../selectors/rampsController';
 import { parseUserFacingError } from '../../utils/parseUserFacingError';
+import { useRampsOrders } from '../../hooks/useRampsOrders';
+import { useSelector } from 'react-redux';
+import { isHttpUnauthorized } from '../../utils/isHttpUnauthorized';
 
 export interface BankDetailsParams {
   orderId: string;
   shouldUpdate?: boolean;
 }
 
+const TERMINAL_STATUSES = new Set([
+  RampsOrderStatus.Completed,
+  RampsOrderStatus.Failed,
+  RampsOrderStatus.Cancelled,
+]);
+
+/**
+ * V2 bank details screen. Reads order lifecycle from controller state
+ * and fetches deposit-specific data (paymentDetails) from TransakService.
+ */
 const V2BankDetails = () => {
   const navigation = useNavigation();
   const { styles, theme } = useStyles(styleSheet, {});
   const { colors } = useTheme();
-  const dispatch = useDispatch();
   const {
     logoutFromProvider,
-    getOrder,
+    getOrder: getDepositOrder,
     confirmPayment,
     cancelOrder: transakCancelOrder,
   } = useTransakController();
@@ -63,12 +69,16 @@ const V2BankDetails = () => {
   const tokensResource = useSelector(selectTokens);
   const selectedCryptoCurrency = tokensResource?.selected;
   const trackEvent = useAnalytics();
+  const { getOrderById, refreshOrder } = useRampsOrders();
 
   const regionIsoCode = userRegion?.country?.isoCode || '';
 
   const { orderId, shouldUpdate = true } = useParams<BankDetailsParams>();
-  const order = useSelector((state: RootState) => getOrderById(state, orderId));
+  const order = getOrderById(orderId);
 
+  const [depositOrder, setDepositOrder] = useState<TransakDepositOrder | null>(
+    null,
+  );
   const [showBankInfo, setShowBankInfo] = useState(false);
   const [isRefreshing, setIsRefreshing] = useState(false);
 
@@ -80,13 +90,6 @@ const V2BankDetails = () => {
   );
   const [isLoadingConfirmPayment, setIsLoadingConfirmPayment] = useState(false);
 
-  const dispatchUpdateFiatOrder = useCallback(
-    (updatedOrder: FiatOrder) => {
-      dispatch(updateFiatOrder(updatedOrder));
-    },
-    [dispatch],
-  );
-
   const handleLogoutError = useCallback(async () => {
     try {
       await logoutFromProvider(false);
@@ -101,22 +104,26 @@ const V2BankDetails = () => {
 
     try {
       setIsRefreshing(true);
-      const updatedDepositOrder = await getOrder(order.id, order.account);
+
+      const updatedDepositOrder = await getDepositOrder(
+        order.providerOrderId,
+        order.walletAddress,
+      );
       if (updatedDepositOrder) {
-        const updatedFiatOrder = depositOrderToFiatOrder(
-          updatedDepositOrder as Parameters<typeof depositOrderToFiatOrder>[0],
-        );
-        dispatchUpdateFiatOrder({
-          ...updatedFiatOrder,
-          account: order.account,
-          lastTimeFetched: Date.now(),
-          errorCount: 0,
-          forceUpdate: false,
-        });
+        setDepositOrder(updatedDepositOrder);
       }
+
+      const providerCode = (order.provider?.id ?? '').replace(
+        '/providers/',
+        '',
+      );
+      await refreshOrder(
+        providerCode,
+        order.providerOrderId,
+        order.walletAddress,
+      );
     } catch (refreshError) {
-      const httpError = refreshError as { status?: number };
-      if (httpError.status === 401) {
+      if (isHttpUnauthorized(refreshError)) {
         await handleLogoutError();
         return;
       }
@@ -124,31 +131,28 @@ const V2BankDetails = () => {
     } finally {
       setIsRefreshing(false);
     }
-  }, [order, getOrder, dispatchUpdateFiatOrder, handleLogoutError]);
+  }, [order, getDepositOrder, refreshOrder, handleLogoutError]);
 
   useEffect(() => {
-    if (order?.state === FIAT_ORDER_STATES.CREATED && shouldUpdate) {
+    if (order?.status === RampsOrderStatus.Created && shouldUpdate) {
       handleOnRefresh();
     }
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
 
   useEffect(() => {
-    if (!order?.state) return;
-    if (order.state === FIAT_ORDER_STATES.CANCELLED) {
-      navigation.navigate(Routes.RAMP.AMOUNT_INPUT as never);
-    } else if (
-      order.state === FIAT_ORDER_STATES.PENDING ||
-      order.state === FIAT_ORDER_STATES.COMPLETED ||
-      order.state === FIAT_ORDER_STATES.FAILED
+    if (!order?.status) return;
+    if (
+      TERMINAL_STATUSES.has(order.status) ||
+      order.status === RampsOrderStatus.Pending
     ) {
       // @ts-expect-error navigation prop mismatch
       navigation.replace(Routes.RAMP.RAMPS_ORDER_DETAILS, {
-        orderId: order.id,
+        orderId: order.providerOrderId,
         showCloseButton: true,
       });
     }
-  }, [order?.state, navigation, order?.id]);
+  }, [order?.status, navigation, order?.providerOrderId]);
 
   const capitalizeWords = useCallback(
     (text: string): string =>
@@ -166,19 +170,15 @@ const V2BankDetails = () => {
 
   const getFieldValue = useCallback(
     (fieldName: string): string | null => {
-      if (!hasDepositOrderField(order?.data, 'paymentDetails')) return null;
-
-      if (!order.data.paymentDetails || order.data.paymentDetails.length === 0)
-        return null;
+      const details = depositOrder?.paymentDetails ?? order?.paymentDetails;
+      if (!details?.length) return null;
 
-      const field = order.data.paymentDetails[0].fields.find(
-        (f) => f.name === fieldName,
-      );
+      const field = details[0].fields.find((f) => f.name === fieldName);
       if (!field?.value) return null;
 
       return capitalizeWords(field.value);
     },
-    [order, capitalizeWords],
+    [depositOrder, order, capitalizeWords],
   );
 
   const amount = getFieldValue('Amount');
@@ -197,31 +197,34 @@ const V2BankDetails = () => {
   const iban = getFieldValue('IBAN');
   const bic = getFieldValue('BIC');
 
+  const paymentMethodShortName =
+    depositOrder?.paymentMethod?.shortName ??
+    order?.paymentMethod?.shortName ??
+    '';
+
   useEffect(() => {
     navigation.setOptions(
       getDepositNavbarOptions(
         navigation,
         {
           title: strings('deposit.bank_details.navbar_title', {
-            paymentMethod: hasDepositOrderField(order?.data, 'paymentMethod')
-              ? order.data.paymentMethod?.shortName
-              : '',
+            paymentMethod: paymentMethodShortName,
           }),
         },
         theme,
       ),
     );
-  }, [navigation, theme, order?.data]);
+  }, [navigation, theme, paymentMethodShortName]);
 
   const handleBankTransferSent = useCallback(async () => {
     setCancelOrderError(null);
     if (isLoadingConfirmPayment || !order) return;
     try {
       setIsLoadingConfirmPayment(true);
-      if (
-        !hasDepositOrderField(order?.data, 'paymentMethod') ||
-        !order.data.paymentMethod.id
-      ) {
+
+      const paymentMethodId =
+        depositOrder?.paymentMethod?.id ?? order.paymentMethod?.id;
+      if (!paymentMethodId) {
         Logger.error(
           new Error('Payment method not found or empty'),
           'V2BankDetails: handleBankTransferSent',
@@ -229,28 +232,26 @@ const V2BankDetails = () => {
         return;
       }
 
-      const paymentMethodId = order.data.paymentMethod.id;
-      await confirmPayment(order.id, paymentMethodId);
+      await confirmPayment(order.providerOrderId, paymentMethodId);
 
       trackEvent('RAMPS_TRANSACTION_CONFIRMED', {
         ramp_type: 'DEPOSIT',
-        amount_source: Number(order.data.fiatAmount),
+        amount_source: Number(order.fiatAmount),
         amount_destination: Number(order.cryptoAmount),
-        exchange_rate: Number(order.data.exchangeRate),
+        exchange_rate: Number(order.exchangeRate),
         gas_fee: 0,
         processing_fee: 0,
-        total_fee: Number(order.data.totalFeesFiat),
+        total_fee: Number(order.totalFeesFiat),
         payment_method_id: paymentMethodId,
         country: regionIsoCode,
         chain_id: selectedCryptoCurrency?.chainId || '',
         currency_destination: selectedCryptoCurrency?.assetId || '',
-        currency_source: order.data.fiatCurrency,
+        currency_source: order.fiatCurrency?.symbol || '',
       });
 
       await handleOnRefresh();
     } catch (fetchError) {
-      const httpError = fetchError as { status?: number };
-      if (httpError.status === 401) {
+      if (isHttpUnauthorized(fetchError)) {
         await handleLogoutError();
         return;
       }
@@ -270,6 +271,7 @@ const V2BankDetails = () => {
   }, [
     isLoadingConfirmPayment,
     order,
+    depositOrder,
     trackEvent,
     regionIsoCode,
     selectedCryptoCurrency?.assetId,
@@ -284,11 +286,10 @@ const V2BankDetails = () => {
     if (isLoadingCancelOrder || !order) return;
     try {
       setIsLoadingCancelOrder(true);
-      await transakCancelOrder(order.id);
+      await transakCancelOrder(order.providerOrderId);
       await handleOnRefresh();
     } catch (fetchError) {
-      const httpError = fetchError as { status?: number };
-      if (httpError.status === 401) {
+      if (isHttpUnauthorized(fetchError)) {
         await handleLogoutError();
         return;
       }
@@ -309,6 +310,8 @@ const V2BankDetails = () => {
     setShowBankInfo(!showBankInfo);
   }, [showBankInfo]);
 
+  const hasData = order && (depositOrder || order.paymentDetails?.length);
+
   return (
     <ScreenLayout>
       <ScrollView
@@ -336,7 +339,7 @@ const V2BankDetails = () => {
               </Text>
             </View>
 
-            {order ? (
+            {hasData ? (
               <View style={styles.detailsContainer}>
                 {amount ? (
                   <BankDetailRow
diff --git a/app/components/UI/Ramp/Views/NativeFlow/BasicInfo.test.tsx b/app/components/UI/Ramp/Views/NativeFlow/BasicInfo.test.tsx
index 2b7f38b442ac..01026b62abda 100644
--- a/app/components/UI/Ramp/Views/NativeFlow/BasicInfo.test.tsx
+++ b/app/components/UI/Ramp/Views/NativeFlow/BasicInfo.test.tsx
@@ -429,6 +429,15 @@ describe('V2BasicInfo', () => {
     expect(getByTestId('ssn-info-button')).toBeOnTheScreen();
   });
 
+  it('navigates to ssn info modal when ssn info button is pressed', () => {
+    const { getByTestId } = renderWithTheme(<V2BasicInfo />);
+    fireEvent.press(getByTestId('ssn-info-button'));
+    expect(mockNavigate).toHaveBeenCalledWith(
+      'RampModals',
+      expect.objectContaining({ screen: 'RampSsnInfoModal' }),
+    );
+  });
+
   it('handles region with no phone prefix', () => {
     mockUserRegion = {
       country: {
diff --git a/app/components/UI/Ramp/Views/NativeFlow/BasicInfo.tsx b/app/components/UI/Ramp/Views/NativeFlow/BasicInfo.tsx
index 6cc492a9c56d..b02057c753bd 100644
--- a/app/components/UI/Ramp/Views/NativeFlow/BasicInfo.tsx
+++ b/app/components/UI/Ramp/Views/NativeFlow/BasicInfo.tsx
@@ -253,6 +253,15 @@ const V2BasicInfo = (): JSX.Element => {
     }
   }, [logoutFromProvider, navigation]);
 
+  const handleSsnInfoPress = useCallback(() => {
+    navigation.navigate(
+      Routes.RAMP.MODALS.ID as never,
+      {
+        screen: Routes.RAMP.MODALS.SSN_INFO,
+      } as never,
+    );
+  }, [navigation]);
+
   const focusNextField = useCallback(
     (nextRef: React.RefObject<TextInput>) => () => {
       nextRef.current?.focus();
@@ -442,7 +451,10 @@ const V2BasicInfo = (): JSX.Element => {
                     <Text variant={TextVariant.BodyMD}>
                       {strings('deposit.basic_info.social_security_number')}
                     </Text>
-                    <TouchableOpacity testID="ssn-info-button">
+                    <TouchableOpacity
+                      onPress={handleSsnInfoPress}
+                      testID="ssn-info-button"
+                    >
                       <Icon
                         name={IconName.Info}
                         size={IconSize.Sm}
diff --git a/app/components/UI/Ramp/Views/NativeFlow/EnterAddress.tsx b/app/components/UI/Ramp/Views/NativeFlow/EnterAddress.tsx
index 359d70f4de38..4461b14526a5 100644
--- a/app/components/UI/Ramp/Views/NativeFlow/EnterAddress.tsx
+++ b/app/components/UI/Ramp/Views/NativeFlow/EnterAddress.tsx
@@ -337,6 +337,7 @@ const V2EnterAddress = (): JSX.Element => {
                 testID="country-input"
                 containerStyle={styles.nameInputContainer}
                 isDisabled
+                numberOfLines={1}
                 startAccessory={
                   userRegion?.country?.flag ? (
                     <Text style={styles.countryFlag}>
diff --git a/app/components/UI/Ramp/Views/NativeFlow/EnterEmail.test.tsx b/app/components/UI/Ramp/Views/NativeFlow/EnterEmail.test.tsx
index 91d6a748c50d..0403c3e1d16f 100644
--- a/app/components/UI/Ramp/Views/NativeFlow/EnterEmail.test.tsx
+++ b/app/components/UI/Ramp/Views/NativeFlow/EnterEmail.test.tsx
@@ -31,12 +31,6 @@ jest.mock('../../hooks/useTransakController', () => ({
   }),
 }));
 
-const mockTrackEvent = jest.fn();
-jest.mock('../../hooks/useAnalytics', () => ({
-  __esModule: true,
-  default: () => mockTrackEvent,
-}));
-
 jest.mock('../../../../../util/navigation/navUtils', () => ({
   createNavigationDetails:
     (..._args: unknown[]) =>
diff --git a/app/components/UI/Ramp/Views/NativeFlow/EnterEmail.testIds.ts b/app/components/UI/Ramp/Views/NativeFlow/EnterEmail.testIds.ts
new file mode 100644
index 000000000000..3be1da5e5547
--- /dev/null
+++ b/app/components/UI/Ramp/Views/NativeFlow/EnterEmail.testIds.ts
@@ -0,0 +1,4 @@
+export const EnterEmailSelectorsIDs = {
+  EMAIL_INPUT: 'ramps-enter-email-input',
+  SEND_EMAIL_BUTTON: 'ramps-enter-email-send-button',
+};
diff --git a/app/components/UI/Ramp/Views/NativeFlow/EnterEmail.tsx b/app/components/UI/Ramp/Views/NativeFlow/EnterEmail.tsx
index 425f91669fda..50fe451ed5f8 100644
--- a/app/components/UI/Ramp/Views/NativeFlow/EnterEmail.tsx
+++ b/app/components/UI/Ramp/Views/NativeFlow/EnterEmail.tsx
@@ -25,9 +25,11 @@ import Button, {
 } from '../../../../../component-library/components/Buttons/Button';
 import PoweredByTransak from '../../Deposit/components/PoweredByTransak';
 import Logger from '../../../../../util/Logger';
-import useAnalytics from '../../hooks/useAnalytics';
+import { useAnalytics } from '../../../../hooks/useAnalytics/useAnalytics';
+import { MetaMetricsEvents } from '../../../../../core/Analytics';
 import { useTransakController } from '../../hooks/useTransakController';
 import { parseUserFacingError } from '../../utils/parseUserFacingError';
+import { EnterEmailSelectorsIDs } from './EnterEmail.testIds';
 
 export interface V2EnterEmailParams {
   amount?: string;
@@ -47,7 +49,7 @@ const V2EnterEmail = () => {
   const [validationError, setValidationError] = useState(false);
 
   const { styles, theme } = useStyles(styleSheet, {});
-  const trackEvent = useAnalytics();
+  const { trackEvent, createEventBuilder } = useAnalytics();
   const { sendUserOtp } = useTransakController();
 
   useEffect(() => {
@@ -56,9 +58,33 @@ const V2EnterEmail = () => {
         navigation,
         { title: strings('deposit.enter_email.navbar_title') },
         theme,
+        () => {
+          trackEvent(
+            createEventBuilder(MetaMetricsEvents.RAMPS_BACK_BUTTON_CLICKED)
+              .addProperties({
+                location: 'Enter Email',
+                ramp_type: 'UNIFIED_BUY_2',
+              })
+              .build(),
+          );
+        },
       ),
     );
-  }, [navigation, theme]);
+  }, [navigation, theme, trackEvent, createEventBuilder]);
+
+  const hasTrackedScreenViewRef = useRef(false);
+  useEffect(() => {
+    if (hasTrackedScreenViewRef.current) return;
+    hasTrackedScreenViewRef.current = true;
+    trackEvent(
+      createEventBuilder(MetaMetricsEvents.RAMPS_SCREEN_VIEWED)
+        .addProperties({
+          location: 'Enter Email',
+          ramp_type: 'UNIFIED_BUY_2',
+        })
+        .build(),
+    );
+  }, [trackEvent, createEventBuilder]);
 
   const emailInputRef = useRef<TextInput>(null);
 
@@ -83,9 +109,13 @@ const V2EnterEmail = () => {
           throw new Error('State token is required for OTP verification');
         }
 
-        trackEvent('RAMPS_EMAIL_SUBMITTED', {
-          ramp_type: 'DEPOSIT',
-        });
+        trackEvent(
+          createEventBuilder(MetaMetricsEvents.RAMPS_EMAIL_SUBMITTED)
+            .addProperties({
+              ramp_type: 'DEPOSIT',
+            })
+            .build(),
+        );
         navigation.navigate(
           ...createV2OtpCodeNavDetails({
             email,
@@ -104,7 +134,7 @@ const V2EnterEmail = () => {
     } finally {
       setIsLoading(false);
     }
-  }, [email, navigation, sendUserOtp, trackEvent, params]);
+  }, [email, navigation, sendUserOtp, trackEvent, createEventBuilder, params]);
 
   return (
     <ScreenLayout>
@@ -120,6 +150,7 @@ const V2EnterEmail = () => {
             </Text>
 
             <TextField
+              testID={EnterEmailSelectorsIDs.EMAIL_INPUT}
               autoComplete="email"
               keyboardType="email-address"
               placeholder={strings('deposit.enter_email.input_placeholder')}
@@ -147,6 +178,7 @@ const V2EnterEmail = () => {
       <ScreenLayout.Footer>
         <ScreenLayout.Content style={styles.footerContent}>
           <Button
+            testID={EnterEmailSelectorsIDs.SEND_EMAIL_BUTTON}
             size={ButtonSize.Lg}
             onPress={handleSubmit}
             label={strings('deposit.enter_email.submit_button')}
diff --git a/app/components/UI/Ramp/Views/NativeFlow/OtpCode.test.tsx b/app/components/UI/Ramp/Views/NativeFlow/OtpCode.test.tsx
index d3a0c6520024..e58493c66b03 100644
--- a/app/components/UI/Ramp/Views/NativeFlow/OtpCode.test.tsx
+++ b/app/components/UI/Ramp/Views/NativeFlow/OtpCode.test.tsx
@@ -74,12 +74,6 @@ jest.mock('../../../../../util/navigation/navUtils', () => ({
   useParams: () => mockUseParams(),
 }));
 
-const mockTrackEvent = jest.fn();
-jest.mock('../../hooks/useAnalytics', () => ({
-  __esModule: true,
-  default: () => mockTrackEvent,
-}));
-
 jest.mock('../../../../../util/Logger', () => ({
   error: jest.fn(),
 }));
@@ -346,53 +340,6 @@ describe('V2OtpCode', () => {
     });
   });
 
-  it('tracks RAMPS_OTP_CONFIRMED on successful verification', async () => {
-    jest.useRealTimers();
-
-    const mockToken = { accessToken: 'otp-token', ttl: 3600 };
-    const mockQuote = { quoteId: 'q1', fiatAmount: 100 };
-    mockVerifyUserOtp.mockResolvedValue(mockToken);
-    mockSetAuthToken.mockResolvedValue(true);
-    mockGetBuyQuote.mockResolvedValue(mockQuote);
-    mockRouteAfterAuthentication.mockResolvedValue(undefined);
-
-    const { getByTestId } = renderWithTheme(<V2OtpCode />);
-
-    await act(async () => {
-      fireEvent.changeText(getByTestId('otp-code-input'), '123456');
-    });
-
-    await waitFor(() => {
-      expect(mockTrackEvent).toHaveBeenCalledWith(
-        'RAMPS_OTP_CONFIRMED',
-        expect.objectContaining({
-          ramp_type: 'DEPOSIT',
-        }),
-      );
-    });
-  });
-
-  it('tracks RAMPS_OTP_FAILED on verification error', async () => {
-    jest.useRealTimers();
-
-    mockVerifyUserOtp.mockRejectedValue(new Error('Invalid OTP'));
-
-    const { getByTestId } = renderWithTheme(<V2OtpCode />);
-
-    await act(async () => {
-      fireEvent.changeText(getByTestId('otp-code-input'), '123456');
-    });
-
-    await waitFor(() => {
-      expect(mockTrackEvent).toHaveBeenCalledWith(
-        'RAMPS_OTP_FAILED',
-        expect.objectContaining({
-          ramp_type: 'DEPOSIT',
-        }),
-      );
-    });
-  });
-
   it('does not submit when code length is less than 6', async () => {
     jest.useRealTimers();
 
diff --git a/app/components/UI/Ramp/Views/NativeFlow/OtpCode.testIds.ts b/app/components/UI/Ramp/Views/NativeFlow/OtpCode.testIds.ts
new file mode 100644
index 000000000000..426e920ccd52
--- /dev/null
+++ b/app/components/UI/Ramp/Views/NativeFlow/OtpCode.testIds.ts
@@ -0,0 +1,6 @@
+export const OtpCodeSelectorsIDs = {
+  OTP_CODE_SCREEN: 'otp-code-screen',
+  OTP_CODE_INPUT: 'otp-code-input',
+  PASTE_BUTTON: 'otp-code-paste-button',
+  SUBMIT_BUTTON: 'otp-code-submit-button',
+};
diff --git a/app/components/UI/Ramp/Views/NativeFlow/OtpCode.tsx b/app/components/UI/Ramp/Views/NativeFlow/OtpCode.tsx
index ba1626255b71..51691a249188 100644
--- a/app/components/UI/Ramp/Views/NativeFlow/OtpCode.tsx
+++ b/app/components/UI/Ramp/Views/NativeFlow/OtpCode.tsx
@@ -32,13 +32,15 @@ import Button, {
   ButtonWidthTypes,
 } from '../../../../../component-library/components/Buttons/Button';
 import Logger from '../../../../../util/Logger';
-import useAnalytics from '../../hooks/useAnalytics';
+import { useAnalytics } from '../../../../hooks/useAnalytics/useAnalytics';
+import { MetaMetricsEvents } from '../../../../../core/Analytics';
 import { trace, TraceName } from '../../../../../util/trace';
 import { Box, BoxAlignItems } from '@metamask/design-system-react-native';
 import { useTransakController } from '../../hooks/useTransakController';
 import { useTransakRouting } from '../../hooks/useTransakRouting';
 import { useRampsController } from '../../hooks/useRampsController';
 import { parseUserFacingError } from '../../utils/parseUserFacingError';
+import { OtpCodeSelectorsIDs } from './OtpCode.testIds';
 
 export interface V2OtpCodeParams {
   email: string;
@@ -76,7 +78,7 @@ const V2OtpCode = () => {
   const { styles, theme } = useStyles(styleSheet, {});
   const { email, stateToken, amount, currency, assetId } =
     useParams<V2OtpCodeParams>();
-  const trackEvent = useAnalytics();
+  const { trackEvent, createEventBuilder } = useAnalytics();
 
   const {
     setAuthToken,
@@ -109,9 +111,33 @@ const V2OtpCode = () => {
         navigation,
         { title: strings('deposit.otp_code.navbar_title') },
         theme,
+        () => {
+          trackEvent(
+            createEventBuilder(MetaMetricsEvents.RAMPS_BACK_BUTTON_CLICKED)
+              .addProperties({
+                location: 'OTP Code',
+                ramp_type: 'UNIFIED_BUY_2',
+              })
+              .build(),
+          );
+        },
       ),
     );
-  }, [navigation, theme]);
+  }, [navigation, theme, trackEvent, createEventBuilder]);
+
+  const hasTrackedScreenViewRef = useRef(false);
+  useEffect(() => {
+    if (hasTrackedScreenViewRef.current) return;
+    hasTrackedScreenViewRef.current = true;
+    trackEvent(
+      createEventBuilder(MetaMetricsEvents.RAMPS_SCREEN_VIEWED)
+        .addProperties({
+          location: 'OTP Code',
+          ramp_type: 'UNIFIED_BUY_2',
+        })
+        .build(),
+    );
+  }, [trackEvent, createEventBuilder]);
 
   const [value, setValue] = useState('');
 
@@ -156,10 +182,14 @@ const V2OtpCode = () => {
       }
 
       setCurrentStateToken(resendResponse.stateToken);
-      trackEvent('RAMPS_OTP_RESENT', {
-        ramp_type: 'DEPOSIT',
-        region: userRegion?.regionCode || '',
-      });
+      trackEvent(
+        createEventBuilder(MetaMetricsEvents.RAMPS_OTP_RESENT)
+          .addProperties({
+            ramp_type: 'DEPOSIT',
+            region: userRegion?.regionCode || '',
+          })
+          .build(),
+      );
     } catch (e) {
       setResendButtonState('resendError');
       Logger.error(e as Error, 'Error resending OTP code');
@@ -171,6 +201,7 @@ const V2OtpCode = () => {
     resetAttemptCount,
     userRegion?.regionCode,
     trackEvent,
+    createEventBuilder,
   ]);
 
   const handleContactSupport = useCallback(() => {
@@ -199,10 +230,14 @@ const V2OtpCode = () => {
 
         await setAuthToken(token);
 
-        trackEvent('RAMPS_OTP_CONFIRMED', {
-          ramp_type: 'DEPOSIT',
-          region: userRegion?.regionCode || '',
-        });
+        trackEvent(
+          createEventBuilder(MetaMetricsEvents.RAMPS_OTP_CONFIRMED)
+            .addProperties({
+              ramp_type: 'DEPOSIT',
+              region: userRegion?.regionCode || '',
+            })
+            .build(),
+        );
 
         if (amount && currency && assetId) {
           try {
@@ -229,10 +264,14 @@ const V2OtpCode = () => {
           navigation.navigate(Routes.RAMP.AMOUNT_INPUT);
         }
       } catch (e) {
-        trackEvent('RAMPS_OTP_FAILED', {
-          ramp_type: 'DEPOSIT',
-          region: userRegion?.regionCode || '',
-        });
+        trackEvent(
+          createEventBuilder(MetaMetricsEvents.RAMPS_OTP_FAILED)
+            .addProperties({
+              ramp_type: 'DEPOSIT',
+              region: userRegion?.regionCode || '',
+            })
+            .build(),
+        );
         setError(parseUserFacingError(e, strings('deposit.otp_code.error')));
         Logger.error(e as Error, 'Error submitting OTP code or verifying');
       } finally {
@@ -249,6 +288,7 @@ const V2OtpCode = () => {
     currentStateToken,
     userRegion?.regionCode,
     trackEvent,
+    createEventBuilder,
     amount,
     currency,
     assetId,
@@ -285,7 +325,7 @@ const V2OtpCode = () => {
   });
 
   return (
-    <ScreenLayout>
+    <ScreenLayout testID={OtpCodeSelectorsIDs.OTP_CODE_SCREEN}>
       <ScreenLayout.Body>
         <ScreenLayout.Content grow>
           <DepositProgressBar steps={4} currentStep={1} />
@@ -301,14 +341,14 @@ const V2OtpCode = () => {
               variant={TextVariant.BodyMD}
               color={TextColor.Primary}
               onPress={handlePaste}
-              testID="otp-code-paste-button"
+              testID={OtpCodeSelectorsIDs.PASTE_BUTTON}
             >
               {strings('deposit.otp_code.paste')}
             </Text>
           </Box>
 
           <CodeField
-            testID="otp-code-input"
+            testID={OtpCodeSelectorsIDs.OTP_CODE_INPUT}
             ref={inputRef as React.RefObject<TextInput>}
             {...props}
             value={value}
@@ -377,7 +417,7 @@ const V2OtpCode = () => {
             width={ButtonWidthTypes.Full}
             loading={isLoading}
             isDisabled={isLoading || value.length !== CELL_COUNT}
-            testID="otp-code-submit-button"
+            testID={OtpCodeSelectorsIDs.SUBMIT_BUTTON}
           />
           <PoweredByTransak name="powered-by-transak-logo" />
         </ScreenLayout.Content>
diff --git a/app/components/UI/Ramp/Views/NativeFlow/VerifyIdentity.test.tsx b/app/components/UI/Ramp/Views/NativeFlow/VerifyIdentity.test.tsx
index c482c974bf87..092e07c1817e 100644
--- a/app/components/UI/Ramp/Views/NativeFlow/VerifyIdentity.test.tsx
+++ b/app/components/UI/Ramp/Views/NativeFlow/VerifyIdentity.test.tsx
@@ -13,6 +13,13 @@ jest.mock('@react-navigation/native', () => ({
     navigate: mockNavigate,
     setOptions: mockSetOptions,
   }),
+  useRoute: () => ({
+    params: {},
+  }),
+}));
+
+jest.mock('./EnterEmail', () => ({
+  createV2EnterEmailNavDetails: (params: unknown) => ['RampEnterEmail', params],
 }));
 
 jest.mock('../../../../../../locales/i18n', () => ({
@@ -67,7 +74,14 @@ describe('V2VerifyIdentity', () => {
 
     fireEvent.press(getByText('deposit.verify_identity.button'));
 
-    expect(mockNavigate).toHaveBeenCalledWith('RampEnterEmail');
+    expect(mockNavigate).toHaveBeenCalledWith(
+      'RampEnterEmail',
+      expect.objectContaining({
+        amount: undefined,
+        currency: undefined,
+        assetId: undefined,
+      }),
+    );
   });
 
   it('opens Transak URL when Transak link is pressed', () => {
diff --git a/app/components/UI/Ramp/Views/NativeFlow/VerifyIdentity.testIds.ts b/app/components/UI/Ramp/Views/NativeFlow/VerifyIdentity.testIds.ts
new file mode 100644
index 000000000000..df76b6095984
--- /dev/null
+++ b/app/components/UI/Ramp/Views/NativeFlow/VerifyIdentity.testIds.ts
@@ -0,0 +1,5 @@
+export const VerifyIdentitySelectorsIDs = {
+  CONTINUE_BUTTON: 'ramps-verify-identity-continue-button',
+  PRIVACY_POLICY_LINK_1: 'privacy-policy-link-1',
+  PRIVACY_POLICY_LINK_2: 'privacy-policy-link-2',
+};
diff --git a/app/components/UI/Ramp/Views/NativeFlow/VerifyIdentity.tsx b/app/components/UI/Ramp/Views/NativeFlow/VerifyIdentity.tsx
index bb1bbad91d29..e757bcc66954 100644
--- a/app/components/UI/Ramp/Views/NativeFlow/VerifyIdentity.tsx
+++ b/app/components/UI/Ramp/Views/NativeFlow/VerifyIdentity.tsx
@@ -1,4 +1,4 @@
-import React, { useCallback, useEffect } from 'react';
+import React, { useCallback, useEffect, useRef } from 'react';
 import { Image, Linking, ScrollView } from 'react-native';
 import Text, {
   TextVariant,
@@ -25,17 +25,38 @@ import {
   TRANSAK_URL,
 } from '../../Deposit/constants/constants';
 import { useRampsUserRegion } from '../../hooks/useRampsUserRegion';
+import { useAnalytics } from '../../../../hooks/useAnalytics/useAnalytics';
+import { MetaMetricsEvents } from '../../../../../core/Analytics';
+import {
+  createNavigationDetails,
+  useParams,
+} from '../../../../../util/navigation/navUtils';
+import { createV2EnterEmailNavDetails } from './EnterEmail';
+import { VerifyIdentitySelectorsIDs } from './VerifyIdentity.testIds';
+
+export interface V2VerifyIdentityParams {
+  amount?: string;
+  currency?: string;
+  assetId?: string;
+}
+
+export const createV2VerifyIdentityNavDetails =
+  createNavigationDetails<V2VerifyIdentityParams>(Routes.RAMP.VERIFY_IDENTITY);
 
 const V2VerifyIdentity = () => {
   const navigation = useNavigation();
   const { styles, theme } = useStyles(styleSheet, {});
+  const { trackEvent, createEventBuilder } = useAnalytics();
   const { userRegion } = useRampsUserRegion();
+  const { amount, currency, assetId } = useParams<V2VerifyIdentityParams>();
 
   const regionIsoCode = userRegion?.country?.isoCode || '';
 
   const navigateToEnterEmail = useCallback(() => {
-    navigation.navigate(Routes.RAMP.ENTER_EMAIL as never);
-  }, [navigation]);
+    navigation.navigate(
+      ...createV2EnterEmailNavDetails({ amount, currency, assetId }),
+    );
+  }, [navigation, amount, currency, assetId]);
 
   useEffect(() => {
     navigation.setOptions(
@@ -43,27 +64,107 @@ const V2VerifyIdentity = () => {
         navigation,
         { title: strings('deposit.verify_identity.navbar_title') },
         theme,
+        () => {
+          trackEvent(
+            createEventBuilder(MetaMetricsEvents.RAMPS_BACK_BUTTON_CLICKED)
+              .addProperties({
+                location: 'Verify Identity',
+                ramp_type: 'UNIFIED_BUY_2',
+              })
+              .build(),
+          );
+        },
       ),
     );
-  }, [navigation, theme]);
+  }, [navigation, theme, trackEvent, createEventBuilder]);
+
+  const hasTrackedScreenViewRef = useRef(false);
+  useEffect(() => {
+    if (hasTrackedScreenViewRef.current) return;
+    hasTrackedScreenViewRef.current = true;
+    trackEvent(
+      createEventBuilder(MetaMetricsEvents.RAMPS_SCREEN_VIEWED)
+        .addProperties({
+          location: 'Verify Identity',
+          ramp_type: 'UNIFIED_BUY_2',
+        })
+        .build(),
+    );
+  }, [trackEvent, createEventBuilder]);
 
   const handleSubmit = useCallback(async () => {
+    trackEvent(
+      createEventBuilder(MetaMetricsEvents.RAMPS_TERMS_CONSENT_CLICKED)
+        .addProperties({
+          location: 'Verify Identity',
+          ramp_type: 'UNIFIED_BUY_2',
+        })
+        .build(),
+    );
     navigateToEnterEmail();
-  }, [navigateToEnterEmail]);
+  }, [navigateToEnterEmail, trackEvent, createEventBuilder]);
 
   const handleTransakLink = useCallback(() => {
+    let urlDomain: string = TRANSAK_URL;
+    try {
+      urlDomain = new URL(TRANSAK_URL).hostname;
+    } catch {
+      // use TRANSAK_URL as fallback for analytics if parse fails
+    }
+    trackEvent(
+      createEventBuilder(MetaMetricsEvents.RAMPS_EXTERNAL_LINK_CLICKED)
+        .addProperties({
+          location: 'Verify Identity',
+          external_link_description: 'Transak',
+          url_domain: urlDomain,
+          ramp_type: 'UNIFIED_BUY_2',
+        })
+        .build(),
+    );
     Linking.openURL(TRANSAK_URL);
-  }, []);
+  }, [trackEvent, createEventBuilder]);
 
   const handlePrivacyPolicyLink = useCallback(() => {
+    let urlDomain: string = CONSENSYS_PRIVACY_POLICY_URL;
+    try {
+      urlDomain = new URL(CONSENSYS_PRIVACY_POLICY_URL).hostname;
+    } catch {
+      // use raw URL as fallback for analytics if parse fails
+    }
+    trackEvent(
+      createEventBuilder(MetaMetricsEvents.RAMPS_EXTERNAL_LINK_CLICKED)
+        .addProperties({
+          location: 'Verify Identity',
+          external_link_description: 'Privacy Policy',
+          url_domain: urlDomain,
+          ramp_type: 'UNIFIED_BUY_2',
+        })
+        .build(),
+    );
     Linking.openURL(CONSENSYS_PRIVACY_POLICY_URL);
-  }, []);
+  }, [trackEvent, createEventBuilder]);
 
   const handleTransakTermsLink = useCallback(() => {
-    Linking.openURL(
-      regionIsoCode === 'US' ? TRANSAK_TERMS_URL_US : TRANSAK_TERMS_URL_WORLD,
+    const termsUrl =
+      regionIsoCode === 'US' ? TRANSAK_TERMS_URL_US : TRANSAK_TERMS_URL_WORLD;
+    let urlDomain: string = termsUrl;
+    try {
+      urlDomain = new URL(termsUrl).hostname;
+    } catch {
+      // use termsUrl as fallback for analytics if parse fails
+    }
+    trackEvent(
+      createEventBuilder(MetaMetricsEvents.RAMPS_EXTERNAL_LINK_CLICKED)
+        .addProperties({
+          location: 'Verify Identity',
+          external_link_description: 'Transak Terms',
+          url_domain: urlDomain,
+          ramp_type: 'UNIFIED_BUY_2',
+        })
+        .build(),
     );
-  }, [regionIsoCode]);
+    Linking.openURL(termsUrl);
+  }, [regionIsoCode, trackEvent, createEventBuilder]);
 
   return (
     <ScreenLayout>
@@ -95,7 +196,7 @@ const V2VerifyIdentity = () => {
               <Text
                 style={styles.linkText}
                 onPress={handlePrivacyPolicyLink}
-                testID="privacy-policy-link-1"
+                testID={VerifyIdentitySelectorsIDs.PRIVACY_POLICY_LINK_1}
               >
                 {strings(
                   'deposit.verify_identity.description_3_privacy_policy',
@@ -128,13 +229,14 @@ const V2VerifyIdentity = () => {
               color={TextColor.Muted}
               style={styles.linkText}
               onPress={handlePrivacyPolicyLink}
-              testID="privacy-policy-link-2"
+              testID={VerifyIdentitySelectorsIDs.PRIVACY_POLICY_LINK_2}
             >
               {strings('deposit.verify_identity.agreement_text_privacy_policy')}
             </Text>
             {strings('deposit.verify_identity.agreement_text_part2')}
           </Text>
           <Button
+            testID={VerifyIdentitySelectorsIDs.CONTINUE_BUTTON}
             size={ButtonSize.Lg}
             onPress={handleSubmit}
             label={strings('deposit.verify_identity.button')}
diff --git a/app/components/UI/Ramp/Views/NativeFlow/__snapshots__/AdditionalVerification.test.tsx.snap b/app/components/UI/Ramp/Views/NativeFlow/__snapshots__/AdditionalVerification.test.tsx.snap
index a719f10f875e..1dbe3478adee 100644
--- a/app/components/UI/Ramp/Views/NativeFlow/__snapshots__/AdditionalVerification.test.tsx.snap
+++ b/app/components/UI/Ramp/Views/NativeFlow/__snapshots__/AdditionalVerification.test.tsx.snap
@@ -66,7 +66,7 @@ exports[`V2AdditionalVerification matches snapshot 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Bold",
               "fontSize": 24,
               "fontWeight": "bold",
@@ -82,7 +82,7 @@ exports[`V2AdditionalVerification matches snapshot 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -97,7 +97,7 @@ exports[`V2AdditionalVerification matches snapshot 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -136,7 +136,7 @@ exports[`V2AdditionalVerification matches snapshot 1`] = `
             {
               "alignItems": "center",
               "alignSelf": "stretch",
-              "backgroundColor": "#121314",
+              "backgroundColor": "#131416",
               "borderRadius": 12,
               "flexDirection": "row",
               "height": 48,
@@ -166,7 +166,7 @@ exports[`V2AdditionalVerification matches snapshot 1`] = `
           name="powered-by-transak-logo"
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "height": 24,
             }
           }
diff --git a/app/components/UI/Ramp/Views/NativeFlow/__snapshots__/BankDetails.test.tsx.snap b/app/components/UI/Ramp/Views/NativeFlow/__snapshots__/BankDetails.test.tsx.snap
index cb8ba73a2e6b..4b1f508a8df9 100644
--- a/app/components/UI/Ramp/Views/NativeFlow/__snapshots__/BankDetails.test.tsx.snap
+++ b/app/components/UI/Ramp/Views/NativeFlow/__snapshots__/BankDetails.test.tsx.snap
@@ -42,7 +42,7 @@ exports[`V2BankDetails matches snapshot when order is null (loading) 1`] = `
           }
           onRefresh={[Function]}
           refreshing={false}
-          tintColor="#121314"
+          tintColor="#131416"
         />
       }
       testID="bank-details-refresh-control-scrollview"
@@ -86,9 +86,9 @@ exports[`V2BankDetails matches snapshot when order is null (loading) 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Bold",
-                    "fontSize": 18,
+                    "fontSize": 20,
                     "letterSpacing": 0,
                     "lineHeight": 24,
                   }
@@ -100,7 +100,7 @@ exports[`V2BankDetails matches snapshot when order is null (loading) 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -114,7 +114,7 @@ exports[`V2BankDetails matches snapshot when order is null (loading) 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -157,7 +157,7 @@ exports[`V2BankDetails matches snapshot when order is null (loading) 1`] = `
             accessible={true}
             style={
               {
-                "backgroundColor": "#3c4d9d0f",
+                "backgroundColor": "#b4b4b528",
                 "borderRadius": 8,
                 "marginVertical": 8,
                 "padding": 16,
@@ -182,7 +182,7 @@ exports[`V2BankDetails matches snapshot when order is null (loading) 1`] = `
                 testID="listitemcolumn"
               >
                 <SvgMock
-                  color="#686e7d"
+                  color="#66676a"
                   fill="currentColor"
                   height={24}
                   name="SecurityKey"
@@ -216,7 +216,7 @@ exports[`V2BankDetails matches snapshot when order is null (loading) 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#686e7d",
+                      "color": "#66676a",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 12,
                       "letterSpacing": 0.25,
@@ -250,7 +250,7 @@ exports[`V2BankDetails matches snapshot when order is null (loading) 1`] = `
                 {
                   "alignItems": "center",
                   "alignSelf": "flex-start",
-                  "backgroundColor": "#3c4d9d0f",
+                  "backgroundColor": "#b4b4b528",
                   "borderColor": "transparent",
                   "borderRadius": 12,
                   "borderWidth": 1,
@@ -267,7 +267,7 @@ exports[`V2BankDetails matches snapshot when order is null (loading) 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Medium",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -291,7 +291,7 @@ exports[`V2BankDetails matches snapshot when order is null (loading) 1`] = `
                 {
                   "alignItems": "center",
                   "alignSelf": "flex-start",
-                  "backgroundColor": "#121314",
+                  "backgroundColor": "#131416",
                   "borderRadius": 12,
                   "flex": 1,
                   "flexDirection": "row",
@@ -368,7 +368,7 @@ exports[`V2BankDetails matches snapshot with both buttons disabled while cancel
           }
           onRefresh={[Function]}
           refreshing={false}
-          tintColor="#121314"
+          tintColor="#131416"
         />
       }
       testID="bank-details-refresh-control-scrollview"
@@ -412,9 +412,9 @@ exports[`V2BankDetails matches snapshot with both buttons disabled while cancel
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Bold",
-                    "fontSize": 18,
+                    "fontSize": 20,
                     "letterSpacing": 0,
                     "lineHeight": 24,
                   }
@@ -426,7 +426,7 @@ exports[`V2BankDetails matches snapshot with both buttons disabled while cancel
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -440,7 +440,7 @@ exports[`V2BankDetails matches snapshot with both buttons disabled while cancel
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -454,7 +454,7 @@ exports[`V2BankDetails matches snapshot with both buttons disabled while cancel
             <View
               style={
                 {
-                  "backgroundColor": "#3c4d9d0f",
+                  "backgroundColor": "#b4b4b528",
                   "borderRadius": 8,
                   "gap": 16,
                   "padding": 16,
@@ -471,6 +471,46 @@ exports[`V2BankDetails matches snapshot with both buttons disabled while cancel
                   $100.00
                 </Text>
               </View>
+              <View
+                testID="bank-detail-deposit.bank_details.account_holder_name"
+              >
+                <Text>
+                  deposit.bank_details.account_holder_name
+                </Text>
+                <Text>
+                  John Doe
+                </Text>
+              </View>
+              <View
+                testID="bank-detail-deposit.bank_details.routing_number"
+              >
+                <Text>
+                  deposit.bank_details.routing_number
+                </Text>
+                <Text>
+                  987654321
+                </Text>
+              </View>
+              <View
+                testID="bank-detail-deposit.bank_details.account_number"
+              >
+                <Text>
+                  deposit.bank_details.account_number
+                </Text>
+                <Text>
+                  123456789
+                </Text>
+              </View>
+              <View
+                testID="bank-detail-deposit.bank_details.account_type"
+              >
+                <Text>
+                  deposit.bank_details.account_type
+                </Text>
+                <Text>
+                  Checking
+                </Text>
+              </View>
               <TouchableOpacity
                 onPress={[Function]}
                 style={
@@ -540,7 +580,7 @@ exports[`V2BankDetails matches snapshot with both buttons disabled while cancel
             accessible={true}
             style={
               {
-                "backgroundColor": "#3c4d9d0f",
+                "backgroundColor": "#b4b4b528",
                 "borderRadius": 8,
                 "marginVertical": 8,
                 "padding": 16,
@@ -565,7 +605,7 @@ exports[`V2BankDetails matches snapshot with both buttons disabled while cancel
                 testID="listitemcolumn"
               >
                 <SvgMock
-                  color="#686e7d"
+                  color="#66676a"
                   fill="currentColor"
                   height={24}
                   name="SecurityKey"
@@ -599,7 +639,7 @@ exports[`V2BankDetails matches snapshot with both buttons disabled while cancel
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#686e7d",
+                      "color": "#66676a",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 12,
                       "letterSpacing": 0.25,
@@ -633,7 +673,7 @@ exports[`V2BankDetails matches snapshot with both buttons disabled while cancel
                 {
                   "alignItems": "center",
                   "alignSelf": "flex-start",
-                  "backgroundColor": "#3c4d9d0f",
+                  "backgroundColor": "#b4b4b528",
                   "borderColor": "transparent",
                   "borderRadius": 12,
                   "borderWidth": 1,
@@ -647,7 +687,7 @@ exports[`V2BankDetails matches snapshot with both buttons disabled while cancel
               }
             >
               <ActivityIndicator
-                color="#121314"
+                color="#131416"
                 size="small"
               />
             </TouchableOpacity>
@@ -664,7 +704,7 @@ exports[`V2BankDetails matches snapshot with both buttons disabled while cancel
                 {
                   "alignItems": "center",
                   "alignSelf": "flex-start",
-                  "backgroundColor": "#121314",
+                  "backgroundColor": "#131416",
                   "borderRadius": 12,
                   "flex": 1,
                   "flexDirection": "row",
@@ -741,7 +781,7 @@ exports[`V2BankDetails matches snapshot with both buttons disabled while confirm
           }
           onRefresh={[Function]}
           refreshing={false}
-          tintColor="#121314"
+          tintColor="#131416"
         />
       }
       testID="bank-details-refresh-control-scrollview"
@@ -785,9 +825,9 @@ exports[`V2BankDetails matches snapshot with both buttons disabled while confirm
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Bold",
-                    "fontSize": 18,
+                    "fontSize": 20,
                     "letterSpacing": 0,
                     "lineHeight": 24,
                   }
@@ -799,7 +839,7 @@ exports[`V2BankDetails matches snapshot with both buttons disabled while confirm
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -813,7 +853,7 @@ exports[`V2BankDetails matches snapshot with both buttons disabled while confirm
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -827,7 +867,7 @@ exports[`V2BankDetails matches snapshot with both buttons disabled while confirm
             <View
               style={
                 {
-                  "backgroundColor": "#3c4d9d0f",
+                  "backgroundColor": "#b4b4b528",
                   "borderRadius": 8,
                   "gap": 16,
                   "padding": 16,
@@ -844,6 +884,46 @@ exports[`V2BankDetails matches snapshot with both buttons disabled while confirm
                   $100.00
                 </Text>
               </View>
+              <View
+                testID="bank-detail-deposit.bank_details.account_holder_name"
+              >
+                <Text>
+                  deposit.bank_details.account_holder_name
+                </Text>
+                <Text>
+                  John Doe
+                </Text>
+              </View>
+              <View
+                testID="bank-detail-deposit.bank_details.routing_number"
+              >
+                <Text>
+                  deposit.bank_details.routing_number
+                </Text>
+                <Text>
+                  987654321
+                </Text>
+              </View>
+              <View
+                testID="bank-detail-deposit.bank_details.account_number"
+              >
+                <Text>
+                  deposit.bank_details.account_number
+                </Text>
+                <Text>
+                  123456789
+                </Text>
+              </View>
+              <View
+                testID="bank-detail-deposit.bank_details.account_type"
+              >
+                <Text>
+                  deposit.bank_details.account_type
+                </Text>
+                <Text>
+                  Checking
+                </Text>
+              </View>
               <TouchableOpacity
                 onPress={[Function]}
                 style={
@@ -913,7 +993,7 @@ exports[`V2BankDetails matches snapshot with both buttons disabled while confirm
             accessible={true}
             style={
               {
-                "backgroundColor": "#3c4d9d0f",
+                "backgroundColor": "#b4b4b528",
                 "borderRadius": 8,
                 "marginVertical": 8,
                 "padding": 16,
@@ -938,7 +1018,7 @@ exports[`V2BankDetails matches snapshot with both buttons disabled while confirm
                 testID="listitemcolumn"
               >
                 <SvgMock
-                  color="#686e7d"
+                  color="#66676a"
                   fill="currentColor"
                   height={24}
                   name="SecurityKey"
@@ -972,7 +1052,7 @@ exports[`V2BankDetails matches snapshot with both buttons disabled while confirm
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#686e7d",
+                      "color": "#66676a",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 12,
                       "letterSpacing": 0.25,
@@ -1006,7 +1086,7 @@ exports[`V2BankDetails matches snapshot with both buttons disabled while confirm
                 {
                   "alignItems": "center",
                   "alignSelf": "flex-start",
-                  "backgroundColor": "#3c4d9d0f",
+                  "backgroundColor": "#b4b4b528",
                   "borderColor": "transparent",
                   "borderRadius": 12,
                   "borderWidth": 1,
@@ -1023,7 +1103,7 @@ exports[`V2BankDetails matches snapshot with both buttons disabled while confirm
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Medium",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -1047,7 +1127,7 @@ exports[`V2BankDetails matches snapshot with both buttons disabled while confirm
                 {
                   "alignItems": "center",
                   "alignSelf": "flex-start",
-                  "backgroundColor": "#121314",
+                  "backgroundColor": "#131416",
                   "borderRadius": 12,
                   "flex": 1,
                   "flexDirection": "row",
@@ -1072,7 +1152,7 @@ exports[`V2BankDetails matches snapshot with both buttons disabled while confirm
 </RNCSafeAreaView>
 `;
 
-exports[`V2BankDetails matches snapshot with order data 1`] = `
+exports[`V2BankDetails matches snapshot with order data and depositOrder from refresh 1`] = `
 <RNCSafeAreaView
   edges={
     {
@@ -1113,8 +1193,8 @@ exports[`V2BankDetails matches snapshot with order data 1`] = `
             ]
           }
           onRefresh={[Function]}
-          refreshing={true}
-          tintColor="#121314"
+          refreshing={false}
+          tintColor="#131416"
         />
       }
       testID="bank-details-refresh-control-scrollview"
@@ -1158,9 +1238,9 @@ exports[`V2BankDetails matches snapshot with order data 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Bold",
-                    "fontSize": 18,
+                    "fontSize": 20,
                     "letterSpacing": 0,
                     "lineHeight": 24,
                   }
@@ -1172,7 +1252,7 @@ exports[`V2BankDetails matches snapshot with order data 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -1186,7 +1266,7 @@ exports[`V2BankDetails matches snapshot with order data 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -1200,7 +1280,7 @@ exports[`V2BankDetails matches snapshot with order data 1`] = `
             <View
               style={
                 {
-                  "backgroundColor": "#3c4d9d0f",
+                  "backgroundColor": "#b4b4b528",
                   "borderRadius": 8,
                   "gap": 16,
                   "padding": 16,
@@ -1326,7 +1406,7 @@ exports[`V2BankDetails matches snapshot with order data 1`] = `
             accessible={true}
             style={
               {
-                "backgroundColor": "#3c4d9d0f",
+                "backgroundColor": "#b4b4b528",
                 "borderRadius": 8,
                 "marginVertical": 8,
                 "padding": 16,
@@ -1351,7 +1431,7 @@ exports[`V2BankDetails matches snapshot with order data 1`] = `
                 testID="listitemcolumn"
               >
                 <SvgMock
-                  color="#686e7d"
+                  color="#66676a"
                   fill="currentColor"
                   height={24}
                   name="SecurityKey"
@@ -1385,7 +1465,7 @@ exports[`V2BankDetails matches snapshot with order data 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#686e7d",
+                      "color": "#66676a",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 12,
                       "letterSpacing": 0.25,
@@ -1419,7 +1499,7 @@ exports[`V2BankDetails matches snapshot with order data 1`] = `
                 {
                   "alignItems": "center",
                   "alignSelf": "flex-start",
-                  "backgroundColor": "#3c4d9d0f",
+                  "backgroundColor": "#b4b4b528",
                   "borderColor": "transparent",
                   "borderRadius": 12,
                   "borderWidth": 1,
@@ -1436,7 +1516,7 @@ exports[`V2BankDetails matches snapshot with order data 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Medium",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -1460,7 +1540,7 @@ exports[`V2BankDetails matches snapshot with order data 1`] = `
                 {
                   "alignItems": "center",
                   "alignSelf": "flex-start",
-                  "backgroundColor": "#121314",
+                  "backgroundColor": "#131416",
                   "borderRadius": 12,
                   "flex": 1,
                   "flexDirection": "row",
@@ -1536,8 +1616,8 @@ exports[`V2BankDetails renders IBAN and BIC fields when present 1`] = `
             ]
           }
           onRefresh={[Function]}
-          refreshing={true}
-          tintColor="#121314"
+          refreshing={false}
+          tintColor="#131416"
         />
       }
       testID="bank-details-refresh-control-scrollview"
@@ -1581,9 +1661,9 @@ exports[`V2BankDetails renders IBAN and BIC fields when present 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Bold",
-                    "fontSize": 18,
+                    "fontSize": 20,
                     "letterSpacing": 0,
                     "lineHeight": 24,
                   }
@@ -1595,7 +1675,7 @@ exports[`V2BankDetails renders IBAN and BIC fields when present 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -1609,7 +1689,7 @@ exports[`V2BankDetails renders IBAN and BIC fields when present 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -1623,7 +1703,7 @@ exports[`V2BankDetails renders IBAN and BIC fields when present 1`] = `
             <View
               style={
                 {
-                  "backgroundColor": "#3c4d9d0f",
+                  "backgroundColor": "#b4b4b528",
                   "borderRadius": 8,
                   "gap": 16,
                   "padding": 16,
@@ -1729,7 +1809,430 @@ exports[`V2BankDetails renders IBAN and BIC fields when present 1`] = `
             accessible={true}
             style={
               {
-                "backgroundColor": "#3c4d9d0f",
+                "backgroundColor": "#b4b4b528",
+                "borderRadius": 8,
+                "marginVertical": 8,
+                "padding": 16,
+                "paddingVertical": 8,
+              }
+            }
+          >
+            <View
+              style={
+                {
+                  "alignItems": "flex-start",
+                  "flexDirection": "row",
+                }
+              }
+            >
+              <View
+                style={
+                  {
+                    "flex": -1,
+                  }
+                }
+                testID="listitemcolumn"
+              >
+                <SvgMock
+                  color="#66676a"
+                  fill="currentColor"
+                  height={24}
+                  name="SecurityKey"
+                  style={
+                    {
+                      "height": 24,
+                      "width": 24,
+                    }
+                  }
+                  width={24}
+                />
+              </View>
+              <View
+                accessible={false}
+                style={
+                  {
+                    "width": 8,
+                  }
+                }
+                testID="listitem-gap"
+              />
+              <View
+                style={
+                  {
+                    "flex": 1,
+                  }
+                }
+                testID="listitemcolumn"
+              >
+                <Text
+                  accessibilityRole="text"
+                  style={
+                    {
+                      "color": "#66676a",
+                      "fontFamily": "Geist-Regular",
+                      "fontSize": 12,
+                      "letterSpacing": 0.25,
+                      "lineHeight": 20,
+                    }
+                  }
+                >
+                  deposit.bank_details.info_banner_text
+                </Text>
+              </View>
+            </View>
+          </View>
+          <View
+            style={
+              {
+                "flexDirection": "row",
+                "gap": 16,
+              }
+            }
+          >
+            <TouchableOpacity
+              accessibilityRole="button"
+              accessible={true}
+              activeOpacity={1}
+              disabled={false}
+              loading={false}
+              onPress={[Function]}
+              onPressIn={[Function]}
+              onPressOut={[Function]}
+              style={
+                {
+                  "alignItems": "center",
+                  "alignSelf": "flex-start",
+                  "backgroundColor": "#b4b4b528",
+                  "borderColor": "transparent",
+                  "borderRadius": 12,
+                  "borderWidth": 1,
+                  "flex": 1,
+                  "flexDirection": "row",
+                  "height": 48,
+                  "justifyContent": "center",
+                  "overflow": "hidden",
+                  "paddingHorizontal": 16,
+                }
+              }
+            >
+              <Text
+                accessibilityRole="text"
+                style={
+                  {
+                    "color": "#131416",
+                    "fontFamily": "Geist-Medium",
+                    "fontSize": 16,
+                    "letterSpacing": 0,
+                    "lineHeight": 24,
+                  }
+                }
+              >
+                deposit.order_processing.cancel_order_button
+              </Text>
+            </TouchableOpacity>
+            <TouchableOpacity
+              accessibilityRole="button"
+              accessible={true}
+              activeOpacity={1}
+              disabled={false}
+              loading={false}
+              onPress={[Function]}
+              onPressIn={[Function]}
+              onPressOut={[Function]}
+              style={
+                {
+                  "alignItems": "center",
+                  "alignSelf": "flex-start",
+                  "backgroundColor": "#131416",
+                  "borderRadius": 12,
+                  "flex": 1,
+                  "flexDirection": "row",
+                  "height": 48,
+                  "justifyContent": "center",
+                  "overflow": "hidden",
+                  "paddingHorizontal": 16,
+                }
+              }
+              testID="main-action-button"
+            >
+              <Text
+                accessibilityRole="text"
+                style={
+                  {
+                    "color": "#ffffff",
+                    "fontFamily": "Geist-Medium",
+                    "fontSize": 16,
+                    "letterSpacing": 0,
+                    "lineHeight": 24,
+                  }
+                }
+              >
+                deposit.bank_details.button
+              </Text>
+            </TouchableOpacity>
+          </View>
+        </View>
+      </View>
+    </View>
+  </View>
+</RNCSafeAreaView>
+`;
+
+exports[`V2BankDetails when shouldUpdate is false matches snapshot showing bank details from controller order 1`] = `
+<RNCSafeAreaView
+  edges={
+    {
+      "bottom": "additive",
+      "left": "additive",
+      "right": "additive",
+      "top": "off",
+    }
+  }
+  style={
+    {
+      "flex": 1,
+    }
+  }
+>
+  <View
+    style={
+      [
+        {
+          "backgroundColor": "#ffffff",
+          "flex": 1,
+        },
+        undefined,
+      ]
+    }
+  >
+    <RCTScrollView
+      collapsable={false}
+      handlerTag={-1}
+      handlerType="NativeViewGestureHandler"
+      onGestureHandlerEvent={[Function]}
+      onGestureHandlerStateChange={[Function]}
+      refreshControl={
+        <RefreshControlMock
+          colors={
+            [
+              "#4459ff",
+            ]
+          }
+          onRefresh={[Function]}
+          refreshing={false}
+          tintColor="#131416"
+        />
+      }
+      testID="bank-details-refresh-control-scrollview"
+    >
+      <RCTRefreshControl />
+      <View>
+        <View
+          style={
+            [
+              {
+                "flex": 1,
+              },
+              undefined,
+            ]
+          }
+        >
+          <View
+            style={
+              [
+                {
+                  "padding": 15,
+                  "paddingHorizontal": 16,
+                },
+                undefined,
+                {
+                  "flex": 1,
+                  "paddingHorizontal": 16,
+                },
+              ]
+            }
+          >
+            <View
+              style={
+                {
+                  "gap": 8,
+                  "marginBottom": 24,
+                }
+              }
+            >
+              <Text
+                accessibilityRole="text"
+                style={
+                  {
+                    "color": "#131416",
+                    "fontFamily": "Geist-Bold",
+                    "fontSize": 20,
+                    "letterSpacing": 0,
+                    "lineHeight": 24,
+                  }
+                }
+              >
+                deposit.bank_details.main_title
+              </Text>
+              <Text
+                accessibilityRole="text"
+                style={
+                  {
+                    "color": "#66676a",
+                    "fontFamily": "Geist-Regular",
+                    "fontSize": 16,
+                    "letterSpacing": 0,
+                    "lineHeight": 24,
+                  }
+                }
+              >
+                deposit.bank_details.main_content_1
+              </Text>
+              <Text
+                accessibilityRole="text"
+                style={
+                  {
+                    "color": "#66676a",
+                    "fontFamily": "Geist-Regular",
+                    "fontSize": 16,
+                    "letterSpacing": 0,
+                    "lineHeight": 24,
+                  }
+                }
+              >
+                deposit.bank_details.main_content_2
+              </Text>
+            </View>
+            <View
+              style={
+                {
+                  "backgroundColor": "#b4b4b528",
+                  "borderRadius": 8,
+                  "gap": 16,
+                  "padding": 16,
+                }
+              }
+            >
+              <View
+                testID="bank-detail-deposit.bank_details.transfer_amount"
+              >
+                <Text>
+                  deposit.bank_details.transfer_amount
+                </Text>
+                <Text>
+                  $100.00
+                </Text>
+              </View>
+              <View
+                testID="bank-detail-deposit.bank_details.account_holder_name"
+              >
+                <Text>
+                  deposit.bank_details.account_holder_name
+                </Text>
+                <Text>
+                  John Doe
+                </Text>
+              </View>
+              <View
+                testID="bank-detail-deposit.bank_details.routing_number"
+              >
+                <Text>
+                  deposit.bank_details.routing_number
+                </Text>
+                <Text>
+                  987654321
+                </Text>
+              </View>
+              <View
+                testID="bank-detail-deposit.bank_details.account_number"
+              >
+                <Text>
+                  deposit.bank_details.account_number
+                </Text>
+                <Text>
+                  123456789
+                </Text>
+              </View>
+              <View
+                testID="bank-detail-deposit.bank_details.account_type"
+              >
+                <Text>
+                  deposit.bank_details.account_type
+                </Text>
+                <Text>
+                  Checking
+                </Text>
+              </View>
+              <TouchableOpacity
+                onPress={[Function]}
+                style={
+                  {
+                    "alignItems": "center",
+                    "flexDirection": "row",
+                    "gap": 8,
+                    "justifyContent": "center",
+                  }
+                }
+              >
+                <Text
+                  accessibilityRole="text"
+                  style={
+                    {
+                      "color": "#4459ff",
+                      "fontFamily": "Geist-Regular",
+                      "fontSize": 16,
+                      "letterSpacing": 0,
+                      "lineHeight": 24,
+                    }
+                  }
+                >
+                  deposit.bank_details.show_bank_info
+                </Text>
+                <SvgMock
+                  color="#4459ff"
+                  fill="currentColor"
+                  height={16}
+                  name="ArrowDown"
+                  style={
+                    {
+                      "height": 16,
+                      "width": 16,
+                    }
+                  }
+                  width={16}
+                />
+              </TouchableOpacity>
+            </View>
+          </View>
+        </View>
+      </View>
+    </RCTScrollView>
+    <View>
+      <View
+        style={
+          [
+            {
+              "padding": 15,
+              "paddingHorizontal": 16,
+            },
+            undefined,
+            undefined,
+          ]
+        }
+      >
+        <View
+          style={
+            {
+              "gap": 16,
+            }
+          }
+        >
+          <View
+            accessibilityRole="none"
+            accessible={true}
+            style={
+              {
+                "backgroundColor": "#b4b4b528",
                 "borderRadius": 8,
                 "marginVertical": 8,
                 "padding": 16,
@@ -1754,7 +2257,7 @@ exports[`V2BankDetails renders IBAN and BIC fields when present 1`] = `
                 testID="listitemcolumn"
               >
                 <SvgMock
-                  color="#686e7d"
+                  color="#66676a"
                   fill="currentColor"
                   height={24}
                   name="SecurityKey"
@@ -1788,7 +2291,7 @@ exports[`V2BankDetails renders IBAN and BIC fields when present 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#686e7d",
+                      "color": "#66676a",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 12,
                       "letterSpacing": 0.25,
@@ -1822,7 +2325,7 @@ exports[`V2BankDetails renders IBAN and BIC fields when present 1`] = `
                 {
                   "alignItems": "center",
                   "alignSelf": "flex-start",
-                  "backgroundColor": "#3c4d9d0f",
+                  "backgroundColor": "#b4b4b528",
                   "borderColor": "transparent",
                   "borderRadius": 12,
                   "borderWidth": 1,
@@ -1839,7 +2342,7 @@ exports[`V2BankDetails renders IBAN and BIC fields when present 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Medium",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -1863,7 +2366,7 @@ exports[`V2BankDetails renders IBAN and BIC fields when present 1`] = `
                 {
                   "alignItems": "center",
                   "alignSelf": "flex-start",
-                  "backgroundColor": "#121314",
+                  "backgroundColor": "#131416",
                   "borderRadius": 12,
                   "flex": 1,
                   "flexDirection": "row",
diff --git a/app/components/UI/Ramp/Views/NativeFlow/__snapshots__/BasicInfo.test.tsx.snap b/app/components/UI/Ramp/Views/NativeFlow/__snapshots__/BasicInfo.test.tsx.snap
index 1406888866f7..88e86911c038 100644
--- a/app/components/UI/Ramp/Views/NativeFlow/__snapshots__/BasicInfo.test.tsx.snap
+++ b/app/components/UI/Ramp/Views/NativeFlow/__snapshots__/BasicInfo.test.tsx.snap
@@ -162,7 +162,7 @@ exports[`V2BasicInfo handles region with no phone prefix 1`] = `
                         "height": 4,
                       },
                       {
-                        "backgroundColor": "#b7bbc8",
+                        "backgroundColor": "#babbbe",
                       },
                     ],
                     undefined,
@@ -175,9 +175,9 @@ exports[`V2BasicInfo handles region with no phone prefix 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Bold",
-                  "fontSize": 18,
+                  "fontSize": 20,
                   "letterSpacing": 0,
                   "lineHeight": 24,
                   "marginBottom": 4,
@@ -191,7 +191,7 @@ exports[`V2BasicInfo handles region with no phone prefix 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -228,7 +228,7 @@ exports[`V2BasicInfo handles region with no phone prefix 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -273,8 +273,8 @@ exports[`V2BasicInfo handles region with no phone prefix 1`] = `
                   style={
                     {
                       "alignItems": "center",
-                      "backgroundColor": "#3c4d9d0f",
-                      "borderColor": "#b7bbc866",
+                      "backgroundColor": "#b4b4b528",
+                      "borderColor": "#b4b4b566",
                       "borderRadius": 12,
                       "borderWidth": 1,
                       "flexDirection": "row",
@@ -305,19 +305,20 @@ exports[`V2BasicInfo handles region with no phone prefix 1`] = `
                       onFocus={[Function]}
                       onSubmitEditing={[Function]}
                       placeholder="deposit.basic_info.first_name"
-                      placeholderTextColor="#686e7d"
+                      placeholderTextColor="#66676a"
                       returnKeyType="next"
                       style={
                         {
                           "backgroundColor": "inherit",
                           "borderColor": "transparent",
                           "borderWidth": 1,
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "fontWeight": "400",
                           "height": 46,
                           "letterSpacing": 0,
+                          "lineHeight": 0,
                           "opacity": 1,
                         }
                       }
@@ -345,7 +346,7 @@ exports[`V2BasicInfo handles region with no phone prefix 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -390,8 +391,8 @@ exports[`V2BasicInfo handles region with no phone prefix 1`] = `
                   style={
                     {
                       "alignItems": "center",
-                      "backgroundColor": "#3c4d9d0f",
-                      "borderColor": "#b7bbc866",
+                      "backgroundColor": "#b4b4b528",
+                      "borderColor": "#b4b4b566",
                       "borderRadius": 12,
                       "borderWidth": 1,
                       "flexDirection": "row",
@@ -422,19 +423,20 @@ exports[`V2BasicInfo handles region with no phone prefix 1`] = `
                       onFocus={[Function]}
                       onSubmitEditing={[Function]}
                       placeholder="deposit.basic_info.last_name"
-                      placeholderTextColor="#686e7d"
+                      placeholderTextColor="#66676a"
                       returnKeyType="next"
                       style={
                         {
                           "backgroundColor": "inherit",
                           "borderColor": "transparent",
                           "borderWidth": 1,
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "fontWeight": "400",
                           "height": 46,
                           "letterSpacing": 0,
+                          "lineHeight": 0,
                           "opacity": 1,
                         }
                       }
@@ -461,7 +463,7 @@ exports[`V2BasicInfo handles region with no phone prefix 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -506,8 +508,8 @@ exports[`V2BasicInfo handles region with no phone prefix 1`] = `
                 style={
                   {
                     "alignItems": "center",
-                    "backgroundColor": "#3c4d9d0f",
-                    "borderColor": "#b7bbc866",
+                    "backgroundColor": "#b4b4b528",
+                    "borderColor": "#b4b4b566",
                     "borderRadius": 12,
                     "borderWidth": 1,
                     "flexDirection": "row",
@@ -539,7 +541,7 @@ exports[`V2BasicInfo handles region with no phone prefix 1`] = `
                       accessibilityRole="text"
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 18,
                           "letterSpacing": 0,
@@ -571,18 +573,19 @@ exports[`V2BasicInfo handles region with no phone prefix 1`] = `
                     onFocus={[Function]}
                     onSubmitEditing={[Function]}
                     placeholder="XXXX XXX XXXX"
-                    placeholderTextColor="#686e7d"
+                    placeholderTextColor="#66676a"
                     style={
                       {
                         "backgroundColor": "inherit",
                         "borderColor": "transparent",
                         "borderWidth": 1,
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 16,
                         "fontWeight": "400",
                         "height": 46,
                         "letterSpacing": 0,
+                        "lineHeight": 0,
                         "opacity": 1,
                       }
                     }
@@ -607,7 +610,7 @@ exports[`V2BasicInfo handles region with no phone prefix 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -652,8 +655,8 @@ exports[`V2BasicInfo handles region with no phone prefix 1`] = `
                 style={
                   {
                     "alignItems": "center",
-                    "backgroundColor": "#3c4d9d0f",
-                    "borderColor": "#b7bbc866",
+                    "backgroundColor": "#b4b4b528",
+                    "borderColor": "#b4b4b566",
                     "borderRadius": 12,
                     "borderWidth": 1,
                     "flexDirection": "row",
@@ -673,7 +676,7 @@ exports[`V2BasicInfo handles region with no phone prefix 1`] = `
                   testID="textfield-startacccessory"
                 >
                   <SvgMock
-                    color="#121314"
+                    color="#131416"
                     fill="currentColor"
                     height={20}
                     name="Calendar"
@@ -706,11 +709,11 @@ exports[`V2BasicInfo handles region with no phone prefix 1`] = `
                     <TextInput
                       editable={false}
                       placeholder="01/01/2000"
-                      placeholderTextColor="#b7bbc8"
+                      placeholderTextColor="#babbbe"
                       pointerEvents="none"
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "flex": 1,
                           "fontSize": 16,
                           "height": "100%",
@@ -748,7 +751,7 @@ exports[`V2BasicInfo handles region with no phone prefix 1`] = `
           accessible={true}
           style={
             {
-              "backgroundColor": "#3c4d9d0f",
+              "backgroundColor": "#b4b4b528",
               "borderRadius": 8,
               "marginVertical": 8,
               "padding": 16,
@@ -773,7 +776,7 @@ exports[`V2BasicInfo handles region with no phone prefix 1`] = `
               testID="listitemcolumn"
             >
               <SvgMock
-                color="#686e7d"
+                color="#66676a"
                 fill="currentColor"
                 height={24}
                 name="SecurityKey"
@@ -807,7 +810,7 @@ exports[`V2BasicInfo handles region with no phone prefix 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 12,
                     "letterSpacing": 0.25,
@@ -821,7 +824,7 @@ exports[`V2BasicInfo handles region with no phone prefix 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 12,
                     "letterSpacing": 0.25,
@@ -847,7 +850,7 @@ exports[`V2BasicInfo handles region with no phone prefix 1`] = `
             {
               "alignItems": "center",
               "alignSelf": "stretch",
-              "backgroundColor": "#121314",
+              "backgroundColor": "#131416",
               "borderRadius": 12,
               "flexDirection": "row",
               "height": 48,
@@ -878,7 +881,7 @@ exports[`V2BasicInfo handles region with no phone prefix 1`] = `
           name="powered-by-transak-logo"
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "height": 24,
             }
           }
@@ -1051,7 +1054,7 @@ exports[`V2BasicInfo matches snapshot 1`] = `
                         "height": 4,
                       },
                       {
-                        "backgroundColor": "#b7bbc8",
+                        "backgroundColor": "#babbbe",
                       },
                     ],
                     undefined,
@@ -1064,9 +1067,9 @@ exports[`V2BasicInfo matches snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Bold",
-                  "fontSize": 18,
+                  "fontSize": 20,
                   "letterSpacing": 0,
                   "lineHeight": 24,
                   "marginBottom": 4,
@@ -1080,7 +1083,7 @@ exports[`V2BasicInfo matches snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -1117,7 +1120,7 @@ exports[`V2BasicInfo matches snapshot 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -1162,8 +1165,8 @@ exports[`V2BasicInfo matches snapshot 1`] = `
                   style={
                     {
                       "alignItems": "center",
-                      "backgroundColor": "#3c4d9d0f",
-                      "borderColor": "#b7bbc866",
+                      "backgroundColor": "#b4b4b528",
+                      "borderColor": "#b4b4b566",
                       "borderRadius": 12,
                       "borderWidth": 1,
                       "flexDirection": "row",
@@ -1194,19 +1197,20 @@ exports[`V2BasicInfo matches snapshot 1`] = `
                       onFocus={[Function]}
                       onSubmitEditing={[Function]}
                       placeholder="deposit.basic_info.first_name"
-                      placeholderTextColor="#686e7d"
+                      placeholderTextColor="#66676a"
                       returnKeyType="next"
                       style={
                         {
                           "backgroundColor": "inherit",
                           "borderColor": "transparent",
                           "borderWidth": 1,
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "fontWeight": "400",
                           "height": 46,
                           "letterSpacing": 0,
+                          "lineHeight": 0,
                           "opacity": 1,
                         }
                       }
@@ -1234,7 +1238,7 @@ exports[`V2BasicInfo matches snapshot 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -1279,8 +1283,8 @@ exports[`V2BasicInfo matches snapshot 1`] = `
                   style={
                     {
                       "alignItems": "center",
-                      "backgroundColor": "#3c4d9d0f",
-                      "borderColor": "#b7bbc866",
+                      "backgroundColor": "#b4b4b528",
+                      "borderColor": "#b4b4b566",
                       "borderRadius": 12,
                       "borderWidth": 1,
                       "flexDirection": "row",
@@ -1311,19 +1315,20 @@ exports[`V2BasicInfo matches snapshot 1`] = `
                       onFocus={[Function]}
                       onSubmitEditing={[Function]}
                       placeholder="deposit.basic_info.last_name"
-                      placeholderTextColor="#686e7d"
+                      placeholderTextColor="#66676a"
                       returnKeyType="next"
                       style={
                         {
                           "backgroundColor": "inherit",
                           "borderColor": "transparent",
                           "borderWidth": 1,
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "fontWeight": "400",
                           "height": 46,
                           "letterSpacing": 0,
+                          "lineHeight": 0,
                           "opacity": 1,
                         }
                       }
@@ -1350,7 +1355,7 @@ exports[`V2BasicInfo matches snapshot 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -1395,8 +1400,8 @@ exports[`V2BasicInfo matches snapshot 1`] = `
                 style={
                   {
                     "alignItems": "center",
-                    "backgroundColor": "#3c4d9d0f",
-                    "borderColor": "#b7bbc866",
+                    "backgroundColor": "#b4b4b528",
+                    "borderColor": "#b4b4b566",
                     "borderRadius": 12,
                     "borderWidth": 1,
                     "flexDirection": "row",
@@ -1428,7 +1433,7 @@ exports[`V2BasicInfo matches snapshot 1`] = `
                       accessibilityRole="text"
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 18,
                           "letterSpacing": 0,
@@ -1442,7 +1447,7 @@ exports[`V2BasicInfo matches snapshot 1`] = `
                       accessibilityRole="text"
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 14,
                           "letterSpacing": 0,
@@ -1474,18 +1479,19 @@ exports[`V2BasicInfo matches snapshot 1`] = `
                     onFocus={[Function]}
                     onSubmitEditing={[Function]}
                     placeholder="(XXX) XXX-XXXX"
-                    placeholderTextColor="#686e7d"
+                    placeholderTextColor="#66676a"
                     style={
                       {
                         "backgroundColor": "inherit",
                         "borderColor": "transparent",
                         "borderWidth": 1,
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 16,
                         "fontWeight": "400",
                         "height": 46,
                         "letterSpacing": 0,
+                        "lineHeight": 0,
                         "opacity": 1,
                       }
                     }
@@ -1510,7 +1516,7 @@ exports[`V2BasicInfo matches snapshot 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -1555,8 +1561,8 @@ exports[`V2BasicInfo matches snapshot 1`] = `
                 style={
                   {
                     "alignItems": "center",
-                    "backgroundColor": "#3c4d9d0f",
-                    "borderColor": "#b7bbc866",
+                    "backgroundColor": "#b4b4b528",
+                    "borderColor": "#b4b4b566",
                     "borderRadius": 12,
                     "borderWidth": 1,
                     "flexDirection": "row",
@@ -1576,7 +1582,7 @@ exports[`V2BasicInfo matches snapshot 1`] = `
                   testID="textfield-startacccessory"
                 >
                   <SvgMock
-                    color="#121314"
+                    color="#131416"
                     fill="currentColor"
                     height={20}
                     name="Calendar"
@@ -1609,11 +1615,11 @@ exports[`V2BasicInfo matches snapshot 1`] = `
                     <TextInput
                       editable={false}
                       placeholder="01/01/2000"
-                      placeholderTextColor="#b7bbc8"
+                      placeholderTextColor="#babbbe"
                       pointerEvents="none"
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "flex": 1,
                           "fontSize": 16,
                           "height": "100%",
@@ -1658,7 +1664,7 @@ exports[`V2BasicInfo matches snapshot 1`] = `
                     accessibilityRole="text"
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -1669,10 +1675,11 @@ exports[`V2BasicInfo matches snapshot 1`] = `
                     deposit.basic_info.social_security_number
                   </Text>
                   <TouchableOpacity
+                    onPress={[Function]}
                     testID="ssn-info-button"
                   >
                     <SvgMock
-                      color="#686e7d"
+                      color="#66676a"
                       fill="currentColor"
                       height={16}
                       name="Info"
@@ -1720,8 +1727,8 @@ exports[`V2BasicInfo matches snapshot 1`] = `
                 style={
                   {
                     "alignItems": "center",
-                    "backgroundColor": "#3c4d9d0f",
-                    "borderColor": "#b7bbc866",
+                    "backgroundColor": "#b4b4b528",
+                    "borderColor": "#b4b4b566",
                     "borderRadius": 12,
                     "borderWidth": 1,
                     "flexDirection": "row",
@@ -1753,7 +1760,7 @@ exports[`V2BasicInfo matches snapshot 1`] = `
                     onFocus={[Function]}
                     onSubmitEditing={[Function]}
                     placeholder="XXX-XX-XXXX"
-                    placeholderTextColor="#686e7d"
+                    placeholderTextColor="#66676a"
                     returnKeyType="done"
                     secureTextEntry={true}
                     style={
@@ -1761,12 +1768,13 @@ exports[`V2BasicInfo matches snapshot 1`] = `
                         "backgroundColor": "inherit",
                         "borderColor": "transparent",
                         "borderWidth": 1,
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 16,
                         "fontWeight": "400",
                         "height": 46,
                         "letterSpacing": 0,
+                        "lineHeight": 0,
                         "opacity": 1,
                       }
                     }
@@ -1801,7 +1809,7 @@ exports[`V2BasicInfo matches snapshot 1`] = `
           accessible={true}
           style={
             {
-              "backgroundColor": "#3c4d9d0f",
+              "backgroundColor": "#b4b4b528",
               "borderRadius": 8,
               "marginVertical": 8,
               "padding": 16,
@@ -1826,7 +1834,7 @@ exports[`V2BasicInfo matches snapshot 1`] = `
               testID="listitemcolumn"
             >
               <SvgMock
-                color="#686e7d"
+                color="#66676a"
                 fill="currentColor"
                 height={24}
                 name="SecurityKey"
@@ -1860,7 +1868,7 @@ exports[`V2BasicInfo matches snapshot 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 12,
                     "letterSpacing": 0.25,
@@ -1874,7 +1882,7 @@ exports[`V2BasicInfo matches snapshot 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 12,
                     "letterSpacing": 0.25,
@@ -1900,7 +1908,7 @@ exports[`V2BasicInfo matches snapshot 1`] = `
             {
               "alignItems": "center",
               "alignSelf": "stretch",
-              "backgroundColor": "#121314",
+              "backgroundColor": "#131416",
               "borderRadius": 12,
               "flexDirection": "row",
               "height": 48,
@@ -1931,7 +1939,7 @@ exports[`V2BasicInfo matches snapshot 1`] = `
           name="powered-by-transak-logo"
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "height": 24,
             }
           }
@@ -2104,7 +2112,7 @@ exports[`V2BasicInfo matches snapshot for non-US region 1`] = `
                         "height": 4,
                       },
                       {
-                        "backgroundColor": "#b7bbc8",
+                        "backgroundColor": "#babbbe",
                       },
                     ],
                     undefined,
@@ -2117,9 +2125,9 @@ exports[`V2BasicInfo matches snapshot for non-US region 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Bold",
-                  "fontSize": 18,
+                  "fontSize": 20,
                   "letterSpacing": 0,
                   "lineHeight": 24,
                   "marginBottom": 4,
@@ -2133,7 +2141,7 @@ exports[`V2BasicInfo matches snapshot for non-US region 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -2170,7 +2178,7 @@ exports[`V2BasicInfo matches snapshot for non-US region 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -2215,8 +2223,8 @@ exports[`V2BasicInfo matches snapshot for non-US region 1`] = `
                   style={
                     {
                       "alignItems": "center",
-                      "backgroundColor": "#3c4d9d0f",
-                      "borderColor": "#b7bbc866",
+                      "backgroundColor": "#b4b4b528",
+                      "borderColor": "#b4b4b566",
                       "borderRadius": 12,
                       "borderWidth": 1,
                       "flexDirection": "row",
@@ -2247,19 +2255,20 @@ exports[`V2BasicInfo matches snapshot for non-US region 1`] = `
                       onFocus={[Function]}
                       onSubmitEditing={[Function]}
                       placeholder="deposit.basic_info.first_name"
-                      placeholderTextColor="#686e7d"
+                      placeholderTextColor="#66676a"
                       returnKeyType="next"
                       style={
                         {
                           "backgroundColor": "inherit",
                           "borderColor": "transparent",
                           "borderWidth": 1,
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "fontWeight": "400",
                           "height": 46,
                           "letterSpacing": 0,
+                          "lineHeight": 0,
                           "opacity": 1,
                         }
                       }
@@ -2287,7 +2296,7 @@ exports[`V2BasicInfo matches snapshot for non-US region 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -2332,8 +2341,8 @@ exports[`V2BasicInfo matches snapshot for non-US region 1`] = `
                   style={
                     {
                       "alignItems": "center",
-                      "backgroundColor": "#3c4d9d0f",
-                      "borderColor": "#b7bbc866",
+                      "backgroundColor": "#b4b4b528",
+                      "borderColor": "#b4b4b566",
                       "borderRadius": 12,
                       "borderWidth": 1,
                       "flexDirection": "row",
@@ -2364,19 +2373,20 @@ exports[`V2BasicInfo matches snapshot for non-US region 1`] = `
                       onFocus={[Function]}
                       onSubmitEditing={[Function]}
                       placeholder="deposit.basic_info.last_name"
-                      placeholderTextColor="#686e7d"
+                      placeholderTextColor="#66676a"
                       returnKeyType="next"
                       style={
                         {
                           "backgroundColor": "inherit",
                           "borderColor": "transparent",
                           "borderWidth": 1,
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "fontWeight": "400",
                           "height": 46,
                           "letterSpacing": 0,
+                          "lineHeight": 0,
                           "opacity": 1,
                         }
                       }
@@ -2403,7 +2413,7 @@ exports[`V2BasicInfo matches snapshot for non-US region 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -2448,8 +2458,8 @@ exports[`V2BasicInfo matches snapshot for non-US region 1`] = `
                 style={
                   {
                     "alignItems": "center",
-                    "backgroundColor": "#3c4d9d0f",
-                    "borderColor": "#b7bbc866",
+                    "backgroundColor": "#b4b4b528",
+                    "borderColor": "#b4b4b566",
                     "borderRadius": 12,
                     "borderWidth": 1,
                     "flexDirection": "row",
@@ -2481,7 +2491,7 @@ exports[`V2BasicInfo matches snapshot for non-US region 1`] = `
                       accessibilityRole="text"
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 18,
                           "letterSpacing": 0,
@@ -2495,7 +2505,7 @@ exports[`V2BasicInfo matches snapshot for non-US region 1`] = `
                       accessibilityRole="text"
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 14,
                           "letterSpacing": 0,
@@ -2527,18 +2537,19 @@ exports[`V2BasicInfo matches snapshot for non-US region 1`] = `
                     onFocus={[Function]}
                     onSubmitEditing={[Function]}
                     placeholder="XXXX XXX XXXX"
-                    placeholderTextColor="#686e7d"
+                    placeholderTextColor="#66676a"
                     style={
                       {
                         "backgroundColor": "inherit",
                         "borderColor": "transparent",
                         "borderWidth": 1,
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 16,
                         "fontWeight": "400",
                         "height": 46,
                         "letterSpacing": 0,
+                        "lineHeight": 0,
                         "opacity": 1,
                       }
                     }
@@ -2563,7 +2574,7 @@ exports[`V2BasicInfo matches snapshot for non-US region 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -2608,8 +2619,8 @@ exports[`V2BasicInfo matches snapshot for non-US region 1`] = `
                 style={
                   {
                     "alignItems": "center",
-                    "backgroundColor": "#3c4d9d0f",
-                    "borderColor": "#b7bbc866",
+                    "backgroundColor": "#b4b4b528",
+                    "borderColor": "#b4b4b566",
                     "borderRadius": 12,
                     "borderWidth": 1,
                     "flexDirection": "row",
@@ -2629,7 +2640,7 @@ exports[`V2BasicInfo matches snapshot for non-US region 1`] = `
                   testID="textfield-startacccessory"
                 >
                   <SvgMock
-                    color="#121314"
+                    color="#131416"
                     fill="currentColor"
                     height={20}
                     name="Calendar"
@@ -2662,11 +2673,11 @@ exports[`V2BasicInfo matches snapshot for non-US region 1`] = `
                     <TextInput
                       editable={false}
                       placeholder="01/01/2000"
-                      placeholderTextColor="#b7bbc8"
+                      placeholderTextColor="#babbbe"
                       pointerEvents="none"
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "flex": 1,
                           "fontSize": 16,
                           "height": "100%",
@@ -2704,7 +2715,7 @@ exports[`V2BasicInfo matches snapshot for non-US region 1`] = `
           accessible={true}
           style={
             {
-              "backgroundColor": "#3c4d9d0f",
+              "backgroundColor": "#b4b4b528",
               "borderRadius": 8,
               "marginVertical": 8,
               "padding": 16,
@@ -2729,7 +2740,7 @@ exports[`V2BasicInfo matches snapshot for non-US region 1`] = `
               testID="listitemcolumn"
             >
               <SvgMock
-                color="#686e7d"
+                color="#66676a"
                 fill="currentColor"
                 height={24}
                 name="SecurityKey"
@@ -2763,7 +2774,7 @@ exports[`V2BasicInfo matches snapshot for non-US region 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 12,
                     "letterSpacing": 0.25,
@@ -2777,7 +2788,7 @@ exports[`V2BasicInfo matches snapshot for non-US region 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 12,
                     "letterSpacing": 0.25,
@@ -2803,7 +2814,7 @@ exports[`V2BasicInfo matches snapshot for non-US region 1`] = `
             {
               "alignItems": "center",
               "alignSelf": "stretch",
-              "backgroundColor": "#121314",
+              "backgroundColor": "#131416",
               "borderRadius": 12,
               "flexDirection": "row",
               "height": 48,
@@ -2834,7 +2845,7 @@ exports[`V2BasicInfo matches snapshot for non-US region 1`] = `
           name="powered-by-transak-logo"
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "height": 24,
             }
           }
diff --git a/app/components/UI/Ramp/Views/NativeFlow/__snapshots__/EnterAddress.test.tsx.snap b/app/components/UI/Ramp/Views/NativeFlow/__snapshots__/EnterAddress.test.tsx.snap
index 8ca12cf3b300..dedf2eebd1ba 100644
--- a/app/components/UI/Ramp/Views/NativeFlow/__snapshots__/EnterAddress.test.tsx.snap
+++ b/app/components/UI/Ramp/Views/NativeFlow/__snapshots__/EnterAddress.test.tsx.snap
@@ -186,7 +186,7 @@ exports[`V2EnterAddress matches snapshot 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Bold",
                     "fontSize": 24,
                     "letterSpacing": 0,
@@ -200,7 +200,7 @@ exports[`V2EnterAddress matches snapshot 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -226,7 +226,7 @@ exports[`V2EnterAddress matches snapshot 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -271,8 +271,8 @@ exports[`V2EnterAddress matches snapshot 1`] = `
                 style={
                   {
                     "alignItems": "center",
-                    "backgroundColor": "#3c4d9d0f",
-                    "borderColor": "#b7bbc866",
+                    "backgroundColor": "#b4b4b528",
+                    "borderColor": "#b4b4b566",
                     "borderRadius": 12,
                     "borderWidth": 1,
                     "flexDirection": "row",
@@ -303,14 +303,14 @@ exports[`V2EnterAddress matches snapshot 1`] = `
                     onFocus={[Function]}
                     onSubmitEditing={[Function]}
                     placeholder="deposit.enter_address.address_line_1"
-                    placeholderTextColor="#686e7d"
+                    placeholderTextColor="#66676a"
                     returnKeyType="next"
                     style={
                       {
                         "backgroundColor": "inherit",
                         "borderColor": "transparent",
                         "borderWidth": 1,
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 16,
                         "fontWeight": "400",
@@ -341,7 +341,7 @@ exports[`V2EnterAddress matches snapshot 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -386,8 +386,8 @@ exports[`V2EnterAddress matches snapshot 1`] = `
                 style={
                   {
                     "alignItems": "center",
-                    "backgroundColor": "#3c4d9d0f",
-                    "borderColor": "#b7bbc866",
+                    "backgroundColor": "#b4b4b528",
+                    "borderColor": "#b4b4b566",
                     "borderRadius": 12,
                     "borderWidth": 1,
                     "flexDirection": "row",
@@ -418,19 +418,20 @@ exports[`V2EnterAddress matches snapshot 1`] = `
                     onFocus={[Function]}
                     onSubmitEditing={[Function]}
                     placeholder="deposit.enter_address.address_line_2"
-                    placeholderTextColor="#686e7d"
+                    placeholderTextColor="#66676a"
                     returnKeyType="next"
                     style={
                       {
                         "backgroundColor": "inherit",
                         "borderColor": "transparent",
                         "borderWidth": 1,
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 16,
                         "fontWeight": "400",
                         "height": 46,
                         "letterSpacing": 0,
+                        "lineHeight": 0,
                         "opacity": 1,
                       }
                     }
@@ -467,7 +468,7 @@ exports[`V2EnterAddress matches snapshot 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -512,8 +513,8 @@ exports[`V2EnterAddress matches snapshot 1`] = `
                   style={
                     {
                       "alignItems": "center",
-                      "backgroundColor": "#3c4d9d0f",
-                      "borderColor": "#b7bbc866",
+                      "backgroundColor": "#b4b4b528",
+                      "borderColor": "#b4b4b566",
                       "borderRadius": 12,
                       "borderWidth": 1,
                       "flexDirection": "row",
@@ -543,14 +544,14 @@ exports[`V2EnterAddress matches snapshot 1`] = `
                       onFocus={[Function]}
                       onSubmitEditing={[Function]}
                       placeholder="deposit.enter_address.city"
-                      placeholderTextColor="#686e7d"
+                      placeholderTextColor="#66676a"
                       returnKeyType="next"
                       style={
                         {
                           "backgroundColor": "inherit",
                           "borderColor": "transparent",
                           "borderWidth": 1,
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "fontWeight": "400",
@@ -583,7 +584,7 @@ exports[`V2EnterAddress matches snapshot 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -628,8 +629,8 @@ exports[`V2EnterAddress matches snapshot 1`] = `
                   style={
                     {
                       "alignItems": "center",
-                      "backgroundColor": "#3c4d9d0f",
-                      "borderColor": "#b7bbc866",
+                      "backgroundColor": "#b4b4b528",
+                      "borderColor": "#b4b4b566",
                       "borderRadius": 12,
                       "borderWidth": 1,
                       "flexDirection": "row",
@@ -656,13 +657,13 @@ exports[`V2EnterAddress matches snapshot 1`] = `
                       onBlur={[Function]}
                       onFocus={[Function]}
                       placeholder="deposit.enter_address.state"
-                      placeholderTextColor="#686e7d"
+                      placeholderTextColor="#66676a"
                       style={
                         {
                           "backgroundColor": "inherit",
                           "borderColor": "transparent",
                           "borderWidth": 1,
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "fontWeight": "400",
@@ -704,7 +705,7 @@ exports[`V2EnterAddress matches snapshot 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -749,8 +750,8 @@ exports[`V2EnterAddress matches snapshot 1`] = `
                   style={
                     {
                       "alignItems": "center",
-                      "backgroundColor": "#3c4d9d0f",
-                      "borderColor": "#b7bbc866",
+                      "backgroundColor": "#b4b4b528",
+                      "borderColor": "#b4b4b566",
                       "borderRadius": 12,
                       "borderWidth": 1,
                       "flexDirection": "row",
@@ -781,14 +782,14 @@ exports[`V2EnterAddress matches snapshot 1`] = `
                       onFocus={[Function]}
                       onSubmitEditing={[Function]}
                       placeholder="deposit.enter_address.postal_code"
-                      placeholderTextColor="#686e7d"
+                      placeholderTextColor="#66676a"
                       returnKeyType="done"
                       style={
                         {
                           "backgroundColor": "inherit",
                           "borderColor": "transparent",
                           "borderWidth": 1,
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "fontWeight": "400",
@@ -821,7 +822,7 @@ exports[`V2EnterAddress matches snapshot 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -866,8 +867,8 @@ exports[`V2EnterAddress matches snapshot 1`] = `
                   style={
                     {
                       "alignItems": "center",
-                      "backgroundColor": "#3c4d9d0f",
-                      "borderColor": "#b7bbc866",
+                      "backgroundColor": "#b4b4b528",
+                      "borderColor": "#b4b4b566",
                       "borderRadius": 12,
                       "borderWidth": 1,
                       "flexDirection": "row",
@@ -890,7 +891,7 @@ exports[`V2EnterAddress matches snapshot 1`] = `
                       accessibilityRole="text"
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -917,14 +918,14 @@ exports[`V2EnterAddress matches snapshot 1`] = `
                       onBlur={[Function]}
                       onFocus={[Function]}
                       placeholder="deposit.enter_address.country"
-                      placeholderTextColor="#686e7d"
+                      placeholderTextColor="#66676a"
                       returnKeyType="done"
                       style={
                         {
                           "backgroundColor": "inherit",
                           "borderColor": "transparent",
                           "borderWidth": 1,
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "fontWeight": "400",
@@ -963,7 +964,7 @@ exports[`V2EnterAddress matches snapshot 1`] = `
             accessible={true}
             style={
               {
-                "backgroundColor": "#3c4d9d0f",
+                "backgroundColor": "#b4b4b528",
                 "borderRadius": 8,
                 "marginVertical": 8,
                 "padding": 16,
@@ -988,7 +989,7 @@ exports[`V2EnterAddress matches snapshot 1`] = `
                 testID="listitemcolumn"
               >
                 <SvgMock
-                  color="#686e7d"
+                  color="#66676a"
                   fill="currentColor"
                   height={24}
                   name="SecurityKey"
@@ -1022,7 +1023,7 @@ exports[`V2EnterAddress matches snapshot 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#686e7d",
+                      "color": "#66676a",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 12,
                       "letterSpacing": 0.25,
@@ -1036,7 +1037,7 @@ exports[`V2EnterAddress matches snapshot 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#686e7d",
+                      "color": "#66676a",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 12,
                       "letterSpacing": 0.25,
@@ -1062,7 +1063,7 @@ exports[`V2EnterAddress matches snapshot 1`] = `
               {
                 "alignItems": "center",
                 "alignSelf": "stretch",
-                "backgroundColor": "#121314",
+                "backgroundColor": "#131416",
                 "borderRadius": 12,
                 "flexDirection": "row",
                 "height": 48,
@@ -1093,7 +1094,7 @@ exports[`V2EnterAddress matches snapshot 1`] = `
             name="powered-by-transak-logo"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "height": 24,
               }
             }
@@ -1291,7 +1292,7 @@ exports[`V2EnterAddress matches snapshot for non-US region 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Bold",
                     "fontSize": 24,
                     "letterSpacing": 0,
@@ -1305,7 +1306,7 @@ exports[`V2EnterAddress matches snapshot for non-US region 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -1331,7 +1332,7 @@ exports[`V2EnterAddress matches snapshot for non-US region 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -1376,8 +1377,8 @@ exports[`V2EnterAddress matches snapshot for non-US region 1`] = `
                 style={
                   {
                     "alignItems": "center",
-                    "backgroundColor": "#3c4d9d0f",
-                    "borderColor": "#b7bbc866",
+                    "backgroundColor": "#b4b4b528",
+                    "borderColor": "#b4b4b566",
                     "borderRadius": 12,
                     "borderWidth": 1,
                     "flexDirection": "row",
@@ -1408,14 +1409,14 @@ exports[`V2EnterAddress matches snapshot for non-US region 1`] = `
                     onFocus={[Function]}
                     onSubmitEditing={[Function]}
                     placeholder="deposit.enter_address.address_line_1"
-                    placeholderTextColor="#686e7d"
+                    placeholderTextColor="#66676a"
                     returnKeyType="next"
                     style={
                       {
                         "backgroundColor": "inherit",
                         "borderColor": "transparent",
                         "borderWidth": 1,
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 16,
                         "fontWeight": "400",
@@ -1446,7 +1447,7 @@ exports[`V2EnterAddress matches snapshot for non-US region 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -1491,8 +1492,8 @@ exports[`V2EnterAddress matches snapshot for non-US region 1`] = `
                 style={
                   {
                     "alignItems": "center",
-                    "backgroundColor": "#3c4d9d0f",
-                    "borderColor": "#b7bbc866",
+                    "backgroundColor": "#b4b4b528",
+                    "borderColor": "#b4b4b566",
                     "borderRadius": 12,
                     "borderWidth": 1,
                     "flexDirection": "row",
@@ -1523,19 +1524,20 @@ exports[`V2EnterAddress matches snapshot for non-US region 1`] = `
                     onFocus={[Function]}
                     onSubmitEditing={[Function]}
                     placeholder="deposit.enter_address.address_line_2"
-                    placeholderTextColor="#686e7d"
+                    placeholderTextColor="#66676a"
                     returnKeyType="next"
                     style={
                       {
                         "backgroundColor": "inherit",
                         "borderColor": "transparent",
                         "borderWidth": 1,
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 16,
                         "fontWeight": "400",
                         "height": 46,
                         "letterSpacing": 0,
+                        "lineHeight": 0,
                         "opacity": 1,
                       }
                     }
@@ -1572,7 +1574,7 @@ exports[`V2EnterAddress matches snapshot for non-US region 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -1617,8 +1619,8 @@ exports[`V2EnterAddress matches snapshot for non-US region 1`] = `
                   style={
                     {
                       "alignItems": "center",
-                      "backgroundColor": "#3c4d9d0f",
-                      "borderColor": "#b7bbc866",
+                      "backgroundColor": "#b4b4b528",
+                      "borderColor": "#b4b4b566",
                       "borderRadius": 12,
                       "borderWidth": 1,
                       "flexDirection": "row",
@@ -1648,14 +1650,14 @@ exports[`V2EnterAddress matches snapshot for non-US region 1`] = `
                       onFocus={[Function]}
                       onSubmitEditing={[Function]}
                       placeholder="deposit.enter_address.city"
-                      placeholderTextColor="#686e7d"
+                      placeholderTextColor="#66676a"
                       returnKeyType="next"
                       style={
                         {
                           "backgroundColor": "inherit",
                           "borderColor": "transparent",
                           "borderWidth": 1,
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "fontWeight": "400",
@@ -1688,7 +1690,7 @@ exports[`V2EnterAddress matches snapshot for non-US region 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -1733,8 +1735,8 @@ exports[`V2EnterAddress matches snapshot for non-US region 1`] = `
                   style={
                     {
                       "alignItems": "center",
-                      "backgroundColor": "#3c4d9d0f",
-                      "borderColor": "#b7bbc866",
+                      "backgroundColor": "#b4b4b528",
+                      "borderColor": "#b4b4b566",
                       "borderRadius": 12,
                       "borderWidth": 1,
                       "flexDirection": "row",
@@ -1761,13 +1763,13 @@ exports[`V2EnterAddress matches snapshot for non-US region 1`] = `
                       onBlur={[Function]}
                       onFocus={[Function]}
                       placeholder="deposit.enter_address.state"
-                      placeholderTextColor="#686e7d"
+                      placeholderTextColor="#66676a"
                       style={
                         {
                           "backgroundColor": "inherit",
                           "borderColor": "transparent",
                           "borderWidth": 1,
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "fontWeight": "400",
@@ -1809,7 +1811,7 @@ exports[`V2EnterAddress matches snapshot for non-US region 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -1854,8 +1856,8 @@ exports[`V2EnterAddress matches snapshot for non-US region 1`] = `
                   style={
                     {
                       "alignItems": "center",
-                      "backgroundColor": "#3c4d9d0f",
-                      "borderColor": "#b7bbc866",
+                      "backgroundColor": "#b4b4b528",
+                      "borderColor": "#b4b4b566",
                       "borderRadius": 12,
                       "borderWidth": 1,
                       "flexDirection": "row",
@@ -1886,14 +1888,14 @@ exports[`V2EnterAddress matches snapshot for non-US region 1`] = `
                       onFocus={[Function]}
                       onSubmitEditing={[Function]}
                       placeholder="deposit.enter_address.postal_code"
-                      placeholderTextColor="#686e7d"
+                      placeholderTextColor="#66676a"
                       returnKeyType="done"
                       style={
                         {
                           "backgroundColor": "inherit",
                           "borderColor": "transparent",
                           "borderWidth": 1,
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "fontWeight": "400",
@@ -1926,7 +1928,7 @@ exports[`V2EnterAddress matches snapshot for non-US region 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -1971,8 +1973,8 @@ exports[`V2EnterAddress matches snapshot for non-US region 1`] = `
                   style={
                     {
                       "alignItems": "center",
-                      "backgroundColor": "#3c4d9d0f",
-                      "borderColor": "#b7bbc866",
+                      "backgroundColor": "#b4b4b528",
+                      "borderColor": "#b4b4b566",
                       "borderRadius": 12,
                       "borderWidth": 1,
                       "flexDirection": "row",
@@ -1995,7 +1997,7 @@ exports[`V2EnterAddress matches snapshot for non-US region 1`] = `
                       accessibilityRole="text"
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -2022,14 +2024,14 @@ exports[`V2EnterAddress matches snapshot for non-US region 1`] = `
                       onBlur={[Function]}
                       onFocus={[Function]}
                       placeholder="deposit.enter_address.country"
-                      placeholderTextColor="#686e7d"
+                      placeholderTextColor="#66676a"
                       returnKeyType="done"
                       style={
                         {
                           "backgroundColor": "inherit",
                           "borderColor": "transparent",
                           "borderWidth": 1,
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "fontWeight": "400",
@@ -2068,7 +2070,7 @@ exports[`V2EnterAddress matches snapshot for non-US region 1`] = `
             accessible={true}
             style={
               {
-                "backgroundColor": "#3c4d9d0f",
+                "backgroundColor": "#b4b4b528",
                 "borderRadius": 8,
                 "marginVertical": 8,
                 "padding": 16,
@@ -2093,7 +2095,7 @@ exports[`V2EnterAddress matches snapshot for non-US region 1`] = `
                 testID="listitemcolumn"
               >
                 <SvgMock
-                  color="#686e7d"
+                  color="#66676a"
                   fill="currentColor"
                   height={24}
                   name="SecurityKey"
@@ -2127,7 +2129,7 @@ exports[`V2EnterAddress matches snapshot for non-US region 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#686e7d",
+                      "color": "#66676a",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 12,
                       "letterSpacing": 0.25,
@@ -2141,7 +2143,7 @@ exports[`V2EnterAddress matches snapshot for non-US region 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#686e7d",
+                      "color": "#66676a",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 12,
                       "letterSpacing": 0.25,
@@ -2167,7 +2169,7 @@ exports[`V2EnterAddress matches snapshot for non-US region 1`] = `
               {
                 "alignItems": "center",
                 "alignSelf": "stretch",
-                "backgroundColor": "#121314",
+                "backgroundColor": "#131416",
                 "borderRadius": 12,
                 "flexDirection": "row",
                 "height": 48,
@@ -2198,7 +2200,7 @@ exports[`V2EnterAddress matches snapshot for non-US region 1`] = `
             name="powered-by-transak-logo"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "height": 24,
               }
             }
diff --git a/app/components/UI/Ramp/Views/NativeFlow/__snapshots__/EnterEmail.test.tsx.snap b/app/components/UI/Ramp/Views/NativeFlow/__snapshots__/EnterEmail.test.tsx.snap
index 17ff23a2c068..4b5e0f3bd263 100644
--- a/app/components/UI/Ramp/Views/NativeFlow/__snapshots__/EnterEmail.test.tsx.snap
+++ b/app/components/UI/Ramp/Views/NativeFlow/__snapshots__/EnterEmail.test.tsx.snap
@@ -66,7 +66,7 @@ exports[`V2EnterEmail matches snapshot 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 24,
                 "fontWeight": "bold",
@@ -81,7 +81,7 @@ exports[`V2EnterEmail matches snapshot 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -124,8 +124,8 @@ exports[`V2EnterEmail matches snapshot 1`] = `
             style={
               {
                 "alignItems": "center",
-                "backgroundColor": "#3c4d9d0f",
-                "borderColor": "#b7bbc866",
+                "backgroundColor": "#b4b4b528",
+                "borderColor": "#b4b4b566",
                 "borderRadius": 12,
                 "borderWidth": 1,
                 "flexDirection": "row",
@@ -157,22 +157,24 @@ exports[`V2EnterEmail matches snapshot 1`] = `
                 onFocus={[Function]}
                 onSubmitEditing={[Function]}
                 placeholder="deposit.enter_email.input_placeholder"
-                placeholderTextColor="#686e7d"
+                placeholderTextColor="#66676a"
                 returnKeyType="done"
                 style={
                   {
                     "backgroundColor": "inherit",
                     "borderColor": "transparent",
                     "borderWidth": 1,
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "fontWeight": "400",
                     "height": 46,
                     "letterSpacing": 0,
+                    "lineHeight": 0,
                     "opacity": 1,
                   }
                 }
+                testID="ramps-enter-email-input"
                 value=""
               />
             </View>
@@ -208,7 +210,7 @@ exports[`V2EnterEmail matches snapshot 1`] = `
             {
               "alignItems": "center",
               "alignSelf": "stretch",
-              "backgroundColor": "#121314",
+              "backgroundColor": "#131416",
               "borderRadius": 12,
               "flexDirection": "row",
               "height": 48,
@@ -217,6 +219,7 @@ exports[`V2EnterEmail matches snapshot 1`] = `
               "paddingHorizontal": 16,
             }
           }
+          testID="ramps-enter-email-send-button"
         >
           <Text
             accessibilityRole="text"
@@ -238,7 +241,7 @@ exports[`V2EnterEmail matches snapshot 1`] = `
           name="powered-by-transak-logo"
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "height": 24,
             }
           }
diff --git a/app/components/UI/Ramp/Views/NativeFlow/__snapshots__/KycProcessing.test.tsx.snap b/app/components/UI/Ramp/Views/NativeFlow/__snapshots__/KycProcessing.test.tsx.snap
index 500f8902848a..def6a96d9eeb 100644
--- a/app/components/UI/Ramp/Views/NativeFlow/__snapshots__/KycProcessing.test.tsx.snap
+++ b/app/components/UI/Ramp/Views/NativeFlow/__snapshots__/KycProcessing.test.tsx.snap
@@ -161,7 +161,7 @@ exports[`V2KycProcessing matches snapshot in loading state 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 16,
                 "fontWeight": "bold",
@@ -179,7 +179,7 @@ exports[`V2KycProcessing matches snapshot in loading state 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -213,7 +213,7 @@ exports[`V2KycProcessing matches snapshot in loading state 1`] = `
           name="powered-by-transak-logo"
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "height": 24,
             }
           }
diff --git a/app/components/UI/Ramp/Views/NativeFlow/__snapshots__/OrderProcessing.test.tsx.snap b/app/components/UI/Ramp/Views/NativeFlow/__snapshots__/OrderProcessing.test.tsx.snap
index 0454d7e9dec6..f848535e7629 100644
--- a/app/components/UI/Ramp/Views/NativeFlow/__snapshots__/OrderProcessing.test.tsx.snap
+++ b/app/components/UI/Ramp/Views/NativeFlow/__snapshots__/OrderProcessing.test.tsx.snap
@@ -130,7 +130,7 @@ exports[`V2OrderProcessing matches snapshot when order is pending 1`] = `
                 {
                   "alignItems": "center",
                   "alignSelf": "flex-start",
-                  "backgroundColor": "#121314",
+                  "backgroundColor": "#131416",
                   "borderRadius": 12,
                   "flex": 1,
                   "flexDirection": "row",
diff --git a/app/components/UI/Ramp/Views/NativeFlow/__snapshots__/OtpCode.test.tsx.snap b/app/components/UI/Ramp/Views/NativeFlow/__snapshots__/OtpCode.test.tsx.snap
index a735b4fc981a..08c1a79a39b8 100644
--- a/app/components/UI/Ramp/Views/NativeFlow/__snapshots__/OtpCode.test.tsx.snap
+++ b/app/components/UI/Ramp/Views/NativeFlow/__snapshots__/OtpCode.test.tsx.snap
@@ -26,6 +26,7 @@ exports[`V2OtpCode matches snapshot 1`] = `
         undefined,
       ]
     }
+    testID="otp-code-screen"
   >
     <View
       style={
@@ -113,7 +114,7 @@ exports[`V2OtpCode matches snapshot 1`] = `
                     "height": 4,
                   },
                   {
-                    "backgroundColor": "#b7bbc8",
+                    "backgroundColor": "#babbbe",
                   },
                 ],
                 {
@@ -133,7 +134,7 @@ exports[`V2OtpCode matches snapshot 1`] = `
                     "height": 4,
                   },
                   {
-                    "backgroundColor": "#b7bbc8",
+                    "backgroundColor": "#babbbe",
                   },
                 ],
                 undefined,
@@ -146,7 +147,7 @@ exports[`V2OtpCode matches snapshot 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Bold",
               "fontSize": 24,
               "fontWeight": "bold",
@@ -162,7 +163,7 @@ exports[`V2OtpCode matches snapshot 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -212,8 +213,8 @@ exports[`V2OtpCode matches snapshot 1`] = `
               [
                 {
                   "alignItems": "center",
-                  "backgroundColor": "#3c4d9d0f",
-                  "borderColor": "#b7bbc866",
+                  "backgroundColor": "#b4b4b528",
+                  "borderColor": "#b4b4b566",
                   "borderRadius": 8,
                   "borderWidth": 1,
                   "height": 50,
@@ -228,7 +229,7 @@ exports[`V2OtpCode matches snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Bold",
                   "fontSize": 24,
                   "fontWeight": "bold",
@@ -244,8 +245,8 @@ exports[`V2OtpCode matches snapshot 1`] = `
               [
                 {
                   "alignItems": "center",
-                  "backgroundColor": "#3c4d9d0f",
-                  "borderColor": "#b7bbc866",
+                  "backgroundColor": "#b4b4b528",
+                  "borderColor": "#b4b4b566",
                   "borderRadius": 8,
                   "borderWidth": 1,
                   "height": 50,
@@ -260,7 +261,7 @@ exports[`V2OtpCode matches snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Bold",
                   "fontSize": 24,
                   "fontWeight": "bold",
@@ -276,8 +277,8 @@ exports[`V2OtpCode matches snapshot 1`] = `
               [
                 {
                   "alignItems": "center",
-                  "backgroundColor": "#3c4d9d0f",
-                  "borderColor": "#b7bbc866",
+                  "backgroundColor": "#b4b4b528",
+                  "borderColor": "#b4b4b566",
                   "borderRadius": 8,
                   "borderWidth": 1,
                   "height": 50,
@@ -292,7 +293,7 @@ exports[`V2OtpCode matches snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Bold",
                   "fontSize": 24,
                   "fontWeight": "bold",
@@ -308,8 +309,8 @@ exports[`V2OtpCode matches snapshot 1`] = `
               [
                 {
                   "alignItems": "center",
-                  "backgroundColor": "#3c4d9d0f",
-                  "borderColor": "#b7bbc866",
+                  "backgroundColor": "#b4b4b528",
+                  "borderColor": "#b4b4b566",
                   "borderRadius": 8,
                   "borderWidth": 1,
                   "height": 50,
@@ -324,7 +325,7 @@ exports[`V2OtpCode matches snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Bold",
                   "fontSize": 24,
                   "fontWeight": "bold",
@@ -340,8 +341,8 @@ exports[`V2OtpCode matches snapshot 1`] = `
               [
                 {
                   "alignItems": "center",
-                  "backgroundColor": "#3c4d9d0f",
-                  "borderColor": "#b7bbc866",
+                  "backgroundColor": "#b4b4b528",
+                  "borderColor": "#b4b4b566",
                   "borderRadius": 8,
                   "borderWidth": 1,
                   "height": 50,
@@ -356,7 +357,7 @@ exports[`V2OtpCode matches snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Bold",
                   "fontSize": 24,
                   "fontWeight": "bold",
@@ -372,8 +373,8 @@ exports[`V2OtpCode matches snapshot 1`] = `
               [
                 {
                   "alignItems": "center",
-                  "backgroundColor": "#3c4d9d0f",
-                  "borderColor": "#b7bbc866",
+                  "backgroundColor": "#b4b4b528",
+                  "borderColor": "#b4b4b566",
                   "borderRadius": 8,
                   "borderWidth": 1,
                   "height": 50,
@@ -388,7 +389,7 @@ exports[`V2OtpCode matches snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Bold",
                   "fontSize": 24,
                   "fontWeight": "bold",
@@ -419,7 +420,7 @@ exports[`V2OtpCode matches snapshot 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -437,7 +438,7 @@ exports[`V2OtpCode matches snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -481,7 +482,7 @@ exports[`V2OtpCode matches snapshot 1`] = `
             {
               "alignItems": "center",
               "alignSelf": "stretch",
-              "backgroundColor": "#121314",
+              "backgroundColor": "#131416",
               "borderRadius": 12,
               "flexDirection": "row",
               "height": 48,
@@ -513,7 +514,7 @@ exports[`V2OtpCode matches snapshot 1`] = `
           name="powered-by-transak-logo"
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "height": 24,
             }
           }
diff --git a/app/components/UI/Ramp/Views/NativeFlow/__snapshots__/VerifyIdentity.test.tsx.snap b/app/components/UI/Ramp/Views/NativeFlow/__snapshots__/VerifyIdentity.test.tsx.snap
index 78966f6db6e4..9b4e9039c1ad 100644
--- a/app/components/UI/Ramp/Views/NativeFlow/__snapshots__/VerifyIdentity.test.tsx.snap
+++ b/app/components/UI/Ramp/Views/NativeFlow/__snapshots__/VerifyIdentity.test.tsx.snap
@@ -75,7 +75,7 @@ exports[`V2VerifyIdentity matches snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Bold",
                   "fontSize": 24,
                   "fontWeight": "bold",
@@ -91,7 +91,7 @@ exports[`V2VerifyIdentity matches snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -106,7 +106,7 @@ exports[`V2VerifyIdentity matches snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -120,7 +120,7 @@ exports[`V2VerifyIdentity matches snapshot 1`] = `
                 onPress={[Function]}
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -137,7 +137,7 @@ exports[`V2VerifyIdentity matches snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -152,7 +152,7 @@ exports[`V2VerifyIdentity matches snapshot 1`] = `
                 onPress={[Function]}
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -189,7 +189,7 @@ exports[`V2VerifyIdentity matches snapshot 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#b7bbc8",
+              "color": "#babbbe",
               "fontFamily": "Geist-Regular",
               "fontSize": 12,
               "letterSpacing": 0.25,
@@ -204,7 +204,7 @@ exports[`V2VerifyIdentity matches snapshot 1`] = `
             onPress={[Function]}
             style={
               {
-                "color": "#b7bbc8",
+                "color": "#babbbe",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 12,
                 "letterSpacing": 0.25,
@@ -221,7 +221,7 @@ exports[`V2VerifyIdentity matches snapshot 1`] = `
             onPress={[Function]}
             style={
               {
-                "color": "#b7bbc8",
+                "color": "#babbbe",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 12,
                 "letterSpacing": 0.25,
@@ -246,7 +246,7 @@ exports[`V2VerifyIdentity matches snapshot 1`] = `
             {
               "alignItems": "center",
               "alignSelf": "stretch",
-              "backgroundColor": "#121314",
+              "backgroundColor": "#131416",
               "borderRadius": 12,
               "flexDirection": "row",
               "height": 48,
@@ -255,6 +255,7 @@ exports[`V2VerifyIdentity matches snapshot 1`] = `
               "paddingHorizontal": 16,
             }
           }
+          testID="ramps-verify-identity-continue-button"
         >
           <Text
             accessibilityRole="text"
@@ -276,7 +277,7 @@ exports[`V2VerifyIdentity matches snapshot 1`] = `
           name="powered-by-transak-logo"
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "height": 24,
             }
           }
diff --git a/app/components/UI/Ramp/Views/OrderDetails/OrderContent.test.tsx b/app/components/UI/Ramp/Views/OrderDetails/OrderContent.test.tsx
index 7b8b4534e4b8..099eedd049bd 100644
--- a/app/components/UI/Ramp/Views/OrderDetails/OrderContent.test.tsx
+++ b/app/components/UI/Ramp/Views/OrderDetails/OrderContent.test.tsx
@@ -3,12 +3,7 @@ import { fireEvent, act, screen } from '@testing-library/react-native';
 import OrderContent from './OrderContent';
 import renderWithProvider from '../../../../../util/test/renderWithProvider';
 import { backgroundState } from '../../../../../util/test/initial-root-state';
-import {
-  FIAT_ORDER_STATES,
-  FIAT_ORDER_PROVIDERS,
-} from '../../../../../constants/on-ramp';
-import type { FiatOrder } from '../../../../../reducers/fiatOrders';
-import type { RampsOrder } from '@metamask/ramps-controller';
+import { type RampsOrder, RampsOrderStatus } from '@metamask/ramps-controller';
 import Clipboard from '@react-native-clipboard/clipboard';
 import InAppBrowser from 'react-native-inappbrowser-reborn';
 
@@ -18,10 +13,6 @@ jest.mock('@react-navigation/native', () => ({
   useNavigation: () => ({ navigate: mockNavigate, goBack: jest.fn() }),
 }));
 
-jest.mock('../../../../../reducers/fiatOrders', () => ({
-  getProviderName: jest.fn(() => 'Transak'),
-}));
-
 jest.mock('../../../../../util/networks', () => ({
   getNetworkImageSource: jest.fn(() => ({
     uri: 'https://example.com/eth.png',
@@ -37,7 +28,10 @@ jest.mock('react-native-inappbrowser-reborn', () => ({
   open: jest.fn(),
 }));
 
-const mockRampsOrderData: Partial<RampsOrder> = {
+const mockOrder: RampsOrder = {
+  id: '/providers/transak/orders/abc123',
+  isOnlyLink: false,
+  success: true,
   providerOrderId: 'transak_order_abc123',
   providerOrderLink: 'https://transak.com/order/abc',
   fiatAmount: 100,
@@ -53,23 +47,16 @@ const mockRampsOrderData: Partial<RampsOrder> = {
   statusDescription: 'Card purchases typically take a few minutes',
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   provider: { id: '/providers/transak', name: 'Transak', links: [] } as any,
-};
-
-const mockOrder: FiatOrder = {
-  id: '/providers/transak/orders/abc123',
-  provider: FIAT_ORDER_PROVIDERS.RAMPS_V2,
   createdAt: 1700000000000,
-  amount: 100,
-  currency: 'USD',
-  cryptoAmount: 0.05,
-  cryptocurrency: 'ETH',
-  fee: 2.5,
-  state: FIAT_ORDER_STATES.COMPLETED,
-  account: '0x1234',
-  network: '1',
+  txHash: '',
+  walletAddress: '0x1234',
+  status: RampsOrderStatus.Completed,
+  network: { chainId: '1', name: 'Ethereum' },
+  canBeUpdated: false,
+  idHasExpired: false,
   excludeFromPurchases: false,
+  timeDescriptionPending: '',
   orderType: 'BUY',
-  data: mockRampsOrderData as RampsOrder,
 };
 
 describe('OrderContent', () => {
@@ -78,7 +65,7 @@ describe('OrderContent', () => {
   });
 
   function renderOrder(
-    order: FiatOrder,
+    order: RampsOrder,
     props?: { showCloseButton?: boolean },
   ) {
     return renderWithProvider(<OrderContent order={order} {...props} />, {
@@ -92,10 +79,10 @@ describe('OrderContent', () => {
   });
 
   it('renders loading state when order has no amount', () => {
-    const pendingOrder: FiatOrder = {
+    const pendingOrder: RampsOrder = {
       ...mockOrder,
-      amount: 0,
-      state: FIAT_ORDER_STATES.PENDING,
+      fiatAmount: 0,
+      status: RampsOrderStatus.Pending,
     };
     renderOrder(pendingOrder);
     expect(screen.toJSON()).toMatchSnapshot();
@@ -107,9 +94,7 @@ describe('OrderContent', () => {
     if (copyButton) {
       fireEvent.press(copyButton);
     }
-    expect(Clipboard.setString).toHaveBeenCalledWith(
-      '/providers/transak/orders/abc123',
-    );
+    expect(Clipboard.setString).toHaveBeenCalledWith('transak_order_abc123');
   });
 
   it('opens provider link with InAppBrowser when available', async () => {
@@ -155,22 +140,22 @@ describe('OrderContent', () => {
   });
 
   it('renders correct status text for each order state', () => {
-    renderOrder({ ...mockOrder, state: FIAT_ORDER_STATES.COMPLETED });
+    renderOrder({ ...mockOrder, status: RampsOrderStatus.Completed });
     expect(screen.getByText('Complete')).toBeOnTheScreen();
   });
 
   it('renders failed status', () => {
-    renderOrder({ ...mockOrder, state: FIAT_ORDER_STATES.FAILED });
+    renderOrder({ ...mockOrder, status: RampsOrderStatus.Failed });
     expect(screen.getByText('Failed')).toBeOnTheScreen();
   });
 
   it('renders cancelled status', () => {
-    renderOrder({ ...mockOrder, state: FIAT_ORDER_STATES.CANCELLED });
+    renderOrder({ ...mockOrder, status: RampsOrderStatus.Cancelled });
     expect(screen.getByText('Cancelled')).toBeOnTheScreen();
   });
 
   it('renders processing status for pending orders', () => {
-    renderOrder({ ...mockOrder, state: FIAT_ORDER_STATES.PENDING });
+    renderOrder({ ...mockOrder, status: RampsOrderStatus.Pending });
     expect(screen.getByText('Processing')).toBeOnTheScreen();
   });
 
@@ -182,12 +167,9 @@ describe('OrderContent', () => {
   });
 
   it('does not render info row when statusDescription is absent', () => {
-    const orderWithoutDescription: FiatOrder = {
+    const orderWithoutDescription: RampsOrder = {
       ...mockOrder,
-      data: {
-        ...mockRampsOrderData,
-        statusDescription: undefined,
-      } as RampsOrder,
+      statusDescription: undefined,
     };
     renderOrder(orderWithoutDescription);
     expect(
diff --git a/app/components/UI/Ramp/Views/OrderDetails/OrderContent.tsx b/app/components/UI/Ramp/Views/OrderDetails/OrderContent.tsx
index 2b8db8c337a2..d5c059b42130 100644
--- a/app/components/UI/Ramp/Views/OrderDetails/OrderContent.tsx
+++ b/app/components/UI/Ramp/Views/OrderDetails/OrderContent.tsx
@@ -3,7 +3,9 @@ import { StyleSheet, TouchableOpacity } from 'react-native';
 import InAppBrowser from 'react-native-inappbrowser-reborn';
 import Clipboard from '@react-native-clipboard/clipboard';
 import { useNavigation } from '@react-navigation/native';
-import type { RampsOrder } from '@metamask/ramps-controller';
+import { type RampsOrder, RampsOrderStatus } from '@metamask/ramps-controller';
+import { useAnalytics } from '../../../../hooks/useAnalytics/useAnalytics';
+import { MetaMetricsEvents } from '../../../../../core/Analytics';
 import { createProcessingInfoModalNavigationDetails } from '../Modals/ProcessingInfoModal/ProcessingInfoModal';
 import {
   Box,
@@ -23,11 +25,6 @@ import BadgeWrapper, {
 } from '../../../../../component-library/components/Badges/BadgeWrapper';
 import { AvatarSize } from '../../../../../component-library/components/Avatars/Avatar';
 import { strings } from '../../../../../../locales/i18n';
-import { FiatOrder, getProviderName } from '../../../../../reducers/fiatOrders';
-import {
-  FIAT_ORDER_STATES,
-  FIAT_ORDER_PROVIDERS,
-} from '../../../../../constants/on-ramp';
 import { toDateFormat } from '../../../../../util/date';
 import { renderFiat } from '../../../../../util/number';
 import { getNetworkImageSource } from '../../../../../util/networks';
@@ -37,46 +34,19 @@ import Button, {
   ButtonSize,
   ButtonWidthTypes,
 } from '../../../../../component-library/components/Buttons/Button';
-import { getOrderAmount } from '../../utils/getOrderAmount';
 import { hasDepositOrderField } from '../../Deposit/utils';
 import BankDetailRow from '../../Deposit/components/BankDetailRow/BankDetailRow';
 import Routes from '../../../../../constants/navigation/Routes';
+import { RampsOrderDetailsSelectorsIDs } from './OrderDetails.testIds';
 
-const styles = StyleSheet.create({
+const localStyles = StyleSheet.create({
   badgeWrapperCenter: {
     alignSelf: 'center',
   },
 });
 
-/**
- * Extracts provider-specific fields from order.data that aren't available
- * on the FiatOrder type itself.
- */
-function getProviderSpecificData(order: FiatOrder) {
-  const data = order.data;
-  if (!data || typeof data !== 'object') {
-    return {};
-  }
-
-  const asRampsOrder = data as Partial<RampsOrder>;
-
-  return {
-    providerOrderLink: asRampsOrder.providerOrderLink,
-    cryptoIconUrl: asRampsOrder.cryptoCurrency?.iconUrl,
-    fiatDecimals: asRampsOrder.fiatCurrency?.decimals ?? 2,
-    providerSupportUrl:
-      asRampsOrder.provider?.links?.find((link) =>
-        link.name.toLowerCase().includes('support'),
-      )?.url ?? asRampsOrder.providerOrderLink,
-    statusDescription: asRampsOrder.statusDescription,
-    paymentDetails: hasDepositOrderField(data, 'paymentDetails')
-      ? data.paymentDetails
-      : undefined,
-  };
-}
-
 interface OrderContentProps {
-  order: FiatOrder;
+  order: RampsOrder;
   showCloseButton?: boolean;
 }
 
@@ -85,100 +55,157 @@ const OrderContent: React.FC<OrderContentProps> = ({
   showCloseButton = false,
 }) => {
   const navigation = useNavigation();
-  const providerData = useMemo(() => getProviderSpecificData(order), [order]);
-
-  const shortOrderId = order.id
-    ? order.id.length > 8
-      ? `...${order.id.slice(-6)}`
-      : order.id
+  const { trackEvent, createEventBuilder } = useAnalytics();
+
+  const providerName = order.provider?.name ?? '';
+  const providerOrderLink = order.providerOrderLink;
+  const cryptoIconUrl = order.cryptoCurrency?.iconUrl;
+  const fiatDecimals = order.fiatCurrency?.decimals ?? 2;
+  const providerSupportUrl =
+    order.provider?.links?.find((link) =>
+      link.name.toLowerCase().includes('support'),
+    )?.url ?? providerOrderLink;
+
+  const paymentDetails = hasDepositOrderField(order, 'paymentDetails')
+    ? (
+        order as RampsOrder & {
+          paymentDetails: {
+            fiatCurrency: string;
+            paymentMethod: string;
+            fields: { name: string; id: string; value: string }[];
+          }[];
+        }
+      ).paymentDetails
+    : undefined;
+
+  const shortOrderId = order.providerOrderId
+    ? order.providerOrderId.length > 8
+      ? `...${order.providerOrderId.slice(-6)}`
+      : order.providerOrderId
     : '...';
 
   const handleCopyOrderId = useCallback(() => {
-    if (order.id) {
-      Clipboard.setString(order.id);
+    if (order.providerOrderId) {
+      Clipboard.setString(order.providerOrderId);
     }
-  }, [order.id]);
+  }, [order.providerOrderId]);
 
   const handleProviderLinkPress = useCallback(async () => {
-    const url = providerData.providerOrderLink;
-    if (!url) return;
+    if (!providerOrderLink) return;
+    let urlDomain: string | undefined;
+    try {
+      urlDomain = new URL(providerOrderLink).hostname;
+    } catch {
+      urlDomain = providerOrderLink;
+    }
+    trackEvent(
+      createEventBuilder(MetaMetricsEvents.RAMPS_EXTERNAL_LINK_CLICKED)
+        .addProperties({
+          location: 'Order Details',
+          external_link_description: 'View on Provider',
+          url_domain: urlDomain,
+          ramp_type: 'UNIFIED_BUY_2',
+        })
+        .build(),
+    );
     try {
       if (await InAppBrowser.isAvailable()) {
-        await InAppBrowser.open(url);
+        await InAppBrowser.open(providerOrderLink);
       } else {
         navigation.navigate('Webview', {
           screen: 'SimpleWebview',
-          params: { url },
+          params: { url: providerOrderLink },
         });
       }
     } catch (err) {
       Logger.error(err as Error, {
         message: 'RampsOrderContent: Failed to open provider link',
-        link: url,
+        link: providerOrderLink,
       });
     }
-  }, [providerData.providerOrderLink, navigation]);
+  }, [providerOrderLink, navigation, createEventBuilder, trackEvent]);
 
   const getStatusText = () => {
-    switch (order.state) {
-      case FIAT_ORDER_STATES.PENDING:
-      case FIAT_ORDER_STATES.CREATED:
+    switch (order.status) {
+      case RampsOrderStatus.Pending:
+      case RampsOrderStatus.Created:
+      case RampsOrderStatus.Precreated:
+      case RampsOrderStatus.Unknown:
         return strings('ramps_order_details.processing');
-      case FIAT_ORDER_STATES.COMPLETED:
+      case RampsOrderStatus.Completed:
         return strings('ramps_order_details.complete');
-      case FIAT_ORDER_STATES.FAILED:
+      case RampsOrderStatus.Failed:
         return strings('ramps_order_details.failed');
-      case FIAT_ORDER_STATES.CANCELLED:
+      case RampsOrderStatus.Cancelled:
         return strings('ramps_order_details.cancelled');
+      case RampsOrderStatus.IdExpired:
+        return strings('ramps_order_details.failed');
       default:
         return '...';
     }
   };
 
   const getStatusColor = () => {
-    switch (order.state) {
-      case FIAT_ORDER_STATES.PENDING:
-      case FIAT_ORDER_STATES.CREATED:
+    switch (order.status) {
+      case RampsOrderStatus.Pending:
+      case RampsOrderStatus.Created:
+      case RampsOrderStatus.Precreated:
+      case RampsOrderStatus.Unknown:
         return 'text-warning-default';
-      case FIAT_ORDER_STATES.COMPLETED:
+      case RampsOrderStatus.Completed:
         return 'text-success-default';
-      case FIAT_ORDER_STATES.FAILED:
-      case FIAT_ORDER_STATES.CANCELLED:
+      case RampsOrderStatus.Failed:
+      case RampsOrderStatus.Cancelled:
+      case RampsOrderStatus.IdExpired:
         return 'text-error-default';
       default:
         return 'text-default';
     }
   };
 
-  const isLoading = !order.amount;
+  const isLoading = !order.fiatAmount;
 
   const handleClose = useCallback(() => {
+    trackEvent(
+      createEventBuilder(MetaMetricsEvents.RAMPS_CLOSE_BUTTON_CLICKED)
+        .addProperties({
+          location: 'Order Details',
+          ramp_type: 'UNIFIED_BUY_2',
+        })
+        .build(),
+    );
     navigation.goBack();
-  }, [navigation]);
-
-  const providerName = getProviderName(order.provider, order.data);
+  }, [navigation, createEventBuilder, trackEvent]);
 
   const handleInfoPress = useCallback(() => {
+    trackEvent(
+      createEventBuilder(MetaMetricsEvents.RAMPS_INFO_TOOLTIP_CLICKED)
+        .addProperties({
+          location: 'Order Details',
+          ramp_type: 'UNIFIED_BUY_2',
+        })
+        .build(),
+    );
     navigation.navigate(
       ...createProcessingInfoModalNavigationDetails({
         providerName,
-        providerSupportUrl: providerData.providerSupportUrl,
-        statusDescription: providerData.statusDescription,
+        providerSupportUrl,
+        statusDescription: order.statusDescription,
       }),
     );
   }, [
     navigation,
     providerName,
-    providerData.providerSupportUrl,
-    providerData.statusDescription,
+    providerSupportUrl,
+    order.statusDescription,
+    createEventBuilder,
+    trackEvent,
   ]);
 
-  const fiatDecimals = providerData.fiatDecimals ?? 2;
-  const fiatDenomSymbol = order.currencySymbol || '';
+  const fiatDenomSymbol = order.fiatCurrency?.denomSymbol ?? '';
+  const fiatCurrencyCode = order.fiatCurrency?.symbol ?? '';
+  const cryptoSymbol = order.cryptoCurrency?.symbol ?? '';
 
-  // Normalize chainId to hex so getNetworkImageSource can find it.
-  // Some providers return plain decimal (e.g., '1'), others return CAIP-2 ('eip155:1') or hex ('0x1').
-  // getNetworkImageSource handles CAIP and hex but not plain decimal.
   const normalizeChainIdForBadge = (chainId: string): string => {
     if (!chainId || chainId.includes(':') || chainId.startsWith('0x')) {
       return chainId;
@@ -188,13 +215,12 @@ const OrderContent: React.FC<OrderContentProps> = ({
   };
 
   const normalizedNetworkChainId = normalizeChainIdForBadge(
-    order.network || '',
+    order.network?.chainId ?? '',
   );
   const networkImageSource = normalizedNetworkChainId
     ? getNetworkImageSource({ chainId: normalizedNetworkChainId })
     : null;
 
-  // Bank transfer details helpers
   const capitalizeWords = useCallback(
     (text: string): string =>
       text
@@ -211,34 +237,26 @@ const OrderContent: React.FC<OrderContentProps> = ({
 
   const getFieldValue = useCallback(
     (fieldName: string): string | null => {
-      if (
-        !providerData.paymentDetails ||
-        providerData.paymentDetails.length === 0
-      )
-        return null;
-
-      const field = providerData.paymentDetails[0].fields.find(
-        (f) => f.name === fieldName,
-      );
+      if (!paymentDetails || paymentDetails.length === 0) return null;
+
+      const field = paymentDetails[0].fields.find((f) => f.name === fieldName);
       if (!field?.value) return null;
 
       return capitalizeWords(field.value);
     },
-    [providerData.paymentDetails, capitalizeWords],
+    [paymentDetails, capitalizeWords],
   );
 
-  const hasBankDetails = Boolean(providerData.paymentDetails);
+  const hasBankDetails = Boolean(paymentDetails);
   const showManageBankTransfer =
-    hasBankDetails &&
-    order.state === FIAT_ORDER_STATES.CREATED &&
-    order.provider === FIAT_ORDER_PROVIDERS.RAMPS_V2;
+    hasBankDetails && order.status === RampsOrderStatus.Created;
 
   const handleManageBankTransfer = useCallback(() => {
     navigation.navigate(Routes.RAMP.BANK_DETAILS_STANDALONE, {
-      orderId: order.id,
+      orderId: order.providerOrderId,
       shouldUpdate: false,
     });
-  }, [navigation, order.id]);
+  }, [navigation, order.providerOrderId]);
 
   const bankDetailFields = useMemo(() => {
     if (!hasBankDetails) return null;
@@ -274,7 +292,7 @@ const OrderContent: React.FC<OrderContentProps> = ({
       <Box twClassName="items-center pt-8 pb-6">
         <BadgeWrapper
           badgePosition={BadgePosition.BottomRight}
-          style={styles.badgeWrapperCenter}
+          style={localStyles.badgeWrapperCenter}
           badgeElement={
             networkImageSource ? (
               <BadgeNetwork
@@ -285,22 +303,19 @@ const OrderContent: React.FC<OrderContentProps> = ({
           }
         >
           <AvatarToken
-            name={order.cryptocurrency}
-            imageSource={
-              providerData.cryptoIconUrl
-                ? { uri: providerData.cryptoIconUrl }
-                : undefined
-            }
+            name={cryptoSymbol}
+            imageSource={cryptoIconUrl ? { uri: cryptoIconUrl } : undefined}
             size={AvatarSize.Lg}
           />
         </BadgeWrapper>
 
         <Text
+          testID={RampsOrderDetailsSelectorsIDs.TOKEN_AMOUNT}
           variant={TextVariant.DisplayLg}
           fontWeight={FontWeight.Bold}
           twClassName="mt-6 text-center"
         >
-          {getOrderAmount(order)} {order.cryptocurrency}
+          {order.cryptoAmount} {cryptoSymbol}
         </Text>
       </Box>
 
@@ -328,7 +343,7 @@ const OrderContent: React.FC<OrderContentProps> = ({
               >
                 {getStatusText()}
               </Text>
-              {providerData.providerOrderLink && (
+              {providerOrderLink && (
                 <TouchableOpacity onPress={handleProviderLinkPress}>
                   <Box
                     flexDirection={BoxFlexDirection.Row}
@@ -430,7 +445,11 @@ const OrderContent: React.FC<OrderContentProps> = ({
         ) : (
           <Text variant={TextVariant.BodyMd} fontWeight={FontWeight.Medium}>
             {fiatDenomSymbol}
-            {renderFiat(Number(order.fee ?? 0), order.currency, fiatDecimals)}
+            {renderFiat(
+              Number(order.totalFeesFiat ?? 0),
+              fiatCurrencyCode,
+              fiatDecimals,
+            )}
           </Text>
         )}
       </Box>
@@ -453,8 +472,8 @@ const OrderContent: React.FC<OrderContentProps> = ({
           <Text variant={TextVariant.BodyMd} fontWeight={FontWeight.Medium}>
             {fiatDenomSymbol}
             {renderFiat(
-              Number(order.amount ?? 0),
-              order.currency,
+              Number(order.fiatAmount ?? 0),
+              fiatCurrencyCode,
               fiatDecimals,
             )}
           </Text>
@@ -534,14 +553,14 @@ const OrderContent: React.FC<OrderContentProps> = ({
       )}
 
       <Box twClassName="pt-4 pb-4 w-full">
-        {providerData.statusDescription && (
+        {order.statusDescription && (
           <TouchableOpacity onPress={handleInfoPress}>
             <Box
               flexDirection={BoxFlexDirection.Row}
               twClassName="items-center justify-center mb-4"
             >
               <Text variant={TextVariant.BodySm} twClassName="text-alternative">
-                {providerData.statusDescription}
+                {order.statusDescription}
               </Text>
               <Icon
                 name={IconName.Info}
@@ -554,6 +573,7 @@ const OrderContent: React.FC<OrderContentProps> = ({
 
         {showCloseButton && (
           <Button
+            testID={RampsOrderDetailsSelectorsIDs.CLOSE_BUTTON}
             variant={ButtonVariants.Primary}
             size={ButtonSize.Lg}
             width={ButtonWidthTypes.Full}
diff --git a/app/components/UI/Ramp/Views/OrderDetails/OrderDetails.test.tsx b/app/components/UI/Ramp/Views/OrderDetails/OrderDetails.test.tsx
index 8123b786b2b3..ba8af56a7ef7 100644
--- a/app/components/UI/Ramp/Views/OrderDetails/OrderDetails.test.tsx
+++ b/app/components/UI/Ramp/Views/OrderDetails/OrderDetails.test.tsx
@@ -128,7 +128,7 @@ describe('Ramps OrderDetails Component', () => {
   });
 
   afterEach(() => {
-    jest.resetAllMocks();
+    jest.clearAllMocks();
   });
 
   it('renders OrderDetails component', () => {
diff --git a/app/components/UI/Ramp/Views/OrderDetails/OrderDetails.testIds.ts b/app/components/UI/Ramp/Views/OrderDetails/OrderDetails.testIds.ts
new file mode 100644
index 000000000000..ba1694235525
--- /dev/null
+++ b/app/components/UI/Ramp/Views/OrderDetails/OrderDetails.testIds.ts
@@ -0,0 +1,6 @@
+export const RampsOrderDetailsSelectorsIDs = {
+  CONTAINER: 'ramps-order-details-container',
+  CLOSE_BUTTON: 'ramps-order-details-close-button',
+  TOKEN_AMOUNT: 'ramps-order-details-token-amount',
+  BACK_BUTTON: 'ramps-order-details-back-navbar-button',
+};
diff --git a/app/components/UI/Ramp/Views/OrderDetails/OrderDetails.tsx b/app/components/UI/Ramp/Views/OrderDetails/OrderDetails.tsx
index f80d44d82c6c..9340eaa0e063 100644
--- a/app/components/UI/Ramp/Views/OrderDetails/OrderDetails.tsx
+++ b/app/components/UI/Ramp/Views/OrderDetails/OrderDetails.tsx
@@ -1,6 +1,5 @@
-import React, { useCallback, useEffect, useState } from 'react';
+import React, { useCallback, useEffect, useRef, useState } from 'react';
 import { ActivityIndicator, RefreshControl } from 'react-native';
-import { useDispatch, useSelector } from 'react-redux';
 import { useNavigation } from '@react-navigation/native';
 import { ScrollView } from 'react-native-gesture-handler';
 import {
@@ -12,18 +11,13 @@ import {
   IconSize,
   FontWeight,
 } from '@metamask/design-system-react-native';
+import { RampsOrderStatus } from '@metamask/ramps-controller';
 import Button, {
   ButtonVariants,
   ButtonSize,
   ButtonWidthTypes,
 } from '../../../../../component-library/components/Buttons/Button';
-import useThunkDispatch from '../../../../hooks/useThunkDispatch';
 import ScreenLayout from '../../Aggregator/components/ScreenLayout';
-import {
-  FiatOrder,
-  getOrderById,
-  updateFiatOrder,
-} from '../../../../../reducers/fiatOrders';
 import { strings } from '../../../../../../locales/i18n';
 import { getRampsOrderDetailsNavbarOptions } from '../../../Navbar';
 import Routes from '../../../../../constants/navigation/Routes';
@@ -33,12 +27,11 @@ import {
 } from '../../../../../util/navigation/navUtils';
 import { useTheme } from '../../../../../util/theme';
 import Logger from '../../../../../util/Logger';
-import { RootState } from '../../../../../reducers';
-import { FIAT_ORDER_STATES } from '../../../../../constants/on-ramp';
-import useInterval from '../../../../hooks/useInterval';
-import AppConstants from '../../../../../core/AppConstants';
 import OrderContent from './OrderContent';
-import { processFiatOrder } from '../../index';
+import { useRampsOrders } from '../../hooks/useRampsOrders';
+import { useAnalytics } from '../../../../hooks/useAnalytics/useAnalytics';
+import { MetaMetricsEvents } from '../../../../../core/Analytics';
+import { RampsOrderDetailsSelectorsIDs } from './OrderDetails.testIds';
 
 interface RampsOrderDetailsParams {
   orderId: string;
@@ -50,24 +43,32 @@ export const createRampsOrderDetailsNavDetails =
     Routes.RAMP.RAMPS_ORDER_DETAILS,
   );
 
+const PENDING_STATUSES = new Set([
+  RampsOrderStatus.Pending,
+  RampsOrderStatus.Created,
+  RampsOrderStatus.Precreated,
+  RampsOrderStatus.Unknown,
+]);
+
+/**
+ * V2 order detail screen. Reads RampsOrder from controller state only.
+ * Legacy orders (DEPOSIT, RAMPS_V2 in Redux) are routed to the aggregator
+ * detail screen by OrdersList — they never reach this component.
+ */
 const OrderDetails = () => {
   const params = useParams<RampsOrderDetailsParams>();
-  const order = useSelector((state: RootState) =>
-    getOrderById(state, params.orderId),
-  );
-  const [isLoading, setIsLoading] = useState(
-    order?.state === FIAT_ORDER_STATES.PENDING ||
-      order?.state === FIAT_ORDER_STATES.CREATED,
-  );
+  const { getOrderById, refreshOrder } = useRampsOrders();
+  const order = getOrderById(params.orderId);
+  const isPending = order ? PENDING_STATUSES.has(order.status) : false;
+
+  const [isLoading, setIsLoading] = useState(isPending);
   const [error, setError] = useState<string | null>(null);
   const theme = useTheme();
   const { colors } = theme;
   const navigation = useNavigation();
-  const dispatch = useDispatch();
-  const dispatchThunk = useThunkDispatch();
+  const { trackEvent, createEventBuilder } = useAnalytics();
 
   const [isRefreshing, setIsRefreshing] = useState(false);
-  const [isRefreshingInterval, setIsRefreshingInterval] = useState(false);
 
   useEffect(() => {
     navigation.setOptions(
@@ -75,71 +76,74 @@ const OrderDetails = () => {
         navigation,
         { title: strings('ramps_order_details.title') },
         theme,
+        () => {
+          trackEvent(
+            createEventBuilder(MetaMetricsEvents.RAMPS_BACK_BUTTON_CLICKED)
+              .addProperties({
+                location: 'Order Details',
+                ramp_type: 'UNIFIED_BUY_2',
+              })
+              .build(),
+          );
+        },
       ),
     );
-  }, [theme, navigation]);
+  }, [theme, navigation, createEventBuilder, trackEvent]);
 
-  const dispatchUpdateFiatOrder = useCallback(
-    (updatedOrder: FiatOrder) => dispatch(updateFiatOrder(updatedOrder)),
-    [dispatch],
-  );
+  const hasTrackedScreenView = useRef(false);
+  useEffect(() => {
+    if (order && !hasTrackedScreenView.current) {
+      hasTrackedScreenView.current = true;
+      trackEvent(
+        createEventBuilder(MetaMetricsEvents.RAMPS_SCREEN_VIEWED)
+          .addProperties({
+            location: 'Order Details',
+            ramp_type: 'UNIFIED_BUY_2',
+          })
+          .build(),
+      );
+    }
+  }, [order, createEventBuilder, trackEvent]);
 
-  const handleOnRefresh = useCallback(
-    async ({ fromInterval }: { fromInterval?: boolean } = {}) => {
-      if (!order) return;
-      try {
-        setError(null);
-        if (fromInterval) {
-          setIsRefreshingInterval(true);
-        } else {
-          setIsRefreshing(true);
-        }
-        await processFiatOrder(order, dispatchUpdateFiatOrder, dispatchThunk, {
-          forced: true,
-        });
-      } catch (fetchError) {
-        Logger.error(fetchError as Error, {
-          message: 'FiatOrders::RampsOrderDetails error while processing order',
-          order,
-        });
-        setError(
-          fetchError instanceof Error && fetchError.message
-            ? fetchError.message
-            : strings('ramps_order_details.error_message'),
-        );
-      } finally {
-        if (fromInterval) {
-          setIsRefreshingInterval(false);
-        } else {
-          setIsLoading(false);
-          setIsRefreshing(false);
-        }
-      }
-    },
-    [dispatchThunk, dispatchUpdateFiatOrder, order],
-  );
+  const handleOnRefresh = useCallback(async () => {
+    if (!order) return;
+    try {
+      setError(null);
+      setIsRefreshing(true);
+      const providerCode = (order.provider?.id ?? '').replace(
+        '/providers/',
+        '',
+      );
+      await refreshOrder(
+        providerCode,
+        order.providerOrderId,
+        order.walletAddress,
+      );
+    } catch (fetchError) {
+      Logger.error(fetchError as Error, {
+        message: 'FiatOrders::RampsOrderDetails error while refreshing order',
+        orderId: order.providerOrderId,
+        provider: order.provider?.id,
+        status: order.status,
+      });
+      setError(
+        fetchError instanceof Error && fetchError.message
+          ? fetchError.message
+          : strings('ramps_order_details.error_message'),
+      );
+    } finally {
+      setIsLoading(false);
+      setIsRefreshing(false);
+    }
+  }, [order, refreshOrder]);
 
   useEffect(() => {
-    if (
-      order?.state === FIAT_ORDER_STATES.PENDING ||
-      order?.state === FIAT_ORDER_STATES.CREATED
-    ) {
+    if (isPending) {
       handleOnRefresh();
     }
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
 
-  useInterval(() => handleOnRefresh({ fromInterval: true }), {
-    delay:
-      !isLoading &&
-      !isRefreshingInterval &&
-      order &&
-      (order.state === FIAT_ORDER_STATES.PENDING ||
-        order.state === FIAT_ORDER_STATES.CREATED)
-        ? AppConstants.FIAT_ORDERS.POLLING_FREQUENCY
-        : null,
-  });
-
   if (!order) {
     return <ScreenLayout />;
   }
@@ -193,7 +197,7 @@ const OrderDetails = () => {
   }
 
   return (
-    <ScreenLayout>
+    <ScreenLayout testID={RampsOrderDetailsSelectorsIDs.CONTAINER}>
       <ScrollView
         refreshControl={
           <RefreshControl
diff --git a/app/components/UI/Ramp/Views/OrderDetails/__snapshots__/OrderContent.test.tsx.snap b/app/components/UI/Ramp/Views/OrderDetails/__snapshots__/OrderContent.test.tsx.snap
index 3fa7e0499201..0477586bb135 100644
--- a/app/components/UI/Ramp/Views/OrderDetails/__snapshots__/OrderContent.test.tsx.snap
+++ b/app/components/UI/Ramp/Views/OrderDetails/__snapshots__/OrderContent.test.tsx.snap
@@ -154,7 +154,7 @@ exports[`OrderContent renders completed state correctly 1`] = `
       style={
         [
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Bold",
             "fontSize": 40,
             "fontWeight": 700,
@@ -166,6 +166,7 @@ exports[`OrderContent renders completed state correctly 1`] = `
           undefined,
         ]
       }
+      testID="ramps-order-details-token-amount"
     >
       0.05
        
@@ -191,7 +192,7 @@ exports[`OrderContent renders completed state correctly 1`] = `
       style={
         [
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "fontWeight": 400,
@@ -305,7 +306,7 @@ exports[`OrderContent renders completed state correctly 1`] = `
       style={
         [
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "fontWeight": 400,
@@ -338,7 +339,7 @@ exports[`OrderContent renders completed state correctly 1`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Medium",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -358,7 +359,7 @@ exports[`OrderContent renders completed state correctly 1`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "height": 20,
                 "width": 20,
               },
@@ -388,7 +389,7 @@ exports[`OrderContent renders completed state correctly 1`] = `
       style={
         [
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "fontWeight": 400,
@@ -406,7 +407,7 @@ exports[`OrderContent renders completed state correctly 1`] = `
       style={
         [
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "fontWeight": 400,
@@ -439,7 +440,7 @@ exports[`OrderContent renders completed state correctly 1`] = `
       style={
         [
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "fontWeight": 400,
@@ -457,7 +458,7 @@ exports[`OrderContent renders completed state correctly 1`] = `
       style={
         [
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "fontWeight": 400,
@@ -468,6 +469,7 @@ exports[`OrderContent renders completed state correctly 1`] = `
         ]
       }
     >
+      $
       2.5 USD
     </Text>
   </View>
@@ -490,7 +492,7 @@ exports[`OrderContent renders completed state correctly 1`] = `
       style={
         [
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "fontWeight": 400,
@@ -508,7 +510,7 @@ exports[`OrderContent renders completed state correctly 1`] = `
       style={
         [
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "fontWeight": 400,
@@ -519,6 +521,7 @@ exports[`OrderContent renders completed state correctly 1`] = `
         ]
       }
     >
+      $
       100 USD
     </Text>
   </View>
@@ -557,7 +560,7 @@ exports[`OrderContent renders completed state correctly 1`] = `
           style={
             [
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 14,
                 "fontWeight": 400,
@@ -576,7 +579,7 @@ exports[`OrderContent renders completed state correctly 1`] = `
           style={
             [
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "height": 16,
                 "marginLeft": 4,
                 "width": 16,
@@ -745,7 +748,7 @@ exports[`OrderContent renders loading state when order has no amount 1`] = `
       style={
         [
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Bold",
             "fontSize": 40,
             "fontWeight": 700,
@@ -757,6 +760,7 @@ exports[`OrderContent renders loading state when order has no amount 1`] = `
           undefined,
         ]
       }
+      testID="ramps-order-details-token-amount"
     >
       0.05
        
@@ -782,7 +786,7 @@ exports[`OrderContent renders loading state when order has no amount 1`] = `
       style={
         [
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "fontWeight": 400,
@@ -810,7 +814,7 @@ exports[`OrderContent renders loading state when order has no amount 1`] = `
         style={
           [
             {
-              "backgroundColor": "#3c4d9d0f",
+              "backgroundColor": "#b4b4b528",
               "borderRadius": 4,
               "display": "flex",
               "height": 18,
@@ -841,7 +845,7 @@ exports[`OrderContent renders loading state when order has no amount 1`] = `
       style={
         [
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "fontWeight": 400,
@@ -858,7 +862,7 @@ exports[`OrderContent renders loading state when order has no amount 1`] = `
       style={
         [
           {
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderRadius": 4,
             "display": "flex",
             "height": 18,
@@ -888,7 +892,7 @@ exports[`OrderContent renders loading state when order has no amount 1`] = `
       style={
         [
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "fontWeight": 400,
@@ -905,7 +909,7 @@ exports[`OrderContent renders loading state when order has no amount 1`] = `
       style={
         [
           {
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderRadius": 4,
             "display": "flex",
             "height": 18,
@@ -935,7 +939,7 @@ exports[`OrderContent renders loading state when order has no amount 1`] = `
       style={
         [
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "fontWeight": 400,
@@ -952,7 +956,7 @@ exports[`OrderContent renders loading state when order has no amount 1`] = `
       style={
         [
           {
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderRadius": 4,
             "display": "flex",
             "height": 18,
@@ -982,7 +986,7 @@ exports[`OrderContent renders loading state when order has no amount 1`] = `
       style={
         [
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "fontWeight": 400,
@@ -999,7 +1003,7 @@ exports[`OrderContent renders loading state when order has no amount 1`] = `
       style={
         [
           {
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderRadius": 4,
             "display": "flex",
             "height": 18,
@@ -1045,7 +1049,7 @@ exports[`OrderContent renders loading state when order has no amount 1`] = `
           style={
             [
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 14,
                 "fontWeight": 400,
@@ -1064,7 +1068,7 @@ exports[`OrderContent renders loading state when order has no amount 1`] = `
           style={
             [
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "height": 16,
                 "marginLeft": 4,
                 "width": 16,
diff --git a/app/components/UI/Ramp/Views/Settings/RegionSelector/RegionSelector.test.tsx b/app/components/UI/Ramp/Views/Settings/RegionSelector/RegionSelector.test.tsx
index 59beea3cf971..ffe1511ddb2d 100644
--- a/app/components/UI/Ramp/Views/Settings/RegionSelector/RegionSelector.test.tsx
+++ b/app/components/UI/Ramp/Views/Settings/RegionSelector/RegionSelector.test.tsx
@@ -114,6 +114,12 @@ const mockUseRampsControllerInitialValues: ReturnType<
   paymentMethodsError: null,
   getQuotes: jest.fn(),
   getWidgetUrl: jest.fn(),
+  orders: [],
+  getOrderById: jest.fn(),
+  addOrder: jest.fn(),
+  removeOrder: jest.fn(),
+  refreshOrder: jest.fn(),
+  getOrderFromCallback: jest.fn(),
 };
 
 let mockUseRampsControllerValues = mockUseRampsControllerInitialValues;
diff --git a/app/components/UI/Ramp/Views/Settings/RegionSelector/RegionSelector.tsx b/app/components/UI/Ramp/Views/Settings/RegionSelector/RegionSelector.tsx
index b40157e4805c..437214318daf 100644
--- a/app/components/UI/Ramp/Views/Settings/RegionSelector/RegionSelector.tsx
+++ b/app/components/UI/Ramp/Views/Settings/RegionSelector/RegionSelector.tsx
@@ -93,7 +93,7 @@ interface HeaderBackButtonProps {
 function HeaderBackButton({ onPress, testID }: HeaderBackButtonProps) {
   return (
     <ButtonIcon
-      size={ButtonIconSizes.Lg}
+      size={ButtonIconSizes.Md}
       iconName={IconName.ArrowLeft}
       onPress={onPress}
       style={navigationOptionsStyles.headerLeft}
@@ -706,7 +706,7 @@ RegionSelector.navigationOptions = ({
 }) => ({
   headerLeft: () => (
     <ButtonIcon
-      size={ButtonIconSizes.Lg}
+      size={ButtonIconSizes.Md}
       iconName={IconName.ArrowLeft}
       onPress={() => navigation.goBack()}
       style={navigationOptionsStyles.headerLeft}
diff --git a/app/components/UI/Ramp/Views/Settings/RegionSelector/__snapshots__/RegionSelector.test.tsx.snap b/app/components/UI/Ramp/Views/Settings/RegionSelector/__snapshots__/RegionSelector.test.tsx.snap
index d42cc293838d..2abfdef31fde 100644
--- a/app/components/UI/Ramp/Views/Settings/RegionSelector/__snapshots__/RegionSelector.test.tsx.snap
+++ b/app/components/UI/Ramp/Views/Settings/RegionSelector/__snapshots__/RegionSelector.test.tsx.snap
@@ -338,7 +338,7 @@ exports[`RegionSelector clears search and scrolls to top when clear button is pr
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#686e7d",
+                              "color": "#66676a",
                               "fontFamily": "Geist-Regular",
                               "fontSize": 16,
                               "letterSpacing": 0,
@@ -383,8 +383,8 @@ exports[`RegionSelector clears search and scrolls to top when clear button is pr
                           style={
                             {
                               "alignItems": "center",
-                              "backgroundColor": "#3c4d9d0f",
-                              "borderColor": "#b7bbc866",
+                              "backgroundColor": "#b4b4b528",
+                              "borderColor": "#b4b4b566",
                               "borderRadius": 24,
                               "borderWidth": 1,
                               "flexDirection": "row",
@@ -404,7 +404,7 @@ exports[`RegionSelector clears search and scrolls to top when clear button is pr
                             testID="textfield-startacccessory"
                           >
                             <SvgMock
-                              color="#686e7d"
+                              color="#66676a"
                               fill="currentColor"
                               height={20}
                               name="Search"
@@ -433,18 +433,19 @@ exports[`RegionSelector clears search and scrolls to top when clear button is pr
                               onChangeText={[Function]}
                               onFocus={[Function]}
                               placeholder="Search by country"
-                              placeholderTextColor="#686e7d"
+                              placeholderTextColor="#66676a"
                               style={
                                 {
                                   "backgroundColor": "inherit",
                                   "borderColor": "transparent",
                                   "borderWidth": 1,
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "fontWeight": "400",
                                   "height": 46,
                                   "letterSpacing": 0,
+                                  "lineHeight": 0,
                                   "opacity": 1,
                                 }
                               }
@@ -649,9 +650,9 @@ exports[`RegionSelector clears search and scrolls to top when clear button is pr
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -671,9 +672,9 @@ exports[`RegionSelector clears search and scrolls to top when clear button is pr
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -752,9 +753,9 @@ exports[`RegionSelector clears search and scrolls to top when clear button is pr
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -774,9 +775,9 @@ exports[`RegionSelector clears search and scrolls to top when clear button is pr
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -805,7 +806,7 @@ exports[`RegionSelector clears search and scrolls to top when clear button is pr
                                     testID="listitemcolumn"
                                   >
                                     <SvgMock
-                                      color="#121314"
+                                      color="#131416"
                                       fill="currentColor"
                                       height={20}
                                       name="ArrowRight"
@@ -886,9 +887,9 @@ exports[`RegionSelector clears search and scrolls to top when clear button is pr
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -908,9 +909,9 @@ exports[`RegionSelector clears search and scrolls to top when clear button is pr
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -939,7 +940,7 @@ exports[`RegionSelector clears search and scrolls to top when clear button is pr
                                     testID="listitemcolumn"
                                   >
                                     <SvgMock
-                                      color="#121314"
+                                      color="#131416"
                                       fill="currentColor"
                                       height={20}
                                       name="ArrowRight"
@@ -1020,9 +1021,9 @@ exports[`RegionSelector clears search and scrolls to top when clear button is pr
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -1042,9 +1043,9 @@ exports[`RegionSelector clears search and scrolls to top when clear button is pr
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -1412,7 +1413,7 @@ exports[`RegionSelector clears search text when clear button is pressed 1`] = `
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#686e7d",
+                              "color": "#66676a",
                               "fontFamily": "Geist-Regular",
                               "fontSize": 16,
                               "letterSpacing": 0,
@@ -1457,8 +1458,8 @@ exports[`RegionSelector clears search text when clear button is pressed 1`] = `
                           style={
                             {
                               "alignItems": "center",
-                              "backgroundColor": "#3c4d9d0f",
-                              "borderColor": "#b7bbc866",
+                              "backgroundColor": "#b4b4b528",
+                              "borderColor": "#b4b4b566",
                               "borderRadius": 24,
                               "borderWidth": 1,
                               "flexDirection": "row",
@@ -1478,7 +1479,7 @@ exports[`RegionSelector clears search text when clear button is pressed 1`] = `
                             testID="textfield-startacccessory"
                           >
                             <SvgMock
-                              color="#686e7d"
+                              color="#66676a"
                               fill="currentColor"
                               height={20}
                               name="Search"
@@ -1507,18 +1508,19 @@ exports[`RegionSelector clears search text when clear button is pressed 1`] = `
                               onChangeText={[Function]}
                               onFocus={[Function]}
                               placeholder="Search by country"
-                              placeholderTextColor="#686e7d"
+                              placeholderTextColor="#66676a"
                               style={
                                 {
                                   "backgroundColor": "inherit",
                                   "borderColor": "transparent",
                                   "borderWidth": 1,
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "fontWeight": "400",
                                   "height": 46,
                                   "letterSpacing": 0,
+                                  "lineHeight": 0,
                                   "opacity": 1,
                                 }
                               }
@@ -1723,9 +1725,9 @@ exports[`RegionSelector clears search text when clear button is pressed 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -1745,9 +1747,9 @@ exports[`RegionSelector clears search text when clear button is pressed 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -1826,9 +1828,9 @@ exports[`RegionSelector clears search text when clear button is pressed 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -1848,9 +1850,9 @@ exports[`RegionSelector clears search text when clear button is pressed 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -1879,7 +1881,7 @@ exports[`RegionSelector clears search text when clear button is pressed 1`] = `
                                     testID="listitemcolumn"
                                   >
                                     <SvgMock
-                                      color="#121314"
+                                      color="#131416"
                                       fill="currentColor"
                                       height={20}
                                       name="ArrowRight"
@@ -1960,9 +1962,9 @@ exports[`RegionSelector clears search text when clear button is pressed 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -1982,9 +1984,9 @@ exports[`RegionSelector clears search text when clear button is pressed 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -2013,7 +2015,7 @@ exports[`RegionSelector clears search text when clear button is pressed 1`] = `
                                     testID="listitemcolumn"
                                   >
                                     <SvgMock
-                                      color="#121314"
+                                      color="#131416"
                                       fill="currentColor"
                                       height={20}
                                       name="ArrowRight"
@@ -2094,9 +2096,9 @@ exports[`RegionSelector clears search text when clear button is pressed 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -2116,9 +2118,9 @@ exports[`RegionSelector clears search text when clear button is pressed 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -2486,7 +2488,7 @@ exports[`RegionSelector displays empty state when search has no results 1`] = `
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#686e7d",
+                              "color": "#66676a",
                               "fontFamily": "Geist-Regular",
                               "fontSize": 16,
                               "letterSpacing": 0,
@@ -2531,8 +2533,8 @@ exports[`RegionSelector displays empty state when search has no results 1`] = `
                           style={
                             {
                               "alignItems": "center",
-                              "backgroundColor": "#3c4d9d0f",
-                              "borderColor": "#b7bbc866",
+                              "backgroundColor": "#b4b4b528",
+                              "borderColor": "#b4b4b566",
                               "borderRadius": 24,
                               "borderWidth": 1,
                               "flexDirection": "row",
@@ -2552,7 +2554,7 @@ exports[`RegionSelector displays empty state when search has no results 1`] = `
                             testID="textfield-startacccessory"
                           >
                             <SvgMock
-                              color="#686e7d"
+                              color="#66676a"
                               fill="currentColor"
                               height={20}
                               name="Search"
@@ -2581,13 +2583,13 @@ exports[`RegionSelector displays empty state when search has no results 1`] = `
                               onChangeText={[Function]}
                               onFocus={[Function]}
                               placeholder="Search by country"
-                              placeholderTextColor="#686e7d"
+                              placeholderTextColor="#66676a"
                               style={
                                 {
                                   "backgroundColor": "inherit",
                                   "borderColor": "transparent",
                                   "borderWidth": 1,
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "fontWeight": "400",
@@ -2628,7 +2630,7 @@ exports[`RegionSelector displays empty state when search has no results 1`] = `
                               testID="region-selector-clear-button"
                             >
                               <SvgMock
-                                color="#686e7d"
+                                color="#66676a"
                                 fill="currentColor"
                                 height={20}
                                 name="Close"
@@ -2692,9 +2694,9 @@ exports[`RegionSelector displays empty state when search has no results 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Medium",
-                                  "fontSize": 18,
+                                  "fontSize": 20,
                                   "letterSpacing": 0,
                                   "lineHeight": 24,
                                 }
@@ -3056,7 +3058,7 @@ exports[`RegionSelector displays grouped search results showing country and matc
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#686e7d",
+                              "color": "#66676a",
                               "fontFamily": "Geist-Regular",
                               "fontSize": 16,
                               "letterSpacing": 0,
@@ -3101,8 +3103,8 @@ exports[`RegionSelector displays grouped search results showing country and matc
                           style={
                             {
                               "alignItems": "center",
-                              "backgroundColor": "#3c4d9d0f",
-                              "borderColor": "#b7bbc866",
+                              "backgroundColor": "#b4b4b528",
+                              "borderColor": "#b4b4b566",
                               "borderRadius": 24,
                               "borderWidth": 1,
                               "flexDirection": "row",
@@ -3122,7 +3124,7 @@ exports[`RegionSelector displays grouped search results showing country and matc
                             testID="textfield-startacccessory"
                           >
                             <SvgMock
-                              color="#686e7d"
+                              color="#66676a"
                               fill="currentColor"
                               height={20}
                               name="Search"
@@ -3151,13 +3153,13 @@ exports[`RegionSelector displays grouped search results showing country and matc
                               onChangeText={[Function]}
                               onFocus={[Function]}
                               placeholder="Search by country"
-                              placeholderTextColor="#686e7d"
+                              placeholderTextColor="#66676a"
                               style={
                                 {
                                   "backgroundColor": "inherit",
                                   "borderColor": "transparent",
                                   "borderWidth": 1,
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "fontWeight": "400",
@@ -3198,7 +3200,7 @@ exports[`RegionSelector displays grouped search results showing country and matc
                               testID="region-selector-clear-button"
                             >
                               <SvgMock
-                                color="#686e7d"
+                                color="#66676a"
                                 fill="currentColor"
                                 height={20}
                                 name="Close"
@@ -3363,9 +3365,9 @@ exports[`RegionSelector displays grouped search results showing country and matc
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Medium",
-                                                "fontSize": 18,
+                                                "fontSize": 20,
                                                 "letterSpacing": 0,
                                                 "lineHeight": 24,
                                               }
@@ -3385,9 +3387,9 @@ exports[`RegionSelector displays grouped search results showing country and matc
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Medium",
-                                                "fontSize": 18,
+                                                "fontSize": 20,
                                                 "letterSpacing": 0,
                                                 "lineHeight": 24,
                                               }
@@ -3416,7 +3418,7 @@ exports[`RegionSelector displays grouped search results showing country and matc
                                       testID="listitemcolumn"
                                     >
                                       <SvgMock
-                                        color="#121314"
+                                        color="#131416"
                                         fill="currentColor"
                                         height={20}
                                         name="ArrowRight"
@@ -3496,9 +3498,9 @@ exports[`RegionSelector displays grouped search results showing country and matc
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Medium",
-                                                "fontSize": 18,
+                                                "fontSize": 20,
                                                 "letterSpacing": 0,
                                                 "lineHeight": 24,
                                               }
@@ -3867,7 +3869,7 @@ exports[`RegionSelector displays standalone countries in search results 1`] = `
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#686e7d",
+                              "color": "#66676a",
                               "fontFamily": "Geist-Regular",
                               "fontSize": 16,
                               "letterSpacing": 0,
@@ -3912,8 +3914,8 @@ exports[`RegionSelector displays standalone countries in search results 1`] = `
                           style={
                             {
                               "alignItems": "center",
-                              "backgroundColor": "#3c4d9d0f",
-                              "borderColor": "#b7bbc866",
+                              "backgroundColor": "#b4b4b528",
+                              "borderColor": "#b4b4b566",
                               "borderRadius": 24,
                               "borderWidth": 1,
                               "flexDirection": "row",
@@ -3933,7 +3935,7 @@ exports[`RegionSelector displays standalone countries in search results 1`] = `
                             testID="textfield-startacccessory"
                           >
                             <SvgMock
-                              color="#686e7d"
+                              color="#66676a"
                               fill="currentColor"
                               height={20}
                               name="Search"
@@ -3962,13 +3964,13 @@ exports[`RegionSelector displays standalone countries in search results 1`] = `
                               onChangeText={[Function]}
                               onFocus={[Function]}
                               placeholder="Search by country"
-                              placeholderTextColor="#686e7d"
+                              placeholderTextColor="#66676a"
                               style={
                                 {
                                   "backgroundColor": "inherit",
                                   "borderColor": "transparent",
                                   "borderWidth": 1,
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "fontWeight": "400",
@@ -4009,7 +4011,7 @@ exports[`RegionSelector displays standalone countries in search results 1`] = `
                               testID="region-selector-clear-button"
                             >
                               <SvgMock
-                                color="#686e7d"
+                                color="#66676a"
                                 fill="currentColor"
                                 height={20}
                                 name="Close"
@@ -4143,9 +4145,9 @@ exports[`RegionSelector displays standalone countries in search results 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -4165,9 +4167,9 @@ exports[`RegionSelector displays standalone countries in search results 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -4535,7 +4537,7 @@ exports[`RegionSelector displays standalone states in search results 1`] = `
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#686e7d",
+                              "color": "#66676a",
                               "fontFamily": "Geist-Regular",
                               "fontSize": 16,
                               "letterSpacing": 0,
@@ -4580,8 +4582,8 @@ exports[`RegionSelector displays standalone states in search results 1`] = `
                           style={
                             {
                               "alignItems": "center",
-                              "backgroundColor": "#3c4d9d0f",
-                              "borderColor": "#b7bbc866",
+                              "backgroundColor": "#b4b4b528",
+                              "borderColor": "#b4b4b566",
                               "borderRadius": 24,
                               "borderWidth": 1,
                               "flexDirection": "row",
@@ -4601,7 +4603,7 @@ exports[`RegionSelector displays standalone states in search results 1`] = `
                             testID="textfield-startacccessory"
                           >
                             <SvgMock
-                              color="#686e7d"
+                              color="#66676a"
                               fill="currentColor"
                               height={20}
                               name="Search"
@@ -4630,13 +4632,13 @@ exports[`RegionSelector displays standalone states in search results 1`] = `
                               onChangeText={[Function]}
                               onFocus={[Function]}
                               placeholder="Search by country"
-                              placeholderTextColor="#686e7d"
+                              placeholderTextColor="#66676a"
                               style={
                                 {
                                   "backgroundColor": "inherit",
                                   "borderColor": "transparent",
                                   "borderWidth": 1,
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "fontWeight": "400",
@@ -4677,7 +4679,7 @@ exports[`RegionSelector displays standalone states in search results 1`] = `
                               testID="region-selector-clear-button"
                             >
                               <SvgMock
-                                color="#686e7d"
+                                color="#66676a"
                                 fill="currentColor"
                                 height={20}
                                 name="Close"
@@ -4842,9 +4844,9 @@ exports[`RegionSelector displays standalone states in search results 1`] = `
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Medium",
-                                                "fontSize": 18,
+                                                "fontSize": 20,
                                                 "letterSpacing": 0,
                                                 "lineHeight": 24,
                                               }
@@ -4864,9 +4866,9 @@ exports[`RegionSelector displays standalone states in search results 1`] = `
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Medium",
-                                                "fontSize": 18,
+                                                "fontSize": 20,
                                                 "letterSpacing": 0,
                                                 "lineHeight": 24,
                                               }
@@ -4895,7 +4897,7 @@ exports[`RegionSelector displays standalone states in search results 1`] = `
                                       testID="listitemcolumn"
                                     >
                                       <SvgMock
-                                        color="#121314"
+                                        color="#131416"
                                         fill="currentColor"
                                         height={20}
                                         name="ArrowRight"
@@ -4975,9 +4977,9 @@ exports[`RegionSelector displays standalone states in search results 1`] = `
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Medium",
-                                                "fontSize": 18,
+                                                "fontSize": 20,
                                                 "letterSpacing": 0,
                                                 "lineHeight": 24,
                                               }
@@ -5346,7 +5348,7 @@ exports[`RegionSelector does not highlight country when regionCode does not matc
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#686e7d",
+                              "color": "#66676a",
                               "fontFamily": "Geist-Regular",
                               "fontSize": 16,
                               "letterSpacing": 0,
@@ -5391,8 +5393,8 @@ exports[`RegionSelector does not highlight country when regionCode does not matc
                           style={
                             {
                               "alignItems": "center",
-                              "backgroundColor": "#3c4d9d0f",
-                              "borderColor": "#b7bbc866",
+                              "backgroundColor": "#b4b4b528",
+                              "borderColor": "#b4b4b566",
                               "borderRadius": 24,
                               "borderWidth": 1,
                               "flexDirection": "row",
@@ -5412,7 +5414,7 @@ exports[`RegionSelector does not highlight country when regionCode does not matc
                             testID="textfield-startacccessory"
                           >
                             <SvgMock
-                              color="#686e7d"
+                              color="#66676a"
                               fill="currentColor"
                               height={20}
                               name="Search"
@@ -5441,18 +5443,19 @@ exports[`RegionSelector does not highlight country when regionCode does not matc
                               onChangeText={[Function]}
                               onFocus={[Function]}
                               placeholder="Search by country"
-                              placeholderTextColor="#686e7d"
+                              placeholderTextColor="#66676a"
                               style={
                                 {
                                   "backgroundColor": "inherit",
                                   "borderColor": "transparent",
                                   "borderWidth": 1,
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "fontWeight": "400",
                                   "height": 46,
                                   "letterSpacing": 0,
+                                  "lineHeight": 0,
                                   "opacity": 1,
                                 }
                               }
@@ -5677,9 +5680,9 @@ exports[`RegionSelector does not highlight country when regionCode does not matc
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -5699,9 +5702,9 @@ exports[`RegionSelector does not highlight country when regionCode does not matc
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -5780,9 +5783,9 @@ exports[`RegionSelector does not highlight country when regionCode does not matc
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -5802,9 +5805,9 @@ exports[`RegionSelector does not highlight country when regionCode does not matc
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -5833,7 +5836,7 @@ exports[`RegionSelector does not highlight country when regionCode does not matc
                                     testID="listitemcolumn"
                                   >
                                     <SvgMock
-                                      color="#121314"
+                                      color="#131416"
                                       fill="currentColor"
                                       height={20}
                                       name="ArrowRight"
@@ -5914,9 +5917,9 @@ exports[`RegionSelector does not highlight country when regionCode does not matc
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -5936,9 +5939,9 @@ exports[`RegionSelector does not highlight country when regionCode does not matc
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -5967,7 +5970,7 @@ exports[`RegionSelector does not highlight country when regionCode does not matc
                                     testID="listitemcolumn"
                                   >
                                     <SvgMock
-                                      color="#121314"
+                                      color="#131416"
                                       fill="currentColor"
                                       height={20}
                                       name="ArrowRight"
@@ -6048,9 +6051,9 @@ exports[`RegionSelector does not highlight country when regionCode does not matc
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -6070,9 +6073,9 @@ exports[`RegionSelector does not highlight country when regionCode does not matc
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -6469,8 +6472,8 @@ exports[`RegionSelector does not highlight state when country does not match 1`]
                           style={
                             {
                               "alignItems": "center",
-                              "backgroundColor": "#3c4d9d0f",
-                              "borderColor": "#b7bbc866",
+                              "backgroundColor": "#b4b4b528",
+                              "borderColor": "#b4b4b566",
                               "borderRadius": 24,
                               "borderWidth": 1,
                               "flexDirection": "row",
@@ -6490,7 +6493,7 @@ exports[`RegionSelector does not highlight state when country does not match 1`]
                             testID="textfield-startacccessory"
                           >
                             <SvgMock
-                              color="#686e7d"
+                              color="#66676a"
                               fill="currentColor"
                               height={20}
                               name="Search"
@@ -6519,18 +6522,19 @@ exports[`RegionSelector does not highlight state when country does not match 1`]
                               onChangeText={[Function]}
                               onFocus={[Function]}
                               placeholder="Search by state"
-                              placeholderTextColor="#686e7d"
+                              placeholderTextColor="#66676a"
                               style={
                                 {
                                   "backgroundColor": "inherit",
                                   "borderColor": "transparent",
                                   "borderWidth": 1,
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "fontWeight": "400",
                                   "height": 46,
                                   "letterSpacing": 0,
+                                  "lineHeight": 0,
                                   "opacity": 1,
                                 }
                               }
@@ -6683,9 +6687,9 @@ exports[`RegionSelector does not highlight state when country does not match 1`]
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -6763,9 +6767,9 @@ exports[`RegionSelector does not highlight state when country does not match 1`]
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -7162,8 +7166,8 @@ exports[`RegionSelector does not highlight state when state ID does not match 1`
                           style={
                             {
                               "alignItems": "center",
-                              "backgroundColor": "#3c4d9d0f",
-                              "borderColor": "#b7bbc866",
+                              "backgroundColor": "#b4b4b528",
+                              "borderColor": "#b4b4b566",
                               "borderRadius": 24,
                               "borderWidth": 1,
                               "flexDirection": "row",
@@ -7183,7 +7187,7 @@ exports[`RegionSelector does not highlight state when state ID does not match 1`
                             testID="textfield-startacccessory"
                           >
                             <SvgMock
-                              color="#686e7d"
+                              color="#66676a"
                               fill="currentColor"
                               height={20}
                               name="Search"
@@ -7212,18 +7216,19 @@ exports[`RegionSelector does not highlight state when state ID does not match 1`
                               onChangeText={[Function]}
                               onFocus={[Function]}
                               placeholder="Search by state"
-                              placeholderTextColor="#686e7d"
+                              placeholderTextColor="#66676a"
                               style={
                                 {
                                   "backgroundColor": "inherit",
                                   "borderColor": "transparent",
                                   "borderWidth": 1,
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "fontWeight": "400",
                                   "height": 46,
                                   "letterSpacing": 0,
+                                  "lineHeight": 0,
                                   "opacity": 1,
                                 }
                               }
@@ -7376,9 +7381,9 @@ exports[`RegionSelector does not highlight state when state ID does not match 1`
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -7456,9 +7461,9 @@ exports[`RegionSelector does not highlight state when state ID does not match 1`
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -7476,7 +7481,7 @@ exports[`RegionSelector does not highlight state when state ID does not match 1`
                                 accessible={true}
                                 style={
                                   {
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "bottom": 0,
                                     "flexDirection": "row",
                                     "left": 0,
@@ -7870,8 +7875,8 @@ exports[`RegionSelector does not highlight state when userRegion has no state 1`
                           style={
                             {
                               "alignItems": "center",
-                              "backgroundColor": "#3c4d9d0f",
-                              "borderColor": "#b7bbc866",
+                              "backgroundColor": "#b4b4b528",
+                              "borderColor": "#b4b4b566",
                               "borderRadius": 24,
                               "borderWidth": 1,
                               "flexDirection": "row",
@@ -7891,7 +7896,7 @@ exports[`RegionSelector does not highlight state when userRegion has no state 1`
                             testID="textfield-startacccessory"
                           >
                             <SvgMock
-                              color="#686e7d"
+                              color="#66676a"
                               fill="currentColor"
                               height={20}
                               name="Search"
@@ -7920,18 +7925,19 @@ exports[`RegionSelector does not highlight state when userRegion has no state 1`
                               onChangeText={[Function]}
                               onFocus={[Function]}
                               placeholder="Search by state"
-                              placeholderTextColor="#686e7d"
+                              placeholderTextColor="#66676a"
                               style={
                                 {
                                   "backgroundColor": "inherit",
                                   "borderColor": "transparent",
                                   "borderWidth": 1,
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "fontWeight": "400",
                                   "height": 46,
                                   "letterSpacing": 0,
+                                  "lineHeight": 0,
                                   "opacity": 1,
                                 }
                               }
@@ -8077,9 +8083,9 @@ exports[`RegionSelector does not highlight state when userRegion has no state 1`
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -8157,9 +8163,9 @@ exports[`RegionSelector does not highlight state when userRegion has no state 1`
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -8527,7 +8533,7 @@ exports[`RegionSelector falls back to userCountryCode when regionInTransit is nu
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#686e7d",
+                              "color": "#66676a",
                               "fontFamily": "Geist-Regular",
                               "fontSize": 16,
                               "letterSpacing": 0,
@@ -8572,8 +8578,8 @@ exports[`RegionSelector falls back to userCountryCode when regionInTransit is nu
                           style={
                             {
                               "alignItems": "center",
-                              "backgroundColor": "#3c4d9d0f",
-                              "borderColor": "#b7bbc866",
+                              "backgroundColor": "#b4b4b528",
+                              "borderColor": "#b4b4b566",
                               "borderRadius": 24,
                               "borderWidth": 1,
                               "flexDirection": "row",
@@ -8593,7 +8599,7 @@ exports[`RegionSelector falls back to userCountryCode when regionInTransit is nu
                             testID="textfield-startacccessory"
                           >
                             <SvgMock
-                              color="#686e7d"
+                              color="#66676a"
                               fill="currentColor"
                               height={20}
                               name="Search"
@@ -8622,13 +8628,13 @@ exports[`RegionSelector falls back to userCountryCode when regionInTransit is nu
                               onChangeText={[Function]}
                               onFocus={[Function]}
                               placeholder="Search by country"
-                              placeholderTextColor="#686e7d"
+                              placeholderTextColor="#66676a"
                               style={
                                 {
                                   "backgroundColor": "inherit",
                                   "borderColor": "transparent",
                                   "borderWidth": 1,
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "fontWeight": "400",
@@ -8669,7 +8675,7 @@ exports[`RegionSelector falls back to userCountryCode when regionInTransit is nu
                               testID="region-selector-clear-button"
                             >
                               <SvgMock
-                                color="#686e7d"
+                                color="#66676a"
                                 fill="currentColor"
                                 height={20}
                                 name="Close"
@@ -8853,9 +8859,9 @@ exports[`RegionSelector falls back to userCountryCode when regionInTransit is nu
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Medium",
-                                                "fontSize": 18,
+                                                "fontSize": 20,
                                                 "letterSpacing": 0,
                                                 "lineHeight": 24,
                                               }
@@ -8875,9 +8881,9 @@ exports[`RegionSelector falls back to userCountryCode when regionInTransit is nu
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Medium",
-                                                "fontSize": 18,
+                                                "fontSize": 20,
                                                 "letterSpacing": 0,
                                                 "lineHeight": 24,
                                               }
@@ -8889,7 +8895,7 @@ exports[`RegionSelector falls back to userCountryCode when regionInTransit is nu
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#b7bbc8",
+                                                "color": "#babbbe",
                                                 "fontFamily": "Geist-Regular",
                                                 "fontSize": 16,
                                                 "letterSpacing": 0,
@@ -8920,7 +8926,7 @@ exports[`RegionSelector falls back to userCountryCode when regionInTransit is nu
                                       testID="listitemcolumn"
                                     >
                                       <SvgMock
-                                        color="#121314"
+                                        color="#131416"
                                         fill="currentColor"
                                         height={20}
                                         name="ArrowRight"
@@ -8940,7 +8946,7 @@ exports[`RegionSelector falls back to userCountryCode when regionInTransit is nu
                                   accessible={true}
                                   style={
                                     {
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "bottom": 0,
                                       "flexDirection": "row",
                                       "left": 0,
@@ -9015,9 +9021,9 @@ exports[`RegionSelector falls back to userCountryCode when regionInTransit is nu
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Medium",
-                                                "fontSize": 18,
+                                                "fontSize": 20,
                                                 "letterSpacing": 0,
                                                 "lineHeight": 24,
                                               }
@@ -9035,7 +9041,7 @@ exports[`RegionSelector falls back to userCountryCode when regionInTransit is nu
                                   accessible={true}
                                   style={
                                     {
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "bottom": 0,
                                       "flexDirection": "row",
                                       "left": 0,
@@ -9401,7 +9407,7 @@ exports[`RegionSelector filters regions when search text is entered 1`] = `
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#686e7d",
+                              "color": "#66676a",
                               "fontFamily": "Geist-Regular",
                               "fontSize": 16,
                               "letterSpacing": 0,
@@ -9446,8 +9452,8 @@ exports[`RegionSelector filters regions when search text is entered 1`] = `
                           style={
                             {
                               "alignItems": "center",
-                              "backgroundColor": "#3c4d9d0f",
-                              "borderColor": "#b7bbc866",
+                              "backgroundColor": "#b4b4b528",
+                              "borderColor": "#b4b4b566",
                               "borderRadius": 24,
                               "borderWidth": 1,
                               "flexDirection": "row",
@@ -9467,7 +9473,7 @@ exports[`RegionSelector filters regions when search text is entered 1`] = `
                             testID="textfield-startacccessory"
                           >
                             <SvgMock
-                              color="#686e7d"
+                              color="#66676a"
                               fill="currentColor"
                               height={20}
                               name="Search"
@@ -9496,13 +9502,13 @@ exports[`RegionSelector filters regions when search text is entered 1`] = `
                               onChangeText={[Function]}
                               onFocus={[Function]}
                               placeholder="Search by country"
-                              placeholderTextColor="#686e7d"
+                              placeholderTextColor="#66676a"
                               style={
                                 {
                                   "backgroundColor": "inherit",
                                   "borderColor": "transparent",
                                   "borderWidth": 1,
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "fontWeight": "400",
@@ -9543,7 +9549,7 @@ exports[`RegionSelector filters regions when search text is entered 1`] = `
                               testID="region-selector-clear-button"
                             >
                               <SvgMock
-                                color="#686e7d"
+                                color="#66676a"
                                 fill="currentColor"
                                 height={20}
                                 name="Close"
@@ -9699,9 +9705,9 @@ exports[`RegionSelector filters regions when search text is entered 1`] = `
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Medium",
-                                                "fontSize": 18,
+                                                "fontSize": 20,
                                                 "letterSpacing": 0,
                                                 "lineHeight": 24,
                                               }
@@ -9721,9 +9727,9 @@ exports[`RegionSelector filters regions when search text is entered 1`] = `
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Medium",
-                                                "fontSize": 18,
+                                                "fontSize": 20,
                                                 "letterSpacing": 0,
                                                 "lineHeight": 24,
                                               }
@@ -9752,7 +9758,7 @@ exports[`RegionSelector filters regions when search text is entered 1`] = `
                                       testID="listitemcolumn"
                                     >
                                       <SvgMock
-                                        color="#121314"
+                                        color="#131416"
                                         fill="currentColor"
                                         height={20}
                                         name="ArrowRight"
@@ -10123,7 +10129,7 @@ exports[`RegionSelector highlights country when regionCode exactly matches count
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#686e7d",
+                              "color": "#66676a",
                               "fontFamily": "Geist-Regular",
                               "fontSize": 16,
                               "letterSpacing": 0,
@@ -10168,8 +10174,8 @@ exports[`RegionSelector highlights country when regionCode exactly matches count
                           style={
                             {
                               "alignItems": "center",
-                              "backgroundColor": "#3c4d9d0f",
-                              "borderColor": "#b7bbc866",
+                              "backgroundColor": "#b4b4b528",
+                              "borderColor": "#b4b4b566",
                               "borderRadius": 24,
                               "borderWidth": 1,
                               "flexDirection": "row",
@@ -10189,7 +10195,7 @@ exports[`RegionSelector highlights country when regionCode exactly matches count
                             testID="textfield-startacccessory"
                           >
                             <SvgMock
-                              color="#686e7d"
+                              color="#66676a"
                               fill="currentColor"
                               height={20}
                               name="Search"
@@ -10218,18 +10224,19 @@ exports[`RegionSelector highlights country when regionCode exactly matches count
                               onChangeText={[Function]}
                               onFocus={[Function]}
                               placeholder="Search by country"
-                              placeholderTextColor="#686e7d"
+                              placeholderTextColor="#66676a"
                               style={
                                 {
                                   "backgroundColor": "inherit",
                                   "borderColor": "transparent",
                                   "borderWidth": 1,
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "fontWeight": "400",
                                   "height": 46,
                                   "letterSpacing": 0,
+                                  "lineHeight": 0,
                                   "opacity": 1,
                                 }
                               }
@@ -10454,9 +10461,9 @@ exports[`RegionSelector highlights country when regionCode exactly matches count
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -10476,9 +10483,9 @@ exports[`RegionSelector highlights country when regionCode exactly matches count
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -10496,7 +10503,7 @@ exports[`RegionSelector highlights country when regionCode exactly matches count
                                 accessible={true}
                                 style={
                                   {
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "bottom": 0,
                                     "flexDirection": "row",
                                     "left": 0,
@@ -10572,9 +10579,9 @@ exports[`RegionSelector highlights country when regionCode exactly matches count
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -10594,9 +10601,9 @@ exports[`RegionSelector highlights country when regionCode exactly matches count
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -10625,7 +10632,7 @@ exports[`RegionSelector highlights country when regionCode exactly matches count
                                     testID="listitemcolumn"
                                   >
                                     <SvgMock
-                                      color="#121314"
+                                      color="#131416"
                                       fill="currentColor"
                                       height={20}
                                       name="ArrowRight"
@@ -10706,9 +10713,9 @@ exports[`RegionSelector highlights country when regionCode exactly matches count
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -10728,9 +10735,9 @@ exports[`RegionSelector highlights country when regionCode exactly matches count
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -10759,7 +10766,7 @@ exports[`RegionSelector highlights country when regionCode exactly matches count
                                     testID="listitemcolumn"
                                   >
                                     <SvgMock
-                                      color="#121314"
+                                      color="#131416"
                                       fill="currentColor"
                                       height={20}
                                       name="ArrowRight"
@@ -10840,9 +10847,9 @@ exports[`RegionSelector highlights country when regionCode exactly matches count
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -10862,9 +10869,9 @@ exports[`RegionSelector highlights country when regionCode exactly matches count
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -11232,7 +11239,7 @@ exports[`RegionSelector highlights country when regionCode starts with country c
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#686e7d",
+                              "color": "#66676a",
                               "fontFamily": "Geist-Regular",
                               "fontSize": 16,
                               "letterSpacing": 0,
@@ -11277,8 +11284,8 @@ exports[`RegionSelector highlights country when regionCode starts with country c
                           style={
                             {
                               "alignItems": "center",
-                              "backgroundColor": "#3c4d9d0f",
-                              "borderColor": "#b7bbc866",
+                              "backgroundColor": "#b4b4b528",
+                              "borderColor": "#b4b4b566",
                               "borderRadius": 24,
                               "borderWidth": 1,
                               "flexDirection": "row",
@@ -11298,7 +11305,7 @@ exports[`RegionSelector highlights country when regionCode starts with country c
                             testID="textfield-startacccessory"
                           >
                             <SvgMock
-                              color="#686e7d"
+                              color="#66676a"
                               fill="currentColor"
                               height={20}
                               name="Search"
@@ -11327,18 +11334,19 @@ exports[`RegionSelector highlights country when regionCode starts with country c
                               onChangeText={[Function]}
                               onFocus={[Function]}
                               placeholder="Search by country"
-                              placeholderTextColor="#686e7d"
+                              placeholderTextColor="#66676a"
                               style={
                                 {
                                   "backgroundColor": "inherit",
                                   "borderColor": "transparent",
                                   "borderWidth": 1,
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "fontWeight": "400",
                                   "height": 46,
                                   "letterSpacing": 0,
+                                  "lineHeight": 0,
                                   "opacity": 1,
                                 }
                               }
@@ -11570,9 +11578,9 @@ exports[`RegionSelector highlights country when regionCode starts with country c
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -11592,9 +11600,9 @@ exports[`RegionSelector highlights country when regionCode starts with country c
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -11673,9 +11681,9 @@ exports[`RegionSelector highlights country when regionCode starts with country c
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -11695,9 +11703,9 @@ exports[`RegionSelector highlights country when regionCode starts with country c
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -11709,7 +11717,7 @@ exports[`RegionSelector highlights country when regionCode starts with country c
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#b7bbc8",
+                                              "color": "#babbbe",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -11740,7 +11748,7 @@ exports[`RegionSelector highlights country when regionCode starts with country c
                                     testID="listitemcolumn"
                                   >
                                     <SvgMock
-                                      color="#121314"
+                                      color="#131416"
                                       fill="currentColor"
                                       height={20}
                                       name="ArrowRight"
@@ -11760,7 +11768,7 @@ exports[`RegionSelector highlights country when regionCode starts with country c
                                 accessible={true}
                                 style={
                                   {
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "bottom": 0,
                                     "flexDirection": "row",
                                     "left": 0,
@@ -11836,9 +11844,9 @@ exports[`RegionSelector highlights country when regionCode starts with country c
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -11858,9 +11866,9 @@ exports[`RegionSelector highlights country when regionCode starts with country c
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -11889,7 +11897,7 @@ exports[`RegionSelector highlights country when regionCode starts with country c
                                     testID="listitemcolumn"
                                   >
                                     <SvgMock
-                                      color="#121314"
+                                      color="#131416"
                                       fill="currentColor"
                                       height={20}
                                       name="ArrowRight"
@@ -11970,9 +11978,9 @@ exports[`RegionSelector highlights country when regionCode starts with country c
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -11992,9 +12000,9 @@ exports[`RegionSelector highlights country when regionCode starts with country c
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -12362,7 +12370,7 @@ exports[`RegionSelector highlights state in grouped search results when parent c
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#686e7d",
+                              "color": "#66676a",
                               "fontFamily": "Geist-Regular",
                               "fontSize": 16,
                               "letterSpacing": 0,
@@ -12407,8 +12415,8 @@ exports[`RegionSelector highlights state in grouped search results when parent c
                           style={
                             {
                               "alignItems": "center",
-                              "backgroundColor": "#3c4d9d0f",
-                              "borderColor": "#b7bbc866",
+                              "backgroundColor": "#b4b4b528",
+                              "borderColor": "#b4b4b566",
                               "borderRadius": 24,
                               "borderWidth": 1,
                               "flexDirection": "row",
@@ -12428,7 +12436,7 @@ exports[`RegionSelector highlights state in grouped search results when parent c
                             testID="textfield-startacccessory"
                           >
                             <SvgMock
-                              color="#686e7d"
+                              color="#66676a"
                               fill="currentColor"
                               height={20}
                               name="Search"
@@ -12457,13 +12465,13 @@ exports[`RegionSelector highlights state in grouped search results when parent c
                               onChangeText={[Function]}
                               onFocus={[Function]}
                               placeholder="Search by country"
-                              placeholderTextColor="#686e7d"
+                              placeholderTextColor="#66676a"
                               style={
                                 {
                                   "backgroundColor": "inherit",
                                   "borderColor": "transparent",
                                   "borderWidth": 1,
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "fontWeight": "400",
@@ -12504,7 +12512,7 @@ exports[`RegionSelector highlights state in grouped search results when parent c
                               testID="region-selector-clear-button"
                             >
                               <SvgMock
-                                color="#686e7d"
+                                color="#66676a"
                                 fill="currentColor"
                                 height={20}
                                 name="Close"
@@ -12696,9 +12704,9 @@ exports[`RegionSelector highlights state in grouped search results when parent c
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Medium",
-                                                "fontSize": 18,
+                                                "fontSize": 20,
                                                 "letterSpacing": 0,
                                                 "lineHeight": 24,
                                               }
@@ -12718,9 +12726,9 @@ exports[`RegionSelector highlights state in grouped search results when parent c
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Medium",
-                                                "fontSize": 18,
+                                                "fontSize": 20,
                                                 "letterSpacing": 0,
                                                 "lineHeight": 24,
                                               }
@@ -12732,7 +12740,7 @@ exports[`RegionSelector highlights state in grouped search results when parent c
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#b7bbc8",
+                                                "color": "#babbbe",
                                                 "fontFamily": "Geist-Regular",
                                                 "fontSize": 16,
                                                 "letterSpacing": 0,
@@ -12763,7 +12771,7 @@ exports[`RegionSelector highlights state in grouped search results when parent c
                                       testID="listitemcolumn"
                                     >
                                       <SvgMock
-                                        color="#121314"
+                                        color="#131416"
                                         fill="currentColor"
                                         height={20}
                                         name="ArrowRight"
@@ -12783,7 +12791,7 @@ exports[`RegionSelector highlights state in grouped search results when parent c
                                   accessible={true}
                                   style={
                                     {
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "bottom": 0,
                                       "flexDirection": "row",
                                       "left": 0,
@@ -12858,9 +12866,9 @@ exports[`RegionSelector highlights state in grouped search results when parent c
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Medium",
-                                                "fontSize": 18,
+                                                "fontSize": 20,
                                                 "letterSpacing": 0,
                                                 "lineHeight": 24,
                                               }
@@ -12878,7 +12886,7 @@ exports[`RegionSelector highlights state in grouped search results when parent c
                                   accessible={true}
                                   style={
                                     {
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "bottom": 0,
                                       "flexDirection": "row",
                                       "left": 0,
@@ -13273,8 +13281,8 @@ exports[`RegionSelector highlights state when selected in state view 1`] = `
                           style={
                             {
                               "alignItems": "center",
-                              "backgroundColor": "#3c4d9d0f",
-                              "borderColor": "#b7bbc866",
+                              "backgroundColor": "#b4b4b528",
+                              "borderColor": "#b4b4b566",
                               "borderRadius": 24,
                               "borderWidth": 1,
                               "flexDirection": "row",
@@ -13294,7 +13302,7 @@ exports[`RegionSelector highlights state when selected in state view 1`] = `
                             testID="textfield-startacccessory"
                           >
                             <SvgMock
-                              color="#686e7d"
+                              color="#66676a"
                               fill="currentColor"
                               height={20}
                               name="Search"
@@ -13323,18 +13331,19 @@ exports[`RegionSelector highlights state when selected in state view 1`] = `
                               onChangeText={[Function]}
                               onFocus={[Function]}
                               placeholder="Search by state"
-                              placeholderTextColor="#686e7d"
+                              placeholderTextColor="#66676a"
                               style={
                                 {
                                   "backgroundColor": "inherit",
                                   "borderColor": "transparent",
                                   "borderWidth": 1,
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "fontWeight": "400",
                                   "height": 46,
                                   "letterSpacing": 0,
+                                  "lineHeight": 0,
                                   "opacity": 1,
                                 }
                               }
@@ -13487,9 +13496,9 @@ exports[`RegionSelector highlights state when selected in state view 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -13507,7 +13516,7 @@ exports[`RegionSelector highlights state when selected in state view 1`] = `
                                 accessible={true}
                                 style={
                                   {
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "bottom": 0,
                                     "flexDirection": "row",
                                     "left": 0,
@@ -13582,9 +13591,9 @@ exports[`RegionSelector highlights state when selected in state view 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -13952,7 +13961,7 @@ exports[`RegionSelector limits search results 1`] = `
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#686e7d",
+                              "color": "#66676a",
                               "fontFamily": "Geist-Regular",
                               "fontSize": 16,
                               "letterSpacing": 0,
@@ -13997,8 +14006,8 @@ exports[`RegionSelector limits search results 1`] = `
                           style={
                             {
                               "alignItems": "center",
-                              "backgroundColor": "#3c4d9d0f",
-                              "borderColor": "#b7bbc866",
+                              "backgroundColor": "#b4b4b528",
+                              "borderColor": "#b4b4b566",
                               "borderRadius": 24,
                               "borderWidth": 1,
                               "flexDirection": "row",
@@ -14018,7 +14027,7 @@ exports[`RegionSelector limits search results 1`] = `
                             testID="textfield-startacccessory"
                           >
                             <SvgMock
-                              color="#686e7d"
+                              color="#66676a"
                               fill="currentColor"
                               height={20}
                               name="Search"
@@ -14047,13 +14056,13 @@ exports[`RegionSelector limits search results 1`] = `
                               onChangeText={[Function]}
                               onFocus={[Function]}
                               placeholder="Search by country"
-                              placeholderTextColor="#686e7d"
+                              placeholderTextColor="#66676a"
                               style={
                                 {
                                   "backgroundColor": "inherit",
                                   "borderColor": "transparent",
                                   "borderWidth": 1,
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "fontWeight": "400",
@@ -14094,7 +14103,7 @@ exports[`RegionSelector limits search results 1`] = `
                               testID="region-selector-clear-button"
                             >
                               <SvgMock
-                                color="#686e7d"
+                                color="#66676a"
                                 fill="currentColor"
                                 height={20}
                                 name="Close"
@@ -14551,9 +14560,9 @@ exports[`RegionSelector limits search results 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -14573,9 +14582,9 @@ exports[`RegionSelector limits search results 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -14654,9 +14663,9 @@ exports[`RegionSelector limits search results 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -14676,9 +14685,9 @@ exports[`RegionSelector limits search results 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -14757,9 +14766,9 @@ exports[`RegionSelector limits search results 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -14779,9 +14788,9 @@ exports[`RegionSelector limits search results 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -14860,9 +14869,9 @@ exports[`RegionSelector limits search results 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -14882,9 +14891,9 @@ exports[`RegionSelector limits search results 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -14963,9 +14972,9 @@ exports[`RegionSelector limits search results 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -14985,9 +14994,9 @@ exports[`RegionSelector limits search results 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -15066,9 +15075,9 @@ exports[`RegionSelector limits search results 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -15088,9 +15097,9 @@ exports[`RegionSelector limits search results 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -15169,9 +15178,9 @@ exports[`RegionSelector limits search results 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -15191,9 +15200,9 @@ exports[`RegionSelector limits search results 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -15272,9 +15281,9 @@ exports[`RegionSelector limits search results 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -15294,9 +15303,9 @@ exports[`RegionSelector limits search results 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -15375,9 +15384,9 @@ exports[`RegionSelector limits search results 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -15397,9 +15406,9 @@ exports[`RegionSelector limits search results 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -15478,9 +15487,9 @@ exports[`RegionSelector limits search results 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -15500,9 +15509,9 @@ exports[`RegionSelector limits search results 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -15906,8 +15915,8 @@ exports[`RegionSelector navigates back to countries view when back button is pre
                           style={
                             {
                               "alignItems": "center",
-                              "backgroundColor": "#3c4d9d0f",
-                              "borderColor": "#b7bbc866",
+                              "backgroundColor": "#b4b4b528",
+                              "borderColor": "#b4b4b566",
                               "borderRadius": 24,
                               "borderWidth": 1,
                               "flexDirection": "row",
@@ -15927,7 +15936,7 @@ exports[`RegionSelector navigates back to countries view when back button is pre
                             testID="textfield-startacccessory"
                           >
                             <SvgMock
-                              color="#686e7d"
+                              color="#66676a"
                               fill="currentColor"
                               height={20}
                               name="Search"
@@ -15956,18 +15965,19 @@ exports[`RegionSelector navigates back to countries view when back button is pre
                               onChangeText={[Function]}
                               onFocus={[Function]}
                               placeholder="Search by state"
-                              placeholderTextColor="#686e7d"
+                              placeholderTextColor="#66676a"
                               style={
                                 {
                                   "backgroundColor": "inherit",
                                   "borderColor": "transparent",
                                   "borderWidth": 1,
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "fontWeight": "400",
                                   "height": 46,
                                   "letterSpacing": 0,
+                                  "lineHeight": 0,
                                   "opacity": 1,
                                 }
                               }
@@ -16093,9 +16103,9 @@ exports[`RegionSelector navigates back to countries view when back button is pre
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -16173,9 +16183,9 @@ exports[`RegionSelector navigates back to countries view when back button is pre
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -16572,8 +16582,8 @@ exports[`RegionSelector navigates to states view when country with states is sel
                           style={
                             {
                               "alignItems": "center",
-                              "backgroundColor": "#3c4d9d0f",
-                              "borderColor": "#b7bbc866",
+                              "backgroundColor": "#b4b4b528",
+                              "borderColor": "#b4b4b566",
                               "borderRadius": 24,
                               "borderWidth": 1,
                               "flexDirection": "row",
@@ -16593,7 +16603,7 @@ exports[`RegionSelector navigates to states view when country with states is sel
                             testID="textfield-startacccessory"
                           >
                             <SvgMock
-                              color="#686e7d"
+                              color="#66676a"
                               fill="currentColor"
                               height={20}
                               name="Search"
@@ -16622,18 +16632,19 @@ exports[`RegionSelector navigates to states view when country with states is sel
                               onChangeText={[Function]}
                               onFocus={[Function]}
                               placeholder="Search by state"
-                              placeholderTextColor="#686e7d"
+                              placeholderTextColor="#66676a"
                               style={
                                 {
                                   "backgroundColor": "inherit",
                                   "borderColor": "transparent",
                                   "borderWidth": 1,
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "fontWeight": "400",
                                   "height": 46,
                                   "letterSpacing": 0,
+                                  "lineHeight": 0,
                                   "opacity": 1,
                                 }
                               }
@@ -16759,9 +16770,9 @@ exports[`RegionSelector navigates to states view when country with states is sel
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -16839,9 +16850,9 @@ exports[`RegionSelector navigates to states view when country with states is sel
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -17209,7 +17220,7 @@ exports[`RegionSelector renders countries list 1`] = `
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#686e7d",
+                              "color": "#66676a",
                               "fontFamily": "Geist-Regular",
                               "fontSize": 16,
                               "letterSpacing": 0,
@@ -17254,8 +17265,8 @@ exports[`RegionSelector renders countries list 1`] = `
                           style={
                             {
                               "alignItems": "center",
-                              "backgroundColor": "#3c4d9d0f",
-                              "borderColor": "#b7bbc866",
+                              "backgroundColor": "#b4b4b528",
+                              "borderColor": "#b4b4b566",
                               "borderRadius": 24,
                               "borderWidth": 1,
                               "flexDirection": "row",
@@ -17275,7 +17286,7 @@ exports[`RegionSelector renders countries list 1`] = `
                             testID="textfield-startacccessory"
                           >
                             <SvgMock
-                              color="#686e7d"
+                              color="#66676a"
                               fill="currentColor"
                               height={20}
                               name="Search"
@@ -17304,18 +17315,19 @@ exports[`RegionSelector renders countries list 1`] = `
                               onChangeText={[Function]}
                               onFocus={[Function]}
                               placeholder="Search by country"
-                              placeholderTextColor="#686e7d"
+                              placeholderTextColor="#66676a"
                               style={
                                 {
                                   "backgroundColor": "inherit",
                                   "borderColor": "transparent",
                                   "borderWidth": 1,
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "fontWeight": "400",
                                   "height": 46,
                                   "letterSpacing": 0,
+                                  "lineHeight": 0,
                                   "opacity": 1,
                                 }
                               }
@@ -17520,9 +17532,9 @@ exports[`RegionSelector renders countries list 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -17542,9 +17554,9 @@ exports[`RegionSelector renders countries list 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -17623,9 +17635,9 @@ exports[`RegionSelector renders countries list 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -17645,9 +17657,9 @@ exports[`RegionSelector renders countries list 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -17676,7 +17688,7 @@ exports[`RegionSelector renders countries list 1`] = `
                                     testID="listitemcolumn"
                                   >
                                     <SvgMock
-                                      color="#121314"
+                                      color="#131416"
                                       fill="currentColor"
                                       height={20}
                                       name="ArrowRight"
@@ -17757,9 +17769,9 @@ exports[`RegionSelector renders countries list 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -17779,9 +17791,9 @@ exports[`RegionSelector renders countries list 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -17810,7 +17822,7 @@ exports[`RegionSelector renders countries list 1`] = `
                                     testID="listitemcolumn"
                                   >
                                     <SvgMock
-                                      color="#121314"
+                                      color="#131416"
                                       fill="currentColor"
                                       height={20}
                                       name="ArrowRight"
@@ -17891,9 +17903,9 @@ exports[`RegionSelector renders countries list 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -17913,9 +17925,9 @@ exports[`RegionSelector renders countries list 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -18283,7 +18295,7 @@ exports[`RegionSelector renders country with supported set to false 1`] = `
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#686e7d",
+                              "color": "#66676a",
                               "fontFamily": "Geist-Regular",
                               "fontSize": 16,
                               "letterSpacing": 0,
@@ -18328,8 +18340,8 @@ exports[`RegionSelector renders country with supported set to false 1`] = `
                           style={
                             {
                               "alignItems": "center",
-                              "backgroundColor": "#3c4d9d0f",
-                              "borderColor": "#b7bbc866",
+                              "backgroundColor": "#b4b4b528",
+                              "borderColor": "#b4b4b566",
                               "borderRadius": 24,
                               "borderWidth": 1,
                               "flexDirection": "row",
@@ -18349,7 +18361,7 @@ exports[`RegionSelector renders country with supported set to false 1`] = `
                             testID="textfield-startacccessory"
                           >
                             <SvgMock
-                              color="#686e7d"
+                              color="#66676a"
                               fill="currentColor"
                               height={20}
                               name="Search"
@@ -18378,18 +18390,19 @@ exports[`RegionSelector renders country with supported set to false 1`] = `
                               onChangeText={[Function]}
                               onFocus={[Function]}
                               placeholder="Search by country"
-                              placeholderTextColor="#686e7d"
+                              placeholderTextColor="#66676a"
                               style={
                                 {
                                   "backgroundColor": "inherit",
                                   "borderColor": "transparent",
                                   "borderWidth": 1,
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "fontWeight": "400",
                                   "height": 46,
                                   "letterSpacing": 0,
+                                  "lineHeight": 0,
                                   "opacity": 1,
                                 }
                               }
@@ -18517,9 +18530,9 @@ exports[`RegionSelector renders country with supported set to false 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -18539,9 +18552,9 @@ exports[`RegionSelector renders country with supported set to false 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -18909,7 +18922,7 @@ exports[`RegionSelector renders country without flag 1`] = `
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#686e7d",
+                              "color": "#66676a",
                               "fontFamily": "Geist-Regular",
                               "fontSize": 16,
                               "letterSpacing": 0,
@@ -18954,8 +18967,8 @@ exports[`RegionSelector renders country without flag 1`] = `
                           style={
                             {
                               "alignItems": "center",
-                              "backgroundColor": "#3c4d9d0f",
-                              "borderColor": "#b7bbc866",
+                              "backgroundColor": "#b4b4b528",
+                              "borderColor": "#b4b4b566",
                               "borderRadius": 24,
                               "borderWidth": 1,
                               "flexDirection": "row",
@@ -18975,7 +18988,7 @@ exports[`RegionSelector renders country without flag 1`] = `
                             testID="textfield-startacccessory"
                           >
                             <SvgMock
-                              color="#686e7d"
+                              color="#66676a"
                               fill="currentColor"
                               height={20}
                               name="Search"
@@ -19004,18 +19017,19 @@ exports[`RegionSelector renders country without flag 1`] = `
                               onChangeText={[Function]}
                               onFocus={[Function]}
                               placeholder="Search by country"
-                              placeholderTextColor="#686e7d"
+                              placeholderTextColor="#66676a"
                               style={
                                 {
                                   "backgroundColor": "inherit",
                                   "borderColor": "transparent",
                                   "borderWidth": 1,
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "fontWeight": "400",
                                   "height": 46,
                                   "letterSpacing": 0,
+                                  "lineHeight": 0,
                                   "opacity": 1,
                                 }
                               }
@@ -19151,9 +19165,9 @@ exports[`RegionSelector renders country without flag 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -19182,7 +19196,7 @@ exports[`RegionSelector renders country without flag 1`] = `
                                     testID="listitemcolumn"
                                   >
                                     <SvgMock
-                                      color="#121314"
+                                      color="#131416"
                                       fill="currentColor"
                                       height={20}
                                       name="ArrowRight"
@@ -19552,7 +19566,7 @@ exports[`RegionSelector renders description text only in country view 1`] = `
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#686e7d",
+                              "color": "#66676a",
                               "fontFamily": "Geist-Regular",
                               "fontSize": 16,
                               "letterSpacing": 0,
@@ -19597,8 +19611,8 @@ exports[`RegionSelector renders description text only in country view 1`] = `
                           style={
                             {
                               "alignItems": "center",
-                              "backgroundColor": "#3c4d9d0f",
-                              "borderColor": "#b7bbc866",
+                              "backgroundColor": "#b4b4b528",
+                              "borderColor": "#b4b4b566",
                               "borderRadius": 24,
                               "borderWidth": 1,
                               "flexDirection": "row",
@@ -19618,7 +19632,7 @@ exports[`RegionSelector renders description text only in country view 1`] = `
                             testID="textfield-startacccessory"
                           >
                             <SvgMock
-                              color="#686e7d"
+                              color="#66676a"
                               fill="currentColor"
                               height={20}
                               name="Search"
@@ -19647,18 +19661,19 @@ exports[`RegionSelector renders description text only in country view 1`] = `
                               onChangeText={[Function]}
                               onFocus={[Function]}
                               placeholder="Search by country"
-                              placeholderTextColor="#686e7d"
+                              placeholderTextColor="#66676a"
                               style={
                                 {
                                   "backgroundColor": "inherit",
                                   "borderColor": "transparent",
                                   "borderWidth": 1,
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "fontWeight": "400",
                                   "height": 46,
                                   "letterSpacing": 0,
+                                  "lineHeight": 0,
                                   "opacity": 1,
                                 }
                               }
@@ -19863,9 +19878,9 @@ exports[`RegionSelector renders description text only in country view 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -19885,9 +19900,9 @@ exports[`RegionSelector renders description text only in country view 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -19966,9 +19981,9 @@ exports[`RegionSelector renders description text only in country view 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -19988,9 +20003,9 @@ exports[`RegionSelector renders description text only in country view 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -20019,7 +20034,7 @@ exports[`RegionSelector renders description text only in country view 1`] = `
                                     testID="listitemcolumn"
                                   >
                                     <SvgMock
-                                      color="#121314"
+                                      color="#131416"
                                       fill="currentColor"
                                       height={20}
                                       name="ArrowRight"
@@ -20100,9 +20115,9 @@ exports[`RegionSelector renders description text only in country view 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -20122,9 +20137,9 @@ exports[`RegionSelector renders description text only in country view 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -20153,7 +20168,7 @@ exports[`RegionSelector renders description text only in country view 1`] = `
                                     testID="listitemcolumn"
                                   >
                                     <SvgMock
-                                      color="#121314"
+                                      color="#131416"
                                       fill="currentColor"
                                       height={20}
                                       name="ArrowRight"
@@ -20234,9 +20249,9 @@ exports[`RegionSelector renders description text only in country view 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -20256,9 +20271,9 @@ exports[`RegionSelector renders description text only in country view 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -20655,8 +20670,8 @@ exports[`RegionSelector renders description text only in country view 2`] = `
                           style={
                             {
                               "alignItems": "center",
-                              "backgroundColor": "#3c4d9d0f",
-                              "borderColor": "#b7bbc866",
+                              "backgroundColor": "#b4b4b528",
+                              "borderColor": "#b4b4b566",
                               "borderRadius": 24,
                               "borderWidth": 1,
                               "flexDirection": "row",
@@ -20676,7 +20691,7 @@ exports[`RegionSelector renders description text only in country view 2`] = `
                             testID="textfield-startacccessory"
                           >
                             <SvgMock
-                              color="#686e7d"
+                              color="#66676a"
                               fill="currentColor"
                               height={20}
                               name="Search"
@@ -20705,18 +20720,19 @@ exports[`RegionSelector renders description text only in country view 2`] = `
                               onChangeText={[Function]}
                               onFocus={[Function]}
                               placeholder="Search by state"
-                              placeholderTextColor="#686e7d"
+                              placeholderTextColor="#66676a"
                               style={
                                 {
                                   "backgroundColor": "inherit",
                                   "borderColor": "transparent",
                                   "borderWidth": 1,
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "fontWeight": "400",
                                   "height": 46,
                                   "letterSpacing": 0,
+                                  "lineHeight": 0,
                                   "opacity": 1,
                                 }
                               }
@@ -20842,9 +20858,9 @@ exports[`RegionSelector renders description text only in country view 2`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -20922,9 +20938,9 @@ exports[`RegionSelector renders description text only in country view 2`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -21292,7 +21308,7 @@ exports[`RegionSelector renders disabled country 1`] = `
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#686e7d",
+                              "color": "#66676a",
                               "fontFamily": "Geist-Regular",
                               "fontSize": 16,
                               "letterSpacing": 0,
@@ -21337,8 +21353,8 @@ exports[`RegionSelector renders disabled country 1`] = `
                           style={
                             {
                               "alignItems": "center",
-                              "backgroundColor": "#3c4d9d0f",
-                              "borderColor": "#b7bbc866",
+                              "backgroundColor": "#b4b4b528",
+                              "borderColor": "#b4b4b566",
                               "borderRadius": 24,
                               "borderWidth": 1,
                               "flexDirection": "row",
@@ -21358,7 +21374,7 @@ exports[`RegionSelector renders disabled country 1`] = `
                             testID="textfield-startacccessory"
                           >
                             <SvgMock
-                              color="#686e7d"
+                              color="#66676a"
                               fill="currentColor"
                               height={20}
                               name="Search"
@@ -21387,18 +21403,19 @@ exports[`RegionSelector renders disabled country 1`] = `
                               onChangeText={[Function]}
                               onFocus={[Function]}
                               placeholder="Search by country"
-                              placeholderTextColor="#686e7d"
+                              placeholderTextColor="#66676a"
                               style={
                                 {
                                   "backgroundColor": "inherit",
                                   "borderColor": "transparent",
                                   "borderWidth": 1,
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "fontWeight": "400",
                                   "height": 46,
                                   "letterSpacing": 0,
+                                  "lineHeight": 0,
                                   "opacity": 1,
                                 }
                               }
@@ -21603,9 +21620,9 @@ exports[`RegionSelector renders disabled country 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -21625,9 +21642,9 @@ exports[`RegionSelector renders disabled country 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -21706,9 +21723,9 @@ exports[`RegionSelector renders disabled country 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -21728,9 +21745,9 @@ exports[`RegionSelector renders disabled country 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -21759,7 +21776,7 @@ exports[`RegionSelector renders disabled country 1`] = `
                                     testID="listitemcolumn"
                                   >
                                     <SvgMock
-                                      color="#121314"
+                                      color="#131416"
                                       fill="currentColor"
                                       height={20}
                                       name="ArrowRight"
@@ -21840,9 +21857,9 @@ exports[`RegionSelector renders disabled country 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -21862,9 +21879,9 @@ exports[`RegionSelector renders disabled country 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -21893,7 +21910,7 @@ exports[`RegionSelector renders disabled country 1`] = `
                                     testID="listitemcolumn"
                                   >
                                     <SvgMock
-                                      color="#121314"
+                                      color="#131416"
                                       fill="currentColor"
                                       height={20}
                                       name="ArrowRight"
@@ -21974,9 +21991,9 @@ exports[`RegionSelector renders disabled country 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -21996,9 +22013,9 @@ exports[`RegionSelector renders disabled country 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -22395,8 +22412,8 @@ exports[`RegionSelector renders disabled state 1`] = `
                           style={
                             {
                               "alignItems": "center",
-                              "backgroundColor": "#3c4d9d0f",
-                              "borderColor": "#b7bbc866",
+                              "backgroundColor": "#b4b4b528",
+                              "borderColor": "#b4b4b566",
                               "borderRadius": 24,
                               "borderWidth": 1,
                               "flexDirection": "row",
@@ -22416,7 +22433,7 @@ exports[`RegionSelector renders disabled state 1`] = `
                             testID="textfield-startacccessory"
                           >
                             <SvgMock
-                              color="#686e7d"
+                              color="#66676a"
                               fill="currentColor"
                               height={20}
                               name="Search"
@@ -22445,18 +22462,19 @@ exports[`RegionSelector renders disabled state 1`] = `
                               onChangeText={[Function]}
                               onFocus={[Function]}
                               placeholder="Search by state"
-                              placeholderTextColor="#686e7d"
+                              placeholderTextColor="#66676a"
                               style={
                                 {
                                   "backgroundColor": "inherit",
                                   "borderColor": "transparent",
                                   "borderWidth": 1,
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "fontWeight": "400",
                                   "height": 46,
                                   "letterSpacing": 0,
+                                  "lineHeight": 0,
                                   "opacity": 1,
                                 }
                               }
@@ -22582,9 +22600,9 @@ exports[`RegionSelector renders disabled state 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -22662,9 +22680,9 @@ exports[`RegionSelector renders disabled state 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -23032,7 +23050,7 @@ exports[`RegionSelector renders error state when countries error occurs 1`] = `
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#686e7d",
+                              "color": "#66676a",
                               "fontFamily": "Geist-Regular",
                               "fontSize": 16,
                               "letterSpacing": 0,
@@ -23077,8 +23095,8 @@ exports[`RegionSelector renders error state when countries error occurs 1`] = `
                           style={
                             {
                               "alignItems": "center",
-                              "backgroundColor": "#3c4d9d0f",
-                              "borderColor": "#b7bbc866",
+                              "backgroundColor": "#b4b4b528",
+                              "borderColor": "#b4b4b566",
                               "borderRadius": 24,
                               "borderWidth": 1,
                               "flexDirection": "row",
@@ -23098,7 +23116,7 @@ exports[`RegionSelector renders error state when countries error occurs 1`] = `
                             testID="textfield-startacccessory"
                           >
                             <SvgMock
-                              color="#686e7d"
+                              color="#66676a"
                               fill="currentColor"
                               height={20}
                               name="Search"
@@ -23127,18 +23145,19 @@ exports[`RegionSelector renders error state when countries error occurs 1`] = `
                               onChangeText={[Function]}
                               onFocus={[Function]}
                               placeholder="Search by country"
-                              placeholderTextColor="#686e7d"
+                              placeholderTextColor="#66676a"
                               style={
                                 {
                                   "backgroundColor": "inherit",
                                   "borderColor": "transparent",
                                   "borderWidth": 1,
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "fontWeight": "400",
                                   "height": 46,
                                   "letterSpacing": 0,
+                                  "lineHeight": 0,
                                   "opacity": 1,
                                 }
                               }
@@ -23196,9 +23215,9 @@ exports[`RegionSelector renders error state when countries error occurs 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Medium",
-                                  "fontSize": 18,
+                                  "fontSize": 20,
                                   "letterSpacing": 0,
                                   "lineHeight": 24,
                                   "marginBottom": 8,
@@ -23212,7 +23231,7 @@ exports[`RegionSelector renders error state when countries error occurs 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#686e7d",
+                                  "color": "#66676a",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -23576,7 +23595,7 @@ exports[`RegionSelector renders loading state when regions are loading 1`] = `
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#686e7d",
+                              "color": "#66676a",
                               "fontFamily": "Geist-Regular",
                               "fontSize": 16,
                               "letterSpacing": 0,
@@ -23621,8 +23640,8 @@ exports[`RegionSelector renders loading state when regions are loading 1`] = `
                           style={
                             {
                               "alignItems": "center",
-                              "backgroundColor": "#3c4d9d0f",
-                              "borderColor": "#b7bbc866",
+                              "backgroundColor": "#b4b4b528",
+                              "borderColor": "#b4b4b566",
                               "borderRadius": 24,
                               "borderWidth": 1,
                               "flexDirection": "row",
@@ -23642,7 +23661,7 @@ exports[`RegionSelector renders loading state when regions are loading 1`] = `
                             testID="textfield-startacccessory"
                           >
                             <SvgMock
-                              color="#686e7d"
+                              color="#66676a"
                               fill="currentColor"
                               height={20}
                               name="Search"
@@ -23671,18 +23690,19 @@ exports[`RegionSelector renders loading state when regions are loading 1`] = `
                               onChangeText={[Function]}
                               onFocus={[Function]}
                               placeholder="Search by country"
-                              placeholderTextColor="#686e7d"
+                              placeholderTextColor="#66676a"
                               style={
                                 {
                                   "backgroundColor": "inherit",
                                   "borderColor": "transparent",
                                   "borderWidth": 1,
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "fontWeight": "400",
                                   "height": 46,
                                   "letterSpacing": 0,
+                                  "lineHeight": 0,
                                   "opacity": 1,
                                 }
                               }
@@ -24094,7 +24114,7 @@ exports[`RegionSelector renders recommended countries 1`] = `
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#686e7d",
+                              "color": "#66676a",
                               "fontFamily": "Geist-Regular",
                               "fontSize": 16,
                               "letterSpacing": 0,
@@ -24139,8 +24159,8 @@ exports[`RegionSelector renders recommended countries 1`] = `
                           style={
                             {
                               "alignItems": "center",
-                              "backgroundColor": "#3c4d9d0f",
-                              "borderColor": "#b7bbc866",
+                              "backgroundColor": "#b4b4b528",
+                              "borderColor": "#b4b4b566",
                               "borderRadius": 24,
                               "borderWidth": 1,
                               "flexDirection": "row",
@@ -24160,7 +24180,7 @@ exports[`RegionSelector renders recommended countries 1`] = `
                             testID="textfield-startacccessory"
                           >
                             <SvgMock
-                              color="#686e7d"
+                              color="#66676a"
                               fill="currentColor"
                               height={20}
                               name="Search"
@@ -24189,18 +24209,19 @@ exports[`RegionSelector renders recommended countries 1`] = `
                               onChangeText={[Function]}
                               onFocus={[Function]}
                               placeholder="Search by country"
-                              placeholderTextColor="#686e7d"
+                              placeholderTextColor="#66676a"
                               style={
                                 {
                                   "backgroundColor": "inherit",
                                   "borderColor": "transparent",
                                   "borderWidth": 1,
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "fontWeight": "400",
                                   "height": 46,
                                   "letterSpacing": 0,
+                                  "lineHeight": 0,
                                   "opacity": 1,
                                 }
                               }
@@ -24345,9 +24366,9 @@ exports[`RegionSelector renders recommended countries 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -24367,9 +24388,9 @@ exports[`RegionSelector renders recommended countries 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -24448,9 +24469,9 @@ exports[`RegionSelector renders recommended countries 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -24470,9 +24491,9 @@ exports[`RegionSelector renders recommended countries 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -24869,8 +24890,8 @@ exports[`RegionSelector renders state with supported set to false 1`] = `
                           style={
                             {
                               "alignItems": "center",
-                              "backgroundColor": "#3c4d9d0f",
-                              "borderColor": "#b7bbc866",
+                              "backgroundColor": "#b4b4b528",
+                              "borderColor": "#b4b4b566",
                               "borderRadius": 24,
                               "borderWidth": 1,
                               "flexDirection": "row",
@@ -24890,7 +24911,7 @@ exports[`RegionSelector renders state with supported set to false 1`] = `
                             testID="textfield-startacccessory"
                           >
                             <SvgMock
-                              color="#686e7d"
+                              color="#66676a"
                               fill="currentColor"
                               height={20}
                               name="Search"
@@ -24919,18 +24940,19 @@ exports[`RegionSelector renders state with supported set to false 1`] = `
                               onChangeText={[Function]}
                               onFocus={[Function]}
                               placeholder="Search by state"
-                              placeholderTextColor="#686e7d"
+                              placeholderTextColor="#66676a"
                               style={
                                 {
                                   "backgroundColor": "inherit",
                                   "borderColor": "transparent",
                                   "borderWidth": 1,
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "fontWeight": "400",
                                   "height": 46,
                                   "letterSpacing": 0,
+                                  "lineHeight": 0,
                                   "opacity": 1,
                                 }
                               }
@@ -25048,9 +25070,9 @@ exports[`RegionSelector renders state with supported set to false 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -25418,7 +25440,7 @@ exports[`RegionSelector renders state without stateId 1`] = `
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#686e7d",
+                              "color": "#66676a",
                               "fontFamily": "Geist-Regular",
                               "fontSize": 16,
                               "letterSpacing": 0,
@@ -25463,8 +25485,8 @@ exports[`RegionSelector renders state without stateId 1`] = `
                           style={
                             {
                               "alignItems": "center",
-                              "backgroundColor": "#3c4d9d0f",
-                              "borderColor": "#b7bbc866",
+                              "backgroundColor": "#b4b4b528",
+                              "borderColor": "#b4b4b566",
                               "borderRadius": 24,
                               "borderWidth": 1,
                               "flexDirection": "row",
@@ -25484,7 +25506,7 @@ exports[`RegionSelector renders state without stateId 1`] = `
                             testID="textfield-startacccessory"
                           >
                             <SvgMock
-                              color="#686e7d"
+                              color="#66676a"
                               fill="currentColor"
                               height={20}
                               name="Search"
@@ -25513,18 +25535,19 @@ exports[`RegionSelector renders state without stateId 1`] = `
                               onChangeText={[Function]}
                               onFocus={[Function]}
                               placeholder="Search by country"
-                              placeholderTextColor="#686e7d"
+                              placeholderTextColor="#66676a"
                               style={
                                 {
                                   "backgroundColor": "inherit",
                                   "borderColor": "transparent",
                                   "borderWidth": 1,
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "fontWeight": "400",
                                   "height": 46,
                                   "letterSpacing": 0,
+                                  "lineHeight": 0,
                                   "opacity": 1,
                                 }
                               }
@@ -25660,9 +25683,9 @@ exports[`RegionSelector renders state without stateId 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -25682,9 +25705,9 @@ exports[`RegionSelector renders state without stateId 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -25713,7 +25736,7 @@ exports[`RegionSelector renders state without stateId 1`] = `
                                     testID="listitemcolumn"
                                   >
                                     <SvgMock
-                                      color="#121314"
+                                      color="#131416"
                                       fill="currentColor"
                                       height={20}
                                       name="ArrowRight"
@@ -26112,8 +26135,8 @@ exports[`RegionSelector renders states view 1`] = `
                           style={
                             {
                               "alignItems": "center",
-                              "backgroundColor": "#3c4d9d0f",
-                              "borderColor": "#b7bbc866",
+                              "backgroundColor": "#b4b4b528",
+                              "borderColor": "#b4b4b566",
                               "borderRadius": 24,
                               "borderWidth": 1,
                               "flexDirection": "row",
@@ -26133,7 +26156,7 @@ exports[`RegionSelector renders states view 1`] = `
                             testID="textfield-startacccessory"
                           >
                             <SvgMock
-                              color="#686e7d"
+                              color="#66676a"
                               fill="currentColor"
                               height={20}
                               name="Search"
@@ -26162,18 +26185,19 @@ exports[`RegionSelector renders states view 1`] = `
                               onChangeText={[Function]}
                               onFocus={[Function]}
                               placeholder="Search by state"
-                              placeholderTextColor="#686e7d"
+                              placeholderTextColor="#66676a"
                               style={
                                 {
                                   "backgroundColor": "inherit",
                                   "borderColor": "transparent",
                                   "borderWidth": 1,
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "fontWeight": "400",
                                   "height": 46,
                                   "letterSpacing": 0,
+                                  "lineHeight": 0,
                                   "opacity": 1,
                                 }
                               }
@@ -26299,9 +26323,9 @@ exports[`RegionSelector renders states view 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -26379,9 +26403,9 @@ exports[`RegionSelector renders states view 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -26749,7 +26773,7 @@ exports[`RegionSelector renders unsupported country 1`] = `
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#686e7d",
+                              "color": "#66676a",
                               "fontFamily": "Geist-Regular",
                               "fontSize": 16,
                               "letterSpacing": 0,
@@ -26794,8 +26818,8 @@ exports[`RegionSelector renders unsupported country 1`] = `
                           style={
                             {
                               "alignItems": "center",
-                              "backgroundColor": "#3c4d9d0f",
-                              "borderColor": "#b7bbc866",
+                              "backgroundColor": "#b4b4b528",
+                              "borderColor": "#b4b4b566",
                               "borderRadius": 24,
                               "borderWidth": 1,
                               "flexDirection": "row",
@@ -26815,7 +26839,7 @@ exports[`RegionSelector renders unsupported country 1`] = `
                             testID="textfield-startacccessory"
                           >
                             <SvgMock
-                              color="#686e7d"
+                              color="#66676a"
                               fill="currentColor"
                               height={20}
                               name="Search"
@@ -26844,18 +26868,19 @@ exports[`RegionSelector renders unsupported country 1`] = `
                               onChangeText={[Function]}
                               onFocus={[Function]}
                               placeholder="Search by country"
-                              placeholderTextColor="#686e7d"
+                              placeholderTextColor="#66676a"
                               style={
                                 {
                                   "backgroundColor": "inherit",
                                   "borderColor": "transparent",
                                   "borderWidth": 1,
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "fontWeight": "400",
                                   "height": 46,
                                   "letterSpacing": 0,
+                                  "lineHeight": 0,
                                   "opacity": 1,
                                 }
                               }
@@ -27060,9 +27085,9 @@ exports[`RegionSelector renders unsupported country 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -27082,9 +27107,9 @@ exports[`RegionSelector renders unsupported country 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -27163,9 +27188,9 @@ exports[`RegionSelector renders unsupported country 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -27185,9 +27210,9 @@ exports[`RegionSelector renders unsupported country 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -27216,7 +27241,7 @@ exports[`RegionSelector renders unsupported country 1`] = `
                                     testID="listitemcolumn"
                                   >
                                     <SvgMock
-                                      color="#121314"
+                                      color="#131416"
                                       fill="currentColor"
                                       height={20}
                                       name="ArrowRight"
@@ -27297,9 +27322,9 @@ exports[`RegionSelector renders unsupported country 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -27319,9 +27344,9 @@ exports[`RegionSelector renders unsupported country 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -27350,7 +27375,7 @@ exports[`RegionSelector renders unsupported country 1`] = `
                                     testID="listitemcolumn"
                                   >
                                     <SvgMock
-                                      color="#121314"
+                                      color="#131416"
                                       fill="currentColor"
                                       height={20}
                                       name="ArrowRight"
@@ -27431,9 +27456,9 @@ exports[`RegionSelector renders unsupported country 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -27453,9 +27478,9 @@ exports[`RegionSelector renders unsupported country 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -27852,8 +27877,8 @@ exports[`RegionSelector renders unsupported state 1`] = `
                           style={
                             {
                               "alignItems": "center",
-                              "backgroundColor": "#3c4d9d0f",
-                              "borderColor": "#b7bbc866",
+                              "backgroundColor": "#b4b4b528",
+                              "borderColor": "#b4b4b566",
                               "borderRadius": 24,
                               "borderWidth": 1,
                               "flexDirection": "row",
@@ -27873,7 +27898,7 @@ exports[`RegionSelector renders unsupported state 1`] = `
                             testID="textfield-startacccessory"
                           >
                             <SvgMock
-                              color="#686e7d"
+                              color="#66676a"
                               fill="currentColor"
                               height={20}
                               name="Search"
@@ -27902,18 +27927,19 @@ exports[`RegionSelector renders unsupported state 1`] = `
                               onChangeText={[Function]}
                               onFocus={[Function]}
                               placeholder="Search by state"
-                              placeholderTextColor="#686e7d"
+                              placeholderTextColor="#66676a"
                               style={
                                 {
                                   "backgroundColor": "inherit",
                                   "borderColor": "transparent",
                                   "borderWidth": 1,
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "fontWeight": "400",
                                   "height": 46,
                                   "letterSpacing": 0,
+                                  "lineHeight": 0,
                                   "opacity": 1,
                                 }
                               }
@@ -28039,9 +28065,9 @@ exports[`RegionSelector renders unsupported state 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -28119,9 +28145,9 @@ exports[`RegionSelector renders unsupported state 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -28489,7 +28515,7 @@ exports[`RegionSelector renders when country has states and user region state is
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#686e7d",
+                              "color": "#66676a",
                               "fontFamily": "Geist-Regular",
                               "fontSize": 16,
                               "letterSpacing": 0,
@@ -28534,8 +28560,8 @@ exports[`RegionSelector renders when country has states and user region state is
                           style={
                             {
                               "alignItems": "center",
-                              "backgroundColor": "#3c4d9d0f",
-                              "borderColor": "#b7bbc866",
+                              "backgroundColor": "#b4b4b528",
+                              "borderColor": "#b4b4b566",
                               "borderRadius": 24,
                               "borderWidth": 1,
                               "flexDirection": "row",
@@ -28555,7 +28581,7 @@ exports[`RegionSelector renders when country has states and user region state is
                             testID="textfield-startacccessory"
                           >
                             <SvgMock
-                              color="#686e7d"
+                              color="#66676a"
                               fill="currentColor"
                               height={20}
                               name="Search"
@@ -28584,18 +28610,19 @@ exports[`RegionSelector renders when country has states and user region state is
                               onChangeText={[Function]}
                               onFocus={[Function]}
                               placeholder="Search by country"
-                              placeholderTextColor="#686e7d"
+                              placeholderTextColor="#66676a"
                               style={
                                 {
                                   "backgroundColor": "inherit",
                                   "borderColor": "transparent",
                                   "borderWidth": 1,
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "fontWeight": "400",
                                   "height": 46,
                                   "letterSpacing": 0,
+                                  "lineHeight": 0,
                                   "opacity": 1,
                                 }
                               }
@@ -28827,9 +28854,9 @@ exports[`RegionSelector renders when country has states and user region state is
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -28849,9 +28876,9 @@ exports[`RegionSelector renders when country has states and user region state is
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -28930,9 +28957,9 @@ exports[`RegionSelector renders when country has states and user region state is
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -28952,9 +28979,9 @@ exports[`RegionSelector renders when country has states and user region state is
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -28966,7 +28993,7 @@ exports[`RegionSelector renders when country has states and user region state is
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#b7bbc8",
+                                              "color": "#babbbe",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -28997,7 +29024,7 @@ exports[`RegionSelector renders when country has states and user region state is
                                     testID="listitemcolumn"
                                   >
                                     <SvgMock
-                                      color="#121314"
+                                      color="#131416"
                                       fill="currentColor"
                                       height={20}
                                       name="ArrowRight"
@@ -29017,7 +29044,7 @@ exports[`RegionSelector renders when country has states and user region state is
                                 accessible={true}
                                 style={
                                   {
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "bottom": 0,
                                     "flexDirection": "row",
                                     "left": 0,
@@ -29093,9 +29120,9 @@ exports[`RegionSelector renders when country has states and user region state is
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -29115,9 +29142,9 @@ exports[`RegionSelector renders when country has states and user region state is
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -29146,7 +29173,7 @@ exports[`RegionSelector renders when country has states and user region state is
                                     testID="listitemcolumn"
                                   >
                                     <SvgMock
-                                      color="#121314"
+                                      color="#131416"
                                       fill="currentColor"
                                       height={20}
                                       name="ArrowRight"
@@ -29227,9 +29254,9 @@ exports[`RegionSelector renders when country has states and user region state is
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -29249,9 +29276,9 @@ exports[`RegionSelector renders when country has states and user region state is
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -29619,7 +29646,7 @@ exports[`RegionSelector renders with empty regions array 1`] = `
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#686e7d",
+                              "color": "#66676a",
                               "fontFamily": "Geist-Regular",
                               "fontSize": 16,
                               "letterSpacing": 0,
@@ -29664,8 +29691,8 @@ exports[`RegionSelector renders with empty regions array 1`] = `
                           style={
                             {
                               "alignItems": "center",
-                              "backgroundColor": "#3c4d9d0f",
-                              "borderColor": "#b7bbc866",
+                              "backgroundColor": "#b4b4b528",
+                              "borderColor": "#b4b4b566",
                               "borderRadius": 24,
                               "borderWidth": 1,
                               "flexDirection": "row",
@@ -29685,7 +29712,7 @@ exports[`RegionSelector renders with empty regions array 1`] = `
                             testID="textfield-startacccessory"
                           >
                             <SvgMock
-                              color="#686e7d"
+                              color="#66676a"
                               fill="currentColor"
                               height={20}
                               name="Search"
@@ -29714,18 +29741,19 @@ exports[`RegionSelector renders with empty regions array 1`] = `
                               onChangeText={[Function]}
                               onFocus={[Function]}
                               placeholder="Search by country"
-                              placeholderTextColor="#686e7d"
+                              placeholderTextColor="#66676a"
                               style={
                                 {
                                   "backgroundColor": "inherit",
                                   "borderColor": "transparent",
                                   "borderWidth": 1,
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "fontWeight": "400",
                                   "height": 46,
                                   "letterSpacing": 0,
+                                  "lineHeight": 0,
                                   "opacity": 1,
                                 }
                               }
@@ -30121,7 +30149,7 @@ exports[`RegionSelector renders with selected user region 1`] = `
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#686e7d",
+                              "color": "#66676a",
                               "fontFamily": "Geist-Regular",
                               "fontSize": 16,
                               "letterSpacing": 0,
@@ -30166,8 +30194,8 @@ exports[`RegionSelector renders with selected user region 1`] = `
                           style={
                             {
                               "alignItems": "center",
-                              "backgroundColor": "#3c4d9d0f",
-                              "borderColor": "#b7bbc866",
+                              "backgroundColor": "#b4b4b528",
+                              "borderColor": "#b4b4b566",
                               "borderRadius": 24,
                               "borderWidth": 1,
                               "flexDirection": "row",
@@ -30187,7 +30215,7 @@ exports[`RegionSelector renders with selected user region 1`] = `
                             testID="textfield-startacccessory"
                           >
                             <SvgMock
-                              color="#686e7d"
+                              color="#66676a"
                               fill="currentColor"
                               height={20}
                               name="Search"
@@ -30216,18 +30244,19 @@ exports[`RegionSelector renders with selected user region 1`] = `
                               onChangeText={[Function]}
                               onFocus={[Function]}
                               placeholder="Search by country"
-                              placeholderTextColor="#686e7d"
+                              placeholderTextColor="#66676a"
                               style={
                                 {
                                   "backgroundColor": "inherit",
                                   "borderColor": "transparent",
                                   "borderWidth": 1,
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "fontWeight": "400",
                                   "height": 46,
                                   "letterSpacing": 0,
+                                  "lineHeight": 0,
                                   "opacity": 1,
                                 }
                               }
@@ -30459,9 +30488,9 @@ exports[`RegionSelector renders with selected user region 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -30481,9 +30510,9 @@ exports[`RegionSelector renders with selected user region 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -30562,9 +30591,9 @@ exports[`RegionSelector renders with selected user region 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -30584,9 +30613,9 @@ exports[`RegionSelector renders with selected user region 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -30598,7 +30627,7 @@ exports[`RegionSelector renders with selected user region 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#b7bbc8",
+                                              "color": "#babbbe",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -30629,7 +30658,7 @@ exports[`RegionSelector renders with selected user region 1`] = `
                                     testID="listitemcolumn"
                                   >
                                     <SvgMock
-                                      color="#121314"
+                                      color="#131416"
                                       fill="currentColor"
                                       height={20}
                                       name="ArrowRight"
@@ -30649,7 +30678,7 @@ exports[`RegionSelector renders with selected user region 1`] = `
                                 accessible={true}
                                 style={
                                   {
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "bottom": 0,
                                     "flexDirection": "row",
                                     "left": 0,
@@ -30725,9 +30754,9 @@ exports[`RegionSelector renders with selected user region 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -30747,9 +30776,9 @@ exports[`RegionSelector renders with selected user region 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -30778,7 +30807,7 @@ exports[`RegionSelector renders with selected user region 1`] = `
                                     testID="listitemcolumn"
                                   >
                                     <SvgMock
-                                      color="#121314"
+                                      color="#131416"
                                       fill="currentColor"
                                       height={20}
                                       name="ArrowRight"
@@ -30859,9 +30888,9 @@ exports[`RegionSelector renders with selected user region 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -30881,9 +30910,9 @@ exports[`RegionSelector renders with selected user region 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -31280,8 +31309,8 @@ exports[`RegionSelector resets search when navigating to state view 1`] = `
                           style={
                             {
                               "alignItems": "center",
-                              "backgroundColor": "#3c4d9d0f",
-                              "borderColor": "#b7bbc866",
+                              "backgroundColor": "#b4b4b528",
+                              "borderColor": "#b4b4b566",
                               "borderRadius": 24,
                               "borderWidth": 1,
                               "flexDirection": "row",
@@ -31301,7 +31330,7 @@ exports[`RegionSelector resets search when navigating to state view 1`] = `
                             testID="textfield-startacccessory"
                           >
                             <SvgMock
-                              color="#686e7d"
+                              color="#66676a"
                               fill="currentColor"
                               height={20}
                               name="Search"
@@ -31330,18 +31359,19 @@ exports[`RegionSelector resets search when navigating to state view 1`] = `
                               onChangeText={[Function]}
                               onFocus={[Function]}
                               placeholder="Search by state"
-                              placeholderTextColor="#686e7d"
+                              placeholderTextColor="#66676a"
                               style={
                                 {
                                   "backgroundColor": "inherit",
                                   "borderColor": "transparent",
                                   "borderWidth": 1,
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "fontWeight": "400",
                                   "height": 46,
                                   "letterSpacing": 0,
+                                  "lineHeight": 0,
                                   "opacity": 1,
                                 }
                               }
@@ -31467,9 +31497,9 @@ exports[`RegionSelector resets search when navigating to state view 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -31547,9 +31577,9 @@ exports[`RegionSelector resets search when navigating to state view 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -31917,7 +31947,7 @@ exports[`RegionSelector scrolls to top when search text changes 1`] = `
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#686e7d",
+                              "color": "#66676a",
                               "fontFamily": "Geist-Regular",
                               "fontSize": 16,
                               "letterSpacing": 0,
@@ -31962,8 +31992,8 @@ exports[`RegionSelector scrolls to top when search text changes 1`] = `
                           style={
                             {
                               "alignItems": "center",
-                              "backgroundColor": "#3c4d9d0f",
-                              "borderColor": "#b7bbc866",
+                              "backgroundColor": "#b4b4b528",
+                              "borderColor": "#b4b4b566",
                               "borderRadius": 24,
                               "borderWidth": 1,
                               "flexDirection": "row",
@@ -31983,7 +32013,7 @@ exports[`RegionSelector scrolls to top when search text changes 1`] = `
                             testID="textfield-startacccessory"
                           >
                             <SvgMock
-                              color="#686e7d"
+                              color="#66676a"
                               fill="currentColor"
                               height={20}
                               name="Search"
@@ -32012,13 +32042,13 @@ exports[`RegionSelector scrolls to top when search text changes 1`] = `
                               onChangeText={[Function]}
                               onFocus={[Function]}
                               placeholder="Search by country"
-                              placeholderTextColor="#686e7d"
+                              placeholderTextColor="#66676a"
                               style={
                                 {
                                   "backgroundColor": "inherit",
                                   "borderColor": "transparent",
                                   "borderWidth": 1,
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "fontWeight": "400",
@@ -32059,7 +32089,7 @@ exports[`RegionSelector scrolls to top when search text changes 1`] = `
                               testID="region-selector-clear-button"
                             >
                               <SvgMock
-                                color="#686e7d"
+                                color="#66676a"
                                 fill="currentColor"
                                 height={20}
                                 name="Close"
@@ -32123,9 +32153,9 @@ exports[`RegionSelector scrolls to top when search text changes 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Medium",
-                                  "fontSize": 18,
+                                  "fontSize": 20,
                                   "letterSpacing": 0,
                                   "lineHeight": 24,
                                 }
@@ -32516,8 +32546,8 @@ exports[`RegionSelector sets up back button in state view 1`] = `
                           style={
                             {
                               "alignItems": "center",
-                              "backgroundColor": "#3c4d9d0f",
-                              "borderColor": "#b7bbc866",
+                              "backgroundColor": "#b4b4b528",
+                              "borderColor": "#b4b4b566",
                               "borderRadius": 24,
                               "borderWidth": 1,
                               "flexDirection": "row",
@@ -32537,7 +32567,7 @@ exports[`RegionSelector sets up back button in state view 1`] = `
                             testID="textfield-startacccessory"
                           >
                             <SvgMock
-                              color="#686e7d"
+                              color="#66676a"
                               fill="currentColor"
                               height={20}
                               name="Search"
@@ -32566,18 +32596,19 @@ exports[`RegionSelector sets up back button in state view 1`] = `
                               onChangeText={[Function]}
                               onFocus={[Function]}
                               placeholder="Search by state"
-                              placeholderTextColor="#686e7d"
+                              placeholderTextColor="#66676a"
                               style={
                                 {
                                   "backgroundColor": "inherit",
                                   "borderColor": "transparent",
                                   "borderWidth": 1,
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "fontWeight": "400",
                                   "height": 46,
                                   "letterSpacing": 0,
+                                  "lineHeight": 0,
                                   "opacity": 1,
                                 }
                               }
@@ -32703,9 +32734,9 @@ exports[`RegionSelector sets up back button in state view 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -32783,9 +32814,9 @@ exports[`RegionSelector sets up back button in state view 1`] = `
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -33153,7 +33184,7 @@ exports[`RegionSelector shows state name in country view when user has selected
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#686e7d",
+                              "color": "#66676a",
                               "fontFamily": "Geist-Regular",
                               "fontSize": 16,
                               "letterSpacing": 0,
@@ -33198,8 +33229,8 @@ exports[`RegionSelector shows state name in country view when user has selected
                           style={
                             {
                               "alignItems": "center",
-                              "backgroundColor": "#3c4d9d0f",
-                              "borderColor": "#b7bbc866",
+                              "backgroundColor": "#b4b4b528",
+                              "borderColor": "#b4b4b566",
                               "borderRadius": 24,
                               "borderWidth": 1,
                               "flexDirection": "row",
@@ -33219,7 +33250,7 @@ exports[`RegionSelector shows state name in country view when user has selected
                             testID="textfield-startacccessory"
                           >
                             <SvgMock
-                              color="#686e7d"
+                              color="#66676a"
                               fill="currentColor"
                               height={20}
                               name="Search"
@@ -33248,18 +33279,19 @@ exports[`RegionSelector shows state name in country view when user has selected
                               onChangeText={[Function]}
                               onFocus={[Function]}
                               placeholder="Search by country"
-                              placeholderTextColor="#686e7d"
+                              placeholderTextColor="#66676a"
                               style={
                                 {
                                   "backgroundColor": "inherit",
                                   "borderColor": "transparent",
                                   "borderWidth": 1,
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "fontWeight": "400",
                                   "height": 46,
                                   "letterSpacing": 0,
+                                  "lineHeight": 0,
                                   "opacity": 1,
                                 }
                               }
@@ -33501,9 +33533,9 @@ exports[`RegionSelector shows state name in country view when user has selected
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -33523,9 +33555,9 @@ exports[`RegionSelector shows state name in country view when user has selected
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -33604,9 +33636,9 @@ exports[`RegionSelector shows state name in country view when user has selected
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -33626,9 +33658,9 @@ exports[`RegionSelector shows state name in country view when user has selected
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -33640,7 +33672,7 @@ exports[`RegionSelector shows state name in country view when user has selected
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#b7bbc8",
+                                              "color": "#babbbe",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -33671,7 +33703,7 @@ exports[`RegionSelector shows state name in country view when user has selected
                                     testID="listitemcolumn"
                                   >
                                     <SvgMock
-                                      color="#121314"
+                                      color="#131416"
                                       fill="currentColor"
                                       height={20}
                                       name="ArrowRight"
@@ -33691,7 +33723,7 @@ exports[`RegionSelector shows state name in country view when user has selected
                                 accessible={true}
                                 style={
                                   {
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                     "bottom": 0,
                                     "flexDirection": "row",
                                     "left": 0,
@@ -33767,9 +33799,9 @@ exports[`RegionSelector shows state name in country view when user has selected
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -33789,9 +33821,9 @@ exports[`RegionSelector shows state name in country view when user has selected
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -33820,7 +33852,7 @@ exports[`RegionSelector shows state name in country view when user has selected
                                     testID="listitemcolumn"
                                   >
                                     <SvgMock
-                                      color="#121314"
+                                      color="#131416"
                                       fill="currentColor"
                                       height={20}
                                       name="ArrowRight"
@@ -33901,9 +33933,9 @@ exports[`RegionSelector shows state name in country view when user has selected
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -33923,9 +33955,9 @@ exports[`RegionSelector shows state name in country view when user has selected
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -34293,7 +34325,7 @@ exports[`RegionSelector sorts regions with recommended first when no search 1`]
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#686e7d",
+                              "color": "#66676a",
                               "fontFamily": "Geist-Regular",
                               "fontSize": 16,
                               "letterSpacing": 0,
@@ -34338,8 +34370,8 @@ exports[`RegionSelector sorts regions with recommended first when no search 1`]
                           style={
                             {
                               "alignItems": "center",
-                              "backgroundColor": "#3c4d9d0f",
-                              "borderColor": "#b7bbc866",
+                              "backgroundColor": "#b4b4b528",
+                              "borderColor": "#b4b4b566",
                               "borderRadius": 24,
                               "borderWidth": 1,
                               "flexDirection": "row",
@@ -34359,7 +34391,7 @@ exports[`RegionSelector sorts regions with recommended first when no search 1`]
                             testID="textfield-startacccessory"
                           >
                             <SvgMock
-                              color="#686e7d"
+                              color="#66676a"
                               fill="currentColor"
                               height={20}
                               name="Search"
@@ -34388,18 +34420,19 @@ exports[`RegionSelector sorts regions with recommended first when no search 1`]
                               onChangeText={[Function]}
                               onFocus={[Function]}
                               placeholder="Search by country"
-                              placeholderTextColor="#686e7d"
+                              placeholderTextColor="#66676a"
                               style={
                                 {
                                   "backgroundColor": "inherit",
                                   "borderColor": "transparent",
                                   "borderWidth": 1,
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "fontWeight": "400",
                                   "height": 46,
                                   "letterSpacing": 0,
+                                  "lineHeight": 0,
                                   "opacity": 1,
                                 }
                               }
@@ -34561,9 +34594,9 @@ exports[`RegionSelector sorts regions with recommended first when no search 1`]
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -34583,9 +34616,9 @@ exports[`RegionSelector sorts regions with recommended first when no search 1`]
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -34664,9 +34697,9 @@ exports[`RegionSelector sorts regions with recommended first when no search 1`]
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -34686,9 +34719,9 @@ exports[`RegionSelector sorts regions with recommended first when no search 1`]
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -34767,9 +34800,9 @@ exports[`RegionSelector sorts regions with recommended first when no search 1`]
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -34789,9 +34822,9 @@ exports[`RegionSelector sorts regions with recommended first when no search 1`]
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
diff --git a/app/components/UI/Ramp/Views/TokenSelection/TokenSelection.test.tsx b/app/components/UI/Ramp/Views/TokenSelection/TokenSelection.test.tsx
index 5f0e56defead..ce7fdc2f691c 100644
--- a/app/components/UI/Ramp/Views/TokenSelection/TokenSelection.test.tsx
+++ b/app/components/UI/Ramp/Views/TokenSelection/TokenSelection.test.tsx
@@ -1,7 +1,7 @@
 import React from 'react';
-import { ActivityIndicator } from 'react-native';
 import { fireEvent, waitFor } from '@testing-library/react-native';
 import TokenSelection from './TokenSelection';
+import { TokenSelectionSelectors } from './TokenSelection.testIds';
 import useSearchTokenResults from '../../Deposit/hooks/useSearchTokenResults';
 import { renderScreen } from '../../../../../util/test/renderWithProvider';
 import { backgroundState } from '../../../../../util/test/initial-root-state';
@@ -81,8 +81,9 @@ jest.mock('../../hooks/useRampsController', () => ({
   useRampsController: jest.fn(),
 }));
 
-const mockTrackEvent = jest.fn();
-jest.mock('../../hooks/useAnalytics', () => () => mockTrackEvent);
+jest.mock('../../../../hooks/useDebouncedValue', () => ({
+  useDebouncedValue: <T,>(value: T) => value,
+}));
 
 const mockGetNetworkName = jest.fn();
 jest.mock('../../Deposit/hooks/useDepositCryptoCurrencyNetworkName', () => ({
@@ -174,11 +175,17 @@ describe('TokenSelection Component', () => {
       paymentMethodsError: null,
       getQuotes: jest.fn(),
       getWidgetUrl: jest.fn(),
+      orders: [],
+      getOrderById: jest.fn(),
+      addOrder: jest.fn(),
+      removeOrder: jest.fn(),
+      refreshOrder: jest.fn(),
+      getOrderFromCallback: jest.fn(),
     });
   });
 
   afterEach(() => {
-    jest.resetAllMocks();
+    jest.clearAllMocks();
   });
 
   it('renders correctly and matches snapshot (legacy)', () => {
@@ -277,10 +284,11 @@ describe('TokenSelection Component', () => {
       error: null,
     });
 
-    const { UNSAFE_getByType } = renderWithProvider(TokenSelection);
-    const activityIndicator = UNSAFE_getByType(ActivityIndicator);
+    const { getByTestId } = renderWithProvider(TokenSelection);
 
-    expect(activityIndicator).toBeDefined();
+    expect(
+      getByTestId(TokenSelectionSelectors.LOADING_INDICATOR),
+    ).toBeOnTheScreen();
   });
 
   it('displays loading indicator while fetching tokens (V2 enabled)', () => {
@@ -308,12 +316,59 @@ describe('TokenSelection Component', () => {
       paymentMethodsError: null,
       getQuotes: jest.fn(),
       getWidgetUrl: jest.fn(),
+      orders: [],
+      getOrderById: jest.fn(),
+      addOrder: jest.fn(),
+      removeOrder: jest.fn(),
+      refreshOrder: jest.fn(),
+      getOrderFromCallback: jest.fn(),
+    });
+
+    const { getByTestId } = renderWithProvider(TokenSelection);
+
+    expect(
+      getByTestId(TokenSelectionSelectors.LOADING_INDICATOR),
+    ).toBeOnTheScreen();
+  });
+
+  it('displays loading when tokens not yet loaded (V2, null tokens and no error)', () => {
+    mockUseRampsUnifiedV2Enabled.mockReturnValue(true);
+    mockUseRampsController.mockReturnValue({
+      tokens: null,
+      selectedToken: null,
+      setSelectedToken: jest.fn(),
+      tokensLoading: false,
+      tokensError: null,
+      userRegion: null,
+      setUserRegion: jest.fn(),
+      selectedProvider: null,
+      setSelectedProvider: jest.fn(),
+      providers: [],
+      providersLoading: false,
+      providersError: null,
+      countries: [],
+      countriesLoading: false,
+      countriesError: null,
+      paymentMethods: [],
+      selectedPaymentMethod: null,
+      setSelectedPaymentMethod: jest.fn(),
+      paymentMethodsLoading: false,
+      paymentMethodsError: null,
+      getQuotes: jest.fn(),
+      getWidgetUrl: jest.fn(),
+      orders: [],
+      getOrderById: jest.fn(),
+      addOrder: jest.fn(),
+      removeOrder: jest.fn(),
+      refreshOrder: jest.fn(),
+      getOrderFromCallback: jest.fn(),
     });
 
-    const { UNSAFE_getByType } = renderWithProvider(TokenSelection);
-    const activityIndicator = UNSAFE_getByType(ActivityIndicator);
+    const { getByTestId } = renderWithProvider(TokenSelection);
 
-    expect(activityIndicator).toBeDefined();
+    expect(
+      getByTestId(TokenSelectionSelectors.LOADING_INDICATOR),
+    ).toBeOnTheScreen();
   });
 
   it('displays error message when token fetch fails (legacy)', () => {
@@ -355,6 +410,12 @@ describe('TokenSelection Component', () => {
       paymentMethodsError: null,
       getQuotes: jest.fn(),
       getWidgetUrl: jest.fn(),
+      orders: [],
+      getOrderById: jest.fn(),
+      addOrder: jest.fn(),
+      removeOrder: jest.fn(),
+      refreshOrder: jest.fn(),
+      getOrderFromCallback: jest.fn(),
     });
 
     const { getByText } = renderWithProvider(TokenSelection);
@@ -414,6 +475,12 @@ describe('TokenSelection Component', () => {
       paymentMethodsError: null,
       getQuotes: jest.fn(),
       getWidgetUrl: jest.fn(),
+      orders: [],
+      getOrderById: jest.fn(),
+      addOrder: jest.fn(),
+      removeOrder: jest.fn(),
+      refreshOrder: jest.fn(),
+      getOrderFromCallback: jest.fn(),
     });
 
     renderWithProvider(TokenSelection);
@@ -483,6 +550,12 @@ describe('TokenSelection Component', () => {
       paymentMethodsError: null,
       getQuotes: jest.fn(),
       getWidgetUrl: jest.fn(),
+      orders: [],
+      getOrderById: jest.fn(),
+      addOrder: jest.fn(),
+      removeOrder: jest.fn(),
+      refreshOrder: jest.fn(),
+      getOrderFromCallback: jest.fn(),
     });
 
     const { getByPlaceholderText } = renderWithProvider(TokenSelection);
@@ -556,6 +629,12 @@ describe('TokenSelection Component', () => {
       paymentMethodsError: null,
       getQuotes: jest.fn(),
       getWidgetUrl: jest.fn(),
+      orders: [],
+      getOrderById: jest.fn(),
+      addOrder: jest.fn(),
+      removeOrder: jest.fn(),
+      refreshOrder: jest.fn(),
+      getOrderFromCallback: jest.fn(),
     });
 
     const { getByPlaceholderText } = renderWithProvider(TokenSelection);
@@ -571,27 +650,6 @@ describe('TokenSelection Component', () => {
     );
   });
 
-  it('tracks RAMPS_TOKEN_SELECTED event when token is selected', () => {
-    const { getByTestId } = renderWithProvider(TokenSelection);
-
-    const firstToken = getByTestId(`token-list-item-${mockTokens[0].assetId}`);
-    fireEvent.press(firstToken);
-
-    expect(mockTrackEvent).toHaveBeenCalledWith('RAMPS_TOKEN_SELECTED', {
-      ramp_type: 'UNIFIED BUY',
-      region: 'US',
-      chain_id: mockTokens[0].chainId,
-      currency_destination: mockTokens[0].assetId,
-      currency_destination_symbol: mockTokens[0].symbol,
-      currency_destination_network: 'Ethereum Mainnet',
-      currency_source: '',
-      is_authenticated: false,
-      token_caip19: mockTokens[0].assetId,
-      token_symbol: mockTokens[0].symbol,
-      ramp_routing: UnifiedRampRoutingType.DEPOSIT,
-    });
-  });
-
   it('filters tokens to only include those for configured networks (V2 enabled)', () => {
     mockUseRampsUnifiedV2Enabled.mockReturnValue(true);
 
@@ -631,6 +689,12 @@ describe('TokenSelection Component', () => {
       paymentMethodsError: null,
       getQuotes: jest.fn(),
       getWidgetUrl: jest.fn(),
+      orders: [],
+      getOrderById: jest.fn(),
+      addOrder: jest.fn(),
+      removeOrder: jest.fn(),
+      refreshOrder: jest.fn(),
+      getOrderFromCallback: jest.fn(),
     });
 
     renderWithProvider(TokenSelection);
diff --git a/app/components/UI/Ramp/Views/TokenSelection/TokenSelection.testIds.ts b/app/components/UI/Ramp/Views/TokenSelection/TokenSelection.testIds.ts
new file mode 100644
index 000000000000..7d020d8b0194
--- /dev/null
+++ b/app/components/UI/Ramp/Views/TokenSelection/TokenSelection.testIds.ts
@@ -0,0 +1,3 @@
+export const TokenSelectionSelectors = {
+  LOADING_INDICATOR: 'token-selection-loading-indicator',
+};
diff --git a/app/components/UI/Ramp/Views/TokenSelection/TokenSelection.tsx b/app/components/UI/Ramp/Views/TokenSelection/TokenSelection.tsx
index a9e13ce4ff64..220487a5e9e6 100644
--- a/app/components/UI/Ramp/Views/TokenSelection/TokenSelection.tsx
+++ b/app/components/UI/Ramp/Views/TokenSelection/TokenSelection.tsx
@@ -1,5 +1,6 @@
 import React, {
   useCallback,
+  useEffect,
   useLayoutEffect,
   useMemo,
   useRef,
@@ -34,14 +35,17 @@ import { getDepositNavbarOptions } from '../../../Navbar';
 import Routes from '../../../../../constants/navigation/Routes';
 import { useTheme } from '../../../../../util/theme';
 import { useRampNavigation } from '../../hooks/useRampNavigation';
-import useAnalytics from '../../hooks/useAnalytics';
+import { useAnalytics } from '../../../../hooks/useAnalytics/useAnalytics';
+import { MetaMetricsEvents } from '../../../../../core/Analytics';
 import {
   getRampRoutingDecision,
   getDetectedGeolocation,
 } from '../../../../../reducers/fiatOrders';
 import { selectNetworkConfigurationsByCaipChainId } from '../../../../../selectors/networkController';
 import { selectTokenSelectors } from '../../Aggregator/components/TokenSelectModal/SelectToken.testIds';
+import { TokenSelectionSelectors } from './TokenSelection.testIds';
 import { parseUserFacingError } from '../../utils/parseUserFacingError';
+import { useDebouncedValue } from '../../../../hooks/useDebouncedValue';
 
 export const createTokenSelectionNavDetails = createNavigationDetails(
   Routes.RAMP.TOKEN_SELECTION,
@@ -65,7 +69,7 @@ function TokenSelection() {
   } = useRampsController();
   const legacyTokens = useRampTokens();
 
-  const trackEvent = useAnalytics();
+  const { trackEvent, createEventBuilder } = useAnalytics();
   const getNetworkName = useDepositCryptoCurrencyNetworkName();
 
   const rampRoutingDecision = useSelector(getRampRoutingDecision);
@@ -91,6 +95,13 @@ function TokenSelection() {
       });
     };
 
+    // When tokens have never been loaded, controllerTokens is null and
+    // controllerTokensLoading is false (default state). Treat that as loading
+    // so we show spinner instead of "No tokens match" on first load before
+    // controller.init() has completed (e.g. fresh install or update).
+    const tokensNotYetLoaded =
+      controllerTokens === null && !controllerTokensError;
+
     return {
       topTokens: filterTokens(controllerTokens?.topTokens) as
         | RampsToken[]
@@ -98,7 +109,7 @@ function TokenSelection() {
       allTokens: filterTokens(controllerTokens?.allTokens) as
         | RampsToken[]
         | null,
-      isLoading: controllerTokensLoading,
+      isLoading: controllerTokensLoading || tokensNotYetLoaded,
       error: controllerTokensError,
     };
   }, [
@@ -123,7 +134,53 @@ function TokenSelection() {
   });
 
   const { goToBuy } = useRampNavigation();
-  const isRampsUnifiedV2Enabled = useRampsUnifiedV2Enabled();
+
+  const debouncedSearchString = useDebouncedValue(searchString, 500);
+
+  const rampType = isV2UnifiedEnabled ? 'UNIFIED_BUY_2' : 'UNIFIED_BUY';
+
+  const hasTrackedScreenViewRef = useRef(false);
+  useEffect(() => {
+    if (hasTrackedScreenViewRef.current) return;
+    if (rampRoutingDecision != null) {
+      hasTrackedScreenViewRef.current = true;
+      trackEvent(
+        createEventBuilder(MetaMetricsEvents.RAMPS_SCREEN_VIEWED)
+          .addProperties({
+            location: 'Token Selection',
+            ramp_type: rampType,
+            ramp_routing: rampRoutingDecision,
+          })
+          .build(),
+      );
+    }
+  }, [rampRoutingDecision, rampType, createEventBuilder, trackEvent]);
+
+  const prevSearchStringRef = useRef('');
+  useEffect(() => {
+    if (
+      debouncedSearchString.trim().length > 0 &&
+      debouncedSearchString !== prevSearchStringRef.current
+    ) {
+      prevSearchStringRef.current = debouncedSearchString;
+      trackEvent(
+        createEventBuilder(MetaMetricsEvents.RAMPS_TOKEN_SEARCHED)
+          .addProperties({
+            search_query: debouncedSearchString,
+            results_count: searchTokenResults?.length ?? 0,
+            location: 'Token Selection',
+            ramp_type: rampType,
+          })
+          .build(),
+      );
+    }
+  }, [
+    debouncedSearchString,
+    searchTokenResults?.length,
+    rampType,
+    createEventBuilder,
+    trackEvent,
+  ]);
 
   const handleSelectAssetIdCallback = useCallback(
     (assetId: string) => {
@@ -131,25 +188,29 @@ function TokenSelection() {
         (token) => token.assetId === assetId,
       );
       if (selectedToken) {
-        trackEvent('RAMPS_TOKEN_SELECTED', {
-          ramp_type: 'UNIFIED BUY',
-          region: detectedGeolocation || '',
-          chain_id: selectedToken.chainId,
-          currency_destination: selectedToken.assetId,
-          currency_destination_symbol: selectedToken.symbol,
-          currency_destination_network: getNetworkName(
-            selectedToken.chainId as string,
-          ),
-          currency_source: '',
-          is_authenticated: false,
-          token_caip19: selectedToken.assetId,
-          token_symbol: selectedToken.symbol,
-          ramp_routing: rampRoutingDecision ?? undefined,
-        });
+        trackEvent(
+          createEventBuilder(MetaMetricsEvents.RAMPS_TOKEN_SELECTED)
+            .addProperties({
+              ramp_type: isV2UnifiedEnabled ? 'UNIFIED_BUY_2' : 'UNIFIED_BUY',
+              region: detectedGeolocation || '',
+              chain_id: selectedToken.chainId,
+              currency_destination: selectedToken.assetId,
+              currency_destination_symbol: selectedToken.symbol,
+              currency_destination_network: getNetworkName(
+                selectedToken.chainId as string,
+              ),
+              currency_source: '',
+              is_authenticated: false,
+              token_caip19: selectedToken.assetId,
+              token_symbol: selectedToken.symbol,
+              ramp_routing: rampRoutingDecision ?? undefined,
+            })
+            .build(),
+        );
       }
       // V1 flow: close the modal before navigating to Deposit/Aggregator
       // V2 flow: set selected token on controller and navigate within the same stack
-      if (isRampsUnifiedV2Enabled) {
+      if (isV2UnifiedEnabled) {
         setSelectedToken(assetId);
         navigation.navigate(Routes.RAMP.AMOUNT_INPUT, { assetId });
       } else {
@@ -160,10 +221,11 @@ function TokenSelection() {
     [
       supportedTokens,
       trackEvent,
+      createEventBuilder,
       getNetworkName,
       detectedGeolocation,
       rampRoutingDecision,
-      isRampsUnifiedV2Enabled,
+      isV2UnifiedEnabled,
       navigation,
       goToBuy,
       setSelectedToken,
@@ -191,9 +253,35 @@ function TokenSelection() {
     handleSearchTextChange('');
   }, [handleSearchTextChange]);
 
+  const handleNetworkFilterChange = useCallback(
+    (newFilter: CaipChainId[] | null) => {
+      setNetworkFilter(newFilter);
+      trackEvent(
+        createEventBuilder(MetaMetricsEvents.RAMPS_NETWORK_FILTER_CLICKED)
+          .addProperties({
+            network_chain_id: newFilter?.[0] ?? undefined,
+            location: 'Token Selection',
+            ramp_type: rampType,
+          })
+          .build(),
+      );
+    },
+    [createEventBuilder, trackEvent, rampType],
+  );
+
   const handleUnsupportedInfoPress = useCallback(() => {
+    trackEvent(
+      createEventBuilder(
+        MetaMetricsEvents.RAMPS_UNSUPPORTED_TOKEN_TOOLTIP_CLICKED,
+      )
+        .addProperties({
+          location: 'Token Selection',
+          ramp_type: rampType,
+        })
+        .build(),
+    );
     navigation.navigate(...createUnsupportedTokenModalNavigationDetails());
-  }, [navigation]);
+  }, [navigation, createEventBuilder, trackEvent, rampType]);
 
   const renderToken = useCallback(
     ({ item: token }: { item: RampsToken }) => (
@@ -241,9 +329,19 @@ function TokenSelection() {
           showBack: false,
         },
         theme,
+        () => {
+          trackEvent(
+            createEventBuilder(MetaMetricsEvents.RAMPS_BACK_BUTTON_CLICKED)
+              .addProperties({
+                location: 'Token Selection',
+                ramp_type: rampType,
+              })
+              .build(),
+          );
+        },
       ),
     );
-  }, [navigation, theme]);
+  }, [navigation, theme, createEventBuilder, trackEvent, rampType]);
 
   if (isLoading) {
     return (
@@ -253,6 +351,7 @@ function TokenSelection() {
             <ActivityIndicator
               size="large"
               color={theme.colors.primary.default}
+              testID={TokenSelectionSelectors.LOADING_INDICATOR}
             />
           </Box>
         </ScreenLayout.Body>
@@ -289,7 +388,7 @@ function TokenSelection() {
           <TokenNetworkFilterBar
             networks={uniqueNetworks}
             networkFilter={networkFilter}
-            setNetworkFilter={setNetworkFilter}
+            setNetworkFilter={handleNetworkFilterChange}
           />
         </Box>
         <Box twClassName="px-4 py-3">
diff --git a/app/components/UI/Ramp/Views/TokenSelection/__snapshots__/TokenSelection.test.tsx.snap b/app/components/UI/Ramp/Views/TokenSelection/__snapshots__/TokenSelection.test.tsx.snap
index 7af7a765f32e..1b1313e4bed8 100644
--- a/app/components/UI/Ramp/Views/TokenSelection/__snapshots__/TokenSelection.test.tsx.snap
+++ b/app/components/UI/Ramp/Views/TokenSelection/__snapshots__/TokenSelection.test.tsx.snap
@@ -42,7 +42,7 @@ exports[`TokenSelection Component displays empty state when no tokens match sear
             {
               "bottom": 0,
               "left": 0,
-              "opacity": NaN,
+              "opacity": 1,
               "position": "absolute",
               "right": 0,
               "top": 0,
@@ -106,7 +106,7 @@ exports[`TokenSelection Component displays empty state when no tokens match sear
               style={
                 {
                   "marginHorizontal": 16,
-                  "opacity": NaN,
+                  "opacity": 1,
                 }
               }
             >
@@ -172,7 +172,7 @@ exports[`TokenSelection Component displays empty state when no tokens match sear
           collapsable={false}
           style={
             {
-              "opacity": NaN,
+              "opacity": 1,
             }
           }
         />
@@ -251,7 +251,7 @@ exports[`TokenSelection Component displays empty state when no tokens match sear
                   "flex": 1,
                   "transform": [
                     {
-                      "translateX": NaN,
+                      "translateX": 0,
                     },
                     {
                       "translateX": 0,
@@ -274,7 +274,7 @@ exports[`TokenSelection Component displays empty state when no tokens match sear
                       "height": 1,
                       "width": -1,
                     },
-                    "shadowOpacity": NaN,
+                    "shadowOpacity": 0.3,
                     "shadowRadius": 5,
                     "top": 0,
                     "width": 3,
@@ -388,7 +388,7 @@ exports[`TokenSelection Component displays empty state when no tokens match sear
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
-                                      "backgroundColor": "#121314",
+                                      "backgroundColor": "#131416",
                                       "borderRadius": 12,
                                       "flexDirection": "row",
                                       "height": 32,
@@ -424,7 +424,7 @@ exports[`TokenSelection Component displays empty state when no tokens match sear
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderColor": "transparent",
                                       "borderRadius": 12,
                                       "borderWidth": 1,
@@ -467,7 +467,7 @@ exports[`TokenSelection Component displays empty state when no tokens match sear
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -489,7 +489,7 @@ exports[`TokenSelection Component displays empty state when no tokens match sear
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderColor": "transparent",
                                       "borderRadius": 12,
                                       "borderWidth": 1,
@@ -532,7 +532,7 @@ exports[`TokenSelection Component displays empty state when no tokens match sear
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -554,7 +554,7 @@ exports[`TokenSelection Component displays empty state when no tokens match sear
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderColor": "transparent",
                                       "borderRadius": 12,
                                       "borderWidth": 1,
@@ -597,7 +597,7 @@ exports[`TokenSelection Component displays empty state when no tokens match sear
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -658,8 +658,8 @@ exports[`TokenSelection Component displays empty state when no tokens match sear
                               style={
                                 {
                                   "alignItems": "center",
-                                  "backgroundColor": "#3c4d9d0f",
-                                  "borderColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b528",
+                                  "borderColor": "#b4b4b566",
                                   "borderRadius": 24,
                                   "borderWidth": 1,
                                   "flexDirection": "row",
@@ -679,7 +679,7 @@ exports[`TokenSelection Component displays empty state when no tokens match sear
                                 testID="textfield-startacccessory"
                               >
                                 <SvgMock
-                                  color="#686e7d"
+                                  color="#66676a"
                                   fill="currentColor"
                                   height={20}
                                   name="Search"
@@ -708,13 +708,13 @@ exports[`TokenSelection Component displays empty state when no tokens match sear
                                   onChangeText={[Function]}
                                   onFocus={[Function]}
                                   placeholder="Search token by name or address"
-                                  placeholderTextColor="#686e7d"
+                                  placeholderTextColor="#66676a"
                                   style={
                                     {
                                       "backgroundColor": "inherit",
                                       "borderColor": "transparent",
                                       "borderWidth": 1,
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "fontWeight": "400",
@@ -754,7 +754,7 @@ exports[`TokenSelection Component displays empty state when no tokens match sear
                                   }
                                 >
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={20}
                                     name="CircleX"
@@ -830,9 +830,9 @@ exports[`TokenSelection Component displays empty state when no tokens match sear
                                       accessibilityRole="text"
                                       style={
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "fontFamily": "Geist-Medium",
-                                          "fontSize": 18,
+                                          "fontSize": 20,
                                           "letterSpacing": 0,
                                           "lineHeight": 24,
                                         }
@@ -902,7 +902,7 @@ exports[`TokenSelection Component renders correctly and matches snapshot (V2 ena
             {
               "bottom": 0,
               "left": 0,
-              "opacity": NaN,
+              "opacity": 1,
               "position": "absolute",
               "right": 0,
               "top": 0,
@@ -966,7 +966,7 @@ exports[`TokenSelection Component renders correctly and matches snapshot (V2 ena
               style={
                 {
                   "marginHorizontal": 16,
-                  "opacity": NaN,
+                  "opacity": 1,
                 }
               }
             >
@@ -1032,7 +1032,7 @@ exports[`TokenSelection Component renders correctly and matches snapshot (V2 ena
           collapsable={false}
           style={
             {
-              "opacity": NaN,
+              "opacity": 1,
             }
           }
         />
@@ -1111,7 +1111,7 @@ exports[`TokenSelection Component renders correctly and matches snapshot (V2 ena
                   "flex": 1,
                   "transform": [
                     {
-                      "translateX": NaN,
+                      "translateX": 0,
                     },
                     {
                       "translateX": 0,
@@ -1134,7 +1134,7 @@ exports[`TokenSelection Component renders correctly and matches snapshot (V2 ena
                       "height": 1,
                       "width": -1,
                     },
-                    "shadowOpacity": NaN,
+                    "shadowOpacity": 0.3,
                     "shadowRadius": 5,
                     "top": 0,
                     "width": 3,
@@ -1248,7 +1248,7 @@ exports[`TokenSelection Component renders correctly and matches snapshot (V2 ena
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
-                                      "backgroundColor": "#121314",
+                                      "backgroundColor": "#131416",
                                       "borderRadius": 12,
                                       "flexDirection": "row",
                                       "height": 32,
@@ -1284,7 +1284,7 @@ exports[`TokenSelection Component renders correctly and matches snapshot (V2 ena
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderColor": "transparent",
                                       "borderRadius": 12,
                                       "borderWidth": 1,
@@ -1327,7 +1327,7 @@ exports[`TokenSelection Component renders correctly and matches snapshot (V2 ena
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -1349,7 +1349,7 @@ exports[`TokenSelection Component renders correctly and matches snapshot (V2 ena
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderColor": "transparent",
                                       "borderRadius": 12,
                                       "borderWidth": 1,
@@ -1392,7 +1392,7 @@ exports[`TokenSelection Component renders correctly and matches snapshot (V2 ena
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -1414,7 +1414,7 @@ exports[`TokenSelection Component renders correctly and matches snapshot (V2 ena
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderColor": "transparent",
                                       "borderRadius": 12,
                                       "borderWidth": 1,
@@ -1457,7 +1457,7 @@ exports[`TokenSelection Component renders correctly and matches snapshot (V2 ena
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -1518,8 +1518,8 @@ exports[`TokenSelection Component renders correctly and matches snapshot (V2 ena
                               style={
                                 {
                                   "alignItems": "center",
-                                  "backgroundColor": "#3c4d9d0f",
-                                  "borderColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b528",
+                                  "borderColor": "#b4b4b566",
                                   "borderRadius": 24,
                                   "borderWidth": 1,
                                   "flexDirection": "row",
@@ -1539,7 +1539,7 @@ exports[`TokenSelection Component renders correctly and matches snapshot (V2 ena
                                 testID="textfield-startacccessory"
                               >
                                 <SvgMock
-                                  color="#686e7d"
+                                  color="#66676a"
                                   fill="currentColor"
                                   height={20}
                                   name="Search"
@@ -1568,18 +1568,19 @@ exports[`TokenSelection Component renders correctly and matches snapshot (V2 ena
                                   onChangeText={[Function]}
                                   onFocus={[Function]}
                                   placeholder="Search token by name or address"
-                                  placeholderTextColor="#686e7d"
+                                  placeholderTextColor="#66676a"
                                   style={
                                     {
                                       "backgroundColor": "inherit",
                                       "borderColor": "transparent",
                                       "borderWidth": 1,
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "fontWeight": "400",
                                       "height": 46,
                                       "letterSpacing": 0,
+                                      "lineHeight": 0,
                                       "opacity": 1,
                                     }
                                   }
@@ -1847,9 +1848,9 @@ exports[`TokenSelection Component renders correctly and matches snapshot (V2 ena
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -1861,7 +1862,7 @@ exports[`TokenSelection Component renders correctly and matches snapshot (V2 ena
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -1948,7 +1949,7 @@ exports[`TokenSelection Component renders correctly and matches snapshot (V2 ena
                                             style={
                                               [
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "height": 24,
                                                   "width": 24,
                                                 },
@@ -2147,9 +2148,9 @@ exports[`TokenSelection Component renders correctly and matches snapshot (V2 ena
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -2161,7 +2162,7 @@ exports[`TokenSelection Component renders correctly and matches snapshot (V2 ena
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -2248,7 +2249,7 @@ exports[`TokenSelection Component renders correctly and matches snapshot (V2 ena
                                             style={
                                               [
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "height": 24,
                                                   "width": 24,
                                                 },
@@ -2447,9 +2448,9 @@ exports[`TokenSelection Component renders correctly and matches snapshot (V2 ena
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -2461,7 +2462,7 @@ exports[`TokenSelection Component renders correctly and matches snapshot (V2 ena
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -2548,7 +2549,7 @@ exports[`TokenSelection Component renders correctly and matches snapshot (V2 ena
                                             style={
                                               [
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "height": 24,
                                                   "width": 24,
                                                 },
@@ -2747,9 +2748,9 @@ exports[`TokenSelection Component renders correctly and matches snapshot (V2 ena
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -2761,7 +2762,7 @@ exports[`TokenSelection Component renders correctly and matches snapshot (V2 ena
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -2848,7 +2849,7 @@ exports[`TokenSelection Component renders correctly and matches snapshot (V2 ena
                                             style={
                                               [
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "height": 24,
                                                   "width": 24,
                                                 },
@@ -3047,9 +3048,9 @@ exports[`TokenSelection Component renders correctly and matches snapshot (V2 ena
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -3061,7 +3062,7 @@ exports[`TokenSelection Component renders correctly and matches snapshot (V2 ena
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -3148,7 +3149,7 @@ exports[`TokenSelection Component renders correctly and matches snapshot (V2 ena
                                             style={
                                               [
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "height": 24,
                                                   "width": 24,
                                                 },
@@ -3567,7 +3568,7 @@ exports[`TokenSelection Component renders correctly and matches snapshot (legacy
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
-                                      "backgroundColor": "#121314",
+                                      "backgroundColor": "#131416",
                                       "borderRadius": 12,
                                       "flexDirection": "row",
                                       "height": 32,
@@ -3603,7 +3604,7 @@ exports[`TokenSelection Component renders correctly and matches snapshot (legacy
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderColor": "transparent",
                                       "borderRadius": 12,
                                       "borderWidth": 1,
@@ -3646,7 +3647,7 @@ exports[`TokenSelection Component renders correctly and matches snapshot (legacy
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -3668,7 +3669,7 @@ exports[`TokenSelection Component renders correctly and matches snapshot (legacy
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderColor": "transparent",
                                       "borderRadius": 12,
                                       "borderWidth": 1,
@@ -3711,7 +3712,7 @@ exports[`TokenSelection Component renders correctly and matches snapshot (legacy
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -3733,7 +3734,7 @@ exports[`TokenSelection Component renders correctly and matches snapshot (legacy
                                     {
                                       "alignItems": "center",
                                       "alignSelf": "flex-start",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "borderColor": "transparent",
                                       "borderRadius": 12,
                                       "borderWidth": 1,
@@ -3776,7 +3777,7 @@ exports[`TokenSelection Component renders correctly and matches snapshot (legacy
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -3837,8 +3838,8 @@ exports[`TokenSelection Component renders correctly and matches snapshot (legacy
                               style={
                                 {
                                   "alignItems": "center",
-                                  "backgroundColor": "#3c4d9d0f",
-                                  "borderColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b528",
+                                  "borderColor": "#b4b4b566",
                                   "borderRadius": 24,
                                   "borderWidth": 1,
                                   "flexDirection": "row",
@@ -3858,7 +3859,7 @@ exports[`TokenSelection Component renders correctly and matches snapshot (legacy
                                 testID="textfield-startacccessory"
                               >
                                 <SvgMock
-                                  color="#686e7d"
+                                  color="#66676a"
                                   fill="currentColor"
                                   height={20}
                                   name="Search"
@@ -3887,18 +3888,19 @@ exports[`TokenSelection Component renders correctly and matches snapshot (legacy
                                   onChangeText={[Function]}
                                   onFocus={[Function]}
                                   placeholder="Search token by name or address"
-                                  placeholderTextColor="#686e7d"
+                                  placeholderTextColor="#66676a"
                                   style={
                                     {
                                       "backgroundColor": "inherit",
                                       "borderColor": "transparent",
                                       "borderWidth": 1,
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "fontWeight": "400",
                                       "height": 46,
                                       "letterSpacing": 0,
+                                      "lineHeight": 0,
                                       "opacity": 1,
                                     }
                                   }
@@ -4166,9 +4168,9 @@ exports[`TokenSelection Component renders correctly and matches snapshot (legacy
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -4180,7 +4182,7 @@ exports[`TokenSelection Component renders correctly and matches snapshot (legacy
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -4267,7 +4269,7 @@ exports[`TokenSelection Component renders correctly and matches snapshot (legacy
                                             style={
                                               [
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "height": 24,
                                                   "width": 24,
                                                 },
@@ -4466,9 +4468,9 @@ exports[`TokenSelection Component renders correctly and matches snapshot (legacy
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -4480,7 +4482,7 @@ exports[`TokenSelection Component renders correctly and matches snapshot (legacy
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -4567,7 +4569,7 @@ exports[`TokenSelection Component renders correctly and matches snapshot (legacy
                                             style={
                                               [
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "height": 24,
                                                   "width": 24,
                                                 },
@@ -4766,9 +4768,9 @@ exports[`TokenSelection Component renders correctly and matches snapshot (legacy
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -4780,7 +4782,7 @@ exports[`TokenSelection Component renders correctly and matches snapshot (legacy
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -4867,7 +4869,7 @@ exports[`TokenSelection Component renders correctly and matches snapshot (legacy
                                             style={
                                               [
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "height": 24,
                                                   "width": 24,
                                                 },
@@ -5066,9 +5068,9 @@ exports[`TokenSelection Component renders correctly and matches snapshot (legacy
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -5080,7 +5082,7 @@ exports[`TokenSelection Component renders correctly and matches snapshot (legacy
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -5167,7 +5169,7 @@ exports[`TokenSelection Component renders correctly and matches snapshot (legacy
                                             style={
                                               [
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "height": 24,
                                                   "width": 24,
                                                 },
@@ -5366,9 +5368,9 @@ exports[`TokenSelection Component renders correctly and matches snapshot (legacy
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#121314",
+                                              "color": "#131416",
                                               "fontFamily": "Geist-Medium",
-                                              "fontSize": 18,
+                                              "fontSize": 20,
                                               "letterSpacing": 0,
                                               "lineHeight": 24,
                                             }
@@ -5380,7 +5382,7 @@ exports[`TokenSelection Component renders correctly and matches snapshot (legacy
                                           accessibilityRole="text"
                                           style={
                                             {
-                                              "color": "#686e7d",
+                                              "color": "#66676a",
                                               "fontFamily": "Geist-Regular",
                                               "fontSize": 16,
                                               "letterSpacing": 0,
@@ -5467,7 +5469,7 @@ exports[`TokenSelection Component renders correctly and matches snapshot (legacy
                                             style={
                                               [
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "height": 24,
                                                   "width": 24,
                                                 },
diff --git a/app/components/UI/Ramp/components/EligibilityFailedModal/__snapshots__/EligibilityFailedModal.test.tsx.snap b/app/components/UI/Ramp/components/EligibilityFailedModal/__snapshots__/EligibilityFailedModal.test.tsx.snap
index b863034f3821..f587090d88e1 100644
--- a/app/components/UI/Ramp/components/EligibilityFailedModal/__snapshots__/EligibilityFailedModal.test.tsx.snap
+++ b/app/components/UI/Ramp/components/EligibilityFailedModal/__snapshots__/EligibilityFailedModal.test.tsx.snap
@@ -352,9 +352,9 @@ exports[`EligibilityFailedModal renders modal with title and description 1`] = `
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#121314",
+                              "color": "#131416",
                               "fontFamily": "Geist-Bold",
-                              "fontSize": 18,
+                              "fontSize": 20,
                               "letterSpacing": 0,
                               "lineHeight": 24,
                             }
@@ -387,7 +387,7 @@ exports[`EligibilityFailedModal renders modal with title and description 1`] = `
                             testID="bottomsheetheader-close-button"
                           >
                             <SvgMock
-                              color="#121314"
+                              color="#131416"
                               fill="currentColor"
                               height={24}
                               name="Close"
@@ -415,7 +415,7 @@ exports[`EligibilityFailedModal renders modal with title and description 1`] = `
                         accessibilityRole="text"
                         style={
                           {
-                            "color": "#686e7d",
+                            "color": "#66676a",
                             "fontFamily": "Geist-Regular",
                             "fontSize": 16,
                             "letterSpacing": 0,
@@ -446,7 +446,7 @@ exports[`EligibilityFailedModal renders modal with title and description 1`] = `
                           {
                             "alignItems": "center",
                             "alignSelf": "stretch",
-                            "backgroundColor": "#3c4d9d0f",
+                            "backgroundColor": "#b4b4b528",
                             "borderColor": "transparent",
                             "borderRadius": 12,
                             "borderWidth": 1,
@@ -462,7 +462,7 @@ exports[`EligibilityFailedModal renders modal with title and description 1`] = `
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#121314",
+                              "color": "#131416",
                               "fontFamily": "Geist-Medium",
                               "fontSize": 16,
                               "letterSpacing": 0,
@@ -484,7 +484,7 @@ exports[`EligibilityFailedModal renders modal with title and description 1`] = `
                           {
                             "alignItems": "center",
                             "alignSelf": "stretch",
-                            "backgroundColor": "#121314",
+                            "backgroundColor": "#131416",
                             "borderRadius": 12,
                             "flexDirection": "row",
                             "height": 48,
diff --git a/app/components/UI/Ramp/components/MenuItem/__snapshots__/MenuItem.test.tsx.snap b/app/components/UI/Ramp/components/MenuItem/__snapshots__/MenuItem.test.tsx.snap
index 49cf22587583..dd4fbeed4596 100644
--- a/app/components/UI/Ramp/components/MenuItem/__snapshots__/MenuItem.test.tsx.snap
+++ b/app/components/UI/Ramp/components/MenuItem/__snapshots__/MenuItem.test.tsx.snap
@@ -40,7 +40,7 @@ exports[`MenuItem renders snapshot correctly 1`] = `
         testID="listitemcolumn"
       >
         <SvgMock
-          color="#121314"
+          color="#131416"
           fill="currentColor"
           height={20}
           name="Add"
@@ -74,7 +74,7 @@ exports[`MenuItem renders snapshot correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Medium",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -88,7 +88,7 @@ exports[`MenuItem renders snapshot correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "fontFamily": "Geist-Regular",
               "fontSize": 14,
               "letterSpacing": 0,
@@ -144,7 +144,7 @@ exports[`MenuItem renders with different icon 1`] = `
         testID="listitemcolumn"
       >
         <SvgMock
-          color="#121314"
+          color="#131416"
           fill="currentColor"
           height={20}
           name="Bank"
@@ -178,7 +178,7 @@ exports[`MenuItem renders with different icon 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Medium",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -192,7 +192,7 @@ exports[`MenuItem renders with different icon 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "fontFamily": "Geist-Regular",
               "fontSize": 14,
               "letterSpacing": 0,
@@ -248,7 +248,7 @@ exports[`MenuItem renders with empty description 1`] = `
         testID="listitemcolumn"
       >
         <SvgMock
-          color="#121314"
+          color="#131416"
           fill="currentColor"
           height={20}
           name="Add"
@@ -282,7 +282,7 @@ exports[`MenuItem renders with empty description 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Medium",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -338,7 +338,7 @@ exports[`MenuItem renders with title only 1`] = `
         testID="listitemcolumn"
       >
         <SvgMock
-          color="#121314"
+          color="#131416"
           fill="currentColor"
           height={20}
           name="Add"
@@ -372,7 +372,7 @@ exports[`MenuItem renders with title only 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Medium",
               "fontSize": 16,
               "letterSpacing": 0,
diff --git a/app/components/UI/Ramp/components/PaymentMethodPill/__snapshots__/PaymentMethodPill.test.tsx.snap b/app/components/UI/Ramp/components/PaymentMethodPill/__snapshots__/PaymentMethodPill.test.tsx.snap
index ab23781a28fc..ccaa168c104c 100644
--- a/app/components/UI/Ramp/components/PaymentMethodPill/__snapshots__/PaymentMethodPill.test.tsx.snap
+++ b/app/components/UI/Ramp/components/PaymentMethodPill/__snapshots__/PaymentMethodPill.test.tsx.snap
@@ -7,7 +7,7 @@ exports[`PaymentMethodPill matches snapshot 1`] = `
     {
       "alignItems": "center",
       "alignSelf": "center",
-      "backgroundColor": "#3c4d9d0f",
+      "backgroundColor": "#b4b4b528",
       "borderRadius": 100,
       "flexDirection": "row",
       "padding": 8,
@@ -23,7 +23,7 @@ exports[`PaymentMethodPill matches snapshot 1`] = `
     }
   >
     <SvgMock
-      color="#121314"
+      color="#131416"
       fill="currentColor"
       height={16}
       name="Card"
@@ -40,7 +40,7 @@ exports[`PaymentMethodPill matches snapshot 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Medium",
         "fontSize": 16,
         "letterSpacing": 0,
@@ -60,7 +60,7 @@ exports[`PaymentMethodPill matches snapshot 1`] = `
     }
   >
     <SvgMock
-      color="#121314"
+      color="#131416"
       fill="currentColor"
       height={16}
       name="ArrowDown"
@@ -83,7 +83,7 @@ exports[`PaymentMethodPill when isLoading is true matches snapshot when loading
       {
         "alignItems": "center",
         "alignSelf": "center",
-        "backgroundColor": "#3c4d9d0f",
+        "backgroundColor": "#b4b4b528",
         "borderRadius": 100,
         "flexDirection": "row",
         "padding": 8,
diff --git a/app/components/UI/Ramp/components/QuickAmounts/__snapshots__/QuickAmounts.test.tsx.snap b/app/components/UI/Ramp/components/QuickAmounts/__snapshots__/QuickAmounts.test.tsx.snap
index 23ec452ca28e..b3a0208ea50b 100644
--- a/app/components/UI/Ramp/components/QuickAmounts/__snapshots__/QuickAmounts.test.tsx.snap
+++ b/app/components/UI/Ramp/components/QuickAmounts/__snapshots__/QuickAmounts.test.tsx.snap
@@ -53,7 +53,7 @@ exports[`QuickAmounts matches snapshot 1`] = `
         [
           {
             "alignItems": "center",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -87,7 +87,7 @@ exports[`QuickAmounts matches snapshot 1`] = `
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "flexGrow": 0,
               "flexShrink": 1,
               "flexWrap": "wrap",
@@ -149,7 +149,7 @@ exports[`QuickAmounts matches snapshot 1`] = `
         [
           {
             "alignItems": "center",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -183,7 +183,7 @@ exports[`QuickAmounts matches snapshot 1`] = `
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "flexGrow": 0,
               "flexShrink": 1,
               "flexWrap": "wrap",
@@ -245,7 +245,7 @@ exports[`QuickAmounts matches snapshot 1`] = `
         [
           {
             "alignItems": "center",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -279,7 +279,7 @@ exports[`QuickAmounts matches snapshot 1`] = `
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "flexGrow": 0,
               "flexShrink": 1,
               "flexWrap": "wrap",
@@ -341,7 +341,7 @@ exports[`QuickAmounts matches snapshot 1`] = `
         [
           {
             "alignItems": "center",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -375,7 +375,7 @@ exports[`QuickAmounts matches snapshot 1`] = `
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "flexGrow": 0,
               "flexShrink": 1,
               "flexWrap": "wrap",
diff --git a/app/components/UI/Ramp/components/RampUnsupportedModal/__snapshots__/RampUnsupportedModal.test.tsx.snap b/app/components/UI/Ramp/components/RampUnsupportedModal/__snapshots__/RampUnsupportedModal.test.tsx.snap
index 6a6b69e9c03a..9a41efb4d400 100644
--- a/app/components/UI/Ramp/components/RampUnsupportedModal/__snapshots__/RampUnsupportedModal.test.tsx.snap
+++ b/app/components/UI/Ramp/components/RampUnsupportedModal/__snapshots__/RampUnsupportedModal.test.tsx.snap
@@ -352,9 +352,9 @@ exports[`RampUnsupportedModal renders modal with title and description 1`] = `
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#121314",
+                              "color": "#131416",
                               "fontFamily": "Geist-Bold",
-                              "fontSize": 18,
+                              "fontSize": 20,
                               "letterSpacing": 0,
                               "lineHeight": 24,
                             }
@@ -387,7 +387,7 @@ exports[`RampUnsupportedModal renders modal with title and description 1`] = `
                             testID="bottomsheetheader-close-button"
                           >
                             <SvgMock
-                              color="#121314"
+                              color="#131416"
                               fill="currentColor"
                               height={24}
                               name="Close"
@@ -420,7 +420,7 @@ exports[`RampUnsupportedModal renders modal with title and description 1`] = `
                         accessibilityRole="text"
                         style={
                           {
-                            "color": "#686e7d",
+                            "color": "#66676a",
                             "fontFamily": "Geist-Regular",
                             "fontSize": 16,
                             "letterSpacing": 0,
@@ -456,7 +456,7 @@ exports[`RampUnsupportedModal renders modal with title and description 1`] = `
                           {
                             "alignItems": "center",
                             "alignSelf": "stretch",
-                            "backgroundColor": "#121314",
+                            "backgroundColor": "#131416",
                             "borderRadius": 12,
                             "flexDirection": "row",
                             "height": 48,
diff --git a/app/components/UI/Ramp/components/TokenListItem/__snapshots__/TokenListItem.test.tsx.snap b/app/components/UI/Ramp/components/TokenListItem/__snapshots__/TokenListItem.test.tsx.snap
index 94cc3c51e87b..f36a54392990 100644
--- a/app/components/UI/Ramp/components/TokenListItem/__snapshots__/TokenListItem.test.tsx.snap
+++ b/app/components/UI/Ramp/components/TokenListItem/__snapshots__/TokenListItem.test.tsx.snap
@@ -185,9 +185,9 @@ exports[`TokenListItem basic rendering renders correctly and matches snapshot 1`
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Medium",
-              "fontSize": 18,
+              "fontSize": 20,
               "letterSpacing": 0,
               "lineHeight": 24,
             }
@@ -199,7 +199,7 @@ exports[`TokenListItem basic rendering renders correctly and matches snapshot 1`
           accessibilityRole="text"
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -400,9 +400,9 @@ exports[`TokenListItem basic rendering renders disabled token with info button a
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Medium",
-              "fontSize": 18,
+              "fontSize": 20,
               "letterSpacing": 0,
               "lineHeight": 24,
             }
@@ -414,7 +414,7 @@ exports[`TokenListItem basic rendering renders disabled token with info button a
           accessibilityRole="text"
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -501,7 +501,7 @@ exports[`TokenListItem basic rendering renders disabled token with info button a
             style={
               [
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "height": 24,
                   "width": 24,
                 },
diff --git a/app/components/UI/Ramp/components/TokenNetworkFilterBar/TokenNetworkFilterBar.tsx b/app/components/UI/Ramp/components/TokenNetworkFilterBar/TokenNetworkFilterBar.tsx
index b5203cd7e615..5bdf16a6bcca 100644
--- a/app/components/UI/Ramp/components/TokenNetworkFilterBar/TokenNetworkFilterBar.tsx
+++ b/app/components/UI/Ramp/components/TokenNetworkFilterBar/TokenNetworkFilterBar.tsx
@@ -22,7 +22,7 @@ import { strings } from '../../../../../../locales/i18n';
 interface TokenNetworkFilterBarProps {
   networks: CaipChainId[];
   networkFilter: CaipChainId[] | null;
-  setNetworkFilter: React.Dispatch<React.SetStateAction<CaipChainId[] | null>>;
+  setNetworkFilter: (filter: CaipChainId[] | null) => void;
 }
 
 function TokenNetworkFilterBar({
diff --git a/app/components/UI/Ramp/components/TokenNetworkFilterBar/__snapshots__/TokenNetworkFilterBar.test.tsx.snap b/app/components/UI/Ramp/components/TokenNetworkFilterBar/__snapshots__/TokenNetworkFilterBar.test.tsx.snap
index 824c8cf25be4..826946d851bc 100644
--- a/app/components/UI/Ramp/components/TokenNetworkFilterBar/__snapshots__/TokenNetworkFilterBar.test.tsx.snap
+++ b/app/components/UI/Ramp/components/TokenNetworkFilterBar/__snapshots__/TokenNetworkFilterBar.test.tsx.snap
@@ -29,7 +29,7 @@ exports[`TokenNetworkFilterBar renders correctly with all networks selected (emp
         {
           "alignItems": "center",
           "alignSelf": "flex-start",
-          "backgroundColor": "#121314",
+          "backgroundColor": "#131416",
           "borderRadius": 12,
           "flexDirection": "row",
           "height": 32,
@@ -65,7 +65,7 @@ exports[`TokenNetworkFilterBar renders correctly with all networks selected (emp
         {
           "alignItems": "center",
           "alignSelf": "flex-start",
-          "backgroundColor": "#3c4d9d0f",
+          "backgroundColor": "#b4b4b528",
           "borderColor": "transparent",
           "borderRadius": 12,
           "borderWidth": 1,
@@ -108,7 +108,7 @@ exports[`TokenNetworkFilterBar renders correctly with all networks selected (emp
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -130,7 +130,7 @@ exports[`TokenNetworkFilterBar renders correctly with all networks selected (emp
         {
           "alignItems": "center",
           "alignSelf": "flex-start",
-          "backgroundColor": "#3c4d9d0f",
+          "backgroundColor": "#b4b4b528",
           "borderColor": "transparent",
           "borderRadius": 12,
           "borderWidth": 1,
@@ -173,7 +173,7 @@ exports[`TokenNetworkFilterBar renders correctly with all networks selected (emp
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -195,7 +195,7 @@ exports[`TokenNetworkFilterBar renders correctly with all networks selected (emp
         {
           "alignItems": "center",
           "alignSelf": "flex-start",
-          "backgroundColor": "#3c4d9d0f",
+          "backgroundColor": "#b4b4b528",
           "borderColor": "transparent",
           "borderRadius": 12,
           "borderWidth": 1,
@@ -238,7 +238,7 @@ exports[`TokenNetworkFilterBar renders correctly with all networks selected (emp
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -282,7 +282,7 @@ exports[`TokenNetworkFilterBar renders correctly with all networks selected (nul
         {
           "alignItems": "center",
           "alignSelf": "flex-start",
-          "backgroundColor": "#121314",
+          "backgroundColor": "#131416",
           "borderRadius": 12,
           "flexDirection": "row",
           "height": 32,
@@ -318,7 +318,7 @@ exports[`TokenNetworkFilterBar renders correctly with all networks selected (nul
         {
           "alignItems": "center",
           "alignSelf": "flex-start",
-          "backgroundColor": "#3c4d9d0f",
+          "backgroundColor": "#b4b4b528",
           "borderColor": "transparent",
           "borderRadius": 12,
           "borderWidth": 1,
@@ -361,7 +361,7 @@ exports[`TokenNetworkFilterBar renders correctly with all networks selected (nul
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -383,7 +383,7 @@ exports[`TokenNetworkFilterBar renders correctly with all networks selected (nul
         {
           "alignItems": "center",
           "alignSelf": "flex-start",
-          "backgroundColor": "#3c4d9d0f",
+          "backgroundColor": "#b4b4b528",
           "borderColor": "transparent",
           "borderRadius": 12,
           "borderWidth": 1,
@@ -426,7 +426,7 @@ exports[`TokenNetworkFilterBar renders correctly with all networks selected (nul
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -448,7 +448,7 @@ exports[`TokenNetworkFilterBar renders correctly with all networks selected (nul
         {
           "alignItems": "center",
           "alignSelf": "flex-start",
-          "backgroundColor": "#3c4d9d0f",
+          "backgroundColor": "#b4b4b528",
           "borderColor": "transparent",
           "borderRadius": 12,
           "borderWidth": 1,
@@ -491,7 +491,7 @@ exports[`TokenNetworkFilterBar renders correctly with all networks selected (nul
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -535,7 +535,7 @@ exports[`TokenNetworkFilterBar renders correctly with single network selected 1`
         {
           "alignItems": "center",
           "alignSelf": "flex-start",
-          "backgroundColor": "#3c4d9d0f",
+          "backgroundColor": "#b4b4b528",
           "borderColor": "transparent",
           "borderRadius": 12,
           "borderWidth": 1,
@@ -551,7 +551,7 @@ exports[`TokenNetworkFilterBar renders correctly with single network selected 1`
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -573,7 +573,7 @@ exports[`TokenNetworkFilterBar renders correctly with single network selected 1`
         {
           "alignItems": "center",
           "alignSelf": "flex-start",
-          "backgroundColor": "#121314",
+          "backgroundColor": "#131416",
           "borderRadius": 12,
           "flexDirection": "row",
           "height": 32,
@@ -636,7 +636,7 @@ exports[`TokenNetworkFilterBar renders correctly with single network selected 1`
         {
           "alignItems": "center",
           "alignSelf": "flex-start",
-          "backgroundColor": "#3c4d9d0f",
+          "backgroundColor": "#b4b4b528",
           "borderColor": "transparent",
           "borderRadius": 12,
           "borderWidth": 1,
@@ -679,7 +679,7 @@ exports[`TokenNetworkFilterBar renders correctly with single network selected 1`
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -701,7 +701,7 @@ exports[`TokenNetworkFilterBar renders correctly with single network selected 1`
         {
           "alignItems": "center",
           "alignSelf": "flex-start",
-          "backgroundColor": "#3c4d9d0f",
+          "backgroundColor": "#b4b4b528",
           "borderColor": "transparent",
           "borderRadius": 12,
           "borderWidth": 1,
@@ -744,7 +744,7 @@ exports[`TokenNetworkFilterBar renders correctly with single network selected 1`
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
diff --git a/app/components/UI/Ramp/components/TruncatedError/TruncatedError.test.tsx b/app/components/UI/Ramp/components/TruncatedError/TruncatedError.test.tsx
new file mode 100644
index 000000000000..9ed9a1dd649e
--- /dev/null
+++ b/app/components/UI/Ramp/components/TruncatedError/TruncatedError.test.tsx
@@ -0,0 +1,243 @@
+import React from 'react';
+import { render, fireEvent, act } from '@testing-library/react-native';
+import TruncatedError from './TruncatedError';
+import { createErrorDetailsModalNavDetails } from '../../Views/Modals/ErrorDetailsModal/ErrorDetailsModal';
+
+const mockNavigate = jest.fn();
+jest.mock('@react-navigation/native', () => ({
+  ...jest.requireActual('@react-navigation/native'),
+  useNavigation: () => ({
+    navigate: mockNavigate,
+  }),
+}));
+
+function triggerTruncation(
+  getByText: ReturnType<typeof render>['getByText'],
+  displayedText: string,
+  fullError: string,
+) {
+  const truncatedText = fullError.slice(0, 20);
+  const mockEvent = {
+    nativeEvent: {
+      lines: [{ text: truncatedText, x: 0, y: 0, width: 100, height: 20 }],
+    },
+  };
+  const textComponent = getByText(displayedText);
+  act(() => {
+    fireEvent(textComponent, 'onTextLayout', mockEvent);
+  });
+}
+
+function triggerFitsMeasurement(
+  getByText: ReturnType<typeof render>['getByText'],
+  errorText: string,
+) {
+  const mockEvent = {
+    nativeEvent: {
+      lines: [{ text: errorText, x: 0, y: 0, width: 200, height: 20 }],
+    },
+  };
+  const textComponent = getByText(errorText);
+  act(() => {
+    fireEvent(textComponent, 'onTextLayout', mockEvent);
+  });
+}
+
+describe('TruncatedError', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  describe('Basic rendering', () => {
+    it('renders correctly and matches snapshot', () => {
+      const { toJSON } = render(
+        <TruncatedError error="This is a test error message" />,
+      );
+      expect(toJSON()).toMatchSnapshot();
+    });
+
+    it('renders with custom maxLines prop', () => {
+      const { toJSON } = render(
+        <TruncatedError error="This is a test error message" maxLines={3} />,
+      );
+      expect(toJSON()).toMatchSnapshot();
+    });
+
+    it('renders an empty error string', () => {
+      const { toJSON } = render(<TruncatedError error="" />);
+      expect(toJSON()).toMatchSnapshot();
+    });
+  });
+
+  describe('Info icon visibility', () => {
+    it('always renders the info icon', () => {
+      const { getByLabelText } = render(<TruncatedError error="Short error" />);
+
+      expect(getByLabelText('View error details')).toBeOnTheScreen();
+    });
+
+    it('displays the error text after measurement confirms it fits', () => {
+      const shortError = 'Short error message';
+      const { getByText, toJSON } = render(
+        <TruncatedError error={shortError} />,
+      );
+
+      triggerFitsMeasurement(getByText, shortError);
+
+      expect(getByText(shortError)).toBeOnTheScreen();
+      expect(toJSON()).toMatchSnapshot();
+    });
+  });
+
+  describe('Truncation behavior', () => {
+    const longError =
+      'This is a very long error message that should be truncated when displayed because it exceeds the maximum number of lines allowed.';
+
+    it('shows fallback text when error is truncated', () => {
+      const { getByText, toJSON } = render(
+        <TruncatedError error={longError} />,
+      );
+
+      triggerTruncation(getByText, longError, longError);
+
+      expect(getByText("We've encountered an error")).toBeOnTheScreen();
+      expect(toJSON()).toMatchSnapshot();
+    });
+
+    it('does not oscillate when a short error is truncated and fallback is longer', () => {
+      const shortError = 'Invalid OTP';
+      const { getByText, queryByText } = render(
+        <TruncatedError error={shortError} />,
+      );
+
+      const truncatedSlice = shortError.slice(0, 5);
+      const truncateEvent = {
+        nativeEvent: {
+          lines: [{ text: truncatedSlice, x: 0, y: 0, width: 100, height: 20 }],
+        },
+      };
+      act(() => {
+        fireEvent(getByText(shortError), 'onTextLayout', truncateEvent);
+      });
+
+      expect(getByText("We've encountered an error")).toBeOnTheScreen();
+
+      const fallbackText = "We've encountered an error";
+      const fallbackEvent = {
+        nativeEvent: {
+          lines: [{ text: fallbackText, x: 0, y: 0, width: 200, height: 20 }],
+        },
+      };
+      act(() => {
+        fireEvent(getByText(fallbackText), 'onTextLayout', fallbackEvent);
+      });
+
+      expect(getByText("We've encountered an error")).toBeOnTheScreen();
+      expect(queryByText(shortError)).toBeNull();
+    });
+
+    it('still navigates with the full error message when truncated', () => {
+      const { getByText, getByLabelText } = render(
+        <TruncatedError
+          error={longError}
+          providerName="Transak"
+          providerSupportUrl="https://support.transak.com"
+        />,
+      );
+
+      triggerTruncation(getByText, longError, longError);
+
+      fireEvent.press(getByLabelText('View error details'));
+
+      expect(mockNavigate).toHaveBeenCalledWith(
+        ...createErrorDetailsModalNavDetails({
+          errorMessage: longError,
+          providerName: 'Transak',
+          providerSupportUrl: 'https://support.transak.com',
+          showChangeProvider: undefined,
+        }),
+      );
+    });
+  });
+
+  describe('Info button interaction', () => {
+    const errorMessage = 'Short error';
+
+    it('navigates to error details modal when info icon is pressed', () => {
+      const { getByLabelText } = render(
+        <TruncatedError error={errorMessage} />,
+      );
+
+      fireEvent.press(getByLabelText('View error details'));
+
+      expect(mockNavigate).toHaveBeenCalledWith(
+        ...createErrorDetailsModalNavDetails({
+          errorMessage,
+          providerName: undefined,
+          providerSupportUrl: undefined,
+          showChangeProvider: undefined,
+        }),
+      );
+    });
+
+    it('navigates with provider info when provided', () => {
+      const { getByLabelText } = render(
+        <TruncatedError
+          error={errorMessage}
+          providerName="Transak"
+          providerSupportUrl="https://support.transak.com"
+        />,
+      );
+
+      fireEvent.press(getByLabelText('View error details'));
+
+      expect(mockNavigate).toHaveBeenCalledWith(
+        ...createErrorDetailsModalNavDetails({
+          errorMessage,
+          providerName: 'Transak',
+          providerSupportUrl: 'https://support.transak.com',
+          showChangeProvider: undefined,
+        }),
+      );
+    });
+
+    it('passes showChangeProvider to navigation params', () => {
+      const { getByLabelText } = render(
+        <TruncatedError error={errorMessage} showChangeProvider />,
+      );
+
+      fireEvent.press(getByLabelText('View error details'));
+
+      expect(mockNavigate).toHaveBeenCalledWith(
+        ...createErrorDetailsModalNavDetails({
+          errorMessage,
+          providerName: undefined,
+          providerSupportUrl: undefined,
+          showChangeProvider: true,
+        }),
+      );
+    });
+
+    it('sends errorDetails to the modal instead of error when provided', () => {
+      const detailedMessage = 'Full details about the error for the modal.';
+      const { getByLabelText } = render(
+        <TruncatedError
+          error={errorMessage}
+          errorDetails={detailedMessage}
+          showChangeProvider
+        />,
+      );
+
+      fireEvent.press(getByLabelText('View error details'));
+
+      expect(mockNavigate).toHaveBeenCalledWith(
+        ...createErrorDetailsModalNavDetails({
+          errorMessage: detailedMessage,
+          providerName: undefined,
+          providerSupportUrl: undefined,
+          showChangeProvider: true,
+        }),
+      );
+    });
+  });
+});
diff --git a/app/components/UI/Ramp/components/TruncatedError/TruncatedError.tsx b/app/components/UI/Ramp/components/TruncatedError/TruncatedError.tsx
new file mode 100644
index 000000000000..c254ff5dae71
--- /dev/null
+++ b/app/components/UI/Ramp/components/TruncatedError/TruncatedError.tsx
@@ -0,0 +1,122 @@
+import React, { useCallback, useEffect, useState } from 'react';
+import {
+  TouchableOpacity,
+  View,
+  StyleSheet,
+  type NativeSyntheticEvent,
+  type TextLayoutEventData,
+} from 'react-native';
+import { useNavigation } from '@react-navigation/native';
+import Text, {
+  TextVariant,
+  TextColor,
+} from '../../../../../component-library/components/Texts/Text';
+import Icon, {
+  IconName,
+  IconSize,
+  IconColor,
+} from '../../../../../component-library/components/Icons/Icon';
+import { createErrorDetailsModalNavDetails } from '../../Views/Modals/ErrorDetailsModal/ErrorDetailsModal';
+import { strings } from '../../../../../../locales/i18n';
+
+interface TruncatedErrorProps {
+  error: string;
+  errorDetails?: string;
+  maxLines?: number;
+  providerName?: string;
+  providerSupportUrl?: string;
+  showChangeProvider?: boolean;
+  amount?: number;
+}
+
+const styles = StyleSheet.create({
+  container: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    justifyContent: 'center',
+    gap: 6,
+  },
+  text: {
+    flexShrink: 1,
+  },
+  measuring: {
+    opacity: 0,
+  },
+});
+
+const TruncatedError: React.FC<TruncatedErrorProps> = ({
+  error,
+  errorDetails,
+  maxLines = 1,
+  providerName,
+  providerSupportUrl,
+  showChangeProvider,
+  amount,
+}) => {
+  const navigation = useNavigation();
+  const [isTruncated, setIsTruncated] = useState(false);
+  const [hasMeasured, setHasMeasured] = useState(false);
+
+  useEffect(() => {
+    setIsTruncated(false);
+    setHasMeasured(false);
+  }, [error]);
+
+  const handleTextLayout = useCallback(
+    (event: NativeSyntheticEvent<TextLayoutEventData>) => {
+      if (hasMeasured) return;
+      const { lines } = event.nativeEvent;
+      const renderedText = lines.map((line) => line.text).join('');
+      setIsTruncated(renderedText.length < error.length);
+      setHasMeasured(true);
+    },
+    [error, hasMeasured],
+  );
+
+  const handleInfoPress = useCallback(() => {
+    navigation.navigate(
+      ...createErrorDetailsModalNavDetails({
+        errorMessage: errorDetails ?? error,
+        providerName,
+        providerSupportUrl,
+        showChangeProvider,
+        amount,
+      }),
+    );
+  }, [
+    error,
+    errorDetails,
+    navigation,
+    providerName,
+    providerSupportUrl,
+    showChangeProvider,
+    amount,
+  ]);
+
+  return (
+    <View style={styles.container}>
+      <Text
+        variant={TextVariant.BodySM}
+        color={TextColor.Error}
+        numberOfLines={maxLines}
+        ellipsizeMode="tail"
+        onTextLayout={handleTextLayout}
+        style={[styles.text, !hasMeasured && styles.measuring]}
+      >
+        {hasMeasured && isTruncated
+          ? strings('fiat_on_ramp.encountered_error')
+          : error}
+      </Text>
+      <TouchableOpacity
+        onPress={handleInfoPress}
+        hitSlop={{ top: 8, bottom: 8, left: 8, right: 8 }}
+        accessibilityRole="button"
+        accessibilityLabel="View error details"
+      >
+        <Icon name={IconName.Info} size={IconSize.Sm} color={IconColor.Error} />
+      </TouchableOpacity>
+    </View>
+  );
+};
+
+export default TruncatedError;
diff --git a/app/components/UI/Ramp/components/TruncatedError/__snapshots__/TruncatedError.test.tsx.snap b/app/components/UI/Ramp/components/TruncatedError/__snapshots__/TruncatedError.test.tsx.snap
new file mode 100644
index 000000000000..a70aab91d4e8
--- /dev/null
+++ b/app/components/UI/Ramp/components/TruncatedError/__snapshots__/TruncatedError.test.tsx.snap
@@ -0,0 +1,315 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`TruncatedError Basic rendering renders an empty error string 1`] = `
+<View
+  style={
+    {
+      "alignItems": "center",
+      "flexDirection": "row",
+      "gap": 6,
+      "justifyContent": "center",
+    }
+  }
+>
+  <Text
+    accessibilityRole="text"
+    ellipsizeMode="tail"
+    numberOfLines={1}
+    onTextLayout={[Function]}
+    style={
+      {
+        "0": {
+          "flexShrink": 1,
+        },
+        "1": {
+          "opacity": 0,
+        },
+        "color": "#ca3542",
+        "fontFamily": "Geist-Regular",
+        "fontSize": 14,
+        "letterSpacing": 0,
+        "lineHeight": 22,
+      }
+    }
+  />
+  <TouchableOpacity
+    accessibilityLabel="View error details"
+    accessibilityRole="button"
+    hitSlop={
+      {
+        "bottom": 8,
+        "left": 8,
+        "right": 8,
+        "top": 8,
+      }
+    }
+    onPress={[Function]}
+  >
+    <SvgMock
+      color="#ca3542"
+      fill="currentColor"
+      height={16}
+      name="Info"
+      style={
+        {
+          "height": 16,
+          "width": 16,
+        }
+      }
+      width={16}
+    />
+  </TouchableOpacity>
+</View>
+`;
+
+exports[`TruncatedError Basic rendering renders correctly and matches snapshot 1`] = `
+<View
+  style={
+    {
+      "alignItems": "center",
+      "flexDirection": "row",
+      "gap": 6,
+      "justifyContent": "center",
+    }
+  }
+>
+  <Text
+    accessibilityRole="text"
+    ellipsizeMode="tail"
+    numberOfLines={1}
+    onTextLayout={[Function]}
+    style={
+      {
+        "0": {
+          "flexShrink": 1,
+        },
+        "1": {
+          "opacity": 0,
+        },
+        "color": "#ca3542",
+        "fontFamily": "Geist-Regular",
+        "fontSize": 14,
+        "letterSpacing": 0,
+        "lineHeight": 22,
+      }
+    }
+  >
+    This is a test error message
+  </Text>
+  <TouchableOpacity
+    accessibilityLabel="View error details"
+    accessibilityRole="button"
+    hitSlop={
+      {
+        "bottom": 8,
+        "left": 8,
+        "right": 8,
+        "top": 8,
+      }
+    }
+    onPress={[Function]}
+  >
+    <SvgMock
+      color="#ca3542"
+      fill="currentColor"
+      height={16}
+      name="Info"
+      style={
+        {
+          "height": 16,
+          "width": 16,
+        }
+      }
+      width={16}
+    />
+  </TouchableOpacity>
+</View>
+`;
+
+exports[`TruncatedError Basic rendering renders with custom maxLines prop 1`] = `
+<View
+  style={
+    {
+      "alignItems": "center",
+      "flexDirection": "row",
+      "gap": 6,
+      "justifyContent": "center",
+    }
+  }
+>
+  <Text
+    accessibilityRole="text"
+    ellipsizeMode="tail"
+    numberOfLines={3}
+    onTextLayout={[Function]}
+    style={
+      {
+        "0": {
+          "flexShrink": 1,
+        },
+        "1": {
+          "opacity": 0,
+        },
+        "color": "#ca3542",
+        "fontFamily": "Geist-Regular",
+        "fontSize": 14,
+        "letterSpacing": 0,
+        "lineHeight": 22,
+      }
+    }
+  >
+    This is a test error message
+  </Text>
+  <TouchableOpacity
+    accessibilityLabel="View error details"
+    accessibilityRole="button"
+    hitSlop={
+      {
+        "bottom": 8,
+        "left": 8,
+        "right": 8,
+        "top": 8,
+      }
+    }
+    onPress={[Function]}
+  >
+    <SvgMock
+      color="#ca3542"
+      fill="currentColor"
+      height={16}
+      name="Info"
+      style={
+        {
+          "height": 16,
+          "width": 16,
+        }
+      }
+      width={16}
+    />
+  </TouchableOpacity>
+</View>
+`;
+
+exports[`TruncatedError Info icon visibility displays the error text after measurement confirms it fits 1`] = `
+<View
+  style={
+    {
+      "alignItems": "center",
+      "flexDirection": "row",
+      "gap": 6,
+      "justifyContent": "center",
+    }
+  }
+>
+  <Text
+    accessibilityRole="text"
+    ellipsizeMode="tail"
+    numberOfLines={1}
+    onTextLayout={[Function]}
+    style={
+      {
+        "0": {
+          "flexShrink": 1,
+        },
+        "1": false,
+        "color": "#ca3542",
+        "fontFamily": "Geist-Regular",
+        "fontSize": 14,
+        "letterSpacing": 0,
+        "lineHeight": 22,
+      }
+    }
+  >
+    Short error message
+  </Text>
+  <TouchableOpacity
+    accessibilityLabel="View error details"
+    accessibilityRole="button"
+    hitSlop={
+      {
+        "bottom": 8,
+        "left": 8,
+        "right": 8,
+        "top": 8,
+      }
+    }
+    onPress={[Function]}
+  >
+    <SvgMock
+      color="#ca3542"
+      fill="currentColor"
+      height={16}
+      name="Info"
+      style={
+        {
+          "height": 16,
+          "width": 16,
+        }
+      }
+      width={16}
+    />
+  </TouchableOpacity>
+</View>
+`;
+
+exports[`TruncatedError Truncation behavior shows fallback text when error is truncated 1`] = `
+<View
+  style={
+    {
+      "alignItems": "center",
+      "flexDirection": "row",
+      "gap": 6,
+      "justifyContent": "center",
+    }
+  }
+>
+  <Text
+    accessibilityRole="text"
+    ellipsizeMode="tail"
+    numberOfLines={1}
+    onTextLayout={[Function]}
+    style={
+      {
+        "0": {
+          "flexShrink": 1,
+        },
+        "1": false,
+        "color": "#ca3542",
+        "fontFamily": "Geist-Regular",
+        "fontSize": 14,
+        "letterSpacing": 0,
+        "lineHeight": 22,
+      }
+    }
+  >
+    We've encountered an error
+  </Text>
+  <TouchableOpacity
+    accessibilityLabel="View error details"
+    accessibilityRole="button"
+    hitSlop={
+      {
+        "bottom": 8,
+        "left": 8,
+        "right": 8,
+        "top": 8,
+      }
+    }
+    onPress={[Function]}
+  >
+    <SvgMock
+      color="#ca3542"
+      fill="currentColor"
+      height={16}
+      name="Info"
+      style={
+        {
+          "height": 16,
+          "width": 16,
+        }
+      }
+      width={16}
+    />
+  </TouchableOpacity>
+</View>
+`;
diff --git a/app/components/UI/Ramp/components/TruncatedError/index.ts b/app/components/UI/Ramp/components/TruncatedError/index.ts
new file mode 100644
index 000000000000..00962287c2fa
--- /dev/null
+++ b/app/components/UI/Ramp/components/TruncatedError/index.ts
@@ -0,0 +1 @@
+export { default } from './TruncatedError';
diff --git a/app/components/UI/Ramp/hooks/useAnalytics.test.ts b/app/components/UI/Ramp/hooks/useAnalytics.test.ts
index b622178ed4ac..904afe095a69 100644
--- a/app/components/UI/Ramp/hooks/useAnalytics.test.ts
+++ b/app/components/UI/Ramp/hooks/useAnalytics.test.ts
@@ -25,7 +25,7 @@ describe('useAnalytics', () => {
     const testEvent = 'RAMPS_BUTTON_CLICKED';
     const testEventParams = {
       location: 'Amount to Buy Screen',
-      text: 'Buy',
+      button_text: 'Buy',
       ramp_type: 'BUY',
       region: 'US',
     } as const;
diff --git a/app/components/UI/Ramp/hooks/useHydrateRampsController.test.ts b/app/components/UI/Ramp/hooks/useHydrateRampsController.test.ts
index c3cbf258d6d2..463170e790a5 100644
--- a/app/components/UI/Ramp/hooks/useHydrateRampsController.test.ts
+++ b/app/components/UI/Ramp/hooks/useHydrateRampsController.test.ts
@@ -9,6 +9,8 @@ jest.mock('../../../../core/Engine', () => ({
   context: {
     RampsController: {
       hydrateState: jest.fn().mockResolvedValue(undefined),
+      init: jest.fn().mockResolvedValue(undefined),
+      startOrderPolling: jest.fn(),
     },
   },
 }));
@@ -72,6 +74,28 @@ describe('useHydrateRampsController', () => {
     expect(Engine.context.RampsController.hydrateState).not.toHaveBeenCalled();
   });
 
+  it('calls init once when userRegion is null', () => {
+    const store = createMockStore(null);
+    renderHook(() => useHydrateRampsController(), {
+      wrapper: wrapper(store),
+    });
+
+    expect(Engine.context.RampsController.init).toHaveBeenCalledTimes(1);
+  });
+
+  it('calls startOrderPolling when backup init resolves (userRegion null)', async () => {
+    const store = createMockStore(null);
+    renderHook(() => useHydrateRampsController(), {
+      wrapper: wrapper(store),
+    });
+
+    await Promise.resolve();
+
+    expect(
+      Engine.context.RampsController.startOrderPolling,
+    ).toHaveBeenCalledTimes(1);
+  });
+
   it('calls hydrateState again when regionCode changes', () => {
     const store1 = createMockStore({ regionCode: 'us-ca' });
     const { unmount } = renderHook(() => useHydrateRampsController(), {
diff --git a/app/components/UI/Ramp/hooks/useHydrateRampsController.ts b/app/components/UI/Ramp/hooks/useHydrateRampsController.ts
index 9d6c257d59ad..79e7ede1144d 100644
--- a/app/components/UI/Ramp/hooks/useHydrateRampsController.ts
+++ b/app/components/UI/Ramp/hooks/useHydrateRampsController.ts
@@ -1,26 +1,50 @@
-import { useEffect } from 'react';
+import { useEffect, useRef } from 'react';
 import { useSelector } from 'react-redux';
 import Engine from '../../../../core/Engine';
 import { selectUserRegion } from '../../../../selectors/rampsController';
 import useRampsUnifiedV2Enabled from './useRampsUnifiedV2Enabled';
 
 /**
- * Hook that hydrates RampsController state (tokens and providers) on mount
- * if the user has a saved region and V2 unified is enabled.
- * This preloads ramps data for faster UX when the user navigates to buy/sell flows.
+ * Hook that ensures RampsController has tokens (and providers) loaded.
  *
- * Should be called from a top-level component like Wallet that mounts early.
+ * - When V2 is enabled and userRegion is set: calls hydrateState() to refresh
+ * tokens and providers (e.g. when region is already loaded from persistence).
+ * - When V2 is enabled and userRegion is null: calls controller.init() once so
+ * tokens load when the Ramp UI mounts (backup if Engine init hasn't run or
+ * completed yet). Uses a ref to avoid duplicate in-flight init.
+ *
+ * Should be called from a top-level component that mounts early (e.g. FiatOrders in Main nav).
  */
 export function useHydrateRampsController(): void {
   const userRegion = useSelector(selectUserRegion);
   const isV2UnifiedEnabled = useRampsUnifiedV2Enabled();
+  const hasTriggeredInitRef = useRef(false);
 
   useEffect(() => {
-    if (isV2UnifiedEnabled && userRegion?.regionCode) {
-      const { RampsController } = Engine.context;
+    if (!isV2UnifiedEnabled) {
+      return;
+    }
+
+    const { RampsController } = Engine.context;
+
+    if (userRegion?.regionCode) {
       Promise.resolve(RampsController.hydrateState()).catch(() => {
         // Error is stored in state
       });
+      return;
+    }
+
+    // userRegion is null: ensure init runs so tokens load when Ramp UI is shown
+    // (backup to Engine init, which may not have run or completed yet).
+    if (!hasTriggeredInitRef.current) {
+      hasTriggeredInitRef.current = true;
+      Promise.resolve(RampsController.init())
+        .then(() => {
+          RampsController.startOrderPolling();
+        })
+        .catch(() => {
+          hasTriggeredInitRef.current = false;
+        });
     }
   }, [isV2UnifiedEnabled, userRegion?.regionCode]);
 }
diff --git a/app/components/UI/Ramp/hooks/useRampTokens.test.ts b/app/components/UI/Ramp/hooks/useRampTokens.test.ts
index 17f3f346f186..f0f0b0a6bca7 100644
--- a/app/components/UI/Ramp/hooks/useRampTokens.test.ts
+++ b/app/components/UI/Ramp/hooks/useRampTokens.test.ts
@@ -182,6 +182,29 @@ describe('useRampTokens', () => {
     });
   });
 
+  describe('fetchOnMount option', () => {
+    it('skips fetching tokens when fetchOnMount is false', () => {
+      const mockResponse = createMockResponse(
+        [createMockToken({ symbol: 'ETH' })],
+        [createMockToken({ symbol: 'ETH' })],
+      );
+      mockHandleFetch.mockResolvedValueOnce(mockResponse);
+
+      const { result } = renderHookWithProvider(
+        () => useRampTokens({ fetchOnMount: false }),
+        {
+          state: createMockState(UnifiedRampRoutingType.AGGREGATOR, 'us-ca'),
+        },
+      );
+
+      expect(result.current.topTokens).toBeNull();
+      expect(result.current.allTokens).toBeNull();
+      expect(result.current.isLoading).toBe(false);
+      expect(result.current.error).toBeNull();
+      expect(mockHandleFetch).not.toHaveBeenCalled();
+    });
+  });
+
   describe('environment-based URL selection', () => {
     it('uses production URL for production environment', async () => {
       process.env.METAMASK_ENVIRONMENT = 'production';
diff --git a/app/components/UI/Ramp/hooks/useRampTokens.ts b/app/components/UI/Ramp/hooks/useRampTokens.ts
index 7249f8218985..2c11858411ab 100644
--- a/app/components/UI/Ramp/hooks/useRampTokens.ts
+++ b/app/components/UI/Ramp/hooks/useRampTokens.ts
@@ -48,12 +48,18 @@ export interface UseRampTokensResult {
   error: Error | null;
 }
 
+interface UseRampTokensOptions {
+  fetchOnMount: boolean;
+}
+
 /**
  * Hook to fetch available tokens for ramp flows based on user region and routing decision.
  *
  * @returns An object containing top tokens, all tokens, loading state, and error state
  */
-export function useRampTokens(): UseRampTokensResult {
+export function useRampTokens(
+  { fetchOnMount }: UseRampTokensOptions = { fetchOnMount: true },
+): UseRampTokensResult {
   const [rawTopTokens, setRawTopTokens] = useState<RampsToken[] | null>(null);
   const [rawAllTokens, setRawAllTokens] = useState<RampsToken[] | null>(null);
   const [isLoading, setIsLoading] = useState(false);
@@ -126,8 +132,10 @@ export function useRampTokens(): UseRampTokensResult {
   }, [detectedGeolocation, rampRoutingDecision]);
 
   useEffect(() => {
-    fetchTokens();
-  }, [fetchTokens]);
+    if (fetchOnMount) {
+      fetchTokens();
+    }
+  }, [fetchTokens, fetchOnMount]);
 
   // Filter tokens to only include those for networks the user has added
   const topTokens = useMemo(() => {
diff --git a/app/components/UI/Ramp/hooks/useRampsButtonClickData.ts b/app/components/UI/Ramp/hooks/useRampsButtonClickData.ts
index 2b9794aaf407..1868700aa6c1 100644
--- a/app/components/UI/Ramp/hooks/useRampsButtonClickData.ts
+++ b/app/components/UI/Ramp/hooks/useRampsButtonClickData.ts
@@ -1,17 +1,16 @@
 import { useEffect, useMemo, useState } from 'react';
 import { useSelector } from 'react-redux';
-import { Order } from '@consensys/on-ramp-sdk';
-import type { RampsOrder } from '@metamask/ramps-controller';
 import {
   getOrders,
   getRampRoutingDecision,
   UnifiedRampRoutingType,
 } from '../../../../reducers/fiatOrders';
-import {
-  FIAT_ORDER_PROVIDERS,
-  FIAT_ORDER_STATES,
-} from '../../../../constants/on-ramp';
+import { selectRampsOrders } from '../../../../selectors/rampsController';
 import { getProviderToken } from '../Deposit/utils/ProviderTokenVault';
+import {
+  completedOrdersFromFiatOrders,
+  completedOrdersFromRampsOrders,
+} from '../utils/determinePreferredProvider';
 
 export interface RampsButtonClickData {
   ramp_routing?: UnifiedRampRoutingType;
@@ -22,6 +21,7 @@ export interface RampsButtonClickData {
 
 export function useRampsButtonClickData(): RampsButtonClickData {
   const orders = useSelector(getOrders);
+  const controllerOrders = useSelector(selectRampsOrders);
   const rampRoutingDecision = useSelector(getRampRoutingDecision);
   const [isAuthenticated, setIsAuthenticated] = useState<boolean>(false);
 
@@ -51,36 +51,19 @@ export function useRampsButtonClickData(): RampsButtonClickData {
   }, []);
 
   const data = useMemo(() => {
-    const orderCount = orders.length;
+    const orderCount = orders.length + controllerOrders.length;
 
-    // Get preferred provider from last completed order (matching useRampsSmartRouting pattern)
-    const completedOrders = orders.filter(
-      (order) => order.state === FIAT_ORDER_STATES.COMPLETED,
-    );
+    const completedOrders = [
+      ...completedOrdersFromFiatOrders(orders),
+      ...completedOrdersFromRampsOrders(controllerOrders),
+    ];
 
     let preferredProvider: string | undefined;
     if (completedOrders.length > 0) {
-      const [lastCompletedOrder] = completedOrders.sort(
-        (a, b) => b.createdAt - a.createdAt,
+      const [mostRecent] = [...completedOrders].sort(
+        (a, b) => b.completedAt - a.completedAt,
       );
-
-      if (
-        lastCompletedOrder.provider === FIAT_ORDER_PROVIDERS.AGGREGATOR ||
-        lastCompletedOrder.provider === FIAT_ORDER_PROVIDERS.RAMPS_V2
-      ) {
-        const orderData =
-          lastCompletedOrder.provider === FIAT_ORDER_PROVIDERS.RAMPS_V2
-            ? (lastCompletedOrder.data as RampsOrder)
-            : (lastCompletedOrder.data as Order);
-        preferredProvider = orderData?.provider?.id;
-      } else if (
-        lastCompletedOrder.provider === FIAT_ORDER_PROVIDERS.DEPOSIT ||
-        lastCompletedOrder.provider === FIAT_ORDER_PROVIDERS.TRANSAK
-      ) {
-        preferredProvider = 'TRANSAK';
-      } else {
-        preferredProvider = lastCompletedOrder.provider;
-      }
+      preferredProvider = mostRecent.providerId;
     }
 
     return {
@@ -89,7 +72,7 @@ export function useRampsButtonClickData(): RampsButtonClickData {
       preferred_provider: preferredProvider,
       order_count: orderCount,
     };
-  }, [orders, rampRoutingDecision, isAuthenticated]);
+  }, [orders, controllerOrders, rampRoutingDecision, isAuthenticated]);
 
   return data;
 }
diff --git a/app/components/UI/Ramp/hooks/useRampsController.test.ts b/app/components/UI/Ramp/hooks/useRampsController.test.ts
index de8331d55821..7956b37ee51e 100644
--- a/app/components/UI/Ramp/hooks/useRampsController.test.ts
+++ b/app/components/UI/Ramp/hooks/useRampsController.test.ts
@@ -70,6 +70,17 @@ jest.mock('./useRampsQuotes', () => ({
   })),
 }));
 
+jest.mock('./useRampsOrders', () => ({
+  useRampsOrders: jest.fn(() => ({
+    orders: [],
+    getOrderById: jest.fn(),
+    addOrder: jest.fn(),
+    removeOrder: jest.fn(),
+    refreshOrder: jest.fn(),
+    getOrderFromCallback: jest.fn(),
+  })),
+}));
+
 const createMockStore = () =>
   configureStore({
     reducer: {
@@ -135,6 +146,13 @@ describe('useRampsController', () => {
     expect(typeof result.current.setSelectedPaymentMethod).toBe('function');
     expect(typeof result.current.getQuotes).toBe('function');
     expect(typeof result.current.getWidgetUrl).toBe('function');
+
+    expect(result.current.orders).toEqual([]);
+    expect(typeof result.current.getOrderById).toBe('function');
+    expect(typeof result.current.addOrder).toBe('function');
+    expect(typeof result.current.removeOrder).toBe('function');
+    expect(typeof result.current.refreshOrder).toBe('function');
+    expect(typeof result.current.getOrderFromCallback).toBe('function');
   });
 
   it('calls child hooks', () => {
diff --git a/app/components/UI/Ramp/hooks/useRampsController.ts b/app/components/UI/Ramp/hooks/useRampsController.ts
index f9a7be8f2a2f..e7ca1dcc1f2b 100644
--- a/app/components/UI/Ramp/hooks/useRampsController.ts
+++ b/app/components/UI/Ramp/hooks/useRampsController.ts
@@ -16,6 +16,7 @@ import {
   type UseRampsPaymentMethodsResult,
 } from './useRampsPaymentMethods';
 import { useRampsQuotes, type UseRampsQuotesResult } from './useRampsQuotes';
+import { useRampsOrders, type UseRampsOrdersResult } from './useRampsOrders';
 
 /**
  * Result returned by the useRampsController hook.
@@ -57,6 +58,14 @@ export interface UseRampsControllerResult {
   // Quotes
   getQuotes: UseRampsQuotesResult['getQuotes'];
   getWidgetUrl: UseRampsQuotesResult['getWidgetUrl'];
+
+  // Orders
+  orders: UseRampsOrdersResult['orders'];
+  getOrderById: UseRampsOrdersResult['getOrderById'];
+  addOrder: UseRampsOrdersResult['addOrder'];
+  removeOrder: UseRampsOrdersResult['removeOrder'];
+  refreshOrder: UseRampsOrdersResult['refreshOrder'];
+  getOrderFromCallback: UseRampsOrdersResult['getOrderFromCallback'];
 }
 
 /**
@@ -140,12 +149,19 @@ export function useRampsController(): UseRampsControllerResult {
 
   const { getQuotes, getWidgetUrl } = useRampsQuotes();
 
+  const {
+    orders,
+    getOrderById,
+    addOrder,
+    removeOrder,
+    refreshOrder,
+    getOrderFromCallback,
+  } = useRampsOrders();
+
   return {
-    // User region
     userRegion,
     setUserRegion,
 
-    // Selected provider
     selectedProvider,
     setSelectedProvider,
 
@@ -153,28 +169,31 @@ export function useRampsController(): UseRampsControllerResult {
     providersLoading,
     providersError,
 
-    // Tokens
     tokens,
     selectedToken,
     setSelectedToken,
     tokensLoading,
     tokensError,
 
-    // Countries
     countries,
     countriesLoading,
     countriesError,
 
-    // Payment methods
     paymentMethods,
     selectedPaymentMethod,
     setSelectedPaymentMethod,
     paymentMethodsLoading,
     paymentMethodsError,
 
-    // Quotes
     getQuotes,
     getWidgetUrl,
+
+    orders,
+    getOrderById,
+    addOrder,
+    removeOrder,
+    refreshOrder,
+    getOrderFromCallback,
   };
 }
 
diff --git a/app/components/UI/Ramp/hooks/useRampsOrders.test.ts b/app/components/UI/Ramp/hooks/useRampsOrders.test.ts
new file mode 100644
index 000000000000..e5996b24eb5b
--- /dev/null
+++ b/app/components/UI/Ramp/hooks/useRampsOrders.test.ts
@@ -0,0 +1,197 @@
+import { renderHook, act } from '@testing-library/react-native';
+import { Provider } from 'react-redux';
+import { configureStore } from '@reduxjs/toolkit';
+import React from 'react';
+import { RampsOrderStatus, type RampsOrder } from '@metamask/ramps-controller';
+import { useRampsOrders } from './useRampsOrders';
+
+const mockAddOrder = jest.fn();
+const mockRemoveOrder = jest.fn();
+const mockGetOrder = jest.fn();
+const mockGetOrderFromCallback = jest.fn();
+
+jest.mock('../../../../core/Engine', () => ({
+  context: {
+    RampsController: {
+      addOrder: (...args: unknown[]) => mockAddOrder(...args),
+      removeOrder: (...args: unknown[]) => mockRemoveOrder(...args),
+      getOrder: (...args: unknown[]) => mockGetOrder(...args),
+      getOrderFromCallback: (...args: unknown[]) =>
+        mockGetOrderFromCallback(...args),
+    },
+  },
+}));
+
+const createMockOrder = (overrides: Partial<RampsOrder> = {}): RampsOrder => ({
+  isOnlyLink: false,
+  success: true,
+  cryptoAmount: '0.5',
+  fiatAmount: 100,
+  providerOrderId: 'order-1',
+  providerOrderLink: 'https://example.com/order/1',
+  createdAt: Date.now(),
+  totalFeesFiat: 5,
+  txHash: '0xabc',
+  walletAddress: '0x123',
+  status: RampsOrderStatus.Completed,
+  network: { name: 'Ethereum', chainId: 'eip155:1' },
+  canBeUpdated: false,
+  idHasExpired: false,
+  excludeFromPurchases: false,
+  timeDescriptionPending: '5-10 minutes',
+  orderType: 'BUY',
+  ...overrides,
+});
+
+const createMockStore = (orders: RampsOrder[] = []) =>
+  configureStore({
+    reducer: {
+      engine: () => ({
+        backgroundState: {
+          RampsController: {
+            orders,
+          },
+        },
+      }),
+    },
+  });
+
+const wrapper = (store: ReturnType<typeof createMockStore>) =>
+  function Wrapper({ children }: { children: React.ReactNode }) {
+    return React.createElement(Provider, { store } as never, children);
+  };
+
+describe('useRampsOrders', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  it('returns empty orders when none exist', () => {
+    const store = createMockStore();
+    const { result } = renderHook(() => useRampsOrders(), {
+      wrapper: wrapper(store),
+    });
+
+    expect(result.current.orders).toEqual([]);
+  });
+
+  it('returns orders from the store', () => {
+    const order = createMockOrder();
+    const store = createMockStore([order]);
+    const { result } = renderHook(() => useRampsOrders(), {
+      wrapper: wrapper(store),
+    });
+
+    expect(result.current.orders).toEqual([order]);
+  });
+
+  it('finds an order by providerOrderId', () => {
+    const order1 = createMockOrder({ providerOrderId: 'order-1' });
+    const order2 = createMockOrder({ providerOrderId: 'order-2' });
+    const store = createMockStore([order1, order2]);
+    const { result } = renderHook(() => useRampsOrders(), {
+      wrapper: wrapper(store),
+    });
+
+    expect(result.current.getOrderById('order-2')).toEqual(order2);
+  });
+
+  it('returns undefined for non-existent order id', () => {
+    const store = createMockStore([createMockOrder()]);
+    const { result } = renderHook(() => useRampsOrders(), {
+      wrapper: wrapper(store),
+    });
+
+    expect(result.current.getOrderById('non-existent')).toBeUndefined();
+  });
+
+  it('calls Engine.context.RampsController.addOrder', () => {
+    const store = createMockStore();
+    const { result } = renderHook(() => useRampsOrders(), {
+      wrapper: wrapper(store),
+    });
+    const order = createMockOrder();
+
+    act(() => {
+      result.current.addOrder(order);
+    });
+
+    expect(mockAddOrder).toHaveBeenCalledWith(order);
+  });
+
+  it('calls Engine.context.RampsController.removeOrder', () => {
+    const store = createMockStore();
+    const { result } = renderHook(() => useRampsOrders(), {
+      wrapper: wrapper(store),
+    });
+
+    act(() => {
+      result.current.removeOrder('order-1');
+    });
+
+    expect(mockRemoveOrder).toHaveBeenCalledWith('order-1');
+  });
+
+  it('calls Engine.context.RampsController.getOrder for refreshOrder', async () => {
+    const refreshedOrder = createMockOrder({
+      status: RampsOrderStatus.Completed,
+    });
+    mockGetOrder.mockResolvedValue(refreshedOrder);
+
+    const store = createMockStore();
+    const { result } = renderHook(() => useRampsOrders(), {
+      wrapper: wrapper(store),
+    });
+
+    let returnedOrder: RampsOrder | undefined;
+    await act(async () => {
+      returnedOrder = await result.current.refreshOrder(
+        'transak',
+        'order-code',
+        '0x123',
+      );
+    });
+
+    expect(mockGetOrder).toHaveBeenCalledWith('transak', 'order-code', '0x123');
+    expect(returnedOrder).toEqual(refreshedOrder);
+  });
+
+  it('calls Engine.context.RampsController.getOrderFromCallback', async () => {
+    const callbackOrder = createMockOrder({ providerOrderId: 'callback-1' });
+    mockGetOrderFromCallback.mockResolvedValue(callbackOrder);
+
+    const store = createMockStore();
+    const { result } = renderHook(() => useRampsOrders(), {
+      wrapper: wrapper(store),
+    });
+
+    let returnedOrder: RampsOrder | undefined;
+    await act(async () => {
+      returnedOrder = await result.current.getOrderFromCallback(
+        'transak',
+        'https://callback.url',
+        '0x123',
+      );
+    });
+
+    expect(mockGetOrderFromCallback).toHaveBeenCalledWith(
+      'transak',
+      'https://callback.url',
+      '0x123',
+    );
+    expect(returnedOrder).toEqual(callbackOrder);
+  });
+
+  it('exposes all expected functions', () => {
+    const store = createMockStore();
+    const { result } = renderHook(() => useRampsOrders(), {
+      wrapper: wrapper(store),
+    });
+
+    expect(typeof result.current.getOrderById).toBe('function');
+    expect(typeof result.current.addOrder).toBe('function');
+    expect(typeof result.current.removeOrder).toBe('function');
+    expect(typeof result.current.refreshOrder).toBe('function');
+    expect(typeof result.current.getOrderFromCallback).toBe('function');
+  });
+});
diff --git a/app/components/UI/Ramp/hooks/useRampsOrders.ts b/app/components/UI/Ramp/hooks/useRampsOrders.ts
new file mode 100644
index 000000000000..fac5e7ead232
--- /dev/null
+++ b/app/components/UI/Ramp/hooks/useRampsOrders.ts
@@ -0,0 +1,70 @@
+import { useCallback } from 'react';
+import { useSelector } from 'react-redux';
+import type { RampsOrder } from '@metamask/ramps-controller';
+import Engine from '../../../../core/Engine';
+import { selectRampsOrders } from '../../../../selectors/rampsController';
+
+export interface UseRampsOrdersResult {
+  orders: RampsOrder[];
+  getOrderById: (providerOrderId: string) => RampsOrder | undefined;
+  addOrder: (order: RampsOrder) => void;
+  removeOrder: (providerOrderId: string) => void;
+  refreshOrder: (
+    providerCode: string,
+    orderCode: string,
+    wallet: string,
+  ) => Promise<RampsOrder>;
+  getOrderFromCallback: (
+    providerCode: string,
+    callbackUrl: string,
+    wallet: string,
+  ) => Promise<RampsOrder>;
+}
+
+export function useRampsOrders(): UseRampsOrdersResult {
+  const orders = useSelector(selectRampsOrders);
+
+  const getOrderById = useCallback(
+    (providerOrderId: string) =>
+      orders.find((o) => o.providerOrderId === providerOrderId),
+    [orders],
+  );
+
+  const addOrder = useCallback(
+    (order: RampsOrder) => Engine.context.RampsController.addOrder(order),
+    [],
+  );
+
+  const removeOrder = useCallback(
+    (providerOrderId: string) =>
+      Engine.context.RampsController.removeOrder(providerOrderId),
+    [],
+  );
+
+  const refreshOrder = useCallback(
+    (providerCode: string, orderCode: string, wallet: string) =>
+      Engine.context.RampsController.getOrder(providerCode, orderCode, wallet),
+    [],
+  );
+
+  const getOrderFromCallback = useCallback(
+    (providerCode: string, callbackUrl: string, wallet: string) =>
+      Engine.context.RampsController.getOrderFromCallback(
+        providerCode,
+        callbackUrl,
+        wallet,
+      ),
+    [],
+  );
+
+  return {
+    orders,
+    getOrderById,
+    addOrder,
+    removeOrder,
+    refreshOrder,
+    getOrderFromCallback,
+  };
+}
+
+export default useRampsOrders;
diff --git a/app/components/UI/Ramp/hooks/useRampsProviders.test.ts b/app/components/UI/Ramp/hooks/useRampsProviders.test.ts
index 303dce29e2a7..06ddbdf08268 100644
--- a/app/components/UI/Ramp/hooks/useRampsProviders.test.ts
+++ b/app/components/UI/Ramp/hooks/useRampsProviders.test.ts
@@ -28,6 +28,8 @@ jest.mock(
 
 jest.mock('../utils/determinePreferredProvider', () => ({
   determinePreferredProvider: jest.fn(),
+  completedOrdersFromFiatOrders: jest.fn(() => []),
+  completedOrdersFromRampsOrders: jest.fn(() => []),
 }));
 
 const emptyOrders: FiatOrder[] = [];
@@ -80,6 +82,7 @@ const createMockStore = (providersState = {}) =>
               error: null,
               ...providersState,
             },
+            orders: [],
           },
         },
       }),
@@ -214,7 +217,7 @@ describe('useRampsProviders', () => {
         typeof determinePreferredProvider
       >;
 
-    it('calls determinePreferredProvider with orders and providers when providers exist and selectedProvider is null', () => {
+    it('calls determinePreferredProvider with completed orders and providers when providers exist and selectedProvider is null', () => {
       const store = createMockStore({ data: mockProviders });
       mockGetOrders.mockReturnValue(emptyOrders);
       mockDeterminePreferredProvider.mockReturnValue(mockProviders[0]);
@@ -224,7 +227,7 @@ describe('useRampsProviders', () => {
       });
 
       expect(mockDeterminePreferredProvider).toHaveBeenCalledWith(
-        emptyOrders,
+        expect.any(Array),
         mockProviders,
       );
     });
diff --git a/app/components/UI/Ramp/hooks/useRampsProviders.ts b/app/components/UI/Ramp/hooks/useRampsProviders.ts
index 3ffcff602b24..66447e34fd22 100644
--- a/app/components/UI/Ramp/hooks/useRampsProviders.ts
+++ b/app/components/UI/Ramp/hooks/useRampsProviders.ts
@@ -1,9 +1,16 @@
-import { useCallback, useEffect } from 'react';
+import { useCallback, useEffect, useMemo } from 'react';
 import { useSelector } from 'react-redux';
-import { selectProviders } from '../../../../selectors/rampsController';
+import {
+  selectProviders,
+  selectRampsOrders,
+} from '../../../../selectors/rampsController';
 import { type Provider } from '@metamask/ramps-controller';
 import Engine from '../../../../core/Engine';
-import { determinePreferredProvider } from '../utils/determinePreferredProvider';
+import {
+  determinePreferredProvider,
+  completedOrdersFromFiatOrders,
+  completedOrdersFromRampsOrders,
+} from '../utils/determinePreferredProvider';
 import { getOrders } from '../../../../reducers/fiatOrders';
 
 /**
@@ -47,7 +54,16 @@ export function useRampsProviders(): UseRampsProvidersResult {
     error,
   } = useSelector(selectProviders);
 
-  const orders = useSelector(getOrders);
+  const legacyOrders = useSelector(getOrders);
+  const controllerOrders = useSelector(selectRampsOrders);
+
+  const completedOrders = useMemo(
+    () => [
+      ...completedOrdersFromFiatOrders(legacyOrders),
+      ...completedOrdersFromRampsOrders(controllerOrders),
+    ],
+    [legacyOrders, controllerOrders],
+  );
 
   const setSelectedProvider = useCallback(
     (provider: Provider | null) =>
@@ -57,9 +73,11 @@ export function useRampsProviders(): UseRampsProvidersResult {
 
   useEffect(() => {
     if (providers.length > 0 && !selectedProvider) {
-      setSelectedProvider(determinePreferredProvider(orders, providers));
+      setSelectedProvider(
+        determinePreferredProvider(completedOrders, providers),
+      );
     }
-  }, [providers, selectedProvider, setSelectedProvider, orders]);
+  }, [providers, selectedProvider, setSelectedProvider, completedOrders]);
 
   return {
     providers,
diff --git a/app/components/UI/Ramp/hooks/useTokenBuyability.test.ts b/app/components/UI/Ramp/hooks/useTokenBuyability.test.ts
index 83e22bf563de..c0a8bfd706f9 100644
--- a/app/components/UI/Ramp/hooks/useTokenBuyability.test.ts
+++ b/app/components/UI/Ramp/hooks/useTokenBuyability.test.ts
@@ -1,5 +1,6 @@
 import { renderHook } from '@testing-library/react-native';
-import { useTokenBuyability } from './useTokenBuyability';
+// eslint-disable-next-line import/no-namespace
+import * as tokenBuyabilityModule from './useTokenBuyability';
 import {
   useRampTokens,
   UseRampTokensResult,
@@ -8,6 +9,7 @@ import {
 import { useRampsTokens } from './useRampsTokens';
 import useRampsUnifiedV2Enabled from './useRampsUnifiedV2Enabled';
 import { TokenI } from '../../Tokens/types';
+import parseRampIntent from '../utils/parseRampIntent';
 
 jest.mock('./useRampTokens', () => ({
   useRampTokens: jest.fn(),
@@ -18,33 +20,40 @@ jest.mock('./useRampsTokens', () => ({
 }));
 
 jest.mock('./useRampsUnifiedV2Enabled', () => jest.fn());
+jest.mock('../utils/parseRampIntent', () => jest.fn());
 
 const mockUseRampTokens = jest.mocked(useRampTokens);
 const mockUseRampsTokens = jest.mocked(useRampsTokens);
 const mockUseRampsUnifiedV2Enabled = jest.mocked(useRampsUnifiedV2Enabled);
+const mockParseRampIntent = jest.mocked(parseRampIntent);
 
 describe('useTokenBuyability', () => {
-  const getMockToken = (overrides: Partial<TokenI> = {}): TokenI =>
-    ({
-      address: '0x6b175474e89094c44da98b954eedeac495271d0f',
-      symbol: 'DAI',
-      name: 'Dai Stablecoin',
-      decimals: 18,
-      chainId: '0x1',
-      ...overrides,
-    }) as TokenI;
-
-  const getMockRampToken = (overrides: Record<string, unknown> = {}) =>
-    ({
-      name: 'Mock Token',
-      symbol: 'MOCK',
-      decimals: 18,
-      iconUrl: 'https://example.com/icon.png',
-      assetId: '',
-      chainId: '',
-      tokenSupported: false,
-      ...overrides,
-    }) as unknown as RampsToken;
+  const getMockToken = (overrides: Partial<TokenI> = {}): TokenI => ({
+    address: '0x6b175474e89094c44da98b954eedeac495271d0f',
+    symbol: 'DAI',
+    name: 'Dai Stablecoin',
+    decimals: 18,
+    chainId: '0x1',
+    image: '',
+    logo: undefined,
+    balance: '0',
+    isETH: false,
+    isNative: false,
+    ...overrides,
+  });
+
+  const getMockRampToken = (
+    overrides: Partial<RampsToken> = {},
+  ): RampsToken => ({
+    name: 'Mock Token',
+    symbol: 'MOCK',
+    decimals: 18,
+    iconUrl: 'https://example.com/icon.png',
+    assetId: 'eip155:1/erc20:0x0000000000000000000000000000000000000000',
+    chainId: 'eip155:1',
+    tokenSupported: false,
+    ...overrides,
+  });
 
   const setupV1Mocks = (): void => {
     mockUseRampsUnifiedV2Enabled.mockReturnValue(false);
@@ -67,9 +76,180 @@ describe('useTokenBuyability', () => {
 
   beforeEach(() => {
     jest.clearAllMocks();
+    mockParseRampIntent.mockReturnValue({
+      assetId: 'eip155:1/erc20:0x6b175474e89094c44da98b954eedeac495271d0f',
+    });
     setupV1Mocks();
   });
 
+  describe('useTokensBuyability', () => {
+    it('maps buyability for multiple tokens by token key', () => {
+      const firstToken = getMockToken({
+        address: '0x6b175474e89094c44da98b954eedeac495271d0f',
+      });
+      const secondToken = getMockToken({
+        address: '0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48',
+      });
+
+      mockUseRampTokens.mockReturnValue({
+        allTokens: [
+          getMockRampToken({
+            assetId:
+              'eip155:1/erc20:0x6b175474e89094c44da98b954eedeac495271d0f',
+            tokenSupported: true,
+          }),
+          getMockRampToken({
+            assetId:
+              'eip155:1/erc20:0xa0b86991c6218b36c1d19d4a2e9eb0ce3606eb48',
+            tokenSupported: false,
+          }),
+        ],
+        isLoading: false,
+      } as UseRampTokensResult);
+
+      mockParseRampIntent.mockImplementation(({ address }) => ({
+        assetId: `eip155:1/erc20:${address?.toLowerCase()}`,
+      }));
+
+      const { result } = renderHook(() =>
+        tokenBuyabilityModule.useTokensBuyability([firstToken, secondToken]),
+      );
+
+      expect(result.current.buyabilityByTokenKey).toEqual({
+        [tokenBuyabilityModule.getTokenBuyabilityKey(firstToken)]: true,
+        [tokenBuyabilityModule.getTokenBuyabilityKey(secondToken)]: false,
+      });
+    });
+
+    it('returns loading from controller tokens when v2 is enabled', () => {
+      setupV2Mocks();
+      mockUseRampsTokens.mockReturnValue({
+        tokens: null,
+        selectedToken: null,
+        setSelectedToken: jest.fn(),
+        isLoading: true,
+        error: null,
+      });
+
+      const { result } = renderHook(() =>
+        tokenBuyabilityModule.useTokensBuyability([getMockToken()]),
+      );
+
+      expect(result.current.isLoading).toBe(true);
+      expect(mockUseRampTokens).toHaveBeenCalledWith({ fetchOnMount: false });
+    });
+
+    it('returns loading from legacy tokens when v2 is disabled', () => {
+      setupV1Mocks();
+      mockUseRampTokens.mockReturnValue({
+        allTokens: null,
+        isLoading: true,
+      } as UseRampTokensResult);
+
+      const { result } = renderHook(() =>
+        tokenBuyabilityModule.useTokensBuyability([getMockToken()]),
+      );
+
+      expect(result.current.isLoading).toBe(true);
+      expect(mockUseRampTokens).toHaveBeenCalledWith({ fetchOnMount: true });
+    });
+
+    it('does not call parseRampIntent when token address is already a CAIP asset type', () => {
+      const caipToken = getMockToken({
+        address: 'eip155:1/erc20:0x6b175474e89094c44da98b954eedeac495271d0f',
+        chainId: 'eip155:1',
+      });
+      mockUseRampTokens.mockReturnValue({
+        allTokens: [
+          getMockRampToken({
+            assetId:
+              'eip155:1/erc20:0x6b175474e89094c44da98b954eedeac495271d0f',
+            tokenSupported: true,
+          }),
+        ],
+        isLoading: false,
+      } as UseRampTokensResult);
+
+      const { result } = renderHook(() =>
+        tokenBuyabilityModule.useTokensBuyability([caipToken]),
+      );
+
+      expect(result.current.buyabilityByTokenKey).toEqual({
+        [tokenBuyabilityModule.getTokenBuyabilityKey(caipToken)]: true,
+      });
+      expect(mockParseRampIntent).not.toHaveBeenCalled();
+    });
+
+    it('returns false when mockParseRampIntent parsing throws', () => {
+      mockParseRampIntent.mockImplementation(() => {
+        throw new Error('parse failed');
+      });
+      mockUseRampTokens.mockReturnValue({
+        allTokens: [
+          getMockRampToken({
+            assetId:
+              'eip155:1/erc20:0x6b175474e89094c44da98b954eedeac495271d0f',
+            tokenSupported: true,
+          }),
+        ],
+        isLoading: false,
+      } as UseRampTokensResult);
+
+      const { result } = renderHook(() =>
+        tokenBuyabilityModule.useTokensBuyability([getMockToken()]),
+      );
+
+      expect(result.current.buyabilityByTokenKey).toEqual({
+        [tokenBuyabilityModule.getTokenBuyabilityKey(getMockToken())]: false,
+      });
+    });
+
+    it('returns false for native token when chainId differs', () => {
+      const nativeToken = getMockToken({ isNative: true, chainId: '0x1' });
+      mockUseRampTokens.mockReturnValue({
+        allTokens: [
+          getMockRampToken({
+            assetId: 'eip155:10/slip44:60',
+            chainId: 'eip155:10',
+            tokenSupported: true,
+          }),
+        ],
+        isLoading: false,
+      } as UseRampTokensResult);
+
+      const { result } = renderHook(() =>
+        tokenBuyabilityModule.useTokensBuyability([nativeToken]),
+      );
+
+      expect(result.current.buyabilityByTokenKey).toEqual({
+        [tokenBuyabilityModule.getTokenBuyabilityKey(nativeToken)]: false,
+      });
+    });
+
+    it('returns false for native token when assetId is not slip44', () => {
+      const nativeToken = getMockToken({ isNative: true, chainId: '0x1' });
+      mockUseRampTokens.mockReturnValue({
+        allTokens: [
+          getMockRampToken({
+            assetId:
+              'eip155:1/erc20:0x6b175474e89094c44da98b954eedeac495271d0f',
+            chainId: 'eip155:1',
+            tokenSupported: true,
+          }),
+        ],
+        isLoading: false,
+      } as UseRampTokensResult);
+
+      const { result } = renderHook(() =>
+        tokenBuyabilityModule.useTokensBuyability([nativeToken]),
+      );
+
+      expect(result.current.buyabilityByTokenKey).toEqual({
+        [tokenBuyabilityModule.getTokenBuyabilityKey(nativeToken)]: false,
+      });
+    });
+  });
+
   describe('when V2 is disabled (legacy flow)', () => {
     const testCases = [
       {
@@ -87,11 +267,12 @@ describe('useTokenBuyability', () => {
       {
         testName: 'token is in the list but not supported',
         hookReturn: [
-          {
-            address: '0x6b175474e89094c44da98b954eedeac495271d0f',
+          getMockRampToken({
+            assetId:
+              'eip155:1/erc20:0x6b175474e89094c44da98b954eedeac495271d0f',
             chainId: 'eip155:1',
             tokenSupported: false,
-          },
+          }),
         ],
         token: getMockToken(),
         expectedBuyable: false,
@@ -131,20 +312,37 @@ describe('useTokenBuyability', () => {
           isLoading: false,
         } as UseRampTokensResult);
 
-        const { result } = renderHook(() => useTokenBuyability(token));
+        const { result } = renderHook(() =>
+          tokenBuyabilityModule.useTokenBuyability(token),
+        );
 
         expect(result.current.isBuyable).toBe(expectedBuyable);
         expect(result.current.isLoading).toBe(false);
       },
     );
 
+    it('ignores ramp entries without assetId', () => {
+      mockUseRampTokens.mockReturnValue({
+        allTokens: [getMockRampToken({ assetId: '' })],
+        isLoading: false,
+      } as UseRampTokensResult);
+
+      const { result } = renderHook(() =>
+        tokenBuyabilityModule.useTokenBuyability(getMockToken()),
+      );
+
+      expect(result.current.isBuyable).toBe(false);
+    });
+
     it('returns isLoading: true when ramp tokens are loading', () => {
       mockUseRampTokens.mockReturnValue({
         allTokens: null,
         isLoading: true,
       } as UseRampTokensResult);
 
-      const { result } = renderHook(() => useTokenBuyability(getMockToken()));
+      const { result } = renderHook(() =>
+        tokenBuyabilityModule.useTokenBuyability(getMockToken()),
+      );
 
       expect(result.current.isBuyable).toBe(false);
       expect(result.current.isLoading).toBe(true);
@@ -165,7 +363,9 @@ describe('useTokenBuyability', () => {
         error: null,
       });
 
-      const { result } = renderHook(() => useTokenBuyability(getMockToken()));
+      const { result } = renderHook(() =>
+        tokenBuyabilityModule.useTokenBuyability(getMockToken()),
+      );
 
       expect(result.current.isBuyable).toBe(false);
     });
@@ -190,7 +390,9 @@ describe('useTokenBuyability', () => {
         error: null,
       });
 
-      const { result } = renderHook(() => useTokenBuyability(getMockToken()));
+      const { result } = renderHook(() =>
+        tokenBuyabilityModule.useTokenBuyability(getMockToken()),
+      );
 
       expect(result.current.isBuyable).toBe(true);
     });
@@ -213,7 +415,9 @@ describe('useTokenBuyability', () => {
         error: null,
       });
 
-      const { result } = renderHook(() => useTokenBuyability(getMockToken()));
+      const { result } = renderHook(() =>
+        tokenBuyabilityModule.useTokenBuyability(getMockToken()),
+      );
 
       expect(result.current.isBuyable).toBe(false);
     });
@@ -227,7 +431,9 @@ describe('useTokenBuyability', () => {
         error: null,
       });
 
-      const { result } = renderHook(() => useTokenBuyability(getMockToken()));
+      const { result } = renderHook(() =>
+        tokenBuyabilityModule.useTokenBuyability(getMockToken()),
+      );
 
       expect(result.current.isBuyable).toBe(false);
       expect(result.current.isLoading).toBe(true);
@@ -257,7 +463,9 @@ describe('useTokenBuyability', () => {
         error: null,
       });
 
-      const { result } = renderHook(() => useTokenBuyability(getMockToken()));
+      const { result } = renderHook(() =>
+        tokenBuyabilityModule.useTokenBuyability(getMockToken()),
+      );
 
       // V2 enabled: uses only V2 controller tokens, no legacy fallback
       expect(result.current.isBuyable).toBe(false);
@@ -294,10 +502,42 @@ describe('useTokenBuyability', () => {
         error: null,
       });
 
-      const { result } = renderHook(() => useTokenBuyability(getMockToken()));
+      const { result } = renderHook(() =>
+        tokenBuyabilityModule.useTokenBuyability(getMockToken()),
+      );
 
       // V2 controller has tokens but NOT this one: not buyable (ignores legacy)
       expect(result.current.isBuyable).toBe(false);
     });
   });
+
+  describe('single token wrapper contract', () => {
+    it('returns the same result as batch buyability for one token', () => {
+      const token = getMockToken();
+      setupV1Mocks();
+      mockUseRampTokens.mockReturnValue({
+        allTokens: [
+          getMockRampToken({
+            assetId:
+              'eip155:1/erc20:0x6b175474e89094c44da98b954eedeac495271d0f',
+            tokenSupported: true,
+          }),
+        ],
+        isLoading: false,
+      } as UseRampTokensResult);
+
+      const { result } = renderHook(() =>
+        tokenBuyabilityModule.useTokenBuyability(token),
+      );
+      const { result: batchResult } = renderHook(() =>
+        tokenBuyabilityModule.useTokensBuyability([token]),
+      );
+
+      const tokenKey = tokenBuyabilityModule.getTokenBuyabilityKey(token);
+      expect(result.current.isBuyable).toBe(
+        batchResult.current.buyabilityByTokenKey[tokenKey] ?? false,
+      );
+      expect(result.current.isLoading).toBe(batchResult.current.isLoading);
+    });
+  });
 });
diff --git a/app/components/UI/Ramp/hooks/useTokenBuyability.ts b/app/components/UI/Ramp/hooks/useTokenBuyability.ts
index c59630abdcbe..aa9c48c33915 100644
--- a/app/components/UI/Ramp/hooks/useTokenBuyability.ts
+++ b/app/components/UI/Ramp/hooks/useTokenBuyability.ts
@@ -1,5 +1,10 @@
 import { useMemo } from 'react';
-import { Hex, isCaipChainId, isCaipAssetType } from '@metamask/utils';
+import {
+  Hex,
+  isCaipChainId,
+  isCaipAssetType,
+  isHexString,
+} from '@metamask/utils';
 import { TokenI } from '../../Tokens/types';
 import { useRampTokens } from './useRampTokens';
 import { useRampsTokens } from './useRampsTokens';
@@ -13,6 +18,17 @@ export interface UseTokenBuyabilityResult {
   isLoading: boolean;
 }
 
+interface UseTokensBuyabilityResult {
+  buyabilityByTokenKey: Record<string, boolean>;
+  isLoading: boolean;
+}
+
+interface BuyabilityTokenSource {
+  assetId?: string;
+  chainId?: string;
+  tokenSupported?: boolean;
+}
+
 /**
  * Builds the CAIP-19 assetId for a token, matching the format used by
  * useTokenActions.onBuy when navigating to the ramp flow.
@@ -31,44 +47,105 @@ function buildRampAssetId(token: TokenI): string | undefined {
   }
 }
 
+function getTokenCaipChainId(token: TokenI): string {
+  if (!token.chainId) {
+    return 'unknown-chain';
+  }
+
+  if (isCaipChainId(token.chainId)) {
+    return token.chainId;
+  }
+
+  if (isHexString(token.chainId)) {
+    return toEvmCaipChainId(token.chainId as Hex);
+  }
+
+  return token.chainId;
+}
+
+export function getTokenBuyabilityKey(token: TokenI): string {
+  const caipChainId = getTokenCaipChainId(token);
+  return `${caipChainId}:${token.address.toLowerCase()}`;
+}
+
+function getIsTokenBuyable(
+  token: TokenI,
+  rampsTokens: BuyabilityTokenSource[] | null,
+): boolean {
+  if (!rampsTokens) {
+    return false;
+  }
+
+  const chainId = getTokenCaipChainId(token);
+  const assetId = buildRampAssetId(token);
+  const isNative = token.isNative ?? false;
+
+  const match = rampsTokens.find((rampToken) => {
+    if (!rampToken.assetId) {
+      return false;
+    }
+
+    if (isNative) {
+      return (
+        rampToken.chainId === chainId && rampToken.assetId.includes('/slip44:')
+      );
+    }
+
+    return assetId
+      ? rampToken.assetId.toLowerCase() === assetId.toLowerCase()
+      : false;
+  });
+
+  return match?.tokenSupported ?? false;
+}
+
 /**
- * Hook that determines if a token can be bought via ramp services.
+ * Hook that determines if tokens can be bought via ramp services.
  * When unified V2 is enabled, checks against the RampsController's token list.
  * When V2 is disabled, uses the legacy token cache API.
  */
-export const useTokenBuyability = (token: TokenI): UseTokenBuyabilityResult => {
+export const useTokensBuyability = (
+  tokens: TokenI[],
+): UseTokensBuyabilityResult => {
   const isV2Enabled = useRampsUnifiedV2Enabled();
   const { allTokens: legacyAllTokens, isLoading: legacyLoading } =
-    useRampTokens();
+    useRampTokens({
+      fetchOnMount: !isV2Enabled,
+    });
   const { tokens: controllerTokens, isLoading: controllerLoading } =
     useRampsTokens();
 
   const isLoading = isV2Enabled ? controllerLoading : legacyLoading;
 
-  const isBuyable = useMemo(() => {
-    const tokens = isV2Enabled ? controllerTokens?.allTokens : legacyAllTokens;
-    if (!tokens) return false;
-
-    const chainId = isCaipChainId(token.chainId)
-      ? token.chainId
-      : toEvmCaipChainId(token.chainId as Hex);
-    const assetId = buildRampAssetId(token);
-    const isNative = token.isNative ?? false;
-
-    const match = tokens.find((tok) => {
-      if (!tok.assetId) return false;
-      if (isNative) {
-        return tok.chainId === chainId && tok.assetId.includes('/slip44:');
-      }
-      return assetId
-        ? tok.assetId.toLowerCase() === assetId.toLowerCase()
-        : false;
-    });
+  const rampsTokens = isV2Enabled
+    ? controllerTokens?.allTokens
+    : legacyAllTokens;
+  const buyabilityByTokenKey = useMemo(
+    () =>
+      tokens.reduce<Record<string, boolean>>((accumulator, token) => {
+        const tokenKey = getTokenBuyabilityKey(token);
+        accumulator[tokenKey] = getIsTokenBuyable(token, rampsTokens ?? null);
+        return accumulator;
+      }, {}),
+    [tokens, rampsTokens],
+  );
+
+  return { buyabilityByTokenKey, isLoading };
+};
+
+/**
+ * Hook that determines if a token can be bought via ramp services.
+ * Wrapper around useTokensBuyability for backwards compatibility.
+ */
+export const useTokenBuyability = (token: TokenI): UseTokenBuyabilityResult => {
+  const memoizedTokens = useMemo(() => [token], [token]);
+
+  const { buyabilityByTokenKey, isLoading } =
+    useTokensBuyability(memoizedTokens);
 
-    return match?.tokenSupported ?? false;
-  }, [isV2Enabled, controllerTokens, legacyAllTokens, token]);
+  const tokenKey = getTokenBuyabilityKey(token);
 
-  return { isBuyable, isLoading };
+  return { isBuyable: buyabilityByTokenKey[tokenKey] ?? false, isLoading };
 };
 
 export default useTokenBuyability;
diff --git a/app/components/UI/Ramp/hooks/useTransakRouting.test.ts b/app/components/UI/Ramp/hooks/useTransakRouting.test.ts
index 67c2b67be038..c296ce262f69 100644
--- a/app/components/UI/Ramp/hooks/useTransakRouting.test.ts
+++ b/app/components/UI/Ramp/hooks/useTransakRouting.test.ts
@@ -45,10 +45,22 @@ jest.mock('../../../../../locales/i18n', () => ({
   },
 }));
 
-const mockHandleNewOrder = jest.fn();
-jest.mock('../Deposit/hooks/useHandleNewOrder', () => ({
-  __esModule: true,
-  default: () => mockHandleNewOrder,
+const mockAddOrder = jest.fn();
+const mockRefreshOrder = jest.fn();
+
+jest.mock('./useRampsOrders', () => ({
+  useRampsOrders: () => ({
+    addOrder: mockAddOrder,
+    refreshOrder: mockRefreshOrder,
+    orders: [],
+    getOrderById: jest.fn(),
+    removeOrder: jest.fn(),
+    getOrderFromCallback: jest.fn(),
+  }),
+}));
+
+jest.mock('../utils/v2OrderToast', () => ({
+  showV2OrderToast: jest.fn(),
 }));
 
 const mockTrackEvent = jest.fn();
@@ -297,9 +309,15 @@ describe('useTransakRouting', () => {
       });
       mockTransakCreateOrder.mockResolvedValue({
         id: 'order-123',
+        providerOrderId: 'order-123',
         walletAddress: '0xabc',
       });
-      mockHandleNewOrder.mockResolvedValue(undefined);
+      mockRefreshOrder.mockResolvedValue({
+        providerOrderId: 'order-123',
+        cryptoCurrency: { symbol: 'ETH' },
+        cryptoAmount: '0.05',
+        status: 'Pending',
+      });
 
       const { result } = renderHook(() => useTransakRouting());
 
@@ -355,8 +373,10 @@ describe('useTransakRouting', () => {
     });
 
     it('handles 401 error by logging out and navigating to enter email', async () => {
-      const error = new Error('Unauthorized') as Error & { status: number };
-      error.status = 401;
+      const error = new Error('Unauthorized') as Error & {
+        httpStatus: number;
+      };
+      error.httpStatus = 401;
       mockGetUserDetails.mockRejectedValue(error);
       mockLogoutFromProvider.mockResolvedValue(undefined);
 
diff --git a/app/components/UI/Ramp/hooks/useTransakRouting.ts b/app/components/UI/Ramp/hooks/useTransakRouting.ts
index f9b9be912bc4..850a4ff187e5 100644
--- a/app/components/UI/Ramp/hooks/useTransakRouting.ts
+++ b/app/components/UI/Ramp/hooks/useTransakRouting.ts
@@ -7,14 +7,13 @@ import { strings } from '../../../../../locales/i18n';
 import { useTheme } from '../../../../util/theme';
 import { type TransakBuyQuote } from '@metamask/ramps-controller';
 import { REDIRECTION_URL } from '../Deposit/constants';
-import { depositOrderToFiatOrder } from '../Deposit/orderProcessor';
-import useHandleNewOrder from '../Deposit/hooks/useHandleNewOrder';
 import { generateThemeParameters } from '../Deposit/utils';
 import { BasicInfoFormData } from '../Deposit/Views/BasicInfo/BasicInfo';
 import { AddressFormData } from '../Deposit/Views/EnterAddress/EnterAddress';
 import { createCheckoutNavDetails } from '../Views/Checkout';
 import { registerCheckoutCallback } from '../utils/checkoutCallbackRegistry';
 import useAnalytics from './useAnalytics';
+import { showV2OrderToast } from '../utils/v2OrderToast';
 import Logger from '../../../../util/Logger';
 import Routes from '../../../../constants/navigation/Routes';
 import { useTransakController } from './useTransakController';
@@ -22,7 +21,9 @@ import { useRampsUserRegion } from './useRampsUserRegion';
 import { useRampsPaymentMethods } from './useRampsPaymentMethods';
 import { selectTokens } from '../../../../selectors/rampsController';
 import useRampAccountAddress from './useRampAccountAddress';
+import { isHttpUnauthorized } from '../utils/isHttpUnauthorized';
 import { parseUserFacingError } from '../utils/parseUserFacingError';
+import { useRampsOrders } from './useRampsOrders';
 
 interface RampStackParamList {
   RampVerifyIdentity: { quote: TransakBuyQuote };
@@ -61,10 +62,10 @@ interface UseTransakRoutingConfig {
 
 export const useTransakRouting = (_config?: UseTransakRoutingConfig) => {
   const navigation = useNavigation<StackNavigationProp<RampStackParamList>>();
-  const handleNewOrder = useHandleNewOrder();
   const { themeAppearance, colors } = useTheme();
   const trackEvent = useAnalytics();
   const processingOrderIdRef = useRef<string | null>(null);
+  const { addOrder, refreshOrder } = useRampsOrders();
 
   const {
     logoutFromProvider,
@@ -269,66 +270,56 @@ export const useTransakRouting = (_config?: UseTransakRoutingConfig) => {
       processingOrderIdRef.current = orderId;
 
       try {
-        const order = await getOrder(orderId, walletAddress || '');
+        const depositOrder = await getOrder(orderId, walletAddress || '');
 
-        if (!order) {
+        if (!depositOrder) {
           throw new Error('Missing order');
         }
 
-        // At runtime, cryptoCurrency and network may be plain strings
-        // instead of the expected objects, depending on the controller version.
-        const rawCryptoCurrency = order.cryptoCurrency as
-          | string
-          | { symbol?: string; assetId?: string };
-        const cryptocurrency =
-          typeof rawCryptoCurrency === 'string'
-            ? rawCryptoCurrency
-            : rawCryptoCurrency?.symbol || '';
-
-        const processedOrder = {
-          ...depositOrderToFiatOrder(
-            order as Parameters<typeof depositOrderToFiatOrder>[0],
-          ),
-          account: walletAddress || order.walletAddress,
-          cryptocurrency,
-        };
+        const providerCode = (
+          depositOrder.provider || 'transak-native'
+        ).replace('/providers/', '');
+        const rampsOrder = await refreshOrder(
+          providerCode,
+          depositOrder.providerOrderId,
+          walletAddress || depositOrder.walletAddress,
+        );
 
-        await handleNewOrder(processedOrder);
+        addOrder({
+          ...rampsOrder,
+          paymentDetails: depositOrder.paymentDetails,
+        });
+
+        showV2OrderToast({
+          orderId: rampsOrder.providerOrderId,
+          cryptocurrency: rampsOrder.cryptoCurrency?.symbol ?? '',
+          cryptoAmount: rampsOrder.cryptoAmount,
+          status: rampsOrder.status,
+        });
 
         navigateToOrderProcessingCallback({
-          orderId: processedOrder.id,
+          orderId: rampsOrder.providerOrderId,
         });
 
-        const rawNetwork = order.network as
-          | string
-          | { chainId?: string; name?: string; assetId?: string };
         trackEvent('RAMPS_TRANSACTION_CONFIRMED', {
           ramp_type: 'DEPOSIT',
-          amount_source: Number(order.fiatAmount),
-          amount_destination: Number(order.cryptoAmount),
-          exchange_rate: Number(order.exchangeRate),
-          gas_fee: order.networkFees ? Number(order.networkFees) : 0,
-          processing_fee: order.partnerFees ? Number(order.partnerFees) : 0,
-          total_fee: Number(order.totalFeesFiat),
-          payment_method_id: order.paymentMethod.id,
+          amount_source: Number(rampsOrder.fiatAmount),
+          amount_destination: Number(rampsOrder.cryptoAmount),
+          exchange_rate: Number(rampsOrder.exchangeRate),
+          gas_fee: rampsOrder.networkFees ? Number(rampsOrder.networkFees) : 0,
+          processing_fee: rampsOrder.partnerFees
+            ? Number(rampsOrder.partnerFees)
+            : 0,
+          total_fee: Number(rampsOrder.totalFeesFiat),
+          payment_method_id: rampsOrder.paymentMethod?.id || '',
           country: regionIsoCode,
-          chain_id:
-            typeof rawNetwork === 'string'
-              ? rawNetwork
-              : rawNetwork?.chainId || '',
-          currency_destination:
-            typeof rawCryptoCurrency === 'string'
-              ? ''
-              : rawCryptoCurrency?.assetId || '',
-          currency_destination_symbol: cryptocurrency,
-          currency_destination_network:
-            typeof rawNetwork === 'string'
-              ? rawNetwork
-              : rawNetwork?.name || '',
-          currency_source: order.fiatCurrency,
+          chain_id: rampsOrder.network?.chainId || '',
+          currency_destination: rampsOrder.cryptoCurrency?.assetId || '',
+          currency_destination_symbol: rampsOrder.cryptoCurrency?.symbol || '',
+          currency_destination_network: rampsOrder.network?.name || '',
+          currency_source: rampsOrder.fiatCurrency?.symbol || '',
         });
       } catch (error) {
-        // Reset ref so the user can retry if the redirect URL fires again
         processingOrderIdRef.current = null;
         Logger.error(error as Error, {
           message: 'useTransakRouting: Failed to process order after checkout',
@@ -338,7 +329,8 @@ export const useTransakRouting = (_config?: UseTransakRoutingConfig) => {
     [
       getOrder,
       walletAddress,
-      handleNewOrder,
+      addOrder,
+      refreshOrder,
       navigateToOrderProcessingCallback,
       regionIsoCode,
       trackEvent,
@@ -426,26 +418,38 @@ export const useTransakRouting = (_config?: UseTransakRoutingConfig) => {
               await checkUserLimits(quote, requirements.kycType);
 
               if (selectedPaymentMethod?.isManualBankTransfer) {
-                const order = await transakCreateOrder(
+                const depositOrder = await transakCreateOrder(
                   quote.quoteId,
                   walletAddress || '',
                   selectedPaymentMethod.id,
                 );
-                if (!order) {
+                if (!depositOrder) {
                   throw new Error('Missing order');
                 }
 
-                const processedOrder = {
-                  ...depositOrderToFiatOrder(
-                    order as Parameters<typeof depositOrderToFiatOrder>[0],
-                  ),
-                  account: walletAddress || order.walletAddress,
-                };
+                const providerCode = (
+                  depositOrder.provider || 'transak-native'
+                ).replace('/providers/', '');
+                const rampsOrder = await refreshOrder(
+                  providerCode,
+                  depositOrder.providerOrderId,
+                  walletAddress || depositOrder.walletAddress,
+                );
+
+                addOrder({
+                  ...rampsOrder,
+                  paymentDetails: depositOrder.paymentDetails,
+                });
 
-                await handleNewOrder(processedOrder);
+                showV2OrderToast({
+                  orderId: rampsOrder.providerOrderId,
+                  cryptocurrency: rampsOrder.cryptoCurrency?.symbol ?? '',
+                  cryptoAmount: rampsOrder.cryptoAmount,
+                  status: rampsOrder.status,
+                });
 
                 navigateToBankDetailsCallback({
-                  orderId: processedOrder.id,
+                  orderId: rampsOrder.providerOrderId,
                   shouldUpdate: false,
                 });
               } else {
@@ -548,8 +552,7 @@ export const useTransakRouting = (_config?: UseTransakRoutingConfig) => {
             throw new Error(strings('deposit.buildQuote.unexpectedError'));
         }
       } catch (error) {
-        const httpError = error as { status?: number };
-        if (httpError.status === 401) {
+        if (isHttpUnauthorized(error)) {
           await logoutFromProvider(false);
           navigation.navigate(Routes.RAMP.ENTER_EMAIL);
           return;
@@ -565,7 +568,8 @@ export const useTransakRouting = (_config?: UseTransakRoutingConfig) => {
       regionIsoCode,
       selectedPaymentMethod?.isManualBankTransfer,
       selectedPaymentMethod?.id,
-      handleNewOrder,
+      addOrder,
+      refreshOrder,
       navigateToBankDetailsCallback,
       navigateToWebviewModalCallback,
       navigateToKycProcessingCallback,
diff --git a/app/components/UI/Ramp/index.tsx b/app/components/UI/Ramp/index.tsx
index 518587c21c2e..d84d82d3f352 100644
--- a/app/components/UI/Ramp/index.tsx
+++ b/app/components/UI/Ramp/index.tsx
@@ -33,6 +33,9 @@ import stateHasOrder from './utils/stateHasOrder';
 import Routes from '../../../constants/navigation/Routes';
 import getOrderAnalyticsPayload from './utils/getOrderAnalyticsPayload';
 import { NativeRampsSdk } from '@consensys/native-ramps-sdk';
+import { RampsOrderStatus } from '@metamask/ramps-controller';
+import { isRampsUnifiedV2Enabled } from './utils/isRampsUnifiedV2Enabled';
+import { showV2OrderToast } from './utils/v2OrderToast';
 
 const POLLING_FREQUENCY = AppConstants.FIAT_ORDERS.POLLING_FREQUENCY;
 
@@ -57,9 +60,19 @@ export async function processFiatOrder(
         trackEvent(event, params);
       }
       InteractionManager.runAfterInteractions(() => {
-        const notificationDetails = getNotificationDetails(updatedOrder);
-        if (notificationDetails) {
-          NotificationManager.showSimpleNotification(notificationDetails);
+        const isV2 = isRampsUnifiedV2Enabled(state);
+        if (isV2) {
+          showV2OrderToast({
+            orderId: updatedOrder.id,
+            cryptocurrency: updatedOrder.cryptocurrency,
+            cryptoAmount: updatedOrder.cryptoAmount,
+            status: updatedOrder.state as unknown as RampsOrderStatus,
+          });
+        } else {
+          const notificationDetails = getNotificationDetails(updatedOrder);
+          if (notificationDetails) {
+            NotificationManager.showSimpleNotification(notificationDetails);
+          }
         }
       });
     }
@@ -93,9 +106,19 @@ async function processCustomOrderId(
       }
       dispatchAddFiatOrder(fiatOrder);
       InteractionManager.runAfterInteractions(() => {
-        const notificationDetails = getNotificationDetails(fiatOrder);
-        if (notificationDetails) {
-          NotificationManager.showSimpleNotification(notificationDetails);
+        const isV2 = isRampsUnifiedV2Enabled(state);
+        if (isV2) {
+          showV2OrderToast({
+            orderId: fiatOrder.id,
+            cryptocurrency: fiatOrder.cryptocurrency,
+            cryptoAmount: fiatOrder.cryptoAmount,
+            status: fiatOrder.state as unknown as RampsOrderStatus,
+          });
+        } else {
+          const notificationDetails = getNotificationDetails(fiatOrder);
+          if (notificationDetails) {
+            NotificationManager.showSimpleNotification(notificationDetails);
+          }
         }
       });
     });
diff --git a/app/components/UI/Ramp/orderProcessor/index.test.ts b/app/components/UI/Ramp/orderProcessor/index.test.ts
index 5ba8b1c29d24..966161c3371a 100644
--- a/app/components/UI/Ramp/orderProcessor/index.test.ts
+++ b/app/components/UI/Ramp/orderProcessor/index.test.ts
@@ -111,7 +111,13 @@ describe('processOrder', () => {
     );
     expect(Logger.error).toHaveBeenCalledWith(
       new Error('FiatOrders::ProcessOrder unrecognized provider'),
-      unsupportedProviderOrder,
+      {
+        orderId: unsupportedProviderOrder.id,
+        provider: unsupportedProviderOrder.provider,
+        orderType: unsupportedProviderOrder.orderType,
+        state: unsupportedProviderOrder.state,
+        network: unsupportedProviderOrder.network,
+      },
     );
   });
 
diff --git a/app/components/UI/Ramp/orderProcessor/index.ts b/app/components/UI/Ramp/orderProcessor/index.ts
index 579ff8d61edc..490a36a577be 100644
--- a/app/components/UI/Ramp/orderProcessor/index.ts
+++ b/app/components/UI/Ramp/orderProcessor/index.ts
@@ -29,7 +29,13 @@ function processOrder(
       const unrecognizedProviderError = new Error(
         'FiatOrders::ProcessOrder unrecognized provider',
       );
-      Logger.error(unrecognizedProviderError, order);
+      Logger.error(unrecognizedProviderError, {
+        orderId: order.id,
+        provider: order.provider,
+        orderType: order.orderType,
+        state: order.state,
+        network: order.network,
+      });
       return order;
     }
   }
diff --git a/app/components/UI/Ramp/routes.test.tsx b/app/components/UI/Ramp/routes.test.tsx
new file mode 100644
index 000000000000..fe51f5b9f764
--- /dev/null
+++ b/app/components/UI/Ramp/routes.test.tsx
@@ -0,0 +1,112 @@
+import React from 'react';
+import { render } from '@testing-library/react-native';
+import { NavigationContainer } from '@react-navigation/native';
+import TokenListRoutes from './routes';
+
+// Mock LockManagerService - must use inline jest.fn() to avoid hoisting issues
+jest.mock('../../../core/LockManagerService', () => ({
+  __esModule: true,
+  default: {
+    stopListening: jest.fn(),
+    startListening: jest.fn(),
+  },
+}));
+
+// Get references to the mock functions for assertions
+const mockLockManagerService = jest.requireMock(
+  '../../../core/LockManagerService',
+).default;
+const mockStopListening = mockLockManagerService.stopListening;
+const mockStartListening = mockLockManagerService.startListening;
+
+// Mock all the view components
+jest.mock('./Views/TokenSelection', () => 'TokenSelection');
+jest.mock('./Views/BuildQuote', () => 'BuildQuote');
+jest.mock('./Views/Checkout', () => 'Checkout');
+jest.mock('./Views/NativeFlow/EnterEmail', () => 'V2EnterEmail');
+jest.mock('./Views/NativeFlow/OtpCode', () => 'V2OtpCode');
+jest.mock('./Views/NativeFlow/BasicInfo', () => 'V2BasicInfo');
+jest.mock('./Views/NativeFlow/EnterAddress', () => 'V2EnterAddress');
+jest.mock('./Views/NativeFlow/VerifyIdentity', () => 'V2VerifyIdentity');
+jest.mock('./Views/NativeFlow/BankDetails', () => 'V2BankDetails');
+jest.mock('./Views/NativeFlow/OrderProcessing', () => 'V2OrderProcessing');
+jest.mock('./Views/NativeFlow/KycProcessing', () => 'V2KycProcessing');
+jest.mock(
+  './Views/NativeFlow/AdditionalVerification',
+  () => 'V2AdditionalVerification',
+);
+jest.mock(
+  './Views/Modals/UnsupportedTokenModal',
+  () => 'UnsupportedTokenModal',
+);
+jest.mock('./Views/Modals/SettingsModal', () => 'SettingsModal');
+jest.mock(
+  './Views/Modals/PaymentSelectionModal',
+  () => 'PaymentSelectionModal',
+);
+jest.mock(
+  './Views/Modals/TokenNotAvailableModal',
+  () => 'TokenNotAvailableModal',
+);
+jest.mock(
+  './Views/Modals/ProviderSelectionModal',
+  () => 'ProviderSelectionModal',
+);
+jest.mock('./Views/Modals/ErrorDetailsModal', () => 'ErrorDetailsModal');
+jest.mock(
+  './Views/Modals/ProcessingInfoModal/ProcessingInfoModal',
+  () => 'ProcessingInfoModal',
+);
+jest.mock('./Views/OrderDetails', () => 'RampsOrderDetails');
+
+// Mock @react-navigation/stack
+jest.mock('@react-navigation/stack', () => {
+  const { View } = jest.requireActual('react-native');
+  return {
+    createStackNavigator: () => ({
+      Navigator: ({
+        children,
+        ...props
+      }: React.PropsWithChildren<Record<string, unknown>>) => (
+        <View testID="stack-navigator" {...props}>
+          {children}
+        </View>
+      ),
+      Screen: ({
+        children,
+        ...props
+      }: React.PropsWithChildren<{ name: string }>) => (
+        <View testID={`screen-${props.name}`} {...props}>
+          {children}
+        </View>
+      ),
+    }),
+  };
+});
+
+const renderWithNavigation = (component: React.ReactElement) =>
+  render(<NavigationContainer>{component}</NavigationContainer>);
+
+describe('TokenListRoutes', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  describe('Auto-lock Management', () => {
+    it('disables auto-lock when component mounts', () => {
+      renderWithNavigation(<TokenListRoutes />);
+
+      expect(mockStopListening).toHaveBeenCalledTimes(1);
+    });
+
+    it('re-enables auto-lock when component unmounts', () => {
+      const { unmount } = renderWithNavigation(<TokenListRoutes />);
+
+      expect(mockStartListening).not.toHaveBeenCalled();
+
+      unmount();
+
+      expect(mockStartListening).toHaveBeenCalledTimes(1);
+    });
+  });
+});
diff --git a/app/components/UI/Ramp/routes.tsx b/app/components/UI/Ramp/routes.tsx
index 9b931700662f..19e56f3e73c7 100644
--- a/app/components/UI/Ramp/routes.tsx
+++ b/app/components/UI/Ramp/routes.tsx
@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useEffect } from 'react';
 import { createStackNavigator } from '@react-navigation/stack';
 import Routes from '../../../constants/navigation/Routes';
 import TokenSelection from './Views/TokenSelection';
@@ -18,8 +18,11 @@ import SettingsModal from './Views/Modals/SettingsModal';
 import PaymentSelectionModal from './Views/Modals/PaymentSelectionModal';
 import TokenNotAvailableModal from './Views/Modals/TokenNotAvailableModal';
 import ProviderSelectionModal from './Views/Modals/ProviderSelectionModal';
+import ErrorDetailsModal from './Views/Modals/ErrorDetailsModal';
 import ProcessingInfoModal from './Views/Modals/ProcessingInfoModal/ProcessingInfoModal';
+import SsnInfoModal from './Deposit/Views/Modals/SsnInfoModal';
 import RampsOrderDetails from './Views/OrderDetails';
+import LockManagerService from '../../../core/LockManagerService';
 
 const RootStack = createStackNavigator();
 const Stack = createStackNavigator();
@@ -42,7 +45,11 @@ const MainRoutes = () => (
       name={Routes.RAMP.TOKEN_SELECTION}
       component={TokenSelection}
     />
-    <Stack.Screen name={Routes.RAMP.AMOUNT_INPUT} component={BuildQuote} />
+    <Stack.Screen
+      name={Routes.RAMP.AMOUNT_INPUT}
+      component={BuildQuote}
+      options={{ headerShown: false }}
+    />
     <Stack.Screen name={Routes.RAMP.ENTER_EMAIL} component={V2EnterEmail} />
     <Stack.Screen name={Routes.RAMP.OTP_CODE} component={V2OtpCode} />
     <Stack.Screen name={Routes.RAMP.BASIC_INFO} component={V2BasicInfo} />
@@ -107,31 +114,51 @@ const TokenListModalsRoutes = () => (
       name={Routes.RAMP.MODALS.PROVIDER_SELECTION}
       component={ProviderSelectionModal}
     />
+    <ModalsStack.Screen
+      name={Routes.RAMP.MODALS.ERROR_DETAILS}
+      component={ErrorDetailsModal}
+    />
     <ModalsStack.Screen
       name={Routes.RAMP.MODALS.PROCESSING_INFO}
       component={ProcessingInfoModal}
     />
+    <ModalsStack.Screen
+      name={Routes.RAMP.MODALS.SSN_INFO}
+      component={SsnInfoModal}
+    />
   </ModalsStack.Navigator>
 );
 
-const TokenListRoutes = () => (
-  <RootStack.Navigator
-    initialRouteName={Routes.RAMP.TOKEN_SELECTION}
-    headerMode="none"
-  >
-    <RootStack.Screen
-      name={Routes.RAMP.TOKEN_SELECTION}
-      component={MainRoutes}
-    />
-    <RootStack.Screen
-      name={Routes.RAMP.MODALS.ID}
-      component={TokenListModalsRoutes}
-      options={{
-        ...clearStackNavigatorOptions,
-        detachPreviousScreen: false,
-      }}
-    />
-  </RootStack.Navigator>
-);
+const TokenListRoutes = () => {
+  // Disable auto-lock during Ramps unified buy v2 flow
+  // This allows users to minimize the app to check personal details or complete
+  // verification steps without being locked out and redirected to wallet home
+  useEffect(() => {
+    LockManagerService.stopListening();
+    return () => {
+      LockManagerService.startListening();
+    };
+  }, []);
+
+  return (
+    <RootStack.Navigator
+      initialRouteName={Routes.RAMP.TOKEN_SELECTION}
+      headerMode="none"
+    >
+      <RootStack.Screen
+        name={Routes.RAMP.TOKEN_SELECTION}
+        component={MainRoutes}
+      />
+      <RootStack.Screen
+        name={Routes.RAMP.MODALS.ID}
+        component={TokenListModalsRoutes}
+        options={{
+          ...clearStackNavigatorOptions,
+          detachPreviousScreen: false,
+        }}
+      />
+    </RootStack.Navigator>
+  );
+};
 
 export default TokenListRoutes;
diff --git a/app/components/UI/Ramp/utils/__snapshots__/displayOrder.test.ts.snap b/app/components/UI/Ramp/utils/__snapshots__/displayOrder.test.ts.snap
new file mode 100644
index 000000000000..070652a10f9f
--- /dev/null
+++ b/app/components/UI/Ramp/utils/__snapshots__/displayOrder.test.ts.snap
@@ -0,0 +1,35 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`displayOrder fiatOrderToDisplayOrder converts a legacy FiatOrder to a DisplayOrder 1`] = `
+{
+  "account": "0xabc",
+  "createdAt": 1000,
+  "cryptoAmount": 0,
+  "cryptoCurrencySymbol": "ETH",
+  "fiatAmount": "100",
+  "fiatCurrencyCode": "USD",
+  "id": "legacy-1",
+  "network": "1",
+  "orderType": "BUY",
+  "providerName": "MockProvider_AGGREGATOR",
+  "source": "legacy",
+  "status": "COMPLETED",
+}
+`;
+
+exports[`displayOrder rampsOrderToDisplayOrder converts a V2 RampsOrder to a DisplayOrder 1`] = `
+{
+  "account": "0x123",
+  "createdAt": 2000,
+  "cryptoAmount": "0.5",
+  "cryptoCurrencySymbol": "ETH",
+  "fiatAmount": 100,
+  "fiatCurrencyCode": "USD",
+  "id": "v2-1",
+  "network": "eip155:1",
+  "orderType": "BUY",
+  "providerName": "TestProvider",
+  "source": "v2",
+  "status": "COMPLETED",
+}
+`;
diff --git a/app/components/UI/Ramp/utils/determinePreferredProvider.test.ts b/app/components/UI/Ramp/utils/determinePreferredProvider.test.ts
index 805b2d87c1a5..8e8736ee1a16 100644
--- a/app/components/UI/Ramp/utils/determinePreferredProvider.test.ts
+++ b/app/components/UI/Ramp/utils/determinePreferredProvider.test.ts
@@ -1,6 +1,14 @@
-import { determinePreferredProvider } from './determinePreferredProvider';
+import {
+  determinePreferredProvider,
+  completedOrdersFromFiatOrders,
+  completedOrdersFromRampsOrders,
+} from './determinePreferredProvider';
 import type { FiatOrder } from '../../../../reducers/fiatOrders/types';
-import type { Provider } from '@metamask/ramps-controller';
+import {
+  type Provider,
+  type RampsOrder,
+  RampsOrderStatus,
+} from '@metamask/ramps-controller';
 import {
   FIAT_ORDER_PROVIDERS,
   FIAT_ORDER_STATES,
@@ -52,189 +60,144 @@ const mockTransakProvider: Provider = {
   },
 };
 
-describe('determinePreferredProvider', () => {
-  describe('when no providers are available', () => {
-    it('returns null', () => {
-      const result = determinePreferredProvider([], []);
-      expect(result).toBeNull();
-    });
+const makeFiatOrder = (
+  overrides: Partial<FiatOrder> & { provider: string },
+): FiatOrder => ({
+  id: 'order-1',
+  createdAt: 1000,
+  amount: '100',
+  currency: 'USD',
+  cryptocurrency: 'ETH',
+  state: FIAT_ORDER_STATES.COMPLETED,
+  account: '0x123',
+  network: '1',
+  orderType: 'BUY',
+  excludeFromPurchases: false,
+  data: {} as Order,
+  ...overrides,
+});
+
+const makeRampsOrder = (overrides: Partial<RampsOrder> = {}): RampsOrder =>
+  ({
+    providerOrderId: 'v2-order-1',
+    status: RampsOrderStatus.Completed,
+    createdAt: 1000,
+    provider: { id: 'provider-1', name: 'Provider One' },
+    orderType: 'BUY',
+    walletAddress: '0x123',
+    fiatAmount: 100,
+    cryptoAmount: 0.05,
+    ...overrides,
+  }) as RampsOrder;
+
+describe('completedOrdersFromFiatOrders', () => {
+  it('extracts provider ID from aggregator orders', () => {
+    const orders = [
+      makeFiatOrder({
+        provider: FIAT_ORDER_PROVIDERS.AGGREGATOR,
+        data: { provider: { id: 'provider-1' } } as Order,
+      }),
+    ];
+
+    const result = completedOrdersFromFiatOrders(orders);
+
+    expect(result).toEqual([{ providerId: 'provider-1', completedAt: 1000 }]);
   });
 
-  describe('when user has completed orders', () => {
-    it('returns provider from most recent completed aggregator order', () => {
-      const orders: FiatOrder[] = [
-        {
-          id: 'order-1',
-          provider: FIAT_ORDER_PROVIDERS.AGGREGATOR,
-          createdAt: 1000,
-          amount: '100',
-          currency: 'USD',
-          cryptocurrency: 'ETH',
-          state: FIAT_ORDER_STATES.COMPLETED,
-          account: '0x123',
-          network: '1',
-          orderType: 'BUY',
-          excludeFromPurchases: false,
-          data: {
-            provider: { id: 'provider-1' },
-          } as Order,
-        },
-        {
-          id: 'order-2',
-          provider: FIAT_ORDER_PROVIDERS.AGGREGATOR,
-          createdAt: 2000,
-          amount: '200',
-          currency: 'USD',
-          cryptocurrency: 'ETH',
-          state: FIAT_ORDER_STATES.COMPLETED,
-          account: '0x123',
-          network: '1',
-          orderType: 'BUY',
-          excludeFromPurchases: false,
-          data: {
-            provider: { id: 'provider-2' },
-          } as Order,
-        },
-      ];
+  it('maps DEPOSIT orders to TRANSAK', () => {
+    const orders = [makeFiatOrder({ provider: FIAT_ORDER_PROVIDERS.DEPOSIT })];
 
-      const providers = [mockProvider1, mockProvider2, mockTransakProvider];
+    const result = completedOrdersFromFiatOrders(orders);
 
-      const result = determinePreferredProvider(orders, providers);
+    expect(result).toEqual([{ providerId: 'TRANSAK', completedAt: 1000 }]);
+  });
 
-      expect(result).toEqual(mockProvider2);
-    });
+  it('maps TRANSAK orders to TRANSAK', () => {
+    const orders = [makeFiatOrder({ provider: FIAT_ORDER_PROVIDERS.TRANSAK })];
 
-    it('returns Transak provider for DEPOSIT orders', () => {
-      const orders: FiatOrder[] = [
-        {
-          id: 'order-1',
-          provider: FIAT_ORDER_PROVIDERS.DEPOSIT,
-          createdAt: 1000,
-          amount: '100',
-          currency: 'USD',
-          cryptocurrency: 'ETH',
-          state: FIAT_ORDER_STATES.COMPLETED,
-          account: '0x123',
-          network: '1',
-          orderType: 'BUY',
-          excludeFromPurchases: false,
-          data: {} as Order,
-        },
-      ];
+    const result = completedOrdersFromFiatOrders(orders);
 
-      const providers = [mockProvider1, mockProvider2, mockTransakProvider];
+    expect(result).toEqual([{ providerId: 'TRANSAK', completedAt: 1000 }]);
+  });
 
-      const result = determinePreferredProvider(orders, providers);
+  it('uses provider string directly for other order types', () => {
+    const orders = [makeFiatOrder({ provider: FIAT_ORDER_PROVIDERS.MOONPAY })];
 
-      expect(result).toEqual(mockTransakProvider);
-    });
+    const result = completedOrdersFromFiatOrders(orders);
 
-    it('returns Transak provider for TRANSAK orders', () => {
-      const orders: FiatOrder[] = [
-        {
-          id: 'order-1',
-          provider: FIAT_ORDER_PROVIDERS.TRANSAK,
-          createdAt: 1000,
-          amount: '100',
-          currency: 'USD',
-          cryptocurrency: 'ETH',
-          state: FIAT_ORDER_STATES.COMPLETED,
-          account: '0x123',
-          network: '1',
-          orderType: 'BUY',
-          excludeFromPurchases: false,
-          data: {} as Order,
-        },
-      ];
+    expect(result).toEqual([{ providerId: 'MOONPAY', completedAt: 1000 }]);
+  });
 
-      const providers = [mockProvider1, mockProvider2, mockTransakProvider];
+  it('skips non-completed orders', () => {
+    const orders = [
+      makeFiatOrder({
+        provider: FIAT_ORDER_PROVIDERS.AGGREGATOR,
+        state: FIAT_ORDER_STATES.PENDING,
+        data: { provider: { id: 'provider-1' } } as Order,
+      }),
+    ];
 
-      const result = determinePreferredProvider(orders, providers);
+    const result = completedOrdersFromFiatOrders(orders);
 
-      expect(result).toEqual(mockTransakProvider);
-    });
+    expect(result).toEqual([]);
+  });
+});
 
-    it('returns provider from other order types', () => {
-      const orders: FiatOrder[] = [
-        {
-          id: 'order-1',
-          provider: FIAT_ORDER_PROVIDERS.MOONPAY,
-          createdAt: 1000,
-          amount: '100',
-          currency: 'USD',
-          cryptocurrency: 'ETH',
-          state: FIAT_ORDER_STATES.COMPLETED,
-          account: '0x123',
-          network: '1',
-          orderType: 'BUY',
-          excludeFromPurchases: false,
-          data: {} as Order,
-        },
-      ];
+describe('completedOrdersFromRampsOrders', () => {
+  it('extracts provider ID from completed controller orders', () => {
+    const orders = [makeRampsOrder()];
 
-      const moonpayProvider: Provider = {
-        ...mockProvider1,
-        id: 'MOONPAY',
-        name: 'MoonPay',
-      };
+    const result = completedOrdersFromRampsOrders(orders);
+
+    expect(result).toEqual([{ providerId: 'provider-1', completedAt: 1000 }]);
+  });
 
-      const providers = [mockProvider1, moonpayProvider, mockTransakProvider];
+  it('skips non-completed controller orders', () => {
+    const orders = [makeRampsOrder({ status: RampsOrderStatus.Pending })];
 
-      const result = determinePreferredProvider(orders, providers);
+    const result = completedOrdersFromRampsOrders(orders);
+
+    expect(result).toEqual([]);
+  });
+
+  it('skips orders with no provider', () => {
+    const orders = [makeRampsOrder({ provider: undefined })];
+
+    const result = completedOrdersFromRampsOrders(orders);
+
+    expect(result).toEqual([]);
+  });
+});
+
+describe('determinePreferredProvider', () => {
+  describe('when no providers are available', () => {
+    it('returns null', () => {
+      const result = determinePreferredProvider([], []);
 
-      expect(result).toEqual(moonpayProvider);
+      expect(result).toBeNull();
     });
+  });
 
-    it('ignores non-completed orders', () => {
-      const orders: FiatOrder[] = [
-        {
-          id: 'order-1',
-          provider: FIAT_ORDER_PROVIDERS.AGGREGATOR,
-          createdAt: 1000,
-          amount: '100',
-          currency: 'USD',
-          cryptocurrency: 'ETH',
-          state: FIAT_ORDER_STATES.PENDING,
-          account: '0x123',
-          network: '1',
-          orderType: 'BUY',
-          excludeFromPurchases: false,
-          data: {
-            provider: { id: 'provider-1' },
-          } as Order,
-        },
+  describe('when user has completed orders', () => {
+    it('returns provider from most recent completed order', () => {
+      const completedOrders = [
+        { providerId: 'provider-1', completedAt: 1000 },
+        { providerId: 'provider-2', completedAt: 2000 },
       ];
-
       const providers = [mockProvider1, mockProvider2, mockTransakProvider];
 
-      const result = determinePreferredProvider(orders, providers);
+      const result = determinePreferredProvider(completedOrders, providers);
 
-      expect(result).toEqual(mockTransakProvider);
+      expect(result).toEqual(mockProvider2);
     });
 
-    it('returns Transak if provider from order is not in available providers', () => {
-      const orders: FiatOrder[] = [
-        {
-          id: 'order-1',
-          provider: FIAT_ORDER_PROVIDERS.AGGREGATOR,
-          createdAt: 1000,
-          amount: '100',
-          currency: 'USD',
-          cryptocurrency: 'ETH',
-          state: FIAT_ORDER_STATES.COMPLETED,
-          account: '0x123',
-          network: '1',
-          orderType: 'BUY',
-          excludeFromPurchases: false,
-          data: {
-            provider: { id: 'non-existent-provider' },
-          } as Order,
-        },
+    it('falls back to Transak if provider from order is not in available providers', () => {
+      const completedOrders = [
+        { providerId: 'non-existent-provider', completedAt: 1000 },
       ];
-
       const providers = [mockProvider1, mockProvider2, mockTransakProvider];
 
-      const result = determinePreferredProvider(orders, providers);
+      const result = determinePreferredProvider(completedOrders, providers);
 
       expect(result).toEqual(mockTransakProvider);
     });
@@ -260,87 +223,100 @@ describe('determinePreferredProvider', () => {
 
   describe('provider matching', () => {
     it('matches provider by id case-insensitively', () => {
-      const orders: FiatOrder[] = [
-        {
-          id: 'order-1',
-          provider: FIAT_ORDER_PROVIDERS.AGGREGATOR,
-          createdAt: 1000,
-          amount: '100',
-          currency: 'USD',
-          cryptocurrency: 'ETH',
-          state: FIAT_ORDER_STATES.COMPLETED,
-          account: '0x123',
-          network: '1',
-          orderType: 'BUY',
-          excludeFromPurchases: false,
-          data: {
-            provider: { id: 'PROVIDER-1' },
-          } as Order,
-        },
-      ];
-
+      const completedOrders = [{ providerId: 'PROVIDER-1', completedAt: 1000 }];
       const providers = [mockProvider1, mockProvider2];
 
-      const result = determinePreferredProvider(orders, providers);
+      const result = determinePreferredProvider(completedOrders, providers);
 
       expect(result).toEqual(mockProvider1);
     });
 
     it('matches provider by name case-insensitively', () => {
-      const orders: FiatOrder[] = [
-        {
-          id: 'order-1',
-          provider: FIAT_ORDER_PROVIDERS.AGGREGATOR,
-          createdAt: 1000,
-          amount: '100',
-          currency: 'USD',
-          cryptocurrency: 'ETH',
-          state: FIAT_ORDER_STATES.COMPLETED,
-          account: '0x123',
-          network: '1',
-          orderType: 'BUY',
-          excludeFromPurchases: false,
-          data: {
-            provider: { id: 'provider one' },
-          } as Order,
-        },
+      const completedOrders = [
+        { providerId: 'provider one', completedAt: 1000 },
       ];
-
       const providers = [mockProvider1, mockProvider2];
 
-      const result = determinePreferredProvider(orders, providers);
+      const result = determinePreferredProvider(completedOrders, providers);
 
       expect(result).toEqual(mockProvider1);
     });
 
     it('matches Transak by id containing "transak"', () => {
-      const orders: FiatOrder[] = [
-        {
-          id: 'order-1',
-          provider: FIAT_ORDER_PROVIDERS.DEPOSIT,
-          createdAt: 1000,
-          amount: '100',
-          currency: 'USD',
-          cryptocurrency: 'ETH',
-          state: FIAT_ORDER_STATES.COMPLETED,
-          account: '0x123',
-          network: '1',
-          orderType: 'BUY',
-          excludeFromPurchases: false,
-          data: {} as Order,
-        },
-      ];
-
+      const completedOrders = [{ providerId: 'TRANSAK', completedAt: 1000 }];
       const transakVariant: Provider = {
         ...mockTransakProvider,
         id: 'transak-provider-v2',
       };
-
       const providers = [mockProvider1, transakVariant];
 
-      const result = determinePreferredProvider(orders, providers);
+      const result = determinePreferredProvider(completedOrders, providers);
 
       expect(result).toEqual(transakVariant);
     });
   });
+
+  describe('end-to-end with converters', () => {
+    it('works with legacy FiatOrders through converter', () => {
+      const orders = [
+        makeFiatOrder({
+          provider: FIAT_ORDER_PROVIDERS.AGGREGATOR,
+          createdAt: 2000,
+          data: { provider: { id: 'provider-2' } } as Order,
+        }),
+      ];
+      const providers = [mockProvider1, mockProvider2, mockTransakProvider];
+
+      const result = determinePreferredProvider(
+        completedOrdersFromFiatOrders(orders),
+        providers,
+      );
+
+      expect(result).toEqual(mockProvider2);
+    });
+
+    it('works with controller RampsOrders through converter', () => {
+      const orders = [
+        makeRampsOrder({
+          createdAt: 2000,
+          provider: { id: 'provider-2', name: 'Provider Two' } as Provider,
+        }),
+      ];
+      const providers = [mockProvider1, mockProvider2, mockTransakProvider];
+
+      const result = determinePreferredProvider(
+        completedOrdersFromRampsOrders(orders),
+        providers,
+      );
+
+      expect(result).toEqual(mockProvider2);
+    });
+
+    it('picks most recent across both legacy and controller orders', () => {
+      const legacyOrders = [
+        makeFiatOrder({
+          provider: FIAT_ORDER_PROVIDERS.AGGREGATOR,
+          createdAt: 1000,
+          data: { provider: { id: 'provider-1' } } as Order,
+        }),
+      ];
+      const controllerOrders = [
+        makeRampsOrder({
+          createdAt: 2000,
+          provider: { id: 'provider-2', name: 'Provider Two' } as Provider,
+        }),
+      ];
+      const providers = [mockProvider1, mockProvider2, mockTransakProvider];
+
+      const result = determinePreferredProvider(
+        [
+          ...completedOrdersFromFiatOrders(legacyOrders),
+          ...completedOrdersFromRampsOrders(controllerOrders),
+        ],
+        providers,
+      );
+
+      expect(result).toEqual(mockProvider2);
+    });
+  });
 });
diff --git a/app/components/UI/Ramp/utils/determinePreferredProvider.ts b/app/components/UI/Ramp/utils/determinePreferredProvider.ts
index bf215d80c36d..ef6f6ed6779e 100644
--- a/app/components/UI/Ramp/utils/determinePreferredProvider.ts
+++ b/app/components/UI/Ramp/utils/determinePreferredProvider.ts
@@ -1,5 +1,9 @@
 import { Order } from '@consensys/on-ramp-sdk';
-import type { Provider, RampsOrder } from '@metamask/ramps-controller';
+import {
+  type Provider,
+  type RampsOrder,
+  RampsOrderStatus,
+} from '@metamask/ramps-controller';
 import type { FiatOrder } from '../../../../reducers/fiatOrders/types';
 import {
   FIAT_ORDER_PROVIDERS,
@@ -7,65 +11,94 @@ import {
 } from '../../../../constants/on-ramp';
 
 /**
- * Determines the preferred provider based on user's order history and available providers.
+ * Minimal representation of a completed order used for provider selection
+ * and "previously used" logic. Both FiatOrder and RampsOrder map into this.
+ */
+export interface CompletedOrderInfo {
+  providerId: string;
+  completedAt: number;
+}
+
+export function completedOrdersFromFiatOrders(
+  orders: FiatOrder[],
+): CompletedOrderInfo[] {
+  return orders
+    .filter((order) => order.state === FIAT_ORDER_STATES.COMPLETED)
+    .reduce<CompletedOrderInfo[]>((acc, order) => {
+      let providerId: string | undefined;
+
+      if (
+        order.provider === FIAT_ORDER_PROVIDERS.AGGREGATOR ||
+        order.provider === FIAT_ORDER_PROVIDERS.RAMPS_V2
+      ) {
+        const orderData =
+          order.provider === FIAT_ORDER_PROVIDERS.RAMPS_V2
+            ? (order.data as RampsOrder)
+            : (order.data as Order);
+        providerId = orderData?.provider?.id;
+      } else if (
+        order.provider === FIAT_ORDER_PROVIDERS.DEPOSIT ||
+        order.provider === FIAT_ORDER_PROVIDERS.TRANSAK
+      ) {
+        providerId = 'TRANSAK';
+      } else {
+        providerId = order.provider;
+      }
+
+      if (providerId) {
+        acc.push({ providerId, completedAt: order.createdAt });
+      }
+      return acc;
+    }, []);
+}
+
+export function completedOrdersFromRampsOrders(
+  orders: RampsOrder[],
+): CompletedOrderInfo[] {
+  return orders
+    .filter((order) => order.status === RampsOrderStatus.Completed)
+    .reduce<CompletedOrderInfo[]>((acc, order) => {
+      const providerId = order.provider?.id;
+      if (providerId) {
+        acc.push({ providerId, completedAt: order.createdAt });
+      }
+      return acc;
+    }, []);
+}
+
+/**
+ * Determines the preferred provider based on user's completed order history.
  *
- * Logic:
- * 1. If user has completed orders, use the provider from the most recent completed order
- * 2. Find that provider in the available providers list
- * 3. If no orders or provider not found, default to Transak
- * 4. If Transak is not available, use the first provider in the list
+ * Fallback order:
+ * 1. Provider from most recent completed order
+ * 2. Transak
+ * 3. First available provider
  *
- * @param orders - Array of fiat orders
- * @param availableProviders - Array of available providers from RampsController
+ * @param completedOrders - Completed orders from any source (legacy + controller)
+ * @param availableProviders - Available providers from RampsController
  * @returns The preferred provider, or null if no providers are available
  */
 export function determinePreferredProvider(
-  orders: FiatOrder[],
+  completedOrders: CompletedOrderInfo[],
   availableProviders: Provider[],
 ): Provider | null {
   if (availableProviders.length === 0) {
     return null;
   }
 
-  const completedOrders = orders.filter(
-    (order) => order.state === FIAT_ORDER_STATES.COMPLETED,
-  );
-
   if (completedOrders.length > 0) {
-    const [lastCompletedOrder] = [...completedOrders].sort(
-      (a, b) => b.createdAt - a.createdAt,
+    const [mostRecent] = [...completedOrders].sort(
+      (a, b) => b.completedAt - a.completedAt,
     );
 
-    let providerId: string | undefined;
-
-    if (
-      lastCompletedOrder.provider === FIAT_ORDER_PROVIDERS.AGGREGATOR ||
-      lastCompletedOrder.provider === FIAT_ORDER_PROVIDERS.RAMPS_V2
-    ) {
-      const orderData =
-        lastCompletedOrder.provider === FIAT_ORDER_PROVIDERS.RAMPS_V2
-          ? (lastCompletedOrder.data as RampsOrder)
-          : (lastCompletedOrder.data as Order);
-      providerId = orderData?.provider?.id;
-    } else if (
-      lastCompletedOrder.provider === FIAT_ORDER_PROVIDERS.DEPOSIT ||
-      lastCompletedOrder.provider === FIAT_ORDER_PROVIDERS.TRANSAK
-    ) {
-      providerId = 'TRANSAK';
-    } else {
-      providerId = lastCompletedOrder.provider;
-    }
-
-    if (providerId) {
-      const foundProvider = availableProviders.find(
-        (provider) =>
-          provider.id?.toLowerCase() === providerId?.toLowerCase() ||
-          provider.name?.toLowerCase() === providerId?.toLowerCase(),
-      );
+    const foundProvider = availableProviders.find(
+      (provider) =>
+        provider.id?.toLowerCase() === mostRecent.providerId.toLowerCase() ||
+        provider.name?.toLowerCase() === mostRecent.providerId.toLowerCase(),
+    );
 
-      if (foundProvider) {
-        return foundProvider;
-      }
+    if (foundProvider) {
+      return foundProvider;
     }
   }
 
diff --git a/app/components/UI/Ramp/utils/displayOrder.test.ts b/app/components/UI/Ramp/utils/displayOrder.test.ts
new file mode 100644
index 000000000000..942059efd256
--- /dev/null
+++ b/app/components/UI/Ramp/utils/displayOrder.test.ts
@@ -0,0 +1,254 @@
+import { RampsOrderStatus, type RampsOrder } from '@metamask/ramps-controller';
+import { FIAT_ORDER_PROVIDERS } from '../../../../constants/on-ramp';
+import { type FiatOrder } from '../../../../reducers/fiatOrders';
+import {
+  fiatOrderToDisplayOrder,
+  rampsOrderToDisplayOrder,
+  mergeDisplayOrders,
+} from './displayOrder';
+
+jest.mock('../../../../reducers/fiatOrders', () => ({
+  ...jest.requireActual('../../../../reducers/fiatOrders'),
+  getProviderName: jest.fn(
+    (provider: FIAT_ORDER_PROVIDERS) => `MockProvider_${provider}`,
+  ),
+}));
+
+const createMockFiatOrder = (
+  overrides: Partial<FiatOrder> = {},
+): FiatOrder => ({
+  id: 'legacy-1',
+  provider: FIAT_ORDER_PROVIDERS.AGGREGATOR,
+  createdAt: 1000,
+  amount: '100',
+  currency: 'USD',
+  cryptocurrency: 'ETH',
+  state: 'COMPLETED' as FiatOrder['state'],
+  account: '0xabc',
+  network: '1',
+  excludeFromPurchases: false,
+  orderType: 'BUY' as FiatOrder['orderType'],
+  data: {} as FiatOrder['data'],
+  ...overrides,
+});
+
+const createMockRampsOrder = (
+  overrides: Partial<RampsOrder> = {},
+): RampsOrder => ({
+  isOnlyLink: false,
+  success: true,
+  cryptoAmount: '0.5',
+  fiatAmount: 100,
+  providerOrderId: 'v2-1',
+  providerOrderLink: 'https://example.com/order/1',
+  createdAt: 2000,
+  totalFeesFiat: 5,
+  txHash: '0xdef',
+  walletAddress: '0x123',
+  status: RampsOrderStatus.Completed,
+  network: { name: 'Ethereum', chainId: 'eip155:1' },
+  canBeUpdated: false,
+  idHasExpired: false,
+  excludeFromPurchases: false,
+  timeDescriptionPending: '5-10 minutes',
+  orderType: 'BUY',
+  provider: {
+    id: 'test-provider',
+    name: 'TestProvider',
+    environmentType: 'PRODUCTION',
+    description: '',
+    hqAddress: '',
+    links: [],
+    logos: { light: '', dark: '', height: 24, width: 79 },
+  },
+  cryptoCurrency: { symbol: 'ETH' },
+  fiatCurrency: { symbol: 'USD' },
+  ...overrides,
+});
+
+describe('displayOrder', () => {
+  describe('fiatOrderToDisplayOrder', () => {
+    it('converts a legacy FiatOrder to a DisplayOrder', () => {
+      const fiatOrder = createMockFiatOrder();
+      const result = fiatOrderToDisplayOrder(fiatOrder);
+      expect(result).toMatchSnapshot();
+    });
+
+    it('defaults cryptoAmount to 0 when undefined', () => {
+      const fiatOrder = createMockFiatOrder({ cryptoAmount: undefined });
+      const result = fiatOrderToDisplayOrder(fiatOrder);
+      expect(result.cryptoAmount).toBe(0);
+    });
+  });
+
+  describe('rampsOrderToDisplayOrder', () => {
+    it('converts a V2 RampsOrder to a DisplayOrder', () => {
+      const order = createMockRampsOrder();
+      const result = rampsOrderToDisplayOrder(order);
+      expect(result).toMatchSnapshot();
+    });
+
+    it('maps all RampsOrderStatus values to display strings', () => {
+      const statusMappings: {
+        input: RampsOrderStatus;
+        expected: string;
+      }[] = [
+        { input: RampsOrderStatus.Pending, expected: 'PENDING' },
+        { input: RampsOrderStatus.Created, expected: 'CREATED' },
+        { input: RampsOrderStatus.Precreated, expected: 'CREATED' },
+        { input: RampsOrderStatus.Unknown, expected: 'PENDING' },
+        { input: RampsOrderStatus.Completed, expected: 'COMPLETED' },
+        { input: RampsOrderStatus.Failed, expected: 'FAILED' },
+        { input: RampsOrderStatus.Cancelled, expected: 'CANCELLED' },
+        { input: RampsOrderStatus.IdExpired, expected: 'FAILED' },
+      ];
+
+      for (const { input, expected } of statusMappings) {
+        const order = createMockRampsOrder({ status: input });
+        expect(rampsOrderToDisplayOrder(order).status).toBe(expected);
+      }
+    });
+
+    it('handles missing optional fields gracefully', () => {
+      const order = createMockRampsOrder({
+        provider: undefined,
+        cryptoCurrency: undefined,
+        fiatCurrency: undefined,
+        network: { name: '', chainId: '' },
+      });
+      const result = rampsOrderToDisplayOrder(order);
+
+      expect(result.providerName).toBe('');
+      expect(result.cryptoCurrencySymbol).toBe('');
+      expect(result.fiatCurrencyCode).toBe('');
+      expect(result.network).toBe('');
+    });
+
+    it('converts a string createdAt (ISO date) to epoch milliseconds', () => {
+      const order = createMockRampsOrder({
+        createdAt: '2025-01-01T00:00:00.000Z' as unknown as number,
+      });
+      const result = rampsOrderToDisplayOrder(order);
+      expect(result.createdAt).toBe(
+        new Date('2025-01-01T00:00:00.000Z').getTime(),
+      );
+    });
+
+    it('falls back to 0 when createdAt is null', () => {
+      const order = createMockRampsOrder({
+        createdAt: null as unknown as number,
+      });
+      const result = rampsOrderToDisplayOrder(order);
+      expect(result.createdAt).toBe(0);
+    });
+  });
+
+  describe('mergeDisplayOrders', () => {
+    it('merges legacy and V2 orders sorted by createdAt descending', () => {
+      const legacyOrder = createMockFiatOrder({ createdAt: 1000 });
+      const v2Order = createMockRampsOrder({ createdAt: 2000 });
+
+      const result = mergeDisplayOrders([legacyOrder], [v2Order]);
+
+      expect(result).toHaveLength(2);
+      expect(result[0].source).toBe('v2');
+      expect(result[1].source).toBe('legacy');
+    });
+
+    it('filters out legacy RAMPS_V2 orders that already exist in controller', () => {
+      const legacyOrder = createMockFiatOrder({
+        provider: FIAT_ORDER_PROVIDERS.AGGREGATOR,
+      });
+      const v2RampsOrder = createMockRampsOrder({ providerOrderId: 'v2-1' });
+      const v2LegacyOrder = createMockFiatOrder({
+        id: '/providers/transak/orders/v2-1',
+        provider: FIAT_ORDER_PROVIDERS.RAMPS_V2,
+        data: v2RampsOrder as unknown as FiatOrder['data'],
+      });
+
+      const result = mergeDisplayOrders(
+        [legacyOrder, v2LegacyOrder],
+        [v2RampsOrder],
+      );
+
+      expect(result).toHaveLength(2);
+      expect(
+        result.find(
+          (o) =>
+            o.source === 'legacy' && o.id === '/providers/transak/orders/v2-1',
+        ),
+      ).toBeUndefined();
+      expect(
+        result.find((o) => o.source === 'v2' && o.id === 'v2-1'),
+      ).toBeDefined();
+    });
+
+    it('keeps legacy RAMPS_V2 orders not yet migrated to controller', () => {
+      const unmigratedRampsOrder = createMockRampsOrder({
+        providerOrderId: 'unmigrated-order',
+      });
+      const v2LegacyOrder = createMockFiatOrder({
+        id: '/providers/transak/orders/unmigrated-order',
+        provider: FIAT_ORDER_PROVIDERS.RAMPS_V2,
+        createdAt: 3000,
+        data: unmigratedRampsOrder as unknown as FiatOrder['data'],
+      });
+
+      const result = mergeDisplayOrders([v2LegacyOrder], []);
+
+      expect(result).toHaveLength(1);
+      expect(result[0].id).toBe('/providers/transak/orders/unmigrated-order');
+      expect(result[0].source).toBe('legacy');
+    });
+
+    it('returns empty array when no orders exist', () => {
+      const result = mergeDisplayOrders([], []);
+      expect(result).toEqual([]);
+    });
+
+    it('handles only legacy orders', () => {
+      const legacyOrder = createMockFiatOrder();
+      const result = mergeDisplayOrders([legacyOrder], []);
+
+      expect(result).toHaveLength(1);
+      expect(result[0].source).toBe('legacy');
+    });
+
+    it('handles only V2 orders', () => {
+      const v2Order = createMockRampsOrder();
+      const result = mergeDisplayOrders([], [v2Order]);
+
+      expect(result).toHaveLength(1);
+      expect(result[0].source).toBe('v2');
+    });
+
+    it('sorts multiple orders by createdAt descending', () => {
+      const orders = [
+        createMockFiatOrder({ id: 'a', createdAt: 1000 }),
+        createMockFiatOrder({ id: 'b', createdAt: 3000 }),
+      ];
+      const v2Orders = [
+        createMockRampsOrder({ providerOrderId: 'c', createdAt: 2000 }),
+        createMockRampsOrder({ providerOrderId: 'd', createdAt: 4000 }),
+      ];
+
+      const result = mergeDisplayOrders(orders, v2Orders);
+
+      expect(result.map((o) => o.createdAt)).toEqual([4000, 3000, 2000, 1000]);
+    });
+
+    it('sorts V2 orders with string createdAt correctly among legacy orders', () => {
+      const legacyOrder = createMockFiatOrder({
+        createdAt: new Date('2024-06-01T00:00:00.000Z').getTime(),
+      });
+      const v2Order = createMockRampsOrder({
+        createdAt: '2025-01-01T00:00:00.000Z' as unknown as number,
+      });
+
+      const result = mergeDisplayOrders([legacyOrder], [v2Order]);
+
+      expect(result[0].source).toBe('v2');
+      expect(result[1].source).toBe('legacy');
+    });
+  });
+});
diff --git a/app/components/UI/Ramp/utils/displayOrder.ts b/app/components/UI/Ramp/utils/displayOrder.ts
new file mode 100644
index 000000000000..2b9499b6077c
--- /dev/null
+++ b/app/components/UI/Ramp/utils/displayOrder.ts
@@ -0,0 +1,94 @@
+import { type RampsOrder, RampsOrderStatus } from '@metamask/ramps-controller';
+import {
+  type FiatOrder,
+  getProviderName,
+} from '../../../../reducers/fiatOrders';
+import { FIAT_ORDER_PROVIDERS } from '../../../../constants/on-ramp';
+
+export interface DisplayOrder {
+  id: string;
+  source: 'legacy' | 'v2';
+  providerName: string;
+  createdAt: number;
+  fiatAmount: number | string;
+  fiatCurrencyCode: string;
+  cryptoAmount: number | string;
+  cryptoCurrencySymbol: string;
+  network: string;
+  status: string;
+  orderType: string;
+  account: string;
+}
+
+function toEpochMs(value: unknown): number {
+  if (typeof value === 'number' && value > 0) return value;
+  if (typeof value === 'string') {
+    const ms = new Date(value).getTime();
+    if (!Number.isNaN(ms)) return ms;
+  }
+  return 0;
+}
+
+export function fiatOrderToDisplayOrder(order: FiatOrder): DisplayOrder {
+  return {
+    id: order.id,
+    source: 'legacy',
+    providerName: getProviderName(order.provider, order.data),
+    createdAt: toEpochMs(order.createdAt),
+    fiatAmount: order.amount,
+    fiatCurrencyCode: order.currency,
+    cryptoAmount: order.cryptoAmount ?? 0,
+    cryptoCurrencySymbol: order.cryptocurrency,
+    network: order.network,
+    status: order.state,
+    orderType: order.orderType as string,
+    account: order.account,
+  };
+}
+
+const RAMPS_STATUS_TO_DISPLAY: Record<RampsOrderStatus, string> = {
+  [RampsOrderStatus.Pending]: 'PENDING',
+  [RampsOrderStatus.Created]: 'CREATED',
+  [RampsOrderStatus.Precreated]: 'CREATED',
+  [RampsOrderStatus.Unknown]: 'PENDING',
+  [RampsOrderStatus.Completed]: 'COMPLETED',
+  [RampsOrderStatus.Failed]: 'FAILED',
+  [RampsOrderStatus.Cancelled]: 'CANCELLED',
+  [RampsOrderStatus.IdExpired]: 'FAILED',
+};
+
+export function rampsOrderToDisplayOrder(order: RampsOrder): DisplayOrder {
+  return {
+    id: order.providerOrderId,
+    source: 'v2',
+    providerName: order.provider?.name ?? '',
+    createdAt: toEpochMs(order.createdAt),
+    fiatAmount: order.fiatAmount,
+    fiatCurrencyCode: order.fiatCurrency?.symbol ?? '',
+    cryptoAmount: order.cryptoAmount,
+    cryptoCurrencySymbol: order.cryptoCurrency?.symbol ?? '',
+    network: order.network?.chainId ?? '',
+    status: RAMPS_STATUS_TO_DISPLAY[order.status] ?? 'PENDING',
+    orderType: order.orderType,
+    account: order.walletAddress,
+  };
+}
+
+export function mergeDisplayOrders(
+  legacyOrders: FiatOrder[],
+  v2Orders: RampsOrder[],
+): DisplayOrder[] {
+  const v2Ids = new Set(v2Orders.map((o) => o.providerOrderId));
+
+  const legacy = legacyOrders
+    .filter((o) => {
+      if (o.provider !== FIAT_ORDER_PROVIDERS.RAMPS_V2) return true;
+      const providerOrderId = (o.data as RampsOrder)?.providerOrderId ?? o.id;
+      return !v2Ids.has(providerOrderId);
+    })
+    .map(fiatOrderToDisplayOrder);
+
+  const v2 = v2Orders.map(rampsOrderToDisplayOrder);
+
+  return [...legacy, ...v2].sort((a, b) => b.createdAt - a.createdAt);
+}
diff --git a/app/components/UI/Ramp/utils/isHttpUnauthorized.test.ts b/app/components/UI/Ramp/utils/isHttpUnauthorized.test.ts
new file mode 100644
index 000000000000..c972b307a8d3
--- /dev/null
+++ b/app/components/UI/Ramp/utils/isHttpUnauthorized.test.ts
@@ -0,0 +1,51 @@
+import { isHttpUnauthorized } from './isHttpUnauthorized';
+
+describe('isHttpUnauthorized', () => {
+  it('returns true for HttpError with httpStatus 401', () => {
+    expect(isHttpUnauthorized({ httpStatus: 401 })).toBe(true);
+  });
+
+  it('returns true for Axios-style error with status 401', () => {
+    expect(isHttpUnauthorized({ status: 401 })).toBe(true);
+  });
+
+  it('returns false for non-401 httpStatus', () => {
+    expect(isHttpUnauthorized({ httpStatus: 403 })).toBe(false);
+  });
+
+  it('returns false for non-401 status', () => {
+    expect(isHttpUnauthorized({ status: 500 })).toBe(false);
+  });
+
+  it('returns false for null', () => {
+    expect(isHttpUnauthorized(null)).toBe(false);
+  });
+
+  it('returns false for undefined', () => {
+    expect(isHttpUnauthorized(undefined)).toBe(false);
+  });
+
+  it('returns false for a string', () => {
+    expect(isHttpUnauthorized('401')).toBe(false);
+  });
+
+  it('returns false for a number', () => {
+    expect(isHttpUnauthorized(401)).toBe(false);
+  });
+
+  it('returns false for an empty object', () => {
+    expect(isHttpUnauthorized({})).toBe(false);
+  });
+
+  it('returns true when both httpStatus and status are 401', () => {
+    expect(isHttpUnauthorized({ httpStatus: 401, status: 401 })).toBe(true);
+  });
+
+  it('returns true when only httpStatus is 401 and status is different', () => {
+    expect(isHttpUnauthorized({ httpStatus: 401, status: 200 })).toBe(true);
+  });
+
+  it('returns true when only status is 401 and httpStatus is different', () => {
+    expect(isHttpUnauthorized({ httpStatus: 200, status: 401 })).toBe(true);
+  });
+});
diff --git a/app/components/UI/Ramp/utils/isHttpUnauthorized.ts b/app/components/UI/Ramp/utils/isHttpUnauthorized.ts
new file mode 100644
index 000000000000..00d275b65440
--- /dev/null
+++ b/app/components/UI/Ramp/utils/isHttpUnauthorized.ts
@@ -0,0 +1,11 @@
+/**
+ * Checks whether an error represents an HTTP 401 Unauthorized response.
+ *
+ * Supports both `HttpError` from `@metamask/controller-utils` (which uses
+ * `.httpStatus`) and legacy Axios-style errors (which use `.status`).
+ */
+export function isHttpUnauthorized(error: unknown): boolean {
+  if (typeof error !== 'object' || error === null) return false;
+  const e = error as Record<string, unknown>;
+  return e.httpStatus === 401 || e.status === 401;
+}
diff --git a/app/components/UI/Ramp/utils/isRampsUnifiedV2Enabled.test.ts b/app/components/UI/Ramp/utils/isRampsUnifiedV2Enabled.test.ts
new file mode 100644
index 000000000000..fb04ee960b99
--- /dev/null
+++ b/app/components/UI/Ramp/utils/isRampsUnifiedV2Enabled.test.ts
@@ -0,0 +1,124 @@
+import initialRootState, {
+  backgroundState,
+} from '../../../../util/test/initial-root-state';
+import { isRampsUnifiedV2Enabled } from './isRampsUnifiedV2Enabled';
+import { getVersion } from 'react-native-device-info';
+
+jest.mock('react-native-device-info', () => ({
+  getVersion: jest.fn(),
+}));
+
+function buildState({
+  active = true,
+  minimumVersion,
+}: {
+  active?: boolean;
+  minimumVersion?: string | null;
+} = {}) {
+  return {
+    ...initialRootState,
+    engine: {
+      backgroundState: {
+        ...backgroundState,
+        RemoteFeatureFlagController: {
+          ...backgroundState.RemoteFeatureFlagController,
+          remoteFeatureFlags: {
+            rampsUnifiedBuyV2: {
+              active,
+              ...(minimumVersion !== undefined && { minimumVersion }),
+            },
+          },
+        },
+      },
+    },
+  };
+}
+
+describe('isRampsUnifiedV2Enabled', () => {
+  const mockGetVersion = jest.mocked(getVersion);
+  const originalEnv = process.env;
+
+  beforeEach(() => {
+    jest.clearAllMocks();
+    process.env = { ...originalEnv };
+    delete process.env.MM_RAMPS_UNIFIED_BUY_V2_ENABLED;
+  });
+
+  afterAll(() => {
+    process.env = originalEnv;
+  });
+
+  describe('build flag precedence', () => {
+    it('returns true when build flag is "true" regardless of remote flags', () => {
+      process.env.MM_RAMPS_UNIFIED_BUY_V2_ENABLED = 'true';
+
+      const result = isRampsUnifiedV2Enabled(
+        buildState({ active: false, minimumVersion: '99.0.0' }),
+      );
+
+      expect(result).toBe(true);
+    });
+
+    it('returns false when build flag is "false" regardless of remote flags', () => {
+      process.env.MM_RAMPS_UNIFIED_BUY_V2_ENABLED = 'false';
+
+      const result = isRampsUnifiedV2Enabled(
+        buildState({ active: true, minimumVersion: '1.0.0' }),
+      );
+
+      expect(result).toBe(false);
+    });
+  });
+
+  describe('remote feature flag behavior when build flag is not set', () => {
+    it('returns true when active and version meets minimum requirement', () => {
+      mockGetVersion.mockReturnValue('8.0.0');
+
+      const result = isRampsUnifiedV2Enabled(
+        buildState({ active: true, minimumVersion: '7.63.0' }),
+      );
+
+      expect(result).toBe(true);
+    });
+
+    it('returns false when active flag is false', () => {
+      mockGetVersion.mockReturnValue('8.0.0');
+
+      const result = isRampsUnifiedV2Enabled(
+        buildState({ active: false, minimumVersion: '7.63.0' }),
+      );
+
+      expect(result).toBe(false);
+    });
+
+    it('returns false when version does not meet minimum requirement', () => {
+      mockGetVersion.mockReturnValue('7.0.0');
+
+      const result = isRampsUnifiedV2Enabled(
+        buildState({ active: true, minimumVersion: '7.63.0' }),
+      );
+
+      expect(result).toBe(false);
+    });
+
+    it('returns false when minimumVersion is not configured', () => {
+      mockGetVersion.mockReturnValue('8.0.0');
+
+      const result = isRampsUnifiedV2Enabled(
+        buildState({ active: true, minimumVersion: null }),
+      );
+
+      expect(result).toBe(false);
+    });
+
+    it('returns true when version exactly equals minimum version', () => {
+      mockGetVersion.mockReturnValue('7.63.0');
+
+      const result = isRampsUnifiedV2Enabled(
+        buildState({ active: true, minimumVersion: '7.63.0' }),
+      );
+
+      expect(result).toBe(true);
+    });
+  });
+});
diff --git a/app/components/UI/Ramp/utils/isRampsUnifiedV2Enabled.ts b/app/components/UI/Ramp/utils/isRampsUnifiedV2Enabled.ts
new file mode 100644
index 000000000000..5065e228945d
--- /dev/null
+++ b/app/components/UI/Ramp/utils/isRampsUnifiedV2Enabled.ts
@@ -0,0 +1,22 @@
+import {
+  selectRampsUnifiedBuyV2ActiveFlag,
+  selectRampsUnifiedBuyV2MinimumVersionFlag,
+} from '../../../../selectors/featureFlagController/ramps/rampsUnifiedBuyV2';
+import { hasMinimumRequiredVersion } from './hasMinimumRequiredVersion';
+import { RootState } from '../../../../reducers';
+
+/**
+ * Non-hook equivalent of useRampsUnifiedV2Enabled.
+ * Checks build flag override, active flag, and minimum version gate.
+ * Use this in thunks / plain functions where hooks aren't available.
+ */
+export function isRampsUnifiedV2Enabled(state: RootState): boolean {
+  const buildFlag = process.env.MM_RAMPS_UNIFIED_BUY_V2_ENABLED;
+  if (buildFlag === 'true' || buildFlag === 'false') {
+    return buildFlag === 'true';
+  }
+
+  const activeFlag = selectRampsUnifiedBuyV2ActiveFlag(state);
+  const minimumVersion = selectRampsUnifiedBuyV2MinimumVersionFlag(state);
+  return hasMinimumRequiredVersion(minimumVersion, activeFlag);
+}
diff --git a/app/components/UI/Ramp/utils/v2OrderToast.test.ts b/app/components/UI/Ramp/utils/v2OrderToast.test.ts
new file mode 100644
index 000000000000..a77cc25c81ed
--- /dev/null
+++ b/app/components/UI/Ramp/utils/v2OrderToast.test.ts
@@ -0,0 +1,226 @@
+import { RampsOrderStatus } from '@metamask/ramps-controller';
+import { ToastVariants } from '../../../../component-library/components/Toast/Toast.types';
+import {
+  buildV2OrderToastOptions,
+  showV2OrderToast,
+  V2OrderToastParams,
+} from './v2OrderToast';
+import ToastService from '../../../../core/ToastService';
+import NavigationService from '../../../../core/NavigationService';
+import Routes from '../../../../constants/navigation/Routes';
+import { strings } from '../../../../../locales/i18n';
+
+jest.mock('../../../../core/ToastService');
+jest.mock('../../../../core/NavigationService', () => ({
+  navigation: {
+    navigate: jest.fn(),
+  },
+}));
+jest.mock('../../../../../locales/i18n', () => ({
+  strings: jest.fn(),
+}));
+
+describe('v2OrderToast', () => {
+  const mockToastService = ToastService as jest.Mocked<typeof ToastService>;
+
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  describe('buildV2OrderToastOptions', () => {
+    it('returns toast options for PENDING state with spinner and Track button', () => {
+      (strings as jest.Mock)
+        .mockReturnValueOnce('Processing your purchase of ETH')
+        .mockReturnValueOnce('This should only take a few minutes...')
+        .mockReturnValueOnce('Track');
+
+      const params: V2OrderToastParams = {
+        orderId: 'test-order-id',
+        cryptocurrency: 'ETH',
+        cryptoAmount: 1.5,
+        status: RampsOrderStatus.Pending,
+      };
+
+      const result = buildV2OrderToastOptions(params);
+
+      expect(result).not.toBeNull();
+      expect(result?.variant).toBe(ToastVariants.Plain);
+      expect(result?.hasNoTimeout).toBe(false);
+      expect(result?.startAccessory).toBeDefined();
+      expect(result?.labelOptions?.[0]?.label).toBe(
+        'Processing your purchase of ETH',
+      );
+      expect(result?.labelOptions?.[0]?.isBold).toBe(true);
+      expect(result?.descriptionOptions?.description).toBe(
+        'This should only take a few minutes...',
+      );
+      expect(result?.linkButtonOptions?.label).toBe('Track');
+      expect(result?.linkButtonOptions?.onPress).toBeDefined();
+    });
+
+    it('navigates to order details when Track button is pressed', () => {
+      (strings as jest.Mock)
+        .mockReturnValueOnce('Processing your purchase of ETH')
+        .mockReturnValueOnce('This should only take a few minutes...')
+        .mockReturnValueOnce('Track');
+
+      const params: V2OrderToastParams = {
+        orderId: 'test-order-id',
+        cryptocurrency: 'ETH',
+        status: RampsOrderStatus.Pending,
+      };
+
+      const result = buildV2OrderToastOptions(params);
+      result?.linkButtonOptions?.onPress();
+
+      expect(mockToastService.closeToast).toHaveBeenCalled();
+      expect(NavigationService.navigation.navigate).toHaveBeenCalledWith(
+        Routes.RAMP.RAMPS_ORDER_DETAILS,
+        { orderId: 'test-order-id', showCloseButton: true },
+      );
+    });
+
+    it('returns toast options for COMPLETED state with success icon', () => {
+      (strings as jest.Mock)
+        .mockReturnValueOnce('Your purchase of 100.5 USDC was successful!')
+        .mockReturnValueOnce('Your USDC is now available');
+
+      const params: V2OrderToastParams = {
+        orderId: 'test-order-id',
+        cryptocurrency: 'USDC',
+        cryptoAmount: 100.5,
+        status: RampsOrderStatus.Completed,
+      };
+
+      const result = buildV2OrderToastOptions(params);
+
+      expect(result).not.toBeNull();
+      expect(result?.variant).toBe(ToastVariants.Plain);
+      expect(result?.hasNoTimeout).toBe(false);
+      expect(result?.startAccessory).toBeDefined();
+      expect(result?.labelOptions?.[0]?.label).toBe(
+        'Your purchase of 100.5 USDC was successful!',
+      );
+      expect(result?.labelOptions?.[0]?.isBold).toBe(true);
+      expect(result?.descriptionOptions?.description).toBe(
+        'Your USDC is now available',
+      );
+      expect(result?.linkButtonOptions).toBeUndefined();
+    });
+
+    it('returns toast options for Failed status with error icon', () => {
+      (strings as jest.Mock)
+        .mockReturnValueOnce('Purchase of BTC failed')
+        .mockReturnValueOnce('Please try again momentarily');
+
+      const params: V2OrderToastParams = {
+        orderId: 'test-order-id',
+        cryptocurrency: 'BTC',
+        status: RampsOrderStatus.Failed,
+      };
+
+      const result = buildV2OrderToastOptions(params);
+
+      expect(result).not.toBeNull();
+      expect(result?.variant).toBe(ToastVariants.Plain);
+      expect(result?.hasNoTimeout).toBe(false);
+      expect(result?.startAccessory).toBeDefined();
+      expect(result?.labelOptions?.[0]?.label).toBe('Purchase of BTC failed');
+      expect(result?.labelOptions?.[0]?.isBold).toBe(true);
+      expect(result?.descriptionOptions?.description).toBe(
+        'Please try again momentarily',
+      );
+    });
+
+    it('returns toast options for Cancelled status with warning icon', () => {
+      (strings as jest.Mock)
+        .mockReturnValueOnce('Your purchase was cancelled')
+        .mockReturnValueOnce('Your purchase of DAI has been cancelled');
+
+      const params: V2OrderToastParams = {
+        orderId: 'test-order-id',
+        cryptocurrency: 'DAI',
+        status: RampsOrderStatus.Cancelled,
+      };
+
+      const result = buildV2OrderToastOptions(params);
+
+      expect(result).not.toBeNull();
+      expect(result?.variant).toBe(ToastVariants.Plain);
+      expect(result?.hasNoTimeout).toBe(false);
+      expect(result?.startAccessory).toBeDefined();
+      expect(result?.labelOptions?.[0]?.label).toBe(
+        'Your purchase was cancelled',
+      );
+      expect(result?.labelOptions?.[0]?.isBold).toBe(true);
+      expect(result?.descriptionOptions?.description).toBe(
+        'Your purchase of DAI has been cancelled',
+      );
+    });
+
+    it('returns null for Created status', () => {
+      const params: V2OrderToastParams = {
+        orderId: 'test-order-id',
+        cryptocurrency: 'ETH',
+        status: RampsOrderStatus.Created,
+      };
+
+      const result = buildV2OrderToastOptions(params);
+
+      expect(result).toBeNull();
+    });
+
+    it('handles missing cryptoAmount for Completed status', () => {
+      (strings as jest.Mock)
+        .mockReturnValueOnce('Your purchase of  ETH was successful!')
+        .mockReturnValueOnce('Your ETH is now available');
+
+      const params: V2OrderToastParams = {
+        orderId: 'test-order-id',
+        cryptocurrency: 'ETH',
+        status: RampsOrderStatus.Completed,
+      };
+
+      const result = buildV2OrderToastOptions(params);
+
+      expect(result).not.toBeNull();
+      expect(result?.labelOptions?.[0]?.label).toBe(
+        'Your purchase of  ETH was successful!',
+      );
+    });
+  });
+
+  describe('showV2OrderToast', () => {
+    it('calls ToastService.showToast with valid toast options', () => {
+      (strings as jest.Mock)
+        .mockReturnValueOnce('Your purchase of 1.5 ETH was successful!')
+        .mockReturnValueOnce('Your ETH is now available');
+
+      const params: V2OrderToastParams = {
+        orderId: 'test-order-id',
+        cryptocurrency: 'ETH',
+        cryptoAmount: 1.5,
+        status: RampsOrderStatus.Completed,
+      };
+
+      showV2OrderToast(params);
+
+      expect(mockToastService.showToast).toHaveBeenCalledTimes(1);
+      const callArg = mockToastService.showToast.mock.calls[0][0];
+      expect(callArg.variant).toBe(ToastVariants.Plain);
+      expect(callArg.startAccessory).toBeDefined();
+    });
+
+    it('does not call ToastService.showToast for Created status', () => {
+      const params: V2OrderToastParams = {
+        orderId: 'test-order-id',
+        cryptocurrency: 'ETH',
+        status: RampsOrderStatus.Created,
+      };
+
+      showV2OrderToast(params);
+
+      expect(mockToastService.showToast).not.toHaveBeenCalled();
+    });
+  });
+});
diff --git a/app/components/UI/Ramp/utils/v2OrderToast.ts b/app/components/UI/Ramp/utils/v2OrderToast.ts
new file mode 100644
index 000000000000..39bb3d6852e0
--- /dev/null
+++ b/app/components/UI/Ramp/utils/v2OrderToast.ts
@@ -0,0 +1,216 @@
+import React from 'react';
+import { StyleSheet, View } from 'react-native';
+import {
+  IconColor as ReactNativeDsIconColor,
+  IconSize as ReactNativeDsIconSize,
+} from '@metamask/design-system-react-native';
+import { Spinner } from '@metamask/design-system-react-native/dist/components/temp-components/Spinner/index.cjs';
+import { lightTheme } from '@metamask/design-tokens';
+import { strings } from '../../../../../locales/i18n';
+import { IconName } from '../../../../component-library/components/Icons/Icon';
+import {
+  ToastOptions,
+  ToastVariants,
+} from '../../../../component-library/components/Toast/Toast.types';
+import { RampsOrderStatus } from '@metamask/ramps-controller';
+import Routes from '../../../../constants/navigation/Routes';
+import NavigationService from '../../../../core/NavigationService';
+import ToastService from '../../../../core/ToastService';
+import { renderNumber } from '../../../../util/number';
+import Avatar, {
+  AvatarSize,
+  AvatarVariant,
+} from '../../../../component-library/components/Avatars/Avatar';
+
+export interface V2OrderToastParams {
+  orderId: string;
+  cryptocurrency: string;
+  cryptoAmount?: string | number;
+  status: RampsOrderStatus;
+}
+
+const toastStyles = StyleSheet.create({
+  spinnerContainer: {
+    paddingTop: 4,
+    marginRight: 12,
+    alignSelf: 'flex-start',
+    alignItems: 'flex-start',
+    justifyContent: 'flex-start',
+  },
+  iconContainer: {
+    paddingTop: 0,
+    marginRight: 12,
+    alignSelf: 'flex-start',
+    alignItems: 'flex-start',
+    justifyContent: 'flex-start',
+  },
+});
+
+/**
+ * Builds toast options for V2 Ramps orders based on order status.
+ * Returns null for statuses that don't warrant a toast (Created, Precreated, Unknown, IdExpired).
+ */
+export function buildV2OrderToastOptions(
+  params: V2OrderToastParams,
+): ToastOptions | null {
+  const { orderId, cryptocurrency, cryptoAmount, status } = params;
+
+  switch (status) {
+    case RampsOrderStatus.Pending: {
+      return {
+        variant: ToastVariants.Plain,
+        hasNoTimeout: false,
+        startAccessory: React.createElement(
+          View,
+          { style: toastStyles.spinnerContainer },
+          React.createElement(Spinner, {
+            color: ReactNativeDsIconColor.PrimaryDefault,
+            spinnerIconProps: { size: ReactNativeDsIconSize.Xl },
+          }),
+        ),
+        labelOptions: [
+          {
+            label: strings('ramps_v2.notifications.purchase_pending_title', {
+              cryptocurrency,
+            }),
+            isBold: true,
+          },
+        ],
+        descriptionOptions: {
+          description: strings(
+            'ramps_v2.notifications.purchase_pending_description',
+          ),
+        },
+        linkButtonOptions: {
+          label: strings('ramps_v2.notifications.track'),
+          onPress: () => {
+            ToastService.closeToast();
+            NavigationService.navigation.navigate(
+              Routes.RAMP.RAMPS_ORDER_DETAILS,
+              { orderId, showCloseButton: true },
+            );
+          },
+        },
+      };
+    }
+
+    case RampsOrderStatus.Completed: {
+      const formattedAmount = cryptoAmount
+        ? renderNumber(String(cryptoAmount))
+        : '';
+      return {
+        variant: ToastVariants.Plain,
+        hasNoTimeout: false,
+        startAccessory: React.createElement(
+          View,
+          { style: toastStyles.iconContainer },
+          React.createElement(Avatar, {
+            variant: AvatarVariant.Icon,
+            name: IconName.Confirmation,
+            size: AvatarSize.Lg,
+            iconColor: lightTheme.colors.success.default,
+            backgroundColor: 'transparent',
+          }),
+        ),
+        labelOptions: [
+          {
+            label: strings('ramps_v2.notifications.purchase_completed_title', {
+              amount: formattedAmount,
+              cryptocurrency,
+            }),
+            isBold: true,
+          },
+        ],
+        descriptionOptions: {
+          description: strings(
+            'ramps_v2.notifications.purchase_completed_description',
+            {
+              cryptocurrency,
+            },
+          ),
+        },
+      };
+    }
+
+    case RampsOrderStatus.Failed: {
+      return {
+        variant: ToastVariants.Plain,
+        hasNoTimeout: false,
+        startAccessory: React.createElement(
+          View,
+          { style: toastStyles.iconContainer },
+          React.createElement(Avatar, {
+            variant: AvatarVariant.Icon,
+            name: IconName.Warning,
+            size: AvatarSize.Lg,
+            iconColor: lightTheme.colors.error.default,
+            backgroundColor: 'transparent',
+          }),
+        ),
+        labelOptions: [
+          {
+            label: strings('ramps_v2.notifications.purchase_failed_title', {
+              cryptocurrency,
+            }),
+            isBold: true,
+          },
+        ],
+        descriptionOptions: {
+          description: strings(
+            'ramps_v2.notifications.purchase_failed_description',
+          ),
+        },
+      };
+    }
+
+    case RampsOrderStatus.Cancelled: {
+      return {
+        variant: ToastVariants.Plain,
+        hasNoTimeout: false,
+        startAccessory: React.createElement(
+          View,
+          { style: toastStyles.iconContainer },
+          React.createElement(Avatar, {
+            variant: AvatarVariant.Icon,
+            name: IconName.Warning,
+            size: AvatarSize.Lg,
+            iconColor: lightTheme.colors.warning.default,
+            backgroundColor: 'transparent',
+          }),
+        ),
+        labelOptions: [
+          {
+            label: strings('ramps_v2.notifications.purchase_cancelled_title'),
+            isBold: true,
+          },
+        ],
+        descriptionOptions: {
+          description: strings(
+            'ramps_v2.notifications.purchase_cancelled_description',
+            {
+              cryptocurrency,
+            },
+          ),
+        },
+      };
+    }
+
+    case RampsOrderStatus.Created:
+    case RampsOrderStatus.Precreated:
+    case RampsOrderStatus.Unknown:
+    case RampsOrderStatus.IdExpired:
+    default:
+      return null;
+  }
+}
+
+/**
+ * Shows a toast notification for V2 Ramps orders.
+ * No-op for statuses that don't warrant a toast (e.g., Created).
+ */
+export function showV2OrderToast(params: V2OrderToastParams): void {
+  const toastOptions = buildV2OrderToastOptions(params);
+  if (toastOptions) {
+    ToastService.showToast(toastOptions);
+  }
+}
diff --git a/app/components/UI/ReceiveRequest/__snapshots__/index.test.tsx.snap b/app/components/UI/ReceiveRequest/__snapshots__/index.test.tsx.snap
index 3c46795069af..49565ff43a31 100644
--- a/app/components/UI/ReceiveRequest/__snapshots__/index.test.tsx.snap
+++ b/app/components/UI/ReceiveRequest/__snapshots__/index.test.tsx.snap
@@ -361,7 +361,7 @@ exports[`ReceiveRequest render matches snapshot 1`] = `
                               [
                                 {
                                   "backgroundColor": "#ffffff",
-                                  "borderColor": "#b7bbc866",
+                                  "borderColor": "#b4b4b566",
                                   "borderRadius": 16,
                                   "borderWidth": 1,
                                   "display": "flex",
@@ -454,7 +454,7 @@ exports[`ReceiveRequest render matches snapshot 1`] = `
                             [
                               {
                                 "alignItems": "center",
-                                "backgroundColor": "#3c4d9d0f",
+                                "backgroundColor": "#b4b4b528",
                                 "borderColor": "transparent",
                                 "borderRadius": 12,
                                 "borderWidth": 1,
@@ -487,7 +487,7 @@ exports[`ReceiveRequest render matches snapshot 1`] = `
                             style={
                               [
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "flexGrow": 0,
                                   "flexShrink": 1,
                                   "flexWrap": "wrap",
@@ -881,7 +881,7 @@ exports[`ReceiveRequest render with different ticker matches snapshot 1`] = `
                               [
                                 {
                                   "backgroundColor": "#ffffff",
-                                  "borderColor": "#b7bbc866",
+                                  "borderColor": "#b4b4b566",
                                   "borderRadius": 16,
                                   "borderWidth": 1,
                                   "display": "flex",
@@ -974,7 +974,7 @@ exports[`ReceiveRequest render with different ticker matches snapshot 1`] = `
                             [
                               {
                                 "alignItems": "center",
-                                "backgroundColor": "#3c4d9d0f",
+                                "backgroundColor": "#b4b4b528",
                                 "borderColor": "transparent",
                                 "borderRadius": 12,
                                 "borderWidth": 1,
@@ -1007,7 +1007,7 @@ exports[`ReceiveRequest render with different ticker matches snapshot 1`] = `
                             style={
                               [
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "flexGrow": 0,
                                   "flexShrink": 1,
                                   "flexWrap": "wrap",
@@ -1401,7 +1401,7 @@ exports[`ReceiveRequest render without buy matches snapshot 1`] = `
                               [
                                 {
                                   "backgroundColor": "#ffffff",
-                                  "borderColor": "#b7bbc866",
+                                  "borderColor": "#b4b4b566",
                                   "borderRadius": 16,
                                   "borderWidth": 1,
                                   "display": "flex",
@@ -1494,7 +1494,7 @@ exports[`ReceiveRequest render without buy matches snapshot 1`] = `
                             [
                               {
                                 "alignItems": "center",
-                                "backgroundColor": "#3c4d9d0f",
+                                "backgroundColor": "#b4b4b528",
                                 "borderColor": "transparent",
                                 "borderRadius": 12,
                                 "borderWidth": 1,
@@ -1527,7 +1527,7 @@ exports[`ReceiveRequest render without buy matches snapshot 1`] = `
                             style={
                               [
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "flexGrow": 0,
                                   "flexShrink": 1,
                                   "flexWrap": "wrap",
diff --git a/app/components/UI/ReusableModal/__snapshots__/index.test.tsx.snap b/app/components/UI/ReusableModal/__snapshots__/index.test.tsx.snap
index 52e75e9cf08b..8df7e930331a 100644
--- a/app/components/UI/ReusableModal/__snapshots__/index.test.tsx.snap
+++ b/app/components/UI/ReusableModal/__snapshots__/index.test.tsx.snap
@@ -31,7 +31,7 @@ exports[`ReusableModal should render correctly 1`] = `
         style={
           [
             {
-              "backgroundColor": "#3f434a66",
+              "backgroundColor": "#0a0d135c",
               "bottom": 0,
               "left": 0,
               "position": "absolute",
diff --git a/app/components/UI/Rewards/RewardsNavigator.tsx b/app/components/UI/Rewards/RewardsNavigator.tsx
index d17df8be9199..f80b682809e0 100644
--- a/app/components/UI/Rewards/RewardsNavigator.tsx
+++ b/app/components/UI/Rewards/RewardsNavigator.tsx
@@ -63,7 +63,7 @@ const RewardsNavigator: React.FC = () => {
           <Stack.Screen
             name={Routes.REWARDS_SETTINGS_VIEW}
             component={RewardsSettingsView}
-            options={{ headerShown: true }}
+            options={{ headerShown: false }}
           />
         </>
       ) : null}
diff --git a/app/components/UI/Rewards/Views/RewardsDashboard.test.tsx b/app/components/UI/Rewards/Views/RewardsDashboard.test.tsx
index 5142d41c9857..3a0f95ef0292 100644
--- a/app/components/UI/Rewards/Views/RewardsDashboard.test.tsx
+++ b/app/components/UI/Rewards/Views/RewardsDashboard.test.tsx
@@ -115,15 +115,27 @@ jest.mock('../../../../util/theme', () => ({
   }),
 }));
 
-// Mock useSafeAreaInsets
-jest.mock('react-native-safe-area-context', () => ({
-  useSafeAreaInsets: jest.fn(() => ({
-    top: 0,
-    right: 0,
-    bottom: 0,
-    left: 0,
-  })),
-}));
+// Mock react-native-safe-area-context
+jest.mock('react-native-safe-area-context', () => {
+  const React = jest.requireActual('react');
+  const { View } = jest.requireActual('react-native');
+  return {
+    useSafeAreaInsets: jest.fn(() => ({
+      top: 0,
+      right: 0,
+      bottom: 0,
+      left: 0,
+    })),
+    SafeAreaView: ({
+      children,
+      testID,
+      ...props
+    }: {
+      children: React.ReactNode;
+      testID?: string;
+    }) => React.createElement(View, { ...props, testID }, children),
+  };
+});
 
 // Mock useMetrics hook
 const mockTrackEvent = jest.fn();
@@ -185,11 +197,6 @@ jest.mock('../../../../../locales/i18n', () => ({
   }),
 }));
 
-// Mock getNavigationOptionsTitle
-jest.mock('../../Navbar', () => ({
-  getNavigationOptionsTitle: jest.fn(() => ({ title: 'Rewards' })),
-}));
-
 // Mock ErrorBoundary
 jest.mock('../../../Views/ErrorBoundary', () => ({
   __esModule: true,
@@ -469,86 +476,6 @@ jest.mock('../../../../component-library/components-temp/Tabs', () => {
   };
 });
 
-// Mock TabBar
-jest.mock('../../../../component-library/components-temp/TabBar', () => ({
-  __esModule: true,
-  default: function MockTabBar({
-    tabs,
-    activeTab,
-    goToPage,
-    style,
-    tabStyle,
-    underlineStyle,
-  }: {
-    tabs: { key: string; label: string; index: number }[];
-    activeTab: number;
-    goToPage: (index: number) => void;
-    style: Record<string, unknown>;
-    tabStyle: Record<string, unknown>;
-    underlineStyle: Record<string, unknown>;
-  }) {
-    const ReactActual = jest.requireActual('react');
-    const { View, TouchableOpacity, Text } = jest.requireActual('react-native');
-
-    return ReactActual.createElement(
-      View,
-      { testID: 'tab-bar', style },
-      tabs?.map((tab, index) =>
-        ReactActual.createElement(
-          TouchableOpacity,
-          {
-            key: tab.key,
-            testID: `tab-${index}`,
-            onPress: () => goToPage(index),
-            style: tabStyle,
-          },
-          ReactActual.createElement(
-            Text,
-            {
-              style: {
-                fontWeight: activeTab === index ? 'bold' : 'normal',
-              },
-            },
-            tab.label,
-          ),
-        ),
-      ),
-      ReactActual.createElement(View, { style: underlineStyle }),
-    );
-  },
-}));
-
-// Mock design system components
-jest.mock('@metamask/design-system-react-native', () => {
-  const ReactActual = jest.requireActual('react');
-  const { Text, TouchableOpacity } = jest.requireActual('react-native');
-
-  return {
-    ...jest.requireActual('@metamask/design-system-react-native'),
-    ButtonIcon: ({
-      iconName,
-      disabled,
-      testID,
-      onPress,
-    }: {
-      iconName: string;
-      size: string;
-      disabled: boolean;
-      testID: string;
-      onPress: () => void;
-    }) =>
-      ReactActual.createElement(
-        TouchableOpacity,
-        {
-          testID,
-          disabled,
-          onPress,
-        },
-        ReactActual.createElement(Text, null, `Icon: ${iconName}`),
-      ),
-  };
-});
-
 // Mock Alert
 const mockAlert = jest.fn();
 jest.spyOn(Alert, 'alert').mockImplementation(mockAlert);
@@ -928,28 +855,58 @@ describe('RewardsDashboard', () => {
     });
   });
 
-  describe('navigation', () => {
-    it('should set navigation options on mount', async () => {
-      // Act
-      render(<RewardsDashboard />);
+  describe('header and SafeAreaView', () => {
+    it('renders SafeAreaView wrapper', () => {
+      const { getByTestId } = render(<RewardsDashboard />);
 
-      // Assert
-      await waitFor(() => {
-        expect(mockSetOptions).toHaveBeenCalled();
-      });
+      expect(
+        getByTestId(REWARDS_VIEW_SELECTORS.SAFE_AREA_VIEW),
+      ).toBeOnTheScreen();
+    });
+
+    it('renders HeaderRoot with title Rewards', () => {
+      const { getByText } = render(<RewardsDashboard />);
+
+      expect(getByText('Rewards')).toBeOnTheScreen();
     });
 
+    it('renders settings button in header', () => {
+      const { getByTestId } = render(<RewardsDashboard />);
+
+      expect(
+        getByTestId(REWARDS_VIEW_SELECTORS.SETTINGS_BUTTON),
+      ).toBeOnTheScreen();
+    });
+
+    it('renders referral button in header', () => {
+      const { getByTestId } = render(<RewardsDashboard />);
+
+      expect(
+        getByTestId(REWARDS_VIEW_SELECTORS.REFERRAL_BUTTON),
+      ).toBeOnTheScreen();
+    });
+  });
+
+  describe('navigation', () => {
     it('should navigate to referral view when referral button is pressed', () => {
-      // Act
       const { getByTestId } = render(<RewardsDashboard />);
       const referralButton = getByTestId(
         REWARDS_VIEW_SELECTORS.REFERRAL_BUTTON,
       );
       fireEvent.press(referralButton);
 
-      // Assert
       expect(mockNavigate).toHaveBeenCalledWith(Routes.REFERRAL_REWARDS_VIEW);
     });
+
+    it('navigates to Rewards settings when settings button is pressed', () => {
+      const { getByTestId } = render(<RewardsDashboard />);
+      const settingsButton = getByTestId(
+        REWARDS_VIEW_SELECTORS.SETTINGS_BUTTON,
+      );
+      fireEvent.press(settingsButton);
+
+      expect(mockNavigate).toHaveBeenCalledWith(Routes.REWARDS_SETTINGS_VIEW);
+    });
   });
 
   describe('tab functionality', () => {
@@ -1300,49 +1257,49 @@ describe('RewardsDashboard', () => {
     });
 
     it('should disable referral button when user is not opted in', () => {
-      // Act
       const { getByTestId } = render(<RewardsDashboard />);
       const referralButton = getByTestId(
         REWARDS_VIEW_SELECTORS.REFERRAL_BUTTON,
       );
-
-      // Assert
-      expect(referralButton.props.disabled).toBe(true);
+      const isDisabled =
+        referralButton.props.disabled === true ||
+        referralButton.props.accessibilityState?.disabled === true;
+      expect(isDisabled).toBe(true);
     });
 
     it('should disable settings button when user is not opted in', () => {
-      // Act
       const { getByTestId } = render(<RewardsDashboard />);
       const settingsButton = getByTestId(
         REWARDS_VIEW_SELECTORS.SETTINGS_BUTTON,
       );
-
-      // Assert
-      expect(settingsButton.props.disabled).toBe(true);
+      const isDisabled =
+        settingsButton.props.disabled === true ||
+        settingsButton.props.accessibilityState?.disabled === true;
+      expect(isDisabled).toBe(true);
     });
   });
 
   describe('button states when opted in', () => {
     it('should enable referral button when user is opted in', () => {
-      // Act
       const { getByTestId } = render(<RewardsDashboard />);
       const referralButton = getByTestId(
         REWARDS_VIEW_SELECTORS.REFERRAL_BUTTON,
       );
-
-      // Assert
-      expect(referralButton.props.disabled).toBe(false);
+      const isDisabled =
+        referralButton.props.disabled === true ||
+        referralButton.props.accessibilityState?.disabled === true;
+      expect(isDisabled).toBe(false);
     });
 
     it('should enable settings button when user is opted in', () => {
-      // Act
       const { getByTestId } = render(<RewardsDashboard />);
       const settingsButton = getByTestId(
         REWARDS_VIEW_SELECTORS.SETTINGS_BUTTON,
       );
-
-      // Assert
-      expect(settingsButton.props.disabled).toBe(false);
+      const isDisabled =
+        settingsButton.props.disabled === true ||
+        settingsButton.props.accessibilityState?.disabled === true;
+      expect(isDisabled).toBe(false);
     });
   });
 
diff --git a/app/components/UI/Rewards/Views/RewardsDashboard.tsx b/app/components/UI/Rewards/Views/RewardsDashboard.tsx
index d359ba230e82..8277f269d23f 100644
--- a/app/components/UI/Rewards/Views/RewardsDashboard.tsx
+++ b/app/components/UI/Rewards/Views/RewardsDashboard.tsx
@@ -6,21 +6,13 @@ import React, {
   useState,
 } from 'react';
 import { useFocusEffect, useNavigation } from '@react-navigation/native';
-import {
-  Box,
-  BoxFlexDirection,
-  ButtonIcon,
-  ButtonIconSize,
-  Text,
-  TextVariant,
-  IconName as IconNameDS,
-} from '@metamask/design-system-react-native';
-import { useSafeAreaInsets } from 'react-native-safe-area-context';
+import { Box, IconName } from '@metamask/design-system-react-native';
+import { useTailwind } from '@metamask/design-system-twrnc-preset';
+import { SafeAreaView } from 'react-native-safe-area-context';
 import { useDispatch, useSelector } from 'react-redux';
-import { getNavigationOptionsTitle } from '../../Navbar';
 import { strings } from '../../../../../locales/i18n';
+import HeaderRoot from '../../../../component-library/components-temp/HeaderRoot';
 import ErrorBoundary from '../../../Views/ErrorBoundary';
-import { useTheme } from '../../../../util/theme';
 import { REWARDS_VIEW_SELECTORS } from './RewardsView.constants';
 import { setActiveTab } from '../../../../actions/rewards';
 import Routes from '../../../../constants/navigation/Routes';
@@ -53,9 +45,8 @@ import { selectSelectedAccountGroup } from '../../../../selectors/multichainAcco
 import PreviousSeasonSummary from '../components/PreviousSeason/PreviousSeasonSummary';
 
 const RewardsDashboard: React.FC = () => {
+  const tw = useTailwind();
   const navigation = useNavigation();
-  const theme = useTheme();
-  const { colors } = theme;
   const toastRef = useRef<ToastRef>(null);
   const subscriptionId = useSelector(selectRewardsSubscriptionId);
   const activeTab = useSelector(selectActiveTab);
@@ -82,7 +73,10 @@ const RewardsDashboard: React.FC = () => {
     }
     return false;
   }, [selectedAccountGroup?.id, hideCurrentAccountNotOptedInBannerMap]);
-  const insets = useSafeAreaInsets();
+
+  const [showPreviousSeasonSummary, setShowPreviousSeasonSummary] = useState<
+    boolean | null
+  >(null);
 
   // Ref for TabsList to control active tab programmatically
   const tabsListRef = useRef<TabsListRef>(null);
@@ -125,18 +119,6 @@ const RewardsDashboard: React.FC = () => {
     [optInByWallet],
   );
 
-  // Set navigation title
-  useEffect(() => {
-    navigation.setOptions(
-      getNavigationOptionsTitle(
-        strings('rewards.main_title'),
-        navigation,
-        false,
-        colors,
-      ),
-    );
-  }, [colors, navigation]);
-
   const tabOptions = useMemo(() => {
     const options: {
       value: 'overview' | 'snapshots' | 'activity';
@@ -242,10 +224,6 @@ const RewardsDashboard: React.FC = () => {
     return tabs;
   }, [isSnapshotsEnabled]);
 
-  const [showPreviousSeasonSummary, setShowPreviousSeasonSummary] = useState<
-    boolean | null
-  >(null);
-
   // Auto-resume interrupted bulk link process when screen comes into focus.
   // This handles the case where the app was closed during a bulk opt-in process.
   // The saga is idempotent - it re-fetches opt-in status to skip already-linked accounts.
@@ -352,54 +330,47 @@ const RewardsDashboard: React.FC = () => {
 
   return (
     <ErrorBoundary navigation={navigation} view="RewardsView">
-      <Box
-        twClassName="flex-1 bg-default gap-4 relative"
-        style={{ marginTop: insets.top }}
+      <SafeAreaView
+        edges={{ bottom: 'additive' }}
+        style={tw.style('flex-1 bg-default')}
+        testID={REWARDS_VIEW_SELECTORS.SAFE_AREA_VIEW}
       >
-        {/* Header row */}
-        <Box twClassName="flex-row justify-between px-4">
-          <Text variant={TextVariant.HeadingLg} twClassName="text-default">
-            {strings('rewards.main_title')}
-          </Text>
-
-          <Box flexDirection={BoxFlexDirection.Row}>
-            {showPreviousSeasonSummary === false && (
-              <ButtonIcon
-                iconName={IconNameDS.UserCircleAdd}
-                size={ButtonIconSize.Lg}
-                disabled={!subscriptionId}
-                testID={REWARDS_VIEW_SELECTORS.REFERRAL_BUTTON}
-                onPress={() => {
-                  navigation.navigate(Routes.REFERRAL_REWARDS_VIEW);
-                }}
-              />
-            )}
-
-            <ButtonIcon
-              iconName={IconNameDS.Setting}
-              size={ButtonIconSize.Lg}
-              disabled={!subscriptionId}
-              testID={REWARDS_VIEW_SELECTORS.SETTINGS_BUTTON}
-              onPress={() => {
-                navigation.navigate(Routes.REWARDS_SETTINGS_VIEW);
-              }}
-            />
-          </Box>
+        <HeaderRoot
+          title={strings('rewards.main_title')}
+          includesTopInset
+          endButtonIconProps={[
+            {
+              iconName: IconName.Setting,
+              onPress: () => navigation.navigate(Routes.REWARDS_SETTINGS_VIEW),
+              disabled: !subscriptionId,
+              testID: REWARDS_VIEW_SELECTORS.SETTINGS_BUTTON,
+            },
+            ...(showPreviousSeasonSummary === false
+              ? [
+                  {
+                    iconName: IconName.UserCircleAdd,
+                    onPress: () =>
+                      navigation.navigate(Routes.REFERRAL_REWARDS_VIEW),
+                    disabled: !subscriptionId,
+                    testID: REWARDS_VIEW_SELECTORS.REFERRAL_BUTTON,
+                  },
+                ]
+              : []),
+          ]}
+        />
+        <Box twClassName="flex-1 gap-4">
+          {showPreviousSeasonSummary ? (
+            <PreviousSeasonSummary />
+          ) : (
+            <>
+              <Box twClassName="mx-4">
+                <SeasonStatus />
+              </Box>
+              <TabsList {...tabsListProps}>{tabComponents}</TabsList>
+            </>
+          )}
         </Box>
-
-        {showPreviousSeasonSummary ? (
-          <PreviousSeasonSummary />
-        ) : (
-          <>
-            <Box twClassName="mx-4">
-              <SeasonStatus />
-            </Box>
-
-            {/* Tab View */}
-            <TabsList {...tabsListProps}>{tabComponents}</TabsList>
-          </>
-        )}
-      </Box>
+      </SafeAreaView>
       <Toast ref={toastRef} />
     </ErrorBoundary>
   );
diff --git a/app/components/UI/Rewards/Views/RewardsSettingsView.test.tsx b/app/components/UI/Rewards/Views/RewardsSettingsView.test.tsx
index 7b7718fc7a94..99e275cfeb2e 100644
--- a/app/components/UI/Rewards/Views/RewardsSettingsView.test.tsx
+++ b/app/components/UI/Rewards/Views/RewardsSettingsView.test.tsx
@@ -1,14 +1,16 @@
 import React from 'react';
-import { render, waitFor } from '@testing-library/react-native';
+import { render, fireEvent } from '@testing-library/react-native';
 import { Provider } from 'react-redux';
 import { NavigationContainer } from '@react-navigation/native';
 import { createStackNavigator } from '@react-navigation/stack';
 import { configureStore } from '@reduxjs/toolkit';
-import RewardsSettingsView from './RewardsSettingsView';
+import RewardsSettingsView, {
+  REWARDS_SETTINGS_SAFE_AREA_TEST_ID,
+} from './RewardsSettingsView';
 
 // Mock navigation
 const mockNavigate = jest.fn();
-const mockSetOptions = jest.fn();
+const mockGoBack = jest.fn();
 const mockUseRoute = jest.fn();
 
 jest.mock('@react-navigation/native', () => {
@@ -17,65 +19,33 @@ jest.mock('@react-navigation/native', () => {
     ...actual,
     useNavigation: () => ({
       navigate: mockNavigate,
-      setOptions: mockSetOptions,
+      goBack: mockGoBack,
     }),
     useRoute: () => mockUseRoute(),
   };
 });
 
-// Mock theme
-jest.mock('../../../../util/theme', () => ({
-  useTheme: () => ({
-    colors: {
-      primary: '#000',
-      background: '#fff',
-    },
-  }),
-}));
-
-// Mock getNavigationOptionsTitle
-jest.mock('../../Navbar', () => ({
-  getNavigationOptionsTitle: jest.fn(() => ({ title: 'Settings' })),
-}));
-
-// Mock design system components
-jest.mock('@metamask/design-system-react-native', () => {
-  const { View, Text } = jest.requireActual('react-native');
+// Mock react-native-safe-area-context (override SafeAreaView only; keep SafeAreaProvider etc. for stack)
+jest.mock('react-native-safe-area-context', () => {
+  const React = jest.requireActual('react');
+  const { View } = jest.requireActual('react-native');
+  const actual = jest.requireActual('react-native-safe-area-context');
   return {
-    Box: function MockBox({
+    ...actual,
+    useSafeAreaInsets: jest.fn(() => ({
+      top: 0,
+      right: 0,
+      bottom: 0,
+      left: 0,
+    })),
+    SafeAreaView: ({
       children,
       testID,
-      twClassName,
       ...props
     }: {
-      children?: React.ReactNode;
+      children: React.ReactNode;
       testID?: string;
-      twClassName?: string;
-      [key: string]: unknown;
-    }) {
-      const ReactActual = jest.requireActual('react');
-      return ReactActual.createElement(View, { testID, ...props }, children);
-    },
-    Text: function MockText({
-      children,
-      variant,
-      twClassName,
-      ...props
-    }: {
-      children?: React.ReactNode;
-      variant?: string;
-      twClassName?: string;
-      [key: string]: unknown;
-    }) {
-      const ReactActual = jest.requireActual('react');
-      return ReactActual.createElement(Text, { ...props }, children);
-    },
-    TextVariant: {
-      HeadingMd: 'HeadingMd',
-      HeadingSm: 'HeadingSm',
-      BodyMd: 'BodyMd',
-      BodySm: 'BodySm',
-    },
+    }) => React.createElement(View, { ...props, testID }, children),
   };
 });
 
@@ -124,13 +94,15 @@ jest.mock('../../../Views/ErrorBoundary', () => ({
   },
 }));
 
-// Mock useMetrics hook
+const mockTrackEvent = jest.fn();
+const mockCreateEventBuilder = jest.fn(() => ({
+  build: jest.fn(() => ({})),
+}));
+
 jest.mock('../../../hooks/useMetrics', () => ({
   useMetrics: () => ({
-    trackEvent: jest.fn(),
-    createEventBuilder: jest.fn(() => ({
-      build: jest.fn(),
-    })),
+    trackEvent: mockTrackEvent,
+    createEventBuilder: mockCreateEventBuilder,
   }),
   MetaMetricsEvents: {
     REWARDS_SETTINGS_VIEWED: 'REWARDS_SETTINGS_VIEWED',
@@ -208,15 +180,28 @@ describe('RewardsSettingsView', () => {
         getByTestId('reward-settings-account-group-list'),
       ).toBeOnTheScreen();
     });
+  });
 
-    it('sets navigation options on mount', async () => {
-      // Act
-      renderWithNavigation(<RewardsSettingsView />);
+  describe('header and SafeAreaView', () => {
+    it('renders SafeAreaView wrapper', () => {
+      const { getByTestId } = renderWithNavigation(<RewardsSettingsView />);
 
-      // Assert
-      await waitFor(() => {
-        expect(mockSetOptions).toHaveBeenCalled();
-      });
+      expect(getByTestId(REWARDS_SETTINGS_SAFE_AREA_TEST_ID)).toBeOnTheScreen();
+    });
+
+    it('renders HeaderCompactStandard with settings title', () => {
+      const { getByText } = renderWithNavigation(<RewardsSettingsView />);
+
+      expect(getByText('Settings')).toBeOnTheScreen();
+    });
+
+    it('calls navigation.goBack when back button is pressed', () => {
+      const { getByTestId } = renderWithNavigation(<RewardsSettingsView />);
+      const backButton = getByTestId('header-back-button');
+
+      fireEvent.press(backButton);
+
+      expect(mockGoBack).toHaveBeenCalledTimes(1);
     });
   });
 
@@ -260,12 +245,12 @@ describe('RewardsSettingsView', () => {
 
   describe('Metrics tracking', () => {
     it('tracks settings viewed event on mount', () => {
-      // Act
       renderWithNavigation(<RewardsSettingsView />);
 
-      // Assert - Metrics tracking is handled by the component internally
-      // The component should render without errors and track the event
-      expect(true).toBe(true); // Placeholder assertion since we can't easily test the internal tracking
+      expect(mockTrackEvent).toHaveBeenCalledTimes(1);
+      expect(mockCreateEventBuilder).toHaveBeenCalledWith(
+        'REWARDS_SETTINGS_VIEWED',
+      );
     });
   });
 });
diff --git a/app/components/UI/Rewards/Views/RewardsSettingsView.tsx b/app/components/UI/Rewards/Views/RewardsSettingsView.tsx
index d16e5fed3fba..9196c6b48000 100644
--- a/app/components/UI/Rewards/Views/RewardsSettingsView.tsx
+++ b/app/components/UI/Rewards/Views/RewardsSettingsView.tsx
@@ -1,32 +1,22 @@
 import React, { useEffect, useRef } from 'react';
 import { useNavigation } from '@react-navigation/native';
-import { getNavigationOptionsTitle } from '../../Navbar';
+import { Box } from '@metamask/design-system-react-native';
+import { useTailwind } from '@metamask/design-system-twrnc-preset';
+import { SafeAreaView } from 'react-native-safe-area-context';
 import { strings } from '../../../../../locales/i18n';
 import ErrorBoundary from '../../../Views/ErrorBoundary';
-import { useTheme } from '../../../../util/theme';
-import { Box } from '@metamask/design-system-react-native';
 import { MetaMetricsEvents, useMetrics } from '../../../hooks/useMetrics';
+import HeaderCompactStandard from '../../../../component-library/components-temp/HeaderCompactStandard';
 import RewardSettingsAccountGroupList from '../components/Settings/RewardSettingsAccountGroupList';
 
+export const REWARDS_SETTINGS_SAFE_AREA_TEST_ID = 'rewards-settings-safe-area';
+
 const RewardsSettingsView: React.FC = () => {
+  const tw = useTailwind();
   const navigation = useNavigation();
-  const { colors } = useTheme();
   const { trackEvent, createEventBuilder } = useMetrics();
   const hasTrackedSettingsViewed = useRef(false);
 
-  // Set navigation title with back button
-  useEffect(() => {
-    navigation.setOptions({
-      ...getNavigationOptionsTitle(
-        strings('rewards.settings.title'),
-        navigation,
-        false,
-        colors,
-      ),
-      headerTitleAlign: 'center',
-    });
-  }, [colors, navigation]);
-
   useEffect(() => {
     if (!hasTrackedSettingsViewed.current) {
       trackEvent(
@@ -38,9 +28,21 @@ const RewardsSettingsView: React.FC = () => {
 
   return (
     <ErrorBoundary navigation={navigation} view="RewardsSettingsView">
-      <Box twClassName="py-4 flex-1 gap-4">
-        <RewardSettingsAccountGroupList />
-      </Box>
+      <SafeAreaView
+        edges={{ bottom: 'additive' }}
+        style={tw.style('flex-1 bg-default')}
+        testID={REWARDS_SETTINGS_SAFE_AREA_TEST_ID}
+      >
+        <HeaderCompactStandard
+          title={strings('rewards.settings.title')}
+          onBack={() => navigation.goBack()}
+          backButtonProps={{ testID: 'header-back-button' }}
+          includesTopInset
+        />
+        <Box twClassName="py-4 flex-1 gap-4">
+          <RewardSettingsAccountGroupList />
+        </Box>
+      </SafeAreaView>
     </ErrorBoundary>
   );
 };
diff --git a/app/components/UI/Rewards/Views/RewardsView.constants.ts b/app/components/UI/Rewards/Views/RewardsView.constants.ts
index 51a218454532..f02fa232e305 100644
--- a/app/components/UI/Rewards/Views/RewardsView.constants.ts
+++ b/app/components/UI/Rewards/Views/RewardsView.constants.ts
@@ -2,6 +2,7 @@
  * Test identifiers for RewardsView component
  */
 export const REWARDS_VIEW_SELECTORS = {
+  SAFE_AREA_VIEW: 'rewards-view-safe-area',
   REFERRAL_BUTTON: 'rewards-view-referral-button',
   SETTINGS_BUTTON: 'rewards-view-settings-button',
   SEASON_SUMMARY_PLACEHOLDER: 'rewards-view-season-summary-placeholder',
diff --git a/app/components/UI/Rewards/components/Settings/RewardOptInAccountGroupModal.test.tsx b/app/components/UI/Rewards/components/Settings/RewardOptInAccountGroupModal.test.tsx
index a189c19a972f..7c39e74bee25 100644
--- a/app/components/UI/Rewards/components/Settings/RewardOptInAccountGroupModal.test.tsx
+++ b/app/components/UI/Rewards/components/Settings/RewardOptInAccountGroupModal.test.tsx
@@ -71,72 +71,6 @@ jest.mock('react-native-gesture-handler', () => {
   };
 });
 
-// Mock design system components
-jest.mock('@metamask/design-system-react-native', () => {
-  const ReactActual = jest.requireActual('react');
-  const {
-    Text: RNText,
-    View,
-    TouchableOpacity,
-  } = jest.requireActual('react-native');
-
-  return {
-    Box: ({
-      children,
-      testID,
-      ...props
-    }: {
-      children?: React.ReactNode;
-      testID?: string;
-      [key: string]: unknown;
-    }) => ReactActual.createElement(View, { testID, ...props }, children),
-    Text: ({
-      children,
-      ...props
-    }: {
-      children?: React.ReactNode;
-      [key: string]: unknown;
-    }) => ReactActual.createElement(RNText, props, children),
-    Button: ({
-      children,
-      onPress,
-      testID,
-      isLoading,
-      ...props
-    }: {
-      children?: React.ReactNode;
-      onPress?: () => void;
-      testID?: string;
-      isLoading?: boolean;
-      [key: string]: unknown;
-    }) =>
-      ReactActual.createElement(
-        TouchableOpacity,
-        {
-          onPress,
-          testID,
-          disabled: isLoading,
-          ...props,
-        },
-        ReactActual.createElement(RNText, {}, children),
-      ),
-    TextVariant: {
-      BodyMd: 'BodyMd',
-      HeadingMd: 'HeadingMd',
-      HeadingSm: 'HeadingSm',
-    },
-    FontWeight: {
-      Medium: 'medium',
-    },
-    ButtonVariant: {
-      Primary: 'primary',
-    },
-    ButtonSize: {
-      Lg: 'lg',
-    },
-  };
-});
-
 // Mock BottomSheet components
 jest.mock(
   '../../../../../component-library/components/BottomSheets/BottomSheet',
@@ -156,8 +90,11 @@ jest.mock(
           [key: string]: unknown;
         },
         ref: React.Ref<unknown>,
-      ) =>
-        ReactActual.createElement(
+      ) => {
+        ReactActual.useImperativeHandle(ref, () => ({
+          onCloseBottomSheet: () => onClose?.(),
+        }));
+        return ReactActual.createElement(
           View,
           {
             testID: 'bottom-sheet',
@@ -166,7 +103,8 @@ jest.mock(
             ...props,
           },
           children,
-        ),
+        );
+      },
     );
 
     return {
@@ -176,33 +114,6 @@ jest.mock(
   },
 );
 
-jest.mock(
-  '../../../../../component-library/components/BottomSheets/BottomSheetHeader',
-  () => {
-    const ReactActual = jest.requireActual('react');
-    const { View } = jest.requireActual('react-native');
-
-    return {
-      __esModule: true,
-      default: ({
-        children,
-        ...props
-      }: {
-        children?: React.ReactNode;
-        [key: string]: unknown;
-      }) =>
-        ReactActual.createElement(
-          View,
-          {
-            testID: 'bottom-sheet-header',
-            ...props,
-          },
-          children,
-        ),
-    };
-  },
-);
-
 // Mock MultichainAddressRow
 jest.mock(
   '../../../../../component-library/components-temp/MultichainAccounts',
@@ -373,9 +284,9 @@ describe('RewardOptInAccountGroupModal', () => {
     });
 
     it('renders header with account group name', () => {
-      const { getByTestId } = render(<RewardOptInAccountGroupModal />);
+      const { getByText } = render(<RewardOptInAccountGroupModal />);
 
-      expect(getByTestId('bottom-sheet-header')).toBeOnTheScreen();
+      expect(getByText('Test Account Group')).toBeOnTheScreen();
     });
 
     it('renders address list', () => {
@@ -426,6 +337,15 @@ describe('RewardOptInAccountGroupModal', () => {
 
       expect(mockGoBack).toHaveBeenCalledTimes(1);
     });
+
+    it('calls navigation.goBack when header close button is pressed', () => {
+      const { getByTestId } = render(<RewardOptInAccountGroupModal />);
+
+      const closeButton = getByTestId('header-close-button');
+      fireEvent.press(closeButton);
+
+      expect(mockGoBack).toHaveBeenCalledTimes(1);
+    });
   });
 
   describe('Link Account Group Button', () => {
@@ -515,7 +435,10 @@ describe('RewardOptInAccountGroupModal', () => {
       const { getByTestId } = render(<RewardOptInAccountGroupModal />);
 
       const linkButton = getByTestId('link-account-group-button');
-      expect(linkButton).toHaveProp('disabled', true);
+      const isDisabled =
+        linkButton.props.disabled === true ||
+        linkButton.props.accessibilityState?.disabled === true;
+      expect(isDisabled).toBe(true);
     });
 
     it('updates local state after successful link', async () => {
@@ -812,7 +735,7 @@ describe('RewardOptInAccountGroupModal', () => {
 
       const { queryByTestId } = render(<RewardOptInAccountGroupModal />);
 
-      expect(queryByTestId('bottom-sheet-header')).toBeNull();
+      expect(queryByTestId('header')).toBeNull();
     });
 
     it('handles account group context without metadata name', () => {
@@ -825,7 +748,7 @@ describe('RewardOptInAccountGroupModal', () => {
 
       const { queryByTestId } = render(<RewardOptInAccountGroupModal />);
 
-      expect(queryByTestId('bottom-sheet-header')).toBeNull();
+      expect(queryByTestId('header')).toBeNull();
     });
 
     it('handles EVM chain ID conversion errors', () => {
diff --git a/app/components/UI/Rewards/components/Settings/RewardOptInAccountGroupModal.tsx b/app/components/UI/Rewards/components/Settings/RewardOptInAccountGroupModal.tsx
index d38adebff441..11fb52312775 100644
--- a/app/components/UI/Rewards/components/Settings/RewardOptInAccountGroupModal.tsx
+++ b/app/components/UI/Rewards/components/Settings/RewardOptInAccountGroupModal.tsx
@@ -14,7 +14,7 @@ import {
 import BottomSheet, {
   BottomSheetRef,
 } from '../../../../../component-library/components/BottomSheets/BottomSheet';
-import BottomSheetHeader from '../../../../../component-library/components/BottomSheets/BottomSheetHeader';
+import HeaderCompactStandard from '../../../../../component-library/components-temp/HeaderCompactStandard';
 import { AccountGroupId } from '@metamask/account-api';
 import { selectAccountGroupById } from '../../../../../selectors/multichainAccounts/accountTreeController';
 import { useSelector } from 'react-redux';
@@ -373,11 +373,11 @@ const RewardOptInAccountGroupModal: React.FC = () => {
       onClose={handleDismiss}
     >
       {Boolean(accountGroupContext?.metadata?.name) && (
-        <BottomSheetHeader>
-          <Text variant={TextVariant.HeadingSm}>
-            {accountGroupContext?.metadata?.name}
-          </Text>
-        </BottomSheetHeader>
+        <HeaderCompactStandard
+          title={accountGroupContext?.metadata.name}
+          onClose={() => sheetRef.current?.onCloseBottomSheet()}
+          closeButtonProps={{ testID: 'header-close-button' }}
+        />
       )}
 
       {flatListData.length > 0 && (
diff --git a/app/components/UI/Rewards/components/Settings/RewardsEnvironmentToggle.test.tsx b/app/components/UI/Rewards/components/Settings/RewardsEnvironmentToggle.test.tsx
index 24d2c0ddab39..674ecfc0328a 100644
--- a/app/components/UI/Rewards/components/Settings/RewardsEnvironmentToggle.test.tsx
+++ b/app/components/UI/Rewards/components/Settings/RewardsEnvironmentToggle.test.tsx
@@ -46,66 +46,6 @@ jest.mock('../../../../../constants/navigation/Routes', () => ({
   REWARDS_ONBOARDING_FLOW: 'RewardsOnboardingFlow',
 }));
 
-// Mock design system components
-jest.mock('@metamask/design-system-react-native', () => {
-  const { View, Text, TouchableOpacity } = jest.requireActual('react-native');
-  const ReactActual = jest.requireActual('react');
-  return {
-    Box: function MockBox({
-      children,
-      testID,
-      ...props
-    }: {
-      children?: React.ReactNode;
-      testID?: string;
-      [key: string]: unknown;
-    }) {
-      return ReactActual.createElement(View, { testID, ...props }, children);
-    },
-    Text: function MockText({
-      children,
-      ...props
-    }: {
-      children?: React.ReactNode;
-      [key: string]: unknown;
-    }) {
-      return ReactActual.createElement(Text, { ...props }, children);
-    },
-    Button: function MockButton({
-      children,
-      onPress,
-      testID,
-      ...props
-    }: {
-      children?: React.ReactNode;
-      onPress?: () => void;
-      testID?: string;
-      [key: string]: unknown;
-    }) {
-      return ReactActual.createElement(
-        TouchableOpacity,
-        { onPress, testID, ...props },
-        ReactActual.createElement(Text, null, children),
-      );
-    },
-    TextVariant: {
-      HeadingSm: 'HeadingSm',
-      BodyMd: 'BodyMd',
-      BodySm: 'BodySm',
-      BodyMDBold: 'BodyMDBold',
-    },
-    TextColor: {
-      TextAlternative: 'text-alternative',
-    },
-    ButtonVariant: { Secondary: 'secondary', Primary: 'primary' },
-    ButtonSize: { Md: 'md', Sm: 'sm' },
-    BoxFlexDirection: { Row: 'row' },
-    BoxAlignItems: { center: 'center', Center: 'center' },
-    BoxJustifyContent: { Between: 'justify-between' },
-  };
-});
-
-// Mock BottomSheet
 jest.mock(
   '../../../../../component-library/components/BottomSheets/BottomSheet',
   () => {
@@ -113,12 +53,15 @@ jest.mock(
     const ReactActual = jest.requireActual('react');
     const MockBottomSheet = ReactActual.forwardRef(
       (
-        { children }: { children?: React.ReactNode },
+        {
+          children,
+          onClose,
+        }: { children?: React.ReactNode; onClose?: () => void },
         ref: React.Ref<unknown>,
       ) => {
         ReactActual.useImperativeHandle(ref, () => ({
           onOpenBottomSheet: jest.fn(),
-          onCloseBottomSheet: jest.fn(),
+          onCloseBottomSheet: () => onClose?.(),
         }));
         return ReactActual.createElement(View, null, children);
       },
@@ -128,40 +71,6 @@ jest.mock(
   },
 );
 
-// Mock ListItemSelect
-jest.mock(
-  '../../../../../component-library/components/List/ListItemSelect',
-  () => {
-    const { TouchableOpacity } = jest.requireActual('react-native');
-    const ReactActual = jest.requireActual('react');
-    return {
-      __esModule: true,
-      default: function MockListItemSelect({
-        children,
-        onPress,
-        isSelected,
-        testID,
-      }: {
-        children?: React.ReactNode;
-        onPress?: () => void;
-        isSelected?: boolean;
-        testID?: string;
-      }) {
-        return ReactActual.createElement(
-          TouchableOpacity,
-          { onPress, testID, accessibilityState: { selected: isSelected } },
-          children,
-        );
-      },
-    };
-  },
-);
-
-// Mock ListItem
-jest.mock('../../../../../component-library/components/List/ListItem', () => ({
-  VerticalAlignment: { Center: 'center' },
-}));
-
 // Mock i18n
 jest.mock('../../../../../../locales/i18n', () => ({
   strings: jest.fn((key: string) => {
@@ -270,7 +179,6 @@ describe('RewardsEnvironmentToggle', () => {
   });
 
   it('renders all environment options after opening the sheet', () => {
-    // Arrange
     mockCall.mockImplementation((action: string) => {
       if (action === 'RewardsController:canChangeRewardsEnvUrl') return true;
       if (action === 'RewardsController:getRewardsEnvUrl') return PRD_URL;
@@ -279,22 +187,35 @@ describe('RewardsEnvironmentToggle', () => {
       return undefined;
     });
 
-    const { getByTestId, getByText, getAllByText } = render(
-      <RewardsEnvironmentToggle />,
-    );
+    const { getByTestId } = render(<RewardsEnvironmentToggle />);
 
-    // Act — open the sheet
     fireEvent.press(getByTestId('rewards-environment-toggle-trigger'));
 
-    // Assert
-    expect(getByText(DEV_URL)).toBeTruthy();
-    expect(getByText(UAT_URL)).toBeTruthy();
-    // PRD URL appears twice: once in the trigger label, once in the sheet
-    expect(getAllByText(PRD_URL).length).toBeGreaterThanOrEqual(1);
+    expect(getByTestId(`environment-option-${DEV_URL}`)).toBeTruthy();
+    expect(getByTestId(`environment-option-${UAT_URL}`)).toBeTruthy();
+    expect(getByTestId(`environment-option-${PRD_URL}`)).toBeTruthy();
+  });
+
+  it('closes sheet when header close button is pressed', () => {
+    mockCall.mockImplementation((action: string) => {
+      if (action === 'RewardsController:canChangeRewardsEnvUrl') return true;
+      if (action === 'RewardsController:getRewardsEnvUrl') return PRD_URL;
+      if (action === 'RewardsController:getDefaultRewardsEnvUrl')
+        return PRD_URL;
+      return undefined;
+    });
+
+    const { getByTestId, queryByTestId } = render(<RewardsEnvironmentToggle />);
+
+    fireEvent.press(getByTestId('rewards-environment-toggle-trigger'));
+    expect(getByTestId(`environment-option-${DEV_URL}`)).toBeOnTheScreen();
+
+    fireEvent.press(getByTestId('environment-sheet-close-button'));
+
+    expect(queryByTestId(`environment-option-${DEV_URL}`)).toBeNull();
   });
 
   it('shows a "Default" badge next to the env that matches the default', () => {
-    // Arrange — current env is DEV but default is UAT
     mockCall.mockImplementation((action: string) => {
       if (action === 'RewardsController:canChangeRewardsEnvUrl') return true;
       if (action === 'RewardsController:getRewardsEnvUrl') return DEV_URL;
@@ -305,15 +226,12 @@ describe('RewardsEnvironmentToggle', () => {
 
     const { getByTestId, getByText } = render(<RewardsEnvironmentToggle />);
 
-    // Act — open the sheet
     fireEvent.press(getByTestId('rewards-environment-toggle-trigger'));
 
-    // Assert — "Default" badge is shown (once, next to UAT)
     expect(getByText('Default')).toBeTruthy();
   });
 
   it('shows no "Default" badge when no env matches the default', () => {
-    // Arrange — default returns an unknown URL not in the options list
     mockCall.mockImplementation((action: string) => {
       if (action === 'RewardsController:canChangeRewardsEnvUrl') return true;
       if (action === 'RewardsController:getRewardsEnvUrl') return DEV_URL;
@@ -324,15 +242,12 @@ describe('RewardsEnvironmentToggle', () => {
 
     const { getByTestId, queryByText } = render(<RewardsEnvironmentToggle />);
 
-    // Act — open the sheet
     fireEvent.press(getByTestId('rewards-environment-toggle-trigger'));
 
-    // Assert
     expect(queryByText('Default')).toBeNull();
   });
 
   it('calls setRewardsEnvUrl when a different env option is pressed', async () => {
-    // Arrange
     mockCall.mockImplementation((action: string) => {
       if (action === 'RewardsController:canChangeRewardsEnvUrl') return true;
       if (action === 'RewardsController:getRewardsEnvUrl') return PRD_URL;
@@ -341,13 +256,11 @@ describe('RewardsEnvironmentToggle', () => {
       return undefined;
     });
 
-    const { getByTestId, getByText } = render(<RewardsEnvironmentToggle />);
+    const { getByTestId } = render(<RewardsEnvironmentToggle />);
 
-    // Open the sheet, then press the DEV option
     fireEvent.press(getByTestId('rewards-environment-toggle-trigger'));
-    fireEvent.press(getByText(DEV_URL));
+    fireEvent.press(getByTestId(`environment-option-${DEV_URL}`));
 
-    // Assert
     await waitFor(() => {
       expect(mockCall).toHaveBeenCalledWith(
         'RewardsController:setRewardsEnvUrl',
@@ -357,7 +270,6 @@ describe('RewardsEnvironmentToggle', () => {
   });
 
   it('does not call setRewardsEnvUrl when the already-selected env is pressed', async () => {
-    // Arrange
     mockCall.mockImplementation((action: string) => {
       if (action === 'RewardsController:canChangeRewardsEnvUrl') return true;
       if (action === 'RewardsController:getRewardsEnvUrl') return PRD_URL;
@@ -366,13 +278,11 @@ describe('RewardsEnvironmentToggle', () => {
       return undefined;
     });
 
-    const { getByTestId, getAllByText } = render(<RewardsEnvironmentToggle />);
+    const { getByTestId } = render(<RewardsEnvironmentToggle />);
 
-    // Open the sheet, then press the already-selected PRD option
     fireEvent.press(getByTestId('rewards-environment-toggle-trigger'));
-    fireEvent.press(getAllByText(PRD_URL)[0]);
+    fireEvent.press(getByTestId(`environment-option-${PRD_URL}`));
 
-    // Assert
     expect(mockCall).not.toHaveBeenCalledWith(
       'RewardsController:setRewardsEnvUrl',
       expect.anything(),
@@ -380,7 +290,6 @@ describe('RewardsEnvironmentToggle', () => {
   });
 
   it('dispatches cancelBulkLink, resetRewardsState, and setCandidateSubscriptionId(retry) after changing env', async () => {
-    // Arrange
     mockCall.mockImplementation((action: string) => {
       if (action === 'RewardsController:canChangeRewardsEnvUrl') return true;
       if (action === 'RewardsController:getRewardsEnvUrl') return PRD_URL;
@@ -389,13 +298,11 @@ describe('RewardsEnvironmentToggle', () => {
       return undefined;
     });
 
-    const { getByTestId, getByText } = render(<RewardsEnvironmentToggle />);
+    const { getByTestId } = render(<RewardsEnvironmentToggle />);
 
-    // Act — open sheet and select a different env
     fireEvent.press(getByTestId('rewards-environment-toggle-trigger'));
-    fireEvent.press(getByText(DEV_URL));
+    fireEvent.press(getByTestId(`environment-option-${DEV_URL}`));
 
-    // Assert — reset flow + trigger immediate candidate subscription re-fetch
     await waitFor(() => {
       expect(mockDispatch).toHaveBeenCalledWith(cancelBulkLink());
       expect(mockDispatch).toHaveBeenCalledWith(resetRewardsState());
@@ -406,7 +313,6 @@ describe('RewardsEnvironmentToggle', () => {
   });
 
   it('does not dispatch or navigate when re-selecting the current env', async () => {
-    // Arrange
     mockCall.mockImplementation((action: string) => {
       if (action === 'RewardsController:canChangeRewardsEnvUrl') return true;
       if (action === 'RewardsController:getRewardsEnvUrl') return PRD_URL;
@@ -415,13 +321,11 @@ describe('RewardsEnvironmentToggle', () => {
       return undefined;
     });
 
-    const { getByTestId, getAllByText } = render(<RewardsEnvironmentToggle />);
+    const { getByTestId } = render(<RewardsEnvironmentToggle />);
 
-    // Act — open sheet and press the already-selected env
     fireEvent.press(getByTestId('rewards-environment-toggle-trigger'));
-    fireEvent.press(getAllByText(PRD_URL)[0]);
+    fireEvent.press(getByTestId(`environment-option-${PRD_URL}`));
 
-    // Assert — no reset or navigation should occur
     await waitFor(() => {
       expect(mockDispatch).not.toHaveBeenCalled();
       expect(mockNavigate).not.toHaveBeenCalled();
diff --git a/app/components/UI/Rewards/components/Settings/RewardsEnvironmentToggle.tsx b/app/components/UI/Rewards/components/Settings/RewardsEnvironmentToggle.tsx
index 6dd2f158a638..6372963a5434 100644
--- a/app/components/UI/Rewards/components/Settings/RewardsEnvironmentToggle.tsx
+++ b/app/components/UI/Rewards/components/Settings/RewardsEnvironmentToggle.tsx
@@ -1,5 +1,4 @@
 import React, { useCallback, useEffect, useRef, useState } from 'react';
-import { StyleSheet, View } from 'react-native';
 import {
   Box,
   BoxAlignItems,
@@ -19,6 +18,7 @@ import AppConstants from '../../../../../core/AppConstants';
 import BottomSheet, {
   BottomSheetRef,
 } from '../../../../../component-library/components/BottomSheets/BottomSheet';
+import HeaderCompactStandard from '../../../../../component-library/components-temp/HeaderCompactStandard';
 import ListItemSelect from '../../../../../component-library/components/List/ListItemSelect';
 import { VerticalAlignment } from '../../../../../component-library/components/List/ListItem';
 import { cancelBulkLink } from '../../../../../store/sagas/rewardsBulkLinkAccountGroups';
@@ -27,14 +27,6 @@ import {
   setCandidateSubscriptionId,
 } from '../../../../../reducers/rewards';
 
-const styles = StyleSheet.create({
-  sheetTitle: {
-    alignItems: 'center',
-    paddingTop: 16,
-    paddingBottom: 16,
-  },
-});
-
 const ENV_OPTIONS: string[] = [
   AppConstants.REWARDS_API_URL.DEV,
   AppConstants.REWARDS_API_URL.UAT,
@@ -126,14 +118,15 @@ const RewardsEnvironmentToggle: React.FC = () => {
           ref={sheetRef}
           onClose={() => setIsSheetOpen(false)}
         >
-          <View style={styles.sheetTitle}>
-            <Text variant={TextVariant.HeadingSm}>
-              {strings('rewards.settings.environment_selector')}
-            </Text>
-          </View>
+          <HeaderCompactStandard
+            title={strings('rewards.settings.environment_selector')}
+            onClose={() => sheetRef.current?.onCloseBottomSheet()}
+            closeButtonProps={{ testID: 'environment-sheet-close-button' }}
+          />
           {ENV_OPTIONS.map((env) => (
             <ListItemSelect
               key={env}
+              testID={`environment-option-${env}`}
               onPress={() => handleEnvSelect(env)}
               isSelected={env === currentEnv}
               isDisabled={false}
diff --git a/app/components/UI/Rewards/hooks/useRewardsToast.test.tsx b/app/components/UI/Rewards/hooks/useRewardsToast.test.tsx
index 766fb0ef8cc3..6fe3fa7fe37e 100644
--- a/app/components/UI/Rewards/hooks/useRewardsToast.test.tsx
+++ b/app/components/UI/Rewards/hooks/useRewardsToast.test.tsx
@@ -1,6 +1,7 @@
 import { renderHook, act } from '@testing-library/react-hooks';
 import { useContext } from 'react';
 import { notificationAsync, NotificationFeedbackType } from 'expo-haptics';
+import { mockTheme } from '../../../../util/theme';
 import useRewardsToast, { RewardsToastOptions } from './useRewardsToast';
 import {
   ToastVariants,
@@ -32,25 +33,13 @@ jest.mock('../../../../../locales/i18n', () => ({
   }),
 }));
 
-jest.mock('../../../../util/theme', () => ({
-  useAppThemeFromContext: () => ({
-    colors: {
-      primary: {
-        default: '#4459ff',
-        muted: '#4459ff1a',
-      },
-      background: {
-        muted: '#3c4d9d0f',
-      },
-      success: {
-        default: '#457a39',
-      },
-      error: {
-        default: '#ca3542',
-      },
-    },
-  }),
-}));
+jest.mock('../../../../util/theme', () => {
+  const actualTheme = jest.requireActual('../../../../util/theme');
+  return {
+    ...actualTheme,
+    useAppThemeFromContext: () => actualTheme.mockTheme,
+  };
+});
 
 describe('useRewardsToast', () => {
   let mockShowToast: jest.Mock;
@@ -107,7 +96,7 @@ describe('useRewardsToast', () => {
       expect(config).toMatchObject({
         variant: ToastVariants.Icon,
         iconName: IconName.Confirmation,
-        iconColor: '#457a39',
+        iconColor: mockTheme.colors.success.default,
         backgroundColor: 'transparent',
         hapticsType: NotificationFeedbackType.Success,
         hasNoTimeout: false,
@@ -131,7 +120,7 @@ describe('useRewardsToast', () => {
       expect(config).toMatchObject({
         variant: ToastVariants.Icon,
         iconName: IconName.Confirmation,
-        iconColor: '#457a39',
+        iconColor: mockTheme.colors.success.default,
         backgroundColor: 'transparent',
         hapticsType: NotificationFeedbackType.Success,
         hasNoTimeout: false,
@@ -154,7 +143,7 @@ describe('useRewardsToast', () => {
       expect(config).toMatchObject({
         variant: ToastVariants.Icon,
         iconName: IconName.Danger,
-        iconColor: '#ca3542',
+        iconColor: mockTheme.colors.error.default,
         backgroundColor: 'transparent',
         hapticsType: NotificationFeedbackType.Error,
         hasNoTimeout: false,
@@ -178,7 +167,7 @@ describe('useRewardsToast', () => {
       expect(config).toMatchObject({
         variant: ToastVariants.Icon,
         iconName: IconName.Danger,
-        iconColor: '#ca3542',
+        iconColor: mockTheme.colors.error.default,
         backgroundColor: 'transparent',
         hapticsType: NotificationFeedbackType.Error,
         hasNoTimeout: false,
diff --git a/app/components/UI/SeedphraseModal/__snapshots__/index.test.tsx.snap b/app/components/UI/SeedphraseModal/__snapshots__/index.test.tsx.snap
index 2f8ddc480f51..6d2b04cb1bd4 100644
--- a/app/components/UI/SeedphraseModal/__snapshots__/index.test.tsx.snap
+++ b/app/components/UI/SeedphraseModal/__snapshots__/index.test.tsx.snap
@@ -63,7 +63,7 @@ exports[`SeedphraseModal renders matches snapshot 1`] = `
             style={
               [
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Bold",
                   "fontSize": 16,
                   "fontWeight": 400,
@@ -141,7 +141,7 @@ exports[`SeedphraseModal renders matches snapshot 1`] = `
               style={
                 [
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "height": 24,
                     "width": 24,
                   },
@@ -164,7 +164,7 @@ exports[`SeedphraseModal renders matches snapshot 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -185,7 +185,7 @@ exports[`SeedphraseModal renders matches snapshot 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -215,7 +215,7 @@ exports[`SeedphraseModal renders matches snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -230,7 +230,7 @@ exports[`SeedphraseModal renders matches snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -254,7 +254,7 @@ exports[`SeedphraseModal renders matches snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -269,7 +269,7 @@ exports[`SeedphraseModal renders matches snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -293,7 +293,7 @@ exports[`SeedphraseModal renders matches snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -308,7 +308,7 @@ exports[`SeedphraseModal renders matches snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -343,7 +343,7 @@ exports[`SeedphraseModal renders matches snapshot 1`] = `
           {
             "alignItems": "center",
             "alignSelf": "stretch",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -359,7 +359,7 @@ exports[`SeedphraseModal renders matches snapshot 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Medium",
               "fontSize": 16,
               "letterSpacing": 0,
diff --git a/app/components/UI/SelectComponent/__snapshots__/index.test.tsx.snap b/app/components/UI/SelectComponent/__snapshots__/index.test.tsx.snap
index 84e805b8e740..63990094f27e 100644
--- a/app/components/UI/SelectComponent/__snapshots__/index.test.tsx.snap
+++ b/app/components/UI/SelectComponent/__snapshots__/index.test.tsx.snap
@@ -30,7 +30,7 @@ exports[`SelectComponent should render correctly 1`] = `
           style={
             {
               "alignSelf": "flex-start",
-              "color": "#121314",
+              "color": "#131416",
               "flex": 1,
               "fontFamily": "Geist-Regular",
               "fontSize": 14,
@@ -46,7 +46,7 @@ exports[`SelectComponent should render correctly 1`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontSize": 24,
               },
               {
diff --git a/app/components/UI/SelectOptionSheet/__snapshots__/OptionSheet.test.tsx.snap b/app/components/UI/SelectOptionSheet/__snapshots__/OptionSheet.test.tsx.snap
index 7455fe05c773..0dd953056965 100644
--- a/app/components/UI/SelectOptionSheet/__snapshots__/OptionSheet.test.tsx.snap
+++ b/app/components/UI/SelectOptionSheet/__snapshots__/OptionSheet.test.tsx.snap
@@ -369,7 +369,7 @@ exports[`OptionSheet render matches snapshot 1`] = `
                                 numberOfLines={1}
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "flex": 1,
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
@@ -393,7 +393,7 @@ exports[`OptionSheet render matches snapshot 1`] = `
                                     "paddingVertical": 16,
                                   },
                                   {
-                                    "backgroundColor": "#3c4d9d0f",
+                                    "backgroundColor": "#b4b4b528",
                                   },
                                 ]
                               }
@@ -403,7 +403,7 @@ exports[`OptionSheet render matches snapshot 1`] = `
                                 numberOfLines={1}
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "flex": 1,
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
diff --git a/app/components/UI/SelectOptionSheet/__snapshots__/SelectOptionSheet.test.tsx.snap b/app/components/UI/SelectOptionSheet/__snapshots__/SelectOptionSheet.test.tsx.snap
index 4b76eece02ef..05fdae19cd7e 100644
--- a/app/components/UI/SelectOptionSheet/__snapshots__/SelectOptionSheet.test.tsx.snap
+++ b/app/components/UI/SelectOptionSheet/__snapshots__/SelectOptionSheet.test.tsx.snap
@@ -17,7 +17,7 @@ exports[`SelectOptionSheet render matches the snapshot 1`] = `
       numberOfLines={1}
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 14,
           "fontWeight": 600,
@@ -35,7 +35,7 @@ exports[`SelectOptionSheet render matches the snapshot 1`] = `
       style={
         [
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "height": 12,
             "marginRight": 8,
             "width": 12,
diff --git a/app/components/UI/SheetActionView/__snapshots__/SheetActionView.test.tsx.snap b/app/components/UI/SheetActionView/__snapshots__/SheetActionView.test.tsx.snap
index 105d2b89318c..523ed8f2ec73 100644
--- a/app/components/UI/SheetActionView/__snapshots__/SheetActionView.test.tsx.snap
+++ b/app/components/UI/SheetActionView/__snapshots__/SheetActionView.test.tsx.snap
@@ -20,7 +20,7 @@ exports[`SheetActionView should render correctly 1`] = `
       {
         "alignItems": "center",
         "alignSelf": "flex-start",
-        "backgroundColor": "#3c4d9d0f",
+        "backgroundColor": "#b4b4b528",
         "borderColor": "transparent",
         "borderRadius": 12,
         "borderWidth": 1,
@@ -38,7 +38,7 @@ exports[`SheetActionView should render correctly 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Medium",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -60,7 +60,7 @@ exports[`SheetActionView should render correctly 1`] = `
       {
         "alignItems": "center",
         "alignSelf": "flex-start",
-        "backgroundColor": "#121314",
+        "backgroundColor": "#131416",
         "borderRadius": 12,
         "flex": 1,
         "flexDirection": "row",
diff --git a/app/components/UI/SimulationDetails/FiatDisplay/useFiatFormatter.test.ts b/app/components/UI/SimulationDetails/FiatDisplay/useFiatFormatter.test.ts
index 33f583bfe0b3..d5a32b760cf3 100644
--- a/app/components/UI/SimulationDetails/FiatDisplay/useFiatFormatter.test.ts
+++ b/app/components/UI/SimulationDetails/FiatDisplay/useFiatFormatter.test.ts
@@ -1,81 +1,87 @@
 import { renderHook } from '@testing-library/react-hooks';
-import I18n from '../../../../../locales/i18n';
+import { BigNumber } from 'bignumber.js';
 import { selectCurrentCurrency } from '../../../../selectors/currencyRateController';
 import useFiatFormatter from './useFiatFormatter';
-import { BigNumber } from 'bignumber.js';
+import formatFiat from '../../../../util/formatFiat';
 
 jest.mock('react-redux', () => ({
   useSelector: jest.fn((selector) => selector()),
 }));
 
-jest.mock('../../../../../locales/i18n', () => ({
-  __esModule: true,
-  default: jest.fn(),
-}));
-
 jest.mock('../../../../selectors/currencyRateController', () => ({
   selectCurrentCurrency: jest.fn(),
 }));
 
-const mockI18n = I18n as unknown as jest.Mock;
+jest.mock('../../../../util/formatFiat', () => ({
+  __esModule: true,
+  default: jest.fn(),
+}));
+
 const mockSelectCurrentCurrency = selectCurrentCurrency as unknown as jest.Mock;
+const mockFormatFiat = formatFiat as unknown as jest.Mock;
 
 describe('useFiatFormatter', () => {
   beforeEach(() => {
     jest.clearAllMocks();
   });
 
-  it('should return a function that formats fiat amount correctly', () => {
-    mockI18n.mockReturnValue({
-      locale: 'en-US',
-    });
+  it('returns a function that calls formatFiat with the current currency from Redux', () => {
     mockSelectCurrentCurrency.mockReturnValue('USD');
+    mockFormatFiat.mockReturnValue('$1,000');
 
     const { result } = renderHook(() => useFiatFormatter());
-    const formatFiat = result.current;
+    const formatter = result.current;
 
-    expect(formatFiat(new BigNumber('987543219876543219876.54321'))).toBe(
-      '$987,543,219,876,543,219,876.54',
-    );
-    expect(formatFiat(new BigNumber(1000))).toBe('$1,000');
-    expect(formatFiat(new BigNumber(500.5))).toBe('$500.50');
-    expect(formatFiat(new BigNumber(0))).toBe('$0');
-    expect(formatFiat(new BigNumber(0.005))).toBe('<$0.01');
-    expect(formatFiat(new BigNumber(0.0049))).toBe('<$0.01');
+    const amount = new BigNumber(1000);
+    const formattedResult = formatter(amount);
+
+    expect(selectCurrentCurrency).toHaveBeenCalledTimes(1);
+    expect(formatFiat).toHaveBeenCalledWith(amount, 'USD');
+    expect(formattedResult).toBe('$1,000');
   });
 
-  it('should use the current locale and currency from the mocked functions', () => {
-    mockI18n.mockReturnValue({
-      locale: 'fr-FR',
-    });
+  it('uses the currency from Redux when no override is provided', () => {
     mockSelectCurrentCurrency.mockReturnValue('EUR');
+    mockFormatFiat.mockReturnValue('€500');
+
+    const { result } = renderHook(() => useFiatFormatter());
+    const formatter = result.current;
 
-    renderHook(() => useFiatFormatter());
+    const amount = new BigNumber(500);
+    formatter(amount);
 
     expect(selectCurrentCurrency).toHaveBeenCalledTimes(1);
+    expect(formatFiat).toHaveBeenCalledWith(amount, 'EUR');
   });
 
-  it('should gracefully handle unknown currencies by returning amount followed by currency code', () => {
-    mockSelectCurrentCurrency.mockReturnValue('storj');
+  it('overrides the currency from Redux when currency parameter is provided', () => {
+    mockSelectCurrentCurrency.mockReturnValue('USD');
+    mockFormatFiat.mockReturnValue('£1,000');
 
-    const { result } = renderHook(() => useFiatFormatter());
-    const formatFiat = result.current;
+    const { result } = renderHook(() => useFiatFormatter({ currency: 'GBP' }));
+    const formatter = result.current;
 
-    // Testing the fallback formatting for an unknown currency
-    expect(formatFiat(new BigNumber('98754321987654321987654321'))).toBe(
-      '98754321987654321987654321 storj',
-    );
-    expect(formatFiat(new BigNumber(1000))).toBe('1000 storj');
-    expect(formatFiat(new BigNumber(500.5))).toBe('500.5 storj');
-    expect(formatFiat(new BigNumber(0))).toBe('0 storj');
+    const amount = new BigNumber(1000);
+    formatter(amount);
+
+    expect(selectCurrentCurrency).toHaveBeenCalledTimes(1);
+    expect(formatFiat).toHaveBeenCalledWith(amount, 'GBP');
   });
 
-  it('overrides currency if specified', () => {
-    const { result } = renderHook(() => useFiatFormatter({ currency: 'gbp' }));
-    const formatFiat = result.current;
+  it('passes the correct currency to formatFiat for each call', () => {
+    mockSelectCurrentCurrency.mockReturnValue('JPY');
+    mockFormatFiat.mockImplementation(
+      (amount, currency) => `${amount.toString()} ${currency}`,
+    );
+
+    const { result } = renderHook(() => useFiatFormatter());
+    const formatter = result.current;
+
+    formatter(new BigNumber(100));
+    formatter(new BigNumber(200));
 
-    expect(formatFiat(new BigNumber(1000))).toBe('£1,000');
-    expect(formatFiat(new BigNumber(500.5))).toBe('£500.50');
-    expect(formatFiat(new BigNumber(0))).toBe('£0');
+    expect(formatFiat).toHaveBeenCalledTimes(2);
+    expect(formatFiat).toHaveBeenNthCalledWith(1, new BigNumber(100), 'JPY');
+    expect(formatFiat).toHaveBeenNthCalledWith(2, new BigNumber(200), 'JPY');
   });
 });
diff --git a/app/components/UI/SimulationDetails/FiatDisplay/useFiatFormatter.ts b/app/components/UI/SimulationDetails/FiatDisplay/useFiatFormatter.ts
index 3fc42e29ea7c..c917f621d8d7 100644
--- a/app/components/UI/SimulationDetails/FiatDisplay/useFiatFormatter.ts
+++ b/app/components/UI/SimulationDetails/FiatDisplay/useFiatFormatter.ts
@@ -1,8 +1,6 @@
 import { useSelector } from 'react-redux';
 import { selectCurrentCurrency } from '../../../../selectors/currencyRateController';
-import I18n from '../../../../../locales/i18n';
-import { BigNumber } from 'bignumber.js';
-import { getIntlNumberFormatter } from '../../../../util/intl';
+import formatFiat from '../../../../util/formatFiat';
 
 type FiatFormatter = (fiatAmount: BigNumber) => string;
 
@@ -26,34 +24,7 @@ const useFiatFormatter = ({
   const currencyCurrency = useSelector(selectCurrentCurrency);
   const fiatCurrency = currency ?? currencyCurrency;
 
-  return (fiatAmount: BigNumber) => {
-    const hasDecimals = !fiatAmount.isInteger();
-
-    const isSmall =
-      fiatAmount.toFixed(2, BigNumber.ROUND_DOWN) === '0.00' &&
-      !fiatAmount.isZero();
-
-    const value = isSmall ? 0.01 : fiatAmount.toFixed();
-    let result: string;
-
-    try {
-      result = getIntlNumberFormatter(I18n.locale, {
-        style: 'currency',
-        currency: fiatCurrency,
-        minimumFractionDigits: hasDecimals ? 2 : 0,
-        // string is valid parameter for format function
-        // for some reason it gives TS issue
-        // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat/format#number
-      }).format(value as unknown as number);
-    } catch (error) {
-      // Fallback for unknown or unsupported currencies
-      result = `${value} ${fiatCurrency}`;
-    }
-
-    result = result.replace('US$', '$');
-
-    return isSmall ? `<${result}` : result;
-  };
+  return (fiatAmount: BigNumber) => formatFiat(fiatAmount, fiatCurrency);
 };
 
 export default useFiatFormatter;
diff --git a/app/components/UI/SkipAccountSecurityModal/__snapshots__/index.test.tsx.snap b/app/components/UI/SkipAccountSecurityModal/__snapshots__/index.test.tsx.snap
index 3e353baa07c0..5fdf469cba52 100644
--- a/app/components/UI/SkipAccountSecurityModal/__snapshots__/index.test.tsx.snap
+++ b/app/components/UI/SkipAccountSecurityModal/__snapshots__/index.test.tsx.snap
@@ -17,7 +17,7 @@ exports[`SkipAccountSecurityModal with empty route params render matches snapsho
     }
   >
     <SvgMock
-      color="#121314"
+      color="#131416"
       fill="currentColor"
       height={24}
       name="Danger"
@@ -37,9 +37,9 @@ exports[`SkipAccountSecurityModal with empty route params render matches snapsho
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Bold",
-          "fontSize": 18,
+          "fontSize": 20,
           "letterSpacing": 0,
           "lineHeight": 24,
         }
@@ -80,7 +80,7 @@ exports[`SkipAccountSecurityModal with empty route params render matches snapsho
             {
               "alignItems": "center",
               "backgroundColor": "#ffffff",
-              "borderColor": "#b7bbc8",
+              "borderColor": "#949596",
               "borderRadius": 4,
               "borderWidth": 2,
               "height": 20,
@@ -95,7 +95,7 @@ exports[`SkipAccountSecurityModal with empty route params render matches snapsho
         onPress={[Function]}
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 14,
             "letterSpacing": 0,
@@ -129,7 +129,7 @@ exports[`SkipAccountSecurityModal with empty route params render matches snapsho
           {
             "alignItems": "center",
             "alignSelf": "stretch",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -148,7 +148,7 @@ exports[`SkipAccountSecurityModal with empty route params render matches snapsho
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Medium",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -222,7 +222,7 @@ exports[`SkipAccountSecurityModal with route params render matches snapshot 1`]
     }
   >
     <SvgMock
-      color="#121314"
+      color="#131416"
       fill="currentColor"
       height={24}
       name="Danger"
@@ -242,9 +242,9 @@ exports[`SkipAccountSecurityModal with route params render matches snapshot 1`]
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Bold",
-          "fontSize": 18,
+          "fontSize": 20,
           "letterSpacing": 0,
           "lineHeight": 24,
         }
@@ -285,7 +285,7 @@ exports[`SkipAccountSecurityModal with route params render matches snapshot 1`]
             {
               "alignItems": "center",
               "backgroundColor": "#ffffff",
-              "borderColor": "#b7bbc8",
+              "borderColor": "#949596",
               "borderRadius": 4,
               "borderWidth": 2,
               "height": 20,
@@ -300,7 +300,7 @@ exports[`SkipAccountSecurityModal with route params render matches snapshot 1`]
         onPress={[Function]}
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 14,
             "letterSpacing": 0,
@@ -334,7 +334,7 @@ exports[`SkipAccountSecurityModal with route params render matches snapshot 1`]
           {
             "alignItems": "center",
             "alignSelf": "stretch",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -353,7 +353,7 @@ exports[`SkipAccountSecurityModal with route params render matches snapshot 1`]
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Medium",
               "fontSize": 16,
               "letterSpacing": 0,
diff --git a/app/components/UI/SlippageSlider/__snapshots__/index.test.tsx.snap b/app/components/UI/SlippageSlider/__snapshots__/index.test.tsx.snap
index 4aa24f512b0f..79560527f90e 100644
--- a/app/components/UI/SlippageSlider/__snapshots__/index.test.tsx.snap
+++ b/app/components/UI/SlippageSlider/__snapshots__/index.test.tsx.snap
@@ -176,7 +176,7 @@ exports[`SlippageSlider should render correctly 1`] = `
           d="M0 8C0 3.58172 3.58172 0 8 0H32C36.4183 0 40 3.58172 40 8V20.6866C40 25.1049 36.4183 28.6866 32 28.6866H27.7778L20 36L12.2222 28.6866H8C3.58172 28.6866 0 25.1049 0 20.6866V8Z"
           fill={
             {
-              "payload": 3422552064,
+              "payload": 2450132243,
               "type": 0,
             }
           }
diff --git a/app/components/UI/SrpInputGrid/__snapshots__/index.test.tsx.snap b/app/components/UI/SrpInputGrid/__snapshots__/index.test.tsx.snap
index 410486bcfb6c..96bf5c34ac4a 100644
--- a/app/components/UI/SrpInputGrid/__snapshots__/index.test.tsx.snap
+++ b/app/components/UI/SrpInputGrid/__snapshots__/index.test.tsx.snap
@@ -14,7 +14,7 @@ exports[`SrpInputGrid renders with custom uniqueId 1`] = `
   <View
     style={
       {
-        "backgroundColor": "#f3f5f9",
+        "backgroundColor": "#f3f3f4",
         "borderRadius": 10,
         "maxHeight": "auto",
         "minHeight": 210,
@@ -60,8 +60,8 @@ exports[`SrpInputGrid renders with custom uniqueId 1`] = `
           style={
             {
               "alignItems": "center",
-              "backgroundColor": "#3c4d9d0f",
-              "borderColor": "#b7bbc866",
+              "backgroundColor": "#b4b4b528",
+              "borderColor": "#b4b4b566",
               "borderRadius": 12,
               "borderWidth": 1,
               "flexDirection": "row",
@@ -105,7 +105,7 @@ exports[`SrpInputGrid renders with custom uniqueId 1`] = `
               onSelectionChange={[Function]}
               onSubmitEditing={[Function]}
               placeholder=""
-              placeholderTextColor="#b7bbc8"
+              placeholderTextColor="#babbbe"
               returnKeyType="done"
               showSoftInputOnFocus={true}
               spellCheck={false}
@@ -114,7 +114,7 @@ exports[`SrpInputGrid renders with custom uniqueId 1`] = `
                   "backgroundColor": "transparent",
                   "borderColor": "transparent",
                   "borderWidth": 1,
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "display": "flex",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
@@ -159,7 +159,7 @@ exports[`SrpInputGrid renders with custom uniqueId 1`] = `
             {
               "alignItems": "center",
               "backgroundColor": "transparent",
-              "borderColor": "#b7bbc866",
+              "borderColor": "#b4b4b566",
               "borderRadius": 12,
               "borderWidth": 0,
               "display": "flex",
@@ -203,7 +203,7 @@ exports[`SrpInputGrid renders with custom uniqueId 1`] = `
               onSelectionChange={[Function]}
               onSubmitEditing={[Function]}
               placeholder="Enter your Secret Recovery Phrase"
-              placeholderTextColor="#686e7d"
+              placeholderTextColor="#66676a"
               returnKeyType="done"
               showSoftInputOnFocus={true}
               spellCheck={false}
@@ -212,7 +212,7 @@ exports[`SrpInputGrid renders with custom uniqueId 1`] = `
                   "backgroundColor": "transparent",
                   "borderColor": "transparent",
                   "borderWidth": 1,
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "display": "flex",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
@@ -273,7 +273,7 @@ exports[`SrpInputGrid renders with disabled state 1`] = `
   <View
     style={
       {
-        "backgroundColor": "#f3f5f9",
+        "backgroundColor": "#f3f3f4",
         "borderRadius": 10,
         "maxHeight": "auto",
         "minHeight": 210,
@@ -319,8 +319,8 @@ exports[`SrpInputGrid renders with disabled state 1`] = `
           style={
             {
               "alignItems": "center",
-              "backgroundColor": "#3c4d9d0f",
-              "borderColor": "#b7bbc866",
+              "backgroundColor": "#b4b4b528",
+              "borderColor": "#b4b4b566",
               "borderRadius": 12,
               "borderWidth": 1,
               "flexDirection": "row",
@@ -364,7 +364,7 @@ exports[`SrpInputGrid renders with disabled state 1`] = `
               onSelectionChange={[Function]}
               onSubmitEditing={[Function]}
               placeholder=""
-              placeholderTextColor="#b7bbc8"
+              placeholderTextColor="#babbbe"
               returnKeyType="done"
               showSoftInputOnFocus={true}
               spellCheck={false}
@@ -373,7 +373,7 @@ exports[`SrpInputGrid renders with disabled state 1`] = `
                   "backgroundColor": "transparent",
                   "borderColor": "transparent",
                   "borderWidth": 1,
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "display": "flex",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
@@ -418,7 +418,7 @@ exports[`SrpInputGrid renders with disabled state 1`] = `
             {
               "alignItems": "center",
               "backgroundColor": "transparent",
-              "borderColor": "#b7bbc866",
+              "borderColor": "#b4b4b566",
               "borderRadius": 12,
               "borderWidth": 0,
               "display": "flex",
@@ -462,7 +462,7 @@ exports[`SrpInputGrid renders with disabled state 1`] = `
               onSelectionChange={[Function]}
               onSubmitEditing={[Function]}
               placeholder="Enter your Secret Recovery Phrase"
-              placeholderTextColor="#686e7d"
+              placeholderTextColor="#66676a"
               returnKeyType="done"
               showSoftInputOnFocus={true}
               spellCheck={false}
@@ -471,7 +471,7 @@ exports[`SrpInputGrid renders with disabled state 1`] = `
                   "backgroundColor": "transparent",
                   "borderColor": "transparent",
                   "borderWidth": 1,
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "display": "flex",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
@@ -532,7 +532,7 @@ exports[`SrpInputGrid renders with empty seed phrase 1`] = `
   <View
     style={
       {
-        "backgroundColor": "#f3f5f9",
+        "backgroundColor": "#f3f3f4",
         "borderRadius": 10,
         "maxHeight": "auto",
         "minHeight": 210,
@@ -578,8 +578,8 @@ exports[`SrpInputGrid renders with empty seed phrase 1`] = `
           style={
             {
               "alignItems": "center",
-              "backgroundColor": "#3c4d9d0f",
-              "borderColor": "#b7bbc866",
+              "backgroundColor": "#b4b4b528",
+              "borderColor": "#b4b4b566",
               "borderRadius": 12,
               "borderWidth": 1,
               "flexDirection": "row",
@@ -623,7 +623,7 @@ exports[`SrpInputGrid renders with empty seed phrase 1`] = `
               onSelectionChange={[Function]}
               onSubmitEditing={[Function]}
               placeholder=""
-              placeholderTextColor="#b7bbc8"
+              placeholderTextColor="#babbbe"
               returnKeyType="done"
               showSoftInputOnFocus={true}
               spellCheck={false}
@@ -632,7 +632,7 @@ exports[`SrpInputGrid renders with empty seed phrase 1`] = `
                   "backgroundColor": "transparent",
                   "borderColor": "transparent",
                   "borderWidth": 1,
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "display": "flex",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
@@ -677,7 +677,7 @@ exports[`SrpInputGrid renders with empty seed phrase 1`] = `
             {
               "alignItems": "center",
               "backgroundColor": "transparent",
-              "borderColor": "#b7bbc866",
+              "borderColor": "#b4b4b566",
               "borderRadius": 12,
               "borderWidth": 0,
               "display": "flex",
@@ -721,7 +721,7 @@ exports[`SrpInputGrid renders with empty seed phrase 1`] = `
               onSelectionChange={[Function]}
               onSubmitEditing={[Function]}
               placeholder="Enter your Secret Recovery Phrase"
-              placeholderTextColor="#686e7d"
+              placeholderTextColor="#66676a"
               returnKeyType="done"
               showSoftInputOnFocus={true}
               spellCheck={false}
@@ -730,7 +730,7 @@ exports[`SrpInputGrid renders with empty seed phrase 1`] = `
                   "backgroundColor": "transparent",
                   "borderColor": "transparent",
                   "borderWidth": 1,
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "display": "flex",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
@@ -791,7 +791,7 @@ exports[`SrpInputGrid renders with multiple words 1`] = `
   <View
     style={
       {
-        "backgroundColor": "#f3f5f9",
+        "backgroundColor": "#f3f3f4",
         "borderRadius": 10,
         "maxHeight": "auto",
         "minHeight": 210,
@@ -838,10 +838,10 @@ exports[`SrpInputGrid renders with multiple words 1`] = `
             {
               "alignItems": "center",
               "backgroundColor": "#ffffff",
-              "borderColor": "#b7bbc866",
+              "borderColor": "#b4b4b566",
               "borderRadius": 8,
               "borderWidth": 1,
-              "color": "#121314",
+              "color": "#131416",
               "flex": 0,
               "flexDirection": "row",
               "fontFamily": "Geist-Regular",
@@ -874,7 +874,7 @@ exports[`SrpInputGrid renders with multiple words 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Bold",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -917,7 +917,7 @@ exports[`SrpInputGrid renders with multiple words 1`] = `
               onSelectionChange={[Function]}
               onSubmitEditing={[Function]}
               placeholder=""
-              placeholderTextColor="#b7bbc8"
+              placeholderTextColor="#babbbe"
               returnKeyType="done"
               showSoftInputOnFocus={true}
               spellCheck={false}
@@ -926,7 +926,7 @@ exports[`SrpInputGrid renders with multiple words 1`] = `
                   "backgroundColor": "#ffffff",
                   "borderColor": "transparent",
                   "borderWidth": 1,
-                  "color": "#121314",
+                  "color": "#131416",
                   "flex": 1,
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
@@ -971,10 +971,10 @@ exports[`SrpInputGrid renders with multiple words 1`] = `
             {
               "alignItems": "center",
               "backgroundColor": "#ffffff",
-              "borderColor": "#b7bbc866",
+              "borderColor": "#b4b4b566",
               "borderRadius": 8,
               "borderWidth": 1,
-              "color": "#121314",
+              "color": "#131416",
               "flex": 0,
               "flexDirection": "row",
               "fontFamily": "Geist-Regular",
@@ -1007,7 +1007,7 @@ exports[`SrpInputGrid renders with multiple words 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Bold",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -1050,7 +1050,7 @@ exports[`SrpInputGrid renders with multiple words 1`] = `
               onSelectionChange={[Function]}
               onSubmitEditing={[Function]}
               placeholder=""
-              placeholderTextColor="#b7bbc8"
+              placeholderTextColor="#babbbe"
               returnKeyType="done"
               showSoftInputOnFocus={true}
               spellCheck={false}
@@ -1059,7 +1059,7 @@ exports[`SrpInputGrid renders with multiple words 1`] = `
                   "backgroundColor": "#ffffff",
                   "borderColor": "transparent",
                   "borderWidth": 1,
-                  "color": "#121314",
+                  "color": "#131416",
                   "flex": 1,
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
@@ -1104,10 +1104,10 @@ exports[`SrpInputGrid renders with multiple words 1`] = `
             {
               "alignItems": "center",
               "backgroundColor": "#ffffff",
-              "borderColor": "#b7bbc866",
+              "borderColor": "#b4b4b566",
               "borderRadius": 8,
               "borderWidth": 1,
-              "color": "#121314",
+              "color": "#131416",
               "flex": 0,
               "flexDirection": "row",
               "fontFamily": "Geist-Regular",
@@ -1140,7 +1140,7 @@ exports[`SrpInputGrid renders with multiple words 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Bold",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -1183,7 +1183,7 @@ exports[`SrpInputGrid renders with multiple words 1`] = `
               onSelectionChange={[Function]}
               onSubmitEditing={[Function]}
               placeholder=""
-              placeholderTextColor="#b7bbc8"
+              placeholderTextColor="#babbbe"
               returnKeyType="done"
               showSoftInputOnFocus={true}
               spellCheck={false}
@@ -1192,7 +1192,7 @@ exports[`SrpInputGrid renders with multiple words 1`] = `
                   "backgroundColor": "#ffffff",
                   "borderColor": "transparent",
                   "borderWidth": 1,
-                  "color": "#121314",
+                  "color": "#131416",
                   "flex": 1,
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
@@ -1236,8 +1236,8 @@ exports[`SrpInputGrid renders with multiple words 1`] = `
           style={
             {
               "alignItems": "center",
-              "backgroundColor": "#3c4d9d0f",
-              "borderColor": "#b7bbc866",
+              "backgroundColor": "#b4b4b528",
+              "borderColor": "#b4b4b566",
               "borderRadius": 12,
               "borderWidth": 1,
               "flexDirection": "row",
@@ -1282,7 +1282,7 @@ exports[`SrpInputGrid renders with multiple words 1`] = `
               onSelectionChange={[Function]}
               onSubmitEditing={[Function]}
               placeholder="Enter your Secret Recovery Phrase"
-              placeholderTextColor="#686e7d"
+              placeholderTextColor="#66676a"
               returnKeyType="done"
               showSoftInputOnFocus={true}
               spellCheck={false}
@@ -1291,7 +1291,7 @@ exports[`SrpInputGrid renders with multiple words 1`] = `
                   "backgroundColor": "transparent",
                   "borderColor": "transparent",
                   "borderWidth": 1,
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "display": "flex",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
diff --git a/app/components/UI/Stake/Views/StakeConfirmationView/__snapshots__/StakeConfirmationView.test.tsx.snap b/app/components/UI/Stake/Views/StakeConfirmationView/__snapshots__/StakeConfirmationView.test.tsx.snap
index 44b027ddd0af..321d5823ce3c 100644
--- a/app/components/UI/Stake/Views/StakeConfirmationView/__snapshots__/StakeConfirmationView.test.tsx.snap
+++ b/app/components/UI/Stake/Views/StakeConfirmationView/__snapshots__/StakeConfirmationView.test.tsx.snap
@@ -5,7 +5,7 @@ exports[`StakeConfirmationView render matches snapshot 1`] = `
   collapsable={false}
   contentContainerStyle={
     {
-      "backgroundColor": "#f3f5f9",
+      "backgroundColor": "#f3f3f4",
       "flexGrow": 1,
       "justifyContent": "space-between",
       "paddingHorizontal": 16,
@@ -43,7 +43,7 @@ exports[`StakeConfirmationView render matches snapshot 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 24,
                 "letterSpacing": 0,
@@ -59,7 +59,7 @@ exports[`StakeConfirmationView render matches snapshot 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -87,7 +87,7 @@ exports[`StakeConfirmationView render matches snapshot 1`] = `
                 "backgroundColor": "#ffffff",
                 "borderBottomLeftRadius": 0,
                 "borderBottomRightRadius": 0,
-                "borderColor": "#b7bbc8",
+                "borderColor": "#949596",
                 "borderRadius": 8,
                 "borderWidth": 0,
                 "gap": 16,
@@ -140,7 +140,7 @@ exports[`StakeConfirmationView render matches snapshot 1`] = `
                       accessibilityRole="text"
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Medium",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -228,7 +228,7 @@ exports[`StakeConfirmationView render matches snapshot 1`] = `
                       accessibilityRole="text"
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Medium",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -281,7 +281,7 @@ exports[`StakeConfirmationView render matches snapshot 1`] = `
                 "borderBottomLeftRadius": 8,
                 "borderBottomRightRadius": 8,
                 "borderBottomWidth": 0,
-                "borderColor": "#b7bbc866",
+                "borderColor": "#b4b4b566",
                 "borderLeftWidth": 0,
                 "borderRadius": 4,
                 "borderRightWidth": 0,
@@ -336,7 +336,7 @@ exports[`StakeConfirmationView render matches snapshot 1`] = `
                       accessibilityRole="text"
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Medium",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -403,7 +403,7 @@ exports[`StakeConfirmationView render matches snapshot 1`] = `
                         accessibilityRole="text"
                         style={
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "fontFamily": "Geist-Regular",
                             "fontSize": 16,
                             "letterSpacing": 0,
@@ -425,7 +425,7 @@ exports[`StakeConfirmationView render matches snapshot 1`] = `
           style={
             {
               "backgroundColor": "#ffffff",
-              "borderColor": "#b7bbc8",
+              "borderColor": "#949596",
               "borderRadius": 8,
               "borderWidth": 0,
               "gap": 16,
@@ -477,7 +477,7 @@ exports[`StakeConfirmationView render matches snapshot 1`] = `
                     accessibilityRole="text"
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Medium",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -509,7 +509,7 @@ exports[`StakeConfirmationView render matches snapshot 1`] = `
                     }
                   >
                     <SvgMock
-                      color="#686e7d"
+                      color="#66676a"
                       fill="currentColor"
                       height={16}
                       name="Question"
@@ -613,7 +613,7 @@ exports[`StakeConfirmationView render matches snapshot 1`] = `
                     accessibilityRole="text"
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Medium",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -664,7 +664,7 @@ exports[`StakeConfirmationView render matches snapshot 1`] = `
                       accessibilityRole="text"
                       style={
                         {
-                          "color": "#686e7d",
+                          "color": "#66676a",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -678,7 +678,7 @@ exports[`StakeConfirmationView render matches snapshot 1`] = `
                       accessibilityRole="text"
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -737,7 +737,7 @@ exports[`StakeConfirmationView render matches snapshot 1`] = `
                     accessibilityRole="text"
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Medium",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -769,7 +769,7 @@ exports[`StakeConfirmationView render matches snapshot 1`] = `
                     }
                   >
                     <SvgMock
-                      color="#686e7d"
+                      color="#66676a"
                       fill="currentColor"
                       height={16}
                       name="Question"
@@ -814,7 +814,7 @@ exports[`StakeConfirmationView render matches snapshot 1`] = `
                     accessibilityRole="text"
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -835,7 +835,7 @@ exports[`StakeConfirmationView render matches snapshot 1`] = `
           style={
             {
               "backgroundColor": "#ffffff",
-              "borderColor": "#b7bbc8",
+              "borderColor": "#949596",
               "borderRadius": 8,
               "borderWidth": 0,
               "gap": 16,
@@ -887,7 +887,7 @@ exports[`StakeConfirmationView render matches snapshot 1`] = `
                     accessibilityRole="text"
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Medium",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -919,7 +919,7 @@ exports[`StakeConfirmationView render matches snapshot 1`] = `
                     }
                   >
                     <SvgMock
-                      color="#686e7d"
+                      color="#66676a"
                       fill="currentColor"
                       height={16}
                       name="Question"
@@ -964,7 +964,7 @@ exports[`StakeConfirmationView render matches snapshot 1`] = `
                     accessibilityRole="text"
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -1068,7 +1068,7 @@ exports[`StakeConfirmationView render matches snapshot 1`] = `
             {
               "alignItems": "center",
               "alignSelf": "stretch",
-              "backgroundColor": "#3c4d9d0f",
+              "backgroundColor": "#b4b4b528",
               "borderColor": "transparent",
               "borderRadius": 12,
               "borderWidth": 1,
@@ -1112,7 +1112,7 @@ exports[`StakeConfirmationView render matches snapshot 1`] = `
             {
               "alignItems": "center",
               "alignSelf": "stretch",
-              "backgroundColor": "#121314",
+              "backgroundColor": "#131416",
               "borderRadius": 12,
               "flexBasis": 0,
               "flexDirection": "row",
diff --git a/app/components/UI/Stake/Views/StakeEarningsHistoryView/__snapshots__/StakeEarningsHistoryView.test.tsx.snap b/app/components/UI/Stake/Views/StakeEarningsHistoryView/__snapshots__/StakeEarningsHistoryView.test.tsx.snap
index d8e39a540f99..c93ce8ae0fcc 100644
--- a/app/components/UI/Stake/Views/StakeEarningsHistoryView/__snapshots__/StakeEarningsHistoryView.test.tsx.snap
+++ b/app/components/UI/Stake/Views/StakeEarningsHistoryView/__snapshots__/StakeEarningsHistoryView.test.tsx.snap
@@ -57,7 +57,7 @@ exports[`StakeEarningsHistoryView renders correctly and matches snapshot 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 3,
@@ -70,7 +70,7 @@ exports[`StakeEarningsHistoryView renders correctly and matches snapshot 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#686e7d",
+                      "color": "#66676a",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -98,7 +98,7 @@ exports[`StakeEarningsHistoryView renders correctly and matches snapshot 1`] = `
               onPressOut={[Function]}
               style={
                 {
-                  "backgroundColor": "#3c4d9d0f",
+                  "backgroundColor": "#b4b4b528",
                   "borderRadius": 32,
                   "paddingHorizontal": 14,
                   "paddingVertical": 7,
@@ -110,7 +110,7 @@ exports[`StakeEarningsHistoryView renders correctly and matches snapshot 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 3,
@@ -123,7 +123,7 @@ exports[`StakeEarningsHistoryView renders correctly and matches snapshot 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#686e7d",
+                      "color": "#66676a",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -163,7 +163,7 @@ exports[`StakeEarningsHistoryView renders correctly and matches snapshot 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 3,
@@ -176,7 +176,7 @@ exports[`StakeEarningsHistoryView renders correctly and matches snapshot 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#686e7d",
+                      "color": "#66676a",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -226,7 +226,7 @@ exports[`StakeEarningsHistoryView renders correctly and matches snapshot 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -831,7 +831,7 @@ exports[`StakeEarningsHistoryView renders correctly and matches snapshot 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -855,7 +855,7 @@ exports[`StakeEarningsHistoryView renders correctly and matches snapshot 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Medium",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -894,7 +894,7 @@ exports[`StakeEarningsHistoryView renders correctly and matches snapshot 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Medium",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -947,7 +947,7 @@ exports[`StakeEarningsHistoryView renders correctly and matches snapshot 1`] = `
                     accessibilityRole="text"
                     style={
                       {
-                        "color": "#686e7d",
+                        "color": "#66676a",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 14,
                         "letterSpacing": 0,
diff --git a/app/components/UI/Stake/Views/UnstakeConfirmationView/__snapshots__/UnstakeConfirmationView.test.tsx.snap b/app/components/UI/Stake/Views/UnstakeConfirmationView/__snapshots__/UnstakeConfirmationView.test.tsx.snap
index 57c43b991cbf..48e91e9d67bd 100644
--- a/app/components/UI/Stake/Views/UnstakeConfirmationView/__snapshots__/UnstakeConfirmationView.test.tsx.snap
+++ b/app/components/UI/Stake/Views/UnstakeConfirmationView/__snapshots__/UnstakeConfirmationView.test.tsx.snap
@@ -4,7 +4,7 @@ exports[`UnstakeConfirmationView render matches snapshot 1`] = `
 <View
   style={
     {
-      "backgroundColor": "#f3f5f9",
+      "backgroundColor": "#f3f3f4",
       "height": "100%",
       "justifyContent": "space-between",
       "paddingHorizontal": 16,
@@ -37,7 +37,7 @@ exports[`UnstakeConfirmationView render matches snapshot 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Bold",
               "fontSize": 24,
               "letterSpacing": 0,
@@ -53,7 +53,7 @@ exports[`UnstakeConfirmationView render matches snapshot 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -78,7 +78,7 @@ exports[`UnstakeConfirmationView render matches snapshot 1`] = `
         style={
           {
             "backgroundColor": "#ffffff",
-            "borderColor": "#b7bbc8",
+            "borderColor": "#949596",
             "borderRadius": 8,
             "borderWidth": 0,
             "gap": 16,
@@ -130,7 +130,7 @@ exports[`UnstakeConfirmationView render matches snapshot 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Medium",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -162,7 +162,7 @@ exports[`UnstakeConfirmationView render matches snapshot 1`] = `
                   }
                 >
                   <SvgMock
-                    color="#686e7d"
+                    color="#66676a"
                     fill="currentColor"
                     height={16}
                     name="Question"
@@ -207,7 +207,7 @@ exports[`UnstakeConfirmationView render matches snapshot 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -231,7 +231,7 @@ exports[`UnstakeConfirmationView render matches snapshot 1`] = `
               "backgroundColor": "#ffffff",
               "borderBottomLeftRadius": 0,
               "borderBottomRightRadius": 0,
-              "borderColor": "#b7bbc8",
+              "borderColor": "#949596",
               "borderRadius": 8,
               "borderWidth": 0,
               "gap": 16,
@@ -284,7 +284,7 @@ exports[`UnstakeConfirmationView render matches snapshot 1`] = `
                     accessibilityRole="text"
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Medium",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -372,7 +372,7 @@ exports[`UnstakeConfirmationView render matches snapshot 1`] = `
                     accessibilityRole="text"
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Medium",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -425,7 +425,7 @@ exports[`UnstakeConfirmationView render matches snapshot 1`] = `
               "borderBottomLeftRadius": 8,
               "borderBottomRightRadius": 8,
               "borderBottomWidth": 0,
-              "borderColor": "#b7bbc866",
+              "borderColor": "#b4b4b566",
               "borderLeftWidth": 0,
               "borderRadius": 4,
               "borderRightWidth": 0,
@@ -480,7 +480,7 @@ exports[`UnstakeConfirmationView render matches snapshot 1`] = `
                     accessibilityRole="text"
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Medium",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -547,7 +547,7 @@ exports[`UnstakeConfirmationView render matches snapshot 1`] = `
                       accessibilityRole="text"
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -652,7 +652,7 @@ exports[`UnstakeConfirmationView render matches snapshot 1`] = `
           {
             "alignItems": "center",
             "alignSelf": "stretch",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -696,7 +696,7 @@ exports[`UnstakeConfirmationView render matches snapshot 1`] = `
           {
             "alignItems": "center",
             "alignSelf": "stretch",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "flexBasis": 0,
             "flexDirection": "row",
diff --git a/app/components/UI/Stake/components/GasImpactModal/__snapshots__/GasImpactModal.test.tsx.snap b/app/components/UI/Stake/components/GasImpactModal/__snapshots__/GasImpactModal.test.tsx.snap
index 13f4b20cd755..dd740b3e8d0d 100644
--- a/app/components/UI/Stake/components/GasImpactModal/__snapshots__/GasImpactModal.test.tsx.snap
+++ b/app/components/UI/Stake/components/GasImpactModal/__snapshots__/GasImpactModal.test.tsx.snap
@@ -34,7 +34,7 @@ exports[`GasImpactModal render matches snapshot 1`] = `
       style={
         [
           {
-            "backgroundColor": "#3f434a66",
+            "backgroundColor": "#0a0d135c",
             "bottom": 0,
             "left": 0,
             "position": "absolute",
@@ -84,7 +84,7 @@ exports[`GasImpactModal render matches snapshot 1`] = `
           [
             {
               "backgroundColor": "#ffffff",
-              "borderColor": "#b7bbc866",
+              "borderColor": "#b4b4b566",
               "borderTopLeftRadius": 24,
               "borderTopRightRadius": 24,
               "borderWidth": 1,
@@ -121,7 +121,7 @@ exports[`GasImpactModal render matches snapshot 1`] = `
           <View
             style={
               {
-                "backgroundColor": "#b7bbc866",
+                "backgroundColor": "#b4b4b566",
                 "borderRadius": 2,
                 "height": 4,
                 "width": 40,
@@ -176,9 +176,9 @@ exports[`GasImpactModal render matches snapshot 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Bold",
-                    "fontSize": 18,
+                    "fontSize": 20,
                     "letterSpacing": 0,
                     "lineHeight": 24,
                   }
@@ -210,7 +210,7 @@ exports[`GasImpactModal render matches snapshot 1`] = `
                   }
                 >
                   <SvgMock
-                    color="#121314"
+                    color="#131416"
                     fill="currentColor"
                     height={24}
                     name="Close"
@@ -230,7 +230,7 @@ exports[`GasImpactModal render matches snapshot 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -263,7 +263,7 @@ exports[`GasImpactModal render matches snapshot 1`] = `
                 {
                   "alignItems": "center",
                   "alignSelf": "flex-start",
-                  "backgroundColor": "#3c4d9d0f",
+                  "backgroundColor": "#b4b4b528",
                   "borderColor": "transparent",
                   "borderRadius": 12,
                   "borderWidth": 1,
@@ -303,7 +303,7 @@ exports[`GasImpactModal render matches snapshot 1`] = `
                 {
                   "alignItems": "center",
                   "alignSelf": "flex-start",
-                  "backgroundColor": "#121314",
+                  "backgroundColor": "#131416",
                   "borderRadius": 12,
                   "flex": 1,
                   "flexDirection": "row",
diff --git a/app/components/UI/Stake/components/PoolStakingLearnMoreModal/InteractiveTimespanChart/ChartTimespanButtonGroup/__snapshots__/ChartTimespanButtonGroup.test.tsx.snap b/app/components/UI/Stake/components/PoolStakingLearnMoreModal/InteractiveTimespanChart/ChartTimespanButtonGroup/__snapshots__/ChartTimespanButtonGroup.test.tsx.snap
index 027e553a8bd9..199db5f22c41 100644
--- a/app/components/UI/Stake/components/PoolStakingLearnMoreModal/InteractiveTimespanChart/ChartTimespanButtonGroup/__snapshots__/ChartTimespanButtonGroup.test.tsx.snap
+++ b/app/components/UI/Stake/components/PoolStakingLearnMoreModal/InteractiveTimespanChart/ChartTimespanButtonGroup/__snapshots__/ChartTimespanButtonGroup.test.tsx.snap
@@ -18,7 +18,7 @@ exports[`ChartTimespanButtonGroup render matches snapshot 1`] = `
     style={
       {
         "alignItems": "center",
-        "backgroundColor": "#3c4d9d0f",
+        "backgroundColor": "#b4b4b528",
         "borderRadius": 32,
         "height": 36,
         "justifyContent": "center",
@@ -31,7 +31,7 @@ exports[`ChartTimespanButtonGroup render matches snapshot 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#686e7d",
+          "color": "#66676a",
           "fontFamily": "Geist-Medium",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -60,7 +60,7 @@ exports[`ChartTimespanButtonGroup render matches snapshot 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#686e7d",
+          "color": "#66676a",
           "fontFamily": "Geist-Medium",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -89,7 +89,7 @@ exports[`ChartTimespanButtonGroup render matches snapshot 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#686e7d",
+          "color": "#66676a",
           "fontFamily": "Geist-Medium",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -118,7 +118,7 @@ exports[`ChartTimespanButtonGroup render matches snapshot 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#686e7d",
+          "color": "#66676a",
           "fontFamily": "Geist-Medium",
           "fontSize": 16,
           "letterSpacing": 0,
diff --git a/app/components/UI/Stake/components/PoolStakingLearnMoreModal/InteractiveTimespanChart/GraphTooltip/__snapshots__/GraphTooltip.test.tsx.snap b/app/components/UI/Stake/components/PoolStakingLearnMoreModal/InteractiveTimespanChart/GraphTooltip/__snapshots__/GraphTooltip.test.tsx.snap
index 41c2f66b777b..d83dea3a1c5f 100644
--- a/app/components/UI/Stake/components/PoolStakingLearnMoreModal/InteractiveTimespanChart/GraphTooltip/__snapshots__/GraphTooltip.test.tsx.snap
+++ b/app/components/UI/Stake/components/PoolStakingLearnMoreModal/InteractiveTimespanChart/GraphTooltip/__snapshots__/GraphTooltip.test.tsx.snap
@@ -28,7 +28,7 @@ exports[`GraphTooltip render matches snapshot 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#686e7d",
+        "color": "#66676a",
         "fontFamily": "Geist-Medium",
         "fontSize": 16,
         "letterSpacing": 0,
diff --git a/app/components/UI/Stake/components/PoolStakingLearnMoreModal/InteractiveTimespanChart/PlotLine/__snapshots__/PlotLine.test.tsx.snap b/app/components/UI/Stake/components/PoolStakingLearnMoreModal/InteractiveTimespanChart/PlotLine/__snapshots__/PlotLine.test.tsx.snap
index 54bbeeb669e5..d88a22feb11d 100644
--- a/app/components/UI/Stake/components/PoolStakingLearnMoreModal/InteractiveTimespanChart/PlotLine/__snapshots__/PlotLine.test.tsx.snap
+++ b/app/components/UI/Stake/components/PoolStakingLearnMoreModal/InteractiveTimespanChart/PlotLine/__snapshots__/PlotLine.test.tsx.snap
@@ -14,7 +14,7 @@ exports[`PlotLine render matches snapshot 1`] = `
   }
   stroke={
     {
-      "payload": 4285034109,
+      "payload": 4284901226,
       "type": 0,
     }
   }
diff --git a/app/components/UI/Stake/components/PoolStakingLearnMoreModal/InteractiveTimespanChart/__snapshots__/InteractiveTimespanChart.test.tsx.snap b/app/components/UI/Stake/components/PoolStakingLearnMoreModal/InteractiveTimespanChart/__snapshots__/InteractiveTimespanChart.test.tsx.snap
index 200542c44305..eb90c193d86c 100644
--- a/app/components/UI/Stake/components/PoolStakingLearnMoreModal/InteractiveTimespanChart/__snapshots__/InteractiveTimespanChart.test.tsx.snap
+++ b/app/components/UI/Stake/components/PoolStakingLearnMoreModal/InteractiveTimespanChart/__snapshots__/InteractiveTimespanChart.test.tsx.snap
@@ -21,7 +21,7 @@ exports[`InteractiveTimespanChart render matches snapshot 1`] = `
       style={
         {
           "alignItems": "center",
-          "backgroundColor": "#3c4d9d0f",
+          "backgroundColor": "#b4b4b528",
           "borderRadius": 32,
           "height": 36,
           "justifyContent": "center",
@@ -34,7 +34,7 @@ exports[`InteractiveTimespanChart render matches snapshot 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -63,7 +63,7 @@ exports[`InteractiveTimespanChart render matches snapshot 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -92,7 +92,7 @@ exports[`InteractiveTimespanChart render matches snapshot 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -117,7 +117,7 @@ exports[`InteractiveTimespanChart render matches snapshot 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Bold",
           "fontSize": 24,
           "letterSpacing": 0,
@@ -131,7 +131,7 @@ exports[`InteractiveTimespanChart render matches snapshot 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#686e7d",
+          "color": "#66676a",
           "fontFamily": "Geist-Medium",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -233,7 +233,7 @@ exports[`InteractiveTimespanChart render matches snapshot 1`] = `
               }
               stroke={
                 {
-                  "payload": 4279374612,
+                  "payload": 4279440406,
                   "type": 0,
                 }
               }
@@ -245,7 +245,7 @@ exports[`InteractiveTimespanChart render matches snapshot 1`] = `
                 gradient={
                   [
                     0,
-                    856822548,
+                    856888342,
                     1,
                     872415231,
                   ]
@@ -288,7 +288,7 @@ exports[`InteractiveTimespanChart renders no title or subtitle when defaultTitle
       style={
         {
           "alignItems": "center",
-          "backgroundColor": "#3c4d9d0f",
+          "backgroundColor": "#b4b4b528",
           "borderRadius": 32,
           "height": 36,
           "justifyContent": "center",
@@ -301,7 +301,7 @@ exports[`InteractiveTimespanChart renders no title or subtitle when defaultTitle
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -330,7 +330,7 @@ exports[`InteractiveTimespanChart renders no title or subtitle when defaultTitle
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -359,7 +359,7 @@ exports[`InteractiveTimespanChart renders no title or subtitle when defaultTitle
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -384,7 +384,7 @@ exports[`InteractiveTimespanChart renders no title or subtitle when defaultTitle
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Bold",
           "fontSize": 24,
           "letterSpacing": 0,
@@ -396,7 +396,7 @@ exports[`InteractiveTimespanChart renders no title or subtitle when defaultTitle
       accessibilityRole="text"
       style={
         {
-          "color": "#686e7d",
+          "color": "#66676a",
           "fontFamily": "Geist-Medium",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -496,7 +496,7 @@ exports[`InteractiveTimespanChart renders no title or subtitle when defaultTitle
               }
               stroke={
                 {
-                  "payload": 4279374612,
+                  "payload": 4279440406,
                   "type": 0,
                 }
               }
@@ -508,7 +508,7 @@ exports[`InteractiveTimespanChart renders no title or subtitle when defaultTitle
                 gradient={
                   [
                     0,
-                    856822548,
+                    856888342,
                     1,
                     872415231,
                   ]
@@ -551,7 +551,7 @@ exports[`InteractiveTimespanChart renders only the subtitle when title props are
       style={
         {
           "alignItems": "center",
-          "backgroundColor": "#3c4d9d0f",
+          "backgroundColor": "#b4b4b528",
           "borderRadius": 32,
           "height": 36,
           "justifyContent": "center",
@@ -564,7 +564,7 @@ exports[`InteractiveTimespanChart renders only the subtitle when title props are
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -593,7 +593,7 @@ exports[`InteractiveTimespanChart renders only the subtitle when title props are
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -622,7 +622,7 @@ exports[`InteractiveTimespanChart renders only the subtitle when title props are
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -647,7 +647,7 @@ exports[`InteractiveTimespanChart renders only the subtitle when title props are
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Bold",
           "fontSize": 24,
           "letterSpacing": 0,
@@ -659,7 +659,7 @@ exports[`InteractiveTimespanChart renders only the subtitle when title props are
       accessibilityRole="text"
       style={
         {
-          "color": "#686e7d",
+          "color": "#66676a",
           "fontFamily": "Geist-Medium",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -761,7 +761,7 @@ exports[`InteractiveTimespanChart renders only the subtitle when title props are
               }
               stroke={
                 {
-                  "payload": 4279374612,
+                  "payload": 4279440406,
                   "type": 0,
                 }
               }
@@ -773,7 +773,7 @@ exports[`InteractiveTimespanChart renders only the subtitle when title props are
                 gradient={
                   [
                     0,
-                    856822548,
+                    856888342,
                     1,
                     872415231,
                   ]
@@ -816,7 +816,7 @@ exports[`InteractiveTimespanChart renders only the title when subtitle props are
       style={
         {
           "alignItems": "center",
-          "backgroundColor": "#3c4d9d0f",
+          "backgroundColor": "#b4b4b528",
           "borderRadius": 32,
           "height": 36,
           "justifyContent": "center",
@@ -829,7 +829,7 @@ exports[`InteractiveTimespanChart renders only the title when subtitle props are
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -858,7 +858,7 @@ exports[`InteractiveTimespanChart renders only the title when subtitle props are
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -887,7 +887,7 @@ exports[`InteractiveTimespanChart renders only the title when subtitle props are
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -912,7 +912,7 @@ exports[`InteractiveTimespanChart renders only the title when subtitle props are
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Bold",
           "fontSize": 24,
           "letterSpacing": 0,
@@ -926,7 +926,7 @@ exports[`InteractiveTimespanChart renders only the title when subtitle props are
       accessibilityRole="text"
       style={
         {
-          "color": "#686e7d",
+          "color": "#66676a",
           "fontFamily": "Geist-Medium",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -1026,7 +1026,7 @@ exports[`InteractiveTimespanChart renders only the title when subtitle props are
               }
               stroke={
                 {
-                  "payload": 4279374612,
+                  "payload": 4279440406,
                   "type": 0,
                 }
               }
@@ -1038,7 +1038,7 @@ exports[`InteractiveTimespanChart renders only the title when subtitle props are
                 gradient={
                   [
                     0,
-                    856822548,
+                    856888342,
                     1,
                     872415231,
                   ]
@@ -1081,7 +1081,7 @@ exports[`InteractiveTimespanChart supports dataPoints as number[] 1`] = `
       style={
         {
           "alignItems": "center",
-          "backgroundColor": "#3c4d9d0f",
+          "backgroundColor": "#b4b4b528",
           "borderRadius": 32,
           "height": 36,
           "justifyContent": "center",
@@ -1094,7 +1094,7 @@ exports[`InteractiveTimespanChart supports dataPoints as number[] 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -1123,7 +1123,7 @@ exports[`InteractiveTimespanChart supports dataPoints as number[] 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -1152,7 +1152,7 @@ exports[`InteractiveTimespanChart supports dataPoints as number[] 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -1177,7 +1177,7 @@ exports[`InteractiveTimespanChart supports dataPoints as number[] 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Bold",
           "fontSize": 24,
           "letterSpacing": 0,
@@ -1191,7 +1191,7 @@ exports[`InteractiveTimespanChart supports dataPoints as number[] 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#686e7d",
+          "color": "#66676a",
           "fontFamily": "Geist-Medium",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -1293,7 +1293,7 @@ exports[`InteractiveTimespanChart supports dataPoints as number[] 1`] = `
               }
               stroke={
                 {
-                  "payload": 4279374612,
+                  "payload": 4279440406,
                   "type": 0,
                 }
               }
@@ -1305,7 +1305,7 @@ exports[`InteractiveTimespanChart supports dataPoints as number[] 1`] = `
                 gradient={
                   [
                     0,
-                    856822548,
+                    856888342,
                     1,
                     872415231,
                   ]
@@ -1348,7 +1348,7 @@ exports[`InteractiveTimespanChart supports dataPoints as object[] 1`] = `
       style={
         {
           "alignItems": "center",
-          "backgroundColor": "#3c4d9d0f",
+          "backgroundColor": "#b4b4b528",
           "borderRadius": 32,
           "height": 36,
           "justifyContent": "center",
@@ -1361,7 +1361,7 @@ exports[`InteractiveTimespanChart supports dataPoints as object[] 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -1390,7 +1390,7 @@ exports[`InteractiveTimespanChart supports dataPoints as object[] 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -1419,7 +1419,7 @@ exports[`InteractiveTimespanChart supports dataPoints as object[] 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -1444,7 +1444,7 @@ exports[`InteractiveTimespanChart supports dataPoints as object[] 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Bold",
           "fontSize": 24,
           "letterSpacing": 0,
@@ -1458,7 +1458,7 @@ exports[`InteractiveTimespanChart supports dataPoints as object[] 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#686e7d",
+          "color": "#66676a",
           "fontFamily": "Geist-Medium",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -1560,7 +1560,7 @@ exports[`InteractiveTimespanChart supports dataPoints as object[] 1`] = `
               }
               stroke={
                 {
-                  "payload": 4279374612,
+                  "payload": 4279440406,
                   "type": 0,
                 }
               }
@@ -1572,7 +1572,7 @@ exports[`InteractiveTimespanChart supports dataPoints as object[] 1`] = `
                 gradient={
                   [
                     0,
-                    856822548,
+                    856888342,
                     1,
                     872415231,
                   ]
diff --git a/app/components/UI/Stake/components/PoolStakingLearnMoreModal/__snapshots__/PoolStakingLearnMoreModal.test.tsx.snap b/app/components/UI/Stake/components/PoolStakingLearnMoreModal/__snapshots__/PoolStakingLearnMoreModal.test.tsx.snap
index 58d67c2b6292..045e76d58a37 100644
--- a/app/components/UI/Stake/components/PoolStakingLearnMoreModal/__snapshots__/PoolStakingLearnMoreModal.test.tsx.snap
+++ b/app/components/UI/Stake/components/PoolStakingLearnMoreModal/__snapshots__/PoolStakingLearnMoreModal.test.tsx.snap
@@ -34,7 +34,7 @@ exports[`PoolStakingLearnMoreModal render matches snapshot 1`] = `
       style={
         [
           {
-            "backgroundColor": "#3f434a66",
+            "backgroundColor": "#0a0d135c",
             "bottom": 0,
             "left": 0,
             "position": "absolute",
@@ -84,7 +84,7 @@ exports[`PoolStakingLearnMoreModal render matches snapshot 1`] = `
           [
             {
               "backgroundColor": "#ffffff",
-              "borderColor": "#b7bbc866",
+              "borderColor": "#b4b4b566",
               "borderTopLeftRadius": 24,
               "borderTopRightRadius": 24,
               "borderWidth": 1,
@@ -165,7 +165,7 @@ exports[`PoolStakingLearnMoreModal render matches snapshot 1`] = `
                     style={
                       [
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Bold",
                           "fontSize": 16,
                           "fontWeight": 400,
@@ -243,7 +243,7 @@ exports[`PoolStakingLearnMoreModal render matches snapshot 1`] = `
                       style={
                         [
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "height": 24,
                             "width": 24,
                           },
@@ -275,7 +275,7 @@ exports[`PoolStakingLearnMoreModal render matches snapshot 1`] = `
                   style={
                     {
                       "alignItems": "center",
-                      "backgroundColor": "#3c4d9d0f",
+                      "backgroundColor": "#b4b4b528",
                       "borderRadius": 32,
                       "height": 36,
                       "justifyContent": "center",
@@ -288,7 +288,7 @@ exports[`PoolStakingLearnMoreModal render matches snapshot 1`] = `
                     accessibilityRole="text"
                     style={
                       {
-                        "color": "#686e7d",
+                        "color": "#66676a",
                         "fontFamily": "Geist-Medium",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -317,7 +317,7 @@ exports[`PoolStakingLearnMoreModal render matches snapshot 1`] = `
                     accessibilityRole="text"
                     style={
                       {
-                        "color": "#686e7d",
+                        "color": "#66676a",
                         "fontFamily": "Geist-Medium",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -346,7 +346,7 @@ exports[`PoolStakingLearnMoreModal render matches snapshot 1`] = `
                     accessibilityRole="text"
                     style={
                       {
-                        "color": "#686e7d",
+                        "color": "#66676a",
                         "fontFamily": "Geist-Medium",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -375,7 +375,7 @@ exports[`PoolStakingLearnMoreModal render matches snapshot 1`] = `
                     accessibilityRole="text"
                     style={
                       {
-                        "color": "#686e7d",
+                        "color": "#66676a",
                         "fontFamily": "Geist-Medium",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -414,7 +414,7 @@ exports[`PoolStakingLearnMoreModal render matches snapshot 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#686e7d",
+                      "color": "#66676a",
                       "fontFamily": "Geist-Medium",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -560,7 +560,7 @@ exports[`PoolStakingLearnMoreModal render matches snapshot 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Medium",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -574,7 +574,7 @@ exports[`PoolStakingLearnMoreModal render matches snapshot 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#686e7d",
+                      "color": "#66676a",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -589,7 +589,7 @@ exports[`PoolStakingLearnMoreModal render matches snapshot 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Medium",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -603,7 +603,7 @@ exports[`PoolStakingLearnMoreModal render matches snapshot 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#686e7d",
+                      "color": "#66676a",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -618,7 +618,7 @@ exports[`PoolStakingLearnMoreModal render matches snapshot 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Medium",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -632,7 +632,7 @@ exports[`PoolStakingLearnMoreModal render matches snapshot 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#686e7d",
+                      "color": "#66676a",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -647,7 +647,7 @@ exports[`PoolStakingLearnMoreModal render matches snapshot 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-RegularItalic",
                     "fontSize": 14,
                     "fontStyle": "italic",
@@ -684,7 +684,7 @@ exports[`PoolStakingLearnMoreModal render matches snapshot 1`] = `
               {
                 "alignItems": "center",
                 "alignSelf": "flex-start",
-                "backgroundColor": "#3c4d9d0f",
+                "backgroundColor": "#b4b4b528",
                 "borderColor": "transparent",
                 "borderRadius": 12,
                 "borderWidth": 1,
@@ -702,7 +702,7 @@ exports[`PoolStakingLearnMoreModal render matches snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Medium",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -724,7 +724,7 @@ exports[`PoolStakingLearnMoreModal render matches snapshot 1`] = `
               {
                 "alignItems": "center",
                 "alignSelf": "flex-start",
-                "backgroundColor": "#121314",
+                "backgroundColor": "#131416",
                 "borderRadius": 12,
                 "flex": 1,
                 "flexDirection": "row",
diff --git a/app/components/UI/Stake/components/StakeButton/StakeButton.test.tsx b/app/components/UI/Stake/components/StakeButton/StakeButton.test.tsx
index ead5075c2c45..14de2962b251 100644
--- a/app/components/UI/Stake/components/StakeButton/StakeButton.test.tsx
+++ b/app/components/UI/Stake/components/StakeButton/StakeButton.test.tsx
@@ -9,7 +9,7 @@ import {
   MOCK_USDC_MAINNET_ASSET,
 } from '../../__mocks__/stakeMockData';
 import { useAnalytics } from '../../../../hooks/useAnalytics/useAnalytics';
-import { AnalyticsEventBuilder } from '../../../../../util/analytics/AnalyticsEventBuilder';
+import { createMockUseAnalyticsHook } from '../../../../../util/test/analyticsMock';
 import { mockNetworkState } from '../../../../../util/test/network';
 import useStakingEligibility from '../../hooks/useStakingEligibility';
 import { RootState } from '../../../../../reducers';
@@ -90,19 +90,7 @@ jest.mock('../../../../../selectors/earnController/earn', () => ({
   },
 }));
 
-(useAnalytics as jest.MockedFn<typeof useAnalytics>).mockReturnValue({
-  trackEvent: jest.fn(),
-  createEventBuilder: AnalyticsEventBuilder.createEventBuilder,
-  enable: jest.fn(),
-  addTraitsToUser: jest.fn(),
-  createDataDeletionTask: jest.fn(),
-  checkDataDeleteStatus: jest.fn(),
-  getDeleteRegulationCreationDate: jest.fn(),
-  getDeleteRegulationId: jest.fn(),
-  isDataRecorded: jest.fn(),
-  isEnabled: jest.fn(),
-  getAnalyticsId: jest.fn(),
-});
+jest.mocked(useAnalytics).mockReturnValue(createMockUseAnalyticsHook());
 
 jest.mock('../../../../../core/Engine', () => ({
   context: {
diff --git a/app/components/UI/Stake/components/StakingBalance/StakingBalance.test.tsx b/app/components/UI/Stake/components/StakingBalance/StakingBalance.test.tsx
index dc3f9e1c01a8..006ea2f25cf4 100644
--- a/app/components/UI/Stake/components/StakingBalance/StakingBalance.test.tsx
+++ b/app/components/UI/Stake/components/StakingBalance/StakingBalance.test.tsx
@@ -25,7 +25,7 @@ import { selectPooledStakingEnabledFlag } from '../../../Earn/selectors/featureF
 import { TokenI } from '../../../Tokens/types';
 import useStakingEligibility from '../../hooks/useStakingEligibility';
 import { useAnalytics } from '../../../../hooks/useAnalytics/useAnalytics';
-import { AnalyticsEventBuilder } from '../../../../../util/analytics/AnalyticsEventBuilder';
+import { createMockUseAnalyticsHook } from '../../../../../util/test/analyticsMock';
 
 const mockEarnTokenPair = getMockUseEarnTokens(EARN_EXPERIENCES.POOLED_STAKING);
 jest.mock('../../../Earn/hooks/useEarnings', () => ({
@@ -195,19 +195,7 @@ afterEach(() => {
 describe('StakingBalance', () => {
   beforeEach(() => {
     jest.resetAllMocks();
-    (useAnalytics as jest.MockedFn<typeof useAnalytics>).mockReturnValue({
-      trackEvent: jest.fn(),
-      createEventBuilder: AnalyticsEventBuilder.createEventBuilder,
-      enable: jest.fn(),
-      addTraitsToUser: jest.fn(),
-      createDataDeletionTask: jest.fn(),
-      checkDataDeleteStatus: jest.fn(),
-      getDeleteRegulationCreationDate: jest.fn(),
-      getDeleteRegulationId: jest.fn(),
-      isDataRecorded: jest.fn(),
-      isEnabled: jest.fn(),
-      getAnalyticsId: jest.fn(),
-    });
+    jest.mocked(useAnalytics).mockReturnValue(createMockUseAnalyticsHook());
     mockUseStakingEligibility.mockReturnValue({
       isEligible: true,
       isLoadingEligibility: false,
diff --git a/app/components/UI/Stake/components/StakingBalance/StakingBanners/ClaimBanner/__snapshots__/ClaimBanner.test.tsx.snap b/app/components/UI/Stake/components/StakingBalance/StakingBanners/ClaimBanner/__snapshots__/ClaimBanner.test.tsx.snap
index ef0b9341cd7e..56a21a367817 100644
--- a/app/components/UI/Stake/components/StakingBalance/StakingBanners/ClaimBanner/__snapshots__/ClaimBanner.test.tsx.snap
+++ b/app/components/UI/Stake/components/StakingBalance/StakingBanners/ClaimBanner/__snapshots__/ClaimBanner.test.tsx.snap
@@ -48,7 +48,7 @@ exports[`ClaimBanner render matches snapshot 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -70,7 +70,7 @@ exports[`ClaimBanner render matches snapshot 1`] = `
         {
           "alignSelf": "flex-start",
           "backgroundColor": "transparent",
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
diff --git a/app/components/UI/Stake/components/StakingBalance/StakingCta/__snapshots__/StakingCta.test.tsx.snap b/app/components/UI/Stake/components/StakingBalance/StakingCta/__snapshots__/StakingCta.test.tsx.snap
index dd2eee574c0c..82be62822b10 100644
--- a/app/components/UI/Stake/components/StakingBalance/StakingCta/__snapshots__/StakingCta.test.tsx.snap
+++ b/app/components/UI/Stake/components/StakingBalance/StakingCta/__snapshots__/StakingCta.test.tsx.snap
@@ -17,7 +17,7 @@ exports[`StakingCta render matches snapshot 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -30,7 +30,7 @@ exports[`StakingCta render matches snapshot 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -59,7 +59,7 @@ exports[`StakingCta render matches snapshot 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
diff --git a/app/components/UI/Stake/components/StakingBalance/__snapshots__/StakingBalance.test.tsx.snap b/app/components/UI/Stake/components/StakingBalance/__snapshots__/StakingBalance.test.tsx.snap
index 8fb63b1b0c2b..661e248b588c 100644
--- a/app/components/UI/Stake/components/StakingBalance/__snapshots__/StakingBalance.test.tsx.snap
+++ b/app/components/UI/Stake/components/StakingBalance/__snapshots__/StakingBalance.test.tsx.snap
@@ -183,7 +183,7 @@ exports[`StakingBalance render matches snapshot 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -198,7 +198,7 @@ exports[`StakingBalance render matches snapshot 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -236,7 +236,7 @@ exports[`StakingBalance render matches snapshot 1`] = `
   <View
     style={
       {
-        "backgroundColor": "#f3f5f9",
+        "backgroundColor": "#f3f3f4",
         "borderRadius": 12,
         "marginTop": 16,
         "padding": 16,
@@ -291,7 +291,7 @@ exports[`StakingBalance render matches snapshot 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -352,7 +352,7 @@ exports[`StakingBalance render matches snapshot 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -374,7 +374,7 @@ exports[`StakingBalance render matches snapshot 1`] = `
             {
               "alignSelf": "flex-start",
               "backgroundColor": "transparent",
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -425,7 +425,7 @@ exports[`StakingBalance render matches snapshot 1`] = `
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -443,7 +443,7 @@ exports[`StakingBalance render matches snapshot 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Medium",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -465,7 +465,7 @@ exports[`StakingBalance render matches snapshot 1`] = `
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -483,7 +483,7 @@ exports[`StakingBalance render matches snapshot 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Medium",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -515,9 +515,9 @@ exports[`StakingBalance render matches snapshot 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Bold",
-            "fontSize": 18,
+            "fontSize": 20,
             "letterSpacing": 0,
             "lineHeight": 24,
             "paddingBottom": 8,
@@ -547,7 +547,7 @@ exports[`StakingBalance render matches snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Medium",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -578,7 +578,7 @@ exports[`StakingBalance render matches snapshot 1`] = `
               }
             >
               <SvgMock
-                color="#b7bbc8"
+                color="#babbbe"
                 fill="currentColor"
                 height={16}
                 name="Info"
@@ -629,7 +629,7 @@ exports[`StakingBalance render matches snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Medium",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -651,7 +651,7 @@ exports[`StakingBalance render matches snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -665,7 +665,7 @@ exports[`StakingBalance render matches snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Medium",
                   "fontSize": 14,
                   "letterSpacing": 0,
@@ -698,7 +698,7 @@ exports[`StakingBalance render matches snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Medium",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -720,7 +720,7 @@ exports[`StakingBalance render matches snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -734,7 +734,7 @@ exports[`StakingBalance render matches snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Medium",
                   "fontSize": 14,
                   "letterSpacing": 0,
@@ -758,7 +758,7 @@ exports[`StakingBalance render matches snapshot 1`] = `
               {
                 "alignItems": "center",
                 "alignSelf": "stretch",
-                "backgroundColor": "#3c4d9d0f",
+                "backgroundColor": "#b4b4b528",
                 "borderColor": "transparent",
                 "borderRadius": 12,
                 "borderWidth": 1,
@@ -775,7 +775,7 @@ exports[`StakingBalance render matches snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Medium",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -976,7 +976,7 @@ exports[`StakingBalance should match the snapshot 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -991,7 +991,7 @@ exports[`StakingBalance should match the snapshot 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -1029,7 +1029,7 @@ exports[`StakingBalance should match the snapshot 1`] = `
   <View
     style={
       {
-        "backgroundColor": "#f3f5f9",
+        "backgroundColor": "#f3f3f4",
         "borderRadius": 12,
         "marginTop": 16,
         "padding": 16,
@@ -1084,7 +1084,7 @@ exports[`StakingBalance should match the snapshot 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -1145,7 +1145,7 @@ exports[`StakingBalance should match the snapshot 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -1167,7 +1167,7 @@ exports[`StakingBalance should match the snapshot 1`] = `
             {
               "alignSelf": "flex-start",
               "backgroundColor": "transparent",
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -1218,7 +1218,7 @@ exports[`StakingBalance should match the snapshot 1`] = `
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -1236,7 +1236,7 @@ exports[`StakingBalance should match the snapshot 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Medium",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -1258,7 +1258,7 @@ exports[`StakingBalance should match the snapshot 1`] = `
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -1276,7 +1276,7 @@ exports[`StakingBalance should match the snapshot 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Medium",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -1308,9 +1308,9 @@ exports[`StakingBalance should match the snapshot 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Bold",
-            "fontSize": 18,
+            "fontSize": 20,
             "letterSpacing": 0,
             "lineHeight": 24,
             "paddingBottom": 8,
@@ -1340,7 +1340,7 @@ exports[`StakingBalance should match the snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Medium",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -1371,7 +1371,7 @@ exports[`StakingBalance should match the snapshot 1`] = `
               }
             >
               <SvgMock
-                color="#b7bbc8"
+                color="#babbbe"
                 fill="currentColor"
                 height={16}
                 name="Info"
@@ -1422,7 +1422,7 @@ exports[`StakingBalance should match the snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Medium",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -1444,7 +1444,7 @@ exports[`StakingBalance should match the snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -1458,7 +1458,7 @@ exports[`StakingBalance should match the snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Medium",
                   "fontSize": 14,
                   "letterSpacing": 0,
@@ -1491,7 +1491,7 @@ exports[`StakingBalance should match the snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Medium",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -1513,7 +1513,7 @@ exports[`StakingBalance should match the snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -1527,7 +1527,7 @@ exports[`StakingBalance should match the snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Medium",
                   "fontSize": 14,
                   "letterSpacing": 0,
@@ -1551,7 +1551,7 @@ exports[`StakingBalance should match the snapshot 1`] = `
               {
                 "alignItems": "center",
                 "alignSelf": "stretch",
-                "backgroundColor": "#3c4d9d0f",
+                "backgroundColor": "#b4b4b528",
                 "borderColor": "transparent",
                 "borderRadius": 12,
                 "borderWidth": 1,
@@ -1568,7 +1568,7 @@ exports[`StakingBalance should match the snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Medium",
                   "fontSize": 16,
                   "letterSpacing": 0,
diff --git a/app/components/UI/Stake/components/StakingConfirmation/AccountCard/__snapshots__/AccountCard.test.tsx.snap b/app/components/UI/Stake/components/StakingConfirmation/AccountCard/__snapshots__/AccountCard.test.tsx.snap
index 3bdd37114b45..78a77174dc1d 100644
--- a/app/components/UI/Stake/components/StakingConfirmation/AccountCard/__snapshots__/AccountCard.test.tsx.snap
+++ b/app/components/UI/Stake/components/StakingConfirmation/AccountCard/__snapshots__/AccountCard.test.tsx.snap
@@ -9,7 +9,7 @@ exports[`AccountCard render matches snapshot 1`] = `
         "backgroundColor": "#ffffff",
         "borderBottomLeftRadius": 0,
         "borderBottomRightRadius": 0,
-        "borderColor": "#b7bbc8",
+        "borderColor": "#949596",
         "borderRadius": 8,
         "borderWidth": 0,
         "gap": 16,
@@ -62,7 +62,7 @@ exports[`AccountCard render matches snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Medium",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -222,7 +222,7 @@ exports[`AccountCard render matches snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Medium",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -268,11 +268,11 @@ exports[`AccountCard render matches snapshot 1`] = `
               style={
                 {
                   "alignSelf": "flex-start",
-                  "backgroundColor": "#f3f5f9",
-                  "borderColor": "#b7bbc8",
+                  "backgroundColor": "#f3f3f4",
+                  "borderColor": "#949596",
                   "borderRadius": 999,
                   "borderWidth": 0,
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "padding": 16,
                   "paddingHorizontal": 8,
                   "paddingVertical": 2,
@@ -321,7 +321,7 @@ exports[`AccountCard render matches snapshot 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -346,7 +346,7 @@ exports[`AccountCard render matches snapshot 1`] = `
         "borderBottomLeftRadius": 8,
         "borderBottomRightRadius": 8,
         "borderBottomWidth": 0,
-        "borderColor": "#b7bbc866",
+        "borderColor": "#b4b4b566",
         "borderLeftWidth": 0,
         "borderRadius": 4,
         "borderRightWidth": 0,
@@ -401,7 +401,7 @@ exports[`AccountCard render matches snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Medium",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -479,7 +479,7 @@ exports[`AccountCard render matches snapshot 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
diff --git a/app/components/UI/Stake/components/StakingConfirmation/ConfirmationFooter/FooterButtonGroup/__snapshots__/FooterButtonGroup.test.tsx.snap b/app/components/UI/Stake/components/StakingConfirmation/ConfirmationFooter/FooterButtonGroup/__snapshots__/FooterButtonGroup.test.tsx.snap
index cd635d973c72..d234b103df5f 100644
--- a/app/components/UI/Stake/components/StakingConfirmation/ConfirmationFooter/FooterButtonGroup/__snapshots__/FooterButtonGroup.test.tsx.snap
+++ b/app/components/UI/Stake/components/StakingConfirmation/ConfirmationFooter/FooterButtonGroup/__snapshots__/FooterButtonGroup.test.tsx.snap
@@ -23,7 +23,7 @@ exports[`FooterButtonGroup attempts stake transaction on continue click 1`] = `
       {
         "alignItems": "center",
         "alignSelf": "stretch",
-        "backgroundColor": "#3c4d9d0f",
+        "backgroundColor": "#b4b4b528",
         "borderColor": "transparent",
         "borderRadius": 12,
         "borderWidth": 1,
@@ -67,7 +67,7 @@ exports[`FooterButtonGroup attempts stake transaction on continue click 1`] = `
       {
         "alignItems": "center",
         "alignSelf": "stretch",
-        "backgroundColor": "#121314",
+        "backgroundColor": "#131416",
         "borderRadius": 12,
         "flexBasis": 0,
         "flexDirection": "row",
@@ -112,7 +112,7 @@ exports[`FooterButtonGroup attempts unstake transaction on continue click 1`] =
       {
         "alignItems": "center",
         "alignSelf": "stretch",
-        "backgroundColor": "#3c4d9d0f",
+        "backgroundColor": "#b4b4b528",
         "borderColor": "transparent",
         "borderRadius": 12,
         "borderWidth": 1,
@@ -156,7 +156,7 @@ exports[`FooterButtonGroup attempts unstake transaction on continue click 1`] =
       {
         "alignItems": "center",
         "alignSelf": "stretch",
-        "backgroundColor": "#121314",
+        "backgroundColor": "#131416",
         "borderRadius": 12,
         "flexBasis": 0,
         "flexDirection": "row",
@@ -201,7 +201,7 @@ exports[`FooterButtonGroup navigates to Asset page when cancel is pressed 1`] =
       {
         "alignItems": "center",
         "alignSelf": "stretch",
-        "backgroundColor": "#3c4d9d0f",
+        "backgroundColor": "#b4b4b528",
         "borderColor": "transparent",
         "borderRadius": 12,
         "borderWidth": 1,
@@ -245,7 +245,7 @@ exports[`FooterButtonGroup navigates to Asset page when cancel is pressed 1`] =
       {
         "alignItems": "center",
         "alignSelf": "stretch",
-        "backgroundColor": "#121314",
+        "backgroundColor": "#131416",
         "borderRadius": 12,
         "flexBasis": 0,
         "flexDirection": "row",
@@ -300,7 +300,7 @@ exports[`FooterButtonGroup render matches snapshot 1`] = `
       {
         "alignItems": "center",
         "alignSelf": "stretch",
-        "backgroundColor": "#3c4d9d0f",
+        "backgroundColor": "#b4b4b528",
         "borderColor": "transparent",
         "borderRadius": 12,
         "borderWidth": 1,
@@ -344,7 +344,7 @@ exports[`FooterButtonGroup render matches snapshot 1`] = `
       {
         "alignItems": "center",
         "alignSelf": "stretch",
-        "backgroundColor": "#121314",
+        "backgroundColor": "#131416",
         "borderRadius": 12,
         "flexBasis": 0,
         "flexDirection": "row",
diff --git a/app/components/UI/Stake/components/StakingConfirmation/ConfirmationFooter/__snapshots__/ConfirmationFooter.test.tsx.snap b/app/components/UI/Stake/components/StakingConfirmation/ConfirmationFooter/__snapshots__/ConfirmationFooter.test.tsx.snap
index 233448754843..61e1a798c513 100644
--- a/app/components/UI/Stake/components/StakingConfirmation/ConfirmationFooter/__snapshots__/ConfirmationFooter.test.tsx.snap
+++ b/app/components/UI/Stake/components/StakingConfirmation/ConfirmationFooter/__snapshots__/ConfirmationFooter.test.tsx.snap
@@ -87,7 +87,7 @@ exports[`ConfirmationFooter render matches snapshot 1`] = `
         {
           "alignItems": "center",
           "alignSelf": "stretch",
-          "backgroundColor": "#3c4d9d0f",
+          "backgroundColor": "#b4b4b528",
           "borderColor": "transparent",
           "borderRadius": 12,
           "borderWidth": 1,
@@ -131,7 +131,7 @@ exports[`ConfirmationFooter render matches snapshot 1`] = `
         {
           "alignItems": "center",
           "alignSelf": "stretch",
-          "backgroundColor": "#121314",
+          "backgroundColor": "#131416",
           "borderRadius": 12,
           "flexBasis": 0,
           "flexDirection": "row",
diff --git a/app/components/UI/Stake/components/StakingConfirmation/ContractTag/__snapshots__/ContractTag.test.tsx.snap b/app/components/UI/Stake/components/StakingConfirmation/ContractTag/__snapshots__/ContractTag.test.tsx.snap
index 4bafae1aa3c3..4a67e1756982 100644
--- a/app/components/UI/Stake/components/StakingConfirmation/ContractTag/__snapshots__/ContractTag.test.tsx.snap
+++ b/app/components/UI/Stake/components/StakingConfirmation/ContractTag/__snapshots__/ContractTag.test.tsx.snap
@@ -8,11 +8,11 @@ exports[`ContractTag render matches snapshot 1`] = `
   style={
     {
       "alignSelf": "flex-start",
-      "backgroundColor": "#f3f5f9",
-      "borderColor": "#b7bbc8",
+      "backgroundColor": "#f3f3f4",
+      "borderColor": "#949596",
       "borderRadius": 999,
       "borderWidth": 0,
-      "color": "#686e7d",
+      "color": "#66676a",
       "padding": 16,
       "paddingHorizontal": 8,
       "paddingVertical": 2,
@@ -61,7 +61,7 @@ exports[`ContractTag render matches snapshot 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
diff --git a/app/components/UI/Stake/components/StakingConfirmation/RewardsCard/__snapshots__/RewardsCard.test.tsx.snap b/app/components/UI/Stake/components/StakingConfirmation/RewardsCard/__snapshots__/RewardsCard.test.tsx.snap
index d5c36f652419..5cdc372a8eb3 100644
--- a/app/components/UI/Stake/components/StakingConfirmation/RewardsCard/__snapshots__/RewardsCard.test.tsx.snap
+++ b/app/components/UI/Stake/components/StakingConfirmation/RewardsCard/__snapshots__/RewardsCard.test.tsx.snap
@@ -6,7 +6,7 @@ exports[`RewardsCard render matches snapshot 1`] = `
   style={
     {
       "backgroundColor": "#ffffff",
-      "borderColor": "#b7bbc8",
+      "borderColor": "#949596",
       "borderRadius": 8,
       "borderWidth": 0,
       "gap": 16,
@@ -58,7 +58,7 @@ exports[`RewardsCard render matches snapshot 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Medium",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -90,7 +90,7 @@ exports[`RewardsCard render matches snapshot 1`] = `
             }
           >
             <SvgMock
-              color="#686e7d"
+              color="#66676a"
               fill="currentColor"
               height={16}
               name="Question"
@@ -194,7 +194,7 @@ exports[`RewardsCard render matches snapshot 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Medium",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -245,7 +245,7 @@ exports[`RewardsCard render matches snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -259,7 +259,7 @@ exports[`RewardsCard render matches snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -318,7 +318,7 @@ exports[`RewardsCard render matches snapshot 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Medium",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -350,7 +350,7 @@ exports[`RewardsCard render matches snapshot 1`] = `
             }
           >
             <SvgMock
-              color="#686e7d"
+              color="#66676a"
               fill="currentColor"
               height={16}
               name="Question"
@@ -395,7 +395,7 @@ exports[`RewardsCard render matches snapshot 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -419,7 +419,7 @@ exports[`RewardsCard reward frequency tooltip displayed when pressed 1`] = `
   style={
     {
       "backgroundColor": "#ffffff",
-      "borderColor": "#b7bbc8",
+      "borderColor": "#949596",
       "borderRadius": 8,
       "borderWidth": 0,
       "gap": 16,
@@ -471,7 +471,7 @@ exports[`RewardsCard reward frequency tooltip displayed when pressed 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Medium",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -503,7 +503,7 @@ exports[`RewardsCard reward frequency tooltip displayed when pressed 1`] = `
             }
           >
             <SvgMock
-              color="#686e7d"
+              color="#66676a"
               fill="currentColor"
               height={16}
               name="Question"
@@ -607,7 +607,7 @@ exports[`RewardsCard reward frequency tooltip displayed when pressed 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Medium",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -658,7 +658,7 @@ exports[`RewardsCard reward frequency tooltip displayed when pressed 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -672,7 +672,7 @@ exports[`RewardsCard reward frequency tooltip displayed when pressed 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -731,7 +731,7 @@ exports[`RewardsCard reward frequency tooltip displayed when pressed 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Medium",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -763,7 +763,7 @@ exports[`RewardsCard reward frequency tooltip displayed when pressed 1`] = `
             }
           >
             <SvgMock
-              color="#686e7d"
+              color="#66676a"
               fill="currentColor"
               height={16}
               name="Question"
@@ -808,7 +808,7 @@ exports[`RewardsCard reward frequency tooltip displayed when pressed 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -832,7 +832,7 @@ exports[`RewardsCard reward rate tooltip displayed when pressed 1`] = `
   style={
     {
       "backgroundColor": "#ffffff",
-      "borderColor": "#b7bbc8",
+      "borderColor": "#949596",
       "borderRadius": 8,
       "borderWidth": 0,
       "gap": 16,
@@ -884,7 +884,7 @@ exports[`RewardsCard reward rate tooltip displayed when pressed 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Medium",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -916,7 +916,7 @@ exports[`RewardsCard reward rate tooltip displayed when pressed 1`] = `
             }
           >
             <SvgMock
-              color="#686e7d"
+              color="#66676a"
               fill="currentColor"
               height={16}
               name="Question"
@@ -1020,7 +1020,7 @@ exports[`RewardsCard reward rate tooltip displayed when pressed 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Medium",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -1071,7 +1071,7 @@ exports[`RewardsCard reward rate tooltip displayed when pressed 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -1085,7 +1085,7 @@ exports[`RewardsCard reward rate tooltip displayed when pressed 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -1144,7 +1144,7 @@ exports[`RewardsCard reward rate tooltip displayed when pressed 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Medium",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -1176,7 +1176,7 @@ exports[`RewardsCard reward rate tooltip displayed when pressed 1`] = `
             }
           >
             <SvgMock
-              color="#686e7d"
+              color="#66676a"
               fill="currentColor"
               height={16}
               name="Question"
@@ -1221,7 +1221,7 @@ exports[`RewardsCard reward rate tooltip displayed when pressed 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
diff --git a/app/components/UI/Stake/components/StakingConfirmation/TokenValueStack/__snapshots__/TokenValueStack.test.tsx.snap b/app/components/UI/Stake/components/StakingConfirmation/TokenValueStack/__snapshots__/TokenValueStack.test.tsx.snap
index 94c3da59b3b6..369401aad763 100644
--- a/app/components/UI/Stake/components/StakingConfirmation/TokenValueStack/__snapshots__/TokenValueStack.test.tsx.snap
+++ b/app/components/UI/Stake/components/StakingConfirmation/TokenValueStack/__snapshots__/TokenValueStack.test.tsx.snap
@@ -173,7 +173,7 @@ exports[`TokenValueStack render matches snapshot 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Bold",
           "fontSize": 24,
           "letterSpacing": 0,
@@ -189,7 +189,7 @@ exports[`TokenValueStack render matches snapshot 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#686e7d",
+          "color": "#66676a",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
diff --git a/app/components/UI/Stake/components/StakingConfirmation/UnstakeTimeCard/__snapshots__/UnstakeTimeCard.test.tsx.snap b/app/components/UI/Stake/components/StakingConfirmation/UnstakeTimeCard/__snapshots__/UnstakeTimeCard.test.tsx.snap
index 23e48cbcc41f..8f1e70f30333 100644
--- a/app/components/UI/Stake/components/StakingConfirmation/UnstakeTimeCard/__snapshots__/UnstakeTimeCard.test.tsx.snap
+++ b/app/components/UI/Stake/components/StakingConfirmation/UnstakeTimeCard/__snapshots__/UnstakeTimeCard.test.tsx.snap
@@ -6,7 +6,7 @@ exports[`UnstakingTimeCard render matches snapshot 1`] = `
   style={
     {
       "backgroundColor": "#ffffff",
-      "borderColor": "#b7bbc8",
+      "borderColor": "#949596",
       "borderRadius": 8,
       "borderWidth": 0,
       "gap": 16,
@@ -58,7 +58,7 @@ exports[`UnstakingTimeCard render matches snapshot 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Medium",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -90,7 +90,7 @@ exports[`UnstakingTimeCard render matches snapshot 1`] = `
             }
           >
             <SvgMock
-              color="#686e7d"
+              color="#66676a"
               fill="currentColor"
               height={16}
               name="Question"
@@ -135,7 +135,7 @@ exports[`UnstakingTimeCard render matches snapshot 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
diff --git a/app/components/UI/Stake/components/StakingConfirmation/YouReceiveCard/__snapshots__/YouReceiveCard.test.tsx.snap b/app/components/UI/Stake/components/StakingConfirmation/YouReceiveCard/__snapshots__/YouReceiveCard.test.tsx.snap
index 2be654a7245c..1fe2c6c89f05 100644
--- a/app/components/UI/Stake/components/StakingConfirmation/YouReceiveCard/__snapshots__/YouReceiveCard.test.tsx.snap
+++ b/app/components/UI/Stake/components/StakingConfirmation/YouReceiveCard/__snapshots__/YouReceiveCard.test.tsx.snap
@@ -6,7 +6,7 @@ exports[`YouReceiveCard render matches snapshot 1`] = `
   style={
     {
       "backgroundColor": "#ffffff",
-      "borderColor": "#b7bbc8",
+      "borderColor": "#949596",
       "borderRadius": 8,
       "borderWidth": 0,
       "gap": 16,
@@ -26,7 +26,7 @@ exports[`YouReceiveCard render matches snapshot 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Medium",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -50,7 +50,7 @@ exports[`YouReceiveCard render matches snapshot 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Medium",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -126,11 +126,11 @@ exports[`YouReceiveCard render matches snapshot 1`] = `
           style={
             {
               "alignSelf": "flex-start",
-              "backgroundColor": "#f3f5f9",
-              "borderColor": "#b7bbc8",
+              "backgroundColor": "#f3f3f4",
+              "borderColor": "#949596",
               "borderRadius": 999,
               "borderWidth": 0,
-              "color": "#686e7d",
+              "color": "#66676a",
               "padding": 16,
               "paddingHorizontal": 8,
               "paddingVertical": 2,
@@ -185,7 +185,7 @@ exports[`YouReceiveCard render matches snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -202,7 +202,7 @@ exports[`YouReceiveCard render matches snapshot 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 14,
             "letterSpacing": 0,
diff --git a/app/components/UI/Stake/components/StakingEarnings/__snapshots__/StakingEarnings.test.tsx.snap b/app/components/UI/Stake/components/StakingEarnings/__snapshots__/StakingEarnings.test.tsx.snap
index 2081e0b1d2b8..e6e495cb298d 100644
--- a/app/components/UI/Stake/components/StakingEarnings/__snapshots__/StakingEarnings.test.tsx.snap
+++ b/app/components/UI/Stake/components/StakingEarnings/__snapshots__/StakingEarnings.test.tsx.snap
@@ -12,9 +12,9 @@ exports[`Staking Earnings displays pooled-staking maintenance banner when featur
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Bold",
-        "fontSize": 18,
+        "fontSize": 20,
         "letterSpacing": 0,
         "lineHeight": 24,
         "paddingBottom": 8,
@@ -71,11 +71,11 @@ exports[`Staking Earnings displays pooled-staking maintenance banner when featur
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
-              "fontSize": 16,
+              "fontSize": 14,
               "letterSpacing": 0,
-              "lineHeight": 24,
+              "lineHeight": 22,
             }
           }
         >
@@ -103,7 +103,7 @@ exports[`Staking Earnings displays pooled-staking maintenance banner when featur
           accessibilityRole="text"
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "fontFamily": "Geist-Medium",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -134,7 +134,7 @@ exports[`Staking Earnings displays pooled-staking maintenance banner when featur
           }
         >
           <SvgMock
-            color="#b7bbc8"
+            color="#babbbe"
             fill="currentColor"
             height={16}
             name="Info"
@@ -185,7 +185,7 @@ exports[`Staking Earnings displays pooled-staking maintenance banner when featur
           accessibilityRole="text"
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "fontFamily": "Geist-Medium",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -207,7 +207,7 @@ exports[`Staking Earnings displays pooled-staking maintenance banner when featur
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -221,7 +221,7 @@ exports[`Staking Earnings displays pooled-staking maintenance banner when featur
           accessibilityRole="text"
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "fontFamily": "Geist-Medium",
               "fontSize": 14,
               "letterSpacing": 0,
@@ -254,7 +254,7 @@ exports[`Staking Earnings displays pooled-staking maintenance banner when featur
           accessibilityRole="text"
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "fontFamily": "Geist-Medium",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -276,7 +276,7 @@ exports[`Staking Earnings displays pooled-staking maintenance banner when featur
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -290,7 +290,7 @@ exports[`Staking Earnings displays pooled-staking maintenance banner when featur
           accessibilityRole="text"
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "fontFamily": "Geist-Medium",
               "fontSize": 14,
               "letterSpacing": 0,
@@ -314,7 +314,7 @@ exports[`Staking Earnings displays pooled-staking maintenance banner when featur
           {
             "alignItems": "center",
             "alignSelf": "stretch",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -331,7 +331,7 @@ exports[`Staking Earnings displays pooled-staking maintenance banner when featur
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Medium",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -359,9 +359,9 @@ exports[`Staking Earnings should render correctly 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Bold",
-        "fontSize": 18,
+        "fontSize": 20,
         "letterSpacing": 0,
         "lineHeight": 24,
         "paddingBottom": 8,
@@ -391,7 +391,7 @@ exports[`Staking Earnings should render correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "fontFamily": "Geist-Medium",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -422,7 +422,7 @@ exports[`Staking Earnings should render correctly 1`] = `
           }
         >
           <SvgMock
-            color="#b7bbc8"
+            color="#babbbe"
             fill="currentColor"
             height={16}
             name="Info"
@@ -473,7 +473,7 @@ exports[`Staking Earnings should render correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "fontFamily": "Geist-Medium",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -495,7 +495,7 @@ exports[`Staking Earnings should render correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -509,7 +509,7 @@ exports[`Staking Earnings should render correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "fontFamily": "Geist-Medium",
               "fontSize": 14,
               "letterSpacing": 0,
@@ -542,7 +542,7 @@ exports[`Staking Earnings should render correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "fontFamily": "Geist-Medium",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -564,7 +564,7 @@ exports[`Staking Earnings should render correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -578,7 +578,7 @@ exports[`Staking Earnings should render correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "fontFamily": "Geist-Medium",
               "fontSize": 14,
               "letterSpacing": 0,
@@ -602,7 +602,7 @@ exports[`Staking Earnings should render correctly 1`] = `
           {
             "alignItems": "center",
             "alignSelf": "stretch",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -619,7 +619,7 @@ exports[`Staking Earnings should render correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Medium",
               "fontSize": 16,
               "letterSpacing": 0,
diff --git a/app/components/UI/Stake/components/UpsellBanner/__snapshots__/UpsellBanner.test.tsx.snap b/app/components/UI/Stake/components/UpsellBanner/__snapshots__/UpsellBanner.test.tsx.snap
index 7b42fa3b1b4a..4b86f4c2f001 100644
--- a/app/components/UI/Stake/components/UpsellBanner/__snapshots__/UpsellBanner.test.tsx.snap
+++ b/app/components/UI/Stake/components/UpsellBanner/__snapshots__/UpsellBanner.test.tsx.snap
@@ -4,7 +4,7 @@ exports[`UpsellBanner UpsellBannerBody variant render matches screenshot 1`] = `
 <View
   style={
     {
-      "backgroundColor": "#f3f5f9",
+      "backgroundColor": "#f3f3f4",
       "borderRadius": 8,
       "flexDirection": "row",
       "gap": 8,
@@ -25,9 +25,9 @@ exports[`UpsellBanner UpsellBannerBody variant render matches screenshot 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Bold",
-          "fontSize": 18,
+          "fontSize": 20,
           "letterSpacing": 0,
           "lineHeight": 24,
         }
@@ -62,7 +62,7 @@ exports[`UpsellBanner UpsellBannerBody variant render matches screenshot 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -76,7 +76,7 @@ exports[`UpsellBanner UpsellBannerBody variant render matches screenshot 1`] = `
         onPress={[MockFunction]}
       >
         <SvgMock
-          color="#686e7d"
+          color="#66676a"
           fill="currentColor"
           height={16}
           name="Info"
@@ -109,7 +109,7 @@ exports[`UpsellBanner UpsellBannerBody variant render matches screenshot 1`] = `
         {
           "alignItems": "center",
           "alignSelf": "flex-start",
-          "backgroundColor": "#3c4d9d0f",
+          "backgroundColor": "#b4b4b528",
           "borderColor": "transparent",
           "borderRadius": 12,
           "borderWidth": 1,
@@ -125,7 +125,7 @@ exports[`UpsellBanner UpsellBannerBody variant render matches screenshot 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -145,7 +145,7 @@ exports[`UpsellBanner UpsellBannerHeader variant render matches screenshot 1`] =
   style={
     {
       "alignItems": "center",
-      "backgroundColor": "#f3f5f9",
+      "backgroundColor": "#f3f3f4",
       "borderRadius": 8,
       "gap": 8,
       "paddingHorizontal": 16,
@@ -157,9 +157,9 @@ exports[`UpsellBanner UpsellBannerHeader variant render matches screenshot 1`] =
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Bold",
-        "fontSize": 18,
+        "fontSize": 20,
         "letterSpacing": 0,
         "lineHeight": 24,
       }
@@ -185,7 +185,7 @@ exports[`UpsellBanner UpsellBannerHeader variant render matches screenshot 1`] =
     accessibilityRole="text"
     style={
       {
-        "color": "#686e7d",
+        "color": "#66676a",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
@@ -206,7 +206,7 @@ exports[`UpsellBanner UpsellBannerHeader variant render matches screenshot 1`] =
       {
         "alignItems": "center",
         "alignSelf": "flex-start",
-        "backgroundColor": "#3c4d9d0f",
+        "backgroundColor": "#b4b4b528",
         "borderColor": "transparent",
         "borderRadius": 12,
         "borderWidth": 1,
@@ -222,7 +222,7 @@ exports[`UpsellBanner UpsellBannerHeader variant render matches screenshot 1`] =
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Medium",
           "fontSize": 16,
           "letterSpacing": 0,
diff --git a/app/components/UI/Stake/sdk/__snapshots__/stakeSdkProvider.test.tsx.snap b/app/components/UI/Stake/sdk/__snapshots__/stakeSdkProvider.test.tsx.snap
index 658393359ba4..6c15074a88ae 100644
--- a/app/components/UI/Stake/sdk/__snapshots__/stakeSdkProvider.test.tsx.snap
+++ b/app/components/UI/Stake/sdk/__snapshots__/stakeSdkProvider.test.tsx.snap
@@ -6,7 +6,7 @@ exports[`Stake Modals With Stake Sdk Provider renders stake screen with stake sd
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
diff --git a/app/components/UI/StyledButton/__snapshots__/index.test.tsx.snap b/app/components/UI/StyledButton/__snapshots__/index.test.tsx.snap
index 953ac51c42a8..22c64c689781 100644
--- a/app/components/UI/StyledButton/__snapshots__/index.test.tsx.snap
+++ b/app/components/UI/StyledButton/__snapshots__/index.test.tsx.snap
@@ -15,7 +15,7 @@ exports[`StyledButton should render correctly on Android the button with type ca
         },
         {
           "backgroundColor": "#ffffff",
-          "borderColor": "#686e7d",
+          "borderColor": "#66676a",
           "borderWidth": 1,
         },
         null,
@@ -220,7 +220,7 @@ exports[`StyledButton should render correctly on Android the button with type se
         },
         {
           "backgroundColor": "#ffffff",
-          "borderColor": "#b7bbc8",
+          "borderColor": "#949596",
           "borderWidth": 1,
         },
         null,
@@ -269,7 +269,7 @@ exports[`StyledButton should render correctly on iOS the button with type cancel
       },
       {
         "backgroundColor": "#ffffff",
-        "borderColor": "#686e7d",
+        "borderColor": "#66676a",
         "borderWidth": 1,
       },
       undefined,
@@ -284,7 +284,7 @@ exports[`StyledButton should render correctly on iOS the button with type cancel
         "textAlign": "center",
       },
       {
-        "color": "#686e7d",
+        "color": "#66676a",
       },
       undefined,
     ]
@@ -556,7 +556,7 @@ exports[`StyledButton should render correctly on iOS the button with type second
       },
       {
         "backgroundColor": "#ffffff",
-        "borderColor": "#b7bbc8",
+        "borderColor": "#949596",
         "borderWidth": 1,
       },
       undefined,
@@ -571,7 +571,7 @@ exports[`StyledButton should render correctly on iOS the button with type second
         "textAlign": "center",
       },
       {
-        "color": "#121314",
+        "color": "#131416",
       },
       undefined,
     ]
diff --git a/app/components/UI/SwitchCustomNetwork/__snapshots__/index.test.tsx.snap b/app/components/UI/SwitchCustomNetwork/__snapshots__/index.test.tsx.snap
index d24e3bcc83d3..51a0d326c397 100644
--- a/app/components/UI/SwitchCustomNetwork/__snapshots__/index.test.tsx.snap
+++ b/app/components/UI/SwitchCustomNetwork/__snapshots__/index.test.tsx.snap
@@ -4,7 +4,7 @@ exports[`SwitchCustomNetwork should render correctly 1`] = `
 <RCTSafeAreaView
   style={
     {
-      "backgroundColor": "#f3f5f9",
+      "backgroundColor": "#f3f3f4",
     }
   }
 >
@@ -12,7 +12,7 @@ exports[`SwitchCustomNetwork should render correctly 1`] = `
     style={
       [
         {
-          "backgroundColor": "#f3f5f9",
+          "backgroundColor": "#f3f3f4",
           "borderTopLeftRadius": 20,
           "borderTopRightRadius": 20,
           "height": 325,
@@ -93,7 +93,7 @@ exports[`SwitchCustomNetwork should render correctly 1`] = `
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 24,
                       "textAlign": "center",
@@ -134,9 +134,9 @@ exports[`SwitchCustomNetwork should render correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Bold",
-              "fontSize": 18,
+              "fontSize": 20,
               "letterSpacing": 0,
               "lineHeight": 24,
               "textAlign": "center",
@@ -149,7 +149,7 @@ exports[`SwitchCustomNetwork should render correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -201,7 +201,7 @@ exports[`SwitchCustomNetwork should render correctly 1`] = `
               }
             >
               <SvgMock
-                color="#686e7d"
+                color="#66676a"
                 fill="currentColor"
                 height={20}
                 name="Data"
@@ -226,7 +226,7 @@ exports[`SwitchCustomNetwork should render correctly 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -258,7 +258,7 @@ exports[`SwitchCustomNetwork should render correctly 1`] = `
                     numberOfLines={1}
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -270,7 +270,7 @@ exports[`SwitchCustomNetwork should render correctly 1`] = `
                       accessibilityRole="text"
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 14,
                           "letterSpacing": 0,
@@ -284,7 +284,7 @@ exports[`SwitchCustomNetwork should render correctly 1`] = `
                       accessibilityRole="text"
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Medium",
                           "fontSize": 14,
                           "letterSpacing": 0,
@@ -298,7 +298,7 @@ exports[`SwitchCustomNetwork should render correctly 1`] = `
                   style={
                     {
                       "alignItems": "center",
-                      "backgroundColor": "#f3f5f9",
+                      "backgroundColor": "#f3f3f4",
                       "borderRadius": 8,
                       "borderWidth": 1,
                       "height": 16,
@@ -312,7 +312,7 @@ exports[`SwitchCustomNetwork should render correctly 1`] = `
                     accessibilityRole="text"
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 10,
                         "letterSpacing": 0,
@@ -362,7 +362,7 @@ exports[`SwitchCustomNetwork should render correctly 1`] = `
                 },
                 {
                   "backgroundColor": "#ffffff",
-                  "borderColor": "#686e7d",
+                  "borderColor": "#66676a",
                   "borderWidth": 1,
                 },
                 [
@@ -396,7 +396,7 @@ exports[`SwitchCustomNetwork should render correctly 1`] = `
                     "textAlign": "center",
                   },
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                   },
                   undefined,
                 ],
diff --git a/app/components/UI/Tabs/TabThumbnail/__snapshots__/TabThumbnail.test.tsx.snap b/app/components/UI/Tabs/TabThumbnail/__snapshots__/TabThumbnail.test.tsx.snap
index e4510393b2d4..ed21525a2e9e 100644
--- a/app/components/UI/Tabs/TabThumbnail/__snapshots__/TabThumbnail.test.tsx.snap
+++ b/app/components/UI/Tabs/TabThumbnail/__snapshots__/TabThumbnail.test.tsx.snap
@@ -25,7 +25,7 @@ exports[`TabThumbnail should render correctly 1`] = `
     style={
       [
         {
-          "borderColor": "#b7bbc8",
+          "borderColor": "#949596",
           "borderRadius": 12,
           "borderWidth": 1,
           "elevation": 4,
@@ -77,7 +77,7 @@ exports[`TabThumbnail should render correctly 1`] = `
           }
         >
           <SvgMock
-            color="#121314"
+            color="#131416"
             fill="currentColor"
             height={20}
             name="Global"
@@ -95,7 +95,7 @@ exports[`TabThumbnail should render correctly 1`] = `
           numberOfLines={1}
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "flex": 1,
               "fontFamily": "Geist-Bold",
               "fontSize": 12,
@@ -124,7 +124,7 @@ exports[`TabThumbnail should render correctly 1`] = `
         testID="tab-close-button-123"
       >
         <SvgMock
-          color="#121314"
+          color="#131416"
           fill="currentColor"
           height={20}
           name="Close"
diff --git a/app/components/UI/Tabs/__snapshots__/index.test.tsx.snap b/app/components/UI/Tabs/__snapshots__/index.test.tsx.snap
index 04834a5685b4..3012736b19ed 100644
--- a/app/components/UI/Tabs/__snapshots__/index.test.tsx.snap
+++ b/app/components/UI/Tabs/__snapshots__/index.test.tsx.snap
@@ -37,10 +37,10 @@ exports[`Tabs rendering renders tabs component with multiple tabs 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "flex": 1,
           "fontFamily": "Geist-Bold",
-          "fontSize": 18,
+          "fontSize": 20,
           "letterSpacing": 0,
           "lineHeight": 24,
           "textAlign": "center",
@@ -69,7 +69,7 @@ exports[`Tabs rendering renders tabs component with multiple tabs 1`] = `
     }
     style={
       {
-        "backgroundColor": "#f3f5f9",
+        "backgroundColor": "#f3f3f4",
         "flex": 1,
       }
     }
@@ -100,7 +100,7 @@ exports[`Tabs rendering renders tabs component with multiple tabs 1`] = `
           style={
             [
               {
-                "borderColor": "#b7bbc8",
+                "borderColor": "#949596",
                 "borderRadius": 12,
                 "borderWidth": 1,
                 "elevation": 4,
@@ -152,7 +152,7 @@ exports[`Tabs rendering renders tabs component with multiple tabs 1`] = `
                 }
               >
                 <SvgMock
-                  color="#121314"
+                  color="#131416"
                   fill="currentColor"
                   height={20}
                   name="Global"
@@ -170,7 +170,7 @@ exports[`Tabs rendering renders tabs component with multiple tabs 1`] = `
                 numberOfLines={1}
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "flex": 1,
                     "fontFamily": "Geist-Bold",
                     "fontSize": 12,
@@ -199,7 +199,7 @@ exports[`Tabs rendering renders tabs component with multiple tabs 1`] = `
               testID="tab-close-button-1"
             >
               <SvgMock
-                color="#121314"
+                color="#131416"
                 fill="currentColor"
                 height={20}
                 name="Close"
@@ -265,7 +265,7 @@ exports[`Tabs rendering renders tabs component with multiple tabs 1`] = `
           style={
             [
               {
-                "borderColor": "#b7bbc8",
+                "borderColor": "#949596",
                 "borderRadius": 12,
                 "borderWidth": 1,
                 "elevation": 4,
@@ -314,7 +314,7 @@ exports[`Tabs rendering renders tabs component with multiple tabs 1`] = `
                 }
               >
                 <SvgMock
-                  color="#121314"
+                  color="#131416"
                   fill="currentColor"
                   height={20}
                   name="Global"
@@ -332,7 +332,7 @@ exports[`Tabs rendering renders tabs component with multiple tabs 1`] = `
                 numberOfLines={1}
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "flex": 1,
                     "fontFamily": "Geist-Bold",
                     "fontSize": 12,
@@ -361,7 +361,7 @@ exports[`Tabs rendering renders tabs component with multiple tabs 1`] = `
               testID="tab-close-button-2"
             >
               <SvgMock
-                color="#121314"
+                color="#131416"
                 fill="currentColor"
                 height={20}
                 name="Close"
@@ -445,10 +445,10 @@ exports[`Tabs rendering renders with single tab 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "flex": 1,
           "fontFamily": "Geist-Bold",
-          "fontSize": 18,
+          "fontSize": 20,
           "letterSpacing": 0,
           "lineHeight": 24,
           "textAlign": "center",
@@ -477,7 +477,7 @@ exports[`Tabs rendering renders with single tab 1`] = `
     }
     style={
       {
-        "backgroundColor": "#f3f5f9",
+        "backgroundColor": "#f3f3f4",
         "flex": 1,
       }
     }
@@ -508,7 +508,7 @@ exports[`Tabs rendering renders with single tab 1`] = `
           style={
             [
               {
-                "borderColor": "#b7bbc8",
+                "borderColor": "#949596",
                 "borderRadius": 12,
                 "borderWidth": 1,
                 "elevation": 4,
@@ -560,7 +560,7 @@ exports[`Tabs rendering renders with single tab 1`] = `
                 }
               >
                 <SvgMock
-                  color="#121314"
+                  color="#131416"
                   fill="currentColor"
                   height={20}
                   name="Global"
@@ -578,7 +578,7 @@ exports[`Tabs rendering renders with single tab 1`] = `
                 numberOfLines={1}
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "flex": 1,
                     "fontFamily": "Geist-Bold",
                     "fontSize": 12,
@@ -607,7 +607,7 @@ exports[`Tabs rendering renders with single tab 1`] = `
               testID="tab-close-button-1"
             >
               <SvgMock
-                color="#121314"
+                color="#131416"
                 fill="currentColor"
                 height={20}
                 name="Close"
diff --git a/app/components/UI/Tabs/index.js b/app/components/UI/Tabs/index.js
index 89b77816bfd6..0c0605dee544 100644
--- a/app/components/UI/Tabs/index.js
+++ b/app/components/UI/Tabs/index.js
@@ -258,7 +258,7 @@ class Tabs extends PureComponent {
       <View style={styles.topBar}>
         <ButtonIcon
           iconName={IconName.ArrowLeft}
-          size={ButtonIconSizes.Lg}
+          size={ButtonIconSizes.Md}
           onPress={closeTabsView}
           testID={BrowserViewSelectorsIDs.TABS_BACK_BUTTON}
           accessibilityLabel={strings('browser.go_back')}
diff --git a/app/components/UI/TokenDetails/Views/TokenDetails.test.tsx b/app/components/UI/TokenDetails/Views/TokenDetails.test.tsx
index d53f60f0332a..a8f001dbd4de 100644
--- a/app/components/UI/TokenDetails/Views/TokenDetails.test.tsx
+++ b/app/components/UI/TokenDetails/Views/TokenDetails.test.tsx
@@ -73,22 +73,17 @@ jest.mock('../hooks/useTokenBalance', () => ({
   useTokenBalance: () => mockUseTokenBalance(),
 }));
 
+const mockUseTokenBuyability = jest.fn();
 jest.mock('../../Ramp/hooks/useTokenBuyability', () => ({
-  useTokenBuyability: () => ({ isBuyable: true, isLoading: false }),
+  __esModule: true,
+  default: (...args: unknown[]) => mockUseTokenBuyability(...args),
 }));
 
-const mockHandleBuyPress = jest.fn();
-const mockHandleSellPress = jest.fn();
+const mockGoToSwaps = jest.fn();
+const mockOnBuy = jest.fn();
+const mockUseTokenActions = jest.fn();
 jest.mock('../hooks/useTokenActions', () => ({
-  useTokenActions: () => ({
-    onBuy: jest.fn(),
-    onSend: jest.fn(),
-    onReceive: jest.fn(),
-    goToSwaps: jest.fn(),
-    handleBuyPress: mockHandleBuyPress,
-    handleSellPress: mockHandleSellPress,
-    networkModal: null,
-  }),
+  useTokenActions: () => mockUseTokenActions(),
 }));
 
 const defaultUseTokenTransactionsReturn = {
@@ -211,6 +206,20 @@ describe('TokenDetails', () => {
     });
     mockIsTokenTradingOpen.mockReturnValue(true);
     mockUseTokenTransactions.mockReturnValue(defaultUseTokenTransactionsReturn);
+    mockUseTokenBuyability.mockReturnValue({
+      isBuyable: true,
+      isLoading: false,
+    });
+    mockUseTokenActions.mockReturnValue({
+      onBuy: mockOnBuy,
+      onSend: jest.fn(),
+      onReceive: jest.fn(),
+      goToSwaps: mockGoToSwaps,
+      handleBuyPress: jest.fn(),
+      handleSellPress: jest.fn(),
+      hasEligibleSwapTokens: true,
+      networkModal: null,
+    });
 
     mockUseTokenBalance.mockReturnValue({
       balance: '1.5',
@@ -241,11 +250,12 @@ describe('TokenDetails', () => {
     expect(UNSAFE_getByType(ActivityIndicator)).toBeTruthy();
   });
 
-  describe('Buy/Sell sticky buttons', () => {
+  describe('Swap/Buy sticky buttons', () => {
     it('shows sticky buttons when useNewLayout is true (treatment variant)', () => {
       const { getByTestId, getByText } = render(<TokenDetails />);
 
       expect(getByTestId('bottomsheetfooter')).toBeOnTheScreen();
+      expect(getByText('Swap')).toBeOnTheScreen();
       expect(getByText('Buy')).toBeOnTheScreen();
     });
 
@@ -269,43 +279,41 @@ describe('TokenDetails', () => {
       expect(queryByTestId('bottomsheetfooter')).toBeNull();
     });
 
-    it('shows both Buy and Sell buttons when token has balance > 0', () => {
-      mockUseTokenBalance.mockReturnValue({
-        balance: '10.5',
-        fiatBalance: '$1050.00',
-        tokenFormattedBalance: '10.5 DAI',
-      });
-
+    it('shows both Swap and Buy when user has eligible tokens and token is buyable', () => {
       const { getByText } = render(<TokenDetails />);
 
+      expect(getByText('Swap')).toBeOnTheScreen();
       expect(getByText('Buy')).toBeOnTheScreen();
-      expect(getByText('Sell')).toBeOnTheScreen();
     });
 
-    it('shows only Buy button when token has no balance', () => {
-      mockUseTokenBalance.mockReturnValue({
-        balance: '0',
-        fiatBalance: '$0.00',
-        tokenFormattedBalance: '0 DAI',
+    it('shows only Swap when user has eligible tokens but token is not buyable', () => {
+      mockUseTokenBuyability.mockReturnValue({
+        isBuyable: false,
+        isLoading: false,
       });
 
       const { getByText, queryByText } = render(<TokenDetails />);
 
-      expect(getByText('Buy')).toBeOnTheScreen();
-      expect(queryByText('Sell')).toBeNull();
+      expect(getByText('Swap')).toBeOnTheScreen();
+      expect(queryByText('Buy')).toBeNull();
     });
 
-    it('shows only Buy button when token balance is undefined', () => {
-      mockUseTokenBalance.mockReturnValue({
-        balance: undefined,
-        fiatBalance: undefined,
-        tokenFormattedBalance: undefined,
+    it('shows only Buy when user has no eligible swap tokens', () => {
+      mockUseTokenActions.mockReturnValue({
+        onBuy: mockOnBuy,
+        onSend: jest.fn(),
+        onReceive: jest.fn(),
+        goToSwaps: mockGoToSwaps,
+        handleBuyPress: jest.fn(),
+        handleSellPress: jest.fn(),
+        hasEligibleSwapTokens: false,
+        networkModal: null,
       });
 
       const { getByText, queryByText } = render(<TokenDetails />);
 
       expect(getByText('Buy')).toBeOnTheScreen();
-      expect(queryByText('Sell')).toBeNull();
+      expect(queryByText('Swap')).toBeNull();
     });
   });
 
diff --git a/app/components/UI/TokenDetails/Views/TokenDetails.tsx b/app/components/UI/TokenDetails/Views/TokenDetails.tsx
index 1cb89c6fda15..0b1cc6d87c1d 100644
--- a/app/components/UI/TokenDetails/Views/TokenDetails.tsx
+++ b/app/components/UI/TokenDetails/Views/TokenDetails.tsx
@@ -48,6 +48,7 @@ import { strings } from '../../../../../locales/i18n';
 import { useTokenDetailsABTest } from '../hooks/useTokenDetailsABTest';
 import { useRWAToken } from '../../Bridge/hooks/useRWAToken';
 import { BridgeToken } from '../../Bridge/types';
+import useTokenBuyability from '../../Ramp/hooks/useTokenBuyability';
 
 const styleSheet = (params: { theme: Theme }) => {
   const { theme } = params;
@@ -146,14 +147,15 @@ const TokenDetails: React.FC<{
     onSend,
     onReceive,
     goToSwaps,
-    handleBuyPress,
-    handleSellPress,
+    hasEligibleSwapTokens,
     networkModal,
   } = useTokenActions({
     token,
     networkName,
   });
 
+  const { isBuyable } = useTokenBuyability(token);
+
   const {
     transactions,
     submittedTxs,
@@ -176,6 +178,9 @@ const TokenDetails: React.FC<{
   });
   const displaySwapsButton = isSwapsAssetAllowed && AppConstants.SWAPS.ACTIVE;
 
+  const showSwapButton = hasEligibleSwapTokens;
+  const showBuyButton = isBuyable || !hasEligibleSwapTokens;
+
   const rampNetworks = useSelector(getRampNetworks);
 
   const chainIdForRamp = token.chainId ?? '';
@@ -273,7 +278,6 @@ const TokenDetails: React.FC<{
       {networkModal}
       {useNewLayout &&
         !txLoading &&
-        displaySwapsButton &&
         isTokenTradingOpen(token as BridgeToken) && (
           <BottomSheetFooter
             style={{
@@ -281,20 +285,23 @@ const TokenDetails: React.FC<{
               paddingBottom: insets.bottom + 6,
             }}
             buttonPropsArray={[
-              {
-                variant: ButtonVariants.Primary,
-                label: strings('asset_overview.buy_button'),
-                size: ButtonSize.Lg,
-                onPress: handleBuyPress,
-              },
-              // Only show Sell button if user has balance of this token
-              ...(balance && parseFloat(String(balance)) > 0
+              ...(showSwapButton
+                ? [
+                    {
+                      variant: ButtonVariants.Primary,
+                      label: strings('asset_overview.swap'),
+                      size: ButtonSize.Lg,
+                      onPress: () => goToSwaps(),
+                    },
+                  ]
+                : []),
+              ...(showBuyButton
                 ? [
                     {
                       variant: ButtonVariants.Primary,
-                      label: strings('asset_overview.sell_button'),
+                      label: strings('asset_overview.buy_button'),
                       size: ButtonSize.Lg,
-                      onPress: handleSellPress,
+                      onPress: onBuy,
                     },
                   ]
                 : []),
diff --git a/app/components/UI/TokenDetails/components/AssetOverviewContent.test.tsx b/app/components/UI/TokenDetails/components/AssetOverviewContent.test.tsx
index 240ea6b2415c..629324f679d1 100644
--- a/app/components/UI/TokenDetails/components/AssetOverviewContent.test.tsx
+++ b/app/components/UI/TokenDetails/components/AssetOverviewContent.test.tsx
@@ -1,6 +1,6 @@
 import React from 'react';
 import { fireEvent, act } from '@testing-library/react-native';
-import { Pressable as MockPressable } from 'react-native';
+import { Pressable as MockPressable, View as MockView } from 'react-native';
 import AssetOverviewContent, {
   type AssetOverviewContentProps,
 } from './AssetOverviewContent';
@@ -25,6 +25,7 @@ const mockBuild = jest.fn();
 const mockCreateEventBuilder = jest.fn();
 const mockUseMarketInsights = jest.fn();
 const mockSelectMarketInsightsEnabled = jest.fn(() => true);
+const mockUsePerpsPositionForAsset = jest.fn();
 
 jest.mock('../../MarketInsights', () => ({
   __esModule: true,
@@ -72,6 +73,21 @@ jest.mock('../../../../selectors/featureFlagController/tokenDetailsV2', () => ({
   selectTokenDetailsLayoutTestVariant: jest.fn(() => 'treatment'),
 }));
 
+jest.mock('../../Perps/hooks/usePerpsPositionForAsset', () => ({
+  usePerpsPositionForAsset: (...args: unknown[]) =>
+    mockUsePerpsPositionForAsset(...args),
+}));
+
+jest.mock('../../Perps/components/PerpsPositionCard', () => ({
+  __esModule: true,
+  default: ({ testID }: { testID?: string }) => <MockView testID={testID} />,
+}));
+
+jest.mock('../../Perps/components/PerpsDiscoveryBanner', () => ({
+  __esModule: true,
+  default: ({ testID }: { testID?: string }) => <MockView testID={testID} />,
+}));
+
 jest.mock('../../AssetOverview/TokenDetails', () => () => null);
 
 jest.mock('@react-navigation/native', () => {
@@ -159,6 +175,13 @@ const defaultMarketInsightsResult = {
 };
 
 describe('AssetOverviewContent', () => {
+  const defaultPerpsPositionResult = {
+    position: null,
+    hasFundsInPerps: false,
+    accountState: null,
+    isLoading: false,
+  };
+
   describe('Long / Short with perps eligibility', () => {
     beforeEach(() => {
       jest.clearAllMocks();
@@ -169,6 +192,7 @@ describe('AssetOverviewContent', () => {
       });
       mockSelectMarketInsightsEnabled.mockReturnValue(true);
       mockUseMarketInsights.mockReturnValue(defaultMarketInsightsResult);
+      mockUsePerpsPositionForAsset.mockReturnValue(defaultPerpsPositionResult);
     });
 
     it('shows geo block modal and tracks event when Long is pressed and user is not eligible', () => {
@@ -361,4 +385,100 @@ describe('AssetOverviewContent', () => {
       expect(onMarketInsightsDisplayResolved).toHaveBeenCalledWith(false);
     });
   });
+
+  describe('Perps / Market Insights layout ordering', () => {
+    // Token with enough aggregators to pass isTokenTrustworthyForPerps (requires >= 2)
+    const trustworthyToken: TokenI = {
+      ...defaultToken,
+      aggregators: ['uniswap', 'sushiswap'],
+    };
+
+    const trustworthyProps: AssetOverviewContentProps = {
+      ...defaultProps,
+      token: trustworthyToken,
+    };
+
+    beforeEach(() => {
+      jest.clearAllMocks();
+      mockBuild.mockReturnValue({ category: 'market-insights-opened' });
+      mockAddProperties.mockReturnValue({ build: mockBuild });
+      mockCreateEventBuilder.mockReturnValue({
+        addProperties: mockAddProperties,
+      });
+      mockSelectMarketInsightsEnabled.mockReturnValue(true);
+      mockUseMarketInsights.mockReturnValue(defaultMarketInsightsResult);
+      mockUsePerpsPositionForAsset.mockReturnValue({
+        position: null,
+        hasFundsInPerps: false,
+        accountState: null,
+        isLoading: false,
+      });
+    });
+
+    it('renders perps position card above market insights when a position exists', () => {
+      mockUsePerpsPositionForAsset.mockReturnValue({
+        position: { symbol: 'ETH', size: '1', side: 'long' },
+        hasFundsInPerps: true,
+        accountState: null,
+        isLoading: false,
+      });
+
+      const { getByTestId, queryByTestId } = renderWithProvider(
+        <AssetOverviewContent {...trustworthyProps} />,
+        { state: createState(true) },
+      );
+
+      expect(
+        getByTestId(TokenOverviewSelectorsIDs.PERPS_POSITION_CARD),
+      ).toBeOnTheScreen();
+      expect(getByTestId('market-insights-entry-card')).toBeOnTheScreen();
+      expect(
+        queryByTestId(TokenOverviewSelectorsIDs.PERPS_DISCOVERY_BANNER),
+      ).toBeNull();
+    });
+
+    it('renders discovery banner below market insights when no position exists', () => {
+      const { getByTestId, queryByTestId } = renderWithProvider(
+        <AssetOverviewContent {...trustworthyProps} />,
+        { state: createState(true) },
+      );
+
+      expect(getByTestId('market-insights-entry-card')).toBeOnTheScreen();
+      expect(
+        getByTestId(TokenOverviewSelectorsIDs.PERPS_DISCOVERY_BANNER),
+      ).toBeOnTheScreen();
+      expect(
+        queryByTestId(TokenOverviewSelectorsIDs.PERPS_POSITION_CARD),
+      ).toBeNull();
+    });
+
+    it('does not render discovery banner when a position exists', () => {
+      mockUsePerpsPositionForAsset.mockReturnValue({
+        position: { symbol: 'ETH', size: '1', side: 'long' },
+        hasFundsInPerps: true,
+        accountState: null,
+        isLoading: false,
+      });
+
+      const { queryByTestId } = renderWithProvider(
+        <AssetOverviewContent {...trustworthyProps} />,
+        { state: createState(true) },
+      );
+
+      expect(
+        queryByTestId(TokenOverviewSelectorsIDs.PERPS_DISCOVERY_BANNER),
+      ).toBeNull();
+    });
+
+    it('does not render position card when no position exists', () => {
+      const { queryByTestId } = renderWithProvider(
+        <AssetOverviewContent {...trustworthyProps} />,
+        { state: createState(true) },
+      );
+
+      expect(
+        queryByTestId(TokenOverviewSelectorsIDs.PERPS_POSITION_CARD),
+      ).toBeNull();
+    });
+  });
 });
diff --git a/app/components/UI/TokenDetails/components/AssetOverviewContent.tsx b/app/components/UI/TokenDetails/components/AssetOverviewContent.tsx
index 6815b903e0f5..1574158b7f77 100644
--- a/app/components/UI/TokenDetails/components/AssetOverviewContent.tsx
+++ b/app/components/UI/TokenDetails/components/AssetOverviewContent.tsx
@@ -265,6 +265,13 @@ const AssetOverviewContent: React.FC<AssetOverviewContentProps> = ({
 
   const isTokenTrustworthy = isTokenTrustworthyForPerps(token);
 
+  const showPerpsSection =
+    isPerpsEnabled &&
+    hasPerpsMarket &&
+    Boolean(marketData) &&
+    isTokenTrustworthy &&
+    !isPerpsPositionLoading;
+
   const isMarketInsightsEnabled = useSelector(selectMarketInsightsEnabled);
   const marketInsightsCaip19Id = useMemo(() => {
     if (!isMarketInsightsEnabled) {
@@ -524,6 +531,22 @@ const AssetOverviewContent: React.FC<AssetOverviewContentProps> = ({
             )
             ///: END:ONLY_INCLUDE_IF
           }
+          {showPerpsSection && perpsPosition && (
+            <View style={styles.perpsPositionCardContainer}>
+              <Text
+                variant={TextVariant.HeadingMD}
+                style={styles.perpsPositionTitle}
+              >
+                {strings('asset_overview.perps_position')}
+              </Text>
+              <PerpsPositionCard
+                position={perpsPosition}
+                compact
+                onPress={handlePerpsDiscoveryPress}
+                testID={TokenOverviewSelectorsIDs.PERPS_POSITION_CARD}
+              />
+            </View>
+          )}
           {isMarketInsightsEnabled &&
           marketInsightsReport &&
           marketInsightsCaip19Id ? (
@@ -537,44 +560,14 @@ const AssetOverviewContent: React.FC<AssetOverviewContentProps> = ({
               />
             </View>
           ) : null}
-          {isPerpsEnabled &&
-            hasPerpsMarket &&
-            marketData &&
-            isTokenTrustworthy &&
-            !isPerpsPositionLoading && (
-              <>
-                {perpsPosition ? (
-                  <View style={styles.perpsPositionCardContainer}>
-                    <Text
-                      variant={TextVariant.HeadingMD}
-                      style={styles.perpsPositionTitle}
-                    >
-                      {strings('asset_overview.perps_position')}
-                    </Text>
-                    <PerpsPositionCard
-                      position={perpsPosition}
-                      compact
-                      onPress={handlePerpsDiscoveryPress}
-                      testID={TokenOverviewSelectorsIDs.PERPS_POSITION_CARD}
-                    />
-                  </View>
-                ) : (
-                  <>
-                    <View style={styles.perpsPositionCardContainer}>
-                      <Text variant={TextVariant.HeadingMD}>
-                        {strings('asset_overview.perps_position')}
-                      </Text>
-                    </View>
-                    <PerpsDiscoveryBanner
-                      symbol={marketData.symbol}
-                      maxLeverage={marketData.maxLeverage}
-                      onPress={handlePerpsDiscoveryPress}
-                      testID={TokenOverviewSelectorsIDs.PERPS_DISCOVERY_BANNER}
-                    />
-                  </>
-                )}
-              </>
-            )}
+          {showPerpsSection && !perpsPosition && marketData && (
+            <PerpsDiscoveryBanner
+              symbol={marketData.symbol}
+              maxLeverage={marketData.maxLeverage}
+              onPress={handlePerpsDiscoveryPress}
+              testID={TokenOverviewSelectorsIDs.PERPS_DISCOVERY_BANNER}
+            />
+          )}
           <View style={styles.tokenDetailsWrapper}>
             <TokenDetails asset={token} />
           </View>
diff --git a/app/components/UI/TokenDetails/components/TokenDetailsInlineHeader.tsx b/app/components/UI/TokenDetails/components/TokenDetailsInlineHeader.tsx
index 169f857f4dbc..8b89ce855c53 100644
--- a/app/components/UI/TokenDetails/components/TokenDetailsInlineHeader.tsx
+++ b/app/components/UI/TokenDetails/components/TokenDetailsInlineHeader.tsx
@@ -66,7 +66,7 @@ export const TokenDetailsInlineHeader = ({
       <ButtonIcon
         style={styles.leftButton}
         onPress={onBackPress}
-        size={ButtonIconSize.Lg}
+        size={ButtonIconSize.Md}
         iconName={IconName.ArrowLeft}
         testID="back-arrow-button"
       />
diff --git a/app/components/UI/TokenDetails/hooks/useTokenActions.test.ts b/app/components/UI/TokenDetails/hooks/useTokenActions.test.ts
index feab46bb51c3..f005da542789 100644
--- a/app/components/UI/TokenDetails/hooks/useTokenActions.test.ts
+++ b/app/components/UI/TokenDetails/hooks/useTokenActions.test.ts
@@ -655,6 +655,7 @@ describe('useTokenActions', () => {
           chainId: defaultToken.chainId,
           symbol: defaultToken.symbol,
         }),
+        'Buy',
       );
       expect(mockGoToBuy).not.toHaveBeenCalled();
     });
@@ -692,6 +693,7 @@ describe('useTokenActions', () => {
         expect.objectContaining({
           address: defaultToken.address,
         }),
+        'Buy',
       );
     });
 
@@ -743,6 +745,7 @@ describe('useTokenActions', () => {
           chainId: '0x1',
           symbol: 'ETH',
         }),
+        'Buy',
       );
       expect(mockGoToBuy).not.toHaveBeenCalled();
     });
@@ -767,6 +770,7 @@ describe('useTokenActions', () => {
           symbol: defaultToken.symbol,
         }),
         undefined,
+        'Sell',
       );
     });
   });
diff --git a/app/components/UI/TokenDetails/hooks/useTokenActions.ts b/app/components/UI/TokenDetails/hooks/useTokenActions.ts
index 38b6209dc89f..45fc936fa1dc 100644
--- a/app/components/UI/TokenDetails/hooks/useTokenActions.ts
+++ b/app/components/UI/TokenDetails/hooks/useTokenActions.ts
@@ -99,6 +99,8 @@ export interface UseTokenActionsResult {
   handleBuyPress: () => void;
   /** Sticky bar Sell handler - current asset as source, mUSD/native as destination */
   handleSellPress: () => void;
+  /** Whether the user has any tokens with positive balance that can be used as a swap source */
+  hasEligibleSwapTokens: boolean;
   networkModal: React.ReactNode;
 }
 
@@ -176,10 +178,11 @@ export const useTokenActions = ({
       location: ActionLocation.ASSET_DETAILS,
     });
 
-    const accountForChain =
-      isNonEvmToken && token.chainId
-        ? getAccountByScope(token.chainId as CaipChainId)
-        : selectedInternalAccount;
+    const accountForChain = token.chainId
+      ? (getAccountByScope(
+          formatChainIdToCaip(token.chainId as Hex) as CaipChainId,
+        ) ?? selectedInternalAccount)
+      : selectedInternalAccount;
 
     const addressForChain = accountForChain?.address;
 
@@ -309,7 +312,7 @@ export const useTokenActions = ({
     trackEvent(
       createEventBuilder(MetaMetricsEvents.RAMPS_BUTTON_CLICKED)
         .addProperties({
-          text: 'Buy',
+          button_text: 'Buy',
           location: 'TokenDetails',
           chain_id_destination: getDecimalChainId(chainId),
           ramp_type: rampUnifiedV1Enabled ? 'UNIFIED_BUY' : 'BUY',
@@ -436,7 +439,11 @@ export const useTokenActions = ({
     }
 
     if (!goToSwaps) return;
-    goToSwaps(buySourceToken, currentTokenAsBridgeToken);
+    goToSwaps(
+      buySourceToken,
+      currentTokenAsBridgeToken,
+      strings('asset_overview.buy_button'),
+    );
   }, [
     goToSwaps,
     goToBuy,
@@ -449,7 +456,11 @@ export const useTokenActions = ({
   // Sell: current token as source, let swap UI compute default dest
   const handleSellPress = useCallback(() => {
     if (!goToSwaps) return;
-    goToSwaps(currentTokenAsBridgeToken, undefined);
+    goToSwaps(
+      currentTokenAsBridgeToken,
+      undefined,
+      strings('asset_overview.sell_button'),
+    );
   }, [goToSwaps, currentTokenAsBridgeToken]);
 
   return {
@@ -459,6 +470,7 @@ export const useTokenActions = ({
     goToSwaps,
     handleBuyPress,
     handleSellPress,
+    hasEligibleSwapTokens: buySourceToken !== null,
     networkModal,
   };
 };
diff --git a/app/components/UI/Tokens/TokenList/TokenList.test.tsx b/app/components/UI/Tokens/TokenList/TokenList.test.tsx
index e803a04c28ba..6c120e578942 100644
--- a/app/components/UI/Tokens/TokenList/TokenList.test.tsx
+++ b/app/components/UI/Tokens/TokenList/TokenList.test.tsx
@@ -8,6 +8,7 @@ import { useNavigation } from '@react-navigation/native';
 import { WalletViewSelectorsIDs } from '../../../Views/Wallet/WalletView.testIds';
 import { useAnalytics } from '../../../hooks/useAnalytics/useAnalytics';
 import { AnalyticsEventBuilder } from '../../../../util/analytics/AnalyticsEventBuilder';
+import { createMockUseAnalyticsHook } from '../../../../util/test/analyticsMock';
 import { SCROLL_TO_TOKEN_EVENT } from '../constants';
 
 // Mock external dependencies
@@ -161,9 +162,7 @@ const mockUseNavigation = useNavigation as jest.MockedFunction<
   typeof useNavigation
 >;
 const mockUseSelector = useSelector as jest.MockedFunction<typeof useSelector>;
-const mockUseAnalytics = useAnalytics as jest.MockedFunction<
-  typeof useAnalytics
->;
+const mockUseAnalytics = jest.mocked(useAnalytics);
 
 const mockTokenKeys = [
   {
@@ -195,19 +194,14 @@ describe('TokenList', () => {
       navigate: mockNavigate,
     } as unknown as ReturnType<typeof useNavigation>);
 
-    mockUseAnalytics.mockReturnValue({
-      trackEvent: mockTrackEvent,
-      createEventBuilder: AnalyticsEventBuilder.createEventBuilder,
-      enable: jest.fn(),
-      addTraitsToUser: jest.fn(),
-      createDataDeletionTask: jest.fn(),
-      checkDataDeleteStatus: jest.fn(),
-      getDeleteRegulationCreationDate: jest.fn(),
-      getDeleteRegulationId: jest.fn(),
-      isDataRecorded: jest.fn(),
-      isEnabled: jest.fn(),
-      getAnalyticsId: jest.fn(),
-    });
+    mockUseAnalytics.mockReturnValue(
+      createMockUseAnalyticsHook({
+        trackEvent: mockTrackEvent,
+        // The real builder is needed so build() produces the correct event shape
+        // for assertions on trackEvent call arguments.
+        createEventBuilder: AnalyticsEventBuilder.createEventBuilder,
+      }),
+    );
 
     // Mock useSelector to call the selector function with empty state
     mockUseSelector.mockImplementation((selector) => selector({}));
diff --git a/app/components/UI/Tokens/TokenList/TokenListItemV2/TokenListItemV2.tsx b/app/components/UI/Tokens/TokenList/TokenListItemV2/TokenListItemV2.tsx
index 05fce7c5cc9d..78d36f15cc6d 100644
--- a/app/components/UI/Tokens/TokenList/TokenListItemV2/TokenListItemV2.tsx
+++ b/app/components/UI/Tokens/TokenList/TokenListItemV2/TokenListItemV2.tsx
@@ -528,7 +528,7 @@ export const TokenListItemV2 = React.memo(
             <View style={styles.assetNameContainer}>
               <View style={styles.assetName}>
                 <Text
-                  variant={TextVariant.BodyMDBold}
+                  variant={TextVariant.BodyMDMedium}
                   numberOfLines={1}
                   style={styles.assetNameText}
                 >
@@ -595,7 +595,7 @@ export const TokenListItemV2 = React.memo(
                             true,
                           )
                         : '-'}
-                      {' • '}
+                      {' \u2022 '}
                     </Text>
                   )}
 
diff --git a/app/components/UI/Tokens/hooks/useRemoveToken.test.ts b/app/components/UI/Tokens/hooks/useRemoveToken.test.ts
new file mode 100644
index 000000000000..891a1a9b49a4
--- /dev/null
+++ b/app/components/UI/Tokens/hooks/useRemoveToken.test.ts
@@ -0,0 +1,182 @@
+import { renderHook, act } from '@testing-library/react-native';
+import { useRemoveToken } from './useRemoveToken';
+import type { TokenI } from '../types';
+
+const mockTrackEvent = jest.fn();
+const mockCreateEventBuilder = jest.fn();
+const mockRemoveEvmToken = jest.fn().mockResolvedValue(undefined);
+const mockRemoveNonEvmToken = jest.fn().mockResolvedValue(undefined);
+const mockIsNonEvmChainId = jest.fn().mockReturnValue(false);
+const mockSelectInternalAccountByScope = jest.fn();
+
+jest.mock('react-redux', () => ({
+  useSelector: jest.fn((selector: (...args: unknown[]) => unknown) =>
+    selector({} as never),
+  ),
+}));
+
+jest.mock('../../../hooks/useAnalytics/useAnalytics', () => ({
+  useAnalytics: () => ({
+    trackEvent: mockTrackEvent,
+    createEventBuilder: mockCreateEventBuilder,
+  }),
+}));
+
+jest.mock('../../../../selectors/networkController', () => ({
+  selectChainId: () => '0x1',
+}));
+
+jest.mock('../../../../selectors/multichainAccounts/accounts', () => ({
+  selectSelectedInternalAccountByScope: () => mockSelectInternalAccountByScope,
+}));
+
+jest.mock('../util', () => ({
+  removeEvmToken: (...args: unknown[]) => mockRemoveEvmToken(...args),
+  removeNonEvmToken: (...args: unknown[]) => mockRemoveNonEvmToken(...args),
+}));
+
+jest.mock('../../../../core/Multichain/utils', () => ({
+  isNonEvmChainId: (...args: unknown[]) => mockIsNonEvmChainId(...args),
+}));
+
+const makeToken = (overrides: Partial<TokenI> = {}): TokenI => ({
+  address: '0xtoken1',
+  name: 'Test Token',
+  symbol: 'TKN',
+  decimals: 18,
+  image: '',
+  balance: '100',
+  logo: undefined,
+  isETH: false,
+  chainId: '0x1',
+  ...overrides,
+});
+
+describe('useRemoveToken', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+    mockIsNonEvmChainId.mockReturnValue(false);
+  });
+
+  it('initializes with hidden state', () => {
+    const { result } = renderHook(() => useRemoveToken());
+
+    expect(result.current.removeTokenState.isVisible).toBe(false);
+    expect(result.current.showScamWarningModal).toBe(false);
+  });
+
+  it('sets removeTokenState visible when showRemoveMenu is called', () => {
+    const { result } = renderHook(() => useRemoveToken());
+    const token = makeToken();
+
+    act(() => {
+      result.current.showRemoveMenu(token);
+    });
+
+    expect(result.current.removeTokenState.isVisible).toBe(true);
+    expect(
+      result.current.removeTokenState.isVisible &&
+        result.current.removeTokenState.token,
+    ).toBe(token);
+  });
+
+  it('resets state when handleClose is called', () => {
+    const { result } = renderHook(() => useRemoveToken());
+
+    act(() => {
+      result.current.showRemoveMenu(makeToken());
+    });
+
+    expect(result.current.removeTokenState.isVisible).toBe(true);
+
+    act(() => {
+      result.current.handleClose();
+    });
+
+    expect(result.current.removeTokenState.isVisible).toBe(false);
+  });
+
+  it('calls removeEvmToken for EVM tokens', async () => {
+    const { result } = renderHook(() => useRemoveToken());
+    const token = makeToken({ chainId: '0x1' });
+
+    act(() => {
+      result.current.showRemoveMenu(token);
+    });
+
+    await act(async () => {
+      await result.current.removeToken();
+    });
+
+    expect(mockRemoveEvmToken).toHaveBeenCalledTimes(1);
+    expect(mockRemoveNonEvmToken).not.toHaveBeenCalled();
+    expect(result.current.removeTokenState.isVisible).toBe(false);
+  });
+
+  it('calls removeNonEvmToken for non-EVM tokens', async () => {
+    mockIsNonEvmChainId.mockReturnValue(true);
+    const { result } = renderHook(() => useRemoveToken());
+    const token = makeToken({
+      chainId: 'solana:5eykt4UsFv8P8NJdTREpY1vzqKqZKvdp',
+      address: '0xsoltoken',
+    });
+
+    act(() => {
+      result.current.showRemoveMenu(token);
+    });
+
+    await act(async () => {
+      await result.current.removeToken();
+    });
+
+    expect(mockRemoveNonEvmToken).toHaveBeenCalledTimes(1);
+    expect(mockRemoveEvmToken).not.toHaveBeenCalled();
+    expect(result.current.removeTokenState.isVisible).toBe(false);
+  });
+
+  it('does nothing when removeToken is called with hidden state', async () => {
+    const { result } = renderHook(() => useRemoveToken());
+
+    await act(async () => {
+      await result.current.removeToken();
+    });
+
+    expect(mockRemoveEvmToken).not.toHaveBeenCalled();
+    expect(mockRemoveNonEvmToken).not.toHaveBeenCalled();
+  });
+
+  it('skips removal when token has no chainId', async () => {
+    const { result } = renderHook(() => useRemoveToken());
+    const token = makeToken({ chainId: undefined });
+
+    act(() => {
+      result.current.showRemoveMenu(token);
+    });
+
+    await act(async () => {
+      await result.current.removeToken();
+    });
+
+    expect(mockRemoveEvmToken).not.toHaveBeenCalled();
+    expect(mockRemoveNonEvmToken).not.toHaveBeenCalled();
+    expect(result.current.removeTokenState.isVisible).toBe(false);
+  });
+
+  it('toggles showScamWarningModal via setShowScamWarningModal', () => {
+    const { result } = renderHook(() => useRemoveToken());
+
+    expect(result.current.showScamWarningModal).toBe(false);
+
+    act(() => {
+      result.current.setShowScamWarningModal(true);
+    });
+
+    expect(result.current.showScamWarningModal).toBe(true);
+
+    act(() => {
+      result.current.setShowScamWarningModal(false);
+    });
+
+    expect(result.current.showScamWarningModal).toBe(false);
+  });
+});
diff --git a/app/components/UI/Tokens/hooks/useRemoveToken.ts b/app/components/UI/Tokens/hooks/useRemoveToken.ts
new file mode 100644
index 000000000000..249a2db35e55
--- /dev/null
+++ b/app/components/UI/Tokens/hooks/useRemoveToken.ts
@@ -0,0 +1,81 @@
+import { useState, useCallback } from 'react';
+import { useSelector } from 'react-redux';
+import { useAnalytics } from '../../../hooks/useAnalytics/useAnalytics';
+import { selectChainId } from '../../../../selectors/networkController';
+import { selectSelectedInternalAccountByScope } from '../../../../selectors/multichainAccounts/accounts';
+import { removeEvmToken, removeNonEvmToken } from '../util';
+import { isNonEvmChainId } from '../../../../core/Multichain/utils';
+import { getDecimalChainId } from '../../../../util/networks';
+import { strings } from '../../../../../locales/i18n';
+import type { TokenI } from '../types';
+
+type RemoveTokenState =
+  | { isVisible: true; token: TokenI }
+  | { isVisible: false };
+
+/**
+ * Encapsulates the state and callbacks for the token hide/remove flow.
+ * Used by both the homepage TokensSection and the full-view Tokens component
+ * to avoid duplicating the removal logic.
+ */
+export const useRemoveToken = () => {
+  const { trackEvent, createEventBuilder } = useAnalytics();
+  const currentChainId = useSelector(selectChainId);
+  const selectInternalAccountByScope = useSelector(
+    selectSelectedInternalAccountByScope,
+  );
+
+  const [removeTokenState, setRemoveTokenState] = useState<RemoveTokenState>({
+    isVisible: false,
+  });
+  const [showScamWarningModal, setShowScamWarningModal] = useState(false);
+
+  const showRemoveMenu = useCallback((token: TokenI) => {
+    setRemoveTokenState({ isVisible: true, token });
+  }, []);
+
+  const removeToken = useCallback(async () => {
+    if (!removeTokenState.isVisible) return;
+
+    const tokenToRemove = removeTokenState.token;
+    setRemoveTokenState({ isVisible: false });
+
+    if (tokenToRemove?.chainId !== undefined) {
+      if (isNonEvmChainId(tokenToRemove.chainId)) {
+        await removeNonEvmToken({
+          tokenAddress: tokenToRemove.address,
+          tokenChainId: tokenToRemove.chainId,
+          selectInternalAccountByScope,
+        });
+      } else {
+        await removeEvmToken({
+          tokenToRemove,
+          currentChainId,
+          trackEvent,
+          strings,
+          getDecimalChainId,
+          createEventBuilder,
+        });
+      }
+    }
+  }, [
+    removeTokenState,
+    currentChainId,
+    trackEvent,
+    createEventBuilder,
+    selectInternalAccountByScope,
+  ]);
+
+  const handleClose = useCallback(() => {
+    setRemoveTokenState({ isVisible: false });
+  }, []);
+
+  return {
+    removeTokenState,
+    showRemoveMenu,
+    removeToken,
+    handleClose,
+    showScamWarningModal,
+    setShowScamWarningModal,
+  };
+};
diff --git a/app/components/UI/Tokens/index.test.tsx b/app/components/UI/Tokens/index.test.tsx
index 4ec04d68ce9e..484581b01cc6 100644
--- a/app/components/UI/Tokens/index.test.tsx
+++ b/app/components/UI/Tokens/index.test.tsx
@@ -6,6 +6,8 @@ import {
   TouchableOpacity,
   View,
 } from 'react-native';
+import { useAnalytics } from '../../hooks/useAnalytics/useAnalytics';
+import { createMockUseAnalyticsHook } from '../../../util/test/analyticsMock';
 import { clone } from 'lodash';
 import { fireEvent, waitFor, userEvent } from '@testing-library/react-native';
 import Tokens from './';
@@ -28,7 +30,6 @@ import * as RefreshTokensModule from './util/refreshTokens';
 import * as RemoveEvmTokenModule from './util/removeEvmToken';
 // eslint-disable-next-line import/no-namespace
 import * as RemoveNonEvmTokenModule from './util/removeNonEvmToken';
-
 jest.mock('../Earn/hooks/useMusdConversionEligibility', () => ({
   useMusdConversionEligibility: () => ({
     isEligible: true,
@@ -278,6 +279,77 @@ describe('Tokens', () => {
     },
   ];
 
+  describe('Position Screen Viewed Analytics', () => {
+    let mockTrackEvent: jest.Mock;
+    let mockAddProperties: jest.Mock;
+
+    beforeEach(() => {
+      mockTrackEvent = jest.fn();
+      mockAddProperties = jest.fn().mockReturnThis();
+      jest.mocked(useAnalytics).mockReturnValue(
+        createMockUseAnalyticsHook({
+          trackEvent: mockTrackEvent,
+          createEventBuilder: jest.fn().mockReturnValue({
+            addProperties: mockAddProperties,
+            addSensitiveProperties: jest.fn().mockReturnThis(),
+            removeProperties: jest.fn().mockReturnThis(),
+            removeSensitiveProperties: jest.fn().mockReturnThis(),
+            setSaveDataRecording: jest.fn().mockReturnThis(),
+            build: jest.fn(),
+          }),
+        }),
+      );
+    });
+
+    it('tracks Position Screen Viewed when isFullView is true and tokens are loaded', async () => {
+      renderComponent(initialState, true);
+
+      await waitFor(() => {
+        expect(mockTrackEvent).toHaveBeenCalled();
+        expect(mockAddProperties).toHaveBeenCalledWith(
+          expect.objectContaining({
+            item_count: 3,
+            location: 'homepage',
+            is_empty: false,
+            screen_type: 'tokens',
+          }),
+        );
+      });
+    });
+
+    it('tracks Position Screen Viewed with is_empty true when no tokens are present', async () => {
+      const { mockSelectSortedAssetsBySelectedAccountGroup } =
+        arrangeMockSelectors();
+      mockSelectSortedAssetsBySelectedAccountGroup.mockReturnValue([]);
+
+      renderComponent(initialState, true);
+
+      await waitFor(() => {
+        expect(mockTrackEvent).toHaveBeenCalled();
+        expect(mockAddProperties).toHaveBeenCalledWith(
+          expect.objectContaining({
+            item_count: 0,
+            is_empty: true,
+            screen_type: 'tokens',
+          }),
+        );
+      });
+    });
+
+    it('does not track Position Screen Viewed when isFullView is false', async () => {
+      renderComponent(initialState, false);
+
+      await waitFor(() => {
+        expect(mockAddProperties).not.toHaveBeenCalledWith(
+          expect.objectContaining({
+            screen_type: 'tokens',
+            location: 'homepage',
+          }),
+        );
+      });
+    });
+  });
+
   it.each(removeTokenTests)(
     'performs token removal - $type',
     async ({
diff --git a/app/components/UI/Tokens/index.tsx b/app/components/UI/Tokens/index.tsx
index 6ccb3ac6a475..87c63c187471 100644
--- a/app/components/UI/Tokens/index.tsx
+++ b/app/components/UI/Tokens/index.tsx
@@ -5,26 +5,21 @@ import React, {
   useEffect,
   useImperativeHandle,
   useMemo,
+  useRef,
 } from 'react';
 import type { TabRefreshHandle } from '../../Views/Wallet/types';
 import { InteractionManager, View } from 'react-native';
 import { useSelector } from 'react-redux';
 import { useAnalytics } from '../../../components/hooks/useAnalytics/useAnalytics';
+import { MetaMetricsEvents } from '../../../core/Analytics';
 import {
   selectChainId,
   selectEvmNetworkConfigurationsByChainId,
 } from '../../../selectors/networkController';
 import { getDecimalChainId } from '../../../util/networks';
 import { TokenList } from './TokenList/TokenList';
-import { TokenI } from './types';
 import { WalletViewSelectorsIDs } from '../../Views/Wallet/WalletView.testIds';
-import { strings } from '../../../../locales/i18n';
-import {
-  refreshTokens,
-  removeEvmToken,
-  removeNonEvmToken,
-  goToAddEvmToken,
-} from './util';
+import { refreshTokens, goToAddEvmToken } from './util';
 import { useFocusEffect, useNavigation } from '@react-navigation/native';
 import { Box } from '@metamask/design-system-react-native';
 import { TokenListControlBar } from './TokenListControlBar/TokenListControlBar';
@@ -35,8 +30,8 @@ import { selectSortedAssetsBySelectedAccountGroup } from '../../../selectors/ass
 import { selectSelectedInternalAccountByScope } from '../../../selectors/multichainAccounts/accounts';
 import { SolScope } from '@metamask/keyring-api';
 import { useTailwind } from '@metamask/design-system-twrnc-preset';
-import { isNonEvmChainId } from '../../../core/Multichain/utils';
 import { selectHomepageRedesignV1Enabled } from '../../../selectors/featureFlagController/homepage';
+import { useRemoveToken } from './hooks/useRemoveToken';
 import { TokensEmptyState } from '../TokensEmptyState';
 import MusdConversionAssetListCta from '../Earn/components/Musd/MusdConversionAssetListCta';
 import { selectIsMusdConversionFlowEnabledFlag } from '../Earn/selectors/featureFlags';
@@ -63,15 +58,8 @@ const Tokens = forwardRef<TabRefreshHandle, TokensProps>(
     const currentChainId = useSelector(selectChainId);
 
     const [refreshing, setRefreshing] = useState(false);
-    const [removeTokenState, setRemoveTokenState] = useState<
-      { isVisible: true; token: TokenI } | { isVisible: false }
-    >({ isVisible: false });
     const selectedAccountId = useSelector(selectSelectedInternalAccountId);
 
-    const selectInternalAccountByScope = useSelector(
-      selectSelectedInternalAccountByScope,
-    );
-
     const selectedSolanaAccount =
       useSelector(selectSelectedInternalAccountByScope)(SolScope.Mainnet) ||
       null;
@@ -86,8 +74,8 @@ const Tokens = forwardRef<TabRefreshHandle, TokensProps>(
     );
     const { isEligible: isGeoEligible } = useMusdConversionEligibility();
 
-    const [showScamWarningModal, setShowScamWarningModal] = useState(false);
     const [hasInitialLoad, setHasInitialLoad] = useState(false);
+    const hasTrackedScreenViewRef = useRef(false);
 
     // Memoize selector computation for better performance
     const sortedTokenKeys = useSelector(
@@ -114,9 +102,36 @@ const Tokens = forwardRef<TabRefreshHandle, TokensProps>(
       }
     }, [sortedTokenKeys, hasInitialLoad]);
 
-    const showRemoveMenu = useCallback((token: TokenI) => {
-      setRemoveTokenState({ isVisible: true, token });
-    }, []);
+    useEffect(() => {
+      if (!isFullView || !hasInitialLoad || hasTrackedScreenViewRef.current)
+        return;
+      hasTrackedScreenViewRef.current = true;
+      trackEvent(
+        createEventBuilder(MetaMetricsEvents.POSITION_SCREEN_VIEWED)
+          .addProperties({
+            item_count: sortedTokenKeys.length,
+            location: 'homepage',
+            is_empty: sortedTokenKeys.length === 0,
+            screen_type: 'tokens',
+          })
+          .build(),
+      );
+    }, [
+      isFullView,
+      hasInitialLoad,
+      sortedTokenKeys.length,
+      trackEvent,
+      createEventBuilder,
+    ]);
+
+    const {
+      removeTokenState,
+      showRemoveMenu,
+      removeToken,
+      handleClose: handleCloseRemoveTokenBottomSheet,
+      showScamWarningModal,
+      setShowScamWarningModal,
+    } = useRemoveToken();
 
     const onRefresh = useCallback(async () => {
       setRefreshing(true);
@@ -148,40 +163,6 @@ const Tokens = forwardRef<TabRefreshHandle, TokensProps>(
       refresh: onRefresh,
     }));
 
-    const removeToken = useCallback(async () => {
-      if (!removeTokenState.isVisible) return;
-
-      const tokenToRemove = removeTokenState.token;
-
-      // Reset state immediately to prevent issues if onClose fires first
-      setRemoveTokenState({ isVisible: false });
-
-      if (tokenToRemove?.chainId !== undefined) {
-        if (isNonEvmChainId(tokenToRemove.chainId)) {
-          await removeNonEvmToken({
-            tokenAddress: tokenToRemove.address,
-            tokenChainId: tokenToRemove.chainId,
-            selectInternalAccountByScope,
-          });
-        } else {
-          await removeEvmToken({
-            tokenToRemove,
-            currentChainId,
-            trackEvent,
-            strings,
-            getDecimalChainId,
-            createEventBuilder,
-          });
-        }
-      }
-    }, [
-      removeTokenState,
-      currentChainId,
-      trackEvent,
-      createEventBuilder,
-      selectInternalAccountByScope,
-    ]);
-
     const goToAddToken = useCallback(() => {
       goToAddEvmToken({
         navigation,
@@ -192,13 +173,9 @@ const Tokens = forwardRef<TabRefreshHandle, TokensProps>(
       });
     }, [navigation, trackEvent, createEventBuilder, currentChainId]);
 
-    const handleCloseRemoveTokenBottomSheet = useCallback(() => {
-      setRemoveTokenState({ isVisible: false });
-    }, []);
-
     const handleScamWarningModal = useCallback(() => {
       setShowScamWarningModal((prev) => !prev);
-    }, []);
+    }, [setShowScamWarningModal]);
 
     const maxItems = useMemo(() => {
       if (isFullView) {
diff --git a/app/components/UI/Tokens/util/refreshEvmTokens.test.ts b/app/components/UI/Tokens/util/refreshEvmTokens.test.ts
index 16524503bfbb..c74f9ce6a7a0 100644
--- a/app/components/UI/Tokens/util/refreshEvmTokens.test.ts
+++ b/app/components/UI/Tokens/util/refreshEvmTokens.test.ts
@@ -52,6 +52,7 @@ jest.mock('../../../../core/Engine', () => ({
 
 jest.mock('../../../../util/Logger', () => ({
   error: jest.fn(),
+  log: jest.fn(),
 }));
 
 describe('refreshEvmTokens', () => {
@@ -140,7 +141,7 @@ describe('refreshEvmTokens', () => {
     ).not.toHaveBeenCalled();
   });
 
-  it('should log an error if a timeout occurs', async () => {
+  it('should log a non-error message if a timeout occurs', async () => {
     jest.useFakeTimers();
 
     try {
@@ -162,12 +163,10 @@ describe('refreshEvmTokens', () => {
 
       await refreshPromise;
 
-      expect(Logger.error).toHaveBeenCalledWith(
-        expect.objectContaining({
-          message: expect.stringContaining('timed out'),
-        }),
-        'Error while refreshing tokens',
+      expect(Logger.log).toHaveBeenCalledWith(
+        expect.stringContaining('performEvmTokenRefresh timed out'),
       );
+      expect(Logger.error).not.toHaveBeenCalled();
     } finally {
       jest.runOnlyPendingTimers();
       jest.useRealTimers();
diff --git a/app/components/UI/Tokens/util/refreshTokens.test.ts b/app/components/UI/Tokens/util/refreshTokens.test.ts
index a7f12b0f2c1b..54aa4226180d 100644
--- a/app/components/UI/Tokens/util/refreshTokens.test.ts
+++ b/app/components/UI/Tokens/util/refreshTokens.test.ts
@@ -47,6 +47,7 @@ jest.mock('../../../../core/Engine', () => ({
 
 jest.mock('../../../../util/Logger', () => ({
   error: jest.fn(),
+  log: jest.fn(),
 }));
 
 describe('refreshTokens', () => {
@@ -130,7 +131,7 @@ describe('refreshTokens', () => {
     ).not.toHaveBeenCalled();
   });
 
-  it('logs an error if a timeout occurs', async () => {
+  it('logs if a timeout occurs', async () => {
     jest.useFakeTimers();
 
     try {
@@ -152,12 +153,10 @@ describe('refreshTokens', () => {
 
       await refreshPromise;
 
-      expect(Logger.error).toHaveBeenCalledWith(
-        expect.objectContaining({
-          message: expect.stringContaining('timed out'),
-        }),
-        'Error while refreshing tokens',
+      expect(Logger.log).toHaveBeenCalledWith(
+        expect.stringContaining('performEvmTokenRefresh timed out'),
       );
+      expect(Logger.error).not.toHaveBeenCalled();
     } finally {
       jest.runOnlyPendingTimers();
       jest.useRealTimers();
diff --git a/app/components/UI/Tokens/util/tokenRefreshUtils.test.ts b/app/components/UI/Tokens/util/tokenRefreshUtils.test.ts
index 50236c058dc5..3146c9dd9aed 100644
--- a/app/components/UI/Tokens/util/tokenRefreshUtils.test.ts
+++ b/app/components/UI/Tokens/util/tokenRefreshUtils.test.ts
@@ -49,6 +49,7 @@ jest.mock('../../../../core/Engine', () => ({
 
 jest.mock('../../../../util/Logger', () => ({
   error: jest.fn(),
+  log: jest.fn(),
 }));
 
 const fakeNetworkConfigurations = {
@@ -112,7 +113,7 @@ describe('performEvmTokenRefresh', () => {
     ).toHaveBeenCalledWith([]);
   });
 
-  it('logs error when refresh times out', async () => {
+  it('logs timeout as non-error when refresh times out', async () => {
     jest.useFakeTimers();
 
     (
@@ -134,12 +135,10 @@ describe('performEvmTokenRefresh', () => {
     jest.advanceTimersByTime(5000);
     await refreshPromise;
 
-    expect(Logger.error).toHaveBeenCalledWith(
-      expect.objectContaining({
-        message: expect.stringContaining('timed out'),
-      }),
-      'Error while refreshing tokens',
+    expect(Logger.log).toHaveBeenCalledWith(
+      expect.stringContaining('performEvmTokenRefresh timed out'),
     );
+    expect(Logger.error).not.toHaveBeenCalled();
 
     jest.useRealTimers();
   });
diff --git a/app/components/UI/Tokens/util/tokenRefreshUtils.ts b/app/components/UI/Tokens/util/tokenRefreshUtils.ts
index 96e47cc992ef..f13bd591d17c 100644
--- a/app/components/UI/Tokens/util/tokenRefreshUtils.ts
+++ b/app/components/UI/Tokens/util/tokenRefreshUtils.ts
@@ -71,8 +71,10 @@ export const performEvmTokenRefresh = async (
       REFRESH_TIMEOUT_MS,
       'performEvmTokenRefresh',
     );
-  } catch (error) {
-    Logger.error(error as Error, 'Error while refreshing tokens');
+  } catch {
+    Logger.log(
+      'performEvmTokenRefresh timed out; balances may be stale until the next refresh',
+    );
   }
 };
 
diff --git a/app/components/UI/TransactionElement/TransactionDetails/__snapshots__/index.test.tsx.snap b/app/components/UI/TransactionElement/TransactionDetails/__snapshots__/index.test.tsx.snap
index 48e781572994..dffa2a2ddd1b 100644
--- a/app/components/UI/TransactionElement/TransactionDetails/__snapshots__/index.test.tsx.snap
+++ b/app/components/UI/TransactionElement/TransactionDetails/__snapshots__/index.test.tsx.snap
@@ -331,7 +331,7 @@ exports[`TransactionDetails should render correctly 1`] = `
                               "paddingVertical": 16,
                             },
                             {
-                              "borderBottomColor": "#b7bbc866",
+                              "borderBottomColor": "#b4b4b566",
                               "borderBottomWidth": 1,
                             },
                           ]
@@ -352,7 +352,7 @@ exports[`TransactionDetails should render correctly 1`] = `
                             style={
                               [
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 30,
                                   "marginVertical": 2,
@@ -382,7 +382,7 @@ exports[`TransactionDetails should render correctly 1`] = `
                                 undefined,
                                 [
                                   {
-                                    "color": "#686e7d",
+                                    "color": "#66676a",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 10,
                                     "marginBottom": 8,
@@ -398,7 +398,7 @@ exports[`TransactionDetails should render correctly 1`] = `
                             style={
                               [
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 30,
                                   "marginVertical": 2,
@@ -461,7 +461,7 @@ exports[`TransactionDetails should render correctly 1`] = `
                             style={
                               [
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 30,
                                   "marginVertical": 2,
@@ -491,7 +491,7 @@ exports[`TransactionDetails should render correctly 1`] = `
                                 undefined,
                                 [
                                   {
-                                    "color": "#686e7d",
+                                    "color": "#66676a",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 10,
                                     "marginBottom": 8,
@@ -509,7 +509,7 @@ exports[`TransactionDetails should render correctly 1`] = `
                             small={true}
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Regular",
                                 "fontSize": 16,
                                 "letterSpacing": 0,
@@ -547,7 +547,7 @@ exports[`TransactionDetails should render correctly 1`] = `
                             style={
                               [
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 30,
                                   "marginVertical": 2,
@@ -577,7 +577,7 @@ exports[`TransactionDetails should render correctly 1`] = `
                                 undefined,
                                 [
                                   {
-                                    "color": "#686e7d",
+                                    "color": "#66676a",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 10,
                                     "marginBottom": 8,
@@ -640,7 +640,7 @@ exports[`TransactionDetails should render correctly 1`] = `
                                   primary={true}
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 14,
                                       "letterSpacing": 0,
@@ -677,7 +677,7 @@ exports[`TransactionDetails should render correctly 1`] = `
                             style={
                               [
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 30,
                                   "marginVertical": 2,
@@ -707,7 +707,7 @@ exports[`TransactionDetails should render correctly 1`] = `
                                 undefined,
                                 [
                                   {
-                                    "color": "#686e7d",
+                                    "color": "#66676a",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 10,
                                     "marginBottom": 8,
@@ -770,7 +770,7 @@ exports[`TransactionDetails should render correctly 1`] = `
                                   primary={true}
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 14,
                                       "letterSpacing": 0,
@@ -817,7 +817,7 @@ exports[`TransactionDetails should render correctly 1`] = `
                             style={
                               [
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 30,
                                   "marginVertical": 2,
@@ -849,7 +849,7 @@ exports[`TransactionDetails should render correctly 1`] = `
                                 undefined,
                                 [
                                   {
-                                    "color": "#686e7d",
+                                    "color": "#66676a",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 10,
                                     "marginBottom": 8,
@@ -880,7 +880,7 @@ exports[`TransactionDetails should render correctly 1`] = `
                           style={
                             [
                               {
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderRadius": 8,
                                 "borderWidth": 1,
                                 "padding": 16,
@@ -907,7 +907,7 @@ exports[`TransactionDetails should render correctly 1`] = `
                               style={
                                 [
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 30,
                                     "marginVertical": 2,
@@ -923,7 +923,7 @@ exports[`TransactionDetails should render correctly 1`] = `
                                   undefined,
                                   undefined,
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                   },
                                   undefined,
                                   undefined,
@@ -949,7 +949,7 @@ exports[`TransactionDetails should render correctly 1`] = `
                               style={
                                 [
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 30,
                                     "marginVertical": 2,
@@ -965,7 +965,7 @@ exports[`TransactionDetails should render correctly 1`] = `
                                   undefined,
                                   undefined,
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                   },
                                   undefined,
                                   undefined,
@@ -1020,7 +1020,7 @@ exports[`TransactionDetails should render correctly 1`] = `
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 30,
                                       "marginVertical": 2,
@@ -1036,7 +1036,7 @@ exports[`TransactionDetails should render correctly 1`] = `
                                     undefined,
                                     undefined,
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                     },
                                     undefined,
                                     undefined,
@@ -1064,7 +1064,7 @@ exports[`TransactionDetails should render correctly 1`] = `
                             style={
                               [
                                 {
-                                  "borderBottomColor": "#b7bbc866",
+                                  "borderBottomColor": "#b4b4b566",
                                   "borderBottomWidth": 1,
                                   "marginVertical": 6,
                                 },
@@ -1090,7 +1090,7 @@ exports[`TransactionDetails should render correctly 1`] = `
                               style={
                                 [
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 30,
                                     "marginVertical": 2,
@@ -1108,7 +1108,7 @@ exports[`TransactionDetails should render correctly 1`] = `
                                   undefined,
                                   undefined,
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                   },
                                   undefined,
                                   undefined,
@@ -1134,7 +1134,7 @@ exports[`TransactionDetails should render correctly 1`] = `
                               style={
                                 [
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 30,
                                     "marginVertical": 2,
@@ -1152,7 +1152,7 @@ exports[`TransactionDetails should render correctly 1`] = `
                                   undefined,
                                   undefined,
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                   },
                                   undefined,
                                   undefined,
@@ -1198,7 +1198,7 @@ exports[`TransactionDetails should render correctly 1`] = `
                               style={
                                 [
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 30,
                                     "marginVertical": 2,
@@ -1608,7 +1608,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                               "paddingVertical": 16,
                             },
                             {
-                              "borderBottomColor": "#b7bbc866",
+                              "borderBottomColor": "#b4b4b566",
                               "borderBottomWidth": 1,
                             },
                           ]
@@ -1629,7 +1629,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                             style={
                               [
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 30,
                                   "marginVertical": 2,
@@ -1659,7 +1659,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                                 undefined,
                                 [
                                   {
-                                    "color": "#686e7d",
+                                    "color": "#66676a",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 10,
                                     "marginBottom": 8,
@@ -1675,7 +1675,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                             style={
                               [
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 30,
                                   "marginVertical": 2,
@@ -1738,7 +1738,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                             style={
                               [
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 30,
                                   "marginVertical": 2,
@@ -1768,7 +1768,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                                 undefined,
                                 [
                                   {
-                                    "color": "#686e7d",
+                                    "color": "#66676a",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 10,
                                     "marginBottom": 8,
@@ -1786,7 +1786,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                             small={true}
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Regular",
                                 "fontSize": 16,
                                 "letterSpacing": 0,
@@ -1824,7 +1824,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                             style={
                               [
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 30,
                                   "marginVertical": 2,
@@ -1854,7 +1854,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                                 undefined,
                                 [
                                   {
-                                    "color": "#686e7d",
+                                    "color": "#66676a",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 10,
                                     "marginBottom": 8,
@@ -1917,7 +1917,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                                   primary={true}
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 14,
                                       "letterSpacing": 0,
@@ -1954,7 +1954,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                             style={
                               [
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 30,
                                   "marginVertical": 2,
@@ -1984,7 +1984,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                                 undefined,
                                 [
                                   {
-                                    "color": "#686e7d",
+                                    "color": "#66676a",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 10,
                                     "marginBottom": 8,
@@ -2047,7 +2047,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                                   primary={true}
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 14,
                                       "letterSpacing": 0,
@@ -2094,7 +2094,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                             style={
                               [
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 30,
                                   "marginVertical": 2,
@@ -2126,7 +2126,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                                 undefined,
                                 [
                                   {
-                                    "color": "#686e7d",
+                                    "color": "#66676a",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 10,
                                     "marginBottom": 8,
@@ -2157,7 +2157,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                           style={
                             [
                               {
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderRadius": 8,
                                 "borderWidth": 1,
                                 "padding": 16,
@@ -2184,7 +2184,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                               style={
                                 [
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 30,
                                     "marginVertical": 2,
@@ -2200,7 +2200,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                                   undefined,
                                   undefined,
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                   },
                                   undefined,
                                   undefined,
@@ -2226,7 +2226,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                               style={
                                 [
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 30,
                                     "marginVertical": 2,
@@ -2242,7 +2242,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                                   undefined,
                                   undefined,
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                   },
                                   undefined,
                                   undefined,
@@ -2297,7 +2297,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 30,
                                       "marginVertical": 2,
@@ -2313,7 +2313,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                                     undefined,
                                     undefined,
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                     },
                                     undefined,
                                     undefined,
@@ -2341,7 +2341,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                             style={
                               [
                                 {
-                                  "borderBottomColor": "#b7bbc866",
+                                  "borderBottomColor": "#b4b4b566",
                                   "borderBottomWidth": 1,
                                   "marginVertical": 6,
                                 },
@@ -2367,7 +2367,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                               style={
                                 [
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 30,
                                     "marginVertical": 2,
@@ -2385,7 +2385,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                                   undefined,
                                   undefined,
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                   },
                                   undefined,
                                   undefined,
@@ -2411,7 +2411,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                               style={
                                 [
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 30,
                                     "marginVertical": 2,
@@ -2429,7 +2429,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                                   undefined,
                                   undefined,
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                   },
                                   undefined,
                                   undefined,
@@ -2475,7 +2475,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                               style={
                                 [
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 30,
                                     "marginVertical": 2,
@@ -2885,7 +2885,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                               "paddingVertical": 16,
                             },
                             {
-                              "borderBottomColor": "#b7bbc866",
+                              "borderBottomColor": "#b4b4b566",
                               "borderBottomWidth": 1,
                             },
                           ]
@@ -2906,7 +2906,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                             style={
                               [
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 30,
                                   "marginVertical": 2,
@@ -2936,7 +2936,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                                 undefined,
                                 [
                                   {
-                                    "color": "#686e7d",
+                                    "color": "#66676a",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 10,
                                     "marginBottom": 8,
@@ -2952,7 +2952,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                             style={
                               [
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 30,
                                   "marginVertical": 2,
@@ -3015,7 +3015,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                             style={
                               [
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 30,
                                   "marginVertical": 2,
@@ -3045,7 +3045,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                                 undefined,
                                 [
                                   {
-                                    "color": "#686e7d",
+                                    "color": "#66676a",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 10,
                                     "marginBottom": 8,
@@ -3063,7 +3063,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                             small={true}
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Regular",
                                 "fontSize": 16,
                                 "letterSpacing": 0,
@@ -3101,7 +3101,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                             style={
                               [
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 30,
                                   "marginVertical": 2,
@@ -3131,7 +3131,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                                 undefined,
                                 [
                                   {
-                                    "color": "#686e7d",
+                                    "color": "#66676a",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 10,
                                     "marginBottom": 8,
@@ -3194,7 +3194,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                                   primary={true}
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 14,
                                       "letterSpacing": 0,
@@ -3231,7 +3231,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                             style={
                               [
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 30,
                                   "marginVertical": 2,
@@ -3261,7 +3261,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                                 undefined,
                                 [
                                   {
-                                    "color": "#686e7d",
+                                    "color": "#66676a",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 10,
                                     "marginBottom": 8,
@@ -3324,7 +3324,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                                   primary={true}
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 14,
                                       "letterSpacing": 0,
@@ -3371,7 +3371,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                             style={
                               [
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 30,
                                   "marginVertical": 2,
@@ -3403,7 +3403,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                                 undefined,
                                 [
                                   {
-                                    "color": "#686e7d",
+                                    "color": "#66676a",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 10,
                                     "marginBottom": 8,
@@ -3434,7 +3434,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                           style={
                             [
                               {
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderRadius": 8,
                                 "borderWidth": 1,
                                 "padding": 16,
@@ -3461,7 +3461,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                               style={
                                 [
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 30,
                                     "marginVertical": 2,
@@ -3477,7 +3477,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                                   undefined,
                                   undefined,
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                   },
                                   undefined,
                                   undefined,
@@ -3503,7 +3503,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                               style={
                                 [
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 30,
                                     "marginVertical": 2,
@@ -3519,7 +3519,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                                   undefined,
                                   undefined,
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                   },
                                   undefined,
                                   undefined,
@@ -3574,7 +3574,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 30,
                                       "marginVertical": 2,
@@ -3590,7 +3590,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                                     undefined,
                                     undefined,
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                     },
                                     undefined,
                                     undefined,
@@ -3618,7 +3618,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                             style={
                               [
                                 {
-                                  "borderBottomColor": "#b7bbc866",
+                                  "borderBottomColor": "#b4b4b566",
                                   "borderBottomWidth": 1,
                                   "marginVertical": 6,
                                 },
@@ -3644,7 +3644,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                               style={
                                 [
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 30,
                                     "marginVertical": 2,
@@ -3662,7 +3662,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                                   undefined,
                                   undefined,
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                   },
                                   undefined,
                                   undefined,
@@ -3688,7 +3688,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                               style={
                                 [
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 30,
                                     "marginVertical": 2,
@@ -3706,7 +3706,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                                   undefined,
                                   undefined,
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                   },
                                   undefined,
                                   undefined,
@@ -3752,7 +3752,7 @@ exports[`TransactionDetails should render correctly for multi-layer fee network
                               style={
                                 [
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 30,
                                     "marginVertical": 2,
diff --git a/app/components/UI/TransactionElement/TransactionDetails/index.js b/app/components/UI/TransactionElement/TransactionDetails/index.js
index 34ab522617fc..e5db2ebe84be 100644
--- a/app/components/UI/TransactionElement/TransactionDetails/index.js
+++ b/app/components/UI/TransactionElement/TransactionDetails/index.js
@@ -18,6 +18,7 @@ import Logger from '../../../../util/Logger';
 import EthereumAddress from '../../EthereumAddress';
 import TransactionSummary from '../../../Views/TransactionSummary';
 import { toDateFormat } from '../../../../util/date';
+import StyledButton from '../../StyledButton';
 import StatusText from '../../../Base/StatusText';
 import Text, {
   TextColor,
@@ -64,7 +65,7 @@ import {
   MAINNET_BLOCK_EXPLORER,
   SEPOLIA_BLOCK_EXPLORER,
 } from '../../../../constants/urls';
-import { CHAIN_IDS } from '@metamask/transaction-controller';
+import { CHAIN_IDS, TransactionType } from '@metamask/transaction-controller';
 import TagBase from '../../../../component-library/base-components/TagBase';
 import { PopularList } from '../../../../util/networks/customNetworks';
 
@@ -150,6 +151,8 @@ class TransactionDetails extends PureComponent {
     /**
      * A string representing the network name
      */
+    showSpeedUpModal: PropTypes.func,
+    showCancelModal: PropTypes.func,
     selectedAddress: PropTypes.string,
     transactions: PropTypes.array,
     ticker: PropTypes.string,
@@ -159,6 +162,7 @@ class TransactionDetails extends PureComponent {
     currentCurrency: PropTypes.string,
     swapsTransactions: PropTypes.object,
     primaryCurrency: PropTypes.string,
+
     /**
      * Avatar style to render for account icons
      */
@@ -320,10 +324,57 @@ class TransactionDetails extends PureComponent {
     return createStyles(colors);
   };
 
+  showSpeedUpModal = () => {
+    this.props.showSpeedUpModal?.();
+  };
+
+  showCancelModal = () => {
+    this.props.showCancelModal?.();
+  };
+
+  renderSpeedUpButton = () => {
+    const styles = this.getStyles();
+
+    return (
+      <StyledButton
+        type={'normal'}
+        containerStyle={[
+          styles.actionContainerStyle,
+          styles.speedupActionContainerStyle,
+        ]}
+        style={styles.actionStyle}
+        onPress={this.showSpeedUpModal}
+      >
+        {strings('transaction.speedup')}
+      </StyledButton>
+    );
+  };
+
+  renderCancelButton = () => {
+    const styles = this.getStyles();
+
+    return (
+      <StyledButton
+        type={'cancel'}
+        containerStyle={styles.actionContainerStyle}
+        style={styles.actionStyle}
+        onPress={this.showCancelModal}
+      >
+        {strings('transaction.cancel')}
+      </StyledButton>
+    );
+  };
+
   render = () => {
     const {
       transactionObject,
-      transactionObject: { status, time, txParams, chainId: txChainId },
+      transactionObject: {
+        status,
+        time,
+        txParams,
+        chainId: txChainId,
+        isSmartTransaction,
+      },
     } = this.props;
     const chainId = txChainId;
     const hasNestedTransactions = Boolean(
@@ -331,7 +382,12 @@ class TransactionDetails extends PureComponent {
     );
     const { updatedTransactionDetails } = this.state;
     const styles = this.getStyles();
-
+    const isBridgeTransaction =
+      transactionObject?.type === TransactionType.bridge;
+    const renderTxActions =
+      (status === 'submitted' || status === 'approved') &&
+      !isSmartTransaction &&
+      !isBridgeTransaction;
     const { rpcBlockExplorer } = this.state;
 
     return updatedTransactionDetails ? (
@@ -356,6 +412,13 @@ class TransactionDetails extends PureComponent {
               {strings('transactions.status')}
             </DetailsModal.SectionTitle>
             <StatusText status={status} />
+            {!!renderTxActions &&
+              updatedTransactionDetails?.txChainId === chainId && (
+                <View style={styles.transactionActionsContainer}>
+                  {this.renderSpeedUpButton()}
+                  {this.renderCancelButton()}
+                </View>
+              )}
           </DetailsModal.Column>
           <DetailsModal.Column end>
             <DetailsModal.SectionTitle>
diff --git a/app/components/UI/TransactionElement/TransactionDetails/index.test.tsx b/app/components/UI/TransactionElement/TransactionDetails/index.test.tsx
index c60953ddbbac..255d2485bde6 100644
--- a/app/components/UI/TransactionElement/TransactionDetails/index.test.tsx
+++ b/app/components/UI/TransactionElement/TransactionDetails/index.test.tsx
@@ -399,6 +399,31 @@ describe('TransactionDetails', () => {
     });
   });
 
+  it('renders speed up and cancel buttons', async () => {
+    const { getByText } = renderComponent({
+      state: {
+        ...initialState,
+        engine: {
+          ...initialState.engine,
+          backgroundState: {
+            ...initialState.engine.backgroundState,
+            PreferencesController: {
+              smartTransactionsOptInStatus: false,
+            },
+          },
+        },
+      },
+      hash: '0x3',
+      txParams: {
+        multiLayerL1FeeTotal: '0x1',
+      },
+      status: 'submitted',
+    });
+
+    expect(getByText('Speed up')).toBeOnTheScreen();
+    expect(getByText('Cancel')).toBeOnTheScreen();
+  });
+
   it('should render `Batched transactions` tag if there are nested transactions', async () => {
     const { getByText } = renderComponent({
       state: initialState,
diff --git a/app/components/UI/TransactionElement/TransactionDetailsSheet/TransactionDetailsSheet.tsx b/app/components/UI/TransactionElement/TransactionDetailsSheet/TransactionDetailsSheet.tsx
index 2c21099b34f1..38d14534375f 100644
--- a/app/components/UI/TransactionElement/TransactionDetailsSheet/TransactionDetailsSheet.tsx
+++ b/app/components/UI/TransactionElement/TransactionDetailsSheet/TransactionDetailsSheet.tsx
@@ -73,6 +73,14 @@ const TransactionDetailsSheet: React.FC = () => {
     sheetRef.current?.onCloseBottomSheet();
   }, []);
 
+  const handleSpeedUp = useCallback(() => {
+    route.params.showSpeedUpModal();
+  }, [route.params]);
+
+  const handleCancel = useCallback(() => {
+    route.params.showCancelModal();
+  }, [route.params]);
+
   return (
     <BottomSheet ref={sheetRef} shouldNavigateBack>
       <BottomSheetHeader onClose={handleClose}>
@@ -87,6 +95,8 @@ const TransactionDetailsSheet: React.FC = () => {
       <TransactionDetails
         transactionObject={currentTx}
         transactionDetails={transactionDetails}
+        showSpeedUpModal={handleSpeedUp}
+        showCancelModal={handleCancel}
         close={handleClose}
       />
     </BottomSheet>
diff --git a/app/components/UI/TransactionElement/index.js b/app/components/UI/TransactionElement/index.js
index dcd81513ad1a..c6469b44983e 100644
--- a/app/components/UI/TransactionElement/index.js
+++ b/app/components/UI/TransactionElement/index.js
@@ -20,11 +20,9 @@ import { TRANSACTION_TYPES } from '../../../util/transactions';
 import ListItem from '../../Base/ListItem';
 import StatusText from '../../Base/StatusText';
 import { isTestNet, getDecimalChainId } from '../../../util/networks';
-import { weiHexToGweiDec } from '@metamask/controller-utils';
 import {
   TransactionType,
   WalletDevice,
-  isEIP1559Transaction,
 } from '@metamask/transaction-controller';
 import { ThemeContext, mockTheme } from '../../../util/theme';
 import { selectTickerByChainId } from '../../../selectors/networkController';
@@ -496,7 +494,7 @@ class TransactionElement extends PureComponent {
       isQRHardwareAccount,
       isLedgerAccount,
       i,
-      tx: { status, chainId, type },
+      tx: { status, isSmartTransaction, chainId, type },
       tx,
       bridgeTxHistoryData: { bridgeTxHistoryItem, isBridgeComplete },
     } = this.props;
@@ -511,6 +509,14 @@ class TransactionElement extends PureComponent {
             bridgeTxHistoryItem.status.status,
           )
         : status;
+
+    const renderNormalActions =
+      (transactionStatus === 'submitted' ||
+        (transactionStatus === 'approved' &&
+          !isQRHardwareAccount &&
+          !isLedgerAccount)) &&
+      !isSmartTransaction &&
+      !isBridgeTransaction;
     const renderUnsignedQRActions =
       transactionStatus === 'approved' && isQRHardwareAccount;
     const renderLedgerActions =
@@ -561,6 +567,12 @@ class TransactionElement extends PureComponent {
             </ListItem.Amounts>
           )}
         </ListItem.Content>
+        {renderNormalActions && (
+          <ListItem.Actions>
+            {this.renderSpeedUpButton()}
+            {this.renderCancelButton()}
+          </ListItem.Actions>
+        )}
         {renderUnsignedQRActions && (
           <ListItem.Actions>
             {this.renderQRSignButton()}
@@ -574,43 +586,28 @@ class TransactionElement extends PureComponent {
     );
   };
 
-  parseGas = () => {
-    const { tx } = this.props;
-
-    let existingGas = {};
-    const transaction = tx?.txParams;
-    if (transaction) {
-      if (isEIP1559Transaction(transaction)) {
-        existingGas = {
-          isEIP1559Transaction: true,
-          maxFeePerGas: weiHexToGweiDec(transaction.maxFeePerGas),
-          maxPriorityFeePerGas: weiHexToGweiDec(
-            transaction.maxPriorityFeePerGas,
-          ),
-        };
-      } else {
-        const existingGasPrice = tx.txParams ? tx.txParams.gasPrice : '0x0';
-        const existingGasPriceDecimal = parseInt(
-          existingGasPrice === undefined ? '0x0' : existingGasPrice,
-          16,
-        );
-        existingGas = { gasPrice: existingGasPriceDecimal };
-      }
-    }
-    return existingGas;
+  renderCancelButton = () => {
+    const { colors, typography } = this.context || mockTheme;
+    const styles = createStyles(colors, typography);
+
+    return (
+      <StyledButton
+        type={'cancel'}
+        containerStyle={styles.actionContainerStyle}
+        style={styles.actionStyle}
+        onPress={this.showCancelModal}
+      >
+        {strings('transaction.cancel')}
+      </StyledButton>
+    );
   };
 
   showCancelModal = () => {
-    const existingGas = this.parseGas();
-
-    this.mounted && this.props.onCancelAction(true, existingGas, this.props.tx);
+    this.mounted && this.props.onCancelAction(true, this.props.tx);
   };
 
   showSpeedUpModal = () => {
-    const existingGas = this.parseGas();
-
-    this.mounted &&
-      this.props.onSpeedUpAction(true, existingGas, this.props.tx);
+    this.mounted && this.props.onSpeedUpAction(true, this.props.tx);
   };
 
   hideSpeedUpModal = () => {
@@ -629,6 +626,25 @@ class TransactionElement extends PureComponent {
     this.mounted && this.props.cancelUnsignedQRTransaction(this.props.tx);
   };
 
+  renderSpeedUpButton = () => {
+    const { colors, typography } = this.context || mockTheme;
+    const styles = createStyles(colors, typography);
+
+    return (
+      <StyledButton
+        type={'normal'}
+        containerStyle={[
+          styles.actionContainerStyle,
+          styles.speedupActionContainerStyle,
+        ]}
+        style={styles.actionStyle}
+        onPress={this.showSpeedUpModal}
+      >
+        {strings('transaction.speedup')}
+      </StyledButton>
+    );
+  };
+
   renderQRSignButton = () => {
     const { colors, typography } = this.context || mockTheme;
     const styles = createStyles(colors, typography);
diff --git a/app/components/UI/TransactionHeader/__snapshots__/index.test.tsx.snap b/app/components/UI/TransactionHeader/__snapshots__/index.test.tsx.snap
index 3ea6580ec67b..986b64f9ec11 100644
--- a/app/components/UI/TransactionHeader/__snapshots__/index.test.tsx.snap
+++ b/app/components/UI/TransactionHeader/__snapshots__/index.test.tsx.snap
@@ -21,7 +21,7 @@ exports[`TransactionHeader render correctly 1`] = `
     <View
       placeholderStyle={
         {
-          "backgroundColor": "#f3f5f9",
+          "backgroundColor": "#f3f3f4",
         }
       }
       useNativeDriver={true}
@@ -67,7 +67,7 @@ exports[`TransactionHeader render correctly 1`] = `
                 "backgroundColor": "#eee",
               },
               {
-                "backgroundColor": "#f3f5f9",
+                "backgroundColor": "#f3f3f4",
               },
             ]
           }
@@ -96,7 +96,7 @@ exports[`TransactionHeader render correctly 1`] = `
             "fontSize": 15,
           },
           {
-            "color": "#121314",
+            "color": "#131416",
             "marginRight": 5,
           },
           {
@@ -113,7 +113,7 @@ exports[`TransactionHeader render correctly 1`] = `
     <Text
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Bold",
           "fontSize": 14,
           "textAlign": "center",
@@ -149,7 +149,7 @@ exports[`TransactionHeader render correctly 1`] = `
     <Text
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 12,
           "padding": 5,
diff --git a/app/components/UI/Transactions/index.js b/app/components/UI/Transactions/index.js
index 2c389287527b..f2648e414b2e 100644
--- a/app/components/UI/Transactions/index.js
+++ b/app/components/UI/Transactions/index.js
@@ -11,8 +11,6 @@ import {
   Text,
   View,
 } from 'react-native';
-import { KeyboardAwareScrollView } from 'react-native-keyboard-aware-scroll-view';
-import Modal from 'react-native-modal';
 import { connect } from 'react-redux';
 import { ActivitiesViewSelectorsIDs } from '../../Views/ActivityView/ActivitiesView.testIds';
 import { strings } from '../../../../locales/i18n';
@@ -49,7 +47,7 @@ import {
   getBlockExplorerAddressUrl,
   getBlockExplorerName,
 } from '../../../util/networks';
-import { addHexPrefix, hexToBN, renderFromWei } from '../../../util/number';
+import { addHexPrefix } from '../../../util/number';
 import { mockTheme, ThemeContext } from '../../../util/theme';
 import {
   speedUpTransaction,
@@ -58,12 +56,11 @@ import {
 import { validateTransactionActionBalance } from '../../../util/transactions';
 import { createLedgerTransactionModalNavDetails } from '../../UI/LedgerModals/LedgerTransactionModal';
 import { createQRSigningTransactionModalNavDetails } from '../../UI/QRHardware/QRSigningTransactionModal';
-import UpdateEIP1559Tx from '../../Views/confirmations/legacy/components/UpdateEIP1559Tx';
+import { CancelSpeedupModal } from '../../Views/confirmations/components/modals/cancel-speedup-modal';
 import PriceChartContext, {
   PriceChartProvider,
 } from '../AssetOverview/PriceChart/PriceChart.context';
 import withQRHardwareAwareness from '../QRHardware/withQRHardwareAwareness';
-import TransactionActionModal from '../TransactionActionModal';
 import TransactionElement from '../TransactionElement';
 import RetryModal from './RetryModal';
 import TransactionsFooter from './TransactionsFooter';
@@ -219,7 +216,6 @@ class Transactions extends PureComponent {
     isLedgerAccount: false,
   };
 
-  existingGas = null;
   existingTx = null;
   cancelTxId = null;
   speedUpTxId = null;
@@ -426,53 +422,73 @@ class Transactions extends PureComponent {
 
   keyExtractor = (item) => item.id.toString();
 
-  onSpeedUpAction = (speedUpAction, existingGas, tx) => {
-    this.existingGas = existingGas;
+  onSpeedUpAction = (speedUpAction, tx) => {
+    if (!speedUpAction) {
+      this.setState({ speedUp1559IsOpen: false, speedUpIsOpen: false });
+      this.speedUpTxId = null;
+      this.existingTx = null;
+      return;
+    }
+    if (!tx) return;
     this.speedUpTxId = tx.id;
     this.existingTx = tx;
-    if (existingGas.isEIP1559Transaction) {
-      this.setState({ speedUp1559IsOpen: speedUpAction });
-    } else {
-      const speedUpConfirmDisabled = validateTransactionActionBalance(
-        tx,
-        SPEED_UP_RATE,
-        this.props.accounts,
-      );
-      this.setState({ speedUpIsOpen: speedUpAction, speedUpConfirmDisabled });
-    }
+    const speedUpConfirmDisabled = validateTransactionActionBalance(
+      tx,
+      SPEED_UP_RATE,
+      this.props.accounts,
+    );
+    this.setState({ speedUpIsOpen: speedUpAction, speedUpConfirmDisabled });
   };
 
   onSpeedUpCompleted = () => {
     this.setState({ speedUp1559IsOpen: false, speedUpIsOpen: false });
-    this.existingGas = null;
     this.speedUpTxId = null;
     this.existingTx = null;
   };
 
-  onCancelAction = (cancelAction, existingGas, tx) => {
-    this.existingGas = existingGas;
+  onCancelAction = (cancelAction, tx) => {
+    if (!cancelAction) {
+      this.setState({ cancel1559IsOpen: false, cancelIsOpen: false });
+      this.cancelTxId = null;
+      this.existingTx = null;
+      return;
+    }
+    if (!tx) return;
     this.cancelTxId = tx.id;
     this.existingTx = tx;
-
-    if (existingGas.isEIP1559Transaction) {
-      this.setState({ cancel1559IsOpen: cancelAction });
-    } else {
-      const cancelConfirmDisabled = validateTransactionActionBalance(
-        tx,
-        CANCEL_RATE,
-        this.props.accounts,
-      );
-      this.setState({ cancelIsOpen: cancelAction, cancelConfirmDisabled });
-    }
+    const cancelConfirmDisabled = validateTransactionActionBalance(
+      tx,
+      CANCEL_RATE,
+      this.props.accounts,
+    );
+    this.setState({ cancelIsOpen: cancelAction, cancelConfirmDisabled });
   };
 
   onCancelCompleted = () => {
     this.setState({ cancel1559IsOpen: false, cancelIsOpen: false });
-    this.existingGas = null;
     this.cancelTxId = null;
     this.existingTx = null;
   };
 
+  getParamsToSend = (transactionObject) => {
+    // Legacy tx with gasPrice 0x0 would produce 0 from the modal; fall back to market estimate so the replacement gets mined.
+    if (
+      transactionObject &&
+      transactionObject.gasPrice !== undefined &&
+      (transactionObject.gasPrice === '0x0' ||
+        parseInt(String(transactionObject.gasPrice), 16) === 0)
+    ) {
+      return this.getCancelOrSpeedupValues();
+    }
+    if (
+      transactionObject &&
+      (transactionObject.maxFeePerGas || transactionObject.gasPrice)
+    ) {
+      return transactionObject;
+    }
+    return this.getCancelOrSpeedupValues();
+  };
+
   onScroll = (event) => {
     const { nativeEvent } = event;
     const { contentOffset } = nativeEvent;
@@ -515,22 +531,20 @@ class Transactions extends PureComponent {
         ExtendedKeyringTypes.ledger,
       ]);
 
+      const params = this.getParamsToSend(transactionObject);
       if (isLedgerAccount) {
+        const isEip1559 = params?.maxFeePerGas && params?.maxPriorityFeePerGas;
         await this.signLedgerTransaction({
           id: this.speedUpTxId,
           replacementParams: {
             type: 'speedUp',
-            eip1559GasFee: {
-              maxFeePerGas: `0x${transactionObject?.suggestedMaxFeePerGasHex}`,
-              maxPriorityFeePerGas: `0x${transactionObject?.suggestedMaxPriorityFeePerGasHex}`,
-            },
+            ...(isEip1559
+              ? { eip1559GasFee: params }
+              : { legacyGasFee: params }),
           },
         });
       } else {
-        await speedUpTransaction(
-          this.speedUpTxId,
-          this.getCancelOrSpeedupValues(transactionObject),
-        );
+        await speedUpTransaction(this.speedUpTxId, params);
       }
       this.onSpeedUpCompleted();
     } catch (e) {
@@ -593,21 +607,22 @@ class Transactions extends PureComponent {
         ExtendedKeyringTypes.ledger,
       ]);
 
+      const params = this.getParamsToSend(transactionObject);
       if (isLedgerAccount) {
+        const isEip1559 = params?.maxFeePerGas && params?.maxPriorityFeePerGas;
         await this.signLedgerTransaction({
           id: this.cancelTxId,
           replacementParams: {
             type: 'cancel',
-            eip1559GasFee: {
-              maxFeePerGas: `0x${transactionObject?.suggestedMaxFeePerGasHex}`,
-              maxPriorityFeePerGas: `0x${transactionObject?.suggestedMaxPriorityFeePerGasHex}`,
-            },
+            ...(isEip1559
+              ? { eip1559GasFee: params }
+              : { legacyGasFee: params }),
           },
         });
       } else {
         await Engine.context.TransactionController.stopTransaction(
           this.cancelTxId,
-          this.getCancelOrSpeedupValues(transactionObject),
+          params,
         );
       }
       this.onCancelCompleted();
@@ -651,65 +666,16 @@ class Transactions extends PureComponent {
     //If the exitsing TX id true then it is a speed up retry
     if (this.speedUpTxId) {
       InteractionManager.runAfterInteractions(() => {
-        this.onSpeedUpAction(true, this.existingGas, this.existingTx);
+        this.onSpeedUpAction(true, this.existingTx);
       });
     }
     if (this.cancelTxId) {
       InteractionManager.runAfterInteractions(() => {
-        this.onCancelAction(true, this.existingGas, this.existingTx);
+        this.onCancelAction(true, this.existingTx);
       });
     }
   };
 
-  renderUpdateTxEIP1559Gas = (isCancel) => {
-    const { isSigningQRObject } = this.props;
-    const { colors } = this.context || mockTheme;
-    const styles = createStyles(colors);
-
-    if (!this.existingGas) return null;
-    if (this.existingGas.isEIP1559Transaction && !isSigningQRObject) {
-      return (
-        <Modal
-          isVisible
-          animationIn="slideInUp"
-          animationOut="slideOutDown"
-          style={styles.bottomModal}
-          backdropColor={colors.overlay.default}
-          backdropOpacity={1}
-          animationInTiming={600}
-          animationOutTiming={600}
-          onBackdropPress={
-            isCancel ? this.onCancelCompleted : this.onSpeedUpCompleted
-          }
-          onBackButtonPress={
-            isCancel ? this.onCancelCompleted : this.onSpeedUpCompleted
-          }
-          onSwipeComplete={
-            isCancel ? this.onCancelCompleted : this.onSpeedUpCompleted
-          }
-          swipeDirection={'down'}
-          propagateSwipe
-        >
-          <KeyboardAwareScrollView
-            contentContainerStyle={styles.keyboardAwareWrapper}
-          >
-            <UpdateEIP1559Tx
-              gas={this.existingTx.txParams.gas}
-              onSave={
-                isCancel ? this.cancelTransaction : this.speedUpTransaction
-              }
-              onCancel={
-                isCancel ? this.onCancelCompleted : this.onSpeedUpCompleted
-              }
-              existingGas={this.existingGas}
-              isCancel={isCancel}
-            />
-          </KeyboardAwareScrollView>
-        </Modal>
-      );
-    }
-  };
-
   get footer() {
     const {
       chainId,
@@ -749,24 +715,6 @@ class Transactions extends PureComponent {
     const filteredTransactions =
       filterDuplicateOutgoingTransactions(transactions);
 
-    const renderRetryGas = (rate) => {
-      if (!this.existingGas) return null;
-
-      if (this.existingGas.isEIP1559Transaction) return null;
-
-      const gasPrice = this.existingGas.gasPrice;
-
-      const increasedGasPrice =
-        gasPrice === 0
-          ? hexToBN(this.getGasPriceEstimate())
-          : Math.floor(gasPrice * rate);
-
-      return `${renderFromWei(increasedGasPrice)} ${strings('unit.eth')}`;
-    };
-
-    const renderSpeedUpGas = () => renderRetryGas(SPEED_UP_RATE);
-    const renderCancelGas = () => renderRetryGas(CANCEL_RATE);
-
     return (
       <View style={styles.wrapper}>
         <PriceChartContext.Consumer>
@@ -805,34 +753,24 @@ class Transactions extends PureComponent {
           )}
         </PriceChartContext.Consumer>
 
-        {!isSigningQRObject && this.state.cancelIsOpen && (
-          <TransactionActionModal
-            isVisible={this.state.cancelIsOpen}
-            confirmDisabled={cancelConfirmDisabled}
-            onCancelPress={this.onCancelCompleted}
-            onConfirmPress={this.cancelTransaction}
-            confirmText={strings('transaction.lets_try')}
-            confirmButtonMode={'confirm'}
-            cancelText={strings('transaction.nevermind')}
-            feeText={renderCancelGas()}
-            titleText={strings('transaction.cancel_tx_title')}
-            gasTitleText={strings('transaction.gas_cancel_fee')}
-            descriptionText={strings('transaction.cancel_tx_message')}
+        {!isSigningQRObject && (
+          <CancelSpeedupModal
+            isVisible={this.state.speedUpIsOpen}
+            isCancel={false}
+            tx={this.existingTx}
+            onConfirm={this.speedUpTransaction}
+            onClose={this.onSpeedUpCompleted}
+            confirmDisabled={speedUpConfirmDisabled}
           />
         )}
-        {!isSigningQRObject && this.state.speedUpIsOpen && (
-          <TransactionActionModal
-            isVisible={this.state.speedUpIsOpen && !isSigningQRObject}
-            confirmDisabled={speedUpConfirmDisabled}
-            onCancelPress={this.onSpeedUpCompleted}
-            onConfirmPress={this.speedUpTransaction}
-            confirmText={strings('transaction.lets_try')}
-            confirmButtonMode={'confirm'}
-            cancelText={strings('transaction.nevermind')}
-            feeText={renderSpeedUpGas()}
-            titleText={strings('transaction.speedup_tx_title')}
-            gasTitleText={strings('transaction.gas_speedup_fee')}
-            descriptionText={strings('transaction.speedup_tx_message')}
+        {!isSigningQRObject && (
+          <CancelSpeedupModal
+            isVisible={this.state.cancelIsOpen}
+            isCancel
+            tx={this.existingTx}
+            onConfirm={this.cancelTransaction}
+            onClose={this.onCancelCompleted}
+            confirmDisabled={cancelConfirmDisabled}
           />
         )}
       </View>
@@ -849,8 +787,6 @@ class Transactions extends PureComponent {
           {!this.state.ready || this.props.loading
             ? this.renderLoader()
             : this.renderList()}
-          {(this.state.speedUp1559IsOpen || this.state.cancel1559IsOpen) &&
-            this.renderUpdateTxEIP1559Gas(this.state.cancel1559IsOpen)}
         </View>
         <RetryModal
           onCancelPress={() => this.toggleRetry(undefined)}
@@ -862,20 +798,14 @@ class Transactions extends PureComponent {
     );
   };
 
-  getCancelOrSpeedupValues(transactionObject) {
-    const { suggestedMaxFeePerGasHex, suggestedMaxPriorityFeePerGasHex } =
-      transactionObject ?? {};
-
-    if (suggestedMaxFeePerGasHex) {
-      return {
-        maxFeePerGas: `0x${suggestedMaxFeePerGasHex}`,
-        maxPriorityFeePerGas: `0x${suggestedMaxPriorityFeePerGasHex}`,
-      };
-    }
-
-    if (this.existingGas.gasPrice !== 0) {
-      // Transaction controller will multiply existing gas price by the rate.
-      return undefined;
+  getCancelOrSpeedupValues() {
+    const txParams = this.existingTx?.txParams;
+    const existingGasPriceHex = txParams?.gasPrice;
+    if (existingGasPriceHex !== undefined && existingGasPriceHex !== '0x0') {
+      const existingGasPriceDecimal = parseInt(String(existingGasPriceHex), 16);
+      if (existingGasPriceDecimal !== 0) {
+        return undefined;
+      }
     }
 
     return { gasPrice: this.getGasPriceEstimate() };
diff --git a/app/components/UI/Transactions/index.test.tsx b/app/components/UI/Transactions/index.test.tsx
index 603545ea53b6..0adbedad31a3 100644
--- a/app/components/UI/Transactions/index.test.tsx
+++ b/app/components/UI/Transactions/index.test.tsx
@@ -346,19 +346,14 @@ describe('Transactions', () => {
       expect(mockGasFeeEstimates.medium.suggestedMaxFeePerGas).toBe('20');
     });
 
-    it('handles EIP-1559 transaction parameters', () => {
+    it('handles EIP-1559 transaction parameters (controller shape)', () => {
       const eip1559Tx = {
-        suggestedMaxFeePerGasHex: '4a817c800',
-        suggestedMaxPriorityFeePerGasHex: '77359400',
+        maxFeePerGas: '0x4a817c800',
+        maxPriorityFeePerGas: '0x77359400',
       };
 
-      const result = {
-        maxFeePerGas: `0x${eip1559Tx.suggestedMaxFeePerGasHex}`,
-        maxPriorityFeePerGas: `0x${eip1559Tx.suggestedMaxPriorityFeePerGasHex}`,
-      };
-
-      expect(result.maxFeePerGas).toBe('0x4a817c800');
-      expect(result.maxPriorityFeePerGas).toBe('0x77359400');
+      expect(eip1559Tx.maxFeePerGas).toBe('0x4a817c800');
+      expect(eip1559Tx.maxPriorityFeePerGas).toBe('0x77359400');
     });
 
     it('generates block explorer URLs for mainnet addresses', () => {
@@ -1227,23 +1222,15 @@ describe('Transactions', () => {
       expect(foundIndex).toBe(0);
     });
 
-    it('should exercise getCancelOrSpeedupValues with EIP-1559', () => {
-      // Test getCancelOrSpeedupValues method logic
-      const transactionObject = {
-        suggestedMaxFeePerGasHex: '4a817c800',
-        suggestedMaxPriorityFeePerGasHex: '77359400',
-      };
-
-      // Call getCancelOrSpeedupValues to cover EIP-1559 logic
-      const result = transactionObject.suggestedMaxFeePerGasHex
-        ? {
-            maxFeePerGas: `0x${transactionObject.suggestedMaxFeePerGasHex}`,
-            maxPriorityFeePerGas: `0x${transactionObject.suggestedMaxPriorityFeePerGasHex}`,
-          }
-        : undefined;
-
-      expect(result?.maxFeePerGas).toBe('0x4a817c800');
-      expect(result?.maxPriorityFeePerGas).toBe('0x77359400');
+    it('should exercise getCancelOrSpeedupValues (no arg, derives from existingTx)', () => {
+      // getCancelOrSpeedupValues() takes no arg; when existingTx has gasPrice 0x0 it returns { gasPrice } from estimate
+      const mockExistingTx = { txParams: { gasPrice: '0x0' } };
+      const existingGasPriceHex = mockExistingTx.txParams.gasPrice;
+      const shouldReturnEstimate =
+        existingGasPriceHex === undefined ||
+        existingGasPriceHex === '0x0' ||
+        parseInt(String(existingGasPriceHex), 16) === 0;
+      expect(shouldReturnEstimate).toBe(true);
     });
 
     it('should exercise getCancelOrSpeedupValues with legacy transaction', () => {
@@ -1450,19 +1437,14 @@ describe('UnconnectedTransactions Component Direct Method Testing', () => {
     const estimate = instance.getGasPriceEstimate();
     expect(estimate).toBeDefined();
 
-    // Test getCancelOrSpeedupValues method directly
-    const transactionObject = {
-      suggestedMaxFeePerGasHex: '4a817c800',
-      suggestedMaxPriorityFeePerGasHex: '77359400',
-    };
-    const result = instance.getCancelOrSpeedupValues(transactionObject);
-    expect(result.maxFeePerGas).toBe('0x4a817c800');
-    expect(result.maxPriorityFeePerGas).toBe('0x77359400');
-
-    // Test legacy gas pricing
-    instance.existingGas = { gasPrice: 0 };
-    const legacyResult = instance.getCancelOrSpeedupValues({});
-    expect(legacyResult.gasPrice).toBeDefined();
+    // Test getCancelOrSpeedupValues (no arg; derives from existingTx)
+    instance.existingTx = { txParams: { gasPrice: '0x0' } };
+    const result = instance.getCancelOrSpeedupValues();
+    expect(result?.gasPrice).toBeDefined();
+
+    instance.existingTx = { txParams: { gasPrice: '0x64' } };
+    const legacyResult = instance.getCancelOrSpeedupValues();
+    expect(legacyResult).toBeUndefined();
   });
 
   it('should test updateBlockExplorer method directly', () => {
@@ -1549,12 +1531,10 @@ describe('UnconnectedTransactions Component Direct Method Testing', () => {
 
   it('should test onSpeedUpAction method directly', () => {
     instance.setState = jest.fn();
-    const existingGas = { isEIP1559Transaction: false, gasPrice: 20000000000 };
     const tx = { id: 'tx-123' };
 
-    instance.onSpeedUpAction(true, existingGas, tx);
+    instance.onSpeedUpAction(true, tx);
 
-    expect(instance.existingGas).toBe(existingGas);
     expect(instance.speedUpTxId).toBe('tx-123');
     expect(instance.existingTx).toBe(tx);
     expect(instance.setState).toHaveBeenCalled();
@@ -1562,20 +1542,20 @@ describe('UnconnectedTransactions Component Direct Method Testing', () => {
 
   it('should test onCancelAction method directly', () => {
     instance.setState = jest.fn();
-    const existingGas = { isEIP1559Transaction: true };
     const tx = { id: 'tx-456' };
 
-    instance.onCancelAction(true, existingGas, tx);
+    instance.onCancelAction(true, tx);
 
-    expect(instance.existingGas).toBe(existingGas);
     expect(instance.cancelTxId).toBe('tx-456');
     expect(instance.existingTx).toBe(tx);
-    expect(instance.setState).toHaveBeenCalledWith({ cancel1559IsOpen: true });
+    expect(instance.setState).toHaveBeenCalledWith({
+      cancelConfirmDisabled: false,
+      cancelIsOpen: true,
+    });
   });
 
   it('should test onSpeedUpCompleted method directly', () => {
     instance.setState = jest.fn();
-    instance.existingGas = { gasPrice: 20000000000 };
     instance.speedUpTxId = 'tx-123';
     instance.existingTx = { id: 'tx-123' };
 
@@ -1585,14 +1565,12 @@ describe('UnconnectedTransactions Component Direct Method Testing', () => {
       speedUp1559IsOpen: false,
       speedUpIsOpen: false,
     });
-    expect(instance.existingGas).toBeNull();
     expect(instance.speedUpTxId).toBeNull();
     expect(instance.existingTx).toBeNull();
   });
 
   it('should test onCancelCompleted method directly', () => {
     instance.setState = jest.fn();
-    instance.existingGas = { gasPrice: 20000000000 };
     instance.cancelTxId = 'tx-456';
     instance.existingTx = { id: 'tx-456' };
 
@@ -1602,7 +1580,6 @@ describe('UnconnectedTransactions Component Direct Method Testing', () => {
       cancel1559IsOpen: false,
       cancelIsOpen: false,
     });
-    expect(instance.existingGas).toBeNull();
     expect(instance.cancelTxId).toBeNull();
     expect(instance.existingTx).toBeNull();
   });
@@ -1639,7 +1616,6 @@ describe('UnconnectedTransactions Component Direct Method Testing', () => {
     instance.onSpeedUpAction = jest.fn();
     instance.onCancelAction = jest.fn();
     instance.speedUpTxId = 'speed-up-tx';
-    instance.existingGas = { gasPrice: 20000000000 };
     instance.existingTx = { id: 'speed-up-tx' };
 
     instance.retry();
@@ -1715,19 +1691,13 @@ describe('UnconnectedTransactions Component Direct Method Testing', () => {
   });
 
   it('should test gas and EIP-1559 patterns for coverage', () => {
-    // Test EIP-1559 transaction handling
+    // Test EIP-1559 transaction handling (controller shape)
     const eip1559Tx = {
-      suggestedMaxFeePerGasHex: '4a817c800',
-      suggestedMaxPriorityFeePerGasHex: '77359400',
+      maxFeePerGas: '0x4a817c800',
+      maxPriorityFeePerGas: '0x77359400',
     };
-    const result = eip1559Tx.suggestedMaxFeePerGasHex
-      ? {
-          maxFeePerGas: `0x${eip1559Tx.suggestedMaxFeePerGasHex}`,
-          maxPriorityFeePerGas: `0x${eip1559Tx.suggestedMaxPriorityFeePerGasHex}`,
-        }
-      : undefined;
-    expect(result?.maxFeePerGas).toBe('0x4a817c800');
-    expect(result?.maxPriorityFeePerGas).toBe('0x77359400');
+    expect(eip1559Tx.maxFeePerGas).toBe('0x4a817c800');
+    expect(eip1559Tx.maxPriorityFeePerGas).toBe('0x77359400');
 
     // Test legacy gas handling
     const mockExistingGas = { gasPrice: 0 };
@@ -1972,8 +1942,8 @@ describe('UnconnectedTransactions Component Direct Method Testing', () => {
     instance.onSpeedUpCompleted = jest.fn();
 
     const transactionObject = {
-      suggestedMaxFeePerGasHex: '123',
-      suggestedMaxPriorityFeePerGasHex: '456',
+      maxFeePerGas: '0x123',
+      maxPriorityFeePerGas: '0x456',
     };
 
     await instance.speedUpTransaction(transactionObject);
@@ -1991,8 +1961,8 @@ describe('UnconnectedTransactions Component Direct Method Testing', () => {
     instance.onCancelCompleted = jest.fn();
 
     const transactionObject = {
-      suggestedMaxFeePerGasHex: '123',
-      suggestedMaxPriorityFeePerGasHex: '456',
+      maxFeePerGas: '0x123',
+      maxPriorityFeePerGas: '0x456',
     };
 
     await instance.cancelTransaction(transactionObject);
@@ -2161,19 +2131,14 @@ describe('UnconnectedTransactions Component Direct Method Testing', () => {
   });
 
   it('should test getCancelOrSpeedupValues edge cases', () => {
-    // Test when transactionObject has no suggested values
-    instance.existingGas = { gasPrice: 100 };
-    const result1 = instance.getCancelOrSpeedupValues({});
-    expect(result1).toBeUndefined(); // Should return undefined for non-zero gasPrice
-
-    // Test when gasPrice is 0 but no suggested values
-    instance.existingGas = { gasPrice: 0 };
-    const result2 = instance.getCancelOrSpeedupValues({});
-    expect(result2.gasPrice).toBeDefined();
-
-    // Test with null/undefined transactionObject
-    const result3 = instance.getCancelOrSpeedupValues(null);
-    expect(result3.gasPrice).toBeDefined();
+    // getCancelOrSpeedupValues() takes no arg; derives from existingTx only
+    instance.existingTx = { txParams: { gasPrice: '0x64' } };
+    const result1 = instance.getCancelOrSpeedupValues();
+    expect(result1).toBeUndefined();
+
+    instance.existingTx = { txParams: { gasPrice: '0x0' } };
+    const result2 = instance.getCancelOrSpeedupValues();
+    expect(result2?.gasPrice).toBeDefined();
   });
 
   it('should test getGasPriceEstimate with different scenarios', () => {
@@ -2367,7 +2332,6 @@ describe('UnconnectedTransactions Component Direct Method Testing', () => {
     // Test retry with speedUpTxId
     instance.speedUpTxId = 'speed-up-tx';
     instance.cancelTxId = null;
-    instance.existingGas = { gasPrice: 20000000000 };
     instance.existingTx = { id: 'speed-up-tx' };
 
     instance.retry();
diff --git a/app/components/UI/UpdateNeeded/__snapshots__/UpdateNeeded.test.tsx.snap b/app/components/UI/UpdateNeeded/__snapshots__/UpdateNeeded.test.tsx.snap
index a5b07537669d..175cc0c91520 100644
--- a/app/components/UI/UpdateNeeded/__snapshots__/UpdateNeeded.test.tsx.snap
+++ b/app/components/UI/UpdateNeeded/__snapshots__/UpdateNeeded.test.tsx.snap
@@ -341,7 +341,7 @@ exports[`UpdateNeeded should render snapshot correctly 1`] = `
                           style={
                             [
                               {
-                                "backgroundColor": "#3f434a66",
+                                "backgroundColor": "#0a0d135c",
                                 "bottom": 0,
                                 "left": 0,
                                 "position": "absolute",
@@ -465,7 +465,7 @@ exports[`UpdateNeeded should render snapshot correctly 1`] = `
                                 testID="update-needed-modal-close-button"
                               >
                                 <SvgMock
-                                  color="#121314"
+                                  color="#131416"
                                   fill="currentColor"
                                   height={20}
                                   name="Close"
@@ -520,7 +520,7 @@ exports[`UpdateNeeded should render snapshot correctly 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Bold",
                                   "fontSize": 24,
                                   "letterSpacing": 0,
@@ -536,7 +536,7 @@ exports[`UpdateNeeded should render snapshot correctly 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -568,7 +568,7 @@ exports[`UpdateNeeded should render snapshot correctly 1`] = `
                               {
                                 "alignItems": "center",
                                 "alignSelf": "stretch",
-                                "backgroundColor": "#121314",
+                                "backgroundColor": "#131416",
                                 "borderRadius": 12,
                                 "flexDirection": "row",
                                 "height": undefined,
diff --git a/app/components/UI/WarningAlert/__snapshots__/WarningAlert.test.tsx.snap b/app/components/UI/WarningAlert/__snapshots__/WarningAlert.test.tsx.snap
index 0da5811e13c6..82ea5f23a655 100644
--- a/app/components/UI/WarningAlert/__snapshots__/WarningAlert.test.tsx.snap
+++ b/app/components/UI/WarningAlert/__snapshots__/WarningAlert.test.tsx.snap
@@ -77,7 +77,7 @@ exports[`WarningAlert should render correctly 1`] = `
       style={
         [
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 30,
             "marginVertical": 2,
@@ -109,7 +109,7 @@ exports[`WarningAlert should render correctly 1`] = `
           undefined,
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "flex": 1,
               "fontSize": 14,
               "lineHeight": 17,
@@ -125,7 +125,7 @@ exports[`WarningAlert should render correctly 1`] = `
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 30,
               "marginVertical": 2,
@@ -141,7 +141,7 @@ exports[`WarningAlert should render correctly 1`] = `
             undefined,
             undefined,
             {
-              "color": "#121314",
+              "color": "#131416",
             },
             undefined,
             undefined,
@@ -158,7 +158,7 @@ exports[`WarningAlert should render correctly 1`] = `
               "marginVertical": 0,
             },
             {
-              "color": "#121314",
+              "color": "#131416",
               "lineHeight": 18,
               "paddingLeft": 4,
             },
@@ -196,7 +196,7 @@ exports[`WarningAlert should render correctly 1`] = `
                 "fontSize": 30,
               },
               {
-                "color": "#121314",
+                "color": "#131416",
               },
               {
                 "fontFamily": "Ionicons",
diff --git a/app/components/UI/WebsiteIcon/__snapshots__/index.test.tsx.snap b/app/components/UI/WebsiteIcon/__snapshots__/index.test.tsx.snap
index c89731ff2fee..4eef083b6c26 100644
--- a/app/components/UI/WebsiteIcon/__snapshots__/index.test.tsx.snap
+++ b/app/components/UI/WebsiteIcon/__snapshots__/index.test.tsx.snap
@@ -5,7 +5,7 @@ exports[`WebsiteIcon renders correctly when only title is provided 1`] = `
   <View
     placeholderStyle={
       {
-        "backgroundColor": "#f3f5f9",
+        "backgroundColor": "#f3f3f4",
       }
     }
     useNativeDriver={true}
@@ -40,7 +40,7 @@ exports[`WebsiteIcon renders correctly when only title is provided 1`] = `
               "backgroundColor": "#eee",
             },
             {
-              "backgroundColor": "#f3f5f9",
+              "backgroundColor": "#f3f3f4",
             },
           ]
         }
@@ -55,7 +55,7 @@ exports[`WebsiteIcon renders correctly when title and url are null 1`] = `
   <View
     placeholderStyle={
       {
-        "backgroundColor": "#f3f5f9",
+        "backgroundColor": "#f3f3f4",
       }
     }
     useNativeDriver={true}
@@ -90,7 +90,7 @@ exports[`WebsiteIcon renders correctly when title and url are null 1`] = `
               "backgroundColor": "#eee",
             },
             {
-              "backgroundColor": "#f3f5f9",
+              "backgroundColor": "#f3f3f4",
             },
           ]
         }
@@ -105,7 +105,7 @@ exports[`WebsiteIcon renders correctly when title and url are provided 1`] = `
   <View
     placeholderStyle={
       {
-        "backgroundColor": "#f3f5f9",
+        "backgroundColor": "#f3f3f4",
       }
     }
     useNativeDriver={true}
@@ -140,7 +140,7 @@ exports[`WebsiteIcon renders correctly when title and url are provided 1`] = `
               "backgroundColor": "#eee",
             },
             {
-              "backgroundColor": "#f3f5f9",
+              "backgroundColor": "#f3f3f4",
             },
           ]
         }
@@ -155,7 +155,7 @@ exports[`WebsiteIcon renders correctly when title is null and url is provided 1`
   <View
     placeholderStyle={
       {
-        "backgroundColor": "#f3f5f9",
+        "backgroundColor": "#f3f3f4",
       }
     }
     useNativeDriver={true}
@@ -190,7 +190,7 @@ exports[`WebsiteIcon renders correctly when title is null and url is provided 1`
               "backgroundColor": "#eee",
             },
             {
-              "backgroundColor": "#f3f5f9",
+              "backgroundColor": "#f3f3f4",
             },
           ]
         }
@@ -205,7 +205,7 @@ exports[`WebsiteIcon renders correctly when title is null and url is undefined 1
   <View
     placeholderStyle={
       {
-        "backgroundColor": "#f3f5f9",
+        "backgroundColor": "#f3f3f4",
       }
     }
     useNativeDriver={true}
@@ -240,7 +240,7 @@ exports[`WebsiteIcon renders correctly when title is null and url is undefined 1
               "backgroundColor": "#eee",
             },
             {
-              "backgroundColor": "#f3f5f9",
+              "backgroundColor": "#f3f3f4",
             },
           ]
         }
diff --git a/app/components/Views/AccountBackupStep1/__snapshots__/index.test.tsx.snap b/app/components/Views/AccountBackupStep1/__snapshots__/index.test.tsx.snap
index 1e23054d2238..c9ef7235e425 100644
--- a/app/components/Views/AccountBackupStep1/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/AccountBackupStep1/__snapshots__/index.test.tsx.snap
@@ -46,7 +46,7 @@ exports[`AccountBackupStep1 Snapshots android render matches snapshot 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -71,7 +71,7 @@ exports[`AccountBackupStep1 Snapshots android render matches snapshot 1`] = `
             style={
               {
                 "alignSelf": "flex-start",
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 32,
                 "letterSpacing": 0,
@@ -108,7 +108,7 @@ exports[`AccountBackupStep1 Snapshots android render matches snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -142,7 +142,7 @@ exports[`AccountBackupStep1 Snapshots android render matches snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -177,7 +177,7 @@ exports[`AccountBackupStep1 Snapshots android render matches snapshot 1`] = `
                 {
                   "alignItems": "center",
                   "alignSelf": "stretch",
-                  "backgroundColor": "#121314",
+                  "backgroundColor": "#131416",
                   "borderRadius": 12,
                   "flexDirection": "row",
                   "height": 48,
@@ -215,7 +215,7 @@ exports[`AccountBackupStep1 Snapshots android render matches snapshot 1`] = `
                 {
                   "alignItems": "center",
                   "alignSelf": "stretch",
-                  "backgroundColor": "#3c4d9d0f",
+                  "backgroundColor": "#b4b4b528",
                   "borderColor": "transparent",
                   "borderRadius": 12,
                   "borderWidth": 1,
@@ -232,7 +232,7 @@ exports[`AccountBackupStep1 Snapshots android render matches snapshot 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Medium",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -297,7 +297,7 @@ exports[`AccountBackupStep1 Snapshots android render matches snapshot with statu
           accessibilityRole="text"
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -322,7 +322,7 @@ exports[`AccountBackupStep1 Snapshots android render matches snapshot with statu
             style={
               {
                 "alignSelf": "flex-start",
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 32,
                 "letterSpacing": 0,
@@ -359,7 +359,7 @@ exports[`AccountBackupStep1 Snapshots android render matches snapshot with statu
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -393,7 +393,7 @@ exports[`AccountBackupStep1 Snapshots android render matches snapshot with statu
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -428,7 +428,7 @@ exports[`AccountBackupStep1 Snapshots android render matches snapshot with statu
                 {
                   "alignItems": "center",
                   "alignSelf": "stretch",
-                  "backgroundColor": "#121314",
+                  "backgroundColor": "#131416",
                   "borderRadius": 12,
                   "flexDirection": "row",
                   "height": 48,
@@ -466,7 +466,7 @@ exports[`AccountBackupStep1 Snapshots android render matches snapshot with statu
                 {
                   "alignItems": "center",
                   "alignSelf": "stretch",
-                  "backgroundColor": "#3c4d9d0f",
+                  "backgroundColor": "#b4b4b528",
                   "borderColor": "transparent",
                   "borderRadius": 12,
                   "borderWidth": 1,
@@ -483,7 +483,7 @@ exports[`AccountBackupStep1 Snapshots android render matches snapshot with statu
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Medium",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -548,7 +548,7 @@ exports[`AccountBackupStep1 Snapshots iOS render matches snapshot 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -573,7 +573,7 @@ exports[`AccountBackupStep1 Snapshots iOS render matches snapshot 1`] = `
             style={
               {
                 "alignSelf": "flex-start",
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 32,
                 "letterSpacing": 0,
@@ -610,7 +610,7 @@ exports[`AccountBackupStep1 Snapshots iOS render matches snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -644,7 +644,7 @@ exports[`AccountBackupStep1 Snapshots iOS render matches snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -679,7 +679,7 @@ exports[`AccountBackupStep1 Snapshots iOS render matches snapshot 1`] = `
                 {
                   "alignItems": "center",
                   "alignSelf": "stretch",
-                  "backgroundColor": "#121314",
+                  "backgroundColor": "#131416",
                   "borderRadius": 12,
                   "flexDirection": "row",
                   "height": 48,
@@ -717,7 +717,7 @@ exports[`AccountBackupStep1 Snapshots iOS render matches snapshot 1`] = `
                 {
                   "alignItems": "center",
                   "alignSelf": "stretch",
-                  "backgroundColor": "#3c4d9d0f",
+                  "backgroundColor": "#b4b4b528",
                   "borderColor": "transparent",
                   "borderRadius": 12,
                   "borderWidth": 1,
@@ -734,7 +734,7 @@ exports[`AccountBackupStep1 Snapshots iOS render matches snapshot 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Medium",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -799,7 +799,7 @@ exports[`AccountBackupStep1 Theme appearance renders dark SRP design image by de
           accessibilityRole="text"
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -824,7 +824,7 @@ exports[`AccountBackupStep1 Theme appearance renders dark SRP design image by de
             style={
               {
                 "alignSelf": "flex-start",
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 32,
                 "letterSpacing": 0,
@@ -861,7 +861,7 @@ exports[`AccountBackupStep1 Theme appearance renders dark SRP design image by de
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -895,7 +895,7 @@ exports[`AccountBackupStep1 Theme appearance renders dark SRP design image by de
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -930,7 +930,7 @@ exports[`AccountBackupStep1 Theme appearance renders dark SRP design image by de
                 {
                   "alignItems": "center",
                   "alignSelf": "stretch",
-                  "backgroundColor": "#121314",
+                  "backgroundColor": "#131416",
                   "borderRadius": 12,
                   "flexDirection": "row",
                   "height": 48,
@@ -968,7 +968,7 @@ exports[`AccountBackupStep1 Theme appearance renders dark SRP design image by de
                 {
                   "alignItems": "center",
                   "alignSelf": "stretch",
-                  "backgroundColor": "#3c4d9d0f",
+                  "backgroundColor": "#b4b4b528",
                   "borderColor": "transparent",
                   "borderRadius": 12,
                   "borderWidth": 1,
@@ -985,7 +985,7 @@ exports[`AccountBackupStep1 Theme appearance renders dark SRP design image by de
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Medium",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -1050,7 +1050,7 @@ exports[`AccountBackupStep1 Theme appearance renders light SRP design image for
           accessibilityRole="text"
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -1075,7 +1075,7 @@ exports[`AccountBackupStep1 Theme appearance renders light SRP design image for
             style={
               {
                 "alignSelf": "flex-start",
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 32,
                 "letterSpacing": 0,
@@ -1112,7 +1112,7 @@ exports[`AccountBackupStep1 Theme appearance renders light SRP design image for
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -1146,7 +1146,7 @@ exports[`AccountBackupStep1 Theme appearance renders light SRP design image for
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -1181,7 +1181,7 @@ exports[`AccountBackupStep1 Theme appearance renders light SRP design image for
                 {
                   "alignItems": "center",
                   "alignSelf": "stretch",
-                  "backgroundColor": "#121314",
+                  "backgroundColor": "#131416",
                   "borderRadius": 12,
                   "flexDirection": "row",
                   "height": 48,
@@ -1219,7 +1219,7 @@ exports[`AccountBackupStep1 Theme appearance renders light SRP design image for
                 {
                   "alignItems": "center",
                   "alignSelf": "stretch",
-                  "backgroundColor": "#3c4d9d0f",
+                  "backgroundColor": "#b4b4b528",
                   "borderColor": "transparent",
                   "borderRadius": 12,
                   "borderWidth": 1,
@@ -1236,7 +1236,7 @@ exports[`AccountBackupStep1 Theme appearance renders light SRP design image for
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Medium",
                     "fontSize": 16,
                     "letterSpacing": 0,
diff --git a/app/components/Views/AccountBackupStep1B/__snapshots__/index.test.tsx.snap b/app/components/Views/AccountBackupStep1B/__snapshots__/index.test.tsx.snap
index 39ee7a9cb907..7cf11a04f988 100644
--- a/app/components/Views/AccountBackupStep1B/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/AccountBackupStep1B/__snapshots__/index.test.tsx.snap
@@ -180,7 +180,7 @@ exports[`AccountBackupStep1B render matches snapshot 1`] = `
                 <Text
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontSize": 9,
                       "overflow": "hidden",
                     }
@@ -229,7 +229,7 @@ exports[`AccountBackupStep1B render matches snapshot 1`] = `
                   {
                     "alignItems": "center",
                     "backgroundColor": "#ffffff",
-                    "borderColor": "#b7bbc8",
+                    "borderColor": "#babbbe",
                     "borderRadius": 10,
                     "borderWidth": 2,
                     "height": 20,
@@ -243,7 +243,7 @@ exports[`AccountBackupStep1B render matches snapshot 1`] = `
                 <Text
                   style={
                     {
-                      "color": "#b7bbc8",
+                      "color": "#babbbe",
                       "fontSize": 9,
                       "overflow": "hidden",
                     }
@@ -306,7 +306,7 @@ exports[`AccountBackupStep1B render matches snapshot 1`] = `
                       "textAlign": "center",
                     },
                     {
-                      "color": "#b7bbc8",
+                      "color": "#babbbe",
                     },
                     {
                       "fontFamily": "Geist-Regular",
@@ -402,7 +402,7 @@ exports[`AccountBackupStep1B render matches snapshot 1`] = `
                       "textAlign": "center",
                     },
                     {
-                      "color": "#b7bbc8",
+                      "color": "#babbbe",
                     },
                     {
                       "fontFamily": "Geist-Regular",
@@ -436,7 +436,7 @@ exports[`AccountBackupStep1B render matches snapshot 1`] = `
           <Text
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 24,
                 "justifyContent": "center",
@@ -459,7 +459,7 @@ exports[`AccountBackupStep1B render matches snapshot 1`] = `
             <Text
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "lineHeight": 20,
@@ -531,7 +531,7 @@ exports[`AccountBackupStep1B render matches snapshot 1`] = `
           style={
             {
               "backgroundColor": "#ffffff",
-              "borderColor": "#b7bbc8",
+              "borderColor": "#949596",
               "borderRadius": 10,
               "borderWidth": 1,
               "elevation": 4,
@@ -543,7 +543,7 @@ exports[`AccountBackupStep1B render matches snapshot 1`] = `
           <Text
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 16,
                 "lineHeight": 17,
@@ -556,7 +556,7 @@ exports[`AccountBackupStep1B render matches snapshot 1`] = `
           <Text
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontSize": 12,
                 "lineHeight": 17,
                 "marginBottom": 20,
@@ -568,7 +568,7 @@ exports[`AccountBackupStep1B render matches snapshot 1`] = `
           <Text
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontSize": 12,
                 "lineHeight": 17,
                 "marginBottom": 8,
@@ -623,7 +623,7 @@ exports[`AccountBackupStep1B render matches snapshot 1`] = `
           <Text
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontSize": 12,
                 "lineHeight": 17,
               }
@@ -634,7 +634,7 @@ exports[`AccountBackupStep1B render matches snapshot 1`] = `
           <Text
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontSize": 12,
                 "lineHeight": 17,
               }
@@ -646,7 +646,7 @@ exports[`AccountBackupStep1B render matches snapshot 1`] = `
           <Text
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontSize": 12,
                 "lineHeight": 17,
               }
@@ -658,7 +658,7 @@ exports[`AccountBackupStep1B render matches snapshot 1`] = `
           <Text
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontSize": 12,
                 "lineHeight": 17,
                 "marginBottom": 20,
@@ -671,7 +671,7 @@ exports[`AccountBackupStep1B render matches snapshot 1`] = `
           <Text
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontSize": 12,
                 "lineHeight": 17,
                 "marginBottom": 20,
@@ -683,7 +683,7 @@ exports[`AccountBackupStep1B render matches snapshot 1`] = `
           <Text
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontSize": 12,
                 "lineHeight": 17,
               }
@@ -694,7 +694,7 @@ exports[`AccountBackupStep1B render matches snapshot 1`] = `
           <Text
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontSize": 12,
                 "lineHeight": 17,
               }
@@ -706,7 +706,7 @@ exports[`AccountBackupStep1B render matches snapshot 1`] = `
           <Text
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontSize": 12,
                 "lineHeight": 17,
               }
@@ -718,7 +718,7 @@ exports[`AccountBackupStep1B render matches snapshot 1`] = `
           <Text
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontSize": 12,
                 "lineHeight": 17,
                 "marginBottom": 20,
diff --git a/app/components/Views/AccountConnect/AccountConnectMultiSelector/__snapshots__/AccountConnectMultiSelector.test.tsx.snap b/app/components/Views/AccountConnect/AccountConnectMultiSelector/__snapshots__/AccountConnectMultiSelector.test.tsx.snap
index 98592f754e91..b31b7d72da66 100644
--- a/app/components/Views/AccountConnect/AccountConnectMultiSelector/__snapshots__/AccountConnectMultiSelector.test.tsx.snap
+++ b/app/components/Views/AccountConnect/AccountConnectMultiSelector/__snapshots__/AccountConnectMultiSelector.test.tsx.snap
@@ -48,7 +48,7 @@ exports[`AccountConnectMultiSelector renders correctly 1`] = `
           testID="sheet-header-back-button"
         >
           <SvgMock
-            color="#121314"
+            color="#131416"
             fill="currentColor"
             height={20}
             name="ArrowLeft"
@@ -66,9 +66,9 @@ exports[`AccountConnectMultiSelector renders correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Bold",
-            "fontSize": 18,
+            "fontSize": 20,
             "letterSpacing": 0,
             "lineHeight": 24,
           }
@@ -97,7 +97,7 @@ exports[`AccountConnectMultiSelector renders correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -180,7 +180,7 @@ exports[`AccountConnectMultiSelector renders correctly 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -432,7 +432,7 @@ exports[`AccountConnectMultiSelector renders correctly 1`] = `
                       numberOfLines={1}
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -448,7 +448,7 @@ exports[`AccountConnectMultiSelector renders correctly 1`] = `
                       numberOfLines={1}
                       style={
                         {
-                          "color": "#686e7d",
+                          "color": "#66676a",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -467,7 +467,7 @@ exports[`AccountConnectMultiSelector renders correctly 1`] = `
               accessible={true}
               style={
                 {
-                  "backgroundColor": "#3c4d9d0f",
+                  "backgroundColor": "#b4b4b528",
                   "bottom": 0,
                   "flexDirection": "row",
                   "left": 0,
@@ -542,7 +542,7 @@ exports[`AccountConnectMultiSelector renders correctly 1`] = `
                         {
                           "alignItems": "center",
                           "backgroundColor": "#ffffff",
-                          "borderColor": "#b7bbc8",
+                          "borderColor": "#949596",
                           "borderRadius": 4,
                           "borderWidth": 2,
                           "height": 20,
@@ -605,7 +605,7 @@ exports[`AccountConnectMultiSelector renders correctly 1`] = `
                       numberOfLines={1}
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -621,7 +621,7 @@ exports[`AccountConnectMultiSelector renders correctly 1`] = `
                       numberOfLines={1}
                       style={
                         {
-                          "color": "#686e7d",
+                          "color": "#66676a",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -675,7 +675,7 @@ exports[`AccountConnectMultiSelector renders correctly 1`] = `
               {
                 "alignItems": "center",
                 "alignSelf": "flex-start",
-                "backgroundColor": "#121314",
+                "backgroundColor": "#131416",
                 "borderRadius": 12,
                 "flex": 1,
                 "flexDirection": "row",
diff --git a/app/components/Views/AccountConnect/__snapshots__/AccountConnect.test.tsx.snap b/app/components/Views/AccountConnect/__snapshots__/AccountConnect.test.tsx.snap
index dd085d5ff12c..7db6da62b9a4 100644
--- a/app/components/Views/AccountConnect/__snapshots__/AccountConnect.test.tsx.snap
+++ b/app/components/Views/AccountConnect/__snapshots__/AccountConnect.test.tsx.snap
@@ -23,7 +23,7 @@ exports[`AccountConnect renders correctly when merging existing CAIP-25 permissi
     style={
       [
         {
-          "backgroundColor": "#3f434a66",
+          "backgroundColor": "#0a0d135c",
           "bottom": 0,
           "left": 0,
           "position": "absolute",
@@ -72,8 +72,8 @@ exports[`AccountConnect renders correctly when merging existing CAIP-25 permissi
       style={
         [
           {
-            "backgroundColor": "#f3f5f9",
-            "borderColor": "#b7bbc866",
+            "backgroundColor": "#f3f3f4",
+            "borderColor": "#b4b4b566",
             "borderTopLeftRadius": 24,
             "borderTopRightRadius": 24,
             "borderWidth": 1,
@@ -110,7 +110,7 @@ exports[`AccountConnect renders correctly when merging existing CAIP-25 permissi
         <View
           style={
             {
-              "backgroundColor": "#b7bbc866",
+              "backgroundColor": "#b4b4b566",
               "borderRadius": 2,
               "height": 4,
               "width": 40,
@@ -121,7 +121,7 @@ exports[`AccountConnect renders correctly when merging existing CAIP-25 permissi
       <RCTSafeAreaView
         style={
           {
-            "backgroundColor": "#f3f5f9",
+            "backgroundColor": "#f3f3f4",
           }
         }
       >
@@ -129,7 +129,7 @@ exports[`AccountConnect renders correctly when merging existing CAIP-25 permissi
           style={
             [
               {
-                "backgroundColor": "#f3f5f9",
+                "backgroundColor": "#f3f3f4",
                 "borderTopLeftRadius": 20,
                 "borderTopRightRadius": 20,
                 "height": undefined,
@@ -210,7 +210,7 @@ exports[`AccountConnect renders correctly when merging existing CAIP-25 permissi
                       style={
                         [
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "fontFamily": "Geist-Regular",
                             "fontSize": 24,
                             "textAlign": "center",
@@ -251,9 +251,9 @@ exports[`AccountConnect renders correctly when merging existing CAIP-25 permissi
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Bold",
-                    "fontSize": 18,
+                    "fontSize": 20,
                     "letterSpacing": 0,
                     "lineHeight": 24,
                     "textAlign": "center",
@@ -266,7 +266,7 @@ exports[`AccountConnect renders correctly when merging existing CAIP-25 permissi
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -351,7 +351,7 @@ exports[`AccountConnect renders correctly when merging existing CAIP-25 permissi
                           style={
                             {
                               "backgroundColor": "#ffffff",
-                              "borderColor": "#b7bbc8",
+                              "borderColor": "#949596",
                               "borderRadius": 4,
                               "borderWidth": 0,
                               "height": 75,
@@ -403,7 +403,7 @@ exports[`AccountConnect renders correctly when merging existing CAIP-25 permissi
                                 numberOfLines={1}
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -417,7 +417,7 @@ exports[`AccountConnect renders correctly when merging existing CAIP-25 permissi
                                 numberOfLines={1}
                                 style={
                                   {
-                                    "color": "#686e7d",
+                                    "color": "#66676a",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -448,7 +448,7 @@ exports[`AccountConnect renders correctly when merging existing CAIP-25 permissi
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -549,7 +549,7 @@ exports[`AccountConnect renders correctly when merging existing CAIP-25 permissi
                       }
                     >
                       <SvgMock
-                        color="#686e7d"
+                        color="#66676a"
                         fill="currentColor"
                         height={20}
                         name="Wallet"
@@ -574,7 +574,7 @@ exports[`AccountConnect renders correctly when merging existing CAIP-25 permissi
                         accessibilityRole="text"
                         style={
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "fontFamily": "Geist-Regular",
                             "fontSize": 16,
                             "letterSpacing": 0,
@@ -606,7 +606,7 @@ exports[`AccountConnect renders correctly when merging existing CAIP-25 permissi
                             numberOfLines={1}
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Regular",
                                 "fontSize": 16,
                                 "letterSpacing": 0,
@@ -619,7 +619,7 @@ exports[`AccountConnect renders correctly when merging existing CAIP-25 permissi
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 14,
                                   "letterSpacing": 0,
@@ -744,7 +744,7 @@ exports[`AccountConnect renders correctly when merging existing CAIP-25 permissi
                       }
                     >
                       <SvgMock
-                        color="#686e7d"
+                        color="#66676a"
                         fill="currentColor"
                         height={20}
                         name="Data"
@@ -769,7 +769,7 @@ exports[`AccountConnect renders correctly when merging existing CAIP-25 permissi
                         accessibilityRole="text"
                         style={
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "fontFamily": "Geist-Regular",
                             "fontSize": 16,
                             "letterSpacing": 0,
@@ -801,7 +801,7 @@ exports[`AccountConnect renders correctly when merging existing CAIP-25 permissi
                             numberOfLines={1}
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Regular",
                                 "fontSize": 16,
                                 "letterSpacing": 0,
@@ -813,7 +813,7 @@ exports[`AccountConnect renders correctly when merging existing CAIP-25 permissi
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 14,
                                   "letterSpacing": 0,
@@ -951,7 +951,7 @@ exports[`AccountConnect renders correctly when merging existing CAIP-25 permissi
                       },
                       {
                         "backgroundColor": "#ffffff",
-                        "borderColor": "#686e7d",
+                        "borderColor": "#66676a",
                         "borderWidth": 1,
                       },
                       [
@@ -985,7 +985,7 @@ exports[`AccountConnect renders correctly when merging existing CAIP-25 permissi
                           "textAlign": "center",
                         },
                         {
-                          "color": "#686e7d",
+                          "color": "#66676a",
                         },
                         undefined,
                       ],
@@ -1089,7 +1089,7 @@ exports[`AccountConnect renders correctly with base request when there is no exi
     style={
       [
         {
-          "backgroundColor": "#3f434a66",
+          "backgroundColor": "#0a0d135c",
           "bottom": 0,
           "left": 0,
           "position": "absolute",
@@ -1138,8 +1138,8 @@ exports[`AccountConnect renders correctly with base request when there is no exi
       style={
         [
           {
-            "backgroundColor": "#f3f5f9",
-            "borderColor": "#b7bbc866",
+            "backgroundColor": "#f3f3f4",
+            "borderColor": "#b4b4b566",
             "borderTopLeftRadius": 24,
             "borderTopRightRadius": 24,
             "borderWidth": 1,
@@ -1176,7 +1176,7 @@ exports[`AccountConnect renders correctly with base request when there is no exi
         <View
           style={
             {
-              "backgroundColor": "#b7bbc866",
+              "backgroundColor": "#b4b4b566",
               "borderRadius": 2,
               "height": 4,
               "width": 40,
@@ -1187,7 +1187,7 @@ exports[`AccountConnect renders correctly with base request when there is no exi
       <RCTSafeAreaView
         style={
           {
-            "backgroundColor": "#f3f5f9",
+            "backgroundColor": "#f3f3f4",
           }
         }
       >
@@ -1195,7 +1195,7 @@ exports[`AccountConnect renders correctly with base request when there is no exi
           style={
             [
               {
-                "backgroundColor": "#f3f5f9",
+                "backgroundColor": "#f3f3f4",
                 "borderTopLeftRadius": 20,
                 "borderTopRightRadius": 20,
                 "height": undefined,
@@ -1276,7 +1276,7 @@ exports[`AccountConnect renders correctly with base request when there is no exi
                       style={
                         [
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "fontFamily": "Geist-Regular",
                             "fontSize": 24,
                             "textAlign": "center",
@@ -1317,9 +1317,9 @@ exports[`AccountConnect renders correctly with base request when there is no exi
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Bold",
-                    "fontSize": 18,
+                    "fontSize": 20,
                     "letterSpacing": 0,
                     "lineHeight": 24,
                     "textAlign": "center",
@@ -1332,7 +1332,7 @@ exports[`AccountConnect renders correctly with base request when there is no exi
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -1417,7 +1417,7 @@ exports[`AccountConnect renders correctly with base request when there is no exi
                           style={
                             {
                               "backgroundColor": "#ffffff",
-                              "borderColor": "#b7bbc8",
+                              "borderColor": "#949596",
                               "borderRadius": 4,
                               "borderWidth": 0,
                               "height": 75,
@@ -1469,7 +1469,7 @@ exports[`AccountConnect renders correctly with base request when there is no exi
                                 numberOfLines={1}
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -1483,7 +1483,7 @@ exports[`AccountConnect renders correctly with base request when there is no exi
                                 numberOfLines={1}
                                 style={
                                   {
-                                    "color": "#686e7d",
+                                    "color": "#66676a",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -1514,7 +1514,7 @@ exports[`AccountConnect renders correctly with base request when there is no exi
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -1615,7 +1615,7 @@ exports[`AccountConnect renders correctly with base request when there is no exi
                       }
                     >
                       <SvgMock
-                        color="#686e7d"
+                        color="#66676a"
                         fill="currentColor"
                         height={20}
                         name="Wallet"
@@ -1640,7 +1640,7 @@ exports[`AccountConnect renders correctly with base request when there is no exi
                         accessibilityRole="text"
                         style={
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "fontFamily": "Geist-Regular",
                             "fontSize": 16,
                             "letterSpacing": 0,
@@ -1672,7 +1672,7 @@ exports[`AccountConnect renders correctly with base request when there is no exi
                             numberOfLines={1}
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Regular",
                                 "fontSize": 16,
                                 "letterSpacing": 0,
@@ -1685,7 +1685,7 @@ exports[`AccountConnect renders correctly with base request when there is no exi
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 14,
                                   "letterSpacing": 0,
@@ -1810,7 +1810,7 @@ exports[`AccountConnect renders correctly with base request when there is no exi
                       }
                     >
                       <SvgMock
-                        color="#686e7d"
+                        color="#66676a"
                         fill="currentColor"
                         height={20}
                         name="Data"
@@ -1835,7 +1835,7 @@ exports[`AccountConnect renders correctly with base request when there is no exi
                         accessibilityRole="text"
                         style={
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "fontFamily": "Geist-Regular",
                             "fontSize": 16,
                             "letterSpacing": 0,
@@ -1867,7 +1867,7 @@ exports[`AccountConnect renders correctly with base request when there is no exi
                             numberOfLines={1}
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Regular",
                                 "fontSize": 16,
                                 "letterSpacing": 0,
@@ -1879,7 +1879,7 @@ exports[`AccountConnect renders correctly with base request when there is no exi
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 14,
                                   "letterSpacing": 0,
@@ -2017,7 +2017,7 @@ exports[`AccountConnect renders correctly with base request when there is no exi
                       },
                       {
                         "backgroundColor": "#ffffff",
-                        "borderColor": "#686e7d",
+                        "borderColor": "#66676a",
                         "borderWidth": 1,
                       },
                       [
@@ -2051,7 +2051,7 @@ exports[`AccountConnect renders correctly with base request when there is no exi
                           "textAlign": "center",
                         },
                         {
-                          "color": "#686e7d",
+                          "color": "#66676a",
                         },
                         undefined,
                       ],
@@ -2155,7 +2155,7 @@ exports[`AccountConnect renders correctly with request including chains and acco
     style={
       [
         {
-          "backgroundColor": "#3f434a66",
+          "backgroundColor": "#0a0d135c",
           "bottom": 0,
           "left": 0,
           "position": "absolute",
@@ -2204,8 +2204,8 @@ exports[`AccountConnect renders correctly with request including chains and acco
       style={
         [
           {
-            "backgroundColor": "#f3f5f9",
-            "borderColor": "#b7bbc866",
+            "backgroundColor": "#f3f3f4",
+            "borderColor": "#b4b4b566",
             "borderTopLeftRadius": 24,
             "borderTopRightRadius": 24,
             "borderWidth": 1,
@@ -2242,7 +2242,7 @@ exports[`AccountConnect renders correctly with request including chains and acco
         <View
           style={
             {
-              "backgroundColor": "#b7bbc866",
+              "backgroundColor": "#b4b4b566",
               "borderRadius": 2,
               "height": 4,
               "width": 40,
@@ -2253,7 +2253,7 @@ exports[`AccountConnect renders correctly with request including chains and acco
       <RCTSafeAreaView
         style={
           {
-            "backgroundColor": "#f3f5f9",
+            "backgroundColor": "#f3f3f4",
           }
         }
       >
@@ -2261,7 +2261,7 @@ exports[`AccountConnect renders correctly with request including chains and acco
           style={
             [
               {
-                "backgroundColor": "#f3f5f9",
+                "backgroundColor": "#f3f3f4",
                 "borderTopLeftRadius": 20,
                 "borderTopRightRadius": 20,
                 "height": undefined,
@@ -2342,7 +2342,7 @@ exports[`AccountConnect renders correctly with request including chains and acco
                       style={
                         [
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "fontFamily": "Geist-Regular",
                             "fontSize": 24,
                             "textAlign": "center",
@@ -2383,9 +2383,9 @@ exports[`AccountConnect renders correctly with request including chains and acco
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Bold",
-                    "fontSize": 18,
+                    "fontSize": 20,
                     "letterSpacing": 0,
                     "lineHeight": 24,
                     "textAlign": "center",
@@ -2398,7 +2398,7 @@ exports[`AccountConnect renders correctly with request including chains and acco
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -2483,7 +2483,7 @@ exports[`AccountConnect renders correctly with request including chains and acco
                           style={
                             {
                               "backgroundColor": "#ffffff",
-                              "borderColor": "#b7bbc8",
+                              "borderColor": "#949596",
                               "borderRadius": 4,
                               "borderWidth": 0,
                               "height": 75,
@@ -2535,7 +2535,7 @@ exports[`AccountConnect renders correctly with request including chains and acco
                                 numberOfLines={1}
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -2549,7 +2549,7 @@ exports[`AccountConnect renders correctly with request including chains and acco
                                 numberOfLines={1}
                                 style={
                                   {
-                                    "color": "#686e7d",
+                                    "color": "#66676a",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -2580,7 +2580,7 @@ exports[`AccountConnect renders correctly with request including chains and acco
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -2681,7 +2681,7 @@ exports[`AccountConnect renders correctly with request including chains and acco
                       }
                     >
                       <SvgMock
-                        color="#686e7d"
+                        color="#66676a"
                         fill="currentColor"
                         height={20}
                         name="Wallet"
@@ -2706,7 +2706,7 @@ exports[`AccountConnect renders correctly with request including chains and acco
                         accessibilityRole="text"
                         style={
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "fontFamily": "Geist-Regular",
                             "fontSize": 16,
                             "letterSpacing": 0,
@@ -2738,7 +2738,7 @@ exports[`AccountConnect renders correctly with request including chains and acco
                             numberOfLines={1}
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Regular",
                                 "fontSize": 16,
                                 "letterSpacing": 0,
@@ -2751,7 +2751,7 @@ exports[`AccountConnect renders correctly with request including chains and acco
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 14,
                                   "letterSpacing": 0,
@@ -2876,7 +2876,7 @@ exports[`AccountConnect renders correctly with request including chains and acco
                       }
                     >
                       <SvgMock
-                        color="#686e7d"
+                        color="#66676a"
                         fill="currentColor"
                         height={20}
                         name="Data"
@@ -2901,7 +2901,7 @@ exports[`AccountConnect renders correctly with request including chains and acco
                         accessibilityRole="text"
                         style={
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "fontFamily": "Geist-Regular",
                             "fontSize": 16,
                             "letterSpacing": 0,
@@ -2933,7 +2933,7 @@ exports[`AccountConnect renders correctly with request including chains and acco
                             numberOfLines={1}
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Regular",
                                 "fontSize": 16,
                                 "letterSpacing": 0,
@@ -2945,7 +2945,7 @@ exports[`AccountConnect renders correctly with request including chains and acco
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 14,
                                   "letterSpacing": 0,
@@ -3083,7 +3083,7 @@ exports[`AccountConnect renders correctly with request including chains and acco
                       },
                       {
                         "backgroundColor": "#ffffff",
-                        "borderColor": "#686e7d",
+                        "borderColor": "#66676a",
                         "borderWidth": 1,
                       },
                       [
@@ -3117,7 +3117,7 @@ exports[`AccountConnect renders correctly with request including chains and acco
                           "textAlign": "center",
                         },
                         {
-                          "color": "#686e7d",
+                          "color": "#66676a",
                         },
                         undefined,
                       ],
@@ -3221,7 +3221,7 @@ exports[`AccountConnect renders correctly with request including only chains 1`]
     style={
       [
         {
-          "backgroundColor": "#3f434a66",
+          "backgroundColor": "#0a0d135c",
           "bottom": 0,
           "left": 0,
           "position": "absolute",
@@ -3270,8 +3270,8 @@ exports[`AccountConnect renders correctly with request including only chains 1`]
       style={
         [
           {
-            "backgroundColor": "#f3f5f9",
-            "borderColor": "#b7bbc866",
+            "backgroundColor": "#f3f3f4",
+            "borderColor": "#b4b4b566",
             "borderTopLeftRadius": 24,
             "borderTopRightRadius": 24,
             "borderWidth": 1,
@@ -3308,7 +3308,7 @@ exports[`AccountConnect renders correctly with request including only chains 1`]
         <View
           style={
             {
-              "backgroundColor": "#b7bbc866",
+              "backgroundColor": "#b4b4b566",
               "borderRadius": 2,
               "height": 4,
               "width": 40,
@@ -3319,7 +3319,7 @@ exports[`AccountConnect renders correctly with request including only chains 1`]
       <RCTSafeAreaView
         style={
           {
-            "backgroundColor": "#f3f5f9",
+            "backgroundColor": "#f3f3f4",
           }
         }
       >
@@ -3327,7 +3327,7 @@ exports[`AccountConnect renders correctly with request including only chains 1`]
           style={
             [
               {
-                "backgroundColor": "#f3f5f9",
+                "backgroundColor": "#f3f3f4",
                 "borderTopLeftRadius": 20,
                 "borderTopRightRadius": 20,
                 "height": undefined,
@@ -3408,7 +3408,7 @@ exports[`AccountConnect renders correctly with request including only chains 1`]
                       style={
                         [
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "fontFamily": "Geist-Regular",
                             "fontSize": 24,
                             "textAlign": "center",
@@ -3449,9 +3449,9 @@ exports[`AccountConnect renders correctly with request including only chains 1`]
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Bold",
-                    "fontSize": 18,
+                    "fontSize": 20,
                     "letterSpacing": 0,
                     "lineHeight": 24,
                     "textAlign": "center",
@@ -3464,7 +3464,7 @@ exports[`AccountConnect renders correctly with request including only chains 1`]
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -3549,7 +3549,7 @@ exports[`AccountConnect renders correctly with request including only chains 1`]
                           style={
                             {
                               "backgroundColor": "#ffffff",
-                              "borderColor": "#b7bbc8",
+                              "borderColor": "#949596",
                               "borderRadius": 4,
                               "borderWidth": 0,
                               "height": 75,
@@ -3601,7 +3601,7 @@ exports[`AccountConnect renders correctly with request including only chains 1`]
                                 numberOfLines={1}
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -3615,7 +3615,7 @@ exports[`AccountConnect renders correctly with request including only chains 1`]
                                 numberOfLines={1}
                                 style={
                                   {
-                                    "color": "#686e7d",
+                                    "color": "#66676a",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -3646,7 +3646,7 @@ exports[`AccountConnect renders correctly with request including only chains 1`]
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -3747,7 +3747,7 @@ exports[`AccountConnect renders correctly with request including only chains 1`]
                       }
                     >
                       <SvgMock
-                        color="#686e7d"
+                        color="#66676a"
                         fill="currentColor"
                         height={20}
                         name="Wallet"
@@ -3772,7 +3772,7 @@ exports[`AccountConnect renders correctly with request including only chains 1`]
                         accessibilityRole="text"
                         style={
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "fontFamily": "Geist-Regular",
                             "fontSize": 16,
                             "letterSpacing": 0,
@@ -3804,7 +3804,7 @@ exports[`AccountConnect renders correctly with request including only chains 1`]
                             numberOfLines={1}
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Regular",
                                 "fontSize": 16,
                                 "letterSpacing": 0,
@@ -3817,7 +3817,7 @@ exports[`AccountConnect renders correctly with request including only chains 1`]
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 14,
                                   "letterSpacing": 0,
@@ -3942,7 +3942,7 @@ exports[`AccountConnect renders correctly with request including only chains 1`]
                       }
                     >
                       <SvgMock
-                        color="#686e7d"
+                        color="#66676a"
                         fill="currentColor"
                         height={20}
                         name="Data"
@@ -3967,7 +3967,7 @@ exports[`AccountConnect renders correctly with request including only chains 1`]
                         accessibilityRole="text"
                         style={
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "fontFamily": "Geist-Regular",
                             "fontSize": 16,
                             "letterSpacing": 0,
@@ -3999,7 +3999,7 @@ exports[`AccountConnect renders correctly with request including only chains 1`]
                             numberOfLines={1}
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Regular",
                                 "fontSize": 16,
                                 "letterSpacing": 0,
@@ -4011,7 +4011,7 @@ exports[`AccountConnect renders correctly with request including only chains 1`]
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 14,
                                   "letterSpacing": 0,
@@ -4149,7 +4149,7 @@ exports[`AccountConnect renders correctly with request including only chains 1`]
                       },
                       {
                         "backgroundColor": "#ffffff",
-                        "borderColor": "#686e7d",
+                        "borderColor": "#66676a",
                         "borderWidth": 1,
                       },
                       [
@@ -4183,7 +4183,7 @@ exports[`AccountConnect renders correctly with request including only chains 1`]
                           "textAlign": "center",
                         },
                         {
-                          "color": "#686e7d",
+                          "color": "#66676a",
                         },
                         undefined,
                       ],
diff --git a/app/components/Views/AccountPermissions/AccountPermissionsConfirmRevokeAll/__snapshots__/AccountPermissionsConfirmRevokeAll.test.tsx.snap b/app/components/Views/AccountPermissions/AccountPermissionsConfirmRevokeAll/__snapshots__/AccountPermissionsConfirmRevokeAll.test.tsx.snap
index fc32a4f5a3d8..df56bd259717 100644
--- a/app/components/Views/AccountPermissions/AccountPermissionsConfirmRevokeAll/__snapshots__/AccountPermissionsConfirmRevokeAll.test.tsx.snap
+++ b/app/components/Views/AccountPermissions/AccountPermissionsConfirmRevokeAll/__snapshots__/AccountPermissionsConfirmRevokeAll.test.tsx.snap
@@ -23,7 +23,7 @@ exports[`AccountPermissionsConfirmRevokeAll renders correctly 1`] = `
     style={
       [
         {
-          "backgroundColor": "#3f434a66",
+          "backgroundColor": "#0a0d135c",
           "bottom": 0,
           "left": 0,
           "position": "absolute",
@@ -73,7 +73,7 @@ exports[`AccountPermissionsConfirmRevokeAll renders correctly 1`] = `
         [
           {
             "backgroundColor": "#ffffff",
-            "borderColor": "#b7bbc866",
+            "borderColor": "#b4b4b566",
             "borderTopLeftRadius": 24,
             "borderTopRightRadius": 24,
             "borderWidth": 1,
@@ -110,7 +110,7 @@ exports[`AccountPermissionsConfirmRevokeAll renders correctly 1`] = `
         <View
           style={
             {
-              "backgroundColor": "#b7bbc866",
+              "backgroundColor": "#b4b4b566",
               "borderRadius": 2,
               "height": 4,
               "width": 40,
@@ -162,7 +162,7 @@ exports[`AccountPermissionsConfirmRevokeAll renders correctly 1`] = `
               style={
                 [
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Bold",
                     "fontSize": 16,
                     "fontWeight": 700,
@@ -191,7 +191,7 @@ exports[`AccountPermissionsConfirmRevokeAll renders correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -221,7 +221,7 @@ exports[`AccountPermissionsConfirmRevokeAll renders correctly 1`] = `
               {
                 "alignItems": "center",
                 "alignSelf": "flex-start",
-                "backgroundColor": "#3c4d9d0f",
+                "backgroundColor": "#b4b4b528",
                 "borderColor": "transparent",
                 "borderRadius": 12,
                 "borderWidth": 1,
@@ -239,7 +239,7 @@ exports[`AccountPermissionsConfirmRevokeAll renders correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Medium",
                   "fontSize": 16,
                   "letterSpacing": 0,
diff --git a/app/components/Views/AccountPermissions/ConnectionDetails/__snapshots__/ConnectionDetails.test.tsx.snap b/app/components/Views/AccountPermissions/ConnectionDetails/__snapshots__/ConnectionDetails.test.tsx.snap
index 52c5ba774616..31d804c44ed1 100644
--- a/app/components/Views/AccountPermissions/ConnectionDetails/__snapshots__/ConnectionDetails.test.tsx.snap
+++ b/app/components/Views/AccountPermissions/ConnectionDetails/__snapshots__/ConnectionDetails.test.tsx.snap
@@ -45,7 +45,7 @@ exports[`ConnectionDetails renders correctly 1`] = `
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Bold",
               "fontSize": 16,
               "fontWeight": 700,
@@ -74,7 +74,7 @@ exports[`ConnectionDetails renders correctly 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -104,7 +104,7 @@ exports[`ConnectionDetails renders correctly 1`] = `
         {
           "alignItems": "center",
           "alignSelf": "flex-start",
-          "backgroundColor": "#121314",
+          "backgroundColor": "#131416",
           "borderRadius": 12,
           "flex": 1,
           "flexDirection": "row",
diff --git a/app/components/Views/AccountPermissions/NetworkPermissionsConnected/__snapshots__/NetworkPermissionsConnected.test.tsx.snap b/app/components/Views/AccountPermissions/NetworkPermissionsConnected/__snapshots__/NetworkPermissionsConnected.test.tsx.snap
index 8c13afcfa9eb..d33e859f606d 100644
--- a/app/components/Views/AccountPermissions/NetworkPermissionsConnected/__snapshots__/NetworkPermissionsConnected.test.tsx.snap
+++ b/app/components/Views/AccountPermissions/NetworkPermissionsConnected/__snapshots__/NetworkPermissionsConnected.test.tsx.snap
@@ -58,7 +58,7 @@ exports[`NetworkPermissionsConnected renders correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Bold",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -96,7 +96,7 @@ exports[`NetworkPermissionsConnected renders correctly 1`] = `
           }
         >
           <SvgMock
-            color="#121314"
+            color="#131416"
             fill="currentColor"
             height={20}
             name="Info"
@@ -246,7 +246,7 @@ exports[`NetworkPermissionsConnected renders correctly 1`] = `
                         numberOfLines={1}
                         style={
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "fontFamily": "Geist-Regular",
                             "fontSize": 16,
                             "letterSpacing": 0,
@@ -278,7 +278,7 @@ exports[`NetworkPermissionsConnected renders correctly 1`] = `
       {
         "alignItems": "center",
         "alignSelf": "stretch",
-        "backgroundColor": "#3c4d9d0f",
+        "backgroundColor": "#b4b4b528",
         "borderColor": "transparent",
         "borderRadius": 12,
         "borderWidth": 1,
@@ -297,7 +297,7 @@ exports[`NetworkPermissionsConnected renders correctly 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Medium",
           "fontSize": 16,
           "letterSpacing": 0,
diff --git a/app/components/Views/AccountPermissions/PermittedNetworksInfoSheet/__snapshots__/PermittedNetworksInfoSheet.test.tsx.snap b/app/components/Views/AccountPermissions/PermittedNetworksInfoSheet/__snapshots__/PermittedNetworksInfoSheet.test.tsx.snap
index 3904ea72dcbc..0413126f6a86 100644
--- a/app/components/Views/AccountPermissions/PermittedNetworksInfoSheet/__snapshots__/PermittedNetworksInfoSheet.test.tsx.snap
+++ b/app/components/Views/AccountPermissions/PermittedNetworksInfoSheet/__snapshots__/PermittedNetworksInfoSheet.test.tsx.snap
@@ -46,7 +46,7 @@ exports[`PermittedNetworksInfoSheet should render correctly 1`] = `
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Bold",
               "fontSize": 16,
               "fontWeight": 700,
@@ -76,7 +76,7 @@ exports[`PermittedNetworksInfoSheet should render correctly 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -107,7 +107,7 @@ exports[`PermittedNetworksInfoSheet should render correctly 1`] = `
         {
           "alignItems": "center",
           "alignSelf": "flex-start",
-          "backgroundColor": "#121314",
+          "backgroundColor": "#131416",
           "borderRadius": 12,
           "flex": 1,
           "flexDirection": "row",
diff --git a/app/components/Views/AccountPermissions/__snapshots__/AccountPermissions.test.tsx.snap b/app/components/Views/AccountPermissions/__snapshots__/AccountPermissions.test.tsx.snap
index 968646d019f7..ae3f58dd07e3 100644
--- a/app/components/Views/AccountPermissions/__snapshots__/AccountPermissions.test.tsx.snap
+++ b/app/components/Views/AccountPermissions/__snapshots__/AccountPermissions.test.tsx.snap
@@ -23,7 +23,7 @@ exports[`AccountPermissions renders correctly 1`] = `
     style={
       [
         {
-          "backgroundColor": "#3f434a66",
+          "backgroundColor": "#0a0d135c",
           "bottom": 0,
           "left": 0,
           "position": "absolute",
@@ -73,7 +73,7 @@ exports[`AccountPermissions renders correctly 1`] = `
         [
           {
             "backgroundColor": "#ffffff",
-            "borderColor": "#b7bbc866",
+            "borderColor": "#b4b4b566",
             "borderTopLeftRadius": 24,
             "borderTopRightRadius": 24,
             "borderWidth": 1,
@@ -110,7 +110,7 @@ exports[`AccountPermissions renders correctly 1`] = `
         <View
           style={
             {
-              "backgroundColor": "#b7bbc866",
+              "backgroundColor": "#b4b4b566",
               "borderRadius": 2,
               "height": 4,
               "width": 40,
@@ -141,7 +141,7 @@ exports[`AccountPermissions renders correctly 1`] = `
           }
         >
           <SvgMock
-            color="#121314"
+            color="#131416"
             fill="currentColor"
             height={20}
             name="Global"
@@ -158,9 +158,9 @@ exports[`AccountPermissions renders correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Bold",
-              "fontSize": 18,
+              "fontSize": 20,
               "letterSpacing": 0,
               "lineHeight": 24,
             }
@@ -180,7 +180,7 @@ exports[`AccountPermissions renders correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Medium",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -250,7 +250,7 @@ exports[`AccountPermissions renders correctly 1`] = `
               style={
                 {
                   "alignItems": "center",
-                  "backgroundColor": "#3c4d9d0f",
+                  "backgroundColor": "#b4b4b528",
                   "flexDirection": "row",
                 }
               }
@@ -338,7 +338,7 @@ exports[`AccountPermissions renders correctly 1`] = `
                           numberOfLines={1}
                           style={
                             {
-                              "color": "#121314",
+                              "color": "#131416",
                               "fontFamily": "Geist-Regular",
                               "fontSize": 16,
                               "letterSpacing": 0,
@@ -364,7 +364,7 @@ exports[`AccountPermissions renders correctly 1`] = `
                             numberOfLines={1}
                             style={
                               {
-                                "color": "#686e7d",
+                                "color": "#66676a",
                                 "fontFamily": "Geist-Regular",
                                 "fontSize": 16,
                                 "letterSpacing": 0,
@@ -396,7 +396,7 @@ exports[`AccountPermissions renders correctly 1`] = `
                             accessibilityRole="text"
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Regular",
                                 "fontSize": 16,
                                 "letterSpacing": 0,
@@ -538,7 +538,7 @@ exports[`AccountPermissions renders correctly 1`] = `
                   testID="multichain-account-cell-menu"
                 >
                   <SvgMock
-                    color="#121314"
+                    color="#131416"
                     fill="currentColor"
                     height={20}
                     name="MoreVertical"
@@ -615,7 +615,7 @@ exports[`AccountPermissions renders correctly 1`] = `
           {
             "alignItems": "center",
             "alignSelf": "stretch",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -633,7 +633,7 @@ exports[`AccountPermissions renders correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Medium",
               "fontSize": 16,
               "letterSpacing": 0,
diff --git a/app/components/Views/AccountStatus/__snapshots__/index.test.tsx.snap b/app/components/Views/AccountStatus/__snapshots__/index.test.tsx.snap
index b4ffaddeeffe..f26191cb2f39 100644
--- a/app/components/Views/AccountStatus/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/AccountStatus/__snapshots__/index.test.tsx.snap
@@ -48,7 +48,7 @@ exports[`AccountStatus Snapshots android renders correctly with accountName in r
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 32,
                 "letterSpacing": 0,
@@ -85,7 +85,7 @@ exports[`AccountStatus Snapshots android renders correctly with accountName in r
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -121,7 +121,7 @@ exports[`AccountStatus Snapshots android renders correctly with accountName in r
           {
             "alignItems": "center",
             "alignSelf": "stretch",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "flexDirection": "row",
             "height": 48,
@@ -158,7 +158,7 @@ exports[`AccountStatus Snapshots android renders correctly with accountName in r
           {
             "alignItems": "center",
             "alignSelf": "stretch",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -175,7 +175,7 @@ exports[`AccountStatus Snapshots android renders correctly with accountName in r
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Medium",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -239,7 +239,7 @@ exports[`AccountStatus Snapshots android renders correctly with type="found" 1`]
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 32,
                 "letterSpacing": 0,
@@ -276,7 +276,7 @@ exports[`AccountStatus Snapshots android renders correctly with type="found" 1`]
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -312,7 +312,7 @@ exports[`AccountStatus Snapshots android renders correctly with type="found" 1`]
           {
             "alignItems": "center",
             "alignSelf": "stretch",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "flexDirection": "row",
             "height": 48,
@@ -349,7 +349,7 @@ exports[`AccountStatus Snapshots android renders correctly with type="found" 1`]
           {
             "alignItems": "center",
             "alignSelf": "stretch",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -366,7 +366,7 @@ exports[`AccountStatus Snapshots android renders correctly with type="found" 1`]
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Medium",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -430,7 +430,7 @@ exports[`AccountStatus Snapshots android renders correctly with type="not_exist"
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 32,
                 "letterSpacing": 0,
@@ -467,7 +467,7 @@ exports[`AccountStatus Snapshots android renders correctly with type="not_exist"
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -503,7 +503,7 @@ exports[`AccountStatus Snapshots android renders correctly with type="not_exist"
           {
             "alignItems": "center",
             "alignSelf": "stretch",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "flexDirection": "row",
             "height": 48,
@@ -540,7 +540,7 @@ exports[`AccountStatus Snapshots android renders correctly with type="not_exist"
           {
             "alignItems": "center",
             "alignSelf": "stretch",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -557,7 +557,7 @@ exports[`AccountStatus Snapshots android renders correctly with type="not_exist"
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Medium",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -621,7 +621,7 @@ exports[`AccountStatus Snapshots iOS renders correctly with accountName in route
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 32,
                 "letterSpacing": 0,
@@ -658,7 +658,7 @@ exports[`AccountStatus Snapshots iOS renders correctly with accountName in route
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -694,7 +694,7 @@ exports[`AccountStatus Snapshots iOS renders correctly with accountName in route
           {
             "alignItems": "center",
             "alignSelf": "stretch",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "flexDirection": "row",
             "height": 48,
@@ -731,7 +731,7 @@ exports[`AccountStatus Snapshots iOS renders correctly with accountName in route
           {
             "alignItems": "center",
             "alignSelf": "stretch",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -748,7 +748,7 @@ exports[`AccountStatus Snapshots iOS renders correctly with accountName in route
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Medium",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -812,7 +812,7 @@ exports[`AccountStatus Snapshots iOS renders correctly with type="found" 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 32,
                 "letterSpacing": 0,
@@ -849,7 +849,7 @@ exports[`AccountStatus Snapshots iOS renders correctly with type="found" 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -885,7 +885,7 @@ exports[`AccountStatus Snapshots iOS renders correctly with type="found" 1`] = `
           {
             "alignItems": "center",
             "alignSelf": "stretch",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "flexDirection": "row",
             "height": 48,
@@ -922,7 +922,7 @@ exports[`AccountStatus Snapshots iOS renders correctly with type="found" 1`] = `
           {
             "alignItems": "center",
             "alignSelf": "stretch",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -939,7 +939,7 @@ exports[`AccountStatus Snapshots iOS renders correctly with type="found" 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Medium",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -1003,7 +1003,7 @@ exports[`AccountStatus Snapshots iOS renders correctly with type="not_exist" 1`]
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 32,
                 "letterSpacing": 0,
@@ -1040,7 +1040,7 @@ exports[`AccountStatus Snapshots iOS renders correctly with type="not_exist" 1`]
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -1076,7 +1076,7 @@ exports[`AccountStatus Snapshots iOS renders correctly with type="not_exist" 1`]
           {
             "alignItems": "center",
             "alignSelf": "stretch",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "flexDirection": "row",
             "height": 48,
@@ -1113,7 +1113,7 @@ exports[`AccountStatus Snapshots iOS renders correctly with type="not_exist" 1`]
           {
             "alignItems": "center",
             "alignSelf": "stretch",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -1130,7 +1130,7 @@ exports[`AccountStatus Snapshots iOS renders correctly with type="not_exist" 1`]
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Medium",
               "fontSize": 16,
               "letterSpacing": 0,
diff --git a/app/components/Views/AccountsMenu/AccountsMenu.test.tsx b/app/components/Views/AccountsMenu/AccountsMenu.test.tsx
index 45f1949a0801..2498d3af64fb 100644
--- a/app/components/Views/AccountsMenu/AccountsMenu.test.tsx
+++ b/app/components/Views/AccountsMenu/AccountsMenu.test.tsx
@@ -114,6 +114,8 @@ jest.mock('../../UI/Ramp/hooks/useRampsUnifiedV1Enabled', () => ({
   default: jest.fn(() => false),
 }));
 
+jest.mock('../../UI/Ramp/hooks/useRampsUnifiedV2Enabled');
+
 const mockGoToBuy = jest.fn();
 jest.mock('../../UI/Ramp/hooks/useRampNavigation', () => ({
   useRampNavigation: () => ({
@@ -318,7 +320,7 @@ describe('AccountsMenu', () => {
 
       // Verify properties were added
       expect(mockAddProperties).toHaveBeenCalledWith({
-        text: 'Buy',
+        button_text: 'Buy',
         location: 'AccountsMenu',
         ramp_type: 'UNIFIED_BUY',
         chain_id_destination: null,
diff --git a/app/components/Views/AccountsMenu/AccountsMenu.tsx b/app/components/Views/AccountsMenu/AccountsMenu.tsx
index a05d6782aac4..039b176b34e7 100644
--- a/app/components/Views/AccountsMenu/AccountsMenu.tsx
+++ b/app/components/Views/AccountsMenu/AccountsMenu.tsx
@@ -28,6 +28,7 @@ import { useAnalytics } from '../../hooks/useAnalytics/useAnalytics';
 import { AccountsMenuSelectorsIDs } from './AccountsMenu.testIds';
 import { isPermissionsSettingsV1Enabled } from '../../../util/networks';
 import useRampsUnifiedV1Enabled from '../../UI/Ramp/hooks/useRampsUnifiedV1Enabled';
+import useRampsUnifiedV2Enabled from '../../UI/Ramp/hooks/useRampsUnifiedV2Enabled';
 import AppConstants from '../../../core/AppConstants';
 import DeeplinkManager from '../../../core/DeeplinkManager/DeeplinkManager';
 import { getDetectedGeolocation } from '../../../reducers/fiatOrders';
@@ -53,6 +54,7 @@ const AccountsMenu = () => {
   const rampGeodetectedRegion = useSelector(getDetectedGeolocation);
   const rampsButtonClickData = useRampsButtonClickData();
   const rampUnifiedV1Enabled = useRampsUnifiedV1Enabled();
+  const isV2UnifiedEnabled = useRampsUnifiedV2Enabled();
   const isNotificationEnabled = useSelector(
     selectIsMetamaskNotificationsEnabled,
   );
@@ -66,9 +68,9 @@ const AccountsMenu = () => {
     trackEvent(
       createEventBuilder(EVENT_NAME.RAMPS_BUTTON_CLICKED)
         .addProperties({
-          text: 'Buy',
+          button_text: 'Buy',
           location: 'AccountsMenu',
-          ramp_type: 'UNIFIED_BUY',
+          ramp_type: isV2UnifiedEnabled ? 'UNIFIED_BUY_2' : 'UNIFIED_BUY',
           chain_id_destination: null,
           region: rampGeodetectedRegion ?? null,
           ramp_routing: rampsButtonClickData.ramp_routing ?? null,
@@ -85,6 +87,7 @@ const AccountsMenu = () => {
     trackEvent,
     rampGeodetectedRegion,
     rampsButtonClickData,
+    isV2UnifiedEnabled,
   ]);
 
   const onPressNotifications = useCallback(() => {
diff --git a/app/components/Views/AccountsMenu/__snapshots__/AccountsMenu.test.tsx.snap b/app/components/Views/AccountsMenu/__snapshots__/AccountsMenu.test.tsx.snap
index 9d3a25ba5c3c..1b04a99b047e 100644
--- a/app/components/Views/AccountsMenu/__snapshots__/AccountsMenu.test.tsx.snap
+++ b/app/components/Views/AccountsMenu/__snapshots__/AccountsMenu.test.tsx.snap
@@ -101,7 +101,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is hidden 1`]
             style={
               [
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "height": 24,
                   "width": 24,
                 },
@@ -223,7 +223,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is hidden 1`]
                 [
                   {
                     "alignItems": "center",
-                    "backgroundColor": "#3c4d9d0f",
+                    "backgroundColor": "#b4b4b528",
                     "borderRadius": 12,
                     "justifyContent": "center",
                     "opacity": 1,
@@ -245,7 +245,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is hidden 1`]
                 }
               >
                 <SvgMock
-                  color="#686e7d"
+                  color="#66676a"
                   fill="currentColor"
                   height={24}
                   name="QrCode"
@@ -263,7 +263,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is hidden 1`]
                   numberOfLines={1}
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "flexShrink": 0,
                       "fontFamily": "Geist-Medium",
                       "fontSize": 14,
@@ -290,7 +290,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is hidden 1`]
               "display": "flex",
             },
             {
-              "backgroundColor": "#b7bbc866",
+              "backgroundColor": "#b4b4b566",
               "height": 1,
               "marginBottom": 8,
               "marginLeft": 16,
@@ -321,7 +321,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is hidden 1`]
           style={
             [
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -412,7 +412,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is hidden 1`]
               style={
                 [
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "height": 24,
                     "width": 24,
                   },
@@ -438,7 +438,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is hidden 1`]
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Medium",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -469,7 +469,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is hidden 1`]
               style={
                 [
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "height": 16,
                     "width": 16,
                   },
@@ -557,7 +557,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is hidden 1`]
               style={
                 [
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "height": 24,
                     "width": 24,
                   },
@@ -583,7 +583,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is hidden 1`]
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Medium",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -614,7 +614,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is hidden 1`]
               style={
                 [
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "height": 16,
                     "width": 16,
                   },
@@ -702,7 +702,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is hidden 1`]
               style={
                 [
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "height": 24,
                     "width": 24,
                   },
@@ -728,7 +728,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is hidden 1`]
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Medium",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -759,7 +759,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is hidden 1`]
               style={
                 [
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "height": 16,
                     "width": 16,
                   },
@@ -777,7 +777,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is hidden 1`]
               "display": "flex",
             },
             {
-              "backgroundColor": "#b7bbc866",
+              "backgroundColor": "#b4b4b566",
               "height": 1,
               "marginBottom": 8,
               "marginLeft": 16,
@@ -808,7 +808,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is hidden 1`]
           style={
             [
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -899,7 +899,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is hidden 1`]
               style={
                 [
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "height": 24,
                     "width": 24,
                   },
@@ -925,7 +925,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is hidden 1`]
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Medium",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -956,7 +956,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is hidden 1`]
               style={
                 [
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "height": 16,
                     "width": 16,
                   },
@@ -1044,7 +1044,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is hidden 1`]
               style={
                 [
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "height": 24,
                     "width": 24,
                   },
@@ -1070,7 +1070,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is hidden 1`]
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Medium",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -1164,7 +1164,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is hidden 1`]
               style={
                 [
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "height": 24,
                     "width": 24,
                   },
@@ -1190,7 +1190,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is hidden 1`]
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Medium",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -1214,7 +1214,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is hidden 1`]
               "display": "flex",
             },
             {
-              "backgroundColor": "#b7bbc866",
+              "backgroundColor": "#b4b4b566",
               "height": 1,
               "marginBottom": 8,
               "marginLeft": 16,
@@ -1451,7 +1451,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is visible 1`]
             style={
               [
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "height": 24,
                   "width": 24,
                 },
@@ -1573,7 +1573,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is visible 1`]
                 [
                   {
                     "alignItems": "center",
-                    "backgroundColor": "#3c4d9d0f",
+                    "backgroundColor": "#b4b4b528",
                     "borderRadius": 12,
                     "justifyContent": "center",
                     "opacity": 1,
@@ -1595,7 +1595,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is visible 1`]
                 }
               >
                 <SvgMock
-                  color="#686e7d"
+                  color="#66676a"
                   fill="currentColor"
                   height={24}
                   name="QrCode"
@@ -1613,7 +1613,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is visible 1`]
                   numberOfLines={1}
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "flexShrink": 0,
                       "fontFamily": "Geist-Medium",
                       "fontSize": 14,
@@ -1710,7 +1710,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is visible 1`]
               style={
                 [
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "height": 24,
                     "width": 24,
                   },
@@ -1736,7 +1736,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is visible 1`]
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Medium",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -1767,7 +1767,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is visible 1`]
               style={
                 [
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "height": 16,
                     "width": 16,
                   },
@@ -1785,7 +1785,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is visible 1`]
               "display": "flex",
             },
             {
-              "backgroundColor": "#b7bbc866",
+              "backgroundColor": "#b4b4b566",
               "height": 1,
               "marginBottom": 8,
               "marginLeft": 16,
@@ -1816,7 +1816,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is visible 1`]
           style={
             [
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -1907,7 +1907,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is visible 1`]
               style={
                 [
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "height": 24,
                     "width": 24,
                   },
@@ -1933,7 +1933,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is visible 1`]
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Medium",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -1964,7 +1964,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is visible 1`]
               style={
                 [
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "height": 16,
                     "width": 16,
                   },
@@ -2052,7 +2052,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is visible 1`]
               style={
                 [
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "height": 24,
                     "width": 24,
                   },
@@ -2078,7 +2078,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is visible 1`]
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Medium",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -2109,7 +2109,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is visible 1`]
               style={
                 [
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "height": 16,
                     "width": 16,
                   },
@@ -2197,7 +2197,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is visible 1`]
               style={
                 [
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "height": 24,
                     "width": 24,
                   },
@@ -2223,7 +2223,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is visible 1`]
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Medium",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -2254,7 +2254,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is visible 1`]
               style={
                 [
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "height": 16,
                     "width": 16,
                   },
@@ -2342,7 +2342,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is visible 1`]
               style={
                 [
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "height": 24,
                     "width": 24,
                   },
@@ -2368,7 +2368,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is visible 1`]
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Medium",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -2399,7 +2399,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is visible 1`]
               style={
                 [
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "height": 16,
                     "width": 16,
                   },
@@ -2417,7 +2417,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is visible 1`]
               "display": "flex",
             },
             {
-              "backgroundColor": "#b7bbc866",
+              "backgroundColor": "#b4b4b566",
               "height": 1,
               "marginBottom": 8,
               "marginLeft": 16,
@@ -2448,7 +2448,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is visible 1`]
           style={
             [
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -2539,7 +2539,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is visible 1`]
               style={
                 [
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "height": 24,
                     "width": 24,
                   },
@@ -2565,7 +2565,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is visible 1`]
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Medium",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -2596,7 +2596,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is visible 1`]
               style={
                 [
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "height": 16,
                     "width": 16,
                   },
@@ -2684,7 +2684,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is visible 1`]
               style={
                 [
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "height": 24,
                     "width": 24,
                   },
@@ -2710,7 +2710,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is visible 1`]
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Medium",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -2804,7 +2804,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is visible 1`]
               style={
                 [
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "height": 24,
                     "width": 24,
                   },
@@ -2830,7 +2830,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is visible 1`]
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Medium",
                       "fontSize": 16,
                       "fontWeight": 400,
@@ -2854,7 +2854,7 @@ exports[`AccountsMenu Snapshots match snapshot when MetaMask Card is visible 1`]
               "display": "flex",
             },
             {
-              "backgroundColor": "#b7bbc866",
+              "backgroundColor": "#b4b4b566",
               "height": 1,
               "marginBottom": 8,
               "marginLeft": 16,
diff --git a/app/components/Views/ActivityView/ActivitiesView.testIds.ts b/app/components/Views/ActivityView/ActivitiesView.testIds.ts
index 68e8f9fabad4..790320409c71 100644
--- a/app/components/Views/ActivityView/ActivitiesView.testIds.ts
+++ b/app/components/Views/ActivityView/ActivitiesView.testIds.ts
@@ -7,6 +7,10 @@ function getSentUnitMessage(unit: string) {
 export const ActivitiesViewSelectorsIDs = {
   CONTAINER: 'transactions-container',
   TABS_CONTAINER: 'activity-view-tabs',
+  SAFE_AREA_VIEW: 'activity-view-safe-area',
+  HEADER_ROOT: 'activity-view-header-root',
+  HEADER_COMPACT_STANDARD: 'activity-view-header-compact-standard',
+  TRANSFER_TAB: 'activity-view-tabs-bar-tab-1',
 };
 
 export const ActivitiesViewSelectorsText = {
diff --git a/app/components/Views/ActivityView/__snapshots__/index.test.tsx.snap b/app/components/Views/ActivityView/__snapshots__/index.test.tsx.snap
index 7c4d3edde7f9..3148b31310f4 100644
--- a/app/components/Views/ActivityView/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/ActivityView/__snapshots__/index.test.tsx.snap
@@ -312,22 +312,28 @@ exports[`ActivityView matches snapshot 1`] = `
                       }
                     }
                   >
-                    <View
+                    <RNCSafeAreaView
+                      edges={
+                        {
+                          "bottom": "additive",
+                          "left": "off",
+                          "right": "off",
+                          "top": "off",
+                        }
+                      }
                       style={
                         [
                           {
-                            "backgroundColor": "#ffffff",
-                            "display": "flex",
                             "flexBasis": "0%",
                             "flexGrow": 1,
                             "flexShrink": 1,
-                            "gap": 16,
                           },
                           {
-                            "marginTop": 0,
+                            "backgroundColor": "#ffffff",
                           },
                         ]
                       }
+                      testID="activity-view-safe-area"
                     >
                       <View
                         style={
@@ -336,16 +342,17 @@ exports[`ActivityView matches snapshot 1`] = `
                               "alignItems": "center",
                               "flexDirection": "row",
                               "gap": 16,
+                              "minHeight": 56,
+                              "paddingLeft": 16,
+                              "paddingRight": 8,
                             },
-                            false,
                             {
-                              "marginBottom": 16,
-                              "paddingLeft": 16,
-                              "paddingRight": 16,
+                              "marginTop": 0,
                             },
+                            undefined,
                           ]
                         }
-                        testID="header"
+                        testID="activity-view-header-root"
                       >
                         <View
                           style={
@@ -361,146 +368,180 @@ exports[`ActivityView matches snapshot 1`] = `
                             ]
                           }
                         >
-                          <Text
-                            accessibilityRole="text"
+                          <View
                             style={
                               [
                                 {
-                                  "color": "#121314",
-                                  "fontFamily": "Geist-Bold",
-                                  "fontSize": 24,
-                                  "fontWeight": 700,
-                                  "letterSpacing": 0,
-                                  "lineHeight": 32,
+                                  "alignItems": "center",
+                                  "display": "flex",
+                                  "flexDirection": "row",
                                 },
                                 undefined,
                               ]
                             }
-                            testID="header-title"
                           >
-                            Activity
-                          </Text>
+                            <Text
+                              accessibilityRole="text"
+                              style={
+                                [
+                                  {
+                                    "color": "#131416",
+                                    "fontFamily": "Geist-Bold",
+                                    "fontSize": 24,
+                                    "fontWeight": 700,
+                                    "letterSpacing": 0,
+                                    "lineHeight": 32,
+                                  },
+                                  undefined,
+                                ]
+                              }
+                            >
+                              Activity
+                            </Text>
+                          </View>
                         </View>
                       </View>
                       <View
-                        testID="tabs-list"
+                        style={
+                          [
+                            {
+                              "display": "flex",
+                              "flexBasis": "0%",
+                              "flexGrow": 1,
+                              "flexShrink": 1,
+                              "gap": 16,
+                            },
+                            undefined,
+                          ]
+                        }
                       >
                         <View
-                          testID="tab-transactions"
+                          testID="tabs-list"
                         >
                           <View
-                            style={
-                              {
-                                "backgroundColor": "#ffffff",
-                                "flex": 1,
-                              }
-                            }
-                            tabLabel="Transactions"
+                            testID="tab-transactions"
                           >
                             <View
                               style={
                                 {
-                                  "alignItems": "center",
-                                  "flexDirection": "row",
-                                  "justifyContent": "space-between",
-                                  "marginVertical": 8,
-                                  "paddingHorizontal": 16,
-                                  "width": "100%",
+                                  "backgroundColor": "#ffffff",
+                                  "flex": 1,
                                 }
                               }
+                              tabLabel="Transactions"
                             >
-                              <TouchableOpacity
-                                accessibilityRole="button"
-                                accessible={true}
-                                activeOpacity={1}
-                                disabled={false}
-                                onPress={[Function]}
+                              <View
                                 style={
                                   {
                                     "alignItems": "center",
-                                    "alignSelf": "flex-start",
-                                    "backgroundColor": "#ffffff",
-                                    "borderColor": "#b7bbc866",
-                                    "borderRadius": 8,
-                                    "borderWidth": 1,
                                     "flexDirection": "row",
-                                    "height": 40,
-                                    "justifyContent": "center",
-                                    "maxWidth": "80%",
-                                    "overflow": "hidden",
-                                    "paddingHorizontal": 12,
+                                    "justifyContent": "space-between",
+                                    "marginVertical": 8,
+                                    "paddingHorizontal": 16,
+                                    "width": "100%",
                                   }
                                 }
-                                testID="tokens-network-filter"
                               >
-                                <View
+                                <TouchableOpacity
+                                  accessibilityRole="button"
+                                  accessible={true}
+                                  activeOpacity={1}
+                                  disabled={false}
+                                  onPress={[Function]}
                                   style={
                                     {
                                       "alignItems": "center",
-                                      "display": "flex",
+                                      "alignSelf": "flex-start",
+                                      "backgroundColor": "#ffffff",
+                                      "borderColor": "#b4b4b566",
+                                      "borderRadius": 8,
+                                      "borderWidth": 1,
                                       "flexDirection": "row",
-                                      "gap": 4,
+                                      "height": 40,
+                                      "justifyContent": "center",
+                                      "maxWidth": "80%",
+                                      "overflow": "hidden",
+                                      "paddingHorizontal": 12,
                                     }
                                   }
+                                  testID="tokens-network-filter"
                                 >
                                   <View
                                     style={
                                       {
                                         "alignItems": "center",
-                                        "backgroundColor": "#ffffff",
-                                        "borderRadius": 4,
-                                        "height": 16,
-                                        "justifyContent": "center",
-                                        "overflow": "hidden",
-                                        "width": 16,
+                                        "display": "flex",
+                                        "flexDirection": "row",
+                                        "gap": 4,
                                       }
                                     }
                                   >
-                                    <Image
-                                      onError={[Function]}
-                                      resizeMode="contain"
-                                      source={1}
+                                    <View
                                       style={
                                         {
+                                          "alignItems": "center",
+                                          "backgroundColor": "#ffffff",
+                                          "borderRadius": 4,
                                           "height": 16,
+                                          "justifyContent": "center",
+                                          "overflow": "hidden",
                                           "width": 16,
                                         }
                                       }
-                                      testID="network-avatar-image"
-                                    />
+                                    >
+                                      <Image
+                                        onError={[Function]}
+                                        resizeMode="contain"
+                                        source={1}
+                                        style={
+                                          {
+                                            "height": 16,
+                                            "width": 16,
+                                          }
+                                        }
+                                        testID="network-avatar-image"
+                                      />
+                                    </View>
+                                    <Text
+                                      accessibilityRole="text"
+                                      numberOfLines={1}
+                                      style={
+                                        {
+                                          "color": "#131416",
+                                          "fontFamily": "Geist-Medium",
+                                          "fontSize": 16,
+                                          "letterSpacing": 0,
+                                          "lineHeight": 24,
+                                        }
+                                      }
+                                    >
+                                      Popular networks
+                                    </Text>
                                   </View>
-                                  <Text
-                                    accessibilityRole="text"
-                                    numberOfLines={1}
+                                  <SvgMock
+                                    color="#131416"
+                                    fill="currentColor"
+                                    height={16}
+                                    name="ArrowDown"
                                     style={
                                       {
-                                        "color": "#121314",
-                                        "fontFamily": "Geist-Medium",
-                                        "fontSize": 16,
-                                        "letterSpacing": 0,
-                                        "lineHeight": 24,
+                                        "height": 16,
+                                        "marginLeft": 8,
+                                        "width": 16,
                                       }
                                     }
-                                  >
-                                    Popular networks
-                                  </Text>
-                                </View>
-                                <SvgMock
-                                  color="#121314"
-                                  fill="currentColor"
-                                  height={16}
-                                  name="ArrowDown"
-                                  style={
-                                    {
-                                      "height": 16,
-                                      "marginLeft": 8,
-                                      "width": 16,
-                                    }
-                                  }
-                                  width={16}
-                                />
-                              </TouchableOpacity>
+                                    width={16}
+                                  />
+                                </TouchableOpacity>
+                              </View>
+                              <View
+                                testID="unified-transactions-view-mock"
+                              />
                             </View>
+                          </View>
+                          <View
+                            testID="tab-orders"
+                          >
                             <View
                               style={
                                 {
@@ -508,145 +549,22 @@ exports[`ActivityView matches snapshot 1`] = `
                                   "flex": 1,
                                 }
                               }
+                              tabLabel="Transfers"
                             >
                               <View
-                                collapsable={false}
-                                onLayout={[Function]}
-                                style={
-                                  {
-                                    "flex": 1,
-                                    "overflow": "hidden",
-                                  }
-                                }
-                              >
-                                <RCTScrollView
-                                  collapsable={false}
-                                  keyExtractor={[Function]}
-                                  maintainVisibleContentPosition={
-                                    {
-                                      "minIndexForVisible": 0,
-                                    }
-                                  }
-                                  onScroll={[Function]}
-                                  refreshControl={
-                                    <RefreshControlMock
-                                      colors={
-                                        [
-                                          "#4459ff",
-                                        ]
-                                      }
-                                      onRefresh={[Function]}
-                                      refreshing={false}
-                                      tintColor="#121314"
-                                    />
-                                  }
-                                  scrollEnabled={true}
-                                  scrollEventThrottle={16}
-                                  style={{}}
-                                  testID="unified-transactions-view"
-                                >
-                                  <RCTRefreshControl />
-                                  <View>
-                                    <View
-                                      style={
-                                        {
-                                          "height": 0,
-                                          "left": 0,
-                                          "position": "absolute",
-                                          "top": 1000000,
-                                        }
-                                      }
-                                    />
-                                    <View
-                                      style={
-                                        {
-                                          "height": 0,
-                                          "width": undefined,
-                                        }
-                                      }
-                                    />
-                                    <View
-                                      style={false}
-                                    />
-                                    <View
-                                      style={
-                                        {
-                                          "alignItems": "center",
-                                          "justifyContent": "center",
-                                          "paddingVertical": 40,
-                                          "width": "100%",
-                                        }
-                                      }
-                                    >
-                                      <View
-                                        style={
-                                          [
-                                            {
-                                              "alignItems": "center",
-                                              "backgroundColor": "#ffffff",
-                                              "display": "flex",
-                                              "flexDirection": "column",
-                                              "gap": 12,
-                                              "justifyContent": "center",
-                                              "maxWidth": 256,
-                                            },
-                                            undefined,
-                                          ]
-                                        }
-                                      >
-                                        <Text
-                                          accessibilityRole="text"
-                                          style={
-                                            [
-                                              {
-                                                "color": "#686e7d",
-                                                "fontFamily": "Geist-Regular",
-                                                "fontSize": 16,
-                                                "fontWeight": 400,
-                                                "letterSpacing": 0,
-                                                "lineHeight": 24,
-                                                "textAlign": "center",
-                                              },
-                                              undefined,
-                                            ]
-                                          }
-                                        >
-                                          You have no transactions
-                                        </Text>
-                                      </View>
-                                    </View>
-                                  </View>
-                                </RCTScrollView>
-                              </View>
-                              <View />
+                                testID="ramp-orders-list"
+                              />
                             </View>
                           </View>
-                        </View>
-                        <View
-                          testID="tab-orders"
-                        >
                           <View
-                            style={
-                              {
-                                "backgroundColor": "#ffffff",
-                                "flex": 1,
-                              }
-                            }
-                            tabLabel="Transfers"
-                          >
-                            <View
-                              testID="ramp-orders-list"
-                            />
-                          </View>
+                            testID="tab-2"
+                          />
+                          <View
+                            testID="tab-3"
+                          />
                         </View>
-                        <View
-                          testID="tab-2"
-                        />
-                        <View
-                          testID="tab-3"
-                        />
                       </View>
-                    </View>
+                    </RNCSafeAreaView>
                   </View>
                 </View>
               </View>
diff --git a/app/components/Views/ActivityView/index.js b/app/components/Views/ActivityView/index.js
index db1bd68d98ea..b574804b6965 100644
--- a/app/components/Views/ActivityView/index.js
+++ b/app/components/Views/ActivityView/index.js
@@ -1,13 +1,7 @@
 import { useFocusEffect, useNavigation } from '@react-navigation/native';
-import React, {
-  useCallback,
-  useEffect,
-  useMemo,
-  useRef,
-  useState,
-} from 'react';
+import React, { useCallback, useMemo, useRef, useState } from 'react';
 import { StyleSheet, View } from 'react-native';
-import { useSafeAreaInsets } from 'react-native-safe-area-context';
+import { SafeAreaView } from 'react-native-safe-area-context';
 import { useSelector } from 'react-redux';
 import { WalletViewSelectorsIDs } from '../Wallet/WalletView.testIds';
 import { ActivitiesViewSelectorsIDs } from './ActivitiesView.testIds';
@@ -18,25 +12,13 @@ import Avatar, {
 } from '../../../component-library/components/Avatars/Avatar';
 import { Box } from '@metamask/design-system-react-native';
 import ButtonBase from '../../../component-library/components/Buttons/Button/foundation/ButtonBase';
-import HeaderBase, {
-  HeaderBaseVariant,
-} from '../../../component-library/components/HeaderBase';
-import ButtonIcon, {
-  ButtonIconSizes,
-} from '../../../component-library/components/Buttons/ButtonIcon';
-import {
-  IconName,
-  IconColor,
-} from '../../../component-library/components/Icons/Icon';
+import HeaderCompactStandard from '../../../component-library/components-temp/HeaderCompactStandard';
+import HeaderRoot from '../../../component-library/components-temp/HeaderRoot';
+import { IconName } from '../../../component-library/components/Icons/Icon';
 import TextComponent, {
   TextVariant,
 } from '../../../component-library/components/Texts/Text';
 import { useTailwind } from '@metamask/design-system-twrnc-preset';
-import { useMetrics } from '../../../components/hooks/useMetrics';
-import Routes from '../../../constants/navigation/Routes';
-import { MetaMetricsEvents } from '../../../core/Analytics';
-import { selectAccountsByChainId } from '../../../selectors/accountTrackerController';
-import { selectSelectedInternalAccountFormattedAddress } from '../../../selectors/accountsController';
 import { selectIsEvmNetworkSelected } from '../../../selectors/multichainNetworkController';
 import { selectChainId } from '../../../selectors/networkController';
 import { selectNetworkName } from '../../../selectors/networkInfos';
@@ -44,7 +26,6 @@ import { useParams } from '../../../util/navigation/navUtils';
 import { getNetworkImageSource } from '../../../util/networks';
 import { useTheme } from '../../../util/theme';
 import { TabsList } from '../../../component-library/components-temp/Tabs';
-import { getTransactionsNavbarOptions } from '../../UI/Navbar';
 import { createNetworkManagerNavDetails } from '../../UI/NetworkManager';
 import { selectPerpsEnabledFlag } from '../../UI/Perps';
 import { selectPredictEnabledFlag } from '../../UI/Predict/selectors/featureFlags';
@@ -100,23 +81,15 @@ const createStyles = (params) => {
 
 const ActivityView = () => {
   const { colors } = useTheme();
-  const insets = useSafeAreaInsets();
   const tw = useTailwind();
 
-  const { styles } = useStyles(createStyles, {
-    style: { marginTop: insets.top },
-  });
+  const { styles } = useStyles(createStyles);
 
-  const { trackEvent, createEventBuilder } = useMetrics();
   const navigation = useNavigation();
-  const selectedAddress = useSelector(
-    selectSelectedInternalAccountFormattedAddress,
-  );
 
   const currentChainId = useSelector(selectChainId);
   const isEvmSelected = useSelector(selectIsEvmNetworkSelected);
   const networkName = useSelector(selectNetworkName);
-  const accountsByChainId = useSelector(selectAccountsByChainId);
 
   const { enabledNetworks, getNetworkInfo } = useCurrentNetworkInfo();
   const { areAllNetworksSelected } = useNetworksByNamespace({
@@ -139,28 +112,6 @@ const ActivityView = () => {
     [predictEnabledFlag],
   );
 
-  const openAccountSelector = useCallback(() => {
-    navigation.navigate(Routes.MODAL.ROOT_MODAL_FLOW, {
-      screen: Routes.SHEET.ACCOUNT_SELECTOR,
-    });
-    // Track Event: "Opened Account Switcher"
-    trackEvent(
-      createEventBuilder(MetaMetricsEvents.BROWSER_OPEN_ACCOUNT_SWITCH)
-        .addProperties({
-          number_of_accounts: Object.keys(
-            accountsByChainId[selectedAddress] ?? {},
-          ).length,
-        })
-        .build(),
-    );
-  }, [
-    navigation,
-    accountsByChainId,
-    selectedAddress,
-    trackEvent,
-    createEventBuilder,
-  ]);
-
   const showFilterControls = () => {
     navigation.navigate(...createNetworkManagerNavDetails({}));
   };
@@ -173,29 +124,6 @@ const ActivityView = () => {
 
   const showBackButton = params.showBackButton || false;
 
-  useEffect(
-    () => {
-      const title = 'activity_view.title';
-      if (!showBackButton) {
-        navigation.setOptions(
-          getTransactionsNavbarOptions(
-            title,
-            colors,
-            navigation,
-            selectedAddress,
-            openAccountSelector,
-          ),
-        );
-      } else {
-        navigation.setOptions({
-          headerShown: false,
-        });
-      }
-    },
-    /* eslint-disable-next-line */
-    [navigation, colors, selectedAddress, openAccountSelector, showBackButton],
-  );
-
   // Calculate dynamic tab indices based on which tabs are enabled
   // Tab order: Transactions (0), Orders (1), Perps (conditional), Predict (conditional)
   // Perps comes after Transactions (0) and Orders (1)
@@ -238,110 +166,114 @@ const ActivityView = () => {
 
   return (
     <ErrorBoundary navigation={navigation} view="ActivityView">
-      <Box
-        twClassName="flex-1 bg-default gap-4"
-        style={{ marginTop: insets.top }}
+      <SafeAreaView
+        edges={{ bottom: 'additive' }}
+        style={[
+          tw.style('flex-1'),
+          { backgroundColor: colors.background.default },
+        ]}
+        testID={ActivitiesViewSelectorsIDs.SAFE_AREA_VIEW}
       >
-        <HeaderBase
-          variant={HeaderBaseVariant.Display}
-          style={tw.style('px-4 mb-4')}
-          startAccessory={
-            showBackButton && (
-              <ButtonIcon
-                iconName={IconName.ArrowLeft}
-                iconColor={IconColor.Default}
-                size={ButtonIconSizes.Lg}
-                onPress={handleBackPress}
-                testID="activity-view-back-button"
-              />
-            )
-          }
-        >
-          {strings('activity_view.title')}
-        </HeaderBase>
+        {showBackButton ? (
+          <HeaderCompactStandard
+            title={strings('activity_view.title')}
+            onBack={handleBackPress}
+            includesTopInset
+            backButtonProps={{ testID: 'activity-view-back-button' }}
+            testID={ActivitiesViewSelectorsIDs.HEADER_COMPACT_STANDARD}
+          />
+        ) : (
+          <HeaderRoot
+            title={strings('activity_view.title')}
+            includesTopInset
+            testID={ActivitiesViewSelectorsIDs.HEADER_ROOT}
+          />
+        )}
 
-        <TabsList
-          ref={tabViewRef}
-          onChangeTab={({ i }) => setActiveTabIndex(i)}
-          tabsListContentTwClassName="px-0 pb-3"
-          testID={ActivitiesViewSelectorsIDs.TABS_CONTAINER}
-        >
-          <View
-            key="transactions"
-            tabLabel={strings('transactions_view.title')}
-            style={styles.tabWrapper}
-          >
-            <View style={styles.controlButtonOuterWrapper}>
-              <ButtonBase
-                testID={WalletViewSelectorsIDs.TOKEN_NETWORK_FILTER}
-                label={
-                  <>
-                    <View style={styles.networkManagerWrapper}>
-                      {!areAllNetworksSelected && (
-                        <Avatar
-                          variant={AvatarVariant.Network}
-                          size={AvatarSize.Xs}
-                          name={networkName}
-                          imageSource={networkImageSource}
-                        />
-                      )}
-                      <TextComponent
-                        variant={TextVariant.BodyMDMedium}
-                        numberOfLines={1}
-                      >
-                        {enabledNetworks.length > 1
-                          ? strings('wallet.popular_networks')
-                          : (currentNetworkName ??
-                            strings('wallet.current_network'))}
-                      </TextComponent>
-                    </View>
-                  </>
-                }
-                isDisabled={false}
-                onPress={showFilterControls}
-                endIconName={IconName.ArrowDown}
-                style={styles.controlButton}
-                disabled={false}
-              />
-            </View>
-            <UnifiedTransactionsView chainId={currentChainId} />
-          </View>
-          <View
-            key="orders"
-            tabLabel={strings('fiat_on_ramp_aggregator.orders')}
-            style={styles.tabWrapper}
+        <Box twClassName="flex-1 gap-4">
+          <TabsList
+            ref={tabViewRef}
+            onChangeTab={({ i }) => setActiveTabIndex(i)}
+            tabsListContentTwClassName="px-0 pb-3"
+            testID={ActivitiesViewSelectorsIDs.TABS_CONTAINER}
           >
-            <RampOrdersList />
-          </View>
-
-          {isPerpsEnabled && (
             <View
-              key="perps"
-              tabLabel={strings('perps.transactions.title')}
+              key="transactions"
+              tabLabel={strings('transactions_view.title')}
               style={styles.tabWrapper}
             >
-              {/* Only mount providers when tab is active to prevent polling when hidden */}
-              {isPerpsTabActive ? (
-                <PerpsConnectionProvider isVisible={isPerpsTabActive}>
-                  <PerpsStreamProvider>
-                    <PerpsTransactionsView />
-                  </PerpsStreamProvider>
-                </PerpsConnectionProvider>
-              ) : null}
+              <View style={styles.controlButtonOuterWrapper}>
+                <ButtonBase
+                  testID={WalletViewSelectorsIDs.TOKEN_NETWORK_FILTER}
+                  label={
+                    <>
+                      <View style={styles.networkManagerWrapper}>
+                        {!areAllNetworksSelected && (
+                          <Avatar
+                            variant={AvatarVariant.Network}
+                            size={AvatarSize.Xs}
+                            name={networkName}
+                            imageSource={networkImageSource}
+                          />
+                        )}
+                        <TextComponent
+                          variant={TextVariant.BodyMDMedium}
+                          numberOfLines={1}
+                        >
+                          {enabledNetworks.length > 1
+                            ? strings('wallet.popular_networks')
+                            : (currentNetworkName ??
+                              strings('wallet.current_network'))}
+                        </TextComponent>
+                      </View>
+                    </>
+                  }
+                  isDisabled={false}
+                  onPress={showFilterControls}
+                  endIconName={IconName.ArrowDown}
+                  style={styles.controlButton}
+                  disabled={false}
+                />
+              </View>
+              <UnifiedTransactionsView chainId={currentChainId} />
             </View>
-          )}
-
-          {isPredictEnabled && (
             <View
-              key="predict"
-              tabLabel={strings('predict.transactions.title')}
+              key="orders"
+              tabLabel={strings('fiat_on_ramp_aggregator.orders')}
               style={styles.tabWrapper}
             >
-              <PredictTransactionsView isVisible={isPredictTabActive} />
+              <RampOrdersList />
             </View>
-          )}
-        </TabsList>
-      </Box>
+
+            {isPerpsEnabled && (
+              <View
+                key="perps"
+                tabLabel={strings('perps.transactions.title')}
+                style={styles.tabWrapper}
+              >
+                {/* Only mount providers when tab is active to prevent polling when hidden */}
+                {isPerpsTabActive ? (
+                  <PerpsConnectionProvider isVisible={isPerpsTabActive}>
+                    <PerpsStreamProvider>
+                      <PerpsTransactionsView />
+                    </PerpsStreamProvider>
+                  </PerpsConnectionProvider>
+                ) : null}
+              </View>
+            )}
+
+            {isPredictEnabled && (
+              <View
+                key="predict"
+                tabLabel={strings('predict.transactions.title')}
+                style={styles.tabWrapper}
+              >
+                <PredictTransactionsView isVisible={isPredictTabActive} />
+              </View>
+            )}
+          </TabsList>
+        </Box>
+      </SafeAreaView>
     </ErrorBoundary>
   );
 };
diff --git a/app/components/Views/ActivityView/index.test.tsx b/app/components/Views/ActivityView/index.test.tsx
index 48f736e9ac07..83b2aa7876b8 100644
--- a/app/components/Views/ActivityView/index.test.tsx
+++ b/app/components/Views/ActivityView/index.test.tsx
@@ -7,6 +7,7 @@ import { fireEvent } from '@testing-library/react-native';
 // eslint-disable-next-line import/no-namespace
 import * as networkManagerUtils from '../../UI/NetworkManager';
 import { useCurrentNetworkInfo } from '../../hooks/useCurrentNetworkInfo';
+import { ActivitiesViewSelectorsIDs } from './ActivitiesView.testIds';
 import { WalletViewSelectorsIDs } from '../Wallet/WalletView.testIds';
 
 // Mock the Perps feature flag selector - will be controlled per test
@@ -190,6 +191,13 @@ jest.mock('../../UI/Ramp/Aggregator/Views/OrdersList', () => {
   };
 });
 
+jest.mock('../UnifiedTransactionsView/UnifiedTransactionsView', () => {
+  const { View } = jest.requireActual('react-native');
+  return function MockUnifiedTransactionsView() {
+    return <View testID="unified-transactions-view-mock" />;
+  };
+});
+
 let mockIsEvmSelected = true;
 jest.mock('../../../selectors/multichainNetworkController', () => ({
   selectIsEvmNetworkSelected: jest.fn(() => mockIsEvmSelected),
@@ -392,29 +400,65 @@ describe('ActivityView', () => {
 
       expect(mockNavigation.goBack).not.toHaveBeenCalled();
     });
+  });
+
+  describe('header and SafeAreaView', () => {
+    beforeEach(() => {
+      jest.clearAllMocks();
+    });
+
+    it('renders SafeAreaView', () => {
+      mockRoute.params = {};
+
+      const { getByTestId } = renderComponent(mockInitialState);
+
+      expect(
+        getByTestId(ActivitiesViewSelectorsIDs.SAFE_AREA_VIEW),
+      ).toBeOnTheScreen();
+    });
+
+    it('renders HeaderRoot with Activity title when showBackButton is false', () => {
+      mockRoute.params = { showBackButton: false };
+
+      const { getByTestId, getByText, queryByTestId } =
+        renderComponent(mockInitialState);
+
+      expect(
+        getByTestId(ActivitiesViewSelectorsIDs.HEADER_ROOT),
+      ).toBeOnTheScreen();
+      expect(
+        queryByTestId(ActivitiesViewSelectorsIDs.HEADER_COMPACT_STANDARD),
+      ).toBeNull();
+      expect(getByText('Activity')).toBeOnTheScreen();
+    });
 
-    it('sets headerShown to false when showBackButton is true', () => {
+    it('renders HeaderCompactStandard with back button when showBackButton is true', () => {
       mockRoute.params = { showBackButton: true };
 
-      renderComponent(mockInitialState);
+      const { getByTestId } = renderComponent(mockInitialState);
+
+      expect(
+        getByTestId(ActivitiesViewSelectorsIDs.HEADER_COMPACT_STANDARD),
+      ).toBeOnTheScreen();
+      expect(getByTestId('activity-view-back-button')).toBeOnTheScreen();
+    });
 
-      expect(mockNavigation.setOptions).toHaveBeenCalledWith({
-        headerShown: false,
-      });
+    it('does not render HeaderRoot when showBackButton is true', () => {
+      mockRoute.params = { showBackButton: true };
+
+      const { queryByTestId } = renderComponent(mockInitialState);
+
+      expect(queryByTestId(ActivitiesViewSelectorsIDs.HEADER_ROOT)).toBeNull();
     });
 
-    it('sets default header options when showBackButton is false', () => {
+    it('does not render HeaderCompactStandard when showBackButton is false', () => {
       mockRoute.params = { showBackButton: false };
 
-      renderComponent(mockInitialState);
+      const { queryByTestId } = renderComponent(mockInitialState);
 
-      expect(mockNavigation.setOptions).toHaveBeenCalledWith(
-        expect.objectContaining({
-          headerTitle: expect.any(Function),
-          headerLeft: null,
-          headerRight: expect.any(Function),
-        }),
-      );
+      expect(
+        queryByTestId(ActivitiesViewSelectorsIDs.HEADER_COMPACT_STANDARD),
+      ).toBeNull();
     });
   });
 
diff --git a/app/components/Views/AddAccountActions/__snapshots__/AddAccountActions.test.tsx.snap b/app/components/Views/AddAccountActions/__snapshots__/AddAccountActions.test.tsx.snap
index 99124302c5d7..160e0ebeca8f 100644
--- a/app/components/Views/AddAccountActions/__snapshots__/AddAccountActions.test.tsx.snap
+++ b/app/components/Views/AddAccountActions/__snapshots__/AddAccountActions.test.tsx.snap
@@ -318,7 +318,7 @@ exports[`AddAccountActions renders correctly 1`] = `
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#686e7d",
+                              "color": "#66676a",
                               "fontFamily": "Geist-Medium",
                               "fontSize": 14,
                               "letterSpacing": 0,
@@ -344,13 +344,13 @@ exports[`AddAccountActions renders correctly 1`] = `
                           testID="add-account-new-account"
                         >
                           <SvgMock
-                            color="#121314"
+                            color="#131416"
                             fill="currentColor"
                             height={20}
                             name="Add"
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "height": 20,
                                 "marginHorizontal": 16,
                                 "width": 20,
@@ -362,9 +362,9 @@ exports[`AddAccountActions renders correctly 1`] = `
                             accessibilityRole="text"
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Medium",
-                                "fontSize": 18,
+                                "fontSize": 20,
                                 "letterSpacing": 0,
                                 "lineHeight": 24,
                               }
@@ -387,13 +387,13 @@ exports[`AddAccountActions renders correctly 1`] = `
                           testID="add-account-add-solana-account"
                         >
                           <SvgMock
-                            color="#121314"
+                            color="#131416"
                             fill="currentColor"
                             height={20}
                             name="Add"
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "height": 20,
                                 "marginHorizontal": 16,
                                 "width": 20,
@@ -405,9 +405,9 @@ exports[`AddAccountActions renders correctly 1`] = `
                             accessibilityRole="text"
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Medium",
-                                "fontSize": 18,
+                                "fontSize": 20,
                                 "letterSpacing": 0,
                                 "lineHeight": 24,
                               }
@@ -430,13 +430,13 @@ exports[`AddAccountActions renders correctly 1`] = `
                           testID="add-account-add-bitcoin-account"
                         >
                           <SvgMock
-                            color="#121314"
+                            color="#131416"
                             fill="currentColor"
                             height={20}
                             name="Add"
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "height": 20,
                                 "marginHorizontal": 16,
                                 "width": 20,
@@ -448,9 +448,9 @@ exports[`AddAccountActions renders correctly 1`] = `
                             accessibilityRole="text"
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Medium",
-                                "fontSize": 18,
+                                "fontSize": 20,
                                 "letterSpacing": 0,
                                 "lineHeight": 24,
                               }
@@ -473,13 +473,13 @@ exports[`AddAccountActions renders correctly 1`] = `
                           testID="add-account-add-tron-account"
                         >
                           <SvgMock
-                            color="#121314"
+                            color="#131416"
                             fill="currentColor"
                             height={20}
                             name="Add"
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "height": 20,
                                 "marginHorizontal": 16,
                                 "width": 20,
@@ -491,9 +491,9 @@ exports[`AddAccountActions renders correctly 1`] = `
                             accessibilityRole="text"
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Medium",
-                                "fontSize": 18,
+                                "fontSize": 20,
                                 "letterSpacing": 0,
                                 "lineHeight": 24,
                               }
@@ -506,7 +506,7 @@ exports[`AddAccountActions renders correctly 1`] = `
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#686e7d",
+                              "color": "#66676a",
                               "fontFamily": "Geist-Medium",
                               "fontSize": 14,
                               "letterSpacing": 0,
@@ -532,13 +532,13 @@ exports[`AddAccountActions renders correctly 1`] = `
                           testID="add-account-srp-account"
                         >
                           <SvgMock
-                            color="#121314"
+                            color="#131416"
                             fill="currentColor"
                             height={20}
                             name="Wallet"
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "height": 20,
                                 "marginHorizontal": 16,
                                 "width": 20,
@@ -550,9 +550,9 @@ exports[`AddAccountActions renders correctly 1`] = `
                             accessibilityRole="text"
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Medium",
-                                "fontSize": 18,
+                                "fontSize": 20,
                                 "letterSpacing": 0,
                                 "lineHeight": 24,
                               }
@@ -575,13 +575,13 @@ exports[`AddAccountActions renders correctly 1`] = `
                           testID="add-account-import-account"
                         >
                           <SvgMock
-                            color="#121314"
+                            color="#131416"
                             fill="currentColor"
                             height={20}
                             name="Key"
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "height": 20,
                                 "marginHorizontal": 16,
                                 "width": 20,
@@ -593,9 +593,9 @@ exports[`AddAccountActions renders correctly 1`] = `
                             accessibilityRole="text"
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Medium",
-                                "fontSize": 18,
+                                "fontSize": 20,
                                 "letterSpacing": 0,
                                 "lineHeight": 24,
                               }
@@ -608,7 +608,7 @@ exports[`AddAccountActions renders correctly 1`] = `
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#686e7d",
+                              "color": "#66676a",
                               "fontFamily": "Geist-Medium",
                               "fontSize": 14,
                               "letterSpacing": 0,
@@ -634,13 +634,13 @@ exports[`AddAccountActions renders correctly 1`] = `
                           testID="add-account-add-hardware-wallet"
                         >
                           <SvgMock
-                            color="#121314"
+                            color="#131416"
                             fill="currentColor"
                             height={20}
                             name="Hardware"
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "height": 20,
                                 "marginHorizontal": 16,
                                 "width": 20,
@@ -652,9 +652,9 @@ exports[`AddAccountActions renders correctly 1`] = `
                             accessibilityRole="text"
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Medium",
-                                "fontSize": 18,
+                                "fontSize": 20,
                                 "letterSpacing": 0,
                                 "lineHeight": 24,
                               }
diff --git a/app/components/Views/AddBookmark/__snapshots__/index.test.tsx.snap b/app/components/Views/AddBookmark/__snapshots__/index.test.tsx.snap
index a161b1c9c49e..0ee16a655ad7 100644
--- a/app/components/Views/AddBookmark/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/AddBookmark/__snapshots__/index.test.tsx.snap
@@ -201,7 +201,7 @@ exports[`AddBookmark should render correctly 1`] = `
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -219,7 +219,7 @@ exports[`AddBookmark should render correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Medium",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -243,7 +243,7 @@ exports[`AddBookmark should render correctly 1`] = `
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "flex": 1,
             "flexDirection": "row",
diff --git a/app/components/Views/AddressSelector/__snapshots__/AddressSelector.test.tsx.snap b/app/components/Views/AddressSelector/__snapshots__/AddressSelector.test.tsx.snap
index 8321bc952c78..7018cfcf7a71 100644
--- a/app/components/Views/AddressSelector/__snapshots__/AddressSelector.test.tsx.snap
+++ b/app/components/Views/AddressSelector/__snapshots__/AddressSelector.test.tsx.snap
@@ -334,7 +334,7 @@ exports[`AccountSelector renders correctly and matches snapshot 1`] = `
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -384,7 +384,7 @@ exports[`AccountSelector renders correctly and matches snapshot 1`] = `
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -422,7 +422,7 @@ exports[`AccountSelector renders correctly and matches snapshot 1`] = `
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -471,7 +471,7 @@ exports[`AccountSelector renders correctly and matches snapshot 1`] = `
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 16,
                                       "fontWeight": 700,
@@ -511,7 +511,7 @@ exports[`AccountSelector renders correctly and matches snapshot 1`] = `
                                   }
                                 >
                                   <SvgMock
-                                    color="#121314"
+                                    color="#131416"
                                     fill="currentColor"
                                     height={24}
                                     name="Close"
@@ -549,7 +549,7 @@ exports[`AccountSelector renders correctly and matches snapshot 1`] = `
                                 {
                                   "alignItems": "center",
                                   "backgroundColor": "#ffffff",
-                                  "borderColor": "#b7bbc8",
+                                  "borderColor": "#949596",
                                   "borderRadius": 4,
                                   "borderWidth": 0,
                                   "flexDirection": "row",
@@ -563,7 +563,7 @@ exports[`AccountSelector renders correctly and matches snapshot 1`] = `
                                 numberOfLines={1}
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Medium",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -575,7 +575,7 @@ exports[`AccountSelector renders correctly and matches snapshot 1`] = `
                                 Mock Account Name
                               </Text>
                               <SvgMock
-                                color="#121314"
+                                color="#131416"
                                 fill="currentColor"
                                 height={16}
                                 name="ArrowDown"
@@ -756,7 +756,7 @@ exports[`AccountSelector renders correctly and matches snapshot 1`] = `
                                                 style={
                                                   [
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Medium",
                                                       "fontSize": 16,
                                                       "fontWeight": 400,
@@ -775,7 +775,7 @@ exports[`AccountSelector renders correctly and matches snapshot 1`] = `
                                                 style={
                                                   [
                                                     {
-                                                      "color": "#686e7d",
+                                                      "color": "#66676a",
                                                       "fontFamily": "Geist-Medium",
                                                       "fontSize": 14,
                                                       "fontWeight": 400,
@@ -811,7 +811,7 @@ exports[`AccountSelector renders correctly and matches snapshot 1`] = `
                                         accessible={true}
                                         style={
                                           {
-                                            "backgroundColor": "#3c4d9d0f",
+                                            "backgroundColor": "#b4b4b528",
                                             "bottom": 0,
                                             "flexDirection": "row",
                                             "left": 0,
@@ -937,7 +937,7 @@ exports[`AccountSelector renders correctly and matches snapshot 1`] = `
                                                 style={
                                                   [
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Medium",
                                                       "fontSize": 16,
                                                       "fontWeight": 400,
@@ -956,7 +956,7 @@ exports[`AccountSelector renders correctly and matches snapshot 1`] = `
                                                 style={
                                                   [
                                                     {
-                                                      "color": "#686e7d",
+                                                      "color": "#66676a",
                                                       "fontFamily": "Geist-Medium",
                                                       "fontSize": 14,
                                                       "fontWeight": 400,
@@ -1103,7 +1103,7 @@ exports[`AccountSelector renders correctly and matches snapshot 1`] = `
                                                 style={
                                                   [
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Medium",
                                                       "fontSize": 16,
                                                       "fontWeight": 400,
@@ -1122,7 +1122,7 @@ exports[`AccountSelector renders correctly and matches snapshot 1`] = `
                                                 style={
                                                   [
                                                     {
-                                                      "color": "#686e7d",
+                                                      "color": "#66676a",
                                                       "fontFamily": "Geist-Medium",
                                                       "fontSize": 14,
                                                       "fontWeight": 400,
@@ -1269,7 +1269,7 @@ exports[`AccountSelector renders correctly and matches snapshot 1`] = `
                                                 style={
                                                   [
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Medium",
                                                       "fontSize": 16,
                                                       "fontWeight": 400,
@@ -1288,7 +1288,7 @@ exports[`AccountSelector renders correctly and matches snapshot 1`] = `
                                                 style={
                                                   [
                                                     {
-                                                      "color": "#686e7d",
+                                                      "color": "#66676a",
                                                       "fontFamily": "Geist-Medium",
                                                       "fontSize": 14,
                                                       "fontWeight": 400,
@@ -1435,7 +1435,7 @@ exports[`AccountSelector renders correctly and matches snapshot 1`] = `
                                                 style={
                                                   [
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Medium",
                                                       "fontSize": 16,
                                                       "fontWeight": 400,
@@ -1454,7 +1454,7 @@ exports[`AccountSelector renders correctly and matches snapshot 1`] = `
                                                 style={
                                                   [
                                                     {
-                                                      "color": "#686e7d",
+                                                      "color": "#66676a",
                                                       "fontFamily": "Geist-Medium",
                                                       "fontSize": 14,
                                                       "fontWeight": 400,
@@ -1601,7 +1601,7 @@ exports[`AccountSelector renders correctly and matches snapshot 1`] = `
                                                 style={
                                                   [
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Medium",
                                                       "fontSize": 16,
                                                       "fontWeight": 400,
@@ -1620,7 +1620,7 @@ exports[`AccountSelector renders correctly and matches snapshot 1`] = `
                                                 style={
                                                   [
                                                     {
-                                                      "color": "#686e7d",
+                                                      "color": "#66676a",
                                                       "fontFamily": "Geist-Medium",
                                                       "fontSize": 14,
                                                       "fontWeight": 400,
@@ -1767,7 +1767,7 @@ exports[`AccountSelector renders correctly and matches snapshot 1`] = `
                                                 style={
                                                   [
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Medium",
                                                       "fontSize": 16,
                                                       "fontWeight": 400,
@@ -1786,7 +1786,7 @@ exports[`AccountSelector renders correctly and matches snapshot 1`] = `
                                                 style={
                                                   [
                                                     {
-                                                      "color": "#686e7d",
+                                                      "color": "#66676a",
                                                       "fontFamily": "Geist-Medium",
                                                       "fontSize": 14,
                                                       "fontWeight": 400,
@@ -1933,7 +1933,7 @@ exports[`AccountSelector renders correctly and matches snapshot 1`] = `
                                                 style={
                                                   [
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Medium",
                                                       "fontSize": 16,
                                                       "fontWeight": 400,
@@ -1952,7 +1952,7 @@ exports[`AccountSelector renders correctly and matches snapshot 1`] = `
                                                 style={
                                                   [
                                                     {
-                                                      "color": "#686e7d",
+                                                      "color": "#66676a",
                                                       "fontFamily": "Geist-Medium",
                                                       "fontSize": 14,
                                                       "fontWeight": 400,
diff --git a/app/components/Views/AesCryptoTestForm/__snapshots__/AesCryptoTestForm.test.tsx.snap b/app/components/Views/AesCryptoTestForm/__snapshots__/AesCryptoTestForm.test.tsx.snap
index db0a9ddff73a..47fe99d1ce5e 100644
--- a/app/components/Views/AesCryptoTestForm/__snapshots__/AesCryptoTestForm.test.tsx.snap
+++ b/app/components/Views/AesCryptoTestForm/__snapshots__/AesCryptoTestForm.test.tsx.snap
@@ -99,7 +99,7 @@ exports[`AesCryptoTestForm renders correctly 1`] = `
             style={
               [
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "height": 24,
                   "width": 24,
                 },
@@ -140,7 +140,7 @@ exports[`AesCryptoTestForm renders correctly 1`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -174,7 +174,7 @@ exports[`AesCryptoTestForm renders correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Bold",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -189,7 +189,7 @@ exports[`AesCryptoTestForm renders correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Bold",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -209,7 +209,7 @@ exports[`AesCryptoTestForm renders correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Bold",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -235,7 +235,7 @@ exports[`AesCryptoTestForm renders correctly 1`] = `
             placeholder="Salt bytes count"
             style={
               {
-                "borderColor": "#f3f5f9",
+                "borderColor": "#f3f3f4",
                 "borderRadius": 50,
                 "borderWidth": 2,
                 "paddingHorizontal": 10,
@@ -256,7 +256,7 @@ exports[`AesCryptoTestForm renders correctly 1`] = `
             {
               "alignItems": "center",
               "alignSelf": "flex-start",
-              "backgroundColor": "#121314",
+              "backgroundColor": "#131416",
               "borderRadius": 12,
               "flexDirection": "row",
               "height": 40,
@@ -295,7 +295,7 @@ exports[`AesCryptoTestForm renders correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Bold",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -321,7 +321,7 @@ exports[`AesCryptoTestForm renders correctly 1`] = `
             placeholder="Password"
             style={
               {
-                "borderColor": "#f3f5f9",
+                "borderColor": "#f3f3f4",
                 "borderRadius": 50,
                 "borderWidth": 2,
                 "paddingHorizontal": 10,
@@ -346,7 +346,7 @@ exports[`AesCryptoTestForm renders correctly 1`] = `
             placeholder="Salt"
             style={
               {
-                "borderColor": "#f3f5f9",
+                "borderColor": "#f3f3f4",
                 "borderRadius": 50,
                 "borderWidth": 2,
                 "paddingHorizontal": 10,
@@ -367,7 +367,7 @@ exports[`AesCryptoTestForm renders correctly 1`] = `
             {
               "alignItems": "center",
               "alignSelf": "flex-start",
-              "backgroundColor": "#121314",
+              "backgroundColor": "#131416",
               "borderRadius": 12,
               "flexDirection": "row",
               "height": 40,
@@ -406,7 +406,7 @@ exports[`AesCryptoTestForm renders correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Bold",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -432,7 +432,7 @@ exports[`AesCryptoTestForm renders correctly 1`] = `
             placeholder="Encryption key"
             style={
               {
-                "borderColor": "#f3f5f9",
+                "borderColor": "#f3f3f4",
                 "borderRadius": 50,
                 "borderWidth": 2,
                 "paddingHorizontal": 10,
@@ -457,7 +457,7 @@ exports[`AesCryptoTestForm renders correctly 1`] = `
             placeholder="Data"
             style={
               {
-                "borderColor": "#f3f5f9",
+                "borderColor": "#f3f3f4",
                 "borderRadius": 50,
                 "borderWidth": 2,
                 "paddingHorizontal": 10,
@@ -478,7 +478,7 @@ exports[`AesCryptoTestForm renders correctly 1`] = `
             {
               "alignItems": "center",
               "alignSelf": "flex-start",
-              "backgroundColor": "#121314",
+              "backgroundColor": "#131416",
               "borderRadius": 12,
               "flexDirection": "row",
               "height": 40,
@@ -517,7 +517,7 @@ exports[`AesCryptoTestForm renders correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Bold",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -543,7 +543,7 @@ exports[`AesCryptoTestForm renders correctly 1`] = `
             placeholder="Encryption Key"
             style={
               {
-                "borderColor": "#f3f5f9",
+                "borderColor": "#f3f3f4",
                 "borderRadius": 50,
                 "borderWidth": 2,
                 "paddingHorizontal": 10,
@@ -564,7 +564,7 @@ exports[`AesCryptoTestForm renders correctly 1`] = `
             {
               "alignItems": "center",
               "alignSelf": "flex-start",
-              "backgroundColor": "#121314",
+              "backgroundColor": "#131416",
               "borderRadius": 12,
               "flexDirection": "row",
               "height": 40,
@@ -603,7 +603,7 @@ exports[`AesCryptoTestForm renders correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Bold",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -629,7 +629,7 @@ exports[`AesCryptoTestForm renders correctly 1`] = `
             placeholder="Data"
             style={
               {
-                "borderColor": "#f3f5f9",
+                "borderColor": "#f3f3f4",
                 "borderRadius": 50,
                 "borderWidth": 2,
                 "paddingHorizontal": 10,
@@ -654,7 +654,7 @@ exports[`AesCryptoTestForm renders correctly 1`] = `
             placeholder="Password"
             style={
               {
-                "borderColor": "#f3f5f9",
+                "borderColor": "#f3f3f4",
                 "borderRadius": 50,
                 "borderWidth": 2,
                 "paddingHorizontal": 10,
@@ -675,7 +675,7 @@ exports[`AesCryptoTestForm renders correctly 1`] = `
             {
               "alignItems": "center",
               "alignSelf": "flex-start",
-              "backgroundColor": "#121314",
+              "backgroundColor": "#131416",
               "borderRadius": 12,
               "flexDirection": "row",
               "height": 40,
@@ -714,7 +714,7 @@ exports[`AesCryptoTestForm renders correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Bold",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -740,7 +740,7 @@ exports[`AesCryptoTestForm renders correctly 1`] = `
             placeholder="Password"
             style={
               {
-                "borderColor": "#f3f5f9",
+                "borderColor": "#f3f3f4",
                 "borderRadius": 50,
                 "borderWidth": 2,
                 "paddingHorizontal": 10,
@@ -761,7 +761,7 @@ exports[`AesCryptoTestForm renders correctly 1`] = `
             {
               "alignItems": "center",
               "alignSelf": "flex-start",
-              "backgroundColor": "#121314",
+              "backgroundColor": "#131416",
               "borderRadius": 12,
               "flexDirection": "row",
               "height": 40,
diff --git a/app/components/Views/AesCryptoTestForm/__snapshots__/Clipboard.test.tsx.snap b/app/components/Views/AesCryptoTestForm/__snapshots__/Clipboard.test.tsx.snap
index ab8e94e8dd19..50ddfd1a770c 100644
--- a/app/components/Views/AesCryptoTestForm/__snapshots__/Clipboard.test.tsx.snap
+++ b/app/components/Views/AesCryptoTestForm/__snapshots__/Clipboard.test.tsx.snap
@@ -10,7 +10,7 @@ exports[`ClipboardText renders correctly 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
diff --git a/app/components/Views/AesCryptoTestForm/__snapshots__/Form.test.tsx.snap b/app/components/Views/AesCryptoTestForm/__snapshots__/Form.test.tsx.snap
index 5d2b482449a7..29e7f9f63d8a 100644
--- a/app/components/Views/AesCryptoTestForm/__snapshots__/Form.test.tsx.snap
+++ b/app/components/Views/AesCryptoTestForm/__snapshots__/Form.test.tsx.snap
@@ -6,7 +6,7 @@ exports[`TestForm renders correctly 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Bold",
         "fontSize": 16,
         "letterSpacing": 0,
@@ -37,7 +37,7 @@ exports[`TestForm renders correctly 1`] = `
       {
         "alignItems": "center",
         "alignSelf": "flex-start",
-        "backgroundColor": "#121314",
+        "backgroundColor": "#131416",
         "borderRadius": 12,
         "flexDirection": "row",
         "height": 40,
diff --git a/app/components/Views/Asset/utils.ts b/app/components/Views/Asset/utils.ts
index b1abb70a1b89..24a7cd1e0a56 100644
--- a/app/components/Views/Asset/utils.ts
+++ b/app/components/Views/Asset/utils.ts
@@ -19,7 +19,6 @@ export const getIsSwapsAssetAllowed = ({
     const isChainAllowed = isBridgeAllowed(asset.chainId);
     isSwapsAssetAllowed = isChainAllowed;
   } else {
-    // show Swaps CTA for EVM assets as tokens on Trending list will not be in SwapsController.swapsTokens
     isSwapsAssetAllowed = true;
   }
 
diff --git a/app/components/Views/AssetDetails/AssetDetailsActions/__snapshots__/AssetDetailsActions.test.tsx.snap b/app/components/Views/AssetDetails/AssetDetailsActions/__snapshots__/AssetDetailsActions.test.tsx.snap
index b28283a2d342..e94f41fa81a9 100644
--- a/app/components/Views/AssetDetails/AssetDetailsActions/__snapshots__/AssetDetailsActions.test.tsx.snap
+++ b/app/components/Views/AssetDetails/AssetDetailsActions/__snapshots__/AssetDetailsActions.test.tsx.snap
@@ -65,7 +65,7 @@ exports[`AssetDetailsActions should render correctly 1`] = `
           [
             {
               "alignItems": "center",
-              "backgroundColor": "#3c4d9d0f",
+              "backgroundColor": "#b4b4b528",
               "borderRadius": 12,
               "justifyContent": "center",
               "opacity": 1,
@@ -87,7 +87,7 @@ exports[`AssetDetailsActions should render correctly 1`] = `
           }
         >
           <SvgMock
-            color="#686e7d"
+            color="#66676a"
             fill="currentColor"
             height={24}
             name="AttachMoney"
@@ -105,7 +105,7 @@ exports[`AssetDetailsActions should render correctly 1`] = `
             numberOfLines={1}
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "flexShrink": 0,
                 "fontFamily": "Geist-Medium",
                 "fontSize": 14,
@@ -178,7 +178,7 @@ exports[`AssetDetailsActions should render correctly 1`] = `
           [
             {
               "alignItems": "center",
-              "backgroundColor": "#3c4d9d0f",
+              "backgroundColor": "#b4b4b528",
               "borderRadius": 12,
               "justifyContent": "center",
               "opacity": 0.5,
@@ -200,7 +200,7 @@ exports[`AssetDetailsActions should render correctly 1`] = `
           }
         >
           <SvgMock
-            color="#686e7d"
+            color="#66676a"
             fill="currentColor"
             height={24}
             name="SwapVertical"
@@ -218,7 +218,7 @@ exports[`AssetDetailsActions should render correctly 1`] = `
             numberOfLines={1}
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "flexShrink": 0,
                 "fontFamily": "Geist-Medium",
                 "fontSize": 14,
@@ -291,7 +291,7 @@ exports[`AssetDetailsActions should render correctly 1`] = `
           [
             {
               "alignItems": "center",
-              "backgroundColor": "#3c4d9d0f",
+              "backgroundColor": "#b4b4b528",
               "borderRadius": 12,
               "justifyContent": "center",
               "opacity": 0.5,
@@ -313,7 +313,7 @@ exports[`AssetDetailsActions should render correctly 1`] = `
           }
         >
           <SvgMock
-            color="#686e7d"
+            color="#66676a"
             fill="currentColor"
             height={24}
             name="Send"
@@ -331,7 +331,7 @@ exports[`AssetDetailsActions should render correctly 1`] = `
             numberOfLines={1}
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "flexShrink": 0,
                 "fontFamily": "Geist-Medium",
                 "fontSize": 14,
@@ -404,7 +404,7 @@ exports[`AssetDetailsActions should render correctly 1`] = `
           [
             {
               "alignItems": "center",
-              "backgroundColor": "#3c4d9d0f",
+              "backgroundColor": "#b4b4b528",
               "borderRadius": 12,
               "justifyContent": "center",
               "opacity": 1,
@@ -426,7 +426,7 @@ exports[`AssetDetailsActions should render correctly 1`] = `
           }
         >
           <SvgMock
-            color="#686e7d"
+            color="#66676a"
             fill="currentColor"
             height={24}
             name="Received"
@@ -444,7 +444,7 @@ exports[`AssetDetailsActions should render correctly 1`] = `
             numberOfLines={1}
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "flexShrink": 0,
                 "fontFamily": "Geist-Medium",
                 "fontSize": 14,
diff --git a/app/components/Views/AssetDetails/index.tsx b/app/components/Views/AssetDetails/index.tsx
index 4e899ee298a0..3676d693fa9e 100644
--- a/app/components/Views/AssetDetails/index.tsx
+++ b/app/components/Views/AssetDetails/index.tsx
@@ -414,7 +414,7 @@ const AssetDetails = (props: InnerProps) => {
         <ButtonIcon
           style={inlineHeaderStyles.leftButton}
           onPress={() => navigation.goBack()}
-          size={ButtonIconSize.Lg}
+          size={ButtonIconSize.Md}
           iconName={IconName.ArrowLeft}
         />
         <View style={inlineHeaderStyles.titleWrapper}>
diff --git a/app/components/Views/Browser/__snapshots__/MaxBrowserTabsModal.test.tsx.snap b/app/components/Views/Browser/__snapshots__/MaxBrowserTabsModal.test.tsx.snap
index 4fa5421b1c03..6e45cd6dace7 100644
--- a/app/components/Views/Browser/__snapshots__/MaxBrowserTabsModal.test.tsx.snap
+++ b/app/components/Views/Browser/__snapshots__/MaxBrowserTabsModal.test.tsx.snap
@@ -23,7 +23,7 @@ exports[`MaxBrowserTabsModal should render correctly 1`] = `
     style={
       [
         {
-          "backgroundColor": "#3f434a66",
+          "backgroundColor": "#0a0d135c",
           "bottom": 0,
           "left": 0,
           "position": "absolute",
@@ -73,7 +73,7 @@ exports[`MaxBrowserTabsModal should render correctly 1`] = `
         [
           {
             "backgroundColor": "#ffffff",
-            "borderColor": "#b7bbc866",
+            "borderColor": "#b4b4b566",
             "borderTopLeftRadius": 24,
             "borderTopRightRadius": 24,
             "borderWidth": 1,
@@ -110,7 +110,7 @@ exports[`MaxBrowserTabsModal should render correctly 1`] = `
         <View
           style={
             {
-              "backgroundColor": "#b7bbc866",
+              "backgroundColor": "#b4b4b566",
               "borderRadius": 2,
               "height": 4,
               "width": 40,
@@ -166,9 +166,9 @@ exports[`MaxBrowserTabsModal should render correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Bold",
-              "fontSize": 18,
+              "fontSize": 20,
               "letterSpacing": 0,
               "lineHeight": 24,
             }
@@ -197,7 +197,7 @@ exports[`MaxBrowserTabsModal should render correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -219,7 +219,7 @@ exports[`MaxBrowserTabsModal should render correctly 1`] = `
             {
               "alignItems": "center",
               "alignSelf": "stretch",
-              "backgroundColor": "#121314",
+              "backgroundColor": "#131416",
               "borderRadius": 12,
               "flexDirection": "row",
               "height": 48,
diff --git a/app/components/Views/BrowserTab/BrowserTab.tsx b/app/components/Views/BrowserTab/BrowserTab.tsx
index ad2ccb576487..07e36eac12da 100644
--- a/app/components/Views/BrowserTab/BrowserTab.tsx
+++ b/app/components/Views/BrowserTab/BrowserTab.tsx
@@ -1441,7 +1441,7 @@ export const BrowserTab: React.FC<BrowserTabProps> = React.memo(
               {!isUrlBarFocused && (
                 <ButtonIcon
                   iconName={IconName.ArrowLeft}
-                  size={ButtonIconSize.Lg}
+                  size={ButtonIconSize.Md}
                   onPress={handleClosePress}
                   testID="browser-tab-close-button"
                 />
diff --git a/app/components/Views/BrowserTab/__snapshots__/index.test.tsx.snap b/app/components/Views/BrowserTab/__snapshots__/index.test.tsx.snap
index 5e1642d310e8..c5162b9dfbd4 100644
--- a/app/components/Views/BrowserTab/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/BrowserTab/__snapshots__/index.test.tsx.snap
@@ -69,10 +69,10 @@ exports[`BrowserTab render Browser 1`] = `
               "alignItems": "center",
               "backgroundColor": "transparent",
               "borderRadius": 8,
-              "height": 40,
+              "height": 32,
               "justifyContent": "center",
               "opacity": 1,
-              "width": 40,
+              "width": 32,
             },
             undefined,
             {
@@ -92,9 +92,9 @@ exports[`BrowserTab render Browser 1`] = `
           style={
             [
               {
-                "color": "#121314",
-                "height": 32,
-                "width": 32,
+                "color": "#131416",
+                "height": 24,
+                "width": 24,
               },
               undefined,
             ]
@@ -153,13 +153,13 @@ exports[`BrowserTab render Browser 1`] = `
                 onFocus={[Function]}
                 onSubmitEditing={[Function]}
                 placeholder="Search by site or address"
-                placeholderTextColor="#b7bbc8"
+                placeholderTextColor="#babbbe"
                 returnKeyType="go"
                 selectTextOnFocus={true}
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "flex": 1,
                       "fontFamily": "Geist-Regular",
                       "fontSize": 14,
@@ -200,7 +200,7 @@ exports[`BrowserTab render Browser 1`] = `
                 onStartShouldSetResponder={[Function]}
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 14,
                     "letterSpacing": 0,
@@ -236,7 +236,7 @@ exports[`BrowserTab render Browser 1`] = `
                 [
                   {
                     "alignItems": "center",
-                    "borderColor": "#686e7d",
+                    "borderColor": "#66676a",
                     "borderRadius": 6,
                     "borderWidth": 2,
                     "justifyContent": "center",
@@ -252,7 +252,7 @@ exports[`BrowserTab render Browser 1`] = `
                 style={
                   {
                     "alignSelf": "center",
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "flex": 0,
                     "fontFamily": "Geist-Regular",
                     "fontSize": 15,
@@ -338,7 +338,7 @@ exports[`BrowserTab render Browser 1`] = `
       <View
         style={
           {
-            "borderBottomColor": "#b7bbc8",
+            "borderBottomColor": "#949596",
             "borderBottomWidth": 1,
             "height": 3,
             "width": "100%",
@@ -629,7 +629,7 @@ exports[`BrowserTab render Browser 1`] = `
           {
             "alignItems": "center",
             "backgroundColor": "#ffffff",
-            "borderColor": "#b7bbc866",
+            "borderColor": "#b4b4b566",
             "borderTopWidth": 1,
             "display": "flex",
             "flexDirection": "row",
@@ -716,7 +716,7 @@ exports[`BrowserTab render Browser 1`] = `
             style={
               [
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "height": 32,
                   "width": 32,
                 },
@@ -784,7 +784,7 @@ exports[`BrowserTab render Browser 1`] = `
             style={
               [
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "height": 32,
                   "width": 32,
                 },
@@ -852,7 +852,7 @@ exports[`BrowserTab render Browser 1`] = `
             style={
               [
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "height": 32,
                   "width": 32,
                 },
@@ -934,7 +934,7 @@ exports[`BrowserTab render Browser 1`] = `
             style={
               [
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "height": 32,
                   "width": 32,
                 },
@@ -1002,7 +1002,7 @@ exports[`BrowserTab render Browser 1`] = `
             style={
               [
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "height": 32,
                   "width": 32,
                 },
diff --git a/app/components/Views/BrowserTab/components/IpfsBanner/__snapshots__/index.test.tsx.snap b/app/components/Views/BrowserTab/components/IpfsBanner/__snapshots__/index.test.tsx.snap
index 8fdeed0c9108..9993aa2b63e5 100644
--- a/app/components/Views/BrowserTab/components/IpfsBanner/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/BrowserTab/components/IpfsBanner/__snapshots__/index.test.tsx.snap
@@ -60,9 +60,9 @@ exports[`IpfsBanner should render banner correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Medium",
-            "fontSize": 18,
+            "fontSize": 16,
             "letterSpacing": 0,
             "lineHeight": 24,
           }
@@ -74,7 +74,7 @@ exports[`IpfsBanner should render banner correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -88,7 +88,7 @@ exports[`IpfsBanner should render banner correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Bold",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -105,7 +105,7 @@ exports[`IpfsBanner should render banner correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Bold",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -125,7 +125,7 @@ exports[`IpfsBanner should render banner correctly 1`] = `
         style={
           {
             "backgroundColor": "transparent",
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -177,7 +177,7 @@ exports[`IpfsBanner should render banner correctly 1`] = `
         testID="banner-close-button-icon"
       >
         <SvgMock
-          color="#121314"
+          color="#131416"
           fill="currentColor"
           height={16}
           name="Close"
diff --git a/app/components/Views/BrowserTab/components/Options/__snapshots__/index.test.tsx.snap b/app/components/Views/BrowserTab/components/Options/__snapshots__/index.test.tsx.snap
index 28df9ac27f68..7deed928830a 100644
--- a/app/components/Views/BrowserTab/components/Options/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/BrowserTab/components/Options/__snapshots__/index.test.tsx.snap
@@ -36,7 +36,7 @@ exports[`Options should render options correctly 1`] = `
       [
         {
           "backgroundColor": "#ffffff",
-          "borderColor": "#b7bbc8",
+          "borderColor": "#949596",
           "borderRadius": 10,
           "borderWidth": 1,
           "paddingBottom": 5,
diff --git a/app/components/Views/BrowserTab/components/PhishingModal/__snapshots__/index.test.tsx.snap b/app/components/Views/BrowserTab/components/PhishingModal/__snapshots__/index.test.tsx.snap
index 1b5a50acd485..29c16f51bb52 100644
--- a/app/components/Views/BrowserTab/components/PhishingModal/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/BrowserTab/components/PhishingModal/__snapshots__/index.test.tsx.snap
@@ -53,7 +53,7 @@ exports[`PhishingModal should match snapshot when showPhishingModal is true 1`]
       onStartShouldSetResponder={[Function]}
       style={
         {
-          "backgroundColor": "#f3f5f9",
+          "backgroundColor": "#f3f3f4",
           "bottom": 0,
           "height": 1334,
           "left": 0,
@@ -105,7 +105,7 @@ exports[`PhishingModal should match snapshot when showPhishingModal is true 1`]
       <View
         style={
           {
-            "backgroundColor": "#f3f5f9",
+            "backgroundColor": "#f3f3f4",
             "flex": 1,
             "justifyContent": "center",
             "marginTop": -100,
@@ -149,7 +149,7 @@ exports[`PhishingModal should match snapshot when showPhishingModal is true 1`]
         <Text
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Bold",
               "fontSize": 24,
               "marginBottom": 16,
@@ -162,7 +162,7 @@ exports[`PhishingModal should match snapshot when showPhishingModal is true 1`]
         <Text
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 14,
               "marginBottom": 20,
@@ -174,7 +174,7 @@ exports[`PhishingModal should match snapshot when showPhishingModal is true 1`]
         <Text
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 14,
               "marginBottom": 20,
@@ -228,7 +228,7 @@ exports[`PhishingModal should match snapshot when showPhishingModal is true 1`]
                   "fontSize": 16,
                 },
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "textAlign": "center",
                   "width": 24,
                 },
@@ -246,7 +246,7 @@ exports[`PhishingModal should match snapshot when showPhishingModal is true 1`]
           <Text
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 14,
                 "marginLeft": 12,
@@ -287,7 +287,7 @@ exports[`PhishingModal should match snapshot when showPhishingModal is true 1`]
                   "fontSize": 16,
                 },
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "textAlign": "center",
                   "width": 24,
                 },
@@ -305,7 +305,7 @@ exports[`PhishingModal should match snapshot when showPhishingModal is true 1`]
           <Text
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 14,
                 "marginLeft": 12,
@@ -326,7 +326,7 @@ exports[`PhishingModal should match snapshot when showPhishingModal is true 1`]
             {
               "alignItems": "center",
               "alignSelf": "stretch",
-              "backgroundColor": "#121314",
+              "backgroundColor": "#131416",
               "borderRadius": 12,
               "flexDirection": "row",
               "height": 48,
diff --git a/app/components/Views/ChangeInSimulationModal/__snapshots__/ChangeInSimulationModal.test.tsx.snap b/app/components/Views/ChangeInSimulationModal/__snapshots__/ChangeInSimulationModal.test.tsx.snap
index b88115b8a02a..cff5c74e3c67 100644
--- a/app/components/Views/ChangeInSimulationModal/__snapshots__/ChangeInSimulationModal.test.tsx.snap
+++ b/app/components/Views/ChangeInSimulationModal/__snapshots__/ChangeInSimulationModal.test.tsx.snap
@@ -45,9 +45,9 @@ exports[`ChangeInSimulationModal render matches snapshot 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Bold",
-          "fontSize": 18,
+          "fontSize": 20,
           "letterSpacing": 0,
           "lineHeight": 24,
         }
@@ -68,7 +68,7 @@ exports[`ChangeInSimulationModal render matches snapshot 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
@@ -99,7 +99,7 @@ exports[`ChangeInSimulationModal render matches snapshot 1`] = `
         {
           "alignItems": "center",
           "alignSelf": "stretch",
-          "backgroundColor": "#121314",
+          "backgroundColor": "#131416",
           "borderRadius": 12,
           "flexDirection": "row",
           "height": 48,
@@ -136,7 +136,7 @@ exports[`ChangeInSimulationModal render matches snapshot 1`] = `
         {
           "alignItems": "center",
           "alignSelf": "stretch",
-          "backgroundColor": "#3c4d9d0f",
+          "backgroundColor": "#b4b4b528",
           "borderColor": "transparent",
           "borderRadius": 12,
           "borderWidth": 1,
@@ -153,7 +153,7 @@ exports[`ChangeInSimulationModal render matches snapshot 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "letterSpacing": 0,
diff --git a/app/components/Views/ChoosePassword/FoxRiveLoaderAnimation/__snapshots__/index.test.tsx.snap b/app/components/Views/ChoosePassword/FoxRiveLoaderAnimation/__snapshots__/index.test.tsx.snap
index 382a1609153b..b285a538b424 100644
--- a/app/components/Views/ChoosePassword/FoxRiveLoaderAnimation/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/ChoosePassword/FoxRiveLoaderAnimation/__snapshots__/index.test.tsx.snap
@@ -35,7 +35,7 @@ exports[`FoxRiveLoaderAnimation displays Rive animation and ActivityIndicator 1`
     }
   >
     <ActivityIndicator
-      color="#121314"
+      color="#131416"
       size="large"
     />
   </View>
diff --git a/app/components/Views/ChoosePassword/__snapshots__/index.test.tsx.snap b/app/components/Views/ChoosePassword/__snapshots__/index.test.tsx.snap
index e0693ca14a4f..446ba471f420 100644
--- a/app/components/Views/ChoosePassword/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/ChoosePassword/__snapshots__/index.test.tsx.snap
@@ -89,7 +89,7 @@ exports[`ChoosePassword render matches snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Bold",
                   "fontSize": 32,
                   "letterSpacing": 0,
@@ -103,7 +103,7 @@ exports[`ChoosePassword render matches snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -127,7 +127,7 @@ exports[`ChoosePassword render matches snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Medium",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -172,8 +172,8 @@ exports[`ChoosePassword render matches snapshot 1`] = `
               style={
                 {
                   "alignItems": "center",
-                  "backgroundColor": "#3c4d9d0f",
-                  "borderColor": "#b7bbc8",
+                  "backgroundColor": "#b4b4b528",
+                  "borderColor": "#949596",
                   "borderRadius": 12,
                   "borderWidth": 1,
                   "flexDirection": "row",
@@ -203,7 +203,7 @@ exports[`ChoosePassword render matches snapshot 1`] = `
                   onChangeText={[Function]}
                   onFocus={[Function]}
                   onSubmitEditing={[Function]}
-                  placeholderTextColor="#686e7d"
+                  placeholderTextColor="#66676a"
                   returnKeyType="next"
                   secureTextEntry={true}
                   style={
@@ -211,7 +211,7 @@ exports[`ChoosePassword render matches snapshot 1`] = `
                       "backgroundColor": "inherit",
                       "borderColor": "transparent",
                       "borderWidth": 1,
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "fontWeight": "400",
@@ -237,7 +237,7 @@ exports[`ChoosePassword render matches snapshot 1`] = `
                   onPress={[Function]}
                 >
                   <SvgMock
-                    color="#686e7d"
+                    color="#66676a"
                     fill="currentColor"
                     height={24}
                     name="Eye"
@@ -256,7 +256,7 @@ exports[`ChoosePassword render matches snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 14,
                   "letterSpacing": 0,
@@ -280,7 +280,7 @@ exports[`ChoosePassword render matches snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Medium",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -325,8 +325,8 @@ exports[`ChoosePassword render matches snapshot 1`] = `
               style={
                 {
                   "alignItems": "center",
-                  "backgroundColor": "#3c4d9d0f",
-                  "borderColor": "#b7bbc866",
+                  "backgroundColor": "#b4b4b528",
+                  "borderColor": "#b4b4b566",
                   "borderRadius": 12,
                   "borderWidth": 1,
                   "flexDirection": "row",
@@ -357,7 +357,7 @@ exports[`ChoosePassword render matches snapshot 1`] = `
                   onChangeText={[Function]}
                   onFocus={[Function]}
                   onSubmitEditing={[Function]}
-                  placeholderTextColor="#686e7d"
+                  placeholderTextColor="#66676a"
                   returnKeyType="done"
                   secureTextEntry={true}
                   style={
@@ -365,7 +365,7 @@ exports[`ChoosePassword render matches snapshot 1`] = `
                       "backgroundColor": "inherit",
                       "borderColor": "transparent",
                       "borderWidth": 1,
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "fontWeight": "400",
@@ -390,7 +390,7 @@ exports[`ChoosePassword render matches snapshot 1`] = `
                   onPress={[Function]}
                 >
                   <SvgMock
-                    color="#686e7d"
+                    color="#66676a"
                     fill="currentColor"
                     height={24}
                     name="Eye"
@@ -410,7 +410,7 @@ exports[`ChoosePassword render matches snapshot 1`] = `
             style={
               {
                 "alignItems": "flex-start",
-                "backgroundColor": "#f3f5f9",
+                "backgroundColor": "#f3f3f4",
                 "borderRadius": 8,
                 "flexDirection": "row",
                 "gap": 8,
@@ -440,7 +440,7 @@ exports[`ChoosePassword render matches snapshot 1`] = `
                   {
                     "alignItems": "center",
                     "backgroundColor": "#ffffff",
-                    "borderColor": "#b7bbc8",
+                    "borderColor": "#949596",
                     "borderRadius": 4,
                     "borderWidth": 2,
                     "height": 20,
@@ -460,7 +460,7 @@ exports[`ChoosePassword render matches snapshot 1`] = `
                 {
                   "alignItems": "flex-start",
                   "backgroundColor": "transparent",
-                  "color": "#121314",
+                  "color": "#131416",
                   "flexDirection": "row",
                   "flexWrap": "wrap",
                   "fontFamily": "Geist-Regular",
@@ -480,7 +480,7 @@ exports[`ChoosePassword render matches snapshot 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 14,
                     "letterSpacing": 0,
@@ -492,7 +492,7 @@ exports[`ChoosePassword render matches snapshot 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#686e7d",
+                      "color": "#66676a",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 14,
                       "letterSpacing": 0,
@@ -545,7 +545,7 @@ exports[`ChoosePassword render matches snapshot 1`] = `
                 {
                   "alignItems": "center",
                   "alignSelf": "stretch",
-                  "backgroundColor": "#121314",
+                  "backgroundColor": "#131416",
                   "borderRadius": 12,
                   "flexDirection": "row",
                   "height": 48,
diff --git a/app/components/Views/CollectibleView/__snapshots__/index.test.tsx.snap b/app/components/Views/CollectibleView/__snapshots__/index.test.tsx.snap
index 7f664ea5abe9..bcb3954e5de9 100644
--- a/app/components/Views/CollectibleView/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/CollectibleView/__snapshots__/index.test.tsx.snap
@@ -52,7 +52,7 @@ exports[`CollectibleView Snapshot renders correctly 1`] = `
             <View
               style={
                 {
-                  "backgroundColor": "#b7bbc8",
+                  "backgroundColor": "#949596",
                   "borderRadius": 4,
                   "height": 5,
                   "width": 48,
@@ -76,7 +76,7 @@ exports[`CollectibleView Snapshot renders correctly 1`] = `
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 30,
                         "marginVertical": 2,
@@ -94,7 +94,7 @@ exports[`CollectibleView Snapshot renders correctly 1`] = `
                       undefined,
                       undefined,
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                       },
                       undefined,
                       undefined,
@@ -121,7 +121,7 @@ exports[`CollectibleView Snapshot renders correctly 1`] = `
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 30,
                         "marginVertical": 2,
@@ -137,7 +137,7 @@ exports[`CollectibleView Snapshot renders correctly 1`] = `
                       undefined,
                       undefined,
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                       },
                       undefined,
                       undefined,
@@ -214,7 +214,7 @@ exports[`CollectibleView Snapshot renders correctly 1`] = `
                     style={
                       [
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 30,
                           "marginVertical": 2,
@@ -296,7 +296,7 @@ exports[`CollectibleView Snapshot renders correctly 1`] = `
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 30,
                         "marginVertical": 2,
@@ -308,14 +308,14 @@ exports[`CollectibleView Snapshot renders correctly 1`] = `
                       },
                       undefined,
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                       },
                       undefined,
                       undefined,
                       undefined,
                       undefined,
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                       },
                       undefined,
                       undefined,
@@ -349,7 +349,7 @@ exports[`CollectibleView Snapshot renders correctly 1`] = `
                   style={
                     [
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 30,
                         "marginVertical": 2,
diff --git a/app/components/Views/ConnectHardware/SelectHardware/index.tsx b/app/components/Views/ConnectHardware/SelectHardware/index.tsx
index 25ab3dbcc58f..a2bd3786951a 100644
--- a/app/components/Views/ConnectHardware/SelectHardware/index.tsx
+++ b/app/components/Views/ConnectHardware/SelectHardware/index.tsx
@@ -10,7 +10,8 @@ import Text, {
   TextVariant,
   TextColor,
 } from '../../../../component-library/components/Texts/Text';
-import HeaderStackedStandard from '../../../../component-library/components-temp/HeaderStackedStandard';
+import HeaderCompactStandard from '../../../../component-library/components-temp/HeaderCompactStandard';
+import TitleStandard from '../../../../component-library/components-temp/TitleStandard';
 import Routes from '../../../../constants/navigation/Routes';
 import { MetaMetricsEvents } from '../../../../core/Analytics';
 import {
@@ -156,21 +157,19 @@ const SelectHardwareWallet = () => {
 
   return (
     <SafeAreaView edges={{ bottom: 'additive' }} style={styles.container}>
-      <HeaderStackedStandard
-        includesTopInset
-        onBack={navigation.goBack}
-        titleStandardProps={{
-          title: strings('connect_hardware.title_select_hardware'),
-          bottomAccessory: (
-            <Text
-              variant={TextVariant.BodyMD}
-              color={TextColor.Alternative}
-              style={styles.subtitle}
-            >
-              {strings('connect_hardware.select_hardware')}
-            </Text>
-          ),
-        }}
+      <HeaderCompactStandard includesTopInset onBack={navigation.goBack} />
+      <TitleStandard
+        title={strings('connect_hardware.title_select_hardware')}
+        bottomAccessory={
+          <Text
+            variant={TextVariant.BodyMD}
+            color={TextColor.Alternative}
+            style={styles.subtitle}
+          >
+            {strings('connect_hardware.select_hardware')}
+          </Text>
+        }
+        twClassName="px-4 pt-1 pb-3"
       />
       <View style={styles.buttonsContainer}>
         <LedgerButton />
diff --git a/app/components/Views/ConnectQRHardware/__snapshots__/index.test.tsx.snap b/app/components/Views/ConnectQRHardware/__snapshots__/index.test.tsx.snap
index 4f2d9450fea7..5e03decf6daa 100644
--- a/app/components/Views/ConnectQRHardware/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/ConnectQRHardware/__snapshots__/index.test.tsx.snap
@@ -28,7 +28,7 @@ exports[`ConnectQRHardware renders correctly to match snapshot 1`] = `
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontSize": 42,
             },
             {
@@ -69,7 +69,7 @@ exports[`ConnectQRHardware renders correctly to match snapshot 1`] = `
                 "fontSize": 15,
               },
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontSize": 28,
               },
               {
@@ -112,7 +112,7 @@ exports[`ConnectQRHardware renders correctly to match snapshot 1`] = `
           <Text
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 24,
                 "marginBottom": 20,
@@ -134,7 +134,7 @@ exports[`ConnectQRHardware renders correctly to match snapshot 1`] = `
             <Text
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 14,
                   "marginBottom": 24,
@@ -148,7 +148,7 @@ exports[`ConnectQRHardware renders correctly to match snapshot 1`] = `
               style={
                 [
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 14,
                     "marginBottom": 24,
@@ -165,7 +165,7 @@ exports[`ConnectQRHardware renders correctly to match snapshot 1`] = `
             <Text
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 14,
                   "marginBottom": 24,
@@ -177,7 +177,7 @@ exports[`ConnectQRHardware renders correctly to match snapshot 1`] = `
             <Text
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontSize": 24,
                   "height": 48,
                 }
@@ -198,7 +198,7 @@ exports[`ConnectQRHardware renders correctly to match snapshot 1`] = `
                 style={
                   [
                     {
-                      "color": "#686e7d",
+                      "color": "#66676a",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 14,
                       "marginBottom": 24,
@@ -220,7 +220,7 @@ exports[`ConnectQRHardware renders correctly to match snapshot 1`] = `
                 style={
                   [
                     {
-                      "color": "#686e7d",
+                      "color": "#66676a",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 14,
                       "marginBottom": 24,
@@ -238,7 +238,7 @@ exports[`ConnectQRHardware renders correctly to match snapshot 1`] = `
             <Text
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontSize": 24,
                   "height": 48,
                 }
@@ -259,7 +259,7 @@ exports[`ConnectQRHardware renders correctly to match snapshot 1`] = `
                 style={
                   [
                     {
-                      "color": "#686e7d",
+                      "color": "#66676a",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 14,
                       "marginBottom": 24,
@@ -281,7 +281,7 @@ exports[`ConnectQRHardware renders correctly to match snapshot 1`] = `
                 style={
                   [
                     {
-                      "color": "#686e7d",
+                      "color": "#66676a",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 14,
                       "marginBottom": 24,
diff --git a/app/components/Views/DataCollectionModal/__snapshots__/index.test.tsx.snap b/app/components/Views/DataCollectionModal/__snapshots__/index.test.tsx.snap
index e7391d2371c0..7f373784aa75 100644
--- a/app/components/Views/DataCollectionModal/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/DataCollectionModal/__snapshots__/index.test.tsx.snap
@@ -23,7 +23,7 @@ exports[`DataCollectionModal should render expected snapshot 1`] = `
     style={
       [
         {
-          "backgroundColor": "#3f434a66",
+          "backgroundColor": "#0a0d135c",
           "bottom": 0,
           "left": 0,
           "position": "absolute",
@@ -73,7 +73,7 @@ exports[`DataCollectionModal should render expected snapshot 1`] = `
         [
           {
             "backgroundColor": "#ffffff",
-            "borderColor": "#b7bbc866",
+            "borderColor": "#b4b4b566",
             "borderTopLeftRadius": 24,
             "borderTopRightRadius": 24,
             "borderWidth": 1,
@@ -110,7 +110,7 @@ exports[`DataCollectionModal should render expected snapshot 1`] = `
         <View
           style={
             {
-              "backgroundColor": "#b7bbc866",
+              "backgroundColor": "#b4b4b566",
               "borderRadius": 2,
               "height": 4,
               "width": 40,
@@ -157,7 +157,7 @@ exports[`DataCollectionModal should render expected snapshot 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -189,7 +189,7 @@ exports[`DataCollectionModal should render expected snapshot 1`] = `
               {
                 "alignItems": "center",
                 "alignSelf": "flex-start",
-                "backgroundColor": "#121314",
+                "backgroundColor": "#131416",
                 "borderRadius": 12,
                 "flex": 1,
                 "flexDirection": "row",
diff --git a/app/components/Views/DetectedTokens/components/__snapshots__/Token.test.tsx.snap b/app/components/Views/DetectedTokens/components/__snapshots__/Token.test.tsx.snap
index f5e24cf7bb9b..ea2009a69c27 100644
--- a/app/components/Views/DetectedTokens/components/__snapshots__/Token.test.tsx.snap
+++ b/app/components/Views/DetectedTokens/components/__snapshots__/Token.test.tsx.snap
@@ -111,7 +111,7 @@ exports[`Token Component matches snapshot when token is not selected 1`] = `
     <Text
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 18,
           "marginBottom": 4,
@@ -131,7 +131,7 @@ exports[`Token Component matches snapshot when token is not selected 1`] = `
       <Text
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 14,
           }
@@ -198,7 +198,7 @@ exports[`Token Component matches snapshot when token is not selected 1`] = `
       <Text
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 14,
           }
@@ -257,7 +257,7 @@ exports[`Token Component matches snapshot when token is not selected 1`] = `
       }
       tintColors={
         {
-          "false": "#b7bbc8",
+          "false": "#949596",
           "true": "#4459ff",
         }
       }
@@ -378,7 +378,7 @@ exports[`Token Component matches snapshot when token is selected 1`] = `
     <Text
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 18,
           "marginBottom": 4,
@@ -398,7 +398,7 @@ exports[`Token Component matches snapshot when token is selected 1`] = `
       <Text
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 14,
           }
@@ -465,7 +465,7 @@ exports[`Token Component matches snapshot when token is selected 1`] = `
       <Text
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 14,
           }
@@ -524,7 +524,7 @@ exports[`Token Component matches snapshot when token is selected 1`] = `
       }
       tintColors={
         {
-          "false": "#b7bbc8",
+          "false": "#949596",
           "true": "#4459ff",
         }
       }
@@ -645,7 +645,7 @@ exports[`Token Component renders correctly 1`] = `
     <Text
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 18,
           "marginBottom": 4,
@@ -665,7 +665,7 @@ exports[`Token Component renders correctly 1`] = `
       <Text
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 14,
           }
@@ -732,7 +732,7 @@ exports[`Token Component renders correctly 1`] = `
       <Text
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 14,
           }
@@ -791,7 +791,7 @@ exports[`Token Component renders correctly 1`] = `
       }
       tintColors={
         {
-          "false": "#b7bbc8",
+          "false": "#949596",
           "true": "#4459ff",
         }
       }
@@ -912,7 +912,7 @@ exports[`Token Component renders correctly with token chainId 1`] = `
     <Text
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 18,
           "marginBottom": 4,
@@ -932,7 +932,7 @@ exports[`Token Component renders correctly with token chainId 1`] = `
       <Text
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 14,
           }
@@ -999,7 +999,7 @@ exports[`Token Component renders correctly with token chainId 1`] = `
       <Text
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 14,
           }
@@ -1058,7 +1058,7 @@ exports[`Token Component renders correctly with token chainId 1`] = `
       }
       tintColors={
         {
-          "false": "#b7bbc8",
+          "false": "#949596",
           "true": "#4459ff",
         }
       }
diff --git a/app/components/Views/EditAccountName/__snapshots__/EditAccountName.test.tsx.snap b/app/components/Views/EditAccountName/__snapshots__/EditAccountName.test.tsx.snap
index adbc82de7bf7..05bc2be40841 100644
--- a/app/components/Views/EditAccountName/__snapshots__/EditAccountName.test.tsx.snap
+++ b/app/components/Views/EditAccountName/__snapshots__/EditAccountName.test.tsx.snap
@@ -31,9 +31,9 @@ exports[`EditAccountName should render correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Medium",
-            "fontSize": 18,
+            "fontSize": 20,
             "letterSpacing": 0,
             "lineHeight": 24,
           }
@@ -74,8 +74,8 @@ exports[`EditAccountName should render correctly 1`] = `
         style={
           {
             "alignItems": "center",
-            "backgroundColor": "#3c4d9d0f",
-            "borderColor": "#b7bbc8",
+            "backgroundColor": "#b4b4b528",
+            "borderColor": "#949596",
             "borderRadius": 12,
             "borderWidth": 1,
             "flexDirection": "row",
@@ -101,13 +101,13 @@ exports[`EditAccountName should render correctly 1`] = `
             onBlur={[Function]}
             onChangeText={[Function]}
             onFocus={[Function]}
-            placeholderTextColor="#686e7d"
+            placeholderTextColor="#66676a"
             style={
               {
                 "backgroundColor": "inherit",
                 "borderColor": "transparent",
                 "borderWidth": 1,
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "fontWeight": "400",
@@ -134,9 +134,9 @@ exports[`EditAccountName should render correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Medium",
-            "fontSize": 18,
+            "fontSize": 20,
             "letterSpacing": 0,
             "lineHeight": 24,
           }
@@ -177,8 +177,8 @@ exports[`EditAccountName should render correctly 1`] = `
         style={
           {
             "alignItems": "center",
-            "backgroundColor": "#3c4d9d0f",
-            "borderColor": "#b7bbc8",
+            "backgroundColor": "#b4b4b528",
+            "borderColor": "#949596",
             "borderRadius": 12,
             "borderWidth": 1,
             "flexDirection": "row",
@@ -204,18 +204,19 @@ exports[`EditAccountName should render correctly 1`] = `
             onBlur={[Function]}
             onFocus={[Function]}
             placeholder="0x49a016E6736F9Ad381605c...72A6"
-            placeholderTextColor="#686e7d"
+            placeholderTextColor="#66676a"
             style={
               {
                 "backgroundColor": "inherit",
                 "borderColor": "transparent",
                 "borderWidth": 1,
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "fontWeight": "400",
                 "height": 46,
                 "letterSpacing": 0,
+                "lineHeight": 0,
                 "opacity": 1,
               }
             }
@@ -245,7 +246,7 @@ exports[`EditAccountName should render correctly 1`] = `
         {
           "alignItems": "center",
           "alignSelf": "stretch",
-          "backgroundColor": "#3c4d9d0f",
+          "backgroundColor": "#b4b4b528",
           "borderColor": "transparent",
           "borderRadius": 12,
           "borderWidth": 1,
@@ -263,7 +264,7 @@ exports[`EditAccountName should render correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -286,7 +287,7 @@ exports[`EditAccountName should render correctly 1`] = `
         {
           "alignItems": "center",
           "alignSelf": "stretch",
-          "backgroundColor": "#121314",
+          "backgroundColor": "#131416",
           "borderRadius": 12,
           "flex": 1,
           "flexDirection": "row",
diff --git a/app/components/Views/ExperienceEnhancerModal/index.test.tsx b/app/components/Views/ExperienceEnhancerModal/index.test.tsx
index 90698ed868e8..6cb5aa9c2cf2 100644
--- a/app/components/Views/ExperienceEnhancerModal/index.test.tsx
+++ b/app/components/Views/ExperienceEnhancerModal/index.test.tsx
@@ -8,6 +8,17 @@ import { HOW_TO_MANAGE_METRAMETRICS_SETTINGS } from '../../../constants/urls';
 import ExperienceEnhancerModal from './';
 import { ExperienceEnhancerBottomSheetSelectorsIDs } from './ExperienceEnhancerModal.testIds';
 
+jest.mock('../../../components/hooks/useAnalytics/useAnalytics', () => ({
+  useAnalytics: () => ({
+    trackEvent: jest.fn(),
+    addTraitsToUser: jest.fn(),
+    createEventBuilder: jest.fn(() => ({
+      addProperties: jest.fn().mockReturnThis(),
+      build: jest.fn(),
+    })),
+  }),
+}));
+
 // Mock the BottomSheet component
 jest.mock(
   '../../../component-library/components/BottomSheets/BottomSheet',
diff --git a/app/components/Views/ExperienceEnhancerModal/index.tsx b/app/components/Views/ExperienceEnhancerModal/index.tsx
index 1a84dd8c56fb..081373aa0b26 100644
--- a/app/components/Views/ExperienceEnhancerModal/index.tsx
+++ b/app/components/Views/ExperienceEnhancerModal/index.tsx
@@ -19,10 +19,8 @@ import Button, {
 } from '../../../component-library/components/Buttons/Button';
 import { ButtonProps } from '../../../component-library/components/Buttons/Button/Button.types';
 import { setDataCollectionForMarketing } from '../../../actions/security';
-import {
-  MetaMetricsEvents,
-  useMetrics,
-} from '../../../components/hooks/useMetrics';
+import { MetaMetricsEvents } from '../../../core/Analytics';
+import { useAnalytics } from '../../../components/hooks/useAnalytics/useAnalytics';
 import { HOW_TO_MANAGE_METRAMETRICS_SETTINGS } from '../../../constants/urls';
 import { ExperienceEnhancerBottomSheetSelectorsIDs } from './ExperienceEnhancerModal.testIds';
 import { UserProfileProperty } from '../../../util/metrics/UserSettingsAnalyticsMetaData/UserProfileAnalyticsMetaData.types';
@@ -30,7 +28,7 @@ import { UserProfileProperty } from '../../../util/metrics/UserSettingsAnalytics
 const ExperienceEnhancerModal = () => {
   const dispatch = useDispatch();
   const styles = createStyles();
-  const { trackEvent, addTraitsToUser, createEventBuilder } = useMetrics();
+  const { trackEvent, addTraitsToUser, createEventBuilder } = useAnalytics();
   const bottomSheetRef = useRef<BottomSheetRef>(null);
 
   const cancelButtonProps: ButtonProps = {
diff --git a/app/components/Views/GasEducationCarousel/__snapshots__/index.test.tsx.snap b/app/components/Views/GasEducationCarousel/__snapshots__/index.test.tsx.snap
index 6b555ac72224..2e56cc743660 100644
--- a/app/components/Views/GasEducationCarousel/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/GasEducationCarousel/__snapshots__/index.test.tsx.snap
@@ -142,7 +142,7 @@ exports[`GasEducationCarousel should render correctly 1`] = `
                           style={
                             [
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Regular",
                                 "fontSize": 30,
                                 "marginVertical": 2,
@@ -154,14 +154,14 @@ exports[`GasEducationCarousel should render correctly 1`] = `
                               },
                               undefined,
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                               },
                               undefined,
                               undefined,
                               undefined,
                               undefined,
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                               },
                               undefined,
                               undefined,
@@ -193,7 +193,7 @@ exports[`GasEducationCarousel should render correctly 1`] = `
                           style={
                             [
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Regular",
                                 "fontSize": 30,
                                 "marginVertical": 2,
@@ -205,7 +205,7 @@ exports[`GasEducationCarousel should render correctly 1`] = `
                               undefined,
                               undefined,
                               {
-                                "color": "#686e7d",
+                                "color": "#66676a",
                               },
                               undefined,
                               undefined,
@@ -241,7 +241,7 @@ exports[`GasEducationCarousel should render correctly 1`] = `
                           style={
                             [
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Regular",
                                 "fontSize": 30,
                                 "marginVertical": 2,
@@ -253,7 +253,7 @@ exports[`GasEducationCarousel should render correctly 1`] = `
                               undefined,
                               undefined,
                               {
-                                "color": "#686e7d",
+                                "color": "#66676a",
                               },
                               undefined,
                               undefined,
@@ -289,7 +289,7 @@ exports[`GasEducationCarousel should render correctly 1`] = `
                             style={
                               [
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 30,
                                   "marginVertical": 2,
@@ -364,7 +364,7 @@ exports[`GasEducationCarousel should render correctly 1`] = `
               style={
                 [
                   {
-                    "backgroundColor": "#121314",
+                    "backgroundColor": "#131416",
                     "borderRadius": 4,
                     "height": 8,
                     "marginHorizontal": 8,
@@ -381,7 +381,7 @@ exports[`GasEducationCarousel should render correctly 1`] = `
               style={
                 [
                   {
-                    "backgroundColor": "#121314",
+                    "backgroundColor": "#131416",
                     "borderRadius": 4,
                     "height": 8,
                     "marginHorizontal": 8,
@@ -396,7 +396,7 @@ exports[`GasEducationCarousel should render correctly 1`] = `
               style={
                 [
                   {
-                    "backgroundColor": "#121314",
+                    "backgroundColor": "#131416",
                     "borderRadius": 4,
                     "height": 8,
                     "marginHorizontal": 8,
diff --git a/app/components/Views/Homepage/Homepage.test.tsx b/app/components/Views/Homepage/Homepage.test.tsx
index 6083fec2eea3..fcae9da0b191 100644
--- a/app/components/Views/Homepage/Homepage.test.tsx
+++ b/app/components/Views/Homepage/Homepage.test.tsx
@@ -13,9 +13,25 @@ jest.mock('@react-navigation/native', () => {
     useNavigation: () => ({
       navigate: jest.fn(),
     }),
+    useFocusEffect: (callback: () => void) => {
+      const React = jest.requireActual('react');
+      React.useEffect(callback, [callback]);
+    },
   };
 });
 
+// Mock feature flags - enable all sections by default
+const mockDetectNfts = jest.fn().mockResolvedValue(undefined);
+const mockAbortDetection = jest.fn();
+
+jest.mock('../../hooks/useNftDetection', () => ({
+  useNftDetection: () => ({
+    detectNfts: mockDetectNfts,
+    abortDetection: mockAbortDetection,
+    chainIdsToDetectNftsFor: [],
+  }),
+}));
+
 // Mock feature flags - enable all sections
 jest.mock('../../UI/Perps', () => ({
   selectPerpsEnabledFlag: jest.fn(() => true),
@@ -52,6 +68,19 @@ jest.mock('../../UI/Perps/hooks', () => ({
   })),
 }));
 
+jest.mock('../../UI/Perps/hooks/usePerpsConnection', () => ({
+  usePerpsConnection: jest.fn(() => ({
+    isConnected: true,
+    isConnecting: false,
+    isInitialized: true,
+    error: null,
+    connect: jest.fn(),
+    disconnect: jest.fn(),
+    resetError: jest.fn(),
+    reconnectWithNewContext: jest.fn().mockResolvedValue(undefined),
+  })),
+}));
+
 jest.mock(
   '../Homepage/Sections/Perpetuals/hooks/useHomepageSparklines',
   () => ({
@@ -84,6 +113,21 @@ jest.mock(
   }),
 );
 
+// Mock useHomeViewedEvent to avoid analytics side-effects in
+// Homepage-level tests — section-level analytics are covered by the hook tests.
+const mockUseHomeViewedEvent = jest.fn();
+jest.mock('./hooks/useHomeViewedEvent', () => ({
+  __esModule: true,
+  default: (...args: unknown[]) => mockUseHomeViewedEvent(...args),
+  HomeSectionNames: {
+    TOKENS: 'tokens',
+    PERPS: 'perps',
+    DEFI: 'defi',
+    PREDICT: 'predict',
+    NFTS: 'nfts',
+  },
+}));
+
 // State with preferences needed for NFT section rendering
 const stateWithPreferences = {
   engine: {
@@ -101,6 +145,17 @@ const stateWithPreferences = {
 describe('Homepage', () => {
   beforeEach(() => {
     jest.clearAllMocks();
+    jest
+      .requireMock('../../UI/Perps')
+      .selectPerpsEnabledFlag.mockReturnValue(true);
+    jest
+      .requireMock('../../UI/Predict/selectors/featureFlags')
+      .selectPredictEnabledFlag.mockReturnValue(true);
+    jest
+      .requireMock(
+        '../../../selectors/featureFlagController/assetsDefiPositions',
+      )
+      .selectAssetsDefiPositionsEnabled.mockReturnValue(true);
   });
 
   it('renders NFTs section title', () => {
@@ -113,7 +168,6 @@ describe('Homepage', () => {
     renderWithProvider(<Homepage />, { state: stateWithPreferences });
 
     expect(screen.getByText('Import NFTs')).toBeOnTheScreen();
-    expect(screen.getByText('Easily add your collectibles')).toBeOnTheScreen();
   });
 
   it('exposes refresh function via ref', () => {
@@ -133,4 +187,88 @@ describe('Homepage', () => {
 
     await expect(result).resolves.toBeUndefined();
   });
+
+  describe('section indices — all flags enabled', () => {
+    it('passes correct sectionIndex to each section when all flags are on', () => {
+      renderWithProvider(<Homepage />, { state: stateWithPreferences });
+
+      // Tokens=0, Perps=1, Predict=2, DeFi=3, NFTs=4 → total=5
+      const calls = mockUseHomeViewedEvent.mock.calls;
+      const callBySectionName = (name: string) =>
+        calls.find((c) => c[0]?.sectionName === name)?.[0];
+
+      expect(callBySectionName('tokens')?.sectionIndex).toBe(0);
+      expect(callBySectionName('perps')?.sectionIndex).toBe(1);
+      expect(callBySectionName('predict')?.sectionIndex).toBe(2);
+      expect(callBySectionName('defi')?.sectionIndex).toBe(3);
+      expect(callBySectionName('nfts')?.sectionIndex).toBe(4);
+    });
+
+    it('passes totalSectionsLoaded=5 when all flags are enabled', () => {
+      renderWithProvider(<Homepage />, { state: stateWithPreferences });
+
+      const calls = mockUseHomeViewedEvent.mock.calls;
+      calls.forEach((call) => {
+        expect(call[0]?.totalSectionsLoaded).toBe(5);
+      });
+    });
+  });
+
+  describe('section indices — Perps disabled', () => {
+    beforeEach(() => {
+      jest
+        .requireMock('../../UI/Perps')
+        .selectPerpsEnabledFlag.mockReturnValue(false);
+    });
+
+    it('shifts indices when Perps is disabled', () => {
+      renderWithProvider(<Homepage />, { state: stateWithPreferences });
+
+      const calls = mockUseHomeViewedEvent.mock.calls;
+      const callBySectionName = (name: string) =>
+        calls.find((c) => c[0]?.sectionName === name)?.[0];
+
+      expect(callBySectionName('tokens')?.sectionIndex).toBe(0);
+      expect(callBySectionName('predict')?.sectionIndex).toBe(1);
+      expect(callBySectionName('defi')?.sectionIndex).toBe(2);
+      expect(callBySectionName('nfts')?.sectionIndex).toBe(3);
+    });
+
+    it('passes totalSectionsLoaded=4 when Perps is disabled', () => {
+      renderWithProvider(<Homepage />, { state: stateWithPreferences });
+
+      const calls = mockUseHomeViewedEvent.mock.calls;
+      calls.forEach((call) => {
+        expect(call[0]?.totalSectionsLoaded).toBe(4);
+      });
+    });
+  });
+
+  describe('section indices — all optional flags disabled', () => {
+    beforeEach(() => {
+      jest
+        .requireMock('../../UI/Perps')
+        .selectPerpsEnabledFlag.mockReturnValue(false);
+      jest
+        .requireMock('../../UI/Predict/selectors/featureFlags')
+        .selectPredictEnabledFlag.mockReturnValue(false);
+      jest
+        .requireMock(
+          '../../../selectors/featureFlagController/assetsDefiPositions',
+        )
+        .selectAssetsDefiPositionsEnabled.mockReturnValue(false);
+    });
+
+    it('passes totalSectionsLoaded=2 when only Tokens and NFTs are enabled', () => {
+      renderWithProvider(<Homepage />, { state: stateWithPreferences });
+
+      const calls = mockUseHomeViewedEvent.mock.calls;
+      const callBySectionName = (name: string) =>
+        calls.find((c) => c[0]?.sectionName === name)?.[0];
+
+      expect(callBySectionName('tokens')?.sectionIndex).toBe(0);
+      expect(callBySectionName('nfts')?.sectionIndex).toBe(1);
+      expect(callBySectionName('tokens')?.totalSectionsLoaded).toBe(2);
+    });
+  });
 });
diff --git a/app/components/Views/Homepage/Homepage.tsx b/app/components/Views/Homepage/Homepage.tsx
index 63a420a3f4a0..b729a8ee1f4b 100644
--- a/app/components/Views/Homepage/Homepage.tsx
+++ b/app/components/Views/Homepage/Homepage.tsx
@@ -2,8 +2,10 @@ import React, {
   forwardRef,
   useCallback,
   useImperativeHandle,
+  useMemo,
   useRef,
 } from 'react';
+import { useSelector } from 'react-redux';
 import { Box } from '@metamask/design-system-react-native';
 import TokensSection from './Sections/Tokens';
 import PerpsSection from './Sections/Perpetuals';
@@ -11,6 +13,10 @@ import PredictionsSection from './Sections/Predictions';
 import DeFiSection from './Sections/DeFi';
 import NFTsSection from './Sections/NFTs';
 import { SectionRefreshHandle } from './types';
+import { selectPerpsEnabledFlag } from '../../UI/Perps';
+import { selectPredictEnabledFlag } from '../../UI/Predict/selectors/featureFlags';
+import { selectAssetsDefiPositionsEnabled } from '../../../selectors/featureFlagController/assetsDefiPositions';
+import { HomeSectionNames, HomeSectionName } from './hooks/useHomeViewedEvent';
 
 /**
  * Homepage component - Main view for the redesigned wallet homepage.
@@ -25,6 +31,34 @@ const Homepage = forwardRef<SectionRefreshHandle>((_, ref) => {
   const defiSectionRef = useRef<SectionRefreshHandle>(null);
   const nftsSectionRef = useRef<SectionRefreshHandle>(null);
 
+  const isPerpsEnabled = useSelector(selectPerpsEnabledFlag);
+  const isPredictEnabled = useSelector(selectPredictEnabledFlag);
+  const isDeFiEnabled = useSelector(selectAssetsDefiPositionsEnabled);
+
+  /**
+   * Compute the ordered list of enabled sections. Tokens and NFTs are always
+   * present; Perps, Predictions, and DeFi are feature-flagged.
+   */
+  const enabledSections = useMemo(
+    () =>
+      [
+        { name: HomeSectionNames.TOKENS, enabled: true },
+        { name: HomeSectionNames.PERPS, enabled: isPerpsEnabled },
+        { name: HomeSectionNames.PREDICT, enabled: isPredictEnabled },
+        { name: HomeSectionNames.DEFI, enabled: isDeFiEnabled },
+        { name: HomeSectionNames.NFTS, enabled: true },
+      ].filter((s) => s.enabled),
+    [isPerpsEnabled, isPredictEnabled, isDeFiEnabled],
+  );
+
+  const totalSectionsLoaded = enabledSections.length;
+
+  const getSectionIndex = useCallback(
+    (name: HomeSectionName) =>
+      enabledSections.findIndex((s) => s.name === name),
+    [enabledSections],
+  );
+
   const refresh = useCallback(async () => {
     await Promise.allSettled([
       tokensSectionRef.current?.refresh(),
@@ -38,12 +72,32 @@ const Homepage = forwardRef<SectionRefreshHandle>((_, ref) => {
   useImperativeHandle(ref, () => ({ refresh }), [refresh]);
 
   return (
-    <Box gap={6} marginBottom={8} testID="homepage-container">
-      <TokensSection ref={tokensSectionRef} />
-      <PerpsSection ref={perpsSectionRef} />
-      <PredictionsSection ref={predictionsSectionRef} />
-      <DeFiSection ref={defiSectionRef} />
-      <NFTsSection ref={nftsSectionRef} />
+    <Box gap={12} marginBottom={8} testID="homepage-container">
+      <TokensSection
+        ref={tokensSectionRef}
+        sectionIndex={getSectionIndex(HomeSectionNames.TOKENS)}
+        totalSectionsLoaded={totalSectionsLoaded}
+      />
+      <PerpsSection
+        ref={perpsSectionRef}
+        sectionIndex={getSectionIndex(HomeSectionNames.PERPS)}
+        totalSectionsLoaded={totalSectionsLoaded}
+      />
+      <PredictionsSection
+        ref={predictionsSectionRef}
+        sectionIndex={getSectionIndex(HomeSectionNames.PREDICT)}
+        totalSectionsLoaded={totalSectionsLoaded}
+      />
+      <DeFiSection
+        ref={defiSectionRef}
+        sectionIndex={getSectionIndex(HomeSectionNames.DEFI)}
+        totalSectionsLoaded={totalSectionsLoaded}
+      />
+      <NFTsSection
+        ref={nftsSectionRef}
+        sectionIndex={getSectionIndex(HomeSectionNames.NFTS)}
+        totalSectionsLoaded={totalSectionsLoaded}
+      />
     </Box>
   );
 });
diff --git a/app/components/Views/Homepage/Sections/DeFi/DeFiSection.test.tsx b/app/components/Views/Homepage/Sections/DeFi/DeFiSection.test.tsx
index f3f0278464dc..f361f747be8e 100644
--- a/app/components/Views/Homepage/Sections/DeFi/DeFiSection.test.tsx
+++ b/app/components/Views/Homepage/Sections/DeFi/DeFiSection.test.tsx
@@ -6,6 +6,7 @@ import { SectionRefreshHandle } from '../../types';
 import Routes from '../../../../../constants/navigation/Routes';
 
 const mockNavigate = jest.fn();
+const mockExecutePoll = jest.fn().mockResolvedValue(undefined);
 
 jest.mock('@react-navigation/native', () => ({
   ...jest.requireActual('@react-navigation/native'),
@@ -14,6 +15,14 @@ jest.mock('@react-navigation/native', () => ({
   }),
 }));
 
+jest.mock('../../../../../core/Engine', () => ({
+  context: {
+    DeFiPositionsController: {
+      _executePoll: (...args: unknown[]) => mockExecutePoll(...args),
+    },
+  },
+}));
+
 jest.mock(
   '../../../../../selectors/featureFlagController/assetsDefiPositions',
   () => ({
@@ -25,6 +34,18 @@ jest.mock('../../../../../selectors/preferencesController', () => ({
   selectPrivacyMode: jest.fn(() => false),
 }));
 
+jest.mock('../../hooks/useHomeViewedEvent', () => ({
+  __esModule: true,
+  default: jest.fn(),
+  HomeSectionNames: {
+    TOKENS: 'tokens',
+    PERPS: 'perps',
+    DEFI: 'defi',
+    PREDICT: 'predict',
+    NFTS: 'nfts',
+  },
+}));
+
 const mockUseDeFiPositionsForHomepage = jest.fn();
 
 jest.mock('./hooks', () => ({
@@ -90,7 +111,9 @@ describe('DeFiSection', () => {
       isEmpty: false,
     });
 
-    renderWithProvider(<DeFiSection />);
+    renderWithProvider(
+      <DeFiSection sectionIndex={0} totalSectionsLoaded={1} />,
+    );
 
     expect(screen.getByText('DeFi')).toBeOnTheScreen();
   });
@@ -102,7 +125,9 @@ describe('DeFiSection', () => {
       )
       .selectAssetsDefiPositionsEnabled.mockReturnValue(false);
 
-    const { toJSON } = renderWithProvider(<DeFiSection />);
+    const { toJSON } = renderWithProvider(
+      <DeFiSection sectionIndex={0} totalSectionsLoaded={1} />,
+    );
 
     expect(toJSON()).toBeNull();
   });
@@ -115,12 +140,14 @@ describe('DeFiSection', () => {
       isEmpty: true,
     });
 
-    const { toJSON } = renderWithProvider(<DeFiSection />);
+    const { toJSON } = renderWithProvider(
+      <DeFiSection sectionIndex={0} totalSectionsLoaded={1} />,
+    );
 
     expect(toJSON()).toBeNull();
   });
 
-  it('returns null when there is an error and not loading', () => {
+  it('renders error state with retry when there is an error and not loading', () => {
     mockUseDeFiPositionsForHomepage.mockReturnValue({
       positions: [],
       isLoading: false,
@@ -128,9 +155,32 @@ describe('DeFiSection', () => {
       isEmpty: false,
     });
 
-    const { toJSON } = renderWithProvider(<DeFiSection />);
+    renderWithProvider(
+      <DeFiSection sectionIndex={0} totalSectionsLoaded={1} />,
+    );
 
-    expect(toJSON()).toBeNull();
+    expect(screen.getByText('DeFi')).toBeOnTheScreen();
+    expect(screen.getByText(/unable to load/i)).toBeOnTheScreen();
+    expect(screen.getByText(/retry/i)).toBeOnTheScreen();
+  });
+
+  it('calls _executePoll on retry button press', async () => {
+    mockUseDeFiPositionsForHomepage.mockReturnValue({
+      positions: [],
+      isLoading: false,
+      hasError: true,
+      isEmpty: false,
+    });
+
+    renderWithProvider(
+      <DeFiSection sectionIndex={0} totalSectionsLoaded={1} />,
+    );
+
+    await act(async () => {
+      fireEvent.press(screen.getByText(/retry/i));
+    });
+
+    expect(mockExecutePoll).toHaveBeenCalled();
   });
 
   it('renders skeleton when loading', () => {
@@ -141,7 +191,9 @@ describe('DeFiSection', () => {
       isEmpty: false,
     });
 
-    renderWithProvider(<DeFiSection />);
+    renderWithProvider(
+      <DeFiSection sectionIndex={0} totalSectionsLoaded={1} />,
+    );
 
     expect(screen.getByText('DeFi')).toBeOnTheScreen();
     // Skeleton renders 3 placeholder items
@@ -155,7 +207,9 @@ describe('DeFiSection', () => {
       isEmpty: false,
     });
 
-    renderWithProvider(<DeFiSection />);
+    renderWithProvider(
+      <DeFiSection sectionIndex={0} totalSectionsLoaded={1} />,
+    );
 
     expect(screen.getByText('Aave')).toBeOnTheScreen();
     expect(screen.getByText('Uniswap')).toBeOnTheScreen();
@@ -169,7 +223,9 @@ describe('DeFiSection', () => {
       isEmpty: false,
     });
 
-    renderWithProvider(<DeFiSection />);
+    renderWithProvider(
+      <DeFiSection sectionIndex={0} totalSectionsLoaded={1} />,
+    );
 
     fireEvent.press(screen.getByText('DeFi'));
 
@@ -186,7 +242,9 @@ describe('DeFiSection', () => {
 
     const ref = createRef<SectionRefreshHandle>();
 
-    renderWithProvider(<DeFiSection ref={ref} />);
+    renderWithProvider(
+      <DeFiSection ref={ref} sectionIndex={0} totalSectionsLoaded={1} />,
+    );
 
     expect(ref.current).not.toBeNull();
     expect(typeof ref.current?.refresh).toBe('function');
@@ -195,6 +253,6 @@ describe('DeFiSection', () => {
       await ref.current?.refresh();
     });
 
-    // Refresh is a no-op for DeFi (data comes from controller)
+    expect(mockExecutePoll).toHaveBeenCalled();
   });
 });
diff --git a/app/components/Views/Homepage/Sections/DeFi/DeFiSection.tsx b/app/components/Views/Homepage/Sections/DeFi/DeFiSection.tsx
index 67a49377d9a9..65328efebac1 100644
--- a/app/components/Views/Homepage/Sections/DeFi/DeFiSection.tsx
+++ b/app/components/Views/Homepage/Sections/DeFi/DeFiSection.tsx
@@ -1,4 +1,9 @@
-import React, { forwardRef, useCallback, useImperativeHandle } from 'react';
+import React, {
+  forwardRef,
+  useCallback,
+  useImperativeHandle,
+  useRef,
+} from 'react';
 import { View } from 'react-native';
 import { useNavigation } from '@react-navigation/native';
 import { useSelector } from 'react-redux';
@@ -8,6 +13,7 @@ import { useTailwind } from '@metamask/design-system-twrnc-preset';
 import { useTheme } from '../../../../../util/theme';
 import SectionTitle from '../../components/SectionTitle';
 import SectionRow from '../../components/SectionRow';
+import ErrorState from '../../components/ErrorState';
 import { SectionRefreshHandle } from '../../types';
 import { useDeFiPositionsForHomepage, DeFiPositionEntry } from './hooks';
 import { selectPrivacyMode } from '../../../../../selectors/preferencesController';
@@ -15,9 +21,18 @@ import DeFiPositionsListItem from '../../../../UI/DeFiPositions/DeFiPositionsLis
 import { selectAssetsDefiPositionsEnabled } from '../../../../../selectors/featureFlagController/assetsDefiPositions';
 import { strings } from '../../../../../../locales/i18n';
 import Routes from '../../../../../constants/navigation/Routes';
+import Engine from '../../../../../core/Engine';
+import useHomeViewedEvent, {
+  HomeSectionNames,
+} from '../../hooks/useHomeViewedEvent';
 
 const MAX_POSITIONS_DISPLAYED = 5;
 
+interface DeFiSectionProps {
+  sectionIndex: number;
+  totalSectionsLoaded: number;
+}
+
 /**
  * Skeleton placeholder for loading state - matches DeFi list item layout
  */
@@ -58,58 +73,96 @@ const DeFiPositionsSkeleton = () => {
  * Only renders if the user has DeFi positions.
  * Uses Redux state from DeFiPositionsController.
  */
-const DeFiSection = forwardRef<SectionRefreshHandle>((_, ref) => {
-  const navigation = useNavigation();
-  const isDeFiEnabled = useSelector(selectAssetsDefiPositionsEnabled);
-  const privacyMode = useSelector(selectPrivacyMode);
-  const title = strings('homepage.sections.defi');
+const DeFiSection = forwardRef<SectionRefreshHandle, DeFiSectionProps>(
+  ({ sectionIndex, totalSectionsLoaded }, ref) => {
+    const sectionViewRef = useRef<View>(null);
+    const navigation = useNavigation();
+    const isDeFiEnabled = useSelector(selectAssetsDefiPositionsEnabled);
+    const privacyMode = useSelector(selectPrivacyMode);
+    const title = strings('homepage.sections.defi');
 
-  const { positions, isLoading, hasError, isEmpty } =
-    useDeFiPositionsForHomepage(MAX_POSITIONS_DISPLAYED);
+    const { positions, isLoading, hasError, isEmpty } =
+      useDeFiPositionsForHomepage(MAX_POSITIONS_DISPLAYED);
 
-  const handleViewAllDeFi = useCallback(() => {
-    navigation.navigate(Routes.WALLET.DEFI_FULL_VIEW as never);
-  }, [navigation]);
+    const handleViewAllDeFi = useCallback(() => {
+      navigation.navigate(Routes.WALLET.DEFI_FULL_VIEW as never);
+    }, [navigation]);
 
-  // DeFi positions come from Redux selectors - no async refresh needed
-  const refresh = useCallback(async () => {
-    // Data refreshes automatically via DeFiPositionsController
-  }, []);
+    const refresh = useCallback(async () => {
+      const controller = Engine.context.DeFiPositionsController;
+      await controller._executePoll();
+    }, []);
 
-  useImperativeHandle(ref, () => ({ refresh }), [refresh]);
+    useImperativeHandle(ref, () => ({ refresh }), [refresh]);
 
-  // Don't render if DeFi is disabled
-  if (!isDeFiEnabled) {
-    return null;
-  }
+    // Always pass sectionViewRef once loading is done so the viewport check
+    // decides when to fire. When the section returns null (empty, no error),
+    // sectionViewRef.current is null and the viewport check returns early —
+    // no premature immediate fire via the null path.
+    const willRender = !isLoading;
 
-  // Don't render if error or empty (and not loading)
-  if (!isLoading && (hasError || isEmpty)) {
-    return null;
-  }
+    useHomeViewedEvent({
+      sectionRef: willRender ? sectionViewRef : null,
+      isLoading,
+      sectionName: HomeSectionNames.DEFI,
+      sectionIndex,
+      totalSectionsLoaded,
+      isEmpty: isEmpty || hasError || !isDeFiEnabled,
+      itemCount: isEmpty ? 0 : positions.length,
+    });
 
-  return (
-    <Box gap={3}>
-      <SectionTitle title={title} onPress={handleViewAllDeFi} />
-      <SectionRow>
-        <Box>
-          {isLoading ? (
-            <DeFiPositionsSkeleton />
-          ) : (
-            positions.map((position: DeFiPositionEntry) => (
-              <DeFiPositionsListItem
-                key={`${position.chainId}-${position.protocolAggregate.protocolDetails.name}`}
-                chainId={position.chainId}
-                protocolId={position.protocolId}
-                protocolAggregate={position.protocolAggregate}
-                privacyMode={privacyMode}
-              />
-            ))
-          )}
+    // Don't render if DeFi is disabled
+    if (!isDeFiEnabled) {
+      return null;
+    }
+
+    // Don't render if empty and not loading (200 with no data)
+    if (!isLoading && isEmpty) {
+      return null;
+    }
+
+    // Show retry UI on error
+    if (!isLoading && hasError) {
+      return (
+        <View ref={sectionViewRef}>
+          <Box gap={3}>
+            <SectionTitle title={title} onPress={handleViewAllDeFi} />
+            <ErrorState
+              title={strings('homepage.error.unable_to_load', {
+                section: title.toLowerCase(),
+              })}
+              onRetry={refresh}
+            />
+          </Box>
+        </View>
+      );
+    }
+
+    return (
+      <View ref={sectionViewRef}>
+        <Box gap={3}>
+          <SectionTitle title={title} onPress={handleViewAllDeFi} />
+          <SectionRow>
+            <Box>
+              {isLoading ? (
+                <DeFiPositionsSkeleton />
+              ) : (
+                positions.map((position: DeFiPositionEntry) => (
+                  <DeFiPositionsListItem
+                    key={`${position.chainId}-${position.protocolAggregate.protocolDetails.name}`}
+                    chainId={position.chainId}
+                    protocolId={position.protocolId}
+                    protocolAggregate={position.protocolAggregate}
+                    privacyMode={privacyMode}
+                  />
+                ))
+              )}
+            </Box>
+          </SectionRow>
         </Box>
-      </SectionRow>
-    </Box>
-  );
-});
+      </View>
+    );
+  },
+);
 
 export default DeFiSection;
diff --git a/app/components/Views/Homepage/Sections/NFTs/NFTsSection.test.tsx b/app/components/Views/Homepage/Sections/NFTs/NFTsSection.test.tsx
index 501013302860..c3c79921fc1a 100644
--- a/app/components/Views/Homepage/Sections/NFTs/NFTsSection.test.tsx
+++ b/app/components/Views/Homepage/Sections/NFTs/NFTsSection.test.tsx
@@ -8,6 +8,8 @@ import { SectionRefreshHandle } from '../../types';
 
 const mockNavigate = jest.fn();
 const mockOnRefresh = jest.fn().mockResolvedValue(undefined);
+const mockDetectNfts = jest.fn().mockResolvedValue(undefined);
+const mockAbortDetection = jest.fn();
 
 jest.mock('@react-navigation/native', () => {
   const actualNav = jest.requireActual('@react-navigation/native');
@@ -16,6 +18,10 @@ jest.mock('@react-navigation/native', () => {
     useNavigation: () => ({
       navigate: mockNavigate,
     }),
+    useFocusEffect: (callback: () => void) => {
+      const React = jest.requireActual('react');
+      React.useEffect(callback, [callback]);
+    },
   };
 });
 
@@ -23,6 +29,14 @@ jest.mock('../../../../../reducers/collectibles', () => ({
   isNftFetchingProgressSelector: jest.fn(() => false),
 }));
 
+jest.mock('../../../../hooks/useNftDetection', () => ({
+  useNftDetection: () => ({
+    detectNfts: mockDetectNfts,
+    abortDetection: mockAbortDetection,
+    chainIdsToDetectNftsFor: [],
+  }),
+}));
+
 jest.mock('../../../../UI/NftGrid/useNftRefresh', () => ({
   useNftRefresh: () => ({
     refreshing: false,
@@ -42,6 +56,18 @@ jest.mock('./hooks', () => ({
   useOwnedNfts: jest.fn(() => []),
 }));
 
+jest.mock('../../hooks/useHomeViewedEvent', () => ({
+  __esModule: true,
+  default: jest.fn(),
+  HomeSectionNames: {
+    TOKENS: 'tokens',
+    PERPS: 'perps',
+    DEFI: 'defi',
+    PREDICT: 'predict',
+    NFTS: 'nfts',
+  },
+}));
+
 // State with preferences needed for NftGridItem/CollectibleMedia
 const stateWithNftPreferences = {
   engine: {
@@ -72,23 +98,28 @@ describe('NFTsSection', () => {
       .requireMock('../../../../../reducers/collectibles')
       .isNftFetchingProgressSelector.mockReturnValue(true);
 
-    renderWithProvider(<NFTsSection />);
+    renderWithProvider(
+      <NFTsSection sectionIndex={0} totalSectionsLoaded={1} />,
+    );
 
     expect(screen.getByText('NFTs')).toBeOnTheScreen();
     // Empty state and NFT grid should not be visible during loading
     expect(screen.queryByText('Import NFTs')).not.toBeOnTheScreen();
   });
 
-  it('renders empty state card when user has no NFTs', () => {
-    renderWithProvider(<NFTsSection />);
+  it('renders empty state when user has no NFTs', () => {
+    renderWithProvider(
+      <NFTsSection sectionIndex={0} totalSectionsLoaded={1} />,
+    );
 
     expect(screen.getByText('NFTs')).toBeOnTheScreen();
     expect(screen.getByText('Import NFTs')).toBeOnTheScreen();
-    expect(screen.getByText('Easily add your collectibles')).toBeOnTheScreen();
   });
 
   it('navigates to AddAsset when import NFTs card is pressed', () => {
-    renderWithProvider(<NFTsSection />);
+    renderWithProvider(
+      <NFTsSection sectionIndex={0} totalSectionsLoaded={1} />,
+    );
 
     fireEvent.press(screen.getByText('Import NFTs'));
 
@@ -102,7 +133,10 @@ describe('NFTsSection', () => {
       .requireMock('./hooks')
       .useOwnedNfts.mockReturnValue([mockNft('0x123', '1')]);
 
-    renderWithProvider(<NFTsSection />, { state: stateWithNftPreferences });
+    renderWithProvider(
+      <NFTsSection sectionIndex={0} totalSectionsLoaded={1} />,
+      { state: stateWithNftPreferences },
+    );
 
     expect(screen.getByText('NFTs')).toBeOnTheScreen();
   });
@@ -112,7 +146,10 @@ describe('NFTsSection', () => {
       .requireMock('./hooks')
       .useOwnedNfts.mockReturnValue([mockNft('0x123', '1')]);
 
-    renderWithProvider(<NFTsSection />, { state: stateWithNftPreferences });
+    renderWithProvider(
+      <NFTsSection sectionIndex={0} totalSectionsLoaded={1} />,
+      { state: stateWithNftPreferences },
+    );
 
     fireEvent.press(screen.getByText('NFTs'));
 
@@ -125,7 +162,10 @@ describe('NFTsSection', () => {
     );
     jest.requireMock('./hooks').useOwnedNfts.mockReturnValue(nfts);
 
-    renderWithProvider(<NFTsSection />, { state: stateWithNftPreferences });
+    renderWithProvider(
+      <NFTsSection sectionIndex={0} totalSectionsLoaded={1} />,
+      { state: stateWithNftPreferences },
+    );
 
     // First 6 NFTs (indices 0-5) should be displayed
     expect(screen.getByText('NFT 0')).toBeOnTheScreen();
@@ -140,10 +180,42 @@ describe('NFTsSection', () => {
     expect(screen.queryByText('NFT 7')).not.toBeOnTheScreen();
   });
 
+  it('triggers NFT detection on focus', () => {
+    renderWithProvider(
+      <NFTsSection sectionIndex={0} totalSectionsLoaded={1} />,
+    );
+
+    expect(mockDetectNfts).toHaveBeenCalledTimes(1);
+  });
+
+  it('calls abortDetection on unmount', () => {
+    const { unmount } = renderWithProvider(
+      <NFTsSection sectionIndex={0} totalSectionsLoaded={1} />,
+    );
+
+    unmount();
+
+    expect(mockAbortDetection).toHaveBeenCalledTimes(1);
+  });
+
+  it('renders without error when detectNfts rejects', async () => {
+    mockDetectNfts.mockRejectedValueOnce(new Error('Aborted'));
+
+    renderWithProvider(
+      <NFTsSection sectionIndex={0} totalSectionsLoaded={1} />,
+    );
+
+    await act(async () => undefined);
+
+    expect(screen.getByText('NFTs')).toBeOnTheScreen();
+  });
+
   it('exposes refresh function via ref that calls useNftRefresh.onRefresh', async () => {
     const ref = createRef<SectionRefreshHandle>();
 
-    renderWithProvider(<NFTsSection ref={ref} />);
+    renderWithProvider(
+      <NFTsSection ref={ref} sectionIndex={0} totalSectionsLoaded={1} />,
+    );
 
     expect(ref.current).not.toBeNull();
     expect(typeof ref.current?.refresh).toBe('function');
diff --git a/app/components/Views/Homepage/Sections/NFTs/NFTsSection.tsx b/app/components/Views/Homepage/Sections/NFTs/NFTsSection.tsx
index b862fb1fe5eb..a0da756db29c 100644
--- a/app/components/Views/Homepage/Sections/NFTs/NFTsSection.tsx
+++ b/app/components/Views/Homepage/Sections/NFTs/NFTsSection.tsx
@@ -3,34 +3,30 @@ import React, {
   useCallback,
   useImperativeHandle,
   useMemo,
+  useRef,
+  useState,
 } from 'react';
-import { TouchableOpacity, Image, View } from 'react-native';
+import { View } from 'react-native';
 import { useSelector } from 'react-redux';
-import { useNavigation } from '@react-navigation/native';
+import { useFocusEffect, useNavigation } from '@react-navigation/native';
 import SkeletonPlaceholder from 'react-native-skeleton-placeholder';
 import { useTailwind } from '@metamask/design-system-twrnc-preset';
 import { useTheme } from '../../../../../util/theme';
-import {
-  Box,
-  Text,
-  BoxFlexDirection,
-  BoxAlignItems,
-  BoxJustifyContent,
-  TextVariant,
-  TextColor,
-  FontWeight,
-} from '@metamask/design-system-react-native';
+import { Box, BoxFlexDirection } from '@metamask/design-system-react-native';
 import SectionTitle from '../../components/SectionTitle';
 import SectionRow from '../../components/SectionRow';
-import SectionCard from '../../components/SectionCard';
 import Routes from '../../../../../constants/navigation/Routes';
 import { useOwnedNfts } from './hooks';
 import NftGridItem from '../../../../UI/NftGrid/NftGridItem';
 import { useNftRefresh } from '../../../../UI/NftGrid/useNftRefresh';
+import { CollectiblesEmptyState } from '../../../../UI/CollectiblesEmptyState/CollectiblesEmptyState';
+import { useNftDetection } from '../../../../hooks/useNftDetection';
 import { SectionRefreshHandle } from '../../types';
 import { strings } from '../../../../../../locales/i18n';
 import { isNftFetchingProgressSelector } from '../../../../../reducers/collectibles';
-import gemIcon from './assets/gem.png';
+import useHomeViewedEvent, {
+  HomeSectionNames,
+} from '../../hooks/useHomeViewedEvent';
 
 const MAX_NFTS_DISPLAYED = 6;
 const NFTS_PER_ROW = 3;
@@ -62,124 +58,144 @@ const NftSkeletonRow = () => {
   );
 };
 
-const NFTsSection = forwardRef<SectionRefreshHandle>((_, ref) => {
-  const navigation = useNavigation();
-  const ownedNfts = useOwnedNfts();
-  const hasNfts = ownedNfts.length > 0;
-  const isNftFetchingProgress = useSelector(isNftFetchingProgressSelector);
-  const { onRefresh } = useNftRefresh();
+interface NFTsSectionProps {
+  sectionIndex: number;
+  totalSectionsLoaded: number;
+}
 
-  const title = strings('homepage.sections.nfts');
+const NFTsSection = forwardRef<SectionRefreshHandle, NFTsSectionProps>(
+  ({ sectionIndex, totalSectionsLoaded }, ref) => {
+    const sectionViewRef = useRef<View>(null);
+    const navigation = useNavigation();
+    const ownedNfts = useOwnedNfts();
+    const hasNfts = ownedNfts.length > 0;
+    const isNftFetchingProgress = useSelector(isNftFetchingProgressSelector);
+    const { onRefresh } = useNftRefresh();
+    const { detectNfts, abortDetection } = useNftDetection();
+    const hasLoadedOnceRef = useRef(false);
+    const isSilentDetectionRef = useRef(false);
 
-  useImperativeHandle(ref, () => ({ refresh: onRefresh }), [onRefresh]);
+    useFocusEffect(
+      useCallback(() => {
+        isSilentDetectionRef.current = hasLoadedOnceRef.current;
 
-  const displayNfts = useMemo(
-    () => ownedNfts.slice(0, MAX_NFTS_DISPLAYED),
-    [ownedNfts],
-  );
+        detectNfts()
+          .catch(() => {
+            // AbortError is expected when detection is cancelled on blur
+          })
+          .finally(() => {
+            hasLoadedOnceRef.current = true;
+            isSilentDetectionRef.current = false;
+          });
 
-  // Split NFTs into rows of NFTS_PER_ROW
-  const nftRows = useMemo(() => {
-    const rows: (typeof displayNfts)[] = [];
-    for (let i = 0; i < displayNfts.length; i += NFTS_PER_ROW) {
-      rows.push(displayNfts.slice(i, i + NFTS_PER_ROW));
-    }
-    return rows;
-  }, [displayNfts]);
+        return () => {
+          abortDetection();
+          isSilentDetectionRef.current = false;
+        };
+      }, [detectNfts, abortDetection]),
+    );
 
-  const handleViewAllNfts = useCallback(() => {
-    navigation.navigate(Routes.WALLET.NFTS_FULL_VIEW);
-  }, [navigation]);
+    const showSkeleton = isNftFetchingProgress && !isSilentDetectionRef.current;
 
-  const handleImportNfts = useCallback(() => {
-    navigation.navigate('AddAsset', { assetType: 'collectible' });
-  }, [navigation]);
+    const title = strings('homepage.sections.nfts');
 
-  return (
-    <Box gap={3}>
-      <SectionTitle title={title} onPress={handleViewAllNfts} />
-      {hasNfts ? (
-        <SectionRow>
-          <Box gap={3}>
-            {nftRows.map((row, rowIndex) => (
-              <Box
-                key={`nft-row-${rowIndex}`}
-                flexDirection={BoxFlexDirection.Row}
-                gap={3}
-              >
-                {row.map((nft) => (
+    useImperativeHandle(ref, () => ({ refresh: onRefresh }), [onRefresh]);
+
+    const displayNfts = useMemo(
+      () => ownedNfts.slice(0, MAX_NFTS_DISPLAYED),
+      [ownedNfts],
+    );
+
+    // Split NFTs into rows of NFTS_PER_ROW
+    const nftRows = useMemo(() => {
+      const rows: (typeof displayNfts)[] = [];
+      for (let i = 0; i < displayNfts.length; i += NFTS_PER_ROW) {
+        rows.push(displayNfts.slice(i, i + NFTS_PER_ROW));
+      }
+      return rows;
+    }, [displayNfts]);
+
+    const handleViewAllNfts = useCallback(() => {
+      navigation.navigate(Routes.WALLET.NFTS_FULL_VIEW);
+    }, [navigation]);
+
+    const [isAddNFTEnabled, setIsAddNFTEnabled] = useState(true);
+
+    const handleImportNfts = useCallback(() => {
+      setIsAddNFTEnabled(false);
+      navigation.navigate('AddAsset', { assetType: 'collectible' });
+      setTimeout(() => setIsAddNFTEnabled(true), 1000);
+    }, [navigation]);
+
+    // Pass null while loading so the hook uses the immediate-fire path and
+    // does not fire from viewport visibility with stale itemCount/isEmpty.
+    const isLoadingSection = isNftFetchingProgress && !hasNfts;
+    const willRender = !isLoadingSection;
+
+    useHomeViewedEvent({
+      sectionRef: willRender ? sectionViewRef : null,
+      isLoading: isLoadingSection,
+      sectionName: HomeSectionNames.NFTS,
+      sectionIndex,
+      totalSectionsLoaded,
+      isEmpty: !hasNfts,
+      itemCount: ownedNfts.length,
+    });
+
+    return (
+      <View ref={sectionViewRef}>
+        <Box gap={3}>
+          <SectionTitle title={title} onPress={handleViewAllNfts} />
+          {hasNfts ? (
+            <SectionRow>
+              <Box gap={3}>
+                {nftRows.map((row, rowIndex) => (
                   <Box
-                    key={`${nft.address}-${nft.tokenId}`}
-                    twClassName="flex-1"
+                    key={`nft-row-${rowIndex}`}
+                    flexDirection={BoxFlexDirection.Row}
+                    gap={3}
                   >
-                    <NftGridItem
-                      item={nft}
-                      onLongPress={noop}
-                      source="mobile-nft-list"
-                    />
-                  </Box>
-                ))}
-                {/* Add empty boxes to maintain grid alignment for incomplete rows */}
-                {row.length < NFTS_PER_ROW &&
-                  Array.from({ length: NFTS_PER_ROW - row.length }).map(
-                    (__, i) => (
+                    {row.map((nft) => (
                       <Box
-                        key={`empty-${rowIndex}-${i}`}
+                        key={`${nft.address}-${nft.tokenId}`}
                         twClassName="flex-1"
-                      />
-                    ),
-                  )}
-              </Box>
-            ))}
-          </Box>
-        </SectionRow>
-      ) : isNftFetchingProgress ? (
-        <SectionRow>
-          <NftSkeletonRow />
-        </SectionRow>
-      ) : (
-        <SectionRow>
-          <TouchableOpacity onPress={handleImportNfts} activeOpacity={0.7}>
-            <SectionCard>
-              <Box
-                flexDirection={BoxFlexDirection.Row}
-                alignItems={BoxAlignItems.Center}
-                gap={4}
-              >
-                <Box
-                  alignItems={BoxAlignItems.Center}
-                  justifyContent={BoxJustifyContent.Center}
-                  twClassName="w-10 h-10"
-                >
-                  <Image
-                    source={gemIcon}
-                    // eslint-disable-next-line react-native/no-inline-styles
-                    style={{ width: 40, height: 40 }}
-                    resizeMode="contain"
-                  />
-                </Box>
-                <Box twClassName="flex-1">
-                  <Text
-                    variant={TextVariant.BodyMd}
-                    fontWeight={FontWeight.Medium}
-                    color={TextColor.TextDefault}
-                  >
-                    {strings('homepage.sections.import_nfts')}
-                  </Text>
-                  <Text
-                    variant={TextVariant.BodySm}
-                    color={TextColor.TextAlternative}
-                  >
-                    {strings('homepage.sections.import_nfts_description')}
-                  </Text>
-                </Box>
+                      >
+                        <NftGridItem
+                          item={nft}
+                          onLongPress={noop}
+                          source="mobile-nft-list"
+                        />
+                      </Box>
+                    ))}
+                    {/* Add empty boxes to maintain grid alignment for incomplete rows */}
+                    {row.length < NFTS_PER_ROW &&
+                      Array.from({ length: NFTS_PER_ROW - row.length }).map(
+                        (__, i) => (
+                          <Box
+                            key={`empty-${rowIndex}-${i}`}
+                            twClassName="flex-1"
+                          />
+                        ),
+                      )}
+                  </Box>
+                ))}
               </Box>
-            </SectionCard>
-          </TouchableOpacity>
-        </SectionRow>
-      )}
-    </Box>
-  );
-});
+            </SectionRow>
+          ) : showSkeleton ? (
+            <SectionRow>
+              <NftSkeletonRow />
+            </SectionRow>
+          ) : (
+            <CollectiblesEmptyState
+              onAction={handleImportNfts}
+              actionButtonProps={{ isDisabled: !isAddNFTEnabled }}
+              twClassName="mx-auto mt-2"
+            />
+          )}
+        </Box>
+      </View>
+    );
+  },
+);
 
 export default NFTsSection;
diff --git a/app/components/Views/Homepage/Sections/NFTs/assets/gem.png b/app/components/Views/Homepage/Sections/NFTs/assets/gem.png
deleted file mode 100644
index 492cc64f729e..000000000000
Binary files a/app/components/Views/Homepage/Sections/NFTs/assets/gem.png and /dev/null differ
diff --git a/app/components/Views/Homepage/Sections/Perpetuals/PerpsSection.test.tsx b/app/components/Views/Homepage/Sections/Perpetuals/PerpsSection.test.tsx
index 3d80e07bf870..5b3394686461 100644
--- a/app/components/Views/Homepage/Sections/Perpetuals/PerpsSection.test.tsx
+++ b/app/components/Views/Homepage/Sections/Perpetuals/PerpsSection.test.tsx
@@ -3,8 +3,20 @@ import { screen, fireEvent, act } from '@testing-library/react-native';
 import renderWithProvider from '../../../../../util/test/renderWithProvider';
 import PerpsSection from './PerpsSection';
 import Routes from '../../../../../constants/navigation/Routes';
+import { MetaMetricsEvents } from '../../../../../core/Analytics/MetaMetrics.events';
+import {
+  PERPS_EVENT_PROPERTY,
+  PERPS_EVENT_VALUE,
+} from '@metamask/perps-controller';
 
 const mockNavigate = jest.fn();
+const mockTrack = jest.fn();
+
+jest.mock('../../../../UI/Perps/hooks/usePerpsEventTracking', () => ({
+  usePerpsEventTracking: jest.fn(() => ({
+    track: mockTrack,
+  })),
+}));
 
 jest.mock('@react-navigation/native', () => {
   const actualNav = jest.requireActual('@react-navigation/native');
@@ -83,6 +95,25 @@ jest.mock('../../../../UI/Perps/components/PerpsCard', () => {
   };
 });
 
+const mockReconnectWithNewContext = jest.fn().mockResolvedValue(undefined);
+
+jest.mock('../../../../UI/Perps/hooks/usePerpsConnection', () => ({
+  usePerpsConnection: jest.fn(() => ({
+    isConnected: true,
+    isConnecting: false,
+    isInitialized: true,
+    error: null,
+    connect: jest.fn(),
+    disconnect: jest.fn(),
+    resetError: jest.fn(),
+    reconnectWithNewContext: mockReconnectWithNewContext,
+  })),
+}));
+
+const { usePerpsConnection } = jest.requireMock(
+  '../../../../UI/Perps/hooks/usePerpsConnection',
+);
+
 jest.mock('./hooks/useHomepageSparklines', () => ({
   useHomepageSparklines: jest.fn(() => ({
     sparklines: {},
@@ -91,23 +122,26 @@ jest.mock('./hooks/useHomepageSparklines', () => ({
 }));
 
 jest.mock('./components/PerpsMarketTileCard', () => {
-  const { TouchableOpacity, Text } = jest.requireActual('react-native');
+  const { TouchableOpacity, Text, View } = jest.requireActual('react-native');
   return {
     __esModule: true,
     default: ({
       market,
       testID,
       onPress,
+      showFavoriteTag,
     }: {
       market: { symbol: string };
       testID?: string;
       onPress?: (m: { symbol: string }) => void;
+      showFavoriteTag?: boolean;
     }) => (
       <TouchableOpacity
         testID={testID ?? `perps-market-tile-${market.symbol}`}
         onPress={() => onPress?.(market)}
       >
         <Text>{market.symbol}</Text>
+        {showFavoriteTag && <View testID={`favorite-badge-${market.symbol}`} />}
       </TouchableOpacity>
     ),
   };
@@ -179,6 +213,34 @@ const makeOrder = (overrides: Record<string, unknown> = {}) => ({
   ...overrides,
 });
 
+const mockUseHomeViewedEvent = jest.requireMock(
+  '../../hooks/useHomeViewedEvent',
+).default as jest.Mock;
+
+const makeTrendingMarket = (overrides: Record<string, unknown> = {}) => ({
+  symbol: 'BTC',
+  name: 'Bitcoin',
+  maxLeverage: '50x',
+  price: '$52,000',
+  change24h: '+$2,000',
+  change24hPercent: '+4.00%',
+  volume: '$2.5B',
+  volumeNumber: 2500000000,
+  ...overrides,
+});
+
+jest.mock('../../hooks/useHomeViewedEvent', () => ({
+  __esModule: true,
+  default: jest.fn(),
+  HomeSectionNames: {
+    TOKENS: 'tokens',
+    PERPS: 'perps',
+    DEFI: 'defi',
+    PREDICT: 'predict',
+    NFTS: 'nfts',
+  },
+}));
+
 describe('PerpsSection', () => {
   beforeEach(() => {
     jest.clearAllMocks();
@@ -200,7 +262,9 @@ describe('PerpsSection', () => {
   });
 
   it('renders section title', () => {
-    renderWithProvider(<PerpsSection />);
+    renderWithProvider(
+      <PerpsSection sectionIndex={0} totalSectionsLoaded={1} />,
+    );
 
     expect(screen.getByText('Perpetuals')).toBeOnTheScreen();
   });
@@ -221,7 +285,9 @@ describe('PerpsSection', () => {
       isInitialLoading: false,
     });
 
-    renderWithProvider(<PerpsSection />);
+    renderWithProvider(
+      <PerpsSection sectionIndex={0} totalSectionsLoaded={1} />,
+    );
 
     expect(screen.getByText('Short BTC')).toBeOnTheScreen();
     expect(screen.getByText('Long ETH')).toBeOnTheScreen();
@@ -240,7 +306,9 @@ describe('PerpsSection', () => {
       isInitialLoading: false,
     });
 
-    renderWithProvider(<PerpsSection />);
+    renderWithProvider(
+      <PerpsSection sectionIndex={0} totalSectionsLoaded={1} />,
+    );
 
     expect(screen.getByText('10X short')).toBeOnTheScreen();
     expect(screen.getByText('40X long')).toBeOnTheScreen();
@@ -261,7 +329,9 @@ describe('PerpsSection', () => {
       isInitialLoading: false,
     });
 
-    renderWithProvider(<PerpsSection />);
+    renderWithProvider(
+      <PerpsSection sectionIndex={0} totalSectionsLoaded={1} />,
+    );
 
     expect(screen.getByText('TP 15%, SL 15%')).toBeOnTheScreen();
     expect(screen.getByText('No TP/SL')).toBeOnTheScreen();
@@ -274,7 +344,9 @@ describe('PerpsSection', () => {
       isInitialLoading: false,
     });
 
-    renderWithProvider(<PerpsSection />);
+    renderWithProvider(
+      <PerpsSection sectionIndex={0} totalSectionsLoaded={1} />,
+    );
 
     expect(screen.getByTestId('tp-sl-skeleton')).toBeOnTheScreen();
     expect(screen.queryByText('No TP/SL')).toBeNull();
@@ -289,7 +361,9 @@ describe('PerpsSection', () => {
         isInitialLoading: false,
       });
 
-      renderWithProvider(<PerpsSection />);
+      renderWithProvider(
+        <PerpsSection sectionIndex={0} totalSectionsLoaded={1} />,
+      );
 
       expect(screen.getByTestId('tp-sl-skeleton')).toBeOnTheScreen();
 
@@ -313,19 +387,24 @@ describe('PerpsSection', () => {
       isInitialLoading: false,
     });
 
-    renderWithProvider(<PerpsSection />);
+    renderWithProvider(
+      <PerpsSection sectionIndex={0} totalSectionsLoaded={1} />,
+    );
 
-    const roeElements = screen.getAllByText('+9.4%');
+    const roeElements = screen.getAllByText('+9.40%');
     expect(roeElements.length).toBeGreaterThanOrEqual(2);
   });
 
-  it('navigates to perps home on title press', () => {
-    renderWithProvider(<PerpsSection />);
+  it('navigates to perps home on title press with home_section source', () => {
+    renderWithProvider(
+      <PerpsSection sectionIndex={0} totalSectionsLoaded={1} />,
+    );
 
     fireEvent.press(screen.getByText('Perpetuals'));
 
     expect(mockNavigate).toHaveBeenCalledWith(Routes.PERPS.ROOT, {
       screen: Routes.PERPS.PERPS_HOME,
+      params: { source: 'home_section' },
     });
   });
 
@@ -349,7 +428,9 @@ describe('PerpsSection', () => {
       isRefreshing: false,
     });
 
-    renderWithProvider(<PerpsSection />);
+    renderWithProvider(
+      <PerpsSection sectionIndex={0} totalSectionsLoaded={1} />,
+    );
 
     fireEvent.press(screen.getByTestId('perps-position-row-BTC'));
 
@@ -358,6 +439,7 @@ describe('PerpsSection', () => {
       params: {
         market: fullMarket,
         initialTab: 'position',
+        source: 'section_position',
       },
     });
   });
@@ -368,7 +450,9 @@ describe('PerpsSection', () => {
       isInitialLoading: false,
     });
 
-    renderWithProvider(<PerpsSection />);
+    renderWithProvider(
+      <PerpsSection sectionIndex={0} totalSectionsLoaded={1} />,
+    );
 
     fireEvent.press(screen.getByTestId('perps-position-row-BTC'));
 
@@ -377,10 +461,36 @@ describe('PerpsSection', () => {
       params: {
         market: { symbol: 'BTC', maxLeverage: 50 },
         initialTab: 'position',
+        source: 'section_position',
       },
     });
   });
 
+  it('fires PERPS_UI_INTERACTION event when a position is pressed', () => {
+    usePerpsLivePositions.mockReturnValue({
+      positions: [makePosition()],
+      isInitialLoading: false,
+    });
+
+    renderWithProvider(
+      <PerpsSection sectionIndex={0} totalSectionsLoaded={1} />,
+    );
+
+    fireEvent.press(screen.getByTestId('perps-position-row-BTC'));
+
+    expect(mockTrack).toHaveBeenCalledWith(
+      MetaMetricsEvents.PERPS_UI_INTERACTION,
+      {
+        [PERPS_EVENT_PROPERTY.INTERACTION_TYPE]:
+          PERPS_EVENT_VALUE.INTERACTION_TYPE.BUTTON_CLICKED,
+        [PERPS_EVENT_PROPERTY.BUTTON_CLICKED]:
+          PERPS_EVENT_VALUE.BUTTON_CLICKED.OPEN_POSITION,
+        [PERPS_EVENT_PROPERTY.BUTTON_LOCATION]:
+          PERPS_EVENT_VALUE.BUTTON_LOCATION.WALLET_HOME,
+      },
+    );
+  });
+
   it('limits items to max 5 (positions first, then orders)', () => {
     usePerpsLivePositions.mockReturnValue({
       positions: [
@@ -398,7 +508,9 @@ describe('PerpsSection', () => {
       isInitialLoading: false,
     });
 
-    renderWithProvider(<PerpsSection />);
+    renderWithProvider(
+      <PerpsSection sectionIndex={0} totalSectionsLoaded={1} />,
+    );
 
     expect(screen.getByText('Short BTC')).toBeOnTheScreen();
     expect(screen.getByText('Long ETH')).toBeOnTheScreen();
@@ -425,7 +537,9 @@ describe('PerpsSection', () => {
       isInitialLoading: false,
     });
 
-    renderWithProvider(<PerpsSection />);
+    renderWithProvider(
+      <PerpsSection sectionIndex={0} totalSectionsLoaded={1} />,
+    );
 
     expect(screen.getByText('Short BTC')).toBeOnTheScreen();
     expect(screen.getByText('Long ETH')).toBeOnTheScreen();
@@ -439,7 +553,9 @@ describe('PerpsSection', () => {
       isInitialLoading: false,
     });
 
-    renderWithProvider(<PerpsSection />);
+    renderWithProvider(
+      <PerpsSection sectionIndex={0} totalSectionsLoaded={1} />,
+    );
 
     expect(screen.getByTestId('perps-order-row-o1')).toBeOnTheScreen();
   });
@@ -450,7 +566,9 @@ describe('PerpsSection', () => {
       isInitialLoading: true,
     });
 
-    renderWithProvider(<PerpsSection />);
+    renderWithProvider(
+      <PerpsSection sectionIndex={0} totalSectionsLoaded={1} />,
+    );
 
     expect(screen.getByTestId('skeleton-placeholder')).toBeOnTheScreen();
     expect(
@@ -468,7 +586,9 @@ describe('PerpsSection', () => {
       isInitialLoading: true,
     });
 
-    renderWithProvider(<PerpsSection />);
+    renderWithProvider(
+      <PerpsSection sectionIndex={0} totalSectionsLoaded={1} />,
+    );
 
     expect(screen.getByTestId('skeleton-placeholder')).toBeOnTheScreen();
     expect(
@@ -485,7 +605,9 @@ describe('PerpsSection', () => {
       isRefreshing: false,
     });
 
-    renderWithProvider(<PerpsSection />);
+    renderWithProvider(
+      <PerpsSection sectionIndex={0} totalSectionsLoaded={1} />,
+    );
 
     expect(screen.getByTestId('skeleton-placeholder')).toBeOnTheScreen();
     expect(screen.queryByTestId('homepage-trending-perps-carousel')).toBeNull();
@@ -497,13 +619,17 @@ describe('PerpsSection', () => {
       isInitialLoading: false,
     });
 
-    renderWithProvider(<PerpsSection />);
+    renderWithProvider(
+      <PerpsSection sectionIndex={0} totalSectionsLoaded={1} />,
+    );
 
     expect(screen.queryByTestId('skeleton-placeholder')).not.toBeOnTheScreen();
   });
 
   it('uses 5000ms throttle for WebSocket subscriptions', () => {
-    renderWithProvider(<PerpsSection />);
+    renderWithProvider(
+      <PerpsSection sectionIndex={0} totalSectionsLoaded={1} />,
+    );
 
     expect(usePerpsLivePositions).toHaveBeenCalledWith({
       throttleMs: 5000,
@@ -540,7 +666,9 @@ describe('PerpsSection', () => {
         isRefreshing: false,
       });
 
-      renderWithProvider(<PerpsSection />);
+      renderWithProvider(
+        <PerpsSection sectionIndex={0} totalSectionsLoaded={1} />,
+      );
 
       expect(
         screen.getByTestId('homepage-trending-perps-carousel'),
@@ -563,7 +691,9 @@ describe('PerpsSection', () => {
         isRefreshing: false,
       });
 
-      renderWithProvider(<PerpsSection />);
+      renderWithProvider(
+        <PerpsSection sectionIndex={0} totalSectionsLoaded={1} />,
+      );
 
       expect(
         screen.queryByTestId('homepage-trending-perps-carousel'),
@@ -584,7 +714,9 @@ describe('PerpsSection', () => {
         isRefreshing: false,
       });
 
-      renderWithProvider(<PerpsSection />);
+      renderWithProvider(
+        <PerpsSection sectionIndex={0} totalSectionsLoaded={1} />,
+      );
 
       expect(
         screen.queryByTestId('homepage-trending-perps-carousel'),
@@ -602,13 +734,15 @@ describe('PerpsSection', () => {
         isRefreshing: false,
       });
 
-      renderWithProvider(<PerpsSection />);
+      renderWithProvider(
+        <PerpsSection sectionIndex={0} totalSectionsLoaded={1} />,
+      );
 
       fireEvent.press(screen.getByTestId('perps-market-tile-SOL'));
 
       expect(mockNavigate).toHaveBeenCalledWith(Routes.PERPS.ROOT, {
         screen: Routes.PERPS.MARKET_DETAILS,
-        params: { market },
+        params: { market, source: 'home_section' },
       });
     });
 
@@ -627,14 +761,16 @@ describe('PerpsSection', () => {
         isRefreshing: false,
       });
 
-      renderWithProvider(<PerpsSection />);
+      renderWithProvider(
+        <PerpsSection sectionIndex={0} totalSectionsLoaded={1} />,
+      );
 
       expect(screen.getByText('MKT0')).toBeOnTheScreen();
       expect(screen.getByText('MKT4')).toBeOnTheScreen();
       expect(screen.queryByText('MKT5')).toBeNull();
     });
 
-    it('renders "More perps" card at the end of the carousel', () => {
+    it('renders "View more" card at the end of the carousel', () => {
       const markets = Array.from({ length: 4 }, (_, i) =>
         makeTrendingMarket({
           symbol: `MKT${i}`,
@@ -649,13 +785,15 @@ describe('PerpsSection', () => {
         isRefreshing: false,
       });
 
-      renderWithProvider(<PerpsSection />);
+      renderWithProvider(
+        <PerpsSection sectionIndex={0} totalSectionsLoaded={1} />,
+      );
 
       expect(screen.getByTestId('perps-view-more-card')).toBeOnTheScreen();
-      expect(screen.getByText('More perps')).toBeOnTheScreen();
+      expect(screen.getByText('View more')).toBeOnTheScreen();
     });
 
-    it('navigates to perps home when "More perps" card is pressed', () => {
+    it('navigates to perps home with home_screen source when "View more" card is pressed', () => {
       usePerpsMarkets.mockReturnValue({
         markets: [
           makeTrendingMarket({ symbol: 'BTC', volumeNumber: 5000000000 }),
@@ -666,17 +804,22 @@ describe('PerpsSection', () => {
         isRefreshing: false,
       });
 
-      renderWithProvider(<PerpsSection />);
+      renderWithProvider(
+        <PerpsSection sectionIndex={0} totalSectionsLoaded={1} />,
+      );
 
       fireEvent.press(screen.getByTestId('perps-view-more-card'));
 
       expect(mockNavigate).toHaveBeenCalledWith(Routes.PERPS.ROOT, {
         screen: Routes.PERPS.PERPS_HOME,
+        params: { source: 'home_section' },
       });
     });
 
     it('renders nothing when no positions, orders, or markets', () => {
-      renderWithProvider(<PerpsSection />);
+      renderWithProvider(
+        <PerpsSection sectionIndex={0} totalSectionsLoaded={1} />,
+      );
 
       expect(
         screen.queryByTestId('homepage-perps-positions'),
@@ -686,4 +829,494 @@ describe('PerpsSection', () => {
       ).toBeNull();
     });
   });
+
+  describe('Watchlist Markets in Carousel', () => {
+    const makeTrendingMarket = (overrides: Record<string, unknown> = {}) => ({
+      symbol: 'BTC',
+      name: 'Bitcoin',
+      maxLeverage: '50x',
+      price: '$52,000',
+      change24h: '+$2,000',
+      change24hPercent: '+4.00%',
+      volume: '$2.5B',
+      volumeNumber: 2500000000,
+      ...overrides,
+    });
+
+    const watchlistState = (symbols: string[]) => ({
+      engine: {
+        backgroundState: {
+          PerpsController: {
+            watchlistMarkets: { mainnet: symbols, testnet: [] },
+          },
+        },
+      },
+    });
+
+    it('shows watchlist market first in carousel with favorite badge', () => {
+      usePerpsMarkets.mockReturnValue({
+        markets: [
+          makeTrendingMarket({ symbol: 'BTC', volumeNumber: 5000000000 }),
+          makeTrendingMarket({ symbol: 'ETH', volumeNumber: 3000000000 }),
+          makeTrendingMarket({ symbol: 'SOL', volumeNumber: 1000000000 }),
+        ],
+        isLoading: false,
+        error: null,
+        refresh: jest.fn(),
+        isRefreshing: false,
+      });
+
+      renderWithProvider(
+        <PerpsSection sectionIndex={0} totalSectionsLoaded={1} />,
+        {
+          state: watchlistState(['SOL']),
+        },
+      );
+
+      expect(
+        screen.getByTestId('homepage-trending-perps-carousel'),
+      ).toBeOnTheScreen();
+
+      const allTiles = screen.getAllByTestId(/^perps-market-tile-/);
+      expect(allTiles[0].props.testID).toBe('perps-market-tile-SOL');
+
+      expect(screen.getByTestId('favorite-badge-SOL')).toBeOnTheScreen();
+      expect(screen.queryByTestId('favorite-badge-BTC')).toBeNull();
+      expect(screen.queryByTestId('favorite-badge-ETH')).toBeNull();
+    });
+
+    it('shows multiple watchlist markets before trending markets', () => {
+      usePerpsMarkets.mockReturnValue({
+        markets: [
+          makeTrendingMarket({ symbol: 'BTC', volumeNumber: 5000000000 }),
+          makeTrendingMarket({ symbol: 'ETH', volumeNumber: 3000000000 }),
+          makeTrendingMarket({ symbol: 'SOL', volumeNumber: 1000000000 }),
+          makeTrendingMarket({ symbol: 'DOGE', volumeNumber: 500000000 }),
+        ],
+        isLoading: false,
+        error: null,
+        refresh: jest.fn(),
+        isRefreshing: false,
+      });
+
+      renderWithProvider(
+        <PerpsSection sectionIndex={0} totalSectionsLoaded={1} />,
+        {
+          state: watchlistState(['SOL', 'DOGE']),
+        },
+      );
+
+      const allTiles = screen.getAllByTestId(/^perps-market-tile-/);
+      const symbols = allTiles.map((t) =>
+        t.props.testID.replace('perps-market-tile-', ''),
+      );
+
+      expect(symbols.indexOf('SOL')).toBeLessThan(symbols.indexOf('BTC'));
+      expect(symbols.indexOf('DOGE')).toBeLessThan(symbols.indexOf('BTC'));
+
+      expect(screen.getByTestId('favorite-badge-SOL')).toBeOnTheScreen();
+      expect(screen.getByTestId('favorite-badge-DOGE')).toBeOnTheScreen();
+    });
+
+    it('excludes watchlist markets from trending to avoid duplicates', () => {
+      usePerpsMarkets.mockReturnValue({
+        markets: [
+          makeTrendingMarket({ symbol: 'BTC', volumeNumber: 5000000000 }),
+          makeTrendingMarket({ symbol: 'ETH', volumeNumber: 3000000000 }),
+        ],
+        isLoading: false,
+        error: null,
+        refresh: jest.fn(),
+        isRefreshing: false,
+      });
+
+      renderWithProvider(
+        <PerpsSection sectionIndex={0} totalSectionsLoaded={1} />,
+        {
+          state: watchlistState(['BTC']),
+        },
+      );
+
+      const allTiles = screen.getAllByTestId(/^perps-market-tile-/);
+      const symbols = allTiles.map((t) =>
+        t.props.testID.replace('perps-market-tile-', ''),
+      );
+
+      const btcOccurrences = symbols.filter((s) => s === 'BTC').length;
+      expect(btcOccurrences).toBe(1);
+    });
+
+    it('respects max 5 total tiles including watchlist', () => {
+      const markets = Array.from({ length: 8 }, (_, i) =>
+        makeTrendingMarket({
+          symbol: `MKT${i}`,
+          volumeNumber: 10000000 - i * 1000000,
+        }),
+      );
+      usePerpsMarkets.mockReturnValue({
+        markets,
+        isLoading: false,
+        error: null,
+        refresh: jest.fn(),
+        isRefreshing: false,
+      });
+
+      renderWithProvider(
+        <PerpsSection sectionIndex={0} totalSectionsLoaded={1} />,
+        {
+          state: watchlistState(['MKT5', 'MKT6']),
+        },
+      );
+
+      const allTiles = screen.getAllByTestId(/^perps-market-tile-/);
+      expect(allTiles).toHaveLength(5);
+
+      expect(screen.getByText('MKT5')).toBeOnTheScreen();
+      expect(screen.getByText('MKT6')).toBeOnTheScreen();
+    });
+
+    it('renders only trending when watchlist is empty', () => {
+      usePerpsMarkets.mockReturnValue({
+        markets: [
+          makeTrendingMarket({ symbol: 'BTC', volumeNumber: 5000000000 }),
+          makeTrendingMarket({ symbol: 'ETH', volumeNumber: 3000000000 }),
+        ],
+        isLoading: false,
+        error: null,
+        refresh: jest.fn(),
+        isRefreshing: false,
+      });
+
+      renderWithProvider(
+        <PerpsSection sectionIndex={0} totalSectionsLoaded={1} />,
+        {
+          state: watchlistState([]),
+        },
+      );
+
+      expect(screen.getByText('BTC')).toBeOnTheScreen();
+      expect(screen.getByText('ETH')).toBeOnTheScreen();
+      expect(screen.queryByTestId('favorite-badge-BTC')).toBeNull();
+      expect(screen.queryByTestId('favorite-badge-ETH')).toBeNull();
+    });
+
+    it('caps at 5 tiles even when watchlist exceeds max carousel size', () => {
+      const markets = Array.from({ length: 7 }, (_, i) =>
+        makeTrendingMarket({
+          symbol: `MKT${i}`,
+          volumeNumber: 10000000 - i * 1000000,
+        }),
+      );
+      usePerpsMarkets.mockReturnValue({
+        markets,
+        isLoading: false,
+        error: null,
+        refresh: jest.fn(),
+        isRefreshing: false,
+      });
+
+      renderWithProvider(
+        <PerpsSection sectionIndex={0} totalSectionsLoaded={1} />,
+        {
+          state: watchlistState([
+            'MKT0',
+            'MKT1',
+            'MKT2',
+            'MKT3',
+            'MKT4',
+            'MKT5',
+          ]),
+        },
+      );
+
+      const allTiles = screen.getAllByTestId(/^perps-market-tile-/);
+      expect(allTiles).toHaveLength(5);
+
+      expect(screen.queryByTestId('favorite-badge-MKT6')).toBeNull();
+      expect(screen.queryByText('MKT6')).toBeNull();
+      // MKT5 is the 6th watchlist item, truncated by the cap
+      expect(screen.queryByText('MKT5')).toBeNull();
+    });
+
+    it('ignores watchlist symbols not present in market data', () => {
+      usePerpsMarkets.mockReturnValue({
+        markets: [
+          makeTrendingMarket({ symbol: 'BTC', volumeNumber: 5000000000 }),
+        ],
+        isLoading: false,
+        error: null,
+        refresh: jest.fn(),
+        isRefreshing: false,
+      });
+
+      renderWithProvider(
+        <PerpsSection sectionIndex={0} totalSectionsLoaded={1} />,
+        {
+          state: watchlistState(['NONEXISTENT']),
+        },
+      );
+
+      expect(screen.getByText('BTC')).toBeOnTheScreen();
+      expect(screen.queryByTestId('favorite-badge-BTC')).toBeNull();
+      expect(screen.queryByTestId('favorite-badge-NONEXISTENT')).toBeNull();
+    });
+  });
+
+  describe('connection error state', () => {
+    it('renders ErrorState with section title when connection fails', () => {
+      usePerpsConnection.mockReturnValue({
+        isConnected: false,
+        isConnecting: false,
+        isInitialized: false,
+        error: 'CONNECTION_TIMEOUT',
+        connect: jest.fn(),
+        disconnect: jest.fn(),
+        resetError: jest.fn(),
+        reconnectWithNewContext: mockReconnectWithNewContext,
+      });
+
+      renderWithProvider(
+        <PerpsSection sectionIndex={0} totalSectionsLoaded={1} />,
+      );
+
+      expect(screen.getByText('Perpetuals')).toBeOnTheScreen();
+      expect(screen.getByText('Unable to load perpetuals')).toBeOnTheScreen();
+      expect(screen.getByText('Retry')).toBeOnTheScreen();
+    });
+
+    it('calls reconnectWithNewContext with force on retry', () => {
+      usePerpsConnection.mockReturnValue({
+        isConnected: false,
+        isConnecting: false,
+        isInitialized: false,
+        error: 'CONNECTION_TIMEOUT',
+        connect: jest.fn(),
+        disconnect: jest.fn(),
+        resetError: jest.fn(),
+        reconnectWithNewContext: mockReconnectWithNewContext,
+      });
+
+      renderWithProvider(
+        <PerpsSection sectionIndex={0} totalSectionsLoaded={1} />,
+      );
+
+      fireEvent.press(screen.getByText('Retry'));
+
+      expect(mockReconnectWithNewContext).toHaveBeenCalledWith({
+        force: true,
+      });
+    });
+
+    it('triggers reconnect on pull-to-refresh when connection error exists', async () => {
+      usePerpsConnection.mockReturnValue({
+        isConnected: false,
+        isConnecting: false,
+        isInitialized: false,
+        error: 'CONNECTION_TIMEOUT',
+        connect: jest.fn(),
+        disconnect: jest.fn(),
+        resetError: jest.fn(),
+        reconnectWithNewContext: mockReconnectWithNewContext,
+      });
+
+      const ref = React.createRef<{ refresh: () => Promise<void> }>();
+      renderWithProvider(
+        <PerpsSection sectionIndex={0} totalSectionsLoaded={1} ref={ref} />,
+      );
+
+      await ref.current?.refresh();
+
+      expect(mockReconnectWithNewContext).toHaveBeenCalledWith({
+        force: true,
+      });
+    });
+
+    it('does not render positions or carousel when connection error exists', () => {
+      usePerpsConnection.mockReturnValue({
+        isConnected: false,
+        isConnecting: false,
+        isInitialized: false,
+        error: 'NETWORK_ERROR',
+        connect: jest.fn(),
+        disconnect: jest.fn(),
+        resetError: jest.fn(),
+        reconnectWithNewContext: mockReconnectWithNewContext,
+      });
+      usePerpsLivePositions.mockReturnValue({
+        positions: [makePosition()],
+        isInitialLoading: false,
+      });
+
+      renderWithProvider(
+        <PerpsSection sectionIndex={0} totalSectionsLoaded={1} />,
+      );
+
+      expect(
+        screen.queryByTestId('homepage-perps-positions'),
+      ).not.toBeOnTheScreen();
+      expect(
+        screen.queryByTestId('homepage-trending-perps-carousel'),
+      ).toBeNull();
+    });
+  });
+
+  describe('segment event integration', () => {
+    it('passes sectionName, sectionIndex, and totalSectionsLoaded', () => {
+      renderWithProvider(
+        <PerpsSection sectionIndex={2} totalSectionsLoaded={4} />,
+      );
+
+      expect(mockUseHomeViewedEvent).toHaveBeenCalledWith(
+        expect.objectContaining({
+          sectionName: 'perps',
+          sectionIndex: 2,
+          totalSectionsLoaded: 4,
+        }),
+      );
+    });
+
+    it('passes isLoading: true while positions are loading', () => {
+      usePerpsLivePositions.mockReturnValue({
+        positions: [],
+        isInitialLoading: true,
+      });
+
+      renderWithProvider(
+        <PerpsSection sectionIndex={0} totalSectionsLoaded={5} />,
+      );
+
+      expect(mockUseHomeViewedEvent).toHaveBeenLastCalledWith(
+        expect.objectContaining({ isLoading: true }),
+      );
+    });
+
+    it('passes isLoading: true while orders are loading', () => {
+      usePerpsLiveOrders.mockReturnValue({
+        orders: [],
+        isInitialLoading: true,
+      });
+
+      renderWithProvider(
+        <PerpsSection sectionIndex={0} totalSectionsLoaded={5} />,
+      );
+
+      expect(mockUseHomeViewedEvent).toHaveBeenLastCalledWith(
+        expect.objectContaining({ isLoading: true }),
+      );
+    });
+
+    it('passes isLoading: true while markets load when user has no positions or orders (pendingTrending)', () => {
+      usePerpsMarkets.mockReturnValue({
+        markets: [],
+        isLoading: true,
+        error: null,
+        refresh: jest.fn(),
+        isRefreshing: false,
+      });
+
+      renderWithProvider(
+        <PerpsSection sectionIndex={0} totalSectionsLoaded={5} />,
+      );
+
+      expect(mockUseHomeViewedEvent).toHaveBeenLastCalledWith(
+        expect.objectContaining({ isLoading: true }),
+      );
+    });
+
+    it('passes isLoading: false once all data has settled', () => {
+      renderWithProvider(
+        <PerpsSection sectionIndex={0} totalSectionsLoaded={5} />,
+      );
+
+      expect(mockUseHomeViewedEvent).toHaveBeenLastCalledWith(
+        expect.objectContaining({ isLoading: false }),
+      );
+    });
+
+    it('passes isEmpty: true and itemCount: 0 when no positions, orders, or markets', () => {
+      renderWithProvider(
+        <PerpsSection sectionIndex={0} totalSectionsLoaded={5} />,
+      );
+
+      expect(mockUseHomeViewedEvent).toHaveBeenLastCalledWith(
+        expect.objectContaining({ isEmpty: true, itemCount: 0 }),
+      );
+    });
+
+    it('passes isEmpty: false and itemCount when user has positions', () => {
+      usePerpsLivePositions.mockReturnValue({
+        positions: [makePosition(), makePosition({ symbol: 'ETH', size: '1' })],
+        isInitialLoading: false,
+      });
+
+      renderWithProvider(
+        <PerpsSection sectionIndex={0} totalSectionsLoaded={5} />,
+      );
+
+      expect(mockUseHomeViewedEvent).toHaveBeenLastCalledWith(
+        expect.objectContaining({ isEmpty: false, itemCount: 2 }),
+      );
+    });
+
+    it('combines positions and orders in itemCount', () => {
+      usePerpsLivePositions.mockReturnValue({
+        positions: [makePosition()],
+        isInitialLoading: false,
+      });
+      usePerpsLiveOrders.mockReturnValue({
+        orders: [
+          makeOrder({ orderId: 'o1' }),
+          makeOrder({ orderId: 'o2', symbol: 'ETH' }),
+        ],
+        isInitialLoading: false,
+      });
+
+      renderWithProvider(
+        <PerpsSection sectionIndex={0} totalSectionsLoaded={5} />,
+      );
+
+      expect(mockUseHomeViewedEvent).toHaveBeenLastCalledWith(
+        expect.objectContaining({ isEmpty: false, itemCount: 3 }),
+      );
+    });
+
+    it('passes isEmpty: false when trending markets are shown', () => {
+      usePerpsMarkets.mockReturnValue({
+        markets: [makeTrendingMarket()],
+        isLoading: false,
+        error: null,
+        refresh: jest.fn(),
+        isRefreshing: false,
+      });
+
+      renderWithProvider(
+        <PerpsSection sectionIndex={0} totalSectionsLoaded={5} />,
+      );
+
+      expect(mockUseHomeViewedEvent).toHaveBeenLastCalledWith(
+        expect.objectContaining({ isEmpty: false }),
+      );
+    });
+
+    it('passes itemCount: 0 when only trending markets are shown (positions/orders not counted)', () => {
+      usePerpsMarkets.mockReturnValue({
+        markets: [
+          makeTrendingMarket({ symbol: 'BTC' }),
+          makeTrendingMarket({ symbol: 'ETH' }),
+        ],
+        isLoading: false,
+        error: null,
+        refresh: jest.fn(),
+        isRefreshing: false,
+      });
+
+      renderWithProvider(
+        <PerpsSection sectionIndex={0} totalSectionsLoaded={5} />,
+      );
+
+      expect(mockUseHomeViewedEvent).toHaveBeenLastCalledWith(
+        expect.objectContaining({ itemCount: 0 }),
+      );
+    });
+  });
 });
diff --git a/app/components/Views/Homepage/Sections/Perpetuals/PerpsSection.tsx b/app/components/Views/Homepage/Sections/Perpetuals/PerpsSection.tsx
index 055fa2291d5c..791c1a73caa3 100644
--- a/app/components/Views/Homepage/Sections/Perpetuals/PerpsSection.tsx
+++ b/app/components/Views/Homepage/Sections/Perpetuals/PerpsSection.tsx
@@ -4,35 +4,49 @@ import React, {
   useEffect,
   useImperativeHandle,
   useMemo,
+  useRef,
   useState,
 } from 'react';
-import { ScrollView } from 'react-native';
+import { ScrollView, View } from 'react-native';
 import { useNavigation, type NavigationProp } from '@react-navigation/native';
 import { useTailwind } from '@metamask/design-system-twrnc-preset';
 import { Box } from '@metamask/design-system-react-native';
+import { useSelector } from 'react-redux';
 import {
   type PerpsMarketData,
   type Position,
+  PERPS_EVENT_PROPERTY,
+  PERPS_EVENT_VALUE,
 } from '@metamask/perps-controller';
+import type { PerpsMarketDataWithVolumeNumber } from '../../../../UI/Perps/hooks/usePerpsMarkets';
 import SectionTitle from '../../components/SectionTitle';
 import SectionRow from '../../components/SectionRow';
 import FadingScrollContainer from '../../components/FadingScrollContainer';
+import ErrorState from '../../components/ErrorState';
 import Routes from '../../../../../constants/navigation/Routes';
 import {
   usePerpsLivePositions,
   usePerpsLiveOrders,
   usePerpsMarkets,
 } from '../../../../UI/Perps/hooks';
+import { usePerpsConnection } from '../../../../UI/Perps/hooks/usePerpsConnection';
 import { filterAndSortMarkets } from '../../../../UI/Perps/utils/filterAndSortMarkets';
+import { selectPerpsWatchlistMarkets } from '../../../../UI/Perps/selectors/perpsController';
 import type { PerpsNavigationParamList } from '../../../../UI/Perps/types/navigation';
 import PerpsPositionCard from '../../../../UI/Perps/components/PerpsPositionCard/PerpsPositionCard';
 import PerpsCard from '../../../../UI/Perps/components/PerpsCard';
 import PerpsPositionSkeleton from './components/PerpsPositionSkeleton';
 import PerpsMarketTileCard from './components/PerpsMarketTileCard';
-import PerpsViewMoreCard from './components/PerpsViewMoreCard';
+import ViewMoreCard from '../../components/ViewMoreCard';
 import { useHomepageSparklines } from './hooks/useHomepageSparklines';
 import { strings } from '../../../../../../locales/i18n';
 import type { SectionRefreshHandle } from '../../types';
+import { usePerpsEventTracking } from '../../../../UI/Perps/hooks/usePerpsEventTracking';
+import { MetaMetricsEvents } from '../../../../../core/Analytics/MetaMetrics.events';
+import useHomeViewedEvent, {
+  HomeSectionNames,
+} from '../../hooks/useHomeViewedEvent';
+import type { PerpsSectionProps } from './PerpsSectionWithProvider';
 
 const MAX_ITEMS = 5;
 const MAX_TRENDING_MARKETS = 5;
@@ -46,204 +60,288 @@ const HOMEPAGE_THROTTLE_MS = 5000;
  *
  * Must be rendered inside PerpsConnectionProvider + PerpsStreamProvider.
  */
-const PerpsSection = forwardRef<SectionRefreshHandle>((_, ref) => {
-  const tw = useTailwind();
-  const navigation = useNavigation<NavigationProp<PerpsNavigationParamList>>();
-  const title = strings('homepage.sections.perpetuals');
+const PerpsSection = forwardRef<SectionRefreshHandle, PerpsSectionProps>(
+  ({ sectionIndex, totalSectionsLoaded }, ref) => {
+    const sectionViewRef = useRef<View>(null);
+    const tw = useTailwind();
+    const navigation =
+      useNavigation<NavigationProp<PerpsNavigationParamList>>();
+    const title = strings('homepage.sections.perpetuals');
+    const { error: connectionError, reconnectWithNewContext } =
+      usePerpsConnection();
+    const { track } = usePerpsEventTracking();
 
-  const { positions, isInitialLoading: positionsLoading } =
-    usePerpsLivePositions({
+    const { positions, isInitialLoading: positionsLoading } =
+      usePerpsLivePositions({
+        throttleMs: HOMEPAGE_THROTTLE_MS,
+      });
+
+    const { orders, isInitialLoading: ordersLoading } = usePerpsLiveOrders({
+      hideTpSl: true,
       throttleMs: HOMEPAGE_THROTTLE_MS,
     });
 
-  const { orders, isInitialLoading: ordersLoading } = usePerpsLiveOrders({
-    hideTpSl: true,
-    throttleMs: HOMEPAGE_THROTTLE_MS,
-  });
-
-  const hookLoading = positionsLoading || ordersLoading;
-
-  // `deferredLoading` lags `hookLoading` by one render cycle.
-  // usePerpsLivePositions sets isInitialLoading=false and rawPositions in the
-  // same batch, but enriched `positions` updates one render later via useEffect.
-  // Keeping the skeleton visible until both flags are false bridges that gap
-  // and prevents a single-frame flash of empty content.
-  const [deferredLoading, setDeferredLoading] = useState(hookLoading);
-  useEffect(() => {
-    setDeferredLoading(hookLoading);
-  }, [hookLoading]);
-
-  const showSkeleton = hookLoading || deferredLoading;
-
-  // TP/SL is extracted from orders and merged into positions by the
-  // subscription service. Due to the 5s throttle the merged update can be
-  // delayed — positions appear first without TP/SL. If any position already
-  // has TP/SL the merge is done for all of them; otherwise wait for a
-  // fallback timeout (throttle interval + margin).
-  const anyPositionHasTpSl = useMemo(
-    () =>
-      positions.some(
-        (p) => p.takeProfitPrice != null || p.stopLossPrice != null,
-      ),
-    [positions],
-  );
-
-  const [tpSlSettled, setTpSlSettled] = useState(false);
-
-  useEffect(() => {
-    if (showSkeleton) {
-      setTpSlSettled(false);
-      return undefined;
-    }
-    if (anyPositionHasTpSl) return undefined;
-    const timer = setTimeout(
-      () => setTpSlSettled(true),
-      HOMEPAGE_THROTTLE_MS + 500,
+    const hookLoading = positionsLoading || ordersLoading;
+
+    // `deferredLoading` lags `hookLoading` by one render cycle.
+    // usePerpsLivePositions sets isInitialLoading=false and rawPositions in the
+    // same batch, but enriched `positions` updates one render later via useEffect.
+    // Keeping the skeleton visible until both flags are false bridges that gap
+    // and prevents a single-frame flash of empty content.
+    const [deferredLoading, setDeferredLoading] = useState(hookLoading);
+    useEffect(() => {
+      setDeferredLoading(hookLoading);
+    }, [hookLoading]);
+
+    const showSkeleton = hookLoading || deferredLoading;
+
+    // TP/SL is extracted from orders and merged into positions by the
+    // subscription service. Due to the 5s throttle the merged update can be
+    // delayed — positions appear first without TP/SL. If any position already
+    // has TP/SL the merge is done for all of them; otherwise wait for a
+    // fallback timeout (throttle interval + margin).
+    const anyPositionHasTpSl = useMemo(
+      () =>
+        positions.some(
+          (p) => p.takeProfitPrice != null || p.stopLossPrice != null,
+        ),
+      [positions],
     );
-    return () => clearTimeout(timer);
-  }, [showSkeleton, anyPositionHasTpSl]);
-
-  const tpSlReady = anyPositionHasTpSl || tpSlSettled;
-
-  const { markets, isLoading: marketsLoading } = usePerpsMarkets();
-
-  const displayPositions = useMemo(
-    () => positions.slice(0, MAX_ITEMS),
-    [positions],
-  );
-
-  const remainingSlots = MAX_ITEMS - displayPositions.length;
-  const displayOrders = useMemo(
-    () => (remainingSlots > 0 ? orders.slice(0, remainingSlots) : []),
-    [orders, remainingSlots],
-  );
-
-  const hasItems = displayPositions.length > 0 || displayOrders.length > 0;
-
-  // When user has no positions/orders, keep skeleton visible until markets
-  // load so the section doesn't flash empty while trending tiles are fetched.
-  const pendingTrending = !showSkeleton && !hasItems && marketsLoading;
-  const showTrending = !showSkeleton && !hasItems && !marketsLoading;
-
-  const trendingMarkets = useMemo(
-    () =>
-      showTrending && markets.length > 0
-        ? filterAndSortMarkets({
-            marketData: markets,
-            showZeroVolume: false,
-          }).slice(0, MAX_TRENDING_MARKETS)
-        : [],
-    [showTrending, markets],
-  );
-
-  const trendingSymbols = useMemo(
-    () => trendingMarkets.map((m) => m.symbol),
-    [trendingMarkets],
-  );
-  const { sparklines, refresh: refreshSparklines } =
-    useHomepageSparklines(trendingSymbols);
-
-  useImperativeHandle(
-    ref,
-    () => ({
-      refresh: () => {
-        refreshSparklines();
-        return Promise.resolve();
-      },
-    }),
-    [refreshSparklines],
-  );
 
-  const handleViewAllPerps = useCallback(() => {
-    navigation.navigate(Routes.PERPS.ROOT, {
-      screen: Routes.PERPS.PERPS_HOME,
-    });
-  }, [navigation]);
+    const [tpSlSettled, setTpSlSettled] = useState(false);
 
-  const handlePositionPress = useCallback(
-    (position: Position) => {
-      const market = markets.find((m) => m.symbol === position.symbol);
-      navigation.navigate(Routes.PERPS.ROOT, {
-        screen: Routes.PERPS.MARKET_DETAILS,
-        params: {
-          market: market ?? {
-            symbol: position.symbol,
-            maxLeverage: position.maxLeverage,
-          },
-          initialTab: 'position',
+    useEffect(() => {
+      if (showSkeleton) {
+        setTpSlSettled(false);
+        return undefined;
+      }
+      if (anyPositionHasTpSl) return undefined;
+      const timer = setTimeout(
+        () => setTpSlSettled(true),
+        HOMEPAGE_THROTTLE_MS + 500,
+      );
+      return () => clearTimeout(timer);
+    }, [showSkeleton, anyPositionHasTpSl]);
+
+    const tpSlReady = anyPositionHasTpSl || tpSlSettled;
+
+    const { markets, isLoading: marketsLoading } = usePerpsMarkets();
+    const watchlistSymbols = useSelector(selectPerpsWatchlistMarkets);
+
+    const displayPositions = useMemo(
+      () => positions.slice(0, MAX_ITEMS),
+      [positions],
+    );
+
+    const remainingSlots = MAX_ITEMS - displayPositions.length;
+    const displayOrders = useMemo(
+      () => (remainingSlots > 0 ? orders.slice(0, remainingSlots) : []),
+      [orders, remainingSlots],
+    );
+
+    const hasItems = displayPositions.length > 0 || displayOrders.length > 0;
+
+    // When user has no positions/orders, keep skeleton visible until markets
+    // load so the section doesn't flash empty while trending tiles are fetched.
+    const pendingTrending = !showSkeleton && !hasItems && marketsLoading;
+    const showTrending = !showSkeleton && !hasItems && !marketsLoading;
+
+    const safeWatchlistSymbols = useMemo(
+      () => watchlistSymbols ?? [],
+      [watchlistSymbols],
+    );
+
+    const watchlistMarkets = useMemo(() => {
+      if (markets.length === 0 || safeWatchlistSymbols.length === 0) return [];
+      const marketBySymbol = new Map(markets.map((m) => [m.symbol, m]));
+      return safeWatchlistSymbols
+        .map((sym) => marketBySymbol.get(sym))
+        .filter((m): m is PerpsMarketDataWithVolumeNumber => m != null);
+    }, [markets, safeWatchlistSymbols]);
+
+    const trendingMarkets = useMemo(() => {
+      if (markets.length === 0) return [];
+      const wlSet = new Set(watchlistMarkets.map((m) => m.symbol));
+      return filterAndSortMarkets({
+        marketData: markets,
+        showZeroVolume: false,
+      })
+        .filter((m) => !wlSet.has(m.symbol))
+        .slice(0, Math.max(0, MAX_TRENDING_MARKETS - watchlistMarkets.length));
+    }, [markets, watchlistMarkets]);
+
+    const allCarouselMarkets = useMemo(
+      () =>
+        [...watchlistMarkets, ...trendingMarkets].slice(
+          0,
+          MAX_TRENDING_MARKETS,
+        ),
+      [watchlistMarkets, trendingMarkets],
+    );
+
+    const watchlistSymbolSet = useMemo(
+      () => new Set(watchlistMarkets.map((m) => m.symbol)),
+      [watchlistMarkets],
+    );
+
+    const carouselSymbols = useMemo(
+      () => (showTrending ? allCarouselMarkets.map((m) => m.symbol) : []),
+      [showTrending, allCarouselMarkets],
+    );
+    const { sparklines, refresh: refreshSparklines } =
+      useHomepageSparklines(carouselSymbols);
+
+    useImperativeHandle(
+      ref,
+      () => ({
+        refresh: async () => {
+          if (connectionError) {
+            await reconnectWithNewContext({ force: true });
+            return;
+          }
+          refreshSparklines();
         },
-      });
-    },
-    [navigation, markets],
-  );
+      }),
+      [connectionError, reconnectWithNewContext, refreshSparklines],
+    );
 
-  const handleTilePress = useCallback(
-    (market: PerpsMarketData) => {
+    const handleViewAllPerps = useCallback(() => {
       navigation.navigate(Routes.PERPS.ROOT, {
-        screen: Routes.PERPS.MARKET_DETAILS,
-        params: { market },
+        screen: Routes.PERPS.PERPS_HOME,
+        params: { source: PERPS_EVENT_VALUE.SOURCE.HOME_SECTION },
       });
-    },
-    [navigation],
-  );
-
-  return (
-    <Box gap={3}>
-      <SectionTitle title={title} onPress={handleViewAllPerps} />
-      {showSkeleton || pendingTrending ? (
-        <SectionRow>
-          <PerpsPositionSkeleton />
-        </SectionRow>
-      ) : hasItems ? (
-        <SectionRow>
-          <Box testID="homepage-perps-positions">
-            {displayPositions.map((position) => (
-              <PerpsPositionCard
-                key={position.symbol}
-                position={position}
-                compact
-                compactVariant="position"
-                iconSize={36}
-                tpSlLoading={!tpSlReady}
-                onPress={() => handlePositionPress(position)}
-                testID={`perps-position-row-${position.symbol}`}
-              />
-            ))}
-            {displayOrders.map((order) => (
-              <PerpsCard
-                key={order.orderId}
-                order={order}
-                iconSize={36}
-                testID={`perps-order-row-${order.orderId}`}
-              />
-            ))}
+    }, [navigation]);
+
+    const handlePositionPress = useCallback(
+      (position: Position) => {
+        track(MetaMetricsEvents.PERPS_UI_INTERACTION, {
+          [PERPS_EVENT_PROPERTY.INTERACTION_TYPE]:
+            PERPS_EVENT_VALUE.INTERACTION_TYPE.BUTTON_CLICKED,
+          [PERPS_EVENT_PROPERTY.BUTTON_CLICKED]:
+            PERPS_EVENT_VALUE.BUTTON_CLICKED.OPEN_POSITION,
+          [PERPS_EVENT_PROPERTY.BUTTON_LOCATION]:
+            PERPS_EVENT_VALUE.BUTTON_LOCATION.WALLET_HOME,
+        });
+        const market = markets.find((m) => m.symbol === position.symbol);
+        navigation.navigate(Routes.PERPS.ROOT, {
+          screen: Routes.PERPS.MARKET_DETAILS,
+          params: {
+            market: market ?? {
+              symbol: position.symbol,
+              maxLeverage: position.maxLeverage,
+            },
+            initialTab: 'position',
+            source: 'section_position',
+          },
+        });
+      },
+      [navigation, markets, track],
+    );
+
+    const handleTilePress = useCallback(
+      (market: PerpsMarketData) => {
+        navigation.navigate(Routes.PERPS.ROOT, {
+          screen: Routes.PERPS.MARKET_DETAILS,
+          params: { market, source: PERPS_EVENT_VALUE.SOURCE.HOME_SECTION },
+        });
+      },
+      [navigation],
+    );
+
+    // Pass null while loading so the hook uses the immediate-fire path and
+    // does not fire from viewport visibility with stale itemCount/isEmpty.
+    const isLoadingSection = hookLoading || deferredLoading || pendingTrending;
+    const willRender = !isLoadingSection;
+
+    useHomeViewedEvent({
+      sectionRef: willRender ? sectionViewRef : null,
+      isLoading: isLoadingSection,
+      sectionName: HomeSectionNames.PERPS,
+      sectionIndex,
+      totalSectionsLoaded,
+      isEmpty: !hasItems && trendingMarkets.length === 0,
+      itemCount: hasItems ? displayPositions.length + displayOrders.length : 0,
+    });
+
+    if (connectionError) {
+      return (
+        <View ref={sectionViewRef}>
+          <Box gap={3}>
+            <SectionTitle title={title} onPress={handleViewAllPerps} />
+            <ErrorState
+              title={strings('homepage.error.unable_to_load', {
+                section: title.toLowerCase(),
+              })}
+              onRetry={() => reconnectWithNewContext({ force: true })}
+            />
           </Box>
-        </SectionRow>
-      ) : trendingMarkets.length > 0 ? (
-        <FadingScrollContainer>
-          {(scrollProps) => (
-            <ScrollView
-              horizontal
-              showsHorizontalScrollIndicator={false}
-              contentContainerStyle={tw.style('px-4 gap-2.5')}
-              testID="homepage-trending-perps-carousel"
-              {...scrollProps}
-            >
-              {trendingMarkets.map((market) => (
-                <PerpsMarketTileCard
-                  key={market.symbol}
-                  market={market}
-                  sparklineData={sparklines[market.symbol]}
-                  onPress={handleTilePress}
-                />
-              ))}
-              <PerpsViewMoreCard onPress={handleViewAllPerps} />
-            </ScrollView>
-          )}
-        </FadingScrollContainer>
-      ) : null}
-    </Box>
-  );
-});
+        </View>
+      );
+    }
+
+    return (
+      <View ref={sectionViewRef}>
+        <Box gap={3}>
+          <SectionTitle title={title} onPress={handleViewAllPerps} />
+          {showSkeleton || pendingTrending ? (
+            <SectionRow>
+              <PerpsPositionSkeleton />
+            </SectionRow>
+          ) : hasItems ? (
+            <SectionRow>
+              <Box testID="homepage-perps-positions">
+                {displayPositions.map((position) => (
+                  <PerpsPositionCard
+                    key={position.symbol}
+                    position={position}
+                    compact
+                    compactVariant="position"
+                    tpSlLoading={!tpSlReady}
+                    onPress={() => handlePositionPress(position)}
+                    testID={`perps-position-row-${position.symbol}`}
+                  />
+                ))}
+                {displayOrders.map((order) => (
+                  <PerpsCard
+                    key={order.orderId}
+                    order={order}
+                    testID={`perps-order-row-${order.orderId}`}
+                  />
+                ))}
+              </Box>
+            </SectionRow>
+          ) : allCarouselMarkets.length > 0 ? (
+            <FadingScrollContainer>
+              {(scrollProps) => (
+                <ScrollView
+                  horizontal
+                  showsHorizontalScrollIndicator={false}
+                  contentContainerStyle={tw.style('px-4 gap-2.5')}
+                  testID="homepage-trending-perps-carousel"
+                  {...scrollProps}
+                >
+                  {allCarouselMarkets.map((market) => (
+                    <PerpsMarketTileCard
+                      key={market.symbol}
+                      market={market}
+                      sparklineData={sparklines[market.symbol]}
+                      showFavoriteTag={watchlistSymbolSet.has(market.symbol)}
+                      onPress={handleTilePress}
+                    />
+                  ))}
+                  <ViewMoreCard
+                    onPress={handleViewAllPerps}
+                    twClassName="w-[180px] flex-1"
+                    testID="perps-view-more-card"
+                  />
+                </ScrollView>
+              )}
+            </FadingScrollContainer>
+          ) : null}
+        </Box>
+      </View>
+    );
+  },
+);
 
 export default PerpsSection;
diff --git a/app/components/Views/Homepage/Sections/Perpetuals/PerpsSectionWithProvider.test.tsx b/app/components/Views/Homepage/Sections/Perpetuals/PerpsSectionWithProvider.test.tsx
index 6184d3af663a..cf95bb768b26 100644
--- a/app/components/Views/Homepage/Sections/Perpetuals/PerpsSectionWithProvider.test.tsx
+++ b/app/components/Views/Homepage/Sections/Perpetuals/PerpsSectionWithProvider.test.tsx
@@ -45,7 +45,9 @@ describe('PerpsSectionWithProvider', () => {
   });
 
   it('renders PerpsSection when perps is enabled', () => {
-    renderWithProvider(<PerpsSectionWithProvider />);
+    renderWithProvider(
+      <PerpsSectionWithProvider sectionIndex={0} totalSectionsLoaded={5} />,
+    );
 
     expect(screen.getByText('PerpsSection')).toBeOnTheScreen();
   });
@@ -55,7 +57,9 @@ describe('PerpsSectionWithProvider', () => {
       .requireMock('../../../../UI/Perps')
       .selectPerpsEnabledFlag.mockReturnValue(false);
 
-    const { toJSON } = renderWithProvider(<PerpsSectionWithProvider />);
+    const { toJSON } = renderWithProvider(
+      <PerpsSectionWithProvider sectionIndex={0} totalSectionsLoaded={5} />,
+    );
 
     expect(toJSON()).toBeNull();
   });
diff --git a/app/components/Views/Homepage/Sections/Perpetuals/PerpsSectionWithProvider.tsx b/app/components/Views/Homepage/Sections/Perpetuals/PerpsSectionWithProvider.tsx
index 6f86331809fb..cfc25cf4457b 100644
--- a/app/components/Views/Homepage/Sections/Perpetuals/PerpsSectionWithProvider.tsx
+++ b/app/components/Views/Homepage/Sections/Perpetuals/PerpsSectionWithProvider.tsx
@@ -7,6 +7,11 @@ import { selectSelectedInternalAccountAddress } from '../../../../../selectors/a
 import PerpsSection from './PerpsSection';
 import type { SectionRefreshHandle } from '../../types';
 
+export interface PerpsSectionProps {
+  sectionIndex: number;
+  totalSectionsLoaded: number;
+}
+
 /**
  * Wraps PerpsSection with WebSocket providers.
  * Gates rendering on the perps feature flag to avoid opening
@@ -16,7 +21,10 @@ import type { SectionRefreshHandle } from '../../types';
  * remounts the entire provider + hook tree, resetting loading
  * state and showing the skeleton while new data streams in.
  */
-const PerpsSectionWithProvider = forwardRef<SectionRefreshHandle>((_, ref) => {
+const PerpsSectionWithProvider = forwardRef<
+  SectionRefreshHandle,
+  PerpsSectionProps
+>(({ sectionIndex, totalSectionsLoaded }, ref) => {
   const isPerpsEnabled = useSelector(selectPerpsEnabledFlag);
   const selectedAddress = useSelector(selectSelectedInternalAccountAddress);
 
@@ -25,9 +33,13 @@ const PerpsSectionWithProvider = forwardRef<SectionRefreshHandle>((_, ref) => {
   }
 
   return (
-    <PerpsConnectionProvider key={selectedAddress}>
+    <PerpsConnectionProvider key={selectedAddress} suppressErrorView>
       <PerpsStreamProvider>
-        <PerpsSection ref={ref} />
+        <PerpsSection
+          ref={ref}
+          sectionIndex={sectionIndex}
+          totalSectionsLoaded={totalSectionsLoaded}
+        />
       </PerpsStreamProvider>
     </PerpsConnectionProvider>
   );
diff --git a/app/components/Views/Homepage/Sections/Perpetuals/components/PerpsMarketTileCard/PerpsMarketTileCard.styles.ts b/app/components/Views/Homepage/Sections/Perpetuals/components/PerpsMarketTileCard/PerpsMarketTileCard.styles.ts
index dee0440a8ae8..fa08746731cd 100644
--- a/app/components/Views/Homepage/Sections/Perpetuals/components/PerpsMarketTileCard/PerpsMarketTileCard.styles.ts
+++ b/app/components/Views/Homepage/Sections/Perpetuals/components/PerpsMarketTileCard/PerpsMarketTileCard.styles.ts
@@ -19,8 +19,7 @@ const styleSheet = (params: {
     },
     content: {
       flex: 1,
-      paddingTop: 12,
-      paddingHorizontal: 12,
+      padding: 16,
     },
     topRow: {
       flexDirection: 'row',
@@ -36,8 +35,20 @@ const styleSheet = (params: {
       alignItems: 'center',
       gap: 6,
     },
+    tokenLogoWrapper: {
+      position: 'relative' as const,
+    },
+    favoriteBadge: {
+      position: 'absolute' as const,
+      top: -6,
+      right: -6,
+      backgroundColor: theme.colors.background.alternative,
+      borderRadius: 12,
+      padding: 3,
+    },
     sparklineContainer: {
       marginTop: 'auto' as const,
+      marginBottom: 16,
     },
     shimmerOverlay: {
       ...StyleSheet.absoluteFillObject,
diff --git a/app/components/Views/Homepage/Sections/Perpetuals/components/PerpsMarketTileCard/PerpsMarketTileCard.test.tsx b/app/components/Views/Homepage/Sections/Perpetuals/components/PerpsMarketTileCard/PerpsMarketTileCard.test.tsx
index cc7860bc7e0c..0828be403499 100644
--- a/app/components/Views/Homepage/Sections/Perpetuals/components/PerpsMarketTileCard/PerpsMarketTileCard.test.tsx
+++ b/app/components/Views/Homepage/Sections/Perpetuals/components/PerpsMarketTileCard/PerpsMarketTileCard.test.tsx
@@ -73,6 +73,7 @@ jest.mock('../SparklineChart', () => {
       width: number;
       height: number;
       color: string;
+      strokeWidth?: number;
     }) {
       return (
         <View
diff --git a/app/components/Views/Homepage/Sections/Perpetuals/components/PerpsMarketTileCard/PerpsMarketTileCard.tsx b/app/components/Views/Homepage/Sections/Perpetuals/components/PerpsMarketTileCard/PerpsMarketTileCard.tsx
index 34a5cf02a5aa..53eb5d43b2e0 100644
--- a/app/components/Views/Homepage/Sections/Perpetuals/components/PerpsMarketTileCard/PerpsMarketTileCard.tsx
+++ b/app/components/Views/Homepage/Sections/Perpetuals/components/PerpsMarketTileCard/PerpsMarketTileCard.tsx
@@ -5,6 +5,10 @@ import {
   TextColor,
   TextVariant,
   FontWeight,
+  Icon,
+  IconName,
+  IconSize,
+  IconColor,
 } from '@metamask/design-system-react-native';
 import { useStyles } from '../../../../../../hooks/useStyles';
 import {
@@ -20,8 +24,9 @@ import styleSheet from './PerpsMarketTileCard.styles';
 import type { PerpsMarketTileCardProps } from './PerpsMarketTileCard.types';
 
 const DEFAULT_CARD_WIDTH = 180;
-const DEFAULT_CARD_HEIGHT = 140;
-const SPARKLINE_HEIGHT = 48;
+const DEFAULT_CARD_HEIGHT = 180;
+const SPARKLINE_HEIGHT = 80;
+const SPARKLINE_STROKE_WIDTH = 2;
 const TOKEN_LOGO_SIZE = 40;
 const SHIMMER_PULSE_DURATION = 900;
 const LIVE_PRICES_THROTTLE_MS = 3000;
@@ -41,6 +46,7 @@ const TileCardInner: React.FC<
   cardWidth = DEFAULT_CARD_WIDTH,
   cardHeight = DEFAULT_CARD_HEIGHT,
   livePrices,
+  showFavoriteTag = false,
   testID = 'perps-market-tile-card',
 }) => {
   const { styles, theme } = useStyles(styleSheet, { cardWidth, cardHeight });
@@ -135,11 +141,25 @@ const TileCardInner: React.FC<
             </Text>
           </View>
 
-          <PerpsTokenLogo
-            symbol={market.symbol}
-            size={TOKEN_LOGO_SIZE}
-            recyclingKey={market.symbol}
-          />
+          <View style={styles.tokenLogoWrapper}>
+            <PerpsTokenLogo
+              symbol={market.symbol}
+              size={TOKEN_LOGO_SIZE}
+              recyclingKey={market.symbol}
+            />
+            {showFavoriteTag && (
+              <View
+                style={styles.favoriteBadge}
+                testID={`favorite-badge-${market.symbol}`}
+              >
+                <Icon
+                  name={IconName.StarFilled}
+                  size={IconSize.Sm}
+                  color={IconColor.IconAlternative}
+                />
+              </View>
+            )}
+          </View>
         </View>
       </View>
 
@@ -148,10 +168,12 @@ const TileCardInner: React.FC<
           <SparklineChart
             data={sparklineData}
             width={sparklineWidth}
+            strokeWidth={SPARKLINE_STROKE_WIDTH}
             height={SPARKLINE_HEIGHT}
             color={sparklineColor}
             gradientId={`sparkline-${market.symbol}`}
             revealColor={theme.colors.background.section}
+            showGradient={false}
           />
         )}
       </View>
diff --git a/app/components/Views/Homepage/Sections/Perpetuals/components/PerpsMarketTileCard/PerpsMarketTileCard.types.ts b/app/components/Views/Homepage/Sections/Perpetuals/components/PerpsMarketTileCard/PerpsMarketTileCard.types.ts
index 36156daa77d0..6939a6786883 100644
--- a/app/components/Views/Homepage/Sections/Perpetuals/components/PerpsMarketTileCard/PerpsMarketTileCard.types.ts
+++ b/app/components/Views/Homepage/Sections/Perpetuals/components/PerpsMarketTileCard/PerpsMarketTileCard.types.ts
@@ -9,10 +9,12 @@ export interface PerpsMarketTileCardProps {
   onPress?: (market: PerpsMarketData) => void;
   /** Card width in pixels (default: 180) */
   cardWidth?: number;
-  /** Card height in pixels (default: 140) */
+  /** Card height in pixels (default: 180) */
   cardHeight?: number;
   /** Skip live price WebSocket subscription (use static market data instead) */
   disableLivePrices?: boolean;
+  /** Show a "Favorite" tag */
+  showFavoriteTag?: boolean;
   /** Test ID for E2E testing */
   testID?: string;
 }
diff --git a/app/components/Views/Homepage/Sections/Perpetuals/components/PerpsViewMoreCard.tsx b/app/components/Views/Homepage/Sections/Perpetuals/components/PerpsViewMoreCard.tsx
deleted file mode 100644
index afa00d188a3f..000000000000
--- a/app/components/Views/Homepage/Sections/Perpetuals/components/PerpsViewMoreCard.tsx
+++ /dev/null
@@ -1,44 +0,0 @@
-import React from 'react';
-import { TouchableOpacity } from 'react-native';
-import {
-  Box,
-  Text,
-  BoxAlignItems,
-  BoxJustifyContent,
-  TextVariant,
-  TextColor,
-  FontWeight,
-} from '@metamask/design-system-react-native';
-import { strings } from '../../../../../../../locales/i18n';
-
-interface PerpsViewMoreCardProps {
-  onPress: () => void;
-}
-
-/**
- * "More perps" card shown at the end of the trending markets carousel.
- * Matches the dimensions of PerpsMarketTileCard (180×140) for visual consistency.
- */
-const PerpsViewMoreCard: React.FC<PerpsViewMoreCardProps> = ({ onPress }) => (
-  <TouchableOpacity
-    onPress={onPress}
-    activeOpacity={0.7}
-    testID="perps-view-more-card"
-  >
-    <Box
-      twClassName="w-[180px] h-[140px] rounded-xl bg-background-muted"
-      alignItems={BoxAlignItems.Center}
-      justifyContent={BoxJustifyContent.Center}
-    >
-      <Text
-        variant={TextVariant.BodyMd}
-        fontWeight={FontWeight.Medium}
-        color={TextColor.TextDefault}
-      >
-        {strings('homepage.sections.more_perps')}
-      </Text>
-    </Box>
-  </TouchableOpacity>
-);
-
-export default PerpsViewMoreCard;
diff --git a/app/components/Views/Homepage/Sections/Predictions/PredictionsSection.test.tsx b/app/components/Views/Homepage/Sections/Predictions/PredictionsSection.test.tsx
index 109284a4056c..cb28a5ba4ea6 100644
--- a/app/components/Views/Homepage/Sections/Predictions/PredictionsSection.test.tsx
+++ b/app/components/Views/Homepage/Sections/Predictions/PredictionsSection.test.tsx
@@ -5,6 +5,8 @@ import PredictionsSection from './PredictionsSection';
 import Routes from '../../../../../constants/navigation/Routes';
 
 const mockNavigate = jest.fn();
+const mockClaim = jest.fn();
+const mockRefreshClaimable = jest.fn();
 
 jest.mock('@react-navigation/native', () => {
   const actualNav = jest.requireActual('@react-navigation/native');
@@ -16,10 +18,33 @@ jest.mock('@react-navigation/native', () => {
   };
 });
 
+jest.mock('../../components/FadingScrollContainer', () => {
+  const { View } = jest.requireActual('react-native');
+  return {
+    __esModule: true,
+    default: ({
+      children,
+    }: {
+      children: (props: {
+        onScroll: () => void;
+        scrollEventThrottle: number;
+      }) => React.ReactNode;
+    }) => (
+      <View testID="fading-scroll-container">
+        {children({ onScroll: jest.fn(), scrollEventThrottle: 16 })}
+      </View>
+    ),
+  };
+});
+
 jest.mock('../../../../UI/Predict/selectors/featureFlags', () => ({
   selectPredictEnabledFlag: jest.fn(() => true),
 }));
 
+jest.mock('../../../../UI/Predict/hooks/usePredictClaim', () => ({
+  usePredictClaim: () => ({ claim: mockClaim }),
+}));
+
 // Mock the hooks
 jest.mock('./hooks', () => ({
   usePredictMarketsForHomepage: jest.fn(() => ({
@@ -36,14 +61,87 @@ jest.mock('./hooks', () => ({
   })),
 }));
 
+jest.mock('../../hooks/useHomeViewedEvent', () => ({
+  __esModule: true,
+  default: jest.fn(),
+  HomeSectionNames: {
+    TOKENS: 'tokens',
+    PERPS: 'perps',
+    DEFI: 'defi',
+    PREDICT: 'predict',
+    NFTS: 'nfts',
+  },
+}));
+
 const mockUsePredictMarketsForHomepage =
   jest.requireMock('./hooks').usePredictMarketsForHomepage;
 const mockUsePredictPositionsForHomepage =
   jest.requireMock('./hooks').usePredictPositionsForHomepage;
 
+const mockActivePositions = [
+  {
+    outcomeId: 'outcome-1',
+    outcomeIndex: 0,
+    marketId: 'market-1',
+    title: 'Test Position 1',
+    outcome: 'Yes',
+    icon: 'https://example.com/icon1.png',
+    initialValue: 10,
+    currentValue: 12,
+    size: 15,
+    percentPnl: 20,
+    claimable: false,
+  },
+  {
+    outcomeId: 'outcome-2',
+    outcomeIndex: 0,
+    marketId: 'market-2',
+    title: 'Test Position 2',
+    outcome: 'No',
+    icon: 'https://example.com/icon2.png',
+    initialValue: 5,
+    currentValue: 3,
+    size: 8,
+    percentPnl: -40,
+    claimable: false,
+  },
+];
+
+const mockClaimablePositions = [
+  {
+    outcomeId: 'claimable-outcome-1',
+    outcomeIndex: 0,
+    marketId: 'claimable-market-1',
+    title: 'Claimable Position',
+    outcome: 'Yes',
+    icon: 'https://example.com/icon-claimable.png',
+    initialValue: 10,
+    currentValue: 75,
+    size: 75,
+    percentPnl: 650,
+    claimable: true,
+  },
+  {
+    outcomeId: 'claimable-outcome-2',
+    outcomeIndex: 0,
+    marketId: 'claimable-market-2',
+    title: 'Claimable Position 2',
+    outcome: 'Yes',
+    icon: 'https://example.com/icon-claimable2.png',
+    initialValue: 10,
+    currentValue: 125,
+    size: 125,
+    percentPnl: 1150,
+    claimable: true,
+  },
+];
+
 describe('PredictionsSection', () => {
   beforeEach(() => {
     jest.clearAllMocks();
+    mockClaim.mockResolvedValue(undefined);
+    mockRefreshClaimable.mockResolvedValue(undefined);
+
     // Reset mock return value to default (true) to ensure test isolation
     jest
       .requireMock('../../../../UI/Predict/selectors/featureFlags')
@@ -69,22 +167,30 @@ describe('PredictionsSection', () => {
       error: null,
       refresh: jest.fn(),
     });
-    mockUsePredictPositionsForHomepage.mockReturnValue({
-      positions: [],
-      isLoading: false,
-      error: null,
-      refresh: jest.fn(),
-    });
+
+    // Differentiate active vs claimable positions calls by second arg
+    mockUsePredictPositionsForHomepage.mockImplementation(
+      (_maxPositions?: number, claimable = false) => ({
+        positions: [],
+        isLoading: false,
+        error: null,
+        refresh: claimable ? mockRefreshClaimable : jest.fn(),
+      }),
+    );
   });
 
   it('renders section title when enabled', () => {
-    renderWithProvider(<PredictionsSection />);
+    renderWithProvider(
+      <PredictionsSection sectionIndex={0} totalSectionsLoaded={1} />,
+    );
 
     expect(screen.getByText('Predictions')).toBeOnTheScreen();
   });
 
   it('navigates to predictions market list on title press', () => {
-    renderWithProvider(<PredictionsSection />);
+    renderWithProvider(
+      <PredictionsSection sectionIndex={0} totalSectionsLoaded={1} />,
+    );
 
     fireEvent.press(screen.getByText('Predictions'));
 
@@ -98,48 +204,29 @@ describe('PredictionsSection', () => {
       .requireMock('../../../../UI/Predict/selectors/featureFlags')
       .selectPredictEnabledFlag.mockReturnValue(false);
 
-    const { toJSON } = renderWithProvider(<PredictionsSection />);
+    const { toJSON } = renderWithProvider(
+      <PredictionsSection sectionIndex={0} totalSectionsLoaded={1} />,
+    );
 
     expect(toJSON()).toBeNull();
   });
 
   describe('when user has positions', () => {
-    const mockPositions = [
-      {
-        outcomeId: 'outcome-1',
-        outcomeIndex: 0,
-        marketId: 'market-1',
-        title: 'Test Position 1',
-        outcome: 'Yes',
-        icon: 'https://example.com/icon1.png',
-        initialValue: 10,
-        currentValue: 12,
-        size: 15,
-        percentPnl: 20,
-      },
-      {
-        outcomeId: 'outcome-2',
-        outcomeIndex: 0,
-        marketId: 'market-2',
-        title: 'Test Position 2',
-        outcome: 'No',
-        icon: 'https://example.com/icon2.png',
-        initialValue: 5,
-        currentValue: 3,
-        size: 8,
-        percentPnl: -40,
-      },
-    ];
+    beforeEach(() => {
+      mockUsePredictPositionsForHomepage.mockImplementation(
+        (_maxPositions?: number, claimable = false) => ({
+          positions: claimable ? [] : mockActivePositions,
+          isLoading: false,
+          error: null,
+          refresh: claimable ? mockRefreshClaimable : jest.fn(),
+        }),
+      );
+    });
 
     it('renders positions when user has them', async () => {
-      mockUsePredictPositionsForHomepage.mockReturnValue({
-        positions: mockPositions,
-        isLoading: false,
-        error: null,
-        refresh: jest.fn(),
-      });
-
-      renderWithProvider(<PredictionsSection />);
+      renderWithProvider(
+        <PredictionsSection sectionIndex={0} totalSectionsLoaded={1} />,
+      );
 
       await waitFor(() => {
         expect(screen.getByText('Test Position 1')).toBeOnTheScreen();
@@ -148,16 +235,19 @@ describe('PredictionsSection', () => {
     });
 
     it('shows position skeletons when loading positions', () => {
-      mockUsePredictPositionsForHomepage.mockReturnValue({
-        positions: [],
-        isLoading: true,
-        error: null,
-        refresh: jest.fn(),
-      });
-
-      renderWithProvider(<PredictionsSection />);
+      mockUsePredictPositionsForHomepage.mockImplementation(
+        (_maxPositions?: number, claimable = false) => ({
+          positions: [],
+          isLoading: !claimable, // only active positions loading
+          error: null,
+          refresh: claimable ? mockRefreshClaimable : jest.fn(),
+        }),
+      );
+
+      renderWithProvider(
+        <PredictionsSection sectionIndex={0} totalSectionsLoaded={1} />,
+      );
 
-      // When loading positions, should not show markets
       expect(screen.queryByText('Test Position 1')).not.toBeOnTheScreen();
     });
   });
@@ -186,12 +276,6 @@ describe('PredictionsSection', () => {
     ];
 
     it('renders trending markets when user has no positions', async () => {
-      mockUsePredictPositionsForHomepage.mockReturnValue({
-        positions: [],
-        isLoading: false,
-        error: null,
-        refresh: jest.fn(),
-      });
       mockUsePredictMarketsForHomepage.mockReturnValue({
         markets: mockMarkets,
         isLoading: false,
@@ -199,7 +283,9 @@ describe('PredictionsSection', () => {
         refresh: jest.fn(),
       });
 
-      renderWithProvider(<PredictionsSection />);
+      renderWithProvider(
+        <PredictionsSection sectionIndex={0} totalSectionsLoaded={1} />,
+      );
 
       await waitFor(() => {
         expect(screen.getByText('Will ETH reach $5000?')).toBeOnTheScreen();
@@ -207,12 +293,6 @@ describe('PredictionsSection', () => {
     });
 
     it('shows market skeletons when loading markets', () => {
-      mockUsePredictPositionsForHomepage.mockReturnValue({
-        positions: [],
-        isLoading: false,
-        error: null,
-        refresh: jest.fn(),
-      });
       mockUsePredictMarketsForHomepage.mockReturnValue({
         markets: [],
         isLoading: true,
@@ -220,19 +300,15 @@ describe('PredictionsSection', () => {
         refresh: jest.fn(),
       });
 
-      renderWithProvider(<PredictionsSection />);
+      renderWithProvider(
+        <PredictionsSection sectionIndex={0} totalSectionsLoaded={1} />,
+      );
 
       // Should still show the title
       expect(screen.getByText('Predictions')).toBeOnTheScreen();
     });
 
     it('returns null when markets are empty and not loading', () => {
-      mockUsePredictPositionsForHomepage.mockReturnValue({
-        positions: [],
-        isLoading: false,
-        error: null,
-        refresh: jest.fn(),
-      });
       mockUsePredictMarketsForHomepage.mockReturnValue({
         markets: [],
         isLoading: false,
@@ -240,7 +316,9 @@ describe('PredictionsSection', () => {
         refresh: jest.fn(),
       });
 
-      const { toJSON } = renderWithProvider(<PredictionsSection />);
+      const { toJSON } = renderWithProvider(
+        <PredictionsSection sectionIndex={0} totalSectionsLoaded={1} />,
+      );
 
       expect(toJSON()).toBeNull();
     });
@@ -248,12 +326,6 @@ describe('PredictionsSection', () => {
 
   describe('error state', () => {
     it('renders error state when markets fail to load', () => {
-      mockUsePredictPositionsForHomepage.mockReturnValue({
-        positions: [],
-        isLoading: false,
-        error: null,
-        refresh: jest.fn(),
-      });
       mockUsePredictMarketsForHomepage.mockReturnValue({
         markets: [],
         isLoading: false,
@@ -261,19 +333,15 @@ describe('PredictionsSection', () => {
         refresh: jest.fn(),
       });
 
-      renderWithProvider(<PredictionsSection />);
+      renderWithProvider(
+        <PredictionsSection sectionIndex={0} totalSectionsLoaded={1} />,
+      );
 
       expect(screen.getByText('Unable to load predictions')).toBeOnTheScreen();
       expect(screen.getByText('Retry')).toBeOnTheScreen();
     });
 
     it('does not render error state while still loading', () => {
-      mockUsePredictPositionsForHomepage.mockReturnValue({
-        positions: [],
-        isLoading: false,
-        error: null,
-        refresh: jest.fn(),
-      });
       mockUsePredictMarketsForHomepage.mockReturnValue({
         markets: [],
         isLoading: true,
@@ -281,7 +349,9 @@ describe('PredictionsSection', () => {
         refresh: jest.fn(),
       });
 
-      renderWithProvider(<PredictionsSection />);
+      renderWithProvider(
+        <PredictionsSection sectionIndex={0} totalSectionsLoaded={1} />,
+      );
 
       expect(
         screen.queryByText('Unable to load predictions'),
@@ -289,17 +359,123 @@ describe('PredictionsSection', () => {
     });
   });
 
-  describe('refresh functionality', () => {
-    it('refreshes only markets when user has no positions', async () => {
-      const mockRefreshPositions = jest.fn();
-      const mockRefreshMarkets = jest.fn();
+  describe('claim button', () => {
+    beforeEach(() => {
+      // Show positions so the positions branch renders
+      mockUsePredictPositionsForHomepage.mockImplementation(
+        (_maxPositions?: number, claimable = false) => ({
+          positions: claimable ? [] : mockActivePositions,
+          isLoading: false,
+          error: null,
+          refresh: claimable ? mockRefreshClaimable : jest.fn(),
+        }),
+      );
+    });
 
-      mockUsePredictPositionsForHomepage.mockReturnValue({
-        positions: [],
-        isLoading: false,
-        error: null,
-        refresh: mockRefreshPositions,
+    it('does not show claim button when there are no claimable positions', () => {
+      renderWithProvider(
+        <PredictionsSection sectionIndex={0} totalSectionsLoaded={1} />,
+      );
+
+      expect(screen.queryByText(/Claim \$/)).not.toBeOnTheScreen();
+    });
+
+    it('shows claim button with total amount when claimable positions exist', async () => {
+      // totalClaimable = 75 + 125 = 200
+      mockUsePredictPositionsForHomepage.mockImplementation(
+        (_maxPositions?: number, claimable = false) => ({
+          positions: claimable ? mockClaimablePositions : mockActivePositions,
+          isLoading: false,
+          error: null,
+          refresh: claimable ? mockRefreshClaimable : jest.fn(),
+        }),
+      );
+
+      renderWithProvider(
+        <PredictionsSection sectionIndex={0} totalSectionsLoaded={1} />,
+      );
+
+      await waitFor(() => {
+        expect(screen.getByText('Claim $200.00')).toBeOnTheScreen();
       });
+    });
+
+    it('does not show claim button while claimable positions are loading', () => {
+      mockUsePredictPositionsForHomepage.mockImplementation(
+        (_maxPositions?: number, claimable = false) => ({
+          positions: [],
+          isLoading: claimable, // claimable fetch still loading
+          error: null,
+          refresh: claimable ? mockRefreshClaimable : jest.fn(),
+        }),
+      );
+
+      renderWithProvider(
+        <PredictionsSection sectionIndex={0} totalSectionsLoaded={1} />,
+      );
+
+      expect(screen.queryByText(/Claim \$/)).not.toBeOnTheScreen();
+    });
+
+    it('does not show claim button while active positions are loading', () => {
+      mockUsePredictPositionsForHomepage.mockImplementation(
+        (_maxPositions?: number, claimable = false) => ({
+          positions: [],
+          isLoading: !claimable, // active fetch still loading
+          error: null,
+          refresh: claimable ? mockRefreshClaimable : jest.fn(),
+        }),
+      );
+
+      renderWithProvider(
+        <PredictionsSection sectionIndex={0} totalSectionsLoaded={1} />,
+      );
+
+      expect(screen.queryByText(/Claim \$/)).not.toBeOnTheScreen();
+    });
+
+    it('calls claim and then refreshes claimable positions on press', async () => {
+      mockUsePredictPositionsForHomepage.mockImplementation(
+        (_maxPositions?: number, claimable = false) => ({
+          positions: claimable ? mockClaimablePositions : mockActivePositions,
+          isLoading: false,
+          error: null,
+          refresh: claimable ? mockRefreshClaimable : jest.fn(),
+        }),
+      );
+
+      renderWithProvider(
+        <PredictionsSection sectionIndex={0} totalSectionsLoaded={1} />,
+      );
+
+      await waitFor(() => {
+        expect(screen.getByText('Claim $200.00')).toBeOnTheScreen();
+      });
+
+      fireEvent.press(screen.getByText('Claim $200.00'));
+
+      await waitFor(() => {
+        expect(mockClaim).toHaveBeenCalledTimes(1);
+        expect(mockRefreshClaimable).toHaveBeenCalledTimes(1);
+      });
+    });
+  });
+
+  describe('refresh functionality', () => {
+    it('refreshes markets and claimable when user has no positions', async () => {
+      const mockRefreshActivePositions = jest.fn().mockResolvedValue(undefined);
+      const mockRefreshMarkets = jest.fn().mockResolvedValue(undefined);
+
+      mockUsePredictPositionsForHomepage.mockImplementation(
+        (_maxPositions?: number, claimable = false) => ({
+          positions: [],
+          isLoading: false,
+          error: null,
+          refresh: claimable
+            ? mockRefreshClaimable
+            : mockRefreshActivePositions,
+        }),
+      );
       mockUsePredictMarketsForHomepage.mockReturnValue({
         markets: [],
         isLoading: false,
@@ -308,37 +484,35 @@ describe('PredictionsSection', () => {
       });
 
       const ref = React.createRef<{ refresh: () => Promise<void> }>();
-      renderWithProvider(<PredictionsSection ref={ref} />);
+      renderWithProvider(
+        <PredictionsSection
+          sectionIndex={0}
+          totalSectionsLoaded={1}
+          ref={ref}
+        />,
+      );
 
       await ref.current?.refresh();
 
-      expect(mockRefreshPositions).not.toHaveBeenCalled();
+      expect(mockRefreshActivePositions).not.toHaveBeenCalled();
       expect(mockRefreshMarkets).toHaveBeenCalled();
+      expect(mockRefreshClaimable).toHaveBeenCalled();
     });
 
-    it('refreshes both positions and markets when user has positions', async () => {
-      const mockRefreshPositions = jest.fn();
-      const mockRefreshMarkets = jest.fn();
-
-      mockUsePredictPositionsForHomepage.mockReturnValue({
-        positions: [
-          {
-            outcomeId: 'outcome-1',
-            outcomeIndex: 0,
-            marketId: 'market-1',
-            title: 'Test Position',
-            outcome: 'Yes',
-            icon: 'https://example.com/icon.png',
-            initialValue: 10,
-            currentValue: 12,
-            size: 15,
-            percentPnl: 20,
-          },
-        ],
-        isLoading: false,
-        error: null,
-        refresh: mockRefreshPositions,
-      });
+    it('refreshes positions, markets, and claimable when user has positions', async () => {
+      const mockRefreshActivePositions = jest.fn().mockResolvedValue(undefined);
+      const mockRefreshMarkets = jest.fn().mockResolvedValue(undefined);
+
+      mockUsePredictPositionsForHomepage.mockImplementation(
+        (_maxPositions?: number, claimable = false) => ({
+          positions: claimable ? [] : mockActivePositions,
+          isLoading: false,
+          error: null,
+          refresh: claimable
+            ? mockRefreshClaimable
+            : mockRefreshActivePositions,
+        }),
+      );
       mockUsePredictMarketsForHomepage.mockReturnValue({
         markets: [],
         isLoading: false,
@@ -347,12 +521,19 @@ describe('PredictionsSection', () => {
       });
 
       const ref = React.createRef<{ refresh: () => Promise<void> }>();
-      renderWithProvider(<PredictionsSection ref={ref} />);
+      renderWithProvider(
+        <PredictionsSection
+          sectionIndex={0}
+          totalSectionsLoaded={1}
+          ref={ref}
+        />,
+      );
 
       await ref.current?.refresh();
 
-      expect(mockRefreshPositions).toHaveBeenCalled();
+      expect(mockRefreshActivePositions).toHaveBeenCalled();
       expect(mockRefreshMarkets).toHaveBeenCalled();
+      expect(mockRefreshClaimable).toHaveBeenCalled();
     });
   });
 });
diff --git a/app/components/Views/Homepage/Sections/Predictions/PredictionsSection.tsx b/app/components/Views/Homepage/Sections/Predictions/PredictionsSection.tsx
index 4cec43ed0510..ae8ae3b378b8 100644
--- a/app/components/Views/Homepage/Sections/Predictions/PredictionsSection.tsx
+++ b/app/components/Views/Homepage/Sections/Predictions/PredictionsSection.tsx
@@ -3,23 +3,15 @@ import React, {
   useCallback,
   useImperativeHandle,
   useRef,
-  useState,
 } from 'react';
-import {
-  ScrollView,
-  NativeSyntheticEvent,
-  NativeScrollEvent,
-  View,
-  StyleSheet,
-} from 'react-native';
-import LinearGradient from 'react-native-linear-gradient';
+import { ScrollView, View } from 'react-native';
 import { useNavigation, NavigationProp } from '@react-navigation/native';
 import { useSelector } from 'react-redux';
 import { useTailwind } from '@metamask/design-system-twrnc-preset';
-import { Box } from '@metamask/design-system-react-native';
-import { useTheme } from '../../../../../util/theme';
+import { Box, TextVariant } from '@metamask/design-system-react-native';
 import SectionTitle from '../../components/SectionTitle';
 import ErrorState from '../../components/ErrorState';
+import FadingScrollContainer from '../../components/FadingScrollContainer';
 import Routes from '../../../../../constants/navigation/Routes';
 import { SectionRefreshHandle } from '../../types';
 import { selectPredictEnabledFlag } from '../../../../UI/Predict/selectors/featureFlags';
@@ -33,25 +25,29 @@ import {
   PredictMarketCardSkeleton,
   PredictPositionRow,
   PredictPositionRowSkeleton,
-  ViewMoreCard,
 } from './components';
-import { colorWithOpacity } from '../../../../../util/colors';
+import ViewMoreCard from '../../components/ViewMoreCard';
 import type { PredictPosition } from '../../../../UI/Predict/types';
 import type { PredictNavigationParamList } from '../../../../UI/Predict/types/navigation';
 import { PredictEventValues } from '../../../../UI/Predict/constants/eventNames';
+import { PredictClaimButton } from '../../../../UI/Predict/components/PredictActionButtons';
+import { usePredictClaim } from '../../../../UI/Predict/hooks/usePredictClaim';
+import useHomeViewedEvent, {
+  HomeSectionNames,
+} from '../../hooks/useHomeViewedEvent';
 
 const MAX_MARKETS_DISPLAYED = 5;
 
 // Card dimensions for snap offsets
-const CARD_WIDTH = 280;
+const CARD_WIDTH = 240;
 const GAP = 12;
 const PADDING = 16; // px-4
 
 // Calculate snap offsets: first card at 0, then padding + card + (gap + card) * n
-// +1 for the ViewMoreCard at the end
-const SNAP_OFFSETS = Array.from(
-  { length: MAX_MARKETS_DISPLAYED + 1 },
-  (_, i) => (i === 0 ? 0 : PADDING + CARD_WIDTH + (GAP + CARD_WIDTH) * (i - 1)),
+// ViewMoreCard is excluded — its snap position would exceed max scroll on typical screens,
+// causing the scroll view to snap back and never reach it.
+const SNAP_OFFSETS = Array.from({ length: MAX_MARKETS_DISPLAYED }, (_, i) =>
+  i === 0 ? 0 : PADDING + CARD_WIDTH + (GAP + CARD_WIDTH) * (i - 1),
 );
 
 // Skeleton keys for loading state
@@ -60,22 +56,10 @@ const SKELETON_KEYS = Array.from(
   (__, i) => `skeleton-${i}`,
 );
 
-// Fade overlay width
-const FADE_WIDTH = 40;
-
-const styles = StyleSheet.create({
-  scrollContainer: {
-    position: 'relative',
-  },
-  fadeOverlay: {
-    position: 'absolute',
-    right: 0,
-    top: 0,
-    bottom: 0,
-    width: FADE_WIDTH,
-    pointerEvents: 'none',
-  },
-});
+interface PredictionsSectionProps {
+  sectionIndex: number;
+  totalSectionsLoaded: number;
+}
 
 /**
  * PredictionsSection - Displays prediction content on the homepage
@@ -86,16 +70,17 @@ const styles = StyleSheet.create({
  *
  * Returns null if the Predict feature flag is disabled.
  */
-const PredictionsSection = forwardRef<SectionRefreshHandle>((_, ref) => {
+const PredictionsSection = forwardRef<
+  SectionRefreshHandle,
+  PredictionsSectionProps
+>(({ sectionIndex, totalSectionsLoaded }, ref) => {
+  const sectionViewRef = useRef<View>(null);
   const tw = useTailwind();
-  const { colors } = useTheme();
   const navigation =
     useNavigation<NavigationProp<PredictNavigationParamList>>();
   const isPredictEnabled = useSelector(selectPredictEnabledFlag);
   const title = strings('homepage.sections.predictions');
-
-  // Track scroll position for fade effect
-  const [fadeOpacity, setFadeOpacity] = useState(1);
+  const { claim } = usePredictClaim();
 
   // Fetch both positions and markets
   const {
@@ -112,6 +97,22 @@ const PredictionsSection = forwardRef<SectionRefreshHandle>((_, ref) => {
     refresh: refreshMarkets,
   } = usePredictMarketsForHomepage(MAX_MARKETS_DISPLAYED);
 
+  const {
+    positions: claimablePositions,
+    isLoading: isLoadingClaimable,
+    refresh: refreshClaimable,
+  } = usePredictPositionsForHomepage(undefined, true);
+
+  const handleClaim = useCallback(async () => {
+    await claim();
+    await refreshClaimable();
+  }, [claim, refreshClaimable]);
+
+  const totalClaimable = claimablePositions.reduce(
+    (sum, p) => sum + (p.currentValue ?? 0),
+    0,
+  );
+
   // Determine if user has positions
   const hasPositions = positions.length > 0;
 
@@ -119,14 +120,50 @@ const PredictionsSection = forwardRef<SectionRefreshHandle>((_, ref) => {
   const hasPositionsRef = useRef(hasPositions);
   hasPositionsRef.current = hasPositions;
 
-  // Refresh: only refresh positions if user has them, always refresh markets
+  const isLoading = isLoadingPositions || isLoadingMarkets;
+
+  const hasError =
+    !isLoadingPositions &&
+    !isLoadingMarkets &&
+    !hasPositions &&
+    markets.length === 0 &&
+    (positionsError || marketsError);
+
+  const isEmpty =
+    !isLoading && !hasPositions && markets.length === 0 && !hasError;
+
+  const itemCount = hasPositions ? positions.length : markets.length;
+
+  // Determine whether the section will actually render visible content.
+  // Pass null when the section returns null so the event fires immediately.
+  // !isLoading is required: isEmpty is false during loading (its formula starts
+  // with !isLoading), so without this guard the hook would fire with stale
+  // itemCount/isEmpty values before data arrives.
+  const willRender = isPredictEnabled && !isLoading && !isEmpty;
+
+  useHomeViewedEvent({
+    sectionRef: willRender ? sectionViewRef : null,
+    isLoading,
+    sectionName: HomeSectionNames.PREDICT,
+    sectionIndex,
+    totalSectionsLoaded,
+    // Treat error state as empty — there is no useful content to show.
+    isEmpty: isEmpty || !!hasError,
+    itemCount,
+  });
+
+  // Refresh: only refresh positions if user has them, always refresh markets + claimable
   const refresh = useCallback(async () => {
     if (hasPositionsRef.current) {
-      await Promise.all([refreshPositions(), refreshMarkets()]);
+      await Promise.all([
+        refreshPositions(),
+        refreshMarkets(),
+        refreshClaimable(),
+      ]);
     } else {
-      await refreshMarkets();
+      await Promise.all([refreshMarkets(), refreshClaimable()]);
     }
-  }, [refreshPositions, refreshMarkets]);
+  }, [refreshPositions, refreshMarkets, refreshClaimable]);
 
   useImperativeHandle(ref, () => ({ refresh }), [refresh]);
 
@@ -136,32 +173,6 @@ const PredictionsSection = forwardRef<SectionRefreshHandle>((_, ref) => {
     });
   }, [navigation]);
 
-  // Handle scroll to update fade opacity
-  const handleScroll = useCallback(
-    (event: NativeSyntheticEvent<NativeScrollEvent>) => {
-      const { contentOffset, contentSize, layoutMeasurement } =
-        event.nativeEvent;
-      const scrollableWidth = contentSize.width - layoutMeasurement.width;
-
-      // No scrollable content — hide fade
-      if (scrollableWidth <= 0) {
-        setFadeOpacity(0);
-        return;
-      }
-
-      const distanceFromEnd = scrollableWidth - contentOffset.x;
-
-      // Fade out the overlay as we approach the end (within 100px)
-      const fadeThreshold = 100;
-      const newOpacity = Math.min(
-        1,
-        Math.max(0, distanceFromEnd / fadeThreshold),
-      );
-      setFadeOpacity(newOpacity);
-    },
-    [],
-  );
-
   const handlePositionPress = useCallback(
     (position: PredictPosition) => {
       navigation.navigate(Routes.PREDICT.ROOT, {
@@ -181,50 +192,56 @@ const PredictionsSection = forwardRef<SectionRefreshHandle>((_, ref) => {
     return null;
   }
 
-  // Show error state when both hooks fail and nothing is loading
-  const hasError =
-    !isLoadingPositions &&
-    !isLoadingMarkets &&
-    !hasPositions &&
-    markets.length === 0 &&
-    (positionsError || marketsError);
-
   if (hasError) {
     return (
-      <Box gap={3}>
-        <SectionTitle title={title} onPress={handleViewAllPredictions} />
-        <ErrorState
-          title={strings('homepage.error.unable_to_load', {
-            section: title.toLowerCase(),
-          })}
-          onRetry={refresh}
-        />
-      </Box>
+      <View ref={sectionViewRef}>
+        <Box gap={3}>
+          <SectionTitle title={title} onPress={handleViewAllPredictions} />
+          <ErrorState
+            title={strings('homepage.error.unable_to_load', {
+              section: title.toLowerCase(),
+            })}
+            onRetry={refresh}
+          />
+        </Box>
+      </View>
     );
   }
 
   // Render positions if user has any
   if (hasPositions || isLoadingPositions) {
     return (
-      <Box gap={3}>
-        <SectionTitle title={title} onPress={handleViewAllPredictions} />
-        <Box>
-          {isLoadingPositions ? (
-            <>
-              <PredictPositionRowSkeleton />
-              <PredictPositionRowSkeleton />
-            </>
-          ) : (
-            positions.map((position) => (
-              <PredictPositionRow
-                key={`${position.outcomeId}:${position.outcomeIndex}`}
-                position={position}
-                onPress={handlePositionPress}
-              />
-            ))
-          )}
+      <View ref={sectionViewRef}>
+        <Box gap={3}>
+          <SectionTitle title={title} onPress={handleViewAllPredictions} />
+          <Box>
+            {isLoadingPositions ? (
+              <>
+                <PredictPositionRowSkeleton />
+                <PredictPositionRowSkeleton />
+              </>
+            ) : (
+              positions.map((position) => (
+                <PredictPositionRow
+                  key={`${position.outcomeId}:${position.outcomeIndex}`}
+                  position={position}
+                  onPress={handlePositionPress}
+                />
+              ))
+            )}
+            {!isLoadingPositions &&
+              !isLoadingClaimable &&
+              totalClaimable > 0 && (
+                <Box paddingHorizontal={4} paddingTop={1} paddingBottom={3}>
+                  <PredictClaimButton
+                    amount={totalClaimable}
+                    onPress={handleClaim}
+                  />
+                </Box>
+              )}
+          </Box>
         </Box>
-      </Box>
+      </View>
     );
   }
 
@@ -235,43 +252,40 @@ const PredictionsSection = forwardRef<SectionRefreshHandle>((_, ref) => {
 
   // Render trending markets if no positions
   return (
-    <Box gap={3}>
-      <SectionTitle title={title} onPress={handleViewAllPredictions} />
-      <View style={styles.scrollContainer}>
-        <ScrollView
-          horizontal
-          showsHorizontalScrollIndicator={false}
-          contentContainerStyle={tw.style('px-4 gap-3')}
-          snapToOffsets={SNAP_OFFSETS}
-          decelerationRate="fast"
-          onScroll={handleScroll}
-          scrollEventThrottle={16}
-        >
-          {isLoadingMarkets ? (
-            SKELETON_KEYS.map((key) => <PredictMarketCardSkeleton key={key} />)
-          ) : (
-            <>
-              {markets.map((market) => (
-                <PredictMarketCard key={market.id} market={market} />
-              ))}
-              <ViewMoreCard onPress={handleViewAllPredictions} />
-            </>
+    <View ref={sectionViewRef}>
+      <Box gap={3}>
+        <SectionTitle title={title} onPress={handleViewAllPredictions} />
+        <FadingScrollContainer>
+          {(scrollProps) => (
+            <ScrollView
+              horizontal
+              showsHorizontalScrollIndicator={false}
+              contentContainerStyle={tw.style('px-4 gap-3')}
+              snapToOffsets={SNAP_OFFSETS}
+              decelerationRate="fast"
+              {...scrollProps}
+            >
+              {isLoadingMarkets ? (
+                SKELETON_KEYS.map((key) => (
+                  <PredictMarketCardSkeleton key={key} />
+                ))
+              ) : (
+                <>
+                  {markets.map((market) => (
+                    <PredictMarketCard key={market.id} market={market} />
+                  ))}
+                  <ViewMoreCard
+                    onPress={handleViewAllPredictions}
+                    twClassName="w-[180px] h-[180px]"
+                    textVariant={TextVariant.BodyLg}
+                  />
+                </>
+              )}
+            </ScrollView>
           )}
-        </ScrollView>
-        {/* Fade overlay on the right edge */}
-        {fadeOpacity > 0 && (
-          <LinearGradient
-            colors={[
-              colorWithOpacity(colors.background.default, 0),
-              colors.background.default,
-            ]}
-            start={{ x: 0, y: 0 }}
-            end={{ x: 1, y: 0 }}
-            style={[styles.fadeOverlay, { opacity: fadeOpacity }]}
-          />
-        )}
-      </View>
-    </Box>
+        </FadingScrollContainer>
+      </Box>
+    </View>
   );
 });
 
diff --git a/app/components/Views/Homepage/Sections/Predictions/components/PredictMarketCard.tsx b/app/components/Views/Homepage/Sections/Predictions/components/PredictMarketCard.tsx
index d67eecf84253..8b36a707ab62 100644
--- a/app/components/Views/Homepage/Sections/Predictions/components/PredictMarketCard.tsx
+++ b/app/components/Views/Homepage/Sections/Predictions/components/PredictMarketCard.tsx
@@ -6,16 +6,13 @@ import {
   Text,
   BoxFlexDirection,
   BoxAlignItems,
+  BoxJustifyContent,
   TextVariant,
   TextColor,
   FontWeight,
 } from '@metamask/design-system-react-native';
 import { useNavigation, NavigationProp } from '@react-navigation/native';
 import Routes from '../../../../../../constants/navigation/Routes';
-import Button, {
-  ButtonVariants,
-  ButtonSize,
-} from '../../../../../../component-library/components/Buttons/Button';
 import type {
   PredictMarket,
   PredictOutcome,
@@ -29,34 +26,19 @@ interface PredictMarketCardProps {
 const MAX_OUTCOMES_DISPLAYED = 2;
 
 /**
- * Format price as cents (e.g., 0.55 -> "55¢")
+ * Format price as percentage (e.g., 0.55 -> "55%")
  */
 const formatPrice = (price: number): string => {
-  const cents = Math.round(price * 100);
-  return `${cents}¢`;
+  const pct = Math.round(price * 100);
+  return `${pct}%`;
 };
 
 /**
- * Format end date to short format (e.g., "Jan 8")
- */
-const formatDate = (dateString?: string): string | null => {
-  if (!dateString) return null;
-  try {
-    const date = new Date(dateString);
-    if (isNaN(date.getTime())) return null;
-    return date.toLocaleDateString('en-US', { month: 'short', day: 'numeric' });
-  } catch {
-    return null;
-  }
-};
-
-/**
- * OutcomeRow - Single outcome row with image, name, and price button
+ * OutcomeRow - Single outcome row with image, name, and percentage
  */
 const OutcomeRow: React.FC<{
   outcome: PredictOutcome;
-  onPress: () => void;
-}> = ({ outcome, onPress }) => {
+}> = ({ outcome }) => {
   const tw = useTailwind();
   const yesToken = outcome.tokens?.[0];
   const price = yesToken?.price ?? 0;
@@ -68,11 +50,11 @@ const OutcomeRow: React.FC<{
       gap={3}
     >
       {/* Outcome image */}
-      <Box twClassName="w-8 h-8 rounded-lg overflow-hidden bg-background-alternative">
+      <Box twClassName="w-6 h-6 rounded-lg overflow-hidden bg-background-alternative">
         {outcome.image ? (
           <Image
             source={{ uri: outcome.image }}
-            style={tw.style('w-8 h-8')}
+            style={tw.style('w-6 h-6')}
             resizeMode="cover"
           />
         ) : null}
@@ -82,7 +64,6 @@ const OutcomeRow: React.FC<{
       <Box twClassName="flex-1">
         <Text
           variant={TextVariant.BodyMd}
-          fontWeight={FontWeight.Medium}
           color={TextColor.TextDefault}
           numberOfLines={1}
         >
@@ -90,20 +71,17 @@ const OutcomeRow: React.FC<{
         </Text>
       </Box>
 
-      {/* Price button */}
-      <Button
-        variant={ButtonVariants.Secondary}
-        size={ButtonSize.Sm}
-        label={formatPrice(price)}
-        onPress={onPress}
-      />
+      {/* Percentage */}
+      <Text variant={TextVariant.BodyMd} color={TextColor.TextAlternative}>
+        {formatPrice(price)}
+      </Text>
     </Box>
   );
 };
 
 /**
  * Compact prediction market card for homepage carousel.
- * Shows title, date, and top 2 outcomes with prices.
+ * Shows title and top 2 outcomes with prices.
  */
 const PredictMarketCard: React.FC<PredictMarketCardProps> = ({ market }) => {
   const navigation =
@@ -116,11 +94,6 @@ const PredictMarketCard: React.FC<PredictMarketCardProps> = ({ market }) => {
     });
   }, [navigation, market.id]);
 
-  const formattedDate = useMemo(
-    () => formatDate(market.endDate),
-    [market.endDate],
-  );
-
   // Get top outcomes to display
   const displayOutcomes = useMemo(() => {
     if (!market.outcomes?.length) {
@@ -150,38 +123,25 @@ const PredictMarketCard: React.FC<PredictMarketCardProps> = ({ market }) => {
   return (
     <TouchableOpacity onPress={handlePress}>
       <Box
-        twClassName="w-[280px] rounded-2xl bg-background-muted"
+        twClassName="w-[240px] rounded-2xl bg-background-muted flex-1"
         padding={4}
-        gap={3}
+        gap={6}
+        justifyContent={BoxJustifyContent.Between}
       >
-        {/* Header: Title + Date */}
-        <Box gap={1}>
-          <Text
-            variant={TextVariant.BodyMd}
-            fontWeight={FontWeight.Medium}
-            color={TextColor.TextDefault}
-            numberOfLines={2}
-          >
-            {market.title}
-          </Text>
-          {formattedDate && (
-            <Text
-              variant={TextVariant.BodyMd}
-              color={TextColor.TextAlternative}
-            >
-              {formattedDate}
-            </Text>
-          )}
-        </Box>
+        {/* Header: Title */}
+        <Text
+          variant={TextVariant.BodyMd}
+          fontWeight={FontWeight.Medium}
+          color={TextColor.TextDefault}
+          numberOfLines={2}
+        >
+          {market.title}
+        </Text>
 
         {/* Outcomes */}
         <Box gap={2}>
           {displayOutcomes.map((outcome) => (
-            <OutcomeRow
-              key={outcome.id}
-              outcome={outcome}
-              onPress={handlePress}
-            />
+            <OutcomeRow key={outcome.id} outcome={outcome} />
           ))}
         </Box>
       </Box>
diff --git a/app/components/Views/Homepage/Sections/Predictions/components/PredictMarketCardSkeleton.tsx b/app/components/Views/Homepage/Sections/Predictions/components/PredictMarketCardSkeleton.tsx
index 369bd8c17c84..92d776f3d5ce 100644
--- a/app/components/Views/Homepage/Sections/Predictions/components/PredictMarketCardSkeleton.tsx
+++ b/app/components/Views/Homepage/Sections/Predictions/components/PredictMarketCardSkeleton.tsx
@@ -13,36 +13,33 @@ const PredictMarketCardSkeleton: React.FC = () => {
   const { colors } = useTheme();
 
   return (
-    <View style={tw.style('w-[280px] rounded-2xl bg-background-muted p-4')}>
+    <View style={tw.style('w-[240px] rounded-2xl bg-background-muted p-4')}>
       <SkeletonPlaceholder
         backgroundColor={colors.background.section}
         highlightColor={colors.background.subsection}
       >
-        <View style={tw.style('gap-3')}>
-          {/* Header skeleton */}
-          <View style={tw.style('gap-1')}>
-            <View style={tw.style('w-[80%] h-5 rounded')} />
-            <View style={tw.style('w-[40%] h-4 rounded')} />
-          </View>
+        <View style={tw.style('gap-6')}>
+          {/* Title skeleton */}
+          <View style={tw.style('w-[80%] h-5 rounded')} />
 
           {/* Outcome rows skeleton */}
           <View style={tw.style('gap-2')}>
             {/* Outcome 1 */}
             <View style={tw.style('flex-row items-center gap-3')}>
-              <View style={tw.style('w-8 h-8 rounded-lg')} />
+              <View style={tw.style('w-6 h-6 rounded-lg')} />
               <View style={tw.style('flex-1')}>
                 <View style={tw.style('w-[60%] h-4 rounded')} />
               </View>
-              <View style={tw.style('w-12 h-8 rounded-lg')} />
+              <View style={tw.style('w-8 h-4 rounded')} />
             </View>
 
             {/* Outcome 2 */}
             <View style={tw.style('flex-row items-center gap-3')}>
-              <View style={tw.style('w-8 h-8 rounded-lg')} />
+              <View style={tw.style('w-6 h-6 rounded-lg')} />
               <View style={tw.style('flex-1')}>
                 <View style={tw.style('w-[50%] h-4 rounded')} />
               </View>
-              <View style={tw.style('w-12 h-8 rounded-lg')} />
+              <View style={tw.style('w-8 h-4 rounded')} />
             </View>
           </View>
         </View>
diff --git a/app/components/Views/Homepage/Sections/Predictions/components/ViewMoreCard.tsx b/app/components/Views/Homepage/Sections/Predictions/components/ViewMoreCard.tsx
deleted file mode 100644
index 7eebe341c06b..000000000000
--- a/app/components/Views/Homepage/Sections/Predictions/components/ViewMoreCard.tsx
+++ /dev/null
@@ -1,41 +0,0 @@
-import React from 'react';
-import { TouchableOpacity } from 'react-native';
-import {
-  Box,
-  Text,
-  BoxAlignItems,
-  BoxJustifyContent,
-  TextVariant,
-  TextColor,
-  FontWeight,
-} from '@metamask/design-system-react-native';
-import { strings } from '../../../../../../../locales/i18n';
-
-interface ViewMoreCardProps {
-  onPress: () => void;
-}
-
-/**
- * "More predictions" card shown at the end of the trending markets carousel.
- * Matches the height and width of PredictMarketCard for visual consistency.
- */
-const ViewMoreCard: React.FC<ViewMoreCardProps> = ({ onPress }) => (
-  <TouchableOpacity onPress={onPress}>
-    <Box
-      twClassName="w-[280px] h-[160px] rounded-2xl bg-background-muted"
-      padding={4}
-      alignItems={BoxAlignItems.Center}
-      justifyContent={BoxJustifyContent.Center}
-    >
-      <Text
-        variant={TextVariant.BodyLg}
-        fontWeight={FontWeight.Medium}
-        color={TextColor.TextDefault}
-      >
-        {strings('homepage.sections.more_predictions')}
-      </Text>
-    </Box>
-  </TouchableOpacity>
-);
-
-export default ViewMoreCard;
diff --git a/app/components/Views/Homepage/Sections/Predictions/components/index.ts b/app/components/Views/Homepage/Sections/Predictions/components/index.ts
index e0dc59f7ca3b..3d05f0b1b0ee 100644
--- a/app/components/Views/Homepage/Sections/Predictions/components/index.ts
+++ b/app/components/Views/Homepage/Sections/Predictions/components/index.ts
@@ -4,4 +4,3 @@ export {
   PredictPositionRow,
   PredictPositionRowSkeleton,
 } from './PredictPositionRow';
-export { default as ViewMoreCard } from './ViewMoreCard';
diff --git a/app/components/Views/Homepage/Sections/Predictions/hooks/usePredictPositionsForHomepage.test.ts b/app/components/Views/Homepage/Sections/Predictions/hooks/usePredictPositionsForHomepage.test.ts
index 4f061951c505..321a59c92c8a 100644
--- a/app/components/Views/Homepage/Sections/Predictions/hooks/usePredictPositionsForHomepage.test.ts
+++ b/app/components/Views/Homepage/Sections/Predictions/hooks/usePredictPositionsForHomepage.test.ts
@@ -201,4 +201,84 @@ describe('usePredictPositionsForHomepage', () => {
 
     expect(mockGetPositions).toHaveBeenCalledTimes(2);
   });
+
+  describe('claimable parameter', () => {
+    it('passes claimable: false to getPositions by default', async () => {
+      const { waitForNextUpdate } = renderHook(() =>
+        usePredictPositionsForHomepage(5),
+      );
+
+      await waitForNextUpdate();
+
+      expect(mockGetPositions).toHaveBeenCalledWith({
+        address: '0xuser123',
+        claimable: false,
+      });
+    });
+
+    it('passes claimable: true to getPositions when specified', async () => {
+      const { waitForNextUpdate } = renderHook(() =>
+        usePredictPositionsForHomepage(undefined, true),
+      );
+
+      await waitForNextUpdate();
+
+      expect(mockGetPositions).toHaveBeenCalledWith({
+        address: '0xuser123',
+        claimable: true,
+      });
+    });
+
+    it('uses separate cache keys for claimable and non-claimable fetches', async () => {
+      // Fetch non-claimable
+      const { waitForNextUpdate: wait1, unmount: unmount1 } = renderHook(() =>
+        usePredictPositionsForHomepage(5, false),
+      );
+      await wait1();
+      unmount1();
+
+      expect(mockGetPositions).toHaveBeenCalledTimes(1);
+
+      // Fetch claimable — must hit the API again (different cache key)
+      const { waitForNextUpdate: wait2 } = renderHook(() =>
+        usePredictPositionsForHomepage(5, true),
+      );
+      await wait2();
+
+      expect(mockGetPositions).toHaveBeenCalledTimes(2);
+    });
+
+    it('serves claimable positions from cache independently of non-claimable', async () => {
+      const claimablePositions = [createMockPosition('c1')];
+      const nonClaimablePositions = [
+        createMockPosition('1'),
+        createMockPosition('2'),
+      ];
+
+      mockGetPositions
+        .mockResolvedValueOnce(nonClaimablePositions)
+        .mockResolvedValueOnce(claimablePositions);
+
+      // Populate both caches
+      const {
+        result: r1,
+        waitForNextUpdate: w1,
+        unmount: u1,
+      } = renderHook(() => usePredictPositionsForHomepage(undefined, false));
+      await w1();
+      u1();
+
+      const {
+        result: r2,
+        waitForNextUpdate: w2,
+        unmount: u2,
+      } = renderHook(() => usePredictPositionsForHomepage(undefined, true));
+      await w2();
+      u2();
+
+      // Each set has its own cached value
+      expect(r1.current.positions).toHaveLength(2);
+      expect(r2.current.positions).toHaveLength(1);
+    });
+  });
 });
diff --git a/app/components/Views/Homepage/Sections/Predictions/hooks/usePredictPositionsForHomepage.ts b/app/components/Views/Homepage/Sections/Predictions/hooks/usePredictPositionsForHomepage.ts
index 029c4d3e9c31..f2e07327c1a6 100644
--- a/app/components/Views/Homepage/Sections/Predictions/hooks/usePredictPositionsForHomepage.ts
+++ b/app/components/Views/Homepage/Sections/Predictions/hooks/usePredictPositionsForHomepage.ts
@@ -44,13 +44,14 @@ export const _clearPositionsCache = (): void => {
  * Lightweight hook for fetching user prediction positions for the homepage.
  *
  * Uses module-level caching to avoid redundant API calls.
- * Returns active (non-claimable) positions only.
  *
  * @param maxPositions - Maximum number of positions to return (all if omitted)
+ * @param claimable - When true, returns only claimable positions; when false (default), returns only active positions
  * @returns Positions data, loading state, and refresh function
  */
 export const usePredictPositionsForHomepage = (
   maxPositions?: number,
+  claimable = false,
 ): UsePredictPositionsForHomepageResult => {
   const isPredictEnabled = useSelector(selectPredictEnabledFlag);
   const userAddress = useSelector(
@@ -64,7 +65,9 @@ export const usePredictPositionsForHomepage = (
   const maxPositionsRef = useRef(maxPositions);
   maxPositionsRef.current = maxPositions;
 
-  const cacheKey = userAddress ? `predict_positions_${userAddress}` : null;
+  const cacheKey = userAddress
+    ? `predict_positions_${userAddress}_${claimable}`
+    : null;
 
   const [state, setState] = useState<{
     positions: PredictPosition[];
@@ -121,7 +124,7 @@ export const usePredictPositionsForHomepage = (
       const controller = Engine.context.PredictController;
       const positionsData = await controller.getPositions({
         address: userAddress,
-        claimable: false, // Only active positions
+        claimable,
       });
 
       // Check if this request is still valid
@@ -157,7 +160,7 @@ export const usePredictPositionsForHomepage = (
         error: err instanceof Error ? err.message : 'Failed to fetch positions',
       });
     }
-  }, [isPredictEnabled, cacheKey, userAddress]);
+  }, [isPredictEnabled, cacheKey, userAddress, claimable]);
 
   const refresh = useCallback(async () => {
     // Clear cache and refetch
diff --git a/app/components/Views/Homepage/Sections/Tokens/TokensSection.test.tsx b/app/components/Views/Homepage/Sections/Tokens/TokensSection.test.tsx
index b45c775d068d..28ff96be8935 100644
--- a/app/components/Views/Homepage/Sections/Tokens/TokensSection.test.tsx
+++ b/app/components/Views/Homepage/Sections/Tokens/TokensSection.test.tsx
@@ -94,43 +94,83 @@ jest.mock('./components/PopularTokensSkeleton', () => {
 });
 
 // Mock TokenListItem and TokenListItemV2 to avoid complex import chains
-const MockTokenListItem = ({ assetKey }: { assetKey: { address: string } }) => {
+const MockTokenListItem = ({
+  assetKey,
+  showRemoveMenu,
+}: {
+  assetKey: { address: string; chainId?: string };
+  showRemoveMenu?: (token: unknown) => void;
+}) => {
   const ReactActual = jest.requireActual('react');
-  const { Text } = jest.requireActual('react-native');
+  const { Text, TouchableOpacity } = jest.requireActual('react-native');
   return ReactActual.createElement(
-    Text,
-    { testID: `token-item-${assetKey.address}` },
-    `Token ${assetKey.address}`,
+    TouchableOpacity,
+    {
+      testID: `token-item-${assetKey.address}`,
+      onLongPress: () =>
+        showRemoveMenu?.({
+          address: assetKey.address,
+          chainId: assetKey.chainId,
+          name: `Token ${assetKey.address}`,
+          symbol: 'TKN',
+          decimals: 18,
+          image: '',
+          balance: '0',
+          logo: undefined,
+          isETH: false,
+        }),
+    },
+    ReactActual.createElement(Text, null, `Token ${assetKey.address}`),
   );
 };
 
 jest.mock(
   '../../../../UI/Tokens/TokenList/TokenListItem/TokenListItem',
   () => ({
-    TokenListItem: (props: { assetKey: { address: string } }) =>
-      MockTokenListItem(props),
+    TokenListItem: (props: {
+      assetKey: { address: string; chainId?: string };
+      showRemoveMenu?: (token: unknown) => void;
+    }) => MockTokenListItem(props),
   }),
 );
 
 const MockTokenListItemV2 = ({
   assetKey,
+  showRemoveMenu,
 }: {
-  assetKey: { address: string };
+  assetKey: { address: string; chainId?: string };
+  showRemoveMenu?: (token: unknown) => void;
 }) => {
   const ReactActual = jest.requireActual('react');
-  const { Text } = jest.requireActual('react-native');
+  const { Text, TouchableOpacity } = jest.requireActual('react-native');
   return ReactActual.createElement(
-    Text,
-    { testID: `token-item-v2-${assetKey.address}` },
-    `TokenV2 ${assetKey.address}`,
+    TouchableOpacity,
+    {
+      testID: `token-item-v2-${assetKey.address}`,
+      onLongPress: () =>
+        showRemoveMenu?.({
+          address: assetKey.address,
+          chainId: assetKey.chainId,
+          name: `Token ${assetKey.address}`,
+          symbol: 'TKN',
+          decimals: 18,
+          image: '',
+          balance: '0',
+          logo: undefined,
+          isETH: false,
+        }),
+    },
+    ReactActual.createElement(Text, null, `TokenV2 ${assetKey.address}`),
   );
 };
 
 jest.mock(
   '../../../../UI/Tokens/TokenList/TokenListItemV2/TokenListItemV2',
   () => ({
-    TokenListItemV2: (props: { assetKey: { address: string } }) =>
-      MockTokenListItemV2(props),
+    TokenListItemV2: (props: {
+      assetKey: { address: string; chainId?: string };
+      showRemoveMenu?: (token: unknown) => void;
+    }) => MockTokenListItemV2(props),
   }),
 );
 
@@ -192,6 +232,60 @@ jest.mock('./components/PopularTokenRow', () => {
   };
 });
 
+// Mock RemoveTokenBottomSheet (default export)
+jest.mock('../../../../UI/Tokens/TokenList/RemoveTokenBottomSheet', () => {
+  const { View, Text, TouchableOpacity } = jest.requireActual('react-native');
+  const MockRemoveTokenBottomSheet = ({
+    isVisible,
+    onRemove,
+    onClose,
+  }: {
+    isVisible: boolean;
+    onRemove: () => void;
+    onClose: () => void;
+  }) =>
+    isVisible ? (
+      <View testID="remove-token-bottom-sheet">
+        <TouchableOpacity testID="remove-token-confirm" onPress={onRemove}>
+          <Text>Remove</Text>
+        </TouchableOpacity>
+        <TouchableOpacity testID="remove-token-cancel" onPress={onClose}>
+          <Text>Cancel</Text>
+        </TouchableOpacity>
+      </View>
+    ) : null;
+  return {
+    __esModule: true,
+    default: MockRemoveTokenBottomSheet,
+  };
+});
+
+// Mock ScamWarningModal
+jest.mock(
+  '../../../../UI/Tokens/TokenList/ScamWarningModal/ScamWarningModal',
+  () => ({
+    ScamWarningModal: () => null,
+  }),
+);
+
+// Mock useAnalytics
+jest.mock('../../../../hooks/useAnalytics/useAnalytics', () => ({
+  useAnalytics: () => ({
+    trackEvent: jest.fn(),
+    createEventBuilder: jest.fn(),
+  }),
+}));
+
+// Mock token removal utilities
+jest.mock('../../../../UI/Tokens/util', () => ({
+  removeEvmToken: jest.fn().mockResolvedValue(undefined),
+  removeNonEvmToken: jest.fn().mockResolvedValue(undefined),
+}));
+
+jest.mock('../../../../../core/Multichain/utils', () => ({
+  isNonEvmChainId: jest.fn().mockReturnValue(false),
+}));
+
 const mockPopularTokens = [
   {
     assetId: 'eip155:1/erc20:0xaca92e438df0b2401ff60da7e4337b687a2435da',
@@ -233,7 +327,9 @@ describe('TokensSection', () => {
   it('renders section title for account with balance', () => {
     mockUseIsZeroBalanceAccount.mockReturnValue(false);
 
-    renderWithProvider(<TokensSection />);
+    renderWithProvider(
+      <TokensSection sectionIndex={0} totalSectionsLoaded={1} />,
+    );
 
     expect(screen.getByText('Tokens')).toBeOnTheScreen();
   });
@@ -241,7 +337,9 @@ describe('TokensSection', () => {
   it('renders "Tokens" title for zero balance account', () => {
     mockUseIsZeroBalanceAccount.mockReturnValue(true);
 
-    renderWithProvider(<TokensSection />);
+    renderWithProvider(
+      <TokensSection sectionIndex={0} totalSectionsLoaded={1} />,
+    );
 
     expect(screen.getByText('Tokens')).toBeOnTheScreen();
   });
@@ -249,7 +347,9 @@ describe('TokensSection', () => {
   it('renders popular tokens for zero balance account', () => {
     mockUseIsZeroBalanceAccount.mockReturnValue(true);
 
-    renderWithProvider(<TokensSection />);
+    renderWithProvider(
+      <TokensSection sectionIndex={0} totalSectionsLoaded={1} />,
+    );
 
     expect(screen.getByText('MetaMask USD')).toBeOnTheScreen();
     expect(screen.getByText('Ethereum')).toBeOnTheScreen();
@@ -258,7 +358,9 @@ describe('TokensSection', () => {
   it('renders Buy button for popular tokens in zero balance state', () => {
     mockUseIsZeroBalanceAccount.mockReturnValue(true);
 
-    renderWithProvider(<TokensSection />);
+    renderWithProvider(
+      <TokensSection sectionIndex={0} totalSectionsLoaded={1} />,
+    );
 
     expect(screen.getAllByText('Buy')).toHaveLength(2);
   });
@@ -266,7 +368,9 @@ describe('TokensSection', () => {
   it('calls goToBuy with assetId when Buy button is pressed', () => {
     mockUseIsZeroBalanceAccount.mockReturnValue(true);
 
-    renderWithProvider(<TokensSection />);
+    renderWithProvider(
+      <TokensSection sectionIndex={0} totalSectionsLoaded={1} />,
+    );
 
     const buyButtons = screen.getAllByText('Buy');
     fireEvent.press(buyButtons[0]);
@@ -283,7 +387,9 @@ describe('TokensSection', () => {
       { chainId: '0x1', address: '0xtoken2', isStaked: false },
     ]);
 
-    renderWithProvider(<TokensSection />);
+    renderWithProvider(
+      <TokensSection sectionIndex={0} totalSectionsLoaded={1} />,
+    );
 
     expect(screen.getByTestId('token-item-0xtoken1')).toBeOnTheScreen();
     expect(screen.getByTestId('token-item-0xtoken2')).toBeOnTheScreen();
@@ -301,7 +407,9 @@ describe('TokensSection', () => {
       { chainId: '0x1', address: '0xtoken7', isStaked: false },
     ]);
 
-    renderWithProvider(<TokensSection />);
+    renderWithProvider(
+      <TokensSection sectionIndex={0} totalSectionsLoaded={1} />,
+    );
 
     expect(screen.getByTestId('token-item-0xtoken1')).toBeOnTheScreen();
     expect(screen.getByTestId('token-item-0xtoken5')).toBeOnTheScreen();
@@ -312,7 +420,9 @@ describe('TokensSection', () => {
   it('navigates to tokens full view on title press', () => {
     mockUseIsZeroBalanceAccount.mockReturnValue(false);
 
-    renderWithProvider(<TokensSection />);
+    renderWithProvider(
+      <TokensSection sectionIndex={0} totalSectionsLoaded={1} />,
+    );
 
     fireEvent.press(screen.getByLabelText('Tokens'));
 
@@ -338,7 +448,9 @@ describe('TokensSection', () => {
       refetch: jest.fn(),
     });
 
-    renderWithProvider(<TokensSection />);
+    renderWithProvider(
+      <TokensSection sectionIndex={0} totalSectionsLoaded={1} />,
+    );
 
     await waitFor(() => {
       expect(screen.getByTestId('error-state')).toBeOnTheScreen();
@@ -349,7 +461,9 @@ describe('TokensSection', () => {
   it('renders popular token rows when zero balance and no error', () => {
     mockUseIsZeroBalanceAccount.mockReturnValue(true);
 
-    renderWithProvider(<TokensSection />);
+    renderWithProvider(
+      <TokensSection sectionIndex={0} totalSectionsLoaded={1} />,
+    );
 
     expect(screen.queryByTestId('error-state')).toBeNull();
     expect(screen.getByText('MetaMask USD')).toBeOnTheScreen();
@@ -363,7 +477,9 @@ describe('TokensSection', () => {
     mockRefreshTokens.mockRejectedValue(new Error('Network error'));
 
     const ref = React.createRef<{ refresh: () => Promise<void> }>();
-    renderWithProvider(<TokensSection ref={ref} />);
+    renderWithProvider(
+      <TokensSection ref={ref} sectionIndex={0} totalSectionsLoaded={1} />,
+    );
 
     await act(async () => {
       await ref.current?.refresh();
@@ -383,7 +499,9 @@ describe('TokensSection', () => {
     mockRefreshTokens.mockRejectedValueOnce(new Error('Network error'));
 
     const ref = React.createRef<{ refresh: () => Promise<void> }>();
-    renderWithProvider(<TokensSection ref={ref} />);
+    renderWithProvider(
+      <TokensSection ref={ref} sectionIndex={0} totalSectionsLoaded={1} />,
+    );
 
     await act(async () => {
       await ref.current?.refresh();
@@ -408,7 +526,9 @@ describe('TokensSection', () => {
     mockSortedTokenKeys.mockReturnValue([]);
     mockAccountGroupBalance.mockReturnValue(null);
 
-    renderWithProvider(<TokensSection />);
+    renderWithProvider(
+      <TokensSection sectionIndex={0} totalSectionsLoaded={1} />,
+    );
 
     expect(screen.queryByTestId('error-state')).toBeNull();
   });
@@ -421,7 +541,9 @@ describe('TokensSection', () => {
       userCurrency: 'usd',
     });
 
-    renderWithProvider(<TokensSection />);
+    renderWithProvider(
+      <TokensSection sectionIndex={0} totalSectionsLoaded={1} />,
+    );
 
     expect(screen.getByTestId('error-state')).toBeOnTheScreen();
     expect(screen.getByText('Unable to load tokens')).toBeOnTheScreen();
@@ -435,7 +557,9 @@ describe('TokensSection', () => {
       userCurrency: 'usd',
     });
 
-    renderWithProvider(<TokensSection />);
+    renderWithProvider(
+      <TokensSection sectionIndex={0} totalSectionsLoaded={1} />,
+    );
 
     expect(screen.getByTestId('error-state')).toBeOnTheScreen();
 
@@ -446,6 +570,97 @@ describe('TokensSection', () => {
     expect(mockRefreshTokens).toHaveBeenCalledTimes(1);
   });
 
+  it('does not show RemoveTokenBottomSheet by default', () => {
+    mockUseIsZeroBalanceAccount.mockReturnValue(false);
+    mockSortedTokenKeys.mockReturnValue([
+      { chainId: '0x1', address: '0xtoken1', isStaked: false },
+    ]);
+
+    renderWithProvider(
+      <TokensSection sectionIndex={0} totalSectionsLoaded={1} />,
+    );
+
+    expect(
+      screen.queryByTestId('remove-token-bottom-sheet'),
+    ).not.toBeOnTheScreen();
+  });
+
+  describe('token removal', () => {
+    const { removeEvmToken, removeNonEvmToken } = jest.requireMock(
+      '../../../../UI/Tokens/util',
+    );
+    const { isNonEvmChainId } = jest.requireMock(
+      '../../../../../core/Multichain/utils',
+    );
+
+    beforeEach(() => {
+      mockUseIsZeroBalanceAccount.mockReturnValue(false);
+      mockSortedTokenKeys.mockReturnValue([
+        { chainId: '0x1', address: '0xtoken1', isStaked: false },
+      ]);
+      removeEvmToken.mockClear();
+      removeNonEvmToken.mockClear();
+      isNonEvmChainId.mockReturnValue(false);
+    });
+
+    it('shows RemoveTokenBottomSheet on long press and calls removeEvmToken on confirm', async () => {
+      renderWithProvider(
+        <TokensSection sectionIndex={0} totalSectionsLoaded={1} />,
+      );
+
+      fireEvent(screen.getByTestId('token-item-0xtoken1'), 'onLongPress');
+
+      expect(screen.getByTestId('remove-token-bottom-sheet')).toBeOnTheScreen();
+
+      await act(async () => {
+        fireEvent.press(screen.getByTestId('remove-token-confirm'));
+      });
+
+      expect(removeEvmToken).toHaveBeenCalledTimes(1);
+      expect(removeNonEvmToken).not.toHaveBeenCalled();
+    });
+
+    it('calls removeNonEvmToken for non-EVM tokens', async () => {
+      isNonEvmChainId.mockReturnValue(true);
+      mockSortedTokenKeys.mockReturnValue([
+        {
+          chainId: 'solana:5eykt4UsFv8P8NJdTREpY1vzqKqZKvdp',
+          address: '0xsoltoken',
+          isStaked: false,
+        },
+      ]);
+
+      renderWithProvider(
+        <TokensSection sectionIndex={0} totalSectionsLoaded={1} />,
+      );
+
+      fireEvent(screen.getByTestId('token-item-0xsoltoken'), 'onLongPress');
+
+      await act(async () => {
+        fireEvent.press(screen.getByTestId('remove-token-confirm'));
+      });
+
+      expect(removeNonEvmToken).toHaveBeenCalledTimes(1);
+      expect(removeEvmToken).not.toHaveBeenCalled();
+    });
+
+    it('hides RemoveTokenBottomSheet on cancel', () => {
+      renderWithProvider(
+        <TokensSection sectionIndex={0} totalSectionsLoaded={1} />,
+      );
+
+      fireEvent(screen.getByTestId('token-item-0xtoken1'), 'onLongPress');
+
+      expect(screen.getByTestId('remove-token-bottom-sheet')).toBeOnTheScreen();
+
+      fireEvent.press(screen.getByTestId('remove-token-cancel'));
+
+      expect(
+        screen.queryByTestId('remove-token-bottom-sheet'),
+      ).not.toBeOnTheScreen();
+    });
+  });
+
   it('calls refreshTokens for non-zero balance pull-to-refresh', async () => {
     mockUseIsZeroBalanceAccount.mockReturnValue(false);
     mockSortedTokenKeys.mockReturnValue([
@@ -453,7 +668,9 @@ describe('TokensSection', () => {
     ]);
 
     const ref = React.createRef<{ refresh: () => Promise<void> }>();
-    renderWithProvider(<TokensSection ref={ref} />);
+    renderWithProvider(
+      <TokensSection ref={ref} sectionIndex={0} totalSectionsLoaded={1} />,
+    );
 
     await act(async () => {
       await ref.current?.refresh();
diff --git a/app/components/Views/Homepage/Sections/Tokens/TokensSection.tsx b/app/components/Views/Homepage/Sections/Tokens/TokensSection.tsx
index dc5c5b851dde..e9117afa5700 100644
--- a/app/components/Views/Homepage/Sections/Tokens/TokensSection.tsx
+++ b/app/components/Views/Homepage/Sections/Tokens/TokensSection.tsx
@@ -7,6 +7,7 @@ import React, {
   useRef,
   useState,
 } from 'react';
+import { View } from 'react-native';
 import { useNavigation } from '@react-navigation/native';
 import { useSelector } from 'react-redux';
 import { Box } from '@metamask/design-system-react-native';
@@ -19,140 +20,185 @@ import { selectSortedAssetsBySelectedAccountGroup } from '../../../../../selecto
 import { selectAccountGroupBalanceForEmptyState } from '../../../../../selectors/assets/balances';
 import { TokenListItem } from '../../../../UI/Tokens/TokenList/TokenListItem/TokenListItem';
 import { TokenListItemV2 } from '../../../../UI/Tokens/TokenList/TokenListItemV2/TokenListItemV2';
+import RemoveTokenBottomSheet from '../../../../UI/Tokens/TokenList/RemoveTokenBottomSheet';
+import { ScamWarningModal } from '../../../../UI/Tokens/TokenList/ScamWarningModal/ScamWarningModal';
 import { selectTokenListLayoutV2Enabled } from '../../../../../selectors/featureFlagController/tokenListLayout';
 import { selectPrivacyMode } from '../../../../../selectors/preferencesController';
+import { selectEvmNetworkConfigurationsByChainId } from '../../../../../selectors/networkController';
 import { SectionRefreshHandle } from '../../types';
 import { strings } from '../../../../../../locales/i18n';
 import { PopularTokensList } from './components';
-import { selectEvmNetworkConfigurationsByChainId } from '../../../../../selectors/networkController';
 import { selectSelectedInternalAccountId } from '../../../../../selectors/accountsController';
 import { selectSelectedInternalAccountByScope } from '../../../../../selectors/multichainAccounts/accounts';
 import { SolScope } from '@metamask/keyring-api';
 import { refreshTokens } from '../../../../UI/Tokens/util/refreshTokens';
+import { useRemoveToken } from '../../../../UI/Tokens/hooks/useRemoveToken';
+import useHomeViewedEvent, {
+  HomeSectionNames,
+} from '../../hooks/useHomeViewedEvent';
 
-const MAX_TOKENS_DISPLAYED = 5;
+interface TokensSectionProps {
+  sectionIndex: number;
+  totalSectionsLoaded: number;
+}
 
-// No-op functions for TokenListItem props we don't need in the homepage section
-const noopShowRemoveMenu = () => undefined;
-const noopSetShowScamWarningModal = () => undefined;
+const MAX_TOKENS_DISPLAYED = 5;
 
 /**
  * TokensSection - Displays user's token balances on the homepage
  * For zero balance accounts, shows popular tokens with buy buttons
  * For accounts with balance, shows the user's token holdings
  */
-const TokensSection = forwardRef<SectionRefreshHandle>((_, ref) => {
-  const navigation = useNavigation();
-  const isZeroBalanceAccount = useIsZeroBalanceAccount();
-  const sortedTokenKeys = useSelector(selectSortedAssetsBySelectedAccountGroup);
-  const accountGroupBalance = useSelector(
-    selectAccountGroupBalanceForEmptyState,
-  );
-  const privacyMode = useSelector(selectPrivacyMode);
-  const isTokenListV2 = useSelector(selectTokenListLayoutV2Enabled);
-  const ListItemComponent = isTokenListV2 ? TokenListItemV2 : TokenListItem;
-  const popularTokensListRef = useRef<SectionRefreshHandle>(null);
-  const [hasTokensError, setHasTokensError] = useState(false);
-
-  const evmNetworkConfigurationsByChainId = useSelector(
-    selectEvmNetworkConfigurationsByChainId,
-  );
-  const selectedAccountId = useSelector(selectSelectedInternalAccountId);
-  const selectedSolanaAccount =
-    useSelector(selectSelectedInternalAccountByScope)(SolScope.Mainnet) || null;
-  const isSolanaSelected = selectedSolanaAccount !== null;
-
-  const prevAccountIdRef = useRef(selectedAccountId);
-  // Reset section error when account changes (not on initial mount) so the new account gets a fresh state
-  useEffect(() => {
-    if (prevAccountIdRef.current !== selectedAccountId) {
-      prevAccountIdRef.current = selectedAccountId;
-      setHasTokensError(false);
-    }
-  }, [selectedAccountId]);
-
-  const title = strings('homepage.sections.tokens');
-
-  const displayTokenKeys = useMemo(
-    () => sortedTokenKeys.slice(0, MAX_TOKENS_DISPLAYED),
-    [sortedTokenKeys],
-  );
-
-  // Show error when an explicit refresh failed, or when balance data has loaded
-  // and the account has balance but the selector returned no tokens (controllers
-  // failed to load data). The accountGroupBalance null-check prevents a false
-  // positive on cold start or for legitimately empty token lists.
-  const hasBalanceButNoTokens =
-    accountGroupBalance != null &&
-    accountGroupBalance.totalBalanceInUserCurrency > 0 &&
-    displayTokenKeys.length === 0;
-  const showTokensError = hasTokensError || hasBalanceButNoTokens;
-
-  const refresh = useCallback(async () => {
-    if (isZeroBalanceAccount) {
-      await popularTokensListRef.current?.refresh();
-    } else {
-      try {
-        await refreshTokens({
-          isSolanaSelected,
-          evmNetworkConfigurationsByChainId,
-          selectedAccountId,
-        });
-      } catch {
-        setHasTokensError(true);
+const TokensSection = forwardRef<SectionRefreshHandle, TokensSectionProps>(
+  ({ sectionIndex, totalSectionsLoaded }, ref) => {
+    const sectionViewRef = useRef<View>(null);
+    const navigation = useNavigation();
+    const isZeroBalanceAccount = useIsZeroBalanceAccount();
+    const sortedTokenKeys = useSelector(
+      selectSortedAssetsBySelectedAccountGroup,
+    );
+    const accountGroupBalance = useSelector(
+      selectAccountGroupBalanceForEmptyState,
+    );
+    const privacyMode = useSelector(selectPrivacyMode);
+    const isTokenListV2 = useSelector(selectTokenListLayoutV2Enabled);
+    const ListItemComponent = isTokenListV2 ? TokenListItemV2 : TokenListItem;
+    const popularTokensListRef = useRef<SectionRefreshHandle>(null);
+    const [hasTokensError, setHasTokensError] = useState(false);
+
+    const {
+      removeTokenState,
+      showRemoveMenu,
+      removeToken,
+      handleClose: handleCloseRemoveTokenBottomSheet,
+      showScamWarningModal,
+      setShowScamWarningModal,
+    } = useRemoveToken();
+
+    const evmNetworkConfigurationsByChainId = useSelector(
+      selectEvmNetworkConfigurationsByChainId,
+    );
+    const selectedAccountId = useSelector(selectSelectedInternalAccountId);
+    const selectedSolanaAccount =
+      useSelector(selectSelectedInternalAccountByScope)(SolScope.Mainnet) ||
+      null;
+    const isSolanaSelected = selectedSolanaAccount !== null;
+
+    const prevAccountIdRef = useRef(selectedAccountId);
+    // Reset section error when account changes (not on initial mount) so the new account gets a fresh state
+    useEffect(() => {
+      if (prevAccountIdRef.current !== selectedAccountId) {
+        prevAccountIdRef.current = selectedAccountId;
+        setHasTokensError(false);
       }
-    }
-  }, [
-    isZeroBalanceAccount,
-    isSolanaSelected,
-    evmNetworkConfigurationsByChainId,
-    selectedAccountId,
-  ]);
-
-  useImperativeHandle(ref, () => ({ refresh }), [refresh]);
-
-  const handleViewAllTokens = useCallback(() => {
-    navigation.navigate(Routes.WALLET.TOKENS_FULL_VIEW);
-  }, [navigation]);
-
-  const handleTokensRetry = useCallback(async () => {
-    setHasTokensError(false);
-    await refresh();
-  }, [refresh]);
-
-  return (
-    <Box gap={3}>
-      <SectionTitle title={title} onPress={handleViewAllTokens} />
-      {showTokensError ? (
-        <ErrorState
-          title={strings('homepage.error.unable_to_load', {
-            section: title.toLowerCase(),
-          })}
-          onRetry={handleTokensRetry}
-        />
-      ) : isZeroBalanceAccount ? (
-        <SectionRow>
-          <PopularTokensList
-            ref={popularTokensListRef}
-            onError={setHasTokensError}
-          />
-        </SectionRow>
-      ) : (
-        <SectionRow>
-          {displayTokenKeys.map((tokenKey, index) => (
-            <ListItemComponent
-              key={`${tokenKey.chainId}-${tokenKey.address}-${tokenKey.isStaked ? 'staked' : 'unstaked'}-${index}`}
-              assetKey={tokenKey}
-              showRemoveMenu={noopShowRemoveMenu}
-              setShowScamWarningModal={noopSetShowScamWarningModal}
-              privacyMode={privacyMode}
-              showPercentageChange
+    }, [selectedAccountId]);
+
+    const title = strings('homepage.sections.tokens');
+
+    const displayTokenKeys = useMemo(
+      () => sortedTokenKeys.slice(0, MAX_TOKENS_DISPLAYED),
+      [sortedTokenKeys],
+    );
+
+    // Show error when an explicit refresh failed, or when balance data has loaded
+    // and the account has balance but the selector returned no tokens (controllers
+    // failed to load data). The accountGroupBalance null-check prevents a false
+    // positive on cold start or for legitimately empty token lists.
+    const hasBalanceButNoTokens =
+      accountGroupBalance != null &&
+      accountGroupBalance.totalBalanceInUserCurrency > 0 &&
+      displayTokenKeys.length === 0;
+    const showTokensError = hasTokensError || hasBalanceButNoTokens;
+
+    const refresh = useCallback(async () => {
+      if (isZeroBalanceAccount) {
+        await popularTokensListRef.current?.refresh();
+      } else {
+        try {
+          await refreshTokens({
+            isSolanaSelected,
+            evmNetworkConfigurationsByChainId,
+            selectedAccountId,
+          });
+        } catch {
+          setHasTokensError(true);
+        }
+      }
+    }, [
+      isZeroBalanceAccount,
+      isSolanaSelected,
+      evmNetworkConfigurationsByChainId,
+      selectedAccountId,
+    ]);
+
+    useImperativeHandle(ref, () => ({ refresh }), [refresh]);
+
+    const itemCount = isZeroBalanceAccount ? 0 : displayTokenKeys.length;
+
+    useHomeViewedEvent({
+      sectionRef: sectionViewRef,
+      isLoading: false,
+      sectionName: HomeSectionNames.TOKENS,
+      sectionIndex,
+      totalSectionsLoaded,
+      isEmpty: isZeroBalanceAccount,
+      itemCount,
+    });
+
+    const handleViewAllTokens = useCallback(() => {
+      navigation.navigate(Routes.WALLET.TOKENS_FULL_VIEW);
+    }, [navigation]);
+
+    const handleTokensRetry = useCallback(async () => {
+      setHasTokensError(false);
+      await refresh();
+    }, [refresh]);
+
+    return (
+      <View ref={sectionViewRef}>
+        <Box gap={3}>
+          <SectionTitle title={title} onPress={handleViewAllTokens} />
+          {showTokensError ? (
+            <ErrorState
+              title={strings('homepage.error.unable_to_load', {
+                section: title.toLowerCase(),
+              })}
+              onRetry={handleTokensRetry}
             />
-          ))}
-        </SectionRow>
-      )}
-    </Box>
-  );
-});
+          ) : isZeroBalanceAccount ? (
+            <SectionRow>
+              <PopularTokensList
+                ref={popularTokensListRef}
+                onError={setHasTokensError}
+              />
+            </SectionRow>
+          ) : (
+            <SectionRow>
+              {displayTokenKeys.map((tokenKey, index) => (
+                <ListItemComponent
+                  key={`${tokenKey.chainId}-${tokenKey.address}-${tokenKey.isStaked ? 'staked' : 'unstaked'}-${index}`}
+                  assetKey={tokenKey}
+                  showRemoveMenu={showRemoveMenu}
+                  setShowScamWarningModal={setShowScamWarningModal}
+                  privacyMode={privacyMode}
+                  showPercentageChange
+                />
+              ))}
+            </SectionRow>
+          )}
+          <ScamWarningModal
+            showScamWarningModal={showScamWarningModal}
+            setShowScamWarningModal={setShowScamWarningModal}
+          />
+          <RemoveTokenBottomSheet
+            isVisible={removeTokenState.isVisible}
+            onClose={handleCloseRemoveTokenBottomSheet}
+            onRemove={removeToken}
+          />
+        </Box>
+      </View>
+    );
+  },
+);
 
 export default TokensSection;
diff --git a/app/components/Views/Homepage/Sections/Tokens/components/PopularTokenRow.test.tsx b/app/components/Views/Homepage/Sections/Tokens/components/PopularTokenRow.test.tsx
index 570826c6f2e5..0ca9d144e83e 100644
--- a/app/components/Views/Homepage/Sections/Tokens/components/PopularTokenRow.test.tsx
+++ b/app/components/Views/Homepage/Sections/Tokens/components/PopularTokenRow.test.tsx
@@ -3,9 +3,11 @@ import { fireEvent, screen } from '@testing-library/react-native';
 import renderWithProvider from '../../../../../../util/test/renderWithProvider';
 import PopularTokenRow from './PopularTokenRow';
 import type { PopularToken } from '../hooks/usePopularTokens';
+import { TokenDetailsSource } from '../../../../../UI/TokenDetails/constants/constants';
 
 const mockNavigate = jest.fn();
 const mockGoToBuy = jest.fn();
+const mockTrackBuyButtonClicked = jest.fn();
 
 jest.mock('@react-navigation/native', () => {
   const actualNav = jest.requireActual('@react-navigation/native');
@@ -23,6 +25,12 @@ jest.mock('../../../../../UI/Ramp/hooks/useRampNavigation', () => ({
   }),
 }));
 
+jest.mock('../hooks', () => ({
+  useRampsButtonClickedEvent: () => ({
+    trackBuyButtonClicked: mockTrackBuyButtonClicked,
+  }),
+}));
+
 jest.mock('../../../../../../selectors/currencyRateController', () => ({
   selectCurrentCurrency: jest.fn(() => 'usd'),
 }));
@@ -160,6 +168,7 @@ describe('PopularTokenRow', () => {
         address: '0xabcdef1234567890abcdef1234567890abcdef12',
         symbol: 'USDC',
         isNative: false,
+        source: TokenDetailsSource.MobileTokenList,
       });
     });
 
@@ -178,6 +187,7 @@ describe('PopularTokenRow', () => {
         address: '0x0000000000000000000000000000000000000000',
         symbol: 'ETH',
         isNative: true,
+        source: TokenDetailsSource.MobileTokenList,
       });
     });
 
@@ -196,9 +206,28 @@ describe('PopularTokenRow', () => {
         address: 'solana:5eykt4UsFv8P8NJdTREpY1vzqKqZKvdp/slip44:501',
         symbol: 'SOL',
         isNative: true,
+        source: TokenDetailsSource.MobileTokenList,
       });
     });
 
+    it('passes source as MobileTokenList for analytics tracking', () => {
+      const token = createMockToken({
+        assetId: 'eip155:1/erc20:0xabcdef1234567890abcdef1234567890abcdef12',
+        symbol: 'USDC',
+      });
+
+      renderWithProvider(<PopularTokenRow token={token} />);
+
+      fireEvent.press(screen.getByText('Test Token'));
+
+      expect(mockNavigate).toHaveBeenCalledWith(
+        'Asset',
+        expect.objectContaining({
+          source: TokenDetailsSource.MobileTokenList,
+        }),
+      );
+    });
+
     it('does not navigate for invalid CAIP-19 format', () => {
       const token = createMockToken({
         assetId: 'invalid-asset-id',
@@ -227,6 +256,16 @@ describe('PopularTokenRow', () => {
         assetId: 'eip155:1/erc20:0x1234567890abcdef1234567890abcdef12345678',
       });
     });
+
+    it('fires Ramps Button Clicked analytics event when Buy is pressed', () => {
+      const token = createMockToken();
+
+      renderWithProvider(<PopularTokenRow token={token} />);
+
+      fireEvent.press(screen.getByText('Buy'));
+
+      expect(mockTrackBuyButtonClicked).toHaveBeenCalledTimes(1);
+    });
   });
 
   describe('edge cases', () => {
@@ -245,6 +284,7 @@ describe('PopularTokenRow', () => {
         address: '0x0000000000000000000000000000000000000000',
         symbol: 'BNB',
         isNative: true,
+        source: TokenDetailsSource.MobileTokenList,
       });
     });
 
diff --git a/app/components/Views/Homepage/Sections/Tokens/components/PopularTokenRow.tsx b/app/components/Views/Homepage/Sections/Tokens/components/PopularTokenRow.tsx
index 8aa3bcdc644a..94bcc00ff0e4 100644
--- a/app/components/Views/Homepage/Sections/Tokens/components/PopularTokenRow.tsx
+++ b/app/components/Views/Homepage/Sections/Tokens/components/PopularTokenRow.tsx
@@ -27,6 +27,8 @@ import { useRampNavigation } from '../../../../../UI/Ramp/hooks/useRampNavigatio
 import { selectCurrentCurrency } from '../../../../../../selectors/currencyRateController';
 import { strings } from '../../../../../../../locales/i18n';
 import type { PopularToken } from '../hooks/usePopularTokens';
+import { useRampsButtonClickedEvent } from '../hooks';
+import { TokenDetailsSource } from '../../../../../UI/TokenDetails/constants/constants';
 
 // Zero address used for native EVM tokens (ETH, BNB, etc.)
 const NATIVE_TOKEN_ADDRESS = '0x0000000000000000000000000000000000000000';
@@ -144,6 +146,7 @@ const formatPercentageChange = (
 const PopularTokenRow: React.FC<PopularTokenRowProps> = ({ token }) => {
   const navigation = useNavigation();
   const { goToBuy } = useRampNavigation();
+  const { trackBuyButtonClicked } = useRampsButtonClickedEvent();
   const currentCurrency = useSelector(selectCurrentCurrency);
 
   const handleRowPress = useCallback(() => {
@@ -159,12 +162,14 @@ const PopularTokenRow: React.FC<PopularTokenRowProps> = ({ token }) => {
       address,
       symbol: token.symbol,
       isNative,
+      source: TokenDetailsSource.MobileTokenList,
     });
   }, [navigation, token.assetId, token.symbol]);
 
   const handleBuy = useCallback(() => {
+    trackBuyButtonClicked();
     goToBuy({ assetId: token.assetId });
-  }, [goToBuy, token.assetId]);
+  }, [trackBuyButtonClicked, goToBuy, token.assetId]);
 
   const priceDisplay = useMemo(() => {
     if (token.price === undefined) {
diff --git a/app/components/Views/Homepage/Sections/Tokens/hooks/index.ts b/app/components/Views/Homepage/Sections/Tokens/hooks/index.ts
index 5c1d4f933739..c3e0fd9b62eb 100644
--- a/app/components/Views/Homepage/Sections/Tokens/hooks/index.ts
+++ b/app/components/Views/Homepage/Sections/Tokens/hooks/index.ts
@@ -1,3 +1,4 @@
 export { default as useIsZeroBalanceAccount } from './useIsZeroBalanceAccount';
 export { usePopularTokens } from './usePopularTokens';
 export type { PopularToken } from './usePopularTokens';
+export { useRampsButtonClickedEvent } from './useRampsButtonClickedEvent';
diff --git a/app/components/Views/Homepage/Sections/Tokens/hooks/useRampsButtonClickedEvent.test.ts b/app/components/Views/Homepage/Sections/Tokens/hooks/useRampsButtonClickedEvent.test.ts
new file mode 100644
index 000000000000..e6fd55fa4228
--- /dev/null
+++ b/app/components/Views/Homepage/Sections/Tokens/hooks/useRampsButtonClickedEvent.test.ts
@@ -0,0 +1,137 @@
+import { renderHook, act } from '@testing-library/react-native';
+import { useRampsButtonClickedEvent } from './useRampsButtonClickedEvent';
+import { MetaMetricsEvents } from '../../../../../../core/Analytics';
+
+const mockTrackEvent = jest.fn();
+const mockAddProperties = jest.fn().mockReturnThis();
+const mockBuild = jest.fn().mockReturnValue({ event: 'built' });
+const mockCreateEventBuilder = jest.fn(() => ({
+  addProperties: mockAddProperties,
+  build: mockBuild,
+}));
+
+jest.mock('../../../../../hooks/useAnalytics/useAnalytics', () => ({
+  useAnalytics: () => ({
+    trackEvent: mockTrackEvent,
+    createEventBuilder: mockCreateEventBuilder,
+  }),
+}));
+
+const mockUseRampsButtonClickData = jest.fn();
+jest.mock('../../../../../UI/Ramp/hooks/useRampsButtonClickData', () => ({
+  useRampsButtonClickData: () => mockUseRampsButtonClickData(),
+}));
+
+const mockUseRampsUnifiedV1Enabled = jest.fn();
+jest.mock('../../../../../UI/Ramp/hooks/useRampsUnifiedV1Enabled', () => ({
+  __esModule: true,
+  default: () => mockUseRampsUnifiedV1Enabled(),
+}));
+
+const mockUseRampsUnifiedV2Enabled = jest.fn();
+jest.mock('../../../../../UI/Ramp/hooks/useRampsUnifiedV2Enabled', () => ({
+  __esModule: true,
+  default: () => mockUseRampsUnifiedV2Enabled(),
+}));
+
+jest.mock('react-redux', () => ({
+  useSelector: jest.fn((selector: (...args: unknown[]) => unknown) =>
+    selector({} as never),
+  ),
+}));
+
+jest.mock('../../../../../../reducers/fiatOrders', () => ({
+  getDetectedGeolocation: () => 'US',
+}));
+
+const defaultButtonClickData = {
+  ramp_routing: 'SMART_ROUTING' as const,
+  is_authenticated: false,
+  preferred_provider: undefined,
+  order_count: 0,
+};
+
+describe('useRampsButtonClickedEvent', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+    mockUseRampsButtonClickData.mockReturnValue(defaultButtonClickData);
+    mockUseRampsUnifiedV1Enabled.mockReturnValue(false);
+    mockUseRampsUnifiedV2Enabled.mockReturnValue(false);
+  });
+
+  it('fires RAMPS_BUTTON_CLICKED with ramp_type BUY when both unified flags are off', () => {
+    const { result } = renderHook(() => useRampsButtonClickedEvent());
+
+    act(() => {
+      result.current.trackBuyButtonClicked();
+    });
+
+    expect(mockCreateEventBuilder).toHaveBeenCalledWith(
+      MetaMetricsEvents.RAMPS_BUTTON_CLICKED,
+    );
+    expect(mockAddProperties).toHaveBeenCalledWith({
+      button_text: 'Buy',
+      location: 'TokensSection',
+      ramp_type: 'BUY',
+      region: 'US',
+      ramp_routing: 'SMART_ROUTING',
+      is_authenticated: false,
+      preferred_provider: undefined,
+      order_count: 0,
+    });
+    expect(mockTrackEvent).toHaveBeenCalledWith({ event: 'built' });
+  });
+
+  it('fires with ramp_type UNIFIED_BUY when V1 is enabled', () => {
+    mockUseRampsUnifiedV1Enabled.mockReturnValue(true);
+
+    const { result } = renderHook(() => useRampsButtonClickedEvent());
+
+    act(() => {
+      result.current.trackBuyButtonClicked();
+    });
+
+    expect(mockAddProperties).toHaveBeenCalledWith(
+      expect.objectContaining({ ramp_type: 'UNIFIED_BUY' }),
+    );
+  });
+
+  it('fires with ramp_type UNIFIED_BUY_2 when V2 is enabled', () => {
+    mockUseRampsUnifiedV1Enabled.mockReturnValue(true);
+    mockUseRampsUnifiedV2Enabled.mockReturnValue(true);
+
+    const { result } = renderHook(() => useRampsButtonClickedEvent());
+
+    act(() => {
+      result.current.trackBuyButtonClicked();
+    });
+
+    expect(mockAddProperties).toHaveBeenCalledWith(
+      expect.objectContaining({ ramp_type: 'UNIFIED_BUY_2' }),
+    );
+  });
+
+  it('includes authentication and order data from useRampsButtonClickData', () => {
+    mockUseRampsButtonClickData.mockReturnValue({
+      ramp_routing: undefined,
+      is_authenticated: true,
+      preferred_provider: 'transak',
+      order_count: 3,
+    });
+
+    const { result } = renderHook(() => useRampsButtonClickedEvent());
+
+    act(() => {
+      result.current.trackBuyButtonClicked();
+    });
+
+    expect(mockAddProperties).toHaveBeenCalledWith(
+      expect.objectContaining({
+        is_authenticated: true,
+        preferred_provider: 'transak',
+        order_count: 3,
+        ramp_routing: undefined,
+      }),
+    );
+  });
+});
diff --git a/app/components/Views/Homepage/Sections/Tokens/hooks/useRampsButtonClickedEvent.ts b/app/components/Views/Homepage/Sections/Tokens/hooks/useRampsButtonClickedEvent.ts
new file mode 100644
index 000000000000..39cf2baf8909
--- /dev/null
+++ b/app/components/Views/Homepage/Sections/Tokens/hooks/useRampsButtonClickedEvent.ts
@@ -0,0 +1,54 @@
+import { useCallback } from 'react';
+import { useSelector } from 'react-redux';
+import { useAnalytics } from '../../../../../hooks/useAnalytics/useAnalytics';
+import { MetaMetricsEvents } from '../../../../../../core/Analytics';
+import { useRampsButtonClickData } from '../../../../../UI/Ramp/hooks/useRampsButtonClickData';
+import useRampsUnifiedV1Enabled from '../../../../../UI/Ramp/hooks/useRampsUnifiedV1Enabled';
+import useRampsUnifiedV2Enabled from '../../../../../UI/Ramp/hooks/useRampsUnifiedV2Enabled';
+import { getDetectedGeolocation } from '../../../../../../reducers/fiatOrders';
+
+/**
+ * Encapsulates the `Ramps Button Clicked` analytics event for the
+ * Tokens Section empty state. Feature-flag-dependent properties
+ * (ramp_type) are resolved internally so callers only need to invoke
+ * the returned callback.
+ */
+export const useRampsButtonClickedEvent = () => {
+  const { trackEvent, createEventBuilder } = useAnalytics();
+  const buttonClickData = useRampsButtonClickData();
+  const rampUnifiedV1Enabled = useRampsUnifiedV1Enabled();
+  const isV2UnifiedEnabled = useRampsUnifiedV2Enabled();
+  const region = useSelector(getDetectedGeolocation);
+
+  const trackBuyButtonClicked = useCallback(() => {
+    const rampType = isV2UnifiedEnabled
+      ? 'UNIFIED_BUY_2'
+      : rampUnifiedV1Enabled
+        ? 'UNIFIED_BUY'
+        : 'BUY';
+
+    trackEvent(
+      createEventBuilder(MetaMetricsEvents.RAMPS_BUTTON_CLICKED)
+        .addProperties({
+          button_text: 'Buy',
+          location: 'TokensSection',
+          ramp_type: rampType,
+          region,
+          ramp_routing: buttonClickData.ramp_routing,
+          is_authenticated: buttonClickData.is_authenticated,
+          preferred_provider: buttonClickData.preferred_provider,
+          order_count: buttonClickData.order_count,
+        })
+        .build(),
+    );
+  }, [
+    trackEvent,
+    createEventBuilder,
+    isV2UnifiedEnabled,
+    rampUnifiedV1Enabled,
+    region,
+    buttonClickData,
+  ]);
+
+  return { trackBuyButtonClicked };
+};
diff --git a/app/components/Views/Homepage/components/ViewMoreCard/ViewMoreCard.tsx b/app/components/Views/Homepage/components/ViewMoreCard/ViewMoreCard.tsx
new file mode 100644
index 000000000000..1f5e893bbe46
--- /dev/null
+++ b/app/components/Views/Homepage/components/ViewMoreCard/ViewMoreCard.tsx
@@ -0,0 +1,71 @@
+import React from 'react';
+import { TouchableOpacity } from 'react-native';
+import {
+  Box,
+  Text,
+  Icon,
+  IconName,
+  IconSize,
+  IconColor,
+  BoxAlignItems,
+  BoxJustifyContent,
+  TextVariant,
+  TextColor,
+  FontWeight,
+} from '@metamask/design-system-react-native';
+import { strings } from '../../../../../../locales/i18n';
+
+interface ViewMoreCardProps {
+  onPress: () => void;
+  /** Tailwind classes for the card dimensions, e.g. "w-[180px] h-[140px]" */
+  twClassName: string;
+  textVariant?: TextVariant;
+  activeOpacity?: number;
+  testID?: string;
+}
+
+/**
+ * Shared "View more" card shown at the end of a horizontal carousel.
+ * Renders a circular ArrowRight icon above a label, blending with the background.
+ */
+const ViewMoreCard: React.FC<ViewMoreCardProps> = ({
+  onPress,
+  twClassName,
+  textVariant = TextVariant.BodyMd,
+  activeOpacity,
+  testID,
+}) => (
+  <TouchableOpacity
+    onPress={onPress}
+    activeOpacity={activeOpacity}
+    testID={testID}
+  >
+    <Box
+      twClassName={twClassName}
+      alignItems={BoxAlignItems.Center}
+      justifyContent={BoxJustifyContent.Center}
+      gap={2}
+    >
+      <Box
+        twClassName="w-8 h-8 rounded-full bg-background-muted"
+        alignItems={BoxAlignItems.Center}
+        justifyContent={BoxJustifyContent.Center}
+      >
+        <Icon
+          name={IconName.ArrowRight}
+          size={IconSize.Md}
+          color={IconColor.IconDefault}
+        />
+      </Box>
+      <Text
+        variant={textVariant}
+        fontWeight={FontWeight.Medium}
+        color={TextColor.TextDefault}
+      >
+        {strings('homepage.sections.view_more')}
+      </Text>
+    </Box>
+  </TouchableOpacity>
+);
+
+export default ViewMoreCard;
diff --git a/app/components/Views/Homepage/components/ViewMoreCard/index.ts b/app/components/Views/Homepage/components/ViewMoreCard/index.ts
new file mode 100644
index 000000000000..96eb8b528dee
--- /dev/null
+++ b/app/components/Views/Homepage/components/ViewMoreCard/index.ts
@@ -0,0 +1 @@
+export { default } from './ViewMoreCard';
diff --git a/app/components/Views/Homepage/context/HomepageScrollContext.ts b/app/components/Views/Homepage/context/HomepageScrollContext.ts
new file mode 100644
index 000000000000..17135e40d5a6
--- /dev/null
+++ b/app/components/Views/Homepage/context/HomepageScrollContext.ts
@@ -0,0 +1,56 @@
+import { createContext, useContext } from 'react';
+
+export const HomepageEntryPoints = {
+  APP_OPENED: 'app_opened',
+  HOME_TAB: 'home_tab',
+  NAVIGATED_BACK: 'navigated_back',
+} as const;
+
+export type HomepageEntryPoint =
+  (typeof HomepageEntryPoints)[keyof typeof HomepageEntryPoints];
+
+interface HomepageScrollContextValue {
+  /**
+   * Register a callback to be invoked on every (throttled) scroll event.
+   * Returns an unsubscribe function. Callbacks are called directly — no React
+   * state is updated — so subscribing sections do NOT re-render on scroll.
+   */
+  subscribeToScroll: (callback: () => void) => () => void;
+  /**
+   * Height of the visible viewport (the ScrollView container), in pixels.
+   */
+  viewportHeight: number;
+  /**
+   * Absolute Y position of the scroll container's top edge on screen, in
+   * pixels from the top of the device display (includes status bar, nav bar,
+   * etc.). Used together with viewportHeight to form the correct visible
+   * bounds when checking measureInWindow coordinates.
+   */
+  containerScreenY: number;
+  /**
+   * How the user arrived at the homepage for the current visit.
+   */
+  entryPoint: HomepageEntryPoint;
+  /**
+   * Increments every time the homepage screen receives focus. Sections use
+   * this to reset their "has fired" state and re-fire on every visit.
+   */
+  visitId: number;
+}
+
+const noop = () => () => {
+  // No-op
+};
+
+const defaultValue: HomepageScrollContextValue = {
+  subscribeToScroll: noop,
+  viewportHeight: 0,
+  containerScreenY: 0,
+  entryPoint: HomepageEntryPoints.APP_OPENED,
+  visitId: 0,
+};
+
+export const HomepageScrollContext =
+  createContext<HomepageScrollContextValue>(defaultValue);
+
+export const useHomepageScrollContext = () => useContext(HomepageScrollContext);
diff --git a/app/components/Views/Homepage/hooks/useHomeViewedEvent.test.ts b/app/components/Views/Homepage/hooks/useHomeViewedEvent.test.ts
new file mode 100644
index 000000000000..697cc101dcec
--- /dev/null
+++ b/app/components/Views/Homepage/hooks/useHomeViewedEvent.test.ts
@@ -0,0 +1,529 @@
+import type { RefObject } from 'react';
+import type { View } from 'react-native';
+import { renderHook, act } from '@testing-library/react-hooks';
+import useHomeViewedEvent, { HomeSectionNames } from './useHomeViewedEvent';
+import { MetaMetricsEvents } from '../../../../core/Analytics';
+
+// --- Analytics mock ---
+const mockTrackEvent = jest.fn();
+const mockBuild = jest.fn(() => ({ builtEvent: true }));
+const mockAddProperties = jest.fn(() => ({ build: mockBuild }));
+const mockCreateEventBuilder = jest.fn(() => ({
+  addProperties: mockAddProperties,
+}));
+
+jest.mock('../../../hooks/useAnalytics/useAnalytics', () => ({
+  useAnalytics: () => ({
+    trackEvent: mockTrackEvent,
+    createEventBuilder: mockCreateEventBuilder,
+  }),
+}));
+
+// --- Scroll context mock ---
+let scrollSubscribers: (() => void)[] = [];
+const mockSubscribeToScroll = jest.fn((callback: () => void) => {
+  scrollSubscribers.push(callback);
+  return () => {
+    scrollSubscribers = scrollSubscribers.filter((cb) => cb !== callback);
+  };
+});
+
+const HomeEntryPointsValues = {
+  APP_OPENED: 'app_opened',
+  HOME_TAB: 'home_tab',
+  NAVIGATED_BACK: 'navigated_back',
+} as const;
+
+let mockContextValue = {
+  subscribeToScroll: mockSubscribeToScroll,
+  viewportHeight: 800,
+  containerScreenY: 0,
+  entryPoint: HomeEntryPointsValues.APP_OPENED as string,
+  visitId: 0,
+};
+
+jest.mock('../context/HomepageScrollContext', () => ({
+  useHomepageScrollContext: () => mockContextValue,
+  HomepageEntryPoints: {
+    APP_OPENED: 'app_opened',
+    HOME_TAB: 'home_tab',
+    NAVIGATED_BACK: 'navigated_back',
+  },
+}));
+
+// --- Helpers ---
+const triggerScroll = () => {
+  scrollSubscribers.forEach((cb) => cb());
+};
+
+const createMockRef = (y: number, height: number): RefObject<View> =>
+  ({
+    current: {
+      measureInWindow: jest.fn(
+        (cb: (x: number, y: number, w: number, h: number) => void) =>
+          cb(0, y, 300, height),
+      ),
+    },
+  }) as unknown as RefObject<View>;
+
+const defaultParams = {
+  sectionRef: null as RefObject<View> | null,
+  isLoading: false,
+  sectionName: HomeSectionNames.TOKENS,
+  sectionIndex: 0,
+  totalSectionsLoaded: 5,
+  isEmpty: false,
+  itemCount: 3,
+};
+
+describe('useHomeViewedEvent', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+    scrollSubscribers = [];
+    mockContextValue = {
+      subscribeToScroll: mockSubscribeToScroll,
+      viewportHeight: 800,
+      containerScreenY: 0,
+      entryPoint: HomeEntryPointsValues.APP_OPENED,
+      visitId: 1, // Use 1 as default so "event fires" tests pass; 0 = pre-focus, no fire
+    };
+  });
+
+  describe('null sectionRef — non-rendered sections', () => {
+    it('does not fire when visitId is 0 (pre-focus; avoids duplicate on first load)', () => {
+      mockContextValue = { ...mockContextValue, visitId: 0 };
+      renderHook(() =>
+        useHomeViewedEvent({
+          ...defaultParams,
+          sectionRef: null,
+          isLoading: false,
+        }),
+      );
+
+      expect(mockTrackEvent).not.toHaveBeenCalled();
+    });
+
+    it('fires immediately when sectionRef is null and not loading', () => {
+      renderHook(() =>
+        useHomeViewedEvent({
+          ...defaultParams,
+          sectionRef: null,
+          isLoading: false,
+        }),
+      );
+
+      expect(mockTrackEvent).toHaveBeenCalledTimes(1);
+    });
+
+    it('does not fire when sectionRef is null but still loading', () => {
+      renderHook(() =>
+        useHomeViewedEvent({
+          ...defaultParams,
+          sectionRef: null,
+          isLoading: true,
+        }),
+      );
+
+      expect(mockTrackEvent).not.toHaveBeenCalled();
+    });
+
+    it('fires once loading finishes', () => {
+      const { rerender } = renderHook(
+        ({ isLoading }: { isLoading: boolean }) =>
+          useHomeViewedEvent({
+            ...defaultParams,
+            sectionRef: null,
+            isLoading,
+          }),
+        { initialProps: { isLoading: true } },
+      );
+
+      expect(mockTrackEvent).not.toHaveBeenCalled();
+
+      rerender({ isLoading: false });
+
+      expect(mockTrackEvent).toHaveBeenCalledTimes(1);
+    });
+
+    it('only fires once even after multiple re-renders with null ref', () => {
+      const { rerender } = renderHook(() =>
+        useHomeViewedEvent({
+          ...defaultParams,
+          sectionRef: null,
+          isLoading: false,
+        }),
+      );
+
+      rerender();
+      rerender();
+
+      expect(mockTrackEvent).toHaveBeenCalledTimes(1);
+    });
+  });
+
+  describe('sectionIndex guard', () => {
+    it('does not fire when sectionIndex is -1 (feature flag disabled)', () => {
+      renderHook(() =>
+        useHomeViewedEvent({
+          ...defaultParams,
+          sectionRef: null,
+          isLoading: false,
+          sectionIndex: -1,
+        }),
+      );
+
+      expect(mockTrackEvent).not.toHaveBeenCalled();
+    });
+
+    it('does not fire via scroll check when sectionIndex is -1', () => {
+      const mockRef = createMockRef(0, 200); // fully visible
+      renderHook(() =>
+        useHomeViewedEvent({
+          ...defaultParams,
+          sectionRef: mockRef,
+          sectionIndex: -1,
+        }),
+      );
+
+      act(() => {
+        triggerScroll();
+      });
+
+      expect(mockTrackEvent).not.toHaveBeenCalled();
+    });
+  });
+
+  describe('viewport visibility check', () => {
+    it('fires on mount when section is fully in the viewport', () => {
+      const mockRef = createMockRef(0, 200); // y=0, height=200 → 100% visible
+      renderHook(() =>
+        useHomeViewedEvent({
+          ...defaultParams,
+          sectionRef: mockRef,
+        }),
+      );
+
+      expect(mockTrackEvent).toHaveBeenCalledTimes(1);
+    });
+
+    it('fires on mount when section is exactly 50% visible', () => {
+      // viewportHeight=800, y=700, height=200 → visiblePx=100 = height*0.5
+      const mockRef = createMockRef(700, 200);
+      renderHook(() =>
+        useHomeViewedEvent({
+          ...defaultParams,
+          sectionRef: mockRef,
+        }),
+      );
+
+      expect(mockTrackEvent).toHaveBeenCalledTimes(1);
+    });
+
+    it('does not fire on mount when section is less than 50% visible', () => {
+      // viewportHeight=800, y=750, height=200 → visiblePx=50 < 100
+      const mockRef = createMockRef(750, 200);
+      renderHook(() =>
+        useHomeViewedEvent({
+          ...defaultParams,
+          sectionRef: mockRef,
+        }),
+      );
+
+      expect(mockTrackEvent).not.toHaveBeenCalled();
+    });
+
+    it('does not fire when section is completely below the viewport', () => {
+      // viewportHeight=800, y=800, height=200 → visiblePx=0
+      const mockRef = createMockRef(800, 200);
+      renderHook(() =>
+        useHomeViewedEvent({
+          ...defaultParams,
+          sectionRef: mockRef,
+        }),
+      );
+
+      expect(mockTrackEvent).not.toHaveBeenCalled();
+    });
+
+    it('fires on scroll when section scrolls into ≥50% visibility', () => {
+      const mockRef = createMockRef(800, 200); // starts below viewport
+      renderHook(() =>
+        useHomeViewedEvent({
+          ...defaultParams,
+          sectionRef: mockRef,
+        }),
+      );
+
+      expect(mockTrackEvent).not.toHaveBeenCalled();
+
+      // Scroll so section is now 50% visible
+      const mockRefCurrent = (
+        mockRef as unknown as {
+          current: { measureInWindow: jest.Mock } | null;
+        }
+      ).current;
+      const mockMeasureInWindow = mockRefCurrent?.measureInWindow as
+        | jest.Mock
+        | undefined;
+      mockMeasureInWindow?.mockImplementationOnce(
+        (cb: (x: number, y: number, w: number, h: number) => void) =>
+          cb(0, 700, 300, 200),
+      );
+
+      act(() => {
+        triggerScroll();
+      });
+
+      expect(mockTrackEvent).toHaveBeenCalledTimes(1);
+    });
+
+    it('does not fire again on subsequent scrolls after already firing', () => {
+      const mockRef = createMockRef(0, 200); // fully visible from mount
+      renderHook(() =>
+        useHomeViewedEvent({
+          ...defaultParams,
+          sectionRef: mockRef,
+        }),
+      );
+
+      expect(mockTrackEvent).toHaveBeenCalledTimes(1);
+
+      act(() => {
+        triggerScroll();
+      });
+      act(() => {
+        triggerScroll();
+      });
+
+      expect(mockTrackEvent).toHaveBeenCalledTimes(1);
+    });
+
+    it('does not subscribe to scroll when viewportHeight is 0', () => {
+      mockContextValue = { ...mockContextValue, viewportHeight: 0 };
+      const mockRef = createMockRef(0, 200);
+
+      renderHook(() =>
+        useHomeViewedEvent({
+          ...defaultParams,
+          sectionRef: mockRef,
+        }),
+      );
+
+      expect(mockTrackEvent).not.toHaveBeenCalled();
+      expect(mockSubscribeToScroll).not.toHaveBeenCalled();
+    });
+
+    it('does not fire when measureInWindow reports height of 0', () => {
+      const mockRef = createMockRef(0, 0); // height=0 → guard exits early
+      renderHook(() =>
+        useHomeViewedEvent({
+          ...defaultParams,
+          sectionRef: mockRef,
+        }),
+      );
+
+      expect(mockTrackEvent).not.toHaveBeenCalled();
+    });
+
+    it('fires for a section taller than the viewport when it covers ≥50% of the viewport', () => {
+      // viewportHeight=800, height=2000 → threshold = min(1000, 400) = 400
+      // y=0 → visiblePx = min(2000, 800) - 0 = 800 ≥ 400
+      const mockRef = createMockRef(0, 2000);
+      renderHook(() =>
+        useHomeViewedEvent({
+          ...defaultParams,
+          sectionRef: mockRef,
+        }),
+      );
+
+      expect(mockTrackEvent).toHaveBeenCalledTimes(1);
+    });
+
+    it('does not fire for a tall section covering <50% of the viewport', () => {
+      // viewportHeight=800, height=2000 → threshold = min(1000, 400) = 400
+      // y=450 → visiblePx = min(2450, 800) - 450 = 350 < 400
+      const mockRef = createMockRef(450, 2000);
+      renderHook(() =>
+        useHomeViewedEvent({
+          ...defaultParams,
+          sectionRef: mockRef,
+        }),
+      );
+
+      expect(mockTrackEvent).not.toHaveBeenCalled();
+    });
+  });
+
+  describe('visitId — re-firing on each homepage visit', () => {
+    it('re-fires for null-ref sections when visitId increments', () => {
+      let currentVisitId = 0;
+      const { rerender } = renderHook(() => {
+        mockContextValue = { ...mockContextValue, visitId: currentVisitId };
+        return useHomeViewedEvent({
+          ...defaultParams,
+          sectionRef: null,
+        });
+      });
+
+      expect(mockTrackEvent).not.toHaveBeenCalled(); // visitId=0: pre-focus, no fire
+
+      currentVisitId = 1;
+      rerender();
+
+      expect(mockTrackEvent).toHaveBeenCalledTimes(1);
+
+      currentVisitId = 2;
+      rerender();
+
+      expect(mockTrackEvent).toHaveBeenCalledTimes(2);
+    });
+
+    it('re-fires for visible sections when visitId increments', () => {
+      const mockRef = createMockRef(0, 200);
+      let currentVisitId = 0;
+      const { rerender } = renderHook(() => {
+        mockContextValue = { ...mockContextValue, visitId: currentVisitId };
+        return useHomeViewedEvent({
+          ...defaultParams,
+          sectionRef: mockRef,
+        });
+      });
+
+      expect(mockTrackEvent).not.toHaveBeenCalled(); // visitId=0: pre-focus, no fire
+
+      currentVisitId = 1;
+      rerender();
+
+      expect(mockTrackEvent).toHaveBeenCalledTimes(1);
+
+      currentVisitId = 2;
+      rerender();
+
+      expect(mockTrackEvent).toHaveBeenCalledTimes(2);
+    });
+
+    it('does not re-fire when visitId stays the same', () => {
+      mockContextValue = { ...mockContextValue, visitId: 1 };
+      const { rerender } = renderHook(() =>
+        useHomeViewedEvent({
+          ...defaultParams,
+          sectionRef: null,
+        }),
+      );
+
+      expect(mockTrackEvent).toHaveBeenCalledTimes(1);
+
+      rerender();
+      rerender();
+
+      expect(mockTrackEvent).toHaveBeenCalledTimes(1);
+    });
+  });
+
+  describe('event properties', () => {
+    it('fires with the correct MetaMetrics event', () => {
+      renderHook(() =>
+        useHomeViewedEvent({ ...defaultParams, sectionRef: null }),
+      );
+
+      expect(mockCreateEventBuilder).toHaveBeenCalledWith(
+        MetaMetricsEvents.HOME_VIEWED,
+      );
+    });
+
+    it('includes all required properties', () => {
+      renderHook(() =>
+        useHomeViewedEvent({
+          ...defaultParams,
+          sectionRef: null,
+          sectionName: HomeSectionNames.DEFI,
+          sectionIndex: 2,
+          totalSectionsLoaded: 4,
+          isEmpty: true,
+          itemCount: 0,
+        }),
+      );
+
+      expect(mockAddProperties).toHaveBeenCalledWith({
+        interaction_type: 'section_viewed',
+        location: 'home',
+        section_name: HomeSectionNames.DEFI,
+        section_index: 2,
+        total_sections_loaded: 4,
+        is_empty: true,
+        item_count: 0,
+        entry_point: HomeEntryPointsValues.APP_OPENED,
+      });
+    });
+
+    it('uses the entry_point from context', () => {
+      mockContextValue = {
+        ...mockContextValue,
+        entryPoint: HomeEntryPointsValues.HOME_TAB,
+      };
+
+      renderHook(() =>
+        useHomeViewedEvent({ ...defaultParams, sectionRef: null }),
+      );
+
+      expect(mockAddProperties).toHaveBeenCalledWith(
+        expect.objectContaining({
+          entry_point: HomeEntryPointsValues.HOME_TAB,
+        }),
+      );
+    });
+
+    it('passes the built event to trackEvent', () => {
+      const builtEvent = { builtEvent: true };
+      mockBuild.mockReturnValue(builtEvent);
+
+      renderHook(() =>
+        useHomeViewedEvent({ ...defaultParams, sectionRef: null }),
+      );
+
+      expect(mockTrackEvent).toHaveBeenCalledWith(builtEvent);
+    });
+  });
+
+  describe('scroll subscription lifecycle', () => {
+    it('subscribes to scroll when a sectionRef is provided', () => {
+      const mockRef = createMockRef(800, 200); // below viewport so no immediate fire
+      renderHook(() =>
+        useHomeViewedEvent({
+          ...defaultParams,
+          sectionRef: mockRef,
+        }),
+      );
+
+      expect(mockSubscribeToScroll).toHaveBeenCalledTimes(1);
+    });
+
+    it('unsubscribes from scroll on unmount', () => {
+      const mockRef = createMockRef(800, 200);
+      const { unmount } = renderHook(() =>
+        useHomeViewedEvent({
+          ...defaultParams,
+          sectionRef: mockRef,
+        }),
+      );
+
+      expect(scrollSubscribers).toHaveLength(1);
+
+      unmount();
+
+      expect(scrollSubscribers).toHaveLength(0);
+    });
+
+    it('does not subscribe to scroll for null-ref sections', () => {
+      renderHook(() =>
+        useHomeViewedEvent({
+          ...defaultParams,
+          sectionRef: null,
+          isLoading: false,
+        }),
+      );
+
+      expect(mockSubscribeToScroll).not.toHaveBeenCalled();
+    });
+  });
+});
diff --git a/app/components/Views/Homepage/hooks/useHomeViewedEvent.ts b/app/components/Views/Homepage/hooks/useHomeViewedEvent.ts
new file mode 100644
index 000000000000..f1eb877d7142
--- /dev/null
+++ b/app/components/Views/Homepage/hooks/useHomeViewedEvent.ts
@@ -0,0 +1,169 @@
+import { useCallback, useEffect, useRef, RefObject } from 'react';
+import type { View } from 'react-native';
+import { MetaMetricsEvents } from '../../../../core/Analytics';
+import { useAnalytics } from '../../../hooks/useAnalytics/useAnalytics';
+import { useHomepageScrollContext } from '../context/HomepageScrollContext';
+
+export const HomeSectionNames = {
+  TOKENS: 'tokens',
+  PERPS: 'perps',
+  DEFI: 'defi',
+  PREDICT: 'predict',
+  NFTS: 'nfts',
+} as const;
+
+export type HomeSectionName =
+  (typeof HomeSectionNames)[keyof typeof HomeSectionNames];
+
+interface UseHomeViewedEventParams {
+  /**
+   * Ref to the section's root View. Pass `null` when the section does not
+   * render (e.g. DeFi with no positions) — the event will fire immediately
+   * once `isLoading` is false.
+   */
+  sectionRef: RefObject<View> | null;
+  /** Whether the section data is still being fetched. */
+  isLoading: boolean;
+  sectionName: HomeSectionName;
+  /** 0-based position of this section among all enabled sections. */
+  sectionIndex: number;
+  /** Total number of enabled sections on the page. */
+  totalSectionsLoaded: number;
+  /** True when the section is in empty / placeholder state. */
+  isEmpty: boolean;
+  /**
+   * Number of items shown, regardless of empty or filled state.
+   * E.g. for Tokens: number of token rows. For NFTs in empty state: 0.
+   */
+  itemCount: number;
+}
+
+/**
+ * Fires a `Home Viewed` Segment event when a homepage section enters the
+ * user's viewport (≥ 50 % of the section is visible).
+ *
+ * - Re-fires on every homepage visit (when `visitId` increments).
+ * - For sections that do not render (e.g. DeFi with no positions), fires
+ * immediately once loading has finished (when `sectionRef` is `null`).
+ * - Uses a subscription pattern instead of React state so scroll events do
+ * not trigger re-renders of section components.
+ */
+const useHomeViewedEvent = ({
+  sectionRef,
+  isLoading,
+  sectionName,
+  sectionIndex,
+  totalSectionsLoaded,
+  isEmpty,
+  itemCount,
+}: UseHomeViewedEventParams) => {
+  const {
+    subscribeToScroll,
+    viewportHeight,
+    containerScreenY,
+    entryPoint,
+    visitId,
+  } = useHomepageScrollContext();
+
+  const { trackEvent, createEventBuilder } = useAnalytics();
+
+  const hasFiredRef = useRef(false);
+
+  const fireEvent = useCallback(() => {
+    if (hasFiredRef.current) return;
+    // Wallet initializes visitId to 0 and useFocusEffect sets it to 1 on first
+    // focus. Child effects run before parent effects, so sections can run with
+    // visitId=0 and fire; then the focus effect runs, visitId becomes 1, the
+    // reset effect clears hasFiredRef, and the event fires again. Skip firing
+    // when visitId is 0 so we only fire after the homepage has been focused.
+    if (visitId === 0) return;
+    // sectionIndex is -1 when the section's feature flag is OFF and it is
+    // not included in enabledSections. Don't fire the event in that case.
+    if (sectionIndex < 0) return;
+    hasFiredRef.current = true;
+
+    trackEvent(
+      createEventBuilder(MetaMetricsEvents.HOME_VIEWED)
+        .addProperties({
+          interaction_type: 'section_viewed',
+          location: 'home',
+          section_name: sectionName,
+          section_index: sectionIndex,
+          total_sections_loaded: totalSectionsLoaded,
+          is_empty: isEmpty,
+          item_count: itemCount,
+          entry_point: entryPoint,
+        })
+        .build(),
+    );
+  }, [
+    visitId,
+    sectionName,
+    sectionIndex,
+    totalSectionsLoaded,
+    isEmpty,
+    itemCount,
+    entryPoint,
+    trackEvent,
+    createEventBuilder,
+  ]);
+
+  // Reset on each homepage visit so the event re-fires.
+  useEffect(() => {
+    hasFiredRef.current = false;
+  }, [visitId]);
+
+  // For sections that do NOT render (empty / error / disabled): fire once
+  // loading is done, since there is no View to measure.
+  // visitId is included so this effect re-runs on each homepage visit, allowing
+  // the event to re-fire after hasFiredRef is reset by the effect above.
+  useEffect(() => {
+    if (sectionRef !== null || isLoading) return;
+    fireEvent();
+  }, [sectionRef, isLoading, fireEvent, visitId]);
+
+  // For sections that DO render: check viewport visibility on mount and on
+  // every scroll event. Uses subscribeToScroll so no React re-renders occur
+  // during scrolling.
+  useEffect(() => {
+    if (!sectionRef?.current || viewportHeight === 0) return;
+
+    const checkVisibility = () => {
+      if (hasFiredRef.current) return;
+      sectionRef.current?.measureInWindow((_x, y, _width, height) => {
+        if (height === 0) return;
+        // measureInWindow returns absolute screen coordinates. The visible
+        // bounds of the scroll container are [containerScreenY,
+        // containerScreenY + viewportHeight], not [0, viewportHeight].
+        const viewportTop = containerScreenY;
+        const viewportBottom = containerScreenY + viewportHeight;
+        const visiblePx =
+          Math.min(y + height, viewportBottom) - Math.max(y, viewportTop);
+        // For sections taller than the viewport (e.g. a long NFTs list),
+        // 50% of the section height can exceed the full viewport, making the
+        // event nearly impossible to trigger. Cap the threshold at 50% of
+        // the viewport so tall sections fire reliably.
+        const threshold = Math.min(height * 0.5, viewportHeight * 0.5);
+        if (visiblePx >= threshold) {
+          fireEvent();
+        }
+      });
+    };
+
+    // Initial check (covers sections already in viewport on mount/revisit).
+    checkVisibility();
+
+    // Subscribe to subsequent scroll events.
+    const unsubscribe = subscribeToScroll(checkVisibility);
+    return unsubscribe;
+  }, [
+    visitId,
+    viewportHeight,
+    containerScreenY,
+    sectionRef,
+    subscribeToScroll,
+    fireEvent,
+  ]);
+};
+
+export default useHomeViewedEvent;
diff --git a/app/components/Views/Identity/TurnOnBackupAndSync/TurnOnBackupAndSync.styles.ts b/app/components/Views/Identity/TurnOnBackupAndSync/TurnOnBackupAndSync.styles.ts
deleted file mode 100644
index fc715fb9162a..000000000000
--- a/app/components/Views/Identity/TurnOnBackupAndSync/TurnOnBackupAndSync.styles.ts
+++ /dev/null
@@ -1,52 +0,0 @@
-/* eslint-disable import/prefer-default-export */
-import { StyleSheet } from 'react-native';
-import type { Theme } from '@metamask/design-tokens';
-import Device from '../../../../util/device';
-import scaling from '../../../../util/scaling';
-
-const HEIGHT = scaling.scale(240);
-
-export const createStyles = ({ colors }: Theme) =>
-  StyleSheet.create({
-    wrapper: {
-      flex: 1,
-      alignItems: 'flex-start',
-      backgroundColor: colors.background.default,
-      paddingTop: 60,
-      paddingHorizontal: 16,
-    },
-    card: {
-      height: HEIGHT,
-      width: Device.getDeviceWidth() - 32,
-      alignSelf: 'center',
-      borderRadius: 12,
-      overflow: 'hidden',
-      marginBottom: 32,
-    },
-    image: {
-      resizeMode: 'cover',
-      height: HEIGHT,
-      width: Device.getDeviceWidth() - 32,
-    },
-    btnContainer: {
-      flexDirection: 'row',
-      justifyContent: 'space-between',
-      alignSelf: 'center',
-      marginBottom: 16,
-    },
-    ctaBtn: {
-      margin: 4,
-      width: '48%',
-      alignSelf: 'center',
-    },
-    textSpace: {
-      marginBottom: 16,
-    },
-    textTitle: {
-      marginBottom: 16,
-      alignSelf: 'center',
-    },
-    textSettings: {
-      flexDirection: 'column',
-    },
-  });
diff --git a/app/components/Views/Identity/TurnOnBackupAndSync/TurnOnBackupAndSync.test.tsx b/app/components/Views/Identity/TurnOnBackupAndSync/TurnOnBackupAndSync.test.tsx
deleted file mode 100644
index d2c08208bd7a..000000000000
--- a/app/components/Views/Identity/TurnOnBackupAndSync/TurnOnBackupAndSync.test.tsx
+++ /dev/null
@@ -1,183 +0,0 @@
-import React from 'react';
-
-import TurnOnBackupAndSync, {
-  turnOnBackupAndSyncTestIds,
-} from './TurnOnBackupAndSync';
-import renderWithProvider from '../../../../util/test/renderWithProvider';
-import Routes from '../../../../constants/navigation/Routes';
-import { fireEvent, waitFor } from '@testing-library/react-native';
-import { BACKUPANDSYNC_FEATURES } from '@metamask/profile-sync-controller/user-storage';
-import { useMetrics } from '../../../hooks/useMetrics';
-import { MetricsEventBuilder } from '../../../../core/Analytics/MetricsEventBuilder';
-
-const mockTrackEvent = jest.fn();
-jest.mock('../../../hooks/useMetrics');
-
-(useMetrics as jest.MockedFn<typeof useMetrics>).mockReturnValue({
-  trackEvent: mockTrackEvent,
-  createEventBuilder: MetricsEventBuilder.createEventBuilder,
-  enable: jest.fn(),
-  addTraitsToUser: jest.fn(),
-  createDataDeletionTask: jest.fn(),
-  checkDataDeleteStatus: jest.fn(),
-  getDeleteRegulationCreationDate: jest.fn(),
-  getDeleteRegulationId: jest.fn(),
-  isDataRecorded: jest.fn(),
-  isEnabled: jest.fn(),
-  getMetaMetricsId: jest.fn(),
-});
-
-const MOCK_STORE_STATE = {
-  engine: {
-    backgroundState: {
-      UserStorageController: {
-        isBackupAndSyncEnabled: true,
-      },
-      AuthenticationController: {
-        isSignedIn: true,
-      },
-    },
-  },
-  settings: {
-    basicFunctionalityEnabled: true,
-  },
-};
-
-const { InteractionManager } = jest.requireActual('react-native');
-
-InteractionManager.runAfterInteractions = jest.fn(async (callback) =>
-  callback(),
-);
-
-const mockNavigate = jest.fn();
-jest.mock('@react-navigation/native', () => {
-  const actualNav = jest.requireActual('@react-navigation/native');
-  return {
-    ...actualNav,
-    useNavigation: () => ({
-      navigate: mockNavigate,
-      goBack: jest.fn(),
-    }),
-  };
-});
-
-const mockSetIsBackupAndSyncFeatureEnabled = jest.fn();
-jest.mock('../../../../util/identity/hooks/useBackupAndSync', () => ({
-  useBackupAndSync: () => ({
-    setIsBackupAndSyncFeatureEnabled: mockSetIsBackupAndSyncFeatureEnabled,
-    error: null,
-  }),
-}));
-
-describe('TurnOnBackupAndSync', () => {
-  beforeEach(() => {
-    jest.clearAllMocks();
-  });
-
-  it('renders correctly', () => {
-    const { toJSON } = renderWithProvider(<TurnOnBackupAndSync />, {
-      state: MOCK_STORE_STATE,
-    });
-    expect(toJSON()).toMatchSnapshot();
-  });
-
-  it('sends a MetaMetrics event when the modal is dismissed', () => {
-    const { getByTestId } = renderWithProvider(<TurnOnBackupAndSync />, {
-      state: MOCK_STORE_STATE,
-    });
-
-    const cancelButton = getByTestId(turnOnBackupAndSyncTestIds.cancelButton);
-    fireEvent.press(cancelButton);
-
-    expect(mockTrackEvent).toHaveBeenCalledWith(
-      expect.objectContaining({
-        name: 'Profile Activity Updated',
-        properties: expect.objectContaining({
-          feature_name: 'Backup And Sync Carousel Modal',
-          action: 'Modal Dismissed',
-        }),
-      }),
-    );
-  });
-
-  it('enables backup and sync when clicking on the cta if backup and sync is disabled, and navigates to backup and sync settings either way', async () => {
-    const { getByTestId } = renderWithProvider(<TurnOnBackupAndSync />, {
-      state: {
-        ...MOCK_STORE_STATE,
-        engine: {
-          backgroundState: {
-            ...MOCK_STORE_STATE.engine.backgroundState,
-            UserStorageController: {
-              isBackupAndSyncEnabled: false,
-            },
-          },
-        },
-      },
-    });
-
-    const switchElement = getByTestId(turnOnBackupAndSyncTestIds.enableButton);
-    fireEvent.press(switchElement);
-
-    await waitFor(() => {
-      expect(mockSetIsBackupAndSyncFeatureEnabled).toHaveBeenCalledWith(
-        BACKUPANDSYNC_FEATURES.main,
-        true,
-      );
-      expect(mockNavigate).toHaveBeenCalledWith(Routes.SETTINGS_VIEW, {
-        screen: Routes.SETTINGS.BACKUP_AND_SYNC,
-      });
-    });
-  });
-
-  it('opens a modal when clicking on the cta while basic functionality is off', () => {
-    const { getByTestId } = renderWithProvider(<TurnOnBackupAndSync />, {
-      state: {
-        ...MOCK_STORE_STATE,
-        engine: {
-          backgroundState: {
-            ...MOCK_STORE_STATE.engine.backgroundState,
-            UserStorageController: {
-              isBackupAndSyncEnabled: false,
-            },
-          },
-        },
-        settings: {
-          ...MOCK_STORE_STATE.settings,
-          basicFunctionalityEnabled: false,
-        },
-      },
-    });
-
-    const switchElement = getByTestId(turnOnBackupAndSyncTestIds.enableButton);
-    fireEvent.press(switchElement);
-
-    expect(mockNavigate).toHaveBeenCalledWith(Routes.MODAL.ROOT_MODAL_FLOW, {
-      screen: Routes.SHEET.CONFIRM_TURN_ON_BACKUP_AND_SYNC,
-      params: {
-        enableBackupAndSync: expect.any(Function),
-        trackEnableBackupAndSyncEvent: expect.any(Function),
-      },
-    });
-  });
-
-  it('sends a MetaMetrics event when enabling backup and sync', async () => {
-    const { getByTestId } = renderWithProvider(<TurnOnBackupAndSync />, {
-      state: MOCK_STORE_STATE,
-    });
-
-    const switchElement = getByTestId(turnOnBackupAndSyncTestIds.enableButton);
-    fireEvent.press(switchElement);
-
-    await waitFor(() => {
-      expect(mockTrackEvent).toHaveBeenCalledWith(
-        expect.objectContaining({
-          name: 'Profile Activity Updated',
-          properties: expect.objectContaining({
-            feature_name: 'Backup And Sync Carousel Modal',
-            action: 'Turned On',
-          }),
-        }),
-      );
-    });
-  });
-});
diff --git a/app/components/Views/Identity/TurnOnBackupAndSync/TurnOnBackupAndSync.tsx b/app/components/Views/Identity/TurnOnBackupAndSync/TurnOnBackupAndSync.tsx
deleted file mode 100644
index 25cd0ea5e9e3..000000000000
--- a/app/components/Views/Identity/TurnOnBackupAndSync/TurnOnBackupAndSync.tsx
+++ /dev/null
@@ -1,180 +0,0 @@
-import React, { Fragment } from 'react';
-import { Image, View, Linking, ScrollView } from 'react-native';
-
-import Button, {
-  ButtonVariants,
-} from '../../../../component-library/components/Buttons/Button';
-import { strings } from '../../../../../locales/i18n';
-import Text, {
-  TextColor,
-  TextVariant,
-} from '../../../../component-library/components/Texts/Text';
-import { useTheme } from '../../../../util/theme';
-import EnableBackupAndSyncCardImage from '../../../../images/enableBackupAndSyncCard.png';
-import { createStyles } from './TurnOnBackupAndSync.styles';
-import AppConstants from '../../../../core/AppConstants';
-import SwitchLoadingModal from '../../../UI/Notification/SwitchLoadingModal';
-import { useNavigation } from '@react-navigation/native';
-import { useSelector } from 'react-redux';
-import { RootState } from '../../../../reducers';
-import { selectIsBackupAndSyncEnabled } from '../../../../selectors/identity';
-import Routes from '../../../../constants/navigation/Routes';
-import { useBackupAndSync } from '../../../../util/identity/hooks/useBackupAndSync';
-import { BACKUPANDSYNC_FEATURES } from '@metamask/profile-sync-controller/user-storage';
-import { MetaMetricsEvents, useMetrics } from '../../../hooks/useMetrics';
-import { selectIsMetamaskNotificationsEnabled } from '../../../../selectors/notifications';
-
-export const turnOnBackupAndSyncTestIds = {
-  view: 'turn-on-backup-and-sync-view',
-  cancelButton: 'turn-on-backup-and-sync-cancel-button',
-  enableButton: 'turn-on-backup-and-sync-enable-button',
-};
-
-const TurnOnBackupAndSync = () => {
-  const theme = useTheme();
-  const styles = createStyles(theme);
-  const navigation = useNavigation();
-
-  const { setIsBackupAndSyncFeatureEnabled } = useBackupAndSync();
-  const { trackEvent, createEventBuilder } = useMetrics();
-
-  const isBasicFunctionalityEnabled = useSelector((state: RootState) =>
-    Boolean(state?.settings?.basicFunctionalityEnabled),
-  );
-  const isBackupAndSyncEnabled = useSelector(selectIsBackupAndSyncEnabled);
-  const isMetamaskNotificationsEnabled = useSelector(
-    selectIsMetamaskNotificationsEnabled,
-  );
-
-  const goToLearnMore = () => {
-    Linking.openURL(AppConstants.URLS.PROFILE_SYNC);
-  };
-
-  const trackEnableBackupAndSyncEvent = (newValue: boolean) => {
-    trackEvent(
-      createEventBuilder(MetaMetricsEvents.SETTINGS_UPDATED)
-        .addProperties({
-          settings_group: 'security_privacy',
-          settings_type: 'profile_syncing',
-          old_value: !newValue,
-          new_value: newValue,
-          was_notifications_on: isMetamaskNotificationsEnabled,
-        })
-        .build(),
-    );
-  };
-
-  const handleGoBack = () => {
-    trackEvent(
-      createEventBuilder(MetaMetricsEvents.PROFILE_ACTIVITY_UPDATED)
-        .addProperties({
-          feature_name: 'Backup And Sync Carousel Modal',
-          action: 'Modal Dismissed',
-        })
-        .build(),
-    );
-    navigation.goBack();
-  };
-
-  const handleEnableBackupAndSync = async () => {
-    trackEvent(
-      createEventBuilder(MetaMetricsEvents.PROFILE_ACTIVITY_UPDATED)
-        .addProperties({
-          feature_name: 'Backup And Sync Carousel Modal',
-          action: 'Turned On',
-        })
-        .build(),
-    );
-
-    if (!isBasicFunctionalityEnabled) {
-      navigation.navigate(Routes.MODAL.ROOT_MODAL_FLOW, {
-        screen: Routes.SHEET.CONFIRM_TURN_ON_BACKUP_AND_SYNC,
-        params: {
-          enableBackupAndSync: async () => {
-            navigation.navigate(Routes.SETTINGS_VIEW, {
-              screen: Routes.SETTINGS.BACKUP_AND_SYNC,
-            });
-            await setIsBackupAndSyncFeatureEnabled(
-              BACKUPANDSYNC_FEATURES.main,
-              true,
-            );
-          },
-          trackEnableBackupAndSyncEvent,
-        },
-      });
-      return;
-    }
-    if (!isBackupAndSyncEnabled) {
-      await setIsBackupAndSyncFeatureEnabled(BACKUPANDSYNC_FEATURES.main, true);
-    }
-    navigation.navigate(Routes.SETTINGS_VIEW, {
-      screen: Routes.SETTINGS.BACKUP_AND_SYNC,
-    });
-  };
-
-  return (
-    <Fragment>
-      <View style={styles.wrapper} testID={turnOnBackupAndSyncTestIds.view}>
-        <Text
-          variant={TextVariant.HeadingMD}
-          color={TextColor.Default}
-          style={styles.textTitle}
-        >
-          {strings('backupAndSync.enable.title')}
-        </Text>
-        <ScrollView>
-          <View style={styles.card}>
-            <Image source={EnableBackupAndSyncCardImage} style={styles.image} />
-          </View>
-          <Text
-            variant={TextVariant.BodyMD}
-            color={TextColor.Alternative}
-            style={styles.textSpace}
-          >
-            {strings('backupAndSync.enable.description')}{' '}
-            <Text
-              variant={TextVariant.BodyMD}
-              color={TextColor.Info}
-              onPress={goToLearnMore}
-            >
-              {strings('backupAndSync.privacyLink')}
-            </Text>
-          </Text>
-          <Text
-            style={styles.textSettings}
-            variant={TextVariant.BodyMD}
-            color={TextColor.Alternative}
-          >
-            {strings('backupAndSync.enable.updatePreferences')}
-          </Text>
-          <Text variant={TextVariant.BodyMDBold}>
-            {strings('backupAndSync.enable.settingsPath')}
-          </Text>
-        </ScrollView>
-
-        <View style={styles.btnContainer}>
-          <Button
-            variant={ButtonVariants.Secondary}
-            label={strings('notifications.activation_card.cancel')}
-            onPress={handleGoBack}
-            style={styles.ctaBtn}
-            testID={turnOnBackupAndSyncTestIds.cancelButton}
-          />
-          <Button
-            variant={ButtonVariants.Primary}
-            label={strings('notifications.activation_card.cta')}
-            onPress={handleEnableBackupAndSync}
-            style={styles.ctaBtn}
-            testID={turnOnBackupAndSyncTestIds.enableButton}
-          />
-        </View>
-      </View>
-      <SwitchLoadingModal
-        loading={false}
-        loadingText={strings('app_settings.enabling_notifications')}
-      />
-    </Fragment>
-  );
-};
-
-export default TurnOnBackupAndSync;
diff --git a/app/components/Views/Identity/TurnOnBackupAndSync/__snapshots__/TurnOnBackupAndSync.test.tsx.snap b/app/components/Views/Identity/TurnOnBackupAndSync/__snapshots__/TurnOnBackupAndSync.test.tsx.snap
deleted file mode 100644
index 1cc9b9d31363..000000000000
--- a/app/components/Views/Identity/TurnOnBackupAndSync/__snapshots__/TurnOnBackupAndSync.test.tsx.snap
+++ /dev/null
@@ -1,214 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`TurnOnBackupAndSync renders correctly 1`] = `
-[
-  <View
-    style={
-      {
-        "alignItems": "flex-start",
-        "backgroundColor": "#ffffff",
-        "flex": 1,
-        "paddingHorizontal": 16,
-        "paddingTop": 60,
-      }
-    }
-    testID="turn-on-backup-and-sync-view"
-  >
-    <Text
-      accessibilityRole="text"
-      style={
-        {
-          "alignSelf": "center",
-          "color": "#121314",
-          "fontFamily": "Geist-Bold",
-          "fontSize": 18,
-          "letterSpacing": 0,
-          "lineHeight": 24,
-          "marginBottom": 16,
-        }
-      }
-    >
-      Turn on backup and sync
-    </Text>
-    <RCTScrollView>
-      <View>
-        <View
-          style={
-            {
-              "alignSelf": "center",
-              "borderRadius": 12,
-              "height": 240,
-              "marginBottom": 32,
-              "overflow": "hidden",
-              "width": 718,
-            }
-          }
-        >
-          <Image
-            source={1}
-            style={
-              {
-                "height": 240,
-                "resizeMode": "cover",
-                "width": 718,
-              }
-            }
-          />
-        </View>
-        <Text
-          accessibilityRole="text"
-          style={
-            {
-              "color": "#686e7d",
-              "fontFamily": "Geist-Regular",
-              "fontSize": 16,
-              "letterSpacing": 0,
-              "lineHeight": 24,
-              "marginBottom": 16,
-            }
-          }
-        >
-          Backup and sync lets us store encrypted data for your custom settings and features. This keeps your MetaMask experience the same across devices and restores settings and features if you ever need to reinstall MetaMask. This doesn’t back up your Secret Recovery Phrase.
-           
-          <Text
-            accessibilityRole="text"
-            onPress={[Function]}
-            style={
-              {
-                "color": "#4459ff",
-                "fontFamily": "Geist-Regular",
-                "fontSize": 16,
-                "letterSpacing": 0,
-                "lineHeight": 24,
-              }
-            }
-          >
-            Learn how we protect your privacy
-          </Text>
-        </Text>
-        <Text
-          accessibilityRole="text"
-          style={
-            {
-              "color": "#686e7d",
-              "flexDirection": "column",
-              "fontFamily": "Geist-Regular",
-              "fontSize": 16,
-              "letterSpacing": 0,
-              "lineHeight": 24,
-            }
-          }
-        >
-          You can update your preferences at any time in
-        </Text>
-        <Text
-          accessibilityRole="text"
-          style={
-            {
-              "color": "#121314",
-              "fontFamily": "Geist-Bold",
-              "fontSize": 16,
-              "letterSpacing": 0,
-              "lineHeight": 24,
-            }
-          }
-        >
-          Settings &gt; Backup and sync.
-        </Text>
-      </View>
-    </RCTScrollView>
-    <View
-      style={
-        {
-          "alignSelf": "center",
-          "flexDirection": "row",
-          "justifyContent": "space-between",
-          "marginBottom": 16,
-        }
-      }
-    >
-      <TouchableOpacity
-        accessibilityRole="button"
-        accessible={true}
-        activeOpacity={1}
-        onPress={[Function]}
-        onPressIn={[Function]}
-        onPressOut={[Function]}
-        style={
-          {
-            "alignItems": "center",
-            "alignSelf": "center",
-            "backgroundColor": "#3c4d9d0f",
-            "borderColor": "transparent",
-            "borderRadius": 12,
-            "borderWidth": 1,
-            "flexDirection": "row",
-            "height": 40,
-            "justifyContent": "center",
-            "margin": 4,
-            "overflow": "hidden",
-            "paddingHorizontal": 16,
-            "width": "48%",
-          }
-        }
-        testID="turn-on-backup-and-sync-cancel-button"
-      >
-        <Text
-          accessibilityRole="text"
-          style={
-            {
-              "color": "#121314",
-              "fontFamily": "Geist-Medium",
-              "fontSize": 16,
-              "letterSpacing": 0,
-              "lineHeight": 24,
-            }
-          }
-        >
-          Cancel
-        </Text>
-      </TouchableOpacity>
-      <TouchableOpacity
-        accessibilityRole="button"
-        accessible={true}
-        activeOpacity={1}
-        onPress={[Function]}
-        onPressIn={[Function]}
-        onPressOut={[Function]}
-        style={
-          {
-            "alignItems": "center",
-            "alignSelf": "center",
-            "backgroundColor": "#121314",
-            "borderRadius": 12,
-            "flexDirection": "row",
-            "height": 40,
-            "justifyContent": "center",
-            "margin": 4,
-            "overflow": "hidden",
-            "paddingHorizontal": 16,
-            "width": "48%",
-          }
-        }
-        testID="turn-on-backup-and-sync-enable-button"
-      >
-        <Text
-          accessibilityRole="text"
-          style={
-            {
-              "color": "#ffffff",
-              "fontFamily": "Geist-Medium",
-              "fontSize": 16,
-              "letterSpacing": 0,
-              "lineHeight": 24,
-            }
-          }
-        >
-          Turn on
-        </Text>
-      </TouchableOpacity>
-    </View>
-  </View>,
-  <View />,
-]
-`;
diff --git a/app/components/Views/ImportFromSecretRecoveryPhrase/__snapshots__/index.test.tsx.snap b/app/components/Views/ImportFromSecretRecoveryPhrase/__snapshots__/index.test.tsx.snap
index c85436d2915e..b7f7a44b4ade 100644
--- a/app/components/Views/ImportFromSecretRecoveryPhrase/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/ImportFromSecretRecoveryPhrase/__snapshots__/index.test.tsx.snap
@@ -121,7 +121,7 @@ exports[`ImportFromSecretRecoveryPhrase Import a wallet UI render matches snapsh
                 testID="import-from-seed-screen-back-button-id"
               >
                 <SvgMock
-                  color="#121314"
+                  color="#131416"
                   fill="currentColor"
                   height={24}
                   name="ArrowLeft"
@@ -181,7 +181,7 @@ exports[`ImportFromSecretRecoveryPhrase Import a wallet UI render matches snapsh
                 testID="import-from-seed-screen-qr-code-button-id"
               >
                 <SvgMock
-                  color="#121314"
+                  color="#131416"
                   fill="currentColor"
                   height={24}
                   name="Scan"
@@ -429,7 +429,7 @@ exports[`ImportFromSecretRecoveryPhrase Import a wallet UI render matches snapsh
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Bold",
                                   "fontSize": 32,
                                   "letterSpacing": 0,
@@ -460,7 +460,7 @@ exports[`ImportFromSecretRecoveryPhrase Import a wallet UI render matches snapsh
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#686e7d",
+                                      "color": "#66676a",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "letterSpacing": 0,
@@ -475,7 +475,7 @@ exports[`ImportFromSecretRecoveryPhrase Import a wallet UI render matches snapsh
                                   testID="import-from-seed-screen-seedphrase-link-id"
                                 >
                                   <SvgMock
-                                    color="#686e7d"
+                                    color="#66676a"
                                     fill="currentColor"
                                     height={20}
                                     name="Info"
@@ -502,7 +502,7 @@ exports[`ImportFromSecretRecoveryPhrase Import a wallet UI render matches snapsh
                                 <View
                                   style={
                                     {
-                                      "backgroundColor": "#f3f5f9",
+                                      "backgroundColor": "#f3f3f4",
                                       "borderRadius": 10,
                                       "maxHeight": "auto",
                                       "minHeight": 210,
@@ -548,8 +548,8 @@ exports[`ImportFromSecretRecoveryPhrase Import a wallet UI render matches snapsh
                                         style={
                                           {
                                             "alignItems": "center",
-                                            "backgroundColor": "#3c4d9d0f",
-                                            "borderColor": "#b7bbc866",
+                                            "backgroundColor": "#b4b4b528",
+                                            "borderColor": "#b4b4b566",
                                             "borderRadius": 12,
                                             "borderWidth": 1,
                                             "flexDirection": "row",
@@ -593,7 +593,7 @@ exports[`ImportFromSecretRecoveryPhrase Import a wallet UI render matches snapsh
                                             onSelectionChange={[Function]}
                                             onSubmitEditing={[Function]}
                                             placeholder=""
-                                            placeholderTextColor="#b7bbc8"
+                                            placeholderTextColor="#babbbe"
                                             returnKeyType="done"
                                             showSoftInputOnFocus={true}
                                             spellCheck={false}
@@ -602,7 +602,7 @@ exports[`ImportFromSecretRecoveryPhrase Import a wallet UI render matches snapsh
                                                 "backgroundColor": "transparent",
                                                 "borderColor": "transparent",
                                                 "borderWidth": 1,
-                                                "color": "#686e7d",
+                                                "color": "#66676a",
                                                 "display": "flex",
                                                 "fontFamily": "Geist-Regular",
                                                 "fontSize": 16,
@@ -647,7 +647,7 @@ exports[`ImportFromSecretRecoveryPhrase Import a wallet UI render matches snapsh
                                           {
                                             "alignItems": "center",
                                             "backgroundColor": "transparent",
-                                            "borderColor": "#b7bbc866",
+                                            "borderColor": "#b4b4b566",
                                             "borderRadius": 12,
                                             "borderWidth": 0,
                                             "display": "flex",
@@ -691,7 +691,7 @@ exports[`ImportFromSecretRecoveryPhrase Import a wallet UI render matches snapsh
                                             onSelectionChange={[Function]}
                                             onSubmitEditing={[Function]}
                                             placeholder="Add a space between each word and make sure no one is watching."
-                                            placeholderTextColor="#686e7d"
+                                            placeholderTextColor="#66676a"
                                             returnKeyType="done"
                                             showSoftInputOnFocus={true}
                                             spellCheck={false}
@@ -700,7 +700,7 @@ exports[`ImportFromSecretRecoveryPhrase Import a wallet UI render matches snapsh
                                                 "backgroundColor": "transparent",
                                                 "borderColor": "transparent",
                                                 "borderWidth": 1,
-                                                "color": "#686e7d",
+                                                "color": "#66676a",
                                                 "display": "flex",
                                                 "fontFamily": "Geist-Regular",
                                                 "fontSize": 16,
@@ -770,7 +770,7 @@ exports[`ImportFromSecretRecoveryPhrase Import a wallet UI render matches snapsh
                             {
                               "alignItems": "center",
                               "alignSelf": "stretch",
-                              "backgroundColor": "#121314",
+                              "backgroundColor": "#131416",
                               "borderRadius": 12,
                               "flexDirection": "row",
                               "height": 48,
diff --git a/app/components/Views/ImportNewSecretRecoveryPhrase/index.test.tsx b/app/components/Views/ImportNewSecretRecoveryPhrase/index.test.tsx
index 87c8477bb7dc..5c21a3af9db7 100644
--- a/app/components/Views/ImportNewSecretRecoveryPhrase/index.test.tsx
+++ b/app/components/Views/ImportNewSecretRecoveryPhrase/index.test.tsx
@@ -11,8 +11,9 @@ import {
 } from '../../../selectors/keyringController/testUtils';
 import { KeyringTypes } from '@metamask/keyring-controller';
 import { MetaMetricsEvents } from '../../../core/Analytics';
-import { MetricsEventBuilder } from '../../../core/Analytics/MetricsEventBuilder';
-import useMetrics from '../../hooks/useMetrics/useMetrics';
+import { AnalyticsEventBuilder } from '../../../util/analytics/AnalyticsEventBuilder';
+import { useAnalytics } from '../../hooks/useAnalytics/useAnalytics';
+import type { UseAnalyticsHook } from '../../hooks/useAnalytics/useAnalytics.types';
 import {
   ImportNewSecretRecoveryPhraseOptions,
   ImportNewSecretRecoveryPhraseReturnType,
@@ -96,9 +97,8 @@ jest.mock('@react-native-clipboard/clipboard', () => ({
   getString: jest.fn(),
 }));
 
-jest.mock('../../hooks/useMetrics/useMetrics', () => ({
-  __esModule: true,
-  default: jest.fn(),
+jest.mock('../../hooks/useAnalytics/useAnalytics', () => ({
+  useAnalytics: jest.fn(),
 }));
 
 jest.mock('react', () => ({
@@ -193,10 +193,10 @@ describe('ImportNewSecretRecoveryPhrase', () => {
       },
     );
 
-    (useMetrics as jest.Mock).mockReturnValue({
+    jest.mocked(useAnalytics).mockReturnValue({
       trackEvent: mockTrackEvent,
-      createEventBuilder: MetricsEventBuilder.createEventBuilder,
-    });
+      createEventBuilder: AnalyticsEventBuilder.createEventBuilder,
+    } as unknown as UseAnalyticsHook);
 
     mockCheckIsSeedlessPasswordOutdated.mockResolvedValue(false);
 
@@ -426,7 +426,7 @@ describe('ImportNewSecretRecoveryPhrase', () => {
     );
 
     expect(mockTrackEvent).toHaveBeenCalledWith(
-      MetricsEventBuilder.createEventBuilder(
+      AnalyticsEventBuilder.createEventBuilder(
         MetaMetricsEvents.IMPORT_SECRET_RECOVERY_PHRASE_COMPLETED,
       )
         .addProperties({
diff --git a/app/components/Views/ImportNewSecretRecoveryPhrase/index.tsx b/app/components/Views/ImportNewSecretRecoveryPhrase/index.tsx
index 629250893890..4e424a8fc030 100644
--- a/app/components/Views/ImportNewSecretRecoveryPhrase/index.tsx
+++ b/app/components/Views/ImportNewSecretRecoveryPhrase/index.tsx
@@ -36,14 +36,15 @@ import {
   IconColor,
 } from '@metamask/design-system-react-native';
 import { IconName as ComponentIconName } from '../../../component-library/components/Icons/Icon';
-import HeaderStackedStandard from '../../../component-library/components-temp/HeaderStackedStandard';
+import HeaderCompactStandard from '../../../component-library/components-temp/HeaderCompactStandard';
+import TitleStandard from '../../../component-library/components-temp/TitleStandard';
 import {
   ToastContext,
   ToastVariants,
 } from '../../../component-library/components/Toast';
 import { useSelector } from 'react-redux';
 import { selectHDKeyrings } from '../../../selectors/keyringController';
-import useMetrics from '../../hooks/useMetrics/useMetrics';
+import { useAnalytics } from '../../hooks/useAnalytics/useAnalytics';
 import { MetaMetricsEvents } from '../../../core/Analytics';
 import { useAccountsWithNetworkActivitySync } from '../../hooks/useAccountsWithNetworkActivitySync';
 import { Authentication } from '../../../core';
@@ -87,7 +88,7 @@ const ImportNewSecretRecoveryPhrase = () => {
   const isKeyboardVisible = useKeyboardState((state) => state.isVisible);
 
   const hdKeyrings = useSelector(selectHDKeyrings);
-  const { trackEvent, createEventBuilder } = useMetrics();
+  const { trackEvent, createEventBuilder } = useAnalytics();
   const { fetchAccountsWithActivity } = useAccountsWithNetworkActivitySync({
     onFirstLoad: false,
     onTransactionComplete: false,
@@ -242,7 +243,7 @@ const ImportNewSecretRecoveryPhrase = () => {
 
   const content = (
     <SafeAreaView edges={{ bottom: 'additive' }} style={styles.mainWrapper}>
-      <HeaderStackedStandard
+      <HeaderCompactStandard
         includesTopInset
         backButtonProps={{
           onPress: dismiss,
@@ -255,29 +256,26 @@ const ImportNewSecretRecoveryPhrase = () => {
             testID: 'qr-code-button',
           },
         ]}
-        titleStandardProps={{
-          testID: ImportSRPIDs.SCREEN_TITLE_ID,
-          title: strings(
-            'import_new_secret_recovery_phrase.import_wallet_title',
-          ),
-          bottomAccessory: (
-            <View style={styles.subtitleContainer}>
-              <Text variant={TextVariant.BodyMD} color={TextColor.Alternative}>
-                {strings(
-                  'import_new_secret_recovery_phrase.enter_srp_subtitle',
-                )}
-              </Text>
-              <ButtonIcon
-                iconName={IconName.Info}
-                iconProps={{
-                  color: IconColor.IconAlternative,
-                }}
-                onPress={showWhatIsSeedPhrase}
-                testID="info-icon"
-              />
-            </View>
-          ),
-        }}
+      />
+      <TitleStandard
+        testID={ImportSRPIDs.SCREEN_TITLE_ID}
+        title={strings('import_new_secret_recovery_phrase.import_wallet_title')}
+        bottomAccessory={
+          <View style={styles.subtitleContainer}>
+            <Text variant={TextVariant.BodyMD} color={TextColor.Alternative}>
+              {strings('import_new_secret_recovery_phrase.enter_srp_subtitle')}
+            </Text>
+            <ButtonIcon
+              iconName={IconName.Info}
+              iconProps={{
+                color: IconColor.IconAlternative,
+              }}
+              onPress={showWhatIsSeedPhrase}
+              testID="info-icon"
+            />
+          </View>
+        }
+        twClassName="px-4 pt-1 pb-3"
       />
       <KeyboardAwareScrollView
         contentContainerStyle={styles.wrapper}
diff --git a/app/components/Views/ImportPrivateKey/__snapshots__/index.test.tsx.snap b/app/components/Views/ImportPrivateKey/__snapshots__/index.test.tsx.snap
index 181bd6eb532b..572f9d716d9e 100644
--- a/app/components/Views/ImportPrivateKey/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/ImportPrivateKey/__snapshots__/index.test.tsx.snap
@@ -381,124 +381,159 @@ exports[`ImportPrivateKey render matches snapshot 1`] = `
                               style={
                                 [
                                   {
-                                    "display": "flex",
+                                    "alignItems": "center",
+                                    "flexDirection": "row",
+                                    "gap": 16,
+                                    "minHeight": 56,
+                                    "paddingLeft": 8,
+                                    "paddingRight": 8,
+                                  },
+                                  {
+                                    "marginTop": 0,
                                   },
                                   undefined,
                                 ]
                               }
+                              testID="header"
                             >
-                              <View
-                                style={
-                                  [
-                                    {
-                                      "alignItems": "center",
-                                      "flexDirection": "row",
-                                      "gap": 16,
-                                      "minHeight": 56,
-                                      "paddingLeft": 8,
-                                      "paddingRight": 8,
-                                    },
-                                    {
-                                      "marginTop": 0,
-                                    },
-                                    undefined,
-                                  ]
-                                }
-                                testID="header"
-                              >
-                                <View>
+                              <View>
+                                <View
+                                  onLayout={[Function]}
+                                >
                                   <View
-                                    onLayout={[Function]}
-                                  >
-                                    <View
-                                      accessibilityState={
-                                        {
-                                          "busy": undefined,
-                                          "checked": undefined,
-                                          "disabled": false,
-                                          "expanded": undefined,
-                                          "selected": undefined,
-                                        }
+                                    accessibilityState={
+                                      {
+                                        "busy": undefined,
+                                        "checked": undefined,
+                                        "disabled": false,
+                                        "expanded": undefined,
+                                        "selected": undefined,
                                       }
-                                      accessibilityValue={
-                                        {
-                                          "max": undefined,
-                                          "min": undefined,
-                                          "now": undefined,
-                                          "text": undefined,
-                                        }
+                                    }
+                                    accessibilityValue={
+                                      {
+                                        "max": undefined,
+                                        "min": undefined,
+                                        "now": undefined,
+                                        "text": undefined,
                                       }
-                                      accessible={true}
-                                      collapsable={false}
-                                      focusable={true}
-                                      onBlur={[Function]}
-                                      onClick={[Function]}
-                                      onFocus={[Function]}
-                                      onResponderGrant={[Function]}
-                                      onResponderMove={[Function]}
-                                      onResponderRelease={[Function]}
-                                      onResponderTerminate={[Function]}
-                                      onResponderTerminationRequest={[Function]}
-                                      onStartShouldSetResponder={[Function]}
+                                    }
+                                    accessible={true}
+                                    collapsable={false}
+                                    focusable={true}
+                                    onBlur={[Function]}
+                                    onClick={[Function]}
+                                    onFocus={[Function]}
+                                    onResponderGrant={[Function]}
+                                    onResponderMove={[Function]}
+                                    onResponderRelease={[Function]}
+                                    onResponderTerminate={[Function]}
+                                    onResponderTerminationRequest={[Function]}
+                                    onStartShouldSetResponder={[Function]}
+                                    style={
+                                      [
+                                        {
+                                          "alignItems": "center",
+                                          "backgroundColor": "transparent",
+                                          "borderRadius": 8,
+                                          "height": 32,
+                                          "justifyContent": "center",
+                                          "opacity": 1,
+                                          "width": 32,
+                                        },
+                                        undefined,
+                                        {
+                                          "transform": [
+                                            {
+                                              "scale": 1,
+                                            },
+                                          ],
+                                        },
+                                      ]
+                                    }
+                                    testID="close-button-on-account-screen"
+                                  >
+                                    <SvgMock
+                                      fill="currentColor"
+                                      name="ArrowLeft"
                                       style={
                                         [
                                           {
-                                            "alignItems": "center",
-                                            "backgroundColor": "transparent",
-                                            "borderRadius": 8,
-                                            "height": 32,
-                                            "justifyContent": "center",
-                                            "opacity": 1,
-                                            "width": 32,
+                                            "color": "#131416",
+                                            "height": 24,
+                                            "width": 24,
                                           },
                                           undefined,
-                                          {
-                                            "transform": [
-                                              {
-                                                "scale": 1,
-                                              },
-                                            ],
-                                          },
                                         ]
                                       }
-                                      testID="close-button-on-account-screen"
-                                    >
-                                      <SvgMock
-                                        fill="currentColor"
-                                        name="ArrowLeft"
-                                        style={
-                                          [
-                                            {
-                                              "color": "#121314",
-                                              "height": 24,
-                                              "width": 24,
-                                            },
-                                            undefined,
-                                          ]
-                                        }
-                                      />
-                                    </View>
+                                    />
                                   </View>
                                 </View>
+                              </View>
+                              <View
+                                style={
+                                  [
+                                    {
+                                      "alignItems": "center",
+                                      "display": "flex",
+                                      "flexBasis": "0%",
+                                      "flexGrow": 1,
+                                      "flexShrink": 1,
+                                    },
+                                    undefined,
+                                  ]
+                                }
+                              />
+                              <View>
                                 <View
+                                  onLayout={[Function]}
+                                />
+                              </View>
+                            </View>
+                            <View
+                              style={
+                                [
+                                  {
+                                    "display": "flex",
+                                    "paddingBottom": 12,
+                                    "paddingLeft": 16,
+                                    "paddingRight": 16,
+                                    "paddingTop": 4,
+                                  },
+                                  undefined,
+                                ]
+                              }
+                            >
+                              <View
+                                style={
+                                  [
+                                    {
+                                      "alignItems": "center",
+                                      "display": "flex",
+                                      "flexDirection": "row",
+                                    },
+                                    undefined,
+                                  ]
+                                }
+                              >
+                                <Text
+                                  accessibilityRole="text"
                                   style={
                                     [
                                       {
-                                        "alignItems": "center",
-                                        "display": "flex",
-                                        "flexBasis": "0%",
-                                        "flexGrow": 1,
-                                        "flexShrink": 1,
+                                        "color": "#131416",
+                                        "fontFamily": "Geist-Bold",
+                                        "fontSize": 24,
+                                        "fontWeight": 700,
+                                        "letterSpacing": 0,
+                                        "lineHeight": 32,
                                       },
                                       undefined,
                                     ]
                                   }
-                                />
-                                <View>
-                                  <View
-                                    onLayout={[Function]}
-                                  />
-                                </View>
+                                >
+                                  Import account
+                                </Text>
                               </View>
                               <View
                                 style={
@@ -512,112 +547,55 @@ exports[`ImportPrivateKey render matches snapshot 1`] = `
                               >
                                 <View
                                   style={
-                                    [
-                                      {
-                                        "display": "flex",
-                                        "paddingBottom": 12,
-                                        "paddingLeft": 16,
-                                        "paddingRight": 16,
-                                        "paddingTop": 4,
-                                      },
-                                      undefined,
-                                    ]
+                                    {
+                                      "marginTop": 4,
+                                    }
                                   }
                                 >
-                                  <View
+                                  <Text
+                                    accessibilityRole="text"
                                     style={
-                                      [
-                                        {
-                                          "alignItems": "center",
-                                          "display": "flex",
-                                          "flexDirection": "row",
-                                        },
-                                        undefined,
-                                      ]
+                                      {
+                                        "color": "#66676a",
+                                        "fontFamily": "Geist-Regular",
+                                        "fontSize": 16,
+                                        "letterSpacing": 0,
+                                        "lineHeight": 24,
+                                      }
                                     }
                                   >
-                                    <Text
-                                      accessibilityRole="text"
-                                      style={
-                                        [
-                                          {
-                                            "color": "#121314",
-                                            "fontFamily": "Geist-Bold",
-                                            "fontSize": 32,
-                                            "fontWeight": 700,
-                                            "letterSpacing": 0,
-                                            "lineHeight": 40,
-                                          },
-                                          undefined,
-                                        ]
-                                      }
-                                    >
-                                      Import account
-                                    </Text>
-                                  </View>
-                                  <View
+                                    Imported private keys are backed up to your account and sync automatically when you sign in with the same Google or Apple login.
+                                  </Text>
+                                  <Text
+                                    accessibilityRole="text"
+                                    onPress={[Function]}
                                     style={
-                                      [
-                                        {
-                                          "display": "flex",
-                                        },
-                                        undefined,
-                                      ]
+                                      {
+                                        "color": "#66676a",
+                                        "fontFamily": "Geist-Regular",
+                                        "fontSize": 16,
+                                        "letterSpacing": 0,
+                                        "lineHeight": 24,
+                                      }
                                     }
                                   >
-                                    <View
+                                    <Text
+                                      accessibilityRole="text"
                                       style={
                                         {
-                                          "marginTop": 4,
+                                          "color": "#4459ff",
+                                          "fontFamily": "Geist-Regular",
+                                          "fontSize": 16,
+                                          "letterSpacing": 0,
+                                          "lineHeight": 24,
                                         }
                                       }
                                     >
-                                      <Text
-                                        accessibilityRole="text"
-                                        style={
-                                          {
-                                            "color": "#686e7d",
-                                            "fontFamily": "Geist-Regular",
-                                            "fontSize": 16,
-                                            "letterSpacing": 0,
-                                            "lineHeight": 24,
-                                          }
-                                        }
-                                      >
-                                        Imported private keys are backed up to your account and sync automatically when you sign in with the same Google or Apple login.
-                                      </Text>
-                                      <Text
-                                        accessibilityRole="text"
-                                        onPress={[Function]}
-                                        style={
-                                          {
-                                            "color": "#686e7d",
-                                            "fontFamily": "Geist-Regular",
-                                            "fontSize": 16,
-                                            "letterSpacing": 0,
-                                            "lineHeight": 24,
-                                          }
-                                        }
-                                      >
-                                        <Text
-                                          accessibilityRole="text"
-                                          style={
-                                            {
-                                              "color": "#4459ff",
-                                              "fontFamily": "Geist-Regular",
-                                              "fontSize": 16,
-                                              "letterSpacing": 0,
-                                              "lineHeight": 24,
-                                            }
-                                          }
-                                        >
-                                          Learn more
-                                           
-                                        </Text>
-                                        about how imported keys work.
-                                      </Text>
-                                    </View>
-                                  </View>
+                                      Learn more
+                                       
+                                    </Text>
+                                    about how imported keys work.
+                                  </Text>
                                 </View>
                               </View>
                             </View>
@@ -638,15 +616,15 @@ exports[`ImportPrivateKey render matches snapshot 1`] = `
                                 onChangeText={[Function]}
                                 onSubmitEditing={[Function]}
                                 placeholder="Paste your private key string"
-                                placeholderTextColor="#b7bbc8"
+                                placeholderTextColor="#babbbe"
                                 returnKeyType="next"
                                 style={
                                   [
                                     {
                                       "alignItems": "flex-start",
-                                      "backgroundColor": "#f3f5f9",
+                                      "backgroundColor": "#f3f3f4",
                                       "borderRadius": 8,
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "fontWeight": "400",
@@ -736,7 +714,7 @@ exports[`ImportPrivateKey render matches snapshot 1`] = `
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flexDirection": "row",
                                   "height": 48,
diff --git a/app/components/Views/ImportPrivateKey/index.tsx b/app/components/Views/ImportPrivateKey/index.tsx
index 49c9bcdc3a42..fb2b6c891f1e 100644
--- a/app/components/Views/ImportPrivateKey/index.tsx
+++ b/app/components/Views/ImportPrivateKey/index.tsx
@@ -23,7 +23,8 @@ import Button, {
   ButtonSize,
   ButtonWidthTypes,
 } from '../../../component-library/components/Buttons/Button';
-import HeaderStackedStandard from '../../../component-library/components-temp/HeaderStackedStandard';
+import HeaderCompactStandard from '../../../component-library/components-temp/HeaderCompactStandard';
+import TitleStandard from '../../../component-library/components-temp/TitleStandard';
 import { selectSeedlessOnboardingAuthConnection } from '../../../selectors/seedlessOnboardingController';
 import { AuthConnection } from '@metamask/seedless-onboarding-controller';
 
@@ -153,56 +154,57 @@ const ImportPrivateKey = () => {
         showsVerticalScrollIndicator={false}
       >
         <View testID={ImportAccountFromPrivateKeyIDs.CONTAINER}>
-          <HeaderStackedStandard
+          <HeaderCompactStandard
             includesTopInset
             backButtonProps={{
               onPress: dismiss,
               testID: ImportAccountFromPrivateKeyIDs.CLOSE_BUTTON,
             }}
-            titleStandardProps={{
-              title: strings('import_private_key.title'),
-              bottomAccessory: (
-                <View style={styles.descriptionContainer}>
-                  {isSRP ? (
+          />
+          <TitleStandard
+            title={strings('import_private_key.title')}
+            bottomAccessory={
+              <View style={styles.descriptionContainer}>
+                {isSRP ? (
+                  <Text
+                    variant={TextVariant.BodyMD}
+                    color={TextColor.Alternative}
+                  >
+                    {strings('import_private_key.description_srp')}{' '}
+                    <Text
+                      variant={TextVariant.BodyMD}
+                      color={TextColor.Primary}
+                      onPress={learnMore}
+                    >
+                      {strings('import_private_key.learn_more')}
+                    </Text>
+                  </Text>
+                ) : (
+                  <>
+                    <Text
+                      variant={TextVariant.BodyMD}
+                      color={TextColor.Alternative}
+                    >
+                      {strings('import_private_key.description_one')}
+                    </Text>
                     <Text
                       variant={TextVariant.BodyMD}
                       color={TextColor.Alternative}
+                      onPress={learnMore}
                     >
-                      {strings('import_private_key.description_srp')}{' '}
                       <Text
                         variant={TextVariant.BodyMD}
                         color={TextColor.Primary}
-                        onPress={learnMore}
                       >
-                        {strings('import_private_key.learn_more')}
+                        {strings('import_private_key.learn_more')}{' '}
                       </Text>
+                      {strings('import_private_key.learn_more_here')}
                     </Text>
-                  ) : (
-                    <>
-                      <Text
-                        variant={TextVariant.BodyMD}
-                        color={TextColor.Alternative}
-                      >
-                        {strings('import_private_key.description_one')}
-                      </Text>
-                      <Text
-                        variant={TextVariant.BodyMD}
-                        color={TextColor.Alternative}
-                        onPress={learnMore}
-                      >
-                        <Text
-                          variant={TextVariant.BodyMD}
-                          color={TextColor.Primary}
-                        >
-                          {strings('import_private_key.learn_more')}{' '}
-                        </Text>
-                        {strings('import_private_key.learn_more_here')}
-                      </Text>
-                    </>
-                  )}
-                </View>
-              ),
-            }}
+                  </>
+                )}
+              </View>
+            }
+            twClassName="px-4 pt-1 pb-3"
           />
           <View style={styles.bottom}>
             <TextInput
diff --git a/app/components/Views/ImportPrivateKeySuccess/__snapshots__/index.test.tsx.snap b/app/components/Views/ImportPrivateKeySuccess/__snapshots__/index.test.tsx.snap
index 366fb438bbea..3f0040a12254 100644
--- a/app/components/Views/ImportPrivateKeySuccess/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/ImportPrivateKeySuccess/__snapshots__/index.test.tsx.snap
@@ -365,7 +365,7 @@ exports[`ImportPrivateKeySuccess should render correctly 1`] = `
                                       "fontSize": 15,
                                     },
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontSize": 28,
                                     },
                                     {
@@ -417,7 +417,7 @@ exports[`ImportPrivateKeySuccess should render correctly 1`] = `
                               <Text
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 32,
                                     "justifyContent": "center",
@@ -439,7 +439,7 @@ exports[`ImportPrivateKeySuccess should render correctly 1`] = `
                                 <Text
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 16,
                                       "lineHeight": 23,
diff --git a/app/components/Views/InfoNetworkModal/__snapshots__/InfoNetworkModal.test.tsx.snap b/app/components/Views/InfoNetworkModal/__snapshots__/InfoNetworkModal.test.tsx.snap
index 94e7a0229396..1774eccb617f 100644
--- a/app/components/Views/InfoNetworkModal/__snapshots__/InfoNetworkModal.test.tsx.snap
+++ b/app/components/Views/InfoNetworkModal/__snapshots__/InfoNetworkModal.test.tsx.snap
@@ -53,7 +53,7 @@ exports[`InfoNetworkModal renders correctly 1`] = `
       onStartShouldSetResponder={[Function]}
       style={
         {
-          "backgroundColor": "#3f434a66",
+          "backgroundColor": "#0a0d135c",
           "bottom": 0,
           "height": 1334,
           "left": 0,
diff --git a/app/components/Views/LedgerConnect/__snapshots__/index.test.tsx.snap b/app/components/Views/LedgerConnect/__snapshots__/index.test.tsx.snap
index 909a2f1329fc..ff433d1153a8 100644
--- a/app/components/Views/LedgerConnect/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/LedgerConnect/__snapshots__/index.test.tsx.snap
@@ -60,7 +60,7 @@ exports[`LedgerConnect render matches latest snapshot 1`] = `
                 "fontSize": 15,
               },
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontSize": 28,
               },
               {
@@ -80,7 +80,7 @@ exports[`LedgerConnect render matches latest snapshot 1`] = `
       style={
         [
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 30,
             "marginVertical": 2,
@@ -157,7 +157,7 @@ exports[`LedgerConnect render matches latest snapshot 1`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 30,
                 "marginVertical": 2,
@@ -200,7 +200,7 @@ exports[`LedgerConnect render matches latest snapshot 1`] = `
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 30,
               "marginVertical": 2,
@@ -240,7 +240,7 @@ exports[`LedgerConnect render matches latest snapshot 1`] = `
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 30,
               "marginVertical": 2,
@@ -280,7 +280,7 @@ exports[`LedgerConnect render matches latest snapshot 1`] = `
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 30,
               "marginVertical": 2,
@@ -320,7 +320,7 @@ exports[`LedgerConnect render matches latest snapshot 1`] = `
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 30,
               "marginVertical": 2,
@@ -360,7 +360,7 @@ exports[`LedgerConnect render matches latest snapshot 1`] = `
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 30,
               "marginVertical": 2,
@@ -400,7 +400,7 @@ exports[`LedgerConnect render matches latest snapshot 1`] = `
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 30,
               "marginVertical": 2,
@@ -441,7 +441,7 @@ exports[`LedgerConnect render matches latest snapshot 1`] = `
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 30,
               "marginVertical": 2,
@@ -503,7 +503,7 @@ exports[`LedgerConnect render matches latest snapshot 1`] = `
         <View
           style={
             {
-              "borderColor": "#b7bbc8",
+              "borderColor": "#949596",
               "borderRadius": 5,
               "borderWidth": 2,
               "height": 45,
@@ -528,7 +528,7 @@ exports[`LedgerConnect render matches latest snapshot 1`] = `
                 numberOfLines={1}
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 14,
                     "fontWeight": 600,
@@ -546,7 +546,7 @@ exports[`LedgerConnect render matches latest snapshot 1`] = `
                 style={
                   [
                     {
-                      "color": "#686e7d",
+                      "color": "#66676a",
                       "height": 12,
                       "marginRight": 8,
                       "width": 12,
diff --git a/app/components/Views/LedgerSelectAccount/index.test.tsx b/app/components/Views/LedgerSelectAccount/index.test.tsx
index d05b358ad4ff..94e30bf2b063 100644
--- a/app/components/Views/LedgerSelectAccount/index.test.tsx
+++ b/app/components/Views/LedgerSelectAccount/index.test.tsx
@@ -94,9 +94,8 @@ jest.mock('../../hooks/Ledger/useLedgerBluetooth', () => ({
   })),
 }));
 
-jest.mock('../../hooks/useMetrics/useMetrics', () => ({
-  __esModule: true,
-  default: jest.fn(() => ({
+jest.mock('../../hooks/useAnalytics/useAnalytics', () => ({
+  useAnalytics: jest.fn(() => ({
     trackEvent: mockTrackEvent,
     createEventBuilder: mockCreateEventBuilder,
   })),
diff --git a/app/components/Views/LedgerSelectAccount/index.tsx b/app/components/Views/LedgerSelectAccount/index.tsx
index 6f1843faa25f..9630fb81376c 100644
--- a/app/components/Views/LedgerSelectAccount/index.tsx
+++ b/app/components/Views/LedgerSelectAccount/index.tsx
@@ -6,7 +6,7 @@ import BlockingActionModal from '../../UI/BlockingActionModal';
 import { strings } from '../../../../locales/i18n';
 import { MetaMetricsEvents } from '../../../core/Analytics';
 import { useAssetFromTheme, useTheme } from '../../../util/theme';
-import useMetrics from '../../hooks/useMetrics/useMetrics';
+import { useAnalytics } from '../../hooks/useAnalytics/useAnalytics';
 import ledgerDeviceLightImage from '../../../images/ledger-device-light.png';
 import ledgerDeviceDarkImage from '../../../images/ledger-device-dark.png';
 import {
@@ -66,7 +66,7 @@ const LedgerSelectAccount = () => {
   const [errorMsg, setErrorMsg] = useState<string | null>(null);
   const dispatch = useDispatch();
   const { colors } = useTheme();
-  const { trackEvent, createEventBuilder } = useMetrics();
+  const { trackEvent, createEventBuilder } = useAnalytics();
   const styles = createStyles(colors);
   const ledgerThemedImage = useAssetFromTheme(
     ledgerDeviceLightImage,
diff --git a/app/components/Views/Login/__snapshots__/index.test.tsx.snap b/app/components/Views/Login/__snapshots__/index.test.tsx.snap
index 9313ff061fd5..8cb6dae376c0 100644
--- a/app/components/Views/Login/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/Login/__snapshots__/index.test.tsx.snap
@@ -31,9 +31,9 @@ exports[`Login renders matching snapshot 1`] = `
         {
           "alignSelf": "center",
           "height": 80,
-          "marginBottom": 80,
-          "marginTop": 40,
-          "tintColor": "#121314",
+          "marginBottom": 60,
+          "marginTop": 60,
+          "tintColor": "#131416",
           "width": 160,
         }
       }
@@ -83,8 +83,8 @@ exports[`Login renders matching snapshot 1`] = `
         style={
           {
             "alignItems": "center",
-            "backgroundColor": "#3c4d9d0f",
-            "borderColor": "#b7bbc866",
+            "backgroundColor": "#b4b4b528",
+            "borderColor": "#b4b4b566",
             "borderRadius": 12,
             "borderWidth": 1,
             "flexDirection": "row",
@@ -114,7 +114,7 @@ exports[`Login renders matching snapshot 1`] = `
             onFocus={[Function]}
             onSubmitEditing={[Function]}
             placeholder="Enter password"
-            placeholderTextColor="#686e7d"
+            placeholderTextColor="#66676a"
             returnKeyType="done"
             secureTextEntry={true}
             style={
@@ -122,12 +122,13 @@ exports[`Login renders matching snapshot 1`] = `
                 "backgroundColor": "inherit",
                 "borderColor": "transparent",
                 "borderWidth": 1,
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "fontWeight": "400",
                 "height": 46,
                 "letterSpacing": 0,
+                "lineHeight": 0,
                 "opacity": 1,
               }
             }
@@ -202,7 +203,7 @@ exports[`Login renders matching snapshot 1`] = `
               style={
                 [
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "height": 24,
                     "width": 24,
                   },
@@ -248,12 +249,12 @@ exports[`Login renders matching snapshot 1`] = `
           {
             "alignItems": "center",
             "alignSelf": "stretch",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "flexDirection": "row",
             "height": 48,
             "justifyContent": "center",
-            "marginTop": 16,
+            "marginTop": 4,
             "opacity": 0.5,
             "overflow": "hidden",
             "paddingHorizontal": 16,
@@ -296,6 +297,7 @@ exports[`Login renders matching snapshot 1`] = `
             "marginVertical": 0,
             "overflow": "hidden",
             "paddingHorizontal": 16,
+            "paddingTop": 16,
           }
         }
         testID="reset-wallet-button"
@@ -303,13 +305,17 @@ exports[`Login renders matching snapshot 1`] = `
         <Text
           accessibilityRole="text"
           style={
-            {
-              "color": "#4459ff",
-              "fontFamily": "Geist-Medium",
-              "fontSize": 16,
-              "letterSpacing": 0,
-              "lineHeight": 24,
-            }
+            [
+              {
+                "color": "#66676a",
+                "fontFamily": "Geist-Medium",
+                "fontSize": 16,
+                "fontWeight": 400,
+                "letterSpacing": 0,
+                "lineHeight": 24,
+              },
+              undefined,
+            ]
           }
         >
           Forgot password?
@@ -401,9 +407,9 @@ exports[`Login renders matching snapshot when password input is focused 1`] = `
         {
           "alignSelf": "center",
           "height": 80,
-          "marginBottom": 80,
-          "marginTop": 40,
-          "tintColor": "#121314",
+          "marginBottom": 60,
+          "marginTop": 60,
+          "tintColor": "#131416",
           "width": 160,
         }
       }
@@ -453,8 +459,8 @@ exports[`Login renders matching snapshot when password input is focused 1`] = `
         style={
           {
             "alignItems": "center",
-            "backgroundColor": "#3c4d9d0f",
-            "borderColor": "#b7bbc866",
+            "backgroundColor": "#b4b4b528",
+            "borderColor": "#b4b4b566",
             "borderRadius": 12,
             "borderWidth": 1,
             "flexDirection": "row",
@@ -484,7 +490,7 @@ exports[`Login renders matching snapshot when password input is focused 1`] = `
             onFocus={[Function]}
             onSubmitEditing={[Function]}
             placeholder="Enter password"
-            placeholderTextColor="#686e7d"
+            placeholderTextColor="#66676a"
             returnKeyType="done"
             secureTextEntry={true}
             style={
@@ -492,7 +498,7 @@ exports[`Login renders matching snapshot when password input is focused 1`] = `
                 "backgroundColor": "inherit",
                 "borderColor": "transparent",
                 "borderWidth": 1,
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "fontWeight": "400",
@@ -572,7 +578,7 @@ exports[`Login renders matching snapshot when password input is focused 1`] = `
               style={
                 [
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "height": 24,
                     "width": 24,
                   },
@@ -618,12 +624,12 @@ exports[`Login renders matching snapshot when password input is focused 1`] = `
           {
             "alignItems": "center",
             "alignSelf": "stretch",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "flexDirection": "row",
             "height": 48,
             "justifyContent": "center",
-            "marginTop": 16,
+            "marginTop": 4,
             "overflow": "hidden",
             "paddingHorizontal": 16,
           }
@@ -665,6 +671,7 @@ exports[`Login renders matching snapshot when password input is focused 1`] = `
             "marginVertical": 0,
             "overflow": "hidden",
             "paddingHorizontal": 16,
+            "paddingTop": 16,
           }
         }
         testID="reset-wallet-button"
@@ -672,13 +679,17 @@ exports[`Login renders matching snapshot when password input is focused 1`] = `
         <Text
           accessibilityRole="text"
           style={
-            {
-              "color": "#4459ff",
-              "fontFamily": "Geist-Medium",
-              "fontSize": 16,
-              "letterSpacing": 0,
-              "lineHeight": 24,
-            }
+            [
+              {
+                "color": "#66676a",
+                "fontFamily": "Geist-Medium",
+                "fontSize": 16,
+                "fontWeight": 400,
+                "letterSpacing": 0,
+                "lineHeight": 24,
+              },
+              undefined,
+            ]
           }
         >
           Forgot password?
diff --git a/app/components/Views/Login/index.tsx b/app/components/Views/Login/index.tsx
index 00529f70fc89..4f1f15abb6b6 100644
--- a/app/components/Views/Login/index.tsx
+++ b/app/components/Views/Login/index.tsx
@@ -10,6 +10,12 @@ import {
   Image,
 } from 'react-native';
 import METAMASK_NAME from '../../../images/branding/metamask-name.png';
+import {
+  Text,
+  TextVariant as DSTextVariant,
+  TextColor as DSTextColor,
+  FontWeight,
+} from '@metamask/design-system-react-native';
 import { TextVariant } from '../../../component-library/components/Texts/Text';
 import { KeyboardAwareScrollView } from 'react-native-keyboard-aware-scroll-view';
 import {
@@ -460,7 +466,15 @@ const Login: React.FC<LoginProps> = ({ saveOnboardingEvent }) => {
                 variant={ButtonVariants.Link}
                 onPress={toggleWarningModal}
                 testID={LoginViewSelectors.RESET_WALLET}
-                label={strings('login.forgot_password')}
+                label={
+                  <Text
+                    variant={DSTextVariant.BodyMd}
+                    fontWeight={FontWeight.Medium}
+                    color={DSTextColor.TextAlternative}
+                  >
+                    {strings('login.forgot_password')}
+                  </Text>
+                }
                 isDisabled={loading}
                 size={ButtonSize.Lg}
               />
diff --git a/app/components/Views/Login/styles.ts b/app/components/Views/Login/styles.ts
index 493d562d4f89..50f1b1f3d1ae 100644
--- a/app/components/Views/Login/styles.ts
+++ b/app/components/Views/Login/styles.ts
@@ -75,19 +75,20 @@ const styleSheet = (params: { theme: Theme }) => {
       alignItems: 'center',
     },
     unlockButton: {
-      marginTop: 16,
+      marginTop: 4,
     },
     metamaskName: {
       width: 160,
       height: 80,
       alignSelf: 'center',
-      marginBottom: 80,
-      marginTop: 40,
+      marginBottom: 60,
+      marginTop: 60,
       tintColor: colors.icon.default,
     },
     goBack: {
       marginVertical: 0,
       alignSelf: 'center',
+      paddingTop: 16,
     },
     biometrics: {
       flexDirection: 'row',
diff --git a/app/components/Views/ManualBackupStep1/__snapshots__/index.test.tsx.snap b/app/components/Views/ManualBackupStep1/__snapshots__/index.test.tsx.snap
index fdabb56d48d4..77f24dae821e 100644
--- a/app/components/Views/ManualBackupStep1/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/ManualBackupStep1/__snapshots__/index.test.tsx.snap
@@ -56,7 +56,7 @@ exports[`ManualBackupStep1 Theme appearance renders dark SRP design image by def
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 32,
                 "letterSpacing": 0,
@@ -77,7 +77,7 @@ exports[`ManualBackupStep1 Theme appearance renders dark SRP design image by def
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -109,7 +109,7 @@ exports[`ManualBackupStep1 Theme appearance renders dark SRP design image by def
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Medium",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -125,7 +125,7 @@ exports[`ManualBackupStep1 Theme appearance renders dark SRP design image by def
             style={
               {
                 "backgroundColor": "#ffffff",
-                "borderColor": "#b7bbc8",
+                "borderColor": "#949596",
                 "borderRadius": 8,
                 "borderWidth": 1,
                 "flexDirection": "row",
@@ -210,7 +210,7 @@ exports[`ManualBackupStep1 Theme appearance renders dark SRP design image by def
                   }
                 >
                   <SvgMock
-                    color="#121314"
+                    color="#131416"
                     fill="currentColor"
                     height={32}
                     name="EyeSlash"
@@ -226,7 +226,7 @@ exports[`ManualBackupStep1 Theme appearance renders dark SRP design image by def
                     accessibilityRole="text"
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Medium",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -240,7 +240,7 @@ exports[`ManualBackupStep1 Theme appearance renders dark SRP design image by def
                     accessibilityRole="text"
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 14,
                         "letterSpacing": 0,
@@ -277,7 +277,7 @@ exports[`ManualBackupStep1 Theme appearance renders dark SRP design image by def
             {
               "alignItems": "center",
               "alignSelf": "stretch",
-              "backgroundColor": "#121314",
+              "backgroundColor": "#131416",
               "borderRadius": 12,
               "flexDirection": "row",
               "height": 48,
@@ -367,7 +367,7 @@ exports[`ManualBackupStep1 Theme appearance renders light SRP design image for l
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 32,
                 "letterSpacing": 0,
@@ -388,7 +388,7 @@ exports[`ManualBackupStep1 Theme appearance renders light SRP design image for l
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -420,7 +420,7 @@ exports[`ManualBackupStep1 Theme appearance renders light SRP design image for l
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Medium",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -436,7 +436,7 @@ exports[`ManualBackupStep1 Theme appearance renders light SRP design image for l
             style={
               {
                 "backgroundColor": "#ffffff",
-                "borderColor": "#b7bbc8",
+                "borderColor": "#949596",
                 "borderRadius": 8,
                 "borderWidth": 1,
                 "flexDirection": "row",
@@ -521,7 +521,7 @@ exports[`ManualBackupStep1 Theme appearance renders light SRP design image for l
                   }
                 >
                   <SvgMock
-                    color="#121314"
+                    color="#131416"
                     fill="currentColor"
                     height={32}
                     name="EyeSlash"
@@ -537,7 +537,7 @@ exports[`ManualBackupStep1 Theme appearance renders light SRP design image for l
                     accessibilityRole="text"
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Medium",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -551,7 +551,7 @@ exports[`ManualBackupStep1 Theme appearance renders light SRP design image for l
                     accessibilityRole="text"
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 14,
                         "letterSpacing": 0,
@@ -588,7 +588,7 @@ exports[`ManualBackupStep1 Theme appearance renders light SRP design image for l
             {
               "alignItems": "center",
               "alignSelf": "stretch",
-              "backgroundColor": "#121314",
+              "backgroundColor": "#131416",
               "borderRadius": 12,
               "flexDirection": "row",
               "height": 48,
@@ -678,7 +678,7 @@ exports[`ManualBackupStep1 render matches snapshot 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 32,
                 "letterSpacing": 0,
@@ -699,7 +699,7 @@ exports[`ManualBackupStep1 render matches snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -731,7 +731,7 @@ exports[`ManualBackupStep1 render matches snapshot 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Medium",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -747,7 +747,7 @@ exports[`ManualBackupStep1 render matches snapshot 1`] = `
             style={
               {
                 "backgroundColor": "#ffffff",
-                "borderColor": "#b7bbc8",
+                "borderColor": "#949596",
                 "borderRadius": 8,
                 "borderWidth": 1,
                 "flexDirection": "row",
@@ -832,7 +832,7 @@ exports[`ManualBackupStep1 render matches snapshot 1`] = `
                   }
                 >
                   <SvgMock
-                    color="#121314"
+                    color="#131416"
                     fill="currentColor"
                     height={32}
                     name="EyeSlash"
@@ -848,7 +848,7 @@ exports[`ManualBackupStep1 render matches snapshot 1`] = `
                     accessibilityRole="text"
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Medium",
                         "fontSize": 16,
                         "letterSpacing": 0,
@@ -862,7 +862,7 @@ exports[`ManualBackupStep1 render matches snapshot 1`] = `
                     accessibilityRole="text"
                     style={
                       {
-                        "color": "#121314",
+                        "color": "#131416",
                         "fontFamily": "Geist-Regular",
                         "fontSize": 14,
                         "letterSpacing": 0,
@@ -899,7 +899,7 @@ exports[`ManualBackupStep1 render matches snapshot 1`] = `
             {
               "alignItems": "center",
               "alignSelf": "stretch",
-              "backgroundColor": "#121314",
+              "backgroundColor": "#131416",
               "borderRadius": 12,
               "flexDirection": "row",
               "height": 48,
diff --git a/app/components/Views/MultiRpcModal/MultiRpcModal.tsx b/app/components/Views/MultiRpcModal/MultiRpcModal.tsx
index 7768d27c0b3e..c78c7d56cb26 100644
--- a/app/components/Views/MultiRpcModal/MultiRpcModal.tsx
+++ b/app/components/Views/MultiRpcModal/MultiRpcModal.tsx
@@ -18,7 +18,7 @@ import Button, {
 } from '../../../component-library/components/Buttons/Button';
 import { useNavigation } from '@react-navigation/native';
 import Engine from '../../../core/Engine';
-import { useMetrics } from '../../../components/hooks/useMetrics';
+import { useAnalytics } from '../../../components/hooks/useAnalytics/useAnalytics';
 import { MetaMetricsEvents } from '../../../core/Analytics';
 import {
   selectEvmChainId,
@@ -48,7 +48,7 @@ const MultiRpcModal = () => {
   const networkConfigurations = useSelector(
     selectEvmNetworkConfigurationsByChainId,
   );
-  const { trackEvent, createEventBuilder } = useMetrics();
+  const { trackEvent, createEventBuilder } = useAnalytics();
   const { navigate } = useNavigation();
 
   const dismissMultiRpcModalMigration = useCallback(() => {
diff --git a/app/components/Views/MultiRpcModal/__snapshots__/MultiRpcModal.test.tsx.snap b/app/components/Views/MultiRpcModal/__snapshots__/MultiRpcModal.test.tsx.snap
index f887cf866d81..14fcd9afc18f 100644
--- a/app/components/Views/MultiRpcModal/__snapshots__/MultiRpcModal.test.tsx.snap
+++ b/app/components/Views/MultiRpcModal/__snapshots__/MultiRpcModal.test.tsx.snap
@@ -334,7 +334,7 @@ exports[`MultiRpcModal render matches snapshot 1`] = `
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -384,7 +384,7 @@ exports[`MultiRpcModal render matches snapshot 1`] = `
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -421,7 +421,7 @@ exports[`MultiRpcModal render matches snapshot 1`] = `
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -452,9 +452,9 @@ exports[`MultiRpcModal render matches snapshot 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Bold",
-                                  "fontSize": 18,
+                                  "fontSize": 20,
                                   "letterSpacing": 0,
                                   "lineHeight": 24,
                                 }
@@ -506,7 +506,7 @@ exports[`MultiRpcModal render matches snapshot 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "letterSpacing": 0,
@@ -558,7 +558,7 @@ exports[`MultiRpcModal render matches snapshot 1`] = `
                                   {
                                     "alignItems": "center",
                                     "alignSelf": "stretch",
-                                    "backgroundColor": "#121314",
+                                    "backgroundColor": "#131416",
                                     "borderRadius": 12,
                                     "flexDirection": "row",
                                     "height": 48,
diff --git a/app/components/Views/MultichainAccounts/AccountGroupDetails/components/SecretRecoveryPhrase.test.tsx b/app/components/Views/MultichainAccounts/AccountGroupDetails/components/SecretRecoveryPhrase.test.tsx
index 76e7284ec481..209053099329 100644
--- a/app/components/Views/MultichainAccounts/AccountGroupDetails/components/SecretRecoveryPhrase.test.tsx
+++ b/app/components/Views/MultichainAccounts/AccountGroupDetails/components/SecretRecoveryPhrase.test.tsx
@@ -78,8 +78,8 @@ describe('SecretRecoveryPhrase', () => {
     const button = getByTestId(AccountDetailsIds.SECRET_RECOVERY_PHRASE_LINK);
     fireEvent.press(button);
 
-    expect(mockNavigate).toHaveBeenCalledWith('RootModalFlow', {
-      screen: 'SRPRevealQuiz',
+    expect(mockNavigate).toHaveBeenCalledWith('RevealPrivateCredentialView', {
+      shouldUpdateNav: true,
       keyringId: 'mock-entropy-source',
     });
   });
diff --git a/app/components/Views/MultichainAccounts/AccountGroupDetails/components/SecretRecoveryPhrase.tsx b/app/components/Views/MultichainAccounts/AccountGroupDetails/components/SecretRecoveryPhrase.tsx
index 2ef6bf3d81bd..ad822df16d24 100644
--- a/app/components/Views/MultichainAccounts/AccountGroupDetails/components/SecretRecoveryPhrase.tsx
+++ b/app/components/Views/MultichainAccounts/AccountGroupDetails/components/SecretRecoveryPhrase.tsx
@@ -51,8 +51,8 @@ export const SecretRecoveryPhrase = ({
 
   const onExportMnemonic = useCallback(() => {
     if (account?.options.entropySource) {
-      navigation.navigate(Routes.MODAL.ROOT_MODAL_FLOW, {
-        screen: Routes.MODAL.SRP_REVEAL_QUIZ,
+      navigation.navigate(Routes.SETTINGS.REVEAL_PRIVATE_CREDENTIAL, {
+        shouldUpdateNav: true,
         keyringId: account.options.entropySource,
       });
     }
diff --git a/app/components/Views/MultichainAccounts/MultichainAccountConnect/MultichainAccountConnect.test.tsx b/app/components/Views/MultichainAccounts/MultichainAccountConnect/MultichainAccountConnect.test.tsx
index 451e5fee63c4..faf54eedb69e 100644
--- a/app/components/Views/MultichainAccounts/MultichainAccountConnect/MultichainAccountConnect.test.tsx
+++ b/app/components/Views/MultichainAccounts/MultichainAccountConnect/MultichainAccountConnect.test.tsx
@@ -280,14 +280,6 @@ jest.mock(
   }),
 );
 
-// Mock feature flag selector
-jest.mock(
-  '../../../../selectors/featureFlagController/multichainAccounts/enabledMultichainAccounts',
-  () => ({
-    selectMultichainAccountsState1Enabled: jest.fn(() => true),
-  }),
-);
-
 jest.mock('../../../../selectors/accountsController', () => ({
   ...jest.requireActual('../../../../selectors/accountsController'),
   selectInternalAccountsById: jest.fn(() => {
diff --git a/app/components/Views/MultichainAccounts/MultichainAccountConnect/State2AccountConnectWrapper.test.tsx b/app/components/Views/MultichainAccounts/MultichainAccountConnect/State2AccountConnectWrapper.test.tsx
deleted file mode 100644
index 7541b0706ab4..000000000000
--- a/app/components/Views/MultichainAccounts/MultichainAccountConnect/State2AccountConnectWrapper.test.tsx
+++ /dev/null
@@ -1,363 +0,0 @@
-import React from 'react';
-import renderWithProvider, {
-  DeepPartial,
-} from '../../../../util/test/renderWithProvider';
-import { State2AccountConnectWrapper } from './State2AccountConnectWrapper';
-import { AccountConnectProps } from '../../AccountConnect/AccountConnect.types';
-import { RootState } from '../../../../reducers';
-import {
-  Caip25EndowmentPermissionName,
-  Caip25CaveatType,
-  Caip25CaveatValue,
-} from '@metamask/chain-agnostic-permission';
-
-const TEST_IDS = {
-  ACCOUNT_CONNECT_COMPONENT: 'account-connect-component',
-  MULTICHAIN_ACCOUNT_CONNECT_COMPONENT: 'multichain-account-connect-component',
-} as const;
-
-// Mock the child components
-jest.mock('../../AccountConnect/AccountConnect', () => {
-  // eslint-disable-next-line @typescript-eslint/no-require-imports, @typescript-eslint/no-var-requires
-  const actualReact = require('react');
-  const MockAccountConnect = ({ route }: AccountConnectProps) =>
-    actualReact.createElement(
-      'div',
-      { testID: TEST_IDS.ACCOUNT_CONNECT_COMPONENT },
-      ['AccountConnect - ', route.params.permissionRequestId],
-    );
-  MockAccountConnect.displayName = 'AccountConnect';
-  return MockAccountConnect;
-});
-
-jest.mock('./MultichainAccountConnect', () => {
-  // eslint-disable-next-line @typescript-eslint/no-require-imports, @typescript-eslint/no-var-requires
-  const actualReact = require('react');
-  const MockMultichainAccountConnect = ({ route }: AccountConnectProps) =>
-    actualReact.createElement(
-      'div',
-      { testID: TEST_IDS.MULTICHAIN_ACCOUNT_CONNECT_COMPONENT },
-      ['MultichainAccountConnect - ', route.params.permissionRequestId],
-    );
-  MockMultichainAccountConnect.displayName = 'MultichainAccountConnect';
-  return MockMultichainAccountConnect;
-});
-
-const createMockCaip25Permission = (
-  optionalScopes: Record<string, { accounts: string[] }>,
-) => ({
-  [Caip25EndowmentPermissionName]: {
-    parentCapability: Caip25EndowmentPermissionName,
-    caveats: [
-      {
-        type: Caip25CaveatType,
-        value: {
-          requiredScopes: {},
-          optionalScopes,
-          isMultichainOrigin: false,
-          sessionProperties: {},
-        },
-      },
-    ] as [{ type: string; value: Caip25CaveatValue }],
-  },
-});
-
-const mockProps: AccountConnectProps = {
-  route: {
-    params: {
-      hostInfo: {
-        metadata: {
-          id: 'test-id',
-          origin: 'test-origin.com',
-          isEip1193Request: true,
-        },
-        permissions: createMockCaip25Permission({
-          'wallet:eip155': {
-            accounts: [],
-          },
-        }),
-      },
-      permissionRequestId: 'test-permission-request-id',
-    },
-  },
-};
-
-const createMockState = (isState2Enabled: boolean): DeepPartial<RootState> => ({
-  engine: {
-    backgroundState: {
-      RemoteFeatureFlagController: {
-        remoteFeatureFlags: {
-          enableMultichainAccounts: {
-            enabled: !isState2Enabled,
-            featureVersion: '1',
-            minimumVersion: '0.0.0', // Use a very low version to ensure it passes
-          },
-          enableMultichainAccountsState2: {
-            enabled: isState2Enabled,
-            featureVersion: '2',
-            minimumVersion: '0.0.0', // Use a very low version to ensure it passes
-          },
-        },
-        cacheTimestamp: 0,
-      },
-    },
-  },
-});
-
-describe('State2AccountConnectWrapper', () => {
-  beforeEach(() => {
-    jest.clearAllMocks();
-  });
-
-  describe('when multichain accounts state 2 is enabled', () => {
-    it('renders MultichainAccountConnect component', () => {
-      const isState2Enabled = true;
-      const mockState = createMockState(isState2Enabled);
-
-      const { getByTestId, queryByTestId } = renderWithProvider(
-        <State2AccountConnectWrapper {...mockProps} />,
-        { state: mockState },
-      );
-
-      expect(
-        getByTestId(TEST_IDS.MULTICHAIN_ACCOUNT_CONNECT_COMPONENT),
-      ).toBeTruthy();
-      expect(queryByTestId(TEST_IDS.ACCOUNT_CONNECT_COMPONENT)).toBeNull();
-    });
-
-    it('forwards all props to MultichainAccountConnect', () => {
-      const isState2Enabled = true;
-      const mockState = createMockState(isState2Enabled);
-      const customProps: AccountConnectProps = {
-        route: {
-          params: {
-            hostInfo: {
-              metadata: {
-                id: 'custom-id',
-                origin: 'custom-origin.com',
-                isEip1193Request: false,
-              },
-              permissions: createMockCaip25Permission({
-                'eip155:1': {
-                  accounts: ['eip155:1:0x123'],
-                },
-              }),
-            },
-            permissionRequestId: 'custom-permission-id',
-          },
-        },
-      };
-
-      const { getByTestId } = renderWithProvider(
-        <State2AccountConnectWrapper {...customProps} />,
-        { state: mockState },
-      );
-
-      const multichainComponent = getByTestId(
-        TEST_IDS.MULTICHAIN_ACCOUNT_CONNECT_COMPONENT,
-      );
-      expect(multichainComponent).toBeTruthy();
-      expect(multichainComponent.props.children).toContain(
-        'custom-permission-id',
-      );
-    });
-  });
-
-  describe('when multichain accounts state 2 is disabled', () => {
-    it('renders AccountConnect component', () => {
-      const isState2Enabled = false;
-      const mockState = createMockState(isState2Enabled);
-
-      const { getByTestId, queryByTestId } = renderWithProvider(
-        <State2AccountConnectWrapper {...mockProps} />,
-        { state: mockState },
-      );
-
-      expect(getByTestId(TEST_IDS.ACCOUNT_CONNECT_COMPONENT)).toBeTruthy();
-      expect(
-        queryByTestId(TEST_IDS.MULTICHAIN_ACCOUNT_CONNECT_COMPONENT),
-      ).toBeNull();
-    });
-
-    it('forwards all props to AccountConnect', () => {
-      const isState2Enabled = false;
-      const mockState = createMockState(isState2Enabled);
-      const customProps: AccountConnectProps = {
-        route: {
-          params: {
-            hostInfo: {
-              metadata: {
-                id: 'legacy-id',
-                origin: 'legacy-origin.com',
-                isEip1193Request: true,
-              },
-              permissions: createMockCaip25Permission({
-                'wallet:eip155': {
-                  accounts: ['eip155:1:0x456'],
-                },
-              }),
-            },
-            permissionRequestId: 'legacy-permission-id',
-          },
-        },
-      };
-
-      const { getByTestId } = renderWithProvider(
-        <State2AccountConnectWrapper {...customProps} />,
-        { state: mockState },
-      );
-
-      const accountConnectComponent = getByTestId(
-        TEST_IDS.ACCOUNT_CONNECT_COMPONENT,
-      );
-      expect(accountConnectComponent).toBeTruthy();
-      expect(accountConnectComponent.props.children).toContain(
-        'legacy-permission-id',
-      );
-    });
-  });
-
-  describe('feature flag behavior', () => {
-    it('uses feature flag selector to determine component rendering', () => {
-      const state2MockState = createMockState(true);
-
-      const { getByTestId: getByTestIdState2 } = renderWithProvider(
-        <State2AccountConnectWrapper {...mockProps} />,
-        { state: state2MockState },
-      );
-
-      expect(
-        getByTestIdState2(TEST_IDS.MULTICHAIN_ACCOUNT_CONNECT_COMPONENT),
-      ).toBeTruthy();
-
-      const state1MockState = createMockState(false);
-
-      const { getByTestId: getByTestIdState1 } = renderWithProvider(
-        <State2AccountConnectWrapper {...mockProps} />,
-        { state: state1MockState },
-      );
-
-      expect(
-        getByTestIdState1(TEST_IDS.ACCOUNT_CONNECT_COMPONENT),
-      ).toBeTruthy();
-    });
-  });
-
-  it('handles props with minimal metadata when state 2 is enabled', () => {
-    const mockState = createMockState(true);
-    const minimalProps: AccountConnectProps = {
-      route: {
-        params: {
-          hostInfo: {
-            metadata: {
-              id: 'minimal-id',
-              origin: 'minimal.com',
-            },
-            permissions: createMockCaip25Permission({
-              'wallet:eip155': { accounts: [] },
-            }),
-          },
-          permissionRequestId: 'minimal-request',
-        },
-      },
-    };
-
-    const { getByTestId } = renderWithProvider(
-      <State2AccountConnectWrapper {...minimalProps} />,
-      { state: mockState },
-    );
-
-    expect(
-      getByTestId(TEST_IDS.MULTICHAIN_ACCOUNT_CONNECT_COMPONENT),
-    ).toBeTruthy();
-  });
-
-  it('handles props with complex permissions when state 2 is disabled', () => {
-    const mockState = createMockState(false);
-    const complexProps: AccountConnectProps = {
-      route: {
-        params: {
-          hostInfo: {
-            metadata: {
-              id: 'complex-id',
-              origin: 'complex.dapp.com',
-              isEip1193Request: true,
-              promptToCreateSolanaAccount: true,
-            },
-            permissions: createMockCaip25Permission({
-              'eip155:1': { accounts: ['eip155:1:0x123'] },
-              'eip155:137': { accounts: ['eip155:137:0x456'] },
-              'solana:5eykt4UsFv8P8NJdTREpY1vzqKqZKvdp': {
-                accounts: ['solana:5eykt4UsFv8P8NJdTREpY1vzqKqZKvdp:abc123'],
-              },
-            }),
-          },
-          permissionRequestId: 'complex-request',
-        },
-      },
-    };
-
-    const { getByTestId } = renderWithProvider(
-      <State2AccountConnectWrapper {...complexProps} />,
-      { state: mockState },
-    );
-
-    expect(getByTestId(TEST_IDS.ACCOUNT_CONNECT_COMPONENT)).toBeTruthy();
-  });
-
-  describe('edge cases', () => {
-    it('handles missing feature flag gracefully', () => {
-      const mockStateWithoutFlag: DeepPartial<RootState> = {
-        engine: {
-          backgroundState: {
-            RemoteFeatureFlagController: {
-              remoteFeatureFlags: {},
-              cacheTimestamp: 0,
-            },
-          },
-        },
-      };
-
-      const { getByTestId, queryByTestId } = renderWithProvider(
-        <State2AccountConnectWrapper {...mockProps} />,
-        { state: mockStateWithoutFlag },
-      );
-
-      expect(
-        getByTestId(TEST_IDS.MULTICHAIN_ACCOUNT_CONNECT_COMPONENT),
-      ).toBeTruthy();
-      expect(queryByTestId(TEST_IDS.ACCOUNT_CONNECT_COMPONENT)).toBeNull();
-    });
-
-    it('handles feature flag with version 1 correctly', () => {
-      const mockStateVersion1: DeepPartial<RootState> = {
-        engine: {
-          backgroundState: {
-            RemoteFeatureFlagController: {
-              remoteFeatureFlags: {
-                enableMultichainAccounts: {
-                  enabled: true,
-                  featureVersion: '1',
-                  minimumVersion: '0.0.0',
-                },
-                enableMultichainAccountsState2: {
-                  enabled: false,
-                  featureVersion: null,
-                  minimumVersion: null,
-                },
-              },
-              cacheTimestamp: 0,
-            },
-          },
-        },
-      };
-
-      const { getByTestId } = renderWithProvider(
-        <State2AccountConnectWrapper {...mockProps} />,
-        { state: mockStateVersion1 },
-      );
-
-      expect(getByTestId(TEST_IDS.ACCOUNT_CONNECT_COMPONENT)).toBeTruthy();
-    });
-  });
-});
diff --git a/app/components/Views/MultichainAccounts/MultichainAccountConnect/State2AccountConnectWrapper.tsx b/app/components/Views/MultichainAccounts/MultichainAccountConnect/State2AccountConnectWrapper.tsx
deleted file mode 100644
index 87f8ca48fa0d..000000000000
--- a/app/components/Views/MultichainAccounts/MultichainAccountConnect/State2AccountConnectWrapper.tsx
+++ /dev/null
@@ -1,18 +0,0 @@
-import React from 'react';
-import AccountConnect from '../../AccountConnect/AccountConnect';
-import MultichainAccountConnect from './MultichainAccountConnect';
-import { useSelector } from 'react-redux';
-import { AccountConnectProps } from '../../AccountConnect/AccountConnect.types';
-import { selectMultichainAccountsState2Enabled } from '../../../../selectors/featureFlagController/multichainAccounts';
-
-export const State2AccountConnectWrapper = (props: AccountConnectProps) => {
-  const isMultichainAccountsState2Enabled = useSelector(
-    selectMultichainAccountsState2Enabled,
-  );
-
-  return isMultichainAccountsState2Enabled ? (
-    <MultichainAccountConnect {...props} />
-  ) : (
-    <AccountConnect {...props} />
-  );
-};
diff --git a/app/components/Views/MultichainAccounts/MultichainAccountsConnectedList/__snapshots__/MultichainAccountsConnectedList.test.tsx.snap b/app/components/Views/MultichainAccounts/MultichainAccountsConnectedList/__snapshots__/MultichainAccountsConnectedList.test.tsx.snap
index aff55a1d11e2..08f7f9a52b3b 100644
--- a/app/components/Views/MultichainAccounts/MultichainAccountsConnectedList/__snapshots__/MultichainAccountsConnectedList.test.tsx.snap
+++ b/app/components/Views/MultichainAccounts/MultichainAccountsConnectedList/__snapshots__/MultichainAccountsConnectedList.test.tsx.snap
@@ -93,7 +93,7 @@ exports[`MultichainAccountsConnectedList renders component with different accoun
                 style={
                   {
                     "alignItems": "center",
-                    "backgroundColor": "#3c4d9d0f",
+                    "backgroundColor": "#b4b4b528",
                     "flexDirection": "row",
                     "paddingHorizontal": 16,
                     "width": "100%",
@@ -189,7 +189,7 @@ exports[`MultichainAccountsConnectedList renders component with different accoun
                             numberOfLines={1}
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "flex": 1,
                                 "fontFamily": "Geist-Medium",
                                 "fontSize": 16,
@@ -234,7 +234,7 @@ exports[`MultichainAccountsConnectedList renders component with different accoun
                             accessibilityRole="text"
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Medium",
                                 "fontSize": 16,
                                 "letterSpacing": 0,
@@ -258,7 +258,7 @@ exports[`MultichainAccountsConnectedList renders component with different accoun
                         testID="multichain-account-cell-menu"
                       >
                         <SvgMock
-                          color="#686e7d"
+                          color="#66676a"
                           fill="currentColor"
                           height={20}
                           name="MoreVertical"
@@ -394,7 +394,7 @@ exports[`MultichainAccountsConnectedList renders component with different accoun
                             numberOfLines={1}
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "flex": 1,
                                 "fontFamily": "Geist-Medium",
                                 "fontSize": 16,
@@ -439,7 +439,7 @@ exports[`MultichainAccountsConnectedList renders component with different accoun
                             accessibilityRole="text"
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Medium",
                                 "fontSize": 16,
                                 "letterSpacing": 0,
@@ -463,7 +463,7 @@ exports[`MultichainAccountsConnectedList renders component with different accoun
                         testID="multichain-account-cell-menu"
                       >
                         <SvgMock
-                          color="#686e7d"
+                          color="#66676a"
                           fill="currentColor"
                           height={20}
                           name="MoreVertical"
diff --git a/app/components/Views/MultichainAccounts/MultichainPermissionsSummary/BIP44AccountPermissionWrapper.test.tsx b/app/components/Views/MultichainAccounts/MultichainPermissionsSummary/BIP44AccountPermissionWrapper.test.tsx
deleted file mode 100644
index c88dd3812145..000000000000
--- a/app/components/Views/MultichainAccounts/MultichainPermissionsSummary/BIP44AccountPermissionWrapper.test.tsx
+++ /dev/null
@@ -1,161 +0,0 @@
-import React from 'react';
-import { render } from '@testing-library/react-native';
-import { Provider } from 'react-redux';
-import { createStore } from 'redux';
-import { BIP44AccountPermissionWrapper } from './BIP44AccountPermissionWrapper';
-import { AccountPermissionsProps } from '../../AccountPermissions/AccountPermissions.types';
-
-jest.mock('../../AccountPermissions/AccountPermissions', () => ({
-  __esModule: true,
-  default: jest.fn(() => null),
-}));
-
-jest.mock(
-  '../MultichainAccountPermissions/MultichainAccountPermissions',
-  () => ({
-    MultichainAccountPermissions: jest.fn(() => null),
-  }),
-);
-
-jest.mock(
-  '../../../../selectors/featureFlagController/multichainAccounts',
-  () => ({
-    selectMultichainAccountsState2Enabled: jest.fn(),
-  }),
-);
-
-import AccountPermissions from '../../AccountPermissions/AccountPermissions';
-import { MultichainAccountPermissions } from '../MultichainAccountPermissions/MultichainAccountPermissions';
-import { selectMultichainAccountsState2Enabled } from '../../../../selectors/featureFlagController/multichainAccounts';
-
-const MockedAccountPermissions = AccountPermissions as jest.MockedFunction<
-  typeof AccountPermissions
->;
-const MockedMultichainAccountPermissions =
-  MultichainAccountPermissions as jest.MockedFunction<
-    typeof MultichainAccountPermissions
-  >;
-const mockSelectMultichainAccountsState2Enabled =
-  selectMultichainAccountsState2Enabled as jest.MockedFunction<
-    typeof selectMultichainAccountsState2Enabled
-  >;
-
-describe('BIP44AccountPermissionWrapper', () => {
-  const mockProps: AccountPermissionsProps = {
-    route: {
-      params: {
-        hostInfo: {
-          metadata: {
-            origin: 'test.com',
-          },
-        },
-      },
-    },
-  } as AccountPermissionsProps;
-
-  const createMockStore = (featureFlagEnabled: boolean) => {
-    const mockState = {
-      engine: {
-        backgroundState: {},
-      },
-    };
-
-    mockSelectMultichainAccountsState2Enabled.mockReturnValue(
-      featureFlagEnabled,
-    );
-
-    return createStore(() => mockState);
-  };
-
-  const renderWithProvider = (featureFlagEnabled: boolean) => {
-    const store = createMockStore(featureFlagEnabled);
-
-    return render(
-      <Provider store={store}>
-        <BIP44AccountPermissionWrapper {...mockProps} />
-      </Provider>,
-    );
-  };
-
-  beforeEach(() => {
-    jest.clearAllMocks();
-  });
-
-  describe('when feature flag is enabled', () => {
-    it('should render MultichainAccountPermissions component', () => {
-      const featureFlagEnabled = true;
-
-      renderWithProvider(featureFlagEnabled);
-
-      expect(MockedMultichainAccountPermissions).toHaveBeenCalledWith(
-        mockProps,
-        {},
-      );
-      expect(MockedAccountPermissions).not.toHaveBeenCalled();
-    });
-
-    it('should pass all props to MultichainAccountPermissions', () => {
-      const customProps = {
-        ...mockProps,
-        route: {
-          params: {
-            hostInfo: {
-              metadata: {
-                origin: 'custom-test.com',
-              },
-            },
-          },
-        },
-      };
-      const featureFlagEnabled = true;
-      const store = createMockStore(featureFlagEnabled);
-
-      render(
-        <Provider store={store}>
-          <BIP44AccountPermissionWrapper {...customProps} />
-        </Provider>,
-      );
-
-      expect(MockedMultichainAccountPermissions).toHaveBeenCalledWith(
-        customProps,
-        {},
-      );
-    });
-  });
-
-  describe('when feature flag is disabled', () => {
-    it('should render AccountPermissions component', () => {
-      const featureFlagEnabled = false;
-
-      renderWithProvider(featureFlagEnabled);
-
-      expect(MockedAccountPermissions).toHaveBeenCalledWith(mockProps, {});
-      expect(MockedMultichainAccountPermissions).not.toHaveBeenCalled();
-    });
-
-    it('should pass all props to AccountPermissions', () => {
-      const customProps = {
-        ...mockProps,
-        route: {
-          params: {
-            hostInfo: {
-              metadata: {
-                origin: 'legacy-test.com',
-              },
-            },
-          },
-        },
-      };
-      const featureFlagEnabled = false;
-      const store = createMockStore(featureFlagEnabled);
-
-      render(
-        <Provider store={store}>
-          <BIP44AccountPermissionWrapper {...customProps} />
-        </Provider>,
-      );
-
-      expect(MockedAccountPermissions).toHaveBeenCalledWith(customProps, {});
-    });
-  });
-});
diff --git a/app/components/Views/MultichainAccounts/MultichainPermissionsSummary/BIP44AccountPermissionWrapper.tsx b/app/components/Views/MultichainAccounts/MultichainPermissionsSummary/BIP44AccountPermissionWrapper.tsx
deleted file mode 100644
index 9da40994b0b4..000000000000
--- a/app/components/Views/MultichainAccounts/MultichainPermissionsSummary/BIP44AccountPermissionWrapper.tsx
+++ /dev/null
@@ -1,19 +0,0 @@
-import React from 'react';
-import AccountPermissions from '../../AccountPermissions/AccountPermissions';
-import { useSelector } from 'react-redux';
-import { selectMultichainAccountsState2Enabled } from '../../../../selectors/featureFlagController/multichainAccounts';
-import { AccountPermissionsProps } from '../../AccountPermissions/AccountPermissions.types';
-import { MultichainAccountPermissions } from '../MultichainAccountPermissions/MultichainAccountPermissions';
-
-export const BIP44AccountPermissionWrapper = React.memo(
-  (props: AccountPermissionsProps) => {
-    const isMultichainAccountsState2Enabled = useSelector(
-      selectMultichainAccountsState2Enabled,
-    );
-
-    if (isMultichainAccountsState2Enabled) {
-      return <MultichainAccountPermissions {...props} />;
-    }
-    return <AccountPermissions {...props} />;
-  },
-);
diff --git a/app/components/Views/MultichainAccounts/WalletDetails/BaseWalletDetails/index.test.tsx b/app/components/Views/MultichainAccounts/WalletDetails/BaseWalletDetails/index.test.tsx
index 28cf65be1e8e..dbc7fc1e722a 100644
--- a/app/components/Views/MultichainAccounts/WalletDetails/BaseWalletDetails/index.test.tsx
+++ b/app/components/Views/MultichainAccounts/WalletDetails/BaseWalletDetails/index.test.tsx
@@ -567,9 +567,9 @@ describe('BaseWalletDetails', () => {
 
         expect(mockNavigate).toHaveBeenCalledTimes(1);
         expect(mockNavigate).toHaveBeenCalledWith(
-          Routes.MODAL.ROOT_MODAL_FLOW,
+          Routes.SETTINGS.REVEAL_PRIVATE_CREDENTIAL,
           {
-            screen: Routes.MODAL.SRP_REVEAL_QUIZ,
+            popToTopOnDone: true,
             keyringId: 'keyring:1',
           },
         );
@@ -615,11 +615,10 @@ describe('BaseWalletDetails', () => {
 
         expect(mockNavigate).toHaveBeenCalledTimes(1);
         expect(mockNavigate).toHaveBeenCalledWith(
-          Routes.MODAL.ROOT_MODAL_FLOW,
-          {
-            screen: Routes.MODAL.SRP_REVEAL_QUIZ,
-            keyringId: 'keyring:1',
-          },
+          Routes.SETTINGS.REVEAL_PRIVATE_CREDENTIAL,
+          expect.objectContaining({
+            popToTopOnDone: true,
+          }),
         );
       });
     });
@@ -663,11 +662,10 @@ describe('BaseWalletDetails', () => {
 
         expect(mockNavigate).toHaveBeenCalledTimes(1);
         expect(mockNavigate).toHaveBeenCalledWith(
-          Routes.MODAL.ROOT_MODAL_FLOW,
-          {
-            screen: Routes.MODAL.SRP_REVEAL_QUIZ,
-            keyringId: 'keyring:2',
-          },
+          Routes.SETTINGS.REVEAL_PRIVATE_CREDENTIAL,
+          expect.objectContaining({
+            popToTopOnDone: true,
+          }),
         );
       });
     });
diff --git a/app/components/Views/MultichainAccounts/WalletDetails/BaseWalletDetails/index.tsx b/app/components/Views/MultichainAccounts/WalletDetails/BaseWalletDetails/index.tsx
index 0f5fd6607bc7..25002a9c1f93 100644
--- a/app/components/Views/MultichainAccounts/WalletDetails/BaseWalletDetails/index.tsx
+++ b/app/components/Views/MultichainAccounts/WalletDetails/BaseWalletDetails/index.tsx
@@ -79,9 +79,9 @@ export const BaseWalletDetails = ({
 
   const handleRevealSRP = useCallback(() => {
     if (keyringId) {
-      navigation.navigate(Routes.MODAL.ROOT_MODAL_FLOW, {
-        screen: Routes.MODAL.SRP_REVEAL_QUIZ,
+      navigation.navigate(Routes.SETTINGS.REVEAL_PRIVATE_CREDENTIAL, {
         keyringId,
+        popToTopOnDone: true, // Return to wallet home and dismiss Accounts sheet + Wallet Details
       });
     }
   }, [navigation, keyringId]);
diff --git a/app/components/Views/NFTAutoDetectionModal/NFTAutoDetectionModal.test.tsx b/app/components/Views/NFTAutoDetectionModal/NFTAutoDetectionModal.test.tsx
index dc4d0d5e7f2b..0866a894076d 100644
--- a/app/components/Views/NFTAutoDetectionModal/NFTAutoDetectionModal.test.tsx
+++ b/app/components/Views/NFTAutoDetectionModal/NFTAutoDetectionModal.test.tsx
@@ -9,7 +9,7 @@ import Engine from '../../../core/Engine';
 import { fireEvent } from '@testing-library/react-native';
 import { RootState } from 'app/reducers';
 import { useAnalytics } from '../../hooks/useAnalytics/useAnalytics';
-import { AnalyticsEventBuilder } from '../../../util/analytics/AnalyticsEventBuilder';
+import { createMockUseAnalyticsHook } from '../../../util/test/analyticsMock';
 
 const setUseNftDetectionSpy = jest.spyOn(
   Engine.context.PreferencesController,
@@ -44,20 +44,6 @@ jest.mock('../../hooks/useAnalytics/useAnalytics');
 const mockTrackEvent = jest.fn();
 const mockAddTraitsToUser = jest.fn();
 
-(useAnalytics as jest.MockedFn<typeof useAnalytics>).mockReturnValue({
-  trackEvent: mockTrackEvent,
-  createEventBuilder: AnalyticsEventBuilder.createEventBuilder,
-  enable: jest.fn(),
-  addTraitsToUser: mockAddTraitsToUser,
-  createDataDeletionTask: jest.fn(),
-  checkDataDeleteStatus: jest.fn(),
-  getDeleteRegulationCreationDate: jest.fn(),
-  getDeleteRegulationId: jest.fn(),
-  isDataRecorded: jest.fn(),
-  isEnabled: jest.fn(),
-  getAnalyticsId: jest.fn(),
-});
-
 const Stack = createStackNavigator();
 
 const renderComponent = (state: DeepPartial<RootState> = {}) =>
@@ -70,6 +56,14 @@ const renderComponent = (state: DeepPartial<RootState> = {}) =>
     { state },
   );
 describe('NFT Auto detection modal', () => {
+  beforeEach(() => {
+    jest.mocked(useAnalytics).mockReturnValue(
+      createMockUseAnalyticsHook({
+        trackEvent: mockTrackEvent,
+        addTraitsToUser: mockAddTraitsToUser,
+      }),
+    );
+  });
   afterEach(() => {
     jest.clearAllMocks();
   });
diff --git a/app/components/Views/NFTAutoDetectionModal/__snapshots__/NFTAutoDetectionModal.test.tsx.snap b/app/components/Views/NFTAutoDetectionModal/__snapshots__/NFTAutoDetectionModal.test.tsx.snap
index 941813644855..c00220f66312 100644
--- a/app/components/Views/NFTAutoDetectionModal/__snapshots__/NFTAutoDetectionModal.test.tsx.snap
+++ b/app/components/Views/NFTAutoDetectionModal/__snapshots__/NFTAutoDetectionModal.test.tsx.snap
@@ -334,7 +334,7 @@ exports[`NFT Auto detection modal render matches snapshot 1`] = `
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -384,7 +384,7 @@ exports[`NFT Auto detection modal render matches snapshot 1`] = `
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -421,7 +421,7 @@ exports[`NFT Auto detection modal render matches snapshot 1`] = `
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -452,9 +452,9 @@ exports[`NFT Auto detection modal render matches snapshot 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Bold",
-                                  "fontSize": 18,
+                                  "fontSize": 20,
                                   "letterSpacing": 0,
                                   "lineHeight": 24,
                                 }
@@ -503,7 +503,7 @@ exports[`NFT Auto detection modal render matches snapshot 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -517,7 +517,7 @@ exports[`NFT Auto detection modal render matches snapshot 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -532,7 +532,7 @@ exports[`NFT Auto detection modal render matches snapshot 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -547,7 +547,7 @@ exports[`NFT Auto detection modal render matches snapshot 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -579,7 +579,7 @@ exports[`NFT Auto detection modal render matches snapshot 1`] = `
                                   {
                                     "alignItems": "center",
                                     "alignSelf": "stretch",
-                                    "backgroundColor": "#121314",
+                                    "backgroundColor": "#131416",
                                     "borderRadius": 12,
                                     "flexDirection": "row",
                                     "height": 48,
diff --git a/app/components/Views/NetworkConnect/NetworkConnectMultiSelector/__snapshots__/NetworkConnectMultiSelector.test.tsx.snap b/app/components/Views/NetworkConnect/NetworkConnectMultiSelector/__snapshots__/NetworkConnectMultiSelector.test.tsx.snap
index 633277d922e9..4098677b5ae8 100644
--- a/app/components/Views/NetworkConnect/NetworkConnectMultiSelector/__snapshots__/NetworkConnectMultiSelector.test.tsx.snap
+++ b/app/components/Views/NetworkConnect/NetworkConnectMultiSelector/__snapshots__/NetworkConnectMultiSelector.test.tsx.snap
@@ -48,7 +48,7 @@ exports[`NetworkConnectMultiSelector renders correctly 1`] = `
           testID="sheet-header-back-button"
         >
           <SvgMock
-            color="#121314"
+            color="#131416"
             fill="currentColor"
             height={20}
             name="ArrowLeft"
@@ -66,9 +66,9 @@ exports[`NetworkConnectMultiSelector renders correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Bold",
-            "fontSize": 18,
+            "fontSize": 20,
             "letterSpacing": 0,
             "lineHeight": 24,
           }
@@ -153,7 +153,7 @@ exports[`NetworkConnectMultiSelector renders correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -357,7 +357,7 @@ exports[`NetworkConnectMultiSelector renders correctly 1`] = `
                         numberOfLines={1}
                         style={
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "fontFamily": "Geist-Regular",
                             "fontSize": 16,
                             "letterSpacing": 0,
@@ -377,7 +377,7 @@ exports[`NetworkConnectMultiSelector renders correctly 1`] = `
                 accessible={true}
                 style={
                   {
-                    "backgroundColor": "#3c4d9d0f",
+                    "backgroundColor": "#b4b4b528",
                     "bottom": 0,
                     "flexDirection": "row",
                     "left": 0,
@@ -448,7 +448,7 @@ exports[`NetworkConnectMultiSelector renders correctly 1`] = `
                           {
                             "alignItems": "center",
                             "backgroundColor": "#ffffff",
-                            "borderColor": "#b7bbc8",
+                            "borderColor": "#949596",
                             "borderRadius": 4,
                             "borderWidth": 2,
                             "height": 20,
@@ -517,7 +517,7 @@ exports[`NetworkConnectMultiSelector renders correctly 1`] = `
                         numberOfLines={1}
                         style={
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "fontFamily": "Geist-Regular",
                             "fontSize": 16,
                             "letterSpacing": 0,
@@ -573,7 +573,7 @@ exports[`NetworkConnectMultiSelector renders correctly 1`] = `
               {
                 "alignItems": "center",
                 "alignSelf": "flex-start",
-                "backgroundColor": "#121314",
+                "backgroundColor": "#131416",
                 "borderRadius": 12,
                 "flex": 1,
                 "flexDirection": "row",
diff --git a/app/components/Views/NetworkSelector/NetworkSelector.styles.ts b/app/components/Views/NetworkSelector/NetworkSelector.styles.ts
index ae0672aad872..1d4fb3d9eee3 100644
--- a/app/components/Views/NetworkSelector/NetworkSelector.styles.ts
+++ b/app/components/Views/NetworkSelector/NetworkSelector.styles.ts
@@ -202,7 +202,6 @@ const createStyles = (colors: Colors) =>
     },
     noNetworkFeeContainer: {
       alignSelf: 'center',
-      height: 22,
     },
   });
 
diff --git a/app/components/Views/NetworkSelector/NetworkSelector.tsx b/app/components/Views/NetworkSelector/NetworkSelector.tsx
index 9b8a2f5582b5..f1a34a6fed89 100644
--- a/app/components/Views/NetworkSelector/NetworkSelector.tsx
+++ b/app/components/Views/NetworkSelector/NetworkSelector.tsx
@@ -563,13 +563,17 @@ const NetworkSelector = ({ route }: NetworkSelectorProps) => {
                       <TagColored
                         color={TagColor.Success}
                         style={styles.noNetworkFeeContainer}
+                        labelProps={{
+                          variant: TextVariant.BodySM,
+                          style: {
+                            textTransform: 'none',
+                            textAlign: 'center',
+                            bottom: 1,
+                            fontWeight: 'normal',
+                          },
+                        }}
                       >
-                        <Text
-                          variant={TextVariant.BodySM}
-                          color={TextColor.Success}
-                        >
-                          {strings('networks.no_network_fee')}
-                        </Text>
+                        {strings('networks.no_network_fee')}
                       </TagColored>
                     ) : undefined}
                   </Box>
diff --git a/app/components/Views/NetworkSelector/RpcSelectionModal/__snapshots__/RpcSelectionModal.test.tsx.snap b/app/components/Views/NetworkSelector/RpcSelectionModal/__snapshots__/RpcSelectionModal.test.tsx.snap
index b1daa3901d58..6aa30c740861 100644
--- a/app/components/Views/NetworkSelector/RpcSelectionModal/__snapshots__/RpcSelectionModal.test.tsx.snap
+++ b/app/components/Views/NetworkSelector/RpcSelectionModal/__snapshots__/RpcSelectionModal.test.tsx.snap
@@ -23,7 +23,7 @@ exports[`RpcSelectionModal should render correctly when visible 1`] = `
     style={
       [
         {
-          "backgroundColor": "#3f434a66",
+          "backgroundColor": "#0a0d135c",
           "bottom": 0,
           "left": 0,
           "position": "absolute",
@@ -73,7 +73,7 @@ exports[`RpcSelectionModal should render correctly when visible 1`] = `
         [
           {
             "backgroundColor": "#ffffff",
-            "borderColor": "#b7bbc866",
+            "borderColor": "#b4b4b566",
             "borderTopLeftRadius": 24,
             "borderTopRightRadius": 24,
             "borderWidth": 1,
@@ -110,7 +110,7 @@ exports[`RpcSelectionModal should render correctly when visible 1`] = `
         <View
           style={
             {
-              "backgroundColor": "#b7bbc866",
+              "backgroundColor": "#b4b4b566",
               "borderRadius": 2,
               "height": 4,
               "width": 40,
@@ -153,9 +153,9 @@ exports[`RpcSelectionModal should render correctly when visible 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
-                "fontSize": 18,
+                "fontSize": 20,
                 "letterSpacing": 0,
                 "lineHeight": 24,
               }
@@ -179,7 +179,7 @@ exports[`RpcSelectionModal should render correctly when visible 1`] = `
             style={
               {
                 "backgroundColor": "#ffffff",
-                "borderColor": "#b7bbc8",
+                "borderColor": "#949596",
                 "borderRadius": 4,
                 "borderWidth": 1,
                 "padding": 16,
@@ -236,7 +236,7 @@ exports[`RpcSelectionModal should render correctly when visible 1`] = `
                   numberOfLines={1}
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -259,7 +259,7 @@ exports[`RpcSelectionModal should render correctly when visible 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -313,7 +313,7 @@ exports[`RpcSelectionModal should render correctly when visible 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -331,7 +331,7 @@ exports[`RpcSelectionModal should render correctly when visible 1`] = `
             accessible={true}
             style={
               {
-                "backgroundColor": "#3c4d9d0f",
+                "backgroundColor": "#b4b4b528",
                 "bottom": 0,
                 "flexDirection": "row",
                 "left": 0,
diff --git a/app/components/Views/NetworkSelector/__snapshots__/NetworkSelector.test.tsx.snap b/app/components/Views/NetworkSelector/__snapshots__/NetworkSelector.test.tsx.snap
index c8bdea858cb9..ba28aed9c8dd 100644
--- a/app/components/Views/NetworkSelector/__snapshots__/NetworkSelector.test.tsx.snap
+++ b/app/components/Views/NetworkSelector/__snapshots__/NetworkSelector.test.tsx.snap
@@ -341,7 +341,7 @@ exports[`Network Selector renders correctly 1`] = `
                           style={
                             [
                               {
-                                "backgroundColor": "#3f434a66",
+                                "backgroundColor": "#0a0d135c",
                                 "bottom": 0,
                                 "left": 0,
                                 "position": "absolute",
@@ -404,7 +404,7 @@ exports[`Network Selector renders correctly 1`] = `
                             style={
                               {
                                 "alignSelf": "center",
-                                "backgroundColor": "#b7bbc8",
+                                "backgroundColor": "#949596",
                                 "borderRadius": 4,
                                 "height": 5,
                                 "marginTop": 8,
@@ -416,9 +416,9 @@ exports[`Network Selector renders correctly 1`] = `
                             accessibilityRole="text"
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Bold",
-                                "fontSize": 18,
+                                "fontSize": 20,
                                 "letterSpacing": 0,
                                 "lineHeight": 24,
                                 "marginBottom": 8,
@@ -442,10 +442,10 @@ exports[`Network Selector renders correctly 1`] = `
                               style={
                                 {
                                   "alignItems": "center",
-                                  "borderColor": "#b7bbc8",
+                                  "borderColor": "#949596",
                                   "borderRadius": 5,
                                   "borderWidth": 1,
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "flexDirection": "row",
                                   "paddingHorizontal": 10,
                                   "paddingVertical": 10,
@@ -458,7 +458,7 @@ exports[`Network Selector renders correctly 1`] = `
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontSize": 20,
                                     },
                                     undefined,
@@ -476,10 +476,10 @@ exports[`Network Selector renders correctly 1`] = `
                               <TextInput
                                 onChangeText={[Function]}
                                 placeholder="Search for previously added network"
-                                placeholderTextColor="#121314"
+                                placeholderTextColor="#131416"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "flex": 1,
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 14,
@@ -594,7 +594,7 @@ exports[`Network Selector renders correctly 1`] = `
                                             numberOfLines={1}
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Regular",
                                                 "fontSize": 16,
                                                 "letterSpacing": 0,
@@ -614,7 +614,7 @@ exports[`Network Selector renders correctly 1`] = `
                                     accessible={true}
                                     style={
                                       {
-                                        "backgroundColor": "#3c4d9d0f",
+                                        "backgroundColor": "#b4b4b528",
                                         "bottom": 0,
                                         "flexDirection": "row",
                                         "left": 0,
@@ -703,7 +703,7 @@ exports[`Network Selector renders correctly 1`] = `
                                             numberOfLines={1}
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Regular",
                                                 "fontSize": 16,
                                                 "letterSpacing": 0,
@@ -799,7 +799,7 @@ exports[`Network Selector renders correctly 1`] = `
                                             numberOfLines={1}
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Regular",
                                                 "fontSize": 16,
                                                 "letterSpacing": 0,
@@ -895,7 +895,7 @@ exports[`Network Selector renders correctly 1`] = `
                                             numberOfLines={1}
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Regular",
                                                 "fontSize": 16,
                                                 "letterSpacing": 0,
@@ -991,7 +991,7 @@ exports[`Network Selector renders correctly 1`] = `
                                             numberOfLines={1}
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Regular",
                                                 "fontSize": 16,
                                                 "letterSpacing": 0,
@@ -1050,7 +1050,7 @@ exports[`Network Selector renders correctly 1`] = `
                                           style={
                                             {
                                               "alignItems": "center",
-                                              "backgroundColor": "#f3f5f9",
+                                              "backgroundColor": "#f3f3f4",
                                               "borderRadius": 16,
                                               "borderWidth": 1,
                                               "height": 32,
@@ -1066,7 +1066,7 @@ exports[`Network Selector renders correctly 1`] = `
                                             accessibilityRole="text"
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Regular",
                                                 "fontSize": 16,
                                                 "letterSpacing": 0,
@@ -1090,7 +1090,7 @@ exports[`Network Selector renders correctly 1`] = `
                                             numberOfLines={1}
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Regular",
                                                 "fontSize": 16,
                                                 "letterSpacing": 0,
@@ -1186,7 +1186,7 @@ exports[`Network Selector renders correctly 1`] = `
                                             numberOfLines={1}
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Regular",
                                                 "fontSize": 16,
                                                 "letterSpacing": 0,
@@ -1282,7 +1282,7 @@ exports[`Network Selector renders correctly 1`] = `
                                             numberOfLines={1}
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Regular",
                                                 "fontSize": 16,
                                                 "letterSpacing": 0,
@@ -1378,7 +1378,7 @@ exports[`Network Selector renders correctly 1`] = `
                                             numberOfLines={1}
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Regular",
                                                 "fontSize": 16,
                                                 "letterSpacing": 0,
@@ -1409,9 +1409,9 @@ exports[`Network Selector renders correctly 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                         "fontFamily": "Geist-Medium",
-                                        "fontSize": 18,
+                                        "fontSize": 20,
                                         "letterSpacing": 0,
                                         "lineHeight": 24,
                                       }
@@ -1433,14 +1433,14 @@ exports[`Network Selector renders correctly 1`] = `
                                           "width": 51,
                                         },
                                         {
-                                          "backgroundColor": "#b7bbc866",
+                                          "backgroundColor": "#b4b4b566",
                                           "borderRadius": 16,
                                         },
                                       ]
                                     }
                                     testID="test-network-switch-id"
                                     thumbTintColor="#ffffff"
-                                    tintColor="#b7bbc866"
+                                    tintColor="#b4b4b566"
                                     value={false}
                                   />
                                 </View>
@@ -1457,7 +1457,7 @@ exports[`Network Selector renders correctly 1`] = `
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#3c4d9d0f",
+                                  "backgroundColor": "#b4b4b528",
                                   "borderColor": "transparent",
                                   "borderRadius": 12,
                                   "borderWidth": 1,
@@ -1476,7 +1476,7 @@ exports[`Network Selector renders correctly 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Medium",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -1844,7 +1844,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                           style={
                             [
                               {
-                                "backgroundColor": "#3f434a66",
+                                "backgroundColor": "#0a0d135c",
                                 "bottom": 0,
                                 "left": 0,
                                 "position": "absolute",
@@ -1907,7 +1907,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                             style={
                               {
                                 "alignSelf": "center",
-                                "backgroundColor": "#b7bbc8",
+                                "backgroundColor": "#949596",
                                 "borderRadius": 4,
                                 "height": 5,
                                 "marginTop": 8,
@@ -1919,9 +1919,9 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                             accessibilityRole="text"
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Bold",
-                                "fontSize": 18,
+                                "fontSize": 20,
                                 "letterSpacing": 0,
                                 "lineHeight": 24,
                                 "marginBottom": 8,
@@ -1945,10 +1945,10 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                               style={
                                 {
                                   "alignItems": "center",
-                                  "borderColor": "#b7bbc8",
+                                  "borderColor": "#949596",
                                   "borderRadius": 5,
                                   "borderWidth": 1,
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "flexDirection": "row",
                                   "paddingHorizontal": 10,
                                   "paddingVertical": 10,
@@ -1961,7 +1961,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontSize": 20,
                                     },
                                     undefined,
@@ -1981,11 +1981,11 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                 onChangeText={[Function]}
                                 onFocus={[Function]}
                                 placeholder="Search"
-                                placeholderTextColor="#121314"
+                                placeholderTextColor="#131416"
                                 style={
                                   {
-                                    "borderColor": "#b7bbc8",
-                                    "color": "#121314",
+                                    "borderColor": "#949596",
+                                    "color": "#131416",
                                     "flex": 1,
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 14,
@@ -2035,9 +2035,9 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                         "fontFamily": "Geist-Medium",
-                                        "fontSize": 18,
+                                        "fontSize": 20,
                                         "letterSpacing": 0,
                                         "lineHeight": 24,
                                       }
@@ -2050,7 +2050,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                   style={
                                     {
                                       "alignItems": "center",
-                                      "backgroundColor": "#3c4d9d0f",
+                                      "backgroundColor": "#b4b4b528",
                                       "flexDirection": "row",
                                     }
                                   }
@@ -2145,7 +2145,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                               numberOfLines={1}
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Regular",
                                                   "fontSize": 16,
                                                   "letterSpacing": 0,
@@ -2190,7 +2190,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                                 numberOfLines={1}
                                                 style={
                                                   {
-                                                    "color": "#686e7d",
+                                                    "color": "#66676a",
                                                     "fontFamily": "Geist-Regular",
                                                     "fontSize": 16,
                                                     "letterSpacing": 0,
@@ -2201,7 +2201,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                                 mainnet-rpc.publicnode.com
                                               </Text>
                                               <SvgMock
-                                                color="#121314"
+                                                color="#131416"
                                                 fill="currentColor"
                                                 height={10}
                                                 name="ArrowDown"
@@ -2249,7 +2249,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                       testID="button-menu-select-test-id"
                                     >
                                       <SvgMock
-                                        color="#121314"
+                                        color="#131416"
                                         fill="currentColor"
                                         height={20}
                                         name="MoreVertical"
@@ -2363,7 +2363,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                               numberOfLines={1}
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Regular",
                                                   "fontSize": 16,
                                                   "letterSpacing": 0,
@@ -2408,7 +2408,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                                 numberOfLines={1}
                                                 style={
                                                   {
-                                                    "color": "#686e7d",
+                                                    "color": "#66676a",
                                                     "fontFamily": "Geist-Regular",
                                                     "fontSize": 16,
                                                     "letterSpacing": 0,
@@ -2419,7 +2419,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                                 linea-rpc.publicnode.com
                                               </Text>
                                               <SvgMock
-                                                color="#121314"
+                                                color="#131416"
                                                 fill="currentColor"
                                                 height={10}
                                                 name="ArrowDown"
@@ -2467,7 +2467,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                       testID="button-menu-select-test-id"
                                     >
                                       <SvgMock
-                                        color="#121314"
+                                        color="#131416"
                                         fill="currentColor"
                                         height={20}
                                         name="MoreVertical"
@@ -2593,7 +2593,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Regular",
                                                       "fontSize": 16,
                                                       "letterSpacing": 0,
@@ -2639,7 +2639,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                                 numberOfLines={1}
                                                 style={
                                                   {
-                                                    "color": "#686e7d",
+                                                    "color": "#66676a",
                                                     "fontFamily": "Geist-Regular",
                                                     "fontSize": 16,
                                                     "letterSpacing": 0,
@@ -2650,7 +2650,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                                 api.avax.network/ext/bc/C
                                               </Text>
                                               <SvgMock
-                                                color="#121314"
+                                                color="#131416"
                                                 fill="currentColor"
                                                 height={10}
                                                 name="ArrowDown"
@@ -2698,7 +2698,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                       testID="button-menu-select-test-id"
                                     >
                                       <SvgMock
-                                        color="#121314"
+                                        color="#131416"
                                         fill="currentColor"
                                         height={20}
                                         name="MoreVertical"
@@ -2824,7 +2824,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Regular",
                                                       "fontSize": 16,
                                                       "letterSpacing": 0,
@@ -2870,7 +2870,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                                 numberOfLines={1}
                                                 style={
                                                   {
-                                                    "color": "#686e7d",
+                                                    "color": "#66676a",
                                                     "fontFamily": "Geist-Regular",
                                                     "fontSize": 16,
                                                     "letterSpacing": 0,
@@ -2881,7 +2881,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                                 polygon-mainnet.infura.io/v3
                                               </Text>
                                               <SvgMock
-                                                color="#121314"
+                                                color="#131416"
                                                 fill="currentColor"
                                                 height={10}
                                                 name="ArrowDown"
@@ -2929,7 +2929,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                       testID="button-menu-select-test-id"
                                     >
                                       <SvgMock
-                                        color="#121314"
+                                        color="#131416"
                                         fill="currentColor"
                                         height={20}
                                         name="MoreVertical"
@@ -3055,7 +3055,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Regular",
                                                       "fontSize": 16,
                                                       "letterSpacing": 0,
@@ -3101,7 +3101,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                                 numberOfLines={1}
                                                 style={
                                                   {
-                                                    "color": "#686e7d",
+                                                    "color": "#66676a",
                                                     "fontFamily": "Geist-Regular",
                                                     "fontSize": 16,
                                                     "letterSpacing": 0,
@@ -3112,7 +3112,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                                 optimism-mainnet.infura.io/v3
                                               </Text>
                                               <SvgMock
-                                                color="#121314"
+                                                color="#131416"
                                                 fill="currentColor"
                                                 height={10}
                                                 name="ArrowDown"
@@ -3160,7 +3160,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                       testID="button-menu-select-test-id"
                                     >
                                       <SvgMock
-                                        color="#121314"
+                                        color="#131416"
                                         fill="currentColor"
                                         height={20}
                                         name="MoreVertical"
@@ -3237,7 +3237,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                             style={
                                               {
                                                 "alignItems": "center",
-                                                "backgroundColor": "#f3f5f9",
+                                                "backgroundColor": "#f3f3f4",
                                                 "borderRadius": 12,
                                                 "borderWidth": 1,
                                                 "height": 24,
@@ -3253,7 +3253,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                               accessibilityRole="text"
                                               style={
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Regular",
                                                   "fontSize": 16,
                                                   "letterSpacing": 0,
@@ -3289,7 +3289,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                                   accessibilityRole="text"
                                                   style={
                                                     {
-                                                      "color": "#121314",
+                                                      "color": "#131416",
                                                       "fontFamily": "Geist-Regular",
                                                       "fontSize": 16,
                                                       "letterSpacing": 0,
@@ -3335,7 +3335,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                                 numberOfLines={1}
                                                 style={
                                                   {
-                                                    "color": "#686e7d",
+                                                    "color": "#66676a",
                                                     "fontFamily": "Geist-Regular",
                                                     "fontSize": 16,
                                                     "letterSpacing": 0,
@@ -3346,7 +3346,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                                 rpc.gnosischain.com
                                               </Text>
                                               <SvgMock
-                                                color="#121314"
+                                                color="#131416"
                                                 fill="currentColor"
                                                 height={10}
                                                 name="ArrowDown"
@@ -3394,7 +3394,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                       testID="button-menu-select-test-id"
                                     >
                                       <SvgMock
-                                        color="#121314"
+                                        color="#131416"
                                         fill="currentColor"
                                         height={20}
                                         name="MoreVertical"
@@ -3489,7 +3489,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                             numberOfLines={1}
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Regular",
                                                 "fontSize": 16,
                                                 "letterSpacing": 0,
@@ -3585,7 +3585,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                             numberOfLines={1}
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Regular",
                                                 "fontSize": 16,
                                                 "letterSpacing": 0,
@@ -3681,7 +3681,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                             numberOfLines={1}
                                             style={
                                               {
-                                                "color": "#121314",
+                                                "color": "#131416",
                                                 "fontFamily": "Geist-Regular",
                                                 "fontSize": 16,
                                                 "letterSpacing": 0,
@@ -3712,9 +3712,9 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                         "fontFamily": "Geist-Medium",
-                                        "fontSize": 18,
+                                        "fontSize": 20,
                                         "letterSpacing": 0,
                                         "lineHeight": 24,
                                       }
@@ -3749,7 +3749,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                             "fontSize": 14,
                                           },
                                           {
-                                            "color": "#686e7d",
+                                            "color": "#66676a",
                                           },
                                           {
                                             "fontFamily": "Material Design Icons",
@@ -3850,7 +3850,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                             style={
                                               [
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Regular",
                                                   "fontSize": 30,
                                                   "marginVertical": 2,
@@ -3897,7 +3897,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                     />
                                     <View>
                                       <SvgMock
-                                        color="#121314"
+                                        color="#131416"
                                         fill="currentColor"
                                         height={24}
                                         name="Add"
@@ -3992,7 +3992,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                             style={
                                               [
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Regular",
                                                   "fontSize": 30,
                                                   "marginVertical": 2,
@@ -4030,10 +4030,10 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                             style={
                                               {
                                                 "alignItems": "center",
-                                                "alignSelf": "center",
+                                                "alignSelf": "flex-end",
                                                 "backgroundColor": "#457a391a",
                                                 "borderRadius": 4,
-                                                "height": 22,
+                                                "height": 20,
                                                 "justifyContent": "center",
                                                 "paddingHorizontal": 8,
                                               }
@@ -4044,13 +4044,18 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                               accessibilityRole="text"
                                               style={
                                                 {
+                                                  "bottom": 1,
                                                   "color": "#457a39",
                                                   "fontFamily": "Geist-Regular",
                                                   "fontSize": 14,
+                                                  "fontWeight": "normal",
                                                   "letterSpacing": 0,
                                                   "lineHeight": 22,
+                                                  "textAlign": "center",
+                                                  "textTransform": "none",
                                                 }
                                               }
+                                              testID="tagcolored-text"
                                             >
                                               No network fee
                                             </Text>
@@ -4068,7 +4073,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                     />
                                     <View>
                                       <SvgMock
-                                        color="#121314"
+                                        color="#131416"
                                         fill="currentColor"
                                         height={24}
                                         name="Add"
@@ -4163,7 +4168,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                             style={
                                               [
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Regular",
                                                   "fontSize": 30,
                                                   "marginVertical": 2,
@@ -4210,7 +4215,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                     />
                                     <View>
                                       <SvgMock
-                                        color="#121314"
+                                        color="#131416"
                                         fill="currentColor"
                                         height={24}
                                         name="Add"
@@ -4305,7 +4310,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                             style={
                                               [
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Regular",
                                                   "fontSize": 30,
                                                   "marginVertical": 2,
@@ -4352,7 +4357,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                     />
                                     <View>
                                       <SvgMock
-                                        color="#121314"
+                                        color="#131416"
                                         fill="currentColor"
                                         height={24}
                                         name="Add"
@@ -4447,7 +4452,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                             style={
                                               [
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Regular",
                                                   "fontSize": 30,
                                                   "marginVertical": 2,
@@ -4494,7 +4499,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                     />
                                     <View>
                                       <SvgMock
-                                        color="#121314"
+                                        color="#131416"
                                         fill="currentColor"
                                         height={24}
                                         name="Add"
@@ -4589,7 +4594,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                             style={
                                               [
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Regular",
                                                   "fontSize": 30,
                                                   "marginVertical": 2,
@@ -4636,7 +4641,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                     />
                                     <View>
                                       <SvgMock
-                                        color="#121314"
+                                        color="#131416"
                                         fill="currentColor"
                                         height={24}
                                         name="Add"
@@ -4731,7 +4736,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                             style={
                                               [
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Regular",
                                                   "fontSize": 30,
                                                   "marginVertical": 2,
@@ -4778,7 +4783,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                     />
                                     <View>
                                       <SvgMock
-                                        color="#121314"
+                                        color="#131416"
                                         fill="currentColor"
                                         height={24}
                                         name="Add"
@@ -4873,7 +4878,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                             style={
                                               [
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Regular",
                                                   "fontSize": 30,
                                                   "marginVertical": 2,
@@ -4920,7 +4925,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                     />
                                     <View>
                                       <SvgMock
-                                        color="#121314"
+                                        color="#131416"
                                         fill="currentColor"
                                         height={24}
                                         name="Add"
@@ -5015,7 +5020,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                             style={
                                               [
                                                 {
-                                                  "color": "#121314",
+                                                  "color": "#131416",
                                                   "fontFamily": "Geist-Regular",
                                                   "fontSize": 30,
                                                   "marginVertical": 2,
@@ -5062,7 +5067,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                     />
                                     <View>
                                       <SvgMock
-                                        color="#121314"
+                                        color="#131416"
                                         fill="currentColor"
                                         height={24}
                                         name="Add"
@@ -5094,9 +5099,9 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                         "fontFamily": "Geist-Medium",
-                                        "fontSize": 18,
+                                        "fontSize": 20,
                                         "letterSpacing": 0,
                                         "lineHeight": 24,
                                       }
@@ -5118,14 +5123,14 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                           "width": 51,
                                         },
                                         {
-                                          "backgroundColor": "#b7bbc866",
+                                          "backgroundColor": "#b4b4b566",
                                           "borderRadius": 16,
                                         },
                                       ]
                                     }
                                     testID="test-network-switch-id"
                                     thumbTintColor="#ffffff"
-                                    tintColor="#b7bbc866"
+                                    tintColor="#b4b4b566"
                                     value={false}
                                   />
                                 </View>
@@ -5142,7 +5147,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "stretch",
-                                  "backgroundColor": "#3c4d9d0f",
+                                  "backgroundColor": "#b4b4b528",
                                   "borderColor": "transparent",
                                   "borderRadius": 12,
                                   "borderWidth": 1,
@@ -5161,7 +5166,7 @@ exports[`Network Selector renders correctly when network UI redesign is enabled
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Medium",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
diff --git a/app/components/Views/NetworkSelector/useNetworkSwitch.test.ts b/app/components/Views/NetworkSelector/useNetworkSwitch.test.ts
index c0b0dee2b833..da03e53d5aab 100644
--- a/app/components/Views/NetworkSelector/useNetworkSwitch.test.ts
+++ b/app/components/Views/NetworkSelector/useNetworkSwitch.test.ts
@@ -4,6 +4,7 @@ import {
 } from '../../hooks/useNetworksByNamespace/useNetworksByNamespace';
 import { useNetworkSelection } from '../../hooks/useNetworkSelection/useNetworkSelection';
 import { useAnalytics } from '../../hooks/useAnalytics/useAnalytics';
+import { createMockUseAnalyticsHook } from '../../../util/test/analyticsMock';
 import Engine from '../../../core/Engine';
 
 // Mock the feature flags
@@ -80,9 +81,7 @@ const mockUseNetworksByNamespace =
 const mockUseNetworkSelection = useNetworkSelection as jest.MockedFunction<
   typeof useNetworkSelection
 >;
-const mockUseAnalytics = useAnalytics as jest.MockedFunction<
-  typeof useAnalytics
->;
+const mockUseAnalytics = jest.mocked(useAnalytics);
 
 const mockSelectNetwork = jest.fn();
 const mockTrackEvent = jest.fn();
@@ -110,19 +109,12 @@ describe('useSwitchNetworks Feature Flag Tests', () => {
       customNetworksToReset: [],
     });
 
-    mockUseAnalytics.mockReturnValue({
-      trackEvent: mockTrackEvent,
-      createEventBuilder: mockCreateEventBuilder,
-      isEnabled: () => true,
-      enable: jest.fn(),
-      addTraitsToUser: jest.fn(),
-      createDataDeletionTask: jest.fn(),
-      checkDataDeleteStatus: jest.fn(),
-      getDeleteRegulationCreationDate: jest.fn(),
-      getDeleteRegulationId: jest.fn(),
-      isDataRecorded: jest.fn(),
-      getAnalyticsId: jest.fn(),
-    });
+    mockUseAnalytics.mockReturnValue(
+      createMockUseAnalyticsHook({
+        trackEvent: mockTrackEvent,
+        createEventBuilder: mockCreateEventBuilder,
+      }),
+    );
 
     // Mock the event builder
     mockCreateEventBuilder.mockReturnValue({
diff --git a/app/components/Views/NetworksManagement/NetworkDetailsView/NetworkDetailsView.test.tsx b/app/components/Views/NetworksManagement/NetworkDetailsView/NetworkDetailsView.test.tsx
index 375d14ffff2a..ad7f94e5fd45 100644
--- a/app/components/Views/NetworksManagement/NetworkDetailsView/NetworkDetailsView.test.tsx
+++ b/app/components/Views/NetworksManagement/NetworkDetailsView/NetworkDetailsView.test.tsx
@@ -765,6 +765,34 @@ describe('NetworkDetailsView', () => {
 
       expect(ops.removeNetwork).toHaveBeenCalledWith('0x2a');
     });
+
+    it('does not show trash icon when editing non-deletable network (e.g. Ethereum mainnet)', () => {
+      const mainnetEditForm = createMockFormHook({
+        addMode: false,
+        nickname: 'Ethereum',
+        chainId: '0x1',
+        ticker: 'ETH',
+        rpcUrl: 'https://mainnet.infura.io/v3/key',
+        rpcName: 'Infura',
+        rpcUrls: [
+          {
+            url: 'https://mainnet.infura.io/v3/key',
+            name: 'Infura',
+            type: 'infura',
+          },
+        ],
+        blockExplorerUrl: 'https://etherscan.io',
+        blockExplorerUrls: ['https://etherscan.io'],
+        editable: true,
+      });
+      mockFormHook.mockReturnValue(mainnetEditForm);
+
+      const { getByTestId } = render(<NetworkDetailsView />);
+
+      const container = getByTestId(NetworkDetailsViewSelectorsIDs.CONTAINER);
+      const trashIcons = container.findAllByProps({ name: 'Trash' });
+      expect(trashIcons).toHaveLength(0);
+    });
   });
 
   describe('RPC modal interactions', () => {
diff --git a/app/components/Views/NetworksManagement/NetworkDetailsView/NetworkDetailsView.tsx b/app/components/Views/NetworksManagement/NetworkDetailsView/NetworkDetailsView.tsx
index ba1f67445f49..d75b4e831419 100644
--- a/app/components/Views/NetworksManagement/NetworkDetailsView/NetworkDetailsView.tsx
+++ b/app/components/Views/NetworksManagement/NetworkDetailsView/NetworkDetailsView.tsx
@@ -24,7 +24,10 @@ import { CaipChainId } from '@metamask/utils';
 import { strings } from '../../../../../locales/i18n';
 import { useTheme } from '../../../../util/theme';
 import { useStyles } from '../../../../component-library/hooks/useStyles';
-import { getNetworkImageSource } from '../../../../util/networks';
+import {
+  canDeleteNetwork,
+  getNetworkImageSource,
+} from '../../../../util/networks';
 import { useNetworkEnablement } from '../../../hooks/useNetworkEnablement/useNetworkEnablement';
 import { selectIsRpcFailoverEnabled } from '../../../../selectors/featureFlagController/walletFramework';
 import HeaderCompactStandard from '../../../../component-library/components-temp/HeaderCompactStandard';
@@ -102,6 +105,7 @@ const NetworkDetailsView = () => {
 
   const isActionDisabled =
     !formHook.enableAction ||
+    formHook.form.editable === false ||
     validation.disabledByChainId(formHook.form) ||
     validation.disabledBySymbol(formHook.form);
 
@@ -186,7 +190,8 @@ const NetworkDetailsView = () => {
       <HeaderCompactStandard
         onBack={handleBack}
         endAccessory={
-          !formHook.form.addMode ? (
+          !formHook.form.addMode &&
+          canDeleteNetwork(formHook.form.chainId ?? '') ? (
             <Pressable
               onPress={handleDelete}
               style={({ pressed }) =>
diff --git a/app/components/Views/NetworksManagement/NetworkDetailsView/components/NetworkFormFields.tsx b/app/components/Views/NetworksManagement/NetworkDetailsView/components/NetworkFormFields.tsx
index 4085a49a1da1..9c2f9fe160d5 100644
--- a/app/components/Views/NetworksManagement/NetworkDetailsView/components/NetworkFormFields.tsx
+++ b/app/components/Views/NetworksManagement/NetworkDetailsView/components/NetworkFormFields.tsx
@@ -121,7 +121,7 @@ const NetworkNameField: React.FC<NetworkNameFieldProps> = ({
   placeholderTextColor,
 }) => {
   const {
-    form: { nickname },
+    form: { nickname, editable },
     isAnyModalVisible,
     onNicknameChange,
     autoFillNameField,
@@ -144,7 +144,7 @@ const NetworkNameField: React.FC<NetworkNameFieldProps> = ({
         autoCapitalize="none"
         autoCorrect={false}
         value={nickname}
-        isDisabled={isAnyModalVisible}
+        isDisabled={isAnyModalVisible || editable === false}
         onChangeText={onNicknameChange}
         placeholder={strings('app_settings.network_name_placeholder')}
         placeholderTextColor={placeholderTextColor}
@@ -200,7 +200,7 @@ const NetworkChainSymbolFields: React.FC<NetworkChainSymbolFieldsProps> = ({
   placeholderTextColor,
 }) => {
   const {
-    form: { chainId, ticker, addMode },
+    form: { chainId, ticker, addMode, editable },
     isAnyModalVisible,
     onChainIDChange,
     onTickerChange,
@@ -265,7 +265,7 @@ const NetworkChainSymbolFields: React.FC<NetworkChainSymbolFieldsProps> = ({
           autoCapitalize="none"
           autoCorrect={false}
           value={ticker}
-          isDisabled={isAnyModalVisible}
+          isDisabled={isAnyModalVisible || editable === false}
           onChangeText={onTickerChange}
           onBlur={handleSymbolBlur}
           onFocus={onSymbolFocused}
diff --git a/app/components/Views/NetworksManagement/NetworkDetailsView/hooks/useNetworkForm.test.ts b/app/components/Views/NetworksManagement/NetworkDetailsView/hooks/useNetworkForm.test.ts
index e36d2845b68d..75c7bfb6795e 100644
--- a/app/components/Views/NetworksManagement/NetworkDetailsView/hooks/useNetworkForm.test.ts
+++ b/app/components/Views/NetworksManagement/NetworkDetailsView/hooks/useNetworkForm.test.ts
@@ -112,6 +112,29 @@ describe('useNetworkForm', () => {
       expect(result.current.form.rpcUrl).toBe(
         'https://mainnet.infura.io/v3/key',
       );
+      // Built-in network (mainnet) is not editable regardless of entry point
+      expect(result.current.form.editable).toBe(false);
+    });
+
+    it('sets editable true when opened by RPC URL for non-built-in network', () => {
+      const customConfigs = {
+        '0x89': {
+          chainId: '0x89',
+          name: 'Polygon',
+          nativeCurrency: 'MATIC',
+          rpcEndpoints: [{ url: 'https://polygon-rpc.com', type: 'custom' }],
+          defaultRpcEndpointIndex: 0,
+          blockExplorerUrls: [],
+        },
+      };
+      mockUseSelector.mockReturnValue(customConfigs);
+
+      const { result } = renderHook(() =>
+        useNetworkForm({ network: 'https://polygon-rpc.com' }),
+      );
+
+      expect(result.current.form.addMode).toBe(false);
+      expect(result.current.form.nickname).toBe('Polygon');
       expect(result.current.form.editable).toBe(true);
     });
   });
diff --git a/app/components/Views/NetworksManagement/NetworkDetailsView/hooks/useNetworkForm.ts b/app/components/Views/NetworksManagement/NetworkDetailsView/hooks/useNetworkForm.ts
index ae744439729b..f5d1fcb93b7c 100644
--- a/app/components/Views/NetworksManagement/NetworkDetailsView/hooks/useNetworkForm.ts
+++ b/app/components/Views/NetworksManagement/NetworkDetailsView/hooks/useNetworkForm.ts
@@ -192,7 +192,16 @@ export const useNetworkForm = (
             );
           },
         );
-        editable = true;
+        // Use same rules as network selector: built-in networks are not editable
+        const builtInChainIds = allNetworks
+          .map(
+            (net) =>
+              (Networks as Record<string, { chainId?: string }>)[net]?.chainId,
+          )
+          .filter(Boolean) as string[];
+        editable =
+          !networkConfiguration?.chainId ||
+          !builtInChainIds.includes(networkConfiguration.chainId);
       }
 
       const chainId = networkConfiguration?.chainId;
diff --git a/app/components/Views/NftDetails/__snapshots__/NftDetails.test.ts.snap b/app/components/Views/NftDetails/__snapshots__/NftDetails.test.ts.snap
index 1c637454a9f5..9471a3bf83f3 100644
--- a/app/components/Views/NftDetails/__snapshots__/NftDetails.test.ts.snap
+++ b/app/components/Views/NftDetails/__snapshots__/NftDetails.test.ts.snap
@@ -511,7 +511,7 @@ exports[`NftDetails renders correctly 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Bold",
                                       "fontSize": 20,
                                       "letterSpacing": 0,
@@ -523,7 +523,7 @@ exports[`NftDetails renders correctly 1`] = `
                                   Aura #44
                                 </Text>
                                 <SvgMock
-                                  color="#121314"
+                                  color="#131416"
                                   fill="currentColor"
                                   height={20}
                                   name="SecurityTick"
@@ -544,7 +544,7 @@ exports[`NftDetails renders correctly 1`] = `
                                 onTextLayout={[Function]}
                                 style={
                                   {
-                                    "color": "#686e7d",
+                                    "color": "#66676a",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 12,
                                     "fontWeight": "400",
@@ -573,7 +573,7 @@ exports[`NftDetails renders correctly 1`] = `
                                 style={
                                   [
                                     {
-                                      "borderColor": "#b7bbc8",
+                                      "borderColor": "#949596",
                                       "borderRadius": 8,
                                       "borderWidth": 1,
                                       "flexGrow": 1,
@@ -599,7 +599,7 @@ exports[`NftDetails renders correctly 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 10,
                                         "fontWeight": "500",
@@ -624,7 +624,7 @@ exports[`NftDetails renders correctly 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 10,
                                         "fontWeight": "500",
@@ -641,7 +641,7 @@ exports[`NftDetails renders correctly 1`] = `
                                 style={
                                   [
                                     {
-                                      "borderColor": "#b7bbc8",
+                                      "borderColor": "#949596",
                                       "borderRadius": 8,
                                       "borderWidth": 1,
                                       "flexGrow": 1,
@@ -667,7 +667,7 @@ exports[`NftDetails renders correctly 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 10,
                                         "fontWeight": "500",
@@ -692,7 +692,7 @@ exports[`NftDetails renders correctly 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "fontWeight": "700",
@@ -707,13 +707,13 @@ exports[`NftDetails renders correctly 1`] = `
                                     onPress={[Function]}
                                   >
                                     <SvgMock
-                                      color="#121314"
+                                      color="#131416"
                                       fill="currentColor"
                                       height={12}
                                       name="Export"
                                       style={
                                         {
-                                          "color": "#686e7d",
+                                          "color": "#66676a",
                                           "height": 12,
                                           "paddingLeft": 16,
                                           "width": 12,
@@ -728,7 +728,7 @@ exports[`NftDetails renders correctly 1`] = `
                                 style={
                                   [
                                     {
-                                      "borderColor": "#b7bbc8",
+                                      "borderColor": "#949596",
                                       "borderRadius": 8,
                                       "borderWidth": 1,
                                       "flexGrow": 1,
@@ -754,7 +754,7 @@ exports[`NftDetails renders correctly 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 10,
                                         "fontWeight": "500",
@@ -779,7 +779,7 @@ exports[`NftDetails renders correctly 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 16,
                                         "fontWeight": "700",
@@ -796,7 +796,7 @@ exports[`NftDetails renders correctly 1`] = `
                                 style={
                                   [
                                     {
-                                      "borderColor": "#b7bbc8",
+                                      "borderColor": "#949596",
                                       "borderRadius": 8,
                                       "borderWidth": 1,
                                       "flexGrow": 1,
@@ -822,7 +822,7 @@ exports[`NftDetails renders correctly 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 10,
                                         "fontWeight": "500",
@@ -898,7 +898,7 @@ exports[`NftDetails renders correctly 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#686e7d",
+                                    "color": "#66676a",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 14,
                                     "fontWeight": "500",
@@ -913,7 +913,7 @@ exports[`NftDetails renders correctly 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 14,
                                     "fontWeight": "400",
@@ -941,7 +941,7 @@ exports[`NftDetails renders correctly 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#686e7d",
+                                    "color": "#66676a",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 14,
                                     "fontWeight": "500",
@@ -956,7 +956,7 @@ exports[`NftDetails renders correctly 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 14,
                                     "fontWeight": "400",
@@ -984,7 +984,7 @@ exports[`NftDetails renders correctly 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#686e7d",
+                                    "color": "#66676a",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 14,
                                     "fontWeight": "500",
@@ -999,7 +999,7 @@ exports[`NftDetails renders correctly 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 14,
                                     "fontWeight": "400",
@@ -1027,7 +1027,7 @@ exports[`NftDetails renders correctly 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#686e7d",
+                                    "color": "#66676a",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 14,
                                     "fontWeight": "500",
@@ -1042,7 +1042,7 @@ exports[`NftDetails renders correctly 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 14,
                                     "fontWeight": "400",
@@ -1058,7 +1058,7 @@ exports[`NftDetails renders correctly 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Bold",
                                   "fontSize": 20,
                                   "letterSpacing": 0,
@@ -1085,7 +1085,7 @@ exports[`NftDetails renders correctly 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#686e7d",
+                                    "color": "#66676a",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 14,
                                     "fontWeight": "500",
@@ -1100,7 +1100,7 @@ exports[`NftDetails renders correctly 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 14,
                                     "fontWeight": "400",
@@ -1116,7 +1116,7 @@ exports[`NftDetails renders correctly 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Bold",
                                   "fontSize": 20,
                                   "letterSpacing": 0,
@@ -1143,7 +1143,7 @@ exports[`NftDetails renders correctly 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#686e7d",
+                                    "color": "#66676a",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 14,
                                     "fontWeight": "500",
@@ -1167,7 +1167,7 @@ exports[`NftDetails renders correctly 1`] = `
                                   accessibilityRole="text"
                                   style={
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 14,
                                       "fontWeight": "400",
@@ -1182,13 +1182,13 @@ exports[`NftDetails renders correctly 1`] = `
                                   onPress={[Function]}
                                 >
                                   <SvgMock
-                                    color="#121314"
+                                    color="#131416"
                                     fill="currentColor"
                                     height={12}
                                     name="Export"
                                     style={
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                         "height": 12,
                                         "paddingLeft": 16,
                                         "width": 12,
@@ -1203,7 +1203,7 @@ exports[`NftDetails renders correctly 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Bold",
                                   "fontSize": 20,
                                   "letterSpacing": 0,
@@ -1231,7 +1231,7 @@ exports[`NftDetails renders correctly 1`] = `
                                 style={
                                   [
                                     {
-                                      "borderColor": "#b7bbc8",
+                                      "borderColor": "#949596",
                                       "borderRadius": 8,
                                       "borderWidth": 1,
                                       "flexGrow": 1,
@@ -1249,7 +1249,7 @@ exports[`NftDetails renders correctly 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#686e7d",
+                                        "color": "#66676a",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 14,
                                         "fontWeight": "500",
@@ -1266,7 +1266,7 @@ exports[`NftDetails renders correctly 1`] = `
                                     accessibilityRole="text"
                                     style={
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Regular",
                                         "fontSize": 14,
                                         "fontWeight": "400",
@@ -1291,7 +1291,7 @@ exports[`NftDetails renders correctly 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#686e7d",
+                                    "color": "#66676a",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
diff --git a/app/components/Views/Notifications/Details/Fields/NetworkFeeField.test.tsx b/app/components/Views/Notifications/Details/Fields/NetworkFeeField.test.tsx
index 30423bdc5670..2644662987f4 100644
--- a/app/components/Views/Notifications/Details/Fields/NetworkFeeField.test.tsx
+++ b/app/components/Views/Notifications/Details/Fields/NetworkFeeField.test.tsx
@@ -6,6 +6,7 @@ import { processNotification } from '@metamask/notification-services-controller/
 import { createMockNotificationEthReceived } from '@metamask/notification-services-controller/notification-services/mocks';
 import NetworkFeeFieldSkeleton from './Skeletons/NetworkFeeField';
 import { useAnalytics } from '../../../../hooks/useAnalytics/useAnalytics';
+import { createMockUseAnalyticsHook } from '../../../../../util/test/analyticsMock';
 
 jest.mock('../../../../../util/notifications/methods/common', () => ({
   getNetworkFees: () =>
@@ -36,19 +37,11 @@ describe('NetworkFeeField', () => {
 
   beforeEach(() => {
     jest.clearAllMocks();
-    (useAnalytics as jest.MockedFn<typeof useAnalytics>).mockReturnValue({
-      trackEvent: mockTrackEvent,
-      createEventBuilder: jest.fn(),
-      enable: jest.fn(),
-      addTraitsToUser: jest.fn(),
-      createDataDeletionTask: jest.fn(),
-      checkDataDeleteStatus: jest.fn(),
-      getDeleteRegulationCreationDate: jest.fn(),
-      getDeleteRegulationId: jest.fn(),
-      isDataRecorded: jest.fn(),
-      isEnabled: jest.fn(),
-      getAnalyticsId: jest.fn(),
-    });
+    jest
+      .mocked(useAnalytics)
+      .mockReturnValue(
+        createMockUseAnalyticsHook({ trackEvent: mockTrackEvent }),
+      );
   });
 
   it('renders correctly when type has "ModalField-NetworkFee"', () => {
diff --git a/app/components/Views/Notifications/Details/Footers/BlockExplorerFooter.test.tsx b/app/components/Views/Notifications/Details/Footers/BlockExplorerFooter.test.tsx
index 00e01b34d677..58d4759e7d8a 100644
--- a/app/components/Views/Notifications/Details/Footers/BlockExplorerFooter.test.tsx
+++ b/app/components/Views/Notifications/Details/Footers/BlockExplorerFooter.test.tsx
@@ -7,6 +7,7 @@ import type { OnChainRawNotification } from '@metamask/notification-services-con
 import { strings } from '../../../../../../locales/i18n';
 import BlockExplorerFooter from './BlockExplorerFooter';
 import { useAnalytics } from '../../../../hooks/useAnalytics/useAnalytics';
+import { createMockUseAnalyticsHook } from '../../../../../util/test/analyticsMock';
 import { MetaMetricsEvents } from '../../../../../core/Analytics';
 import { ModalFooterType } from '../../../../../util/notifications/constants/config';
 import {
@@ -33,20 +34,6 @@ jest.mock('../../../../hooks/useAnalytics/useAnalytics', () => ({
 
 const trackEventMock = jest.fn();
 
-(useAnalytics as jest.MockedFn<typeof useAnalytics>).mockReturnValue({
-  trackEvent: trackEventMock,
-  createEventBuilder: AnalyticsEventBuilder.createEventBuilder,
-  enable: jest.fn(),
-  addTraitsToUser: jest.fn(),
-  createDataDeletionTask: jest.fn(),
-  checkDataDeleteStatus: jest.fn(),
-  getDeleteRegulationCreationDate: jest.fn(),
-  getDeleteRegulationId: jest.fn(),
-  isDataRecorded: jest.fn(),
-  isEnabled: jest.fn(),
-  getAnalyticsId: jest.fn(),
-});
-
 jest.mock('react-native/Libraries/Linking/Linking', () => ({
   openURL: jest.fn(),
 }));
@@ -54,6 +41,14 @@ jest.mock('react-native/Libraries/Linking/Linking', () => ({
 describe('BlockExplorerFooter', () => {
   beforeEach(() => {
     jest.clearAllMocks();
+    jest.mocked(useAnalytics).mockReturnValue(
+      createMockUseAnalyticsHook({
+        trackEvent: trackEventMock,
+        // The real builder is needed so build() produces the correct event shape
+        // for assertions on trackEvent call arguments.
+        createEventBuilder: AnalyticsEventBuilder.createEventBuilder,
+      }),
+    );
   });
 
   it('returns null when no URL is available', () => {
diff --git a/app/components/Views/OAuthRehydration/index.test.tsx b/app/components/Views/OAuthRehydration/index.test.tsx
index 6a41f2907105..04564fd9ae5d 100644
--- a/app/components/Views/OAuthRehydration/index.test.tsx
+++ b/app/components/Views/OAuthRehydration/index.test.tsx
@@ -31,6 +31,7 @@ const mockLockApp = jest.fn();
 const mockReauthenticate = jest.fn();
 const mockRevealSRP = jest.fn();
 const mockRevealPrivateKey = jest.fn();
+const mockRequestBiometricsAccessControlForIOS = jest.fn();
 
 jest.mock('../../../core/Authentication/hooks/useAuthentication', () => ({
   __esModule: true,
@@ -42,6 +43,8 @@ jest.mock('../../../core/Authentication/hooks/useAuthentication', () => ({
     reauthenticate: mockReauthenticate,
     revealSRP: mockRevealSRP,
     revealPrivateKey: mockRevealPrivateKey,
+    requestBiometricsAccessControlForIOS:
+      mockRequestBiometricsAccessControlForIOS,
   }),
 }));
 
@@ -162,6 +165,9 @@ describe('OAuthRehydration', () => {
     mockComponentAuthenticationType.mockResolvedValue({
       currentAuthType: 'password',
     });
+    mockRequestBiometricsAccessControlForIOS.mockResolvedValue(
+      AUTHENTICATION_TYPE.PASSWORD,
+    );
     mockUseNetInfo.mockReturnValue({
       isConnected: true,
       isInternetReachable: true,
@@ -190,6 +196,9 @@ describe('OAuthRehydration', () => {
       await waitFor(() => {
         expect(mockReplace).toHaveBeenCalledWith(Routes.ONBOARDING.HOME_NAV);
       });
+      expect(mockRequestBiometricsAccessControlForIOS).toHaveBeenCalledWith(
+        AUTHENTICATION_TYPE.DEVICE_AUTHENTICATION,
+      );
     });
 
     it('tracks rehydration analytics on successful login', async () => {
diff --git a/app/components/Views/OAuthRehydration/index.tsx b/app/components/Views/OAuthRehydration/index.tsx
index 2122ae337604..40861623ab08 100644
--- a/app/components/Views/OAuthRehydration/index.tsx
+++ b/app/components/Views/OAuthRehydration/index.tsx
@@ -89,6 +89,7 @@ import HelpText, {
 import { useAuthentication } from '../../../core/Authentication';
 import { containsErrorMessage } from '../../../util/errorHandling';
 import AUTHENTICATION_TYPE from '../../../constants/userProperties';
+import type { AuthData } from '../../../core/Authentication/Authentication';
 
 const EmptyRecordConstant = {};
 
@@ -144,7 +145,7 @@ const OAuthRehydration: React.FC<OAuthRehydrationProps> = ({
 
   const passwordLoginAttemptTraceCtxRef = useRef<TraceContext | null>(null);
 
-  const { componentAuthenticationType, unlockWallet, getAuthType } =
+  const { unlockWallet, getAuthType, requestBiometricsAccessControlForIOS } =
     useAuthentication();
 
   const track = useCallback(
@@ -468,11 +469,16 @@ const OAuthRehydration: React.FC<OAuthRehydrationProps> = ({
 
       setLoading(true);
 
-      // try default with biometric if available and no remember me flag
-      const authType = await componentAuthenticationType(biometryChoice, false);
+      // Ask user to allow biometrics access control
+      const authType = await requestBiometricsAccessControlForIOS(
+        AUTHENTICATION_TYPE.DEVICE_AUTHENTICATION,
+      );
 
       // Only set oauth2Login for normal rehydration, not when password is outdated
-      authType.oauth2Login = true;
+      const authData: AuthData = {
+        currentAuthType: authType,
+        oauth2Login: true,
+      };
 
       await trace(
         {
@@ -480,7 +486,9 @@ const OAuthRehydration: React.FC<OAuthRehydrationProps> = ({
           op: TraceOperation.Login,
         },
         async () => {
-          await unlockWallet({ password, authPreference: authType });
+          await unlockWallet({ password, authPreference: authData });
+
+          // TODO: This should probably derive auth capabilities from getAuthCapabilities
           // prompt biometric failed alert if biometric failed
           await promptBiometricFailedAlert();
         },
@@ -513,8 +521,8 @@ const OAuthRehydration: React.FC<OAuthRehydrationProps> = ({
     passwordLoginAttemptTraceCtxRef,
     track,
     promptBiometricFailedAlert,
-    componentAuthenticationType,
     unlockWallet,
+    requestBiometricsAccessControlForIOS,
   ]);
 
   const newGlobalPasswordLogin = useCallback(async () => {
@@ -523,11 +531,16 @@ const OAuthRehydration: React.FC<OAuthRehydrationProps> = ({
 
       setLoading(true);
 
-      // try default with biometric if available and no remember me flag
-      const authType = await componentAuthenticationType(biometryChoice, false);
+      // Ask user to allow biometrics access control
+      const authType = await requestBiometricsAccessControlForIOS(
+        AUTHENTICATION_TYPE.DEVICE_AUTHENTICATION,
+      );
 
       // Only set oauth2Login for normal rehydration, not when password is outdated
-      authType.oauth2Login = false;
+      const authData: AuthData = {
+        currentAuthType: authType,
+        oauth2Login: false,
+      };
 
       await trace(
         {
@@ -535,7 +548,9 @@ const OAuthRehydration: React.FC<OAuthRehydrationProps> = ({
           op: TraceOperation.Login,
         },
         async () => {
-          await unlockWallet({ password, authPreference: authType });
+          await unlockWallet({ password, authPreference: authData });
+
+          // TODO: This should probably derive auth capabilities from getAuthCapabilities
           // prompt biometric failed alert if biometric failed
           await promptBiometricFailedAlert();
         },
@@ -548,12 +563,11 @@ const OAuthRehydration: React.FC<OAuthRehydrationProps> = ({
     }
   }, [
     password,
-    biometryChoice,
     finalLoading,
     handleLoginError,
     promptBiometricFailedAlert,
-    componentAuthenticationType,
     unlockWallet,
+    requestBiometricsAccessControlForIOS,
   ]);
 
   // Cleanup for isMountedRef tracking
diff --git a/app/components/Views/OfflineMode/__snapshots__/index.test.tsx.snap b/app/components/Views/OfflineMode/__snapshots__/index.test.tsx.snap
index f2b6770eceee..240824bb1dd0 100644
--- a/app/components/Views/OfflineMode/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/OfflineMode/__snapshots__/index.test.tsx.snap
@@ -41,7 +41,7 @@ exports[`OfflineMode should render correctly 1`] = `
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 30,
               "marginVertical": 2,
@@ -74,7 +74,7 @@ exports[`OfflineMode should render correctly 1`] = `
             undefined,
             undefined,
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Bold",
               "fontSize": 18,
               "marginBottom": 10,
@@ -88,7 +88,7 @@ exports[`OfflineMode should render correctly 1`] = `
         style={
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 30,
               "marginVertical": 2,
@@ -119,7 +119,7 @@ exports[`OfflineMode should render correctly 1`] = `
             undefined,
             undefined,
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 12,
             },
diff --git a/app/components/Views/Onboarding/Onboarding.testIds.ts b/app/components/Views/Onboarding/Onboarding.testIds.ts
index 395e14d6cb52..3684133af57a 100644
--- a/app/components/Views/Onboarding/Onboarding.testIds.ts
+++ b/app/components/Views/Onboarding/Onboarding.testIds.ts
@@ -21,4 +21,5 @@ export const OnboardingSelectorIDs = {
 
 export const OnboardingSelectorText = {
   SUCCESSFUL_WALLET_RESET: enContent.onboarding.your_wallet,
+  UNLOCK_BUTTON: enContent.onboarding.unlock,
 };
diff --git a/app/components/Views/Onboarding/index.test.tsx b/app/components/Views/Onboarding/index.test.tsx
index b1764e1a1944..8d3ba8ca9655 100644
--- a/app/components/Views/Onboarding/index.test.tsx
+++ b/app/components/Views/Onboarding/index.test.tsx
@@ -1484,6 +1484,62 @@ describe('Onboarding', () => {
       Platform.OS = 'ios';
     });
 
+    it('attempts browser fallback when no provider dependencies found in Android', async () => {
+      Platform.OS = 'android';
+      const noProviderDepsError = new OAuthError(
+        '',
+        OAuthErrorType.GoogleLoginNoProviderDependencies,
+      );
+      const fallbackError = new OAuthError('', OAuthErrorType.GoogleLoginError);
+
+      mockCreateLoginHandler
+        .mockReturnValueOnce('mockGoogleHandler')
+        .mockReturnValueOnce('mockGoogleFallbackHandler');
+      mockOAuthService.handleOAuthLogin
+        .mockRejectedValueOnce(noProviderDepsError)
+        .mockRejectedValueOnce(fallbackError);
+
+      mockNavigate.mockClear();
+      const { getByTestId } = renderScreen(
+        Onboarding,
+        { name: 'Onboarding' },
+        {
+          state: mockInitialState,
+        },
+      );
+
+      const createWalletButton = getByTestId(
+        OnboardingSelectorIDs.NEW_WALLET_BUTTON,
+      );
+      await act(async () => {
+        fireEvent.press(createWalletButton);
+      });
+
+      const navCall = mockNavigate.mock.calls.find(
+        (call) =>
+          call[0] === Routes.MODAL.ROOT_MODAL_FLOW &&
+          call[1]?.screen === Routes.SHEET.ONBOARDING_SHEET,
+      );
+
+      const googleOAuthFunction = navCall[1].params.onPressContinueWithGoogle;
+
+      mockNavigate.mockClear();
+      await act(async () => {
+        await googleOAuthFunction(true);
+      });
+
+      // Verify fallback was attempted
+      expect(mockCreateLoginHandler).toHaveBeenCalledWith('android', 'google');
+      expect(mockCreateLoginHandler).toHaveBeenCalledWith(
+        'android',
+        'google',
+        true,
+      );
+      expect(mockOAuthService.handleOAuthLogin).toHaveBeenCalledTimes(2);
+
+      Platform.OS = 'ios';
+    });
+
     it('wraps non-OAuthError from browser fallback as OAuthError with UnknownError type', async () => {
       Platform.OS = 'android';
       // Analytics disabled triggers ErrorBoundary flow with trackEvent
diff --git a/app/components/Views/Onboarding/index.tsx b/app/components/Views/Onboarding/index.tsx
index 927be85ae914..e8d3b31f3081 100644
--- a/app/components/Views/Onboarding/index.tsx
+++ b/app/components/Views/Onboarding/index.tsx
@@ -529,7 +529,10 @@ const Onboarding = () => {
           // login as an alternative since the user's intent is to sign in - they just prefer
           // not to use the One Tap UI. Browser OAuth provides a familiar login experience.
           error.code === OAuthErrorType.GoogleLoginUserDisabledOneTapFeature ||
-          error.code === OAuthErrorType.GoogleLoginOneTapFailure
+          error.code === OAuthErrorType.GoogleLoginOneTapFailure ||
+          // GoogleLoginNoProviderDependencies: The Android Credential Manager cannot find
+          // required provider dependencies. Fallback to browser-based OAuth.
+          error.code === OAuthErrorType.GoogleLoginNoProviderDependencies
         ) {
           // For Android Google, try browser fallback instead of showing error.
           // Note: We intentionally call handleOAuthLoginError (not handleLoginError) in the
diff --git a/app/components/Views/OnboardingSheet/__snapshots__/index.test.tsx.snap b/app/components/Views/OnboardingSheet/__snapshots__/index.test.tsx.snap
index ccdabea98d6b..d57c5e10307b 100644
--- a/app/components/Views/OnboardingSheet/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/OnboardingSheet/__snapshots__/index.test.tsx.snap
@@ -23,7 +23,7 @@ exports[`OnboardingSheet Snapshots renders correctly with createWallet=false (im
     style={
       [
         {
-          "backgroundColor": "#3f434a66",
+          "backgroundColor": "#0a0d135c",
           "bottom": 0,
           "left": 0,
           "position": "absolute",
@@ -73,7 +73,7 @@ exports[`OnboardingSheet Snapshots renders correctly with createWallet=false (im
         [
           {
             "backgroundColor": "#ffffff",
-            "borderColor": "#b7bbc866",
+            "borderColor": "#b4b4b566",
             "borderTopLeftRadius": 24,
             "borderTopRightRadius": 24,
             "borderWidth": 1,
@@ -110,7 +110,7 @@ exports[`OnboardingSheet Snapshots renders correctly with createWallet=false (im
         <View
           style={
             {
-              "backgroundColor": "#b7bbc866",
+              "backgroundColor": "#b4b4b566",
               "borderRadius": 2,
               "height": 4,
               "width": 40,
@@ -151,8 +151,8 @@ exports[`OnboardingSheet Snapshots renders correctly with createWallet=false (im
               {
                 "alignItems": "center",
                 "alignSelf": "stretch",
-                "backgroundColor": "#121314",
-                "borderColor": "#b7bbc866",
+                "backgroundColor": "#131416",
+                "borderColor": "#b4b4b566",
                 "borderRadius": 12,
                 "borderWidth": 1,
                 "color": "#ffffff",
@@ -207,8 +207,8 @@ exports[`OnboardingSheet Snapshots renders correctly with createWallet=false (im
               {
                 "alignItems": "center",
                 "alignSelf": "stretch",
-                "backgroundColor": "#121314",
-                "borderColor": "#b7bbc866",
+                "backgroundColor": "#131416",
+                "borderColor": "#b4b4b566",
                 "borderRadius": 12,
                 "borderWidth": 1,
                 "color": "#ffffff",
@@ -266,7 +266,7 @@ exports[`OnboardingSheet Snapshots renders correctly with createWallet=false (im
           <View
             style={
               {
-                "backgroundColor": "#b7bbc866",
+                "backgroundColor": "#b4b4b566",
                 "flex": 1,
                 "height": 1,
               }
@@ -276,9 +276,9 @@ exports[`OnboardingSheet Snapshots renders correctly with createWallet=false (im
             accessibilityRole="text"
             style={
               {
-                "color": "#b7bbc8",
+                "color": "#babbbe",
                 "fontFamily": "Geist-Medium",
-                "fontSize": 18,
+                "fontSize": 20,
                 "letterSpacing": 0,
                 "lineHeight": 24,
               }
@@ -289,7 +289,7 @@ exports[`OnboardingSheet Snapshots renders correctly with createWallet=false (im
           <View
             style={
               {
-                "backgroundColor": "#b7bbc866",
+                "backgroundColor": "#b4b4b566",
                 "flex": 1,
                 "height": 1,
               }
@@ -317,7 +317,7 @@ exports[`OnboardingSheet Snapshots renders correctly with createWallet=false (im
               {
                 "alignItems": "center",
                 "alignSelf": "stretch",
-                "backgroundColor": "#3c4d9d0f",
+                "backgroundColor": "#b4b4b528",
                 "borderColor": "transparent",
                 "borderRadius": 12,
                 "borderWidth": 1,
@@ -334,7 +334,7 @@ exports[`OnboardingSheet Snapshots renders correctly with createWallet=false (im
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Medium",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -358,7 +358,7 @@ exports[`OnboardingSheet Snapshots renders correctly with createWallet=false (im
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Medium",
                 "fontSize": 12,
                 "letterSpacing": 0.25,
@@ -437,7 +437,7 @@ exports[`OnboardingSheet Snapshots renders correctly with createWallet=true (cre
     style={
       [
         {
-          "backgroundColor": "#3f434a66",
+          "backgroundColor": "#0a0d135c",
           "bottom": 0,
           "left": 0,
           "position": "absolute",
@@ -487,7 +487,7 @@ exports[`OnboardingSheet Snapshots renders correctly with createWallet=true (cre
         [
           {
             "backgroundColor": "#ffffff",
-            "borderColor": "#b7bbc866",
+            "borderColor": "#b4b4b566",
             "borderTopLeftRadius": 24,
             "borderTopRightRadius": 24,
             "borderWidth": 1,
@@ -524,7 +524,7 @@ exports[`OnboardingSheet Snapshots renders correctly with createWallet=true (cre
         <View
           style={
             {
-              "backgroundColor": "#b7bbc866",
+              "backgroundColor": "#b4b4b566",
               "borderRadius": 2,
               "height": 4,
               "width": 40,
@@ -565,8 +565,8 @@ exports[`OnboardingSheet Snapshots renders correctly with createWallet=true (cre
               {
                 "alignItems": "center",
                 "alignSelf": "stretch",
-                "backgroundColor": "#121314",
-                "borderColor": "#b7bbc866",
+                "backgroundColor": "#131416",
+                "borderColor": "#b4b4b566",
                 "borderRadius": 12,
                 "borderWidth": 1,
                 "color": "#ffffff",
@@ -621,8 +621,8 @@ exports[`OnboardingSheet Snapshots renders correctly with createWallet=true (cre
               {
                 "alignItems": "center",
                 "alignSelf": "stretch",
-                "backgroundColor": "#121314",
-                "borderColor": "#b7bbc866",
+                "backgroundColor": "#131416",
+                "borderColor": "#b4b4b566",
                 "borderRadius": 12,
                 "borderWidth": 1,
                 "color": "#ffffff",
@@ -680,7 +680,7 @@ exports[`OnboardingSheet Snapshots renders correctly with createWallet=true (cre
           <View
             style={
               {
-                "backgroundColor": "#b7bbc866",
+                "backgroundColor": "#b4b4b566",
                 "flex": 1,
                 "height": 1,
               }
@@ -690,9 +690,9 @@ exports[`OnboardingSheet Snapshots renders correctly with createWallet=true (cre
             accessibilityRole="text"
             style={
               {
-                "color": "#b7bbc8",
+                "color": "#babbbe",
                 "fontFamily": "Geist-Medium",
-                "fontSize": 18,
+                "fontSize": 20,
                 "letterSpacing": 0,
                 "lineHeight": 24,
               }
@@ -703,7 +703,7 @@ exports[`OnboardingSheet Snapshots renders correctly with createWallet=true (cre
           <View
             style={
               {
-                "backgroundColor": "#b7bbc866",
+                "backgroundColor": "#b4b4b566",
                 "flex": 1,
                 "height": 1,
               }
@@ -731,7 +731,7 @@ exports[`OnboardingSheet Snapshots renders correctly with createWallet=true (cre
               {
                 "alignItems": "center",
                 "alignSelf": "stretch",
-                "backgroundColor": "#3c4d9d0f",
+                "backgroundColor": "#b4b4b528",
                 "borderColor": "transparent",
                 "borderRadius": 12,
                 "borderWidth": 1,
@@ -748,7 +748,7 @@ exports[`OnboardingSheet Snapshots renders correctly with createWallet=true (cre
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Medium",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -772,7 +772,7 @@ exports[`OnboardingSheet Snapshots renders correctly with createWallet=true (cre
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Medium",
                 "fontSize": 12,
                 "letterSpacing": 0.25,
diff --git a/app/components/Views/OnboardingSuccess/DefaultSettings/__snapshots__/index.test.tsx.snap b/app/components/Views/OnboardingSuccess/DefaultSettings/__snapshots__/index.test.tsx.snap
index abc0667a7c45..772575463842 100644
--- a/app/components/Views/OnboardingSuccess/DefaultSettings/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/OnboardingSuccess/DefaultSettings/__snapshots__/index.test.tsx.snap
@@ -20,7 +20,7 @@ exports[`DefaultSettings should render correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -80,9 +80,9 @@ exports[`DefaultSettings should render correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Medium",
-                  "fontSize": 18,
+                  "fontSize": 20,
                   "letterSpacing": 0,
                   "lineHeight": 24,
                 }
@@ -94,7 +94,7 @@ exports[`DefaultSettings should render correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -123,7 +123,7 @@ exports[`DefaultSettings should render correctly 1`] = `
             testID="listitemcolumn"
           >
             <SvgMock
-              color="#121314"
+              color="#131416"
               fill="currentColor"
               height={20}
               name="ArrowRight"
@@ -173,9 +173,9 @@ exports[`DefaultSettings should render correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Medium",
-                  "fontSize": 18,
+                  "fontSize": 20,
                   "letterSpacing": 0,
                   "lineHeight": 24,
                 }
@@ -187,7 +187,7 @@ exports[`DefaultSettings should render correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -216,7 +216,7 @@ exports[`DefaultSettings should render correctly 1`] = `
             testID="listitemcolumn"
           >
             <SvgMock
-              color="#121314"
+              color="#131416"
               fill="currentColor"
               height={20}
               name="ArrowRight"
@@ -266,9 +266,9 @@ exports[`DefaultSettings should render correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Medium",
-                  "fontSize": 18,
+                  "fontSize": 20,
                   "letterSpacing": 0,
                   "lineHeight": 24,
                 }
@@ -280,7 +280,7 @@ exports[`DefaultSettings should render correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -309,7 +309,7 @@ exports[`DefaultSettings should render correctly 1`] = `
             testID="listitemcolumn"
           >
             <SvgMock
-              color="#121314"
+              color="#131416"
               fill="currentColor"
               height={20}
               name="ArrowRight"
diff --git a/app/components/Views/OnboardingSuccess/OnboardingAssetsSettings/__snapshots__/index.test.tsx.snap b/app/components/Views/OnboardingSuccess/OnboardingAssetsSettings/__snapshots__/index.test.tsx.snap
index 5068d0d1578d..4642659de04f 100644
--- a/app/components/Views/OnboardingSuccess/OnboardingAssetsSettings/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/OnboardingSuccess/OnboardingAssetsSettings/__snapshots__/index.test.tsx.snap
@@ -36,10 +36,10 @@ exports[`OnboardingAssetSettings should render correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "flex": 1,
               "fontFamily": "Geist-Medium",
-              "fontSize": 18,
+              "fontSize": 20,
               "letterSpacing": 0,
               "lineHeight": 24,
             }
@@ -73,7 +73,7 @@ exports[`OnboardingAssetSettings should render correctly 1`] = `
                     "alignSelf": "flex-start",
                   },
                   {
-                    "backgroundColor": "#b7bbc866",
+                    "backgroundColor": "#b4b4b566",
                     "borderRadius": 16,
                   },
                 ],
@@ -81,7 +81,7 @@ exports[`OnboardingAssetSettings should render correctly 1`] = `
             }
             testID="token-detection-toggle"
             thumbTintColor="#ffffff"
-            tintColor="#b7bbc866"
+            tintColor="#b4b4b566"
             value={true}
           />
         </View>
@@ -90,7 +90,7 @@ exports[`OnboardingAssetSettings should render correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -121,10 +121,10 @@ exports[`OnboardingAssetSettings should render correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "flex": 1,
               "fontFamily": "Geist-Medium",
-              "fontSize": 18,
+              "fontSize": 20,
               "letterSpacing": 0,
               "lineHeight": 24,
             }
@@ -156,7 +156,7 @@ exports[`OnboardingAssetSettings should render correctly 1`] = `
                     "alignSelf": "flex-start",
                   },
                   {
-                    "backgroundColor": "#b7bbc866",
+                    "backgroundColor": "#b4b4b566",
                     "borderRadius": 16,
                   },
                 ],
@@ -164,7 +164,7 @@ exports[`OnboardingAssetSettings should render correctly 1`] = `
             }
             testID="nft-display-media-mode-section"
             thumbTintColor="#ffffff"
-            tintColor="#b7bbc866"
+            tintColor="#b4b4b566"
             value={false}
           />
         </View>
@@ -173,7 +173,7 @@ exports[`OnboardingAssetSettings should render correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -204,10 +204,10 @@ exports[`OnboardingAssetSettings should render correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "flex": 1,
               "fontFamily": "Geist-Medium",
-              "fontSize": 18,
+              "fontSize": 20,
               "letterSpacing": 0,
               "lineHeight": 24,
             }
@@ -239,7 +239,7 @@ exports[`OnboardingAssetSettings should render correctly 1`] = `
                     "alignSelf": "flex-start",
                   },
                   {
-                    "backgroundColor": "#b7bbc866",
+                    "backgroundColor": "#b4b4b566",
                     "borderRadius": 16,
                   },
                 ],
@@ -247,7 +247,7 @@ exports[`OnboardingAssetSettings should render correctly 1`] = `
             }
             testID="nft-opensea-autodetect-mode-section"
             thumbTintColor="#ffffff"
-            tintColor="#b7bbc866"
+            tintColor="#b4b4b566"
             value={false}
           />
         </View>
@@ -256,7 +256,7 @@ exports[`OnboardingAssetSettings should render correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -287,10 +287,10 @@ exports[`OnboardingAssetSettings should render correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "flex": 1,
               "fontFamily": "Geist-Medium",
-              "fontSize": 18,
+              "fontSize": 20,
               "letterSpacing": 0,
               "lineHeight": 24,
             }
@@ -322,7 +322,7 @@ exports[`OnboardingAssetSettings should render correctly 1`] = `
                     "alignSelf": "flex-start",
                   },
                   {
-                    "backgroundColor": "#b7bbc866",
+                    "backgroundColor": "#b4b4b566",
                     "borderRadius": 16,
                   },
                 ],
@@ -330,7 +330,7 @@ exports[`OnboardingAssetSettings should render correctly 1`] = `
             }
             testID="IPFS_GATEWAY_SECTION"
             thumbTintColor="#ffffff"
-            tintColor="#b7bbc866"
+            tintColor="#b4b4b566"
             value={true}
           />
         </View>
@@ -339,7 +339,7 @@ exports[`OnboardingAssetSettings should render correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -361,7 +361,7 @@ exports[`OnboardingAssetSettings should render correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -375,7 +375,7 @@ exports[`OnboardingAssetSettings should render correctly 1`] = `
         <View
           style={
             {
-              "borderColor": "#b7bbc8",
+              "borderColor": "#949596",
               "borderRadius": 5,
               "borderWidth": 2,
               "marginTop": 16,
@@ -410,10 +410,10 @@ exports[`OnboardingAssetSettings should render correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "flex": 1,
               "fontFamily": "Geist-Medium",
-              "fontSize": 18,
+              "fontSize": 20,
               "letterSpacing": 0,
               "lineHeight": 24,
             }
@@ -445,7 +445,7 @@ exports[`OnboardingAssetSettings should render correctly 1`] = `
                     "alignSelf": "flex-start",
                   },
                   {
-                    "backgroundColor": "#b7bbc866",
+                    "backgroundColor": "#b4b4b566",
                     "borderRadius": 16,
                   },
                 ],
@@ -453,7 +453,7 @@ exports[`OnboardingAssetSettings should render correctly 1`] = `
             }
             testID="security-settings-multi-account-balances-switch"
             thumbTintColor="#ffffff"
-            tintColor="#b7bbc866"
+            tintColor="#b4b4b566"
             value={true}
           />
         </View>
@@ -462,7 +462,7 @@ exports[`OnboardingAssetSettings should render correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
diff --git a/app/components/Views/OnboardingSuccess/OnboardingGeneralSettings/__snapshots__/index.test.tsx.snap b/app/components/Views/OnboardingSuccess/OnboardingGeneralSettings/__snapshots__/index.test.tsx.snap
index b83f0e2c2f28..797a634cb5b0 100644
--- a/app/components/Views/OnboardingSuccess/OnboardingGeneralSettings/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/OnboardingSuccess/OnboardingGeneralSettings/__snapshots__/index.test.tsx.snap
@@ -47,7 +47,7 @@ exports[`OnboardingGeneralSettings should render correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -70,13 +70,13 @@ exports[`OnboardingGeneralSettings should render correctly 1`] = `
                   "width": 51,
                 },
                 {
-                  "backgroundColor": "#b7bbc866",
+                  "backgroundColor": "#b4b4b566",
                   "borderRadius": 16,
                 },
               ]
             }
             thumbTintColor="#ffffff"
-            tintColor="#b7bbc866"
+            tintColor="#b4b4b566"
             value={false}
           />
         </View>
@@ -84,7 +84,7 @@ exports[`OnboardingGeneralSettings should render correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -132,7 +132,7 @@ exports[`OnboardingGeneralSettings should render correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -155,14 +155,14 @@ exports[`OnboardingGeneralSettings should render correctly 1`] = `
                   "width": 51,
                 },
                 {
-                  "backgroundColor": "#b7bbc866",
+                  "backgroundColor": "#b4b4b566",
                   "borderRadius": 16,
                 },
               ]
             }
             testID="toggle-backupAndSync"
             thumbTintColor="#ffffff"
-            tintColor="#b7bbc866"
+            tintColor="#b4b4b566"
             value={false}
           />
         </View>
@@ -170,7 +170,7 @@ exports[`OnboardingGeneralSettings should render correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -217,7 +217,7 @@ exports[`OnboardingGeneralSettings should render correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -232,7 +232,7 @@ exports[`OnboardingGeneralSettings should render correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "fontFamily": "Geist-Regular",
               "fontSize": 14,
               "fontWeight": "400",
@@ -285,7 +285,7 @@ exports[`OnboardingGeneralSettings should render correctly 1`] = `
             {
               "alignItems": "center",
               "alignSelf": "flex-start",
-              "backgroundColor": "#f3f5f9",
+              "backgroundColor": "#f3f3f4",
               "borderRadius": 16,
               "flexDirection": "row",
               "height": 32,
@@ -303,7 +303,7 @@ exports[`OnboardingGeneralSettings should render correctly 1`] = `
               style={
                 {
                   "alignItems": "center",
-                  "backgroundColor": "#f3f5f9",
+                  "backgroundColor": "#f3f3f4",
                   "borderRadius": 8,
                   "borderWidth": 1,
                   "height": 16,
@@ -318,7 +318,7 @@ exports[`OnboardingGeneralSettings should render correctly 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 10,
                     "letterSpacing": 0,
@@ -335,7 +335,7 @@ exports[`OnboardingGeneralSettings should render correctly 1`] = `
             numberOfLines={1}
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "flexShrink": 1,
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
@@ -349,7 +349,7 @@ exports[`OnboardingGeneralSettings should render correctly 1`] = `
             Ethereum Main Network
           </Text>
           <SvgMock
-            color="#121314"
+            color="#131416"
             fill="currentColor"
             height={12}
             name="ArrowDown"
diff --git a/app/components/Views/OnboardingSuccess/OnboardingSecuritySettings/__snapshots__/index.test.tsx.snap b/app/components/Views/OnboardingSuccess/OnboardingSecuritySettings/__snapshots__/index.test.tsx.snap
index 79caa952c8be..b25950b8a2a0 100644
--- a/app/components/Views/OnboardingSuccess/OnboardingSecuritySettings/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/OnboardingSuccess/OnboardingSecuritySettings/__snapshots__/index.test.tsx.snap
@@ -31,10 +31,10 @@ exports[`OnboardingSecuritySettings Basic rendering should render correctly with
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "flex": 1,
               "fontFamily": "Geist-Medium",
-              "fontSize": 18,
+              "fontSize": 20,
               "letterSpacing": 0,
               "lineHeight": 24,
             }
@@ -66,7 +66,7 @@ exports[`OnboardingSecuritySettings Basic rendering should render correctly with
                     "alignSelf": "flex-start",
                   },
                   {
-                    "backgroundColor": "#b7bbc866",
+                    "backgroundColor": "#b4b4b566",
                     "borderRadius": 16,
                   },
                 ],
@@ -74,7 +74,7 @@ exports[`OnboardingSecuritySettings Basic rendering should render correctly with
             }
             testID="display-use-safe-list-validation"
             thumbTintColor="#ffffff"
-            tintColor="#b7bbc866"
+            tintColor="#b4b4b566"
             value={false}
           />
         </View>
@@ -83,7 +83,7 @@ exports[`OnboardingSecuritySettings Basic rendering should render correctly with
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -97,7 +97,7 @@ exports[`OnboardingSecuritySettings Basic rendering should render correctly with
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Bold",
               "fontSize": 16,
               "letterSpacing": 0,
diff --git a/app/components/Views/OnboardingSuccess/OnboardingSecuritySettings/index.tsx b/app/components/Views/OnboardingSuccess/OnboardingSecuritySettings/index.tsx
index 319b2b69d255..c800129c8017 100644
--- a/app/components/Views/OnboardingSuccess/OnboardingSecuritySettings/index.tsx
+++ b/app/components/Views/OnboardingSuccess/OnboardingSecuritySettings/index.tsx
@@ -29,7 +29,10 @@ const SecuritySettings = () => {
       <NetworkDetailsCheckSettings />
       {shouldShowSocialLoginFeatures && (
         <>
-          <MetaMetricsAndDataCollectionSection hideMarketingSection />
+          <MetaMetricsAndDataCollectionSection
+            hideMarketingSection
+            analyticsLocation="onboarding_default_settings"
+          />
           <DeleteMetaMetricsData metricsOptin={analyticsEnabled} />
         </>
       )}
diff --git a/app/components/Views/OnboardingSuccess/__snapshots__/index.test.tsx.snap b/app/components/Views/OnboardingSuccess/__snapshots__/index.test.tsx.snap
index 7af9c65655d3..e63ed5a04494 100644
--- a/app/components/Views/OnboardingSuccess/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/OnboardingSuccess/__snapshots__/index.test.tsx.snap
@@ -74,7 +74,7 @@ exports[`OnboardingSuccess route params handling uses default successFlow when r
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "MMSans-Regular",
             "fontSize": 32,
             "letterSpacing": 0,
@@ -109,7 +109,7 @@ exports[`OnboardingSuccess route params handling uses default successFlow when r
           {
             "alignItems": "center",
             "alignSelf": "stretch",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "flexDirection": "row",
             "height": 48,
@@ -239,7 +239,7 @@ exports[`OnboardingSuccess route params handling uses default successFlow when s
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "MMSans-Regular",
             "fontSize": 32,
             "letterSpacing": 0,
@@ -274,7 +274,7 @@ exports[`OnboardingSuccess route params handling uses default successFlow when s
           {
             "alignItems": "center",
             "alignSelf": "stretch",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "flexDirection": "row",
             "height": 48,
@@ -404,7 +404,7 @@ exports[`OnboardingSuccess route params successFlow is BACKED_UP_SRP renders mat
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "MMSans-Regular",
             "fontSize": 32,
             "letterSpacing": 0,
@@ -439,7 +439,7 @@ exports[`OnboardingSuccess route params successFlow is BACKED_UP_SRP renders mat
           {
             "alignItems": "center",
             "alignSelf": "stretch",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "flexDirection": "row",
             "height": 48,
@@ -569,7 +569,7 @@ exports[`OnboardingSuccess route params successFlow is IMPORT_FROM_SEED_PHRASE f
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "MMSans-Regular",
             "fontSize": 32,
             "letterSpacing": 0,
@@ -604,7 +604,7 @@ exports[`OnboardingSuccess route params successFlow is IMPORT_FROM_SEED_PHRASE f
           {
             "alignItems": "center",
             "alignSelf": "stretch",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "flexDirection": "row",
             "height": 48,
@@ -734,7 +734,7 @@ exports[`OnboardingSuccess route params successFlow is IMPORT_FROM_SEED_PHRASE r
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "MMSans-Regular",
             "fontSize": 32,
             "letterSpacing": 0,
@@ -769,7 +769,7 @@ exports[`OnboardingSuccess route params successFlow is IMPORT_FROM_SEED_PHRASE r
           {
             "alignItems": "center",
             "alignSelf": "stretch",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "flexDirection": "row",
             "height": 48,
@@ -899,7 +899,7 @@ exports[`OnboardingSuccess route params successFlow is NO_BACKED_UP_SRP renders
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "MMSans-Regular",
             "fontSize": 32,
             "letterSpacing": 0,
@@ -934,7 +934,7 @@ exports[`OnboardingSuccess route params successFlow is NO_BACKED_UP_SRP renders
           {
             "alignItems": "center",
             "alignSelf": "stretch",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "flexDirection": "row",
             "height": 48,
@@ -1064,7 +1064,7 @@ exports[`OnboardingSuccessComponent renders matching snapshot when successFlow i
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "MMSans-Regular",
             "fontSize": 32,
             "letterSpacing": 0,
@@ -1099,7 +1099,7 @@ exports[`OnboardingSuccessComponent renders matching snapshot when successFlow i
           {
             "alignItems": "center",
             "alignSelf": "stretch",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "flexDirection": "row",
             "height": 48,
@@ -1229,7 +1229,7 @@ exports[`OnboardingSuccessComponent renders matching snapshot when successFlow i
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "MMSans-Regular",
             "fontSize": 32,
             "letterSpacing": 0,
@@ -1264,7 +1264,7 @@ exports[`OnboardingSuccessComponent renders matching snapshot when successFlow i
           {
             "alignItems": "center",
             "alignSelf": "stretch",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "flexDirection": "row",
             "height": 48,
@@ -1394,7 +1394,7 @@ exports[`OnboardingSuccessComponent renders matching snapshot when successFlow i
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "MMSans-Regular",
             "fontSize": 32,
             "letterSpacing": 0,
@@ -1429,7 +1429,7 @@ exports[`OnboardingSuccessComponent renders matching snapshot when successFlow i
           {
             "alignItems": "center",
             "alignSelf": "stretch",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "flexDirection": "row",
             "height": 48,
diff --git a/app/components/Views/OriginSpamModal/__snapshots__/OriginSpamModal.test.tsx.snap b/app/components/Views/OriginSpamModal/__snapshots__/OriginSpamModal.test.tsx.snap
index a820821f49c8..7e95b4162132 100644
--- a/app/components/Views/OriginSpamModal/__snapshots__/OriginSpamModal.test.tsx.snap
+++ b/app/components/Views/OriginSpamModal/__snapshots__/OriginSpamModal.test.tsx.snap
@@ -45,9 +45,9 @@ exports[`OriginSpamModal renders SiteBlockedContent if user opt in to block dapp
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Bold",
-          "fontSize": 18,
+          "fontSize": 20,
           "letterSpacing": 0,
           "lineHeight": 24,
         }
@@ -68,7 +68,7 @@ exports[`OriginSpamModal renders SiteBlockedContent if user opt in to block dapp
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
@@ -99,7 +99,7 @@ exports[`OriginSpamModal renders SiteBlockedContent if user opt in to block dapp
         {
           "alignItems": "center",
           "alignSelf": "stretch",
-          "backgroundColor": "#121314",
+          "backgroundColor": "#131416",
           "borderRadius": 12,
           "flexDirection": "row",
           "height": 48,
@@ -163,11 +163,11 @@ exports[`OriginSpamModal renders spam modal content by default 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "flex": 1,
           "flexWrap": "wrap",
           "fontFamily": "Geist-Bold",
-          "fontSize": 18,
+          "fontSize": 20,
           "letterSpacing": 0,
           "lineHeight": 24,
           "textAlign": "center",
@@ -191,7 +191,7 @@ exports[`OriginSpamModal renders spam modal content by default 1`] = `
           "alignItems": "center",
           "alignSelf": "center",
           "backgroundColor": "#ffffff",
-          "borderColor": "#b7bbc8",
+          "borderColor": "#949596",
           "borderRadius": 99,
           "borderWidth": 1,
           "flexDirection": "row",
@@ -235,7 +235,7 @@ exports[`OriginSpamModal renders spam modal content by default 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "flexShrink": 1,
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
@@ -252,7 +252,7 @@ exports[`OriginSpamModal renders spam modal content by default 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
@@ -284,7 +284,7 @@ exports[`OriginSpamModal renders spam modal content by default 1`] = `
         {
           "alignItems": "center",
           "alignSelf": "stretch",
-          "backgroundColor": "#3c4d9d0f",
+          "backgroundColor": "#b4b4b528",
           "borderColor": "transparent",
           "borderRadius": 12,
           "borderWidth": 1,
@@ -301,7 +301,7 @@ exports[`OriginSpamModal renders spam modal content by default 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Medium",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -323,7 +323,7 @@ exports[`OriginSpamModal renders spam modal content by default 1`] = `
         {
           "alignItems": "center",
           "alignSelf": "stretch",
-          "backgroundColor": "#121314",
+          "backgroundColor": "#131416",
           "borderRadius": 12,
           "flexDirection": "row",
           "height": 48,
diff --git a/app/components/Views/PickComponent/__snapshots__/index.test.tsx.snap b/app/components/Views/PickComponent/__snapshots__/index.test.tsx.snap
index cdb61cc9dbdf..2fd83258eafb 100644
--- a/app/components/Views/PickComponent/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/PickComponent/__snapshots__/index.test.tsx.snap
@@ -34,7 +34,7 @@ exports[`PickComponent should render correctly 1`] = `
           {
             "alignItems": "center",
             "backgroundColor": "#ffffff",
-            "borderColor": "#b7bbc8",
+            "borderColor": "#949596",
             "borderRadius": 99,
             "borderWidth": 2,
             "height": 20,
@@ -54,7 +54,7 @@ exports[`PickComponent should render correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -124,7 +124,7 @@ exports[`PickComponent should render correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
diff --git a/app/components/Views/Pna25BottomSheet/Pna25BottomSheet.test.tsx b/app/components/Views/Pna25BottomSheet/Pna25BottomSheet.test.tsx
index 08c45ccc7e09..e05d168421a1 100644
--- a/app/components/Views/Pna25BottomSheet/Pna25BottomSheet.test.tsx
+++ b/app/components/Views/Pna25BottomSheet/Pna25BottomSheet.test.tsx
@@ -37,9 +37,8 @@ jest.mock('react-redux', () => ({
   useDispatch: () => mockDispatch,
 }));
 
-// Mock useMetrics hook
-jest.mock('../../hooks/useMetrics', () => ({
-  useMetrics: () => ({
+jest.mock('../../hooks/useAnalytics/useAnalytics', () => ({
+  useAnalytics: () => ({
     trackEvent: mockTrackEvent,
     createEventBuilder: mockCreateEventBuilder,
   }),
diff --git a/app/components/Views/Pna25BottomSheet/Pna25BottomSheet.tsx b/app/components/Views/Pna25BottomSheet/Pna25BottomSheet.tsx
index b608bd7a207b..1ab946c218b8 100644
--- a/app/components/Views/Pna25BottomSheet/Pna25BottomSheet.tsx
+++ b/app/components/Views/Pna25BottomSheet/Pna25BottomSheet.tsx
@@ -20,7 +20,7 @@ import BottomSheetFooter, {
 } from '../../../component-library/components/BottomSheets/BottomSheetFooter';
 import { ButtonVariants } from '../../../component-library/components/Buttons/Button';
 import { strings } from '../../../../locales/i18n';
-import { useMetrics } from '../../hooks/useMetrics';
+import { useAnalytics } from '../../hooks/useAnalytics/useAnalytics';
 import { MetaMetricsEvents } from '../../../core/Analytics';
 import Routes from '../../../constants/navigation/Routes';
 import { storePna25Acknowledged } from '../../../actions/legalNotices';
@@ -38,7 +38,7 @@ const Pna25BottomSheet = () => {
   const navigation = useNavigation();
   const tw = useTailwind();
   const sheetRef = useRef<BottomSheetRef>(null);
-  const { trackEvent, createEventBuilder } = useMetrics();
+  const { trackEvent, createEventBuilder } = useAnalytics();
 
   const handleAction = useCallback(
     (action: Pna25BottomSheetAction) => {
diff --git a/app/components/Views/ProtectWalletMandatoryModal/__snapshots__/ProtectWalletMandatoryModal.test.tsx.snap b/app/components/Views/ProtectWalletMandatoryModal/__snapshots__/ProtectWalletMandatoryModal.test.tsx.snap
index 57b12b36e302..66dab1d2716c 100644
--- a/app/components/Views/ProtectWalletMandatoryModal/__snapshots__/ProtectWalletMandatoryModal.test.tsx.snap
+++ b/app/components/Views/ProtectWalletMandatoryModal/__snapshots__/ProtectWalletMandatoryModal.test.tsx.snap
@@ -51,7 +51,7 @@ exports[`ProtectWalletMandatoryModal renders correctly 1`] = `
       onStartShouldSetResponder={[Function]}
       style={
         {
-          "backgroundColor": "#3f434a66",
+          "backgroundColor": "#0a0d135c",
           "bottom": 0,
           "height": 1334,
           "left": 0,
@@ -156,7 +156,7 @@ exports[`ProtectWalletMandatoryModal renders correctly 1`] = `
         <Text
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Bold",
               "fontSize": 18,
               "marginVertical": 8,
@@ -169,7 +169,7 @@ exports[`ProtectWalletMandatoryModal renders correctly 1`] = `
         <Text
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 14,
               "justifyContent": "center",
@@ -296,7 +296,7 @@ exports[`ProtectWalletMandatoryModal renders correctly on iPhoneX 1`] = `
       onStartShouldSetResponder={[Function]}
       style={
         {
-          "backgroundColor": "#3f434a66",
+          "backgroundColor": "#0a0d135c",
           "bottom": 0,
           "height": 1334,
           "left": 0,
@@ -401,7 +401,7 @@ exports[`ProtectWalletMandatoryModal renders correctly on iPhoneX 1`] = `
         <Text
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Bold",
               "fontSize": 18,
               "marginVertical": 8,
@@ -414,7 +414,7 @@ exports[`ProtectWalletMandatoryModal renders correctly on iPhoneX 1`] = `
         <Text
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 14,
               "justifyContent": "center",
diff --git a/app/components/Views/QRAccountDisplay/__snapshots__/QRAccountDisplay.test.tsx.snap b/app/components/Views/QRAccountDisplay/__snapshots__/QRAccountDisplay.test.tsx.snap
index 911fbbde937e..565e2f13792d 100644
--- a/app/components/Views/QRAccountDisplay/__snapshots__/QRAccountDisplay.test.tsx.snap
+++ b/app/components/Views/QRAccountDisplay/__snapshots__/QRAccountDisplay.test.tsx.snap
@@ -329,9 +329,9 @@ exports[`QRAccountDisplay render matches snapshot 1`] = `
                         style={
                           [
                             {
-                              "color": "#121314",
+                              "color": "#131416",
                               "fontFamily": "Geist-Medium",
-                              "fontSize": 18,
+                              "fontSize": 20,
                               "fontWeight": 500,
                               "letterSpacing": 0,
                               "lineHeight": 24,
@@ -361,7 +361,7 @@ exports[`QRAccountDisplay render matches snapshot 1`] = `
                           style={
                             [
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Regular",
                                 "fontSize": 16,
                                 "fontWeight": 400,
@@ -381,7 +381,7 @@ exports[`QRAccountDisplay render matches snapshot 1`] = `
                             style={
                               [
                                 {
-                                  "color": "#686e7d",
+                                  "color": "#66676a",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "fontWeight": 400,
diff --git a/app/components/Views/QRScanner/index.test.tsx b/app/components/Views/QRScanner/index.test.tsx
index b00b763da68a..a229cac50861 100644
--- a/app/components/Views/QRScanner/index.test.tsx
+++ b/app/components/Views/QRScanner/index.test.tsx
@@ -177,11 +177,10 @@ const initialState = {
 };
 
 import { useAnalytics } from '../../../components/hooks/useAnalytics/useAnalytics';
+import { createMockUseAnalyticsHook } from '../../../util/test/analyticsMock';
 import SharedDeeplinkManager from '../../../core/DeeplinkManager/DeeplinkManager';
 
-const mockUseAnalytics = useAnalytics as jest.MockedFunction<
-  typeof useAnalytics
->;
+const mockUseAnalytics = jest.mocked(useAnalytics);
 
 describe('QrScanner', () => {
   let onCodeScannedCallback: ((codes: { value: string }[]) => void) | null =
@@ -237,19 +236,12 @@ describe('QrScanner', () => {
       addProperties: mockAddProperties,
       build: mockBuild,
     });
-    mockUseAnalytics.mockReturnValue({
-      trackEvent: mockTrackEvent,
-      createEventBuilder: mockCreateEventBuilder,
-      isEnabled: jest.fn().mockReturnValue(true),
-      enable: jest.fn(),
-      addTraitsToUser: jest.fn(),
-      createDataDeletionTask: jest.fn(),
-      checkDataDeleteStatus: jest.fn(),
-      getAnalyticsId: jest.fn(),
-      isDataRecorded: jest.fn().mockReturnValue(true),
-      getDeleteRegulationId: jest.fn(),
-      getDeleteRegulationCreationDate: jest.fn(),
-    } as ReturnType<typeof useAnalytics>);
+    mockUseAnalytics.mockReturnValue(
+      createMockUseAnalyticsHook({
+        trackEvent: mockTrackEvent,
+        createEventBuilder: mockCreateEventBuilder,
+      }),
+    );
 
     // Setup camera mocks
     mockUseCameraDevice.mockReturnValue({
@@ -944,19 +936,12 @@ describe('QrScanner', () => {
         addProperties: mockAddProperties,
         build: mockBuild,
       });
-      mockUseAnalytics.mockReturnValue({
-        trackEvent: mockTrackEvent,
-        createEventBuilder: mockCreateEventBuilder,
-        isEnabled: jest.fn().mockReturnValue(true),
-        enable: jest.fn(),
-        addTraitsToUser: jest.fn(),
-        createDataDeletionTask: jest.fn(),
-        checkDataDeleteStatus: jest.fn(),
-        getAnalyticsId: jest.fn(),
-        isDataRecorded: jest.fn().mockReturnValue(true),
-        getDeleteRegulationId: jest.fn(),
-        getDeleteRegulationCreationDate: jest.fn(),
-      } as ReturnType<typeof useAnalytics>);
+      mockUseAnalytics.mockReturnValue(
+        createMockUseAnalyticsHook({
+          trackEvent: mockTrackEvent,
+          createEventBuilder: mockCreateEventBuilder,
+        }),
+      );
 
       mockUseCameraDevice.mockReturnValue({
         id: 'back',
diff --git a/app/components/Views/Quiz/SRPQuiz/SRPQuiz.test.tsx b/app/components/Views/Quiz/SRPQuiz/SRPQuiz.test.tsx
index 78f5c51e4f07..257eaca056f6 100644
--- a/app/components/Views/Quiz/SRPQuiz/SRPQuiz.test.tsx
+++ b/app/components/Views/Quiz/SRPQuiz/SRPQuiz.test.tsx
@@ -105,6 +105,7 @@ describe('SRPQuiz', () => {
         {
           shouldUpdateNav: true,
           keyringId,
+          skipQuiz: true,
         },
       );
     });
diff --git a/app/components/Views/Quiz/SRPQuiz/SRPQuiz.tsx b/app/components/Views/Quiz/SRPQuiz/SRPQuiz.tsx
index 17bbd18183e7..ca5a7cd6b853 100644
--- a/app/components/Views/Quiz/SRPQuiz/SRPQuiz.tsx
+++ b/app/components/Views/Quiz/SRPQuiz/SRPQuiz.tsx
@@ -111,6 +111,7 @@ const SRPQuiz = (props: SRPQuizProps) => {
     navigation.navigate(Routes.SETTINGS.REVEAL_PRIVATE_CREDENTIAL, {
       shouldUpdateNav: true,
       keyringId,
+      skipQuiz: true,
     });
   }, [navigation, trackEvent, createEventBuilder, keyringId]);
 
diff --git a/app/components/Views/ResetPassword/__snapshots__/index.test.tsx.snap b/app/components/Views/ResetPassword/__snapshots__/index.test.tsx.snap
index 612df53b2745..17837bbb5175 100644
--- a/app/components/Views/ResetPassword/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/ResetPassword/__snapshots__/index.test.tsx.snap
@@ -99,7 +99,7 @@ exports[`ResetPassword render matches snapshot 1`] = `
             style={
               [
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "height": 24,
                   "width": 24,
                 },
@@ -140,7 +140,7 @@ exports[`ResetPassword render matches snapshot 1`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -262,7 +262,7 @@ exports[`ResetPassword render matches snapshot 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Medium",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -307,8 +307,8 @@ exports[`ResetPassword render matches snapshot 1`] = `
                   style={
                     {
                       "alignItems": "center",
-                      "backgroundColor": "#3c4d9d0f",
-                      "borderColor": "#b7bbc866",
+                      "backgroundColor": "#b4b4b528",
+                      "borderColor": "#b4b4b566",
                       "borderRadius": 12,
                       "borderWidth": 1,
                       "flexDirection": "row",
@@ -338,19 +338,20 @@ exports[`ResetPassword render matches snapshot 1`] = `
                       onFocus={[Function]}
                       onSubmitEditing={[Function]}
                       placeholder="Password"
-                      placeholderTextColor="#686e7d"
+                      placeholderTextColor="#66676a"
                       secureTextEntry={true}
                       style={
                         {
                           "backgroundColor": "inherit",
                           "borderColor": "transparent",
                           "borderWidth": 1,
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "fontWeight": "400",
                           "height": 46,
                           "letterSpacing": 0,
+                          "lineHeight": 0,
                           "opacity": 1,
                         }
                       }
@@ -380,7 +381,7 @@ exports[`ResetPassword render matches snapshot 1`] = `
                     {
                       "alignItems": "center",
                       "alignSelf": "stretch",
-                      "backgroundColor": "#121314",
+                      "backgroundColor": "#131416",
                       "borderRadius": 12,
                       "flexDirection": "row",
                       "height": 48,
diff --git a/app/components/Views/ResetPassword/index.js b/app/components/Views/ResetPassword/index.js
index ac8c0ce7d435..4eafb6809eb8 100644
--- a/app/components/Views/ResetPassword/index.js
+++ b/app/components/Views/ResetPassword/index.js
@@ -59,8 +59,9 @@ import Icon, {
 } from '../../../component-library/components/Icons/Icon';
 import Routes from '../../../constants/navigation/Routes';
 import NavigationService from '../../../core/NavigationService';
-import { MetaMetricsEvents, MetaMetrics } from '../../../core/Analytics';
-import { MetricsEventBuilder } from '../../../core/Analytics/MetricsEventBuilder';
+import { MetaMetricsEvents } from '../../../core/Analytics';
+import { AnalyticsEventBuilder } from '../../../util/analytics/AnalyticsEventBuilder';
+import { analytics } from '../../../util/analytics/analytics';
 import Checkbox from '../../../component-library/components/Checkbox';
 import fox from '../../../animations/Searching_Fox.json';
 import LottieView from 'lottie-react-native';
@@ -513,13 +514,13 @@ class ResetPassword extends PureComponent {
 
       // Track password changed event
       const { biometryChoice } = this.state;
-      const eventBuilder = MetricsEventBuilder.createEventBuilder(
+      const eventBuilder = AnalyticsEventBuilder.createEventBuilder(
         MetaMetricsEvents.PASSWORD_CHANGED,
       ).addProperties({
         biometry_type: this.state.biometryType,
         biometrics_enabled: Boolean(biometryChoice),
       });
-      MetaMetrics.getInstance().trackEvent(eventBuilder.build());
+      analytics.trackEvent(eventBuilder.build());
 
       this.setState({ loading: false });
       this.props.navigation.navigate('SecuritySettings');
diff --git a/app/components/Views/ResetPassword/index.test.tsx b/app/components/Views/ResetPassword/index.test.tsx
index 6cc42d54f6fb..eda0b4b38b26 100644
--- a/app/components/Views/ResetPassword/index.test.tsx
+++ b/app/components/Views/ResetPassword/index.test.tsx
@@ -108,14 +108,12 @@ jest.mock('react-native/Libraries/Alert/Alert', () => ({
   alert: jest.fn(),
 }));
 
-const mockMetricsIsEnabled = jest.fn().mockReturnValue(true);
 const mockTrackEvent = jest.fn();
-jest.mock('../../../core/Analytics/MetaMetrics', () => ({
-  getInstance: () => ({
-    isEnabled: mockMetricsIsEnabled,
-    trackEvent: mockTrackEvent,
-    updateDataRecordingFlag: jest.fn(),
-  }),
+jest.mock('../../../util/analytics/analytics', () => ({
+  analytics: {
+    trackEvent: (...args: unknown[]) => mockTrackEvent(...args),
+    isEnabled: jest.fn().mockReturnValue(true),
+  },
 }));
 
 const mockRunAfterInteractions = jest.fn().mockImplementation((cb) => {
diff --git a/app/components/Views/RevealPrivateCredential/RevealPrivateCredential.test.tsx b/app/components/Views/RevealPrivateCredential/RevealPrivateCredential.test.tsx
index 9c4e8b1480fc..248aa5214914 100644
--- a/app/components/Views/RevealPrivateCredential/RevealPrivateCredential.test.tsx
+++ b/app/components/Views/RevealPrivateCredential/RevealPrivateCredential.test.tsx
@@ -14,6 +14,16 @@ import { ReauthenticateErrorType } from '../../../core/Authentication/types';
 import ClipboardManager from '../../../core/ClipboardManager';
 import { MetaMetricsEvents } from '../../../core/Analytics/MetaMetrics.events';
 import Device from '../../../util/device';
+import { ExportCredentialsIds } from '../MultichainAccounts/AccountDetails/ExportCredentials.testIds';
+import {
+  SrpQuizGetStartedSelectorsIDs,
+  SrpSecurityQuestionOneSelectorsIDs,
+  SrpSecurityQuestionTwoSelectorsIDs,
+} from '../Quiz/SRPQuiz/SrpQuizModal.testIds';
+import {
+  ToastContext,
+  ToastVariants,
+} from '../../../component-library/components/Toast';
 
 const MOCK_PASSWORD = 'word1 word2 word3 word4';
 
@@ -205,6 +215,72 @@ const renderWithProviders = (ui: React.ReactNode) =>
     </Provider>,
   );
 
+const completeSecurityQuiz = async (
+  getByTestId: ReturnType<typeof render>['getByTestId'],
+) => {
+  // Step 1: Click "Get started" on introduction screen
+  await waitFor(() => {
+    expect(getByTestId(SrpQuizGetStartedSelectorsIDs.BUTTON)).toBeOnTheScreen();
+  });
+  fireEvent.press(getByTestId(SrpQuizGetStartedSelectorsIDs.BUTTON));
+
+  // Step 2: Answer quiz question 1 (correct answer is RIGHT_ANSWER)
+  await waitFor(() => {
+    expect(
+      getByTestId(SrpSecurityQuestionOneSelectorsIDs.RIGHT_ANSWER),
+    ).toBeOnTheScreen();
+  });
+  fireEvent.press(getByTestId(SrpSecurityQuestionOneSelectorsIDs.RIGHT_ANSWER));
+
+  // Step 3: Click "Continue" after correct answer
+  await waitFor(() => {
+    expect(
+      getByTestId(SrpSecurityQuestionOneSelectorsIDs.RIGHT_CONTINUE),
+    ).toBeOnTheScreen();
+  });
+  fireEvent.press(
+    getByTestId(SrpSecurityQuestionOneSelectorsIDs.RIGHT_CONTINUE),
+  );
+
+  // Step 4: Answer quiz question 2 (correct answer is RIGHT_ANSWER)
+  await waitFor(() => {
+    expect(
+      getByTestId(SrpSecurityQuestionTwoSelectorsIDs.RIGHT_ANSWER),
+    ).toBeOnTheScreen();
+  });
+  fireEvent.press(getByTestId(SrpSecurityQuestionTwoSelectorsIDs.RIGHT_ANSWER));
+
+  // Step 5: Click "Continue" to proceed to ActionView
+  await waitFor(() => {
+    expect(
+      getByTestId(SrpSecurityQuestionTwoSelectorsIDs.RIGHT_CONTINUE),
+    ).toBeOnTheScreen();
+  });
+  fireEvent.press(
+    getByTestId(SrpSecurityQuestionTwoSelectorsIDs.RIGHT_CONTINUE),
+  );
+
+  // Wait for ActionView (scroll view) to appear
+  await waitFor(() => {
+    expect(
+      getByTestId(RevealSeedViewSelectorsIDs.REVEAL_CREDENTIAL_SCROLL_ID),
+    ).toBeOnTheScreen();
+  });
+};
+
+const completeSecurityQuizAndWaitForPasswordEntry = async (
+  getByTestId: ReturnType<typeof render>['getByTestId'],
+) => {
+  await completeSecurityQuiz(getByTestId);
+
+  // Wait for password entry to appear (only works if biometrics failed)
+  await waitFor(() => {
+    expect(
+      getByTestId(RevealSeedViewSelectorsIDs.PASSWORD_INPUT_BOX_ID),
+    ).toBeOnTheScreen();
+  });
+};
+
 const createDefaultRoute = (
   params: Record<string, unknown> = {},
 ): {
@@ -245,8 +321,8 @@ describe('RevealPrivateCredential', () => {
   });
 
   describe('rendering', () => {
-    it('renders reveal SRP with password entry when locked', () => {
-      const { getByTestId } = renderWithProviders(
+    it('renders introduction screen initially', () => {
+      const { getByTestId, getByText } = renderWithProviders(
         <RevealPrivateCredential
           route={createDefaultRoute()}
           navigation={null}
@@ -256,14 +332,23 @@ describe('RevealPrivateCredential', () => {
 
       expect(
         getByTestId(RevealSeedViewSelectorsIDs.REVEAL_CREDENTIAL_CONTAINER_ID),
-      ).toBeTruthy();
+      ).toBeOnTheScreen();
+      expect(getByTestId(ExportCredentialsIds.CONTAINER)).toBeOnTheScreen();
       expect(
-        getByTestId(RevealSeedViewSelectorsIDs.PASSWORD_INPUT_BOX_ID),
-      ).toBeTruthy();
+        getByTestId(SrpQuizGetStartedSelectorsIDs.BUTTON),
+      ).toBeOnTheScreen();
+      expect(getByText('Get started')).toBeOnTheScreen();
     });
 
-    it('renders SRP explanation text', () => {
-      const { getByText } = renderWithProviders(
+    it('renders password entry after completing security quiz', async () => {
+      // Mock biometrics to fail so password entry is shown
+      mockReauthenticate.mockRejectedValue(
+        new Error(
+          `${ReauthenticateErrorType.PASSWORD_NOT_SET_WITH_BIOMETRICS}: No password`,
+        ),
+      );
+
+      const { getByTestId } = renderWithProviders(
         <RevealPrivateCredential
           route={createDefaultRoute()}
           navigation={null}
@@ -271,10 +356,24 @@ describe('RevealPrivateCredential', () => {
         />,
       );
 
-      expect(getByText('Secret Recovery Phrase')).toBeTruthy();
+      await completeSecurityQuizAndWaitForPasswordEntry(getByTestId);
+
+      expect(
+        getByTestId(RevealSeedViewSelectorsIDs.REVEAL_CREDENTIAL_CONTAINER_ID),
+      ).toBeOnTheScreen();
+      expect(
+        getByTestId(RevealSeedViewSelectorsIDs.PASSWORD_INPUT_BOX_ID),
+      ).toBeOnTheScreen();
     });
 
-    it('renders warning section with eye slash icon', () => {
+    it('renders warning section with eye slash icon after completing quiz', async () => {
+      // Mock biometrics to fail so warning section is shown
+      mockReauthenticate.mockRejectedValue(
+        new Error(
+          `${ReauthenticateErrorType.PASSWORD_NOT_SET_WITH_BIOMETRICS}: No password`,
+        ),
+      );
+
       const { getByTestId } = renderWithProviders(
         <RevealPrivateCredential
           route={createDefaultRoute()}
@@ -283,12 +382,21 @@ describe('RevealPrivateCredential', () => {
         />,
       );
 
+      await completeSecurityQuizAndWaitForPasswordEntry(getByTestId);
+
       expect(
         getByTestId(RevealSeedViewSelectorsIDs.SEED_PHRASE_WARNING_ID),
-      ).toBeTruthy();
+      ).toBeOnTheScreen();
     });
 
-    it('renders cancel button when showCancelButton is true', () => {
+    it('renders cancel button when showCancelButton is true after completing quiz', async () => {
+      // Mock biometrics to fail so we see password entry with cancel button
+      mockReauthenticate.mockRejectedValue(
+        new Error(
+          `${ReauthenticateErrorType.PASSWORD_NOT_SET_WITH_BIOMETRICS}: No password`,
+        ),
+      );
+
       const { getByTestId } = renderWithProviders(
         <RevealPrivateCredential
           route={createDefaultRoute()}
@@ -298,11 +406,275 @@ describe('RevealPrivateCredential', () => {
         />,
       );
 
+      await completeSecurityQuizAndWaitForPasswordEntry(getByTestId);
+
       expect(
         getByTestId(
           RevealSeedViewSelectorsIDs.SECRET_RECOVERY_PHRASE_CANCEL_BUTTON_ID,
         ),
-      ).toBeTruthy();
+      ).toBeOnTheScreen();
+    });
+
+    it('renders back button', () => {
+      const { getByTestId } = renderWithProviders(
+        <RevealPrivateCredential
+          route={createDefaultRoute()}
+          navigation={{
+            goBack: jest.fn(),
+          }}
+          cancel={() => null}
+        />,
+      );
+      expect(
+        getByTestId(
+          RevealSeedViewSelectorsIDs.REVEAL_CREDENTIAL_BACK_BUTTON_ID,
+        ),
+      ).toBeOnTheScreen();
+      fireEvent.press(
+        getByTestId(
+          RevealSeedViewSelectorsIDs.REVEAL_CREDENTIAL_BACK_BUTTON_ID,
+        ),
+      );
+      expect(mockCreateEventBuilder).toHaveBeenCalledWith(
+        MetaMetricsEvents.GO_BACK_SRP_SCREEN,
+      );
+      expect(mockTrackEvent).toHaveBeenCalledWith({});
+    });
+  });
+
+  describe('security quiz flow', () => {
+    it('navigates from introduction to quiz when Get started is pressed', async () => {
+      const { getByTestId, getByText } = renderWithProviders(
+        <RevealPrivateCredential
+          route={createDefaultRoute()}
+          navigation={null}
+          cancel={() => null}
+        />,
+      );
+
+      // Initially on introduction screen
+      expect(
+        getByTestId(SrpQuizGetStartedSelectorsIDs.BUTTON),
+      ).toBeOnTheScreen();
+
+      // Click Get started
+      fireEvent.press(getByTestId(SrpQuizGetStartedSelectorsIDs.BUTTON));
+
+      // Should show quiz question
+      await waitFor(() => {
+        expect(getByText('Question 1 of 2')).toBeOnTheScreen();
+      });
+    });
+
+    it('shows correct feedback when correct answer is selected', async () => {
+      const { getByTestId, getByText } = renderWithProviders(
+        <RevealPrivateCredential
+          route={createDefaultRoute()}
+          navigation={null}
+          cancel={() => null}
+        />,
+      );
+
+      // Navigate to quiz
+      fireEvent.press(getByTestId(SrpQuizGetStartedSelectorsIDs.BUTTON));
+
+      await waitFor(() => {
+        expect(
+          getByTestId(SrpSecurityQuestionOneSelectorsIDs.RIGHT_ANSWER),
+        ).toBeOnTheScreen();
+      });
+
+      // Select correct answer for question 1
+      fireEvent.press(
+        getByTestId(SrpSecurityQuestionOneSelectorsIDs.RIGHT_ANSWER),
+      );
+
+      // Should show correct feedback
+      await waitFor(() => {
+        expect(getByText('Correct!')).toBeOnTheScreen();
+        expect(
+          getByTestId(SrpSecurityQuestionOneSelectorsIDs.RIGHT_CONTINUE),
+        ).toBeOnTheScreen();
+      });
+    });
+
+    it('shows incorrect feedback and try again option when wrong answer is selected', async () => {
+      const { getByTestId, getByText } = renderWithProviders(
+        <RevealPrivateCredential
+          route={createDefaultRoute()}
+          navigation={null}
+          cancel={() => null}
+        />,
+      );
+
+      // Navigate to quiz
+      fireEvent.press(getByTestId(SrpQuizGetStartedSelectorsIDs.BUTTON));
+
+      await waitFor(() => {
+        expect(
+          getByTestId(SrpSecurityQuestionOneSelectorsIDs.WRONG_ANSWER),
+        ).toBeOnTheScreen();
+      });
+
+      // Select wrong answer for question 1
+      fireEvent.press(
+        getByTestId(SrpSecurityQuestionOneSelectorsIDs.WRONG_ANSWER),
+      );
+
+      // Should show incorrect feedback
+      await waitFor(() => {
+        expect(getByText('Incorrect!')).toBeOnTheScreen();
+        expect(
+          getByTestId(
+            SrpSecurityQuestionOneSelectorsIDs.WRONG_ANSWER_TRY_AGAIN_BUTTON,
+          ),
+        ).toBeOnTheScreen();
+      });
+    });
+
+    it('renders learn more button on introduction screen', () => {
+      const { getByTestId } = renderWithProviders(
+        <RevealPrivateCredential
+          route={createDefaultRoute()}
+          navigation={null}
+          cancel={() => null}
+        />,
+      );
+
+      expect(
+        getByTestId(ExportCredentialsIds.LEARN_MORE_BUTTON),
+      ).toBeOnTheScreen();
+    });
+
+    it('shows question 2 specific test IDs when correct answer is selected', async () => {
+      const { getByTestId, getByText } = renderWithProviders(
+        <RevealPrivateCredential
+          route={createDefaultRoute()}
+          navigation={null}
+          cancel={() => null}
+        />,
+      );
+
+      // Navigate to quiz
+      fireEvent.press(getByTestId(SrpQuizGetStartedSelectorsIDs.BUTTON));
+
+      // Complete question 1 correctly
+      await waitFor(() => {
+        expect(
+          getByTestId(SrpSecurityQuestionOneSelectorsIDs.RIGHT_ANSWER),
+        ).toBeOnTheScreen();
+      });
+      fireEvent.press(
+        getByTestId(SrpSecurityQuestionOneSelectorsIDs.RIGHT_ANSWER),
+      );
+
+      await waitFor(() => {
+        expect(
+          getByTestId(SrpSecurityQuestionOneSelectorsIDs.RIGHT_CONTINUE),
+        ).toBeOnTheScreen();
+      });
+      fireEvent.press(
+        getByTestId(SrpSecurityQuestionOneSelectorsIDs.RIGHT_CONTINUE),
+      );
+
+      // Now on question 2 - verify question 2 specific test IDs
+      await waitFor(() => {
+        expect(getByText('Question 2 of 2')).toBeOnTheScreen();
+        expect(
+          getByTestId(SrpSecurityQuestionTwoSelectorsIDs.RIGHT_ANSWER),
+        ).toBeOnTheScreen();
+        expect(
+          getByTestId(SrpSecurityQuestionTwoSelectorsIDs.WRONG_ANSWER),
+        ).toBeOnTheScreen();
+      });
+
+      // Select correct answer for question 2
+      fireEvent.press(
+        getByTestId(SrpSecurityQuestionTwoSelectorsIDs.RIGHT_ANSWER),
+      );
+
+      // Should show correct feedback with question 2 continue button
+      await waitFor(() => {
+        expect(getByText('Correct!')).toBeOnTheScreen();
+        expect(
+          getByTestId(SrpSecurityQuestionTwoSelectorsIDs.RIGHT_CONTINUE),
+        ).toBeOnTheScreen();
+      });
+    });
+
+    it('shows question 2 try again button when wrong answer is selected', async () => {
+      const { getByTestId, getByText } = renderWithProviders(
+        <RevealPrivateCredential
+          route={createDefaultRoute()}
+          navigation={null}
+          cancel={() => null}
+        />,
+      );
+
+      // Navigate to quiz
+      fireEvent.press(getByTestId(SrpQuizGetStartedSelectorsIDs.BUTTON));
+
+      // Complete question 1 correctly
+      await waitFor(() => {
+        expect(
+          getByTestId(SrpSecurityQuestionOneSelectorsIDs.RIGHT_ANSWER),
+        ).toBeOnTheScreen();
+      });
+      fireEvent.press(
+        getByTestId(SrpSecurityQuestionOneSelectorsIDs.RIGHT_ANSWER),
+      );
+
+      await waitFor(() => {
+        expect(
+          getByTestId(SrpSecurityQuestionOneSelectorsIDs.RIGHT_CONTINUE),
+        ).toBeOnTheScreen();
+      });
+      fireEvent.press(
+        getByTestId(SrpSecurityQuestionOneSelectorsIDs.RIGHT_CONTINUE),
+      );
+
+      // Now on question 2 - select wrong answer
+      await waitFor(() => {
+        expect(
+          getByTestId(SrpSecurityQuestionTwoSelectorsIDs.WRONG_ANSWER),
+        ).toBeOnTheScreen();
+      });
+      fireEvent.press(
+        getByTestId(SrpSecurityQuestionTwoSelectorsIDs.WRONG_ANSWER),
+      );
+
+      // Should show incorrect feedback with question 2 try again button
+      await waitFor(() => {
+        expect(getByText('Incorrect!')).toBeOnTheScreen();
+        expect(
+          getByTestId(
+            SrpSecurityQuestionTwoSelectorsIDs.WRONG_ANSWER_TRY_AGAIN_BUTTON,
+          ),
+        ).toBeOnTheScreen();
+      });
+    });
+
+    it('verifies all question 1 answer button test IDs are present', async () => {
+      const { getByTestId } = renderWithProviders(
+        <RevealPrivateCredential
+          route={createDefaultRoute()}
+          navigation={null}
+          cancel={() => null}
+        />,
+      );
+
+      // Navigate to quiz
+      fireEvent.press(getByTestId(SrpQuizGetStartedSelectorsIDs.BUTTON));
+
+      // Verify both answer buttons for question 1 have correct test IDs
+      await waitFor(() => {
+        expect(
+          getByTestId(SrpSecurityQuestionOneSelectorsIDs.RIGHT_ANSWER),
+        ).toBeOnTheScreen();
+        expect(
+          getByTestId(SrpSecurityQuestionOneSelectorsIDs.WRONG_ANSWER),
+        ).toBeOnTheScreen();
+      });
     });
   });
 
@@ -318,6 +690,8 @@ describe('RevealPrivateCredential', () => {
         />,
       );
 
+      await completeSecurityQuizAndWaitForPasswordEntry(getByTestId);
+
       const passwordInput = getByTestId(
         RevealSeedViewSelectorsIDs.PASSWORD_INPUT_BOX_ID,
       );
@@ -339,10 +713,17 @@ describe('RevealPrivateCredential', () => {
       });
 
       // Validate specific warning message for incorrect password
-      expect(getByText('Incorrect password')).toBeTruthy();
+      expect(getByText('Incorrect password')).toBeOnTheScreen();
     });
 
     it('accepts text input in password field and triggers tryUnlock on submit editing', async () => {
+      // Mock biometrics to fail so password entry is shown
+      mockReauthenticate.mockRejectedValueOnce(
+        new Error(
+          `${ReauthenticateErrorType.PASSWORD_NOT_SET_WITH_BIOMETRICS}: No password`,
+        ),
+      );
+      // Then allow the manual password entry to succeed
       mockReauthenticate.mockResolvedValue({ password: 'correct-password' });
 
       const { getByTestId } = renderWithProviders(
@@ -353,6 +734,8 @@ describe('RevealPrivateCredential', () => {
         />,
       );
 
+      await completeSecurityQuizAndWaitForPasswordEntry(getByTestId);
+
       const passwordInput = getByTestId(
         RevealSeedViewSelectorsIDs.PASSWORD_INPUT_BOX_ID,
       );
@@ -382,11 +765,13 @@ describe('RevealPrivateCredential', () => {
         />,
       );
 
+      await completeSecurityQuizAndWaitForPasswordEntry(getByTestId);
+
       await waitFor(() => {
         const confirmButton = getByTestId(
           RevealSeedViewSelectorsIDs.SECRET_RECOVERY_PHRASE_NEXT_BUTTON_ID,
         );
-        expect(confirmButton).toBeTruthy();
+        expect(confirmButton).toBeOnTheScreen();
         expect(confirmButton.props.disabled).toBe(true);
       });
     });
@@ -400,7 +785,7 @@ describe('RevealPrivateCredential', () => {
         ),
       );
 
-      const { queryByTestId } = renderWithProviders(
+      const { getByTestId, queryByTestId } = renderWithProviders(
         <RevealPrivateCredential
           route={createDefaultRoute()}
           navigation={null}
@@ -408,6 +793,9 @@ describe('RevealPrivateCredential', () => {
         />,
       );
 
+      await completeSecurityQuizAndWaitForPasswordEntry(getByTestId);
+
+      // revealCredential runs when reaching action view, so reauthenticate is called then
       await waitFor(() => {
         expect(mockReauthenticate).toHaveBeenCalled();
       });
@@ -433,7 +821,9 @@ describe('RevealPrivateCredential', () => {
         />,
       );
 
-      // Wait for the auto-reveal attempt on mount to complete and show error
+      await completeSecurityQuizAndWaitForPasswordEntry(getByTestId);
+
+      // Wait for the reveal attempt (on action view) to complete and show error
       await waitFor(() => {
         const warningText = getByTestId(
           RevealSeedViewSelectorsIDs.PASSWORD_WARNING_ID,
@@ -445,7 +835,7 @@ describe('RevealPrivateCredential', () => {
       // Validate specific unknown error message
       expect(
         getByText("Couldn't unlock your account. Please try again."),
-      ).toBeTruthy();
+      ).toBeOnTheScreen();
     });
 
     it('uses keyringId parameter when provided', async () => {
@@ -455,7 +845,10 @@ describe('RevealPrivateCredential', () => {
 
       renderWithProviders(
         <RevealPrivateCredential
-          route={createDefaultRoute({ keyringId: testKeyringId })}
+          route={createDefaultRoute({
+            keyringId: testKeyringId,
+            skipQuiz: true,
+          })}
           navigation={null}
           cancel={() => null}
         />,
@@ -472,6 +865,13 @@ describe('RevealPrivateCredential', () => {
 
   describe('tryUnlock', () => {
     it('dispatches recordSRPRevealTimestamp on successful unlock', async () => {
+      // Mock biometrics to fail so password entry is shown
+      mockReauthenticate.mockRejectedValueOnce(
+        new Error(
+          `${ReauthenticateErrorType.PASSWORD_NOT_SET_WITH_BIOMETRICS}: No password`,
+        ),
+      );
+      // Then allow the manual password entry to succeed
       mockReauthenticate.mockResolvedValue({ password: 'correct-password' });
 
       const { getByTestId } = renderWithProviders(
@@ -482,6 +882,8 @@ describe('RevealPrivateCredential', () => {
         />,
       );
 
+      await completeSecurityQuizAndWaitForPasswordEntry(getByTestId);
+
       const passwordInput = getByTestId(
         RevealSeedViewSelectorsIDs.PASSWORD_INPUT_BOX_ID,
       );
@@ -502,10 +904,12 @@ describe('RevealPrivateCredential', () => {
       });
     });
 
-    it('shows modal on successful authentication', async () => {
+    it('shows SRP after successful authentication via biometrics', async () => {
+      // Biometrics succeed, so SRP should be shown after completing quiz
       mockReauthenticate.mockResolvedValue({ password: 'correct-password' });
+      mockRevealSRP.mockResolvedValue(MOCK_PASSWORD);
 
-      const { getByTestId } = renderWithProviders(
+      const { getByTestId, queryByTestId } = renderWithProviders(
         <RevealPrivateCredential
           route={createDefaultRoute()}
           navigation={null}
@@ -513,27 +917,24 @@ describe('RevealPrivateCredential', () => {
         />,
       );
 
-      const passwordInput = getByTestId(
-        RevealSeedViewSelectorsIDs.PASSWORD_INPUT_BOX_ID,
-      );
-      fireEvent.changeText(passwordInput, 'correct-password');
-
-      const confirmButton = getByTestId(
-        RevealSeedViewSelectorsIDs.SECRET_RECOVERY_PHRASE_NEXT_BUTTON_ID,
-      );
-
-      await act(async () => {
-        fireEvent.press(confirmButton);
-      });
+      await completeSecurityQuiz(getByTestId);
 
+      // SRP is already revealed via biometrics - check for the tab view
       await waitFor(() => {
         expect(
-          getByTestId(RevealSeedViewSelectorsIDs.REVEAL_CREDENTIAL_MODAL_ID),
-        ).toBeTruthy();
+          queryByTestId(RevealSeedViewSelectorsIDs.TAB_SCROLL_VIEW_TEXT),
+        ).toBeOnTheScreen();
       });
     });
 
     it('tracks NEXT_REVEAL_SRP_CTA analytics event', async () => {
+      // Mock biometrics to fail so password entry is shown
+      mockReauthenticate.mockRejectedValueOnce(
+        new Error(
+          `${ReauthenticateErrorType.PASSWORD_NOT_SET_WITH_BIOMETRICS}: No password`,
+        ),
+      );
+      // Then allow the manual password entry to succeed
       mockReauthenticate.mockResolvedValue({ password: 'correct-password' });
 
       const { getByTestId } = renderWithProviders(
@@ -544,6 +945,8 @@ describe('RevealPrivateCredential', () => {
         />,
       );
 
+      await completeSecurityQuizAndWaitForPasswordEntry(getByTestId);
+
       const passwordInput = getByTestId(
         RevealSeedViewSelectorsIDs.PASSWORD_INPUT_BOX_ID,
       );
@@ -585,6 +988,8 @@ describe('RevealPrivateCredential', () => {
         />,
       );
 
+      await completeSecurityQuiz(getByTestId);
+
       await waitFor(() => {
         const cancelButton = getByTestId(
           RevealSeedViewSelectorsIDs.SECRET_RECOVERY_PHRASE_CANCEL_BUTTON_ID,
@@ -612,6 +1017,8 @@ describe('RevealPrivateCredential', () => {
         />,
       );
 
+      await completeSecurityQuiz(getByTestId);
+
       await waitFor(() => {
         const cancelButton = getByTestId(
           RevealSeedViewSelectorsIDs.SECRET_RECOVERY_PHRASE_CANCEL_BUTTON_ID,
@@ -647,6 +1054,8 @@ describe('RevealPrivateCredential', () => {
         />,
       );
 
+      await completeSecurityQuiz(getByTestId);
+
       await waitFor(() => {
         const cancelButton = getByTestId(
           RevealSeedViewSelectorsIDs.SECRET_RECOVERY_PHRASE_CANCEL_BUTTON_ID,
@@ -659,11 +1068,27 @@ describe('RevealPrivateCredential', () => {
   });
 
   describe('clipboard functionality', () => {
+    const mockShowToast = jest.fn();
+    const mockToastRef = {
+      current: { showToast: mockShowToast, closeToast: jest.fn() },
+    };
+
+    const renderWithClipboardProviders = (ui: React.ReactElement) =>
+      render(
+        <Provider store={store}>
+          <ThemeContext.Provider value={mockTheme}>
+            <ToastContext.Provider value={{ toastRef: mockToastRef }}>
+              {ui}
+            </ToastContext.Provider>
+          </ThemeContext.Provider>
+        </Provider>,
+      );
+
     it('copies SRP to clipboard when copy button is pressed', async () => {
       mockReauthenticate.mockResolvedValue({ password: 'test-password' });
       mockRevealSRP.mockResolvedValue(MOCK_PASSWORD);
 
-      const { queryByTestId } = renderWithProviders(
+      const { getByTestId } = renderWithClipboardProviders(
         <RevealPrivateCredential
           route={createDefaultRoute()}
           navigation={null}
@@ -671,31 +1096,32 @@ describe('RevealPrivateCredential', () => {
         />,
       );
 
-      // Wait for auto-reveal via biometrics
+      await completeSecurityQuiz(getByTestId);
+
       await waitFor(() => {
         expect(mockRevealSRP).toHaveBeenCalled();
       });
 
-      // Check if copy button exists (only visible when unlocked)
-      await waitFor(
-        () => {
-          const copyButton = queryByTestId(
-            RevealSeedViewSelectorsIDs.REVEAL_CREDENTIAL_COPY_TO_CLIPBOARD_BUTTON,
-          );
-          if (copyButton) {
-            fireEvent.press(copyButton);
-            expect(ClipboardManager.setStringExpire).toHaveBeenCalled();
-          }
-        },
-        { timeout: 2000 },
+      const blurButton = getByTestId(
+        RevealSeedViewSelectorsIDs.REVEAL_CREDENTIAL_BUTTON_ID,
       );
-    });
+      fireEvent.press(blurButton);
 
-    it('dispatches showAlert after copying to clipboard', async () => {
-      mockReauthenticate.mockResolvedValue({ password: 'test-password' });
-      mockRevealSRP.mockResolvedValue(MOCK_PASSWORD);
+      const copyButton = getByTestId(
+        RevealSeedViewSelectorsIDs.REVEAL_CREDENTIAL_COPY_TO_CLIPBOARD_BUTTON,
+      );
+      fireEvent.press(copyButton);
 
-      const { queryByTestId } = renderWithProviders(
+      expect(ClipboardManager.setStringExpire).toHaveBeenCalledWith(
+        MOCK_PASSWORD,
+      );
+    });
+
+    it('shows toast after copying to clipboard', async () => {
+      mockReauthenticate.mockResolvedValue({ password: 'test-password' });
+      mockRevealSRP.mockResolvedValue(MOCK_PASSWORD);
+
+      const { getByTestId } = renderWithClipboardProviders(
         <RevealPrivateCredential
           route={createDefaultRoute()}
           navigation={null}
@@ -703,24 +1129,34 @@ describe('RevealPrivateCredential', () => {
         />,
       );
 
+      await completeSecurityQuiz(getByTestId);
+
       await waitFor(() => {
         expect(mockRevealSRP).toHaveBeenCalled();
       });
 
-      await waitFor(
-        () => {
-          const copyButton = queryByTestId(
-            RevealSeedViewSelectorsIDs.REVEAL_CREDENTIAL_COPY_TO_CLIPBOARD_BUTTON,
-          );
-          if (copyButton) {
-            fireEvent.press(copyButton);
-            expect(mockDispatch).toHaveBeenCalledWith(
-              expect.objectContaining({ type: 'SHOW_ALERT' }),
-            );
-          }
-        },
-        { timeout: 2000 },
+      const blurButton = getByTestId(
+        RevealSeedViewSelectorsIDs.REVEAL_CREDENTIAL_BUTTON_ID,
+      );
+      fireEvent.press(blurButton);
+
+      const copyButton = getByTestId(
+        RevealSeedViewSelectorsIDs.REVEAL_CREDENTIAL_COPY_TO_CLIPBOARD_BUTTON,
       );
+      fireEvent.press(copyButton);
+
+      await waitFor(() => {
+        expect(mockShowToast).toHaveBeenCalledWith(
+          expect.objectContaining({
+            variant: ToastVariants.Plain,
+            labelOptions: expect.arrayContaining([
+              expect.objectContaining({
+                label: expect.any(String),
+              }),
+            ]),
+          }),
+        );
+      });
     });
   });
 
@@ -731,7 +1167,7 @@ describe('RevealPrivateCredential', () => {
       mockReauthenticate.mockResolvedValue({ password: 'test-password' });
       mockRevealSRP.mockResolvedValue(MOCK_PASSWORD);
 
-      const { queryByTestId } = renderWithProviders(
+      const { getByTestId, queryByTestId } = renderWithProviders(
         <RevealPrivateCredential
           route={createDefaultRoute()}
           navigation={null}
@@ -739,10 +1175,20 @@ describe('RevealPrivateCredential', () => {
         />,
       );
 
+      await completeSecurityQuiz(getByTestId);
+
       await waitFor(() => {
         expect(mockRevealSRP).toHaveBeenCalled();
       });
 
+      // Reveal the seed phrase
+      const blurButton = queryByTestId(
+        RevealSeedViewSelectorsIDs.REVEAL_CREDENTIAL_BUTTON_ID,
+      );
+      if (blurButton) {
+        fireEvent.press(blurButton);
+      }
+
       // Copy button should not be visible when clipboard is disabled for old Android API levels
       expect(
         queryByTestId(
@@ -757,7 +1203,7 @@ describe('RevealPrivateCredential', () => {
       mockReauthenticate.mockResolvedValue({ password: 'test-password' });
       mockRevealSRP.mockResolvedValue(MOCK_PASSWORD);
 
-      const { queryByTestId } = renderWithProviders(
+      const { getByTestId, queryByTestId } = renderWithProviders(
         <RevealPrivateCredential
           route={createDefaultRoute()}
           navigation={null}
@@ -765,7 +1211,9 @@ describe('RevealPrivateCredential', () => {
         />,
       );
 
-      // Wait for auto-reveal via biometrics to unlock component
+      await completeSecurityQuiz(getByTestId);
+
+      // Wait for auto-reveal via biometrics to unlock component (runs when action view is reached)
       await waitFor(() => {
         expect(mockRevealSRP).toHaveBeenCalled();
       });
@@ -774,6 +1222,14 @@ describe('RevealPrivateCredential', () => {
         expect(Device.getDeviceAPILevel).toHaveBeenCalled();
       });
 
+      // Need to reveal the seed phrase after unlocking
+      const blurButton = queryByTestId(
+        RevealSeedViewSelectorsIDs.REVEAL_CREDENTIAL_BUTTON_ID,
+      );
+      if (blurButton) {
+        fireEvent.press(blurButton);
+      }
+
       // Copy button should be visible when unlocked on supported Android API level
       await waitFor(() => {
         expect(
@@ -783,16 +1239,16 @@ describe('RevealPrivateCredential', () => {
         ).not.toBeNull();
       });
     });
-  });
 
-  describe('modal interactions', () => {
-    it('opens external link when SRP guide link is pressed', async () => {
-      const Linking = jest.requireMock(
-        'react-native/Libraries/Linking/Linking',
+    it('enables clipboard when getDeviceAPILevel rejects on Android', async () => {
+      (Device.isAndroid as jest.Mock).mockReturnValue(true);
+      (Device.getDeviceAPILevel as jest.Mock).mockRejectedValue(
+        new Error('Native module failure'),
       );
-      mockReauthenticate.mockResolvedValue({ password: 'correct-password' });
+      mockReauthenticate.mockResolvedValue({ password: 'test-password' });
+      mockRevealSRP.mockResolvedValue(MOCK_PASSWORD);
 
-      const { getByTestId, getByText } = renderWithProviders(
+      const { getByTestId, queryByTestId } = renderWithProviders(
         <RevealPrivateCredential
           route={createDefaultRoute()}
           navigation={null}
@@ -800,51 +1256,52 @@ describe('RevealPrivateCredential', () => {
         />,
       );
 
-      const passwordInput = getByTestId(
-        RevealSeedViewSelectorsIDs.PASSWORD_INPUT_BOX_ID,
-      );
-      fireEvent.changeText(passwordInput, 'correct-password');
+      await completeSecurityQuiz(getByTestId);
 
-      const confirmButton = getByTestId(
-        RevealSeedViewSelectorsIDs.SECRET_RECOVERY_PHRASE_NEXT_BUTTON_ID,
-      );
-
-      await act(async () => {
-        fireEvent.press(confirmButton);
+      await waitFor(() => {
+        expect(mockRevealSRP).toHaveBeenCalled();
       });
 
+      const blurButton = queryByTestId(
+        RevealSeedViewSelectorsIDs.REVEAL_CREDENTIAL_BUTTON_ID,
+      );
+      if (blurButton) {
+        fireEvent.press(blurButton);
+      }
+
+      // Rejection is handled by enabling clipboard so user is not blocked
       await waitFor(() => {
         expect(
-          getByTestId(RevealSeedViewSelectorsIDs.REVEAL_CREDENTIAL_MODAL_ID),
-        ).toBeTruthy();
+          queryByTestId(
+            RevealSeedViewSelectorsIDs.REVEAL_CREDENTIAL_COPY_TO_CLIPBOARD_BUTTON,
+          ),
+        ).not.toBeNull();
       });
-
-      const linkText = getByText('but phishers might.');
-      fireEvent.press(linkText);
-
-      expect(Linking.openURL).toHaveBeenCalled();
     });
   });
 
-  describe('navigation', () => {
-    it('updates navigation options when shouldUpdateNav is true', () => {
-      const mockSetOptions = jest.fn();
-      const mockNavigation = {
-        pop: jest.fn(),
-        setOptions: mockSetOptions,
-      };
-
-      renderWithProviders(
+  describe('modal interactions', () => {
+    it('navigates to learn more when learn more link is pressed', () => {
+      const { getByTestId } = renderWithProviders(
         <RevealPrivateCredential
-          route={createDefaultRoute({ shouldUpdateNav: true })}
-          navigation={mockNavigation}
+          route={createDefaultRoute()}
+          navigation={null}
           cancel={() => null}
         />,
       );
 
-      expect(mockSetOptions).toHaveBeenCalled();
+      // Press the Learn more button on the introduction screen
+      const learnMoreButton = getByTestId(
+        ExportCredentialsIds.LEARN_MORE_BUTTON,
+      );
+
+      // Verify the button exists and can be pressed without error
+      expect(learnMoreButton).toBeOnTheScreen();
+      fireEvent.press(learnMoreButton);
     });
+  });
 
+  describe('navigation', () => {
     it('does not update navigation options when shouldUpdateNav is false', () => {
       const mockSetOptions = jest.fn();
       const mockNavigation = {
@@ -876,7 +1333,7 @@ describe('RevealPrivateCredential', () => {
 
       expect(
         getByTestId(RevealSeedViewSelectorsIDs.REVEAL_CREDENTIAL_CONTAINER_ID),
-      ).toBeTruthy();
+      ).toBeOnTheScreen();
       // When navigation is null, hasNavigation is false, so setOptions should never be called.
       // The component handles null navigation gracefully (no error thrown),
       // which proves updateNavBar returns early without calling navigation.setOptions()
@@ -885,10 +1342,10 @@ describe('RevealPrivateCredential', () => {
   });
 
   describe('analytics', () => {
-    it('tracks REVEAL_SRP_SCREEN event on mount', () => {
+    it('tracks REVEAL_SRP_SCREEN event when reaching action view', () => {
       renderWithProviders(
         <RevealPrivateCredential
-          route={createDefaultRoute()}
+          route={createDefaultRoute({ skipQuiz: true })}
           navigation={null}
           cancel={() => null}
         />,
@@ -918,6 +1375,8 @@ describe('RevealPrivateCredential', () => {
         />,
       );
 
+      await completeSecurityQuiz(getByTestId);
+
       await waitFor(() => {
         const cancelButton = getByTestId(
           RevealSeedViewSelectorsIDs.SECRET_RECOVERY_PHRASE_CANCEL_BUTTON_ID,
@@ -931,6 +1390,269 @@ describe('RevealPrivateCredential', () => {
         }),
       );
     });
+
+    it('tracks SRP_REVEAL_QUIZ_PROMPT_SEEN when introduction screen is shown', () => {
+      renderWithProviders(
+        <RevealPrivateCredential
+          route={createDefaultRoute()}
+          navigation={null}
+          cancel={() => null}
+        />,
+      );
+
+      expect(mockCreateEventBuilder).toHaveBeenCalledWith(
+        expect.objectContaining({
+          category: MetaMetricsEvents.SRP_REVEAL_QUIZ_PROMPT_SEEN.category,
+        }),
+      );
+    });
+
+    it('tracks SRP_REVEAL_START_CTA_SELECTED when Get started is pressed', async () => {
+      const { getByTestId } = renderWithProviders(
+        <RevealPrivateCredential
+          route={createDefaultRoute()}
+          navigation={null}
+          cancel={() => null}
+        />,
+      );
+
+      // Press Get started button
+      fireEvent.press(getByTestId(SrpQuizGetStartedSelectorsIDs.BUTTON));
+
+      await waitFor(() => {
+        expect(mockCreateEventBuilder).toHaveBeenCalledWith(
+          expect.objectContaining({
+            category: MetaMetricsEvents.SRP_REVEAL_START_CTA_SELECTED.category,
+          }),
+        );
+      });
+    });
+
+    it('tracks SRP_REVEAL_FIRST_QUESTION_SEEN when question 1 is shown', async () => {
+      const { getByTestId } = renderWithProviders(
+        <RevealPrivateCredential
+          route={createDefaultRoute()}
+          navigation={null}
+          cancel={() => null}
+        />,
+      );
+
+      // Navigate to quiz
+      fireEvent.press(getByTestId(SrpQuizGetStartedSelectorsIDs.BUTTON));
+
+      await waitFor(() => {
+        expect(mockCreateEventBuilder).toHaveBeenCalledWith(
+          expect.objectContaining({
+            category: MetaMetricsEvents.SRP_REVEAL_FIRST_QUESTION_SEEN.category,
+          }),
+        );
+      });
+    });
+
+    it('tracks SRP_REVEAL_FIRST_QUESTION_RIGHT_ASNWER when Q1 correct answer is selected', async () => {
+      const { getByTestId } = renderWithProviders(
+        <RevealPrivateCredential
+          route={createDefaultRoute()}
+          navigation={null}
+          cancel={() => null}
+        />,
+      );
+
+      // Navigate to quiz
+      fireEvent.press(getByTestId(SrpQuizGetStartedSelectorsIDs.BUTTON));
+
+      await waitFor(() => {
+        expect(
+          getByTestId(SrpSecurityQuestionOneSelectorsIDs.RIGHT_ANSWER),
+        ).toBeOnTheScreen();
+      });
+
+      // Select correct answer
+      fireEvent.press(
+        getByTestId(SrpSecurityQuestionOneSelectorsIDs.RIGHT_ANSWER),
+      );
+
+      await waitFor(() => {
+        expect(mockCreateEventBuilder).toHaveBeenCalledWith(
+          expect.objectContaining({
+            category:
+              MetaMetricsEvents.SRP_REVEAL_FIRST_QUESTION_RIGHT_ASNWER.category,
+          }),
+        );
+      });
+    });
+
+    it('tracks SRP_REVEAL_FIRST_QUESTION_WRONG_ANSWER when Q1 wrong answer is selected', async () => {
+      const { getByTestId } = renderWithProviders(
+        <RevealPrivateCredential
+          route={createDefaultRoute()}
+          navigation={null}
+          cancel={() => null}
+        />,
+      );
+
+      // Navigate to quiz
+      fireEvent.press(getByTestId(SrpQuizGetStartedSelectorsIDs.BUTTON));
+
+      await waitFor(() => {
+        expect(
+          getByTestId(SrpSecurityQuestionOneSelectorsIDs.WRONG_ANSWER),
+        ).toBeOnTheScreen();
+      });
+
+      // Select wrong answer
+      fireEvent.press(
+        getByTestId(SrpSecurityQuestionOneSelectorsIDs.WRONG_ANSWER),
+      );
+
+      await waitFor(() => {
+        expect(mockCreateEventBuilder).toHaveBeenCalledWith(
+          expect.objectContaining({
+            category:
+              MetaMetricsEvents.SRP_REVEAL_FIRST_QUESTION_WRONG_ANSWER.category,
+          }),
+        );
+      });
+    });
+
+    it('tracks SRP_REVEAL_SECOND_QUESTION_SEEN when question 2 is shown', async () => {
+      const { getByTestId } = renderWithProviders(
+        <RevealPrivateCredential
+          route={createDefaultRoute()}
+          navigation={null}
+          cancel={() => null}
+        />,
+      );
+
+      // Navigate to quiz and complete Q1
+      fireEvent.press(getByTestId(SrpQuizGetStartedSelectorsIDs.BUTTON));
+
+      await waitFor(() => {
+        expect(
+          getByTestId(SrpSecurityQuestionOneSelectorsIDs.RIGHT_ANSWER),
+        ).toBeOnTheScreen();
+      });
+      fireEvent.press(
+        getByTestId(SrpSecurityQuestionOneSelectorsIDs.RIGHT_ANSWER),
+      );
+
+      await waitFor(() => {
+        expect(
+          getByTestId(SrpSecurityQuestionOneSelectorsIDs.RIGHT_CONTINUE),
+        ).toBeOnTheScreen();
+      });
+      fireEvent.press(
+        getByTestId(SrpSecurityQuestionOneSelectorsIDs.RIGHT_CONTINUE),
+      );
+
+      // Now on Q2
+      await waitFor(() => {
+        expect(mockCreateEventBuilder).toHaveBeenCalledWith(
+          expect.objectContaining({
+            category:
+              MetaMetricsEvents.SRP_REVEAL_SECOND_QUESTION_SEEN.category,
+          }),
+        );
+      });
+    });
+
+    it('tracks SRP_REVEAL_SECOND_QUESTION_RIGHT_ASNWER when Q2 correct answer is selected', async () => {
+      const { getByTestId } = renderWithProviders(
+        <RevealPrivateCredential
+          route={createDefaultRoute()}
+          navigation={null}
+          cancel={() => null}
+        />,
+      );
+
+      // Complete Q1
+      fireEvent.press(getByTestId(SrpQuizGetStartedSelectorsIDs.BUTTON));
+      await waitFor(() => {
+        expect(
+          getByTestId(SrpSecurityQuestionOneSelectorsIDs.RIGHT_ANSWER),
+        ).toBeOnTheScreen();
+      });
+      fireEvent.press(
+        getByTestId(SrpSecurityQuestionOneSelectorsIDs.RIGHT_ANSWER),
+      );
+      await waitFor(() => {
+        expect(
+          getByTestId(SrpSecurityQuestionOneSelectorsIDs.RIGHT_CONTINUE),
+        ).toBeOnTheScreen();
+      });
+      fireEvent.press(
+        getByTestId(SrpSecurityQuestionOneSelectorsIDs.RIGHT_CONTINUE),
+      );
+
+      // Select correct answer for Q2
+      await waitFor(() => {
+        expect(
+          getByTestId(SrpSecurityQuestionTwoSelectorsIDs.RIGHT_ANSWER),
+        ).toBeOnTheScreen();
+      });
+      fireEvent.press(
+        getByTestId(SrpSecurityQuestionTwoSelectorsIDs.RIGHT_ANSWER),
+      );
+
+      await waitFor(() => {
+        expect(mockCreateEventBuilder).toHaveBeenCalledWith(
+          expect.objectContaining({
+            category:
+              MetaMetricsEvents.SRP_REVEAL_SECOND_QUESTION_RIGHT_ASNWER
+                .category,
+          }),
+        );
+      });
+    });
+
+    it('tracks SRP_REVEAL_SECOND_QUESTION_WRONG_ANSWER when Q2 wrong answer is selected', async () => {
+      const { getByTestId } = renderWithProviders(
+        <RevealPrivateCredential
+          route={createDefaultRoute()}
+          navigation={null}
+          cancel={() => null}
+        />,
+      );
+
+      // Complete Q1
+      fireEvent.press(getByTestId(SrpQuizGetStartedSelectorsIDs.BUTTON));
+      await waitFor(() => {
+        expect(
+          getByTestId(SrpSecurityQuestionOneSelectorsIDs.RIGHT_ANSWER),
+        ).toBeOnTheScreen();
+      });
+      fireEvent.press(
+        getByTestId(SrpSecurityQuestionOneSelectorsIDs.RIGHT_ANSWER),
+      );
+      await waitFor(() => {
+        expect(
+          getByTestId(SrpSecurityQuestionOneSelectorsIDs.RIGHT_CONTINUE),
+        ).toBeOnTheScreen();
+      });
+      fireEvent.press(
+        getByTestId(SrpSecurityQuestionOneSelectorsIDs.RIGHT_CONTINUE),
+      );
+
+      // Select wrong answer for Q2
+      await waitFor(() => {
+        expect(
+          getByTestId(SrpSecurityQuestionTwoSelectorsIDs.WRONG_ANSWER),
+        ).toBeOnTheScreen();
+      });
+      fireEvent.press(
+        getByTestId(SrpSecurityQuestionTwoSelectorsIDs.WRONG_ANSWER),
+      );
+
+      await waitFor(() => {
+        expect(mockCreateEventBuilder).toHaveBeenCalledWith(
+          expect.objectContaining({
+            category:
+              MetaMetricsEvents.SRP_REVEAL_SECOND_QUESTION_WRONG_ANSWER
+                .category,
+          }),
+        );
+      });
+    });
   });
 
   describe('done action', () => {
@@ -939,7 +1661,7 @@ describe('RevealPrivateCredential', () => {
       mockReauthenticate.mockResolvedValue({ password: 'test-password' });
       mockRevealSRP.mockResolvedValue(MOCK_PASSWORD);
 
-      const { queryByTestId } = renderWithProviders(
+      const { getByTestId } = renderWithProviders(
         <RevealPrivateCredential
           route={createDefaultRoute()}
           navigation={null}
@@ -947,23 +1669,21 @@ describe('RevealPrivateCredential', () => {
         />,
       );
 
-      // Wait for biometric unlock
+      await completeSecurityQuiz(getByTestId);
+
+      // Wait for biometric unlock (runs when action view is reached)
       await waitFor(() => {
         expect(mockRevealSRP).toHaveBeenCalled();
       });
 
-      // After unlock, the cancel button becomes "Done"
-      await waitFor(
-        () => {
-          const doneButton = queryByTestId(
-            RevealSeedViewSelectorsIDs.SECRET_RECOVERY_PHRASE_CANCEL_BUTTON_ID,
-          );
-          if (doneButton) {
-            fireEvent.press(doneButton);
-          }
-        },
-        { timeout: 2000 },
-      );
+      // After unlock via biometrics, the cancel button shows "Done"
+      await waitFor(() => {
+        const doneButton = getByTestId(
+          RevealSeedViewSelectorsIDs.SECRET_RECOVERY_PHRASE_CANCEL_BUTTON_ID,
+        );
+        expect(doneButton).toBeOnTheScreen();
+        fireEvent.press(doneButton);
+      });
 
       expect(mockCancel).toHaveBeenCalled();
       expect(mockCreateEventBuilder).toHaveBeenCalledWith(
@@ -981,6 +1701,7 @@ describe('RevealPrivateCredential', () => {
       const customAccount = createMockAccount({
         address: customAddress,
       });
+      // Mock biometrics to fail, but then fail with a specific error when trying to unlock
       mockReauthenticate.mockRejectedValue(new Error('Test error'));
 
       const { getByTestId } = renderWithProviders(
@@ -991,6 +1712,8 @@ describe('RevealPrivateCredential', () => {
         />,
       );
 
+      await completeSecurityQuizAndWaitForPasswordEntry(getByTestId);
+
       const passwordInput = getByTestId(
         RevealSeedViewSelectorsIDs.PASSWORD_INPUT_BOX_ID,
       );
@@ -1024,23 +1747,32 @@ describe('RevealPrivateCredential', () => {
         />,
       );
 
+      await completeSecurityQuiz(getByTestId);
+
       await waitFor(() => {
         expect(mockRevealSRP).toHaveBeenCalled();
       });
 
+      const blurButton = queryByTestId(
+        RevealSeedViewSelectorsIDs.REVEAL_CREDENTIAL_BUTTON_ID,
+      );
+      if (blurButton) {
+        fireEvent.press(blurButton);
+      }
+
       // Verify component successfully unlocked using the fallback address from selector
       // The SRP is revealed, proving the fallback address worked
       await waitFor(() => {
         const copyButton = queryByTestId(
           RevealSeedViewSelectorsIDs.REVEAL_CREDENTIAL_COPY_TO_CLIPBOARD_BUTTON,
         );
-        expect(copyButton).toBeTruthy();
+        expect(copyButton).toBeOnTheScreen();
       });
 
       // Verify the container is still rendered (component didn't crash with fallback address)
       expect(
         getByTestId(RevealSeedViewSelectorsIDs.REVEAL_CREDENTIAL_CONTAINER_ID),
-      ).toBeTruthy();
+      ).toBeOnTheScreen();
     });
   });
 });
diff --git a/app/components/Views/RevealPrivateCredential/RevealPrivateCredential.tsx b/app/components/Views/RevealPrivateCredential/RevealPrivateCredential.tsx
index ce5ee741a80f..384cc828d239 100644
--- a/app/components/Views/RevealPrivateCredential/RevealPrivateCredential.tsx
+++ b/app/components/Views/RevealPrivateCredential/RevealPrivateCredential.tsx
@@ -1,89 +1,51 @@
 /* eslint-disable no-mixed-spaces-and-tabs */
-import React, { useEffect, useState, useCallback, useRef } from 'react';
-import {
-  Dimensions,
-  Linking,
-  Platform,
-  ScrollView,
-  TextInput,
-  View,
-} from 'react-native';
-import { useDispatch, useSelector } from 'react-redux';
-import { InternalAccount } from '@metamask/keyring-internal-api';
-import QRCode from 'react-native-qrcode-svg';
-import { RouteProp, ParamListBase } from '@react-navigation/native';
-import ScrollableTabView from '@tommasini/react-native-scrollable-tab-view';
-// TODO: Replace "any" with type
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-const CustomTabView = ScrollView as any;
-import { store } from '../../../store';
+import React, {
+  useEffect,
+  useState,
+  useCallback,
+  useContext,
+  useRef,
+} from 'react';
+import { Linking, View } from 'react-native';
+import { useSelector } from 'react-redux';
 import ActionView from '../../UI/ActionView';
-import ButtonReveal from '../../UI/ButtonReveal';
-import Button, {
-  ButtonSize,
-  ButtonVariants,
-} from '../../../component-library/components/Buttons/Button';
-import Icon, {
-  IconSize,
-  IconName,
-} from '../../../component-library/components/Icons/Icon';
-import InfoModal from '../../Base/InfoModal';
 import { ScreenshotDeterrent } from '../../UI/ScreenshotDeterrent';
-import { showAlert } from '../../../actions/alert';
-import { recordSRPRevealTimestamp } from '../../../actions/privacy';
-import { WRONG_PASSWORD_ERROR } from '../../../constants/error';
-import { KEEP_SRP_SAFE_URL, SRP_GUIDE_URL } from '../../../constants/urls';
+import { SRP_GUIDE_URL } from '../../../constants/urls';
 import ClipboardManager from '../../../core/ClipboardManager';
 import { useTheme } from '../../../util/theme';
 import { MetaMetricsEvents } from '../../../core/Analytics/MetaMetrics.events';
 import { passwordRequirementsMet } from '../../../util/password';
-import useAuthentication from '../../../core/Authentication/hooks/useAuthentication';
-import { ReauthenticateErrorType } from '../../../core/Authentication/types';
-
-import { isTest } from '../../../util/test/utils';
 import Device from '../../../util/device';
 import { strings } from '../../../../locales/i18n';
-import { isHardwareAccount } from '../../../util/address';
 import AppConstants from '../../../core/AppConstants';
 import { createStyles } from './styles';
-import { getNavigationOptionsTitle } from '../../../components/UI/Navbar';
 import { RevealSeedViewSelectorsIDs } from './RevealSeedView.testIds';
-
 import { selectSelectedInternalAccountFormattedAddress } from '../../../selectors/accountsController';
 import { useAnalytics } from '../../../components/hooks/useAnalytics/useAnalytics';
-import {
-  endTrace,
-  trace,
-  TraceName,
-  TraceOperation,
-} from '../../../util/trace';
-import { getTraceTags } from '../../../util/sentry/tags';
 import Text, {
+  TextColor,
   TextVariant,
 } from '../../../component-library/components/Texts/Text';
-import TabBar from '../../../component-library/components-temp/TabBar/TabBar';
-
-interface RootStackParamList extends ParamListBase {
-  RevealPrivateCredential: {
-    shouldUpdateNav?: boolean;
-    selectedAccount?: InternalAccount;
-    keyringId?: string;
-  };
-}
-
-type RevealPrivateCredentialRouteProp = RouteProp<
-  RootStackParamList,
-  'RevealPrivateCredential'
->;
-
-interface IRevealPrivateCredentialProps {
-  // TODO: Replace "any" with type
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  navigation: any;
-  cancel: () => void;
-  route: RevealPrivateCredentialRouteProp;
-  showCancelButton?: boolean;
-}
+import Banner, {
+  BannerAlertSeverity,
+  BannerVariant,
+} from '../../../component-library/components/Banners/Banner';
+import { IconName as IconNameLibrary } from '../../../component-library/components/Icons/Icon';
+import {
+  ButtonIconVariant,
+  ToastContext,
+  ToastVariants,
+} from '../../../component-library/components/Toast';
+import Routes from '../../../constants/navigation/Routes';
+import {
+  SRPQuizIntroduction,
+  SRPSecurityQuiz,
+  PasswordEntry,
+  SRPTabView,
+} from './components';
+import { useRevealCredential, useSRPQuiz } from './hooks';
+import { IRevealPrivateCredentialProps, RevealSrpStage } from './types';
+import HeaderCompactStandard from '../../../component-library/components-temp/HeaderCompactStandard';
 
 const RevealPrivateCredential = ({
   navigation,
@@ -92,131 +54,114 @@ const RevealPrivateCredential = ({
   showCancelButton,
 }: IRevealPrivateCredentialProps) => {
   const hasNavigation = !!navigation;
-  // TODO - Refactor or split RevealPrivateCredential when used in Nav stack vs outside of it
   const shouldUpdateNav = route?.params?.shouldUpdateNav;
-  const [clipboardPrivateCredential, setClipboardPrivateCredential] =
-    useState<string>('');
-  const [unlocked, setUnlocked] = useState<boolean>(false);
-  const [password, setPassword] = useState<string>('');
-  const [warningIncorrectPassword, setWarningIncorrectPassword] =
-    useState<string>('');
+  const keyringId = route?.params?.keyringId;
+
   const [clipboardEnabled, setClipboardEnabled] = useState<boolean>(false);
-  const [isModalVisible, setIsModalVisible] = useState<boolean>(false);
-  const passwordInputRef = useRef<TextInput>(null);
-  const { reauthenticate, revealSRP } = useAuthentication();
+  const [showPassword, setShowPassword] = useState<boolean>(false);
+  const [showSeedPhrase, setShowSeedPhrase] = useState<boolean>(false);
 
-  const keyringId = route?.params?.keyringId;
+  const { toastRef } = useContext(ToastContext);
 
   const checkSummedAddress = useSelector(
     selectSelectedInternalAccountFormattedAddress,
   );
 
-  const dispatch = useDispatch();
-
   const theme = useTheme();
   const { trackEvent, createEventBuilder } = useAnalytics();
-  const { colors, themeAppearance } = theme;
-  const styles = createStyles(theme);
+  const { colors } = theme;
+  const styles = createStyles(theme, colors);
 
   const selectedAddress =
     route?.params?.selectedAccount?.address || checkSummedAddress;
 
-  const updateNavBar = () => {
-    if (!hasNavigation || !shouldUpdateNav) {
-      return;
-    }
-    navigation.setOptions(
-      getNavigationOptionsTitle(
-        strings('reveal_credential.seed_phrase_title'),
-        navigation,
-        false,
-        colors,
-        MetaMetricsEvents.GO_BACK_SRP_SCREEN,
-      ),
+  const {
+    unlocked,
+    password,
+    warningIncorrectPassword,
+    clipboardPrivateCredential,
+    setPassword,
+    revealCredential,
+    tryUnlock,
+  } = useRevealCredential({
+    selectedAddress,
+    keyringId,
+  });
+
+  const {
+    revealSrpStage,
+    currentQuestionIndex,
+    questionAnswered,
+    correctAnswer,
+    handleGetStartedClick,
+    handleQuestionAnswerClick,
+    handleAnsweredQuestionClick,
+  } = useSRPQuiz({
+    initialStage: route?.params?.skipQuiz
+      ? RevealSrpStage.ActionViewScreen
+      : undefined,
+  });
+
+  const headerNavigationBack = useCallback(() => {
+    trackEvent(
+      createEventBuilder(MetaMetricsEvents.GO_BACK_SRP_SCREEN).build(),
     );
-  };
-
-  const revealCredential = useCallback(
-    async (pswd?: string) => {
-      setIsModalVisible(false);
-      const traceName = TraceName.RevealSrp;
-
-      let passwordToUse = pswd;
-
-      try {
-        if (!passwordToUse) {
-          const { password: verifiedPassword } = await reauthenticate();
-          passwordToUse = verifiedPassword;
-        }
-
-        // This will trigger after the user has been authenticated, we want to trace the actual
-        // keyring operation of extracting the credential.
-        trace({
-          name: traceName,
-          op: TraceOperation.RevealPrivateCredential,
-          tags: getTraceTags(store.getState()),
-        });
-
-        const privateCredential = await revealSRP(passwordToUse, keyringId);
-
-        if (privateCredential) {
-          setClipboardPrivateCredential(privateCredential);
-          setUnlocked(true);
-
-          // We would reveal the private credential after this point, so that's the end of the flow.
-          endTrace({
-            name: traceName,
-          });
-        }
-        // TODO: Replace "any" with type
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      } catch (e: any) {
-        // we should not show the error message if the error is because password is not set with biometrics
-        if (
-          e.message.includes(
-            ReauthenticateErrorType.PASSWORD_NOT_SET_WITH_BIOMETRICS,
-          )
-        ) {
-          return;
-        }
-        let msg = strings('reveal_credential.warning_incorrect_password');
-        if (selectedAddress && isHardwareAccount(selectedAddress)) {
-          msg = strings('reveal_credential.hardware_error');
-        } else if (
-          e.toString().toLowerCase() !== WRONG_PASSWORD_ERROR.toLowerCase()
-        ) {
-          msg = strings('reveal_credential.unknown_error');
-        }
-
-        setIsModalVisible(false);
-        setUnlocked(false);
-        setWarningIncorrectPassword(msg);
-      }
-    },
-    [selectedAddress, keyringId, reauthenticate, revealSRP],
-  );
-
-  const revealCredentialWithPassword = () => {
-    revealCredential(password);
-  };
+    if (hasNavigation) {
+      navigation.goBack();
+    } else {
+      cancel?.();
+    }
+  }, [hasNavigation, navigation, cancel, trackEvent, createEventBuilder]);
 
+  // Only when user reaches the action view (after quiz): track once, then attempt reveal once.
+  const hasRunRevealForActionView = useRef(false);
   useEffect(() => {
-    updateNavBar();
-    // Track screen view analytics
+    if (revealSrpStage !== RevealSrpStage.ActionViewScreen) return;
+    if (hasRunRevealForActionView.current) return;
+    hasRunRevealForActionView.current = true;
     trackEvent(createEventBuilder(MetaMetricsEvents.REVEAL_SRP_SCREEN).build());
     revealCredential();
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
+  }, [revealSrpStage, revealCredential, trackEvent, createEventBuilder]);
 
-  const navigateBack = () => {
-    if (hasNavigation && shouldUpdateNav) {
-      navigation.pop();
+  useEffect(() => {
+    if (Device.isAndroid()) {
+      Device.getDeviceAPILevel()
+        .then((apiLevel) => {
+          setClipboardEnabled(
+            apiLevel >= AppConstants.LEAST_SUPPORTED_ANDROID_API_LEVEL,
+          );
+        })
+        .catch(() => {
+          setClipboardEnabled(true);
+        });
     } else {
-      cancel?.();
+      setClipboardEnabled(true);
     }
-  };
+  }, []);
 
-  const cancelReveal = () => {
+  const navigateBack = useCallback(() => {
+    if (!hasNavigation) {
+      cancel?.();
+      return;
+    }
+    if (route?.params?.popToTopOnDone) {
+      navigation.popToTop();
+      return;
+    }
+    if (shouldUpdateNav) {
+      navigation.pop();
+      return;
+    }
+    navigation.pop();
+  }, [
+    hasNavigation,
+    shouldUpdateNav,
+    navigation,
+    cancel,
+    route?.params?.popToTopOnDone,
+  ]);
+
+  const cancelReveal = useCallback(() => {
     if (!unlocked)
       trackEvent(
         createEventBuilder(MetaMetricsEvents.REVEAL_SRP_CANCELLED)
@@ -231,36 +176,57 @@ const RevealPrivateCredential = ({
     );
     if (cancel) return cancel();
     navigateBack();
-  };
+  }, [unlocked, trackEvent, createEventBuilder, cancel, navigateBack]);
 
-  const tryUnlock = async () => {
-    try {
-      await reauthenticate(password);
-    } catch {
-      const msg = strings('reveal_credential.warning_incorrect_password');
-      setWarningIncorrectPassword(msg);
-      return;
+  const done = useCallback(() => {
+    trackEvent(createEventBuilder(MetaMetricsEvents.SRP_DONE_CTA).build());
+    navigateBack();
+  }, [trackEvent, createEventBuilder, navigateBack]);
+
+  const handleLearnMoreClick = useCallback(() => {
+    if (hasNavigation) {
+      navigation.navigate(Routes.WEBVIEW.MAIN, {
+        screen: Routes.WEBVIEW.SIMPLE,
+        params: {
+          url: SRP_GUIDE_URL,
+        },
+      });
+    } else {
+      Linking.openURL(SRP_GUIDE_URL);
     }
+  }, [hasNavigation, navigation]);
+
+  const onTabBarChange = useCallback(
+    (event: { i: number }) => {
+      if (event.i === 0) {
+        trackEvent(
+          createEventBuilder(MetaMetricsEvents.REVEAL_SRP_COMPLETED)
+            .addProperties({ action: 'viewed SRP' })
+            .build(),
+        );
+        trackEvent(createEventBuilder(MetaMetricsEvents.VIEW_SRP).build());
+      } else if (event.i === 1) {
+        trackEvent(
+          createEventBuilder(MetaMetricsEvents.REVEAL_SRP_COMPLETED)
+            .addProperties({ action: 'viewed QR code' })
+            .build(),
+        );
+        trackEvent(createEventBuilder(MetaMetricsEvents.VIEW_SRP_QR).build());
+      }
+    },
+    [trackEvent, createEventBuilder],
+  );
 
-    const currentDate = new Date();
-    dispatch(recordSRPRevealTimestamp(currentDate.toString()));
-    trackEvent(
-      createEventBuilder(MetaMetricsEvents.NEXT_REVEAL_SRP_CTA).build(),
-    );
-    setIsModalVisible(true);
-    setWarningIncorrectPassword('');
-  };
-
-  const onPasswordChange = (pswd: string) => {
-    setPassword(pswd);
-  };
+  const lastCopyTimeRef = useRef<number>(0);
+  const COPY_THROTTLE_MS = 2000;
 
-  const done = () => {
-    trackEvent(createEventBuilder(MetaMetricsEvents.SRP_DONE_CTA).build());
-    navigateBack();
-  };
+  const copyPrivateCredentialToClipboard = useCallback(async () => {
+    const now = Date.now();
+    if (now - lastCopyTimeRef.current < COPY_THROTTLE_MS) {
+      return;
+    }
+    lastCopyTimeRef.current = now;
 
-  const copyPrivateCredentialToClipboard = async () => {
     trackEvent(
       createEventBuilder(MetaMetricsEvents.REVEAL_SRP_COMPLETED)
         .addProperties({
@@ -272,306 +238,157 @@ const RevealPrivateCredential = ({
     trackEvent(createEventBuilder(MetaMetricsEvents.COPY_SRP).build());
     await ClipboardManager.setStringExpire(clipboardPrivateCredential);
 
-    const msg = `${strings(
-      `reveal_credential.seed_phrase_copied_${Platform.OS}`,
-    )}${
-      Device.isIos() ? strings(`reveal_credential.seed_phrase_copied_time`) : ''
-    }`;
-
-    dispatch(
-      showAlert({
-        isVisible: true,
-        autodismiss: 1500,
-        content: 'clipboard-alert',
-        data: {
-          msg,
-          width: '70%',
+    toastRef?.current?.showToast({
+      variant: ToastVariants.Plain,
+      labelOptions: [
+        {
+          label: strings('reveal_credential.copied_to_clipboard'),
         },
-      }),
-    );
-  };
-
-  const renderTabBar = () => <TabBar />;
-
-  const onTabBarChange = (event: { i: number }) => {
-    if (event.i === 0) {
-      trackEvent(
-        createEventBuilder(MetaMetricsEvents.REVEAL_SRP_COMPLETED)
-          .addProperties({ action: 'viewed SRP' })
-          .build(),
-      );
-
-      trackEvent(createEventBuilder(MetaMetricsEvents.VIEW_SRP).build());
-    } else if (event.i === 1) {
-      trackEvent(
-        createEventBuilder(MetaMetricsEvents.REVEAL_SRP_COMPLETED)
-          .addProperties({ action: 'viewed QR code' })
-          .build(),
-      );
-
-      trackEvent(createEventBuilder(MetaMetricsEvents.VIEW_SRP_QR).build());
-    }
-  };
-
-  useEffect(() => {
-    Device.isAndroid() &&
-      Device.getDeviceAPILevel().then((apiLevel) => {
-        if (apiLevel < AppConstants.LEAST_SUPPORTED_ANDROID_API_LEVEL) {
-          setClipboardEnabled(false);
-          return;
-        }
-      });
-
-    setClipboardEnabled(true);
-  }, []);
-
-  const renderTabView = () => (
-    <View style={styles.tabContainer}>
-      <ScrollableTabView
-        renderTabBar={() => renderTabBar()}
-        // TODO: Replace "any" with type
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        onChangeTab={(event: any) => onTabBarChange(event)}
-        style={styles.tabContentContainer}
-      >
-        <CustomTabView
-          tabLabel={strings(`reveal_credential.text`)}
-          testID={RevealSeedViewSelectorsIDs.TAB_SCROLL_VIEW_TEXT}
-        >
-          <View style={styles.seedPhraseView}>
-            <TextInput
-              value={clipboardPrivateCredential}
-              numberOfLines={3}
-              multiline
-              selectTextOnFocus
-              style={styles.seedPhrase}
-              editable={false}
-              testID={RevealSeedViewSelectorsIDs.REVEAL_CREDENTIAL_TEXT}
-              placeholderTextColor={colors.text.muted}
-              keyboardAppearance={themeAppearance}
-            />
-            {clipboardEnabled ? (
-              <Button
-                label={strings('reveal_credential.copy_to_clipboard')}
-                variant={ButtonVariants.Secondary}
-                size={ButtonSize.Sm}
-                onPress={() => copyPrivateCredentialToClipboard()}
-                testID={
-                  RevealSeedViewSelectorsIDs.REVEAL_CREDENTIAL_COPY_TO_CLIPBOARD_BUTTON
-                }
-                style={styles.clipboardButton}
-              />
-            ) : null}
-          </View>
-        </CustomTabView>
-        <CustomTabView
-          tabLabel={strings(`reveal_credential.qr_code`)}
-          testID={RevealSeedViewSelectorsIDs.TAB_SCROLL_VIEW_QR_CODE}
-        >
-          <View
-            style={styles.qrCodeWrapper}
-            testID={
-              RevealSeedViewSelectorsIDs.REVEAL_CREDENTIAL_QR_CODE_IMAGE_ID
-            }
-          >
-            <QRCode
-              value={clipboardPrivateCredential}
-              size={Dimensions.get('window').width - 200}
-            />
-          </View>
-        </CustomTabView>
-      </ScrollableTabView>
-    </View>
-  );
-
-  const renderPasswordEntry = () => (
-    <>
-      <Text style={styles.enterPassword} variant={TextVariant.BodyMDMedium}>
-        {strings('reveal_credential.enter_password')}
-      </Text>
-      <TextInput
-        ref={passwordInputRef}
-        style={styles.input}
-        placeholder={'Password'}
-        placeholderTextColor={colors.text.muted}
-        onChangeText={onPasswordChange}
-        secureTextEntry
-        autoCapitalize="none"
-        onSubmitEditing={tryUnlock}
-        keyboardAppearance={themeAppearance}
-        testID={RevealSeedViewSelectorsIDs.PASSWORD_INPUT_BOX_ID}
-        onTouchStart={() => {
-          if (!passwordInputRef.current?.isFocused()) {
-            passwordInputRef.current?.focus();
-          }
-        }}
-      />
-      <Text
-        style={styles.warningText}
-        testID={RevealSeedViewSelectorsIDs.PASSWORD_WARNING_ID}
-      >
-        {warningIncorrectPassword}
-      </Text>
-    </>
-  );
-
-  const closeModal = () => {
-    trackEvent(
-      createEventBuilder(MetaMetricsEvents.REVEAL_SRP_CANCELLED)
-        .addProperties({ view: 'Hold to reveal' })
-        .build(),
-    );
-
-    trackEvent(
-      createEventBuilder(
-        MetaMetricsEvents.SRP_DISMISS_HOLD_TO_REVEAL_DIALOG,
-      ).build(),
-    );
-
-    setIsModalVisible(false);
-  };
-
-  const renderModal = () => (
-    <InfoModal
-      isVisible={isModalVisible}
-      toggleModal={closeModal}
-      testID={RevealSeedViewSelectorsIDs.REVEAL_CREDENTIAL_MODAL_ID}
-      title={strings('reveal_credential.keep_credential_safe', {
-        credentialName: strings('reveal_credential.srp_abbreviation_text'),
-      })}
-      body={
-        <>
-          <Text variant={TextVariant.BodyMD} style={styles.revealModalText}>
-            {
-              strings('reveal_credential.reveal_credential_modal', {
-                credentialName: strings('reveal_credential.srp_text'),
-              })[0]
-            }
-            <Text variant={TextVariant.BodyMDBold}>
-              {strings('reveal_credential.reveal_credential_modal')[2]}
-            </Text>
-            {strings('reveal_credential.reveal_credential_modal')[3]}
-            <Text
-              color={colors.primary.default}
-              variant={TextVariant.BodyMDBold}
-              onPress={() => Linking.openURL(KEEP_SRP_SAFE_URL)}
-            >
-              {strings('reveal_credential.reveal_credential_modal')[4]}
-            </Text>
-          </Text>
-          {isTest ? (
-            <Button
-              label={strings('reveal_credential.reveal_credential', {
-                credentialName: strings(
-                  'reveal_credential.srp_abbreviation_text',
-                ),
-              })}
-              variant={ButtonVariants.Primary}
-              size={ButtonSize.Lg}
-              onPress={revealCredentialWithPassword}
-              style={styles.revealButton}
-              testID={RevealSeedViewSelectorsIDs.REVEAL_CREDENTIAL_BUTTON_ID}
-            />
-          ) : (
-            <ButtonReveal
-              label={strings('reveal_credential.hold_to_reveal_credential', {
-                credentialName: strings(
-                  'reveal_credential.srp_abbreviation_text',
-                ),
-              })}
-              onLongPress={revealCredentialWithPassword}
-            />
-          )}
-        </>
-      }
-    />
-  );
+      ],
+      hasNoTimeout: false,
+      closeButtonOptions: {
+        variant: ButtonIconVariant.Icon,
+        iconName: IconNameLibrary.Close,
+        onPress: () => {
+          toastRef?.current?.closeToast();
+        },
+      },
+    });
+  }, [trackEvent, createEventBuilder, clipboardPrivateCredential, toastRef]);
 
   const renderSRPExplanation = () => (
-    <Text style={styles.normalText}>
+    <Text variant={TextVariant.BodyMD} color={TextColor.Alternative}>
       {strings('reveal_credential.seed_phrase_explanation')[0]}{' '}
-      <Text
-        color={colors.primary.default}
-        onPress={() => Linking.openURL(SRP_GUIDE_URL)}
-      >
+      <Text color={colors.primary.default} onPress={handleLearnMoreClick}>
         {strings('reveal_credential.seed_phrase_explanation')[1]}
       </Text>{' '}
       {strings('reveal_credential.seed_phrase_explanation')[2]}{' '}
-      <Text>{strings('reveal_credential.seed_phrase_explanation')[3]}</Text>
+      <Text variant={TextVariant.BodyMD} color={TextColor.Alternative}>
+        {strings('reveal_credential.seed_phrase_explanation')[3]}
+      </Text>
     </Text>
   );
 
   const renderWarning = () => (
-    <View
-      style={[styles.rowWrapper, styles.warningWrapper]}
-      testID={RevealSeedViewSelectorsIDs.SEED_PHRASE_WARNING_ID}
-    >
-      <View style={[styles.warningRowWrapper]}>
-        <Icon
-          color={colors.error.default}
-          name={IconName.EyeSlash}
-          size={IconSize.Lg}
-          style={styles.icon}
-        />
-        <Text style={styles.warningMessageText}>
-          {strings('reveal_credential.seed_phrase_warning_explanation')[0]}
-          <Text style={styles.boldText}>
-            {strings('reveal_credential.seed_phrase_warning_explanation')[1]}
+    <View testID={RevealSeedViewSelectorsIDs.SEED_PHRASE_WARNING_ID}>
+      <Banner
+        variant={BannerVariant.Alert}
+        severity={BannerAlertSeverity.Error}
+        title={
+          <Text variant={TextVariant.BodySM} color={TextColor.Default}>
+            {strings('reveal_credential.seed_phrase_warning_explanation')}
           </Text>
-        </Text>
-      </View>
+        }
+        style={styles.warningWrapper}
+      />
     </View>
   );
 
+  const renderActionView = () => (
+    <ActionView
+      cancelText={
+        unlocked
+          ? strings('reveal_credential.done')
+          : strings('reveal_credential.cancel')
+      }
+      confirmText={strings('reveal_credential.confirm')}
+      onCancelPress={unlocked ? done : cancelReveal}
+      onConfirmPress={() => tryUnlock()}
+      showConfirmButton={!unlocked}
+      confirmDisabled={!passwordRequirementsMet(password)}
+      cancelTestID={
+        RevealSeedViewSelectorsIDs.SECRET_RECOVERY_PHRASE_CANCEL_BUTTON_ID
+      }
+      confirmTestID={
+        RevealSeedViewSelectorsIDs.SECRET_RECOVERY_PHRASE_NEXT_BUTTON_ID
+      }
+      scrollViewTestID={RevealSeedViewSelectorsIDs.REVEAL_CREDENTIAL_SCROLL_ID}
+      showCancelButton={Boolean(showCancelButton || unlocked)}
+      enableOnAndroid
+      enableAutomaticScroll
+      extraScrollHeight={40}
+      showsVerticalScrollIndicator={false}
+    >
+      <View>
+        {/* @ts-expect-error - React Native style type mismatch due to outdated @types/react-native See: https://github.com/MetaMask/metamask-mobile/pull/18956#discussion_r2316407382 */}
+        <View style={[styles.rowWrapper, styles.normalText]}>
+          <>
+            {unlocked ? (
+              <Text variant={TextVariant.BodyMD} color={TextColor.Alternative}>
+                {strings('reveal_credential.reveal_srp_description')}
+              </Text>
+            ) : (
+              renderSRPExplanation()
+            )}
+            {unlocked ? null : renderWarning()}
+          </>
+        </View>
+        {unlocked ? (
+          <SRPTabView
+            clipboardPrivateCredential={clipboardPrivateCredential}
+            showSeedPhrase={showSeedPhrase}
+            clipboardEnabled={clipboardEnabled}
+            onRevealSeedPhrase={() => setShowSeedPhrase(!showSeedPhrase)}
+            onCopyToClipboard={copyPrivateCredentialToClipboard}
+            onTabChange={onTabBarChange}
+            styles={styles}
+          />
+        ) : (
+          <View style={styles.rowWrapper}>
+            <PasswordEntry
+              onPasswordChange={setPassword}
+              onSubmit={tryUnlock}
+              warningMessage={warningIncorrectPassword}
+              showPassword={showPassword}
+              onToggleShowPassword={() => setShowPassword(!showPassword)}
+              styles={styles}
+            />
+          </View>
+        )}
+      </View>
+    </ActionView>
+  );
+
+  const renderContent = () => {
+    if (revealSrpStage === RevealSrpStage.Introduction) {
+      return (
+        <SRPQuizIntroduction
+          onGetStarted={handleGetStartedClick}
+          onLearnMore={handleLearnMoreClick}
+          styles={styles}
+        />
+      );
+    }
+    if (revealSrpStage === RevealSrpStage.Quiz) {
+      return (
+        <SRPSecurityQuiz
+          currentQuestionIndex={currentQuestionIndex}
+          questionAnswered={questionAnswered}
+          correctAnswer={correctAnswer}
+          onAnswerClick={handleQuestionAnswerClick}
+          onContinueClick={handleAnsweredQuestionClick}
+          onLearnMore={handleLearnMoreClick}
+          styles={styles}
+        />
+      );
+    }
+    return renderActionView();
+  };
+
   return (
     <View
       style={styles.wrapper}
       testID={RevealSeedViewSelectorsIDs.REVEAL_CREDENTIAL_CONTAINER_ID}
     >
-      <ActionView
-        cancelText={
-          unlocked
-            ? strings('reveal_credential.done')
-            : strings('reveal_credential.cancel')
-        }
-        confirmText={strings('reveal_credential.confirm')}
-        onCancelPress={unlocked ? done : cancelReveal}
-        onConfirmPress={() => tryUnlock()}
-        showConfirmButton={!unlocked}
-        confirmDisabled={!passwordRequirementsMet(password)}
-        cancelTestID={
-          RevealSeedViewSelectorsIDs.SECRET_RECOVERY_PHRASE_CANCEL_BUTTON_ID
-        }
-        confirmTestID={
-          RevealSeedViewSelectorsIDs.SECRET_RECOVERY_PHRASE_NEXT_BUTTON_ID
-        }
-        scrollViewTestID={
-          RevealSeedViewSelectorsIDs.REVEAL_CREDENTIAL_SCROLL_ID
-        }
-        // The cancel button here is not named correctly. When it is unlocked, the button is shown as "Done"
-        showCancelButton={Boolean(showCancelButton || unlocked)}
-        enableOnAndroid
-        enableAutomaticScroll
-        extraScrollHeight={40}
-        showsVerticalScrollIndicator={false}
-      >
-        <View>
-          {/* @ts-expect-error - React Native style type mismatch due to outdated @types/react-native See: https://github.com/MetaMask/metamask-mobile/pull/18956#discussion_r2316407382 */}
-          <View style={[styles.rowWrapper, styles.normalText]}>
-            <>
-              {renderSRPExplanation()}
-              {renderWarning()}
-            </>
-          </View>
-          {unlocked ? (
-            renderTabView()
-          ) : (
-            <View style={styles.rowWrapper}>{renderPasswordEntry()}</View>
-          )}
-        </View>
-      </ActionView>
-      {renderModal()}
-
+      <HeaderCompactStandard
+        title={strings('reveal_credential.seed_phrase_title')}
+        onBack={headerNavigationBack}
+        backButtonProps={{
+          testID: RevealSeedViewSelectorsIDs.REVEAL_CREDENTIAL_BACK_BUTTON_ID,
+        }}
+        includesTopInset
+      />
+      {renderContent()}
       <ScreenshotDeterrent
         enabled={unlocked}
         isSRP
diff --git a/app/components/Views/RevealPrivateCredential/RevealPrivateCredential.types.ts b/app/components/Views/RevealPrivateCredential/RevealPrivateCredential.types.ts
index 60fd0fdbab6d..aca777dfd3f3 100644
--- a/app/components/Views/RevealPrivateCredential/RevealPrivateCredential.types.ts
+++ b/app/components/Views/RevealPrivateCredential/RevealPrivateCredential.types.ts
@@ -9,6 +9,13 @@ export interface RevealPrivateCredentialParams {
   shouldUpdateNav?: boolean;
   selectedAccount?: InternalAccount;
   keyringId?: string;
+  /** When true, skip quiz and show password/action view (e.g. when coming from SRPQuiz modal) */
+  skipQuiz?: boolean;
+  /**
+   * When true, Done pops to the first screen in the current stack (e.g. wallet home),
+   * dismissing all overlays (e.g. Accounts sheet, Wallet Details, etc.). Use when returning to home.
+   */
+  popToTopOnDone?: boolean;
 }
 
 /** Reveal SRP credential parameters */
diff --git a/app/components/Views/RevealPrivateCredential/RevealSeedView.testIds.ts b/app/components/Views/RevealPrivateCredential/RevealSeedView.testIds.ts
index 3c78cad9dec4..6f7c1d1e6abf 100644
--- a/app/components/Views/RevealPrivateCredential/RevealSeedView.testIds.ts
+++ b/app/components/Views/RevealPrivateCredential/RevealSeedView.testIds.ts
@@ -1,31 +1,25 @@
 import enContent from '../../../../locales/languages/en.json';
 
 export const RevealSeedViewSelectorsIDs = {
+  REVEAL_CREDENTIAL_BACK_BUTTON_ID: 'reveal-credential-back-button',
   REVEAL_CREDENTIAL_CONTAINER_ID: 'reveal-private-credential-screen',
   REVEAL_CREDENTIAL_SCROLL_ID: 'reveal-credential-scroll',
   PASSWORD_WARNING_ID: 'password-warning',
   REVEAL_CREDENTIAL_COPY_TO_CLIPBOARD_BUTTON:
     'reveal-credential-copy-to-clipboard-button',
-  REVEAL_CREDENTIAL_TEXT: 'private-credential-text',
   SECRET_RECOVERY_PHRASE_CANCEL_BUTTON_ID:
     'reveal-private-credential-cancel-button',
   SECRET_RECOVERY_PHRASE_NEXT_BUTTON_ID:
     'reveal-private-credential-next-button',
   REVEAL_CREDENTIAL_BUTTON_ID: 'reveal-credential-button',
   PASSWORD_INPUT_BOX_ID: 'private-credential-password-text-input',
-  REVEAL_CREDENTIAL_MODAL_ID: 'reveal-credential-modal',
   REVEAL_CREDENTIAL_QR_CODE_IMAGE_ID: `reveal-credential-qr-code-image`,
-  TAB_SCROLL_VIEW: 'tab-scroll-view',
   TAB_SCROLL_VIEW_TEXT: 'tab-scroll-view-text',
   TAB_SCROLL_VIEW_QR_CODE: 'tab-scroll-view-qr-code',
   SEED_PHRASE_WARNING_ID: 'seed-phrase-warning',
 };
 
 export const RevealSeedViewSelectorsText = {
-  REVEAL_CREDENTIAL_SRP_TITLE_TEXT:
-    enContent.reveal_credential.seed_phrase_title,
-  REVEAL_CREDENTIAL_PRIVATE_KEY_TITLE_TEXT:
-    enContent.reveal_credential.private_key_title,
   REVEAL_CREDENTIAL_DONE: enContent.reveal_credential.done,
   REVEAL_CREDENTIAL_QR_CODE_TAB_ID: enContent.reveal_credential.qr_code,
 };
diff --git a/app/components/Views/RevealPrivateCredential/components/PasswordEntry.tsx b/app/components/Views/RevealPrivateCredential/components/PasswordEntry.tsx
new file mode 100644
index 000000000000..5852f054a72c
--- /dev/null
+++ b/app/components/Views/RevealPrivateCredential/components/PasswordEntry.tsx
@@ -0,0 +1,55 @@
+import React from 'react';
+import { ButtonIcon, IconName } from '@metamask/design-system-react-native';
+import Text, {
+  TextVariant,
+} from '../../../../component-library/components/Texts/Text';
+import TextField from '../../../../component-library/components/Form/TextField/TextField';
+import { strings } from '../../../../../locales/i18n';
+import { RevealSeedViewSelectorsIDs } from '../RevealSeedView.testIds';
+import { useTheme } from '../../../../util/theme';
+import { PasswordEntryProps } from '../types';
+
+const PasswordEntry = ({
+  onPasswordChange,
+  onSubmit,
+  warningMessage,
+  showPassword,
+  onToggleShowPassword,
+  styles,
+}: PasswordEntryProps) => {
+  const { colors, themeAppearance } = useTheme();
+
+  return (
+    <>
+      <Text style={styles.enterPassword} variant={TextVariant.BodyMDMedium}>
+        {strings('reveal_credential.enter_password')}
+      </Text>
+      <TextField
+        placeholder={'Password'}
+        placeholderTextColor={colors.text.muted}
+        onChangeText={onPasswordChange}
+        secureTextEntry={!showPassword}
+        autoCapitalize="none"
+        onSubmitEditing={onSubmit}
+        keyboardAppearance={themeAppearance}
+        testID={RevealSeedViewSelectorsIDs.PASSWORD_INPUT_BOX_ID}
+        returnKeyType="done"
+        autoComplete="password"
+        endAccessory={
+          <ButtonIcon
+            iconName={showPassword ? IconName.Eye : IconName.EyeSlash}
+            onPress={onToggleShowPassword}
+          />
+        }
+      />
+      <Text
+        style={styles.warningText}
+        testID={RevealSeedViewSelectorsIDs.PASSWORD_WARNING_ID}
+      >
+        {warningMessage}
+      </Text>
+    </>
+  );
+};
+
+export default PasswordEntry;
diff --git a/app/components/Views/RevealPrivateCredential/components/SRPQuizIntroduction.tsx b/app/components/Views/RevealPrivateCredential/components/SRPQuizIntroduction.tsx
new file mode 100644
index 000000000000..e73d7cd02989
--- /dev/null
+++ b/app/components/Views/RevealPrivateCredential/components/SRPQuizIntroduction.tsx
@@ -0,0 +1,74 @@
+import React from 'react';
+import { Image } from 'react-native';
+import { ButtonSize } from '../../../../component-library/components/Buttons/Button';
+import ButtonPrimary from '../../../../component-library/components/Buttons/Button/variants/ButtonPrimary';
+import ButtonLink from '../../../../component-library/components/Buttons/Button/variants/ButtonLink';
+import Text, {
+  TextColor,
+  TextVariant,
+} from '../../../../component-library/components/Texts/Text';
+import { Box } from '../../../UI/Box/Box';
+import {
+  AlignItems,
+  FlexDirection,
+  JustifyContent,
+} from '../../../UI/Box/box.types';
+import SecurityQuizLockImage from '../../../../images/reveal_srp_intro.png';
+import { strings } from '../../../../../locales/i18n';
+import { ExportCredentialsIds } from '../../MultichainAccounts/AccountDetails/ExportCredentials.testIds';
+import { SrpQuizGetStartedSelectorsIDs } from '../../Quiz/SRPQuiz/SrpQuizModal.testIds';
+import { SRPQuizIntroductionProps } from '../types';
+
+const SRPQuizIntroduction = ({
+  onGetStarted,
+  onLearnMore,
+  styles,
+}: SRPQuizIntroductionProps) => (
+  <Box
+    testID={ExportCredentialsIds.CONTAINER}
+    style={styles.quizContainer}
+    flexDirection={FlexDirection.Column}
+    alignItems={AlignItems.center}
+    justifyContent={JustifyContent.spaceBetween}
+  >
+    <Box
+      flexDirection={FlexDirection.Column}
+      alignItems={AlignItems.center}
+      justifyContent={JustifyContent.center}
+    >
+      <Image
+        source={SecurityQuizLockImage}
+        style={styles.securityQuizLockImage}
+      />
+      <Text
+        variant={TextVariant.BodyMD}
+        color={TextColor.Alternative}
+        style={styles.quizDescription}
+      >
+        {strings('multichain_accounts.reveal_srp.description')}
+      </Text>
+    </Box>
+    <Box
+      flexDirection={FlexDirection.Column}
+      alignItems={AlignItems.center}
+      style={styles.quizButtonContainer}
+      gap={16}
+    >
+      <ButtonPrimary
+        onPress={onGetStarted}
+        size={ButtonSize.Lg}
+        label={strings('multichain_accounts.reveal_srp.get_started')}
+        testID={SrpQuizGetStartedSelectorsIDs.BUTTON}
+        style={styles.button}
+      />
+      <ButtonLink
+        onPress={onLearnMore}
+        label={strings('multichain_accounts.reveal_srp.learn_more')}
+        testID={ExportCredentialsIds.LEARN_MORE_BUTTON}
+        style={styles.button}
+      />
+    </Box>
+  </Box>
+);
+
+export default SRPQuizIntroduction;
diff --git a/app/components/Views/RevealPrivateCredential/components/SRPSecurityQuiz.tsx b/app/components/Views/RevealPrivateCredential/components/SRPSecurityQuiz.tsx
new file mode 100644
index 000000000000..0f9aed1d69f3
--- /dev/null
+++ b/app/components/Views/RevealPrivateCredential/components/SRPSecurityQuiz.tsx
@@ -0,0 +1,238 @@
+import React from 'react';
+import { ButtonSize } from '../../../../component-library/components/Buttons/Button';
+import ButtonPrimary from '../../../../component-library/components/Buttons/Button/variants/ButtonPrimary';
+import ButtonSecondary from '../../../../component-library/components/Buttons/Button/variants/ButtonSecondary';
+import ButtonLink from '../../../../component-library/components/Buttons/Button/variants/ButtonLink';
+import Text, {
+  TextColor,
+  TextVariant,
+} from '../../../../component-library/components/Texts/Text';
+import { Box } from '../../../UI/Box/Box';
+import {
+  AlignItems,
+  FlexDirection,
+  JustifyContent,
+} from '../../../UI/Box/box.types';
+import {
+  Icon,
+  IconColor,
+  IconName,
+  IconSize,
+} from '@metamask/design-system-react-native';
+import { strings } from '../../../../../locales/i18n';
+import { ExportCredentialsIds } from '../../MultichainAccounts/AccountDetails/ExportCredentials.testIds';
+import {
+  SrpSecurityQuestionOneSelectorsIDs,
+  SrpSecurityQuestionTwoSelectorsIDs,
+} from '../../Quiz/SRPQuiz/SrpQuizModal.testIds';
+import { SRPSecurityQuizProps } from '../types';
+
+const SRPSecurityQuiz = ({
+  currentQuestionIndex,
+  questionAnswered,
+  correctAnswer,
+  onAnswerClick,
+  onContinueClick,
+  onLearnMore,
+  styles,
+}: SRPSecurityQuizProps) => {
+  const renderQuestionResult = () => (
+    <Box
+      flexDirection={FlexDirection.Column}
+      alignItems={AlignItems.flexStart}
+      justifyContent={JustifyContent.flexStart}
+      gap={16}
+    >
+      <Box
+        flexDirection={FlexDirection.Row}
+        alignItems={AlignItems.center}
+        justifyContent={JustifyContent.center}
+        gap={8}
+      >
+        <Icon
+          name={correctAnswer ? IconName.Confirmation : IconName.CircleX}
+          size={IconSize.Lg}
+          color={
+            correctAnswer ? IconColor.SuccessDefault : IconColor.ErrorDefault
+          }
+        />
+        <Text
+          variant={TextVariant.HeadingLG}
+          color={correctAnswer ? TextColor.Success : TextColor.Error}
+        >
+          {strings(
+            correctAnswer
+              ? 'srp_security_quiz.correct'
+              : 'srp_security_quiz.incorrect',
+          )}
+        </Text>
+      </Box>
+      {currentQuestionIndex === 1 && (
+        <Box
+          flexDirection={FlexDirection.Column}
+          alignItems={AlignItems.flexStart}
+          justifyContent={JustifyContent.flexStart}
+          gap={16}
+        >
+          <Text variant={TextVariant.HeadingLG} color={TextColor.Default}>
+            {strings(
+              correctAnswer
+                ? 'srp_security_quiz.question_one.right_answer_title'
+                : 'srp_security_quiz.question_one.wrong_answer_title',
+            )}
+          </Text>
+          <Text variant={TextVariant.BodyMD} color={TextColor.Alternative}>
+            {strings(
+              correctAnswer
+                ? 'srp_security_quiz.question_one.right_answer_description'
+                : 'srp_security_quiz.question_one.wrong_answer_description',
+            )}
+          </Text>
+        </Box>
+      )}
+      {currentQuestionIndex === 2 && (
+        <Box
+          flexDirection={FlexDirection.Column}
+          alignItems={AlignItems.flexStart}
+          justifyContent={JustifyContent.flexStart}
+          gap={16}
+        >
+          <Text variant={TextVariant.HeadingLG} color={TextColor.Default}>
+            {strings(
+              correctAnswer
+                ? 'srp_security_quiz.question_two.right_answer_title'
+                : 'srp_security_quiz.question_two.wrong_answer_title',
+            )}
+          </Text>
+          <Text variant={TextVariant.BodyMD} color={TextColor.Alternative}>
+            {strings(
+              correctAnswer
+                ? 'srp_security_quiz.question_two.right_answer_description'
+                : 'srp_security_quiz.question_two.wrong_answer_description',
+            )}
+          </Text>
+        </Box>
+      )}
+    </Box>
+  );
+
+  const renderAnswerButtons = () => (
+    <Box
+      flexDirection={FlexDirection.Column}
+      alignItems={AlignItems.center}
+      style={styles.quizButtonContainer}
+      gap={16}
+    >
+      <ButtonSecondary
+        onPress={() => onAnswerClick(1)}
+        size={ButtonSize.Lg}
+        label={strings(
+          currentQuestionIndex === 1
+            ? 'srp_security_quiz.question_one.wrong_answer'
+            : 'srp_security_quiz.question_two.right_answer',
+        )}
+        testID={
+          currentQuestionIndex === 1
+            ? SrpSecurityQuestionOneSelectorsIDs.WRONG_ANSWER
+            : SrpSecurityQuestionTwoSelectorsIDs.RIGHT_ANSWER
+        }
+        style={styles.button}
+      />
+      <ButtonSecondary
+        onPress={() => onAnswerClick(2)}
+        size={ButtonSize.Lg}
+        label={strings(
+          currentQuestionIndex === 1
+            ? 'srp_security_quiz.question_one.right_answer'
+            : 'srp_security_quiz.question_two.wrong_answer',
+        )}
+        testID={
+          currentQuestionIndex === 1
+            ? SrpSecurityQuestionOneSelectorsIDs.RIGHT_ANSWER
+            : SrpSecurityQuestionTwoSelectorsIDs.WRONG_ANSWER
+        }
+        style={styles.button}
+      />
+      <ButtonLink
+        onPress={onLearnMore}
+        label={strings('multichain_accounts.reveal_srp.learn_more')}
+        testID={ExportCredentialsIds.LEARN_MORE_BUTTON}
+        style={styles.button}
+      />
+    </Box>
+  );
+
+  const renderAnsweredButtons = () => (
+    <Box
+      flexDirection={FlexDirection.Column}
+      style={styles.quizAnsweredContainer}
+      gap={16}
+    >
+      <ButtonPrimary
+        onPress={onContinueClick}
+        size={ButtonSize.Lg}
+        label={strings(
+          correctAnswer
+            ? 'srp_security_quiz.continue'
+            : 'srp_security_quiz.try_again',
+        )}
+        testID={
+          correctAnswer
+            ? currentQuestionIndex === 1
+              ? SrpSecurityQuestionOneSelectorsIDs.RIGHT_CONTINUE
+              : SrpSecurityQuestionTwoSelectorsIDs.RIGHT_CONTINUE
+            : currentQuestionIndex === 1
+              ? SrpSecurityQuestionOneSelectorsIDs.WRONG_ANSWER_TRY_AGAIN_BUTTON
+              : SrpSecurityQuestionTwoSelectorsIDs.WRONG_ANSWER_TRY_AGAIN_BUTTON
+        }
+        style={styles.button}
+      />
+      <ButtonLink
+        onPress={onLearnMore}
+        label={strings('multichain_accounts.reveal_srp.learn_more')}
+        testID={ExportCredentialsIds.LEARN_MORE_BUTTON}
+        style={styles.button}
+      />
+    </Box>
+  );
+
+  return (
+    <Box
+      style={styles.quizQuestionContainer}
+      flexDirection={FlexDirection.Column}
+      alignItems={AlignItems.flexStart}
+      justifyContent={JustifyContent.flexStart}
+    >
+      <Text
+        variant={TextVariant.BodyMD}
+        color={TextColor.Alternative}
+        style={styles.stepIndicatorContainer}
+      >
+        {strings('srp_security_quiz.question_step', {
+          step: currentQuestionIndex,
+          total: 2,
+        })}
+      </Text>
+
+      {questionAnswered && renderQuestionResult()}
+
+      {!questionAnswered && (
+        <Text
+          variant={TextVariant.HeadingLG}
+          color={TextColor.Default}
+          style={styles.quizQuestion}
+        >
+          {strings(
+            currentQuestionIndex === 1
+              ? 'srp_security_quiz.question_one.question'
+              : 'srp_security_quiz.question_two.question',
+          )}
+        </Text>
+      )}
+
+      {!questionAnswered ? renderAnswerButtons() : renderAnsweredButtons()}
+    </Box>
+  );
+};
+
+export default SRPSecurityQuiz;
diff --git a/app/components/Views/RevealPrivateCredential/components/SRPTabView.tsx b/app/components/Views/RevealPrivateCredential/components/SRPTabView.tsx
new file mode 100644
index 000000000000..efe15d918c93
--- /dev/null
+++ b/app/components/Views/RevealPrivateCredential/components/SRPTabView.tsx
@@ -0,0 +1,89 @@
+import React from 'react';
+import { Dimensions, ScrollView, View } from 'react-native';
+import ScrollableTabView from '@tommasini/react-native-scrollable-tab-view';
+import QRCode from 'react-native-qrcode-svg';
+import TabBar from '../../../../component-library/components-temp/TabBar/TabBar';
+import { strings } from '../../../../../locales/i18n';
+import { RevealSeedViewSelectorsIDs } from '../RevealSeedView.testIds';
+import { useTheme } from '../../../../util/theme';
+import logo from '../../../../images/branding/fox.png';
+import SeedPhraseDisplay from './SeedPhraseDisplay';
+import SeedPhraseConcealer from './SeedPhraseConcealer';
+import { SRPTabViewProps } from '../types';
+
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+const CustomTabView = ScrollView as any;
+
+const SRPTabView = ({
+  clipboardPrivateCredential,
+  showSeedPhrase,
+  clipboardEnabled,
+  onRevealSeedPhrase,
+  onCopyToClipboard,
+  onTabChange,
+  styles,
+}: SRPTabViewProps) => {
+  const { colors } = useTheme();
+  const trimmedCredential = clipboardPrivateCredential.trim();
+  const words = trimmedCredential ? trimmedCredential.split(/\s+/) : [];
+  const hasCredential = words.length > 0;
+
+  const renderTabBar = () => <TabBar />;
+
+  return (
+    <View style={styles.tabContainer}>
+      <ScrollableTabView
+        renderTabBar={() => renderTabBar()}
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        onChangeTab={(event: any) => onTabChange(event)}
+        style={styles.tabContentContainer}
+      >
+        <CustomTabView
+          tabLabel={strings(`reveal_credential.text`)}
+          testID={RevealSeedViewSelectorsIDs.TAB_SCROLL_VIEW_TEXT}
+        >
+          <View style={styles.seedPhraseView}>
+            {showSeedPhrase ? (
+              <SeedPhraseDisplay
+                words={words}
+                clipboardEnabled={clipboardEnabled && hasCredential}
+                onCopyToClipboard={onCopyToClipboard}
+                styles={styles}
+                showSeedPhrase={showSeedPhrase}
+              />
+            ) : (
+              <SeedPhraseConcealer
+                onReveal={onRevealSeedPhrase}
+                styles={styles}
+              />
+            )}
+          </View>
+        </CustomTabView>
+        <CustomTabView
+          tabLabel={strings(`reveal_credential.qr_code`)}
+          testID={RevealSeedViewSelectorsIDs.TAB_SCROLL_VIEW_QR_CODE}
+        >
+          <View
+            style={styles.qrCodeWrapper}
+            testID={
+              RevealSeedViewSelectorsIDs.REVEAL_CREDENTIAL_QR_CODE_IMAGE_ID
+            }
+          >
+            {hasCredential ? (
+              <QRCode
+                value={clipboardPrivateCredential}
+                size={Dimensions.get('window').width - 200}
+                logo={logo}
+                logoSize={50}
+                backgroundColor={colors.background.default}
+                color={colors.text.default}
+              />
+            ) : null}
+          </View>
+        </CustomTabView>
+      </ScrollableTabView>
+    </View>
+  );
+};
+
+export default SRPTabView;
diff --git a/app/components/Views/RevealPrivateCredential/components/SeedPhraseConcealer.tsx b/app/components/Views/RevealPrivateCredential/components/SeedPhraseConcealer.tsx
new file mode 100644
index 000000000000..51a5b832686f
--- /dev/null
+++ b/app/components/Views/RevealPrivateCredential/components/SeedPhraseConcealer.tsx
@@ -0,0 +1,59 @@
+import React from 'react';
+import { ImageBackground, TouchableOpacity, View } from 'react-native';
+import {
+  Icon,
+  IconColor,
+  IconName,
+  IconSize,
+} from '@metamask/design-system-react-native';
+import Text, {
+  TextColor,
+  TextVariant,
+} from '../../../../component-library/components/Texts/Text';
+import { strings } from '../../../../../locales/i18n';
+import { RevealSeedViewSelectorsIDs } from '../RevealSeedView.testIds';
+import { AppThemeKey } from '../../../../util/theme/models';
+import { useTheme } from '../../../../util/theme';
+import blurImage from '../../../../images/blur.png';
+import darkBlurImage from '../../../../images/dark-blur.png';
+import { SeedPhraseConcealerProps } from '../types';
+
+const SeedPhraseConcealer = ({
+  onReveal,
+  styles,
+}: SeedPhraseConcealerProps) => {
+  const { themeAppearance } = useTheme();
+
+  return (
+    <View style={styles.seedPhraseConcealerContainer}>
+      <TouchableOpacity
+        onPress={onReveal}
+        style={styles.blurContainer}
+        testID={RevealSeedViewSelectorsIDs.REVEAL_CREDENTIAL_BUTTON_ID}
+      >
+        <ImageBackground
+          source={
+            themeAppearance === AppThemeKey.dark ? darkBlurImage : blurImage
+          }
+          style={styles.blurView}
+          resizeMode="cover"
+        />
+        <View style={styles.seedPhraseConcealer}>
+          <Icon
+            name={IconName.EyeSlash}
+            size={IconSize.Xl}
+            color={IconColor.IconDefault}
+          />
+          <Text variant={TextVariant.BodyMDMedium} color={TextColor.Default}>
+            {strings('manual_backup_step_1.reveal')}
+          </Text>
+          <Text variant={TextVariant.BodySM} color={TextColor.Default}>
+            {strings('manual_backup_step_1.watching')}
+          </Text>
+        </View>
+      </TouchableOpacity>
+    </View>
+  );
+};
+
+export default SeedPhraseConcealer;
diff --git a/app/components/Views/RevealPrivateCredential/components/SeedPhraseDisplay.tsx b/app/components/Views/RevealPrivateCredential/components/SeedPhraseDisplay.tsx
new file mode 100644
index 000000000000..3387ffb90fde
--- /dev/null
+++ b/app/components/Views/RevealPrivateCredential/components/SeedPhraseDisplay.tsx
@@ -0,0 +1,83 @@
+import React from 'react';
+import { FlatList, View } from 'react-native';
+import Button, {
+  ButtonSize,
+  ButtonVariants,
+} from '../../../../component-library/components/Buttons/Button';
+import Text, {
+  TextColor,
+  TextVariant,
+} from '../../../../component-library/components/Texts/Text';
+import { Box } from '../../../UI/Box/Box';
+import {
+  AlignItems,
+  FlexDirection,
+  JustifyContent,
+} from '../../../UI/Box/box.types';
+import { IconName as IconNameLibrary } from '../../../../component-library/components/Icons/Icon';
+import { strings } from '../../../../../locales/i18n';
+import { ManualBackUpStepsSelectorsIDs } from '../../ManualBackupStep1/ManualBackUpSteps.testIds';
+import { RevealSeedViewSelectorsIDs } from '../RevealSeedView.testIds';
+import { SeedPhraseDisplayProps } from '../types';
+
+const SeedPhraseDisplay = ({
+  words,
+  showSeedPhrase,
+  clipboardEnabled,
+  onCopyToClipboard,
+  styles,
+}: SeedPhraseDisplayProps) => (
+  <Box
+    style={styles.seedPhraseListContainer}
+    flexDirection={FlexDirection.Column}
+    alignItems={AlignItems.center}
+    justifyContent={JustifyContent.center}
+    gap={12}
+  >
+    <View style={styles.seedPhraseContainer}>
+      <FlatList
+        data={words}
+        numColumns={3}
+        keyExtractor={(_, index) => index.toString()}
+        renderItem={({ item, index }) => (
+          <View style={[styles.inputContainer]}>
+            <Text variant={TextVariant.BodyMD} color={TextColor.Alternative}>
+              {index + 1}.
+            </Text>
+            <Text
+              variant={TextVariant.BodyMD}
+              color={TextColor.Default}
+              key={index}
+              ellipsizeMode="tail"
+              numberOfLines={1}
+              style={styles.word}
+              testID={`${ManualBackUpStepsSelectorsIDs.WORD_ITEM}-${index}`}
+              adjustsFontSizeToFit
+              allowFontScaling
+              minimumFontScale={0.1}
+              maxFontSizeMultiplier={0}
+            >
+              {item}
+            </Text>
+          </View>
+        )}
+      />
+    </View>
+    {clipboardEnabled ? (
+      <Button
+        label={strings('reveal_credential.copy_to_clipboard')}
+        variant={ButtonVariants.Link}
+        size={ButtonSize.Sm}
+        onPress={onCopyToClipboard}
+        testID={
+          RevealSeedViewSelectorsIDs.REVEAL_CREDENTIAL_COPY_TO_CLIPBOARD_BUTTON
+        }
+        style={styles.clipboardButton}
+        startIconName={IconNameLibrary.Copy}
+        disabled={!showSeedPhrase}
+      />
+    ) : null}
+  </Box>
+);
+
+export default SeedPhraseDisplay;
diff --git a/app/components/Views/RevealPrivateCredential/components/index.ts b/app/components/Views/RevealPrivateCredential/components/index.ts
new file mode 100644
index 000000000000..554703f2294c
--- /dev/null
+++ b/app/components/Views/RevealPrivateCredential/components/index.ts
@@ -0,0 +1,6 @@
+export { default as SRPQuizIntroduction } from './SRPQuizIntroduction';
+export { default as SRPSecurityQuiz } from './SRPSecurityQuiz';
+export { default as SeedPhraseDisplay } from './SeedPhraseDisplay';
+export { default as SeedPhraseConcealer } from './SeedPhraseConcealer';
+export { default as PasswordEntry } from './PasswordEntry';
+export { default as SRPTabView } from './SRPTabView';
diff --git a/app/components/Views/RevealPrivateCredential/hooks/index.ts b/app/components/Views/RevealPrivateCredential/hooks/index.ts
new file mode 100644
index 000000000000..fa44bfd8517d
--- /dev/null
+++ b/app/components/Views/RevealPrivateCredential/hooks/index.ts
@@ -0,0 +1,2 @@
+export { default as useRevealCredential } from './useRevealCredential';
+export { default as useSRPQuiz } from './useSRPQuiz';
diff --git a/app/components/Views/RevealPrivateCredential/hooks/useRevealCredential.ts b/app/components/Views/RevealPrivateCredential/hooks/useRevealCredential.ts
new file mode 100644
index 000000000000..c041ee45c4ae
--- /dev/null
+++ b/app/components/Views/RevealPrivateCredential/hooks/useRevealCredential.ts
@@ -0,0 +1,144 @@
+import { useCallback, useState } from 'react';
+import { useDispatch } from 'react-redux';
+import { store } from '../../../../store';
+import { recordSRPRevealTimestamp } from '../../../../actions/privacy';
+import { WRONG_PASSWORD_ERROR } from '../../../../constants/error';
+import { strings } from '../../../../../locales/i18n';
+import { isHardwareAccount } from '../../../../util/address';
+import useAuthentication from '../../../../core/Authentication/hooks/useAuthentication';
+import { ReauthenticateErrorType } from '../../../../core/Authentication/types';
+import { MetaMetricsEvents } from '../../../../core/Analytics';
+import { useAnalytics } from '../../../../components/hooks/useAnalytics/useAnalytics';
+import {
+  endTrace,
+  trace,
+  TraceName,
+  TraceOperation,
+} from '../../../../util/trace';
+import { getTraceTags } from '../../../../util/sentry/tags';
+
+interface UseRevealCredentialProps {
+  selectedAddress?: string;
+  keyringId?: string;
+}
+
+interface UseRevealCredentialReturn {
+  unlocked: boolean;
+  password: string;
+  warningIncorrectPassword: string;
+  clipboardPrivateCredential: string;
+  setPassword: (password: string) => void;
+  revealCredential: (pswd?: string) => Promise<boolean>;
+  tryUnlock: () => Promise<void>;
+}
+
+const useRevealCredential = ({
+  selectedAddress,
+  keyringId,
+}: UseRevealCredentialProps): UseRevealCredentialReturn => {
+  const [clipboardPrivateCredential, setClipboardPrivateCredential] =
+    useState<string>('');
+  const [unlocked, setUnlocked] = useState<boolean>(false);
+  const [password, setPassword] = useState<string>('');
+  const [warningIncorrectPassword, setWarningIncorrectPassword] =
+    useState<string>('');
+
+  const dispatch = useDispatch();
+  const { reauthenticate, revealSRP } = useAuthentication();
+  const { trackEvent, createEventBuilder } = useAnalytics();
+
+  const revealCredential = useCallback(
+    async (pswd?: string): Promise<boolean> => {
+      const traceName = TraceName.RevealSrp;
+      let passwordToUse = pswd;
+
+      try {
+        if (!passwordToUse) {
+          const { password: verifiedPassword } = await reauthenticate();
+          passwordToUse = verifiedPassword;
+        }
+
+        trace({
+          name: traceName,
+          op: TraceOperation.RevealPrivateCredential,
+          tags: getTraceTags(store.getState()),
+        });
+
+        const privateCredential = await revealSRP(passwordToUse, keyringId);
+
+        if (privateCredential) {
+          setClipboardPrivateCredential(privateCredential);
+          setUnlocked(true);
+
+          endTrace({
+            name: traceName,
+          });
+          return true;
+        }
+        return false;
+        // TODO: Replace "any" with type
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      } catch (e: any) {
+        if (
+          e.message.includes(
+            ReauthenticateErrorType.PASSWORD_NOT_SET_WITH_BIOMETRICS,
+          )
+        ) {
+          return false;
+        }
+        let msg = strings('reveal_credential.warning_incorrect_password');
+        if (selectedAddress && isHardwareAccount(selectedAddress)) {
+          msg = strings('reveal_credential.hardware_error');
+        } else if (
+          e.toString().toLowerCase() !== WRONG_PASSWORD_ERROR.toLowerCase()
+        ) {
+          msg = strings('reveal_credential.unknown_error');
+        }
+
+        setUnlocked(false);
+        setWarningIncorrectPassword(msg);
+        return false;
+      }
+    },
+    [selectedAddress, keyringId, reauthenticate, revealSRP],
+  );
+
+  const tryUnlock = useCallback(async () => {
+    try {
+      await reauthenticate(password);
+    } catch {
+      const msg = strings('reveal_credential.warning_incorrect_password');
+      setWarningIncorrectPassword(msg);
+      return;
+    }
+
+    const currentDate = new Date();
+    dispatch(recordSRPRevealTimestamp(currentDate.toString()));
+    trackEvent(
+      createEventBuilder(MetaMetricsEvents.NEXT_REVEAL_SRP_CTA).build(),
+    );
+    const success = await revealCredential(password);
+    if (success) {
+      setWarningIncorrectPassword('');
+    }
+  }, [
+    password,
+    reauthenticate,
+    dispatch,
+    trackEvent,
+    createEventBuilder,
+    revealCredential,
+  ]);
+
+  return {
+    unlocked,
+    password,
+    warningIncorrectPassword,
+    clipboardPrivateCredential,
+    setPassword,
+    revealCredential,
+    tryUnlock,
+  };
+};
+
+export default useRevealCredential;
diff --git a/app/components/Views/RevealPrivateCredential/hooks/useSRPQuiz.ts b/app/components/Views/RevealPrivateCredential/hooks/useSRPQuiz.ts
new file mode 100644
index 000000000000..e8a5877e2730
--- /dev/null
+++ b/app/components/Views/RevealPrivateCredential/hooks/useSRPQuiz.ts
@@ -0,0 +1,144 @@
+import { useCallback, useEffect, useState } from 'react';
+import { MetaMetricsEvents } from '../../../../core/Analytics';
+import { useAnalytics } from '../../../../components/hooks/useAnalytics/useAnalytics';
+import { RevealSrpStage } from '../types';
+
+interface UseSRPQuizReturn {
+  revealSrpStage: RevealSrpStage;
+  currentQuestionIndex: number;
+  questionAnswered: boolean;
+  correctAnswer: boolean;
+  handleGetStartedClick: () => void;
+  handleQuestionAnswerClick: (buttonIndex: number) => void;
+  handleAnsweredQuestionClick: () => void;
+}
+
+interface UseSRPQuizProps {
+  /** When set, start at this stage (e.g. ActionViewScreen when quiz was completed in modal) */
+  initialStage?: RevealSrpStage;
+}
+
+const useSRPQuiz = (options: UseSRPQuizProps = {}): UseSRPQuizReturn => {
+  const { initialStage } = options;
+  const [revealSrpStage, setRevealSrpStage] = useState<RevealSrpStage>(
+    initialStage ?? RevealSrpStage.Introduction,
+  );
+  const [currentQuestionIndex, setCurrentQuestionIndex] = useState<number>(1);
+  const [questionAnswered, setQuestionAnswered] = useState<boolean>(false);
+  const [correctAnswer, setCorrectAnswer] = useState<boolean>(false);
+
+  const { trackEvent, createEventBuilder } = useAnalytics();
+
+  // Track when introduction screen is shown
+  useEffect(() => {
+    if (revealSrpStage === RevealSrpStage.Introduction) {
+      trackEvent(
+        createEventBuilder(
+          MetaMetricsEvents.SRP_REVEAL_QUIZ_PROMPT_SEEN,
+        ).build(),
+      );
+    }
+  }, [revealSrpStage, trackEvent, createEventBuilder]);
+
+  // Track when questions are shown
+  useEffect(() => {
+    if (revealSrpStage === RevealSrpStage.Quiz && !questionAnswered) {
+      if (currentQuestionIndex === 1) {
+        trackEvent(
+          createEventBuilder(
+            MetaMetricsEvents.SRP_REVEAL_FIRST_QUESTION_SEEN,
+          ).build(),
+        );
+      } else if (currentQuestionIndex === 2) {
+        trackEvent(
+          createEventBuilder(
+            MetaMetricsEvents.SRP_REVEAL_SECOND_QUESTION_SEEN,
+          ).build(),
+        );
+      }
+    }
+  }, [
+    revealSrpStage,
+    currentQuestionIndex,
+    questionAnswered,
+    trackEvent,
+    createEventBuilder,
+  ]);
+
+  const handleGetStartedClick = useCallback(() => {
+    trackEvent(
+      createEventBuilder(MetaMetricsEvents.REVEAL_SRP_INITIATED).build(),
+    );
+    trackEvent(createEventBuilder(MetaMetricsEvents.REVEAL_SRP_CTA).build());
+    trackEvent(
+      createEventBuilder(
+        MetaMetricsEvents.SRP_REVEAL_START_CTA_SELECTED,
+      ).build(),
+    );
+    setRevealSrpStage(RevealSrpStage.Quiz);
+  }, [createEventBuilder, trackEvent]);
+
+  const handleQuestionAnswerClick = useCallback(
+    (buttonIndex: number) => {
+      let isCorrect = false;
+      if (currentQuestionIndex === 1) {
+        isCorrect = buttonIndex === 2;
+        setCorrectAnswer(isCorrect);
+        // Track Q1 answer selection
+        if (isCorrect) {
+          trackEvent(
+            createEventBuilder(
+              MetaMetricsEvents.SRP_REVEAL_FIRST_QUESTION_RIGHT_ASNWER,
+            ).build(),
+          );
+        } else {
+          trackEvent(
+            createEventBuilder(
+              MetaMetricsEvents.SRP_REVEAL_FIRST_QUESTION_WRONG_ANSWER,
+            ).build(),
+          );
+        }
+      } else {
+        isCorrect = buttonIndex === 1;
+        setCorrectAnswer(isCorrect);
+        // Track Q2 answer selection
+        if (isCorrect) {
+          trackEvent(
+            createEventBuilder(
+              MetaMetricsEvents.SRP_REVEAL_SECOND_QUESTION_RIGHT_ASNWER,
+            ).build(),
+          );
+        } else {
+          trackEvent(
+            createEventBuilder(
+              MetaMetricsEvents.SRP_REVEAL_SECOND_QUESTION_WRONG_ANSWER,
+            ).build(),
+          );
+        }
+      }
+      setQuestionAnswered(true);
+    },
+    [currentQuestionIndex, trackEvent, createEventBuilder],
+  );
+
+  const handleAnsweredQuestionClick = useCallback(() => {
+    if (currentQuestionIndex === 1 && correctAnswer) {
+      setCurrentQuestionIndex(2);
+    } else if (currentQuestionIndex === 2 && correctAnswer) {
+      setRevealSrpStage(RevealSrpStage.ActionViewScreen);
+    }
+    setQuestionAnswered(false);
+  }, [currentQuestionIndex, correctAnswer]);
+
+  return {
+    revealSrpStage,
+    currentQuestionIndex,
+    questionAnswered,
+    correctAnswer,
+    handleGetStartedClick,
+    handleQuestionAnswerClick,
+    handleAnsweredQuestionClick,
+  };
+};
+
+export default useSRPQuiz;
diff --git a/app/components/Views/RevealPrivateCredential/styles.ts b/app/components/Views/RevealPrivateCredential/styles.ts
index 4ca7a2132248..b4404a3ca430 100644
--- a/app/components/Views/RevealPrivateCredential/styles.ts
+++ b/app/components/Views/RevealPrivateCredential/styles.ts
@@ -1,14 +1,56 @@
 /* eslint-disable import/prefer-default-export */
 import { Platform, StyleSheet } from 'react-native';
 import { fontStyles } from '../../../styles/common';
-import { Theme } from '../../../util/theme/models';
+import { Colors, Theme } from '../../../util/theme/models';
 
-export const createStyles = (theme: Theme) =>
+export const createStyles = (theme: Theme, colors: Colors) =>
   StyleSheet.create({
     wrapper: {
       backgroundColor: theme.colors.background.default,
       flex: 1,
       paddingBottom: 16,
+      height: '100%',
+    },
+    quizContainer: {
+      flex: 1,
+      justifyContent: 'center',
+      alignItems: 'center',
+      paddingTop: 32,
+      paddingHorizontal: 16,
+      paddingBottom: 24,
+    },
+    stepIndicatorContainer: {
+      marginBottom: 8,
+    },
+    quizButtonContainer: {
+      flex: 1,
+      alignItems: 'flex-end',
+      justifyContent: 'flex-end',
+      width: '100%',
+    },
+    quizAnsweredContainer: {
+      flex: 1,
+      alignItems: 'flex-end',
+      justifyContent: 'flex-end',
+      width: '100%',
+    },
+    quizDescription: {
+      marginTop: 24,
+    },
+    securityQuizLockImage: {
+      height: 184,
+      width: 205,
+    },
+    quizQuestion: {
+      width: '90%',
+      marginBottom: 24,
+    },
+    quizQuestionContainer: {
+      flex: 1,
+      justifyContent: 'center',
+      alignItems: 'center',
+      paddingHorizontal: 16,
+      paddingVertical: 24,
     },
     normalText: {
       color: theme.colors.text.default,
@@ -26,17 +68,15 @@ export const createStyles = (theme: Theme) =>
       ...fontStyles.normal,
     },
     seedPhraseView: {
-      marginTop: 10,
-      alignItems: 'center',
-      borderRadius: 10,
-      borderWidth: 1,
-      borderColor: theme.colors.border.default,
-      marginBottom: 16, // ensure the copy to clipboard is not clipped
+      marginTop: 16,
+      flex: 1,
+      width: '100%',
+      height: '100%',
+      minHeight: 232,
     },
     clipboardButton: {
       alignSelf: 'center',
-      width: '90%',
-      marginVertical: 5,
+      width: '100%',
     },
     revealButton: {
       alignSelf: 'center',
@@ -54,91 +94,92 @@ export const createStyles = (theme: Theme) =>
       marginBottom: Platform.OS === 'android' ? 20 : 0,
     },
     warningWrapper: {
-      backgroundColor: theme.colors.error.muted,
-      padding: 20,
-      borderRadius: 8,
-      borderWidth: 1,
-      borderColor: theme.colors.error.default,
-      marginTop: 16,
-      paddingBottom: 20,
-    },
-    warningRowWrapper: {
-      flexDirection: 'row',
-      flexShrink: 1,
-      alignItems: 'flex-start',
-      width: '100%',
+      fontSize: 14,
+      marginTop: 24,
     },
     warningText: {
       marginTop: 10,
       color: theme.colors.error.default,
       ...fontStyles.normal,
     },
-    input: {
-      borderWidth: 2,
-      borderRadius: 5,
-      borderColor: theme.colors.border.default,
-      padding: 10,
-      color: theme.colors.text.default,
-      ...fontStyles.normal,
-    },
-    icon: {
-      color: theme.colors.error.default,
-      position: 'relative',
-      marginTop: 3,
-    },
-    blueText: {
-      color: theme.colors.primary.default,
-    },
-    link: {
-      top: 2.5,
-    },
-    warningMessageText: {
-      marginLeft: 20,
-      marginRight: 40,
-      ...fontStyles.normal,
-      color: theme.colors.text.default,
-    },
     enterPassword: {
       marginBottom: 4,
       color: theme.colors.text.default,
     },
-    boldText: {
-      color: theme.colors.text.default,
-      ...fontStyles.bold,
-    },
     tabContainer: {
       paddingHorizontal: 16,
     },
-    qrCodeContainer: {
-      padding: 8,
-      backgroundColor: theme.colors.background.default,
-    },
     qrCodeWrapper: {
       alignSelf: 'center',
       justifyContent: 'center',
-      padding: 8,
-      backgroundColor: theme.brandColors.white,
+      marginTop: 16,
+    },
+    button: {
+      width: '100%',
+      textAlign: 'center',
     },
-    tabUnderlineStyle: {
-      height: 2,
-      backgroundColor: theme.colors.primary.default,
+    seedPhraseConcealerContainer: {
+      flex: 1,
+      borderRadius: 8,
     },
-    tabStyle: {
-      paddingBottom: 0,
-      backgroundColor: theme.colors.background.default,
+    seedPhraseConcealer: {
+      alignItems: 'center',
+      borderRadius: 8,
+      paddingHorizontal: 24,
+      paddingVertical: 45,
+      flexDirection: 'column',
+      rowGap: 16,
+      height: '100%',
+      flex: 1,
+      justifyContent: 'center',
+    },
+    blurContainer: {
+      position: 'absolute',
+      top: 0,
+      left: 0,
+      bottom: 0,
+      right: 0,
+      height: '100%',
+      borderRadius: 8,
+      flex: 1,
     },
-    textStyle: {
-      fontSize: 12,
-      letterSpacing: 0.5,
-      fontFamily: fontStyles.bold.fontFamily,
+    blurView: {
+      position: 'absolute',
+      top: 0,
+      left: 0,
+      bottom: 0,
+      right: 0,
+      height: '100%',
+      borderRadius: 8,
+      flex: 1,
+      opacity: 0.5,
     },
-    revealModalText: {
-      marginBottom: 24,
+    seedPhraseContainer: {
+      minHeight: 200,
+      flex: 1,
+      width: '100%',
+      height: '100%',
+    },
+    seedPhraseListContainer: {
+      flex: 1,
+      width: '100%',
+      height: '100%',
     },
-    tabBar: {
-      borderColor: theme.colors.border.muted,
+    word: {
+      flex: 1,
     },
-    stretch: {
+    inputContainer: {
+      flexDirection: 'row',
+      alignItems: 'center',
+      height: 40,
+      borderWidth: 1,
+      borderColor: colors.border.muted,
+      borderRadius: 8,
+      paddingHorizontal: 8,
+      paddingVertical: 4,
+      backgroundColor: colors.background.muted,
       flex: 1,
+      margin: 4,
+      columnGap: 6,
     },
   });
diff --git a/app/components/Views/RevealPrivateCredential/types.ts b/app/components/Views/RevealPrivateCredential/types.ts
new file mode 100644
index 000000000000..26bab8127d72
--- /dev/null
+++ b/app/components/Views/RevealPrivateCredential/types.ts
@@ -0,0 +1,74 @@
+import { RouteProp } from '@react-navigation/native';
+import { createStyles } from './styles';
+import type { RevealPrivateCredentialParams } from './RevealPrivateCredential.types';
+
+export enum RevealSrpStage {
+  Introduction = 'introduction',
+  Quiz = 'quiz',
+  ActionViewScreen = 'actionViewScreen',
+}
+
+export type RevealPrivateCredentialStyleSheet = ReturnType<typeof createStyles>;
+
+/** Route prop for RevealPrivateCredential screen; params come from canonical RevealPrivateCredentialParams. */
+export type RevealPrivateCredentialRouteProp = RouteProp<
+  { RevealPrivateCredential: RevealPrivateCredentialParams },
+  'RevealPrivateCredential'
+>;
+
+export interface IRevealPrivateCredentialProps {
+  /** When omitted or null, e.g. outside NavigationContainer, "Learn more" nav is a no-op. */
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  navigation?: any;
+  cancel: () => void;
+  route: RevealPrivateCredentialRouteProp;
+  showCancelButton?: boolean;
+}
+
+export interface SRPQuizIntroductionProps {
+  onGetStarted: () => void;
+  onLearnMore: () => void;
+  styles: RevealPrivateCredentialStyleSheet;
+}
+
+export interface SRPSecurityQuizProps {
+  currentQuestionIndex: number;
+  questionAnswered: boolean;
+  correctAnswer: boolean;
+  onAnswerClick: (buttonIndex: number) => void;
+  onContinueClick: () => void;
+  onLearnMore: () => void;
+  styles: RevealPrivateCredentialStyleSheet;
+}
+
+export interface SeedPhraseDisplayProps {
+  words: string[];
+  showSeedPhrase: boolean;
+  clipboardEnabled: boolean;
+  onCopyToClipboard: () => void;
+  styles: RevealPrivateCredentialStyleSheet;
+}
+
+export interface SeedPhraseConcealerProps {
+  onReveal: () => void;
+  styles: RevealPrivateCredentialStyleSheet;
+}
+
+export interface PasswordEntryProps {
+  onPasswordChange: (password: string) => void;
+  onSubmit: () => void;
+  warningMessage: string;
+  showPassword: boolean;
+  onToggleShowPassword: () => void;
+  styles: RevealPrivateCredentialStyleSheet;
+}
+
+export interface SRPTabViewProps {
+  clipboardPrivateCredential: string;
+  showSeedPhrase: boolean;
+  clipboardEnabled: boolean;
+  onRevealSeedPhrase: () => void;
+  onCopyToClipboard: () => void;
+  onTabChange: (event: { i: number }) => void;
+  styles: RevealPrivateCredentialStyleSheet;
+}
diff --git a/app/components/Views/Settings/AdvancedSettings/FiatOnTestnetsFriction/__snapshots__/FiatOnTestnetsFriction.test.tsx.snap b/app/components/Views/Settings/AdvancedSettings/FiatOnTestnetsFriction/__snapshots__/FiatOnTestnetsFriction.test.tsx.snap
index c1521659230d..76ebf7a158c5 100644
--- a/app/components/Views/Settings/AdvancedSettings/FiatOnTestnetsFriction/__snapshots__/FiatOnTestnetsFriction.test.tsx.snap
+++ b/app/components/Views/Settings/AdvancedSettings/FiatOnTestnetsFriction/__snapshots__/FiatOnTestnetsFriction.test.tsx.snap
@@ -23,7 +23,7 @@ exports[`Show fiat on testnets friction bottom sheet should render 1`] = `
     style={
       [
         {
-          "backgroundColor": "#3f434a66",
+          "backgroundColor": "#0a0d135c",
           "bottom": 0,
           "left": 0,
           "position": "absolute",
@@ -73,7 +73,7 @@ exports[`Show fiat on testnets friction bottom sheet should render 1`] = `
         [
           {
             "backgroundColor": "#ffffff",
-            "borderColor": "#b7bbc866",
+            "borderColor": "#b4b4b566",
             "borderTopLeftRadius": 24,
             "borderTopRightRadius": 24,
             "borderWidth": 1,
@@ -110,7 +110,7 @@ exports[`Show fiat on testnets friction bottom sheet should render 1`] = `
         <View
           style={
             {
-              "backgroundColor": "#b7bbc866",
+              "backgroundColor": "#b4b4b566",
               "borderRadius": 2,
               "height": 4,
               "width": 40,
@@ -144,7 +144,7 @@ exports[`Show fiat on testnets friction bottom sheet should render 1`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 30,
                 "marginVertical": 2,
@@ -174,7 +174,7 @@ exports[`Show fiat on testnets friction bottom sheet should render 1`] = `
               undefined,
               {
                 "fontFamily": "Geist-Bold",
-                "fontSize": 18,
+                "fontSize": 20,
                 "fontWeight": "700",
                 "letterSpacing": 0,
                 "lineHeight": 24,
@@ -188,7 +188,7 @@ exports[`Show fiat on testnets friction bottom sheet should render 1`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 30,
                 "marginVertical": 2,
@@ -226,7 +226,7 @@ exports[`Show fiat on testnets friction bottom sheet should render 1`] = `
             style={
               [
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 30,
                   "marginVertical": 2,
@@ -268,7 +268,7 @@ exports[`Show fiat on testnets friction bottom sheet should render 1`] = `
             style={
               [
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 30,
                   "marginVertical": 2,
@@ -284,7 +284,7 @@ exports[`Show fiat on testnets friction bottom sheet should render 1`] = `
                 undefined,
                 undefined,
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                 },
                 undefined,
                 undefined,
@@ -330,7 +330,7 @@ exports[`Show fiat on testnets friction bottom sheet should render 1`] = `
               {
                 "alignItems": "center",
                 "alignSelf": "stretch",
-                "backgroundColor": "#3c4d9d0f",
+                "backgroundColor": "#b4b4b528",
                 "borderColor": "transparent",
                 "borderRadius": 12,
                 "borderWidth": 1,
@@ -348,7 +348,7 @@ exports[`Show fiat on testnets friction bottom sheet should render 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Medium",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -370,7 +370,7 @@ exports[`Show fiat on testnets friction bottom sheet should render 1`] = `
               {
                 "alignItems": "center",
                 "alignSelf": "stretch",
-                "backgroundColor": "#121314",
+                "backgroundColor": "#131416",
                 "borderRadius": 12,
                 "flex": 1,
                 "flexDirection": "row",
diff --git a/app/components/Views/Settings/AdvancedSettings/__snapshots__/index.test.tsx.snap b/app/components/Views/Settings/AdvancedSettings/__snapshots__/index.test.tsx.snap
index f5515da2b4b5..2630c4c9aad4 100644
--- a/app/components/Views/Settings/AdvancedSettings/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/Settings/AdvancedSettings/__snapshots__/index.test.tsx.snap
@@ -98,7 +98,7 @@ exports[`AdvancedSettings should render correctly 1`] = `
             style={
               [
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "height": 24,
                   "width": 24,
                 },
@@ -139,7 +139,7 @@ exports[`AdvancedSettings should render correctly 1`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -230,9 +230,9 @@ exports[`AdvancedSettings should render correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Medium",
-                "fontSize": 18,
+                "fontSize": 20,
                 "letterSpacing": 0,
                 "lineHeight": 24,
               }
@@ -244,7 +244,7 @@ exports[`AdvancedSettings should render correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -266,7 +266,7 @@ exports[`AdvancedSettings should render correctly 1`] = `
               {
                 "alignItems": "center",
                 "alignSelf": "stretch",
-                "backgroundColor": "#3c4d9d0f",
+                "backgroundColor": "#b4b4b528",
                 "borderColor": "transparent",
                 "borderRadius": 12,
                 "borderWidth": 1,
@@ -283,7 +283,7 @@ exports[`AdvancedSettings should render correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Medium",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -314,10 +314,10 @@ exports[`AdvancedSettings should render correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "flex": 1,
                   "fontFamily": "Geist-Medium",
-                  "fontSize": 18,
+                  "fontSize": 20,
                   "letterSpacing": 0,
                   "lineHeight": 24,
                 }
@@ -352,7 +352,7 @@ exports[`AdvancedSettings should render correctly 1`] = `
                         "alignSelf": "flex-start",
                       },
                       {
-                        "backgroundColor": "#b7bbc866",
+                        "backgroundColor": "#b4b4b566",
                         "borderRadius": 16,
                       },
                     ],
@@ -360,7 +360,7 @@ exports[`AdvancedSettings should render correctly 1`] = `
                 }
                 testID="dismiss_smart_account_update"
                 thumbTintColor="#ffffff"
-                tintColor="#b7bbc866"
+                tintColor="#b4b4b566"
                 value={false}
               />
             </View>
@@ -369,7 +369,7 @@ exports[`AdvancedSettings should render correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -400,10 +400,10 @@ exports[`AdvancedSettings should render correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "flex": 1,
                   "fontFamily": "Geist-Medium",
-                  "fontSize": 18,
+                  "fontSize": 20,
                   "letterSpacing": 0,
                   "lineHeight": 24,
                 }
@@ -438,7 +438,7 @@ exports[`AdvancedSettings should render correctly 1`] = `
                         "alignSelf": "flex-start",
                       },
                       {
-                        "backgroundColor": "#b7bbc866",
+                        "backgroundColor": "#b4b4b566",
                         "borderRadius": 16,
                       },
                     ],
@@ -446,7 +446,7 @@ exports[`AdvancedSettings should render correctly 1`] = `
                 }
                 testID="smart_transactions_opt_in_switch"
                 thumbTintColor="#ffffff"
-                tintColor="#b7bbc866"
+                tintColor="#b4b4b566"
                 value={true}
               />
             </View>
@@ -455,7 +455,7 @@ exports[`AdvancedSettings should render correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -503,10 +503,10 @@ exports[`AdvancedSettings should render correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "flex": 1,
                   "fontFamily": "Geist-Medium",
-                  "fontSize": 18,
+                  "fontSize": 20,
                   "letterSpacing": 0,
                   "lineHeight": 24,
                 }
@@ -541,14 +541,14 @@ exports[`AdvancedSettings should render correctly 1`] = `
                         "alignSelf": "flex-start",
                       },
                       {
-                        "backgroundColor": "#b7bbc866",
+                        "backgroundColor": "#b4b4b566",
                         "borderRadius": 16,
                       },
                     ],
                   ]
                 }
                 thumbTintColor="#ffffff"
-                tintColor="#b7bbc866"
+                tintColor="#b4b4b566"
                 value={true}
               />
             </View>
@@ -557,7 +557,7 @@ exports[`AdvancedSettings should render correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -588,10 +588,10 @@ exports[`AdvancedSettings should render correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "flex": 1,
                   "fontFamily": "Geist-Medium",
-                  "fontSize": 18,
+                  "fontSize": 20,
                   "letterSpacing": 0,
                   "lineHeight": 24,
                 }
@@ -625,7 +625,7 @@ exports[`AdvancedSettings should render correctly 1`] = `
                         "alignSelf": "flex-start",
                       },
                       {
-                        "backgroundColor": "#b7bbc866",
+                        "backgroundColor": "#b4b4b566",
                         "borderRadius": 16,
                       },
                     ],
@@ -633,7 +633,7 @@ exports[`AdvancedSettings should render correctly 1`] = `
                 }
                 testID="token-detection-toggle"
                 thumbTintColor="#ffffff"
-                tintColor="#b7bbc866"
+                tintColor="#b4b4b566"
                 value={true}
               />
             </View>
@@ -642,7 +642,7 @@ exports[`AdvancedSettings should render correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -673,10 +673,10 @@ exports[`AdvancedSettings should render correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "flex": 1,
                   "fontFamily": "Geist-Medium",
-                  "fontSize": 18,
+                  "fontSize": 20,
                   "letterSpacing": 0,
                   "lineHeight": 24,
                 }
@@ -711,7 +711,7 @@ exports[`AdvancedSettings should render correctly 1`] = `
                         "alignSelf": "flex-start",
                       },
                       {
-                        "backgroundColor": "#b7bbc866",
+                        "backgroundColor": "#b4b4b566",
                         "borderRadius": 16,
                       },
                     ],
@@ -719,7 +719,7 @@ exports[`AdvancedSettings should render correctly 1`] = `
                 }
                 testID="show-fiat-on-testnets"
                 thumbTintColor="#ffffff"
-                tintColor="#b7bbc866"
+                tintColor="#b4b4b566"
                 value={false}
               />
             </View>
@@ -728,7 +728,7 @@ exports[`AdvancedSettings should render correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -751,9 +751,9 @@ exports[`AdvancedSettings should render correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Medium",
-                "fontSize": 18,
+                "fontSize": 20,
                 "letterSpacing": 0,
                 "lineHeight": 24,
               }
@@ -765,7 +765,7 @@ exports[`AdvancedSettings should render correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -787,7 +787,7 @@ exports[`AdvancedSettings should render correctly 1`] = `
               {
                 "alignItems": "center",
                 "alignSelf": "stretch",
-                "backgroundColor": "#3c4d9d0f",
+                "backgroundColor": "#b4b4b528",
                 "borderColor": "transparent",
                 "borderRadius": 12,
                 "borderWidth": 1,
@@ -804,7 +804,7 @@ exports[`AdvancedSettings should render correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Medium",
                   "fontSize": 16,
                   "letterSpacing": 0,
diff --git a/app/components/Views/Settings/AppInformation/__snapshots__/index.test.tsx.snap b/app/components/Views/Settings/AppInformation/__snapshots__/index.test.tsx.snap
index 378006730706..27881f7af5e5 100644
--- a/app/components/Views/Settings/AppInformation/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/Settings/AppInformation/__snapshots__/index.test.tsx.snap
@@ -300,7 +300,7 @@ exports[`AppInformation renders correctly with snapshot 1`] = `
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "height": 24,
                                       "width": 24,
                                     },
@@ -341,7 +341,7 @@ exports[`AppInformation renders correctly with snapshot 1`] = `
                               style={
                                 [
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Bold",
                                     "fontSize": 16,
                                     "fontWeight": 400,
@@ -402,7 +402,7 @@ exports[`AppInformation renders correctly with snapshot 1`] = `
                             <Text
                               style={
                                 {
-                                  "color": "#686e7d",
+                                  "color": "#66676a",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 18,
                                   "marginBottom": 20,
@@ -416,7 +416,7 @@ exports[`AppInformation renders correctly with snapshot 1`] = `
                             <Text
                               style={
                                 {
-                                  "color": "#686e7d",
+                                  "color": "#66676a",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 18,
                                   "marginBottom": 20,
@@ -430,7 +430,7 @@ exports[`AppInformation renders correctly with snapshot 1`] = `
                           <Text
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Regular",
                                 "fontSize": 18,
                                 "marginBottom": 20,
@@ -496,7 +496,7 @@ exports[`AppInformation renders correctly with snapshot 1`] = `
                           <View
                             style={
                               {
-                                "borderBottomColor": "#b7bbc866",
+                                "borderBottomColor": "#b4b4b566",
                                 "borderBottomWidth": 1,
                                 "marginBottom": 20,
                                 "width": "30%",
diff --git a/app/components/Views/Settings/AutoDetectNFTSettings/__snapshots__/index.test.tsx.snap b/app/components/Views/Settings/AutoDetectNFTSettings/__snapshots__/index.test.tsx.snap
index a633abd4197c..46939e59bda7 100644
--- a/app/components/Views/Settings/AutoDetectNFTSettings/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/Settings/AutoDetectNFTSettings/__snapshots__/index.test.tsx.snap
@@ -20,10 +20,10 @@ exports[`AutoDetectNFTSettings render matches snapshot 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "flex": 1,
           "fontFamily": "Geist-Medium",
-          "fontSize": 18,
+          "fontSize": 20,
           "letterSpacing": 0,
           "lineHeight": 24,
         }
@@ -55,7 +55,7 @@ exports[`AutoDetectNFTSettings render matches snapshot 1`] = `
                 "alignSelf": "flex-start",
               },
               {
-                "backgroundColor": "#b7bbc866",
+                "backgroundColor": "#b4b4b566",
                 "borderRadius": 16,
               },
             ],
@@ -63,7 +63,7 @@ exports[`AutoDetectNFTSettings render matches snapshot 1`] = `
         }
         testID="nft-opensea-autodetect-mode-section"
         thumbTintColor="#ffffff"
-        tintColor="#b7bbc866"
+        tintColor="#b4b4b566"
         value={false}
       />
     </View>
@@ -72,7 +72,7 @@ exports[`AutoDetectNFTSettings render matches snapshot 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#686e7d",
+        "color": "#66676a",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
diff --git a/app/components/Views/Settings/AutoDetectNFTSettings/index.test.tsx b/app/components/Views/Settings/AutoDetectNFTSettings/index.test.tsx
index 8c75e86899bb..c6a4e6048951 100644
--- a/app/components/Views/Settings/AutoDetectNFTSettings/index.test.tsx
+++ b/app/components/Views/Settings/AutoDetectNFTSettings/index.test.tsx
@@ -12,6 +12,7 @@ import { backgroundState } from '../../../../util/test/initial-root-state';
 import AutoDetectNFTSettings from './index';
 import { NFT_AUTO_DETECT_MODE_SECTION } from './index.constants';
 import { useAnalytics } from '../../../hooks/useAnalytics/useAnalytics';
+import { createMockUseAnalyticsHook } from '../../../../util/test/analyticsMock';
 
 let mockSetDisplayNftMedia: jest.Mock;
 let mockSetUseNftDetection: jest.Mock;
@@ -47,27 +48,6 @@ jest.mock('../../../hooks/useAnalytics/useAnalytics');
 const mockTrackEvent = jest.fn();
 const mockAddTraitsToUser = jest.fn();
 
-(useAnalytics as jest.MockedFn<typeof useAnalytics>).mockReturnValue({
-  trackEvent: mockTrackEvent,
-  createEventBuilder: jest.fn(() => ({
-    addProperties: jest.fn().mockReturnThis(),
-    addSensitiveProperties: jest.fn().mockReturnThis(),
-    removeProperties: jest.fn().mockReturnThis(),
-    removeSensitiveProperties: jest.fn().mockReturnThis(),
-    setSaveDataRecording: jest.fn().mockReturnThis(),
-    build: jest.fn(),
-  })) as ReturnType<typeof useAnalytics>['createEventBuilder'],
-  enable: jest.fn(),
-  addTraitsToUser: mockAddTraitsToUser,
-  createDataDeletionTask: jest.fn(),
-  checkDataDeleteStatus: jest.fn(),
-  getDeleteRegulationCreationDate: jest.fn(),
-  getDeleteRegulationId: jest.fn(),
-  isDataRecorded: jest.fn(),
-  isEnabled: jest.fn(),
-  getAnalyticsId: jest.fn(),
-});
-
 jest.mock('../../../../util/general', () => ({
   timeoutFetch: jest.fn(),
 }));
@@ -75,6 +55,12 @@ jest.mock('../../../../util/general', () => ({
 describe('AutoDetectNFTSettings', () => {
   beforeEach(() => {
     jest.clearAllMocks();
+    jest.mocked(useAnalytics).mockReturnValue(
+      createMockUseAnalyticsHook({
+        trackEvent: mockTrackEvent,
+        addTraitsToUser: mockAddTraitsToUser,
+      }),
+    );
     (useNavigation as jest.Mock).mockImplementation(() => mockNavigation);
   });
 
diff --git a/app/components/Views/Settings/AutoDetectTokensSettings/__snapshots__/index.test.tsx.snap b/app/components/Views/Settings/AutoDetectTokensSettings/__snapshots__/index.test.tsx.snap
index 1b6266e9586e..b5a666fe196c 100644
--- a/app/components/Views/Settings/AutoDetectTokensSettings/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/Settings/AutoDetectTokensSettings/__snapshots__/index.test.tsx.snap
@@ -20,10 +20,10 @@ exports[`AssetSettings render matches snapshot 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "flex": 1,
           "fontFamily": "Geist-Medium",
-          "fontSize": 18,
+          "fontSize": 20,
           "letterSpacing": 0,
           "lineHeight": 24,
         }
@@ -57,7 +57,7 @@ exports[`AssetSettings render matches snapshot 1`] = `
                 "alignSelf": "flex-start",
               },
               {
-                "backgroundColor": "#b7bbc866",
+                "backgroundColor": "#b4b4b566",
                 "borderRadius": 16,
               },
             ],
@@ -65,7 +65,7 @@ exports[`AssetSettings render matches snapshot 1`] = `
         }
         testID="token-detection-toggle"
         thumbTintColor="#ffffff"
-        tintColor="#b7bbc866"
+        tintColor="#b4b4b566"
         value={true}
       />
     </View>
@@ -74,7 +74,7 @@ exports[`AssetSettings render matches snapshot 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#686e7d",
+        "color": "#66676a",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
diff --git a/app/components/Views/Settings/AutoDetectTokensSettings/index.test.tsx b/app/components/Views/Settings/AutoDetectTokensSettings/index.test.tsx
index ac43f2fd41cc..9396a9b2608e 100644
--- a/app/components/Views/Settings/AutoDetectTokensSettings/index.test.tsx
+++ b/app/components/Views/Settings/AutoDetectTokensSettings/index.test.tsx
@@ -11,6 +11,7 @@ import { backgroundState } from '../../../../util/test/initial-root-state';
 import AssetSettings from '.';
 import { TOKEN_DETECTION_TOGGLE } from './index.constants';
 import { useAnalytics } from '../../../hooks/useAnalytics/useAnalytics';
+import { createMockUseAnalyticsHook } from '../../../../util/test/analyticsMock';
 
 let mockSetUseTokenDetection: jest.Mock;
 
@@ -36,30 +37,14 @@ jest.mock('../../../hooks/useAnalytics/useAnalytics');
 
 const mockAddTraitsToUser = jest.fn();
 
-(useAnalytics as jest.MockedFn<typeof useAnalytics>).mockReturnValue({
-  createEventBuilder: jest.fn(() => ({
-    addProperties: jest.fn().mockReturnThis(),
-    addSensitiveProperties: jest.fn().mockReturnThis(),
-    removeProperties: jest.fn().mockReturnThis(),
-    removeSensitiveProperties: jest.fn().mockReturnThis(),
-    setSaveDataRecording: jest.fn().mockReturnThis(),
-    build: jest.fn(),
-  })) as ReturnType<typeof useAnalytics>['createEventBuilder'],
-  trackEvent: jest.fn(),
-  enable: jest.fn(),
-  addTraitsToUser: mockAddTraitsToUser,
-  createDataDeletionTask: jest.fn(),
-  checkDataDeleteStatus: jest.fn(),
-  getDeleteRegulationCreationDate: jest.fn(),
-  getDeleteRegulationId: jest.fn(),
-  isDataRecorded: jest.fn(),
-  isEnabled: jest.fn(),
-  getAnalyticsId: jest.fn(),
-});
-
 describe('AssetSettings', () => {
   beforeEach(() => {
     jest.clearAllMocks();
+    jest
+      .mocked(useAnalytics)
+      .mockReturnValue(
+        createMockUseAnalyticsHook({ addTraitsToUser: mockAddTraitsToUser }),
+      );
   });
 
   const initialState = {
diff --git a/app/components/Views/Settings/BatchAccountBalanceSettings/__snapshots__/index.test.tsx.snap b/app/components/Views/Settings/BatchAccountBalanceSettings/__snapshots__/index.test.tsx.snap
index a7dcbcf01f5c..8a2cc609af5e 100644
--- a/app/components/Views/Settings/BatchAccountBalanceSettings/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/Settings/BatchAccountBalanceSettings/__snapshots__/index.test.tsx.snap
@@ -21,10 +21,10 @@ exports[`BatchAccountBalanceSettings should render correctly 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "flex": 1,
           "fontFamily": "Geist-Medium",
-          "fontSize": 18,
+          "fontSize": 20,
           "letterSpacing": 0,
           "lineHeight": 24,
         }
@@ -56,7 +56,7 @@ exports[`BatchAccountBalanceSettings should render correctly 1`] = `
                 "alignSelf": "flex-start",
               },
               {
-                "backgroundColor": "#b7bbc866",
+                "backgroundColor": "#b4b4b566",
                 "borderRadius": 16,
               },
             ],
@@ -64,7 +64,7 @@ exports[`BatchAccountBalanceSettings should render correctly 1`] = `
         }
         testID="security-settings-multi-account-balances-switch"
         thumbTintColor="#ffffff"
-        tintColor="#b7bbc866"
+        tintColor="#b4b4b566"
         value={false}
       />
     </View>
@@ -73,7 +73,7 @@ exports[`BatchAccountBalanceSettings should render correctly 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#686e7d",
+        "color": "#66676a",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
diff --git a/app/components/Views/Settings/Contacts/AmbiguousAddressSheet/__snapshots__/AmbiguousAddressSheet.test.tsx.snap b/app/components/Views/Settings/Contacts/AmbiguousAddressSheet/__snapshots__/AmbiguousAddressSheet.test.tsx.snap
index 2fb63035d717..ae6659ef275d 100644
--- a/app/components/Views/Settings/Contacts/AmbiguousAddressSheet/__snapshots__/AmbiguousAddressSheet.test.tsx.snap
+++ b/app/components/Views/Settings/Contacts/AmbiguousAddressSheet/__snapshots__/AmbiguousAddressSheet.test.tsx.snap
@@ -334,7 +334,7 @@ exports[`AmbiguousAddressSheet should render correctly 1`] = `
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -384,7 +384,7 @@ exports[`AmbiguousAddressSheet should render correctly 1`] = `
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -421,7 +421,7 @@ exports[`AmbiguousAddressSheet should render correctly 1`] = `
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -443,7 +443,7 @@ exports[`AmbiguousAddressSheet should render correctly 1`] = `
                               style={
                                 [
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 30,
                                     "marginVertical": 2,
@@ -472,9 +472,9 @@ exports[`AmbiguousAddressSheet should render correctly 1`] = `
                                   undefined,
                                   undefined,
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Bold",
-                                    "fontSize": 18,
+                                    "fontSize": 20,
                                     "fontWeight": "700",
                                     "letterSpacing": 0,
                                     "lineHeight": 24,
@@ -488,7 +488,7 @@ exports[`AmbiguousAddressSheet should render correctly 1`] = `
                               style={
                                 [
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 30,
                                     "marginVertical": 2,
@@ -517,7 +517,7 @@ exports[`AmbiguousAddressSheet should render correctly 1`] = `
                                   undefined,
                                   undefined,
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 16,
                                     "fontWeight": "400",
@@ -531,7 +531,7 @@ exports[`AmbiguousAddressSheet should render correctly 1`] = `
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "fontFamily": "Geist-Regular",
                                       "fontSize": 30,
                                       "marginVertical": 2,
@@ -585,7 +585,7 @@ exports[`AmbiguousAddressSheet should render correctly 1`] = `
                                   {
                                     "alignItems": "center",
                                     "alignSelf": "stretch",
-                                    "backgroundColor": "#121314",
+                                    "backgroundColor": "#131416",
                                     "borderRadius": 12,
                                     "flex": 1,
                                     "flexDirection": "row",
diff --git a/app/components/Views/Settings/Contacts/ContactForm/__snapshots__/index.test.tsx.snap b/app/components/Views/Settings/Contacts/ContactForm/__snapshots__/index.test.tsx.snap
index 887e0532e9a2..b9b9e5151c0e 100644
--- a/app/components/Views/Settings/Contacts/ContactForm/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/Settings/Contacts/ContactForm/__snapshots__/index.test.tsx.snap
@@ -58,7 +58,7 @@ exports[`ContactForm renders correctly 1`] = `
         <Text
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Bold",
               "fontSize": 14,
               "paddingVertical": 12,
@@ -76,16 +76,16 @@ exports[`ContactForm renders correctly 1`] = `
           onChangeText={[Function]}
           onSubmitEditing={[Function]}
           placeholder="Name"
-          placeholderTextColor="#b7bbc8"
+          placeholderTextColor="#babbbe"
           spellCheck={false}
           style={
             [
               {
                 "alignItems": "center",
-                "borderColor": "#b7bbc8",
+                "borderColor": "#949596",
                 "borderRadius": 5,
                 "borderWidth": 2,
-                "color": "#121314",
+                "color": "#131416",
                 "flex": 1,
                 "flexDirection": "row",
                 "fontFamily": "Geist-Regular",
@@ -102,7 +102,7 @@ exports[`ContactForm renders correctly 1`] = `
         <Text
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Bold",
               "fontSize": 14,
               "paddingVertical": 12,
@@ -116,10 +116,10 @@ exports[`ContactForm renders correctly 1`] = `
             [
               {
                 "alignItems": "center",
-                "borderColor": "#b7bbc8",
+                "borderColor": "#949596",
                 "borderRadius": 5,
                 "borderWidth": 2,
-                "color": "#121314",
+                "color": "#131416",
                 "flex": 1,
                 "flexDirection": "row",
                 "fontFamily": "Geist-Regular",
@@ -147,12 +147,12 @@ exports[`ContactForm renders correctly 1`] = `
               onChangeText={[Function]}
               onSubmitEditing={[Function]}
               placeholder="Public address (0x), or ENS"
-              placeholderTextColor="#b7bbc8"
+              placeholderTextColor="#babbbe"
               spellCheck={false}
               style={
                 [
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "padding": 0,
                     "paddingRight": 8,
@@ -202,7 +202,7 @@ exports[`ContactForm renders correctly 1`] = `
         <Text
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Bold",
               "fontSize": 14,
               "paddingVertical": 12,
@@ -216,10 +216,10 @@ exports[`ContactForm renders correctly 1`] = `
             [
               {
                 "alignItems": "center",
-                "borderColor": "#b7bbc8",
+                "borderColor": "#949596",
                 "borderRadius": 5,
                 "borderWidth": 2,
-                "color": "#121314",
+                "color": "#131416",
                 "flex": 1,
                 "flexDirection": "row",
                 "fontFamily": "Geist-Regular",
@@ -247,12 +247,12 @@ exports[`ContactForm renders correctly 1`] = `
               numberOfLines={1}
               onChangeText={[Function]}
               placeholder="Memo"
-              placeholderTextColor="#b7bbc8"
+              placeholderTextColor="#babbbe"
               spellCheck={false}
               style={
                 [
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Regular",
                     "padding": 0,
                     "paddingRight": 8,
@@ -268,7 +268,7 @@ exports[`ContactForm renders correctly 1`] = `
         <Text
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Bold",
               "fontSize": 14,
               "paddingVertical": 12,
@@ -284,7 +284,7 @@ exports[`ContactForm renders correctly 1`] = `
           style={
             [
               {
-                "borderColor": "#b7bbc8",
+                "borderColor": "#949596",
                 "borderRadius": 5,
                 "borderWidth": 2,
                 "flex": 1,
@@ -340,7 +340,7 @@ exports[`ContactForm renders correctly 1`] = `
             <Text
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                 }
               }
             />
@@ -365,7 +365,7 @@ exports[`ContactForm renders correctly 1`] = `
             }
           >
             <SvgMock
-              color="#121314"
+              color="#131416"
               fill="currentColor"
               height={20}
               name="ArrowDown"
diff --git a/app/components/Views/Settings/Contacts/__snapshots__/index.test.tsx.snap b/app/components/Views/Settings/Contacts/__snapshots__/index.test.tsx.snap
index 1d2e143a8d90..e8f612d0b5a1 100644
--- a/app/components/Views/Settings/Contacts/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/Settings/Contacts/__snapshots__/index.test.tsx.snap
@@ -300,7 +300,7 @@ exports[`Contacts renders correctly 1`] = `
                                 style={
                                   [
                                     {
-                                      "color": "#121314",
+                                      "color": "#131416",
                                       "height": 24,
                                       "width": 24,
                                     },
@@ -341,7 +341,7 @@ exports[`Contacts renders correctly 1`] = `
                               style={
                                 [
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Bold",
                                     "fontSize": 16,
                                     "fontWeight": 400,
diff --git a/app/components/Views/Settings/DeveloperOptions/__snapshots__/index.test.tsx.snap b/app/components/Views/Settings/DeveloperOptions/__snapshots__/index.test.tsx.snap
index ff2da8a13f93..6af2c4f0c115 100644
--- a/app/components/Views/Settings/DeveloperOptions/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/Settings/DeveloperOptions/__snapshots__/index.test.tsx.snap
@@ -152,10 +152,10 @@ exports[`DeveloperOptions renders correctly 1`] = `
                       "alignItems": "center",
                       "backgroundColor": "transparent",
                       "borderRadius": 8,
-                      "height": 40,
+                      "height": 32,
                       "justifyContent": "center",
                       "opacity": 1,
-                      "width": 40,
+                      "width": 32,
                     },
                     {
                       "marginHorizontal": 16,
@@ -177,9 +177,9 @@ exports[`DeveloperOptions renders correctly 1`] = `
                   style={
                     [
                       {
-                        "color": "#121314",
-                        "height": 32,
-                        "width": 32,
+                        "color": "#131416",
+                        "height": 24,
+                        "width": 24,
                       },
                       undefined,
                     ]
@@ -215,9 +215,9 @@ exports[`DeveloperOptions renders correctly 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Bold",
-                      "fontSize": 18,
+                      "fontSize": 20,
                       "letterSpacing": 0,
                       "lineHeight": 24,
                     }
@@ -431,7 +431,7 @@ exports[`DeveloperOptions renders correctly 1`] = `
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#121314",
+                              "color": "#131416",
                               "fontFamily": "Geist-Bold",
                               "fontSize": 24,
                               "letterSpacing": 0,
@@ -446,7 +446,7 @@ exports[`DeveloperOptions renders correctly 1`] = `
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#686e7d",
+                              "color": "#66676a",
                               "fontFamily": "Geist-Regular",
                               "fontSize": 16,
                               "letterSpacing": 0,
@@ -468,7 +468,7 @@ exports[`DeveloperOptions renders correctly 1`] = `
                             {
                               "alignItems": "center",
                               "alignSelf": "stretch",
-                              "backgroundColor": "#3c4d9d0f",
+                              "backgroundColor": "#b4b4b528",
                               "borderColor": "transparent",
                               "borderRadius": 12,
                               "borderWidth": 1,
@@ -485,7 +485,7 @@ exports[`DeveloperOptions renders correctly 1`] = `
                             accessibilityRole="text"
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Medium",
                                 "fontSize": 16,
                                 "letterSpacing": 0,
@@ -500,7 +500,7 @@ exports[`DeveloperOptions renders correctly 1`] = `
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#121314",
+                              "color": "#131416",
                               "fontFamily": "Geist-Bold",
                               "fontSize": 24,
                               "letterSpacing": 0,
@@ -515,7 +515,7 @@ exports[`DeveloperOptions renders correctly 1`] = `
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#686e7d",
+                              "color": "#66676a",
                               "fontFamily": "Geist-Regular",
                               "fontSize": 16,
                               "letterSpacing": 0,
@@ -537,7 +537,7 @@ exports[`DeveloperOptions renders correctly 1`] = `
                             {
                               "alignItems": "center",
                               "alignSelf": "stretch",
-                              "backgroundColor": "#3c4d9d0f",
+                              "backgroundColor": "#b4b4b528",
                               "borderColor": "transparent",
                               "borderRadius": 12,
                               "borderWidth": 1,
@@ -554,7 +554,7 @@ exports[`DeveloperOptions renders correctly 1`] = `
                             accessibilityRole="text"
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Medium",
                                 "fontSize": 16,
                                 "letterSpacing": 0,
@@ -577,7 +577,7 @@ exports[`DeveloperOptions renders correctly 1`] = `
                             accessibilityRole="text"
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Bold",
                                 "fontSize": 24,
                                 "letterSpacing": 0,
@@ -602,7 +602,7 @@ exports[`DeveloperOptions renders correctly 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#686e7d",
+                                  "color": "#66676a",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -630,7 +630,7 @@ exports[`DeveloperOptions renders correctly 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#686e7d",
+                                  "color": "#66676a",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -646,7 +646,7 @@ exports[`DeveloperOptions renders correctly 1`] = `
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#121314",
+                              "color": "#131416",
                               "fontFamily": "Geist-Bold",
                               "fontSize": 24,
                               "letterSpacing": 0,
@@ -661,7 +661,7 @@ exports[`DeveloperOptions renders correctly 1`] = `
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#686e7d",
+                              "color": "#66676a",
                               "fontFamily": "Geist-Regular",
                               "fontSize": 16,
                               "letterSpacing": 0,
@@ -683,7 +683,7 @@ exports[`DeveloperOptions renders correctly 1`] = `
                             {
                               "alignItems": "center",
                               "alignSelf": "stretch",
-                              "backgroundColor": "#3c4d9d0f",
+                              "backgroundColor": "#b4b4b528",
                               "borderColor": "transparent",
                               "borderRadius": 12,
                               "borderWidth": 1,
@@ -700,7 +700,7 @@ exports[`DeveloperOptions renders correctly 1`] = `
                             accessibilityRole="text"
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Medium",
                                 "fontSize": 16,
                                 "letterSpacing": 0,
@@ -715,7 +715,7 @@ exports[`DeveloperOptions renders correctly 1`] = `
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#121314",
+                              "color": "#131416",
                               "fontFamily": "Geist-Bold",
                               "fontSize": 24,
                               "letterSpacing": 0,
@@ -730,7 +730,7 @@ exports[`DeveloperOptions renders correctly 1`] = `
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#686e7d",
+                              "color": "#66676a",
                               "fontFamily": "Geist-Regular",
                               "fontSize": 16,
                               "letterSpacing": 0,
@@ -752,7 +752,7 @@ exports[`DeveloperOptions renders correctly 1`] = `
                             {
                               "alignItems": "center",
                               "alignSelf": "stretch",
-                              "backgroundColor": "#3c4d9d0f",
+                              "backgroundColor": "#b4b4b528",
                               "borderColor": "transparent",
                               "borderRadius": 12,
                               "borderWidth": 1,
@@ -769,7 +769,7 @@ exports[`DeveloperOptions renders correctly 1`] = `
                             accessibilityRole="text"
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Medium",
                                 "fontSize": 16,
                                 "letterSpacing": 0,
@@ -784,7 +784,7 @@ exports[`DeveloperOptions renders correctly 1`] = `
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#121314",
+                              "color": "#131416",
                               "fontFamily": "Geist-Bold",
                               "fontSize": 24,
                               "letterSpacing": 0,
@@ -799,7 +799,7 @@ exports[`DeveloperOptions renders correctly 1`] = `
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#686e7d",
+                              "color": "#66676a",
                               "fontFamily": "Geist-Regular",
                               "fontSize": 16,
                               "letterSpacing": 0,
@@ -821,7 +821,7 @@ exports[`DeveloperOptions renders correctly 1`] = `
                             {
                               "alignItems": "center",
                               "alignSelf": "stretch",
-                              "backgroundColor": "#3c4d9d0f",
+                              "backgroundColor": "#b4b4b528",
                               "borderColor": "transparent",
                               "borderRadius": 12,
                               "borderWidth": 1,
@@ -838,7 +838,7 @@ exports[`DeveloperOptions renders correctly 1`] = `
                             accessibilityRole="text"
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Medium",
                                 "fontSize": 16,
                                 "letterSpacing": 0,
@@ -865,7 +865,7 @@ exports[`DeveloperOptions renders correctly 1`] = `
                             accessibilityRole="text"
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Bold",
                                 "fontSize": 24,
                                 "letterSpacing": 0,
@@ -880,7 +880,7 @@ exports[`DeveloperOptions renders correctly 1`] = `
                             accessibilityRole="text"
                             style={
                               {
-                                "color": "#686e7d",
+                                "color": "#66676a",
                                 "fontFamily": "Geist-Regular",
                                 "fontSize": 16,
                                 "letterSpacing": 0,
@@ -902,7 +902,7 @@ exports[`DeveloperOptions renders correctly 1`] = `
                               {
                                 "alignItems": "center",
                                 "alignSelf": "stretch",
-                                "backgroundColor": "#3c4d9d0f",
+                                "backgroundColor": "#b4b4b528",
                                 "borderColor": "transparent",
                                 "borderRadius": 12,
                                 "borderWidth": 1,
@@ -919,7 +919,7 @@ exports[`DeveloperOptions renders correctly 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Medium",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
diff --git a/app/components/Views/Settings/DisplayNFTMediaSettings/__snapshots__/index.test.tsx.snap b/app/components/Views/Settings/DisplayNFTMediaSettings/__snapshots__/index.test.tsx.snap
index 586fdce4213e..c24c1729ce6a 100644
--- a/app/components/Views/Settings/DisplayNFTMediaSettings/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/Settings/DisplayNFTMediaSettings/__snapshots__/index.test.tsx.snap
@@ -20,10 +20,10 @@ exports[`DisplayNFTMediaSettings render matches snapshot 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "flex": 1,
           "fontFamily": "Geist-Medium",
-          "fontSize": 18,
+          "fontSize": 20,
           "letterSpacing": 0,
           "lineHeight": 24,
         }
@@ -55,7 +55,7 @@ exports[`DisplayNFTMediaSettings render matches snapshot 1`] = `
                 "alignSelf": "flex-start",
               },
               {
-                "backgroundColor": "#b7bbc866",
+                "backgroundColor": "#b4b4b566",
                 "borderRadius": 16,
               },
             ],
@@ -63,7 +63,7 @@ exports[`DisplayNFTMediaSettings render matches snapshot 1`] = `
         }
         testID="nft-display-media-mode-section"
         thumbTintColor="#ffffff"
-        tintColor="#b7bbc866"
+        tintColor="#b4b4b566"
         value={false}
       />
     </View>
@@ -72,7 +72,7 @@ exports[`DisplayNFTMediaSettings render matches snapshot 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#686e7d",
+        "color": "#66676a",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
diff --git a/app/components/Views/Settings/DisplayNFTMediaSettings/index.test.tsx b/app/components/Views/Settings/DisplayNFTMediaSettings/index.test.tsx
index c305217eac92..fbfcd2239729 100644
--- a/app/components/Views/Settings/DisplayNFTMediaSettings/index.test.tsx
+++ b/app/components/Views/Settings/DisplayNFTMediaSettings/index.test.tsx
@@ -6,6 +6,7 @@ import { backgroundState } from '../../../../util/test/initial-root-state';
 import DisplayNFTMediaSettings from '.';
 import { NFT_DISPLAY_MEDIA_MODE_SECTION } from './index.constants';
 import { useAnalytics } from '../../../hooks/useAnalytics/useAnalytics';
+import { createMockUseAnalyticsHook } from '../../../../util/test/analyticsMock';
 
 let mockSetDisplayNftMedia: jest.Mock;
 let mockSetUseNftDetection: jest.Mock;
@@ -35,30 +36,14 @@ jest.mock('../../../hooks/useAnalytics/useAnalytics');
 
 const mockAddTraitsToUser = jest.fn();
 
-(useAnalytics as jest.MockedFn<typeof useAnalytics>).mockReturnValue({
-  createEventBuilder: jest.fn(() => ({
-    addProperties: jest.fn().mockReturnThis(),
-    addSensitiveProperties: jest.fn().mockReturnThis(),
-    removeProperties: jest.fn().mockReturnThis(),
-    removeSensitiveProperties: jest.fn().mockReturnThis(),
-    setSaveDataRecording: jest.fn().mockReturnThis(),
-    build: jest.fn(),
-  })) as ReturnType<typeof useAnalytics>['createEventBuilder'],
-  trackEvent: jest.fn(),
-  enable: jest.fn(),
-  addTraitsToUser: mockAddTraitsToUser,
-  createDataDeletionTask: jest.fn(),
-  checkDataDeleteStatus: jest.fn(),
-  getDeleteRegulationCreationDate: jest.fn(),
-  getDeleteRegulationId: jest.fn(),
-  isDataRecorded: jest.fn(),
-  isEnabled: jest.fn(),
-  getAnalyticsId: jest.fn(),
-});
-
 describe('DisplayNFTMediaSettings', () => {
   beforeEach(() => {
     jest.clearAllMocks();
+    jest
+      .mocked(useAnalytics)
+      .mockReturnValue(
+        createMockUseAnalyticsHook({ addTraitsToUser: mockAddTraitsToUser }),
+      );
   });
 
   const initialState = {
diff --git a/app/components/Views/Settings/ExperimentalSettings/ExperimentalSettings.styles.ts b/app/components/Views/Settings/ExperimentalSettings/ExperimentalSettings.styles.ts
index ccb14ecad978..b43f367909df 100644
--- a/app/components/Views/Settings/ExperimentalSettings/ExperimentalSettings.styles.ts
+++ b/app/components/Views/Settings/ExperimentalSettings/ExperimentalSettings.styles.ts
@@ -7,6 +7,9 @@ const createStyles = (colors: Colors) =>
     wrapper: {
       backgroundColor: colors.background.default,
       flex: 1,
+    },
+    content: {
+      flex: 1,
       padding: 16,
       paddingBottom: 48,
     },
diff --git a/app/components/Views/Settings/ExperimentalSettings/ExperimentalView.testIds.ts b/app/components/Views/Settings/ExperimentalSettings/ExperimentalView.testIds.ts
index 568ad52aa4f7..d1456741b01d 100644
--- a/app/components/Views/Settings/ExperimentalSettings/ExperimentalView.testIds.ts
+++ b/app/components/Views/Settings/ExperimentalSettings/ExperimentalView.testIds.ts
@@ -1,3 +1,7 @@
 export const ExperimentalSelectorsIDs = {
   CONTAINER: 'wallet-connect-sessions-screen',
+  EXPERIMENTAL_SETTINGS_HEADER: 'experimental-settings-header',
+  EXPERIMENTAL_SETTINGS_BACK_BUTTON: 'experimental-settings-back-button',
+  WALLET_CONNECT_SESSIONS_HEADER: 'wallet-connect-sessions-header',
+  WALLET_CONNECT_SESSIONS_BACK_BUTTON: 'wallet-connect-sessions-back-button',
 };
diff --git a/app/components/Views/Settings/ExperimentalSettings/__snapshots__/index.test.tsx.snap b/app/components/Views/Settings/ExperimentalSettings/__snapshots__/index.test.tsx.snap
index 4069dfab53c7..e5119942c160 100644
--- a/app/components/Views/Settings/ExperimentalSettings/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/Settings/ExperimentalSettings/__snapshots__/index.test.tsx.snap
@@ -1,105 +1,204 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`ExperimentalSettings should render correctly 1`] = `
-<RCTScrollView
+<RNCSafeAreaView
+  edges={
+    {
+      "bottom": "additive",
+      "left": "off",
+      "right": "off",
+      "top": "off",
+    }
+  }
   style={
     {
       "backgroundColor": "#ffffff",
       "flex": 1,
-      "padding": 16,
-      "paddingBottom": 48,
     }
   }
 >
-  <View>
-    <Text
-      accessibilityRole="text"
-      style={
+  <View
+    style={
+      [
         {
-          "color": "#121314",
-          "fontFamily": "Geist-Medium",
-          "fontSize": 18,
-          "letterSpacing": 0,
-          "lineHeight": 24,
-        }
-      }
-    >
-      WalletConnect sessions
-    </Text>
-    <Text
-      accessibilityRole="text"
-      style={
+          "alignItems": "center",
+          "flexDirection": "row",
+          "gap": 16,
+          "minHeight": 56,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+        },
         {
-          "color": "#686e7d",
-          "fontFamily": "Geist-Regular",
-          "fontSize": 16,
-          "letterSpacing": 0,
-          "lineHeight": 24,
-          "marginTop": 8,
-        }
+          "marginTop": 0,
+        },
+        undefined,
+      ]
+    }
+    testID="experimental-settings-header"
+  >
+    <View>
+      <View
+        onLayout={[Function]}
+      >
+        <View
+          accessibilityState={
+            {
+              "busy": undefined,
+              "checked": undefined,
+              "disabled": false,
+              "expanded": undefined,
+              "selected": undefined,
+            }
+          }
+          accessibilityValue={
+            {
+              "max": undefined,
+              "min": undefined,
+              "now": undefined,
+              "text": undefined,
+            }
+          }
+          accessible={true}
+          collapsable={false}
+          focusable={true}
+          onBlur={[Function]}
+          onClick={[Function]}
+          onFocus={[Function]}
+          onResponderGrant={[Function]}
+          onResponderMove={[Function]}
+          onResponderRelease={[Function]}
+          onResponderTerminate={[Function]}
+          onResponderTerminationRequest={[Function]}
+          onStartShouldSetResponder={[Function]}
+          style={
+            [
+              {
+                "alignItems": "center",
+                "backgroundColor": "transparent",
+                "borderRadius": 8,
+                "height": 32,
+                "justifyContent": "center",
+                "opacity": 1,
+                "width": 32,
+              },
+              undefined,
+              {
+                "transform": [
+                  {
+                    "scale": 1,
+                  },
+                ],
+              },
+            ]
+          }
+          testID="experimental-settings-back-button"
+        >
+          <SvgMock
+            fill="currentColor"
+            name="ArrowLeft"
+            style={
+              [
+                {
+                  "color": "#131416",
+                  "height": 24,
+                  "width": 24,
+                },
+                undefined,
+              ]
+            }
+          />
+        </View>
+      </View>
+    </View>
+    <View
+      style={
+        [
+          {
+            "alignItems": "center",
+            "display": "flex",
+            "flexBasis": "0%",
+            "flexGrow": 1,
+            "flexShrink": 1,
+          },
+          undefined,
+        ]
       }
     >
-      View the list of active WalletConnect sessions.
-    </Text>
-    <TouchableOpacity
-      accessibilityRole="button"
-      accessible={true}
-      activeOpacity={1}
-      onPress={[Function]}
-      onPressIn={[Function]}
-      onPressOut={[Function]}
-      style={
-        {
-          "alignItems": "center",
-          "alignSelf": "stretch",
-          "backgroundColor": "#3c4d9d0f",
-          "borderColor": "transparent",
-          "borderRadius": 12,
-          "borderWidth": 1,
-          "flexDirection": "row",
-          "height": 48,
-          "justifyContent": "center",
-          "marginTop": 16,
-          "overflow": "hidden",
-          "paddingHorizontal": 16,
+      <View
+        style={
+          [
+            {
+              "alignItems": "center",
+              "display": "flex",
+            },
+            undefined,
+          ]
         }
+      >
+        <Text
+          accessibilityRole="text"
+          style={
+            [
+              {
+                "color": "#131416",
+                "fontFamily": "Geist-Bold",
+                "fontSize": 16,
+                "fontWeight": 400,
+                "letterSpacing": 0,
+                "lineHeight": 24,
+              },
+              undefined,
+            ]
+          }
+        >
+          Experimental
+        </Text>
+      </View>
+    </View>
+    <View>
+      <View
+        onLayout={[Function]}
+      />
+    </View>
+  </View>
+  <RCTScrollView
+    style={
+      {
+        "flex": 1,
+        "padding": 16,
+        "paddingBottom": 48,
       }
-    >
+    }
+  >
+    <View>
       <Text
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Medium",
-            "fontSize": 16,
+            "fontSize": 20,
             "letterSpacing": 0,
             "lineHeight": 24,
           }
         }
       >
-        View sessions
+        WalletConnect sessions
       </Text>
-    </TouchableOpacity>
-    <View
-      style={
-        {
-          "marginTop": 16,
-        }
-      }
-    >
       <Text
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
-            "fontFamily": "Geist-Medium",
-            "fontSize": 18,
+            "color": "#66676a",
+            "fontFamily": "Geist-Regular",
+            "fontSize": 16,
             "letterSpacing": 0,
             "lineHeight": 24,
+            "marginTop": 8,
           }
         }
       >
-        Download Performance Metrics
+        View the list of active WalletConnect sessions.
       </Text>
       <TouchableOpacity
         accessibilityRole="button"
@@ -112,24 +211,24 @@ exports[`ExperimentalSettings should render correctly 1`] = `
           {
             "alignItems": "center",
             "alignSelf": "stretch",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
             "flexDirection": "row",
             "height": 48,
             "justifyContent": "center",
+            "marginTop": 16,
             "overflow": "hidden",
             "paddingHorizontal": 16,
           }
         }
-        testID="download-performance-metrics-button"
       >
         <Text
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Medium",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -137,10 +236,71 @@ exports[`ExperimentalSettings should render correctly 1`] = `
             }
           }
         >
-          Download Performance Metrics
+          View sessions
         </Text>
       </TouchableOpacity>
+      <View
+        style={
+          {
+            "marginTop": 16,
+          }
+        }
+      >
+        <Text
+          accessibilityRole="text"
+          style={
+            {
+              "color": "#131416",
+              "fontFamily": "Geist-Medium",
+              "fontSize": 20,
+              "letterSpacing": 0,
+              "lineHeight": 24,
+            }
+          }
+        >
+          Download Performance Metrics
+        </Text>
+        <TouchableOpacity
+          accessibilityRole="button"
+          accessible={true}
+          activeOpacity={1}
+          onPress={[Function]}
+          onPressIn={[Function]}
+          onPressOut={[Function]}
+          style={
+            {
+              "alignItems": "center",
+              "alignSelf": "stretch",
+              "backgroundColor": "#b4b4b528",
+              "borderColor": "transparent",
+              "borderRadius": 12,
+              "borderWidth": 1,
+              "flexDirection": "row",
+              "height": 48,
+              "justifyContent": "center",
+              "overflow": "hidden",
+              "paddingHorizontal": 16,
+            }
+          }
+          testID="download-performance-metrics-button"
+        >
+          <Text
+            accessibilityRole="text"
+            style={
+              {
+                "color": "#131416",
+                "fontFamily": "Geist-Medium",
+                "fontSize": 16,
+                "letterSpacing": 0,
+                "lineHeight": 24,
+              }
+            }
+          >
+            Download Performance Metrics
+          </Text>
+        </TouchableOpacity>
+      </View>
     </View>
-  </View>
-</RCTScrollView>
+  </RCTScrollView>
+</RNCSafeAreaView>
 `;
diff --git a/app/components/Views/Settings/ExperimentalSettings/index.test.tsx b/app/components/Views/Settings/ExperimentalSettings/index.test.tsx
index f734510c4fb6..4e4b00160bd9 100644
--- a/app/components/Views/Settings/ExperimentalSettings/index.test.tsx
+++ b/app/components/Views/Settings/ExperimentalSettings/index.test.tsx
@@ -12,6 +12,8 @@ import {
   getVersion,
   getBuildNumber,
 } from 'react-native-device-info';
+import { ExperimentalSelectorsIDs } from './ExperimentalView.testIds';
+import { strings } from '../../../../../locales/i18n';
 
 // Mock the required dependencies
 jest.mock('react-native-blob-util', () => {
@@ -96,7 +98,7 @@ const initialState = {
 
 const store = mockStore(initialState);
 
-const setOptions = jest.fn();
+const goBack = jest.fn();
 
 describe('ExperimentalSettings', () => {
   beforeEach(() => {
@@ -109,7 +111,7 @@ describe('ExperimentalSettings', () => {
         <ThemeContext.Provider value={mockTheme}>
           <ExperimentalSettings
             navigation={{
-              setOptions,
+              goBack,
             }}
             route={{}}
           />
@@ -119,6 +121,49 @@ describe('ExperimentalSettings', () => {
     expect(wrapper).toMatchSnapshot();
   });
 
+  it('renders inline HeaderCompactStandard with title and back button', () => {
+    const { getByTestId, getByText } = render(
+      <Provider store={store}>
+        <ThemeContext.Provider value={mockTheme}>
+          <ExperimentalSettings
+            navigation={{
+              goBack,
+            }}
+            route={{}}
+          />
+        </ThemeContext.Provider>
+      </Provider>,
+    );
+    expect(
+      getByTestId(ExperimentalSelectorsIDs.EXPERIMENTAL_SETTINGS_HEADER),
+    ).toBeOnTheScreen();
+    expect(
+      getByTestId(ExperimentalSelectorsIDs.EXPERIMENTAL_SETTINGS_BACK_BUTTON),
+    ).toBeOnTheScreen();
+    expect(
+      getByText(strings('app_settings.experimental_title')),
+    ).toBeOnTheScreen();
+  });
+
+  it('calls navigation.goBack when back button is pressed', () => {
+    const { getByTestId } = render(
+      <Provider store={store}>
+        <ThemeContext.Provider value={mockTheme}>
+          <ExperimentalSettings
+            navigation={{
+              goBack,
+            }}
+            route={{}}
+          />
+        </ThemeContext.Provider>
+      </Provider>,
+    );
+    fireEvent.press(
+      getByTestId(ExperimentalSelectorsIDs.EXPERIMENTAL_SETTINGS_BACK_BUTTON),
+    );
+    expect(goBack).toHaveBeenCalledTimes(1);
+  });
+
   describe('downloadPerformanceMetrics', () => {
     it('should download and share performance metrics successfully', async () => {
       // Mock device info responses
@@ -131,7 +176,7 @@ describe('ExperimentalSettings', () => {
           <ThemeContext.Provider value={mockTheme}>
             <ExperimentalSettings
               navigation={{
-                setOptions,
+                goBack,
               }}
               route={{}}
             />
@@ -139,13 +184,11 @@ describe('ExperimentalSettings', () => {
         </Provider>,
       );
 
-      // Find and press the download button using a more specific selector
       const downloadButton = wrapper.getByTestId(
         'download-performance-metrics-button',
       );
       fireEvent.press(downloadButton);
 
-      // Wait for all promises to resolve
       await new Promise(process.nextTick);
 
       // Verify file was written
@@ -182,7 +225,7 @@ describe('ExperimentalSettings', () => {
           <ThemeContext.Provider value={mockTheme}>
             <ExperimentalSettings
               navigation={{
-                setOptions,
+                goBack,
               }}
               route={{}}
             />
@@ -190,22 +233,18 @@ describe('ExperimentalSettings', () => {
         </Provider>,
       );
 
-      // Find and press the download button using a more specific selector
       const downloadButton = wrapper.getByTestId(
         'download-performance-metrics-button',
       );
       fireEvent.press(downloadButton);
 
-      // Wait for all promises to resolve
       await new Promise(process.nextTick);
 
-      // Verify error was logged
       expect(consoleSpy).toHaveBeenCalledWith(
         'Error downloading performance metrics:',
         expect.any(Error),
       );
 
-      // Clean up
       consoleSpy.mockRestore();
     });
   });
diff --git a/app/components/Views/Settings/ExperimentalSettings/index.tsx b/app/components/Views/Settings/ExperimentalSettings/index.tsx
index 3d885af1b8bc..337e8a086cbe 100644
--- a/app/components/Views/Settings/ExperimentalSettings/index.tsx
+++ b/app/components/Views/Settings/ExperimentalSettings/index.tsx
@@ -1,5 +1,6 @@
-import React, { useEffect } from 'react';
+import React, { useCallback } from 'react';
 import { ScrollView, Switch, View } from 'react-native';
+import { SafeAreaView } from 'react-native-safe-area-context';
 
 import { strings } from '../../../../../locales/i18n';
 import { useTheme } from '../../../../util/theme';
@@ -7,7 +8,6 @@ import Text, {
   TextVariant,
   TextColor,
 } from '../../../../component-library/components/Texts/Text';
-import { getNavigationOptionsTitle } from '../../../UI/Navbar';
 import { Props } from './ExperimentalSettings.types';
 import createStyles from './ExperimentalSettings.styles';
 import Button, {
@@ -34,17 +34,18 @@ import {
 } from '../../../../core/redux/slices/card';
 import { selectCardExperimentalSwitch } from '../../../../selectors/featureFlagController/card';
 import { NON_PRODUCTION_ENVIRONMENTS } from '../../../UI/Card/constants';
+import HeaderCompactStandard from '../../../../component-library/components-temp/HeaderCompactStandard';
+import { ExperimentalSelectorsIDs } from './ExperimentalView.testIds';
 
 /**
  * Main view for app Experimental Settings
  */
-const ExperimentalSettings = ({ navigation, route }: Props) => {
+const ExperimentalSettings = ({ navigation }: Props) => {
   const dispatch = useDispatch();
   const performanceMetrics = useSelector(selectPerformanceMetrics);
   const cardExperimentalSwitch = useSelector(selectCardExperimentalSwitch);
   const alwaysShowCardButton = useSelector(selectAlwaysShowCardButton);
   const isDaimoDemo = useSelector(selectIsDaimoDemo);
-  const isFullScreenModal = route?.params?.isFullScreenModal;
 
   const theme = useTheme();
   const { colors } = theme;
@@ -54,21 +55,9 @@ const ExperimentalSettings = ({ navigation, route }: Props) => {
     process.env.METAMASK_ENVIRONMENT ?? '',
   );
 
-  useEffect(
-    () => {
-      navigation.setOptions(
-        getNavigationOptionsTitle(
-          strings('app_settings.experimental_title'),
-          navigation,
-          isFullScreenModal,
-          colors,
-          null,
-        ),
-      );
-    },
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    [colors],
-  );
+  const handleBack = useCallback(() => {
+    navigation.goBack();
+  }, [navigation]);
 
   const goToWalletConnectSessions = () => {
     navigation.navigate(Routes.WALLET.WALLET_CONNECT_SESSIONS_VIEW);
@@ -193,12 +182,23 @@ const ExperimentalSettings = ({ navigation, route }: Props) => {
     </View>
   );
   return (
-    <ScrollView style={styles.wrapper}>
-      {renderWalletConnectSettings()}
-      {cardExperimentalSwitch && renderCardSettings()}
-      {canShowDaimoDemoToggle && renderDaimoDemoSettings()}
-      {isTest && renderPerformanceSettings()}
-    </ScrollView>
+    <SafeAreaView edges={{ bottom: 'additive' }} style={styles.wrapper}>
+      <HeaderCompactStandard
+        title={strings('app_settings.experimental_title')}
+        onBack={handleBack}
+        backButtonProps={{
+          testID: ExperimentalSelectorsIDs.EXPERIMENTAL_SETTINGS_BACK_BUTTON,
+        }}
+        testID={ExperimentalSelectorsIDs.EXPERIMENTAL_SETTINGS_HEADER}
+        includesTopInset
+      />
+      <ScrollView style={styles.content}>
+        {renderWalletConnectSettings()}
+        {cardExperimentalSwitch && renderCardSettings()}
+        {canShowDaimoDemoToggle && renderDaimoDemoSettings()}
+        {isTest && renderPerformanceSettings()}
+      </ScrollView>
+    </SafeAreaView>
   );
 };
 
diff --git a/app/components/Views/Settings/GeneralSettings/__snapshots__/index.test.tsx.snap b/app/components/Views/Settings/GeneralSettings/__snapshots__/index.test.tsx.snap
index 20ef788870f9..495e73254ac7 100644
--- a/app/components/Views/Settings/GeneralSettings/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/Settings/GeneralSettings/__snapshots__/index.test.tsx.snap
@@ -99,7 +99,7 @@ exports[`GeneralSettings should render correctly 1`] = `
             style={
               [
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "height": 24,
                   "width": 24,
                 },
@@ -140,7 +140,7 @@ exports[`GeneralSettings should render correctly 1`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -193,9 +193,9 @@ exports[`GeneralSettings should render correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Medium",
-                "fontSize": 18,
+                "fontSize": 20,
                 "letterSpacing": 0,
                 "lineHeight": 24,
               }
@@ -207,7 +207,7 @@ exports[`GeneralSettings should render correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -228,7 +228,7 @@ exports[`GeneralSettings should render correctly 1`] = `
             <View
               style={
                 {
-                  "borderColor": "#b7bbc8",
+                  "borderColor": "#949596",
                   "borderRadius": 5,
                   "borderWidth": 2,
                 }
@@ -263,7 +263,7 @@ exports[`GeneralSettings should render correctly 1`] = `
                         style={
                           {
                             "alignSelf": "flex-start",
-                            "color": "#121314",
+                            "color": "#131416",
                             "flex": 1,
                             "fontFamily": "Geist-Regular",
                             "fontSize": 14,
@@ -281,7 +281,7 @@ exports[`GeneralSettings should render correctly 1`] = `
                         style={
                           [
                             {
-                              "color": "#121314",
+                              "color": "#131416",
                               "fontSize": 24,
                             },
                             {
@@ -321,9 +321,9 @@ exports[`GeneralSettings should render correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Medium",
-                "fontSize": 18,
+                "fontSize": 20,
                 "letterSpacing": 0,
                 "lineHeight": 24,
               }
@@ -335,7 +335,7 @@ exports[`GeneralSettings should render correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -386,7 +386,7 @@ exports[`GeneralSettings should render correctly 1`] = `
                       {
                         "alignItems": "center",
                         "backgroundColor": "#ffffff",
-                        "borderColor": "#b7bbc8",
+                        "borderColor": "#949596",
                         "borderRadius": 99,
                         "borderWidth": 2,
                         "height": 20,
@@ -406,7 +406,7 @@ exports[`GeneralSettings should render correctly 1`] = `
                       accessibilityRole="text"
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -444,7 +444,7 @@ exports[`GeneralSettings should render correctly 1`] = `
                       {
                         "alignItems": "center",
                         "backgroundColor": "#ffffff",
-                        "borderColor": "#b7bbc8",
+                        "borderColor": "#949596",
                         "borderRadius": 99,
                         "borderWidth": 2,
                         "height": 20,
@@ -464,7 +464,7 @@ exports[`GeneralSettings should render correctly 1`] = `
                       accessibilityRole="text"
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -491,9 +491,9 @@ exports[`GeneralSettings should render correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Medium",
-                "fontSize": 18,
+                "fontSize": 20,
                 "letterSpacing": 0,
                 "lineHeight": 24,
               }
@@ -505,7 +505,7 @@ exports[`GeneralSettings should render correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -526,7 +526,7 @@ exports[`GeneralSettings should render correctly 1`] = `
             <View
               style={
                 {
-                  "borderColor": "#b7bbc8",
+                  "borderColor": "#949596",
                   "borderRadius": 5,
                   "borderWidth": 2,
                 }
@@ -561,7 +561,7 @@ exports[`GeneralSettings should render correctly 1`] = `
                         style={
                           {
                             "alignSelf": "flex-start",
-                            "color": "#121314",
+                            "color": "#131416",
                             "flex": 1,
                             "fontFamily": "Geist-Regular",
                             "fontSize": 14,
@@ -579,7 +579,7 @@ exports[`GeneralSettings should render correctly 1`] = `
                         style={
                           [
                             {
-                              "color": "#121314",
+                              "color": "#131416",
                               "fontSize": 24,
                             },
                             {
@@ -619,9 +619,9 @@ exports[`GeneralSettings should render correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Medium",
-                "fontSize": 18,
+                "fontSize": 20,
                 "letterSpacing": 0,
                 "lineHeight": 24,
               }
@@ -633,7 +633,7 @@ exports[`GeneralSettings should render correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -654,7 +654,7 @@ exports[`GeneralSettings should render correctly 1`] = `
             <View
               style={
                 {
-                  "borderColor": "#b7bbc8",
+                  "borderColor": "#949596",
                   "borderRadius": 5,
                   "borderWidth": 2,
                 }
@@ -689,7 +689,7 @@ exports[`GeneralSettings should render correctly 1`] = `
                         style={
                           {
                             "alignSelf": "flex-start",
-                            "color": "#121314",
+                            "color": "#131416",
                             "flex": 1,
                             "fontFamily": "Geist-Regular",
                             "fontSize": 14,
@@ -707,7 +707,7 @@ exports[`GeneralSettings should render correctly 1`] = `
                         style={
                           [
                             {
-                              "color": "#121314",
+                              "color": "#131416",
                               "fontSize": 24,
                             },
                             {
@@ -755,10 +755,10 @@ exports[`GeneralSettings should render correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "flex": 1,
                   "fontFamily": "Geist-Medium",
-                  "fontSize": 18,
+                  "fontSize": 20,
                   "letterSpacing": 0,
                   "lineHeight": 24,
                 }
@@ -790,14 +790,14 @@ exports[`GeneralSettings should render correctly 1`] = `
                         "alignSelf": "flex-start",
                       },
                       {
-                        "backgroundColor": "#b7bbc866",
+                        "backgroundColor": "#b4b4b566",
                         "borderRadius": 16,
                       },
                     ],
                   ]
                 }
                 thumbTintColor="#ffffff"
-                tintColor="#b7bbc866"
+                tintColor="#b4b4b566"
                 value={false}
               />
             </View>
@@ -806,7 +806,7 @@ exports[`GeneralSettings should render correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -829,9 +829,9 @@ exports[`GeneralSettings should render correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Medium",
-                "fontSize": 18,
+                "fontSize": 20,
                 "letterSpacing": 0,
                 "lineHeight": 24,
               }
@@ -843,7 +843,7 @@ exports[`GeneralSettings should render correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -899,7 +899,7 @@ exports[`GeneralSettings should render correctly 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -942,7 +942,7 @@ exports[`GeneralSettings should render correctly 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -985,7 +985,7 @@ exports[`GeneralSettings should render correctly 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 16,
                       "letterSpacing": 0,
diff --git a/app/components/Views/Settings/IPFSGatewaySettings/__snapshots__/index.test.tsx.snap b/app/components/Views/Settings/IPFSGatewaySettings/__snapshots__/index.test.tsx.snap
index 83787f0915f3..137b1a67ea74 100644
--- a/app/components/Views/Settings/IPFSGatewaySettings/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/Settings/IPFSGatewaySettings/__snapshots__/index.test.tsx.snap
@@ -20,10 +20,10 @@ exports[`IPFSGatewaySettings render matches snapshot 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "flex": 1,
           "fontFamily": "Geist-Medium",
-          "fontSize": 18,
+          "fontSize": 20,
           "letterSpacing": 0,
           "lineHeight": 24,
         }
@@ -55,7 +55,7 @@ exports[`IPFSGatewaySettings render matches snapshot 1`] = `
                 "alignSelf": "flex-start",
               },
               {
-                "backgroundColor": "#b7bbc866",
+                "backgroundColor": "#b4b4b566",
                 "borderRadius": 16,
               },
             ],
@@ -63,7 +63,7 @@ exports[`IPFSGatewaySettings render matches snapshot 1`] = `
         }
         testID="IPFS_GATEWAY_SECTION"
         thumbTintColor="#ffffff"
-        tintColor="#b7bbc866"
+        tintColor="#b4b4b566"
         value={true}
       />
     </View>
@@ -72,7 +72,7 @@ exports[`IPFSGatewaySettings render matches snapshot 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#686e7d",
+        "color": "#66676a",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
@@ -94,7 +94,7 @@ exports[`IPFSGatewaySettings render matches snapshot 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#686e7d",
+          "color": "#66676a",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -108,7 +108,7 @@ exports[`IPFSGatewaySettings render matches snapshot 1`] = `
     <View
       style={
         {
-          "borderColor": "#b7bbc8",
+          "borderColor": "#949596",
           "borderRadius": 5,
           "borderWidth": 2,
           "marginTop": 16,
diff --git a/app/components/Views/Settings/Identity/__snapshots__/BackupAndSyncSettings.test.tsx.snap b/app/components/Views/Settings/Identity/__snapshots__/BackupAndSyncSettings.test.tsx.snap
index 90ceed21a2ec..5686926adf49 100644
--- a/app/components/Views/Settings/Identity/__snapshots__/BackupAndSyncSettings.test.tsx.snap
+++ b/app/components/Views/Settings/Identity/__snapshots__/BackupAndSyncSettings.test.tsx.snap
@@ -102,7 +102,7 @@ exports[`BackupAndSyncSettings renders correctly 1`] = `
             style={
               [
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "height": 24,
                   "width": 24,
                 },
@@ -143,7 +143,7 @@ exports[`BackupAndSyncSettings renders correctly 1`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -196,7 +196,7 @@ exports[`BackupAndSyncSettings renders correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -219,14 +219,14 @@ exports[`BackupAndSyncSettings renders correctly 1`] = `
                   "width": 51,
                 },
                 {
-                  "backgroundColor": "#b7bbc866",
+                  "backgroundColor": "#b4b4b566",
                   "borderRadius": 16,
                 },
               ]
             }
             testID="toggle-backupAndSync"
             thumbTintColor="#ffffff"
-            tintColor="#b7bbc866"
+            tintColor="#b4b4b566"
             value={true}
           />
         </View>
@@ -234,7 +234,7 @@ exports[`BackupAndSyncSettings renders correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -264,7 +264,7 @@ exports[`BackupAndSyncSettings renders correctly 1`] = `
       <View
         style={
           {
-            "borderTopColor": "#858b9a33",
+            "borderTopColor": "#ffffff14",
             "borderTopWidth": 1,
             "marginTop": 8,
             "paddingTop": 16,
@@ -283,7 +283,7 @@ exports[`BackupAndSyncSettings renders correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -297,7 +297,7 @@ exports[`BackupAndSyncSettings renders correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 14,
                 "letterSpacing": 0,
@@ -327,7 +327,7 @@ exports[`BackupAndSyncSettings renders correctly 1`] = `
             }
           >
             <SvgMock
-              color="#121314"
+              color="#131416"
               fill="currentColor"
               height={20}
               name="UserCircle"
@@ -343,7 +343,7 @@ exports[`BackupAndSyncSettings renders correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -368,14 +368,14 @@ exports[`BackupAndSyncSettings renders correctly 1`] = `
                   "width": 51,
                 },
                 {
-                  "backgroundColor": "#b7bbc866",
+                  "backgroundColor": "#b4b4b566",
                   "borderRadius": 16,
                 },
               ]
             }
             testID="toggle-accountSyncing"
             thumbTintColor="#ffffff"
-            tintColor="#b7bbc866"
+            tintColor="#b4b4b566"
             value={true}
           />
         </View>
@@ -398,7 +398,7 @@ exports[`BackupAndSyncSettings renders correctly 1`] = `
             }
           >
             <SvgMock
-              color="#121314"
+              color="#131416"
               fill="currentColor"
               height={20}
               name="Book"
@@ -414,7 +414,7 @@ exports[`BackupAndSyncSettings renders correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -439,14 +439,14 @@ exports[`BackupAndSyncSettings renders correctly 1`] = `
                   "width": 51,
                 },
                 {
-                  "backgroundColor": "#b7bbc866",
+                  "backgroundColor": "#b4b4b566",
                   "borderRadius": 16,
                 },
               ]
             }
             testID="toggle-contactSyncing"
             thumbTintColor="#ffffff"
-            tintColor="#b7bbc866"
+            tintColor="#b4b4b566"
             value={true}
           />
         </View>
diff --git a/app/components/Views/Settings/NetworkDetailsCheckSettings/__snapshots__/index.test.tsx.snap b/app/components/Views/Settings/NetworkDetailsCheckSettings/__snapshots__/index.test.tsx.snap
index d92b0182148f..91b4bb0ce390 100644
--- a/app/components/Views/Settings/NetworkDetailsCheckSettings/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/Settings/NetworkDetailsCheckSettings/__snapshots__/index.test.tsx.snap
@@ -21,10 +21,10 @@ exports[`NetworkDetailsCheckSettings should render correctly 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "flex": 1,
           "fontFamily": "Geist-Medium",
-          "fontSize": 18,
+          "fontSize": 20,
           "letterSpacing": 0,
           "lineHeight": 24,
         }
@@ -56,7 +56,7 @@ exports[`NetworkDetailsCheckSettings should render correctly 1`] = `
                 "alignSelf": "flex-start",
               },
               {
-                "backgroundColor": "#b7bbc866",
+                "backgroundColor": "#b4b4b566",
                 "borderRadius": 16,
               },
             ],
@@ -64,7 +64,7 @@ exports[`NetworkDetailsCheckSettings should render correctly 1`] = `
         }
         testID="display-use-safe-list-validation"
         thumbTintColor="#ffffff"
-        tintColor="#b7bbc866"
+        tintColor="#b4b4b566"
         value={false}
       />
     </View>
@@ -73,7 +73,7 @@ exports[`NetworkDetailsCheckSettings should render correctly 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#686e7d",
+        "color": "#66676a",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
@@ -87,7 +87,7 @@ exports[`NetworkDetailsCheckSettings should render correctly 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Bold",
           "fontSize": 16,
           "letterSpacing": 0,
diff --git a/app/components/Views/Settings/NetworksSettings/NetworkSettings/CustomNetworkView/CustomNetwork.tsx b/app/components/Views/Settings/NetworksSettings/NetworkSettings/CustomNetworkView/CustomNetwork.tsx
index cb4b6829a46f..16aca39e32ba 100644
--- a/app/components/Views/Settings/NetworksSettings/NetworkSettings/CustomNetworkView/CustomNetwork.tsx
+++ b/app/components/Views/Settings/NetworksSettings/NetworkSettings/CustomNetworkView/CustomNetwork.tsx
@@ -27,7 +27,6 @@ import { NetworkConfiguration } from '@metamask/network-controller';
 import { MultichainNetworkConfiguration } from '@metamask/multichain-network-controller';
 import Text, {
   TextVariant,
-  TextColor,
 } from '../../../../../../component-library/components/Texts/Text';
 import Icon, {
   IconSize,
@@ -188,13 +187,17 @@ const CustomNetwork = ({
                   <TagColored
                     color={TagColor.Success}
                     style={styles.noNetworkFeeContainer}
+                    labelProps={{
+                      variant: TextVariant.BodySM,
+                      style: {
+                        textTransform: 'none',
+                        textAlign: 'center',
+                        bottom: 1,
+                        fontWeight: 'normal',
+                      },
+                    }}
                   >
-                    <Text
-                      variant={TextVariant.BodySM}
-                      color={TextColor.Success}
-                    >
-                      {strings('networks.no_network_fee')}
-                    </Text>
+                    {strings('networks.no_network_fee')}
                   </TagColored>
                 ) : null}
               </Box>
diff --git a/app/components/Views/Settings/NetworksSettings/NetworkSettings/CustomNetworkView/CustomNetworkView.styles.ts b/app/components/Views/Settings/NetworksSettings/NetworkSettings/CustomNetworkView/CustomNetworkView.styles.ts
index 74c7340c63b5..d2b9a701893e 100644
--- a/app/components/Views/Settings/NetworksSettings/NetworkSettings/CustomNetworkView/CustomNetworkView.styles.ts
+++ b/app/components/Views/Settings/NetworksSettings/NetworkSettings/CustomNetworkView/CustomNetworkView.styles.ts
@@ -3,8 +3,7 @@ import { StyleSheet } from 'react-native';
 const createStyles = () =>
   StyleSheet.create({
     noNetworkFeeContainer: {
-      alignSelf: 'center',
-      height: 22,
+      alignSelf: 'flex-end',
     },
   });
 
diff --git a/app/components/Views/Settings/NetworksSettings/NetworkSettings/RpcUrlInput.test.tsx b/app/components/Views/Settings/NetworksSettings/NetworkSettings/RpcUrlInput.test.tsx
deleted file mode 100644
index a0c1fbc039d9..000000000000
--- a/app/components/Views/Settings/NetworksSettings/NetworkSettings/RpcUrlInput.test.tsx
+++ /dev/null
@@ -1,92 +0,0 @@
-import React from 'react';
-import { render, userEvent, waitFor } from '@testing-library/react-native';
-import RpcUrlInput from './RpcUrlInput';
-import { strings } from '../../../../../../locales/i18n';
-
-describe('RpcUrlInput', () => {
-  const mockCheckIfNetworkExists = jest.fn();
-  const mockCheckIfRpcUrlExists = jest.fn();
-  const mockOnValidationChange = jest.fn();
-
-  beforeEach(() => {
-    jest.clearAllMocks();
-  });
-
-  it('does not show an error when a valid RPC URL is pasted', async () => {
-    mockCheckIfNetworkExists.mockResolvedValue([]);
-    mockCheckIfRpcUrlExists.mockResolvedValue([]);
-
-    const { getByTestId, queryByText } = render(
-      <RpcUrlInput
-        testID="rpc-url-input"
-        value=""
-        onChangeText={jest.fn()}
-        checkIfNetworkExists={mockCheckIfNetworkExists}
-        checkIfRpcUrlExists={mockCheckIfRpcUrlExists}
-        onValidationChange={mockOnValidationChange}
-      />,
-    );
-
-    const input = getByTestId('rpc-url-input');
-    const validRpcUrl = 'https://mainnet.infura.io/v3/123';
-
-    // Simulate user pasting the URL
-    await userEvent.paste(input, validRpcUrl);
-
-    // Check that the error message is not present
-    await waitFor(() =>
-      expect(
-        queryByText(strings('app_settings.invalid_rpc_url')),
-      ).not.toBeOnTheScreen(),
-    );
-  });
-
-  it.each([
-    {
-      description: 'is invalid',
-      rpcUrl: 'invalid-url',
-      errorMessage: strings('app_settings.invalid_rpc_prefix'),
-      existingNetworks: [],
-      existingRPCs: [],
-    },
-    {
-      description: 'already exists',
-      rpcUrl: 'https://mainnet.infura.io/v3/123',
-      errorMessage: strings('app_settings.url_associated_to_another_chain_id'),
-      existingNetworks: [{ network: 'mainnet' }],
-      existingRPCs: [],
-    },
-    {
-      description: 'is a duplicate',
-      rpcUrl: 'https://mainnet.infura.io/v3/123',
-      errorMessage: strings('app_settings.invalid_rpc_url'),
-      existingNetworks: [],
-      existingRPCs: [{ network: 'mainnet' }],
-    },
-  ])(
-    'shows an error when the RPC URL $description',
-    async ({ rpcUrl, errorMessage, existingNetworks, existingRPCs }) => {
-      mockCheckIfNetworkExists.mockResolvedValue(existingNetworks);
-      mockCheckIfRpcUrlExists.mockResolvedValue(existingRPCs);
-
-      const { getByTestId, findByText } = render(
-        <RpcUrlInput
-          testID="rpc-url-input"
-          value=""
-          onChangeText={jest.fn()}
-          checkIfNetworkExists={mockCheckIfNetworkExists}
-          checkIfRpcUrlExists={mockCheckIfRpcUrlExists}
-          onValidationChange={mockOnValidationChange}
-        />,
-      );
-
-      const input = getByTestId('rpc-url-input');
-
-      // Simulate user pasting the URL
-      await userEvent.paste(input, rpcUrl);
-
-      // Check that the error message is present
-      expect(await findByText(errorMessage)).toBeOnTheScreen();
-    },
-  );
-});
diff --git a/app/components/Views/Settings/NetworksSettings/NetworkSettings/RpcUrlInput.tsx b/app/components/Views/Settings/NetworksSettings/NetworkSettings/RpcUrlInput.tsx
deleted file mode 100644
index 42370733009c..000000000000
--- a/app/components/Views/Settings/NetworksSettings/NetworkSettings/RpcUrlInput.tsx
+++ /dev/null
@@ -1,122 +0,0 @@
-import React, { useState, useCallback, RefObject } from 'react';
-import { View, TextInput, TextInputProps, TextStyle } from 'react-native';
-import URLParse from 'url-parse';
-import { isWebUri } from 'valid-url';
-import { strings } from '../../../../../../locales/i18n';
-import { isPrivateConnection } from '../../../../../util/networks';
-import Text from '../../../../../component-library/components/Texts/Text';
-import { NetworksViewSelectorsIDs } from '../NetworksView.testIds';
-
-type InputProps = Pick<
-  TextInputProps,
-  | 'autoCapitalize'
-  | 'autoCorrect'
-  | 'editable'
-  | 'keyboardAppearance'
-  | 'onBlur'
-  | 'onFocus'
-  | 'onChangeText'
-  | 'onSubmitEditing'
-  | 'placeholder'
-  | 'placeholderTextColor'
-  | 'style'
-  | 'testID'
-  | 'value'
-> & {
-  ref?: RefObject<TextInput>;
-};
-
-interface RpcUrlInputProps extends InputProps {
-  checkIfNetworkExists: (rpcUrl: string) => Promise<unknown[]>;
-  checkIfRpcUrlExists: (rpcUrl: string) => Promise<unknown[]>;
-  onValidationSuccess?: () => void;
-  onValidationChange: (isValid: boolean) => void;
-  warningStyle?: TextStyle;
-}
-
-const RpcUrlInput: React.FC<RpcUrlInputProps> = (props) => {
-  const {
-    checkIfNetworkExists,
-    checkIfRpcUrlExists,
-    onValidationSuccess,
-    onValidationChange,
-    warningStyle,
-    ...inputProps
-  } = props;
-  const { onChangeText } = inputProps ?? {};
-
-  const [warningRpcUrl, setWarningRpcUrl] = useState<string | undefined>(
-    undefined,
-  );
-
-  const validateRpcUrl = useCallback(
-    async (rpcUrl: string) => {
-      const isNetworkExists = await checkIfNetworkExists(rpcUrl);
-      const isRpcExists = await checkIfRpcUrlExists(rpcUrl);
-      if (!isWebUri(rpcUrl)) {
-        const appendedRpc = `http://${rpcUrl}`;
-        if (isWebUri(appendedRpc)) {
-          setWarningRpcUrl(strings('app_settings.invalid_rpc_prefix'));
-        } else {
-          setWarningRpcUrl(strings('app_settings.invalid_rpc_url'));
-        }
-        onValidationChange(false);
-        return false;
-      }
-      if (isRpcExists.length > 0) {
-        setWarningRpcUrl(strings('app_settings.invalid_rpc_url'));
-        onValidationChange(false);
-        return;
-      }
-
-      if (isNetworkExists.length > 0) {
-        setWarningRpcUrl(
-          strings('app_settings.url_associated_to_another_chain_id'),
-        );
-        onValidationChange(false);
-        return;
-      }
-
-      const url = new URLParse(rpcUrl);
-      const privateConnection = isPrivateConnection(url.hostname);
-      if (!privateConnection && url.protocol === 'http:') {
-        setWarningRpcUrl(strings('app_settings.invalid_rpc_prefix'));
-        onValidationChange(false);
-        return false;
-      }
-      setWarningRpcUrl(undefined);
-      if (onValidationSuccess) {
-        onValidationSuccess();
-      }
-      onValidationChange(true);
-      return true;
-    },
-    [
-      checkIfNetworkExists,
-      checkIfRpcUrlExists,
-      onValidationChange,
-      onValidationSuccess,
-    ],
-  );
-
-  const handleRpcUrlChange = useCallback(
-    (url: string) => {
-      onChangeText?.(url);
-      validateRpcUrl(url);
-    },
-    [onChangeText, validateRpcUrl],
-  );
-
-  return (
-    <>
-      <TextInput {...inputProps} onChangeText={handleRpcUrlChange} />
-      {warningRpcUrl && (
-        <View testID={NetworksViewSelectorsIDs.RPC_WARNING_BANNER}>
-          <Text style={warningStyle}>{warningRpcUrl}</Text>
-        </View>
-      )}
-    </>
-  );
-};
-
-export default RpcUrlInput;
diff --git a/app/components/Views/Settings/NetworksSettings/NetworkSettings/__snapshots__/index.test.tsx.snap b/app/components/Views/Settings/NetworksSettings/NetworkSettings/__snapshots__/index.test.tsx.snap
deleted file mode 100644
index 66324fe44313..000000000000
--- a/app/components/Views/Settings/NetworksSettings/NetworkSettings/__snapshots__/index.test.tsx.snap
+++ /dev/null
@@ -1,63 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`NetworkSettings should render correctly 1`] = `
-<ContextProvider
-  value={
-    {
-      "getServerState": undefined,
-      "noopCheck": "once",
-      "stabilityCheck": "once",
-      "store": {
-        "clearActions": [Function],
-        "dispatch": [Function],
-        "getActions": [Function],
-        "getState": [Function],
-        "replaceReducer": [Function],
-        "subscribe": [Function],
-      },
-      "subscription": {
-        "addNestedSub": [Function],
-        "getListeners": [Function],
-        "handleChangeWrapper": [Function],
-        "isSubscribed": [Function],
-        "notifyNestedSubs": [Function],
-        "trySubscribe": [Function],
-        "tryUnsubscribe": [Function],
-      },
-    }
-  }
->
-  <NetworkSettings />
-</ContextProvider>
-`;
-
-exports[`NetworkSettings should render the component correctly 1`] = `
-<ContextProvider
-  value={
-    {
-      "getServerState": undefined,
-      "noopCheck": "once",
-      "stabilityCheck": "once",
-      "store": {
-        "clearActions": [Function],
-        "dispatch": [Function],
-        "getActions": [Function],
-        "getState": [Function],
-        "replaceReducer": [Function],
-        "subscribe": [Function],
-      },
-      "subscription": {
-        "addNestedSub": [Function],
-        "getListeners": [Function],
-        "handleChangeWrapper": [Function],
-        "isSubscribed": [Function],
-        "notifyNestedSubs": [Function],
-        "trySubscribe": [Function],
-        "tryUnsubscribe": [Function],
-      },
-    }
-  }
->
-  <NetworkSettings />
-</ContextProvider>
-`;
diff --git a/app/components/Views/Settings/NetworksSettings/NetworkSettings/index.js b/app/components/Views/Settings/NetworksSettings/NetworkSettings/index.js
deleted file mode 100644
index c218ce9ab905..000000000000
--- a/app/components/Views/Settings/NetworksSettings/NetworkSettings/index.js
+++ /dev/null
@@ -1,2370 +0,0 @@
-/* eslint-disable */
-import PropTypes from 'prop-types';
-import { connect } from 'react-redux';
-import React, { PureComponent } from 'react';
-import { View, TextInput, SafeAreaView, Linking } from 'react-native';
-import isUrl from 'is-url';
-import { getNavigationOptionsTitle } from '../../../../UI/Navbar';
-import { strings } from '../../../../../../locales/i18n';
-import Networks, {
-  isPrivateConnection,
-  getAllNetworks,
-  getIsNetworkOnboarded,
-  isValidNetworkName,
-  getDecimalChainId,
-  isWhitelistedSymbol,
-} from '../../../../../util/networks';
-import { PopularList } from '../../../../../util/networks/customNetworks';
-import Engine from '../../../../../core/Engine';
-import URL from 'url-parse';
-import { KeyboardAwareScrollView } from 'react-native-keyboard-aware-scroll-view';
-import BigNumber from 'bignumber.js';
-import { jsonRpcRequest } from '../../../../../util/jsonRpcRequest';
-import Logger from '../../../../../util/Logger';
-import { isPrefixedFormattedHexString } from '../../../../../util/number';
-import AppConstants from '../../../../../core/AppConstants';
-import ScrollableTabView from '@tommasini/react-native-scrollable-tab-view';
-import TabBar from '../../../../../component-library/components-temp/TabBar/TabBar';
-import InfoModal from '../../../../Base/InfoModal';
-import { PRIVATENETWORK, RPC } from '../../../../../constants/network';
-import { ThemeContext, mockTheme } from '../../../../../util/theme';
-import { showNetworkOnboardingAction } from '../../../../../actions/onboardNetwork';
-import sanitizeUrl, {
-  compareSanitizedUrl,
-} from '../../../../../util/sanitizeUrl';
-import onlyKeepHost from '../../../../../util/onlyKeepHost';
-import { isPublicEndpointUrl } from '../../../../../core/Engine/controllers/network-controller/utils';
-import { themeAppearanceLight } from '../../../../../constants/storage';
-import CustomNetwork from './CustomNetworkView/CustomNetwork';
-import Button, {
-  ButtonVariants,
-  ButtonSize,
-  ButtonWidthTypes,
-} from '../../../../../component-library/components/Buttons/Button';
-import {
-  selectIsAllNetworks,
-  selectNetworkConfigurations,
-  selectProviderConfig,
-} from '../../../../../selectors/networkController';
-import { selectIsRpcFailoverEnabled } from '../../../../../selectors/featureFlagController/walletFramework';
-import { regex } from '../../../../../../app/util/regex';
-import { NetworksViewSelectorsIDs } from '../NetworksView.testIds';
-import {
-  BlockExplorerUrl,
-  isSafeChainId,
-  toHex,
-} from '@metamask/controller-utils';
-import { hexToNumber } from '@metamask/utils';
-import { CustomDefaultNetworkIDs } from '../CustomDefaultNetwork.testIds';
-import { updateIncomingTransactions } from '../../../../../util/transaction-controller';
-import { withAnalyticsAwareness } from '../../../../../components/hooks/useAnalytics/withAnalyticsAwareness';
-import { CHAIN_IDS } from '@metamask/transaction-controller';
-import Routes from '../../../../../constants/navigation/Routes';
-import {
-  selectTokenNetworkFilter,
-  selectUseSafeChainsListValidation,
-} from '../../../../../../app/selectors/preferencesController';
-import withIsOriginalNativeToken from './withIsOriginalNativeToken';
-import { compose } from 'redux';
-import Icon, {
-  IconColor,
-  IconName,
-  IconSize,
-} from '../../../../../component-library/components/Icons/Icon';
-import RpcUrlInput from './RpcUrlInput';
-import Cell, {
-  CellVariant,
-} from '../../../../../component-library/components/Cells/Cell';
-import BottomSheetHeader from '../../../../../component-library/components/BottomSheets/BottomSheetHeader';
-import ButtonLink from '../../../../../component-library/components/Buttons/Button/variants/ButtonLink';
-import ButtonPrimary from '../../../../../component-library/components/Buttons/Button/variants/ButtonPrimary';
-import { RpcEndpointType } from '@metamask/network-controller';
-import { AvatarVariant } from '../../../../../component-library/components/Avatars/Avatar';
-import ReusableModal from '../../../../../components/UI/ReusableModal';
-import { ScrollView } from 'react-native-gesture-handler';
-import Text, {
-  TextVariant,
-} from '../../../../../component-library/components/Texts/Text';
-import { DEFAULT_CELLBASE_AVATAR_TITLE_TEXTVARIANT } from '../../../../../component-library/components/Cells/Cell/foundation/CellBase/CellBase.constants';
-import Tag from '../../../../../component-library/components/Tags/Tag/Tag';
-import { CellComponentSelectorsIDs } from '../../../../../component-library/components/Cells/Cell/CellComponent.testIds';
-import stripProtocol from '../../../../../util/stripProtocol';
-import stripKeyFromInfuraUrl from '../../../../../util/stripKeyFromInfuraUrl';
-import { MetaMetricsEvents } from '../../../../../core/Analytics';
-import {
-  addItemToChainIdList,
-  removeItemFromChainIdList,
-} from '../../../../../util/metrics/MultichainAPI/networkMetricUtils';
-import { NETWORK_TO_NAME_MAP } from '../../../../../core/Engine/constants';
-import { createStyles } from './index.styles';
-
-const formatNetworkRpcUrl = (rpcUrl) => {
-  return stripProtocol(stripKeyFromInfuraUrl(rpcUrl));
-};
-
-const allNetworks = getAllNetworks();
-
-const InfuraKey = process.env.MM_INFURA_PROJECT_ID;
-const infuraProjectId = InfuraKey === 'null' ? '' : InfuraKey;
-
-/**
- * Get block explorer URL as fallback when networkConfiguration doesn't have blockExplorerUrls.
- * Checks PopularList first (by chainId), then falls back to BlockExplorerUrl (by networkType).
- *
- * @param {string} chainId - The chain ID (hex string)
- * @param {string} [networkType] - Optional network type (e.g., 'mainnet', 'linea-mainnet')
- * @returns {string | undefined} The block explorer URL or undefined
- */
-const getDefaultBlockExplorerUrl = (chainId, networkType) => {
-  // First check PopularList by chainId
-  const popularNetwork = PopularList.find(
-    (network) => network.chainId === chainId,
-  );
-  if (popularNetwork?.rpcPrefs?.blockExplorerUrl) {
-    return popularNetwork.rpcPrefs.blockExplorerUrl;
-  }
-
-  // Fall back to BlockExplorerUrl for built-in networks (mainnet, linea, etc.)
-  if (networkType && BlockExplorerUrl[networkType]) {
-    return BlockExplorerUrl[networkType];
-  }
-
-  return undefined;
-};
-
-/**
- * Main view for app configurations
- */
-export class NetworkSettings extends PureComponent {
-  static propTypes = {
-    /**
-     * Network configurations
-     */
-    networkConfigurations: PropTypes.object,
-    /**
-     * Object that represents the navigator
-     */
-    navigation: PropTypes.object,
-    /**
-     * Object that represents the current route info like params passed to it
-     */
-    route: PropTypes.object,
-    /**
-     * handles action for onboarding to a network
-     */
-    showNetworkOnboardingAction: PropTypes.func,
-    /**
-     * returns an array of onboarded networks
-     */
-    networkOnboardedState: PropTypes.object,
-    /**
-     * Checks if adding custom mainnet.
-     */
-    isCustomMainnet: PropTypes.bool,
-    /**
-     * Current network provider configuration
-     */
-    providerConfig: PropTypes.object,
-    /**
-     * Analytics injected by withAnalyticsAwareness HOC
-     */
-    analytics: PropTypes.object,
-
-    /**
-     * Checks if toggle verification is enabled
-     */
-    useSafeChainsListValidation: PropTypes.bool,
-
-    /**
-     * Matched object from third provider
-     */
-    matchedChainNetwork: PropTypes.object,
-
-    /**
-     * Checks if all networks are selected
-     */
-    isAllNetworks: PropTypes.bool,
-
-    /**
-     * Token network filter
-     */
-    tokenNetworkFilter: PropTypes.object,
-
-    /**
-     * Whether or not the RPC failover feature is enabled
-     */
-    isRpcFailoverEnabled: PropTypes.bool,
-  };
-
-  state = {
-    rpcUrl: undefined,
-    failoverRpcUrls: undefined,
-    rpcName: undefined,
-    rpcUrlFrom: undefined,
-    rpcNameForm: '',
-    rpcUrls: [],
-    blockExplorerUrls: [],
-    selectedRpcEndpointIndex: 0,
-    blockExplorerUrl: undefined,
-    blockExplorerUrlForm: undefined,
-    nickname: undefined,
-    chainId: undefined,
-    ticker: undefined,
-    editable: undefined,
-    addMode: false,
-    warningRpcUrl: undefined,
-    warningChainId: undefined,
-    warningSymbol: undefined,
-    validatedRpcURL: true,
-    validatedChainId: true,
-    validatedSymbol: true,
-    initialState: undefined,
-    enableAction: false,
-    inputWidth: { width: '99%' },
-    showPopularNetworkModal: false,
-    popularNetwork: {},
-    showWarningModal: false,
-    showNetworkDetailsModal: false,
-    isNameFieldFocused: false,
-    isSymbolFieldFocused: false,
-    isRpcUrlFieldFocused: false,
-    isChainIdFieldFocused: false,
-    networkList: [],
-    showMultiRpcAddModal: {
-      isVisible: false,
-    },
-    showMultiBlockExplorerAddModal: {
-      isVisible: false,
-    },
-    showAddRpcForm: {
-      isVisible: false,
-    },
-    showAddBlockExplorerForm: {
-      isVisible: false,
-    },
-  };
-
-  inputRpcURL = React.createRef();
-  inputNameRpcURL = React.createRef();
-  inputChainId = React.createRef();
-  inputSymbol = React.createRef();
-  inputBlockExplorerURL = React.createRef();
-
-  getOtherNetworks = () => allNetworks.slice(1);
-
-  templateInfuraRpc = (endpoint) =>
-    endpoint.endsWith('{infuraProjectId}')
-      ? endpoint.replace('{infuraProjectId}', infuraProjectId ?? '')
-      : endpoint;
-
-  updateNavBar = () => {
-    const { navigation, route } = this.props;
-    const isCustomMainnet = route.params?.isCustomMainnet;
-    const colors = this.context.colors || mockTheme.colors;
-    navigation.setOptions(
-      getNavigationOptionsTitle(
-        isCustomMainnet
-          ? strings('app_settings.networks_default_title')
-          : strings('app_settings.networks_title'),
-        navigation,
-        true,
-        colors,
-      ),
-    );
-  };
-
-  componentDidMount = () => {
-    this.updateNavBar();
-    const { route, networkConfigurations } = this.props;
-
-    const networkTypeOrRpcUrl = route.params?.network;
-
-    // if network is main, don't show popular network
-    let blockExplorerUrl,
-      chainId,
-      nickname,
-      ticker,
-      editable,
-      rpcUrl,
-      failoverRpcUrls,
-      rpcUrls,
-      blockExplorerUrls,
-      rpcName,
-      selectedRpcEndpointIndex;
-    // If no navigation param, user clicked on add network
-    if (networkTypeOrRpcUrl) {
-      if (allNetworks.find((net) => networkTypeOrRpcUrl === net)) {
-        const networkInformation = Networks[networkTypeOrRpcUrl];
-        chainId = networkInformation.chainId.toString();
-        const networkConfiguration = networkConfigurations?.[chainId];
-        const defaultRpcEndpoint = networkConfiguration
-          ? networkConfiguration.rpcEndpoints[
-              networkConfiguration.defaultRpcEndpointIndex
-            ]
-          : undefined;
-
-        nickname = networkConfiguration?.name;
-        editable = false;
-        // Use networkTypeOrRpcUrl as the network type for built-in networks (e.g., 'mainnet', 'linea-mainnet')
-        const fallbackExplorerUrl = getDefaultBlockExplorerUrl(
-          chainId,
-          networkTypeOrRpcUrl,
-        );
-        blockExplorerUrl =
-          networkConfiguration?.blockExplorerUrls?.[
-            networkConfiguration.defaultBlockExplorerUrlIndex
-          ] ?? fallbackExplorerUrl;
-        rpcUrl = defaultRpcEndpoint?.url;
-        failoverRpcUrls = defaultRpcEndpoint?.failoverUrls;
-        rpcName = defaultRpcEndpoint
-          ? defaultRpcEndpoint.type === 'infura'
-            ? 'Infura'
-            : defaultRpcEndpoint.name
-          : undefined;
-        rpcUrls = networkConfiguration?.rpcEndpoints;
-        // Use fallback if blockExplorerUrls is undefined/null OR empty array
-        const configBlockExplorerUrls = networkConfiguration?.blockExplorerUrls;
-        if (configBlockExplorerUrls?.length > 0) {
-          blockExplorerUrls = configBlockExplorerUrls;
-        } else {
-          blockExplorerUrls = fallbackExplorerUrl ? [fallbackExplorerUrl] : [];
-        }
-
-        ticker = networkConfiguration?.nativeCurrency;
-      } else {
-        const networkConfiguration = Object.values(networkConfigurations).find(
-          ({ rpcEndpoints, defaultRpcEndpointIndex }) => {
-            const endpoint = rpcEndpoints?.[defaultRpcEndpointIndex];
-            if (!endpoint) return false;
-            return (
-              endpoint.url === networkTypeOrRpcUrl ||
-              endpoint.networkClientId === networkTypeOrRpcUrl
-            );
-          },
-        );
-        const defaultRpcEndpoint = networkConfiguration
-          ? networkConfiguration.rpcEndpoints[
-              networkConfiguration.defaultRpcEndpointIndex
-            ]
-          : undefined;
-        nickname = networkConfiguration?.name;
-        chainId = networkConfiguration?.chainId;
-        // Use networkClientId from the RPC endpoint for built-in networks
-        const networkClientId = defaultRpcEndpoint?.networkClientId;
-        const fallbackExplorerUrl = getDefaultBlockExplorerUrl(
-          chainId,
-          networkClientId,
-        );
-        blockExplorerUrl =
-          networkConfiguration?.blockExplorerUrls?.[
-            networkConfiguration?.defaultBlockExplorerUrlIndex
-          ] ?? fallbackExplorerUrl;
-        ticker = networkConfiguration?.nativeCurrency;
-        editable = true;
-        rpcUrl = defaultRpcEndpoint?.url;
-        failoverRpcUrls = defaultRpcEndpoint?.failoverUrls;
-        rpcUrls = networkConfiguration?.rpcEndpoints;
-        // Use fallback if blockExplorerUrls is undefined/null OR empty array
-        const configBlockExplorerUrls = networkConfiguration?.blockExplorerUrls;
-        if (configBlockExplorerUrls?.length > 0) {
-          blockExplorerUrls = configBlockExplorerUrls;
-        } else {
-          blockExplorerUrls = fallbackExplorerUrl ? [fallbackExplorerUrl] : [];
-        }
-        rpcName = defaultRpcEndpoint
-          ? defaultRpcEndpoint.type === 'infura'
-            ? 'Infura'
-            : defaultRpcEndpoint.name
-          : undefined;
-
-        selectedRpcEndpointIndex =
-          networkConfiguration?.defaultRpcEndpointIndex;
-      }
-
-      const initialState =
-        rpcUrl +
-        failoverRpcUrls +
-        blockExplorerUrl +
-        nickname +
-        chainId +
-        ticker +
-        editable +
-        rpcUrls +
-        blockExplorerUrls;
-      this.setState({
-        rpcUrl,
-        failoverRpcUrls,
-        rpcName,
-        rpcUrls,
-        blockExplorerUrls,
-        selectedRpcEndpointIndex,
-        blockExplorerUrl,
-        nickname,
-        chainId,
-        ticker,
-        editable,
-        initialState,
-      });
-    } else {
-      // No existing network — enter add mode, optionally pre-filling from
-      // route params.
-      const prefill = route.params?.prefill;
-      this.setState(
-        {
-          addMode: true,
-          ...(prefill?.rpcUrl ? { rpcUrl: prefill.rpcUrl } : {}),
-          ...(prefill?.chainId ? { chainId: prefill.chainId } : {}),
-          ...(prefill?.nickname ? { nickname: prefill.nickname } : {}),
-          ...(prefill?.ticker ? { ticker: prefill.ticker } : {}),
-          ...(prefill?.blockExplorerUrl
-            ? { blockExplorerUrl: prefill.blockExplorerUrl }
-            : {}),
-        },
-        async () => {
-          if (prefill) {
-            // Populate the rpcUrls / blockExplorerUrls arrays so that
-            // handleNetworkUpdate has valid rpcEndpoints to save.
-            if (prefill.rpcUrl) {
-              await this.onRpcItemAdd(prefill.rpcUrl, '');
-            }
-            if (prefill.blockExplorerUrl) {
-              await this.onBlockExplorerItemAdd(prefill.blockExplorerUrl);
-            }
-            this.getCurrentState();
-            // Kick off RPC + symbol/name validation so warnings show
-            // before the user taps Save.
-            if (prefill.rpcUrl && prefill.chainId) {
-              this.validateChainId();
-            }
-          }
-        },
-      );
-    }
-
-    setTimeout(() => {
-      this.setState({
-        inputWidth: { width: '100%' },
-      });
-    }, 100);
-  };
-
-  componentDidUpdate = (prevProps) => {
-    this.updateNavBar();
-    if (this.props.matchedChainNetwork !== prevProps.matchedChainNetwork) {
-      this.validateRpcAndChainId();
-    }
-  };
-
-  updateNetworkList = (networkList) => {
-    this.setState({
-      networkList,
-    });
-  };
-
-  isAnyModalVisible = () =>
-    this.state.showMultiRpcAddModal.isVisible ||
-    this.state.showMultiBlockExplorerAddModal.isVisible ||
-    this.state.showAddRpcForm.isVisible ||
-    this.state.showAddBlockExplorerForm.isVisible;
-
-  validateRpcAndChainId = () => {
-    const { rpcUrl, chainId } = this.state;
-
-    if (rpcUrl && chainId) {
-      const chainToMatch = this.props.matchedChainNetwork?.safeChainsList?.find(
-        (network) => network.chainId === parseInt(chainId),
-      );
-
-      // This is a temporary hack to not include POL as a potential scam token while chainlist updates
-      // TODO: This can be safely removed once safeChainsList updates from MATIC to POL
-      if (parseInt(chainId) === 137) {
-        chainToMatch.nativeCurrency.symbol = 'POL';
-        chainToMatch.nativeCurrency.name = 'POL';
-      }
-
-      this.updateNetworkList(chainToMatch);
-      this.validateName(chainToMatch);
-      this.validateSymbol(chainToMatch);
-    }
-  };
-
-  /**
-   * Validates the chain ID by checking it against the `eth_chainId` return
-   * value from the given RPC URL.
-   * Assumes that all strings are non-empty and correctly formatted.
-   *
-   * @param {string} formChainId - Non-empty, hex or decimal number string from
-   * the form.
-   * @param {string} parsedChainId - The parsed, hex string chain ID.
-   * @param {string} rpcUrl - The RPC URL from the form.
-   */
-  validateChainIdOnSubmit = async (formChainId, parsedChainId, rpcUrl) => {
-    let errorMessage;
-    let endpointChainId;
-    let providerError;
-
-    try {
-      endpointChainId = await jsonRpcRequest(
-        this.templateInfuraRpc(rpcUrl),
-        'eth_chainId',
-      );
-    } catch (err) {
-      Logger.error(err, 'Failed to fetch the chainId from the endpoint.');
-      providerError = err;
-    }
-
-    if (providerError || typeof endpointChainId !== 'string') {
-      errorMessage = strings('app_settings.failed_to_fetch_chain_id');
-    } else if (parsedChainId !== endpointChainId) {
-      // Here, we are in an error state. The endpoint should always return a
-      // hexadecimal string. If the user entered a decimal string, we attempt
-      // to convert the endpoint's return value to decimal before rendering it
-      // in an error message in the form.
-      if (!formChainId.startsWith('0x')) {
-        try {
-          const endpointChainIdNumber = new BigNumber(endpointChainId, 16);
-          if (endpointChainIdNumber.isNaN()) {
-            throw new Error('Invalid endpointChainId');
-          }
-          endpointChainId = endpointChainIdNumber.toString(10);
-        } catch (err) {
-          Logger.error(err, {
-            endpointChainId,
-            message: 'Failed to convert endpoint chain ID to decimal',
-          });
-        }
-      }
-
-      errorMessage = strings(
-        'app_settings.endpoint_returned_different_chain_id',
-        {
-          chainIdReturned: endpointChainId,
-        },
-      );
-    }
-
-    if (errorMessage) {
-      this.setState({ warningChainId: errorMessage });
-      return false;
-    }
-    return true;
-  };
-
-  checkIfChainIdExists = async (chainId) => {
-    const { networkConfigurations } = this.props;
-
-    let hexChainId;
-    try {
-      // Convert the chainId to hex format
-      hexChainId = toHex(chainId);
-    } catch (error) {
-      hexChainId = null;
-    }
-
-    // Check if any network configuration matches the given chainId
-    const chainIdExists = Object.values(networkConfigurations).some(
-      (item) => item.chainId === hexChainId,
-    );
-
-    // Return true if the chainId exists and the UI redesign is enabled, otherwise false
-    return chainIdExists;
-  };
-
-  checkIfRpcUrlExists = async (rpcUrl) => {
-    // First, check custom networks in networkConfigurationsByChainId
-    const checkCustomNetworks = Object.values(
-      this.props.networkConfigurations,
-    ).filter((item) =>
-      item.rpcEndpoints?.some((endpoint) => endpoint.url === rpcUrl),
-    );
-
-    if (checkCustomNetworks.length > 0) {
-      return checkCustomNetworks;
-    }
-
-    // If no network exists with the given RPC URL
-    return [];
-  };
-
-  checkIfNetworkExists = async (rpcUrl) => {
-    const checkCustomNetworks = Object.values(
-      this.props.networkConfigurations,
-    ).filter((item) => item.rpcUrl === rpcUrl);
-
-    if (checkCustomNetworks.length > 0) {
-      return checkCustomNetworks;
-    }
-    const defaultNetworks = getAllNetworks().map((item) => Networks[item]);
-    const checkDefaultNetworks = defaultNetworks.filter(
-      (item) => Number(item.rpcUrl) === rpcUrl,
-    );
-    if (checkDefaultNetworks.length > 0) {
-      return checkDefaultNetworks;
-    }
-    return [];
-  };
-
-  checkIfNetworkNotExistsByChainId = async (chainId) =>
-    Object.values(this.props.networkConfigurations).filter(
-      (item) => item.chainId !== chainId,
-    );
-
-  handleNetworkUpdate = async ({
-    rpcUrl,
-    chainId,
-    nickname,
-    ticker,
-    blockExplorerUrl,
-    blockExplorerUrls,
-    rpcUrls,
-    isNetworkExists,
-    isCustomMainnet,
-    shouldNetworkSwitchPopToWallet,
-    navigation,
-    trackRpcUpdateFromBanner,
-  }) => {
-    const { NetworkController } = Engine.context;
-
-    const url = new URL(rpcUrl);
-    if (!isPrivateConnection(url.hostname)) {
-      url.set('protocol', 'https:');
-    }
-
-    const existingNetwork = this.props.networkConfigurations[chainId];
-
-    const indexRpc = rpcUrls.findIndex(({ url }) => url === rpcUrl);
-
-    const blockExplorerIndex = blockExplorerUrls.findIndex(
-      (url) => url === blockExplorerUrl,
-    );
-
-    const networkConfig = {
-      blockExplorerUrls,
-      chainId,
-      rpcEndpoints: rpcUrls,
-      nativeCurrency: ticker,
-      name: nickname,
-      defaultRpcEndpointIndex: indexRpc,
-      defaultBlockExplorerUrlIndex:
-        blockExplorerIndex !== -1 ? blockExplorerIndex : undefined,
-    };
-
-    if (isNetworkExists.length === 0) {
-      await NetworkController.updateNetwork(
-        existingNetwork.chainId,
-        networkConfig,
-        existingNetwork.chainId === chainId
-          ? {
-              replacementSelectedRpcEndpointIndex: indexRpc,
-            }
-          : undefined,
-      );
-
-      // Track RPC update from network connection banner
-      if (trackRpcUpdateFromBanner) {
-        const newRpcEndpoint =
-          networkConfig.rpcEndpoints[networkConfig.defaultRpcEndpointIndex];
-        const oldRpcEndpoint =
-          existingNetwork.rpcEndpoints?.[
-            existingNetwork.defaultRpcEndpointIndex ?? 0
-          ];
-
-        const chainIdAsDecimal = hexToNumber(chainId);
-
-        const sanitizeRpcUrl = (url) =>
-          isPublicEndpointUrl(url, infuraProjectId)
-            ? onlyKeepHost(url)
-            : 'custom';
-
-        this.props.analytics.trackEvent(
-          this.props.analytics
-            .createEventBuilder(
-              MetaMetricsEvents.NetworkConnectionBannerRpcUpdated,
-            )
-            .addProperties({
-              chain_id_caip: `eip155:${chainIdAsDecimal}`,
-              from_rpc_domain: oldRpcEndpoint?.url
-                ? sanitizeRpcUrl(oldRpcEndpoint.url)
-                : 'unknown',
-              to_rpc_domain: sanitizeRpcUrl(newRpcEndpoint.url),
-            })
-            .build(),
-        );
-      }
-    } else {
-      await NetworkController.addNetwork({
-        ...networkConfig,
-      });
-
-      this.props.analytics.addTraitsToUser(
-        addItemToChainIdList(networkConfig.chainId),
-      );
-    }
-
-    isCustomMainnet
-      ? navigation.navigate('OptinMetrics')
-      : shouldNetworkSwitchPopToWallet
-        ? navigation.navigate('WalletView')
-        : navigation.goBack();
-  };
-
-  /**
-   * Add or update network configuration, then switch networks
-   */
-  addRpcUrl = async () => {
-    const {
-      rpcUrl,
-      chainId: stateChainId,
-      nickname,
-      blockExplorerUrls,
-      blockExplorerUrl,
-      enableAction,
-      rpcUrls,
-      addMode,
-      editable,
-    } = this.state;
-
-    const ticker = this.state.ticker && this.state.ticker.toUpperCase();
-    const {
-      navigation,
-      networkOnboardedState,
-      route,
-      isAllNetworks,
-      tokenNetworkFilter,
-    } = this.props;
-    const isCustomMainnet = route.params?.isCustomMainnet;
-
-    const shouldNetworkSwitchPopToWallet =
-      route.params?.shouldNetworkSwitchPopToWallet ?? true;
-
-    const trackRpcUpdateFromBanner =
-      route.params?.trackRpcUpdateFromBanner ?? false;
-    // Check if CTA is disabled
-    const isCtaDisabled =
-      !enableAction || this.disabledByChainId() || this.disabledBySymbol();
-
-    if (isCtaDisabled) {
-      return;
-    }
-
-    // Conditionally check existence of network (Only check in Add Mode)
-    const isNetworkExists = addMode
-      ? await this.checkIfNetworkNotExistsByChainId(stateChainId)
-      : [];
-
-    const isOnboarded = getIsNetworkOnboarded(
-      stateChainId,
-      networkOnboardedState,
-    );
-
-    const nativeToken = ticker || PRIVATENETWORK;
-    const networkType = nickname || rpcUrl;
-    const networkUrl = sanitizeUrl(rpcUrl);
-    // Prevent the network switch modal from showing post onboarding.
-    const showNetworkOnboarding = isCustomMainnet ? false : isOnboarded;
-
-    const formChainId = stateChainId.trim().toLowerCase();
-
-    // Ensure chainId is a 0x-prefixed, lowercase hex string
-    let chainId = formChainId;
-    if (!chainId.startsWith('0x')) {
-      chainId = `0x${parseInt(chainId, 10).toString(16)}`;
-    }
-
-    if (!(await this.validateChainIdOnSubmit(formChainId, chainId, rpcUrl))) {
-      return;
-    }
-
-    // Set tokenNetworkFilter
-    const { PreferencesController } = Engine.context;
-    if (!isAllNetworks) {
-      PreferencesController.setTokenNetworkFilter({
-        [chainId]: true,
-      });
-    } else {
-      PreferencesController.setTokenNetworkFilter({
-        ...tokenNetworkFilter,
-        [chainId]: true,
-      });
-    }
-
-    const { NetworkEnablementController } = Engine.context;
-    NetworkEnablementController.enableNetwork(chainId);
-
-    await this.handleNetworkUpdate({
-      rpcUrl,
-      chainId,
-      nickname,
-      ticker,
-      blockExplorerUrl,
-      blockExplorerUrls,
-      rpcUrls,
-      isNetworkExists,
-      isCustomMainnet,
-      shouldNetworkSwitchPopToWallet,
-      navigation,
-      nativeToken,
-      networkType,
-      networkUrl,
-      showNetworkOnboarding,
-      trackRpcUpdateFromBanner,
-    });
-  };
-
-  /**
-   * Validates rpc url, setting a warningRpcUrl if is invalid
-   * It also changes validatedRpcURL to true, indicating that was validated
-   */
-
-  /**
-   * Validates that chain id is a valid integer number, setting a warningChainId if is invalid
-   */
-  validateChainId = async () => {
-    const { chainId, rpcUrl, editable } = this.state;
-    const isChainIdExists = await this.checkIfChainIdExists(chainId);
-    const isNetworkExists = await this.checkIfNetworkExists(rpcUrl);
-
-    if (isChainIdExists && isNetworkExists.length > 0 && !editable) {
-      return this.setState({
-        validateChainId: true,
-        warningChainId: strings(
-          'app_settings.chain_id_associated_with_another_network',
-        ),
-      });
-    }
-
-    if (isChainIdExists && isNetworkExists.length === 0 && !editable) {
-      return this.setState({
-        validateChainId: true,
-        warningChainId: strings('app_settings.network_already_exist'),
-      });
-    }
-
-    if (!chainId) {
-      return this.setState({
-        warningChainId: strings('app_settings.chain_id_required'),
-        validatedChainId: true,
-      });
-    }
-
-    let errorMessage = '';
-
-    // Check if it's a valid chainId format
-    if (chainId.startsWith('0x')) {
-      if (!regex.validChainIdHex.test(chainId)) {
-        errorMessage = strings('app_settings.invalid_hex_number');
-      } else if (!isPrefixedFormattedHexString(chainId)) {
-        errorMessage = strings('app_settings.invalid_hex_number_leading_zeros');
-      }
-    } else if (!regex.validChainId.test(chainId)) {
-      errorMessage = strings('app_settings.invalid_number');
-    } else if (chainId.startsWith('0')) {
-      errorMessage = strings('app_settings.invalid_number_leading_zeros');
-    }
-
-    if (errorMessage) {
-      return this.setState({
-        warningChainId: errorMessage,
-        validatedChainId: true,
-      });
-    }
-
-    // Check if it's a valid chainId number
-    if (!isSafeChainId(toHex(chainId))) {
-      return this.setState({
-        warningChainId: strings('app_settings.invalid_number_range', {
-          maxSafeChainId: AppConstants.MAX_SAFE_CHAIN_ID,
-        }),
-        validatedChainId: true,
-      });
-    }
-
-    let endpointChainId;
-    let providerError;
-    try {
-      endpointChainId = await jsonRpcRequest(
-        this.templateInfuraRpc(rpcUrl),
-        'eth_chainId',
-      );
-    } catch (err) {
-      Logger.error(err, 'Failed to fetch the chainId from the endpoint.');
-      providerError = err;
-    }
-
-    if (providerError || typeof endpointChainId !== 'string') {
-      return this.setState({
-        validatedRpcURL: false,
-        warningRpcUrl: strings('app_settings.unMatched_chain'),
-      });
-    }
-
-    if (endpointChainId !== toHex(chainId)) {
-      return this.setState({
-        warningRpcUrl: strings(
-          'app_settings.url_associated_to_another_chain_id',
-        ),
-        validatedRpcURL: false,
-        warningChainId: strings('app_settings.unMatched_chain_name'),
-      });
-    }
-
-    this.validateRpcAndChainId();
-    this.setState({ warningChainId: undefined, validatedChainId: true });
-  };
-
-  /**
-   * Validates that symbol match with the chainId, setting a warningSymbol if is invalid
-   */
-  validateSymbol = (chainToMatch = null) => {
-    const { ticker, networkList, chainId } = this.state;
-    const { networkConfigurations } = this.props;
-    const networkConfiguration = networkConfigurations[chainId];
-    const networkConfigurationSymbol = networkConfiguration?.nativeCurrency;
-
-    if (isWhitelistedSymbol(chainId, ticker)) {
-      return this.setState({
-        warningSymbol: undefined,
-        validatedSymbol: !!ticker,
-      });
-    }
-
-    const { useSafeChainsListValidation } = this.props;
-
-    if (!useSafeChainsListValidation) {
-      return;
-    }
-
-    const symbol = networkConfigurationSymbol
-      ? networkConfigurationSymbol
-      : chainToMatch
-        ? (chainToMatch?.nativeCurrency?.symbol ?? null)
-        : (networkList?.nativeCurrency?.symbol ?? null);
-
-    const symbolToUse =
-      symbol?.toLowerCase() === ticker?.toLowerCase() ? undefined : symbol;
-
-    return this.setState({
-      warningSymbol: ticker && ticker !== symbolToUse ? symbolToUse : undefined,
-      validatedSymbol: !!ticker,
-    });
-  };
-
-  /**
-   * Validates that name match with the chainId, setting a warningName if is invalid
-   */
-  validateName = (chainToMatch = null) => {
-    const { nickname, networkList, chainId } = this.state;
-    const { useSafeChainsListValidation } = this.props;
-
-    if (!useSafeChainsListValidation) {
-      return;
-    }
-
-    // Get the name either from NETWORK_TO_NAME_MAP or chainToMatch or networkList
-    const name =
-      NETWORK_TO_NAME_MAP[chainId] ||
-      chainToMatch?.name ||
-      networkList?.name ||
-      null;
-
-    // Determine nameToUse based on chainId and nickname comparison
-    const nameToUse = isValidNetworkName(chainId, name, nickname)
-      ? undefined
-      : name;
-
-    // Update state with warningName
-    this.setState({
-      warningName: nameToUse,
-    });
-  };
-
-  /**
-   * Allows to identify if any element of the form changed, in order to enable add or save button
-   */
-  getCurrentState = () => {
-    const {
-      rpcUrl,
-      blockExplorerUrl,
-      nickname,
-      chainId,
-      ticker,
-      editable,
-      rpcUrls,
-      initialState,
-    } = this.state;
-    const actualState =
-      rpcUrl +
-      blockExplorerUrl +
-      nickname +
-      chainId +
-      ticker +
-      editable +
-      rpcUrls;
-
-    let enableAction;
-    // If concstenation of parameters changed, user changed something so we are going to enable the action button
-    if (actualState !== initialState) {
-      enableAction = true;
-    } else {
-      enableAction = false;
-    }
-    this.setState({ enableAction });
-  };
-
-  /**
-   * Returns if action button should be disabled because of the rpc url
-   * Chain ID set but, chain id has not been validated yet or there is a warning for chain id
-   */
-  disabledByChainId = () => {
-    const { chainId, validatedChainId, warningChainId } = this.state;
-
-    return (
-      !chainId ||
-      (chainId && (!validatedChainId || warningChainId !== undefined))
-    );
-  };
-
-  /**
-   * Returns if action button should be disabled because of the symbol field
-   * Symbol field represents the ticker and needs to be set
-   */
-  disabledBySymbol = () => {
-    const { ticker } = this.state;
-    if (!ticker) {
-      return true;
-    }
-    return false;
-  };
-
-  onRpcUrlAdd = async (url) => {
-    await this.setState({
-      rpcUrlForm: url,
-      validatedRpcURL: false,
-      warningRpcUrl: undefined,
-      warningChainId: undefined,
-      warningSymbol: undefined,
-      warningName: undefined,
-    });
-  };
-
-  onRpcNameAdd = async (name) => {
-    await this.setState({
-      rpcNameForm: name,
-    });
-  };
-
-  onRpcItemAdd = async (url, name) => {
-    if (!url) {
-      return;
-    }
-
-    const rpcName = name ?? '';
-    const newRpcUrl = {
-      url,
-      failoverUrls: undefined,
-      name: rpcName,
-      type: RpcEndpointType.Custom,
-    };
-
-    // Calculate the index of the newly added RPC endpoint
-    // rpc_url_index: 0 means there is only 1 RPC URL for this network
-    const rpcUrlIndex = this.state.rpcUrls.length;
-
-    await this.setState((prevState) => ({
-      rpcUrls: [...prevState.rpcUrls, newRpcUrl],
-    }));
-
-    await this.setState({
-      rpcUrl: newRpcUrl.url,
-      failoverRpcUrls: newRpcUrl.failoverUrls,
-      rpcName: newRpcUrl.name,
-    });
-
-    // Track RPC Added event
-    if (this.state.chainId) {
-      this.props.analytics.trackEvent(
-        this.props.analytics
-          .createEventBuilder(MetaMetricsEvents.RPC_ADDED)
-          .addProperties({
-            chain_id: toHex(this.state.chainId),
-            source: 'Network Settings',
-            symbol: this.state.ticker,
-            rpc_url_index: rpcUrlIndex,
-          })
-          .build(),
-      );
-    }
-
-    this.closeAddRpcForm();
-    this.closeRpcModal();
-    this.getCurrentState();
-  };
-
-  onBlockExplorerItemAdd = async (url) => {
-    // If URL is empty or undefined, return early
-    if (!url) {
-      return;
-    }
-
-    // Check if the URL already exists in blockExplorerUrls
-    const { blockExplorerUrls } = this.state;
-    const urlExists = blockExplorerUrls.includes(url);
-
-    if (urlExists) {
-      // If the URL already exists, return early
-      return;
-    }
-
-    // If the URL doesn't exist, proceed with adding it
-    await this.setState((prevState) => ({
-      blockExplorerUrls: [...prevState.blockExplorerUrls, url],
-    }));
-
-    await this.setState({
-      blockExplorerUrl: url,
-    });
-
-    this.closeAddBlockExplorerRpcForm();
-    this.closeBlockExplorerModal();
-    this.getCurrentState();
-  };
-
-  onRpcUrlChange = async (url) => {
-    const { addMode } = this.state;
-    await this.setState({
-      rpcUrl: url,
-      validatedRpcURL: false,
-      warningRpcUrl: undefined,
-      warningChainId: undefined,
-      warningSymbol: undefined,
-      warningName: undefined,
-    });
-
-    this.validateName();
-    if (addMode) {
-      this.validateChainId();
-    }
-    this.validateSymbol();
-    this.getCurrentState();
-  };
-
-  onRpcUrlValidationChange = (isValid) => {
-    this.setState({ validatedRpcURL: isValid });
-  };
-
-  onRpcUrlChangeWithName = async (url, failoverUrls, name, type) => {
-    const nameToUse = name ?? type;
-    const { addMode } = this.state;
-    await this.setState({
-      rpcName: nameToUse,
-      rpcUrl: url,
-      failoverRpcUrls: failoverUrls,
-      validatedRpcURL: false,
-      warningRpcUrl: undefined,
-      warningChainId: undefined,
-      warningSymbol: undefined,
-      warningName: undefined,
-    });
-
-    this.validateName();
-    if (addMode) {
-      this.validateChainId();
-    }
-    this.validateSymbol();
-    this.getCurrentState();
-  };
-
-  onBlockExplorerUrlChange = async (url) => {
-    const { addMode } = this.state;
-    await this.setState({
-      blockExplorerUrlForm: url,
-      blockExplorerUrl: url,
-    });
-
-    this.validateName();
-    if (addMode) {
-      this.validateChainId();
-    }
-    this.validateSymbol();
-    this.getCurrentState();
-  };
-
-  onRpcUrlDelete = async (url) => {
-    const { addMode, rpcUrls, chainId } = this.state;
-
-    // Find the index of the RPC being deleted before removal
-    const rpcUrlIndex = rpcUrls.findIndex((rpcUrl) => rpcUrl.url === url);
-
-    await this.setState((prevState) => ({
-      rpcUrls: prevState.rpcUrls.filter((rpcUrl) => rpcUrl.url !== url),
-    }));
-
-    // Track RPC Removed event
-    if (chainId && rpcUrlIndex !== -1) {
-      this.props.analytics.trackEvent(
-        this.props.analytics
-          .createEventBuilder(MetaMetricsEvents.RPC_REMOVED)
-          .addProperties({
-            chain_id: toHex(chainId),
-            source: 'Network Settings',
-            symbol: this.state.ticker,
-            rpc_url_index: rpcUrlIndex,
-          })
-          .build(),
-      );
-    }
-
-    this.validateName();
-    if (addMode) {
-      this.validateChainId();
-    }
-    this.validateSymbol();
-    this.getCurrentState();
-  };
-
-  onBlockExplorerUrlDelete = async (url) => {
-    const { addMode } = this.state;
-    await this.setState((prevState) => ({
-      blockExplorerUrls: prevState.blockExplorerUrls.filter(
-        (explorerUrl) => explorerUrl !== url,
-      ),
-    }));
-    this.validateName();
-    if (addMode) {
-      this.validateChainId();
-    }
-    this.validateSymbol();
-    this.getCurrentState();
-  };
-
-  onNicknameChange = async (nickname) => {
-    await this.setState({ nickname });
-    this.getCurrentState();
-  };
-
-  // this function will autofill the name field with the value in parameter
-  autoFillNameField = (nickName) => {
-    this.onNicknameChange(nickName);
-    this.setState({
-      warningName: undefined,
-    });
-  };
-
-  onChainIDChange = async (chainId) => {
-    await this.setState({ chainId, validatedChainId: false });
-    this.getCurrentState();
-  };
-
-  onTickerChange = (ticker) => {
-    this.setState({ ticker, validatedSymbol: false }, () => {
-      this.getCurrentState();
-      this.validateSymbol();
-    });
-  };
-
-  // this function will autofill the symbol field with the value in parameter
-  autoFillSymbolField = (ticker) => {
-    this.onTickerChange(ticker);
-    this.setState({
-      warningSymbol: undefined,
-    });
-  };
-
-  onNameFocused = () => {
-    this.setState({ isNameFieldFocused: true });
-  };
-
-  onNameBlur = () => {
-    this.setState({ isNameFieldFocused: false });
-  };
-
-  onSymbolFocused = () => {
-    this.setState({ isSymbolFieldFocused: true });
-  };
-
-  onSymbolBlur = () => {
-    this.setState({ isSymbolFieldFocused: false });
-  };
-
-  onRpcUrlFocused = () => {
-    this.setState({ isRpcUrlFieldFocused: true });
-  };
-
-  onRpcUrlBlur = () => {
-    this.setState({ isRpcUrlFieldFocused: false });
-  };
-
-  onChainIdFocused = () => {
-    this.setState({ isChainIdFieldFocused: true });
-  };
-
-  onChainIdBlur = () => {
-    this.setState({ isChainIdFieldFocused: false });
-  };
-
-  jumpToRpcURL = () => {
-    const { current } = this.inputRpcURL;
-    current && current.focus();
-  };
-  jumpToChainId = () => {
-    const { current } = this.inputChainId;
-    current && current.focus();
-  };
-  jumpToSymbol = () => {
-    const { current } = this.inputSymbol;
-    current && current.focus();
-  };
-  jumpBlockExplorerURL = () => {
-    const { current } = this.inputBlockExplorerURL;
-    current && current.focus();
-  };
-
-  openAddRpcForm = () => {
-    this.setState({ showAddRpcForm: { isVisible: true } });
-  };
-
-  closeAddRpcForm = () => {
-    this.setState({
-      showAddRpcForm: { isVisible: false },
-      warningRpcUrl: undefined,
-    });
-  };
-
-  openAddBlockExplorerForm = () => {
-    this.setState({ showAddBlockExplorerForm: { isVisible: true } });
-  };
-
-  closeAddBlockExplorerRpcForm = () => {
-    this.setState({
-      showAddBlockExplorerForm: { isVisible: false },
-      blockExplorerUrlForm: undefined,
-    });
-  };
-
-  closeRpcModal = () => {
-    this.setState({
-      showMultiRpcAddModal: { isVisible: false },
-      rpcUrlForm: '',
-      rpcNameForm: '',
-    });
-  };
-
-  openRpcModal = () => {
-    this.setState({ showMultiRpcAddModal: { isVisible: true } });
-  };
-
-  openBlockExplorerModal = () => {
-    this.setState({ showMultiBlockExplorerAddModal: { isVisible: true } });
-  };
-
-  closeBlockExplorerModal = () => {
-    this.setState({ showMultiBlockExplorerAddModal: { isVisible: false } });
-  };
-
-  switchToMainnet = async () => {
-    const { MultichainNetworkController } = Engine.context;
-    const { networkConfigurations } = this.props;
-
-    const { networkClientId } =
-      networkConfigurations?.rpcEndpoints?.[
-        networkConfigurations.defaultRpcEndpointIndex
-      ] ?? {};
-
-    await MultichainNetworkController.setActiveNetwork(networkClientId);
-
-    setTimeout(async () => {
-      await updateIncomingTransactions();
-    }, 1000);
-  };
-
-  removeRpcUrl = async () => {
-    const { navigation, networkConfigurations, providerConfig } = this.props;
-    const { rpcUrl } = this.state;
-    if (
-      compareSanitizedUrl(rpcUrl, providerConfig.rpcUrl) &&
-      providerConfig.type === RPC
-    ) {
-      await this.switchToMainnet();
-    }
-
-    const entry = Object.entries(networkConfigurations).find(
-      ([, networkConfiguration]) =>
-        networkConfiguration.rpcEndpoints[
-          networkConfiguration.defaultRpcEndpointIndex
-        ].url === rpcUrl,
-    );
-
-    if (!entry) {
-      throw new Error(`Unable to find network with RPC URL ${rpcUrl}`);
-    }
-    const [, networkConfiguration] = entry;
-    const { NetworkController } = Engine.context;
-    NetworkController.removeNetwork(networkConfiguration.chainId);
-
-    this.props.analytics.addTraitsToUser(
-      removeItemFromChainIdList(networkConfiguration.chainId),
-    );
-
-    navigation.goBack();
-  };
-
-  goToNetworkEdit = () => {
-    const { rpcUrl } = this.state;
-    const { navigation } = this.props;
-    navigation.goBack();
-    navigation.navigate(Routes.EDIT_NETWORK, {
-      network: rpcUrl,
-      shouldNetworkSwitchPopToWallet: false,
-      shouldShowPopularNetworks: false,
-    });
-  };
-
-  showNetworkModal = (networkConfiguration) => {
-    this.setState({
-      showPopularNetworkModal: true,
-      popularNetwork: {
-        ...networkConfiguration,
-        formattedRpcUrl: networkConfiguration.warning
-          ? null
-          : formatNetworkRpcUrl(
-              networkConfiguration.rpcUrl,
-              networkConfiguration.chainId,
-            ),
-      },
-    });
-  };
-
-  customNetwork = () => {
-    const {
-      rpcUrl,
-      failoverRpcUrls,
-      rpcUrls,
-      blockExplorerUrls,
-      blockExplorerUrl,
-      nickname,
-      chainId,
-      ticker,
-      editable,
-      addMode,
-      warningRpcUrl,
-      warningChainId,
-      warningSymbol,
-      warningName,
-      enableAction,
-      inputWidth,
-      isNameFieldFocused,
-      isSymbolFieldFocused,
-      isRpcUrlFieldFocused,
-      isChainIdFieldFocused,
-      showMultiRpcAddModal,
-      showMultiBlockExplorerAddModal,
-      showAddRpcForm,
-      showAddBlockExplorerForm,
-      rpcUrlForm,
-      rpcNameForm,
-      rpcName,
-      blockExplorerUrlForm,
-    } = this.state;
-    const { route, isRpcFailoverEnabled } = this.props;
-    const isCustomMainnet = route.params?.isCustomMainnet;
-    const colors = this.context.colors || mockTheme.colors;
-    const themeAppearance =
-      this.context.themeAppearance || themeAppearanceLight;
-    const styles = createStyles(colors);
-
-    const inputStyle = [
-      styles.input,
-      inputWidth,
-      isCustomMainnet ? styles.onboardingInput : undefined,
-    ];
-
-    const inputErrorNameStyle = [
-      warningName
-        ? isNameFieldFocused
-          ? styles.inputWithFocus
-          : styles.input
-        : styles.input,
-      inputWidth,
-      isCustomMainnet ? styles.onboardingInput : undefined,
-    ];
-
-    const inputErrorSymbolStyle = [
-      warningSymbol
-        ? isSymbolFieldFocused
-          ? styles.inputWithFocus
-          : styles.inputWithError
-        : styles.input,
-      inputWidth,
-      isCustomMainnet ? styles.onboardingInput : undefined,
-    ];
-
-    const inputErrorRpcStyle = [
-      warningRpcUrl
-        ? isRpcUrlFieldFocused
-          ? styles.inputWithFocus
-          : styles.inputWithError
-        : styles.input,
-      inputWidth,
-      isCustomMainnet ? styles.onboardingInput : undefined,
-    ];
-
-    const inputChainIdStyle = [
-      warningChainId
-        ? isChainIdFieldFocused
-          ? styles.inputWithFocus
-          : styles.inputWithError
-        : styles.input,
-      inputWidth,
-      isCustomMainnet ? styles.onboardingInput : undefined,
-      !addMode ? styles.inputDisabled : undefined,
-    ];
-
-    const isRPCEditable = isCustomMainnet || editable;
-    const isActionDisabled =
-      !enableAction || this.disabledByChainId() || this.disabledBySymbol();
-
-    const rpcActionStyle = isActionDisabled
-      ? { ...styles.button, ...styles.disabledButton }
-      : styles.button;
-
-    const url = new URL(rpcUrl);
-
-    const selectedNetwork = {
-      rpcUrl: url.href,
-      failoverRpcUrls: undefined,
-      ticker,
-      nickname,
-      rpcPrefs: {
-        blockExplorerUrl,
-      },
-    };
-
-    const shouldNetworkSwitchPopToWallet =
-      route.params?.shouldNetworkSwitchPopToWallet ?? true;
-
-    const renderWarningChainId = () => {
-      const CHAIN_LIST_URL = 'https://chainid.network/';
-      const containerStyle = styles.newWarningContainer;
-
-      if (warningChainId) {
-        if (warningChainId === strings('app_settings.unMatched_chain_name')) {
-          return (
-            <View style={containerStyle}>
-              <Text style={styles.warningText}>{warningChainId}</Text>
-              <View>
-                <Text style={styles.warningText}>
-                  {strings('app_settings.find_the_right_one')}{' '}
-                  <Text
-                    style={styles.link}
-                    onPress={() => Linking.openURL(CHAIN_LIST_URL)}
-                  >
-                    chainid.network{' '}
-                    <Icon
-                      size={IconSize.Xs}
-                      name={IconName.Export}
-                      color={IconColor.PrimaryAlternative}
-                    />
-                  </Text>
-                </Text>
-              </View>
-            </View>
-          );
-        }
-        if (
-          warningChainId ===
-          strings('app_settings.chain_id_associated_with_another_network')
-        ) {
-          return (
-            <View style={containerStyle}>
-              <Text style={styles.warningText}>
-                {strings(
-                  'app_settings.chain_id_associated_with_another_network',
-                )}{' '}
-                <Text
-                  style={styles.link}
-                  onPress={() => this.goToNetworkEdit()}
-                >
-                  {strings('app_settings.edit_original_network')}
-                </Text>
-              </Text>
-            </View>
-          );
-        }
-        return (
-          <View style={containerStyle}>
-            <Text style={styles.warningText}>{warningChainId}</Text>
-          </View>
-        );
-      }
-      return null;
-    };
-
-    const renderWarningSymbol = () => {
-      const { validatedSymbol } = this.state;
-      if (warningSymbol) {
-        if (validatedSymbol) {
-          return (
-            <View>
-              <Text style={styles.inlineWarning}>
-                {strings('wallet.suggested_token_symbol')}{' '}
-                <Text
-                  style={styles.link}
-                  onPress={() => {
-                    this.autoFillSymbolField(warningSymbol);
-                  }}
-                >
-                  {warningSymbol}
-                </Text>
-              </Text>
-              <Text style={styles.inlineWarningMessage}>
-                {strings('wallet.chain_list_returned_different_ticker_symbol')}
-              </Text>
-            </View>
-          );
-        }
-        return (
-          <View>
-            <Text style={styles.inlineWarning}>
-              {strings('wallet.suggested_token_symbol')}{' '}
-              <Text
-                style={styles.link}
-                onPress={() => {
-                  this.autoFillSymbolField(warningSymbol);
-                }}
-              >
-                {warningSymbol}
-              </Text>
-            </Text>
-          </View>
-        );
-      }
-      return null;
-    };
-
-    const renderButtons = () => {
-      return (
-        <View style={styles.buttonsWrapper}>
-          <View style={styles.buttonsContainer}>
-            <Button
-              size={ButtonSize.Lg}
-              variant={ButtonVariants.Primary}
-              onPress={this.addRpcUrl}
-              testID={NetworksViewSelectorsIDs.ADD_CUSTOM_NETWORK_BUTTON}
-              style={styles.button}
-              label={strings('app_settings.network_save')}
-              isDisabled={isActionDisabled}
-              width={ButtonWidthTypes.Full}
-            />
-          </View>
-        </View>
-      );
-    };
-
-    return this.state.showNetworkDetailsModal ? (
-      <CustomNetwork
-        showPopularNetworkModal={this.state.showPopularNetworkModal}
-        isNetworkModalVisible={this.state.showNetworkDetailsModal}
-        closeNetworkModal={this.toggleNetworkDetailsModal}
-        selectedNetwork={{ ...selectedNetwork, chainId: toHex(chainId) }}
-        toggleWarningModal={this.toggleWarningModal}
-        showNetworkModal={this.showNetworkModal}
-        switchTab={this.tabView}
-        shouldNetworkSwitchPopToWallet={shouldNetworkSwitchPopToWallet}
-        showActionLabels
-      />
-    ) : (
-      <SafeAreaView
-        style={styles.wrapper}
-        testID={NetworksViewSelectorsIDs.CONTAINER}
-      >
-        <KeyboardAwareScrollView style={styles.informationCustomWrapper}>
-          <SafeAreaView
-            style={
-              this.isAnyModalVisible()
-                ? styles.scrollWrapperOverlay
-                : styles.scrollWrapper
-            }
-          >
-            <Text style={styles.label}>
-              {strings('app_settings.network_name_label')}
-            </Text>
-            <TextInput
-              style={inputErrorNameStyle}
-              autoCapitalize={'none'}
-              autoCorrect={false}
-              value={nickname}
-              editable={!this.isAnyModalVisible()}
-              onChangeText={this.onNicknameChange}
-              placeholder={strings('app_settings.network_name_placeholder')}
-              placeholderTextColor={colors.text.muted}
-              onBlur={() => {
-                this.validateName();
-                this.onNameBlur();
-              }}
-              onFocus={this.onNameFocused}
-              onSubmitEditing={this.jumpToRpcURL}
-              testID={NetworksViewSelectorsIDs.NETWORK_NAME_INPUT}
-              keyboardAppearance={themeAppearance}
-            />
-            {warningName ? (
-              <View>
-                <Text style={styles.messageWarning}>
-                  {strings('wallet.incorrect_network_name_warning')}
-                </Text>
-                <Text style={styles.inlineWarning}>
-                  {strings('wallet.suggested_name')}{' '}
-                  <Text
-                    style={styles.link}
-                    onPress={() => {
-                      this.autoFillNameField(warningName);
-                    }}
-                  >
-                    {warningName}
-                  </Text>
-                </Text>
-              </View>
-            ) : null}
-            <Text style={styles.label}>
-              {strings('app_settings.network_rpc_url_label')}
-            </Text>
-
-            {/* RPC Url Dropdown */}
-            <View style={styles.dropDownInput}>
-              <Cell
-                key={rpcUrl}
-                testID={NetworksViewSelectorsIDs.ICON_BUTTON_RPC}
-                variant={CellVariant.SelectWithMenu}
-                title={
-                  <View style={styles.rpcTitleWrapper}>
-                    <View>
-                      <Text
-                        numberOfLines={1}
-                        variant={DEFAULT_CELLBASE_AVATAR_TITLE_TEXTVARIANT}
-                        testID={CellComponentSelectorsIDs.BASE_TITLE}
-                      >
-                        {rpcName || formatNetworkRpcUrl(rpcUrl)}
-                      </Text>
-                    </View>
-                    {isRpcFailoverEnabled &&
-                      failoverRpcUrls &&
-                      failoverRpcUrls.length > 0 && (
-                        <Tag label={strings('app_settings.failover')} />
-                      )}
-                  </View>
-                }
-                secondaryText={rpcName ? formatNetworkRpcUrl(rpcUrl) : ''}
-                showSecondaryTextIcon={false}
-                isSelected={false}
-                withAvatar={false}
-                onPress={this.openRpcModal}
-                buttonIcon={IconName.ArrowDown}
-                buttonProps={{
-                  onButtonClick: () => this.openRpcModal(),
-                }}
-              />
-            </View>
-
-            {warningRpcUrl && (
-              <View
-                style={styles.newWarningContainer}
-                testID={NetworksViewSelectorsIDs.RPC_WARNING_BANNER}
-              >
-                <Text style={styles.warningText}>{warningRpcUrl}</Text>
-              </View>
-            )}
-
-            {isRpcFailoverEnabled &&
-              failoverRpcUrls &&
-              failoverRpcUrls.length > 0 && (
-                <>
-                  <Text style={styles.label}>
-                    {strings('app_settings.network_failover_rpc_url_label')}
-                  </Text>
-                  <TextInput
-                    style={[styles.input, styles.inputDisabled]}
-                    value={onlyKeepHost(failoverRpcUrls[0])}
-                    editable={false}
-                  />
-                </>
-              )}
-
-            <Text style={styles.label}>
-              {strings('app_settings.network_chain_id_label')}
-            </Text>
-            <TextInput
-              ref={this.inputChainId}
-              style={inputChainIdStyle}
-              autoCapitalize={'none'}
-              autoCorrect={false}
-              value={addMode ? chainId : getDecimalChainId(chainId)}
-              editable={!this.isAnyModalVisible() && addMode}
-              onChangeText={this.onChainIDChange}
-              onBlur={() => {
-                this.validateChainId();
-                this.onChainIdBlur();
-              }}
-              onFocus={this.onChainIdFocused}
-              placeholder={strings('app_settings.network_chain_id_placeholder')}
-              placeholderTextColor={colors.text.muted}
-              onSubmitEditing={this.jumpToSymbol}
-              keyboardType={'numbers-and-punctuation'}
-              testID={NetworksViewSelectorsIDs.CHAIN_INPUT}
-              keyboardAppearance={themeAppearance}
-            />
-            {renderWarningChainId()}
-
-            <Text style={styles.label}>
-              {strings('app_settings.network_symbol_label')}
-            </Text>
-            <TextInput
-              ref={this.inputSymbol}
-              style={inputErrorSymbolStyle}
-              autoCapitalize={'none'}
-              autoCorrect={false}
-              value={ticker}
-              editable={!this.isAnyModalVisible()}
-              onChangeText={this.onTickerChange}
-              onBlur={() => {
-                this.validateSymbol();
-                this.onSymbolBlur();
-              }}
-              onFocus={this.onSymbolFocused}
-              placeholder={strings('app_settings.network_symbol_label')}
-              placeholderTextColor={colors.text.muted}
-              onSubmitEditing={this.jumpBlockExplorerURL}
-              testID={NetworksViewSelectorsIDs.NETWORKS_SYMBOL_INPUT}
-              keyboardAppearance={themeAppearance}
-            />
-            {renderWarningSymbol()}
-
-            <Text style={styles.label}>
-              {strings('app_settings.network_block_explorer_label')}
-            </Text>
-            <View style={styles.dropDownInput}>
-              <Cell
-                key={rpcUrl}
-                testID={NetworksViewSelectorsIDs.ICON_BUTTON_BLOCK_EXPLORER}
-                variant={CellVariant.SelectWithMenu}
-                title={blockExplorerUrl}
-                isSelected={false}
-                withAvatar={false}
-                onPress={this.openBlockExplorerModal}
-                buttonIcon={IconName.ArrowDown}
-                buttonProps={{
-                  onButtonClick: () => this.openBlockExplorerModal(),
-                }}
-                avatarProps={{
-                  variant: AvatarVariant.Network,
-                }}
-              />
-            </View>
-          </SafeAreaView>
-          <View style={styles.bottomSection}>
-            {isCustomMainnet ? (
-              <Button
-                variant={ButtonVariants.Primary}
-                onPress={this.addRpcUrl}
-                style={rpcActionStyle}
-                label={strings('app_settings.networks_default_cta')}
-                size={ButtonSize.Lg}
-                disabled={isActionDisabled}
-                width={ButtonWidthTypes.Full}
-                testID={CustomDefaultNetworkIDs.USE_THIS_NETWORK_BUTTON_ID}
-              />
-            ) : (
-              renderButtons()
-            )}
-          </View>
-        </KeyboardAwareScrollView>
-
-        {showAddRpcForm.isVisible ? (
-          <ReusableModal
-            style={styles.sheetRpcForm}
-            onDismiss={this.closeAddRpcForm}
-            shouldGoBack={false}
-          >
-            <View style={styles.notch} />
-            <View style={styles.container}>
-              {/* Sticky Header */}
-              <BottomSheetHeader
-                onBack={() => {
-                  this.closeAddRpcForm();
-                  this.openRpcModal();
-                }}
-                style={styles.baseAll}
-              >
-                {strings('app_settings.add_rpc_url')}
-              </BottomSheetHeader>
-              {/* Keyboard Aware Scrollable Middle Content */}
-              <KeyboardAwareScrollView
-                enableOnAndroid
-                keyboardShouldPersistTaps="handled"
-                extraScrollHeight={80}
-              >
-                {/* URL Input */}
-                <Text style={styles.label}>
-                  {strings('app_settings.network_rpc_url_label')}
-                </Text>
-                <RpcUrlInput
-                  // Input props
-                  ref={this.inputRpcURL}
-                  style={inputErrorRpcStyle}
-                  autoCapitalize={'none'}
-                  autoCorrect={false}
-                  value={rpcUrlForm}
-                  editable={isRPCEditable}
-                  onChangeText={this.onRpcUrlAdd}
-                  onFocus={this.onRpcUrlFocused}
-                  placeholder={strings('app_settings.network_rpc_placeholder')}
-                  placeholderTextColor={colors.text.muted}
-                  onSubmitEditing={this.jumpToChainId}
-                  testID={NetworksViewSelectorsIDs.RPC_URL_INPUT}
-                  keyboardAppearance={themeAppearance}
-                  // Specific props
-                  checkIfNetworkExists={this.checkIfNetworkExists}
-                  checkIfRpcUrlExists={this.checkIfRpcUrlExists}
-                  onValidationSuccess={this.validateRpcAndChainId}
-                  onValidationChange={this.onRpcUrlValidationChange}
-                  warningStyle={styles.warningText}
-                />
-
-                {/* RPC Name Input */}
-                <Text style={styles.label}>
-                  {strings('app_settings.network_rpc_name_label')}
-                </Text>
-                <TextInput
-                  ref={this.inputNameRpcURL}
-                  style={inputErrorRpcStyle}
-                  autoCapitalize={'none'}
-                  value={rpcNameForm}
-                  autoCorrect={false}
-                  onChangeText={this.onRpcNameAdd}
-                  placeholder={strings('app_settings.network_rpc_placeholder')}
-                  placeholderTextColor={colors.text.muted}
-                  onSubmitEditing={this.jumpToChainId}
-                  testID={NetworksViewSelectorsIDs.RPC_NAME_INPUT}
-                  keyboardAppearance={themeAppearance}
-                />
-                {/* Add RPC Button */}
-                <View style={styles.scrollableBox}>
-                  <ButtonPrimary
-                    label={strings('app_settings.add_rpc_url')}
-                    size={ButtonSize.Lg}
-                    onPress={() => {
-                      this.onRpcItemAdd(rpcUrlForm, rpcNameForm);
-                    }}
-                    width={ButtonWidthTypes.Auto}
-                    labelTextVariant={TextVariant.BodyMD}
-                    isDisabled={!!warningRpcUrl}
-                    testID={NetworksViewSelectorsIDs.ADD_RPC_BUTTON}
-                  />
-                </View>
-              </KeyboardAwareScrollView>
-            </View>
-          </ReusableModal>
-        ) : null}
-        {showAddBlockExplorerForm.isVisible ? (
-          <ReusableModal
-            style={styles.sheetRpcForm}
-            shouldGoBack={false}
-            onDismiss={this.closeAddBlockExplorerRpcForm}
-          >
-            <View style={styles.notch} />
-            <BottomSheetHeader
-              onBack={() => {
-                this.closeAddBlockExplorerRpcForm();
-                this.openBlockExplorerModal();
-              }}
-              style={styles.baseAll}
-            >
-              {strings('app_settings.add_block_explorer_url')}
-            </BottomSheetHeader>
-            <KeyboardAwareScrollView
-              enableOnAndroid
-              keyboardShouldPersistTaps="handled"
-            >
-              <SafeAreaView style={styles.rpcMenu}>
-                <Text style={styles.label}>
-                  {strings('app_settings.network_block_explorer_label')}
-                </Text>
-                <TextInput
-                  ref={this.inputBlockExplorerURL}
-                  style={inputStyle}
-                  autoCapitalize={'none'}
-                  value={blockExplorerUrlForm}
-                  autoCorrect={false}
-                  onChangeText={this.onBlockExplorerUrlChange}
-                  placeholder={strings(
-                    'app_settings.network_block_explorer_placeholder',
-                  )}
-                  testID={NetworksViewSelectorsIDs.BLOCK_EXPLORER_INPUT}
-                  placeholderTextColor={colors.text.muted}
-                  onSubmitEditing={() => {
-                    this.onBlockExplorerItemAdd(blockExplorerUrlForm);
-                  }}
-                  keyboardAppearance={themeAppearance}
-                />
-                {blockExplorerUrl &&
-                  (!isUrl(blockExplorerUrl) ||
-                    blockExplorerUrls.includes(blockExplorerUrlForm)) && (
-                    <Text style={styles.warningText}>
-                      {strings('app_settings.invalid_block_explorer_url')}
-                    </Text>
-                  )}
-
-                <View style={styles.addRpcNameButton}>
-                  <ButtonPrimary
-                    label={strings('app_settings.add_block_explorer_url')}
-                    testID={NetworksViewSelectorsIDs.ADD_BLOCK_EXPLORER}
-                    size={ButtonSize.Lg}
-                    onPress={() => {
-                      this.onBlockExplorerItemAdd(blockExplorerUrlForm);
-                    }}
-                    width={ButtonWidthTypes.Full}
-                    labelTextVariant={TextVariant.BodyMD}
-                    isDisabled={
-                      !blockExplorerUrl ||
-                      !blockExplorerUrlForm ||
-                      !isUrl(blockExplorerUrl)
-                    }
-                  />
-                </View>
-              </SafeAreaView>
-            </KeyboardAwareScrollView>
-          </ReusableModal>
-        ) : null}
-
-        {showMultiBlockExplorerAddModal.isVisible ? (
-          <ReusableModal
-            style={
-              blockExplorerUrls.length > 0 || addMode
-                ? styles.sheet
-                : styles.sheetSmall
-            }
-            onDismiss={this.closeBlockExplorerModal}
-            shouldGoBack={false}
-          >
-            {/* Sticky Notch */}
-            <View style={styles.notch} />
-            <View style={styles.container}>
-              {/* Sticky Header */}
-              <BottomSheetHeader>
-                {strings('app_settings.add_block_explorer_url')}
-              </BottomSheetHeader>
-
-              {/* Scrollable Middle Content */}
-              <ScrollView contentContainerStyle={styles.scrollViewContent}>
-                {blockExplorerUrls.length > 0 ? (
-                  <View>
-                    {blockExplorerUrls.map((url) => (
-                      <Cell
-                        key={url}
-                        variant={CellVariant.SelectWithMenu}
-                        title={url}
-                        isSelected={blockExplorerUrl === url}
-                        withAvatar={false}
-                        onPress={async () => {
-                          await this.onBlockExplorerUrlChange(url);
-                          this.closeBlockExplorerModal();
-                        }}
-                        showButtonIcon={blockExplorerUrl !== url}
-                        buttonIcon={IconName.Trash}
-                        buttonProps={{
-                          onButtonClick: () => {
-                            this.onBlockExplorerUrlDelete(url);
-                          },
-                        }}
-                        avatarProps={{
-                          variant: AvatarVariant.Network,
-                        }}
-                      />
-                    ))}
-                  </View>
-                ) : null}
-
-                {/* Add Block Explorer Button */}
-                <View style={styles.scrollableBox}>
-                  <ButtonLink
-                    label={strings('app_settings.add_block_explorer_url')}
-                    endIconName={IconName.Add}
-                    size={ButtonSize.Lg}
-                    onPress={() => {
-                      this.openAddBlockExplorerForm();
-                      this.closeBlockExplorerModal();
-                    }}
-                    testID={NetworksViewSelectorsIDs.ADD_BLOCK_EXPLORER}
-                    width={ButtonWidthTypes.Auto}
-                    labelTextVariant={TextVariant.BodyMD}
-                  />
-                </View>
-              </ScrollView>
-            </View>
-          </ReusableModal>
-        ) : null}
-
-        {showMultiRpcAddModal.isVisible ? (
-          <ReusableModal
-            style={
-              rpcUrls.length > 0 || addMode ? styles.sheet : styles.sheetSmall
-            }
-            onDismiss={this.closeRpcModal}
-            shouldGoBack={false}
-          >
-            <View style={styles.notch} />
-            <View style={styles.container}>
-              {/* Sticky Header */}
-              <BottomSheetHeader>
-                {strings('app_settings.add_rpc_url')}
-              </BottomSheetHeader>
-
-              {/* Scrollable Middle Content */}
-              <ScrollView contentContainerStyle={styles.scrollViewContent}>
-                {rpcUrls.length > 0 ? (
-                  <View>
-                    {rpcUrls.map(({ url, failoverUrls, name, type }) => {
-                      const formattedName = type === 'infura' ? 'Infura' : name;
-                      return (
-                        <Cell
-                          key={`${url}-${name}`}
-                          variant={CellVariant.SelectWithMenu}
-                          title={
-                            <View style={styles.rpcTitleWrapper}>
-                              <View>
-                                <Text
-                                  numberOfLines={1}
-                                  variant={
-                                    DEFAULT_CELLBASE_AVATAR_TITLE_TEXTVARIANT
-                                  }
-                                  testID={CellComponentSelectorsIDs.BASE_TITLE}
-                                >
-                                  {formattedName || formatNetworkRpcUrl(url)}
-                                </Text>
-                              </View>
-                              {isRpcFailoverEnabled &&
-                                failoverUrls &&
-                                failoverUrls.length > 0 && (
-                                  <Tag
-                                    label={strings('app_settings.failover')}
-                                  />
-                                )}
-                            </View>
-                          }
-                          secondaryText={
-                            formattedName ? formatNetworkRpcUrl(url) : ''
-                          }
-                          showSecondaryTextIcon={false}
-                          isSelected={rpcUrl === url}
-                          withAvatar={false}
-                          onPress={async () => {
-                            await this.onRpcUrlChangeWithName(
-                              url,
-                              failoverUrls,
-                              name,
-                              type,
-                            );
-                            this.closeRpcModal();
-                          }}
-                          showButtonIcon={
-                            rpcUrl !== url && type !== RpcEndpointType.Infura
-                          }
-                          buttonIcon={IconName.Trash}
-                          buttonProps={{
-                            onButtonClick: () => {
-                              this.onRpcUrlDelete(url);
-                            },
-                          }}
-                          onTextClick={async () => {
-                            await this.onRpcUrlChangeWithName(
-                              url,
-                              failoverUrls,
-                              name,
-                              type,
-                            );
-                            this.closeRpcModal();
-                          }}
-                          avatarProps={{
-                            variant: AvatarVariant.Token,
-                          }}
-                        />
-                      );
-                    })}
-                  </View>
-                ) : null}
-                <View style={styles.scrollableBox}>
-                  <ButtonLink
-                    label={strings('app_settings.add_rpc_url')}
-                    endIconName={IconName.Add}
-                    size={ButtonSize.Lg}
-                    onPress={() => {
-                      this.openAddRpcForm();
-                      this.closeRpcModal();
-                    }}
-                    width={ButtonWidthTypes.Auto}
-                    labelTextVariant={TextVariant.BodyMD}
-                    testID={NetworksViewSelectorsIDs.ADD_RPC_BUTTON}
-                  />
-                </View>
-              </ScrollView>
-            </View>
-          </ReusableModal>
-        ) : null}
-      </SafeAreaView>
-    );
-  };
-
-  onCancel = () =>
-    this.setState({ showPopularNetworkModal: false, popularNetwork: {} });
-
-  toggleWarningModal = () =>
-    this.setState({ showWarningModal: !this.state.showWarningModal });
-
-  toggleNetworkDetailsModal = async () => {
-    const { rpcUrl, chainId: stateChainId } = this.state;
-    const { navigation } = this.props;
-    const formChainId = stateChainId.trim().toLowerCase();
-
-    // Ensure chainId is a 0x-prefixed, lowercase hex string
-    let chainId = formChainId;
-    if (!chainId.startsWith('0x')) {
-      chainId = `0x${parseInt(chainId, 10).toString(16)}`;
-    }
-
-    // if chainId is goerli, show deprecation modal
-    if (chainId === CHAIN_IDS.GOERLI) {
-      navigation.navigate(Routes.DEPRECATED_NETWORK_DETAILS);
-      return;
-    }
-
-    if (!(await this.validateChainIdOnSubmit(formChainId, chainId, rpcUrl))) {
-      return;
-    }
-    this.setState({
-      showNetworkDetailsModal: !this.state.showNetworkDetailsModal,
-    });
-  };
-
-  goToLearnMore = () => Linking.openURL(strings('networks.learn_more_url'));
-
-  renderTabBar = (props) => {
-    return (
-      <TabBar
-        tabStyle={{
-          paddingHorizontal: 16, // Reduce padding to remove gaps
-          paddingVertical: 8,
-          paddingBottom: 8,
-        }}
-        {...props}
-      />
-    );
-  };
-
-  render() {
-    const { route } = this.props;
-    const networkTypeOrRpcUrl = route.params?.network;
-    const shouldNetworkSwitchPopToWallet =
-      route.params?.shouldNetworkSwitchPopToWallet ?? true;
-    const shouldShowPopularNetworks =
-      route.params?.shouldShowPopularNetworks ?? true;
-    const colors = this.context.colors || mockTheme.colors;
-    const styles = createStyles(colors);
-
-    return (
-      <SafeAreaView
-        style={styles.wrapper}
-        testID={NetworksViewSelectorsIDs.CONTAINER}
-      >
-        <View style={styles.informationWrapper}>
-          {!shouldShowPopularNetworks || networkTypeOrRpcUrl ? (
-            this.customNetwork()
-          ) : (
-            <ScrollableTabView
-              renderTabBar={this.renderTabBar}
-              ref={(tabView) => {
-                this.tabView = tabView;
-              }}
-            >
-              <View
-                tabLabel={strings('app_settings.popular')}
-                key={AppConstants.ADD_CUSTOM_NETWORK_POPULAR_TAB_ID}
-                style={styles.networksWrapper}
-                testID={NetworksViewSelectorsIDs.POPULAR_NETWORKS_CONTAINER}
-              >
-                <CustomNetwork
-                  showPopularNetworkModal={this.state.showPopularNetworkModal}
-                  isNetworkModalVisible={this.state.showPopularNetworkModal}
-                  closeNetworkModal={this.onCancel}
-                  selectedNetwork={this.state.popularNetwork}
-                  toggleWarningModal={this.toggleWarningModal}
-                  showNetworkModal={this.showNetworkModal}
-                  switchTab={this.tabView}
-                  shouldNetworkSwitchPopToWallet={
-                    shouldNetworkSwitchPopToWallet
-                  }
-                  showActionLabels
-                />
-              </View>
-
-              <View
-                tabLabel={strings('app_settings.custom_network_name')}
-                key={AppConstants.ADD_CUSTOM_NETWORK_CUSTOM_TAB_ID}
-                testID={NetworksViewSelectorsIDs.CUSTOM_NETWORKS_CONTAINER}
-              >
-                {this.customNetwork()}
-              </View>
-            </ScrollableTabView>
-          )}
-        </View>
-        {this.state.showWarningModal ? (
-          <InfoModal
-            isVisible={this.state.showWarningModal}
-            title={strings('networks.network_warning_title')}
-            body={
-              <Text>
-                <Text style={styles.desc}>
-                  {strings('networks.network_warning_desc')}
-                </Text>{' '}
-                <Text style={[styles.blueText]} onPress={this.goToLearnMore}>
-                  {strings('networks.learn_more')}
-                </Text>
-              </Text>
-            }
-            toggleModal={this.toggleWarningModal}
-          />
-        ) : null}
-      </SafeAreaView>
-    );
-  }
-}
-
-NetworkSettings.contextType = ThemeContext;
-const mapDispatchToProps = (dispatch) => ({
-  showNetworkOnboardingAction: ({
-    networkUrl,
-    networkType,
-    nativeToken,
-    showNetworkOnboarding,
-  }) =>
-    dispatch(
-      showNetworkOnboardingAction({
-        networkUrl,
-        networkType,
-        nativeToken,
-        showNetworkOnboarding,
-      }),
-    ),
-});
-
-const mapStateToProps = (state) => ({
-  providerConfig: selectProviderConfig(state),
-  networkConfigurations: selectNetworkConfigurations(state),
-  networkOnboardedState: state.networkOnboarded.networkOnboardedState,
-  useSafeChainsListValidation: selectUseSafeChainsListValidation(state),
-  isAllNetworks: selectIsAllNetworks(state),
-  tokenNetworkFilter: selectTokenNetworkFilter(state),
-  isRpcFailoverEnabled: selectIsRpcFailoverEnabled(state),
-});
-
-export default compose(
-  connect(mapStateToProps, mapDispatchToProps),
-  withIsOriginalNativeToken,
-)(withAnalyticsAwareness(NetworkSettings));
diff --git a/app/components/Views/Settings/NetworksSettings/NetworkSettings/index.styles.js b/app/components/Views/Settings/NetworksSettings/NetworkSettings/index.styles.js
deleted file mode 100644
index 224f976371af..000000000000
--- a/app/components/Views/Settings/NetworksSettings/NetworkSettings/index.styles.js
+++ /dev/null
@@ -1,236 +0,0 @@
-import { typography } from '@metamask/design-tokens';
-import { StyleSheet } from 'react-native';
-import Device from '../../../../../util/device';
-import {
-  fontStyles,
-  colors as staticColors,
-} from '../../../../../styles/common';
-import {
-  getFontFamily,
-  TextVariant,
-} from '../../../../../component-library/components/Texts/Text';
-
-export const createStyles = (colors) =>
-  StyleSheet.create({
-    baseAll: {
-      padding: 16,
-    },
-    container: {
-      flex: 1,
-    },
-    scrollViewContent: {
-      height: '100%',
-    },
-    scrollableBox: {
-      marginTop: 24,
-      justifyContent: 'center',
-      alignItems: 'center',
-      alignSelf: 'center',
-    },
-    addRpcNameButton: {
-      paddingTop: 32,
-      alignSelf: 'center',
-    },
-    sheet: {
-      flexDirection: 'column',
-      bottom: 0,
-      top: Device.getDeviceHeight() * 0.5,
-      backgroundColor: colors.background.default,
-      borderTopLeftRadius: 10,
-      borderTopRightRadius: 10,
-      height: Device.getDeviceHeight() * 0.5,
-    },
-    sheetSmall: {
-      position: 'absolute',
-      bottom: 0,
-      top: Device.getDeviceHeight() * 0.7,
-      backgroundColor: colors.background.default,
-      borderTopLeftRadius: 10,
-      borderTopRightRadius: 10,
-      height: Device.getDeviceHeight() * 0.3,
-    },
-    sheetRpcForm: {
-      position: 'absolute',
-      bottom: 0,
-      top: Device.getDeviceHeight() * 0.3,
-      backgroundColor: colors.background.default,
-      borderTopLeftRadius: 10,
-      borderTopRightRadius: 10,
-      height: '100%',
-    },
-    notch: {
-      width: 48,
-      height: 5,
-      borderRadius: 4,
-      backgroundColor: colors.border.default,
-      marginTop: 4,
-      alignSelf: 'center',
-    },
-    rpcMenu: {
-      paddingHorizontal: 16,
-      flex: 1,
-    },
-    wrapper: {
-      backgroundColor: colors.background.default,
-      flexGrow: 1,
-      flexDirection: 'column',
-    },
-    informationWrapper: {
-      flex: 1,
-      paddingHorizontal: 16,
-    },
-    informationCustomWrapper: {},
-    scrollWrapper: {
-      flex: 1,
-      paddingVertical: 12,
-    },
-    scrollWrapperOverlay: {
-      flex: 1,
-      paddingVertical: 12,
-      opacity: 0.5,
-    },
-    onboardingInput: {
-      borderColor: staticColors.transparent,
-      padding: 0,
-    },
-    inputDisabled: {
-      borderColor: colors.border.muted,
-      color: colors.text.muted,
-    },
-    input: {
-      ...fontStyles.normal,
-      borderColor: colors.border.default,
-      borderRadius: 5,
-      borderWidth: 2,
-      padding: 10,
-      color: colors.text.default,
-    },
-    dropDownInput: {
-      borderColor: colors.border.default,
-      borderRadius: 5,
-      borderWidth: 2,
-    },
-    inputWithError: {
-      ...typography.sBodyMD,
-      fontFamily: getFontFamily(TextVariant.BodyMD),
-      borderColor: colors.error.default,
-      borderRadius: 5,
-      borderWidth: 1,
-      paddingTop: 2,
-      paddingBottom: 12,
-      paddingHorizontal: 12,
-      color: colors.text.default,
-    },
-    inputWithFocus: {
-      ...typography.sBodyMD,
-      fontFamily: getFontFamily(TextVariant.BodyMD),
-      borderColor: colors.primary.default,
-      borderRadius: 5,
-      borderWidth: 2,
-      paddingTop: 2,
-      paddingBottom: 12,
-      paddingHorizontal: 12,
-      color: colors.text.default,
-    },
-    warningText: {
-      ...fontStyles.normal,
-      color: colors.error.default,
-      marginTop: 4,
-      paddingLeft: 2,
-      paddingRight: 4,
-    },
-    warningContainer: {
-      marginTop: 16,
-      flexGrow: 1,
-      flexShrink: 1,
-    },
-    newWarningContainer: {
-      flexGrow: 1,
-      flexShrink: 1,
-    },
-    label: {
-      fontSize: 14,
-      paddingVertical: 12,
-      color: colors.text.default,
-      ...fontStyles.bold,
-    },
-    link: {
-      color: colors.primary.default,
-    },
-    title: {
-      fontSize: 20,
-      paddingVertical: 12,
-      color: colors.text.default,
-      ...fontStyles.bold,
-    },
-    desc: {
-      fontSize: 14,
-      color: colors.text.default,
-      ...fontStyles.normal,
-    },
-    messageWarning: {
-      paddingVertical: 2,
-      fontSize: 14,
-      color: colors.warning.default,
-      ...typography.sBodyMD,
-      fontFamily: getFontFamily(TextVariant.BodyMD),
-    },
-    inlineWarning: {
-      paddingVertical: 2,
-      fontSize: 14,
-      color: colors.text.default,
-      ...typography.sBodyMD,
-      fontFamily: getFontFamily(TextVariant.BodyMD),
-    },
-    inlineWarningMessage: {
-      paddingVertical: 2,
-      color: colors.warning.default,
-      ...typography.sBodyMD,
-      fontFamily: getFontFamily(TextVariant.BodyMD),
-    },
-    buttonsWrapper: {
-      marginVertical: 12,
-      flexDirection: 'row',
-      alignSelf: 'flex-end',
-    },
-    buttonsContainer: {
-      flex: 1,
-      flexDirection: 'column',
-      alignSelf: 'flex-end',
-    },
-    editableButtonsContainer: {
-      flex: 1,
-      flexDirection: 'row',
-    },
-    networksWrapper: {
-      marginTop: 12,
-    },
-    popularNetwork: {
-      flexDirection: 'row',
-      alignItems: 'center',
-      justifyContent: 'space-between',
-      marginVertical: 12,
-    },
-    button: {
-      flex: 1,
-    },
-    disabledButton: {
-      backgroundColor: colors.primary.muted,
-    },
-    cancel: {
-      marginRight: 16,
-    },
-    blueText: {
-      color: colors.primary.default,
-      marginTop: 1,
-    },
-    bottomSection: {
-      flex: 1,
-      flexDirection: 'column',
-    },
-    rpcTitleWrapper: {
-      flexDirection: 'row',
-      alignItems: 'center',
-      gap: 4,
-    },
-  });
diff --git a/app/components/Views/Settings/NetworksSettings/NetworkSettings/index.test.tsx b/app/components/Views/Settings/NetworksSettings/NetworkSettings/index.test.tsx
deleted file mode 100644
index ae3fd302961f..000000000000
--- a/app/components/Views/Settings/NetworksSettings/NetworkSettings/index.test.tsx
+++ /dev/null
@@ -1,2492 +0,0 @@
-// Mock the Analytics module BEFORE any imports
-const mockTrackEvent = jest.fn();
-const mockAddProperties = jest.fn().mockReturnThis();
-const mockBuild = jest.fn().mockReturnValue({ name: 'test-event' });
-const mockCreateEventBuilder = jest.fn().mockReturnValue({
-  addProperties: mockAddProperties,
-  build: mockBuild,
-});
-
-jest.mock('../../../../../core/Analytics', () => ({
-  MetaMetricsEvents: {
-    NETWORK_REMOVED: 'Network Removed',
-    RPC_ADDED: { category: 'RPC Added' },
-    RPC_REMOVED: { category: 'RPC Removed' },
-  },
-}));
-
-import React from 'react';
-import { shallow } from 'enzyme';
-import { RpcEndpointType } from '@metamask/network-controller';
-import { NetworkSettings } from './'; // Import the undecorated component
-import configureMockStore from 'redux-mock-store';
-import { Provider } from 'react-redux';
-import { ThemeContext, mockTheme } from '../../../../../../app/util/theme';
-import { backgroundState } from '../../../../../util/test/initial-root-state';
-import { mockNetworkState } from '../../../../../util/test/network';
-// eslint-disable-next-line import/no-namespace
-import * as jsonRequest from '../../../../../util/jsonRpcRequest';
-import Logger from '../../../../../util/Logger';
-import Engine from '../../../../../core/Engine';
-import { MetaMetricsEvents } from '../../../../../core/Analytics';
-const { PreferencesController } = Engine.context;
-
-jest.mock(
-  '../../../../../util/metrics/MultichainAPI/networkMetricUtils',
-  () => ({
-    addItemToChainIdList: jest.fn().mockReturnValue({
-      chain_id_list: ['eip155:1'],
-    }),
-    removeItemFromChainIdList: jest.fn().mockReturnValue({
-      chain_id_list: ['eip155:1'],
-    }),
-  }),
-);
-
-// HOC mock must inject analytics; mock factory runs before imports so React is not in scope (hence require).
-jest.mock(
-  '../../../../../components/hooks/useAnalytics/withAnalyticsAwareness',
-  () => {
-    // eslint-disable-next-line @typescript-eslint/no-require-imports, @typescript-eslint/no-var-requires -- hoisted mock factory
-    const ReactModule = require('react');
-    return {
-      withAnalyticsAwareness:
-        (Component: unknown) => (props: Record<string, unknown>) =>
-          ReactModule.createElement(Component, {
-            ...props,
-            analytics: {
-              trackEvent: mockTrackEvent,
-              createEventBuilder: mockCreateEventBuilder,
-              addTraitsToUser: jest.fn(),
-            },
-          }),
-    };
-  },
-);
-
-// Mock the feature flag
-jest.mock('../../../../../util/networks', () => {
-  const mockGetAllNetworks = jest.fn(() => ['mainnet', 'sepolia']);
-
-  return {
-    ...jest.requireActual('../../../../../util/networks'),
-    getAllNetworks: mockGetAllNetworks,
-    mainnet: {
-      name: 'Ethereum Main Network',
-      chainId: '0x1',
-      rpcUrl: 'https://mainnet.infura.io/v3',
-    },
-    sepolia: {
-      name: 'Sepolia Test Network',
-      chainId: '0xaa36a7',
-      rpcUrl: 'https://sepolia.infura.io/v3',
-    },
-  };
-});
-
-jest.useFakeTimers();
-const mockStore = configureMockStore();
-
-const initialState = {
-  engine: {
-    backgroundState,
-  },
-  networkOnboarded: {
-    networkOnboardedState: { '1': true },
-  },
-  NetworkController: {
-    ...mockNetworkState({
-      chainId: '0x1',
-      id: 'mainnet',
-      nickname: 'Ethereum Mainnet',
-      ticker: 'ETH',
-      blockExplorerUrl: 'https://goerli.lineascan.build',
-    }),
-  },
-};
-
-jest.mock('../../../../../core/Engine', () => ({
-  context: {
-    NetworkController: {
-      setProviderType: jest.fn(),
-      setActiveNetwork: jest.fn(),
-      getNetworkClientById: () => ({
-        configuration: {
-          chainId: '0x1',
-          rpcUrl: 'https://mainnet.infura.io/v3',
-          ticker: 'ETH',
-          type: 'custom',
-        },
-      }),
-      removeNetwork: jest.fn(),
-      updateNetwork: jest.fn(),
-      addNetwork: jest.fn(),
-    },
-    MultichainNetworkController: {
-      setActiveNetwork: jest.fn(),
-    },
-    CurrencyRateController: {
-      updateExchangeRate: jest.fn(),
-    },
-    PreferencesController: {
-      setTokenNetworkFilter: jest.fn(),
-    },
-    NetworkEnablementController: {
-      enableNetwork: jest.fn(),
-      disableNetwork: jest.fn(),
-      enableNetworkInNamespace: jest.fn(),
-    },
-  },
-}));
-
-const store = mockStore(initialState);
-
-const mockAnalytics = {
-  trackEvent: mockTrackEvent,
-  createEventBuilder: mockCreateEventBuilder,
-  addTraitsToUser: jest.fn(),
-};
-
-const SAMPLE_NETWORKSETTINGS_PROPS = {
-  analytics: mockAnalytics,
-  route: { params: {} },
-  providerConfig: {
-    rpcUrl: 'https://mainnet.infura.io/v3/YOUR-PROJECT-ID',
-  },
-  networkConfigurations: {
-    '0x1': {
-      blockExplorerUrls: ['https://etherscan.io'],
-      chainId: '0x1',
-      defaultRpcEndpointIndex: 0,
-      name: 'Ethereum mainnet',
-      nativeCurrency: 'ETH',
-      rpcEndpoints: [
-        {
-          networkClientId: 'mainnet',
-          type: 'custom',
-          url: 'https://mainnet.infura.io/v3/YOUR-PROJECT-ID',
-        },
-      ],
-    },
-
-    '0x5': {
-      chainId: '0x5',
-      name: 'Goerli',
-      rpcEndpoints: [
-        {
-          networkClientId: 'goerli',
-          type: 'custom',
-          url: 'https://goerli.infura.io/v3/{infuraProjectId}',
-        },
-      ],
-    },
-  },
-  networkOnboardedState: { '0x1': true, '0xe708': true },
-  navigation: { setOptions: jest.fn(), navigate: jest.fn(), goBack: jest.fn() },
-  matchedChainNetwork: {
-    safeChainsList: [
-      {
-        name: 'Ethereum Mainnet',
-        chain: 'ETH',
-        chainId: 1,
-        icon: 'ethereum',
-        rpc: [
-          'https://mainnet.infura.io/v3/${INFURA_API_KEY}',
-          'wss://mainnet.infura.io/ws/v3/${INFURA_API_KEY}',
-          'https://api.mycryptoapi.com/eth',
-          'https://cloudflare-eth.com',
-          'https://ethereum-rpc.publicnode.com',
-          'wss://ethereum-rpc.publicnode.com',
-          'https://mainnet.gateway.tenderly.co',
-          'wss://mainnet.gateway.tenderly.co',
-          'https://rpc.blocknative.com/boost',
-          'https://rpc.flashbots.net',
-          'https://rpc.flashbots.net/fast',
-          'https://rpc.mevblocker.io',
-          'https://rpc.mevblocker.io/fast',
-          'https://rpc.mevblocker.io/noreverts',
-          'https://rpc.mevblocker.io/fullprivacy',
-          'https://eth.drpc.org',
-          'wss://eth.drpc.org',
-        ],
-        features: [
-          {
-            name: 'EIP155',
-          },
-          {
-            name: 'EIP1559',
-          },
-        ],
-        faucets: [],
-        nativeCurrency: {
-          name: 'Ether',
-          symbol: 'ETH',
-          decimals: 18,
-        },
-        infoURL: 'https://ethereum.org',
-        shortName: 'eth',
-        networkId: 1,
-        slip44: 60,
-        ens: {
-          registry: '0x00000000000C2E074eC69A0dFb2997BA6C7d2e1e',
-        },
-        explorers: [
-          {
-            name: 'etherscan',
-            url: 'https://etherscan.io',
-            standard: 'EIP3091',
-          },
-          {
-            name: 'blockscout',
-            url: 'https://eth.blockscout.com',
-            icon: 'blockscout',
-            standard: 'EIP3091',
-          },
-          {
-            name: 'dexguru',
-            url: 'https://ethereum.dex.guru',
-            icon: 'dexguru',
-            standard: 'EIP3091',
-          },
-        ],
-      },
-      {
-        name: 'Polygon',
-        chain: 'MATIC',
-        chainId: 137,
-        faucets: [],
-        nativeCurrency: {
-          name: 'Polygon',
-          symbol: 'MATIC',
-          decimals: 18,
-        },
-      },
-    ],
-  },
-};
-
-describe('NetworkSettings', () => {
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  let wrapper: any;
-
-  beforeEach(() => {
-    jest.clearAllMocks();
-    wrapper = shallow(
-      <Provider store={store}>
-        <ThemeContext.Provider value={mockTheme}>
-          <NetworkSettings {...SAMPLE_NETWORKSETTINGS_PROPS} />
-        </ThemeContext.Provider>
-      </Provider>,
-    )
-      .find(NetworkSettings)
-      .dive();
-  });
-
-  afterEach(() => {
-    jest.clearAllMocks();
-  });
-
-  it('should render correctly', () => {
-    const component = shallow(
-      <Provider store={store}>
-        <NetworkSettings />
-      </Provider>,
-    );
-
-    expect(component).toMatchSnapshot();
-  });
-
-  it('should render the component correctly', () => {
-    const component = shallow(
-      <Provider store={store}>
-        <NetworkSettings />
-      </Provider>,
-    );
-
-    expect(component).toMatchSnapshot();
-  });
-
-  it('should update state and call getCurrentState on RPC URL change', async () => {
-    const SAMPLE_NETWORKSETTINGS_PROPS_2 = {
-      analytics: mockAnalytics,
-      route: {
-        params: {
-          network: 'mainnet',
-        },
-      },
-      navigation: {
-        setOptions: jest.fn(),
-        navigate: jest.fn(),
-        goBack: jest.fn(),
-      },
-      networkConfigurations: {
-        '0x1': {
-          blockExplorerUrls: ['https://etherscan.io'],
-          defaultBlockExplorerUrlIndex: 0,
-          defaultRpcEndpointIndex: 0,
-          chainId: '0x1',
-          rpcEndpoints: [
-            {
-              networkClientId: 'mainnet',
-              type: 'Infura',
-              url: 'https://mainnet.infura.io/v3/',
-            },
-          ],
-          name: 'Ethereum Main Network',
-          nativeCurrency: 'ETH',
-        },
-      },
-    };
-
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    const wrapper2: any = shallow(
-      <Provider store={store}>
-        <NetworkSettings {...SAMPLE_NETWORKSETTINGS_PROPS_2} />
-      </Provider>,
-    )
-      .find(NetworkSettings)
-      .dive();
-
-    const getCurrentStateSpy = jest.spyOn(
-      wrapper2.instance(),
-      'getCurrentState',
-    );
-
-    wrapper2.setState({
-      chainId: '0x1',
-    });
-
-    await wrapper2.instance().onRpcUrlChange('http://localhost:8545');
-    expect(wrapper2.state('rpcUrl')).toBe('http://localhost:8545');
-    expect(getCurrentStateSpy).toHaveBeenCalled();
-  });
-
-  it('should initialize state correctly when networkTypeOrRpcUrl is provided', () => {
-    const SAMPLE_NETWORKSETTINGS_PROPS_2 = {
-      analytics: mockAnalytics,
-      route: {
-        params: {
-          network: 'mainnet',
-        },
-      },
-      navigation: {
-        setOptions: jest.fn(),
-        navigate: jest.fn(),
-        goBack: jest.fn(),
-      },
-      networkConfigurations: {
-        '0x1': {
-          blockExplorerUrls: ['https://etherscan.io'],
-          defaultBlockExplorerUrlIndex: 0,
-          defaultRpcEndpointIndex: 0,
-          chainId: '0x1',
-          rpcEndpoints: [
-            {
-              networkClientId: 'mainnet',
-              type: 'Infura',
-              url: 'https://mainnet.infura.io/v3/',
-            },
-          ],
-          name: 'Ethereum Main Network',
-          nativeCurrency: 'ETH',
-        },
-      },
-    };
-
-    const wrapper2 = shallow(
-      <Provider store={store}>
-        <NetworkSettings {...SAMPLE_NETWORKSETTINGS_PROPS_2} />
-      </Provider>,
-    )
-      .find(NetworkSettings)
-      .dive();
-
-    const instance = wrapper2.instance() as NetworkSettings;
-    instance.componentDidMount();
-
-    expect(wrapper2.state('blockExplorerUrl')).toBe('https://etherscan.io');
-    expect(wrapper2.state('nickname')).toBe('Ethereum Main Network');
-    expect(wrapper2.state('chainId')).toBe('0x1');
-    expect(wrapper2.state('rpcUrl')).toBe('https://mainnet.infura.io/v3/');
-  });
-
-  it('should initialize state correctly when networkTypeOrRpcUrl is provided and isCustomMainnet is true', () => {
-    const SAMPLE_NETWORKSETTINGS_PROPS_2 = {
-      analytics: mockAnalytics,
-      route: {
-        params: { network: 'mainnet', isCustomMainnet: true },
-      },
-      navigation: {
-        setOptions: jest.fn(),
-        navigate: jest.fn(),
-        goBack: jest.fn(),
-      },
-      networkConfigurations: {
-        '0x1': {
-          blockExplorerUrls: ['https://etherscan.io'],
-          defaultBlockExplorerUrlIndex: 0,
-          defaultRpcEndpointIndex: 0,
-          chainId: '0x1',
-          rpcEndpoints: [
-            {
-              networkClientId: 'mainnet',
-              url: 'https://mainnet.infura.io/v3/YOUR-PROJECT-ID',
-              type: RpcEndpointType.Custom,
-            },
-          ],
-          name: 'Ethereum Main Custom',
-          nativeCurrency: 'ETH',
-        },
-      },
-    };
-
-    const wrapperComponent = shallow(
-      <Provider store={store}>
-        <NetworkSettings {...SAMPLE_NETWORKSETTINGS_PROPS_2} />
-      </Provider>,
-    )
-      .find(NetworkSettings)
-      .dive();
-
-    const instance = wrapperComponent.instance() as NetworkSettings;
-    instance.componentDidMount();
-
-    expect(wrapperComponent.state('blockExplorerUrl')).toBe(
-      'https://etherscan.io',
-    );
-    expect(wrapperComponent.state('nickname')).toBe('Ethereum Main Custom');
-    expect(wrapperComponent.state('chainId')).toBe('0x1');
-    expect(wrapperComponent.state('rpcUrl')).toBe(
-      'https://mainnet.infura.io/v3/YOUR-PROJECT-ID',
-    );
-  });
-
-  it('should initialize state correctly when networkTypeOrRpcUrl is provided and allNetworks is not found', () => {
-    const SAMPLE_NETWORKSETTINGS_PROPS_2 = {
-      analytics: mockAnalytics,
-      route: {
-        params: { network: 'https://mainnet.infura.io/v3/YOUR-PROJECT-ID' },
-      },
-      navigation: {
-        setOptions: jest.fn(),
-        navigate: jest.fn(),
-        goBack: jest.fn(),
-      },
-      networkConfigurations: {
-        '0x1': {
-          blockExplorerUrls: ['https://etherscan.io'],
-          defaultBlockExplorerUrlIndex: 0,
-          defaultRpcEndpointIndex: 0,
-          chainId: '0x1',
-          rpcEndpoints: [
-            {
-              url: 'https://mainnet.infura.io/v3/YOUR-PROJECT-ID',
-              type: RpcEndpointType.Custom,
-              name: 'Ethereum mainnet',
-            },
-          ],
-          name: 'Ethereum mainnet',
-          nativeCurrency: 'ETH',
-        },
-      },
-    };
-
-    const wrapper2 = shallow(
-      <Provider store={store}>
-        <NetworkSettings {...SAMPLE_NETWORKSETTINGS_PROPS_2} />
-      </Provider>,
-    )
-      .find(NetworkSettings)
-      .dive();
-
-    const instance = wrapper2.instance() as NetworkSettings;
-    instance.componentDidMount();
-
-    expect(wrapper2.state('blockExplorerUrl')).toBe('https://etherscan.io');
-    expect(wrapper2.state('nickname')).toBe('Ethereum mainnet');
-    expect(wrapper2.state('chainId')).toBe('0x1');
-    expect(wrapper2.state('rpcUrl')).toBe(
-      'https://mainnet.infura.io/v3/YOUR-PROJECT-ID',
-    );
-  });
-
-  it('should update state and call getCurrentState on nickname change', async () => {
-    const getCurrentStateSpy = jest.spyOn(
-      wrapper.instance(),
-      'getCurrentState',
-    );
-
-    await wrapper.instance().onNicknameChange('Localhost');
-
-    expect(wrapper.state('nickname')).toBe('Localhost');
-    expect(getCurrentStateSpy).toHaveBeenCalled();
-  });
-
-  it('should initialize state correctly on componentDidMount', () => {
-    const instance = wrapper.instance();
-    instance.componentDidMount();
-
-    expect(wrapper.state('rpcUrl')).toBe(undefined);
-    expect(wrapper.state('blockExplorerUrl')).toBe(undefined);
-    expect(wrapper.state('nickname')).toBe(undefined);
-    expect(wrapper.state('chainId')).toBe(undefined);
-    expect(wrapper.state('ticker')).toBe(undefined);
-    expect(wrapper.state('editable')).toBe(undefined);
-    expect(wrapper.state('addMode')).toBe(true);
-    expect(wrapper.state('warningRpcUrl')).toBe(undefined);
-    expect(wrapper.state('warningChainId')).toBe(undefined);
-    expect(wrapper.state('warningSymbol')).toBe(undefined);
-    expect(wrapper.state('validatedRpcURL')).toBe(true);
-    expect(wrapper.state('validatedChainId')).toBe(true);
-    expect(wrapper.state('validatedSymbol')).toBe(true);
-    expect(wrapper.state('initialState')).toBe(undefined);
-    expect(wrapper.state('enableAction')).toBe(false);
-    expect(wrapper.state('inputWidth')).toEqual({ width: '99%' });
-    expect(wrapper.state('showPopularNetworkModal')).toBe(false);
-    expect(wrapper.state('popularNetwork')).toEqual({});
-    expect(wrapper.state('showWarningModal')).toBe(false);
-    expect(wrapper.state('showNetworkDetailsModal')).toBe(false);
-    expect(wrapper.state('isNameFieldFocused')).toBe(false);
-    expect(wrapper.state('isSymbolFieldFocused')).toBe(false);
-    expect(wrapper.state('networkList')).toEqual([]);
-  });
-
-  it('should add RPC URL correctly', async () => {
-    wrapper.setState({
-      rpcUrl: 'http://localhost:8545',
-      chainId: '0x1',
-      ticker: 'ETH',
-      nickname: 'Localhost',
-    });
-
-    await wrapper.instance().addRpcUrl();
-
-    expect(wrapper.state('rpcUrl')).toBe('http://localhost:8545');
-  });
-
-  it('should validate RPC URL and Chain ID combination', async () => {
-    wrapper.setState({ rpcUrl: 'http://localhost:8545', chainId: '0x1' });
-
-    await wrapper.instance().validateRpcAndChainId();
-
-    expect(wrapper.state('validatedRpcURL')).toBe(true);
-    expect(wrapper.state('validatedChainId')).toBe(true);
-  });
-
-  it('should add RPC URL correctly to POL for polygon', async () => {
-    wrapper.setState({ rpcUrl: 'http://localhost:8545', chainId: '0x89' });
-
-    await wrapper.instance().validateRpcAndChainId();
-
-    expect(wrapper.state('validatedRpcURL')).toBe(true);
-    expect(wrapper.state('validatedChainId')).toBe(true);
-  });
-
-  // here
-  it('should update state and call getCurrentState on block explorer URL change', async () => {
-    const newProps = {
-      ...SAMPLE_NETWORKSETTINGS_PROPS,
-      networkConfigurations: {
-        '0x1': {
-          chainId: '0x1',
-          blockExplorerUrls: ['https://etherscan.io'],
-          defaultBlockExplorerUrlIndex: 0,
-          rpcEndpoints: [
-            {
-              url: 'https://rinkeby.infura.io/v3/YOUR-PROJECT-ID',
-              type: RpcEndpointType.Infura,
-            },
-          ],
-        },
-      },
-    };
-
-    wrapper = shallow(
-      <Provider store={store}>
-        <NetworkSettings {...newProps} />
-      </Provider>,
-    )
-      .find(NetworkSettings)
-      .dive();
-
-    wrapper.setState({
-      chainId: '0x1',
-    });
-
-    const getCurrentStateSpy = jest.spyOn(
-      wrapper.instance(),
-      'getCurrentState',
-    );
-
-    await wrapper.instance().onBlockExplorerUrlChange('https://etherscan.io');
-
-    expect(wrapper.state('blockExplorerUrl')).toBe('https://etherscan.io');
-    expect(getCurrentStateSpy).toHaveBeenCalled();
-  });
-
-  it('should update state and call getCurrentState on ticker change', async () => {
-    const getCurrentStateSpy = jest.spyOn(
-      wrapper.instance(),
-      'getCurrentState',
-    );
-
-    await wrapper.instance().onTickerChange('ETH');
-
-    expect(wrapper.state('ticker')).toBe('ETH');
-    expect(getCurrentStateSpy).toHaveBeenCalled();
-  });
-
-  it('should update state and call getCurrentState on Chain ID change', async () => {
-    const getCurrentStateSpy = jest.spyOn(
-      wrapper.instance(),
-      'getCurrentState',
-    );
-
-    await wrapper.instance().onChainIDChange('0x1');
-
-    expect(wrapper.state('chainId')).toBe('0x1');
-    expect(getCurrentStateSpy).toHaveBeenCalled();
-  });
-
-  it('should update isNameFieldFocused state on name input focus and blur', () => {
-    const instance = wrapper.instance();
-
-    instance.onNameFocused();
-    expect(wrapper.state('isNameFieldFocused')).toBe(true);
-
-    instance.onNameBlur();
-    expect(wrapper.state('isNameFieldFocused')).toBe(false);
-  });
-
-  it('should update isSymbolFieldFocused state on symbol input focus and blur', () => {
-    const instance = wrapper.instance();
-
-    instance.onSymbolFocused();
-    expect(wrapper.state('isSymbolFieldFocused')).toBe(true);
-
-    instance.onSymbolBlur();
-    expect(wrapper.state('isSymbolFieldFocused')).toBe(false);
-  });
-
-  it('should update isRpcUrlFieldFocused state on RPC URL input focus and blur', () => {
-    const instance = wrapper.instance();
-
-    instance.onRpcUrlFocused();
-    expect(wrapper.state('isRpcUrlFieldFocused')).toBe(true);
-
-    instance.onRpcUrlBlur();
-    expect(wrapper.state('isRpcUrlFieldFocused')).toBe(false);
-  });
-
-  it('should update isChainIdFieldFocused state on chain ID input focus and blur', () => {
-    const instance = wrapper.instance();
-
-    instance.onChainIdFocused();
-    expect(wrapper.state('isChainIdFieldFocused')).toBe(true);
-
-    instance.onChainIdBlur();
-    expect(wrapper.state('isChainIdFieldFocused')).toBe(false);
-  });
-  describe('NetworkSettings additional tests', () => {
-    beforeEach(() => {
-      wrapper = shallow(
-        <Provider store={store}>
-          <NetworkSettings {...SAMPLE_NETWORKSETTINGS_PROPS} />
-        </Provider>,
-      )
-        .find(NetworkSettings)
-        .dive();
-    });
-
-    afterEach(() => {
-      jest.clearAllMocks();
-    });
-
-    it('should validate chain ID format and set warning if invalid', async () => {
-      const instance = wrapper.instance();
-
-      // Test with an invalid chainId format
-      await instance.onChainIDChange('invalidChainId');
-      await instance.validateChainId();
-
-      expect(wrapper.state('warningChainId')).toBe(
-        "Invalid number. Enter a decimal or '0x'-prefixed hexadecimal number.",
-      );
-    });
-
-    it('should validate chain ID correctly if valid', async () => {
-      const instance = wrapper.instance();
-
-      // Test with a valid chainId
-      await instance.onChainIDChange('0x2');
-      await instance.validateChainId();
-
-      expect(wrapper.state('warningChainId')).toBe(undefined);
-    });
-
-    it('should toggle the modal for RPC form correctly', () => {
-      const instance = wrapper.instance();
-
-      instance.openAddRpcForm();
-      expect(wrapper.state('showAddRpcForm').isVisible).toBe(true);
-
-      instance.closeAddRpcForm();
-      expect(wrapper.state('showAddRpcForm').isVisible).toBe(false);
-    });
-
-    it('should toggle the modal for Block Explorer form correctly', () => {
-      const instance = wrapper.instance();
-
-      instance.openAddBlockExplorerForm();
-      expect(wrapper.state('showAddBlockExplorerForm').isVisible).toBe(true);
-
-      instance.closeAddBlockExplorerRpcForm();
-      expect(wrapper.state('showAddBlockExplorerForm').isVisible).toBe(false);
-    });
-
-    it('should correctly add RPC URL through modal and update state', async () => {
-      const instance = wrapper.instance();
-
-      // Open RPC form modal and add a new RPC URL
-      instance.openAddRpcForm();
-      await instance.onRpcItemAdd('https://new-rpc-url.com', 'New RPC');
-
-      expect(wrapper.state('rpcUrls').length).toBe(1);
-      expect(wrapper.state('rpcUrls')[0].url).toBe('https://new-rpc-url.com');
-      expect(wrapper.state('rpcUrls')[0].name).toBe('New RPC');
-    });
-
-    it('adds add RPC URL through modal and update state when addMode is true', async () => {
-      wrapper.setState({ addMode: true });
-
-      const instance = wrapper.instance();
-
-      await instance.onRpcItemAdd('https://new-rpc-url.com', 'New RPC');
-
-      expect(wrapper.state('rpcUrls').length).toBe(1);
-      expect(wrapper.state('rpcUrls')[0].url).toBe('https://new-rpc-url.com');
-      expect(wrapper.state('rpcUrls')[0].name).toBe('New RPC');
-    });
-
-    it('should correctly add Block Explorer URL through modal and update state', async () => {
-      const instance = wrapper.instance();
-
-      // Open Block Explorer form modal and add a new URL
-      instance.openAddBlockExplorerForm();
-      await instance.onBlockExplorerItemAdd('https://new-blockexplorer.com');
-
-      expect(wrapper.state('blockExplorerUrls').length).toBe(1);
-      expect(wrapper.state('blockExplorerUrls')[0]).toBe(
-        'https://new-blockexplorer.com',
-      );
-    });
-
-    it('adds correctly add Block Explorer URL through modal and update state when addMode is true', async () => {
-      wrapper.setState({ addMode: true });
-
-      const instance = wrapper.instance();
-
-      // Open Block Explorer form modal and add a new URL
-      instance.openAddBlockExplorerForm();
-      await instance.onBlockExplorerItemAdd('https://new-blockexplorer.com');
-
-      expect(wrapper.state('blockExplorerUrls').length).toBe(1);
-      expect(wrapper.state('blockExplorerUrls')[0]).toBe(
-        'https://new-blockexplorer.com',
-      );
-    });
-
-    it('should not add an empty Block Explorer URL and should return early', async () => {
-      const instance = wrapper.instance();
-
-      // Initially, blockExplorerUrls should be empty
-      expect(wrapper.state('blockExplorerUrls').length).toBe(0);
-
-      // Open Block Explorer form modal and attempt to add an empty URL
-      instance.openAddBlockExplorerForm();
-      await instance.onBlockExplorerItemAdd('');
-
-      // Ensure the state is not updated with the empty URL
-      expect(wrapper.state('blockExplorerUrls').length).toBe(0);
-      expect(wrapper.state('blockExplorerUrl')).toBeUndefined();
-    });
-
-    it('should not add an existing Block Explorer URL and should return early', async () => {
-      const instance = wrapper.instance();
-
-      // Set initial state with an existing block explorer URL
-      await instance.setState({
-        blockExplorerUrls: ['https://existing-blockexplorer.com'],
-      });
-
-      // Ensure the initial state contains the existing URL
-      expect(wrapper.state('blockExplorerUrls').length).toBe(1);
-      expect(wrapper.state('blockExplorerUrls')[0]).toBe(
-        'https://existing-blockexplorer.com',
-      );
-
-      // Attempt to add the same URL again
-      await instance.onBlockExplorerItemAdd(
-        'https://existing-blockexplorer.com',
-      );
-
-      // Ensure the state remains unchanged and no duplicate is added
-      expect(wrapper.state('blockExplorerUrls').length).toBe(1);
-      expect(wrapper.state('blockExplorerUrls')[0]).toBe(
-        'https://existing-blockexplorer.com',
-      );
-    });
-
-    it('should call validateRpcAndChainId when chainId and rpcUrl are set', async () => {
-      const instance = wrapper.instance();
-      const validateRpcAndChainIdSpy = jest.spyOn(
-        instance,
-        'validateRpcAndChainId',
-      );
-
-      wrapper.setState({
-        rpcUrl: 'http://localhost:8545',
-        chainId: '0x1',
-      });
-
-      await instance.validateRpcAndChainId();
-
-      expect(validateRpcAndChainIdSpy).toHaveBeenCalled();
-    });
-
-    it('should correctly delete an RPC URL and update state', async () => {
-      const instance = wrapper.instance();
-
-      // Add and then delete an RPC URL
-      await instance.onRpcItemAdd('https://to-delete-url.com', 'RPC to delete');
-      expect(wrapper.state('rpcUrls').length).toBe(1);
-
-      await instance.onRpcUrlDelete('https://to-delete-url.com');
-      expect(wrapper.state('rpcUrls').length).toBe(0);
-    });
-
-    describe('RPC event tracking', () => {
-      beforeEach(() => {
-        mockTrackEvent.mockClear();
-        mockCreateEventBuilder.mockClear();
-        mockAddProperties.mockClear();
-        mockBuild.mockClear();
-      });
-
-      it('tracks RPC_ADDED event when adding RPC URL with chainId set', async () => {
-        const instance = wrapper.instance();
-        const chainId = '0x1';
-        const ticker = 'ETH';
-
-        wrapper.setState({
-          chainId,
-          ticker,
-          rpcUrls: [],
-        });
-
-        await instance.onRpcItemAdd('https://new-rpc-url.com', 'New RPC');
-
-        // Verify RPC_ADDED event was tracked
-        expect(mockCreateEventBuilder).toHaveBeenCalledWith(
-          expect.objectContaining({ category: 'RPC Added' }),
-        );
-        expect(mockAddProperties).toHaveBeenCalledWith({
-          chain_id: '0x1',
-          source: 'Network Settings',
-          symbol: 'ETH',
-          rpc_url_index: 0,
-        });
-        expect(mockTrackEvent).toHaveBeenCalled();
-      });
-
-      it('tracks RPC_ADDED event with correct rpc_url_index when adding multiple RPC URLs', async () => {
-        const instance = wrapper.instance();
-        const chainId = '0x64';
-        const ticker = 'xDai';
-
-        wrapper.setState({
-          chainId,
-          ticker,
-          rpcUrls: [
-            {
-              url: 'https://first-rpc-url.com',
-              name: 'First RPC',
-              type: RpcEndpointType.Custom,
-            },
-          ],
-        });
-
-        // Add second RPC URL
-        await instance.onRpcItemAdd('https://second-rpc-url.com', 'Second RPC');
-
-        // Verify RPC_ADDED event was tracked with index 1
-        expect(mockCreateEventBuilder).toHaveBeenCalledWith(
-          expect.objectContaining({ category: 'RPC Added' }),
-        );
-        expect(mockAddProperties).toHaveBeenCalledWith({
-          chain_id: '0x64',
-          source: 'Network Settings',
-          symbol: 'xDai',
-          rpc_url_index: 1,
-        });
-        expect(mockTrackEvent).toHaveBeenCalled();
-      });
-
-      it('does not track RPC_ADDED event when chainId is not set', async () => {
-        const instance = wrapper.instance();
-
-        wrapper.setState({
-          chainId: undefined,
-          rpcUrls: [],
-        });
-
-        await instance.onRpcItemAdd('https://new-rpc-url.com', 'New RPC');
-
-        // Verify RPC_ADDED event was NOT tracked
-        expect(mockCreateEventBuilder).not.toHaveBeenCalled();
-        expect(mockTrackEvent).not.toHaveBeenCalled();
-      });
-
-      it('tracks RPC_REMOVED event when deleting RPC URL with chainId set', async () => {
-        const instance = wrapper.instance();
-        const chainId = '0x2';
-        const ticker = 'TST';
-        const rpcUrlToDelete = 'https://to-delete-url.com';
-
-        wrapper.setState({
-          chainId,
-          ticker,
-          rpcUrls: [
-            {
-              url: 'https://first-rpc-url.com',
-              name: 'First RPC',
-              type: RpcEndpointType.Custom,
-            },
-            {
-              url: rpcUrlToDelete,
-              name: 'RPC to delete',
-              type: RpcEndpointType.Custom,
-            },
-          ],
-        });
-
-        await instance.onRpcUrlDelete(rpcUrlToDelete);
-
-        // Verify RPC_REMOVED event was tracked
-        expect(mockCreateEventBuilder).toHaveBeenCalledWith(
-          expect.objectContaining({ category: 'RPC Removed' }),
-        );
-        expect(mockAddProperties).toHaveBeenCalledWith({
-          chain_id: '0x2',
-          source: 'Network Settings',
-          symbol: 'TST',
-          rpc_url_index: 1, // Second RPC URL (index 1)
-        });
-        expect(mockTrackEvent).toHaveBeenCalled();
-      });
-
-      it('tracks RPC_REMOVED event with correct rpc_url_index when deleting first RPC URL', async () => {
-        const instance = wrapper.instance();
-        const chainId = '0x3';
-        const ticker = 'ABC';
-        const rpcUrlToDelete = 'https://first-rpc-url.com';
-
-        wrapper.setState({
-          chainId,
-          ticker,
-          rpcUrls: [
-            {
-              url: rpcUrlToDelete,
-              name: 'First RPC',
-              type: RpcEndpointType.Custom,
-            },
-            {
-              url: 'https://second-rpc-url.com',
-              name: 'Second RPC',
-              type: RpcEndpointType.Custom,
-            },
-          ],
-        });
-
-        await instance.onRpcUrlDelete(rpcUrlToDelete);
-
-        // Verify RPC_REMOVED event was tracked with index 0
-        expect(mockCreateEventBuilder).toHaveBeenCalledWith(
-          expect.objectContaining({ category: 'RPC Removed' }),
-        );
-        expect(mockAddProperties).toHaveBeenCalledWith({
-          chain_id: '0x3',
-          source: 'Network Settings',
-          symbol: 'ABC',
-          rpc_url_index: 0, // First RPC URL (index 0)
-        });
-        expect(mockTrackEvent).toHaveBeenCalled();
-      });
-
-      it('does not track RPC_REMOVED event when chainId is not set', async () => {
-        const instance = wrapper.instance();
-        const rpcUrlToDelete = 'https://to-delete-url.com';
-
-        wrapper.setState({
-          chainId: undefined,
-          rpcUrls: [
-            {
-              url: rpcUrlToDelete,
-              name: 'RPC to delete',
-              type: RpcEndpointType.Custom,
-            },
-          ],
-        });
-
-        await instance.onRpcUrlDelete(rpcUrlToDelete);
-
-        // Verify RPC_REMOVED event was NOT tracked
-        expect(mockCreateEventBuilder).not.toHaveBeenCalled();
-        expect(mockTrackEvent).not.toHaveBeenCalled();
-      });
-
-      it('does not track RPC_REMOVED event when RPC URL is not found', async () => {
-        const instance = wrapper.instance();
-        const chainId = '0x4';
-
-        wrapper.setState({
-          chainId,
-          rpcUrls: [
-            {
-              url: 'https://existing-rpc-url.com',
-              name: 'Existing RPC',
-              type: RpcEndpointType.Custom,
-            },
-          ],
-        });
-
-        await instance.onRpcUrlDelete('https://non-existent-url.com');
-
-        // Verify RPC_REMOVED event was NOT tracked (rpcUrlIndex would be -1)
-        expect(mockCreateEventBuilder).not.toHaveBeenCalled();
-        expect(mockTrackEvent).not.toHaveBeenCalled();
-      });
-    });
-
-    it('should correctly delete a Block Explorer URL and update state', async () => {
-      const instance = wrapper.instance();
-
-      // Add and then delete a Block Explorer URL
-      await instance.onBlockExplorerItemAdd(
-        'https://to-delete-blockexplorer.com',
-      );
-      expect(wrapper.state('blockExplorerUrls').length).toBe(1);
-
-      await instance.onBlockExplorerUrlDelete(
-        'https://to-delete-blockexplorer.com',
-      );
-      expect(wrapper.state('blockExplorerUrls').length).toBe(0);
-    });
-
-    it('should call the navigation method to go back when removeRpcUrl is called', () => {
-      const instance = wrapper.instance();
-      wrapper.setState({
-        rpcUrl: 'https://mainnet.infura.io/v3/YOUR-PROJECT-ID',
-      });
-      instance.removeRpcUrl();
-
-      expect(SAMPLE_NETWORKSETTINGS_PROPS.navigation.goBack).toHaveBeenCalled();
-    });
-
-    it('should disable action button when form is incomplete', async () => {
-      const instance = wrapper.instance();
-
-      // Set incomplete form state
-      wrapper.setState({
-        rpcUrl: '',
-        chainId: '',
-        nickname: '',
-      });
-
-      await instance.addRpcUrl();
-
-      // The action button should be disabled
-      expect(wrapper.state('enableAction')).toBe(false);
-    });
-
-    it('should enable action button when form is complete', async () => {
-      const instance = wrapper.instance();
-
-      // Set complete form state
-      wrapper.setState({
-        rpcUrls: [
-          {
-            url: 'http://localhost:8545',
-            type: 'custom',
-            name: 'test',
-          },
-        ],
-        rpcUrl: 'http://localhost:8545',
-        chainId: '0x1',
-        nickname: 'Localhost',
-        ticker: 'ETH',
-      });
-
-      await instance.getCurrentState();
-
-      // The action button should be enabled
-      expect(wrapper.state('enableAction')).toBe(true);
-    });
-
-    it('should validateChainId and set appropriate error messages for invalid chainId formats', async () => {
-      const instance = wrapper.instance();
-
-      // Set an invalid chain ID
-      await instance.onChainIDChange('0xinvalid');
-      await instance.validateChainId();
-
-      expect(wrapper.state('warningChainId')).toBe(
-        'Invalid hexadecimal number.',
-      );
-    });
-
-    it('should handle valid chainId conversion and updating state correctly', async () => {
-      const instance = wrapper.instance();
-
-      await instance.onChainIDChange('0x2');
-      await instance.validateChainId();
-
-      expect(wrapper.state('warningChainId')).toBe(undefined);
-    });
-
-    it('should call getCurrentState when onNicknameChange is triggered', async () => {
-      const instance = wrapper.instance();
-      const getCurrentStateSpy = jest.spyOn(instance, 'getCurrentState');
-
-      await instance.onNicknameChange('New Nickname');
-
-      expect(wrapper.state('nickname')).toBe('New Nickname');
-      expect(getCurrentStateSpy).toHaveBeenCalled();
-    });
-
-    it('should not call getCurrentState', async () => {
-      const instance = wrapper.instance();
-      const getCurrentStateSpy = jest.spyOn(instance, 'getCurrentState');
-
-      await instance.onBlockExplorerItemAdd('');
-
-      expect(getCurrentStateSpy).not.toHaveBeenCalled();
-    });
-
-    it('should set blockExplorerState', async () => {
-      const instance = wrapper.instance();
-      const getCurrentStateSpy = jest.spyOn(instance, 'getCurrentState');
-
-      await instance.onBlockExplorerItemAdd('https://etherscan.io');
-
-      expect(wrapper.state('blockExplorerUrls').length).toBe(1);
-      expect(getCurrentStateSpy).toHaveBeenCalled();
-    });
-
-    it('should not validate the symbol if useSafeChainsListValidation is false', async () => {
-      const instance = wrapper.instance();
-
-      const validSymbol = 'ETH';
-
-      await instance.validateSymbol(validSymbol);
-
-      expect(instance.state.warningSymbol).toBeUndefined(); // No warning for valid symbol
-    });
-
-    it('should not show symbol warning for whitelisted ticker', async () => {
-      const instance = wrapper.instance();
-
-      // Set up state with a whitelisted symbol combination
-      instance.setState({
-        chainId: '0x3e7', // HYPER_EVM chain ID
-        ticker: 'HYPE',
-      });
-
-      await instance.validateSymbol();
-
-      expect(instance.state.warningSymbol).toBeUndefined(); // No warning for valid symbol
-    });
-
-    it('should not show warning symbol for Sepolia when getting symbol from network configuration', async () => {
-      const instance = wrapper.instance();
-
-      wrapper.setProps({
-        useSafeChainsListValidation: true,
-        networkConfigurations: {
-          '0xaa36a7': {
-            chainId: '0xaa36a7',
-            defaultBlockExplorerUrlIndex: 0,
-            defaultRpcEndpointIndex: 0,
-            name: 'Sepolia',
-            nativeCurrency: 'SepoliaETH',
-          },
-        },
-      });
-
-      instance.setState({
-        chainId: '0xaa36a7', // Sepolia chain ID
-        ticker: 'SepoliaETH',
-      });
-
-      await instance.validateSymbol();
-
-      expect(instance.state.warningSymbol).toBeUndefined(); // No warning for valid symbol
-    });
-
-    it('should fallback to chainToMatch symbol if network configuration is not found and show warning symbol', async () => {
-      const instance = wrapper.instance();
-
-      wrapper.setProps({
-        useSafeChainsListValidation: true,
-        networkConfigurations: {},
-      });
-
-      instance.setState({
-        chainId: '0xaa36a7', // Sepolia chain ID
-        ticker: 'SepoliaETH',
-      });
-
-      const chainToMatch = {
-        name: 'Test Network',
-        nativeCurrency: { symbol: 'TEST' },
-      };
-      await instance.validateSymbol(chainToMatch);
-
-      expect(instance.state.warningSymbol).toBe('TEST');
-    });
-
-    it('should validateChainIdOnSubmit', async () => {
-      const instance = wrapper.instance();
-
-      const validChainId = '0x38';
-
-      await instance.validateChainIdOnSubmit(
-        validChainId,
-        validChainId,
-        'https://bsc-dataseed.binance.org/',
-      );
-
-      expect(instance.state.warningChainId).toBeUndefined();
-    });
-
-    it('should set a warning when chainId is not valid', async () => {
-      const instance = wrapper.instance();
-
-      const validChainId = '0xInvalidChainId';
-
-      await instance.validateChainIdOnSubmit(validChainId);
-
-      expect(instance.state.warningChainId).toBe(
-        'Could not fetch chain ID. Is your RPC URL correct?',
-      );
-    });
-
-    it('should return without updating warningName when useSafeChainsListValidation is false', () => {
-      const instance = wrapper.instance();
-
-      instance.props.useSafeChainsListValidation = false; // Disable validation
-
-      instance.validateName();
-
-      // Make sure warningName wasn't updated
-      expect(instance.state.warningName).toBeUndefined();
-    });
-
-    it('should set warningName to undefined if chainToMatch name is the same as nickname', () => {
-      const instance = wrapper.instance();
-
-      const chainToMatch = { name: 'Test Network' };
-
-      instance.validateName(chainToMatch);
-
-      expect(instance.state.warningName).toBeUndefined();
-    });
-
-    it('should set warningName to undefined when networkList name is the same as nickname', () => {
-      const instance = wrapper.instance();
-
-      instance.setState({
-        networkList: {
-          name: 'Test Network', // same as nickname
-        },
-      });
-
-      instance.validateName();
-
-      expect(instance.state.warningName).toBeUndefined();
-    });
-
-    it('should update rpcUrl, set validatedRpcURL to false, and call validation methods', async () => {
-      const instance = wrapper.instance();
-
-      const validateNameSpy = jest.spyOn(instance, 'validateName');
-      const validateChainIdSpy = jest.spyOn(instance, 'validateChainId');
-      const validateSymbolSpy = jest.spyOn(instance, 'validateSymbol');
-      const getCurrentStateSpy = jest.spyOn(instance, 'getCurrentState');
-
-      // Mock initial state
-      instance.setState({
-        addMode: true,
-      });
-
-      // Call the function
-      await instance.onRpcUrlChangeWithName(
-        'https://example.com',
-        undefined,
-        'Test Network',
-        'Custom',
-      );
-
-      // Assert that state was updated
-      expect(wrapper.state('rpcUrl')).toBe('https://example.com');
-      expect(wrapper.state('validatedRpcURL')).toBe(false);
-      expect(wrapper.state('rpcName')).toBe('Test Network');
-      expect(wrapper.state('warningRpcUrl')).toBeUndefined();
-      expect(wrapper.state('warningChainId')).toBeUndefined();
-      expect(wrapper.state('warningSymbol')).toBeUndefined();
-      expect(wrapper.state('warningName')).toBeUndefined();
-
-      // Assert that the validation methods were called
-      expect(validateNameSpy).toHaveBeenCalled();
-      expect(validateChainIdSpy).toHaveBeenCalled();
-      expect(validateSymbolSpy).toHaveBeenCalled();
-      expect(getCurrentStateSpy).toHaveBeenCalled();
-    });
-
-    it('should set rpcName to type if name is not provided', async () => {
-      const instance = wrapper.instance();
-
-      await instance.onRpcUrlChangeWithName(
-        'https://example.com',
-        undefined,
-        null,
-        'Custom',
-      );
-
-      expect(wrapper.state('rpcName')).toBe('Custom');
-    });
-
-    it('should not call validateChainId if addMode is false', async () => {
-      const instance = wrapper.instance();
-
-      const validateChainIdSpy = jest.spyOn(instance, 'validateChainId');
-
-      // Set addMode to false
-      instance.setState({
-        addMode: false,
-      });
-
-      await instance.onRpcUrlChangeWithName(
-        'https://example.com',
-        undefined,
-        'Test Network',
-        'Custom',
-      );
-
-      // ValidateChainId should not be called
-      expect(validateChainIdSpy).not.toHaveBeenCalled();
-    });
-  });
-
-  describe('NetworkSettings componentDidMount', () => {
-    it('should correctly initialize state when networkTypeOrRpcUrl is provided', () => {
-      const SAMPLE_NETWORKSETTINGS_PROPS_2 = {
-        analytics: mockAnalytics,
-        route: {
-          params: {
-            network: 'mainnet',
-          },
-        },
-        navigation: {
-          setOptions: jest.fn(),
-          navigate: jest.fn(),
-          goBack: jest.fn(),
-        },
-        networkConfigurations: {
-          '0x1': {
-            blockExplorerUrls: ['https://etherscan.io'],
-            defaultBlockExplorerUrlIndex: 0,
-            defaultRpcEndpointIndex: 0,
-            chainId: '0x1',
-            rpcEndpoints: [
-              {
-                networkClientId: 'mainnet',
-                type: 'Infura',
-                url: 'https://mainnet.infura.io/v3/',
-              },
-            ],
-            name: 'Ethereum Main Network',
-            nativeCurrency: 'ETH',
-          },
-        },
-      };
-
-      // Reinitialize the component with new props
-      const wrapper2 = shallow(
-        <Provider store={store}>
-          <NetworkSettings {...SAMPLE_NETWORKSETTINGS_PROPS_2} />
-        </Provider>,
-      )
-        .find(NetworkSettings)
-        .dive();
-
-      const instance2 = wrapper2.instance();
-
-      // Simulate component mounting
-      instance2.componentDidMount?.();
-
-      // Check if state was initialized correctly
-      expect(wrapper2.state('blockExplorerUrl')).toBe('https://etherscan.io');
-      expect(wrapper2.state('nickname')).toBe('Ethereum Main Network');
-      expect(wrapper2.state('chainId')).toBe('0x1');
-      expect(wrapper2.state('rpcUrl')).toBe('https://mainnet.infura.io/v3/');
-    });
-
-    it('should set addMode to true if no networkTypeOrRpcUrl is provided', () => {
-      const SAMPLE_NETWORKSETTINGS_PROPS_3 = {
-        analytics: mockAnalytics,
-        route: {
-          params: {},
-        },
-        navigation: {
-          setOptions: jest.fn(),
-          navigate: jest.fn(),
-          goBack: jest.fn(),
-        },
-      };
-
-      // Reinitialize the component without networkTypeOrRpcUrl
-      const wrapper3 = shallow(
-        <Provider store={store}>
-          <NetworkSettings {...SAMPLE_NETWORKSETTINGS_PROPS_3} />
-        </Provider>,
-      )
-        .find(NetworkSettings)
-        .dive();
-
-      const instance3 = wrapper3.instance();
-
-      // Simulate component mounting
-      instance3.componentDidMount?.();
-
-      // Check if state was initialized with addMode set to true
-      expect(wrapper3.state('addMode')).toBe(true);
-    });
-
-    it('should handle cases where the network is custom', () => {
-      const SAMPLE_NETWORKSETTINGS_PROPS_4 = {
-        analytics: mockAnalytics,
-        route: {
-          params: { network: 'https://custom-network.io' },
-        },
-        navigation: {
-          setOptions: jest.fn(),
-          navigate: jest.fn(),
-          goBack: jest.fn(),
-        },
-        networkConfigurations: {
-          '0x123': {
-            blockExplorerUrls: ['https://custom-explorer.io'],
-            chainId: '0x123',
-            defaultRpcEndpointIndex: 0,
-            rpcEndpoints: [
-              {
-                url: 'https://custom-network.io',
-                type: RpcEndpointType.Custom,
-              },
-            ],
-            name: 'Custom Network',
-            nativeCurrency: 'CUST',
-          },
-        },
-      };
-
-      // Reinitialize the component with custom network
-      const wrapper4 = shallow(
-        <Provider store={store}>
-          <NetworkSettings {...SAMPLE_NETWORKSETTINGS_PROPS_4} />
-        </Provider>,
-      )
-        .find(NetworkSettings)
-        .dive();
-
-      const instance4 = wrapper4.instance();
-
-      // Simulate component mounting
-      instance4.componentDidMount?.();
-
-      // Check if state was initialized correctly for the custom network
-      expect(wrapper4.state('nickname')).toBe('Custom Network');
-      expect(wrapper4.state('chainId')).toBe('0x123');
-      expect(wrapper4.state('rpcUrl')).toBe('https://custom-network.io');
-    });
-
-    it('should call validateRpcAndChainId when matchedChainNetwork changes', () => {
-      const instance = wrapper.instance();
-
-      const validateRpcAndChainIdSpy = jest.spyOn(
-        wrapper.instance(),
-        'validateRpcAndChainId',
-      );
-      const updateNavBarSpy = jest.spyOn(wrapper.instance(), 'updateNavBar');
-
-      const prevProps = {
-        matchedChainNetwork: {
-          id: 'network1',
-        },
-      };
-
-      // Simulate a prop change
-      wrapper.setProps({
-        matchedChainNetwork: {
-          id: 'network2',
-        },
-      });
-
-      instance.componentDidUpdate(prevProps);
-
-      expect(updateNavBarSpy).toHaveBeenCalled();
-      expect(validateRpcAndChainIdSpy).toHaveBeenCalled();
-    });
-
-    it('uses fallback block explorer URL when blockExplorerUrls is empty', () => {
-      const propsWithEmptyBlockExplorerUrls = {
-        route: {
-          params: {
-            network: 'mainnet',
-          },
-        },
-        navigation: {
-          setOptions: jest.fn(),
-          navigate: jest.fn(),
-          goBack: jest.fn(),
-        },
-        networkConfigurations: {
-          '0x1': {
-            blockExplorerUrls: [], // Empty array - should trigger fallback
-            defaultBlockExplorerUrlIndex: 0,
-            defaultRpcEndpointIndex: 0,
-            chainId: '0x1',
-            rpcEndpoints: [
-              {
-                networkClientId: 'mainnet',
-                type: 'Infura',
-                url: 'https://mainnet.infura.io/v3/',
-              },
-            ],
-            name: 'Ethereum Main Network',
-            nativeCurrency: 'ETH',
-          },
-        },
-      };
-
-      const wrapperWithFallback = shallow(
-        <Provider store={store}>
-          <NetworkSettings {...propsWithEmptyBlockExplorerUrls} />
-        </Provider>,
-      )
-        .find(NetworkSettings)
-        .dive();
-
-      const instanceWithFallback = wrapperWithFallback.instance();
-      instanceWithFallback.componentDidMount?.();
-
-      // Fallback should use BlockExplorerUrl['mainnet'] = 'https://etherscan.io'
-      expect(wrapperWithFallback.state('blockExplorerUrl')).toBe(
-        'https://etherscan.io',
-      );
-      expect(wrapperWithFallback.state('blockExplorerUrls')).toEqual([
-        'https://etherscan.io',
-      ]);
-    });
-  });
-
-  describe('NetworkSettings - handleNetworkUpdate', () => {
-    const mockNavigation = {
-      navigate: jest.fn(),
-      goBack: jest.fn(),
-    };
-
-    const SAMPLE_PROPS = {
-      route: {
-        params: {
-          network: 'mainnet',
-        },
-      },
-      navigation: {
-        setOptions: jest.fn(),
-        navigate: jest.fn(),
-        goBack: jest.fn(),
-      },
-      networkConfigurations: {
-        '0x1': {
-          blockExplorerUrls: ['https://etherscan.io'],
-          defaultBlockExplorerUrlIndex: 0,
-          defaultRpcEndpointIndex: 0,
-          chainId: '0x1',
-          rpcEndpoints: [
-            {
-              networkClientId: 'mainnet',
-              type: 'Infura',
-              url: 'https://mainnet.infura.io/v3/',
-            },
-          ],
-          name: 'Ethereum Main Network',
-          nativeCurrency: 'ETH',
-        },
-      },
-    };
-
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    const wrapper4: any = shallow(
-      <Provider store={store}>
-        <NetworkSettings {...SAMPLE_PROPS} />
-      </Provider>,
-    )
-      .find(NetworkSettings)
-      .dive();
-    afterEach(() => {
-      jest.clearAllMocks();
-    });
-
-    it('should update the network if the network exists', async () => {
-      const instance = wrapper4.instance();
-
-      await instance.handleNetworkUpdate({
-        rpcUrl: 'http://localhost:8080',
-        rpcUrls: [
-          {
-            url: 'http://localhost:8080',
-            type: 'custom',
-            name: '',
-          },
-        ],
-        blockExplorerUrls: ['https://etherscan.io'],
-        isNetworkExists: [],
-        chainId: '0x1',
-        navigation: mockNavigation,
-      });
-
-      expect(
-        Engine.context.NetworkController.updateNetwork,
-      ).toHaveBeenCalledWith(
-        '0x1', // chainId
-        expect.objectContaining({
-          blockExplorerUrls: ['https://etherscan.io'],
-          chainId: '0x1',
-          defaultBlockExplorerUrlIndex: undefined,
-          defaultRpcEndpointIndex: 0,
-          name: undefined,
-          nativeCurrency: undefined,
-          rpcEndpoints: [
-            {
-              name: '',
-              type: 'custom',
-              url: 'http://localhost:8080',
-            },
-          ],
-        }),
-        { replacementSelectedRpcEndpointIndex: 0 },
-      );
-    });
-
-    it('tracks RPC update event when trackRpcUpdateFromBanner is true', async () => {
-      const PROPS_WITH_METRICS = {
-        ...SAMPLE_PROPS,
-        analytics: {
-          trackEvent: mockTrackEvent,
-          createEventBuilder: mockCreateEventBuilder,
-        },
-        networkConfigurations: {
-          '0x64': {
-            blockExplorerUrls: ['https://etherscan.io'],
-            defaultBlockExplorerUrlIndex: 0,
-            defaultRpcEndpointIndex: 0,
-            chainId: '0x64',
-            rpcEndpoints: [
-              {
-                networkClientId: 'custom',
-                type: 'custom',
-                url: 'https://mainnet.infura.io/v3/',
-              },
-            ],
-            name: 'Custom Network',
-            nativeCurrency: 'ETH',
-          },
-        },
-      };
-
-      const wrapper5 = shallow(
-        <Provider store={store}>
-          <NetworkSettings {...PROPS_WITH_METRICS} />
-        </Provider>,
-      )
-        .find(NetworkSettings)
-        .dive();
-
-      const instance = wrapper5.instance() as NetworkSettings;
-
-      await instance.handleNetworkUpdate({
-        rpcUrl: 'https://monad-mainnet.infura.io/v3/',
-        rpcUrls: [
-          {
-            url: 'https://monad-mainnet.infura.io/v3/',
-            type: 'custom',
-            name: 'Monad RPC',
-          },
-        ],
-        blockExplorerUrls: ['https://etherscan.io'],
-        blockExplorerUrl: 'https://etherscan.io',
-        nickname: 'Custom Network',
-        ticker: 'ETH',
-        isNetworkExists: [],
-        chainId: '0x64',
-        navigation: mockNavigation,
-        isCustomMainnet: false,
-        shouldNetworkSwitchPopToWallet: true,
-        trackRpcUpdateFromBanner: true,
-      });
-
-      expect(Engine.context.NetworkController.updateNetwork).toHaveBeenCalled();
-      expect(mockTrackEvent).toHaveBeenCalledWith(
-        mockCreateEventBuilder(
-          MetaMetricsEvents.NetworkConnectionBannerRpcUpdated,
-        )
-          .addProperties({
-            chain_id_caip: 'eip155:100',
-            from_rpc_domain: 'mainnet.infura.io',
-            to_rpc_domain: 'monad-mainnet.infura.io',
-          })
-          .build(),
-      );
-    });
-
-    it('does not track RPC update event when trackRpcUpdateFromBanner is false', async () => {
-      const PROPS_WITHOUT_TRACKING = {
-        ...SAMPLE_PROPS,
-        analytics: {
-          trackEvent: mockTrackEvent,
-          createEventBuilder: mockCreateEventBuilder,
-        },
-        networkConfigurations: {
-          '0x64': {
-            blockExplorerUrls: ['https://etherscan.io'],
-            defaultBlockExplorerUrlIndex: 0,
-            defaultRpcEndpointIndex: 0,
-            chainId: '0x64',
-            rpcEndpoints: [
-              {
-                networkClientId: 'custom',
-                type: 'custom',
-                url: 'https://mainnet.infura.io/v3/',
-              },
-            ],
-            name: 'Custom Network',
-            nativeCurrency: 'ETH',
-          },
-        },
-      };
-
-      const wrapper6 = shallow(
-        <Provider store={store}>
-          <NetworkSettings {...PROPS_WITHOUT_TRACKING} />
-        </Provider>,
-      )
-        .find(NetworkSettings)
-        .dive();
-
-      const instance = wrapper6.instance() as NetworkSettings;
-
-      await instance.handleNetworkUpdate({
-        rpcUrl: 'https://monad-mainnet.infura.io/v3/',
-        rpcUrls: [
-          {
-            url: 'https://monad-mainnet.infura.io/v3/',
-            type: 'custom',
-            name: 'Monad RPC',
-          },
-        ],
-        blockExplorerUrls: ['https://etherscan.io'],
-        blockExplorerUrl: 'https://etherscan.io',
-        nickname: 'Custom Network',
-        ticker: 'ETH',
-        isNetworkExists: [],
-        chainId: '0x64',
-        navigation: mockNavigation,
-        isCustomMainnet: false,
-        shouldNetworkSwitchPopToWallet: true,
-        trackRpcUpdateFromBanner: false,
-      });
-
-      expect(Engine.context.NetworkController.updateNetwork).toHaveBeenCalled();
-      expect(mockTrackEvent).not.toHaveBeenCalled();
-    });
-
-    it('sanitizes custom RPC URLs as "custom" in tracking event', async () => {
-      const PROPS_WITH_CUSTOM_RPC = {
-        ...SAMPLE_PROPS,
-        analytics: {
-          trackEvent: mockTrackEvent,
-          createEventBuilder: mockCreateEventBuilder,
-        },
-        networkConfigurations: {
-          '0x64': {
-            blockExplorerUrls: ['https://etherscan.io'],
-            defaultBlockExplorerUrlIndex: 0,
-            defaultRpcEndpointIndex: 0,
-            chainId: '0x64',
-            rpcEndpoints: [
-              {
-                networkClientId: 'custom',
-                type: 'custom',
-                url: 'https://my-private-rpc.com',
-              },
-            ],
-            name: 'Custom Network',
-            nativeCurrency: 'ETH',
-          },
-        },
-      };
-
-      const wrapper7 = shallow(
-        <Provider store={store}>
-          <NetworkSettings {...PROPS_WITH_CUSTOM_RPC} />
-        </Provider>,
-      )
-        .find(NetworkSettings)
-        .dive();
-
-      const instance = wrapper7.instance() as NetworkSettings;
-
-      await instance.handleNetworkUpdate({
-        rpcUrl: 'https://another-private-rpc.com',
-        rpcUrls: [
-          {
-            url: 'https://another-private-rpc.com',
-            type: 'custom',
-            name: 'Another Custom RPC',
-          },
-        ],
-        blockExplorerUrls: ['https://etherscan.io'],
-        blockExplorerUrl: 'https://etherscan.io',
-        nickname: 'Custom Network',
-        ticker: 'ETH',
-        isNetworkExists: [],
-        chainId: '0x64',
-        navigation: mockNavigation,
-        isCustomMainnet: false,
-        shouldNetworkSwitchPopToWallet: true,
-        trackRpcUpdateFromBanner: true,
-      });
-
-      expect(Engine.context.NetworkController.updateNetwork).toHaveBeenCalled();
-      expect(mockTrackEvent).toHaveBeenCalledWith(
-        mockCreateEventBuilder(
-          MetaMetricsEvents.NetworkConnectionBannerRpcUpdated,
-        )
-          .addProperties({
-            chain_id_caip: 'eip155:100',
-            from_rpc_domain: 'custom',
-            to_rpc_domain: 'custom',
-          })
-          .build(),
-      );
-    });
-
-    it('tracks unknown for missing old RPC endpoint', async () => {
-      const PROPS_WITHOUT_OLD_ENDPOINT = {
-        ...SAMPLE_PROPS,
-        analytics: {
-          trackEvent: mockTrackEvent,
-          createEventBuilder: mockCreateEventBuilder,
-        },
-        networkConfigurations: {
-          '0x64': {
-            blockExplorerUrls: ['https://etherscan.io'],
-            defaultBlockExplorerUrlIndex: 0,
-            defaultRpcEndpointIndex: undefined,
-            chainId: '0x64',
-            rpcEndpoints: [],
-            name: 'Custom Network',
-            nativeCurrency: 'ETH',
-          },
-        },
-      };
-
-      const wrapper8 = shallow(
-        <Provider store={store}>
-          <NetworkSettings {...PROPS_WITHOUT_OLD_ENDPOINT} />
-        </Provider>,
-      )
-        .find(NetworkSettings)
-        .dive();
-
-      const instance = wrapper8.instance() as NetworkSettings;
-
-      await instance.handleNetworkUpdate({
-        rpcUrl: 'https://new-rpc.infura.io/v3/',
-        rpcUrls: [
-          {
-            url: 'https://new-rpc.infura.io/v3/',
-            type: 'custom',
-            name: 'New RPC',
-          },
-        ],
-        blockExplorerUrls: ['https://etherscan.io'],
-        blockExplorerUrl: 'https://etherscan.io',
-        nickname: 'Custom Network',
-        ticker: 'ETH',
-        isNetworkExists: [],
-        chainId: '0x64',
-        navigation: mockNavigation,
-        isCustomMainnet: false,
-        shouldNetworkSwitchPopToWallet: true,
-        trackRpcUpdateFromBanner: true,
-      });
-
-      expect(Engine.context.NetworkController.updateNetwork).toHaveBeenCalled();
-      expect(mockTrackEvent).toHaveBeenCalledWith(
-        mockCreateEventBuilder(
-          MetaMetricsEvents.NetworkConnectionBannerRpcUpdated,
-        )
-          .addProperties({
-            chain_id_caip: 'eip155:100',
-            from_rpc_domain: 'unknown',
-            to_rpc_domain: 'new-rpc.infura.io',
-          })
-          .build(),
-      );
-    });
-  });
-
-  describe('checkIfRpcUrlExists', () => {
-    // Mock network configurations
-    const networkConfigurations = {
-      '0x1': {
-        chainId: '0x1',
-        name: 'Mainnet',
-        rpcEndpoints: [
-          {
-            url: 'https://mainnet.infura.io/v3/{infuraProjectId}',
-          },
-        ],
-      },
-      '0x5': {
-        chainId: '0x5',
-        name: 'Goerli',
-        rpcEndpoints: [
-          {
-            type: 'custom',
-            networkClientId: 'goerli',
-            url: 'https://goerli.infura.io/v3/{infuraProjectId}',
-          },
-        ],
-      },
-    };
-
-    it('should return matching custom network if RPC URL exists in networkConfigurations', async () => {
-      const rpcUrl = 'https://goerli.infura.io/v3/{infuraProjectId}';
-      const instance = wrapper.instance();
-      const result = await instance.checkIfRpcUrlExists(rpcUrl);
-
-      expect(result).toEqual([networkConfigurations['0x5']]);
-    });
-
-    it('should return an empty array if the RPC URL does not exist', async () => {
-      const rpcUrl = 'https://random.network.io';
-      const instance = wrapper.instance();
-      const result = await instance.checkIfRpcUrlExists(rpcUrl);
-
-      expect(result).toEqual([]);
-    });
-
-    it('should return an empty array if the RPC URL does not exist with no rpcEndpointUrls present', async () => {
-      const rpcUrl = 'https://random.network.io';
-      const instance = wrapper.instance();
-
-      wrapper.setProps({
-        networkConfigurations: {
-          '0x1': {
-            chainId: '0x1',
-            name: 'Mainnet',
-          },
-        },
-      });
-
-      const result = await instance.checkIfRpcUrlExists(rpcUrl);
-
-      expect(result).toEqual([]);
-    });
-
-    it('should return multiple networks if multiple RPC URLs match', async () => {
-      const instance = wrapper.instance();
-
-      // Add another endpoint with the same RPC URL
-      instance.props.networkConfigurations['0x2'] = {
-        chainId: '0x2',
-        name: 'Another Network',
-        rpcEndpoints: [
-          {
-            type: 'custom',
-            networkClientId: 'goerli',
-            url: 'https://goerli.infura.io/v3/{infuraProjectId}',
-          },
-        ],
-      };
-
-      const rpcUrl = 'https://goerli.infura.io/v3/{infuraProjectId}';
-      const result = await instance.checkIfRpcUrlExists(rpcUrl);
-
-      expect(result).toEqual([
-        networkConfigurations['0x5'],
-        instance.props.networkConfigurations['0x2'],
-      ]);
-    });
-  });
-
-  describe('templateInfuraRpc', () => {
-    it('should not replace anything if {infuraProjectId} is not in endpoint', () => {
-      const instance = wrapper.instance();
-
-      const endpoint = 'https://mainnet.infura.io/v3/someOtherId';
-      const result = instance.templateInfuraRpc(endpoint);
-      expect(result).toBe('https://mainnet.infura.io/v3/someOtherId');
-    });
-
-    it('should replace {infuraProjectId} with an empty string if infuraProjectId is undefined', () => {
-      const instance = wrapper.instance();
-      const endpoint = 'https://mainnet.infura.io/v3/{infuraProjectId}';
-      const result = instance.templateInfuraRpc(endpoint);
-      expect(result).toBe('https://mainnet.infura.io/v3/');
-    });
-
-    it('should return the original endpoint if it does not end with {infuraProjectId}', () => {
-      const instance = wrapper.instance();
-      const endpoint = 'https://mainnet.infura.io/v3/anotherProjectId';
-      const result = instance.templateInfuraRpc(endpoint);
-      expect(result).toBe(endpoint);
-    });
-  });
-
-  describe('validateChainIdOnSubmit', () => {
-    beforeEach(() => {
-      // Spying on the methods we want to mock
-      jest.spyOn(Logger, 'error'); // Spy on Logger.error
-      jest.spyOn(jsonRequest, 'jsonRpcRequest'); // Spy on jsonRpcRequest directly
-    });
-    afterEach(() => {
-      jest.resetAllMocks(); // Clean up mocks after each test
-    });
-
-    it('should validate chainId when parsedChainId matches endpoint chainId', async () => {
-      const instance = wrapper.instance();
-
-      (jsonRequest.jsonRpcRequest as jest.Mock).mockResolvedValue('0x38');
-
-      const validChainId = '0x38';
-      const rpcUrl = 'https://bsc-dataseed.binance.org/';
-
-      await instance.validateChainIdOnSubmit(
-        validChainId,
-        validChainId,
-        rpcUrl,
-      );
-
-      expect(instance.state.warningChainId).toBeUndefined();
-      expect(jsonRequest.jsonRpcRequest).toHaveBeenCalledWith(
-        'https://bsc-dataseed.binance.org/',
-        'eth_chainId',
-      );
-    });
-
-    it('should set a warning when chainId is invalid (RPC error)', async () => {
-      const instance = wrapper.instance();
-
-      (jsonRequest.jsonRpcRequest as jest.Mock).mockRejectedValue(
-        new Error('RPC error'),
-      );
-
-      const invalidChainId = '0xInvalidChainId';
-      const rpcUrl = 'https://bsc-dataseed.binance.org/';
-
-      await instance.validateChainIdOnSubmit(
-        invalidChainId,
-        invalidChainId,
-        rpcUrl,
-      );
-
-      expect(instance.state.warningChainId).toBe(
-        'Could not fetch chain ID. Is your RPC URL correct?',
-      );
-      expect(Logger.error).toHaveBeenCalled(); // Ensures the error is logged
-    });
-
-    it('should set a warning when parsedChainId does not match endpoint chainId', async () => {
-      const instance = wrapper.instance();
-
-      (jsonRequest.jsonRpcRequest as jest.Mock).mockResolvedValue('0x39');
-
-      const validChainId = '0x38';
-      const rpcUrl = 'https://bsc-dataseed.binance.org/';
-
-      await instance.validateChainIdOnSubmit(
-        validChainId,
-        validChainId,
-        rpcUrl,
-      );
-
-      expect(instance.state.warningChainId).toBe(
-        'The endpoint returned a different chain ID: 0x39',
-      );
-    });
-
-    it('should convert endpointChainId to decimal if formChainId is decimal and not hexadecimal', async () => {
-      const instance = wrapper.instance();
-
-      (jsonRequest.jsonRpcRequest as jest.Mock).mockResolvedValue('0x38');
-
-      const decimalChainId = '56'; // Decimal chain ID
-      const rpcUrl = 'https://bsc-dataseed.binance.org/';
-
-      await instance.validateChainIdOnSubmit(
-        decimalChainId,
-        decimalChainId,
-        rpcUrl,
-      );
-
-      expect(instance.state.warningChainId).toBe(
-        'The endpoint returned a different chain ID: 56',
-      );
-    });
-
-    it('should log error if the conversion from hexadecimal to decimal fails', async () => {
-      const instance = wrapper.instance();
-
-      (jsonRequest.jsonRpcRequest as jest.Mock).mockResolvedValue(
-        '0xInvalidHex',
-      );
-
-      const decimalChainId = 'test'; // Invalid decimal chain ID
-      const rpcUrl = 'https://bsc-dataseed.binance.org/';
-
-      await instance.validateChainIdOnSubmit(
-        decimalChainId,
-        decimalChainId,
-        rpcUrl,
-      );
-
-      expect(Logger.error).toHaveBeenCalledWith(expect.any(Error), {
-        endpointChainId: '0xInvalidHex',
-        message: 'Failed to convert endpoint chain ID to decimal',
-      });
-    });
-  });
-
-  describe('addRpcUrl', () => {
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    let instance: any;
-
-    beforeEach(() => {
-      instance = wrapper.instance();
-
-      // Mocking dependent methods
-      jest.spyOn(instance, 'disabledByChainId').mockReturnValue(false);
-      jest.spyOn(instance, 'disabledBySymbol').mockReturnValue(false);
-      jest
-        .spyOn(instance, 'checkIfNetworkNotExistsByChainId')
-        .mockResolvedValue([]);
-      jest.spyOn(instance, 'checkIfNetworkExists').mockResolvedValue(false);
-      jest.spyOn(instance, 'validateChainIdOnSubmit').mockResolvedValue(true);
-      jest.spyOn(instance, 'handleNetworkUpdate').mockResolvedValue({});
-    });
-
-    afterEach(() => {
-      jest.clearAllMocks();
-    });
-
-    it('should add RPC URL correctly', async () => {
-      wrapper.setState({
-        rpcUrl: 'http://localhost:8545',
-        chainId: '0x1',
-        ticker: 'ETH',
-        nickname: 'Localhost',
-        enableAction: true,
-        addMode: true,
-        editable: false,
-      });
-
-      await instance.addRpcUrl();
-
-      expect(instance.handleNetworkUpdate).toHaveBeenCalledWith(
-        expect.objectContaining({
-          rpcUrl: 'http://localhost:8545',
-          chainId: '0x1',
-          ticker: 'ETH',
-          nickname: 'Localhost',
-        }),
-      );
-    });
-
-    it('should return early if CTA is disabled by enableAction', async () => {
-      wrapper.setState({ enableAction: false });
-
-      await instance.addRpcUrl();
-
-      expect(instance.handleNetworkUpdate).not.toHaveBeenCalled();
-    });
-
-    it('should return early if CTA is disabled by chainId', async () => {
-      instance.disabledByChainId.mockReturnValue(true);
-
-      await instance.addRpcUrl();
-
-      expect(instance.handleNetworkUpdate).not.toHaveBeenCalled();
-    });
-
-    it('should return early if CTA is disabled by symbol', async () => {
-      instance.disabledBySymbol.mockReturnValue(true);
-
-      await instance.addRpcUrl();
-
-      expect(instance.handleNetworkUpdate).not.toHaveBeenCalled();
-    });
-
-    it('should not proceed if validateChainIdOnSubmit fails', async () => {
-      instance.validateChainIdOnSubmit.mockResolvedValue(false);
-
-      await instance.addRpcUrl();
-
-      expect(instance.handleNetworkUpdate).not.toHaveBeenCalled();
-    });
-
-    it('should check if network already exists in add mode', async () => {
-      wrapper.setState({ addMode: true, chainId: '0x1', enableAction: true });
-
-      await instance.addRpcUrl();
-
-      expect(instance.checkIfNetworkNotExistsByChainId).toHaveBeenCalledWith(
-        '0x1',
-      );
-      expect(instance.checkIfNetworkExists).not.toHaveBeenCalled();
-    });
-
-    it('should handle custom mainnet condition', async () => {
-      wrapper.setProps({
-        route: {
-          params: {
-            isCustomMainnet: true,
-          },
-        },
-      });
-
-      wrapper.setState({
-        rpcUrl: 'http://localhost:8545',
-        chainId: '0x1',
-        ticker: 'ETH',
-        nickname: 'Localhost',
-        enableAction: true,
-        addMode: true,
-        editable: false,
-      });
-
-      await instance.addRpcUrl();
-
-      expect(instance.handleNetworkUpdate).toHaveBeenCalledWith(
-        expect.objectContaining({
-          isCustomMainnet: true,
-          showNetworkOnboarding: false,
-        }),
-      );
-    });
-
-    it('should handle network switch pop to wallet condition', async () => {
-      wrapper.setProps({
-        route: {
-          params: {
-            shouldNetworkSwitchPopToWallet: false,
-          },
-        },
-      });
-
-      wrapper.setState({
-        rpcUrl: 'http://localhost:8545',
-        chainId: '0x1',
-        ticker: 'ETH',
-        nickname: 'Localhost',
-        enableAction: true,
-        addMode: true,
-        editable: false,
-      });
-
-      await instance.addRpcUrl();
-
-      expect(instance.handleNetworkUpdate).toHaveBeenCalledWith(
-        expect.objectContaining({
-          shouldNetworkSwitchPopToWallet: false,
-        }),
-      );
-    });
-
-    it('should always call setTokenNetworkFilter when adding a network', async () => {
-      const tokenNetworkFilterSpy = jest.spyOn(
-        PreferencesController,
-        'setTokenNetworkFilter',
-      );
-
-      wrapper.setState({
-        rpcUrl: 'http://localhost:8545',
-        chainId: '0x1',
-        ticker: 'ETH',
-        nickname: 'Localhost',
-        enableAction: true,
-      });
-
-      await wrapper.instance().addRpcUrl();
-      // setTokenNetworkFilter is always called regardless of feature flags
-      expect(tokenNetworkFilterSpy).toHaveBeenCalledTimes(1);
-    });
-
-    it('should call setTokenNetworkFilter with correct chainId when adding a network', async () => {
-      const tokenNetworkFilterSpy = jest.spyOn(
-        PreferencesController,
-        'setTokenNetworkFilter',
-      );
-
-      wrapper.setState({
-        rpcUrl: 'http://localhost:8545',
-        chainId: '0x1',
-        ticker: 'ETH',
-        nickname: 'Localhost',
-        enableAction: true,
-      });
-
-      await wrapper.instance().addRpcUrl();
-      expect(tokenNetworkFilterSpy).toHaveBeenCalledTimes(1);
-      expect(tokenNetworkFilterSpy).toHaveBeenCalledWith({ '0x1': true });
-    });
-  });
-
-  describe('checkIfNetworkExists', () => {
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    let instance: any;
-
-    beforeEach(() => {
-      instance = wrapper.instance();
-
-      jest.spyOn(instance, 'setState');
-    });
-
-    afterEach(() => {
-      jest.clearAllMocks(); // Clear all spies after each test
-    });
-
-    it('should return custom network if rpcUrl exists in networkConfigurations and UI redesign is enabled', async () => {
-      const rpcUrl = 'http://localhost:8545';
-
-      // Mocking props and enabling network UI redesign
-      wrapper.setProps({
-        networkConfigurations: {
-          customNetwork1: { rpcUrl },
-        },
-      });
-
-      const result = await instance.checkIfNetworkExists(rpcUrl);
-
-      expect(result).toEqual([{ rpcUrl }]);
-      expect(instance.setState).not.toHaveBeenCalled(); // Should not set warning when redesign is enabled
-    });
-  });
-
-  describe('Network Manager Integration', () => {
-    it('calls NetworkEnablementController.enableNetwork when adding a network', async () => {
-      const { NetworkEnablementController } = Engine.context;
-      const enableNetworkSpy = jest.spyOn(
-        NetworkEnablementController,
-        'enableNetwork',
-      );
-
-      const instance = wrapper.instance();
-
-      jest.spyOn(instance, 'disabledByChainId').mockReturnValue(false);
-      jest.spyOn(instance, 'disabledBySymbol').mockReturnValue(false);
-      jest
-        .spyOn(instance, 'checkIfNetworkNotExistsByChainId')
-        .mockResolvedValue([]);
-      jest.spyOn(instance, 'validateChainIdOnSubmit').mockResolvedValue(true);
-      jest.spyOn(instance, 'handleNetworkUpdate').mockResolvedValue({});
-
-      wrapper.setState({
-        rpcUrl: 'http://localhost:8545',
-        chainId: '0x1',
-        ticker: 'ETH',
-        nickname: 'Localhost',
-        enableAction: true,
-        addMode: true,
-        editable: false,
-        rpcUrls: [{ url: 'http://localhost:8545' }],
-        blockExplorerUrls: [],
-      });
-
-      await instance.addRpcUrl();
-
-      // Verify that enableNetwork was called with the correct chainId
-      expect(enableNetworkSpy).toHaveBeenCalledWith('0x1');
-    });
-
-    it('should have proper Engine controller setup', () => {
-      // Verify that the necessary controllers are available
-      expect(
-        Engine.context.NetworkEnablementController.enableNetwork,
-      ).toBeDefined();
-      expect(Engine.context.NetworkController.addNetwork).toBeDefined();
-      expect(Engine.context.NetworkController.updateNetwork).toBeDefined();
-    });
-  });
-});
-
-describe('NetworkSettings - showNetworkModal', () => {
-  it('should not crash', () => {
-    const networkConfiguration = {
-      blockExplorerUrls: ['https://etherscan.io'],
-      defaultBlockExplorerUrlIndex: 0,
-      defaultRpcEndpointIndex: 0,
-      chainId: '0x1',
-      rpcEndpoints: [
-        {
-          networkClientId: 'mainnet',
-          type: 'Infura',
-          url: 'https://mainnet.infura.io/v3/',
-        },
-      ],
-      name: 'Ethereum Main Network',
-      nativeCurrency: 'ETH',
-    };
-    const props = {
-      route: {
-        params: {
-          network: 'mainnet',
-        },
-      },
-      navigation: {
-        setOptions: jest.fn(),
-        navigate: jest.fn(),
-        goBack: jest.fn(),
-      },
-      networkConfigurations: {
-        '0x1': networkConfiguration,
-      },
-    };
-
-    const wrapper = shallow(
-      <Provider store={store}>
-        <NetworkSettings {...props} />
-      </Provider>,
-    )
-      .find(NetworkSettings)
-      .dive();
-
-    const instance = wrapper.instance() as NetworkSettings;
-
-    expect(() => instance.showNetworkModal(networkConfiguration)).not.toThrow();
-  });
-});
diff --git a/app/components/Views/Settings/NetworksSettings/NetworkSettings/withIsOriginalNativeToken.js b/app/components/Views/Settings/NetworksSettings/NetworkSettings/withIsOriginalNativeToken.js
deleted file mode 100644
index 1cd371ece8cf..000000000000
--- a/app/components/Views/Settings/NetworksSettings/NetworkSettings/withIsOriginalNativeToken.js
+++ /dev/null
@@ -1,29 +0,0 @@
-import React, { useEffect, useState } from 'react';
-import axios from 'axios';
-
-const CHAIN_ID_NETWORK_URL = 'https://chainid.network/chains.json';
-
-const withIsOriginalNativeToken = (WrappedComponent) => {
-  // This is the functional component wrapper that can use hooks
-  const WithIsOriginalNativeTokenWrapper = (props) => {
-    // Use the useSelector hook to access Redux state
-    const [matchedChainNetwork, setMatchedChainNetwork] = useState(null);
-
-    useEffect(() => {
-      axios.get(CHAIN_ID_NETWORK_URL).then(({ data: safeChainsList }) => {
-        setMatchedChainNetwork({
-          safeChainsList: [...safeChainsList],
-        });
-      });
-    }, []);
-
-    // Pass the value from useSelector as a prop to the WrappedComponent
-    return (
-      <WrappedComponent {...props} matchedChainNetwork={matchedChainNetwork} />
-    );
-  };
-
-  return WithIsOriginalNativeTokenWrapper;
-};
-
-export default withIsOriginalNativeToken;
diff --git a/app/components/Views/Settings/NotificationsSettings/CustomNotificationsRow/__snapshots__/index.test.tsx.snap b/app/components/Views/Settings/NotificationsSettings/CustomNotificationsRow/__snapshots__/index.test.tsx.snap
index 43527ea1e2e4..88770c56059e 100644
--- a/app/components/Views/Settings/NotificationsSettings/CustomNotificationsRow/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/Settings/NotificationsSettings/CustomNotificationsRow/__snapshots__/index.test.tsx.snap
@@ -11,7 +11,7 @@ exports[`CustomNotificationsRow should render correctly 1`] = `
   testID="notifications-switch--container"
 >
   <SvgMock
-    color="#121314"
+    color="#131416"
     fill="currentColor"
     height={24}
     name="Sparkle"
@@ -36,9 +36,9 @@ exports[`CustomNotificationsRow should render correctly 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Medium",
-          "fontSize": 18,
+          "fontSize": 20,
           "letterSpacing": 0,
           "lineHeight": 24,
         }
@@ -64,7 +64,7 @@ exports[`CustomNotificationsRow should render correctly 1`] = `
             "alignSelf": "flex-start",
           },
           {
-            "backgroundColor": "#b7bbc866",
+            "backgroundColor": "#b4b4b566",
             "borderRadius": 16,
           },
         ],
@@ -72,7 +72,7 @@ exports[`CustomNotificationsRow should render correctly 1`] = `
     }
     testID="notifications-switch"
     thumbTintColor="#ffffff"
-    tintColor="#b7bbc866"
+    tintColor="#b4b4b566"
     value={false}
   />
 </View>
diff --git a/app/components/Views/Settings/NotificationsSettings/ResetNotificationsButton.test.tsx b/app/components/Views/Settings/NotificationsSettings/ResetNotificationsButton.test.tsx
deleted file mode 100644
index 27d5ee5492ed..000000000000
--- a/app/components/Views/Settings/NotificationsSettings/ResetNotificationsButton.test.tsx
+++ /dev/null
@@ -1,62 +0,0 @@
-import React from 'react';
-import {
-  render,
-  fireEvent,
-  waitFor,
-  screen,
-} from '@testing-library/react-native';
-import {
-  RESET_NOTIFICATIONS_BUTTON_TEST_ID,
-  ResetNotificationsButton,
-} from './ResetNotificationsButton';
-import { useNavigation } from '@react-navigation/native';
-import Routes from '../../../../constants/navigation/Routes';
-
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-type MockVar = any;
-
-jest.mock('@react-navigation/native', () => ({
-  useNavigation: jest.fn(),
-}));
-
-const arrangeMockNavigation = () => {
-  const mockNavigate = jest.fn();
-  const mockUseNavigation = jest.mocked(useNavigation).mockReturnValue({
-    navigate: mockNavigate,
-  } as MockVar);
-
-  return {
-    mockNavigate,
-    mockUseNavigation,
-  };
-};
-
-describe('ResetNotificationsButton', () => {
-  const arrangeMocks = () => ({
-    ...arrangeMockNavigation(),
-  });
-
-  it('renders correctly', () => {
-    arrangeMocks();
-    render(<ResetNotificationsButton />);
-    expect(screen.getByTestId(RESET_NOTIFICATIONS_BUTTON_TEST_ID)).toBeTruthy();
-  });
-
-  it('clicks reset button navigates to modal confirm sheet', async () => {
-    const mocks = arrangeMocks();
-    render(<ResetNotificationsButton />);
-    const button = screen.getByTestId(RESET_NOTIFICATIONS_BUTTON_TEST_ID);
-
-    fireEvent.press(button);
-
-    await waitFor(() => {
-      // Assert new switch call
-      expect(mocks.mockNavigate).toHaveBeenCalledWith(
-        Routes.MODAL.ROOT_MODAL_FLOW,
-        {
-          screen: Routes.SHEET.RESET_NOTIFICATIONS,
-        },
-      );
-    });
-  });
-});
diff --git a/app/components/Views/Settings/NotificationsSettings/ResetNotificationsButton.tsx b/app/components/Views/Settings/NotificationsSettings/ResetNotificationsButton.tsx
deleted file mode 100644
index fa97cdab940e..000000000000
--- a/app/components/Views/Settings/NotificationsSettings/ResetNotificationsButton.tsx
+++ /dev/null
@@ -1,36 +0,0 @@
-import { useNavigation } from '@react-navigation/native';
-import React, { useCallback } from 'react';
-import { strings } from '../../../../../locales/i18n';
-import Button, {
-  ButtonSize,
-  ButtonVariants,
-} from '../../../../component-library/components/Buttons/Button';
-import { useStyles } from '../../../../component-library/hooks';
-import Routes from '../../../../constants/navigation/Routes';
-import { useTheme } from '../../../../util/theme';
-import styleSheet from './NotificationsSettings.styles';
-
-export const RESET_NOTIFICATIONS_BUTTON_TEST_ID = 'reset_notifications_button';
-
-export const ResetNotificationsButton = () => {
-  const navigation = useNavigation();
-  const theme = useTheme();
-  const { styles } = useStyles(styleSheet, { theme });
-
-  const onPressResetNotifications = useCallback(() => {
-    navigation.navigate(Routes.MODAL.ROOT_MODAL_FLOW, {
-      screen: Routes.SHEET.RESET_NOTIFICATIONS,
-    });
-  }, [navigation]);
-
-  return (
-    <Button
-      variant={ButtonVariants.Primary}
-      label={strings('app_settings.reset_notifications')}
-      size={ButtonSize.Md}
-      onPress={onPressResetNotifications}
-      style={styles.button}
-      testID={RESET_NOTIFICATIONS_BUTTON_TEST_ID}
-    />
-  );
-};
diff --git a/app/components/Views/Settings/NotificationsSettings/__snapshots__/index.test.tsx.snap b/app/components/Views/Settings/NotificationsSettings/__snapshots__/index.test.tsx.snap
index 3c152bf099dc..6e0b3e631193 100644
--- a/app/components/Views/Settings/NotificationsSettings/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/Settings/NotificationsSettings/__snapshots__/index.test.tsx.snap
@@ -27,9 +27,9 @@ exports[`NotificationsSettings render matches snapshot 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Medium",
-            "fontSize": 18,
+            "fontSize": 20,
             "letterSpacing": 0,
             "lineHeight": 24,
           }
@@ -54,7 +54,7 @@ exports[`NotificationsSettings render matches snapshot 1`] = `
                 "alignSelf": "flex-end",
               },
               {
-                "backgroundColor": "#b7bbc866",
+                "backgroundColor": "#b4b4b566",
                 "borderRadius": 16,
               },
             ],
@@ -62,7 +62,7 @@ exports[`NotificationsSettings render matches snapshot 1`] = `
         }
         testID="notification-settings-notifications-toggle"
         thumbTintColor="#ffffff"
-        tintColor="#b7bbc866"
+        tintColor="#b4b4b566"
         value={false}
       />
     </View>
@@ -77,7 +77,7 @@ exports[`NotificationsSettings render matches snapshot 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
diff --git a/app/components/Views/Settings/NotificationsSettings/index.tsx b/app/components/Views/Settings/NotificationsSettings/index.tsx
index 4b63b0d2dae8..585241350df7 100644
--- a/app/components/Views/Settings/NotificationsSettings/index.tsx
+++ b/app/components/Views/Settings/NotificationsSettings/index.tsx
@@ -28,7 +28,6 @@ import { MainNotificationToggle } from './MainNotificationToggle';
 import styleSheet, {
   styles as navigationOptionsStyles,
 } from './NotificationsSettings.styles';
-import { ResetNotificationsButton } from './ResetNotificationsButton';
 import SessionHeader from './sectionHeader';
 import { PushNotificationToggle } from './PushNotificationToggle';
 import { useFirstHDWalletAccounts } from './AccountsList.hooks';
@@ -114,9 +113,6 @@ const NotificationsSettings = ({ navigation, route }: Props) => {
               <AccountsList />
             </>
           )}
-
-          {/* Reset Notifications Button */}
-          <ResetNotificationsButton />
         </>
       )}
       <SwitchLoadingModal
@@ -138,7 +134,7 @@ NotificationsSettings.navigationOptions = ({
 }) => ({
   headerLeft: () => (
     <ButtonIcon
-      size={ButtonIconSizes.Lg}
+      size={ButtonIconSizes.Md}
       iconName={IconName.ArrowLeft}
       onPress={() =>
         !isNotificationEnabled
diff --git a/app/components/Views/Settings/PermissionsSettings/PermissionItem/__snapshots__/PermissionItem.test.tsx.snap b/app/components/Views/Settings/PermissionsSettings/PermissionItem/__snapshots__/PermissionItem.test.tsx.snap
index 0da140b6f357..5f6326fd3dec 100644
--- a/app/components/Views/Settings/PermissionsSettings/PermissionItem/__snapshots__/PermissionItem.test.tsx.snap
+++ b/app/components/Views/Settings/PermissionsSettings/PermissionItem/__snapshots__/PermissionItem.test.tsx.snap
@@ -22,7 +22,7 @@ exports[`PermissionItem renders correctly 1`] = `
       <View
         placeholderStyle={
           {
-            "backgroundColor": "#f3f5f9",
+            "backgroundColor": "#f3f3f4",
           }
         }
         useNativeDriver={true}
@@ -67,7 +67,7 @@ exports[`PermissionItem renders correctly 1`] = `
                   "backgroundColor": "#eee",
                 },
                 {
-                  "backgroundColor": "#f3f5f9",
+                  "backgroundColor": "#f3f3f4",
                 },
               ]
             }
@@ -98,9 +98,9 @@ exports[`PermissionItem renders correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Medium",
-            "fontSize": 18,
+            "fontSize": 20,
             "letterSpacing": 0,
             "lineHeight": 24,
           }
@@ -122,7 +122,7 @@ exports[`PermissionItem renders correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -138,7 +138,7 @@ exports[`PermissionItem renders correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 14,
             "letterSpacing": 0,
@@ -153,7 +153,7 @@ exports[`PermissionItem renders correctly 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#686e7d",
+            "color": "#66676a",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -176,7 +176,7 @@ exports[`PermissionItem renders correctly 1`] = `
     }
   >
     <SvgMock
-      color="#121314"
+      color="#131416"
       fill="currentColor"
       height={20}
       name="ArrowRight"
diff --git a/app/components/Views/Settings/SecuritySettings/Sections/MetaMetricsAndDataCollectionSection/MetaMetricsAndDataCollectionSection.test.tsx b/app/components/Views/Settings/SecuritySettings/Sections/MetaMetricsAndDataCollectionSection/MetaMetricsAndDataCollectionSection.test.tsx
index 15da919a6dc4..3a25a846ba94 100644
--- a/app/components/Views/Settings/SecuritySettings/Sections/MetaMetricsAndDataCollectionSection/MetaMetricsAndDataCollectionSection.test.tsx
+++ b/app/components/Views/Settings/SecuritySettings/Sections/MetaMetricsAndDataCollectionSection/MetaMetricsAndDataCollectionSection.test.tsx
@@ -1,9 +1,16 @@
+import React from 'react';
 import { renderScreen } from '../../../../../../util/test/renderWithProvider';
 
 import { backgroundState } from '../../../../../../util/test/initial-root-state';
 
 import MetaMetricsAndDataCollectionSection from './MetaMetricsAndDataCollectionSection';
 import { SecurityPrivacyViewSelectorsIDs } from '../../SecurityPrivacyView.testIds';
+
+const MetaMetricsScreenWithParams = ({
+  route,
+}: {
+  route?: { params?: Record<string, unknown> };
+}) => <MetaMetricsAndDataCollectionSection {...(route?.params || {})} />;
 import { fireEvent, waitFor } from '@testing-library/react-native';
 import { MetaMetricsEvents } from '../../../../../../core/Analytics';
 import Routes from '../../../../../../constants/navigation/Routes';
@@ -312,7 +319,15 @@ describe('MetaMetricsAndDataCollectionSection', () => {
           expect(mockAnalytics.optOut).toHaveBeenCalled();
           expect(mockAlert).toHaveBeenCalled();
           expect(mockAnalytics.identify).not.toHaveBeenCalled();
-          expect(mockAnalytics.trackEvent).not.toHaveBeenCalled();
+          expect(mockAnalytics.trackEvent).toHaveBeenCalledWith(
+            expect.objectContaining({
+              name: MetaMetricsEvents.METRICS_OPT_OUT.category,
+              properties: expect.objectContaining({
+                updated_after_onboarding: true,
+                location: 'settings',
+              }),
+            }),
+          );
         });
       });
 
@@ -363,6 +378,64 @@ describe('MetaMetricsAndDataCollectionSection', () => {
         });
       });
 
+      it('tracks ANALYTICS_PREFERENCE_SELECTED with onboarding_default_settings when turned on from onboarding', async () => {
+        (mockAnalytics.isEnabled as jest.Mock).mockReturnValue(false);
+
+        const { findByTestId } = renderScreen(
+          MetaMetricsScreenWithParams,
+          { name: 'MetaMetricsAndDataCollectionSection' },
+          { state: initialStateMarketingFalse },
+          { analyticsLocation: 'onboarding_default_settings' },
+        );
+
+        const metaMetricsSwitch = await findByTestId(
+          SecurityPrivacyViewSelectorsIDs.METAMETRICS_SWITCH,
+        );
+
+        fireEvent(metaMetricsSwitch, 'valueChange', true);
+
+        await waitFor(() => {
+          expect(mockAnalytics.trackEvent).toHaveBeenCalledWith(
+            expect.objectContaining({
+              name: MetaMetricsEvents.ANALYTICS_PREFERENCE_SELECTED.category,
+              properties: expect.objectContaining({
+                is_metrics_opted_in: true,
+                updated_after_onboarding: true,
+                location: 'onboarding_default_settings',
+              }),
+            }),
+          );
+        });
+      });
+
+      it('tracks METRICS_OPT_OUT with onboarding_default_settings when turned off from onboarding', async () => {
+        (mockAnalytics.isEnabled as jest.Mock).mockReturnValue(true);
+        const { findByTestId } = renderScreen(
+          MetaMetricsScreenWithParams,
+          { name: 'MetaMetricsAndDataCollectionSection' },
+          { state: initialStateMarketingTrue },
+          { analyticsLocation: 'onboarding_default_settings' },
+        );
+
+        const metaMetricsSwitch = await findByTestId(
+          SecurityPrivacyViewSelectorsIDs.METAMETRICS_SWITCH,
+        );
+
+        fireEvent(metaMetricsSwitch, 'valueChange', false);
+
+        await waitFor(() => {
+          expect(mockAnalytics.trackEvent).toHaveBeenCalledWith(
+            expect.objectContaining({
+              name: MetaMetricsEvents.METRICS_OPT_OUT.category,
+              properties: expect.objectContaining({
+                updated_after_onboarding: true,
+                location: 'onboarding_default_settings',
+              }),
+            }),
+          );
+        });
+      });
+
       it('dispatches storePna25Acknowledged when flag is enabled and user enables metrics', async () => {
         (mockAnalytics.isEnabled as jest.Mock).mockReturnValue(false);
         mockSelectIsPna25FlagEnabled.mockReturnValue(true);
@@ -512,7 +585,15 @@ describe('MetaMetricsAndDataCollectionSection', () => {
             expect(mockAnalytics.optOut).toHaveBeenCalled();
             expect(mockAlert).toHaveBeenCalled();
             expect(mockAnalytics.identify).not.toHaveBeenCalled();
-            expect(mockAnalytics.trackEvent).not.toHaveBeenCalled();
+            expect(mockAnalytics.trackEvent).toHaveBeenCalledWith(
+              expect.objectContaining({
+                name: MetaMetricsEvents.METRICS_OPT_OUT.category,
+                properties: expect.objectContaining({
+                  updated_after_onboarding: true,
+                  location: 'settings',
+                }),
+              }),
+            );
           });
         });
 
diff --git a/app/components/Views/Settings/SecuritySettings/Sections/MetaMetricsAndDataCollectionSection/MetaMetricsAndDataCollectionSection.tsx b/app/components/Views/Settings/SecuritySettings/Sections/MetaMetricsAndDataCollectionSection/MetaMetricsAndDataCollectionSection.tsx
index 2d792a64e316..be86bac1415f 100644
--- a/app/components/Views/Settings/SecuritySettings/Sections/MetaMetricsAndDataCollectionSection/MetaMetricsAndDataCollectionSection.tsx
+++ b/app/components/Views/Settings/SecuritySettings/Sections/MetaMetricsAndDataCollectionSection/MetaMetricsAndDataCollectionSection.tsx
@@ -39,11 +39,12 @@ import { useStyles } from '../../../../../../component-library/hooks/useStyles';
 
 interface MetaMetricsAndDataCollectionSectionProps {
   hideMarketingSection?: boolean;
+  analyticsLocation?: 'settings' | 'onboarding_default_settings';
 }
 
 const MetaMetricsAndDataCollectionSection: React.FC<
   MetaMetricsAndDataCollectionSectionProps
-> = ({ hideMarketingSection = false }) => {
+> = ({ hideMarketingSection = false, analyticsLocation = 'settings' }) => {
   const { styles, theme } = useStyles(createStyles, {});
   const { colors } = theme;
   const [analyticsEnabled, setAnalyticsEnabled] = useState(false);
@@ -117,7 +118,7 @@ const MetaMetricsAndDataCollectionSection: React.FC<
           .addProperties({
             is_metrics_opted_in: true,
             updated_after_onboarding: true,
-            location: 'settings',
+            location: analyticsLocation,
           })
           .build(),
       );
@@ -129,8 +130,21 @@ const MetaMetricsAndDataCollectionSection: React.FC<
         dispatch(storePna25Acknowledged());
       }
     } else {
+      // Track opt-out event before calling optOut() to ensure it gets sent
+      analytics.trackEvent(
+        AnalyticsEventBuilder.createEventBuilder(
+          MetaMetricsEvents.METRICS_OPT_OUT,
+        )
+          .addProperties({
+            updated_after_onboarding: true,
+            location: analyticsLocation,
+          })
+          .build(),
+      );
+
       await analytics.optOut();
       setAnalyticsEnabled(false);
+
       if (isDataCollectionForMarketingEnabled) {
         dispatch(setDataCollectionForMarketing(false));
       }
diff --git a/app/components/Views/Settings/SecuritySettings/Sections/MetaMetricsAndDataCollectionSection/__snapshots__/MetaMetricsAndDataCollectionSection.test.tsx.snap b/app/components/Views/Settings/SecuritySettings/Sections/MetaMetricsAndDataCollectionSection/__snapshots__/MetaMetricsAndDataCollectionSection.test.tsx.snap
index e7ed7d28b313..c4c7908b5772 100644
--- a/app/components/Views/Settings/SecuritySettings/Sections/MetaMetricsAndDataCollectionSection/__snapshots__/MetaMetricsAndDataCollectionSection.test.tsx.snap
+++ b/app/components/Views/Settings/SecuritySettings/Sections/MetaMetricsAndDataCollectionSection/__snapshots__/MetaMetricsAndDataCollectionSection.test.tsx.snap
@@ -332,10 +332,10 @@ exports[`MetaMetricsAndDataCollectionSection render matches snapshot 1`] = `
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#121314",
+                              "color": "#131416",
                               "flex": 1,
                               "fontFamily": "Geist-Medium",
-                              "fontSize": 18,
+                              "fontSize": 20,
                               "letterSpacing": 0,
                               "lineHeight": 24,
                             }
@@ -368,7 +368,7 @@ exports[`MetaMetricsAndDataCollectionSection render matches snapshot 1`] = `
                                     "alignSelf": "flex-start",
                                   },
                                   {
-                                    "backgroundColor": "#b7bbc866",
+                                    "backgroundColor": "#b4b4b566",
                                     "borderRadius": 16,
                                   },
                                 ],
@@ -376,7 +376,7 @@ exports[`MetaMetricsAndDataCollectionSection render matches snapshot 1`] = `
                             }
                             testID="metametrics-switch"
                             thumbTintColor="#ffffff"
-                            tintColor="#b7bbc866"
+                            tintColor="#b4b4b566"
                             value={false}
                           />
                         </View>
@@ -385,7 +385,7 @@ exports[`MetaMetricsAndDataCollectionSection render matches snapshot 1`] = `
                         accessibilityRole="text"
                         style={
                           {
-                            "color": "#686e7d",
+                            "color": "#66676a",
                             "fontFamily": "Geist-Regular",
                             "fontSize": 16,
                             "letterSpacing": 0,
@@ -405,7 +405,7 @@ exports[`MetaMetricsAndDataCollectionSection render matches snapshot 1`] = `
                           style={
                             {
                               "backgroundColor": "transparent",
-                              "color": "#121314",
+                              "color": "#131416",
                               "fontFamily": "Geist-Regular",
                               "fontSize": 16,
                               "letterSpacing": 0,
@@ -451,10 +451,10 @@ exports[`MetaMetricsAndDataCollectionSection render matches snapshot 1`] = `
                           accessibilityRole="text"
                           style={
                             {
-                              "color": "#121314",
+                              "color": "#131416",
                               "flex": 1,
                               "fontFamily": "Geist-Medium",
-                              "fontSize": 18,
+                              "fontSize": 20,
                               "letterSpacing": 0,
                               "lineHeight": 24,
                             }
@@ -487,7 +487,7 @@ exports[`MetaMetricsAndDataCollectionSection render matches snapshot 1`] = `
                                     "alignSelf": "flex-start",
                                   },
                                   {
-                                    "backgroundColor": "#b7bbc866",
+                                    "backgroundColor": "#b4b4b566",
                                     "borderRadius": 16,
                                   },
                                 ],
@@ -495,7 +495,7 @@ exports[`MetaMetricsAndDataCollectionSection render matches snapshot 1`] = `
                             }
                             testID="data-collection-switch"
                             thumbTintColor="#ffffff"
-                            tintColor="#b7bbc866"
+                            tintColor="#b4b4b566"
                             value={false}
                           />
                         </View>
@@ -504,7 +504,7 @@ exports[`MetaMetricsAndDataCollectionSection render matches snapshot 1`] = `
                         accessibilityRole="text"
                         style={
                           {
-                            "color": "#686e7d",
+                            "color": "#66676a",
                             "fontFamily": "Geist-Regular",
                             "fontSize": 16,
                             "letterSpacing": 0,
diff --git a/app/components/Views/Settings/SecuritySettings/Sections/ProtectYourWallet/ProtectYourWallet.test.tsx b/app/components/Views/Settings/SecuritySettings/Sections/ProtectYourWallet/ProtectYourWallet.test.tsx
index b87f4238fe16..6fda690bea6c 100644
--- a/app/components/Views/Settings/SecuritySettings/Sections/ProtectYourWallet/ProtectYourWallet.test.tsx
+++ b/app/components/Views/Settings/SecuritySettings/Sections/ProtectYourWallet/ProtectYourWallet.test.tsx
@@ -203,9 +203,9 @@ describe('ProtectYourWallet', () => {
         getByText(strings('reveal_credential.seed_phrase_title')),
       );
       expect(mockNavigation.navigate).toHaveBeenCalledWith(
-        Routes.MODAL.ROOT_MODAL_FLOW,
+        Routes.SETTINGS.REVEAL_PRIVATE_CREDENTIAL,
         {
-          screen: Routes.MODAL.SRP_REVEAL_QUIZ,
+          shouldUpdateNav: true,
         },
       );
     });
diff --git a/app/components/Views/Settings/SecuritySettings/Sections/ProtectYourWallet/ProtectYourWallet.tsx b/app/components/Views/Settings/SecuritySettings/Sections/ProtectYourWallet/ProtectYourWallet.tsx
index b802cd944fa6..3f6ac616feb4 100644
--- a/app/components/Views/Settings/SecuritySettings/Sections/ProtectYourWallet/ProtectYourWallet.tsx
+++ b/app/components/Views/Settings/SecuritySettings/Sections/ProtectYourWallet/ProtectYourWallet.tsx
@@ -49,8 +49,8 @@ const ProtectYourWallet = ({
   const authConnection = useSelector(selectSeedlessOnboardingAuthConnection);
 
   const openSRPQuiz = () => {
-    navigation.navigate(Routes.MODAL.ROOT_MODAL_FLOW, {
-      screen: Routes.MODAL.SRP_REVEAL_QUIZ,
+    navigation.navigate(Routes.SETTINGS.REVEAL_PRIVATE_CREDENTIAL, {
+      shouldUpdateNav: true,
     });
   };
 
diff --git a/app/components/Views/Settings/SecuritySettings/Sections/__snapshots__/BlockaidSettings.test.tsx.snap b/app/components/Views/Settings/SecuritySettings/Sections/__snapshots__/BlockaidSettings.test.tsx.snap
index ac426d852e53..3ea57bf51e55 100644
--- a/app/components/Views/Settings/SecuritySettings/Sections/__snapshots__/BlockaidSettings.test.tsx.snap
+++ b/app/components/Views/Settings/SecuritySettings/Sections/__snapshots__/BlockaidSettings.test.tsx.snap
@@ -17,9 +17,9 @@ exports[`BlockaidSettings should render correctly 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Medium",
-          "fontSize": 18,
+          "fontSize": 20,
           "letterSpacing": 0,
           "lineHeight": 24,
         }
@@ -44,7 +44,7 @@ exports[`BlockaidSettings should render correctly 1`] = `
               "alignSelf": "flex-end",
             },
             {
-              "backgroundColor": "#b7bbc866",
+              "backgroundColor": "#b4b4b566",
               "borderRadius": 16,
             },
           ],
@@ -52,7 +52,7 @@ exports[`BlockaidSettings should render correctly 1`] = `
       }
       testID="security-alerts-toggle"
       thumbTintColor="#ffffff"
-      tintColor="#b7bbc866"
+      tintColor="#b4b4b566"
       value={true}
     />
   </View>,
@@ -60,7 +60,7 @@ exports[`BlockaidSettings should render correctly 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#686e7d",
+        "color": "#66676a",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
@@ -76,7 +76,7 @@ exports[`BlockaidSettings should render correctly 1`] = `
       onPress={[Function]}
       style={
         {
-          "color": "#686e7d",
+          "color": "#66676a",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
diff --git a/app/components/Views/Settings/SecuritySettings/__snapshots__/SecuritySettings.test.tsx.snap b/app/components/Views/Settings/SecuritySettings/__snapshots__/SecuritySettings.test.tsx.snap
index 963e57d349a8..347c2e137750 100644
--- a/app/components/Views/Settings/SecuritySettings/__snapshots__/SecuritySettings.test.tsx.snap
+++ b/app/components/Views/Settings/SecuritySettings/__snapshots__/SecuritySettings.test.tsx.snap
@@ -99,7 +99,7 @@ exports[`SecuritySettings renders correctly 1`] = `
             style={
               [
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "height": 24,
                   "width": 24,
                 },
@@ -140,7 +140,7 @@ exports[`SecuritySettings renders correctly 1`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -196,7 +196,7 @@ exports[`SecuritySettings renders correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 24,
                 "letterSpacing": 0,
@@ -224,9 +224,9 @@ exports[`SecuritySettings renders correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Medium",
-                "fontSize": 18,
+                "fontSize": 20,
                 "letterSpacing": 0,
                 "lineHeight": 24,
               }
@@ -238,7 +238,7 @@ exports[`SecuritySettings renders correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -313,9 +313,9 @@ exports[`SecuritySettings renders correctly 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Medium",
-                    "fontSize": 18,
+                    "fontSize": 16,
                     "letterSpacing": 0,
                     "lineHeight": 24,
                   }
@@ -336,7 +336,7 @@ exports[`SecuritySettings renders correctly 1`] = `
               {
                 "alignItems": "center",
                 "alignSelf": "stretch",
-                "backgroundColor": "#121314",
+                "backgroundColor": "#131416",
                 "borderRadius": 12,
                 "flexDirection": "row",
                 "height": 48,
@@ -375,9 +375,9 @@ exports[`SecuritySettings renders correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Medium",
-                "fontSize": 18,
+                "fontSize": 20,
                 "letterSpacing": 0,
                 "lineHeight": 24,
               }
@@ -389,7 +389,7 @@ exports[`SecuritySettings renders correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -411,7 +411,7 @@ exports[`SecuritySettings renders correctly 1`] = `
               {
                 "alignItems": "center",
                 "alignSelf": "stretch",
-                "backgroundColor": "#121314",
+                "backgroundColor": "#131416",
                 "borderRadius": 12,
                 "flexDirection": "row",
                 "height": 48,
@@ -451,9 +451,9 @@ exports[`SecuritySettings renders correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Medium",
-                "fontSize": 18,
+                "fontSize": 20,
                 "letterSpacing": 0,
                 "lineHeight": 24,
               }
@@ -465,7 +465,7 @@ exports[`SecuritySettings renders correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -479,7 +479,7 @@ exports[`SecuritySettings renders correctly 1`] = `
           <View
             style={
               {
-                "borderColor": "#b7bbc8",
+                "borderColor": "#949596",
                 "borderRadius": 5,
                 "borderWidth": 2,
                 "marginTop": 16,
@@ -515,7 +515,7 @@ exports[`SecuritySettings renders correctly 1`] = `
                       style={
                         {
                           "alignSelf": "flex-start",
-                          "color": "#121314",
+                          "color": "#131416",
                           "flex": 1,
                           "fontFamily": "Geist-Regular",
                           "fontSize": 14,
@@ -531,7 +531,7 @@ exports[`SecuritySettings renders correctly 1`] = `
                       style={
                         [
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "fontSize": 24,
                           },
                           {
@@ -590,10 +590,10 @@ exports[`SecuritySettings renders correctly 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "flex": 1,
                     "fontFamily": "Geist-Medium",
-                    "fontSize": 18,
+                    "fontSize": 20,
                     "letterSpacing": 0,
                     "lineHeight": 24,
                   }
@@ -626,7 +626,7 @@ exports[`SecuritySettings renders correctly 1`] = `
                           "alignSelf": "flex-start",
                         },
                         {
-                          "backgroundColor": "#b7bbc866",
+                          "backgroundColor": "#b4b4b566",
                           "borderRadius": 16,
                         },
                       ],
@@ -634,7 +634,7 @@ exports[`SecuritySettings renders correctly 1`] = `
                   }
                   testID="device-security-toggle"
                   thumbTintColor="#ffffff"
-                  tintColor="#b7bbc866"
+                  tintColor="#b4b4b566"
                   value={false}
                 />
               </View>
@@ -656,9 +656,9 @@ exports[`SecuritySettings renders correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Medium",
-                "fontSize": 18,
+                "fontSize": 20,
                 "letterSpacing": 0,
                 "lineHeight": 24,
               }
@@ -683,7 +683,7 @@ exports[`SecuritySettings renders correctly 1`] = `
                     "alignSelf": "flex-end",
                   },
                   {
-                    "backgroundColor": "#b7bbc866",
+                    "backgroundColor": "#b4b4b566",
                     "borderRadius": 16,
                   },
                 ],
@@ -691,7 +691,7 @@ exports[`SecuritySettings renders correctly 1`] = `
             }
             testID="security-alerts-toggle"
             thumbTintColor="#ffffff"
-            tintColor="#b7bbc866"
+            tintColor="#b4b4b566"
             value={true}
           />
         </View>
@@ -699,7 +699,7 @@ exports[`SecuritySettings renders correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "fontFamily": "Geist-Regular",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -715,7 +715,7 @@ exports[`SecuritySettings renders correctly 1`] = `
             onPress={[Function]}
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -740,7 +740,7 @@ exports[`SecuritySettings renders correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 24,
                 "letterSpacing": 0,
@@ -757,9 +757,9 @@ exports[`SecuritySettings renders correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Medium",
-                "fontSize": 18,
+                "fontSize": 20,
                 "letterSpacing": 0,
                 "lineHeight": 24,
                 "marginTop": 0,
@@ -789,7 +789,7 @@ exports[`SecuritySettings renders correctly 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Bold",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -812,13 +812,13 @@ exports[`SecuritySettings renders correctly 1`] = `
                       "width": 51,
                     },
                     {
-                      "backgroundColor": "#b7bbc866",
+                      "backgroundColor": "#b4b4b566",
                       "borderRadius": 16,
                     },
                   ]
                 }
                 thumbTintColor="#ffffff"
-                tintColor="#b7bbc866"
+                tintColor="#b4b4b566"
                 value={true}
               />
             </View>
@@ -826,7 +826,7 @@ exports[`SecuritySettings renders correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -858,9 +858,9 @@ exports[`SecuritySettings renders correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "fontFamily": "Geist-Medium",
-              "fontSize": 18,
+              "fontSize": 20,
               "letterSpacing": 0,
               "lineHeight": 24,
               "marginTop": 0,
@@ -881,9 +881,9 @@ exports[`SecuritySettings renders correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Medium",
-                "fontSize": 18,
+                "fontSize": 20,
                 "letterSpacing": 0,
                 "lineHeight": 24,
               }
@@ -895,7 +895,7 @@ exports[`SecuritySettings renders correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -924,7 +924,7 @@ exports[`SecuritySettings renders correctly 1`] = `
                 {
                   "alignItems": "center",
                   "alignSelf": "stretch",
-                  "backgroundColor": "#3c4d9d0f",
+                  "backgroundColor": "#b4b4b528",
                   "borderColor": "transparent",
                   "borderRadius": 12,
                   "borderWidth": 1,
@@ -940,7 +940,7 @@ exports[`SecuritySettings renders correctly 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Medium",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -967,9 +967,9 @@ exports[`SecuritySettings renders correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Medium",
-                "fontSize": 18,
+                "fontSize": 20,
                 "letterSpacing": 0,
                 "lineHeight": 24,
               }
@@ -981,7 +981,7 @@ exports[`SecuritySettings renders correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -1010,7 +1010,7 @@ exports[`SecuritySettings renders correctly 1`] = `
                 {
                   "alignItems": "center",
                   "alignSelf": "stretch",
-                  "backgroundColor": "#3c4d9d0f",
+                  "backgroundColor": "#b4b4b528",
                   "borderColor": "transparent",
                   "borderRadius": 12,
                   "borderWidth": 1,
@@ -1027,7 +1027,7 @@ exports[`SecuritySettings renders correctly 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Medium",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -1053,9 +1053,9 @@ exports[`SecuritySettings renders correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Medium",
-                "fontSize": 18,
+                "fontSize": 20,
                 "letterSpacing": 0,
                 "lineHeight": 24,
               }
@@ -1067,7 +1067,7 @@ exports[`SecuritySettings renders correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -1097,7 +1097,7 @@ exports[`SecuritySettings renders correctly 1`] = `
                 {
                   "alignItems": "center",
                   "alignSelf": "stretch",
-                  "backgroundColor": "#3c4d9d0f",
+                  "backgroundColor": "#b4b4b528",
                   "borderColor": "transparent",
                   "borderRadius": 12,
                   "borderWidth": 1,
@@ -1114,7 +1114,7 @@ exports[`SecuritySettings renders correctly 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Medium",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -1138,9 +1138,9 @@ exports[`SecuritySettings renders correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Medium",
-                "fontSize": 18,
+                "fontSize": 20,
                 "letterSpacing": 0,
                 "lineHeight": 24,
               }
@@ -1152,7 +1152,7 @@ exports[`SecuritySettings renders correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -1182,7 +1182,7 @@ exports[`SecuritySettings renders correctly 1`] = `
                 {
                   "alignItems": "center",
                   "alignSelf": "stretch",
-                  "backgroundColor": "#3c4d9d0f",
+                  "backgroundColor": "#b4b4b528",
                   "borderColor": "transparent",
                   "borderRadius": 12,
                   "borderWidth": 1,
@@ -1199,7 +1199,7 @@ exports[`SecuritySettings renders correctly 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Medium",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -1217,9 +1217,9 @@ exports[`SecuritySettings renders correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "fontFamily": "Geist-Medium",
-              "fontSize": 18,
+              "fontSize": 20,
               "letterSpacing": 0,
               "lineHeight": 24,
               "marginTop": 32,
@@ -1248,10 +1248,10 @@ exports[`SecuritySettings renders correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "flex": 1,
                   "fontFamily": "Geist-Medium",
-                  "fontSize": 18,
+                  "fontSize": 20,
                   "letterSpacing": 0,
                   "lineHeight": 24,
                 }
@@ -1283,7 +1283,7 @@ exports[`SecuritySettings renders correctly 1`] = `
                         "alignSelf": "flex-start",
                       },
                       {
-                        "backgroundColor": "#b7bbc866",
+                        "backgroundColor": "#b4b4b566",
                         "borderRadius": 16,
                       },
                     ],
@@ -1291,7 +1291,7 @@ exports[`SecuritySettings renders correctly 1`] = `
                 }
                 testID="display-use-safe-list-validation"
                 thumbTintColor="#ffffff"
-                tintColor="#b7bbc866"
+                tintColor="#b4b4b566"
                 value={true}
               />
             </View>
@@ -1300,7 +1300,7 @@ exports[`SecuritySettings renders correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -1314,7 +1314,7 @@ exports[`SecuritySettings renders correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Bold",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -1333,9 +1333,9 @@ exports[`SecuritySettings renders correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "fontFamily": "Geist-Medium",
-              "fontSize": 18,
+              "fontSize": 20,
               "letterSpacing": 0,
               "lineHeight": 24,
               "marginTop": 32,
@@ -1364,10 +1364,10 @@ exports[`SecuritySettings renders correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "flex": 1,
                   "fontFamily": "Geist-Medium",
-                  "fontSize": 18,
+                  "fontSize": 20,
                   "letterSpacing": 0,
                   "lineHeight": 24,
                 }
@@ -1399,7 +1399,7 @@ exports[`SecuritySettings renders correctly 1`] = `
                         "alignSelf": "flex-start",
                       },
                       {
-                        "backgroundColor": "#b7bbc866",
+                        "backgroundColor": "#b4b4b566",
                         "borderRadius": 16,
                       },
                     ],
@@ -1407,7 +1407,7 @@ exports[`SecuritySettings renders correctly 1`] = `
                 }
                 testID="security-settings-multi-account-balances-switch"
                 thumbTintColor="#ffffff"
-                tintColor="#b7bbc866"
+                tintColor="#b4b4b566"
                 value={true}
               />
             </View>
@@ -1416,7 +1416,7 @@ exports[`SecuritySettings renders correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -1448,10 +1448,10 @@ exports[`SecuritySettings renders correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "flex": 1,
                   "fontFamily": "Geist-Medium",
-                  "fontSize": 18,
+                  "fontSize": 20,
                   "letterSpacing": 0,
                   "lineHeight": 24,
                 }
@@ -1483,14 +1483,14 @@ exports[`SecuritySettings renders correctly 1`] = `
                         "alignSelf": "flex-start",
                       },
                       {
-                        "backgroundColor": "#b7bbc866",
+                        "backgroundColor": "#b4b4b566",
                         "borderRadius": 16,
                       },
                     ],
                   ]
                 }
                 thumbTintColor="#ffffff"
-                tintColor="#b7bbc866"
+                tintColor="#b4b4b566"
                 value={true}
               />
             </View>
@@ -1499,7 +1499,7 @@ exports[`SecuritySettings renders correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -1518,7 +1518,7 @@ exports[`SecuritySettings renders correctly 1`] = `
               style={
                 {
                   "backgroundColor": "transparent",
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -1548,9 +1548,9 @@ exports[`SecuritySettings renders correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "fontFamily": "Geist-Medium",
-              "fontSize": 18,
+              "fontSize": 20,
               "letterSpacing": 0,
               "lineHeight": 24,
               "marginTop": 32,
@@ -1578,10 +1578,10 @@ exports[`SecuritySettings renders correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "flex": 1,
                   "fontFamily": "Geist-Medium",
-                  "fontSize": 18,
+                  "fontSize": 20,
                   "letterSpacing": 0,
                   "lineHeight": 24,
                 }
@@ -1613,7 +1613,7 @@ exports[`SecuritySettings renders correctly 1`] = `
                         "alignSelf": "flex-start",
                       },
                       {
-                        "backgroundColor": "#b7bbc866",
+                        "backgroundColor": "#b4b4b566",
                         "borderRadius": 16,
                       },
                     ],
@@ -1621,7 +1621,7 @@ exports[`SecuritySettings renders correctly 1`] = `
                 }
                 testID="nft-display-media-mode-section"
                 thumbTintColor="#ffffff"
-                tintColor="#b7bbc866"
+                tintColor="#b4b4b566"
                 value={true}
               />
             </View>
@@ -1630,7 +1630,7 @@ exports[`SecuritySettings renders correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -1662,10 +1662,10 @@ exports[`SecuritySettings renders correctly 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "flex": 1,
                     "fontFamily": "Geist-Medium",
-                    "fontSize": 18,
+                    "fontSize": 20,
                     "letterSpacing": 0,
                     "lineHeight": 24,
                   }
@@ -1697,7 +1697,7 @@ exports[`SecuritySettings renders correctly 1`] = `
                           "alignSelf": "flex-start",
                         },
                         {
-                          "backgroundColor": "#b7bbc866",
+                          "backgroundColor": "#b4b4b566",
                           "borderRadius": 16,
                         },
                       ],
@@ -1705,7 +1705,7 @@ exports[`SecuritySettings renders correctly 1`] = `
                   }
                   testID="nft-opensea-autodetect-mode-section"
                   thumbTintColor="#ffffff"
-                  tintColor="#b7bbc866"
+                  tintColor="#b4b4b566"
                   value={true}
                 />
               </View>
@@ -1714,7 +1714,7 @@ exports[`SecuritySettings renders correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -1746,10 +1746,10 @@ exports[`SecuritySettings renders correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "flex": 1,
                   "fontFamily": "Geist-Medium",
-                  "fontSize": 18,
+                  "fontSize": 20,
                   "letterSpacing": 0,
                   "lineHeight": 24,
                 }
@@ -1781,7 +1781,7 @@ exports[`SecuritySettings renders correctly 1`] = `
                         "alignSelf": "flex-start",
                       },
                       {
-                        "backgroundColor": "#b7bbc866",
+                        "backgroundColor": "#b4b4b566",
                         "borderRadius": 16,
                       },
                     ],
@@ -1789,7 +1789,7 @@ exports[`SecuritySettings renders correctly 1`] = `
                 }
                 testID="IPFS_GATEWAY_SECTION"
                 thumbTintColor="#ffffff"
-                tintColor="#b7bbc866"
+                tintColor="#b4b4b566"
                 value={true}
               />
             </View>
@@ -1798,7 +1798,7 @@ exports[`SecuritySettings renders correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -1820,7 +1820,7 @@ exports[`SecuritySettings renders correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -1834,7 +1834,7 @@ exports[`SecuritySettings renders correctly 1`] = `
             <View
               style={
                 {
-                  "borderColor": "#b7bbc8",
+                  "borderColor": "#949596",
                   "borderRadius": 5,
                   "borderWidth": 2,
                   "marginTop": 16,
@@ -1853,9 +1853,9 @@ exports[`SecuritySettings renders correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "fontFamily": "Geist-Medium",
-              "fontSize": 18,
+              "fontSize": 20,
               "letterSpacing": 0,
               "lineHeight": 24,
               "marginTop": 32,
@@ -1884,10 +1884,10 @@ exports[`SecuritySettings renders correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "flex": 1,
                   "fontFamily": "Geist-Medium",
-                  "fontSize": 18,
+                  "fontSize": 20,
                   "letterSpacing": 0,
                   "lineHeight": 24,
                 }
@@ -1920,7 +1920,7 @@ exports[`SecuritySettings renders correctly 1`] = `
                         "alignSelf": "flex-start",
                       },
                       {
-                        "backgroundColor": "#b7bbc866",
+                        "backgroundColor": "#b4b4b566",
                         "borderRadius": 16,
                       },
                     ],
@@ -1928,7 +1928,7 @@ exports[`SecuritySettings renders correctly 1`] = `
                 }
                 testID="metametrics-switch"
                 thumbTintColor="#ffffff"
-                tintColor="#b7bbc866"
+                tintColor="#b4b4b566"
                 value={false}
               />
             </View>
@@ -1937,7 +1937,7 @@ exports[`SecuritySettings renders correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -1957,7 +1957,7 @@ exports[`SecuritySettings renders correctly 1`] = `
               style={
                 {
                   "backgroundColor": "transparent",
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -2003,10 +2003,10 @@ exports[`SecuritySettings renders correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "flex": 1,
                   "fontFamily": "Geist-Medium",
-                  "fontSize": 18,
+                  "fontSize": 20,
                   "letterSpacing": 0,
                   "lineHeight": 24,
                 }
@@ -2039,7 +2039,7 @@ exports[`SecuritySettings renders correctly 1`] = `
                         "alignSelf": "flex-start",
                       },
                       {
-                        "backgroundColor": "#b7bbc866",
+                        "backgroundColor": "#b4b4b566",
                         "borderRadius": 16,
                       },
                     ],
@@ -2047,7 +2047,7 @@ exports[`SecuritySettings renders correctly 1`] = `
                 }
                 testID="data-collection-switch"
                 thumbTintColor="#ffffff"
-                tintColor="#b7bbc866"
+                tintColor="#b4b4b566"
                 value={false}
               />
             </View>
@@ -2056,7 +2056,7 @@ exports[`SecuritySettings renders correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -2079,9 +2079,9 @@ exports[`SecuritySettings renders correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Medium",
-                "fontSize": 18,
+                "fontSize": 20,
                 "letterSpacing": 0,
                 "lineHeight": 24,
               }
@@ -2093,7 +2093,7 @@ exports[`SecuritySettings renders correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -2106,7 +2106,7 @@ exports[`SecuritySettings renders correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -2126,7 +2126,7 @@ exports[`SecuritySettings renders correctly 1`] = `
               style={
                 {
                   "backgroundColor": "transparent",
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -2155,7 +2155,7 @@ exports[`SecuritySettings renders correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -2170,7 +2170,7 @@ exports[`SecuritySettings renders correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#686e7d",
+                  "color": "#66676a",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -2190,7 +2190,7 @@ exports[`SecuritySettings renders correctly 1`] = `
               style={
                 {
                   "backgroundColor": "transparent",
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Regular",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -2234,7 +2234,7 @@ exports[`SecuritySettings renders correctly 1`] = `
                 {
                   "alignItems": "center",
                   "alignSelf": "stretch",
-                  "backgroundColor": "#3c4d9d0f",
+                  "backgroundColor": "#b4b4b528",
                   "borderColor": "transparent",
                   "borderRadius": 12,
                   "borderWidth": 1,
@@ -2251,7 +2251,7 @@ exports[`SecuritySettings renders correctly 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Medium",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -2276,9 +2276,9 @@ exports[`SecuritySettings renders correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Medium",
-                "fontSize": 18,
+                "fontSize": 20,
                 "letterSpacing": 0,
                 "lineHeight": 24,
               }
@@ -2290,7 +2290,7 @@ exports[`SecuritySettings renders correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 16,
                 "letterSpacing": 0,
@@ -2322,7 +2322,7 @@ exports[`SecuritySettings renders correctly 1`] = `
                 {
                   "alignItems": "center",
                   "alignSelf": "stretch",
-                  "backgroundColor": "#3c4d9d0f",
+                  "backgroundColor": "#b4b4b528",
                   "borderColor": "transparent",
                   "borderRadius": 12,
                   "borderWidth": 1,
@@ -2339,7 +2339,7 @@ exports[`SecuritySettings renders correctly 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Medium",
                     "fontSize": 16,
                     "letterSpacing": 0,
diff --git a/app/components/Views/Settings/__snapshots__/index.test.tsx.snap b/app/components/Views/Settings/__snapshots__/index.test.tsx.snap
index acd11a56ec72..f4dfcce1b4da 100644
--- a/app/components/Views/Settings/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/Settings/__snapshots__/index.test.tsx.snap
@@ -100,7 +100,7 @@ exports[`Settings renders settings component with all sections 1`] = `
             style={
               [
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "height": 24,
                   "width": 24,
                 },
@@ -141,7 +141,7 @@ exports[`Settings renders settings component with all sections 1`] = `
           style={
             [
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 16,
                 "fontWeight": 400,
@@ -207,9 +207,9 @@ exports[`Settings renders settings component with all sections 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Medium",
-                    "fontSize": 18,
+                    "fontSize": 20,
                     "letterSpacing": 0,
                     "lineHeight": 24,
                   }
@@ -221,7 +221,7 @@ exports[`Settings renders settings component with all sections 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -250,7 +250,7 @@ exports[`Settings renders settings component with all sections 1`] = `
               testID="listitemcolumn"
             >
               <SvgMock
-                color="#121314"
+                color="#131416"
                 fill="currentColor"
                 height={20}
                 name="ArrowRight"
@@ -301,9 +301,9 @@ exports[`Settings renders settings component with all sections 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Medium",
-                    "fontSize": 18,
+                    "fontSize": 20,
                     "letterSpacing": 0,
                     "lineHeight": 24,
                   }
@@ -315,7 +315,7 @@ exports[`Settings renders settings component with all sections 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -344,7 +344,7 @@ exports[`Settings renders settings component with all sections 1`] = `
               testID="listitemcolumn"
             >
               <SvgMock
-                color="#121314"
+                color="#131416"
                 fill="currentColor"
                 height={20}
                 name="ArrowRight"
@@ -395,9 +395,9 @@ exports[`Settings renders settings component with all sections 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Medium",
-                    "fontSize": 18,
+                    "fontSize": 20,
                     "letterSpacing": 0,
                     "lineHeight": 24,
                   }
@@ -409,7 +409,7 @@ exports[`Settings renders settings component with all sections 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -438,7 +438,7 @@ exports[`Settings renders settings component with all sections 1`] = `
               testID="listitemcolumn"
             >
               <SvgMock
-                color="#121314"
+                color="#131416"
                 fill="currentColor"
                 height={20}
                 name="ArrowRight"
@@ -489,9 +489,9 @@ exports[`Settings renders settings component with all sections 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Medium",
-                    "fontSize": 18,
+                    "fontSize": 20,
                     "letterSpacing": 0,
                     "lineHeight": 24,
                   }
@@ -503,7 +503,7 @@ exports[`Settings renders settings component with all sections 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -532,7 +532,7 @@ exports[`Settings renders settings component with all sections 1`] = `
               testID="listitemcolumn"
             >
               <SvgMock
-                color="#121314"
+                color="#131416"
                 fill="currentColor"
                 height={20}
                 name="ArrowRight"
@@ -583,9 +583,9 @@ exports[`Settings renders settings component with all sections 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Medium",
-                    "fontSize": 18,
+                    "fontSize": 20,
                     "letterSpacing": 0,
                     "lineHeight": 24,
                   }
@@ -597,7 +597,7 @@ exports[`Settings renders settings component with all sections 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -626,7 +626,7 @@ exports[`Settings renders settings component with all sections 1`] = `
               testID="listitemcolumn"
             >
               <SvgMock
-                color="#121314"
+                color="#131416"
                 fill="currentColor"
                 height={20}
                 name="ArrowRight"
@@ -677,9 +677,9 @@ exports[`Settings renders settings component with all sections 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Medium",
-                    "fontSize": 18,
+                    "fontSize": 20,
                     "letterSpacing": 0,
                     "lineHeight": 24,
                   }
@@ -691,7 +691,7 @@ exports[`Settings renders settings component with all sections 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -720,7 +720,7 @@ exports[`Settings renders settings component with all sections 1`] = `
               testID="listitemcolumn"
             >
               <SvgMock
-                color="#121314"
+                color="#131416"
                 fill="currentColor"
                 height={20}
                 name="ArrowRight"
@@ -771,9 +771,9 @@ exports[`Settings renders settings component with all sections 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Medium",
-                    "fontSize": 18,
+                    "fontSize": 20,
                     "letterSpacing": 0,
                     "lineHeight": 24,
                   }
@@ -785,7 +785,7 @@ exports[`Settings renders settings component with all sections 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -814,7 +814,7 @@ exports[`Settings renders settings component with all sections 1`] = `
               testID="listitemcolumn"
             >
               <SvgMock
-                color="#121314"
+                color="#131416"
                 fill="currentColor"
                 height={20}
                 name="ArrowRight"
@@ -865,9 +865,9 @@ exports[`Settings renders settings component with all sections 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Medium",
-                    "fontSize": 18,
+                    "fontSize": 20,
                     "letterSpacing": 0,
                     "lineHeight": 24,
                   }
@@ -879,7 +879,7 @@ exports[`Settings renders settings component with all sections 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -908,7 +908,7 @@ exports[`Settings renders settings component with all sections 1`] = `
               testID="listitemcolumn"
             >
               <SvgMock
-                color="#121314"
+                color="#131416"
                 fill="currentColor"
                 height={20}
                 name="ArrowRight"
@@ -959,9 +959,9 @@ exports[`Settings renders settings component with all sections 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Medium",
-                    "fontSize": 18,
+                    "fontSize": 20,
                     "letterSpacing": 0,
                     "lineHeight": 24,
                   }
@@ -973,7 +973,7 @@ exports[`Settings renders settings component with all sections 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -1002,7 +1002,7 @@ exports[`Settings renders settings component with all sections 1`] = `
               testID="listitemcolumn"
             >
               <SvgMock
-                color="#121314"
+                color="#131416"
                 fill="currentColor"
                 height={20}
                 name="ArrowRight"
@@ -1053,9 +1053,9 @@ exports[`Settings renders settings component with all sections 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Medium",
-                    "fontSize": 18,
+                    "fontSize": 20,
                     "letterSpacing": 0,
                     "lineHeight": 24,
                   }
@@ -1067,7 +1067,7 @@ exports[`Settings renders settings component with all sections 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -1096,7 +1096,7 @@ exports[`Settings renders settings component with all sections 1`] = `
               testID="listitemcolumn"
             >
               <SvgMock
-                color="#121314"
+                color="#131416"
                 fill="currentColor"
                 height={20}
                 name="ArrowRight"
@@ -1147,9 +1147,9 @@ exports[`Settings renders settings component with all sections 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Medium",
-                    "fontSize": 18,
+                    "fontSize": 20,
                     "letterSpacing": 0,
                     "lineHeight": 24,
                   }
@@ -1161,7 +1161,7 @@ exports[`Settings renders settings component with all sections 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -1190,7 +1190,7 @@ exports[`Settings renders settings component with all sections 1`] = `
               testID="listitemcolumn"
             >
               <SvgMock
-                color="#121314"
+                color="#131416"
                 fill="currentColor"
                 height={20}
                 name="ArrowRight"
@@ -1241,9 +1241,9 @@ exports[`Settings renders settings component with all sections 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Medium",
-                    "fontSize": 18,
+                    "fontSize": 20,
                     "letterSpacing": 0,
                     "lineHeight": 24,
                   }
@@ -1270,7 +1270,7 @@ exports[`Settings renders settings component with all sections 1`] = `
               testID="listitemcolumn"
             >
               <SvgMock
-                color="#121314"
+                color="#131416"
                 fill="currentColor"
                 height={20}
                 name="ArrowRight"
@@ -1320,9 +1320,9 @@ exports[`Settings renders settings component with all sections 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Medium",
-                    "fontSize": 18,
+                    "fontSize": 20,
                     "letterSpacing": 0,
                     "lineHeight": 24,
                   }
@@ -1334,7 +1334,7 @@ exports[`Settings renders settings component with all sections 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Regular",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -1363,7 +1363,7 @@ exports[`Settings renders settings component with all sections 1`] = `
               testID="listitemcolumn"
             >
               <SvgMock
-                color="#121314"
+                color="#131416"
                 fill="currentColor"
                 height={20}
                 name="ArrowRight"
@@ -1414,9 +1414,9 @@ exports[`Settings renders settings component with all sections 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Medium",
-                    "fontSize": 18,
+                    "fontSize": 20,
                     "letterSpacing": 0,
                     "lineHeight": 24,
                   }
@@ -1462,9 +1462,9 @@ exports[`Settings renders settings component with all sections 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Medium",
-                    "fontSize": 18,
+                    "fontSize": 20,
                     "letterSpacing": 0,
                     "lineHeight": 24,
                   }
@@ -1512,7 +1512,7 @@ exports[`Settings renders settings component with all sections 1`] = `
                   {
                     "color": "#4459ff",
                     "fontFamily": "Geist-Medium",
-                    "fontSize": 18,
+                    "fontSize": 20,
                     "letterSpacing": 0,
                     "lineHeight": 24,
                   }
diff --git a/app/components/Views/ShowDisplayMediaNFTSheet/__snapshots__/ShowDisplayNFTMediaSheet.test.tsx.snap b/app/components/Views/ShowDisplayMediaNFTSheet/__snapshots__/ShowDisplayNFTMediaSheet.test.tsx.snap
index e73b49295c6b..cdbc73c4bed3 100644
--- a/app/components/Views/ShowDisplayMediaNFTSheet/__snapshots__/ShowDisplayNFTMediaSheet.test.tsx.snap
+++ b/app/components/Views/ShowDisplayMediaNFTSheet/__snapshots__/ShowDisplayNFTMediaSheet.test.tsx.snap
@@ -334,7 +334,7 @@ exports[`ShowNftSheet render matches snapshot 1`] = `
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -384,7 +384,7 @@ exports[`ShowNftSheet render matches snapshot 1`] = `
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -421,7 +421,7 @@ exports[`ShowNftSheet render matches snapshot 1`] = `
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -481,7 +481,7 @@ exports[`ShowNftSheet render matches snapshot 1`] = `
                                   style={
                                     [
                                       {
-                                        "color": "#121314",
+                                        "color": "#131416",
                                         "fontFamily": "Geist-Bold",
                                         "fontSize": 16,
                                         "fontWeight": 400,
@@ -559,7 +559,7 @@ exports[`ShowNftSheet render matches snapshot 1`] = `
                                     style={
                                       [
                                         {
-                                          "color": "#121314",
+                                          "color": "#131416",
                                           "height": 24,
                                           "width": 24,
                                         },
@@ -575,7 +575,7 @@ exports[`ShowNftSheet render matches snapshot 1`] = `
                             accessibilityRole="text"
                             style={
                               {
-                                "color": "#686e7d",
+                                "color": "#66676a",
                                 "fontFamily": "Geist-Regular",
                                 "fontSize": 16,
                                 "letterSpacing": 0,
@@ -590,7 +590,7 @@ exports[`ShowNftSheet render matches snapshot 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#686e7d",
+                                  "color": "#66676a",
                                   "fontFamily": "Geist-Bold",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -610,7 +610,7 @@ exports[`ShowNftSheet render matches snapshot 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#686e7d",
+                                  "color": "#66676a",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -624,7 +624,7 @@ exports[`ShowNftSheet render matches snapshot 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#686e7d",
+                                    "color": "#66676a",
                                     "fontFamily": "Geist-Bold",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -659,7 +659,7 @@ exports[`ShowNftSheet render matches snapshot 1`] = `
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "flex-start",
-                                  "backgroundColor": "#3c4d9d0f",
+                                  "backgroundColor": "#b4b4b528",
                                   "borderColor": "transparent",
                                   "borderRadius": 12,
                                   "borderWidth": 1,
@@ -677,7 +677,7 @@ exports[`ShowNftSheet render matches snapshot 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Medium",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -699,7 +699,7 @@ exports[`ShowNftSheet render matches snapshot 1`] = `
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "flex-start",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flex": 1,
                                   "flexDirection": "row",
diff --git a/app/components/Views/ShowIpfsGatewaySheet/__snapshots__/ShowIpfsGatewaySheet.test.tsx.snap b/app/components/Views/ShowIpfsGatewaySheet/__snapshots__/ShowIpfsGatewaySheet.test.tsx.snap
index af7366ee7552..f15d7a161ecc 100644
--- a/app/components/Views/ShowIpfsGatewaySheet/__snapshots__/ShowIpfsGatewaySheet.test.tsx.snap
+++ b/app/components/Views/ShowIpfsGatewaySheet/__snapshots__/ShowIpfsGatewaySheet.test.tsx.snap
@@ -334,7 +334,7 @@ exports[`ShowIpfsGatewaySheet should render correctly 1`] = `
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -384,7 +384,7 @@ exports[`ShowIpfsGatewaySheet should render correctly 1`] = `
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -421,7 +421,7 @@ exports[`ShowIpfsGatewaySheet should render correctly 1`] = `
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -452,9 +452,9 @@ exports[`ShowIpfsGatewaySheet should render correctly 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Bold",
-                                  "fontSize": 18,
+                                  "fontSize": 20,
                                   "letterSpacing": 0,
                                   "lineHeight": 24,
                                 }
@@ -475,7 +475,7 @@ exports[`ShowIpfsGatewaySheet should render correctly 1`] = `
                             accessibilityRole="text"
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Regular",
                                 "fontSize": 16,
                                 "letterSpacing": 0,
@@ -493,7 +493,7 @@ exports[`ShowIpfsGatewaySheet should render correctly 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -508,7 +508,7 @@ exports[`ShowIpfsGatewaySheet should render correctly 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Bold",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -526,7 +526,7 @@ exports[`ShowIpfsGatewaySheet should render correctly 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Bold",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -558,7 +558,7 @@ exports[`ShowIpfsGatewaySheet should render correctly 1`] = `
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "flex-start",
-                                  "backgroundColor": "#3c4d9d0f",
+                                  "backgroundColor": "#b4b4b528",
                                   "borderColor": "transparent",
                                   "borderRadius": 12,
                                   "borderWidth": 1,
@@ -576,7 +576,7 @@ exports[`ShowIpfsGatewaySheet should render correctly 1`] = `
                                 accessibilityRole="text"
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Medium",
                                     "fontSize": 16,
                                     "letterSpacing": 0,
@@ -598,7 +598,7 @@ exports[`ShowIpfsGatewaySheet should render correctly 1`] = `
                                 {
                                   "alignItems": "center",
                                   "alignSelf": "flex-start",
-                                  "backgroundColor": "#121314",
+                                  "backgroundColor": "#131416",
                                   "borderRadius": 12,
                                   "flex": 1,
                                   "flexDirection": "row",
diff --git a/app/components/Views/ShowTokenIdSheet/__snapshots__/ShowTokenIdSheet.test.tsx.snap b/app/components/Views/ShowTokenIdSheet/__snapshots__/ShowTokenIdSheet.test.tsx.snap
index 37fcde227f36..96b910338b7e 100644
--- a/app/components/Views/ShowTokenIdSheet/__snapshots__/ShowTokenIdSheet.test.tsx.snap
+++ b/app/components/Views/ShowTokenIdSheet/__snapshots__/ShowTokenIdSheet.test.tsx.snap
@@ -334,7 +334,7 @@ exports[`ShowTokenId should render correctly 1`] = `
                         style={
                           [
                             {
-                              "backgroundColor": "#3f434a66",
+                              "backgroundColor": "#0a0d135c",
                               "bottom": 0,
                               "left": 0,
                               "position": "absolute",
@@ -384,7 +384,7 @@ exports[`ShowTokenId should render correctly 1`] = `
                             [
                               {
                                 "backgroundColor": "#ffffff",
-                                "borderColor": "#b7bbc866",
+                                "borderColor": "#b4b4b566",
                                 "borderTopLeftRadius": 24,
                                 "borderTopRightRadius": 24,
                                 "borderWidth": 1,
@@ -421,7 +421,7 @@ exports[`ShowTokenId should render correctly 1`] = `
                             <View
                               style={
                                 {
-                                  "backgroundColor": "#b7bbc866",
+                                  "backgroundColor": "#b4b4b566",
                                   "borderRadius": 2,
                                   "height": 4,
                                   "width": 40,
@@ -452,9 +452,9 @@ exports[`ShowTokenId should render correctly 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Bold",
-                                  "fontSize": 18,
+                                  "fontSize": 20,
                                   "letterSpacing": 0,
                                   "lineHeight": 24,
                                 }
@@ -483,7 +483,7 @@ exports[`ShowTokenId should render correctly 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
diff --git a/app/components/Views/SocialLoginIosUser/__snapshots__/index.test.tsx.snap b/app/components/Views/SocialLoginIosUser/__snapshots__/index.test.tsx.snap
index fa3ed2d80543..5a7a8f169ebf 100644
--- a/app/components/Views/SocialLoginIosUser/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/SocialLoginIosUser/__snapshots__/index.test.tsx.snap
@@ -84,7 +84,7 @@ exports[`SocialLoginIosUser SocialLoginSuccessExistingUser renders match snapsho
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Bold",
             "fontSize": 32,
             "letterSpacing": 0,
@@ -117,7 +117,7 @@ exports[`SocialLoginIosUser SocialLoginSuccessExistingUser renders match snapsho
           {
             "alignItems": "center",
             "alignSelf": "stretch",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "flexDirection": "row",
             "height": 48,
@@ -232,7 +232,7 @@ exports[`SocialLoginIosUser SocialLoginSuccessExistingUser renders match snapsho
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Bold",
             "fontSize": 32,
             "letterSpacing": 0,
@@ -265,7 +265,7 @@ exports[`SocialLoginIosUser SocialLoginSuccessExistingUser renders match snapsho
           {
             "alignItems": "center",
             "alignSelf": "stretch",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "flexDirection": "row",
             "height": 40,
@@ -380,7 +380,7 @@ exports[`SocialLoginIosUser SocialLoginSuccessNewUser renders match snapshot 1`]
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Bold",
             "fontSize": 32,
             "letterSpacing": 0,
@@ -413,7 +413,7 @@ exports[`SocialLoginIosUser SocialLoginSuccessNewUser renders match snapshot 1`]
           {
             "alignItems": "center",
             "alignSelf": "stretch",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "flexDirection": "row",
             "height": 48,
@@ -528,7 +528,7 @@ exports[`SocialLoginIosUser SocialLoginSuccessNewUser renders match snapshot wit
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Bold",
             "fontSize": 32,
             "letterSpacing": 0,
@@ -561,7 +561,7 @@ exports[`SocialLoginIosUser SocialLoginSuccessNewUser renders match snapshot wit
           {
             "alignItems": "center",
             "alignSelf": "stretch",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "flexDirection": "row",
             "height": 40,
diff --git a/app/components/Views/SrpInput/Input/__snapshots__/index.test.tsx.snap b/app/components/Views/SrpInput/Input/__snapshots__/index.test.tsx.snap
index c1cd4c575815..841b22a8b5e9 100644
--- a/app/components/Views/SrpInput/Input/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/SrpInput/Input/__snapshots__/index.test.tsx.snap
@@ -11,7 +11,7 @@ exports[`SRP -> Input should render correctly 1`] = `
       "backgroundColor": "#ffffff",
       "borderColor": "transparent",
       "borderWidth": 1,
-      "color": "#121314",
+      "color": "#131416",
       "fontFamily": "Geist-Regular",
       "fontSize": 16,
       "fontWeight": "400",
diff --git a/app/components/Views/SrpInput/Input/index.tsx b/app/components/Views/SrpInput/Input/index.tsx
index ea6f8757d7fc..758b00dc8d7a 100644
--- a/app/components/Views/SrpInput/Input/index.tsx
+++ b/app/components/Views/SrpInput/Input/index.tsx
@@ -49,6 +49,8 @@ const Input = React.forwardRef<
       isDisabled,
       isFocused,
       inputStyle,
+      value: '',
+      placeholder: undefined,
     });
 
     const onBlurHandler = useCallback(
diff --git a/app/components/Views/SrpInput/__snapshots__/index.test.tsx.snap b/app/components/Views/SrpInput/__snapshots__/index.test.tsx.snap
index fe6219056f64..d5fa4a4e269f 100644
--- a/app/components/Views/SrpInput/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/SrpInput/__snapshots__/index.test.tsx.snap
@@ -23,8 +23,8 @@ exports[`SrpInput renders default settings correctly 1`] = `
   style={
     {
       "alignItems": "center",
-      "backgroundColor": "#3c4d9d0f",
-      "borderColor": "#b7bbc866",
+      "backgroundColor": "#b4b4b528",
+      "borderColor": "#b4b4b566",
       "borderRadius": 12,
       "borderWidth": 1,
       "flexDirection": "row",
@@ -59,7 +59,7 @@ exports[`SrpInput renders default settings correctly 1`] = `
           "backgroundColor": "#ffffff",
           "borderColor": "transparent",
           "borderWidth": 1,
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "fontWeight": "400",
diff --git a/app/components/Views/SuccessErrorSheet/__snapshots__/index.test.tsx.snap b/app/components/Views/SuccessErrorSheet/__snapshots__/index.test.tsx.snap
index fe8de642b23c..99fbc99e4160 100644
--- a/app/components/Views/SuccessErrorSheet/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/SuccessErrorSheet/__snapshots__/index.test.tsx.snap
@@ -34,9 +34,9 @@ exports[`SuccessErrorSheet render matches snapshot 1`] = `
       style={
         {
           "alignSelf": "center",
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Bold",
-          "fontSize": 18,
+          "fontSize": 20,
           "letterSpacing": 0,
           "lineHeight": 24,
           "marginHorizontal": "auto",
@@ -52,7 +52,7 @@ exports[`SuccessErrorSheet render matches snapshot 1`] = `
       style={
         {
           "alignSelf": "center",
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -90,7 +90,7 @@ exports[`SuccessErrorSheet render matches snapshot 1`] = `
           {
             "alignItems": "center",
             "alignSelf": "stretch",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -107,7 +107,7 @@ exports[`SuccessErrorSheet render matches snapshot 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Medium",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -129,7 +129,7 @@ exports[`SuccessErrorSheet render matches snapshot 1`] = `
           {
             "alignItems": "center",
             "alignSelf": "stretch",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "flex": 1,
             "flexDirection": "row",
diff --git a/app/components/Views/TermsAndConditions/__snapshots__/index.test.tsx.snap b/app/components/Views/TermsAndConditions/__snapshots__/index.test.tsx.snap
index 4beba90d293c..7280804578a3 100644
--- a/app/components/Views/TermsAndConditions/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/TermsAndConditions/__snapshots__/index.test.tsx.snap
@@ -8,7 +8,7 @@ exports[`TermsAndConditions should render correctly 1`] = `
   <Text
     style={
       {
-        "color": "#686e7d",
+        "color": "#66676a",
         "fontFamily": "Geist-Regular",
         "fontSize": 10,
         "textAlign": "center",
diff --git a/app/components/Views/TokensFullView/TokensFullView.tsx b/app/components/Views/TokensFullView/TokensFullView.tsx
index 8d51c1ae0979..4023bb8076e4 100644
--- a/app/components/Views/TokensFullView/TokensFullView.tsx
+++ b/app/components/Views/TokensFullView/TokensFullView.tsx
@@ -23,7 +23,7 @@ const TokensFullView = () => {
       <HeaderBase
         startAccessory={
           <ButtonIcon
-            size={ButtonIconSizes.Lg}
+            size={ButtonIconSizes.Md}
             onPress={handleBackPress}
             iconName={IconName.ArrowLeft}
             testID="back-button"
diff --git a/app/components/Views/TrendingView/TrendingView.test.tsx b/app/components/Views/TrendingView/TrendingView.test.tsx
index 17cda6d3d9d8..ec1f8259a3d7 100644
--- a/app/components/Views/TrendingView/TrendingView.test.tsx
+++ b/app/components/Views/TrendingView/TrendingView.test.tsx
@@ -28,6 +28,7 @@ jest.mock('react-redux', () => ({
 }));
 
 import { ExploreFeed } from './TrendingView';
+import { TrendingViewSelectorsIDs } from './TrendingView.testIds';
 import {
   selectChainId,
   selectPopularNetworkConfigurationsByCaipChainId,
@@ -318,6 +319,30 @@ describe('TrendingView', () => {
     expect(getByText('Explore')).toBeOnTheScreen();
   });
 
+  it('wraps screen in SafeAreaView', () => {
+    const { getByTestId } = render(
+      <NavigationContainer>
+        <TrendingView />
+      </NavigationContainer>,
+    );
+
+    expect(
+      getByTestId(TrendingViewSelectorsIDs.EXPLORE_SAFE_AREA),
+    ).toBeOnTheScreen();
+  });
+
+  it('renders HeaderRoot', () => {
+    const { getByTestId } = render(
+      <NavigationContainer>
+        <TrendingView />
+      </NavigationContainer>,
+    );
+
+    expect(
+      getByTestId(TrendingViewSelectorsIDs.EXPLORE_HEADER_ROOT),
+    ).toBeOnTheScreen();
+  });
+
   it('renders search bar button', () => {
     const { getByTestId } = render(
       <NavigationContainer>
diff --git a/app/components/Views/TrendingView/TrendingView.testIds.ts b/app/components/Views/TrendingView/TrendingView.testIds.ts
index f6599c937a79..a274816fb04c 100644
--- a/app/components/Views/TrendingView/TrendingView.testIds.ts
+++ b/app/components/Views/TrendingView/TrendingView.testIds.ts
@@ -1,6 +1,8 @@
 export const TrendingViewSelectorsIDs = {
   TRENDING_FEED_SCROLL_VIEW: 'trending-feed-scroll-view',
   QUICK_ACTIONS_SCROLL_VIEW: 'quick-actions-scroll-view',
+  EXPLORE_HEADER_ROOT: 'explore-header-root',
+  EXPLORE_SAFE_AREA: 'explore-safe-area',
 } as const;
 
 export type TrendingViewSelectorsIDsType = typeof TrendingViewSelectorsIDs;
diff --git a/app/components/Views/TrendingView/TrendingView.tsx b/app/components/Views/TrendingView/TrendingView.tsx
index 4f793cc9d617..33ff8f25b4b6 100644
--- a/app/components/Views/TrendingView/TrendingView.tsx
+++ b/app/components/Views/TrendingView/TrendingView.tsx
@@ -1,11 +1,6 @@
 import React, { useCallback, useEffect, useMemo, useState } from 'react';
-import {
-  ScrollView,
-  TouchableOpacity,
-  RefreshControl,
-  ActivityIndicator,
-} from 'react-native';
-import { useSafeAreaInsets } from 'react-native-safe-area-context';
+import { ScrollView, TouchableOpacity, RefreshControl } from 'react-native';
+import { SafeAreaView } from 'react-native-safe-area-context';
 import { useNavigation } from '@react-navigation/native';
 import { useSelector } from 'react-redux';
 import { useTailwind } from '@metamask/design-system-twrnc-preset';
@@ -17,6 +12,7 @@ import {
   Icon,
   IconSize,
 } from '@metamask/design-system-react-native';
+import HeaderRoot from '../../../component-library/components-temp/HeaderRoot';
 import { strings } from '../../../../locales/i18n';
 import AppConstants from '../../../core/AppConstants';
 import { useBuildPortfolioUrl } from '../../hooks/useBuildPortfolioUrl';
@@ -76,7 +72,6 @@ const useSectionStateTracker = (
 
 export const ExploreFeed: React.FC = () => {
   const tw = useTailwind();
-  const insets = useSafeAreaInsets();
   const navigation = useNavigation();
   const buildPortfolioUrlWithMetrics = useBuildPortfolioUrl();
   const { colors } = useTheme();
@@ -88,14 +83,11 @@ export const ExploreFeed: React.FC = () => {
 
   const homeSections = useHomeSections();
 
-  // Track which sections have empty data and which are loading
+  // Track which sections have empty data (for QuickActions empty state)
   const { sectionsWithState: emptySections, callbacks: emptyStateCallbacks } =
     useSectionStateTracker(homeSections);
 
-  const {
-    sectionsWithState: loadingSections,
-    callbacks: loadingStateCallbacks,
-  } = useSectionStateTracker(homeSections);
+  const noopLoadingState = useCallback((_isLoading: boolean) => undefined, []);
 
   const sessionManager = TrendingFeedSessionManager.getInstance();
 
@@ -191,91 +183,88 @@ export const ExploreFeed: React.FC = () => {
     }));
   }, []);
 
-  // Show loading indicator when any section is loading during silent refresh
-  const isAnySectionLoading = loadingSections.size > 0;
-
   return (
-    <Box
-      style={{ marginTop: insets.top }}
-      twClassName="flex-1 bg-default gap-4"
+    <SafeAreaView
+      edges={{ bottom: 'additive' }}
+      style={tw.style('flex-1 bg-default')}
+      testID={TrendingViewSelectorsIDs.EXPLORE_SAFE_AREA}
     >
-      <Box twClassName="px-4 flex-row items-center justify-between">
-        <Text variant={TextVariant.HeadingLg} twClassName="text-default">
-          {strings('trending.title')}
-        </Text>
-        {!refreshConfig.silentRefresh && isAnySectionLoading && (
-          <ActivityIndicator size="small" color={colors.icon.default} />
-        )}
-      </Box>
-
-      <Box twClassName="flex-row items-center gap-2 px-4">
-        <Box twClassName="flex-1">
-          <ExploreSearchBar type="button" onPress={handleSearchPress} />
+      <HeaderRoot
+        title={strings('trending.title')}
+        includesTopInset
+        testID={TrendingViewSelectorsIDs.EXPLORE_HEADER_ROOT}
+      />
+
+      <Box twClassName="gap-4 flex-1">
+        <Box twClassName="flex-row items-center gap-2 px-4">
+          <Box twClassName="flex-1">
+            <ExploreSearchBar type="button" onPress={handleSearchPress} />
+          </Box>
+
+          <TouchableOpacity
+            onPress={handleBrowserPress}
+            testID="trending-view-browser-button"
+          >
+            {browserTabsCount > 0 ? (
+              <Box twClassName="rounded-md items-center justify-center h-8 w-8 border-2 border-text-default">
+                <Text variant={TextVariant.BodyLg}>{browserTabsCount}</Text>
+              </Box>
+            ) : (
+              <Icon name={IconName.Explore} size={IconSize.Xl} />
+            )}
+          </TouchableOpacity>
         </Box>
 
-        <TouchableOpacity
-          onPress={handleBrowserPress}
-          testID="trending-view-browser-button"
-        >
-          {browserTabsCount > 0 ? (
-            <Box twClassName="rounded-md items-center justify-center h-8 w-8 border-2 border-text-default">
-              <Text variant={TextVariant.BodyLg}>{browserTabsCount}</Text>
-            </Box>
-          ) : (
-            <Icon name={IconName.Explore} size={IconSize.Xl} />
-          )}
-        </TouchableOpacity>
-      </Box>
-
-      {isBasicFunctionalityEnabled ? (
-        <ScrollView
-          testID={TrendingViewSelectorsIDs.TRENDING_FEED_SCROLL_VIEW}
-          style={tw.style('flex-1 px-4')}
-          showsVerticalScrollIndicator={false}
-          refreshControl={
-            <RefreshControl
-              refreshing={refreshing}
-              onRefresh={handleRefresh}
-              tintColor={colors.icon.default}
-              colors={[colors.primary.default]}
-            />
-          }
-        >
-          <QuickActions emptySections={emptySections} />
-
-          {homeSections.map((section) => {
-            // Hide section visually but keep mounted so it can report when data arrives
-            const isHidden = emptySections.has(section.id);
-
-            const sectionComponent = (
-              <Section
-                sectionId={section.id}
-                refreshConfig={refreshConfig}
-                toggleSectionEmptyState={emptyStateCallbacks[section.id]}
-                toggleSectionLoadingState={loadingStateCallbacks[section.id]}
+        {isBasicFunctionalityEnabled ? (
+          <ScrollView
+            testID={TrendingViewSelectorsIDs.TRENDING_FEED_SCROLL_VIEW}
+            style={tw.style('flex-1 px-4')}
+            showsVerticalScrollIndicator={false}
+            refreshControl={
+              <RefreshControl
+                refreshing={refreshing}
+                onRefresh={handleRefresh}
+                tintColor={colors.icon.default}
+                colors={[colors.primary.default]}
               />
-            );
-
-            return (
-              <Box
-                key={section.id}
-                twClassName={isHidden ? 'hidden' : undefined}
-              >
-                <SectionHeader sectionId={section.id} />
-                {section.SectionWrapper ? (
-                  <section.SectionWrapper>
-                    {sectionComponent}
-                  </section.SectionWrapper>
-                ) : (
-                  sectionComponent
-                )}
-              </Box>
-            );
-          })}
-        </ScrollView>
-      ) : (
-        <BasicFunctionalityEmptyState />
-      )}
-    </Box>
+            }
+          >
+            <QuickActions emptySections={emptySections} />
+
+            {homeSections.map((section) => {
+              // Hide section visually but keep mounted so it can report when data arrives
+              const isHidden = emptySections.has(section.id);
+
+              const sectionComponent = (
+                <Section
+                  sectionId={section.id}
+                  refreshConfig={refreshConfig}
+                  toggleSectionEmptyState={emptyStateCallbacks[section.id]}
+                  toggleSectionLoadingState={noopLoadingState}
+                />
+              );
+
+              return (
+                <Box
+                  key={section.id}
+                  twClassName={isHidden ? 'hidden' : undefined}
+                >
+                  <SectionHeader sectionId={section.id} />
+                  {section.SectionWrapper ? (
+                    <section.SectionWrapper>
+                      {sectionComponent}
+                    </section.SectionWrapper>
+                  ) : (
+                    sectionComponent
+                  )}
+                </Box>
+              );
+            })}
+          </ScrollView>
+        ) : (
+          <BasicFunctionalityEmptyState />
+        )}
+      </Box>
+    </SafeAreaView>
   );
 };
diff --git a/app/components/Views/TrendingView/TrendingView.view.test.tsx b/app/components/Views/TrendingView/TrendingView.view.test.tsx
index a6d94e61fc1a..0bd33a16ed11 100644
--- a/app/components/Views/TrendingView/TrendingView.view.test.tsx
+++ b/app/components/Views/TrendingView/TrendingView.view.test.tsx
@@ -41,6 +41,34 @@ describeForPlatforms('ExploreFeed - Component Tests', () => {
     clearTrendingApiMocks();
   });
 
+  itForPlatforms('renders Explore screen wrapped in SafeAreaView', async () => {
+    const { getByTestId } = renderTrendingViewWithRoutes();
+
+    await waitFor(() => {
+      expect(
+        getByTestId(TrendingViewSelectorsIDs.EXPLORE_SAFE_AREA),
+      ).toBeOnTheScreen();
+    });
+  });
+
+  itForPlatforms('renders HeaderRoot on Explore screen', async () => {
+    const { getByTestId } = renderTrendingViewWithRoutes();
+
+    await waitFor(() => {
+      expect(
+        getByTestId(TrendingViewSelectorsIDs.EXPLORE_HEADER_ROOT),
+      ).toBeOnTheScreen();
+    });
+  });
+
+  itForPlatforms('renders Explore title on Explore screen', async () => {
+    const { getByText } = renderTrendingViewWithRoutes();
+
+    await waitFor(() => {
+      expect(getByText('Explore')).toBeOnTheScreen();
+    });
+  });
+
   itForPlatforms(
     'user sees trending tokens section with mocked data',
     async () => {
diff --git a/app/components/Views/UnifiedTransactionsView/UnifiedTransactionsView.test.tsx b/app/components/Views/UnifiedTransactionsView/UnifiedTransactionsView.test.tsx
index 42489ed206ed..11631db31a6a 100644
--- a/app/components/Views/UnifiedTransactionsView/UnifiedTransactionsView.test.tsx
+++ b/app/components/Views/UnifiedTransactionsView/UnifiedTransactionsView.test.tsx
@@ -18,6 +18,18 @@ jest.mock('@react-navigation/native', () => ({
   }),
 }));
 
+jest.mock('../confirmations/hooks/gas/useGasFeeEstimates', () => ({
+  useGasFeeEstimates: jest.fn(() => ({
+    gasFeeEstimates: {
+      medium: {
+        suggestedMaxFeePerGas: '25',
+        suggestedMaxPriorityFeePerGas: '2',
+        minWaitTimeEstimate: 15000,
+      },
+    },
+  })),
+}));
+
 jest.mock('../../../util/transaction-controller', () => ({
   updateIncomingTransactions: jest.fn().mockResolvedValue(undefined),
 }));
@@ -51,7 +63,6 @@ jest.mock('./useUnifiedTxActions', () => ({
     cancel1559IsOpen: false,
     speedUpConfirmDisabled: false,
     cancelConfirmDisabled: false,
-    existingGas: null,
     existingTx: null,
     speedUpTxId: null,
     cancelTxId: null,
@@ -92,6 +103,20 @@ jest.mock(
   () => 'MultichainBridgeTransactionListItem',
 );
 jest.mock('../../UI/TransactionActionModal', () => 'TransactionActionModal');
+jest.mock('../confirmations/components/modals/cancel-speedup-modal', () => {
+  const ReactActual = jest.requireActual('react');
+  const { Text } = jest.requireActual('react-native');
+  return {
+    CancelSpeedupModal: ({ isCancel }: { isCancel: boolean }) =>
+      ReactActual.createElement(
+        Text,
+        {
+          testID: isCancel ? 'cancel-modal' : 'speedup-modal',
+        },
+        isCancel ? 'Cancel Transaction' : 'Speed Up Transaction',
+      ),
+  };
+});
 jest.mock('../../UI/Transactions/RetryModal', () => 'RetryModal');
 jest.mock(
   '../../UI/Transactions/TransactionsFooter',
diff --git a/app/components/Views/UnifiedTransactionsView/UnifiedTransactionsView.tsx b/app/components/Views/UnifiedTransactionsView/UnifiedTransactionsView.tsx
index 3d740955c8d3..6cb11d074a1b 100644
--- a/app/components/Views/UnifiedTransactionsView/UnifiedTransactionsView.tsx
+++ b/app/components/Views/UnifiedTransactionsView/UnifiedTransactionsView.tsx
@@ -6,8 +6,6 @@ import { useNavigation } from '@react-navigation/native';
 import { FlashList, FlashListRef } from '@shopify/flash-list';
 import React, { useCallback, useMemo, useRef, useState } from 'react';
 import { RefreshControl, View } from 'react-native';
-import { KeyboardAwareScrollView } from 'react-native-keyboard-aware-scroll-view';
-import Modal from 'react-native-modal';
 import { useSelector } from 'react-redux';
 import { strings } from '../../../../locales/i18n';
 import ExtendedKeyringTypes from '../../../constants/keyringTypes';
@@ -48,14 +46,13 @@ import PriceChartContext, {
 import { useBridgeHistoryItemBySrcTxHash } from '../../UI/Bridge/hooks/useBridgeHistoryItemBySrcTxHash';
 import MultichainBridgeTransactionListItem from '../../UI/MultichainBridgeTransactionListItem';
 import MultichainTransactionListItem from '../../UI/MultichainTransactionListItem';
-import TransactionActionModal from '../../UI/TransactionActionModal';
 import TransactionElement from '../../UI/TransactionElement';
 import RetryModal from '../../UI/Transactions/RetryModal';
 import { filterDuplicateOutgoingTransactions } from '../../UI/Transactions/utils';
 import TransactionsFooter from '../../UI/Transactions/TransactionsFooter';
 import MultichainTransactionsFooter from '../MultichainTransactionsView/MultichainTransactionsFooter';
 import { getAddressUrl } from '../../../core/Multichain/utils';
-import UpdateEIP1559Tx from '../confirmations/legacy/components/UpdateEIP1559Tx';
+import { CancelSpeedupModal } from '../confirmations/components/modals/cancel-speedup-modal';
 import styleSheet from './UnifiedTransactionsView.styles';
 import { useUnifiedTxActions } from './useUnifiedTxActions';
 import { TransactionDetailLocation } from '../../../core/Analytics/events/transactions';
@@ -539,11 +536,8 @@ const UnifiedTransactionsView = ({
     retryErrorMsg,
     speedUpIsOpen,
     cancelIsOpen,
-    speedUp1559IsOpen,
-    cancel1559IsOpen,
     speedUpConfirmDisabled,
     cancelConfirmDisabled,
-    existingGas,
     existingTx,
     speedUpTxId,
     cancelTxId,
@@ -684,92 +678,29 @@ const UnifiedTransactionsView = ({
             />
           )}
         </PriceChartContext.Consumer>
-        {/* Action modals for EVM Transactions */}
-        {(speedUp1559IsOpen || cancel1559IsOpen) && (
-          <Modal
-            isVisible
-            animationIn="slideInUp"
-            animationOut="slideOutDown"
-            style={styles.modal}
-            backdropColor={colors.overlay.default}
-            backdropOpacity={1}
-            animationInTiming={600}
-            animationOutTiming={600}
-            onBackdropPress={
-              cancel1559IsOpen ? onCancelCompleted : onSpeedUpCompleted
-            }
-            onBackButtonPress={
-              cancel1559IsOpen ? onCancelCompleted : onSpeedUpCompleted
-            }
-            onSwipeComplete={
-              cancel1559IsOpen ? onCancelCompleted : onSpeedUpCompleted
-            }
-            swipeDirection={'down'}
-            propagateSwipe
-          >
-            <KeyboardAwareScrollView
-              contentContainerStyle={styles.scrollViewContent}
-            >
-              <UpdateEIP1559Tx
-                gas={existingTx?.txParams?.gas}
-                onSave={
-                  cancel1559IsOpen ? cancelTransaction : speedUpTransaction
-                }
-                onCancel={
-                  cancel1559IsOpen ? onCancelCompleted : onSpeedUpCompleted
-                }
-                existingGas={existingGas}
-                isCancel={cancel1559IsOpen}
-              />
-            </KeyboardAwareScrollView>
-          </Modal>
-        )}
-        {cancelIsOpen && (
-          <TransactionActionModal
-            isVisible={cancelIsOpen}
-            confirmDisabled={cancelConfirmDisabled}
-            onCancelPress={onCancelCompleted}
-            onConfirmPress={cancelTransaction}
-            confirmText={strings('transaction.lets_try')}
-            confirmButtonMode={'confirm'}
-            cancelText={strings('transaction.nevermind')}
-            feeText={undefined}
-            titleText={strings('transaction.cancel_tx_title')}
-            gasTitleText={strings('transaction.gas_cancel_fee')}
-            descriptionText={strings('transaction.cancel_tx_message')}
-          />
-        )}
-        {speedUpIsOpen && (
-          <TransactionActionModal
-            isVisible={speedUpIsOpen}
-            confirmDisabled={speedUpConfirmDisabled}
-            onCancelPress={onSpeedUpCompleted}
-            onConfirmPress={speedUpTransaction}
-            confirmText={strings('transaction.lets_try')}
-            confirmButtonMode={'confirm'}
-            cancelText={strings('transaction.nevermind')}
-            feeText={undefined}
-            titleText={strings('transaction.speedup_tx_title')}
-            gasTitleText={strings('transaction.gas_speedup_fee')}
-            descriptionText={strings('transaction.speedup_tx_message')}
-          />
-        )}
+        {/* Speed up / Cancel modals */}
+        <CancelSpeedupModal
+          isVisible={speedUpIsOpen}
+          isCancel={false}
+          tx={existingTx}
+          onConfirm={speedUpTransaction}
+          onClose={onSpeedUpCompleted}
+          confirmDisabled={speedUpConfirmDisabled}
+        />
+        <CancelSpeedupModal
+          isVisible={cancelIsOpen}
+          isCancel
+          tx={existingTx}
+          onConfirm={cancelTransaction}
+          onClose={onCancelCompleted}
+          confirmDisabled={cancelConfirmDisabled}
+        />
         <RetryModal
           onCancelPress={() => toggleRetry(undefined)}
           onConfirmPress={() => {
             toggleRetry(undefined);
-            if (speedUpTxId)
-              onSpeedUpAction(
-                true,
-                existingGas ?? undefined,
-                existingTx ?? undefined,
-              );
-            if (cancelTxId)
-              onCancelAction(
-                true,
-                existingGas ?? undefined,
-                existingTx ?? undefined,
-              );
+            if (speedUpTxId) onSpeedUpAction(true, existingTx ?? undefined);
+            if (cancelTxId) onCancelAction(true, existingTx ?? undefined);
           }}
           retryIsOpen={retryIsOpen}
           errorMsg={retryErrorMsg}
diff --git a/app/components/Views/UnifiedTransactionsView/useUnifiedTxActions.test.ts b/app/components/Views/UnifiedTransactionsView/useUnifiedTxActions.test.ts
index 95842d86ea85..677b18e557a8 100644
--- a/app/components/Views/UnifiedTransactionsView/useUnifiedTxActions.test.ts
+++ b/app/components/Views/UnifiedTransactionsView/useUnifiedTxActions.test.ts
@@ -1,7 +1,10 @@
 import { renderHook, act } from '@testing-library/react-native';
 import { useSelector } from 'react-redux';
 
-import { useUnifiedTxActions } from './useUnifiedTxActions';
+import {
+  useUnifiedTxActions,
+  type SpeedUpCancelParams,
+} from './useUnifiedTxActions';
 import { selectGasFeeEstimates } from '../../../selectors/confirmTransaction';
 import { selectAccounts } from '../../../selectors/accountTrackerController';
 import Engine from '../../../core/Engine';
@@ -85,6 +88,10 @@ jest.mock('../../../core/Engine', () => ({
       accept: jest.fn(),
       reject: jest.fn(),
     },
+    GasFeeController: {
+      startPolling: jest.fn(),
+      stopPollingByPollingToken: jest.fn(),
+    },
   },
 }));
 
@@ -150,7 +157,6 @@ describe('useUnifiedTxActions', () => {
     expect(result.current.cancel1559IsOpen).toBe(false);
     expect(result.current.speedUpConfirmDisabled).toBe(false);
     expect(result.current.cancelConfirmDisabled).toBe(false);
-    expect(result.current.existingGas).toBeNull();
     expect(result.current.existingTx).toBeNull();
     expect(result.current.speedUpTxId).toBeNull();
     expect(result.current.cancelTxId).toBeNull();
@@ -187,17 +193,14 @@ describe('useUnifiedTxActions', () => {
       expect(result.current.speedUp1559IsOpen).toBe(false);
     });
 
-    it('opens 1559 modal when isEIP1559Transaction=true', () => {
+    it('opens speed up modal when isEIP1559Transaction=true', () => {
       const { result } = renderHook(() => useUnifiedTxActions());
       const tx = { id: '1' } as unknown as TransactionMeta;
-      const gas = { isEIP1559Transaction: true };
 
-      act(() => result.current.onSpeedUpAction(true, gas, tx));
+      act(() => result.current.onSpeedUpAction(true, tx));
 
-      expect(result.current.speedUp1559IsOpen).toBe(true);
-      expect(result.current.speedUpIsOpen).toBe(false);
+      expect(result.current.speedUpIsOpen).toBe(true);
       expect(result.current.speedUpTxId).toBe('1');
-      expect(result.current.existingGas).toBe(gas);
       expect(result.current.existingTx).toBe(tx);
     });
 
@@ -207,9 +210,8 @@ describe('useUnifiedTxActions', () => {
       );
       const { result } = renderHook(() => useUnifiedTxActions());
       const tx = { id: '2' } as unknown as TransactionMeta;
-      const gas = { isEIP1559Transaction: false };
 
-      act(() => result.current.onSpeedUpAction(true, gas, tx));
+      act(() => result.current.onSpeedUpAction(true, tx));
 
       expect(validateTransactionActionBalance).toHaveBeenCalledWith(
         tx,
@@ -231,17 +233,14 @@ describe('useUnifiedTxActions', () => {
       expect(result.current.cancel1559IsOpen).toBe(false);
     });
 
-    it('opens 1559 modal when isEIP1559Transaction=true', () => {
+    it('opens cancel modal when isEIP1559Transaction=true', () => {
       const { result } = renderHook(() => useUnifiedTxActions());
       const tx = { id: '3' } as unknown as TransactionMeta;
-      const gas = { isEIP1559Transaction: true };
 
-      act(() => result.current.onCancelAction(true, gas, tx));
+      act(() => result.current.onCancelAction(true, tx));
 
-      expect(result.current.cancel1559IsOpen).toBe(true);
-      expect(result.current.cancelIsOpen).toBe(false);
+      expect(result.current.cancelIsOpen).toBe(true);
       expect(result.current.cancelTxId).toBe('3');
-      expect(result.current.existingGas).toBe(gas);
       expect(result.current.existingTx).toBe(tx);
     });
 
@@ -251,9 +250,8 @@ describe('useUnifiedTxActions', () => {
       );
       const { result } = renderHook(() => useUnifiedTxActions());
       const tx = { id: '4' } as unknown as TransactionMeta;
-      const gas = { isEIP1559Transaction: false };
 
-      act(() => result.current.onCancelAction(true, gas, tx));
+      act(() => result.current.onCancelAction(true, tx));
 
       expect(validateTransactionActionBalance).toHaveBeenCalledWith(
         tx,
@@ -269,10 +267,12 @@ describe('useUnifiedTxActions', () => {
   describe('speedUpTransaction', () => {
     it('success with legacy gas: controller computes rate when existing gasPrice !== 0', async () => {
       const { result } = renderHook(() => useUnifiedTxActions());
-      const tx = { id: '5' } as unknown as TransactionMeta;
-      const gas = { isEIP1559Transaction: false, gasPrice: '0x1' };
+      const tx = {
+        id: '5',
+        txParams: { gasPrice: '0x1' },
+      } as unknown as TransactionMeta;
 
-      act(() => result.current.onSpeedUpAction(true, gas, tx));
+      act(() => result.current.onSpeedUpAction(true, tx));
       await act(async () => {
         await result.current.speedUpTransaction();
       });
@@ -280,17 +280,18 @@ describe('useUnifiedTxActions', () => {
       expect(speedUpTx).toHaveBeenCalledWith('5', undefined);
       expect(result.current.speedUpIsOpen).toBe(false);
       expect(result.current.speedUp1559IsOpen).toBe(false);
-      expect(result.current.existingGas).toBeNull();
       expect(result.current.speedUpTxId).toBeNull();
       expect(result.current.existingTx).toBeNull();
     });
 
     it('success with legacy gas: uses estimated gas price when existing gasPrice === 0', async () => {
       const { result } = renderHook(() => useUnifiedTxActions());
-      const tx = { id: '6' } as unknown as TransactionMeta;
-      const gas = { isEIP1559Transaction: false, gasPrice: 0 };
+      const tx = {
+        id: '6',
+        txParams: { gasPrice: '0x0' },
+      } as unknown as TransactionMeta;
 
-      act(() => result.current.onSpeedUpAction(true, gas, tx));
+      act(() => result.current.onSpeedUpAction(true, tx));
       await act(async () => {
         await result.current.speedUpTransaction();
       });
@@ -300,16 +301,15 @@ describe('useUnifiedTxActions', () => {
       expect(speedUpTx).toHaveBeenCalledWith('6', { gasPrice: '0xabc' });
     });
 
-    it('success with 1559 gas from modal values', async () => {
+    it('success with 1559 gas from modal values (controller shape)', async () => {
       const { result } = renderHook(() => useUnifiedTxActions());
       const tx = { id: '7' } as unknown as TransactionMeta;
-      const gas = { isEIP1559Transaction: true };
       const replacement = {
-        suggestedMaxFeePerGasHex: '10',
-        suggestedMaxPriorityFeePerGasHex: '2',
+        maxFeePerGas: '0x10',
+        maxPriorityFeePerGas: '0x2',
       };
 
-      act(() => result.current.onSpeedUpAction(true, gas, tx));
+      act(() => result.current.onSpeedUpAction(true, tx));
       await act(async () => {
         await result.current.speedUpTransaction(replacement);
       });
@@ -323,11 +323,12 @@ describe('useUnifiedTxActions', () => {
     it('handles error and opens retry', async () => {
       const { result } = renderHook(() => useUnifiedTxActions());
       const tx = { id: '8' } as unknown as TransactionMeta;
-      const gas = { isEIP1559Transaction: true };
 
-      act(() => result.current.onSpeedUpAction(true, gas, tx));
+      act(() => result.current.onSpeedUpAction(true, tx));
       await act(async () => {
-        await result.current.speedUpTransaction({ error: 'failed' });
+        await result.current.speedUpTransaction({
+          error: 'failed',
+        } as SpeedUpCancelParams);
       });
 
       expect(result.current.retryIsOpen).toBe(true);
@@ -349,10 +350,12 @@ describe('useUnifiedTxActions', () => {
       });
 
       const { result } = renderHook(() => useUnifiedTxActions());
-      const tx = { id: 'fallback' } as unknown as TransactionMeta;
-      const gas = { isEIP1559Transaction: false, gasPrice: 0 };
+      const tx = {
+        id: 'fallback',
+        txParams: { gasPrice: '0x0' },
+      } as unknown as TransactionMeta;
 
-      act(() => result.current.onSpeedUpAction(true, gas, tx));
+      act(() => result.current.onSpeedUpAction(true, tx));
       await act(async () => {
         await result.current.speedUpTransaction();
       });
@@ -369,10 +372,12 @@ describe('useUnifiedTxActions', () => {
   describe('cancelTransaction', () => {
     it('success with legacy gas: controller computes rate when existing gasPrice !== 0', async () => {
       const { result } = renderHook(() => useUnifiedTxActions());
-      const tx = { id: '9' } as unknown as TransactionMeta;
-      const gas = { isEIP1559Transaction: false, gasPrice: '0x1' };
+      const tx = {
+        id: '9',
+        txParams: { gasPrice: '0x1' },
+      } as unknown as TransactionMeta;
 
-      act(() => result.current.onCancelAction(true, gas, tx));
+      act(() => result.current.onCancelAction(true, tx));
       await act(async () => {
         await result.current.cancelTransaction();
       });
@@ -382,21 +387,19 @@ describe('useUnifiedTxActions', () => {
       ).toHaveBeenCalledWith('9', undefined);
       expect(result.current.cancelIsOpen).toBe(false);
       expect(result.current.cancel1559IsOpen).toBe(false);
-      expect(result.current.existingGas).toBeNull();
       expect(result.current.cancelTxId).toBeNull();
       expect(result.current.existingTx).toBeNull();
     });
 
-    it('success with 1559 gas from modal values', async () => {
+    it('success with 1559 gas from modal values (controller shape)', async () => {
       const { result } = renderHook(() => useUnifiedTxActions());
       const tx = { id: '10' } as unknown as TransactionMeta;
-      const gas = { isEIP1559Transaction: true };
       const replacement = {
-        suggestedMaxFeePerGasHex: 'a',
-        suggestedMaxPriorityFeePerGasHex: 'b',
+        maxFeePerGas: '0xa',
+        maxPriorityFeePerGas: '0xb',
       };
 
-      act(() => result.current.onCancelAction(true, gas, tx));
+      act(() => result.current.onCancelAction(true, tx));
       await act(async () => {
         await result.current.cancelTransaction(replacement);
       });
@@ -412,11 +415,12 @@ describe('useUnifiedTxActions', () => {
     it('handles error and opens retry', async () => {
       const { result } = renderHook(() => useUnifiedTxActions());
       const tx = { id: '11' } as unknown as TransactionMeta;
-      const gas = { isEIP1559Transaction: false };
 
-      act(() => result.current.onCancelAction(true, gas, tx));
+      act(() => result.current.onCancelAction(true, tx));
       await act(async () => {
-        await result.current.cancelTransaction({ error: 'nope' });
+        await result.current.cancelTransaction({
+          error: 'nope',
+        } as SpeedUpCancelParams);
       });
 
       expect(result.current.retryIsOpen).toBe(true);
@@ -462,7 +466,6 @@ describe('useUnifiedTxActions', () => {
     it('navigates to ledger modal and resolves completion for speed up', async () => {
       const { result } = renderHook(() => useUnifiedTxActions());
       const tx = { id: '14' } as unknown as TransactionMeta;
-      const gas = { isEIP1559Transaction: true };
 
       (createLedgerTransactionModalNavDetails as jest.Mock).mockImplementation(
         ({ onConfirmationComplete }) => [
@@ -471,7 +474,7 @@ describe('useUnifiedTxActions', () => {
         ],
       );
 
-      act(() => result.current.onSpeedUpAction(true, gas, tx));
+      act(() => result.current.onSpeedUpAction(true, tx));
       await act(async () => {
         await result.current.signLedgerTransaction({
           id: '14',
@@ -497,7 +500,6 @@ describe('useUnifiedTxActions', () => {
     it('navigates to ledger modal and resolves completion for cancel', async () => {
       const { result } = renderHook(() => useUnifiedTxActions());
       const tx = { id: '15' } as unknown as TransactionMeta;
-      const gas = { isEIP1559Transaction: true };
 
       (createLedgerTransactionModalNavDetails as jest.Mock).mockImplementation(
         ({ onConfirmationComplete }) => [
@@ -506,7 +508,7 @@ describe('useUnifiedTxActions', () => {
         ],
       );
 
-      act(() => result.current.onCancelAction(true, gas, tx));
+      act(() => result.current.onCancelAction(true, tx));
       await act(async () => {
         await result.current.signLedgerTransaction({
           id: '15',
@@ -549,13 +551,12 @@ describe('useUnifiedTxActions', () => {
         it('calls signLedgerTransaction instead of speedUpTx', async () => {
           const { result } = renderHook(() => useUnifiedTxActions());
           const tx = { id: 'ledger-speedup-1' } as unknown as TransactionMeta;
-          const gas = { isEIP1559Transaction: true };
           const replacement = {
-            suggestedMaxFeePerGasHex: 'ff',
-            suggestedMaxPriorityFeePerGasHex: 'ee',
+            maxFeePerGas: '0xff',
+            maxPriorityFeePerGas: '0xee',
           };
 
-          act(() => result.current.onSpeedUpAction(true, gas, tx));
+          act(() => result.current.onSpeedUpAction(true, tx));
           await act(async () => {
             await result.current.speedUpTransaction(replacement);
           });
@@ -579,28 +580,26 @@ describe('useUnifiedTxActions', () => {
         it('returns early after calling signLedgerTransaction without calling onSpeedUpCompleted', async () => {
           const { result } = renderHook(() => useUnifiedTxActions());
           const tx = { id: 'ledger-speedup-2' } as unknown as TransactionMeta;
-          const gas = { isEIP1559Transaction: true };
 
-          act(() => result.current.onSpeedUpAction(true, gas, tx));
+          act(() => result.current.onSpeedUpAction(true, tx));
           await act(async () => {
             await result.current.speedUpTransaction({
-              suggestedMaxFeePerGasHex: 'aa',
-              suggestedMaxPriorityFeePerGasHex: 'bb',
+              maxFeePerGas: '0xaa',
+              maxPriorityFeePerGas: '0xbb',
             });
           });
 
-          expect(result.current.speedUp1559IsOpen).toBe(true);
+          expect(result.current.speedUpIsOpen).toBe(true);
           expect(result.current.speedUpTxId).toBe('ledger-speedup-2');
         });
 
         it('handles empty gas fee hex values by falling back to legacy gas price', async () => {
           const { result } = renderHook(() => useUnifiedTxActions());
           const tx = { id: 'ledger-speedup-3' } as unknown as TransactionMeta;
-          const gas = { isEIP1559Transaction: true };
 
-          act(() => result.current.onSpeedUpAction(true, gas, tx));
+          act(() => result.current.onSpeedUpAction(true, tx));
           await act(async () => {
-            await result.current.speedUpTransaction({});
+            await result.current.speedUpTransaction({} as SpeedUpCancelParams);
           });
 
           expect(createLedgerTransactionModalNavDetails).toHaveBeenCalledWith({
@@ -620,12 +619,12 @@ describe('useUnifiedTxActions', () => {
           const { result } = renderHook(() => useUnifiedTxActions());
           const tx = {
             id: 'ledger-speedup-legacy',
+            txParams: { gasPrice: '0x123' },
           } as unknown as TransactionMeta;
-          const gas = { isEIP1559Transaction: false, gasPrice: '0x123' };
 
-          act(() => result.current.onSpeedUpAction(true, gas, tx));
+          act(() => result.current.onSpeedUpAction(true, tx));
           await act(async () => {
-            await result.current.speedUpTransaction({});
+            await result.current.speedUpTransaction({} as SpeedUpCancelParams);
           });
 
           expect(createLedgerTransactionModalNavDetails).toHaveBeenCalledWith({
@@ -642,11 +641,12 @@ describe('useUnifiedTxActions', () => {
         it('throws error before Ledger signing when transactionObject has error', async () => {
           const { result } = renderHook(() => useUnifiedTxActions());
           const tx = { id: 'ledger-speedup-4' } as unknown as TransactionMeta;
-          const gas = { isEIP1559Transaction: true };
 
-          act(() => result.current.onSpeedUpAction(true, gas, tx));
+          act(() => result.current.onSpeedUpAction(true, tx));
           await act(async () => {
-            await result.current.speedUpTransaction({ error: 'gas error' });
+            await result.current.speedUpTransaction({
+              error: 'gas error',
+            } as SpeedUpCancelParams);
           });
 
           expect(getDeviceId).not.toHaveBeenCalled();
@@ -660,8 +660,8 @@ describe('useUnifiedTxActions', () => {
 
           await act(async () => {
             await result.current.speedUpTransaction({
-              suggestedMaxFeePerGasHex: 'cc',
-              suggestedMaxPriorityFeePerGasHex: 'dd',
+              maxFeePerGas: '0xcc',
+              maxPriorityFeePerGas: '0xdd',
             });
           });
 
@@ -688,17 +688,16 @@ describe('useUnifiedTxActions', () => {
           const tx = {
             id: 'ledger-speedup-reject',
           } as unknown as TransactionMeta;
-          const gas = { isEIP1559Transaction: true };
 
-          act(() => result.current.onSpeedUpAction(true, gas, tx));
+          act(() => result.current.onSpeedUpAction(true, tx));
 
-          expect(result.current.speedUp1559IsOpen).toBe(true);
+          expect(result.current.speedUpIsOpen).toBe(true);
           expect(result.current.speedUpTxId).toBe('ledger-speedup-reject');
 
           await act(async () => {
             await result.current.speedUpTransaction({
-              suggestedMaxFeePerGasHex: 'ff',
-              suggestedMaxPriorityFeePerGasHex: 'ee',
+              maxFeePerGas: '0xff',
+              maxPriorityFeePerGas: '0xee',
             });
           });
 
@@ -710,10 +709,8 @@ describe('useUnifiedTxActions', () => {
           });
 
           // Modal state should be cleaned up even on rejection
-          expect(result.current.speedUp1559IsOpen).toBe(false);
           expect(result.current.speedUpIsOpen).toBe(false);
           expect(result.current.speedUpTxId).toBeNull();
-          expect(result.current.existingGas).toBeNull();
           expect(result.current.existingTx).toBeNull();
         });
       });
@@ -722,13 +719,12 @@ describe('useUnifiedTxActions', () => {
         it('calls signLedgerTransaction instead of stopTransaction', async () => {
           const { result } = renderHook(() => useUnifiedTxActions());
           const tx = { id: 'ledger-cancel-1' } as unknown as TransactionMeta;
-          const gas = { isEIP1559Transaction: true };
           const replacement = {
-            suggestedMaxFeePerGasHex: '11',
-            suggestedMaxPriorityFeePerGasHex: '22',
+            maxFeePerGas: '0x11',
+            maxPriorityFeePerGas: '0x22',
           };
 
-          act(() => result.current.onCancelAction(true, gas, tx));
+          act(() => result.current.onCancelAction(true, tx));
           await act(async () => {
             await result.current.cancelTransaction(replacement);
           });
@@ -754,28 +750,26 @@ describe('useUnifiedTxActions', () => {
         it('returns early after calling signLedgerTransaction without calling onCancelCompleted', async () => {
           const { result } = renderHook(() => useUnifiedTxActions());
           const tx = { id: 'ledger-cancel-2' } as unknown as TransactionMeta;
-          const gas = { isEIP1559Transaction: true };
 
-          act(() => result.current.onCancelAction(true, gas, tx));
+          act(() => result.current.onCancelAction(true, tx));
           await act(async () => {
             await result.current.cancelTransaction({
-              suggestedMaxFeePerGasHex: '33',
-              suggestedMaxPriorityFeePerGasHex: '44',
+              maxFeePerGas: '0x33',
+              maxPriorityFeePerGas: '0x44',
             });
           });
 
-          expect(result.current.cancel1559IsOpen).toBe(true);
+          expect(result.current.cancelIsOpen).toBe(true);
           expect(result.current.cancelTxId).toBe('ledger-cancel-2');
         });
 
         it('handles empty gas fee hex values by falling back to legacy gas price', async () => {
           const { result } = renderHook(() => useUnifiedTxActions());
           const tx = { id: 'ledger-cancel-3' } as unknown as TransactionMeta;
-          const gas = { isEIP1559Transaction: true };
 
-          act(() => result.current.onCancelAction(true, gas, tx));
+          act(() => result.current.onCancelAction(true, tx));
           await act(async () => {
-            await result.current.cancelTransaction({});
+            await result.current.cancelTransaction({} as SpeedUpCancelParams);
           });
 
           expect(createLedgerTransactionModalNavDetails).toHaveBeenCalledWith({
@@ -795,12 +789,12 @@ describe('useUnifiedTxActions', () => {
           const { result } = renderHook(() => useUnifiedTxActions());
           const tx = {
             id: 'ledger-cancel-legacy',
+            txParams: { gasPrice: '0x456' },
           } as unknown as TransactionMeta;
-          const gas = { isEIP1559Transaction: false, gasPrice: '0x456' };
 
-          act(() => result.current.onCancelAction(true, gas, tx));
+          act(() => result.current.onCancelAction(true, tx));
           await act(async () => {
-            await result.current.cancelTransaction({});
+            await result.current.cancelTransaction({} as SpeedUpCancelParams);
           });
 
           // legacyGasFee is undefined because getCancelOrSpeedupValues returns
@@ -820,11 +814,12 @@ describe('useUnifiedTxActions', () => {
         it('throws error before Ledger signing when transactionObject has error', async () => {
           const { result } = renderHook(() => useUnifiedTxActions());
           const tx = { id: 'ledger-cancel-4' } as unknown as TransactionMeta;
-          const gas = { isEIP1559Transaction: true };
 
-          act(() => result.current.onCancelAction(true, gas, tx));
+          act(() => result.current.onCancelAction(true, tx));
           await act(async () => {
-            await result.current.cancelTransaction({ error: 'cancel error' });
+            await result.current.cancelTransaction({
+              error: 'cancel error',
+            } as SpeedUpCancelParams);
           });
 
           expect(getDeviceId).not.toHaveBeenCalled();
@@ -838,8 +833,8 @@ describe('useUnifiedTxActions', () => {
 
           await act(async () => {
             await result.current.cancelTransaction({
-              suggestedMaxFeePerGasHex: '55',
-              suggestedMaxPriorityFeePerGasHex: '66',
+              maxFeePerGas: '0x55',
+              maxPriorityFeePerGas: '0x66',
             });
           });
 
@@ -866,17 +861,16 @@ describe('useUnifiedTxActions', () => {
           const tx = {
             id: 'ledger-cancel-reject',
           } as unknown as TransactionMeta;
-          const gas = { isEIP1559Transaction: true };
 
-          act(() => result.current.onCancelAction(true, gas, tx));
+          act(() => result.current.onCancelAction(true, tx));
 
-          expect(result.current.cancel1559IsOpen).toBe(true);
+          expect(result.current.cancelIsOpen).toBe(true);
           expect(result.current.cancelTxId).toBe('ledger-cancel-reject');
 
           await act(async () => {
             await result.current.cancelTransaction({
-              suggestedMaxFeePerGasHex: '11',
-              suggestedMaxPriorityFeePerGasHex: '22',
+              maxFeePerGas: '0x11',
+              maxPriorityFeePerGas: '0x22',
             });
           });
 
@@ -888,10 +882,8 @@ describe('useUnifiedTxActions', () => {
           });
 
           // Modal state should be cleaned up even on rejection
-          expect(result.current.cancel1559IsOpen).toBe(false);
           expect(result.current.cancelIsOpen).toBe(false);
           expect(result.current.cancelTxId).toBeNull();
-          expect(result.current.existingGas).toBeNull();
           expect(result.current.existingTx).toBeNull();
         });
       });
diff --git a/app/components/Views/UnifiedTransactionsView/useUnifiedTxActions.ts b/app/components/Views/UnifiedTransactionsView/useUnifiedTxActions.ts
index af2e8ea3ba8a..f3bbb290491f 100644
--- a/app/components/Views/UnifiedTransactionsView/useUnifiedTxActions.ts
+++ b/app/components/Views/UnifiedTransactionsView/useUnifiedTxActions.ts
@@ -1,11 +1,9 @@
 import { providerErrors } from '@metamask/rpc-errors';
 import {
-  GasFeeEstimateLevel,
-  GasFeeEstimateType,
-  type FeeMarketGasFeeEstimates,
-  type GasFeeEstimates,
-  type GasPriceGasFeeEstimates,
-  type LegacyGasFeeEstimates,
+  CANCEL_RATE,
+  SPEED_UP_RATE,
+  type FeeMarketEIP1559Values,
+  type GasPriceValue,
   type TransactionMeta,
 } from '@metamask/transaction-controller';
 import { useNavigation } from '@react-navigation/native';
@@ -18,8 +16,7 @@ import { selectAccounts } from '../../../selectors/accountTrackerController';
 import { selectSelectedInternalAccountFormattedAddress } from '../../../selectors/accountsController';
 import { selectGasFeeEstimates } from '../../../selectors/confirmTransaction';
 import { isHardwareAccount } from '../../../util/address';
-import { decGWEIToHexWEI } from '../../../util/conversions';
-import { addHexPrefix } from '../../../util/number';
+import { getMediumGasPriceHex } from '../../../util/confirmation/gas';
 import { speedUpTransaction as speedUpTx } from '../../../util/transaction-controller';
 import { validateTransactionActionBalance } from '../../../util/transactions';
 import {
@@ -31,24 +28,23 @@ import { createQRSigningTransactionModalNavDetails } from '../../UI/QRHardware/Q
 
 type Maybe<T> = T | null | undefined;
 
-interface LegacyExistingGas {
+export interface LegacyExistingGas {
   isEIP1559Transaction?: false;
   gasPrice?: string | number;
 }
 
-interface Eip1559ExistingGas {
+export interface Eip1559ExistingGas {
   isEIP1559Transaction: true;
   maxFeePerGas?: string;
   maxPriorityFeePerGas?: string;
 }
 
-type ExistingGas = LegacyExistingGas | Eip1559ExistingGas;
+export type ExistingGas = LegacyExistingGas | Eip1559ExistingGas;
 
-interface ReplacementGasParams {
+/** Params for speed-up/cancel: controller shape only; optional error for UI flow */
+export type SpeedUpCancelParams = (GasPriceValue | FeeMarketEIP1559Values) & {
   error?: string;
-  suggestedMaxFeePerGasHex?: string;
-  suggestedMaxPriorityFeePerGasHex?: string;
-}
+};
 
 interface LedgerSignRequest {
   id: string;
@@ -80,7 +76,6 @@ export function useUnifiedTxActions() {
   const [cancel1559IsOpen, setCancel1559IsOpen] = useState(false);
   const [speedUpConfirmDisabled, setSpeedUpConfirmDisabled] = useState(false);
   const [cancelConfirmDisabled, setCancelConfirmDisabled] = useState(false);
-  const [existingGas, setExistingGas] = useState<ExistingGas | null>(null);
   const [existingTx, setExistingTx] = useState<TransactionMeta | null>(null);
   const [speedUpTxId, setSpeedUpTxId] = useState<Maybe<string>>(null);
   const [cancelTxId, setCancelTxId] = useState<Maybe<string>>(null);
@@ -97,7 +92,6 @@ export function useUnifiedTxActions() {
   const onSpeedUpCompleted = useCallback(() => {
     setSpeedUp1559IsOpen(false);
     setSpeedUpIsOpen(false);
-    setExistingGas(null);
     setSpeedUpTxId(null);
     setExistingTx(null);
   }, []);
@@ -105,7 +99,6 @@ export function useUnifiedTxActions() {
   const onCancelCompleted = useCallback(() => {
     setCancel1559IsOpen(false);
     setCancelIsOpen(false);
-    setExistingGas(null);
     setCancelTxId(null);
     setExistingTx(null);
   }, []);
@@ -136,176 +129,90 @@ export function useUnifiedTxActions() {
     [navigation, onSpeedUpCompleted, onCancelCompleted],
   );
 
-  const getGasPriceEstimate = () => {
-    if (!gasFeeEstimates) {
-      return addHexPrefix(String(decGWEIToHexWEI('0')));
-    }
-
-    if ('type' in (gasFeeEstimates as object)) {
-      const typedEstimates = gasFeeEstimates as GasFeeEstimates;
-      let estimateGweiDecimalRaw: string;
-
-      switch (typedEstimates.type) {
-        case GasFeeEstimateType.FeeMarket: {
-          const level = (typedEstimates as FeeMarketGasFeeEstimates)[
-            GasFeeEstimateLevel.Medium
-          ];
-          // suggestedMaxFeePerGas exists at medium level in FeeMarket estimates
-          estimateGweiDecimalRaw = (
-            level as unknown as { suggestedMaxFeePerGas: string }
-          ).suggestedMaxFeePerGas;
-          break;
-        }
-        case GasFeeEstimateType.Legacy: {
-          estimateGweiDecimalRaw = (typedEstimates as LegacyGasFeeEstimates)[
-            GasFeeEstimateLevel.Medium
-          ] as unknown as string;
-          break;
-        }
-        case GasFeeEstimateType.GasPrice: {
-          estimateGweiDecimalRaw = (typedEstimates as GasPriceGasFeeEstimates)
-            .gasPrice as string;
-          break;
-        }
-        default: {
-          estimateGweiDecimalRaw = '0';
-        }
-      }
-
-      return addHexPrefix(
-        String(decGWEIToHexWEI(String(estimateGweiDecimalRaw))),
-      );
-    }
-
-    const maybeFeeMarket = (
-      gasFeeEstimates as {
-        medium?: { suggestedMaxFeePerGas?: string } | string;
+  const getGasPriceEstimate = () => getMediumGasPriceHex(gasFeeEstimates);
+
+  const getCancelOrSpeedupValues = ():
+    | GasPriceValue
+    | FeeMarketEIP1559Values
+    | undefined => {
+    const txParams = existingTx?.txParams;
+    const existingGasPriceHex = txParams?.gasPrice;
+    if (existingGasPriceHex !== undefined && existingGasPriceHex !== '0x0') {
+      const existingGasPriceDecimal = parseInt(String(existingGasPriceHex), 16);
+      if (existingGasPriceDecimal !== 0) {
+        return undefined;
       }
-    ).medium;
-
-    if (
-      maybeFeeMarket &&
-      typeof maybeFeeMarket === 'object' &&
-      'suggestedMaxFeePerGas' in maybeFeeMarket
-    ) {
-      return addHexPrefix(
-        String(
-          decGWEIToHexWEI(
-            String(
-              (maybeFeeMarket as { suggestedMaxFeePerGas?: string })
-                .suggestedMaxFeePerGas ?? '0',
-            ),
-          ),
-        ),
-      );
-    }
-
-    if (
-      maybeFeeMarket &&
-      typeof maybeFeeMarket === 'string' &&
-      maybeFeeMarket.length > 0
-    ) {
-      return addHexPrefix(String(decGWEIToHexWEI(maybeFeeMarket)));
-    }
-
-    const maybeGasPrice = (gasFeeEstimates as { gasPrice?: string }).gasPrice;
-    if (maybeGasPrice) {
-      return addHexPrefix(String(decGWEIToHexWEI(String(maybeGasPrice))));
-    }
-
-    return addHexPrefix(String(decGWEIToHexWEI('0')));
-  };
-
-  const getCancelOrSpeedupValues = (
-    transactionObject?: ReplacementGasParams,
-  ) => {
-    const { suggestedMaxFeePerGasHex, suggestedMaxPriorityFeePerGasHex } =
-      transactionObject ?? {};
-
-    if (suggestedMaxFeePerGasHex) {
-      return {
-        maxFeePerGas: `0x${suggestedMaxFeePerGasHex}`,
-        maxPriorityFeePerGas: `0x${suggestedMaxPriorityFeePerGasHex}`,
-      };
-    }
-    if (
-      existingGas &&
-      'gasPrice' in existingGas &&
-      existingGas.gasPrice !== 0
-    ) {
-      // Transaction controller will multiply existing gas price by the rate.
-      return undefined;
     }
     return { gasPrice: getGasPriceEstimate() };
   };
 
-  const onSpeedUpAction = (
-    open: boolean,
-    nextExistingGas?: ExistingGas,
-    tx?: TransactionMeta,
-  ) => {
+  const onSpeedUpAction = (open: boolean, tx?: TransactionMeta) => {
     if (!open) {
       setSpeedUpIsOpen(false);
       setSpeedUp1559IsOpen(false);
       return;
     }
-    setExistingGas(nextExistingGas ?? null);
-    setExistingTx(tx ?? null);
-    setSpeedUpTxId(tx?.id ?? null);
-    if (nextExistingGas?.isEIP1559Transaction) {
-      setSpeedUp1559IsOpen(true);
-    } else {
-      if (!tx) {
-        return;
-      }
-      const disabled = Boolean(
-        validateTransactionActionBalance(tx, '1.1', accounts),
-      );
-      setSpeedUpConfirmDisabled(disabled);
-      setSpeedUpIsOpen(true);
+    if (!tx) {
+      return;
     }
+    setExistingTx(tx);
+    setSpeedUpTxId(tx.id ?? null);
+    const disabled = Boolean(
+      validateTransactionActionBalance(tx, SPEED_UP_RATE.toString(), accounts),
+    );
+    setSpeedUpConfirmDisabled(disabled);
+    setSpeedUpIsOpen(true);
   };
 
-  const onCancelAction = (
-    open: boolean,
-    nextExistingGas?: ExistingGas,
-    tx?: TransactionMeta,
-  ) => {
+  const onCancelAction = (open: boolean, tx?: TransactionMeta) => {
     if (!open) {
       setCancelIsOpen(false);
       setCancel1559IsOpen(false);
       return;
     }
-    setExistingGas(nextExistingGas ?? null);
-    setExistingTx(tx ?? null);
-    setCancelTxId(tx?.id ?? null);
-    if (nextExistingGas?.isEIP1559Transaction) {
-      setCancel1559IsOpen(true);
-    } else {
-      if (!tx) {
-        return;
-      }
-      const disabled = Boolean(
-        validateTransactionActionBalance(tx, '1.1', accounts),
-      );
-      setCancelConfirmDisabled(disabled);
-      setCancelIsOpen(true);
+    if (!tx) {
+      return;
+    }
+    setExistingTx(tx);
+    setCancelTxId(tx.id ?? null);
+    const disabled = Boolean(
+      validateTransactionActionBalance(tx, CANCEL_RATE.toString(), accounts),
+    );
+    setCancelConfirmDisabled(disabled);
+    setCancelIsOpen(true);
+  };
+
+  const getParamsToSend = (
+    params?: SpeedUpCancelParams,
+  ): GasPriceValue | FeeMarketEIP1559Values | undefined => {
+    if (params?.error) {
+      return undefined;
+    }
+    // Legacy tx with gasPrice 0x0 would produce 0 from the modal; fall back to market estimate so the replacement gets mined.
+    if (
+      params &&
+      'gasPrice' in params &&
+      (params.gasPrice === '0x0' || parseInt(String(params.gasPrice), 16) === 0)
+    ) {
+      return getCancelOrSpeedupValues();
+    }
+    if (params && ('maxFeePerGas' in params || 'gasPrice' in params)) {
+      return params;
     }
+    return getCancelOrSpeedupValues();
   };
 
-  const speedUpTransaction = async (
-    transactionObject?: ReplacementGasParams,
-  ) => {
+  const speedUpTransaction = async (params?: SpeedUpCancelParams) => {
     try {
-      if (transactionObject?.error) {
-        throw new Error(transactionObject.error);
+      if (params && 'error' in params && params.error) {
+        throw new Error(params.error);
       }
       if (!speedUpTxId) {
         throw new Error('Missing transaction id for speed up');
       }
 
       if (isLedgerAccount) {
-        const gasValues = getCancelOrSpeedupValues(transactionObject);
+        const gasValues = getParamsToSend(params);
         const isEip1559 = gasValues && 'maxFeePerGas' in gasValues;
 
         await signLedgerTransaction({
@@ -321,7 +228,7 @@ export function useUnifiedTxActions() {
         return;
       }
 
-      await speedUpTx(speedUpTxId, getCancelOrSpeedupValues(transactionObject));
+      await speedUpTx(speedUpTxId, getParamsToSend(params));
       onSpeedUpCompleted();
     } catch (error: unknown) {
       toggleRetry(getErrorMessage(error));
@@ -330,19 +237,17 @@ export function useUnifiedTxActions() {
     }
   };
 
-  const cancelTransaction = async (
-    transactionObject?: ReplacementGasParams,
-  ) => {
+  const cancelTransaction = async (params?: SpeedUpCancelParams) => {
     try {
-      if (transactionObject?.error) {
-        throw new Error(transactionObject.error);
+      if (params && 'error' in params && params.error) {
+        throw new Error(params.error);
       }
       if (!cancelTxId) {
         throw new Error('Missing transaction id for cancel');
       }
 
       if (isLedgerAccount) {
-        const gasValues = getCancelOrSpeedupValues(transactionObject);
+        const gasValues = getParamsToSend(params);
         const isEip1559 = gasValues && 'maxFeePerGas' in gasValues;
 
         await signLedgerTransaction({
@@ -359,7 +264,7 @@ export function useUnifiedTxActions() {
 
       await Engine.context.TransactionController.stopTransaction(
         cancelTxId,
-        getCancelOrSpeedupValues(transactionObject),
+        getParamsToSend(params),
       );
       onCancelCompleted();
     } catch (error: unknown) {
@@ -399,7 +304,6 @@ export function useUnifiedTxActions() {
     cancel1559IsOpen,
     speedUpConfirmDisabled,
     cancelConfirmDisabled,
-    existingGas,
     existingTx,
     speedUpTxId,
     cancelTxId,
diff --git a/app/components/Views/Wallet/__snapshots__/index.test.tsx.snap b/app/components/Views/Wallet/__snapshots__/index.test.tsx.snap
index 7f443d2bb326..49c855dfbf3d 100644
--- a/app/components/Views/Wallet/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/Wallet/__snapshots__/index.test.tsx.snap
@@ -85,7 +85,7 @@ exports[`Wallet Conditional Rendering should render banner when basic functional
                 {
                   "alignItems": "center",
                   "backgroundColor": "#ffffff",
-                  "borderColor": "#b7bbc8",
+                  "borderColor": "#949596",
                   "borderRadius": 4,
                   "borderWidth": 0,
                   "flexDirection": "row",
@@ -100,7 +100,7 @@ exports[`Wallet Conditional Rendering should render banner when basic functional
                 numberOfLines={1}
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Medium",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -112,7 +112,7 @@ exports[`Wallet Conditional Rendering should render banner when basic functional
                 Account 2
               </Text>
               <SvgMock
-                color="#121314"
+                color="#131416"
                 fill="currentColor"
                 height={16}
                 name="ArrowDown"
@@ -225,7 +225,7 @@ exports[`Wallet Conditional Rendering should render banner when basic functional
                           style={
                             [
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "height": 24,
                                 "width": 24,
                               },
@@ -303,7 +303,7 @@ exports[`Wallet Conditional Rendering should render banner when basic functional
                       style={
                         [
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "height": 24,
                             "width": 24,
                           },
@@ -393,7 +393,7 @@ exports[`Wallet Conditional Rendering should render banner when basic functional
                           style={
                             [
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "height": 24,
                                 "width": 24,
                               },
@@ -485,7 +485,7 @@ exports[`Wallet Conditional Rendering should render banner when basic functional
                       style={
                         [
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "height": 24,
                             "width": 24,
                           },
@@ -736,7 +736,7 @@ exports[`Wallet Conditional Rendering should render banner when basic functional
                             accessibilityRole="text"
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Bold",
                                 "fontSize": 24,
                                 "letterSpacing": 0,
@@ -793,7 +793,7 @@ exports[`Wallet Conditional Rendering should render banner when basic functional
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -851,7 +851,7 @@ exports[`Wallet Conditional Rendering should render banner when basic functional
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -909,7 +909,7 @@ exports[`Wallet Conditional Rendering should render banner when basic functional
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Medium",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -1019,7 +1019,7 @@ TypeError: Cannot read properties of undefined (reading 'isNftFetchingProgress')
                               {
                                 "alignItems": "center",
                                 "alignSelf": "stretch",
-                                "backgroundColor": "#121314",
+                                "backgroundColor": "#131416",
                                 "borderRadius": 12,
                                 "flexDirection": "row",
                                 "height": 48,
@@ -1055,7 +1055,7 @@ TypeError: Cannot read properties of undefined (reading 'isNftFetchingProgress')
                               {
                                 "alignItems": "center",
                                 "alignSelf": "stretch",
-                                "backgroundColor": "#3c4d9d0f",
+                                "backgroundColor": "#b4b4b528",
                                 "borderColor": "transparent",
                                 "borderRadius": 12,
                                 "borderWidth": 1,
@@ -1071,7 +1071,7 @@ TypeError: Cannot read properties of undefined (reading 'isNftFetchingProgress')
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Medium",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -1093,7 +1093,7 @@ TypeError: Cannot read properties of undefined (reading 'isNftFetchingProgress')
                               {
                                 "alignItems": "center",
                                 "alignSelf": "stretch",
-                                "backgroundColor": "#3c4d9d0f",
+                                "backgroundColor": "#b4b4b528",
                                 "borderColor": "transparent",
                                 "borderRadius": 12,
                                 "borderWidth": 1,
@@ -1109,7 +1109,7 @@ TypeError: Cannot read properties of undefined (reading 'isNftFetchingProgress')
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Medium",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -1220,7 +1220,7 @@ exports[`Wallet Conditional Rendering should render loader when no selected acco
                 {
                   "alignItems": "center",
                   "backgroundColor": "#ffffff",
-                  "borderColor": "#b7bbc8",
+                  "borderColor": "#949596",
                   "borderRadius": 4,
                   "borderWidth": 0,
                   "flexDirection": "row",
@@ -1235,7 +1235,7 @@ exports[`Wallet Conditional Rendering should render loader when no selected acco
                 numberOfLines={1}
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Medium",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -1247,7 +1247,7 @@ exports[`Wallet Conditional Rendering should render loader when no selected acco
                 Account 2
               </Text>
               <SvgMock
-                color="#121314"
+                color="#131416"
                 fill="currentColor"
                 height={16}
                 name="ArrowDown"
@@ -1360,7 +1360,7 @@ exports[`Wallet Conditional Rendering should render loader when no selected acco
                           style={
                             [
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "height": 24,
                                 "width": 24,
                               },
@@ -1438,7 +1438,7 @@ exports[`Wallet Conditional Rendering should render loader when no selected acco
                       style={
                         [
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "height": 24,
                             "width": 24,
                           },
@@ -1528,7 +1528,7 @@ exports[`Wallet Conditional Rendering should render loader when no selected acco
                           style={
                             [
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "height": 24,
                                 "width": 24,
                               },
@@ -1620,7 +1620,7 @@ exports[`Wallet Conditional Rendering should render loader when no selected acco
                       style={
                         [
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "height": 24,
                             "width": 24,
                           },
@@ -1871,7 +1871,7 @@ exports[`Wallet Conditional Rendering should render loader when no selected acco
                             accessibilityRole="text"
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Bold",
                                 "fontSize": 24,
                                 "letterSpacing": 0,
@@ -1928,7 +1928,7 @@ exports[`Wallet Conditional Rendering should render loader when no selected acco
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -1986,7 +1986,7 @@ exports[`Wallet Conditional Rendering should render loader when no selected acco
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -2044,7 +2044,7 @@ exports[`Wallet Conditional Rendering should render loader when no selected acco
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Medium",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -2154,7 +2154,7 @@ TypeError: Cannot read properties of undefined (reading 'isNftFetchingProgress')
                               {
                                 "alignItems": "center",
                                 "alignSelf": "stretch",
-                                "backgroundColor": "#121314",
+                                "backgroundColor": "#131416",
                                 "borderRadius": 12,
                                 "flexDirection": "row",
                                 "height": 48,
@@ -2190,7 +2190,7 @@ TypeError: Cannot read properties of undefined (reading 'isNftFetchingProgress')
                               {
                                 "alignItems": "center",
                                 "alignSelf": "stretch",
-                                "backgroundColor": "#3c4d9d0f",
+                                "backgroundColor": "#b4b4b528",
                                 "borderColor": "transparent",
                                 "borderRadius": 12,
                                 "borderWidth": 1,
@@ -2206,7 +2206,7 @@ TypeError: Cannot read properties of undefined (reading 'isNftFetchingProgress')
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Medium",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -2228,7 +2228,7 @@ TypeError: Cannot read properties of undefined (reading 'isNftFetchingProgress')
                               {
                                 "alignItems": "center",
                                 "alignSelf": "stretch",
-                                "backgroundColor": "#3c4d9d0f",
+                                "backgroundColor": "#b4b4b528",
                                 "borderColor": "transparent",
                                 "borderRadius": 12,
                                 "borderWidth": 1,
@@ -2244,7 +2244,7 @@ TypeError: Cannot read properties of undefined (reading 'isNftFetchingProgress')
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Medium",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -2355,7 +2355,7 @@ exports[`Wallet should render correctly 1`] = `
                 {
                   "alignItems": "center",
                   "backgroundColor": "#ffffff",
-                  "borderColor": "#b7bbc8",
+                  "borderColor": "#949596",
                   "borderRadius": 4,
                   "borderWidth": 0,
                   "flexDirection": "row",
@@ -2370,7 +2370,7 @@ exports[`Wallet should render correctly 1`] = `
                 numberOfLines={1}
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Medium",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -2382,7 +2382,7 @@ exports[`Wallet should render correctly 1`] = `
                 Account 2
               </Text>
               <SvgMock
-                color="#121314"
+                color="#131416"
                 fill="currentColor"
                 height={16}
                 name="ArrowDown"
@@ -2495,7 +2495,7 @@ exports[`Wallet should render correctly 1`] = `
                           style={
                             [
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "height": 24,
                                 "width": 24,
                               },
@@ -2573,7 +2573,7 @@ exports[`Wallet should render correctly 1`] = `
                       style={
                         [
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "height": 24,
                             "width": 24,
                           },
@@ -2663,7 +2663,7 @@ exports[`Wallet should render correctly 1`] = `
                           style={
                             [
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "height": 24,
                                 "width": 24,
                               },
@@ -2755,7 +2755,7 @@ exports[`Wallet should render correctly 1`] = `
                       style={
                         [
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "height": 24,
                             "width": 24,
                           },
@@ -3006,7 +3006,7 @@ exports[`Wallet should render correctly 1`] = `
                             accessibilityRole="text"
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Bold",
                                 "fontSize": 24,
                                 "letterSpacing": 0,
@@ -3063,7 +3063,7 @@ exports[`Wallet should render correctly 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -3121,7 +3121,7 @@ exports[`Wallet should render correctly 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -3179,7 +3179,7 @@ exports[`Wallet should render correctly 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Medium",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -3289,7 +3289,7 @@ TypeError: Cannot read properties of undefined (reading 'isNftFetchingProgress')
                               {
                                 "alignItems": "center",
                                 "alignSelf": "stretch",
-                                "backgroundColor": "#121314",
+                                "backgroundColor": "#131416",
                                 "borderRadius": 12,
                                 "flexDirection": "row",
                                 "height": 48,
@@ -3325,7 +3325,7 @@ TypeError: Cannot read properties of undefined (reading 'isNftFetchingProgress')
                               {
                                 "alignItems": "center",
                                 "alignSelf": "stretch",
-                                "backgroundColor": "#3c4d9d0f",
+                                "backgroundColor": "#b4b4b528",
                                 "borderColor": "transparent",
                                 "borderRadius": 12,
                                 "borderWidth": 1,
@@ -3341,7 +3341,7 @@ TypeError: Cannot read properties of undefined (reading 'isNftFetchingProgress')
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Medium",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -3363,7 +3363,7 @@ TypeError: Cannot read properties of undefined (reading 'isNftFetchingProgress')
                               {
                                 "alignItems": "center",
                                 "alignSelf": "stretch",
-                                "backgroundColor": "#3c4d9d0f",
+                                "backgroundColor": "#b4b4b528",
                                 "borderColor": "transparent",
                                 "borderRadius": 12,
                                 "borderWidth": 1,
@@ -3379,7 +3379,7 @@ TypeError: Cannot read properties of undefined (reading 'isNftFetchingProgress')
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Medium",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -3490,7 +3490,7 @@ exports[`Wallet should render correctly when Solana support is enabled 1`] = `
                 {
                   "alignItems": "center",
                   "backgroundColor": "#ffffff",
-                  "borderColor": "#b7bbc8",
+                  "borderColor": "#949596",
                   "borderRadius": 4,
                   "borderWidth": 0,
                   "flexDirection": "row",
@@ -3505,7 +3505,7 @@ exports[`Wallet should render correctly when Solana support is enabled 1`] = `
                 numberOfLines={1}
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Medium",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -3517,7 +3517,7 @@ exports[`Wallet should render correctly when Solana support is enabled 1`] = `
                 Account 2
               </Text>
               <SvgMock
-                color="#121314"
+                color="#131416"
                 fill="currentColor"
                 height={16}
                 name="ArrowDown"
@@ -3630,7 +3630,7 @@ exports[`Wallet should render correctly when Solana support is enabled 1`] = `
                           style={
                             [
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "height": 24,
                                 "width": 24,
                               },
@@ -3708,7 +3708,7 @@ exports[`Wallet should render correctly when Solana support is enabled 1`] = `
                       style={
                         [
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "height": 24,
                             "width": 24,
                           },
@@ -3798,7 +3798,7 @@ exports[`Wallet should render correctly when Solana support is enabled 1`] = `
                           style={
                             [
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "height": 24,
                                 "width": 24,
                               },
@@ -3890,7 +3890,7 @@ exports[`Wallet should render correctly when Solana support is enabled 1`] = `
                       style={
                         [
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "height": 24,
                             "width": 24,
                           },
@@ -4141,7 +4141,7 @@ exports[`Wallet should render correctly when Solana support is enabled 1`] = `
                             accessibilityRole="text"
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Bold",
                                 "fontSize": 24,
                                 "letterSpacing": 0,
@@ -4198,7 +4198,7 @@ exports[`Wallet should render correctly when Solana support is enabled 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -4256,7 +4256,7 @@ exports[`Wallet should render correctly when Solana support is enabled 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -4314,7 +4314,7 @@ exports[`Wallet should render correctly when Solana support is enabled 1`] = `
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Medium",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -4424,7 +4424,7 @@ TypeError: Cannot read properties of undefined (reading 'isNftFetchingProgress')
                               {
                                 "alignItems": "center",
                                 "alignSelf": "stretch",
-                                "backgroundColor": "#121314",
+                                "backgroundColor": "#131416",
                                 "borderRadius": 12,
                                 "flexDirection": "row",
                                 "height": 48,
@@ -4460,7 +4460,7 @@ TypeError: Cannot read properties of undefined (reading 'isNftFetchingProgress')
                               {
                                 "alignItems": "center",
                                 "alignSelf": "stretch",
-                                "backgroundColor": "#3c4d9d0f",
+                                "backgroundColor": "#b4b4b528",
                                 "borderColor": "transparent",
                                 "borderRadius": 12,
                                 "borderWidth": 1,
@@ -4476,7 +4476,7 @@ TypeError: Cannot read properties of undefined (reading 'isNftFetchingProgress')
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Medium",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -4498,7 +4498,7 @@ TypeError: Cannot read properties of undefined (reading 'isNftFetchingProgress')
                               {
                                 "alignItems": "center",
                                 "alignSelf": "stretch",
-                                "backgroundColor": "#3c4d9d0f",
+                                "backgroundColor": "#b4b4b528",
                                 "borderColor": "transparent",
                                 "borderRadius": 12,
                                 "borderWidth": 1,
@@ -4514,7 +4514,7 @@ TypeError: Cannot read properties of undefined (reading 'isNftFetchingProgress')
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Medium",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -4625,7 +4625,7 @@ exports[`Wallet should render correctly when there are no detected tokens 1`] =
                 {
                   "alignItems": "center",
                   "backgroundColor": "#ffffff",
-                  "borderColor": "#b7bbc8",
+                  "borderColor": "#949596",
                   "borderRadius": 4,
                   "borderWidth": 0,
                   "flexDirection": "row",
@@ -4640,7 +4640,7 @@ exports[`Wallet should render correctly when there are no detected tokens 1`] =
                 numberOfLines={1}
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Medium",
                     "fontSize": 16,
                     "letterSpacing": 0,
@@ -4652,7 +4652,7 @@ exports[`Wallet should render correctly when there are no detected tokens 1`] =
                 Account 2
               </Text>
               <SvgMock
-                color="#121314"
+                color="#131416"
                 fill="currentColor"
                 height={16}
                 name="ArrowDown"
@@ -4765,7 +4765,7 @@ exports[`Wallet should render correctly when there are no detected tokens 1`] =
                           style={
                             [
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "height": 24,
                                 "width": 24,
                               },
@@ -4843,7 +4843,7 @@ exports[`Wallet should render correctly when there are no detected tokens 1`] =
                       style={
                         [
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "height": 24,
                             "width": 24,
                           },
@@ -4933,7 +4933,7 @@ exports[`Wallet should render correctly when there are no detected tokens 1`] =
                           style={
                             [
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "height": 24,
                                 "width": 24,
                               },
@@ -5025,7 +5025,7 @@ exports[`Wallet should render correctly when there are no detected tokens 1`] =
                       style={
                         [
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "height": 24,
                             "width": 24,
                           },
@@ -5276,7 +5276,7 @@ exports[`Wallet should render correctly when there are no detected tokens 1`] =
                             accessibilityRole="text"
                             style={
                               {
-                                "color": "#121314",
+                                "color": "#131416",
                                 "fontFamily": "Geist-Bold",
                                 "fontSize": 24,
                                 "letterSpacing": 0,
@@ -5333,7 +5333,7 @@ exports[`Wallet should render correctly when there are no detected tokens 1`] =
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -5391,7 +5391,7 @@ exports[`Wallet should render correctly when there are no detected tokens 1`] =
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -5449,7 +5449,7 @@ exports[`Wallet should render correctly when there are no detected tokens 1`] =
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Medium",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -5559,7 +5559,7 @@ TypeError: Cannot read properties of undefined (reading 'isNftFetchingProgress')
                               {
                                 "alignItems": "center",
                                 "alignSelf": "stretch",
-                                "backgroundColor": "#121314",
+                                "backgroundColor": "#131416",
                                 "borderRadius": 12,
                                 "flexDirection": "row",
                                 "height": 48,
@@ -5595,7 +5595,7 @@ TypeError: Cannot read properties of undefined (reading 'isNftFetchingProgress')
                               {
                                 "alignItems": "center",
                                 "alignSelf": "stretch",
-                                "backgroundColor": "#3c4d9d0f",
+                                "backgroundColor": "#b4b4b528",
                                 "borderColor": "transparent",
                                 "borderRadius": 12,
                                 "borderWidth": 1,
@@ -5611,7 +5611,7 @@ TypeError: Cannot read properties of undefined (reading 'isNftFetchingProgress')
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Medium",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
@@ -5633,7 +5633,7 @@ TypeError: Cannot read properties of undefined (reading 'isNftFetchingProgress')
                               {
                                 "alignItems": "center",
                                 "alignSelf": "stretch",
-                                "backgroundColor": "#3c4d9d0f",
+                                "backgroundColor": "#b4b4b528",
                                 "borderColor": "transparent",
                                 "borderRadius": 12,
                                 "borderWidth": 1,
@@ -5649,7 +5649,7 @@ TypeError: Cannot read properties of undefined (reading 'isNftFetchingProgress')
                               accessibilityRole="text"
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Medium",
                                   "fontSize": 16,
                                   "letterSpacing": 0,
diff --git a/app/components/Views/Wallet/hooks/index.ts b/app/components/Views/Wallet/hooks/index.ts
index d609b56de481..ec6332bede48 100644
--- a/app/components/Views/Wallet/hooks/index.ts
+++ b/app/components/Views/Wallet/hooks/index.ts
@@ -1 +1,2 @@
 export { useBalanceRefresh } from './useBalanceRefresh';
+export { useHomepageEntryPoint } from './useHomepageEntryPoint';
diff --git a/app/components/Views/Wallet/hooks/useBalanceRefresh.test.ts b/app/components/Views/Wallet/hooks/useBalanceRefresh.test.ts
index 8c45aef115a3..50e145e378b8 100644
--- a/app/components/Views/Wallet/hooks/useBalanceRefresh.test.ts
+++ b/app/components/Views/Wallet/hooks/useBalanceRefresh.test.ts
@@ -33,6 +33,7 @@ jest.mock('../../../../core/Engine', () => ({
 }));
 
 jest.mock('../../../../util/Logger', () => ({
+  log: jest.fn(),
   error: jest.fn(),
 }));
 
@@ -85,7 +86,7 @@ describe('useBalanceRefresh', () => {
     ).toHaveBeenCalledWith(['ETH', 'POL']);
   });
 
-  it('handles individual promise rejections gracefully without logging', async () => {
+  it('does not log errors when individual refresh promises reject', async () => {
     const mockError = new Error('Refresh failed');
     (
       Engine.context.AccountTrackerController.refresh as jest.Mock
@@ -101,7 +102,7 @@ describe('useBalanceRefresh', () => {
     expect(Logger.error).not.toHaveBeenCalled();
   });
 
-  it('handles timeout gracefully', async () => {
+  it('logs timeout as non-error without emitting error events', async () => {
     jest.useFakeTimers();
 
     (
@@ -123,11 +124,29 @@ describe('useBalanceRefresh', () => {
 
     await refreshPromise;
 
+    expect(Logger.log).toHaveBeenCalledWith('Balance refresh timed out');
+    expect(Logger.error).not.toHaveBeenCalled();
+
+    jest.useRealTimers();
+  });
+
+  it('logs unexpected refresh exceptions as errors', async () => {
+    const unexpectedError = new Error('Unexpected refresh failure');
+    (
+      Engine.context.AccountTrackerController.refresh as jest.Mock
+    ).mockImplementationOnce(() => {
+      throw unexpectedError;
+    });
+
+    const { result } = renderHook(() => useBalanceRefresh());
+
+    await act(async () => {
+      await result.current.refreshBalance();
+    });
+
     expect(Logger.error).toHaveBeenCalledWith(
-      expect.objectContaining({ message: 'Balance refresh timed out' }),
+      unexpectedError,
       'Error refreshing balance',
     );
-
-    jest.useRealTimers();
   });
 });
diff --git a/app/components/Views/Wallet/hooks/useBalanceRefresh.ts b/app/components/Views/Wallet/hooks/useBalanceRefresh.ts
index ae7eb5bc85b6..cf7d82089f53 100644
--- a/app/components/Views/Wallet/hooks/useBalanceRefresh.ts
+++ b/app/components/Views/Wallet/hooks/useBalanceRefresh.ts
@@ -8,6 +8,10 @@ import {
 } from '../../../../selectors/networkController';
 
 const REFRESH_TIMEOUT_MS = 5000;
+const REFRESH_TIMEOUT_ERROR_MESSAGE = 'Balance refresh timed out';
+
+const isRefreshTimeoutError = (error: unknown): error is Error =>
+  error instanceof Error && error.message === REFRESH_TIMEOUT_ERROR_MESSAGE;
 
 /**
  * Hook to manage balance refresh functionality for the Wallet screen.
@@ -42,12 +46,17 @@ export const useBalanceRefresh = () => {
         ]),
         new Promise((_, reject) =>
           setTimeout(
-            () => reject(new Error('Balance refresh timed out')),
+            () => reject(new Error(REFRESH_TIMEOUT_ERROR_MESSAGE)),
             REFRESH_TIMEOUT_MS,
           ),
         ),
       ]);
     } catch (error) {
+      if (isRefreshTimeoutError(error)) {
+        Logger.log(REFRESH_TIMEOUT_ERROR_MESSAGE);
+        return;
+      }
+
       Logger.error(error as Error, 'Error refreshing balance');
     }
   }, [evmNetworkConfigurations, nativeCurrencies]);
diff --git a/app/components/Views/Wallet/hooks/useHomepageEntryPoint.ts b/app/components/Views/Wallet/hooks/useHomepageEntryPoint.ts
new file mode 100644
index 000000000000..dde07c2ad01c
--- /dev/null
+++ b/app/components/Views/Wallet/hooks/useHomepageEntryPoint.ts
@@ -0,0 +1,94 @@
+import { useCallback, useRef, useState } from 'react';
+import {
+  useFocusEffect,
+  type NavigationProp,
+  type ParamListBase,
+} from '@react-navigation/native';
+import {
+  HomepageEntryPoint,
+  HomepageEntryPoints,
+} from '../../Homepage/context/HomepageScrollContext';
+
+// React Navigation v5 exposes these via "dangerously" prefixed methods.
+// v6 removed the prefix; both variants are supported here.
+type NavigationWithParent = NavigationProp<ParamListBase> & {
+  dangerouslyGetParent?: () => NavigationWithParent | undefined;
+  getParent?: () => NavigationWithParent | undefined;
+  dangerouslyGetState?: () => { type: string };
+  getState?: () => { type: string };
+};
+
+/**
+ * Tracks *why* the Homepage is being visited on each focus cycle.
+ *
+ * Strategy — blur + Tab state comparison:
+ * In the `useFocusEffect` cleanup (blur), walk up the navigator tree and record
+ * the Tab navigator's active-tab index.  After a tab-press the Tab state has
+ * already updated to the new tab's index (≠ 0 for Home); after a back-navigation
+ * or modal dismiss within the Home tab the index stays 0.
+ * On the *next* focus that stored index determines the entry point.
+ *
+ * Returns the current `entryPoint` and a monotonically-incrementing `visitId`
+ * (bumped on every focus) so consumers can gate work on a new visit.
+ */
+export function useHomepageEntryPoint(
+  navigation: NavigationProp<ParamListBase>,
+): {
+  entryPoint: HomepageEntryPoint;
+  visitId: number;
+} {
+  const [entryPoint, setEntryPoint] = useState<HomepageEntryPoint>(
+    HomepageEntryPoints.APP_OPENED,
+  );
+  const [visitId, setVisitId] = useState(0);
+
+  // True on the very first focus (app open); cleared immediately after.
+  const isFirstFocusRef = useRef(true);
+  // Tab navigator's active-tab index recorded during the previous blur.
+  const prevTabIndexRef = useRef<number | undefined>(undefined);
+
+  useFocusEffect(
+    useCallback(() => {
+      let ep: HomepageEntryPoint;
+      if (isFirstFocusRef.current) {
+        ep = HomepageEntryPoints.APP_OPENED;
+        isFirstFocusRef.current = false;
+      } else if (
+        prevTabIndexRef.current !== undefined &&
+        prevTabIndexRef.current !== 0
+      ) {
+        // Tab navigator was on a non-Home tab before this focus → tab press.
+        ep = HomepageEntryPoints.HOME_TAB;
+      } else {
+        ep = HomepageEntryPoints.NAVIGATED_BACK;
+      }
+      setEntryPoint(ep);
+      setVisitId((prev) => prev + 1);
+
+      return () => {
+        // On blur, record the Tab navigator's current active-tab index so the
+        // next focus can compare it to determine the entry point.
+        const nav = navigation as NavigationWithParent;
+        const getParentNav = (
+          n: NavigationWithParent,
+        ): NavigationWithParent | undefined =>
+          n.dangerouslyGetParent?.() ?? n.getParent?.();
+
+        let cur: NavigationWithParent | undefined = getParentNav(nav);
+        while (cur) {
+          const state = (cur.dangerouslyGetState?.() ?? cur.getState?.()) as
+            | { type?: string; index?: number }
+            | undefined;
+          if (state?.type === 'tab') {
+            prevTabIndexRef.current = state.index;
+            return;
+          }
+          cur = getParentNav(cur);
+        }
+        prevTabIndexRef.current = 0; // fallback: assume same tab
+      };
+    }, [navigation]),
+  );
+
+  return { entryPoint, visitId };
+}
diff --git a/app/components/Views/Wallet/index.test.tsx b/app/components/Views/Wallet/index.test.tsx
index d4d4dd2ee2cf..0048a72ca1a2 100644
--- a/app/components/Views/Wallet/index.test.tsx
+++ b/app/components/Views/Wallet/index.test.tsx
@@ -404,6 +404,17 @@ jest.mock('@react-navigation/native', () => {
     useNavigation: jest.fn(() => ({
       navigate: mockNavigate,
       setOptions: mockSetOptions,
+      addListener: jest.fn(() => jest.fn()),
+      isFocused: jest.fn(() => false),
+      dangerouslyGetParent: jest.fn(() => ({
+        dangerouslyGetState: jest.fn(() => ({ type: 'stack' })),
+        addListener: jest.fn(() => jest.fn()),
+        dangerouslyGetParent: jest.fn(() => ({
+          dangerouslyGetState: jest.fn(() => ({ type: 'tab' })),
+          addListener: jest.fn(() => jest.fn()),
+          dangerouslyGetParent: jest.fn(() => undefined),
+        })),
+      })),
     })),
     useRoute: jest.fn(() => ({
       params: {},
@@ -903,6 +914,17 @@ describe('Wallet', () => {
       const mockNavigationObject = {
         navigate: mockNavigate,
         setOptions: mockSetOptions,
+        addListener: jest.fn(() => jest.fn()),
+        isFocused: jest.fn(() => false),
+        dangerouslyGetParent: jest.fn(() => ({
+          dangerouslyGetState: jest.fn(() => ({ type: 'stack' })),
+          addListener: jest.fn(() => jest.fn()),
+          dangerouslyGetParent: jest.fn(() => ({
+            dangerouslyGetState: jest.fn(() => ({ type: 'tab' })),
+            addListener: jest.fn(() => jest.fn()),
+            dangerouslyGetParent: jest.fn(() => undefined),
+          })),
+        })),
       } as unknown as NavigationProp<ParamListBase>;
 
       // Clear previous calls
@@ -973,6 +995,17 @@ describe('Wallet', () => {
       const mockNavigationObject = {
         navigate: mockNavigate,
         setOptions: mockSetOptions,
+        addListener: jest.fn(() => jest.fn()),
+        isFocused: jest.fn(() => false),
+        dangerouslyGetParent: jest.fn(() => ({
+          dangerouslyGetState: jest.fn(() => ({ type: 'stack' })),
+          addListener: jest.fn(() => jest.fn()),
+          dangerouslyGetParent: jest.fn(() => ({
+            dangerouslyGetState: jest.fn(() => ({ type: 'tab' })),
+            addListener: jest.fn(() => jest.fn()),
+            dangerouslyGetParent: jest.fn(() => undefined),
+          })),
+        })),
       } as unknown as NavigationProp<ParamListBase>;
 
       // Clear previous calls
@@ -1022,6 +1055,17 @@ describe('Wallet', () => {
       mockNavigation = {
         navigate: mockNavigate,
         setOptions: mockSetOptions,
+        addListener: jest.fn(() => jest.fn()),
+        isFocused: jest.fn(() => false),
+        dangerouslyGetParent: jest.fn(() => ({
+          dangerouslyGetState: jest.fn(() => ({ type: 'stack' })),
+          addListener: jest.fn(() => jest.fn()),
+          dangerouslyGetParent: jest.fn(() => ({
+            dangerouslyGetState: jest.fn(() => ({ type: 'tab' })),
+            addListener: jest.fn(() => jest.fn()),
+            dangerouslyGetParent: jest.fn(() => undefined),
+          })),
+        })),
       } as unknown as NavigationProp<ParamListBase>;
 
       // Default to enabled
@@ -1198,6 +1242,17 @@ describe('Wallet', () => {
       mockNavigation = {
         navigate: mockNavigate,
         setOptions: mockSetOptions,
+        addListener: jest.fn(() => jest.fn()),
+        isFocused: jest.fn(() => false),
+        dangerouslyGetParent: jest.fn(() => ({
+          dangerouslyGetState: jest.fn(() => ({ type: 'stack' })),
+          addListener: jest.fn(() => jest.fn()),
+          dangerouslyGetParent: jest.fn(() => ({
+            dangerouslyGetState: jest.fn(() => ({ type: 'tab' })),
+            addListener: jest.fn(() => jest.fn()),
+            dangerouslyGetParent: jest.fn(() => undefined),
+          })),
+        })),
       } as unknown as NavigationProp<ParamListBase>;
 
       // Default to enabled
@@ -1423,6 +1478,17 @@ describe('Wallet', () => {
       mockNavigation = {
         navigate: mockNavigate,
         setOptions: mockSetOptions,
+        addListener: jest.fn(() => jest.fn()),
+        isFocused: jest.fn(() => false),
+        dangerouslyGetParent: jest.fn(() => ({
+          dangerouslyGetState: jest.fn(() => ({ type: 'stack' })),
+          addListener: jest.fn(() => jest.fn()),
+          dangerouslyGetParent: jest.fn(() => ({
+            dangerouslyGetState: jest.fn(() => ({ type: 'tab' })),
+            addListener: jest.fn(() => jest.fn()),
+            dangerouslyGetParent: jest.fn(() => undefined),
+          })),
+        })),
       } as unknown as NavigationProp<ParamListBase>;
 
       // Reset flags to default state
diff --git a/app/components/Views/Wallet/index.tsx b/app/components/Views/Wallet/index.tsx
index c06af66d5ad1..62dff744defa 100644
--- a/app/components/Views/Wallet/index.tsx
+++ b/app/components/Views/Wallet/index.tsx
@@ -11,17 +11,20 @@ import React, {
   useState,
 } from 'react';
 import type { TabRefreshHandle, WalletTokensTabViewHandle } from './types';
-import { useBalanceRefresh } from './hooks';
+import { useBalanceRefresh, useHomepageEntryPoint } from './hooks';
 
 import {
   ActivityIndicator,
   DeviceEventEmitter,
   Linking,
+  NativeSyntheticEvent,
+  NativeScrollEvent,
   RefreshControl,
   ScrollView,
   StyleSheet as RNStyleSheet,
   View,
 } from 'react-native';
+import LinearGradient from 'react-native-linear-gradient';
 import { connect, useDispatch, useSelector } from 'react-redux';
 import { strings } from '../../../../locales/i18n';
 import {
@@ -108,6 +111,7 @@ import {
 } from '../../../util/networks';
 import NotificationsService from '../../../util/notifications/services/NotificationService';
 import { useTheme } from '../../../util/theme';
+import { colorWithOpacity } from '../../../util/colors';
 import { useAccountGroupName } from '../../hooks/multichainAccounts/useAccountGroupName';
 import { useAccountName } from '../../hooks/useAccountName';
 import usePrevious from '../../hooks/usePrevious';
@@ -123,6 +127,7 @@ import {
 } from '../../../selectors/featureFlagController/homepage';
 import Homepage from '../Homepage';
 import { SectionRefreshHandle } from '../Homepage/types';
+import { HomepageScrollContext } from '../Homepage/context/HomepageScrollContext';
 import AccountGroupBalance from '../../UI/Assets/components/Balance/AccountGroupBalance';
 import useCheckNftAutoDetectionModal from '../../hooks/useCheckNftAutoDetectionModal';
 import useCheckMultiRpcModal from '../../hooks/useCheckMultiRpcModal';
@@ -206,6 +211,13 @@ const createStyles = ({ colors }: Theme) =>
     carousel: {
       overflow: 'hidden', // Allow for smooth height animations
     },
+    bottomFadeOverlay: {
+      position: 'absolute',
+      left: 0,
+      right: 0,
+      bottom: 0,
+      height: 40,
+    },
   });
 
 interface WalletProps {
@@ -614,6 +626,21 @@ const Wallet = ({
   const { refreshBalance } = useBalanceRefresh();
   const theme = useTheme();
 
+  // ─── Homepage scroll context state ───────────────────────────────────────
+  const [viewportHeight, setViewportHeight] = useState(0);
+  const [containerScreenY, setContainerScreenY] = useState(0);
+  const { entryPoint, visitId } = useHomepageEntryPoint(navigation);
+
+  // Ref to the scroll container View — used to measure its absolute screen Y
+  // position so the visibility check in sections can use correct bounds.
+  const containerViewRef = useRef<View>(null);
+  // Timestamp of the last scroll event — used for JS-level throttling.
+  const lastScrollTickTimeRef = useRef(0);
+  // Callbacks registered by sections to be notified of scroll events.
+  // Using a ref+Set avoids any React state updates (and re-renders) on scroll.
+  const scrollSubscribersRef = useRef<Set<() => void>>(new Set());
+  // ─────────────────────────────────────────────────────────────────────────
+
   const isPerpsFlagEnabled = useSelector(selectPerpsEnabledFlag);
   const isPerpsGTMModalEnabled = useSelector(
     selectPerpsGtmOnboardingModalEnabledFlag,
@@ -1080,6 +1107,75 @@ const Wallet = ({
   const shouldEnableParentScroll =
     isHomepageRedesignV1Enabled || isHomepageSectionsV1Enabled;
 
+  const [bottomFadeOpacity, setBottomFadeOpacity] = useState(0);
+
+  const scrollContentHeight = useRef(0);
+  const scrollLayoutHeight = useRef(0);
+  const scrollOffsetY = useRef(0);
+
+  const computeFadeOpacity = useCallback(
+    (contentH: number, layoutH: number, offsetY: number) => {
+      const scrollableHeight = contentH - layoutH;
+      if (scrollableHeight <= 0) {
+        setBottomFadeOpacity(0);
+        return;
+      }
+      const distanceFromEnd = scrollableHeight - offsetY;
+      const fadeThreshold = 100;
+      setBottomFadeOpacity(
+        Math.min(1, Math.max(0, distanceFromEnd / fadeThreshold)),
+      );
+    },
+    [],
+  );
+
+  // Notifies scroll subscribers directly (no React state update = no re-renders).
+  const handleHomepageScroll = useCallback(() => {
+    if (!isHomepageSectionsV1Enabled) return;
+    const now = Date.now();
+    if (now - lastScrollTickTimeRef.current >= 100) {
+      lastScrollTickTimeRef.current = now;
+      scrollSubscribersRef.current.forEach((cb) => cb());
+    }
+  }, [isHomepageSectionsV1Enabled]);
+
+  const handleVerticalScroll = useCallback(
+    (event: NativeSyntheticEvent<NativeScrollEvent>) => {
+      const { contentOffset, contentSize, layoutMeasurement } =
+        event.nativeEvent;
+      scrollContentHeight.current = contentSize.height;
+      scrollLayoutHeight.current = layoutMeasurement.height;
+      scrollOffsetY.current = contentOffset.y;
+      computeFadeOpacity(
+        contentSize.height,
+        layoutMeasurement.height,
+        contentOffset.y,
+      );
+      handleHomepageScroll();
+    },
+    [computeFadeOpacity, handleHomepageScroll],
+  );
+
+  const handleScrollContentSizeChange = useCallback(
+    (_w: number, h: number) => {
+      scrollContentHeight.current = h;
+      computeFadeOpacity(h, scrollLayoutHeight.current, scrollOffsetY.current);
+    },
+    [computeFadeOpacity],
+  );
+
+  const handleScrollLayout = useCallback(
+    (event: { nativeEvent: { layout: { height: number } } }) => {
+      scrollLayoutHeight.current = event.nativeEvent.layout.height;
+      computeFadeOpacity(
+        scrollContentHeight.current,
+        event.nativeEvent.layout.height,
+        scrollOffsetY.current,
+      );
+    },
+    [computeFadeOpacity],
+  );
+
   useEffect(() => {
     if (!selectedInternalAccount) return;
     navigation.setOptions(
@@ -1291,6 +1387,22 @@ const Wallet = ({
     }
   }, [refreshBalance, isHomepageSectionsV1Enabled]);
 
+  const subscribeToScroll = useCallback((cb: () => void) => {
+    scrollSubscribersRef.current.add(cb);
+    return () => scrollSubscribersRef.current.delete(cb);
+  }, []);
+
+  const homepageScrollContextValue = useMemo(
+    () => ({
+      subscribeToScroll,
+      viewportHeight,
+      containerScreenY,
+      entryPoint,
+      visitId,
+    }),
+    [subscribeToScroll, viewportHeight, containerScreenY, entryPoint, visitId],
+  );
+
   const content = (
     <>
       <AssetPollingProvider />
@@ -1329,7 +1441,9 @@ const Wallet = ({
         {isCarouselBannersEnabled && <Carousel style={styles.carousel} />}
 
         {isHomepageSectionsV1Enabled ? (
-          <Homepage ref={homepageRef} />
+          <HomepageScrollContext.Provider value={homepageScrollContextValue}>
+            <Homepage ref={homepageRef} />
+          </HomepageScrollContext.Provider>
         ) : (
           <WalletTokensTabView
             ref={walletTokensTabViewRef}
@@ -1356,8 +1470,18 @@ const Wallet = ({
       <View style={baseStyles.flexGrow}>
         {selectedInternalAccount ? (
           <View
+            ref={containerViewRef}
             style={styles.wrapper}
             testID={WalletViewSelectorsIDs.WALLET_CONTAINER}
+            onLayout={(e) => {
+              setViewportHeight(e.nativeEvent.layout.height);
+              // measureInWindow gives the absolute screen Y of the container
+              // top, which is needed to form correct visible bounds when
+              // sections call measureInWindow on themselves.
+              containerViewRef.current?.measureInWindow((_x, y) => {
+                setContainerScreenY(y);
+              });
+            }}
           >
             <ConditionalScrollView
               ref={scrollViewRef}
@@ -1365,6 +1489,16 @@ const Wallet = ({
               scrollViewProps={{
                 contentContainerStyle: scrollViewContentStyle,
                 showsVerticalScrollIndicator: false,
+                onScroll: isHomepageSectionsV1Enabled
+                  ? handleVerticalScroll
+                  : undefined,
+                onContentSizeChange: isHomepageSectionsV1Enabled
+                  ? handleScrollContentSizeChange
+                  : undefined,
+                onLayout: isHomepageSectionsV1Enabled
+                  ? handleScrollLayout
+                  : undefined,
+                scrollEventThrottle: 16,
                 refreshControl: shouldEnableParentScroll ? (
                   <RefreshControl
                     colors={[colors.primary.default]}
@@ -1377,6 +1511,21 @@ const Wallet = ({
             >
               {content}
             </ConditionalScrollView>
+            {isHomepageSectionsV1Enabled && bottomFadeOpacity > 0 && (
+              <LinearGradient
+                pointerEvents="none"
+                colors={[
+                  colorWithOpacity(colors.background.default, 0),
+                  colors.background.default,
+                ]}
+                start={{ x: 0, y: 0 }}
+                end={{ x: 0, y: 1 }}
+                style={[
+                  styles.bottomFadeOverlay,
+                  { opacity: bottomFadeOpacity },
+                ]}
+              />
+            )}
           </View>
         ) : (
           renderLoader()
diff --git a/app/components/Views/WalletConnectSessions/__snapshots__/index.test.tsx.snap b/app/components/Views/WalletConnectSessions/__snapshots__/index.test.tsx.snap
index 16a72ad053cc..1a2088a12605 100644
--- a/app/components/Views/WalletConnectSessions/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/WalletConnectSessions/__snapshots__/index.test.tsx.snap
@@ -54,11 +54,10 @@ exports[`WalletConnectSessions does not render when not ready 1`] = `
             collapsable={false}
             style={
               {
-                "backgroundColor": "#ffffff",
+                "backgroundColor": "rgb(255, 255, 255)",
                 "borderBottomColor": "rgb(216, 216, 216)",
-                "elevation": 0,
                 "flex": 1,
-                "shadowColor": "transparent",
+                "shadowColor": "rgb(216, 216, 216)",
                 "shadowOffset": {
                   "height": 0.5,
                   "width": 0,
@@ -106,93 +105,7 @@ exports[`WalletConnectSessions does not render when not ready 1`] = `
               pointerEvents="box-none"
               style={
                 {
-                  "alignItems": "flex-start",
-                  "bottom": 0,
-                  "justifyContent": "center",
-                  "left": 0,
-                  "opacity": 1,
-                  "position": "absolute",
-                  "top": 0,
-                }
-              }
-            >
-              <View
-                accessibilityState={
-                  {
-                    "busy": undefined,
-                    "checked": undefined,
-                    "disabled": false,
-                    "expanded": undefined,
-                    "selected": undefined,
-                  }
-                }
-                accessibilityValue={
-                  {
-                    "max": undefined,
-                    "min": undefined,
-                    "now": undefined,
-                    "text": undefined,
-                  }
-                }
-                accessible={true}
-                collapsable={false}
-                focusable={true}
-                onBlur={[Function]}
-                onClick={[Function]}
-                onFocus={[Function]}
-                onResponderGrant={[Function]}
-                onResponderMove={[Function]}
-                onResponderRelease={[Function]}
-                onResponderTerminate={[Function]}
-                onResponderTerminationRequest={[Function]}
-                onStartShouldSetResponder={[Function]}
-                style={
-                  [
-                    {
-                      "alignItems": "center",
-                      "backgroundColor": "transparent",
-                      "borderRadius": 8,
-                      "height": 40,
-                      "justifyContent": "center",
-                      "opacity": 1,
-                      "width": 40,
-                    },
-                    {
-                      "marginHorizontal": 16,
-                    },
-                    {
-                      "transform": [
-                        {
-                          "scale": 1,
-                        },
-                      ],
-                    },
-                  ]
-                }
-                testID="back-arrow-button"
-              >
-                <SvgMock
-                  fill="currentColor"
-                  name="ArrowLeft"
-                  style={
-                    [
-                      {
-                        "color": "#121314",
-                        "height": 32,
-                        "width": 32,
-                      },
-                      undefined,
-                    ]
-                  }
-                />
-              </View>
-            </View>
-            <View
-              collapsable={false}
-              pointerEvents="box-none"
-              style={
-                {
-                  "marginHorizontal": 72,
+                  "marginHorizontal": 16,
                   "opacity": 1,
                 }
               }
@@ -205,26 +118,13 @@ exports[`WalletConnectSessions does not render when not ready 1`] = `
                 onLayout={[Function]}
                 style={
                   {
-                    "color": "#4459ff",
+                    "color": "rgb(28, 28, 30)",
                     "fontSize": 17,
                     "fontWeight": "600",
                   }
                 }
               >
-                <Text
-                  accessibilityRole="text"
-                  style={
-                    {
-                      "color": "#121314",
-                      "fontFamily": "Geist-Bold",
-                      "fontSize": 18,
-                      "letterSpacing": 0,
-                      "lineHeight": 24,
-                    }
-                  }
-                >
-                  WalletConnect sessions
-                </Text>
+                WalletConnectSessionsView
               </Text>
             </View>
           </View>
@@ -342,7 +242,7 @@ exports[`WalletConnectSessions does not render when not ready 1`] = `
             <View
               collapsable={false}
               enabled={false}
-              handlerTag={1}
+              handlerTag={-1}
               handlerType="PanGestureHandler"
               onGestureHandlerEvent={[Function]}
               onGestureHandlerStateChange={[Function]}
@@ -477,11 +377,10 @@ exports[`WalletConnectSessions renders empty component with no active sessions 1
             collapsable={false}
             style={
               {
-                "backgroundColor": "#ffffff",
+                "backgroundColor": "rgb(255, 255, 255)",
                 "borderBottomColor": "rgb(216, 216, 216)",
-                "elevation": 0,
                 "flex": 1,
-                "shadowColor": "transparent",
+                "shadowColor": "rgb(216, 216, 216)",
                 "shadowOffset": {
                   "height": 0.5,
                   "width": 0,
@@ -529,93 +428,7 @@ exports[`WalletConnectSessions renders empty component with no active sessions 1
               pointerEvents="box-none"
               style={
                 {
-                  "alignItems": "flex-start",
-                  "bottom": 0,
-                  "justifyContent": "center",
-                  "left": 0,
-                  "opacity": 1,
-                  "position": "absolute",
-                  "top": 0,
-                }
-              }
-            >
-              <View
-                accessibilityState={
-                  {
-                    "busy": undefined,
-                    "checked": undefined,
-                    "disabled": false,
-                    "expanded": undefined,
-                    "selected": undefined,
-                  }
-                }
-                accessibilityValue={
-                  {
-                    "max": undefined,
-                    "min": undefined,
-                    "now": undefined,
-                    "text": undefined,
-                  }
-                }
-                accessible={true}
-                collapsable={false}
-                focusable={true}
-                onBlur={[Function]}
-                onClick={[Function]}
-                onFocus={[Function]}
-                onResponderGrant={[Function]}
-                onResponderMove={[Function]}
-                onResponderRelease={[Function]}
-                onResponderTerminate={[Function]}
-                onResponderTerminationRequest={[Function]}
-                onStartShouldSetResponder={[Function]}
-                style={
-                  [
-                    {
-                      "alignItems": "center",
-                      "backgroundColor": "transparent",
-                      "borderRadius": 8,
-                      "height": 40,
-                      "justifyContent": "center",
-                      "opacity": 1,
-                      "width": 40,
-                    },
-                    {
-                      "marginHorizontal": 16,
-                    },
-                    {
-                      "transform": [
-                        {
-                          "scale": 1,
-                        },
-                      ],
-                    },
-                  ]
-                }
-                testID="back-arrow-button"
-              >
-                <SvgMock
-                  fill="currentColor"
-                  name="ArrowLeft"
-                  style={
-                    [
-                      {
-                        "color": "#121314",
-                        "height": 32,
-                        "width": 32,
-                      },
-                      undefined,
-                    ]
-                  }
-                />
-              </View>
-            </View>
-            <View
-              collapsable={false}
-              pointerEvents="box-none"
-              style={
-                {
-                  "marginHorizontal": 72,
+                  "marginHorizontal": 16,
                   "opacity": 1,
                 }
               }
@@ -628,26 +441,13 @@ exports[`WalletConnectSessions renders empty component with no active sessions 1
                 onLayout={[Function]}
                 style={
                   {
-                    "color": "#4459ff",
+                    "color": "rgb(28, 28, 30)",
                     "fontSize": 17,
                     "fontWeight": "600",
                   }
                 }
               >
-                <Text
-                  accessibilityRole="text"
-                  style={
-                    {
-                      "color": "#121314",
-                      "fontFamily": "Geist-Bold",
-                      "fontSize": 18,
-                      "letterSpacing": 0,
-                      "lineHeight": 24,
-                    }
-                  }
-                >
-                  WalletConnect sessions
-                </Text>
+                WalletConnectSessionsView
               </Text>
             </View>
           </View>
@@ -765,7 +565,7 @@ exports[`WalletConnectSessions renders empty component with no active sessions 1
             <View
               collapsable={false}
               enabled={false}
-              handlerTag={2}
+              handlerTag={-1}
               handlerType="PanGestureHandler"
               onGestureHandlerEvent={[Function]}
               onGestureHandlerStateChange={[Function]}
@@ -835,7 +635,15 @@ exports[`WalletConnectSessions renders empty component with no active sessions 1
                       }
                     }
                   >
-                    <RCTSafeAreaView
+                    <RNCSafeAreaView
+                      edges={
+                        {
+                          "bottom": "additive",
+                          "left": "off",
+                          "right": "off",
+                          "top": "off",
+                        }
+                      }
                       style={
                         {
                           "backgroundColor": "#ffffff",
@@ -844,6 +652,150 @@ exports[`WalletConnectSessions renders empty component with no active sessions 1
                       }
                       testID="wallet-connect-sessions-screen"
                     >
+                      <View
+                        style={
+                          [
+                            {
+                              "alignItems": "center",
+                              "flexDirection": "row",
+                              "gap": 16,
+                              "minHeight": 56,
+                              "paddingLeft": 8,
+                              "paddingRight": 8,
+                            },
+                            {
+                              "marginTop": 0,
+                            },
+                            undefined,
+                          ]
+                        }
+                        testID="wallet-connect-sessions-header"
+                      >
+                        <View>
+                          <View
+                            onLayout={[Function]}
+                          >
+                            <View
+                              accessibilityState={
+                                {
+                                  "busy": undefined,
+                                  "checked": undefined,
+                                  "disabled": false,
+                                  "expanded": undefined,
+                                  "selected": undefined,
+                                }
+                              }
+                              accessibilityValue={
+                                {
+                                  "max": undefined,
+                                  "min": undefined,
+                                  "now": undefined,
+                                  "text": undefined,
+                                }
+                              }
+                              accessible={true}
+                              collapsable={false}
+                              focusable={true}
+                              onBlur={[Function]}
+                              onClick={[Function]}
+                              onFocus={[Function]}
+                              onResponderGrant={[Function]}
+                              onResponderMove={[Function]}
+                              onResponderRelease={[Function]}
+                              onResponderTerminate={[Function]}
+                              onResponderTerminationRequest={[Function]}
+                              onStartShouldSetResponder={[Function]}
+                              style={
+                                [
+                                  {
+                                    "alignItems": "center",
+                                    "backgroundColor": "transparent",
+                                    "borderRadius": 8,
+                                    "height": 32,
+                                    "justifyContent": "center",
+                                    "opacity": 1,
+                                    "width": 32,
+                                  },
+                                  undefined,
+                                  {
+                                    "transform": [
+                                      {
+                                        "scale": 1,
+                                      },
+                                    ],
+                                  },
+                                ]
+                              }
+                              testID="wallet-connect-sessions-back-button"
+                            >
+                              <SvgMock
+                                fill="currentColor"
+                                name="ArrowLeft"
+                                style={
+                                  [
+                                    {
+                                      "color": "#131416",
+                                      "height": 24,
+                                      "width": 24,
+                                    },
+                                    undefined,
+                                  ]
+                                }
+                              />
+                            </View>
+                          </View>
+                        </View>
+                        <View
+                          style={
+                            [
+                              {
+                                "alignItems": "center",
+                                "display": "flex",
+                                "flexBasis": "0%",
+                                "flexGrow": 1,
+                                "flexShrink": 1,
+                              },
+                              undefined,
+                            ]
+                          }
+                        >
+                          <View
+                            style={
+                              [
+                                {
+                                  "alignItems": "center",
+                                  "display": "flex",
+                                },
+                                undefined,
+                              ]
+                            }
+                          >
+                            <Text
+                              accessibilityRole="text"
+                              style={
+                                [
+                                  {
+                                    "color": "#131416",
+                                    "fontFamily": "Geist-Bold",
+                                    "fontSize": 16,
+                                    "fontWeight": 400,
+                                    "letterSpacing": 0,
+                                    "lineHeight": 24,
+                                  },
+                                  undefined,
+                                ]
+                              }
+                            >
+                              WalletConnect sessions
+                            </Text>
+                          </View>
+                        </View>
+                        <View>
+                          <View
+                            onLayout={[Function]}
+                          />
+                        </View>
+                      </View>
                       <RCTScrollView
                         contentContainerStyle={
                           {
@@ -870,7 +822,7 @@ exports[`WalletConnectSessions renders empty component with no active sessions 1
                             <Text
                               style={
                                 {
-                                  "color": "#121314",
+                                  "color": "#131416",
                                   "fontFamily": "Geist-Regular",
                                   "fontSize": 16,
                                 }
@@ -881,7 +833,7 @@ exports[`WalletConnectSessions renders empty component with no active sessions 1
                           </View>
                         </View>
                       </RCTScrollView>
-                    </RCTSafeAreaView>
+                    </RNCSafeAreaView>
                   </View>
                 </View>
               </View>
@@ -948,11 +900,10 @@ exports[`WalletConnectSessions should render active sessions 1`] = `
             collapsable={false}
             style={
               {
-                "backgroundColor": "#ffffff",
+                "backgroundColor": "rgb(255, 255, 255)",
                 "borderBottomColor": "rgb(216, 216, 216)",
-                "elevation": 0,
                 "flex": 1,
-                "shadowColor": "transparent",
+                "shadowColor": "rgb(216, 216, 216)",
                 "shadowOffset": {
                   "height": 0.5,
                   "width": 0,
@@ -1000,93 +951,7 @@ exports[`WalletConnectSessions should render active sessions 1`] = `
               pointerEvents="box-none"
               style={
                 {
-                  "alignItems": "flex-start",
-                  "bottom": 0,
-                  "justifyContent": "center",
-                  "left": 0,
-                  "opacity": 1,
-                  "position": "absolute",
-                  "top": 0,
-                }
-              }
-            >
-              <View
-                accessibilityState={
-                  {
-                    "busy": undefined,
-                    "checked": undefined,
-                    "disabled": false,
-                    "expanded": undefined,
-                    "selected": undefined,
-                  }
-                }
-                accessibilityValue={
-                  {
-                    "max": undefined,
-                    "min": undefined,
-                    "now": undefined,
-                    "text": undefined,
-                  }
-                }
-                accessible={true}
-                collapsable={false}
-                focusable={true}
-                onBlur={[Function]}
-                onClick={[Function]}
-                onFocus={[Function]}
-                onResponderGrant={[Function]}
-                onResponderMove={[Function]}
-                onResponderRelease={[Function]}
-                onResponderTerminate={[Function]}
-                onResponderTerminationRequest={[Function]}
-                onStartShouldSetResponder={[Function]}
-                style={
-                  [
-                    {
-                      "alignItems": "center",
-                      "backgroundColor": "transparent",
-                      "borderRadius": 8,
-                      "height": 40,
-                      "justifyContent": "center",
-                      "opacity": 1,
-                      "width": 40,
-                    },
-                    {
-                      "marginHorizontal": 16,
-                    },
-                    {
-                      "transform": [
-                        {
-                          "scale": 1,
-                        },
-                      ],
-                    },
-                  ]
-                }
-                testID="back-arrow-button"
-              >
-                <SvgMock
-                  fill="currentColor"
-                  name="ArrowLeft"
-                  style={
-                    [
-                      {
-                        "color": "#121314",
-                        "height": 32,
-                        "width": 32,
-                      },
-                      undefined,
-                    ]
-                  }
-                />
-              </View>
-            </View>
-            <View
-              collapsable={false}
-              pointerEvents="box-none"
-              style={
-                {
-                  "marginHorizontal": 72,
+                  "marginHorizontal": 16,
                   "opacity": 1,
                 }
               }
@@ -1099,26 +964,13 @@ exports[`WalletConnectSessions should render active sessions 1`] = `
                 onLayout={[Function]}
                 style={
                   {
-                    "color": "#4459ff",
+                    "color": "rgb(28, 28, 30)",
                     "fontSize": 17,
                     "fontWeight": "600",
                   }
                 }
               >
-                <Text
-                  accessibilityRole="text"
-                  style={
-                    {
-                      "color": "#121314",
-                      "fontFamily": "Geist-Bold",
-                      "fontSize": 18,
-                      "letterSpacing": 0,
-                      "lineHeight": 24,
-                    }
-                  }
-                >
-                  WalletConnect sessions
-                </Text>
+                WalletConnectSessionsView
               </Text>
             </View>
           </View>
@@ -1236,7 +1088,7 @@ exports[`WalletConnectSessions should render active sessions 1`] = `
             <View
               collapsable={false}
               enabled={false}
-              handlerTag={3}
+              handlerTag={-1}
               handlerType="PanGestureHandler"
               onGestureHandlerEvent={[Function]}
               onGestureHandlerStateChange={[Function]}
@@ -1306,7 +1158,15 @@ exports[`WalletConnectSessions should render active sessions 1`] = `
                       }
                     }
                   >
-                    <RCTSafeAreaView
+                    <RNCSafeAreaView
+                      edges={
+                        {
+                          "bottom": "additive",
+                          "left": "off",
+                          "right": "off",
+                          "top": "off",
+                        }
+                      }
                       style={
                         {
                           "backgroundColor": "#ffffff",
@@ -1315,6 +1175,150 @@ exports[`WalletConnectSessions should render active sessions 1`] = `
                       }
                       testID="wallet-connect-sessions-screen"
                     >
+                      <View
+                        style={
+                          [
+                            {
+                              "alignItems": "center",
+                              "flexDirection": "row",
+                              "gap": 16,
+                              "minHeight": 56,
+                              "paddingLeft": 8,
+                              "paddingRight": 8,
+                            },
+                            {
+                              "marginTop": 0,
+                            },
+                            undefined,
+                          ]
+                        }
+                        testID="wallet-connect-sessions-header"
+                      >
+                        <View>
+                          <View
+                            onLayout={[Function]}
+                          >
+                            <View
+                              accessibilityState={
+                                {
+                                  "busy": undefined,
+                                  "checked": undefined,
+                                  "disabled": false,
+                                  "expanded": undefined,
+                                  "selected": undefined,
+                                }
+                              }
+                              accessibilityValue={
+                                {
+                                  "max": undefined,
+                                  "min": undefined,
+                                  "now": undefined,
+                                  "text": undefined,
+                                }
+                              }
+                              accessible={true}
+                              collapsable={false}
+                              focusable={true}
+                              onBlur={[Function]}
+                              onClick={[Function]}
+                              onFocus={[Function]}
+                              onResponderGrant={[Function]}
+                              onResponderMove={[Function]}
+                              onResponderRelease={[Function]}
+                              onResponderTerminate={[Function]}
+                              onResponderTerminationRequest={[Function]}
+                              onStartShouldSetResponder={[Function]}
+                              style={
+                                [
+                                  {
+                                    "alignItems": "center",
+                                    "backgroundColor": "transparent",
+                                    "borderRadius": 8,
+                                    "height": 32,
+                                    "justifyContent": "center",
+                                    "opacity": 1,
+                                    "width": 32,
+                                  },
+                                  undefined,
+                                  {
+                                    "transform": [
+                                      {
+                                        "scale": 1,
+                                      },
+                                    ],
+                                  },
+                                ]
+                              }
+                              testID="wallet-connect-sessions-back-button"
+                            >
+                              <SvgMock
+                                fill="currentColor"
+                                name="ArrowLeft"
+                                style={
+                                  [
+                                    {
+                                      "color": "#131416",
+                                      "height": 24,
+                                      "width": 24,
+                                    },
+                                    undefined,
+                                  ]
+                                }
+                              />
+                            </View>
+                          </View>
+                        </View>
+                        <View
+                          style={
+                            [
+                              {
+                                "alignItems": "center",
+                                "display": "flex",
+                                "flexBasis": "0%",
+                                "flexGrow": 1,
+                                "flexShrink": 1,
+                              },
+                              undefined,
+                            ]
+                          }
+                        >
+                          <View
+                            style={
+                              [
+                                {
+                                  "alignItems": "center",
+                                  "display": "flex",
+                                },
+                                undefined,
+                              ]
+                            }
+                          >
+                            <Text
+                              accessibilityRole="text"
+                              style={
+                                [
+                                  {
+                                    "color": "#131416",
+                                    "fontFamily": "Geist-Bold",
+                                    "fontSize": 16,
+                                    "fontWeight": 400,
+                                    "letterSpacing": 0,
+                                    "lineHeight": 24,
+                                  },
+                                  undefined,
+                                ]
+                              }
+                            >
+                              WalletConnect sessions
+                            </Text>
+                          </View>
+                        </View>
+                        <View>
+                          <View
+                            onLayout={[Function]}
+                          />
+                        </View>
+                      </View>
                       <RCTScrollView
                         contentContainerStyle={
                           {
@@ -1333,7 +1337,7 @@ exports[`WalletConnectSessions should render active sessions 1`] = `
                             onLongPress={[Function]}
                             style={
                               {
-                                "borderBottomColor": "#b7bbc866",
+                                "borderBottomColor": "#b4b4b566",
                                 "borderBottomWidth": 1,
                                 "flexDirection": "row",
                                 "paddingHorizontal": 20,
@@ -1345,7 +1349,7 @@ exports[`WalletConnectSessions should render active sessions 1`] = `
                               <View
                                 placeholderStyle={
                                   {
-                                    "backgroundColor": "#f3f5f9",
+                                    "backgroundColor": "#f3f3f4",
                                   }
                                 }
                                 useNativeDriver={true}
@@ -1389,7 +1393,7 @@ exports[`WalletConnectSessions should render active sessions 1`] = `
                                           "backgroundColor": "#eee",
                                         },
                                         {
-                                          "backgroundColor": "#f3f5f9",
+                                          "backgroundColor": "#f3f3f4",
                                         },
                                       ]
                                     }
@@ -1408,7 +1412,7 @@ exports[`WalletConnectSessions should render active sessions 1`] = `
                               <Text
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Bold",
                                     "fontSize": 16,
                                     "marginBottom": 10,
@@ -1420,7 +1424,7 @@ exports[`WalletConnectSessions should render active sessions 1`] = `
                               <Text
                                 style={
                                   {
-                                    "color": "#686e7d",
+                                    "color": "#66676a",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 12,
                                     "marginBottom": 10,
@@ -1432,7 +1436,7 @@ exports[`WalletConnectSessions should render active sessions 1`] = `
                               <Text
                                 style={
                                   {
-                                    "color": "#686e7d",
+                                    "color": "#66676a",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 12,
                                     "marginBottom": 10,
@@ -1447,7 +1451,7 @@ exports[`WalletConnectSessions should render active sessions 1`] = `
                             onLongPress={[Function]}
                             style={
                               {
-                                "borderBottomColor": "#b7bbc866",
+                                "borderBottomColor": "#b4b4b566",
                                 "borderBottomWidth": 1,
                                 "flexDirection": "row",
                                 "paddingHorizontal": 20,
@@ -1459,7 +1463,7 @@ exports[`WalletConnectSessions should render active sessions 1`] = `
                               <View
                                 placeholderStyle={
                                   {
-                                    "backgroundColor": "#f3f5f9",
+                                    "backgroundColor": "#f3f3f4",
                                   }
                                 }
                                 useNativeDriver={true}
@@ -1503,7 +1507,7 @@ exports[`WalletConnectSessions should render active sessions 1`] = `
                                           "backgroundColor": "#eee",
                                         },
                                         {
-                                          "backgroundColor": "#f3f5f9",
+                                          "backgroundColor": "#f3f3f4",
                                         },
                                       ]
                                     }
@@ -1522,7 +1526,7 @@ exports[`WalletConnectSessions should render active sessions 1`] = `
                               <Text
                                 style={
                                   {
-                                    "color": "#121314",
+                                    "color": "#131416",
                                     "fontFamily": "Geist-Bold",
                                     "fontSize": 16,
                                     "marginBottom": 10,
@@ -1534,7 +1538,7 @@ exports[`WalletConnectSessions should render active sessions 1`] = `
                               <Text
                                 style={
                                   {
-                                    "color": "#686e7d",
+                                    "color": "#66676a",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 12,
                                     "marginBottom": 10,
@@ -1546,7 +1550,7 @@ exports[`WalletConnectSessions should render active sessions 1`] = `
                               <Text
                                 style={
                                   {
-                                    "color": "#686e7d",
+                                    "color": "#66676a",
                                     "fontFamily": "Geist-Regular",
                                     "fontSize": 12,
                                     "marginBottom": 10,
@@ -1559,7 +1563,7 @@ exports[`WalletConnectSessions should render active sessions 1`] = `
                           </TouchableOpacity>
                         </View>
                       </RCTScrollView>
-                    </RCTSafeAreaView>
+                    </RNCSafeAreaView>
                   </View>
                 </View>
               </View>
diff --git a/app/components/Views/WalletConnectSessions/index.js b/app/components/Views/WalletConnectSessions/index.js
index 1c0a7ae71fce..d6190ff4e4b0 100644
--- a/app/components/Views/WalletConnectSessions/index.js
+++ b/app/components/Views/WalletConnectSessions/index.js
@@ -2,15 +2,14 @@ import React, { PureComponent } from 'react';
 import {
   Alert,
   ScrollView,
-  SafeAreaView,
   StyleSheet,
   View,
   Text,
   TouchableOpacity,
 } from 'react-native';
+import { SafeAreaView } from 'react-native-safe-area-context';
 import { fontStyles } from '../../../styles/common';
 import { strings } from '../../../../locales/i18n';
-import { getNavigationOptionsTitle } from '../../UI/Navbar';
 import WebsiteIcon from '../../UI/WebsiteIcon';
 import ActionSheet from '@metamask/react-native-actionsheet';
 import Logger from '../../../util/Logger';
@@ -20,6 +19,7 @@ import WC2Manager, {
   isWC2Enabled,
 } from '../../../../app/core/WalletConnect/WalletConnectV2';
 import { ExperimentalSelectorsIDs } from '../Settings/ExperimentalSettings/ExperimentalView.testIds';
+import HeaderCompactStandard from '../../../component-library/components-temp/HeaderCompactStandard';
 
 const createStyles = (colors) =>
   StyleSheet.create({
@@ -87,28 +87,10 @@ export default class WalletConnectSessions extends PureComponent {
 
   sessionToRemove = null;
 
-  updateNavBar = () => {
-    const { navigation } = this.props;
-    const colors = this.context.colors || mockTheme.colors;
-    navigation.setOptions(
-      getNavigationOptionsTitle(
-        strings('experimental_settings.wallet_connect_dapps'),
-        navigation,
-        false,
-        colors,
-      ),
-    );
-  };
-
   componentDidMount() {
-    this.updateNavBar();
     this.loadSessions();
   }
 
-  componentDidUpdate = () => {
-    this.updateNavBar();
-  };
-
   loadSessions = async () => {
     let sessions = [];
 
@@ -215,9 +197,20 @@ export default class WalletConnectSessions extends PureComponent {
 
     return (
       <SafeAreaView
+        edges={{ bottom: 'additive' }}
         style={styles.wrapper}
         testID={ExperimentalSelectorsIDs.CONTAINER}
       >
+        <HeaderCompactStandard
+          title={strings('experimental_settings.wallet_connect_dapps')}
+          onBack={() => this.props.navigation.goBack()}
+          backButtonProps={{
+            testID:
+              ExperimentalSelectorsIDs.WALLET_CONNECT_SESSIONS_BACK_BUTTON,
+          }}
+          testID={ExperimentalSelectorsIDs.WALLET_CONNECT_SESSIONS_HEADER}
+          includesTopInset
+        />
         <ScrollView
           style={styles.wrapper}
           contentContainerStyle={styles.scrollviewContent}
diff --git a/app/components/Views/WalletConnectSessions/index.test.tsx b/app/components/Views/WalletConnectSessions/index.test.tsx
index 6f11362aeeee..781b302c726c 100644
--- a/app/components/Views/WalletConnectSessions/index.test.tsx
+++ b/app/components/Views/WalletConnectSessions/index.test.tsx
@@ -4,6 +4,7 @@ import { renderScreen } from '../../../util/test/renderWithProvider';
 import Routes from '../../../constants/navigation/Routes';
 import { ExperimentalSelectorsIDs } from '../Settings/ExperimentalSettings/ExperimentalView.testIds';
 import WC2Manager from '../../../core/WalletConnect/WalletConnectV2';
+import { strings } from '../../../../locales/i18n';
 
 const mockGetSessions = jest.fn();
 
@@ -63,7 +64,6 @@ describe('WalletConnectSessions', () => {
   });
 
   it('should render active sessions', async () => {
-    // V2 session structure
     const sessions = [
       {
         topic: 'topic1',
@@ -91,4 +91,26 @@ describe('WalletConnectSessions', () => {
       expect(toJSON()).toMatchSnapshot();
     });
   });
+
+  it('renders inline HeaderCompactStandard with title and back button', async () => {
+    mockGetSessions.mockReturnValue([]);
+
+    const { getByTestId, getByText } = renderScreen(WalletConnectSessions, {
+      name: Routes.WALLET.WALLET_CONNECT_SESSIONS_VIEW,
+    });
+
+    await waitFor(() => {
+      expect(
+        getByTestId(ExperimentalSelectorsIDs.WALLET_CONNECT_SESSIONS_HEADER),
+      ).toBeOnTheScreen();
+      expect(
+        getByTestId(
+          ExperimentalSelectorsIDs.WALLET_CONNECT_SESSIONS_BACK_BUTTON,
+        ),
+      ).toBeOnTheScreen();
+      expect(
+        getByText(strings('experimental_settings.wallet_connect_dapps')),
+      ).toBeOnTheScreen();
+    });
+  });
 });
diff --git a/app/components/Views/WalletCreationError/SRPErrorScreen.test.tsx b/app/components/Views/WalletCreationError/SRPErrorScreen.test.tsx
index 0db2b1ed8105..3c05f2c9d3c5 100644
--- a/app/components/Views/WalletCreationError/SRPErrorScreen.test.tsx
+++ b/app/components/Views/WalletCreationError/SRPErrorScreen.test.tsx
@@ -8,6 +8,13 @@ import Routes from '../../../constants/navigation/Routes';
 import AppConstants from '../../../core/AppConstants';
 import renderWithProvider from '../../../util/test/renderWithProvider';
 
+const mockTrackOnboarding = jest.fn();
+
+jest.mock('../../../util/metrics/TrackOnboarding/trackOnboarding', () => ({
+  __esModule: true,
+  default: (...args: unknown[]) => mockTrackOnboarding(...args),
+}));
+
 const mockReset = jest.fn();
 
 jest.mock('@react-navigation/native', () => {
@@ -56,6 +63,29 @@ describe('SRPErrorScreen', () => {
     jest.useRealTimers();
   });
 
+  describe('analytics', () => {
+    it('tracks screen viewed event on mount', () => {
+      renderWithProvider(<SRPErrorScreen error={mockError} />);
+
+      expect(mockTrackOnboarding).toHaveBeenCalled();
+    });
+
+    it('tracks event with correct flow_type property', () => {
+      renderWithProvider(<SRPErrorScreen error={mockError} />);
+
+      expect(mockTrackOnboarding).toHaveBeenCalledWith(
+        expect.objectContaining({
+          properties: expect.objectContaining({
+            flow_type: 'srp',
+            error_name: 'WalletCreationError',
+            error_message: 'Test wallet creation error',
+          }),
+        }),
+        expect.any(Function),
+      );
+    });
+  });
+
   describe('rendering', () => {
     it('renders title text', () => {
       const { getByText } = renderWithProvider(
@@ -125,6 +155,25 @@ describe('SRPErrorScreen', () => {
         routes: [{ name: Routes.ONBOARDING.ROOT_NAV }],
       });
     });
+
+    it('tracks retry clicked event when Try again is pressed', async () => {
+      const { getByText } = renderWithProvider(
+        <SRPErrorScreen error={mockError} />,
+      );
+
+      await act(async () => {
+        fireEvent.press(getByText('Try again'));
+      });
+
+      expect(mockTrackOnboarding).toHaveBeenCalledWith(
+        expect.objectContaining({
+          properties: expect.objectContaining({
+            flow_type: 'srp',
+          }),
+        }),
+        expect.any(Function),
+      );
+    });
   });
 
   describe('handleSendErrorReport', () => {
@@ -165,6 +214,23 @@ describe('SRPErrorScreen', () => {
         ],
       });
     });
+
+    it('tracks error report sent event when Send error report is pressed', () => {
+      const { getByText } = renderWithProvider(
+        <SRPErrorScreen error={mockError} />,
+      );
+
+      fireEvent.press(getByText('Send error report'));
+
+      expect(mockTrackOnboarding).toHaveBeenCalledWith(
+        expect.objectContaining({
+          properties: expect.objectContaining({
+            flow_type: 'srp',
+          }),
+        }),
+        expect.any(Function),
+      );
+    });
   });
 
   describe('handleCopyError', () => {
diff --git a/app/components/Views/WalletCreationError/SRPErrorScreen.tsx b/app/components/Views/WalletCreationError/SRPErrorScreen.tsx
index 93b5c62cce18..66e229422251 100644
--- a/app/components/Views/WalletCreationError/SRPErrorScreen.tsx
+++ b/app/components/Views/WalletCreationError/SRPErrorScreen.tsx
@@ -3,7 +3,17 @@ import { View, SafeAreaView, ScrollView, Linking } from 'react-native';
 import { useNavigation } from '@react-navigation/native';
 import Clipboard from '@react-native-clipboard/clipboard';
 import { captureException } from '@sentry/react-native';
-
+import { connect } from 'react-redux';
+import { Dispatch } from 'redux';
+
+import {
+  OnboardingActionTypes,
+  saveOnboardingEvent as saveEvent,
+} from '../../../actions/onboarding';
+import { MetaMetricsEvents } from '../../../core/Analytics';
+import trackOnboarding from '../../../util/metrics/TrackOnboarding/trackOnboarding';
+import { ITrackingEvent } from '../../../core/Analytics/MetaMetrics.types';
+import { MetricsEventBuilder } from '../../../core/Analytics/MetricsEventBuilder';
 import Text, {
   TextVariant,
   TextColor,
@@ -28,9 +38,13 @@ import styleSheet from './SRPErrorScreen.styles';
 
 interface SRPErrorScreenProps {
   error: Error;
+  saveOnboardingEvent: (...eventArgs: [ITrackingEvent]) => void;
 }
 
-const SRPErrorScreen = ({ error }: SRPErrorScreenProps) => {
+const SRPErrorScreen = ({
+  error,
+  saveOnboardingEvent,
+}: SRPErrorScreenProps) => {
   const navigation = useNavigation();
   const { styles } = useStyles(styleSheet, {});
   const [copied, setCopied] = useState(false);
@@ -46,17 +60,55 @@ const SRPErrorScreen = ({ error }: SRPErrorScreenProps) => {
     [],
   );
 
+  // Track screen viewed event
+  useEffect(() => {
+    trackOnboarding(
+      MetricsEventBuilder.createEventBuilder(
+        MetaMetricsEvents.WALLET_CREATION_ERROR_SCREEN_VIEWED,
+      )
+        .addProperties({
+          flow_type: 'srp',
+          error_name: error?.name || 'Unknown',
+          error_message: error?.message || 'No message',
+        })
+        .build(),
+      saveOnboardingEvent,
+    );
+  }, [error, saveOnboardingEvent]);
+
   const errorReport = `View: ChoosePassword\nError: ${error?.name || 'Unknown'}\n${error?.message || 'No message'}`;
 
   const handleTryAgain = useCallback(async () => {
+    trackOnboarding(
+      MetricsEventBuilder.createEventBuilder(
+        MetaMetricsEvents.WALLET_CREATION_ERROR_RETRY_CLICKED,
+      )
+        .addProperties({
+          flow_type: 'srp',
+        })
+        .build(),
+      saveOnboardingEvent,
+    );
+
     // Delete wallet
     await Authentication.deleteWallet();
     navigation.reset({
       routes: [{ name: Routes.ONBOARDING.ROOT_NAV }],
     });
-  }, [navigation]);
+  }, [navigation, saveOnboardingEvent]);
 
   const handleSendErrorReport = useCallback(() => {
+    trackOnboarding(
+      MetricsEventBuilder.createEventBuilder(
+        MetaMetricsEvents.WALLET_CREATION_ERROR_REPORT_SENT,
+      )
+        .addProperties({
+          flow_type: 'srp',
+        })
+        .build(),
+      saveOnboardingEvent,
+    );
+
     captureException(error, {
       tags: {
         view: 'WalletCreationError',
@@ -78,7 +130,7 @@ const SRPErrorScreen = ({ error }: SRPErrorScreenProps) => {
         },
       ],
     });
-  }, [navigation, error]);
+  }, [navigation, error, saveOnboardingEvent]);
 
   const handleCopyError = useCallback(() => {
     Clipboard.setString(errorReport);
@@ -187,4 +239,9 @@ const SRPErrorScreen = ({ error }: SRPErrorScreenProps) => {
   );
 };
 
-export default SRPErrorScreen;
+const mapDispatchToProps = (dispatch: Dispatch<OnboardingActionTypes>) => ({
+  saveOnboardingEvent: (...eventArgs: [ITrackingEvent]) =>
+    dispatch(saveEvent(eventArgs)),
+});
+
+export default connect(null, mapDispatchToProps)(SRPErrorScreen);
diff --git a/app/components/Views/WalletCreationError/SocialLoginErrorSheet.test.tsx b/app/components/Views/WalletCreationError/SocialLoginErrorSheet.test.tsx
index d83ec8020136..7e561656d726 100644
--- a/app/components/Views/WalletCreationError/SocialLoginErrorSheet.test.tsx
+++ b/app/components/Views/WalletCreationError/SocialLoginErrorSheet.test.tsx
@@ -11,6 +11,21 @@ import Routes from '../../../constants/navigation/Routes';
 // Type helper for UNSAFE_getAllByType with mocked string components
 const asComponentType = (name: string) => name as unknown as ComponentType;
 
+const mockTrackEvent = jest.fn();
+const mockAddProperties = jest.fn().mockReturnThis();
+const mockBuild = jest.fn().mockReturnValue({});
+const mockCreateEventBuilder = jest.fn(() => ({
+  addProperties: mockAddProperties,
+  build: mockBuild,
+}));
+
+jest.mock('../../hooks/useAnalytics/useAnalytics', () => ({
+  useAnalytics: () => ({
+    trackEvent: mockTrackEvent,
+    createEventBuilder: mockCreateEventBuilder,
+  }),
+}));
+
 const mockReset = jest.fn();
 
 jest.mock('@react-navigation/native', () => ({
@@ -32,6 +47,8 @@ jest.mock('react-native/Libraries/Linking/Linking', () => ({
   getInitialURL: jest.fn(() => Promise.resolve(null)),
 }));
 
+const mockError = new Error('Test social login error');
+
 describe('SocialLoginErrorSheet', () => {
   const initialState = {
     engine: {
@@ -43,54 +60,116 @@ describe('SocialLoginErrorSheet', () => {
 
   beforeEach(() => {
     jest.clearAllMocks();
+    mockAddProperties.mockReturnThis();
+    mockBuild.mockReturnValue({});
+    mockCreateEventBuilder.mockReturnValue({
+      addProperties: mockAddProperties,
+      build: mockBuild,
+    });
   });
 
   afterEach(() => {
-    jest.resetAllMocks();
+    jest.clearAllMocks();
+  });
+
+  describe('analytics', () => {
+    it('tracks screen viewed event on mount', () => {
+      renderWithProvider(<SocialLoginErrorSheet error={mockError} />, {
+        state: initialState,
+      });
+
+      expect(mockCreateEventBuilder).toHaveBeenCalled();
+      expect(mockTrackEvent).toHaveBeenCalled();
+    });
+
+    it('tracks event with correct flow_type property', () => {
+      renderWithProvider(<SocialLoginErrorSheet error={mockError} />, {
+        state: initialState,
+      });
+
+      expect(mockAddProperties).toHaveBeenCalledWith({
+        flow_type: 'social_login',
+        error_name: 'Error',
+        error_message: 'Test social login error',
+      });
+    });
+
+    it('tracks retry clicked event when Try again is pressed', async () => {
+      (Authentication.deleteWallet as jest.Mock).mockResolvedValue(undefined);
+
+      const { getByText } = renderWithProvider(
+        <SocialLoginErrorSheet error={mockError} />,
+        { state: initialState },
+      );
+
+      mockCreateEventBuilder.mockClear();
+      mockAddProperties.mockClear();
+      mockTrackEvent.mockClear();
+
+      fireEvent.press(getByText('Try again'));
+
+      await waitFor(() => {
+        expect(mockCreateEventBuilder).toHaveBeenCalled();
+        expect(mockAddProperties).toHaveBeenCalledWith({
+          flow_type: 'social_login',
+        });
+        expect(mockTrackEvent).toHaveBeenCalled();
+      });
+    });
+
+    it('tracks support clicked event when MetaMask Support is pressed', () => {
+      const { getByText } = renderWithProvider(
+        <SocialLoginErrorSheet error={mockError} />,
+        { state: initialState },
+      );
+
+      mockCreateEventBuilder.mockClear();
+      mockAddProperties.mockClear();
+      mockTrackEvent.mockClear();
+
+      fireEvent.press(getByText('MetaMask Support'));
+
+      expect(mockCreateEventBuilder).toHaveBeenCalled();
+      expect(mockAddProperties).toHaveBeenCalledWith({
+        flow_type: 'social_login',
+      });
+      expect(mockTrackEvent).toHaveBeenCalled();
+    });
   });
 
   it('renders error title', () => {
-    // Arrange & Act
     const { getByText } = renderWithProvider(<SocialLoginErrorSheet />, {
       state: initialState,
     });
 
-    // Assert
     expect(getByText('Something went wrong')).toBeOnTheScreen();
   });
 
   it('renders try again button', () => {
-    // Arrange & Act
     const { getByText } = renderWithProvider(<SocialLoginErrorSheet />, {
       state: initialState,
     });
 
-    // Assert
     expect(getByText('Try again')).toBeOnTheScreen();
   });
 
   it('renders MetaMask Support link', () => {
-    // Arrange & Act
     const { getByText } = renderWithProvider(<SocialLoginErrorSheet />, {
       state: initialState,
     });
 
-    // Assert
     expect(getByText('MetaMask Support')).toBeOnTheScreen();
   });
 
   it('deletes wallet and resets navigation when try again is pressed', async () => {
-    // Arrange
     (Authentication.deleteWallet as jest.Mock).mockResolvedValue(undefined);
     const { getByText } = renderWithProvider(<SocialLoginErrorSheet />, {
       state: initialState,
     });
     const tryAgainButton = getByText('Try again');
 
-    // Act
     fireEvent.press(tryAgainButton);
 
-    // Assert
     await waitFor(() => {
       expect(Authentication.deleteWallet).toHaveBeenCalled();
     });
@@ -102,23 +181,19 @@ describe('SocialLoginErrorSheet', () => {
   });
 
   it('opens support URL when MetaMask Support is pressed', () => {
-    // Arrange
     const { getByText } = renderWithProvider(<SocialLoginErrorSheet />, {
       state: initialState,
     });
     const supportLink = getByText('MetaMask Support');
 
-    // Act
     fireEvent.press(supportLink);
 
-    // Assert
     expect(Linking.openURL).toHaveBeenCalledWith(
       AppConstants.REVIEW_PROMPT.SUPPORT,
     );
   });
 
   it('renders fox logo image', () => {
-    // Arrange & Act
     const { UNSAFE_getAllByType } = renderWithProvider(
       <SocialLoginErrorSheet />,
       {
@@ -126,13 +201,11 @@ describe('SocialLoginErrorSheet', () => {
       },
     );
 
-    // Assert
     const images = UNSAFE_getAllByType(Image);
     expect(images.length).toBeGreaterThan(0);
   });
 
   it('renders danger icon', () => {
-    // Arrange & Act
     const { UNSAFE_getAllByType } = renderWithProvider(
       <SocialLoginErrorSheet />,
       {
@@ -140,7 +213,6 @@ describe('SocialLoginErrorSheet', () => {
       },
     );
 
-    // Assert
     const icons = UNSAFE_getAllByType(asComponentType('SvgMock'));
     expect(icons.length).toBeGreaterThan(0);
   });
diff --git a/app/components/Views/WalletCreationError/SocialLoginErrorSheet.tsx b/app/components/Views/WalletCreationError/SocialLoginErrorSheet.tsx
index 06bef2bb7bbb..ea6bbb21195f 100644
--- a/app/components/Views/WalletCreationError/SocialLoginErrorSheet.tsx
+++ b/app/components/Views/WalletCreationError/SocialLoginErrorSheet.tsx
@@ -1,7 +1,9 @@
-import React, { useCallback } from 'react';
+import React, { useCallback, useEffect } from 'react';
 import { View, Image, Linking, SafeAreaView } from 'react-native';
 import { useNavigation } from '@react-navigation/native';
 
+import { useAnalytics } from '../../hooks/useAnalytics/useAnalytics';
+import { MetaMetricsEvents } from '../../../core/Analytics';
 import Text, {
   TextVariant,
   TextColor,
@@ -31,22 +33,52 @@ interface SocialLoginErrorSheetProps {
   error?: Error;
 }
 
-// eslint-disable-next-line @typescript-eslint/no-unused-vars
 const SocialLoginErrorSheet = ({ error }: SocialLoginErrorSheetProps) => {
   const navigation = useNavigation();
   const { styles } = useStyles(styleSheet, {});
+  const { trackEvent, createEventBuilder } = useAnalytics();
+
+  // Track screen viewed event
+  useEffect(() => {
+    trackEvent(
+      createEventBuilder(MetaMetricsEvents.WALLET_CREATION_ERROR_SCREEN_VIEWED)
+        .addProperties({
+          flow_type: 'social_login',
+          error_name: error?.name || 'Unknown',
+          error_message: error?.message || 'No message',
+        })
+        .build(),
+    );
+  }, [error, trackEvent, createEventBuilder]);
 
   const handleTryAgain = useCallback(async () => {
+    trackEvent(
+      createEventBuilder(MetaMetricsEvents.WALLET_CREATION_ERROR_RETRY_CLICKED)
+        .addProperties({
+          flow_type: 'social_login',
+        })
+        .build(),
+    );
+
     // Delete wallet
     await Authentication.deleteWallet();
     navigation.reset({
       routes: [{ name: Routes.ONBOARDING.ROOT_NAV }],
     });
-  }, [navigation]);
+  }, [navigation, trackEvent, createEventBuilder]);
 
   const handleContactSupport = useCallback(() => {
+    trackEvent(
+      createEventBuilder(
+        MetaMetricsEvents.WALLET_CREATION_ERROR_SUPPORT_CLICKED,
+      )
+        .addProperties({
+          flow_type: 'social_login',
+        })
+        .build(),
+    );
     Linking.openURL(AppConstants.REVIEW_PROMPT.SUPPORT);
-  }, []);
+  }, [trackEvent, createEventBuilder]);
 
   return (
     <SafeAreaView style={styles.container}>
diff --git a/app/components/Views/WalletRecovery/__snapshots__/index.test.tsx.snap b/app/components/Views/WalletRecovery/__snapshots__/index.test.tsx.snap
index a2e04db8bb44..3e41f5aa6d4b 100644
--- a/app/components/Views/WalletRecovery/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/WalletRecovery/__snapshots__/index.test.tsx.snap
@@ -41,7 +41,7 @@ exports[`WalletRecovery render matches snapshot 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Medium",
                 "fontSize": 14,
                 "letterSpacing": 0,
@@ -62,7 +62,7 @@ exports[`WalletRecovery render matches snapshot 1`] = `
               style={
                 {
                   "alignItems": "center",
-                  "backgroundColor": "#3c4d9d0f",
+                  "backgroundColor": "#b4b4b528",
                   "borderRadius": 8,
                   "columnGap": 8,
                   "flexDirection": "row",
@@ -79,7 +79,7 @@ exports[`WalletRecovery render matches snapshot 1`] = `
                 }
               >
                 <AppleIcon
-                  color="#121314"
+                  color="#131416"
                   fill="currentColor"
                   height={24}
                   name="google"
@@ -100,7 +100,7 @@ exports[`WalletRecovery render matches snapshot 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontFamily": "Geist-Medium",
                       "fontSize": 16,
                       "letterSpacing": 0,
@@ -114,7 +114,7 @@ exports[`WalletRecovery render matches snapshot 1`] = `
                   accessibilityRole="text"
                   style={
                     {
-                      "color": "#686e7d",
+                      "color": "#66676a",
                       "fontFamily": "Geist-Regular",
                       "fontSize": 14,
                       "letterSpacing": 0,
@@ -132,7 +132,7 @@ exports[`WalletRecovery render matches snapshot 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 14,
                 "letterSpacing": 0,
@@ -153,7 +153,7 @@ exports[`WalletRecovery render matches snapshot 1`] = `
           <View
             style={
               {
-                "backgroundColor": "#b7bbc866",
+                "backgroundColor": "#b4b4b566",
                 "height": 1,
                 "paddingHorizontal": 16,
               }
@@ -172,7 +172,7 @@ exports[`WalletRecovery render matches snapshot 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#686e7d",
+                "color": "#66676a",
                 "fontFamily": "Geist-Medium",
                 "fontSize": 14,
                 "letterSpacing": 0,
diff --git a/app/components/Views/confirmations/ConfirmationView.testIds.ts b/app/components/Views/confirmations/ConfirmationView.testIds.ts
index f7518984d5c6..1415c1ca18cd 100644
--- a/app/components/Views/confirmations/ConfirmationView.testIds.ts
+++ b/app/components/Views/confirmations/ConfirmationView.testIds.ts
@@ -100,4 +100,5 @@ export const TransactionPayComponentIDs = {
   PAY_WITH_BALANCE: 'pay-with-balance',
   PAY_WITH_FIAT: 'pay-with-fiat',
   PAY_WITH_SYMBOL: 'pay-with-symbol',
+  PAY_WITH_TOKEN_LIST: 'pay-with-token-list',
 };
diff --git a/app/components/Views/confirmations/components/UI/Tooltip/__snapshots__/Tooltip.test.tsx.snap b/app/components/Views/confirmations/components/UI/Tooltip/__snapshots__/Tooltip.test.tsx.snap
index 2f365b1d2507..c5caffa80ee3 100644
--- a/app/components/Views/confirmations/components/UI/Tooltip/__snapshots__/Tooltip.test.tsx.snap
+++ b/app/components/Views/confirmations/components/UI/Tooltip/__snapshots__/Tooltip.test.tsx.snap
@@ -22,7 +22,7 @@ exports[`Tooltip should match snapshot 1`] = `
     testID="info-row-tooltip-open-btn"
   >
     <SvgMock
-      color="#b7bbc8"
+      color="#babbbe"
       fill="currentColor"
       height={16}
       name="Info"
diff --git a/app/components/Views/confirmations/components/UI/bottom-modal/__snapshots__/bottom-modal.test.tsx.snap b/app/components/Views/confirmations/components/UI/bottom-modal/__snapshots__/bottom-modal.test.tsx.snap
index 499e8d636a4f..51a6486a7e57 100644
--- a/app/components/Views/confirmations/components/UI/bottom-modal/__snapshots__/bottom-modal.test.tsx.snap
+++ b/app/components/Views/confirmations/components/UI/bottom-modal/__snapshots__/bottom-modal.test.tsx.snap
@@ -52,7 +52,7 @@ exports[`BottomModal should match snapshot 1`] = `
       onStartShouldSetResponder={[Function]}
       style={
         {
-          "backgroundColor": "#3f434a66",
+          "backgroundColor": "#0a0d135c",
           "bottom": 0,
           "height": 1334,
           "left": 0,
diff --git a/app/components/Views/confirmations/components/UI/copy-button/__snapshots__/copy-button.test.tsx.snap b/app/components/Views/confirmations/components/UI/copy-button/__snapshots__/copy-button.test.tsx.snap
index f48e8969f5ad..c5b8c1c0ee2b 100644
--- a/app/components/Views/confirmations/components/UI/copy-button/__snapshots__/copy-button.test.tsx.snap
+++ b/app/components/Views/confirmations/components/UI/copy-button/__snapshots__/copy-button.test.tsx.snap
@@ -1,4 +1,4 @@
-// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`CopyButton should match snapshot 1`] = `
 <TouchableOpacity
@@ -21,7 +21,7 @@ exports[`CopyButton should match snapshot 1`] = `
   testID="copyButtonTestId"
 >
   <SvgMock
-    color="#686e7d"
+    color="#66676a"
     fill="currentColor"
     height={20}
     name="Copy"
diff --git a/app/components/Views/confirmations/components/UI/info-row-divider/info-row-divider.test.tsx b/app/components/Views/confirmations/components/UI/info-row-divider/info-row-divider.test.tsx
index 6b01278104c4..a2167d611e9b 100644
--- a/app/components/Views/confirmations/components/UI/info-row-divider/info-row-divider.test.tsx
+++ b/app/components/Views/confirmations/components/UI/info-row-divider/info-row-divider.test.tsx
@@ -1,4 +1,5 @@
 import React from 'react';
+import { mockTheme } from '../../../../../../util/theme';
 import { stakingDepositConfirmationState } from '../../../../../../util/test/confirm-data-helpers';
 import renderWithProvider from '../../../../../../util/test/renderWithProvider';
 import InfoRowDivider from './info-row-divider';
@@ -9,18 +10,16 @@ describe('InfoRowDivider', () => {
       state: stakingDepositConfirmationState,
     });
 
-    expect(toJSON()).toMatchInlineSnapshot(`
-      <View
-        style={
-          {
-            "backgroundColor": "#b7bbc866",
-            "height": 1,
-            "marginLeft": -8,
-            "marginRight": -8,
-            "marginVertical": 8,
-          }
-        }
-      />
-    `);
+    const result = toJSON();
+    expect(result).toBeTruthy();
+    if (result && !Array.isArray(result)) {
+      expect(result.props.style).toEqual({
+        backgroundColor: mockTheme.colors.border.muted,
+        height: 1,
+        marginLeft: -8,
+        marginRight: -8,
+        marginVertical: 8,
+      });
+    }
   });
 });
diff --git a/app/components/Views/confirmations/components/UI/info-row/info-section/info-section.styles.ts b/app/components/Views/confirmations/components/UI/info-row/info-section/info-section.styles.ts
index 4670574d71ba..571c5f6a6f71 100644
--- a/app/components/Views/confirmations/components/UI/info-row/info-section/info-section.styles.ts
+++ b/app/components/Views/confirmations/components/UI/info-row/info-section/info-section.styles.ts
@@ -8,11 +8,11 @@ const styleSheet = (params: { theme: Theme }) => {
   return StyleSheet.create({
     container: {
       backgroundColor: theme.colors.background.default,
-      borderRadius: 8,
+      borderRadius: 12,
       paddingTop: 12,
       paddingBottom: 8,
       paddingHorizontal: 8,
-      marginBottom: 8,
+      marginBottom: 12,
     },
   });
 };
diff --git a/app/components/Views/confirmations/components/UI/info-row/info-value/network/__snapshots__/network.test.tsx.snap b/app/components/Views/confirmations/components/UI/info-row/info-value/network/__snapshots__/network.test.tsx.snap
index 7c3231f6d474..80deecbbfad9 100644
--- a/app/components/Views/confirmations/components/UI/info-row/info-value/network/__snapshots__/network.test.tsx.snap
+++ b/app/components/Views/confirmations/components/UI/info-row/info-value/network/__snapshots__/network.test.tsx.snap
@@ -40,7 +40,7 @@ exports[`Network should match snapshot 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
diff --git a/app/components/Views/confirmations/components/UI/navbar/navbar.tsx b/app/components/Views/confirmations/components/UI/navbar/navbar.tsx
index 270d6a640032..7bfe54fd8fad 100644
--- a/app/components/Views/confirmations/components/UI/navbar/navbar.tsx
+++ b/app/components/Views/confirmations/components/UI/navbar/navbar.tsx
@@ -72,7 +72,7 @@ export function getNavbar({
 
   const defaultHeaderLeft = () => (
     <ButtonIcon
-      size={ButtonIconSizes.Lg}
+      size={ButtonIconSizes.Md}
       iconName={IconName.ArrowLeft}
       onPress={handleBackPress}
       style={innerStyles.headerLeft}
diff --git a/app/components/Views/confirmations/components/alerts/blocking-alert-message/blocking-alert-message.styles.ts b/app/components/Views/confirmations/components/alerts/blocking-alert-message/blocking-alert-message.styles.ts
new file mode 100644
index 000000000000..e69079dc841c
--- /dev/null
+++ b/app/components/Views/confirmations/components/alerts/blocking-alert-message/blocking-alert-message.styles.ts
@@ -0,0 +1,10 @@
+import { StyleSheet } from 'react-native';
+
+const styleSheet = () =>
+  StyleSheet.create({
+    container: {
+      paddingTop: 32,
+    },
+  });
+
+export default styleSheet;
diff --git a/app/components/Views/confirmations/components/alerts/blocking-alert-message/blocking-alert-message.test.tsx b/app/components/Views/confirmations/components/alerts/blocking-alert-message/blocking-alert-message.test.tsx
new file mode 100644
index 000000000000..2d5f54a89a29
--- /dev/null
+++ b/app/components/Views/confirmations/components/alerts/blocking-alert-message/blocking-alert-message.test.tsx
@@ -0,0 +1,73 @@
+import React from 'react';
+import { Text } from 'react-native';
+import { screen } from '@testing-library/react-native';
+import renderWithProvider from '../../../../../../util/test/renderWithProvider';
+import { useAlerts } from '../../../context/alert-system-context';
+import { Alert, Severity } from '../../../types/alerts';
+import { BlockingAlertMessage } from './blocking-alert-message';
+
+jest.mock('../../../context/alert-system-context', () => ({
+  useAlerts: jest.fn(),
+}));
+
+const mockUseAlerts = jest.mocked(useAlerts);
+
+const buildBlockingAlert = (overrides: Partial<Alert> = {}): Alert => ({
+  key: 'blocking-alert',
+  severity: Severity.Danger,
+  message: 'Blocking alert message',
+  isBlocking: true,
+  ...overrides,
+});
+
+const mockAlertsContext = (alerts: Alert[]) => {
+  mockUseAlerts.mockReturnValue({
+    alerts,
+  } as ReturnType<typeof useAlerts>);
+};
+
+describe('BlockingAlertMessage', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  it('renders nothing when there is no blocking alert message', () => {
+    mockAlertsContext([
+      buildBlockingAlert({ message: undefined }),
+      buildBlockingAlert({ isBlocking: false }),
+    ]);
+
+    const { toJSON } = renderWithProvider(<BlockingAlertMessage />, {
+      state: {},
+    });
+
+    expect(toJSON()).toBeNull();
+  });
+
+  it('renders the first blocking string message', () => {
+    mockAlertsContext([
+      buildBlockingAlert({ message: 'First blocking message' }),
+      buildBlockingAlert({
+        key: 'blocking-alert-2',
+        message: 'Second blocking message',
+      }),
+    ]);
+
+    renderWithProvider(<BlockingAlertMessage />, { state: {} });
+
+    expect(screen.getByText('First blocking message')).toBeOnTheScreen();
+    expect(screen.queryByText('Second blocking message')).toBeNull();
+  });
+
+  it('renders a blocking React element message', () => {
+    mockAlertsContext([
+      buildBlockingAlert({
+        message: <Text>React element alert content</Text>,
+      }),
+    ]);
+
+    renderWithProvider(<BlockingAlertMessage />, { state: {} });
+
+    expect(screen.getByText('React element alert content')).toBeOnTheScreen();
+  });
+});
diff --git a/app/components/Views/confirmations/components/alerts/blocking-alert-message/blocking-alert-message.tsx b/app/components/Views/confirmations/components/alerts/blocking-alert-message/blocking-alert-message.tsx
new file mode 100644
index 000000000000..e3ba1641a8a4
--- /dev/null
+++ b/app/components/Views/confirmations/components/alerts/blocking-alert-message/blocking-alert-message.tsx
@@ -0,0 +1,37 @@
+import React from 'react';
+import { View } from 'react-native';
+import Text, {
+  TextColor,
+  TextVariant,
+} from '../../../../../../component-library/components/Texts/Text';
+import { useStyles } from '../../../../../hooks/useStyles';
+import { useAlerts } from '../../../context/alert-system-context';
+import styleSheet from './blocking-alert-message.styles';
+
+/**
+ * Renders the first blocking alert message from the alert context.
+ */
+export const BlockingAlertMessage: React.FC = React.memo(() => {
+  const { alerts } = useAlerts();
+  const { styles } = useStyles(styleSheet, {});
+
+  const blockingAlertMessage = alerts.find(
+    (confirmationAlert) => confirmationAlert.isBlocking,
+  )?.message;
+
+  if (!blockingAlertMessage) {
+    return null;
+  }
+
+  return (
+    <View style={styles.container}>
+      {typeof blockingAlertMessage === 'string' ? (
+        <Text variant={TextVariant.BodyMD} color={TextColor.Error}>
+          {blockingAlertMessage}
+        </Text>
+      ) : (
+        blockingAlertMessage
+      )}
+    </View>
+  );
+});
diff --git a/app/components/Views/confirmations/components/alerts/blocking-alert-message/index.ts b/app/components/Views/confirmations/components/alerts/blocking-alert-message/index.ts
new file mode 100644
index 000000000000..12cd888cc1a4
--- /dev/null
+++ b/app/components/Views/confirmations/components/alerts/blocking-alert-message/index.ts
@@ -0,0 +1 @@
+export { BlockingAlertMessage } from './blocking-alert-message';
diff --git a/app/components/Views/confirmations/components/blockaid-banner/__snapshots__/BlockaidBanner.test.tsx.snap b/app/components/Views/confirmations/components/blockaid-banner/__snapshots__/BlockaidBanner.test.tsx.snap
index 9c621843bc31..f27b24d94cca 100644
--- a/app/components/Views/confirmations/components/blockaid-banner/__snapshots__/BlockaidBanner.test.tsx.snap
+++ b/app/components/Views/confirmations/components/blockaid-banner/__snapshots__/BlockaidBanner.test.tsx.snap
@@ -71,9 +71,9 @@ exports[`BlockaidBanner should render correctly 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Medium",
-          "fontSize": 18,
+          "fontSize": 16,
           "letterSpacing": 0,
           "lineHeight": 24,
         }
@@ -85,11 +85,11 @@ exports[`BlockaidBanner should render correctly 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
-          "fontSize": 16,
+          "fontSize": 14,
           "letterSpacing": 0,
-          "lineHeight": 24,
+          "lineHeight": 22,
         }
       }
     >
@@ -223,9 +223,9 @@ exports[`BlockaidBanner should render correctly with list attack details 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Medium",
-          "fontSize": 18,
+          "fontSize": 16,
           "letterSpacing": 0,
           "lineHeight": 24,
         }
@@ -237,11 +237,11 @@ exports[`BlockaidBanner should render correctly with list attack details 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
-          "fontSize": 16,
+          "fontSize": 14,
           "letterSpacing": 0,
-          "lineHeight": 24,
+          "lineHeight": 22,
         }
       }
     >
@@ -375,9 +375,9 @@ exports[`BlockaidBanner should render correctly with reason "raw_signature_farmi
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Medium",
-          "fontSize": 18,
+          "fontSize": 16,
           "letterSpacing": 0,
           "lineHeight": 24,
         }
@@ -389,11 +389,11 @@ exports[`BlockaidBanner should render correctly with reason "raw_signature_farmi
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
-          "fontSize": 16,
+          "fontSize": 14,
           "letterSpacing": 0,
-          "lineHeight": 24,
+          "lineHeight": 22,
         }
       }
     >
@@ -536,9 +536,9 @@ exports[`BlockaidBanner should render normal banner alert if resultType is faile
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Medium",
-            "fontSize": 18,
+            "fontSize": 16,
             "letterSpacing": 0,
             "lineHeight": 24,
           }
@@ -550,11 +550,11 @@ exports[`BlockaidBanner should render normal banner alert if resultType is faile
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
-            "fontSize": 16,
+            "fontSize": 14,
             "letterSpacing": 0,
-            "lineHeight": 24,
+            "lineHeight": 22,
           }
         }
       >
@@ -628,9 +628,9 @@ exports[`BlockaidBanner should render something does not look right with contact
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Medium",
-          "fontSize": 18,
+          "fontSize": 16,
           "letterSpacing": 0,
           "lineHeight": 24,
         }
@@ -642,11 +642,11 @@ exports[`BlockaidBanner should render something does not look right with contact
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
-          "fontSize": 16,
+          "fontSize": 14,
           "letterSpacing": 0,
-          "lineHeight": 24,
+          "lineHeight": 22,
         }
       }
     >
diff --git a/app/components/Views/confirmations/components/flat-nav-header/flat-nav-header.tsx b/app/components/Views/confirmations/components/flat-nav-header/flat-nav-header.tsx
index b20cf696c9bb..480d5b13c7b0 100644
--- a/app/components/Views/confirmations/components/flat-nav-header/flat-nav-header.tsx
+++ b/app/components/Views/confirmations/components/flat-nav-header/flat-nav-header.tsx
@@ -36,7 +36,7 @@ const FlatNavHeader = ({ title, onLeftPress }: FlatNavHeaderProps) => {
       <ButtonIcon
         iconName={IconName.ArrowLeft}
         onPress={handleLeftPress}
-        size={ButtonIconSizes.Lg}
+        size={ButtonIconSizes.Md}
         style={styles.left}
         testID="flat-nav-header-back-button"
       />
diff --git a/app/components/Views/confirmations/components/footer/footer.tsx b/app/components/Views/confirmations/components/footer/footer.tsx
index 1ff5d002adf3..0ca2bc7a656f 100644
--- a/app/components/Views/confirmations/components/footer/footer.tsx
+++ b/app/components/Views/confirmations/components/footer/footer.tsx
@@ -21,7 +21,6 @@ import ConfirmAlertModal from '../../components/modals/confirm-alert-modal';
 import { ResultType } from '../../constants/signatures';
 import { useAlerts } from '../../context/alert-system-context';
 import { useConfirmationContext } from '../../context/confirmation-context';
-import { useQRHardwareContext } from '../../context/qr-hardware-context/qr-hardware-context';
 import { useSecurityAlertResponse } from '../../hooks/alerts/useSecurityAlertResponse';
 import { useConfirmationAlertMetrics } from '../../hooks/metrics/useConfirmationAlertMetrics';
 import { useTransactionMetadataRequest } from '../../hooks/transactions/useTransactionMetadataRequest';
@@ -39,6 +38,7 @@ import { hasTransactionType } from '../../utils/transaction';
 import { PredictClaimFooter } from '../predict-confirmations/predict-claim-footer/predict-claim-footer';
 import { useIsTransactionPayLoading } from '../../hooks/pay/useTransactionPayData';
 import { Skeleton } from '../../../../../component-library/components/Skeleton';
+import { useQRHardwareContext } from '../../context/qr-hardware-context';
 
 const HIDE_FOOTER_BY_DEFAULT_TYPES = [
   TransactionType.perpsDeposit,
@@ -59,7 +59,6 @@ export const Footer = () => {
   const { onConfirm, onReject } = useConfirmActions();
   const { isSigningQRObject, needsCameraPermission } = useQRHardwareContext();
   const { securityAlertResponse } = useSecurityAlertResponse();
-  const confirmDisabled = needsCameraPermission;
   const transactionMetadata = useTransactionMetadataRequest();
   const { trackAlertMetrics } = useConfirmationAlertMetrics();
   const { isFullScreenConfirmation } = useFullScreenConfirmation();
@@ -113,7 +112,6 @@ export const Footer = () => {
   }, [alerts, trackAlertMetrics]);
 
   const { styles } = useStyles(styleSheet, {
-    confirmDisabled,
     isStakingConfirmationBool,
     isFullScreenConfirmation,
   });
@@ -253,7 +251,6 @@ export const Footer = () => {
 export function FooterSkeleton() {
   const { isFullScreenConfirmation } = useFullScreenConfirmation();
   const { styles } = useStyles(styleSheet, {
-    confirmDisabled: false,
     isStakingConfirmationBool: false,
     isFullScreenConfirmation,
   });
diff --git a/app/components/Views/confirmations/components/gas/gas-speed/gas-speed.tsx b/app/components/Views/confirmations/components/gas/gas-speed/gas-speed.tsx
index 7a32739734d7..c3f9360c249d 100644
--- a/app/components/Views/confirmations/components/gas/gas-speed/gas-speed.tsx
+++ b/app/components/Views/confirmations/components/gas/gas-speed/gas-speed.tsx
@@ -5,12 +5,15 @@ import {
   GasFeeEstimateLevel,
   GasFeeEstimateType,
 } from '@metamask/transaction-controller';
+import { useSelector } from 'react-redux';
 
 import Text from '../../../../../../component-library/components/Texts/Text/Text';
 import { strings } from '../../../../../../../locales/i18n';
+import { selectTransactionMetadataById } from '../../../../../../selectors/transactionController';
 import { useTransactionMetadataRequest } from '../../../hooks/transactions/useTransactionMetadataRequest';
 import { useGasFeeEstimates } from '../../../hooks/gas/useGasFeeEstimates';
 import { toHumanSeconds } from '../../../utils/time';
+import type { RootState } from '../../../../../../reducers';
 
 const getText = (userFeeLevel: UserFeeLevel | GasFeeEstimateLevel) => {
   switch (userFeeLevel) {
@@ -54,21 +57,34 @@ const getEstimatedTime = (
   return ` ~ ${humanizedWaitTime}`;
 };
 
-export const GasSpeed = () => {
-  const transactionMeta = useTransactionMetadataRequest();
+export interface GasSpeedProps {
+  /** When provided, use this transaction (from selectTransactionMetadataById) instead of the approval-flow transaction. */
+  transactionId?: string | null;
+}
+
+export const GasSpeed = ({ transactionId }: GasSpeedProps = {}) => {
+  const transactionMetaFromRequest = useTransactionMetadataRequest();
+  const transactionMetaFromId = useSelector((state: RootState) =>
+    transactionId
+      ? selectTransactionMetadataById(state, transactionId)
+      : undefined,
+  );
+
+  const transactionMeta = transactionId
+    ? transactionMetaFromId
+    : transactionMetaFromRequest;
   const { gasFeeEstimates } = useGasFeeEstimates(
-    transactionMeta?.networkClientId || '',
+    transactionMeta?.networkClientId ?? '',
   );
   const networkGasFeeEstimates = gasFeeEstimates as GasFeeEstimates;
 
-  if (!transactionMeta?.userFeeLevel) {
+  const userFeeLevel = (transactionMeta?.userFeeLevel ??
+    GasFeeEstimateLevel.Medium) as UserFeeLevel | GasFeeEstimateLevel;
+
+  if (!transactionMeta) {
     return null;
   }
 
-  const userFeeLevel = transactionMeta.userFeeLevel as
-    | UserFeeLevel
-    | GasFeeEstimateLevel;
-
   const isGasPriceEstimateSelected =
     transactionMeta.gasFeeEstimates?.type === GasFeeEstimateType.GasPrice &&
     userFeeLevel === GasFeeEstimateLevel.Medium;
diff --git a/app/components/Views/confirmations/components/gas/gas-speed/index.ts b/app/components/Views/confirmations/components/gas/gas-speed/index.ts
index f8856f802dfd..865c0d84b4e9 100644
--- a/app/components/Views/confirmations/components/gas/gas-speed/index.ts
+++ b/app/components/Views/confirmations/components/gas/gas-speed/index.ts
@@ -1 +1 @@
-export { GasSpeed } from './gas-speed';
+export { GasSpeed, type GasSpeedProps } from './gas-speed';
diff --git a/app/components/Views/confirmations/components/gas/selected-gas-fee-token/selected-gas-fee-token.styles.ts b/app/components/Views/confirmations/components/gas/selected-gas-fee-token/selected-gas-fee-token.styles.ts
index 5bde636502e9..6fe8c0da9297 100644
--- a/app/components/Views/confirmations/components/gas/selected-gas-fee-token/selected-gas-fee-token.styles.ts
+++ b/app/components/Views/confirmations/components/gas/selected-gas-fee-token/selected-gas-fee-token.styles.ts
@@ -5,16 +5,16 @@ const styleSheet = (params: { theme: Theme }) => {
   const { theme } = params;
   return StyleSheet.create({
     gasFeeTokenButton: {
-      backgroundColor: theme.colors.background.alternative,
+      backgroundColor: theme.colors.background.muted,
       alignItems: 'center',
       display: 'flex',
       flexDirection: 'row',
-      gap: 4,
-      borderRadius: 4,
+      gap: 6,
+      borderRadius: 8,
       paddingTop: 2,
       paddingBottom: 2,
-      paddingLeft: 6,
-      paddingRight: 6,
+      paddingLeft: 8,
+      paddingRight: 8,
     },
   });
 };
diff --git a/app/components/Views/confirmations/components/hero-token/hero-token.styles.ts b/app/components/Views/confirmations/components/hero-token/hero-token.styles.ts
index c952cdebce55..a707caa7de48 100644
--- a/app/components/Views/confirmations/components/hero-token/hero-token.styles.ts
+++ b/app/components/Views/confirmations/components/hero-token/hero-token.styles.ts
@@ -14,6 +14,7 @@ const styleSheet = (params: {
     },
     assetAmountText: {
       textAlign: 'center',
+      paddingTop: 12,
     },
     assetTextUnknown: {
       color: theme.colors.text.alternative,
diff --git a/app/components/Views/confirmations/components/info-root/info-root.tsx b/app/components/Views/confirmations/components/info-root/info-root.tsx
index a2f14f0743b6..62ae9861e5d1 100644
--- a/app/components/Views/confirmations/components/info-root/info-root.tsx
+++ b/app/components/Views/confirmations/components/info-root/info-root.tsx
@@ -25,7 +25,7 @@ import { hasTransactionType } from '../../utils/transaction';
 import { PredictClaimInfo } from '../info/predict-claim-info';
 import { PredictWithdrawInfo } from '../info/predict-withdraw-info';
 import { MusdClaimInfo } from '../info/musd-claim-info';
-import { MusdConversionInfo } from '../info/musd-conversion-info';
+import { MusdConversionInfoRoot } from '../info/musd-conversion-info-root';
 import { useRefreshSmartTransactionsLiveness } from '../../../../hooks/useRefreshSmartTransactionsLiveness';
 import PerpsOrderView from '../../../../UI/Perps/Views/PerpsOrderView';
 
@@ -112,7 +112,7 @@ const Info = ({ route }: InfoProps) => {
     transactionMetadata &&
     hasTransactionType(transactionMetadata, [TransactionType.musdConversion])
   ) {
-    return <MusdConversionInfo />;
+    return <MusdConversionInfoRoot />;
   }
 
   if (
diff --git a/app/components/Views/confirmations/components/info/musd-conversion-info-root/index.ts b/app/components/Views/confirmations/components/info/musd-conversion-info-root/index.ts
new file mode 100644
index 000000000000..3df1468f04e4
--- /dev/null
+++ b/app/components/Views/confirmations/components/info/musd-conversion-info-root/index.ts
@@ -0,0 +1 @@
+export { MusdConversionInfoRoot } from './musd-conversion-info-root';
diff --git a/app/components/Views/confirmations/components/info/musd-conversion-info-root/musd-conversion-info-root.test.tsx b/app/components/Views/confirmations/components/info/musd-conversion-info-root/musd-conversion-info-root.test.tsx
new file mode 100644
index 000000000000..a9d74e1bf858
--- /dev/null
+++ b/app/components/Views/confirmations/components/info/musd-conversion-info-root/musd-conversion-info-root.test.tsx
@@ -0,0 +1,72 @@
+import React from 'react';
+
+import renderWithProvider from '../../../../../../util/test/renderWithProvider';
+import { MusdConversionInfoRoot } from './musd-conversion-info-root';
+
+const MUSD_CONVERSION_INFO_TEST_ID = 'musd-conversion-info';
+const MUSD_MAX_CONVERSION_INFO_TEST_ID = 'musd-max-conversion-info';
+
+jest.mock('../musd-conversion-info', () => {
+  const { View } =
+    jest.requireActual<typeof import('react-native')>('react-native');
+  return {
+    MusdConversionInfo: () => <View testID="musd-conversion-info" />,
+  };
+});
+
+jest.mock('../musd-max-conversion-info', () => {
+  const { View } =
+    jest.requireActual<typeof import('react-native')>('react-native');
+  return {
+    MusdMaxConversionInfo: () => <View testID="musd-max-conversion-info" />,
+  };
+});
+
+const mockUseParams = jest.fn();
+jest.mock('../../../../../../util/navigation/navUtils', () => ({
+  useParams: (defaults?: Record<string, unknown>) =>
+    mockUseParams(defaults) ?? defaults ?? {},
+}));
+
+describe('MusdConversionInfoRoot', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  it('renders MusdMaxConversionInfo when forceBottomSheet is true', () => {
+    mockUseParams.mockReturnValue({
+      forceBottomSheet: true,
+    });
+
+    const { getByTestId, queryByTestId } = renderWithProvider(
+      <MusdConversionInfoRoot />,
+    );
+
+    expect(getByTestId(MUSD_MAX_CONVERSION_INFO_TEST_ID)).toBeOnTheScreen();
+    expect(queryByTestId(MUSD_CONVERSION_INFO_TEST_ID)).toBeNull();
+  });
+
+  it('renders MusdConversionInfo when forceBottomSheet is false', () => {
+    mockUseParams.mockReturnValue({
+      forceBottomSheet: false,
+    });
+
+    const { getByTestId, queryByTestId } = renderWithProvider(
+      <MusdConversionInfoRoot />,
+    );
+
+    expect(getByTestId(MUSD_CONVERSION_INFO_TEST_ID)).toBeOnTheScreen();
+    expect(queryByTestId(MUSD_MAX_CONVERSION_INFO_TEST_ID)).toBeNull();
+  });
+
+  it('renders MusdConversionInfo when forceBottomSheet is undefined', () => {
+    mockUseParams.mockReturnValue({});
+
+    const { getByTestId, queryByTestId } = renderWithProvider(
+      <MusdConversionInfoRoot />,
+    );
+
+    expect(getByTestId(MUSD_CONVERSION_INFO_TEST_ID)).toBeOnTheScreen();
+    expect(queryByTestId(MUSD_MAX_CONVERSION_INFO_TEST_ID)).toBeNull();
+  });
+});
diff --git a/app/components/Views/confirmations/components/info/musd-conversion-info-root/musd-conversion-info-root.tsx b/app/components/Views/confirmations/components/info/musd-conversion-info-root/musd-conversion-info-root.tsx
new file mode 100644
index 000000000000..c6b249ab8825
--- /dev/null
+++ b/app/components/Views/confirmations/components/info/musd-conversion-info-root/musd-conversion-info-root.tsx
@@ -0,0 +1,10 @@
+import React from 'react';
+import { MusdConversionInfo } from '../musd-conversion-info';
+import { MusdMaxConversionInfo } from '../musd-max-conversion-info';
+import { useParams } from '../../../../../../util/navigation/navUtils';
+
+export const MusdConversionInfoRoot = () => {
+  const { forceBottomSheet } = useParams<{ forceBottomSheet?: boolean }>();
+
+  return forceBottomSheet ? <MusdMaxConversionInfo /> : <MusdConversionInfo />;
+};
diff --git a/app/components/Views/confirmations/components/info/musd-conversion-info/musd-conversion-info.test.tsx b/app/components/Views/confirmations/components/info/musd-conversion-info/musd-conversion-info.test.tsx
index 7772071b1bda..2a82375e03cf 100644
--- a/app/components/Views/confirmations/components/info/musd-conversion-info/musd-conversion-info.test.tsx
+++ b/app/components/Views/confirmations/components/info/musd-conversion-info/musd-conversion-info.test.tsx
@@ -3,19 +3,19 @@ import { Hex } from '@metamask/utils';
 import renderWithProvider from '../../../../../../util/test/renderWithProvider';
 import { MusdConversionInfo } from './musd-conversion-info';
 import { useAddToken } from '../../../hooks/tokens/useAddToken';
-import { useRoute } from '@react-navigation/native';
 import { CustomAmountInfo } from '../custom-amount-info';
 import { useCustomAmount } from '../../../hooks/earn/useCustomAmount';
 import { useTransactionPayAvailableTokens } from '../../../hooks/pay/useTransactionPayAvailableTokens';
 import { useMusdConversionNavbar } from '../../../../../UI/Earn/hooks/useMusdConversionNavbar';
-import { useTransactionMetadataRequest } from '../../../hooks/transactions/useTransactionMetadataRequest';
-import { TransactionMeta } from '@metamask/transaction-controller';
+import { useParams } from '../../../../../../util/navigation/navUtils';
 
 jest.mock('../../../hooks/tokens/useAddToken');
 jest.mock('../../../hooks/earn/useCustomAmount');
 jest.mock('../../../hooks/pay/useTransactionPayAvailableTokens');
 jest.mock('../../../../../UI/Earn/hooks/useMusdConversionNavbar');
-jest.mock('../../../hooks/transactions/useTransactionMetadataRequest');
+jest.mock('../../../../../../util/navigation/navUtils', () => ({
+  useParams: jest.fn(),
+}));
 jest.mock('../../../../../../util/trace', () => ({
   endTrace: jest.fn(),
   TraceName: {
@@ -35,60 +35,37 @@ jest.mock('../../rows/pay-with-row', () => ({
   PayWithRow: jest.fn(() => null),
 }));
 
-interface MockRoute {
-  key: string;
-  name: string;
-  params?: {
-    preferredPaymentToken?: {
-      address: Hex;
-      chainId: Hex;
-    };
+interface MockParams {
+  preferredPaymentToken?: {
+    address: Hex;
+    chainId: Hex;
   };
 }
 
-const mockRoute: MockRoute = {
-  key: 'test-route',
-  name: 'MusdConversionInfo',
-  params: {
-    preferredPaymentToken: {
-      address: '0xdef' as Hex,
-      chainId: '0x1' as Hex,
-    },
+const mockParams: MockParams = {
+  preferredPaymentToken: {
+    address: '0xdef' as Hex,
+    chainId: '0x1' as Hex,
   },
 };
 
-jest.mock('@react-navigation/native', () => {
-  const actualNav = jest.requireActual('@react-navigation/native');
-  return {
-    ...actualNav,
-    useRoute: jest.fn(() => mockRoute),
-  };
-});
-
 describe('MusdConversionInfo', () => {
   const mockUseAddToken = jest.mocked(useAddToken);
-  const mockUseRoute = jest.mocked(useRoute);
+  const mockUseParams = jest.mocked(useParams);
   const mockUseCustomAmount = jest.mocked(useCustomAmount);
   const mockUseTransactionPayAvailableTokens = jest.mocked(
     useTransactionPayAvailableTokens,
   );
   const mockUseMusdConversionNavbar = jest.mocked(useMusdConversionNavbar);
-  const mockUseTransactionMetadataRequest = jest.mocked(
-    useTransactionMetadataRequest,
-  );
 
   beforeEach(() => {
     jest.clearAllMocks();
-    mockRoute.params = {
-      preferredPaymentToken: {
-        address: '0xdef' as Hex,
-        chainId: '0x1' as Hex,
-      },
+    mockParams.preferredPaymentToken = {
+      address: '0xdef' as Hex,
+      chainId: '0x1' as Hex,
     };
+    mockUseParams.mockReturnValue(mockParams);
     mockUseMusdConversionNavbar.mockReturnValue(undefined);
-    mockUseTransactionMetadataRequest.mockReturnValue({
-      chainId: '0x1',
-    } as unknown as TransactionMeta);
     mockUseCustomAmount.mockReturnValue({
       shouldShowOutputAmountTag: false,
       outputAmount: null,
@@ -105,15 +82,13 @@ describe('MusdConversionInfo', () => {
   });
 
   describe('rendering', () => {
-    it('renders without errors when all route params provided', () => {
-      mockRoute.params = {
+    it('renders without errors when preferredPaymentToken is provided', () => {
+      mockUseParams.mockReturnValue({
         preferredPaymentToken: {
           address: '0xdef' as Hex,
           chainId: '0x1' as Hex,
         },
-      };
-
-      mockUseRoute.mockReturnValue(mockRoute);
+      });
 
       renderWithProvider(<MusdConversionInfo />, {
         state: {},
@@ -122,10 +97,8 @@ describe('MusdConversionInfo', () => {
       expect(mockUseAddToken).toHaveBeenCalled();
     });
 
-    it('throws error when preferredPaymentToken is missing from route params', () => {
-      mockRoute.params = {};
-
-      mockUseRoute.mockReturnValue(mockRoute);
+    it('throws error when preferredPaymentToken is missing from params', () => {
+      mockUseParams.mockReturnValue({});
 
       const consoleErrorSpy = jest
         .spyOn(console, 'error')
@@ -141,12 +114,33 @@ describe('MusdConversionInfo', () => {
         consoleErrorSpy.mockRestore();
       }
     });
+
+    it('throws error when mUSD token address is unavailable for preferred chain', () => {
+      mockUseParams.mockReturnValue({
+        preferredPaymentToken: {
+          address: '0xdef' as Hex,
+          chainId: '0x999999' as Hex,
+        },
+      });
+
+      const consoleErrorSpy = jest
+        .spyOn(console, 'error')
+        .mockImplementation(() => undefined);
+
+      try {
+        expect(() =>
+          renderWithProvider(<MusdConversionInfo />, {
+            state: {},
+          }),
+        ).toThrow('mUSD token address not found for chain ID: 0x999999');
+      } finally {
+        consoleErrorSpy.mockRestore();
+      }
+    });
   });
 
   describe('useAddToken', () => {
     it('calls useAddToken with mUSD token info', () => {
-      mockUseRoute.mockReturnValue(mockRoute);
-
       renderWithProvider(<MusdConversionInfo />, {
         state: {},
       });
@@ -168,11 +162,9 @@ describe('MusdConversionInfo', () => {
         chainId: '0x1' as Hex,
       };
 
-      mockRoute.params = {
+      mockUseParams.mockReturnValue({
         preferredPaymentToken,
-      };
-
-      mockUseRoute.mockReturnValue(mockRoute);
+      });
 
       renderWithProvider(<MusdConversionInfo />, {
         state: {},
@@ -189,8 +181,6 @@ describe('MusdConversionInfo', () => {
 
   describe('overrideContent', () => {
     it('passes overrideContent function to CustomAmountInfo', () => {
-      mockUseRoute.mockReturnValue(mockRoute);
-
       renderWithProvider(<MusdConversionInfo />, {
         state: {},
       });
@@ -206,7 +196,6 @@ describe('MusdConversionInfo', () => {
 
   describe('MusdOverrideContent', () => {
     it('calls useTransactionPayAvailableTokens when rendered', () => {
-      mockUseRoute.mockReturnValue(mockRoute);
       mockUseTransactionPayAvailableTokens.mockReturnValue({
         availableTokens: [{ address: '0x123' }],
         hasTokens: true,
@@ -230,11 +219,6 @@ describe('MusdConversionInfo', () => {
 
   describe('useMusdConversionNavbar', () => {
     it('calls useMusdConversionNavbar', () => {
-      mockUseRoute.mockReturnValue(mockRoute);
-      mockUseTransactionMetadataRequest.mockReturnValue({
-        chainId: '0xe708',
-      } as unknown as TransactionMeta);
-
       renderWithProvider(<MusdConversionInfo />, {
         state: {},
       });
diff --git a/app/components/Views/confirmations/components/info/musd-max-conversion-info/index.ts b/app/components/Views/confirmations/components/info/musd-max-conversion-info/index.ts
new file mode 100644
index 000000000000..63a3b96fa144
--- /dev/null
+++ b/app/components/Views/confirmations/components/info/musd-max-conversion-info/index.ts
@@ -0,0 +1,5 @@
+export {
+  MusdMaxConversionInfo,
+  MusdMaxConversionInfoTestIds,
+  type MusdMaxConversionParams,
+} from './musd-max-conversion-info';
diff --git a/app/components/Views/confirmations/components/info/musd-max-conversion-info/musd-max-conversion-info.styles.ts b/app/components/Views/confirmations/components/info/musd-max-conversion-info/musd-max-conversion-info.styles.ts
new file mode 100644
index 000000000000..28eb8216d825
--- /dev/null
+++ b/app/components/Views/confirmations/components/info/musd-max-conversion-info/musd-max-conversion-info.styles.ts
@@ -0,0 +1,24 @@
+import { StyleSheet } from 'react-native';
+import { Theme } from '../../../../../../util/theme/models';
+
+const styleSheet = (params: { theme: Theme }) => {
+  const { theme } = params;
+  const { colors } = theme;
+
+  return StyleSheet.create({
+    container: {
+      flex: 1,
+    },
+    detailsSection: {
+      backgroundColor: colors.background.default,
+      borderRadius: 12,
+      paddingHorizontal: 16,
+      paddingVertical: 8,
+    },
+    buttonContainer: {
+      paddingTop: 32,
+    },
+  });
+};
+
+export default styleSheet;
diff --git a/app/components/Views/confirmations/components/info/musd-max-conversion-info/musd-max-conversion-info.test.tsx b/app/components/Views/confirmations/components/info/musd-max-conversion-info/musd-max-conversion-info.test.tsx
new file mode 100644
index 000000000000..6a58597c3ba7
--- /dev/null
+++ b/app/components/Views/confirmations/components/info/musd-max-conversion-info/musd-max-conversion-info.test.tsx
@@ -0,0 +1,261 @@
+import React from 'react';
+import { fireEvent, screen } from '@testing-library/react-native';
+
+import renderWithProvider from '../../../../../../util/test/renderWithProvider';
+import {
+  MusdMaxConversionInfo,
+  MusdMaxConversionInfoTestIds,
+} from './musd-max-conversion-info';
+import { AssetType } from '../../../types/token';
+import { useTransactionMetadataRequest } from '../../../hooks/transactions/useTransactionMetadataRequest';
+import { useIsTransactionPayLoading } from '../../../hooks/pay/useTransactionPayData';
+import { useTransactionConfirm } from '../../../hooks/transactions/useTransactionConfirm';
+import { useAlerts } from '../../../context/alert-system-context';
+import useFiatFormatter from '../../../../../UI/SimulationDetails/FiatDisplay/useFiatFormatter';
+
+const mockToken: AssetType = {
+  address: '0x123',
+  symbol: 'USDC',
+  decimals: 6,
+  name: 'USD Coin',
+  chainId: '0x1',
+} as AssetType;
+
+const mockUseParams = jest.fn();
+jest.mock('../../../../../../util/navigation/navUtils', () => ({
+  useParams: (defaults?: Record<string, unknown>) =>
+    mockUseParams(defaults) ?? defaults ?? {},
+}));
+
+jest.mock('react-redux', () => {
+  const actual =
+    jest.requireActual<typeof import('react-redux')>('react-redux');
+  const networkInfos = jest.requireActual<
+    typeof import('../../../../../../selectors/networkInfos')
+  >('../../../../../../selectors/networkInfos');
+  return {
+    ...actual,
+    useSelector: jest.fn((selector: (state: unknown) => unknown) => {
+      if (selector === networkInfos.selectNetworkName) {
+        return 'Ethereum Mainnet';
+      }
+      return actual.useSelector(selector);
+    }),
+  };
+});
+
+jest.mock('../../../hooks/transactions/useTransactionMetadataRequest', () => ({
+  useTransactionMetadataRequest: jest.fn(),
+}));
+
+jest.mock('../../../hooks/pay/useTransactionPayData', () => ({
+  useIsTransactionPayLoading: jest.fn(),
+}));
+
+jest.mock('../../../hooks/transactions/useTransactionConfirm', () => ({
+  useTransactionConfirm: jest.fn(),
+}));
+
+jest.mock('../../../context/alert-system-context', () => ({
+  useAlerts: jest.fn(),
+}));
+
+jest.mock(
+  '../../../../../UI/SimulationDetails/FiatDisplay/useFiatFormatter',
+  () => ({
+    __esModule: true,
+    default: jest.fn(),
+  }),
+);
+
+jest.mock('../../token-conversion-asset-header', () => ({
+  TokenConversionAssetHeader: () => null,
+}));
+
+jest.mock('../../rows/bridge-fee-row', () => ({
+  BridgeFeeRow: () => null,
+}));
+
+jest.mock('../../rows/token-conversion-rate-row', () => ({
+  TokenConversionRateRow: () => null,
+}));
+
+jest.mock('../../rows/total-row', () => ({
+  TotalRow: () => null,
+}));
+
+jest.mock('../../rows/percentage-row', () => ({
+  PercentageRow: () => null,
+}));
+
+const mockUseTransactionMetadataRequest = jest.mocked(
+  useTransactionMetadataRequest,
+);
+const mockUseIsTransactionPayLoading = jest.mocked(useIsTransactionPayLoading);
+const mockUseTransactionConfirm = jest.mocked(useTransactionConfirm);
+const mockUseAlerts = jest.mocked(useAlerts);
+const mockUseFiatFormatter = jest.mocked(useFiatFormatter);
+
+function setupMocksForSuccessPath() {
+  mockUseParams.mockReturnValue({ token: mockToken });
+  mockUseTransactionMetadataRequest.mockReturnValue({
+    chainId: '0x1',
+  } as unknown as ReturnType<typeof useTransactionMetadataRequest>);
+  mockUseIsTransactionPayLoading.mockReturnValue(false);
+  mockUseTransactionConfirm.mockReturnValue({ onConfirm: jest.fn() });
+  mockUseAlerts.mockReturnValue({
+    alerts: [],
+  } as unknown as ReturnType<typeof useAlerts>);
+  mockUseFiatFormatter.mockReturnValue((value: { toString: () => string }) =>
+    value.toString(),
+  );
+}
+
+describe('MusdMaxConversionInfo', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+    setupMocksForSuccessPath();
+  });
+
+  afterEach(() => {
+    jest.resetAllMocks();
+  });
+
+  describe('rendering', () => {
+    it('renders container with CONTAINER testID', () => {
+      renderWithProvider(<MusdMaxConversionInfo />, { state: {} });
+
+      const container = screen.getByTestId(
+        MusdMaxConversionInfoTestIds.CONTAINER,
+      );
+      expect(container).toBeOnTheScreen();
+    });
+  });
+
+  describe('blocking alert', () => {
+    it('displays blocking alert message when provided', () => {
+      mockUseAlerts.mockReturnValue({
+        alerts: [
+          {
+            key: 'BlockingAlert',
+            message: 'Cannot proceed with this conversion',
+            title: 'Review',
+            severity: 'danger',
+            isBlocking: true,
+          },
+        ],
+      } as ReturnType<typeof useAlerts>);
+
+      renderWithProvider(<MusdMaxConversionInfo />, { state: {} });
+
+      expect(
+        screen.getByText('Cannot proceed with this conversion'),
+      ).toBeOnTheScreen();
+    });
+
+    it('uses blocking alert title as button label', () => {
+      mockUseAlerts.mockReturnValue({
+        alerts: [
+          {
+            key: 'BlockingAlert',
+            message: 'Blocked',
+            title: 'Acknowledge First',
+            severity: 'danger',
+            isBlocking: true,
+          },
+        ],
+      } as ReturnType<typeof useAlerts>);
+
+      renderWithProvider(<MusdMaxConversionInfo />, { state: {} });
+
+      expect(screen.getByText('Acknowledge First')).toBeOnTheScreen();
+    });
+
+    it('does not render blocking alert text when message missing', () => {
+      mockUseAlerts.mockReturnValue({
+        alerts: [
+          {
+            key: 'BlockingAlert',
+            title: 'Review',
+            severity: 'danger',
+            isBlocking: true,
+          },
+        ],
+      } as ReturnType<typeof useAlerts>);
+
+      renderWithProvider(<MusdMaxConversionInfo />, { state: {} });
+
+      expect(
+        screen.queryByText('Cannot proceed with this conversion'),
+      ).toBeNull();
+    });
+  });
+
+  describe('confirm button', () => {
+    it('calls onConfirm when confirm button is pressed', () => {
+      const mockOnConfirm = jest.fn();
+      mockUseTransactionConfirm.mockReturnValue({ onConfirm: mockOnConfirm });
+
+      renderWithProvider(<MusdMaxConversionInfo />, { state: {} });
+
+      const confirmButton = screen.getByTestId(
+        MusdMaxConversionInfoTestIds.CONFIRM_BUTTON,
+      );
+      fireEvent.press(confirmButton);
+
+      expect(mockOnConfirm).toHaveBeenCalledTimes(1);
+    });
+
+    it('disables confirm button when transaction metadata is missing', () => {
+      mockUseTransactionMetadataRequest.mockReturnValue(undefined);
+
+      renderWithProvider(<MusdMaxConversionInfo />, { state: {} });
+
+      const confirmButton = screen.getByTestId(
+        MusdMaxConversionInfoTestIds.CONFIRM_BUTTON,
+      );
+      expect(confirmButton.props.disabled).toBe(true);
+    });
+
+    it('disables confirm button when quotes are loading', () => {
+      mockUseIsTransactionPayLoading.mockReturnValue(true);
+
+      renderWithProvider(<MusdMaxConversionInfo />, { state: {} });
+
+      const confirmButton = screen.getByTestId(
+        MusdMaxConversionInfoTestIds.CONFIRM_BUTTON,
+      );
+      expect(confirmButton.props.disabled).toBe(true);
+    });
+
+    it('disables confirm button when alerts contain isBlocking entry', () => {
+      mockUseAlerts.mockReturnValue({
+        alerts: [
+          {
+            key: 'BlockingAlert',
+            message: 'Blocked',
+            title: 'Review',
+            severity: 'danger',
+            isBlocking: true,
+          },
+        ],
+      } as ReturnType<typeof useAlerts>);
+
+      renderWithProvider(<MusdMaxConversionInfo />, { state: {} });
+
+      const confirmButton = screen.getByTestId(
+        MusdMaxConversionInfoTestIds.CONFIRM_BUTTON,
+      );
+      expect(confirmButton.props.disabled).toBe(true);
+    });
+
+    it('enables confirm button when not loading and no blocking alerts', () => {
+      renderWithProvider(<MusdMaxConversionInfo />, { state: {} });
+
+      const confirmButton = screen.getByTestId(
+        MusdMaxConversionInfoTestIds.CONFIRM_BUTTON,
+      );
+      expect(confirmButton.props.disabled).toBe(false);
+    });
+  });
+});
diff --git a/app/components/Views/confirmations/components/info/musd-max-conversion-info/musd-max-conversion-info.tsx b/app/components/Views/confirmations/components/info/musd-max-conversion-info/musd-max-conversion-info.tsx
new file mode 100644
index 000000000000..159b919aa229
--- /dev/null
+++ b/app/components/Views/confirmations/components/info/musd-max-conversion-info/musd-max-conversion-info.tsx
@@ -0,0 +1,117 @@
+import React, { useMemo } from 'react';
+import { Image, View } from 'react-native';
+import { useStyles } from '../../../../../hooks/useStyles';
+import { useParams } from '../../../../../../util/navigation/navUtils';
+import { strings } from '../../../../../../../locales/i18n';
+import Button, {
+  ButtonSize,
+  ButtonVariants,
+  ButtonWidthTypes,
+} from '../../../../../../component-library/components/Buttons/Button';
+import { useTransactionMetadataRequest } from '../../../hooks/transactions/useTransactionMetadataRequest';
+import { useIsTransactionPayLoading } from '../../../hooks/pay/useTransactionPayData';
+import { useTransactionConfirm } from '../../../hooks/transactions/useTransactionConfirm';
+import { useAlerts } from '../../../context/alert-system-context';
+import { TotalRow } from '../../rows/total-row';
+import { BridgeFeeRow } from '../../rows/bridge-fee-row';
+import { AssetType } from '../../../types/token';
+import stylesheet from './musd-max-conversion-info.styles';
+import useFiatFormatter from '../../../../../UI/SimulationDetails/FiatDisplay/useFiatFormatter';
+import { PercentageRow } from '../../rows/percentage-row';
+import { TokenConversionAssetHeader } from '../../token-conversion-asset-header';
+import { BlockingAlertMessage } from '../../alerts/blocking-alert-message';
+import { TokenConversionRateRow } from '../../rows/token-conversion-rate-row';
+import {
+  MUSD_TOKEN,
+  MUSD_TOKEN_ADDRESS,
+} from '../../../../../UI/Earn/constants/musd';
+
+/**
+ * Navigation params for MusdMaxConversionInfo
+ */
+export interface MusdMaxConversionParams {
+  token: AssetType;
+}
+
+/**
+ * Test IDs for the MusdMaxConversionInfo component.
+ */
+export const MusdMaxConversionInfoTestIds = {
+  CONTAINER: 'musd-max-conversion-info-container',
+  CONFIRM_BUTTON: 'musd-max-conversion-info-confirm-button',
+} as const;
+
+export const MusdMaxConversionInfo = () => {
+  const { styles } = useStyles(stylesheet, {});
+
+  const { token } = useParams<MusdMaxConversionParams>();
+
+  const transactionMetadata = useTransactionMetadataRequest();
+  const isQuoteLoading = useIsTransactionPayLoading();
+
+  const { onConfirm } = useTransactionConfirm();
+  const { alerts } = useAlerts();
+
+  const blockingAlert = alerts.find(
+    (confirmationAlert) => confirmationAlert.isBlocking,
+  );
+
+  const formatFiat = useFiatFormatter();
+
+  const isLoading = !transactionMetadata || isQuoteLoading;
+
+  const isConfirmDisabled = isLoading || Boolean(blockingAlert);
+
+  const buttonLabel = useMemo(
+    () => blockingAlert?.title ?? strings('earn.musd_conversion.convert'),
+    [blockingAlert],
+  );
+
+  const outputToken = useMemo((): AssetType => {
+    const imageUri =
+      Image.resolveAssetSource(MUSD_TOKEN.imageSource)?.uri ?? '';
+
+    return {
+      address: MUSD_TOKEN_ADDRESS,
+      symbol: MUSD_TOKEN.symbol,
+      name: MUSD_TOKEN.name,
+      decimals: MUSD_TOKEN.decimals,
+      image: imageUri,
+      balance: '0',
+      logo: imageUri,
+      isETH: false,
+      chainId: token.chainId,
+    };
+  }, [token.chainId]);
+
+  return (
+    <View
+      style={styles.container}
+      testID={MusdMaxConversionInfoTestIds.CONTAINER}
+    >
+      <TokenConversionAssetHeader
+        inputToken={token}
+        outputToken={outputToken}
+        formatFiat={formatFiat}
+      />
+      <View style={styles.detailsSection}>
+        <TokenConversionRateRow />
+        <BridgeFeeRow />
+        <TotalRow />
+        <PercentageRow />
+      </View>
+      <BlockingAlertMessage />
+      <View style={styles.buttonContainer}>
+        <Button
+          onPress={onConfirm}
+          label={buttonLabel}
+          variant={ButtonVariants.Primary}
+          width={ButtonWidthTypes.Full}
+          size={ButtonSize.Lg}
+          isDisabled={isConfirmDisabled}
+          testID={MusdMaxConversionInfoTestIds.CONFIRM_BUTTON}
+        />
+      </View>
+    </View>
+  );
+};
diff --git a/app/components/Views/confirmations/components/info/predict-withdraw-info/predict-withdraw-info.test.tsx b/app/components/Views/confirmations/components/info/predict-withdraw-info/predict-withdraw-info.test.tsx
new file mode 100644
index 000000000000..cfea91e4c926
--- /dev/null
+++ b/app/components/Views/confirmations/components/info/predict-withdraw-info/predict-withdraw-info.test.tsx
@@ -0,0 +1,40 @@
+import React from 'react';
+import { render } from '@testing-library/react-native';
+import { PredictWithdrawInfo } from './predict-withdraw-info';
+import { useTransactionPayWithdraw } from '../../../hooks/pay/useTransactionPayWithdraw';
+import { CustomAmountInfo } from '../custom-amount-info';
+
+jest.mock('../../../hooks/pay/useTransactionPayWithdraw');
+jest.mock('../../../hooks/ui/useNavbar');
+jest.mock('../../../hooks/tokens/useAddToken');
+jest.mock('../custom-amount-info', () => ({
+  CustomAmountInfo: jest.fn(() => null),
+}));
+jest.mock(
+  '../../predict-confirmations/predict-withdraw-balance/predict-withdraw-balance',
+  () => ({
+    PredictWithdrawBalance: () => null,
+  }),
+);
+
+describe('PredictWithdrawInfo', () => {
+  const useTransactionPayWithdrawMock = jest.mocked(useTransactionPayWithdraw);
+  const CustomAmountInfoMock = jest.mocked(CustomAmountInfo);
+
+  beforeEach(() => {
+    jest.clearAllMocks();
+    useTransactionPayWithdrawMock.mockReturnValue({
+      isWithdraw: true,
+      canSelectWithdrawToken: true,
+    });
+  });
+
+  it('does not pass hasMax to CustomAmountInfo', () => {
+    render(<PredictWithdrawInfo />);
+
+    expect(CustomAmountInfoMock).toHaveBeenCalledWith(
+      expect.not.objectContaining({ hasMax: true }),
+      expect.anything(),
+    );
+  });
+});
diff --git a/app/components/Views/confirmations/components/info/predict-withdraw-info/predict-withdraw-info.tsx b/app/components/Views/confirmations/components/info/predict-withdraw-info/predict-withdraw-info.tsx
index 211ef4d1ff66..9fb7c6d30c35 100644
--- a/app/components/Views/confirmations/components/info/predict-withdraw-info/predict-withdraw-info.tsx
+++ b/app/components/Views/confirmations/components/info/predict-withdraw-info/predict-withdraw-info.tsx
@@ -23,7 +23,6 @@ export function PredictWithdrawInfo() {
 
   return (
     <CustomAmountInfo
-      hasMax
       currency={PREDICT_CURRENCY}
       disablePay={!canSelectWithdrawToken}
     >
diff --git a/app/components/Views/confirmations/components/info/typed-sign-v3v4/simulation/components/value-display/value-display.test.tsx b/app/components/Views/confirmations/components/info/typed-sign-v3v4/simulation/components/value-display/value-display.test.tsx
index e42f5ef3a3fc..aeab8ccf340b 100644
--- a/app/components/Views/confirmations/components/info/typed-sign-v3v4/simulation/components/value-display/value-display.test.tsx
+++ b/app/components/Views/confirmations/components/info/typed-sign-v3v4/simulation/components/value-display/value-display.test.tsx
@@ -9,6 +9,7 @@ import { getTokenDetails } from '../../../../../../../../../util/address';
 import { backgroundState } from '../../../../../../../../../util/test/initial-root-state';
 import renderWithProvider from '../../../../../../../../../util/test/renderWithProvider';
 import { useAnalytics } from '../../../../../../../../hooks/useAnalytics/useAnalytics';
+import { createMockUseAnalyticsHook } from '../../../../../../../../../util/test/analyticsMock';
 
 const mockInitialState = {
   engine: {
@@ -41,26 +42,11 @@ jest.mock('../../../../../../../../../util/address', () => ({
 
 describe('SimulationValueDisplay', () => {
   beforeEach(() => {
-    (useAnalytics as jest.MockedFn<typeof useAnalytics>).mockReturnValue({
-      trackEvent: mockTrackEvent,
-      createEventBuilder: jest.fn(() => ({
-        addProperties: jest.fn().mockReturnThis(),
-        addSensitiveProperties: jest.fn().mockReturnThis(),
-        removeProperties: jest.fn().mockReturnThis(),
-        removeSensitiveProperties: jest.fn().mockReturnThis(),
-        setSaveDataRecording: jest.fn().mockReturnThis(),
-        build: jest.fn(),
-      })),
-      enable: jest.fn(),
-      addTraitsToUser: jest.fn(),
-      createDataDeletionTask: jest.fn(),
-      checkDataDeleteStatus: jest.fn(),
-      getDeleteRegulationCreationDate: jest.fn(),
-      getDeleteRegulationId: jest.fn(),
-      isDataRecorded: jest.fn(),
-      isEnabled: jest.fn(),
-      getAnalyticsId: jest.fn(),
-    });
+    jest
+      .mocked(useAnalytics)
+      .mockReturnValue(
+        createMockUseAnalyticsHook({ trackEvent: mockTrackEvent }),
+      );
   });
 
   afterEach(() => {
diff --git a/app/components/Views/confirmations/components/modals/cancel-speedup-modal/cancel-speedup-modal.styles.ts b/app/components/Views/confirmations/components/modals/cancel-speedup-modal/cancel-speedup-modal.styles.ts
new file mode 100644
index 000000000000..e60ce01ff380
--- /dev/null
+++ b/app/components/Views/confirmations/components/modals/cancel-speedup-modal/cancel-speedup-modal.styles.ts
@@ -0,0 +1,17 @@
+import { StyleSheet } from 'react-native';
+import { Theme } from '../../../../../../util/theme/models';
+
+const styleSheet = (params: { theme: Theme }) => {
+  const { theme } = params;
+
+  return StyleSheet.create({
+    bottomSheetDialogSheet: {
+      backgroundColor: theme.colors.background.alternative,
+    },
+    flatContainer: {
+      backgroundColor: theme.colors.background.alternative,
+    },
+  });
+};
+
+export default styleSheet;
diff --git a/app/components/Views/confirmations/components/modals/cancel-speedup-modal/cancel-speedup-modal.test.tsx b/app/components/Views/confirmations/components/modals/cancel-speedup-modal/cancel-speedup-modal.test.tsx
new file mode 100644
index 000000000000..9f198569a5a4
--- /dev/null
+++ b/app/components/Views/confirmations/components/modals/cancel-speedup-modal/cancel-speedup-modal.test.tsx
@@ -0,0 +1,223 @@
+import React from 'react';
+import { fireEvent, waitFor } from '@testing-library/react-native';
+import { TransactionMeta } from '@metamask/transaction-controller';
+import renderWithProvider from '../../../../../../util/test/renderWithProvider';
+import { CancelSpeedupModal } from './cancel-speedup-modal';
+import { backgroundState } from '../../../../../../util/test/initial-root-state';
+import { useCancelSpeedupGas } from '../../../hooks/gas/useCancelSpeedupGas';
+
+jest.mock('react-native-modal', () => {
+  const RN = jest.requireActual<typeof import('react')>('react');
+  return {
+    __esModule: true,
+    default: ({
+      children,
+      isVisible,
+    }: {
+      children: React.ReactNode;
+      isVisible: boolean;
+    }) => (isVisible ? RN.createElement(RN.Fragment, null, children) : null),
+  };
+});
+
+jest.mock('../../../../../UI/NetworkAssetLogo', () => ({
+  __esModule: true,
+  default: function MockNetworkAssetLogo() {
+    return null;
+  },
+}));
+
+jest.mock(
+  '../../../../../../component-library/components/BottomSheets/BottomSheet',
+  () => {
+    const RN = jest.requireActual<typeof import('react')>('react');
+    return {
+      __esModule: true,
+      default: RN.forwardRef(
+        (
+          props: { children: React.ReactNode },
+          ref: React.Ref<{
+            onCloseBottomSheet: (cb?: () => void) => void;
+            onOpenBottomSheet: (cb?: () => void) => void;
+          }>,
+        ) => {
+          RN.useImperativeHandle(ref, () => ({
+            onCloseBottomSheet: (callback?: () => void | Promise<void>) => {
+              Promise.resolve(callback?.()).catch(() => {
+                // Ignore errors from callback
+              });
+            },
+            onOpenBottomSheet: () => undefined,
+          }));
+          return RN.createElement(RN.Fragment, null, props.children);
+        },
+      ),
+    };
+  },
+);
+
+const defaultGasValues = {
+  paramsForController: {
+    maxFeePerGas: '0x1',
+    maxPriorityFeePerGas: '0x1',
+  },
+  networkFeeDisplay: '0.001 ETH',
+  networkFeeNative: '0.001',
+  networkFeeFiat: '$1.80',
+  nativeTokenSymbol: 'ETH',
+};
+
+jest.mock('../../../hooks/gas/useCancelSpeedupGas', () => ({
+  useCancelSpeedupGas: jest.fn(),
+}));
+
+jest.mock('../../gas/gas-speed', () => {
+  const RN = jest.requireActual<typeof import('react')>('react');
+  const { Text } =
+    jest.requireActual<typeof import('react-native')>('react-native');
+  return {
+    GasSpeed: ({ transactionId }: { transactionId?: string | null }) =>
+      transactionId ? RN.createElement(Text, null, 'Market ~ 15 sec') : null,
+  };
+});
+
+const mockedUseCancelSpeedupGas = jest.mocked(useCancelSpeedupGas);
+
+const baseState = {
+  engine: {
+    backgroundState: {
+      ...backgroundState,
+      PreferencesController: {
+        ...backgroundState.PreferencesController,
+        privacyMode: false,
+      },
+    },
+  },
+};
+
+describe('CancelSpeedupModal', () => {
+  const mockOnConfirm = jest.fn();
+  const mockOnClose = jest.fn();
+
+  const defaultProps = {
+    isVisible: true,
+    isCancel: false,
+    tx: {
+      id: 'tx-1',
+      chainId: '0x1',
+      txParams: { gas: '0x5208' },
+    } as unknown as TransactionMeta,
+    onConfirm: mockOnConfirm,
+    onClose: mockOnClose,
+    confirmDisabled: false,
+  };
+
+  beforeEach(() => {
+    jest.clearAllMocks();
+    mockedUseCancelSpeedupGas.mockReturnValue(defaultGasValues);
+  });
+
+  it('renders speed up modal with correct content', () => {
+    const { getByText } = renderWithProvider(
+      <CancelSpeedupModal {...defaultProps} />,
+      { state: baseState },
+    );
+
+    expect(getByText('Speed up Transaction')).toBeOnTheScreen();
+    expect(
+      getByText('This network fee will replace the original.'),
+    ).toBeOnTheScreen();
+    expect(getByText('Network fee')).toBeOnTheScreen();
+    expect(getByText('Speed')).toBeOnTheScreen();
+    expect(getByText('ETH')).toBeOnTheScreen();
+    expect(getByText('$1.80')).toBeOnTheScreen();
+    expect(getByText('Market ~ 15 sec')).toBeOnTheScreen();
+    expect(getByText('Confirm')).toBeOnTheScreen();
+  });
+
+  it('renders cancel modal with correct content', () => {
+    const { getByText } = renderWithProvider(
+      <CancelSpeedupModal {...defaultProps} isCancel />,
+      { state: baseState },
+    );
+
+    expect(getByText('Cancel Transaction')).toBeOnTheScreen();
+    expect(
+      getByText(
+        'This transaction will be canceled and this network fee will replace the original.',
+      ),
+    ).toBeOnTheScreen();
+  });
+
+  it('does not render fiat value when null', () => {
+    mockedUseCancelSpeedupGas.mockReturnValue({
+      ...defaultGasValues,
+      networkFeeFiat: null,
+    });
+
+    const { queryByText } = renderWithProvider(
+      <CancelSpeedupModal {...defaultProps} />,
+      { state: baseState },
+    );
+
+    expect(queryByText('$1.80')).toBeNull();
+  });
+
+  it('calls onConfirm with correct params when Confirm is pressed', async () => {
+    const { getByText } = renderWithProvider(
+      <CancelSpeedupModal {...defaultProps} />,
+      { state: baseState },
+    );
+
+    fireEvent.press(getByText('Confirm'));
+
+    await waitFor(() => {
+      expect(mockOnConfirm).toHaveBeenCalledWith({
+        maxFeePerGas: '0x1',
+        maxPriorityFeePerGas: '0x1',
+      });
+    });
+  });
+
+  it('does not call onConfirm when button is disabled', () => {
+    const { getByText } = renderWithProvider(
+      <CancelSpeedupModal {...defaultProps} confirmDisabled />,
+      { state: baseState },
+    );
+
+    fireEvent.press(getByText('Confirm'));
+
+    expect(mockOnConfirm).not.toHaveBeenCalled();
+  });
+
+  it('passes correct props to useCancelSpeedupGas hook', () => {
+    renderWithProvider(<CancelSpeedupModal {...defaultProps} />, {
+      state: baseState,
+    });
+
+    expect(mockedUseCancelSpeedupGas).toHaveBeenCalledWith({
+      tx: defaultProps.tx,
+      isCancel: false,
+    });
+  });
+
+  it('handles null tx gracefully', () => {
+    const { getByText } = renderWithProvider(
+      <CancelSpeedupModal {...defaultProps} tx={null} />,
+      { state: baseState },
+    );
+
+    expect(getByText('Speed up Transaction')).toBeOnTheScreen();
+    expect(getByText('Network fee')).toBeOnTheScreen();
+  });
+
+  it('does not render when isVisible is false', () => {
+    const { queryByText } = renderWithProvider(
+      <CancelSpeedupModal {...defaultProps} isVisible={false} />,
+      { state: baseState },
+    );
+
+    expect(queryByText('Speed up Transaction')).toBeNull();
+    expect(queryByText('Network fee')).toBeNull();
+  });
+});
diff --git a/app/components/Views/confirmations/components/modals/cancel-speedup-modal/cancel-speedup-modal.tsx b/app/components/Views/confirmations/components/modals/cancel-speedup-modal/cancel-speedup-modal.tsx
new file mode 100644
index 000000000000..071622674699
--- /dev/null
+++ b/app/components/Views/confirmations/components/modals/cancel-speedup-modal/cancel-speedup-modal.tsx
@@ -0,0 +1,217 @@
+import React, { useCallback, useRef } from 'react';
+import { ScrollView, StyleSheet } from 'react-native';
+import Modal from 'react-native-modal';
+import type {
+  FeeMarketEIP1559Values,
+  GasPriceValue,
+  TransactionMeta,
+} from '@metamask/transaction-controller';
+import { Hex } from '@metamask/utils';
+import { useTailwind } from '@metamask/design-system-twrnc-preset';
+import { strings } from '../../../../../../../locales/i18n';
+import { useTheme } from '../../../../../../util/theme';
+import BottomSheet, {
+  BottomSheetRef,
+} from '../../../../../../component-library/components/BottomSheets/BottomSheet';
+import BottomSheetFooter from '../../../../../../component-library/components/BottomSheets/BottomSheetFooter';
+import { ButtonsAlignment } from '../../../../../../component-library/components/BottomSheets/BottomSheetFooter/BottomSheetFooter.types';
+import {
+  ButtonSize,
+  ButtonVariants,
+} from '../../../../../../component-library/components/Buttons/Button';
+import HeaderCompactStandard from '../../../../../../component-library/components-temp/HeaderCompactStandard';
+import Text, {
+  TextColor,
+  TextVariant,
+} from '../../../../../../component-library/components/Texts/Text';
+import { Box } from '../../../../../../components/UI/Box/Box';
+import {
+  AlignItems,
+  FlexDirection,
+} from '../../../../../../components/UI/Box/box.types';
+import { useCancelSpeedupGas } from '../../../hooks/gas/useCancelSpeedupGas';
+import { GasSpeed } from '../../gas/gas-speed';
+import NetworkAssetLogo from '../../../../../UI/NetworkAssetLogo';
+import InfoSection from '../../UI/info-row/info-section';
+import InfoRow from '../../UI/info-row/info-row';
+import styleSheet from './cancel-speedup-modal.styles';
+import { useStyles } from '../../../../../hooks/useStyles';
+
+const NetworkFeeRow = ({
+  fiat,
+  native,
+  symbol,
+  chainId,
+}: {
+  fiat: string | null;
+  native: string;
+  symbol: string;
+  chainId: Hex;
+}) => {
+  const tw = useTailwind();
+  return (
+    <InfoRow label={strings('transactions.network_fee')}>
+      <Box
+        flexDirection={FlexDirection.Row}
+        alignItems={AlignItems.center}
+        gap={3}
+        style={tw.style('flex-wrap')}
+      >
+        {fiat ? (
+          <Text variant={TextVariant.BodyMD}>{fiat}</Text>
+        ) : (
+          <Text variant={TextVariant.BodyMD}>{native}</Text>
+        )}
+        <Box
+          flexDirection={FlexDirection.Row}
+          alignItems={AlignItems.center}
+          gap={3}
+        >
+          <NetworkAssetLogo
+            chainId={chainId}
+            ticker={symbol}
+            big={false}
+            biggest={false}
+            style={tw.style('rounded-full w-5 h-5')}
+            testID="cancel-speedup-network-fee-logo"
+          />
+          <Text variant={TextVariant.BodyMD}>{symbol}</Text>
+        </Box>
+      </Box>
+    </InfoRow>
+  );
+};
+
+const SpeedRow = ({ transactionId }: { transactionId?: string }) => (
+  <InfoRow label={strings('transactions.gas_modal.speed')}>
+    <GasSpeed transactionId={transactionId} />
+  </InfoRow>
+);
+
+const Description = ({ text }: { text: string }) => {
+  const tw = useTailwind();
+  return (
+    <Text
+      variant={TextVariant.BodySM}
+      color={TextColor.Alternative}
+      style={tw.style('mt-2 pb-3')}
+    >
+      {text}
+    </Text>
+  );
+};
+
+export interface CancelSpeedupModalProps {
+  isVisible: boolean;
+  isCancel: boolean;
+  tx: TransactionMeta | null;
+  onConfirm: (
+    params: GasPriceValue | FeeMarketEIP1559Values | undefined,
+  ) => void;
+  onClose: () => void;
+  confirmDisabled?: boolean;
+}
+
+const modalStyle = StyleSheet.create({
+  bottom: {
+    justifyContent: 'flex-end',
+    margin: 0,
+  },
+});
+
+export function CancelSpeedupModal({
+  isVisible,
+  isCancel,
+  tx,
+  onConfirm,
+  onClose,
+  confirmDisabled = false,
+}: CancelSpeedupModalProps) {
+  const bottomSheetRef = useRef<BottomSheetRef>(null);
+  const tw = useTailwind();
+  const { styles } = useStyles(styleSheet, {});
+  const { colors } = useTheme();
+
+  const {
+    paramsForController,
+    networkFeeNative,
+    networkFeeFiat,
+    nativeTokenSymbol,
+  } = useCancelSpeedupGas({ tx, isCancel });
+
+  const close = useCallback(() => {
+    bottomSheetRef.current?.onCloseBottomSheet(() => {
+      onClose();
+    });
+  }, [onClose]);
+
+  const handleConfirm = useCallback(() => {
+    if (confirmDisabled) return;
+    onConfirm(paramsForController);
+  }, [onConfirm, paramsForController, confirmDisabled]);
+
+  const title = isCancel
+    ? strings('transaction.cancel_speedup_cancel_title')
+    : strings('transaction.cancel_speedup_speedup_title');
+  const description = isCancel
+    ? strings('transaction.cancel_speedup_cancel_message')
+    : strings('transaction.cancel_speedup_speedup_message');
+
+  const chainId = (tx?.chainId ?? '') as Hex;
+
+  const buttons = [
+    {
+      variant: ButtonVariants.Primary,
+      label: strings('transaction.confirm'),
+      size: ButtonSize.Lg,
+      onPress: handleConfirm,
+      isDisabled: confirmDisabled,
+    },
+  ];
+
+  return (
+    <Modal
+      isVisible={isVisible}
+      animationIn="slideInUp"
+      animationOut="slideOutDown"
+      style={modalStyle.bottom}
+      backdropColor={colors.overlay.default}
+      backdropOpacity={1}
+      useNativeDriver
+      onBackdropPress={onClose}
+      onBackButtonPress={onClose}
+      onSwipeComplete={onClose}
+      swipeDirection="down"
+      propagateSwipe
+    >
+      <BottomSheet
+        ref={bottomSheetRef}
+        shouldNavigateBack={false}
+        style={styles.bottomSheetDialogSheet}
+      >
+        <HeaderCompactStandard title={title} onClose={close} />
+        <Box style={tw.style('px-3')}>
+          <ScrollView>
+            <Box gap={4}>
+              <InfoSection>
+                <NetworkFeeRow
+                  fiat={networkFeeFiat}
+                  native={networkFeeNative}
+                  symbol={nativeTokenSymbol}
+                  chainId={chainId}
+                />
+                <SpeedRow transactionId={tx?.id} />
+              </InfoSection>
+              <Description text={description} />
+            </Box>
+          </ScrollView>
+          <BottomSheetFooter
+            buttonsAlignment={ButtonsAlignment.Vertical}
+            buttonPropsArray={buttons}
+            style={tw.style('px-0')}
+          />
+        </Box>
+      </BottomSheet>
+    </Modal>
+  );
+}
diff --git a/app/components/Views/confirmations/components/modals/cancel-speedup-modal/index.ts b/app/components/Views/confirmations/components/modals/cancel-speedup-modal/index.ts
new file mode 100644
index 000000000000..acd8b4096148
--- /dev/null
+++ b/app/components/Views/confirmations/components/modals/cancel-speedup-modal/index.ts
@@ -0,0 +1,2 @@
+export { CancelSpeedupModal } from './cancel-speedup-modal';
+export type { CancelSpeedupModalProps } from './cancel-speedup-modal';
diff --git a/app/components/Views/confirmations/components/modals/switch-account-type-modal/switch-account-type-modal.test.tsx b/app/components/Views/confirmations/components/modals/switch-account-type-modal/switch-account-type-modal.test.tsx
index 46dcd75f77ea..39a9fcc5f5c3 100644
--- a/app/components/Views/confirmations/components/modals/switch-account-type-modal/switch-account-type-modal.test.tsx
+++ b/app/components/Views/confirmations/components/modals/switch-account-type-modal/switch-account-type-modal.test.tsx
@@ -40,15 +40,20 @@ const MOCK_NETWORK = {
 const mockGoBack = jest.fn();
 jest.mock('@react-navigation/native', () => ({
   ...jest.requireActual('@react-navigation/native'),
-  useRoute: jest.fn().mockReturnValue({
-    params: { address: '0x935e73edb9ff52e23bac7f7e043a1ecd06d05477' },
-  }),
   useNavigation: () => ({
     navigate: jest.fn(),
     goBack: mockGoBack,
   }),
 }));
 
+const createMockRoute = (
+  address = '0x935e73edb9ff52e23bac7f7e043a1ecd06d05477',
+) => ({
+  params: { address: address as `0x${string}` },
+  key: 'ConfirmationSwitchAccountType',
+  name: 'ConfirmationSwitchAccountType' as const,
+});
+
 jest.mock('react-native-safe-area-context', () => {
   const inset = { top: 0, right: 0, bottom: 0, left: 0 };
   const frame = { width: 0, height: 0, x: 0, y: 0 };
@@ -81,52 +86,224 @@ const MOCK_STATE = {
   },
 } as unknown as RootState;
 
+const MOCK_NETWORK_MAINNET = {
+  chainId: '0x1',
+  delegationAddress: '0x1234567890abcdef1234567890abcdef12345678',
+  isSupported: true,
+  upgradeContractAddress: '0x1234567890abcdef1234567890abcdef12345678',
+  blockExplorerUrls: [],
+  defaultRpcEndpointIndex: 0,
+  name: 'Ethereum Mainnet',
+  nativeCurrency: 'ETH',
+  rpcEndpoints: [
+    {
+      failoverUrls: [],
+      networkClientId: 'mainnet',
+      type: 'infura',
+      url: 'https://mainnet.infura.io/v3/{infuraProjectId}',
+    },
+  ],
+} as unknown as EIP7702NetworkConfiguration;
+
 describe('Switch Account Type Modal', () => {
-  it('displays information correctly', () => {
-    jest.spyOn(Networks7702, 'useEIP7702Networks').mockReturnValue({
-      pending: false,
-      network7702List: [MOCK_NETWORK],
-      networkSupporting7702Present: true,
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  describe('rendering', () => {
+    it('displays account info and network details correctly', () => {
+      jest.spyOn(Networks7702, 'useEIP7702Networks').mockReturnValue({
+        pending: false,
+        network7702List: [MOCK_NETWORK],
+        networkSupporting7702Present: true,
+      });
+
+      const { getByText } = renderWithProvider(
+        <SwitchAccountTypeModal route={createMockRoute()} />,
+        { state: MOCK_STATE },
+      );
+      expect(getByText('Account 1')).toBeOnTheScreen();
+      expect(getByText('Sepolia')).toBeOnTheScreen();
+      expect(getByText('Smart account')).toBeOnTheScreen();
+      expect(getByText('Switch back')).toBeOnTheScreen();
+    });
+
+    it('renders empty state when network7702List is empty', () => {
+      jest.spyOn(Networks7702, 'useEIP7702Networks').mockReturnValue({
+        pending: false,
+        network7702List: [],
+        networkSupporting7702Present: false,
+      });
+
+      const { getByText, queryByText } = renderWithProvider(
+        <SwitchAccountTypeModal route={createMockRoute()} />,
+        { state: MOCK_STATE },
+      );
+
+      // Account info should still be displayed
+      expect(getByText('Account 1')).toBeOnTheScreen();
+      // But no network rows should be present
+      expect(queryByText('Sepolia')).toBeNull();
+      expect(queryByText('Smart account')).toBeNull();
     });
 
-    const { getByText } = renderWithProvider(<SwitchAccountTypeModal />, {
-      state: MOCK_STATE,
+    it('renders multiple network rows when multiple networks are present', () => {
+      jest.spyOn(Networks7702, 'useEIP7702Networks').mockReturnValue({
+        pending: false,
+        network7702List: [MOCK_NETWORK, MOCK_NETWORK_MAINNET],
+        networkSupporting7702Present: true,
+      });
+
+      const { getByText } = renderWithProvider(
+        <SwitchAccountTypeModal route={createMockRoute()} />,
+        { state: MOCK_STATE },
+      );
+
+      expect(getByText('Account 1')).toBeOnTheScreen();
+      expect(getByText('Sepolia')).toBeOnTheScreen();
+      expect(getByText('Ethereum Mainnet')).toBeOnTheScreen();
+    });
+
+    it('displays spinner when network list is loading', () => {
+      jest.spyOn(Networks7702, 'useEIP7702Networks').mockReturnValue({
+        pending: true,
+        network7702List: [],
+        networkSupporting7702Present: false,
+      });
+
+      const { getByTestId, queryByText } = renderWithProvider(
+        <SwitchAccountTypeModal route={createMockRoute()} />,
+        { state: MOCK_STATE },
+      );
+
+      expect(queryByText('Account 1')).toBeNull();
+      expect(queryByText('Sepolia')).toBeNull();
+      expect(queryByText('Smart account')).toBeNull();
+      expect(queryByText('Switch')).toBeNull();
+      expect(getByTestId('network-data-loader')).toBeOnTheScreen();
     });
-    expect(getByText('Account 1')).toBeTruthy();
-    expect(getByText('Sepolia')).toBeTruthy();
-    expect(getByText('Smart account')).toBeTruthy();
-    expect(getByText('Switch back')).toBeTruthy();
   });
 
-  it('displays spinner when network list is loading', () => {
-    jest.spyOn(Networks7702, 'useEIP7702Networks').mockReturnValue({
-      pending: true,
-      network7702List: [],
-      networkSupporting7702Present: false,
+  describe('route params handling', () => {
+    it('uses address from route params when provided', () => {
+      jest.spyOn(Networks7702, 'useEIP7702Networks').mockReturnValue({
+        pending: false,
+        network7702List: [MOCK_NETWORK],
+        networkSupporting7702Present: true,
+      });
+
+      const { getByText } = renderWithProvider(
+        <SwitchAccountTypeModal route={createMockRoute()} />,
+        { state: MOCK_STATE },
+      );
+
+      // Should render the account that matches the address
+      expect(getByText('Account 1')).toBeOnTheScreen();
+    });
+
+    it('does not display account name when address does not match any account', () => {
+      const unknownAddress = '0x0000000000000000000000000000000000000001';
+      jest.spyOn(Networks7702, 'useEIP7702Networks').mockReturnValue({
+        pending: false,
+        network7702List: [MOCK_NETWORK],
+        networkSupporting7702Present: true,
+      });
+
+      const { queryByText } = renderWithProvider(
+        <SwitchAccountTypeModal route={createMockRoute(unknownAddress)} />,
+        { state: MOCK_STATE },
+      );
+
+      // Account name should not be displayed since address doesn't match any account
+      expect(queryByText('Account 1')).toBeNull();
     });
 
-    const container = renderWithProvider(<SwitchAccountTypeModal />, {
-      state: MOCK_STATE,
+    it('displays fallback when no address is available from route or selected account', () => {
+      jest.spyOn(Networks7702, 'useEIP7702Networks').mockReturnValue({
+        pending: false,
+        network7702List: [],
+        networkSupporting7702Present: false,
+      });
+
+      // Create route with undefined address param
+      const routeWithNoAddress = {
+        params: { address: undefined },
+        key: 'ConfirmationSwitchAccountType',
+        name: 'ConfirmationSwitchAccountType' as const,
+      };
+
+      const { getByTestId, getByText, queryByTestId } = renderWithProvider(
+        <SwitchAccountTypeModal
+          route={
+            routeWithNoAddress as unknown as ReturnType<typeof createMockRoute>
+          }
+        />,
+        { state: MOCK_STATE },
+      );
+
+      // Should render fallback UI
+      expect(getByTestId('no-address-fallback')).toBeOnTheScreen();
+      expect(getByText('No account selected')).toBeOnTheScreen();
+      // Should not render the normal content
+      expect(queryByTestId('network-data-loader')).toBeNull();
     });
-    const { getByTestId, queryByText } = container;
-    expect(queryByText('Account 1')).toBeNull();
-    expect(queryByText('Sepolia')).toBeNull();
-    expect(queryByText('Smart account')).toBeNull();
-    expect(queryByText('Switch')).toBeNull();
-    expect(getByTestId('network-data-loader')).toBeTruthy();
   });
 
-  it('navigates back when back button is clicked', () => {
-    jest.spyOn(Networks7702, 'useEIP7702Networks').mockReturnValue({
-      pending: false,
-      network7702List: [MOCK_NETWORK],
-      networkSupporting7702Present: true,
+  describe('navigation', () => {
+    it('navigates back when back button is pressed', () => {
+      jest.spyOn(Networks7702, 'useEIP7702Networks').mockReturnValue({
+        pending: false,
+        network7702List: [MOCK_NETWORK],
+        networkSupporting7702Present: true,
+      });
+
+      const { getByTestId } = renderWithProvider(
+        <SwitchAccountTypeModal route={createMockRoute()} />,
+        { state: MOCK_STATE },
+      );
+
+      fireEvent.press(getByTestId('switch-account-goback'));
+
+      expect(mockGoBack).toHaveBeenCalledTimes(1);
     });
 
-    const { getByTestId } = renderWithProvider(<SwitchAccountTypeModal />, {
-      state: MOCK_STATE,
+    it('calls goBack only once per button press', () => {
+      jest.spyOn(Networks7702, 'useEIP7702Networks').mockReturnValue({
+        pending: false,
+        network7702List: [MOCK_NETWORK],
+        networkSupporting7702Present: true,
+      });
+
+      const { getByTestId } = renderWithProvider(
+        <SwitchAccountTypeModal route={createMockRoute()} />,
+        { state: MOCK_STATE },
+      );
+
+      const backButton = getByTestId('switch-account-goback');
+      fireEvent.press(backButton);
+      fireEvent.press(backButton);
+
+      expect(mockGoBack).toHaveBeenCalledTimes(2);
+    });
+  });
+
+  describe('hook integration', () => {
+    it('passes correct address to useEIP7702Networks hook', () => {
+      const mockUseEIP7702Networks = jest
+        .spyOn(Networks7702, 'useEIP7702Networks')
+        .mockReturnValue({
+          pending: false,
+          network7702List: [MOCK_NETWORK],
+          networkSupporting7702Present: true,
+        });
+
+      const testAddress = '0x935e73edb9ff52e23bac7f7e043a1ecd06d05477';
+      renderWithProvider(
+        <SwitchAccountTypeModal route={createMockRoute(testAddress)} />,
+        { state: MOCK_STATE },
+      );
+
+      expect(mockUseEIP7702Networks).toHaveBeenCalledWith(testAddress);
     });
-    fireEvent.press(getByTestId('switch-account-goback'));
-    expect(mockGoBack).toHaveBeenCalled();
   });
 });
diff --git a/app/components/Views/confirmations/components/modals/switch-account-type-modal/switch-account-type-modal.tsx b/app/components/Views/confirmations/components/modals/switch-account-type-modal/switch-account-type-modal.tsx
index 5b077bf258ea..9d1da28f3aa6 100644
--- a/app/components/Views/confirmations/components/modals/switch-account-type-modal/switch-account-type-modal.tsx
+++ b/app/components/Views/confirmations/components/modals/switch-account-type-modal/switch-account-type-modal.tsx
@@ -2,7 +2,7 @@ import React, { useCallback } from 'react';
 import { Hex } from '@metamask/utils';
 import { TouchableOpacity, View } from 'react-native';
 import { useSelector } from 'react-redux';
-import { useNavigation, useRoute } from '@react-navigation/native';
+import { useNavigation, RouteProp } from '@react-navigation/native';
 
 import Avatar, {
   AvatarSize,
@@ -25,14 +25,30 @@ import Icon, {
 } from '../../../../../../component-library/components/Icons/Icon';
 import Engine from '../../../../../../core/Engine';
 
-const SwitchAccountTypeModal = () => {
+interface SwitchAccountTypeModalRouteParams {
+  address?: Hex;
+}
+
+interface SwitchAccountTypeModalParamList {
+  ConfirmationSwitchAccountType: SwitchAccountTypeModalRouteParams;
+  [key: string]: object | undefined;
+}
+
+interface SwitchAccountTypeModalProps {
+  route: RouteProp<
+    SwitchAccountTypeModalParamList,
+    'ConfirmationSwitchAccountType'
+  >;
+}
+
+const SwitchAccountTypeModal = ({ route }: SwitchAccountTypeModalProps) => {
   const { styles } = useStyles(styleSheet, {});
-  const route = useRoute();
   const navigation = useNavigation();
-  const address =
-    (route?.params as { address: Hex })?.address ??
+  const selectedAccountAddress =
     Engine.context.AccountsController.getSelectedAccount()?.address;
-  const { network7702List, pending } = useEIP7702Networks(address);
+  const address: Hex | undefined =
+    route?.params?.address ?? (selectedAccountAddress as Hex | undefined);
+  const { network7702List, pending } = useEIP7702Networks(address ?? '');
   const internalAccounts = useSelector(selectInternalAccounts);
   const account = internalAccounts.find(
     ({ address: accAddress }) => accAddress === address,
@@ -42,6 +58,27 @@ const SwitchAccountTypeModal = () => {
     navigation.goBack();
   }, [navigation]);
 
+  // Handle case when no address is available
+  if (!address) {
+    return (
+      <BottomSheet>
+        <TouchableOpacity onPress={goBack} testID="switch-account-goback">
+          <Icon
+            name={IconName.ArrowLeft}
+            size={IconSize.Sm}
+            color={IconColor.Default}
+            style={styles.backIcon}
+          />
+        </TouchableOpacity>
+        <View style={styles.wrapper}>
+          <View style={styles.spinner} testID="no-address-fallback">
+            <Text variant={TextVariant.BodyMD}>No account selected</Text>
+          </View>
+        </View>
+      </BottomSheet>
+    );
+  }
+
   return (
     <BottomSheet>
       <TouchableOpacity onPress={goBack} testID="switch-account-goback">
@@ -72,6 +109,7 @@ const SwitchAccountTypeModal = () => {
             <View>
               {network7702List?.map((networkConfiguration) => (
                 <AccountNetworkRow
+                  key={networkConfiguration.chainId}
                   network={networkConfiguration}
                   address={address}
                 />
diff --git a/app/components/Views/confirmations/components/rows/percentage-row/percentage-row.test.tsx b/app/components/Views/confirmations/components/rows/percentage-row/percentage-row.test.tsx
index e7fccf6b817e..f425bc42b997 100644
--- a/app/components/Views/confirmations/components/rows/percentage-row/percentage-row.test.tsx
+++ b/app/components/Views/confirmations/components/rows/percentage-row/percentage-row.test.tsx
@@ -2,9 +2,9 @@ import React from 'react';
 import renderWithProvider from '../../../../../../util/test/renderWithProvider';
 import { PercentageRow } from './percentage-row';
 import { useIsTransactionPayLoading } from '../../../hooks/pay/useTransactionPayData';
+import { useTransactionMetadataRequest } from '../../../hooks/transactions/useTransactionMetadataRequest';
 import { strings } from '../../../../../../../locales/i18n';
 import { MUSD_CONVERSION_APY } from '../../../../../UI/Earn/constants/musd';
-import { useTransactionMetadataRequest } from '../../../hooks/transactions/useTransactionMetadataRequest';
 import { TransactionType } from '@metamask/transaction-controller';
 
 jest.mock('../../../hooks/pay/useTransactionPayData');
@@ -28,7 +28,7 @@ describe('PercentageRow', () => {
     useIsTransactionPayLoadingMock.mockReturnValue(false);
     useTransactionMetadataRequestMock.mockReturnValue({
       type: TransactionType.musdConversion,
-    } as never);
+    } as ReturnType<typeof useTransactionMetadataRequest>);
   });
 
   it('renders label, tooltip and APY when not loading', () => {
@@ -39,28 +39,6 @@ describe('PercentageRow', () => {
     expect(getByText(`${MUSD_CONVERSION_APY}%`)).toBeOnTheScreen();
   });
 
-  it('renders nothing when tx type is not supported', () => {
-    useTransactionMetadataRequestMock.mockReturnValue({
-      type: TransactionType.contractInteraction,
-    } as never);
-
-    const { queryByText, queryByTestId } = render();
-
-    expect(queryByTestId('percentage-row-skeleton')).toBeNull();
-    expect(queryByText(strings('earn.claimable_bonus'))).toBeNull();
-    expect(queryByText(`${MUSD_CONVERSION_APY}%`)).toBeNull();
-  });
-
-  it('renders nothing when transaction metadata is undefined', () => {
-    useTransactionMetadataRequestMock.mockReturnValue(undefined as never);
-
-    const { queryByText, queryByTestId } = render();
-
-    expect(queryByTestId('percentage-row-skeleton')).toBeNull();
-    expect(queryByText(strings('earn.claimable_bonus'))).toBeNull();
-    expect(queryByText(`${MUSD_CONVERSION_APY}%`)).toBeNull();
-  });
-
   it('renders skeleton when transaction pay is loading', () => {
     useIsTransactionPayLoadingMock.mockReturnValue(true);
 
@@ -68,4 +46,14 @@ describe('PercentageRow', () => {
 
     expect(getByTestId('percentage-row-skeleton')).toBeOnTheScreen();
   });
+
+  it('renders nothing for non-musdConversion transactions', () => {
+    useTransactionMetadataRequestMock.mockReturnValue({
+      type: TransactionType.simpleSend,
+    } as ReturnType<typeof useTransactionMetadataRequest>);
+
+    const { toJSON } = render();
+
+    expect(toJSON()).toBeNull();
+  });
 });
diff --git a/app/components/Views/confirmations/components/rows/percentage-row/percentage-row.tsx b/app/components/Views/confirmations/components/rows/percentage-row/percentage-row.tsx
index a0232f9d9c59..30c74e0824aa 100644
--- a/app/components/Views/confirmations/components/rows/percentage-row/percentage-row.tsx
+++ b/app/components/Views/confirmations/components/rows/percentage-row/percentage-row.tsx
@@ -1,4 +1,5 @@
 import React from 'react';
+import { StyleSheet, Linking } from 'react-native';
 import InfoRow from '../../UI/info-row';
 import { MUSD_CONVERSION_APY } from '../../../../../UI/Earn/constants/musd';
 import Text, {
@@ -8,45 +9,47 @@ import Text, {
 import { useIsTransactionPayLoading } from '../../../hooks/pay/useTransactionPayData';
 import { InfoRowSkeleton } from '../../UI/info-row/info-row';
 import { strings } from '../../../../../../../locales/i18n';
+import { IconColor } from '../../../../../../component-library/components/Icons/Icon';
+import AppConstants from '../../../../../../core/AppConstants';
 import { useTransactionMetadataRequest } from '../../../hooks/transactions/useTransactionMetadataRequest';
 import { TransactionType } from '@metamask/transaction-controller';
-import { IconColor } from '../../../../../../component-library/components/Icons/Icon';
+import { hasTransactionType } from '../../../utils/transaction';
 
-function getTxTypeRowConfig(
-  transactionType?: TransactionType,
-): { label: string; tooltip: string } | undefined {
-  if (transactionType === TransactionType.musdConversion) {
-    return {
-      label: strings('earn.claimable_bonus'),
-      tooltip: strings('earn.claimable_bonus_tooltip'),
-    };
-  }
-
-  return undefined;
-}
+const styles = StyleSheet.create({
+  termsText: {
+    textDecorationLine: 'underline',
+  },
+});
 
 export function PercentageRow() {
-  const transactionMetadata = useTransactionMetadataRequest();
-
   const isLoading = useIsTransactionPayLoading();
 
-  const transactionType = transactionMetadata?.type;
-  const rowConfig = getTxTypeRowConfig(transactionType);
+  const transactionMetadata = useTransactionMetadataRequest();
 
-  if (!rowConfig) {
+  if (
+    !hasTransactionType(transactionMetadata, [TransactionType.musdConversion])
+  ) {
     return null;
   }
 
+  const redirectToBonusFaq = () =>
+    Linking.openURL(AppConstants.URLS.MUSD_CONVERSION_BONUS_TERMS_OF_USE);
+
   if (isLoading) {
     return <InfoRowSkeleton testId="percentage-row-skeleton" />;
   }
 
-  const { label, tooltip } = rowConfig;
-
   return (
     <InfoRow
-      label={label}
-      tooltip={tooltip}
+      label={strings('earn.claimable_bonus')}
+      tooltip={
+        <Text>
+          {strings('earn.claimable_bonus_tooltip')}{' '}
+          <Text style={styles.termsText} onPress={redirectToBonusFaq}>
+            {strings('earn.musd_conversion.education.terms_apply')}
+          </Text>
+        </Text>
+      }
       tooltipColor={IconColor.Alternative}
     >
       <Text variant={TextVariant.BodyMD} color={TextColor.Success}>
diff --git a/app/components/Views/confirmations/components/rows/token-conversion-rate-row/index.ts b/app/components/Views/confirmations/components/rows/token-conversion-rate-row/index.ts
new file mode 100644
index 000000000000..32d304b383ca
--- /dev/null
+++ b/app/components/Views/confirmations/components/rows/token-conversion-rate-row/index.ts
@@ -0,0 +1 @@
+export * from './token-conversion-rate-row';
diff --git a/app/components/Views/confirmations/components/rows/token-conversion-rate-row/token-conversion-rate-row.test.tsx b/app/components/Views/confirmations/components/rows/token-conversion-rate-row/token-conversion-rate-row.test.tsx
new file mode 100644
index 000000000000..3003a9c46793
--- /dev/null
+++ b/app/components/Views/confirmations/components/rows/token-conversion-rate-row/token-conversion-rate-row.test.tsx
@@ -0,0 +1,108 @@
+import React from 'react';
+import { screen } from '@testing-library/react-native';
+import renderWithProvider from '../../../../../../util/test/renderWithProvider';
+import { TokenConversionRateRow } from './token-conversion-rate-row';
+import {
+  useIsTransactionPayLoading,
+  useTransactionPayQuotes,
+} from '../../../hooks/pay/useTransactionPayData';
+import { useTransactionPayToken } from '../../../hooks/pay/useTransactionPayToken';
+import { useTransactionMetadataRequest } from '../../../hooks/transactions/useTransactionMetadataRequest';
+import { selectSingleTokenByAddressAndChainId } from '../../../../../../selectors/tokensController';
+
+jest.mock('../../../hooks/pay/useTransactionPayData');
+jest.mock('../../../hooks/pay/useTransactionPayToken');
+jest.mock('../../../hooks/transactions/useTransactionMetadataRequest');
+jest.mock('../../../../../../selectors/tokensController');
+
+const mockUseIsTransactionPayLoading = jest.mocked(useIsTransactionPayLoading);
+const mockUseTransactionPayQuotes = jest.mocked(useTransactionPayQuotes);
+const mockUseTransactionPayToken = jest.mocked(useTransactionPayToken);
+const mockUseTransactionMetadataRequest = jest.mocked(
+  useTransactionMetadataRequest,
+);
+const mockSelectSingleTokenByAddressAndChainId = jest.mocked(
+  selectSingleTokenByAddressAndChainId,
+);
+
+describe('TokenConversionRateRow', () => {
+  beforeEach(() => {
+    mockUseTransactionMetadataRequest.mockReturnValue({
+      id: 'tx-1',
+    } as never);
+    mockUseIsTransactionPayLoading.mockReturnValue(false);
+    mockUseTransactionPayToken.mockReturnValue({
+      payToken: { symbol: 'USDC' } as never,
+      isNative: false,
+      setPayToken: jest.fn(),
+    });
+    mockUseTransactionPayQuotes.mockReturnValue([
+      {
+        sourceAmount: { usd: '10' },
+        targetAmount: { usd: '9' },
+        request: {
+          targetTokenAddress: '0x1',
+          targetChainId: '0x1',
+        },
+      },
+    ] as never);
+    mockSelectSingleTokenByAddressAndChainId.mockReturnValue({
+      symbol: 'mUSD',
+    } as never);
+  });
+
+  afterEach(() => {
+    jest.clearAllMocks();
+  });
+
+  it('renders loading skeleton when transaction metadata is unavailable', () => {
+    mockUseTransactionMetadataRequest.mockReturnValue(undefined);
+
+    renderWithProvider(<TokenConversionRateRow />, { state: {} });
+
+    expect(screen.getByTestId('rate-row-skeleton')).toBeOnTheScreen();
+    expect(screen.queryByTestId('rate-row-container')).not.toBeOnTheScreen();
+  });
+
+  it('renders loading skeleton when quote data is loading', () => {
+    mockUseIsTransactionPayLoading.mockReturnValue(true);
+
+    renderWithProvider(<TokenConversionRateRow />, { state: {} });
+
+    expect(screen.getByTestId('rate-row-skeleton')).toBeOnTheScreen();
+    expect(screen.queryByTestId('rate-row-container')).not.toBeOnTheScreen();
+  });
+
+  it('renders exchange rate text', () => {
+    renderWithProvider(<TokenConversionRateRow />, { state: {} });
+
+    expect(screen.getByTestId('rate-row-container')).toBeOnTheScreen();
+    expect(screen.queryByTestId('rate-row-skeleton')).not.toBeOnTheScreen();
+    expect(screen.getByText('1 USDC = 0.9 mUSD')).toBeOnTheScreen();
+  });
+
+  it('output token symbol falls back to mUSD when output token is not found', () => {
+    mockSelectSingleTokenByAddressAndChainId.mockReturnValue(undefined);
+
+    renderWithProvider(<TokenConversionRateRow />, { state: {} });
+
+    expect(screen.getByText('1 USDC = 0.9 mUSD')).toBeOnTheScreen();
+  });
+
+  it('renders 1 conversion rate fallback text when source amount is zero', () => {
+    mockUseTransactionPayQuotes.mockReturnValue([
+      {
+        sourceAmount: { usd: '0' },
+        targetAmount: { usd: '9' },
+        request: {
+          targetTokenAddress: '0x1',
+          targetChainId: '0x1',
+        },
+      },
+    ] as never);
+
+    renderWithProvider(<TokenConversionRateRow />, { state: {} });
+
+    expect(screen.getByText('1 USDC = 1 mUSD')).toBeOnTheScreen();
+  });
+});
diff --git a/app/components/Views/confirmations/components/rows/token-conversion-rate-row/token-conversion-rate-row.tsx b/app/components/Views/confirmations/components/rows/token-conversion-rate-row/token-conversion-rate-row.tsx
new file mode 100644
index 000000000000..821c7147c028
--- /dev/null
+++ b/app/components/Views/confirmations/components/rows/token-conversion-rate-row/token-conversion-rate-row.tsx
@@ -0,0 +1,83 @@
+import React, { useMemo } from 'react';
+import { useSelector } from 'react-redux';
+import { BigNumber } from 'bignumber.js';
+import { Hex } from '@metamask/utils';
+import InfoRow, { InfoRowSkeleton } from '../../UI/info-row/info-row';
+import Text, {
+  TextColor,
+  TextVariant,
+} from '../../../../../../component-library/components/Texts/Text';
+import { MUSD_TOKEN } from '../../../../../UI/Earn/constants/musd';
+import { strings } from '../../../../../../../locales/i18n';
+import {
+  useIsTransactionPayLoading,
+  useTransactionPayQuotes,
+} from '../../../hooks/pay/useTransactionPayData';
+import { useTransactionMetadataRequest } from '../../../hooks/transactions/useTransactionMetadataRequest';
+import { useTransactionPayToken } from '../../../hooks/pay/useTransactionPayToken';
+import { RootState } from '../../../../../../reducers';
+import { selectSingleTokenByAddressAndChainId } from '../../../../../../selectors/tokensController';
+
+const TokenConversionRateRowTestIds = {
+  CONTAINER: 'rate-row-container',
+  SKELETON: 'rate-row-skeleton',
+} as const;
+
+export function TokenConversionRateRow() {
+  const transactionMetadata = useTransactionMetadataRequest();
+  const isQuoteLoading = useIsTransactionPayLoading();
+
+  const isLoading = !transactionMetadata || isQuoteLoading;
+
+  const quotes = useTransactionPayQuotes();
+  const { payToken } = useTransactionPayToken();
+  const quote = quotes?.[0];
+  const inputTokenSymbol = payToken?.symbol;
+
+  const outputTokenAddress = quote?.request?.targetTokenAddress;
+  const outputTokenChainId = quote?.request?.targetChainId as Hex | undefined;
+  const outputToken = useSelector((state: RootState) =>
+    outputTokenAddress && outputTokenChainId
+      ? selectSingleTokenByAddressAndChainId(
+          state,
+          outputTokenAddress as Hex,
+          outputTokenChainId,
+        )
+      : undefined,
+  );
+
+  const outputTokenSymbol = outputToken?.symbol ?? MUSD_TOKEN.symbol;
+
+  const conversionRate = useMemo(() => {
+    const sourceAmountUsd = quote?.sourceAmount?.usd;
+    const targetAmountUsd = quote?.targetAmount?.usd;
+
+    if (
+      !sourceAmountUsd ||
+      !targetAmountUsd ||
+      new BigNumber(sourceAmountUsd).isZero()
+    ) {
+      return '1';
+    }
+
+    return new BigNumber(targetAmountUsd)
+      .dividedBy(sourceAmountUsd)
+      .decimalPlaces(3, BigNumber.ROUND_HALF_UP)
+      .toString(10);
+  }, [quote?.sourceAmount?.usd, quote?.targetAmount?.usd]);
+
+  if (isLoading) {
+    return <InfoRowSkeleton testId={TokenConversionRateRowTestIds.SKELETON} />;
+  }
+
+  return (
+    <InfoRow
+      label={strings('earn.musd_conversion.rate')}
+      testID={TokenConversionRateRowTestIds.CONTAINER}
+    >
+      <Text variant={TextVariant.BodyMD} color={TextColor.Alternative}>
+        {`1 ${inputTokenSymbol} = ${conversionRate} ${outputTokenSymbol}`}
+      </Text>
+    </InfoRow>
+  );
+}
diff --git a/app/components/Views/confirmations/components/rows/transactions/from-to-row/from-to-row.styles.ts b/app/components/Views/confirmations/components/rows/transactions/from-to-row/from-to-row.styles.ts
index 3fd9395c9d5d..24ed49088678 100644
--- a/app/components/Views/confirmations/components/rows/transactions/from-to-row/from-to-row.styles.ts
+++ b/app/components/Views/confirmations/components/rows/transactions/from-to-row/from-to-row.styles.ts
@@ -8,23 +8,24 @@ const styleSheet = (params: { theme: Theme }) => {
   return StyleSheet.create({
     container: {
       flexDirection: 'column',
-      paddingHorizontal: 4,
+      paddingHorizontal: 8,
     },
     row: {
-      paddingVertical: 8,
+      paddingBottom: 12,
     },
     rowSeparator: {
       borderTopWidth: StyleSheet.hairlineWidth,
       borderTopColor: theme.colors.border.muted,
+      paddingTop: 12,
+      paddingBottom: 8,
     },
     label: {
-      marginBottom: 2,
+      paddingBottom: 4,
     },
     labelRow: {
       flexDirection: 'row',
       alignItems: 'center',
       gap: 4,
-      marginBottom: 2,
       marginLeft: -8,
     },
     addressRow: {
diff --git a/app/components/Views/confirmations/components/rows/transactions/gas-fee-details-row/gas-fee-details-row.styles.ts b/app/components/Views/confirmations/components/rows/transactions/gas-fee-details-row/gas-fee-details-row.styles.ts
index 6095391e8bca..690f583f7ab6 100644
--- a/app/components/Views/confirmations/components/rows/transactions/gas-fee-details-row/gas-fee-details-row.styles.ts
+++ b/app/components/Views/confirmations/components/rows/transactions/gas-fee-details-row/gas-fee-details-row.styles.ts
@@ -51,9 +51,6 @@ const styleSheet = (params: { theme: Theme }) => {
       paddingBottom: 8,
       paddingHorizontal: 8,
     },
-    gasFeesSponsoredContainer: {
-      height: 24,
-    },
   });
 };
 
diff --git a/app/components/Views/confirmations/components/rows/transactions/gas-fee-details-row/gas-fee-details-row.tsx b/app/components/Views/confirmations/components/rows/transactions/gas-fee-details-row/gas-fee-details-row.tsx
index 7762addd01a5..909b71992909 100644
--- a/app/components/Views/confirmations/components/rows/transactions/gas-fee-details-row/gas-fee-details-row.tsx
+++ b/app/components/Views/confirmations/components/rows/transactions/gas-fee-details-row/gas-fee-details-row.tsx
@@ -46,24 +46,23 @@ import TagColored, {
   TagColor,
 } from '../../../../../../../component-library/components-temp/TagColored';
 
-const PaidByMetaMask = () => {
-  const { styles } = useStyles(styleSheet, {});
-
-  return (
-    <TagColored
-      color={TagColor.Success}
-      style={styles.gasFeesSponsoredContainer}
-    >
-      <Text
-        variant={TextVariant.BodyMD}
-        testID="paid-by-metamask"
-        color={TextColor.Success}
-      >
-        {strings('transactions.paid_by_metamask')}
-      </Text>
-    </TagColored>
-  );
-};
+const PaidByMetaMask = () => (
+  <TagColored
+    color={TagColor.Success}
+    labelProps={{
+      variant: TextVariant.BodySM,
+      style: {
+        textTransform: 'none',
+        textAlign: 'center',
+        bottom: 1,
+        fontWeight: 'normal',
+      },
+      testID: 'paid-by-metamask',
+    }}
+  >
+    {strings('transactions.paid_by_metamask')}
+  </TagColored>
+);
 
 const SkeletonEstimationInfo = () => {
   const { styles } = useStyles(styleSheet, {});
diff --git a/app/components/Views/confirmations/components/rows/transactions/hero-row/hero-row.styles.ts b/app/components/Views/confirmations/components/rows/transactions/hero-row/hero-row.styles.ts
index b53dfe388d0a..c026ae44be45 100644
--- a/app/components/Views/confirmations/components/rows/transactions/hero-row/hero-row.styles.ts
+++ b/app/components/Views/confirmations/components/rows/transactions/hero-row/hero-row.styles.ts
@@ -6,7 +6,8 @@ const styleSheet = (params: { theme: Theme }) => {
 
   return StyleSheet.create({
     wrapper: {
-      minHeight: 100,
+      paddingTop: 12,
+      paddingBottom: 16,
       justifyContent: 'center',
       alignItems: 'center',
     },
@@ -20,13 +21,13 @@ const styleSheet = (params: { theme: Theme }) => {
       borderRadius: 32,
     },
     skeletonBorderRadiusMedium: {
-      borderRadius: 6,
+      borderRadius: 4,
       marginTop: 16,
     },
     skeletonBorderRadiusSmall: {
       borderRadius: 4,
       marginTop: 8,
-      marginBottom: 14,
+      marginBottom: 12,
     },
   });
 };
diff --git a/app/components/Views/confirmations/components/rows/transactions/hero-row/hero-row.tsx b/app/components/Views/confirmations/components/rows/transactions/hero-row/hero-row.tsx
index 2fa030af2a78..8375d199622b 100644
--- a/app/components/Views/confirmations/components/rows/transactions/hero-row/hero-row.tsx
+++ b/app/components/Views/confirmations/components/rows/transactions/hero-row/hero-row.tsx
@@ -15,8 +15,8 @@ export function HeroRowSkeleton() {
   return (
     <View style={styles.wrapper}>
       <Skeleton
-        width={64}
-        height={64}
+        width={48}
+        height={48}
         style={styles.skeletonBorderRadiusLarge}
       />
       <Skeleton
diff --git a/app/components/Views/confirmations/components/send/amount/amount-keyboard/amount-keyboard.test.tsx b/app/components/Views/confirmations/components/send/amount/amount-keyboard/amount-keyboard.test.tsx
index b8a38bf58636..531bde20fef0 100644
--- a/app/components/Views/confirmations/components/send/amount/amount-keyboard/amount-keyboard.test.tsx
+++ b/app/components/Views/confirmations/components/send/amount/amount-keyboard/amount-keyboard.test.tsx
@@ -162,7 +162,7 @@ describe('Amount', () => {
     const { getByRole } = renderComponent(undefined, '');
     expect(
       getByRole('button', { name: 'Next' }).props.style.backgroundColor,
-    ).toEqual('#b7bbc8');
+    ).toEqual(mockTheme.colors.text.muted);
   });
 
   it('call updateValue with MaxMode true when Max button is pressed', () => {
@@ -225,9 +225,17 @@ describe('Amount', () => {
 
 describe('getBackgroundColor', () => {
   it('return correct color depending on amount value and error', () => {
-    expect(getBackgroundColor(mockTheme, false, false)).toEqual('#121314');
-    expect(getBackgroundColor(mockTheme, true, false)).toEqual('#ca3542');
-    expect(getBackgroundColor(mockTheme, false, true)).toEqual('#b7bbc8');
-    expect(getBackgroundColor(mockTheme, true, true)).toEqual('#ca3542');
+    expect(getBackgroundColor(mockTheme, false, false)).toEqual(
+      mockTheme.colors.text.default,
+    );
+    expect(getBackgroundColor(mockTheme, true, false)).toEqual(
+      mockTheme.colors.error.default,
+    );
+    expect(getBackgroundColor(mockTheme, false, true)).toEqual(
+      mockTheme.colors.text.muted,
+    );
+    expect(getBackgroundColor(mockTheme, true, true)).toEqual(
+      mockTheme.colors.error.default,
+    );
   });
 });
diff --git a/app/components/Views/confirmations/components/send/asset/asset.tsx b/app/components/Views/confirmations/components/send/asset/asset.tsx
index 2fd3f9eec8c1..26e7d1cd0f3b 100644
--- a/app/components/Views/confirmations/components/send/asset/asset.tsx
+++ b/app/components/Views/confirmations/components/send/asset/asset.tsx
@@ -29,6 +29,7 @@ import { useSendTokens } from '../../../hooks/send/useSendTokens';
 import { useSafeAreaInsets } from 'react-native-safe-area-context';
 import { ScrollView } from 'react-native-gesture-handler';
 import { HighlightedItem } from '../../UI/highlighted-item';
+import { TransactionPayComponentIDs } from '../../../ConfirmationView.testIds';
 
 export interface AssetProps {
   hideNfts?: boolean;
@@ -226,6 +227,7 @@ export const Asset: React.FC<AssetProps> = (props = {}) => {
         />
       )}
       <ScrollView
+        testID={TransactionPayComponentIDs.PAY_WITH_TOKEN_LIST}
         contentContainerStyle={{
           paddingBottom: bottomOffset,
         }}
diff --git a/app/components/Views/confirmations/components/title/title.test.tsx b/app/components/Views/confirmations/components/title/title.test.tsx
index 264d00bab163..b5581cd2a583 100644
--- a/app/components/Views/confirmations/components/title/title.test.tsx
+++ b/app/components/Views/confirmations/components/title/title.test.tsx
@@ -329,6 +329,28 @@ describe('Confirm Title', () => {
     expect(getByText('Bonus will be paid out on Linea Mainnet.')).toBeTruthy();
   });
 
+  it('renders max conversion title for musdMaxConversion', () => {
+    const musdMaxConversionState = merge({}, generateContractInteractionState, {
+      engine: {
+        backgroundState: {
+          TransactionController: {
+            transactions: [
+              {
+                type: TransactionType.musdConversion,
+              },
+            ],
+          },
+        },
+      },
+    });
+
+    const { getByText } = renderWithProvider(<Title />, {
+      state: musdMaxConversionState,
+    });
+
+    expect(getByText('Convert max')).toBeOnTheScreen();
+  });
+
   it.each([TransactionType.lendingDeposit, TransactionType.lendingWithdraw])(
     'does not render subtitle for %s',
     (transactionType) => {
diff --git a/app/components/Views/confirmations/components/title/title.tsx b/app/components/Views/confirmations/components/title/title.tsx
index 4e19b090386a..84f4cba80724 100644
--- a/app/components/Views/confirmations/components/title/title.tsx
+++ b/app/components/Views/confirmations/components/title/title.tsx
@@ -183,6 +183,14 @@ const getTitleAndSubTitle = (
         };
       }
 
+      if (transactionType === TransactionType.musdConversion) {
+        return {
+          title: strings(
+            'earn.musd_conversion.quick_convert.confirmation.title',
+          ),
+        };
+      }
+
       // Default to contract interaction
       const shouldHideSubTitle =
         isBatched || EARN_CONTRACT_INTERACTION_TYPES.includes(transactionType);
diff --git a/app/components/Views/confirmations/components/token-conversion-asset-header/index.ts b/app/components/Views/confirmations/components/token-conversion-asset-header/index.ts
new file mode 100644
index 000000000000..68a6dcabb7fe
--- /dev/null
+++ b/app/components/Views/confirmations/components/token-conversion-asset-header/index.ts
@@ -0,0 +1,5 @@
+export {
+  TokenConversionAssetHeader,
+  TokenConversionAssetHeaderSkeleton,
+  TokenConversionAssetHeaderTestIds,
+} from './token-conversion-asset-header';
diff --git a/app/components/Views/confirmations/components/token-conversion-asset-header/token-conversion-asset-header.styles.ts b/app/components/Views/confirmations/components/token-conversion-asset-header/token-conversion-asset-header.styles.ts
new file mode 100644
index 000000000000..07c6ec93989d
--- /dev/null
+++ b/app/components/Views/confirmations/components/token-conversion-asset-header/token-conversion-asset-header.styles.ts
@@ -0,0 +1,38 @@
+import { StyleSheet } from 'react-native';
+import { Theme } from '../../../../../util/theme/models';
+
+const styleSheet = (params: { theme: Theme }) => {
+  const { theme } = params;
+
+  return StyleSheet.create({
+    assetHeaderContainer: {
+      gap: 16,
+      paddingBottom: 36,
+    },
+    assetContainer: {
+      flexDirection: 'row',
+      alignItems: 'center',
+      gap: 12,
+    },
+    assetInfo: {
+      flex: 1,
+    },
+    assetInfoSkeleton: {
+      gap: 6,
+      justifyContent: 'center',
+    },
+    assetAmount: {
+      fontSize: 20,
+      fontWeight: '500',
+      color: theme.colors.text.default,
+    },
+    skeletonBorderRadius: {
+      borderRadius: 8,
+    },
+    skeletonAvatar: {
+      borderRadius: 999,
+    },
+  });
+};
+
+export default styleSheet;
diff --git a/app/components/Views/confirmations/components/token-conversion-asset-header/token-conversion-asset-header.test.tsx b/app/components/Views/confirmations/components/token-conversion-asset-header/token-conversion-asset-header.test.tsx
new file mode 100644
index 000000000000..4be93d41db42
--- /dev/null
+++ b/app/components/Views/confirmations/components/token-conversion-asset-header/token-conversion-asset-header.test.tsx
@@ -0,0 +1,304 @@
+import React from 'react';
+import BigNumber from 'bignumber.js';
+
+import renderWithProvider from '../../../../../util/test/renderWithProvider';
+import initialRootState from '../../../../../util/test/initial-root-state';
+import {
+  TokenConversionAssetHeader,
+  TokenConversionAssetHeaderSkeleton,
+  TokenConversionAssetHeaderTestIds,
+} from './token-conversion-asset-header';
+import { AssetType } from '../../types/token';
+import {
+  useIsTransactionPayLoading,
+  useTransactionPayTotals,
+} from '../../hooks/pay/useTransactionPayData';
+import { getNetworkImageSource } from '../../../../../util/networks';
+import { useStyles } from '../../../../hooks/useStyles';
+import { useNetworkName } from '../../hooks/useNetworkName';
+
+jest.mock('../../../../hooks/useStyles', () => ({
+  useStyles: jest.fn(),
+}));
+
+jest.mock('../../hooks/pay/useTransactionPayData', () => ({
+  useIsTransactionPayLoading: jest.fn(),
+  useTransactionPayTotals: jest.fn(),
+}));
+
+jest.mock('../../../../../util/networks', () => ({
+  getNetworkImageSource: jest.fn(() => ({ uri: 'mock-network-image' })),
+}));
+
+jest.mock('../../hooks/useNetworkName', () => ({
+  useNetworkName: jest.fn(() => 'Ethereum'),
+}));
+
+const mockUseStyles = jest.mocked(useStyles);
+const mockUseIsTransactionPayLoading = jest.mocked(useIsTransactionPayLoading);
+const mockUseTransactionPayTotals = jest.mocked(useTransactionPayTotals);
+const mockUseNetworkName = jest.mocked(useNetworkName);
+
+const mockStyles = {
+  container: {},
+  assetInfo: {},
+  assetInfoSkeleton: {},
+  assetAmount: {},
+  skeletonBorderRadius: {},
+  skeletonAvatar: {},
+};
+
+function createMockToken(overrides: Partial<AssetType> = {}): AssetType {
+  return {
+    symbol: 'MUSD',
+    image: 'https://example.com/musd.png',
+    chainId: '0xe708',
+    address: '0x123',
+    name: 'MetaMask USD',
+    decimals: 6,
+    balance: '0',
+    logo: undefined,
+    isETH: undefined,
+    ...overrides,
+  };
+}
+
+function createMockFormatFiat() {
+  return jest.fn((value: BigNumber) => `$${value.toFixed(2)}`);
+}
+
+describe('TokenConversionAssetHeaderSkeleton', () => {
+  beforeEach(() => {
+    mockUseStyles.mockReturnValue({
+      styles: mockStyles,
+      theme: {},
+    } as ReturnType<typeof useStyles>);
+  });
+
+  it('renders skeleton container with ASSET_HEADER_SKELETON testID', () => {
+    const { getByTestId } = renderWithProvider(
+      <TokenConversionAssetHeaderSkeleton />,
+      { state: initialRootState },
+    );
+
+    const skeleton = getByTestId(
+      TokenConversionAssetHeaderTestIds.ASSET_HEADER_SKELETON,
+    );
+
+    expect(skeleton).toBeOnTheScreen();
+  });
+});
+
+describe('TokenConversionAssetHeader', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+    mockUseStyles.mockReturnValue({
+      styles: mockStyles,
+      theme: {},
+    } as ReturnType<typeof useStyles>);
+    mockUseIsTransactionPayLoading.mockReturnValue(false);
+    mockUseTransactionPayTotals.mockReturnValue({
+      sourceAmount: { usd: '1234.56', fiat: '1234.56' },
+      targetAmount: { usd: '1230.01', fiat: '1230.01' },
+    } as ReturnType<typeof useTransactionPayTotals>);
+    mockUseNetworkName.mockReturnValue('Ethereum');
+  });
+
+  afterEach(() => {
+    jest.resetAllMocks();
+  });
+
+  it('renders skeleton when loading', () => {
+    mockUseIsTransactionPayLoading.mockReturnValue(true);
+
+    const token = createMockToken();
+    const formatFiat = createMockFormatFiat();
+
+    const { getByTestId, queryByTestId } = renderWithProvider(
+      <TokenConversionAssetHeader
+        inputToken={token}
+        outputToken={token}
+        formatFiat={formatFiat}
+      />,
+      { state: initialRootState },
+    );
+
+    expect(
+      getByTestId(TokenConversionAssetHeaderTestIds.ASSET_HEADER_SKELETON),
+    ).toBeOnTheScreen();
+    expect(
+      queryByTestId(TokenConversionAssetHeaderTestIds.ASSET_HEADER_INPUT),
+    ).toBeNull();
+    expect(
+      queryByTestId(TokenConversionAssetHeaderTestIds.ASSET_HEADER_OUTPUT),
+    ).toBeNull();
+  });
+
+  it('renders asset header with quote source and target totals when not loading', () => {
+    const token = createMockToken();
+    const formatFiat = createMockFormatFiat();
+    formatFiat
+      .mockReturnValueOnce('$1,234.56')
+      .mockReturnValueOnce('$1,230.01');
+
+    const { getByTestId, getAllByText } = renderWithProvider(
+      <TokenConversionAssetHeader
+        inputToken={token}
+        outputToken={token}
+        formatFiat={formatFiat}
+      />,
+      { state: initialRootState },
+    );
+
+    expect(
+      getByTestId(TokenConversionAssetHeaderTestIds.ASSET_HEADER_INPUT),
+    ).toBeOnTheScreen();
+    expect(
+      getByTestId(TokenConversionAssetHeaderTestIds.ASSET_HEADER_OUTPUT),
+    ).toBeOnTheScreen();
+    expect(getAllByText('MUSD')).toHaveLength(2);
+    expect(getAllByText('$1,234.56')).toHaveLength(1);
+    expect(getAllByText('$1,230.01')).toHaveLength(1);
+    expect(formatFiat).toHaveBeenNthCalledWith(1, new BigNumber('1234.56'));
+    expect(formatFiat).toHaveBeenNthCalledWith(2, new BigNumber('1230.01'));
+  });
+
+  it('renders empty fiat text when quote totals are missing', () => {
+    mockUseTransactionPayTotals.mockReturnValue(undefined);
+
+    const token = createMockToken();
+    const formatFiat = createMockFormatFiat();
+
+    const { getByTestId, getAllByText } = renderWithProvider(
+      <TokenConversionAssetHeader
+        inputToken={token}
+        outputToken={token}
+        formatFiat={formatFiat}
+      />,
+      { state: initialRootState },
+    );
+
+    expect(
+      getByTestId(TokenConversionAssetHeaderTestIds.ASSET_HEADER_INPUT),
+    ).toBeOnTheScreen();
+    expect(
+      getByTestId(TokenConversionAssetHeaderTestIds.ASSET_HEADER_OUTPUT),
+    ).toBeOnTheScreen();
+    expect(getAllByText('MUSD')).toHaveLength(2);
+    expect(formatFiat).not.toHaveBeenCalled();
+  });
+
+  it('formats zero quote totals when source and target usd are zero', () => {
+    mockUseTransactionPayTotals.mockReturnValue({
+      sourceAmount: { usd: '0', fiat: '0' },
+      targetAmount: { usd: '0', fiat: '0' },
+    } as ReturnType<typeof useTransactionPayTotals>);
+
+    const token = createMockToken();
+    const formatFiat = createMockFormatFiat();
+    formatFiat.mockReturnValue('$0.00');
+
+    const { getByTestId } = renderWithProvider(
+      <TokenConversionAssetHeader
+        inputToken={token}
+        outputToken={token}
+        formatFiat={formatFiat}
+      />,
+      { state: initialRootState },
+    );
+
+    expect(
+      getByTestId(TokenConversionAssetHeaderTestIds.ASSET_HEADER_INPUT),
+    ).toBeOnTheScreen();
+    expect(
+      getByTestId(TokenConversionAssetHeaderTestIds.ASSET_HEADER_OUTPUT),
+    ).toBeOnTheScreen();
+    expect(formatFiat).toHaveBeenNthCalledWith(1, new BigNumber('0'));
+    expect(formatFiat).toHaveBeenNthCalledWith(2, new BigNumber('0'));
+  });
+
+  it('renders input and output token avatars', () => {
+    const inputToken = createMockToken({ symbol: 'USDC' });
+    const outputToken = createMockToken({ symbol: 'MUSD' });
+    const formatFiat = createMockFormatFiat();
+
+    const { getByTestId } = renderWithProvider(
+      <TokenConversionAssetHeader
+        inputToken={inputToken}
+        outputToken={outputToken}
+        formatFiat={formatFiat}
+      />,
+      { state: initialRootState },
+    );
+
+    expect(
+      getByTestId(TokenConversionAssetHeaderTestIds.INPUT_TOKEN_AVATAR),
+    ).toBeOnTheScreen();
+    expect(
+      getByTestId(TokenConversionAssetHeaderTestIds.OUTPUT_TOKEN_AVATAR),
+    ).toBeOnTheScreen();
+  });
+
+  it('calls getNetworkImageSource with input and output token chainIds', () => {
+    const mockGetNetworkImageSource = jest.mocked(getNetworkImageSource);
+    const inputToken = createMockToken({ chainId: '0x1' });
+    const outputToken = createMockToken({ chainId: '0xe708' });
+    const formatFiat = createMockFormatFiat();
+
+    renderWithProvider(
+      <TokenConversionAssetHeader
+        inputToken={inputToken}
+        outputToken={outputToken}
+        formatFiat={formatFiat}
+      />,
+      { state: initialRootState },
+    );
+
+    expect(mockGetNetworkImageSource).toHaveBeenNthCalledWith(1, {
+      chainId: '0x1',
+    });
+    expect(mockGetNetworkImageSource).toHaveBeenNthCalledWith(2, {
+      chainId: '0xe708',
+    });
+  });
+
+  it('calls getNetworkImageSource with empty string when token chainIds are missing', () => {
+    const mockGetNetworkImageSource = jest.mocked(getNetworkImageSource);
+    const token = createMockToken({ chainId: undefined });
+    const formatFiat = createMockFormatFiat();
+
+    renderWithProvider(
+      <TokenConversionAssetHeader
+        inputToken={token}
+        outputToken={token}
+        formatFiat={formatFiat}
+      />,
+      { state: initialRootState },
+    );
+
+    expect(mockGetNetworkImageSource).toHaveBeenNthCalledWith(1, {
+      chainId: '',
+    });
+    expect(mockGetNetworkImageSource).toHaveBeenNthCalledWith(2, {
+      chainId: '',
+    });
+  });
+
+  it('resolves network names from input and output token chainIds', () => {
+    const inputToken = createMockToken({ chainId: '0x1' });
+    const outputToken = createMockToken({ chainId: '0xe708' });
+    const formatFiat = createMockFormatFiat();
+
+    renderWithProvider(
+      <TokenConversionAssetHeader
+        inputToken={inputToken}
+        outputToken={outputToken}
+        formatFiat={formatFiat}
+      />,
+      { state: initialRootState },
+    );
+
+    expect(mockUseNetworkName).toHaveBeenNthCalledWith(1, '0x1');
+    expect(mockUseNetworkName).toHaveBeenNthCalledWith(2, '0xe708');
+  });
+});
diff --git a/app/components/Views/confirmations/components/token-conversion-asset-header/token-conversion-asset-header.tsx b/app/components/Views/confirmations/components/token-conversion-asset-header/token-conversion-asset-header.tsx
new file mode 100644
index 000000000000..8f1a5487f858
--- /dev/null
+++ b/app/components/Views/confirmations/components/token-conversion-asset-header/token-conversion-asset-header.tsx
@@ -0,0 +1,200 @@
+import React from 'react';
+import { View } from 'react-native';
+import { useStyles } from '../../../../hooks/useStyles';
+import Badge, {
+  BadgeVariant,
+} from '../../../../../component-library/components/Badges/Badge';
+import BadgeWrapper, {
+  BadgePosition,
+} from '../../../../../component-library/components/Badges/BadgeWrapper';
+import { AvatarSize } from '../../../../../component-library/components/Avatars/Avatar';
+import AvatarToken from '../../../../../component-library/components/Avatars/Avatar/variants/AvatarToken';
+import Text, {
+  TextColor,
+  TextVariant,
+} from '../../../../../component-library/components/Texts/Text';
+import { getNetworkImageSource } from '../../../../../util/networks';
+import BigNumber from 'bignumber.js';
+import { Skeleton } from '../../../../../component-library/components/Skeleton';
+import { AssetType } from '../../types/token';
+import styleSheet from './token-conversion-asset-header.styles';
+import {
+  useIsTransactionPayLoading,
+  useTransactionPayTotals,
+} from '../../hooks/pay/useTransactionPayData';
+import {
+  Icon,
+  IconColor,
+  IconName,
+  IconSize,
+} from '@metamask/design-system-react-native';
+import { Hex } from '@metamask/utils';
+import { useNetworkName } from '../../hooks/useNetworkName';
+
+export const TokenConversionAssetHeaderTestIds = {
+  ASSET_HEADER_SKELETON: 'token-conversion-asset-header-skeleton',
+  ASSET_HEADER_INPUT: 'token-conversion-asset-header-input',
+  ASSET_HEADER_OUTPUT: 'token-conversion-asset-header-output',
+  INPUT_TOKEN_AVATAR: 'token-conversion-asset-header-input-token-avatar',
+  OUTPUT_TOKEN_AVATAR: 'token-conversion-asset-header-output-token-avatar',
+} as const;
+
+export const TokenConversionAssetHeaderSkeleton = () => {
+  const { styles } = useStyles(styleSheet, {});
+
+  return (
+    <View
+      style={styles.assetHeaderContainer}
+      testID={TokenConversionAssetHeaderTestIds.ASSET_HEADER_SKELETON}
+    >
+      <View style={styles.assetContainer}>
+        <Skeleton width={40} height={40} style={styles.skeletonAvatar} />
+        <View style={[styles.assetInfo, styles.assetInfoSkeleton]}>
+          <Skeleton
+            width={56}
+            height={14}
+            style={styles.skeletonBorderRadius}
+          />
+          <Skeleton
+            width={140}
+            height={20}
+            style={styles.skeletonBorderRadius}
+          />
+        </View>
+      </View>
+      <Icon
+        name={IconName.Arrow2Down}
+        color={IconColor.IconAlternative}
+        size={IconSize.Lg}
+      />
+      <View style={styles.assetContainer}>
+        <Skeleton width={40} height={40} style={styles.skeletonAvatar} />
+        <View style={[styles.assetInfo, styles.assetInfoSkeleton]}>
+          <Skeleton
+            width={56}
+            height={14}
+            style={styles.skeletonBorderRadius}
+          />
+          <Skeleton
+            width={140}
+            height={20}
+            style={styles.skeletonBorderRadius}
+          />
+        </View>
+      </View>
+    </View>
+  );
+};
+
+export const TokenConversionAssetHeader = ({
+  inputToken,
+  outputToken,
+  formatFiat,
+}: {
+  inputToken: AssetType;
+  outputToken: AssetType;
+  formatFiat: (value: BigNumber) => string;
+}) => {
+  const { styles } = useStyles(styleSheet, {});
+
+  const isLoading = useIsTransactionPayLoading();
+  const totals = useTransactionPayTotals();
+
+  const inputTokenAmount = totals?.sourceAmount?.usd;
+  const outputTokenAmount = totals?.targetAmount?.usd;
+
+  const inputNetworkName = useNetworkName(inputToken?.chainId as Hex);
+  const outputNetworkName = useNetworkName(outputToken?.chainId as Hex);
+
+  const formatAmount = (amount?: string) => {
+    if (!amount) {
+      return '';
+    }
+
+    return formatFiat(new BigNumber(amount));
+  };
+
+  if (isLoading) {
+    return <TokenConversionAssetHeaderSkeleton />;
+  }
+
+  return (
+    <View style={styles.assetHeaderContainer}>
+      <View
+        style={styles.assetContainer}
+        testID={TokenConversionAssetHeaderTestIds.ASSET_HEADER_INPUT}
+      >
+        <BadgeWrapper
+          badgePosition={BadgePosition.BottomRight}
+          badgeElement={
+            <Badge
+              variant={BadgeVariant.Network}
+              name={inputNetworkName}
+              imageSource={getNetworkImageSource({
+                chainId: inputToken?.chainId ?? '',
+              })}
+            />
+          }
+        >
+          <AvatarToken
+            name={inputToken.symbol}
+            imageSource={{ uri: inputToken.image }}
+            size={AvatarSize.Lg}
+            testID={TokenConversionAssetHeaderTestIds.INPUT_TOKEN_AVATAR}
+          />
+        </BadgeWrapper>
+        <View style={styles.assetInfo}>
+          <Text
+            variant={TextVariant.BodySMMedium}
+            color={TextColor.Alternative}
+          >
+            {inputToken?.symbol}
+          </Text>
+          <Text style={styles.assetAmount}>
+            {formatAmount(inputTokenAmount)}
+          </Text>
+        </View>
+      </View>
+      <Icon
+        name={IconName.Arrow2Down}
+        color={IconColor.IconAlternative}
+        size={IconSize.Lg}
+      />
+      <View
+        style={styles.assetContainer}
+        testID={TokenConversionAssetHeaderTestIds.ASSET_HEADER_OUTPUT}
+      >
+        <BadgeWrapper
+          badgePosition={BadgePosition.BottomRight}
+          badgeElement={
+            <Badge
+              variant={BadgeVariant.Network}
+              name={outputNetworkName}
+              imageSource={getNetworkImageSource({
+                chainId: outputToken?.chainId ?? '',
+              })}
+            />
+          }
+        >
+          <AvatarToken
+            name={outputToken.symbol}
+            imageSource={{ uri: outputToken.image }}
+            size={AvatarSize.Lg}
+            testID={TokenConversionAssetHeaderTestIds.OUTPUT_TOKEN_AVATAR}
+          />
+        </BadgeWrapper>
+        <View style={styles.assetInfo}>
+          <Text
+            variant={TextVariant.BodySMMedium}
+            color={TextColor.Alternative}
+          >
+            {outputToken.symbol}
+          </Text>
+          <Text style={styles.assetAmount}>
+            {formatAmount(outputTokenAmount)}
+          </Text>
+        </View>
+      </View>
+    </View>
+  );
+};
diff --git a/app/components/Views/confirmations/context/qr-hardware-context/qr-hardware-context.test.tsx b/app/components/Views/confirmations/context/qr-hardware-context/qr-hardware-context.test.tsx
index 70e2e01f412e..1fdf9d5b1252 100644
--- a/app/components/Views/confirmations/context/qr-hardware-context/qr-hardware-context.test.tsx
+++ b/app/components/Views/confirmations/context/qr-hardware-context/qr-hardware-context.test.tsx
@@ -87,8 +87,8 @@ describe('QRHardwareContext', () => {
       .mockReturnValue(mockedValues);
   };
 
-  it('should pass correct value of needsCameraPermission to child components', () => {
-    createCameraSpy({ cameraError: undefined, hasCameraPermission: false });
+  it('does not disable confirm button for camera permission since scanner handles it', () => {
+    createCameraSpy({ cameraError: undefined, hasCameraPermission: true });
     createQRHardwareAwarenessSpy({
       isSigningQRObject: true,
       pendingScanRequest: mockPendingScanRequest,
@@ -103,7 +103,7 @@ describe('QRHardwareContext', () => {
     );
     expect(
       getByTestId(ConfirmationFooterSelectorIDs.CONFIRM_BUTTON).props.disabled,
-    ).toBe(true);
+    ).toBe(false);
   });
 
   it('does not invoke rejectPendingScan when request is cancelled id QR signing is not in progress', async () => {
diff --git a/app/components/Views/confirmations/context/qr-hardware-context/useCamera.test.ts b/app/components/Views/confirmations/context/qr-hardware-context/useCamera.test.ts
index 2073286c1bc7..8f605c83bc3d 100644
--- a/app/components/Views/confirmations/context/qr-hardware-context/useCamera.test.ts
+++ b/app/components/Views/confirmations/context/qr-hardware-context/useCamera.test.ts
@@ -1,32 +1,17 @@
 import { renderHook } from '@testing-library/react-native';
 
-import Device from '../../../../../util/device';
 import { useCamera } from './useCamera';
 
-jest.mock('../../../../../util/device', () => ({
-  isIos: () => false,
-  isAndroid: () => true,
-}));
-
 describe('useCamera', () => {
-  it('returns correct initial values if parameter isSigningQRObject is false', () => {
+  it('always returns hasCameraPermission as true', () => {
     const { result } = renderHook(() => useCamera(false));
     expect(result.current).toMatchObject({
       cameraError: undefined,
-      hasCameraPermission: false,
-    });
-  });
-
-  it('returns correct initial values if parameter isSigningQRObject is true', () => {
-    const { result } = renderHook(() => useCamera(true));
-    expect(result.current).toMatchObject({
-      cameraError: undefined,
-      hasCameraPermission: false,
+      hasCameraPermission: true,
     });
   });
 
-  it('returns correct initial values if device is IOS', () => {
-    jest.spyOn(Device, 'isIos').mockReturnValue(true);
+  it('always returns hasCameraPermission as true when signing QR object', () => {
     const { result } = renderHook(() => useCamera(true));
     expect(result.current).toMatchObject({
       cameraError: undefined,
diff --git a/app/components/Views/confirmations/context/qr-hardware-context/useCamera.ts b/app/components/Views/confirmations/context/qr-hardware-context/useCamera.ts
index 5f367b3a452e..6f33c0b6d8e4 100644
--- a/app/components/Views/confirmations/context/qr-hardware-context/useCamera.ts
+++ b/app/components/Views/confirmations/context/qr-hardware-context/useCamera.ts
@@ -1,103 +1,17 @@
-/* eslint-disable react-native/split-platform-components */
-import { useState, useCallback, useEffect } from 'react';
-import { PermissionsAndroid, AppStateStatus, AppState } from 'react-native';
-
-import { strings } from '../../../../../../locales/i18n';
-import Device from '../../../../../util/device';
-import { MetaMetricsEvents } from '../../../../../core/Analytics';
-import { useAnalytics } from '../../../../hooks/useAnalytics/useAnalytics';
-import { HardwareDeviceTypes } from '../../../../../constants/keyringTypes';
-import {
-  PERMISSION_RESULT,
-  PERMISSION_TYPE,
-} from '../../../../../core/Analytics/MetaMetrics.events';
-
-export const useCamera = (isSigningQRObject: boolean) => {
-  const { trackEvent, createEventBuilder } = useAnalytics();
-  // todo: integrate with alert system
-  const [cameraError, setCameraError] = useState<string | undefined>();
-
-  // ios handled camera perfectly in this situation, we just need to check permission with android.
-  const [hasCameraPermission, setCameraPermission] = useState(Device.isIos());
-
-  const checkAndroidCamera = useCallback(() => {
-    if (Device.isAndroid() && !hasCameraPermission) {
-      PermissionsAndroid.check(PermissionsAndroid.PERMISSIONS.CAMERA).then(
-        (_hasPermission) => {
-          trackEvent(
-            createEventBuilder(
-              MetaMetricsEvents.HARDWARE_WALLET_PERMISSION_REQUEST,
-            )
-              .addProperties({
-                permission: PERMISSION_TYPE.CAMERA,
-                result: _hasPermission
-                  ? PERMISSION_RESULT.GRANTED
-                  : PERMISSION_RESULT.DENIED,
-                device_type: HardwareDeviceTypes.QR,
-              })
-              .build(),
-          );
-          setCameraPermission(_hasPermission);
-          if (!_hasPermission) {
-            trackEvent(
-              createEventBuilder(
-                MetaMetricsEvents.HARDWARE_WALLET_PERMISSION_REQUEST,
-              )
-                .addProperties({
-                  permission: PERMISSION_TYPE.CAMERA,
-                  result: PERMISSION_RESULT.LIMITED,
-                  device_type: HardwareDeviceTypes.QR,
-                })
-                .build(),
-            );
-            setCameraError(strings('transaction.no_camera_permission_android'));
-          } else {
-            trackEvent(
-              createEventBuilder(
-                MetaMetricsEvents.HARDWARE_WALLET_PERMISSION_REQUEST,
-              )
-                .addProperties({
-                  permission: PERMISSION_TYPE.CAMERA,
-                  result: PERMISSION_RESULT.UNAVAILABLE,
-                  device_type: HardwareDeviceTypes.QR,
-                })
-                .build(),
-            );
-            setCameraError(undefined);
-          }
-        },
-      );
-    }
-  }, [hasCameraPermission, trackEvent, createEventBuilder]);
-
-  const handleAppState = useCallback(
-    (appState: AppStateStatus) => {
-      if (appState === 'active') {
-        checkAndroidCamera();
-      }
-    },
-    [checkAndroidCamera],
-  );
-
-  useEffect(() => {
-    if (!isSigningQRObject) {
-      return;
-    }
-    checkAndroidCamera();
-  }, [checkAndroidCamera, isSigningQRObject]);
-
-  useEffect(() => {
-    if (!isSigningQRObject) {
-      return;
-    }
-    const appStateListener = AppState.addEventListener(
-      'change',
-      handleAppState,
-    );
-    return () => {
-      appStateListener.remove();
-    };
-  }, [handleAppState, isSigningQRObject]);
-
-  return { cameraError, hasCameraPermission };
-};
+/**
+ * Camera permission is fully handled by AnimatedQRScannerModal via
+ * react-native-vision-camera's useCameraPermission / requestPermission().
+ *
+ * This hook no longer pre-checks or pre-requests Android camera permission
+ * because PermissionsAndroid and react-native-vision-camera maintain separate
+ * permission state, and calling PermissionsAndroid.request() can conflict with
+ * vision-camera's camera initialization pipeline (see #26115).
+ *
+ * hasCameraPermission is always true so the "Get signature" button is never
+ * disabled for permission reasons. The scanner modal will prompt the user
+ * when it opens.
+ */
+export const useCamera = (_isSigningQRObject: boolean) => ({
+  cameraError: undefined as string | undefined,
+  hasCameraPermission: true,
+});
diff --git a/app/components/Views/confirmations/hooks/alerts/useInsufficientPayTokenBalanceAlert.test.ts b/app/components/Views/confirmations/hooks/alerts/useInsufficientPayTokenBalanceAlert.test.ts
index 4af8eb287dc2..f2504d63c254 100644
--- a/app/components/Views/confirmations/hooks/alerts/useInsufficientPayTokenBalanceAlert.test.ts
+++ b/app/components/Views/confirmations/hooks/alerts/useInsufficientPayTokenBalanceAlert.test.ts
@@ -358,6 +358,29 @@ describe('useInsufficientPayTokenBalanceAlert', () => {
 
       expect(result.current).toStrictEqual([]);
     });
+
+    it('uses the standard message (with network switch hint) for non-post-quote flows', () => {
+      useTokenWithBalanceMock.mockReturnValue({
+        ...NATIVE_TOKEN_MOCK,
+        balanceRaw: '99',
+      } as ReturnType<typeof useTokenWithBalance>);
+
+      const { result } = runHook();
+
+      expect(result.current).toStrictEqual([
+        {
+          key: AlertKeys.InsufficientPayTokenNative,
+          field: RowAlertKey.Amount,
+          isBlocking: true,
+          title: strings('alert_system.insufficient_pay_token_balance.message'),
+          message: strings(
+            'alert_system.insufficient_pay_token_native.message',
+            { ticker: 'ETH' },
+          ),
+          severity: Severity.Danger,
+        },
+      ]);
+    });
   });
 
   describe('for post-quote (withdrawal) flows', () => {
@@ -461,7 +484,7 @@ describe('useInsufficientPayTokenBalanceAlert', () => {
           isBlocking: true,
           title: strings('alert_system.insufficient_pay_token_balance.message'),
           message: strings(
-            'alert_system.insufficient_pay_token_native.message',
+            'alert_system.insufficient_pay_token_native_post_quote.message',
             { ticker: 'POL' },
           ),
           severity: Severity.Danger,
@@ -491,7 +514,7 @@ describe('useInsufficientPayTokenBalanceAlert', () => {
           isBlocking: true,
           title: strings('alert_system.insufficient_pay_token_balance.message'),
           message: strings(
-            'alert_system.insufficient_pay_token_native.message',
+            'alert_system.insufficient_pay_token_native_post_quote.message',
             { ticker: 'POL' },
           ),
           severity: Severity.Danger,
@@ -528,7 +551,7 @@ describe('useInsufficientPayTokenBalanceAlert', () => {
           isBlocking: true,
           title: strings('alert_system.insufficient_pay_token_balance.message'),
           message: strings(
-            'alert_system.insufficient_pay_token_native.message',
+            'alert_system.insufficient_pay_token_native_post_quote.message',
             { ticker: 'POL' },
           ),
           severity: Severity.Danger,
diff --git a/app/components/Views/confirmations/hooks/alerts/useInsufficientPayTokenBalanceAlert.ts b/app/components/Views/confirmations/hooks/alerts/useInsufficientPayTokenBalanceAlert.ts
index fc9a46635f3a..f53788c2af22 100644
--- a/app/components/Views/confirmations/hooks/alerts/useInsufficientPayTokenBalanceAlert.ts
+++ b/app/components/Views/confirmations/hooks/alerts/useInsufficientPayTokenBalanceAlert.ts
@@ -179,7 +179,9 @@ export function useInsufficientPayTokenBalanceAlert({
           key: AlertKeys.InsufficientPayTokenNative,
           title: strings('alert_system.insufficient_pay_token_balance.message'),
           message: strings(
-            'alert_system.insufficient_pay_token_native.message',
+            isPostQuote
+              ? 'alert_system.insufficient_pay_token_native_post_quote.message'
+              : 'alert_system.insufficient_pay_token_native.message',
             { ticker },
           ),
         },
@@ -191,6 +193,7 @@ export function useInsufficientPayTokenBalanceAlert({
     isInsufficientForInput,
     isInsufficientForFees,
     isInsufficientForSourceNetwork,
+    isPostQuote,
     ticker,
   ]);
 }
diff --git a/app/components/Views/confirmations/hooks/gas/useCancelSpeedupGas/index.ts b/app/components/Views/confirmations/hooks/gas/useCancelSpeedupGas/index.ts
new file mode 100644
index 000000000000..e410d6b1165f
--- /dev/null
+++ b/app/components/Views/confirmations/hooks/gas/useCancelSpeedupGas/index.ts
@@ -0,0 +1,5 @@
+export { useCancelSpeedupGas } from './useCancelSpeedupGas';
+export type {
+  UseCancelSpeedupGasInput,
+  UseCancelSpeedupGasResult,
+} from './types';
diff --git a/app/components/Views/confirmations/hooks/gas/useCancelSpeedupGas/types.ts b/app/components/Views/confirmations/hooks/gas/useCancelSpeedupGas/types.ts
new file mode 100644
index 000000000000..c68fc8e558d9
--- /dev/null
+++ b/app/components/Views/confirmations/hooks/gas/useCancelSpeedupGas/types.ts
@@ -0,0 +1,26 @@
+import type {
+  FeeMarketEIP1559Values,
+  GasPriceValue,
+  TransactionMeta,
+} from '@metamask/transaction-controller';
+
+/**
+ * Result of useCancelSpeedupGas: params for controller and display strings.
+ */
+export interface UseCancelSpeedupGasResult {
+  /** Params to pass to speedUpTransaction(txId, params) or stopTransaction(txId, params) */
+  paramsForController: GasPriceValue | FeeMarketEIP1559Values | undefined;
+  /** Display string for "Network fee" row (e.g. "0.001 ETH") */
+  networkFeeDisplay: string;
+  /** Native fee amount only (e.g. "0.001") for layout with icon */
+  networkFeeNative: string;
+  /** Fiat fee (e.g. "$0.65") or null when testnet/hidden */
+  networkFeeFiat: string | null;
+  /** Native currency symbol for the chain (e.g. "ETH") */
+  nativeTokenSymbol: string;
+}
+
+export interface UseCancelSpeedupGasInput {
+  tx: TransactionMeta | null;
+  isCancel: boolean;
+}
diff --git a/app/components/Views/confirmations/hooks/gas/useCancelSpeedupGas/useCancelSpeedupGas.test.ts b/app/components/Views/confirmations/hooks/gas/useCancelSpeedupGas/useCancelSpeedupGas.test.ts
new file mode 100644
index 000000000000..88d13c9774c9
--- /dev/null
+++ b/app/components/Views/confirmations/hooks/gas/useCancelSpeedupGas/useCancelSpeedupGas.test.ts
@@ -0,0 +1,332 @@
+import type {
+  FeeMarketEIP1559Values,
+  GasPriceValue,
+  TransactionMeta,
+} from '@metamask/transaction-controller';
+import { useCancelSpeedupGas } from './useCancelSpeedupGas';
+import { renderHookWithProvider } from '../../../../../../util/test/renderWithProvider';
+import { backgroundState } from '../../../../../../util/test/initial-root-state';
+import { useFeeCalculations } from '../useFeeCalculations';
+
+const providerState = { state: { engine: { backgroundState } } } as const;
+
+const mockNetworkConfig = { nativeCurrency: 'ETH' };
+
+const mockFeeCalculations = {
+  estimatedFeeNative: '0.001',
+  estimatedFeeFiat: '$2.00',
+  estimatedFeeFiatPrecise: null,
+  preciseNativeFeeInHex: null,
+  calculateGasEstimate: jest.fn(),
+  maxFeeFiat: null,
+  maxFeeNative: null,
+  maxFeeNativePrecise: null,
+  maxFeeNativeHex: null,
+};
+
+jest.mock('../useFeeCalculations', () => ({
+  useFeeCalculations: jest.fn(() => mockFeeCalculations),
+}));
+
+jest.mock('../../../../../../selectors/networkController', () => ({
+  ...jest.requireActual('../../../../../../selectors/networkController'),
+  selectNetworkConfigurationByChainId: jest.fn(() => mockNetworkConfig),
+}));
+
+jest.mock('../../../../../../selectors/confirmTransaction', () => ({
+  ...jest.requireActual('../../../../../../selectors/confirmTransaction'),
+  selectGasFeeEstimates: jest.fn(() => ({
+    medium: { suggestedMaxFeePerGas: '25' },
+  })),
+}));
+
+jest.mock('../../../../../../selectors/currencyRateController', () => ({
+  ...jest.requireActual('../../../../../../selectors/currencyRateController'),
+  selectConversionRateByChainId: jest.fn(() => 2000),
+}));
+
+jest.mock('../../../../../../selectors/settings', () => ({
+  ...jest.requireActual('../../../../../../selectors/settings'),
+  selectShowFiatOnTestnets: jest.fn(() => false),
+}));
+
+jest.mock(
+  '../../../../../../components/UI/SimulationDetails/FiatDisplay/useFiatFormatter',
+  () => ({
+    __esModule: true,
+    default: () => (amount: string | number) => `$${Number(amount).toFixed(2)}`,
+  }),
+);
+
+jest.mock('../../../utils/gas', () => ({
+  getFeesFromHex: jest.fn(() => ({
+    currentCurrencyFee: '$50.00',
+    nativeCurrencyFee: '0.025',
+    preciseCurrentCurrencyFee: '$50.00',
+    preciseNativeCurrencyFee: '0.025',
+    preciseNativeFeeInHex: '0x56bc75e2d630eb20000',
+  })),
+}));
+
+describe('useCancelSpeedupGas', () => {
+  const mockTxEip1559 = {
+    id: 'tx-1',
+    chainId: '0x1',
+    networkClientId: 'mainnet',
+    txParams: {
+      gas: '0x5208',
+      maxFeePerGas: '0x174876e800',
+      maxPriorityFeePerGas: '0x59682f00',
+    },
+  } as unknown as TransactionMeta;
+
+  const mockTxLegacy = {
+    id: 'tx-2',
+    chainId: '0x1',
+    networkClientId: 'mainnet',
+    txParams: { gas: '0x5208', gasPrice: '0x0' },
+  } as unknown as TransactionMeta;
+
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  it('returns empty result when tx is null', () => {
+    const { result } = renderHookWithProvider(
+      () => useCancelSpeedupGas({ tx: null, isCancel: false }),
+      providerState,
+    );
+
+    expect(result.current.paramsForController).toBeUndefined();
+    expect(result.current.networkFeeDisplay).toBe('0');
+    expect(result.current.networkFeeNative).toBe('0');
+    expect(result.current.networkFeeFiat).toBeNull();
+    expect(result.current.nativeTokenSymbol).toBe('ETH');
+  });
+
+  it('returns empty result when tx has no txParams', () => {
+    const txNoParams = {
+      id: 'tx-1',
+      chainId: '0x1',
+    } as unknown as TransactionMeta;
+    const { result } = renderHookWithProvider(
+      () => useCancelSpeedupGas({ tx: txNoParams, isCancel: false }),
+      providerState,
+    );
+
+    expect(result.current.paramsForController).toBeUndefined();
+    expect(result.current.networkFeeDisplay).toBe('0');
+    expect(result.current.networkFeeNative).toBe('0');
+    expect(result.current.networkFeeFiat).toBeNull();
+  });
+
+  it('returns EIP-1559 params derived from tx.txParams (speed up)', () => {
+    const { result } = renderHookWithProvider(
+      () =>
+        useCancelSpeedupGas({
+          tx: mockTxEip1559,
+          isCancel: false,
+        }),
+      providerState,
+    );
+
+    expect(result.current.paramsForController).toBeDefined();
+    const eip1559Params = result.current.paramsForController as
+      | FeeMarketEIP1559Values
+      | undefined;
+    expect(eip1559Params?.maxFeePerGas).toBeDefined();
+    expect(eip1559Params?.maxPriorityFeePerGas).toBeDefined();
+    expect(result.current.networkFeeDisplay).toMatch(/\d+\.?\d* ETH/);
+    expect(result.current.networkFeeNative).toMatch(/\d+\.?\d*/);
+    expect(result.current.nativeTokenSymbol).toBe('ETH');
+  });
+
+  it('returns EIP-1559 params with higher values for cancel', () => {
+    const { result: speedUpResult } = renderHookWithProvider(
+      () =>
+        useCancelSpeedupGas({
+          tx: mockTxEip1559,
+          isCancel: false,
+        }),
+      providerState,
+    );
+
+    const { result: cancelResult } = renderHookWithProvider(
+      () =>
+        useCancelSpeedupGas({
+          tx: mockTxEip1559,
+          isCancel: true,
+        }),
+      providerState,
+    );
+
+    expect(cancelResult.current.paramsForController).toBeDefined();
+    expect(speedUpResult.current.paramsForController).toBeDefined();
+  });
+
+  it('returns legacy params when tx.txParams has gasPrice (zero gasPrice)', () => {
+    const { result } = renderHookWithProvider(
+      () =>
+        useCancelSpeedupGas({
+          tx: mockTxLegacy,
+          isCancel: false,
+        }),
+      providerState,
+    );
+
+    expect(result.current.paramsForController).toBeDefined();
+    const legacyParams = result.current.paramsForController as
+      | GasPriceValue
+      | undefined;
+    expect(legacyParams?.gasPrice).toBeDefined();
+    expect(result.current.networkFeeDisplay).toMatch(/\d+\.?\d* ETH/);
+    expect(result.current.networkFeeFiat).toBeDefined();
+  });
+
+  it('returns legacy params when tx.txParams has gasPrice (non-zero gasPrice)', () => {
+    const txWithGasPrice = {
+      ...mockTxLegacy,
+      txParams: { gas: '0x5208', gasPrice: '0x2540be400' },
+    } as unknown as TransactionMeta;
+
+    const { result } = renderHookWithProvider(
+      () =>
+        useCancelSpeedupGas({
+          tx: txWithGasPrice,
+          isCancel: false,
+        }),
+      providerState,
+    );
+
+    expect(result.current.paramsForController).toBeDefined();
+    const legacyParams = result.current.paramsForController as
+      | GasPriceValue
+      | undefined;
+    expect(legacyParams?.gasPrice).toBeDefined();
+    expect(result.current.networkFeeDisplay).toMatch(/\d+\.?\d* ETH/);
+  });
+
+  it('calculates network fee correctly for EIP-1559', () => {
+    const { result } = renderHookWithProvider(
+      () =>
+        useCancelSpeedupGas({
+          tx: mockTxEip1559,
+          isCancel: false,
+        }),
+      providerState,
+    );
+
+    expect(parseFloat(result.current.networkFeeNative)).toBeGreaterThan(0);
+    expect(result.current.networkFeeDisplay).toContain('ETH');
+    expect(result.current.networkFeeFiat).toMatch('$');
+  });
+
+  it('handles missing networkClientId gracefully', () => {
+    const txWithoutNetworkClientId = {
+      ...mockTxEip1559,
+      networkClientId: undefined,
+    } as unknown as TransactionMeta;
+
+    const { result } = renderHookWithProvider(
+      () =>
+        useCancelSpeedupGas({
+          tx: txWithoutNetworkClientId,
+          isCancel: false,
+        }),
+      providerState,
+    );
+
+    expect(result.current.nativeTokenSymbol).toBe('ETH');
+    expect(result.current.paramsForController).toBeDefined();
+  });
+
+  it('returns correct native token symbol', () => {
+    const { result } = renderHookWithProvider(
+      () =>
+        useCancelSpeedupGas({
+          tx: mockTxEip1559,
+          isCancel: false,
+        }),
+      providerState,
+    );
+
+    expect(result.current.nativeTokenSymbol).toBe('ETH');
+  });
+
+  it('uses bump-only for EIP-1559 (no market)', () => {
+    const tx10Gwei = {
+      ...mockTxEip1559,
+      txParams: {
+        gas: '0x5208',
+        maxFeePerGas: '0x2540be400',
+        maxPriorityFeePerGas: '0x59682f00',
+      },
+    } as unknown as TransactionMeta;
+
+    const { result } = renderHookWithProvider(
+      () =>
+        useCancelSpeedupGas({
+          tx: tx10Gwei,
+          isCancel: false,
+        }),
+      providerState,
+    );
+
+    const paramsForController = result.current.paramsForController as
+      | FeeMarketEIP1559Values
+      | undefined;
+
+    expect(paramsForController?.maxFeePerGas).toBeDefined();
+    expect(paramsForController?.maxPriorityFeePerGas).toBeDefined();
+  });
+
+  it('calls useFeeCalculations with synthetic tx (bumped params) when tx is provided', () => {
+    const mockUseFeeCalculations = jest.mocked(useFeeCalculations);
+
+    renderHookWithProvider(
+      () =>
+        useCancelSpeedupGas({
+          tx: mockTxEip1559,
+          isCancel: false,
+        }),
+      providerState,
+    );
+
+    expect(mockUseFeeCalculations).toHaveBeenCalled();
+    const [callArg] =
+      mockUseFeeCalculations.mock.calls[
+        mockUseFeeCalculations.mock.calls.length - 1
+      ];
+    expect(callArg).toMatchObject({
+      id: 'tx-1',
+      chainId: '0x1',
+      txParams: expect.objectContaining({
+        gas: '0x5208',
+        maxFeePerGas: expect.any(String),
+        maxPriorityFeePerGas: expect.any(String),
+      }),
+    });
+  });
+
+  it('uses fee display from useFeeCalculations when tx is provided', () => {
+    const { result } = renderHookWithProvider(
+      () =>
+        useCancelSpeedupGas({
+          tx: mockTxEip1559,
+          isCancel: false,
+        }),
+      providerState,
+    );
+
+    expect(result.current.networkFeeNative).toBe(
+      mockFeeCalculations.estimatedFeeNative,
+    );
+    expect(result.current.networkFeeFiat).toBe(
+      mockFeeCalculations.estimatedFeeFiat,
+    );
+    expect(result.current.networkFeeDisplay).toContain(
+      mockFeeCalculations.estimatedFeeNative,
+    );
+    expect(result.current.networkFeeDisplay).toContain('ETH');
+  });
+});
diff --git a/app/components/Views/confirmations/hooks/gas/useCancelSpeedupGas/useCancelSpeedupGas.ts b/app/components/Views/confirmations/hooks/gas/useCancelSpeedupGas/useCancelSpeedupGas.ts
new file mode 100644
index 000000000000..2f25e5b485d2
--- /dev/null
+++ b/app/components/Views/confirmations/hooks/gas/useCancelSpeedupGas/useCancelSpeedupGas.ts
@@ -0,0 +1,146 @@
+import {
+  CANCEL_RATE,
+  isEIP1559Transaction,
+  SPEED_UP_RATE,
+  type FeeMarketEIP1559Values,
+  type GasPriceValue,
+  type TransactionMeta,
+} from '@metamask/transaction-controller';
+import { weiHexToGweiDec } from '@metamask/controller-utils';
+import BigNumber from 'bignumber.js';
+import { useMemo } from 'react';
+import { useSelector } from 'react-redux';
+import { RootState } from '../../../../../../reducers';
+import { selectGasFeeEstimates } from '../../../../../../selectors/confirmTransaction';
+import { selectNetworkConfigurationByChainId } from '../../../../../../selectors/networkController';
+import { getMediumGasPriceHex } from '../../../../../../util/confirmation/gas';
+import { decGWEIToHexWEI } from '../../../../../../util/conversions';
+import { addHexPrefix } from '../../../../../../util/number';
+import { useFeeCalculations } from '../useFeeCalculations';
+import type {
+  UseCancelSpeedupGasInput,
+  UseCancelSpeedupGasResult,
+} from './types';
+
+const HEX_ZERO = '0x0';
+
+/** Stub passed to useFeeCalculations when tx is null so the hook is always called unconditionally. */
+const STUB_TX = {
+  txParams: { gas: HEX_ZERO },
+  networkClientId: '',
+} as TransactionMeta;
+
+export function useCancelSpeedupGas({
+  tx,
+  isCancel,
+}: UseCancelSpeedupGasInput): UseCancelSpeedupGasResult {
+  const chainId = tx?.chainId;
+
+  const networkConfig = useSelector((state: RootState) =>
+    chainId ? selectNetworkConfigurationByChainId(state, chainId) : undefined,
+  );
+  const gasFeeEstimates = useSelector(selectGasFeeEstimates);
+  const nativeTokenSymbol = networkConfig?.nativeCurrency ?? 'ETH';
+
+  const bumpResult = useMemo(() => {
+    const txParams = tx?.txParams;
+    if (!tx || !txParams) {
+      return { paramsForController: undefined };
+    }
+
+    const rate = isCancel ? CANCEL_RATE : SPEED_UP_RATE;
+
+    let paramsForController: GasPriceValue | FeeMarketEIP1559Values | undefined;
+
+    if (isEIP1559Transaction(txParams)) {
+      const existingMaxFeeGwei = weiHexToGweiDec(
+        txParams.maxFeePerGas ?? HEX_ZERO,
+      );
+      const existingPriorityGwei = weiHexToGweiDec(
+        txParams.maxPriorityFeePerGas ?? HEX_ZERO,
+      );
+      const existingMaxFee = new BigNumber(String(existingMaxFeeGwei ?? 0), 10);
+      const existingPriority = new BigNumber(
+        String(existingPriorityGwei ?? 0),
+        10,
+      );
+
+      const suggestedMaxFee = existingMaxFee.times(rate);
+      const suggestedPriority = existingPriority.times(rate);
+
+      const maxFeePerGasHex = addHexPrefix(
+        decGWEIToHexWEI(suggestedMaxFee.toString())?.toString(),
+      );
+      const maxPriorityFeePerGasHex = addHexPrefix(
+        decGWEIToHexWEI(suggestedPriority.toString())?.toString(),
+      );
+
+      paramsForController = {
+        maxFeePerGas: maxFeePerGasHex,
+        maxPriorityFeePerGas: maxPriorityFeePerGasHex,
+      };
+    } else {
+      const existingGasPriceHex = txParams.gasPrice ?? HEX_ZERO;
+      const existingGasPriceDecimal = parseInt(
+        existingGasPriceHex === undefined
+          ? HEX_ZERO
+          : String(existingGasPriceHex),
+        16,
+      );
+      const existingGasPrice = new BigNumber(existingGasPriceDecimal, 10);
+      const suggestedGasPrice = existingGasPrice.times(rate).integerValue();
+      let gasPriceHex = addHexPrefix(suggestedGasPrice.toString(16));
+
+      // Legacy tx with existing gasPrice 0x0 yields 0 * rate = 0; that would never get mined. Fall back to current network gas price estimate.
+      if (suggestedGasPrice.isZero()) {
+        gasPriceHex = getMediumGasPriceHex(gasFeeEstimates);
+      }
+
+      paramsForController = { gasPrice: gasPriceHex };
+    }
+
+    return { paramsForController };
+  }, [tx, isCancel, gasFeeEstimates]);
+
+  const displayTx = useMemo((): TransactionMeta | null => {
+    if (!tx?.txParams || !bumpResult.paramsForController) return null;
+    return {
+      ...tx,
+      txParams: { ...tx.txParams, ...bumpResult.paramsForController },
+    };
+  }, [tx, bumpResult.paramsForController]);
+
+  const feeCalculations = useFeeCalculations(displayTx ?? STUB_TX);
+
+  return useMemo((): UseCancelSpeedupGasResult => {
+    const empty: UseCancelSpeedupGasResult = {
+      paramsForController: undefined,
+      networkFeeDisplay: '0',
+      networkFeeNative: '0',
+      networkFeeFiat: null,
+      nativeTokenSymbol,
+    };
+
+    const txParams = tx?.txParams;
+    if (!tx || !txParams) {
+      return empty;
+    }
+
+    const { paramsForController } = bumpResult;
+    const networkFeeNative = feeCalculations.estimatedFeeNative ?? '0';
+
+    return {
+      paramsForController,
+      networkFeeDisplay: `${networkFeeNative} ${nativeTokenSymbol}`,
+      networkFeeNative,
+      networkFeeFiat: feeCalculations.estimatedFeeFiat,
+      nativeTokenSymbol,
+    };
+  }, [
+    tx,
+    bumpResult,
+    feeCalculations.estimatedFeeNative,
+    feeCalculations.estimatedFeeFiat,
+    nativeTokenSymbol,
+  ]);
+}
diff --git a/app/components/Views/confirmations/hooks/pay/useAutomaticTransactionPayToken.test.ts b/app/components/Views/confirmations/hooks/pay/useAutomaticTransactionPayToken.test.ts
index 3a40391ea5b0..391964d35130 100644
--- a/app/components/Views/confirmations/hooks/pay/useAutomaticTransactionPayToken.test.ts
+++ b/app/components/Views/confirmations/hooks/pay/useAutomaticTransactionPayToken.test.ts
@@ -7,6 +7,7 @@ import {
 import { useTransactionPayToken } from './useTransactionPayToken';
 import { simpleSendTransactionControllerMock } from '../../__mocks__/controllers/transaction-controller-mock';
 import { transactionApprovalControllerMock } from '../../__mocks__/controllers/approval-controller-mock';
+import { selectMetaMaskPayTokensFlags } from '../../../../../selectors/featureFlagController/confirmations';
 import { isHardwareAccount } from '../../../../../util/address';
 import { TransactionType } from '@metamask/transaction-controller';
 import { TransactionPayRequiredToken } from '@metamask/transaction-pay-controller';
@@ -20,6 +21,15 @@ jest.mock('../../../../../util/address');
 jest.mock('../../../../../selectors/transactionPayController');
 jest.mock('./useTransactionPayData');
 jest.mock('./useTransactionPayAvailableTokens');
+jest.mock(
+  '../../../../../selectors/featureFlagController/confirmations',
+  () => ({
+    ...jest.requireActual(
+      '../../../../../selectors/featureFlagController/confirmations',
+    ),
+    selectMetaMaskPayTokensFlags: jest.fn(),
+  }),
+);
 
 const TOKEN_ADDRESS_1_MOCK = '0x1234567890abcdef1234567890abcdef12345678';
 const TOKEN_ADDRESS_2_MOCK = '0xabcdefabcdefabcdefabcdefabcdefabcdefabcd';
@@ -73,6 +83,9 @@ describe('useAutomaticTransactionPayToken', () => {
   const useTransactionPayRequiredTokensMock = jest.mocked(
     useTransactionPayRequiredTokens,
   );
+  const selectMetaMaskPayTokensFlagsMock = jest.mocked(
+    selectMetaMaskPayTokensFlags,
+  );
 
   const setPayTokenMock: jest.MockedFn<
     ReturnType<typeof useTransactionPayToken>['setPayToken']
@@ -94,6 +107,11 @@ describe('useAutomaticTransactionPayToken', () => {
     ]);
 
     isHardwareAccountMock.mockReturnValue(false);
+
+    selectMetaMaskPayTokensFlagsMock.mockReturnValue({
+      preferredTokens: { default: [], overrides: {} },
+      minimumRequiredTokenBalance: 0,
+    });
   });
 
   it('selects first token', () => {
@@ -302,4 +320,251 @@ describe('useAutomaticTransactionPayToken', () => {
       chainId: CHAIN_ID_1_MOCK,
     });
   });
+
+  it('selects preferred token from feature flags sorted by highest success rate', () => {
+    selectMetaMaskPayTokensFlagsMock.mockReturnValue({
+      preferredTokens: {
+        default: [],
+        overrides: {
+          perpsDeposit: [
+            {
+              address: TOKEN_ADDRESS_2_MOCK,
+              chainId: CHAIN_ID_2_MOCK,
+              successRate: 0.7,
+            },
+            {
+              address: TOKEN_ADDRESS_1_MOCK,
+              chainId: CHAIN_ID_1_MOCK,
+              successRate: 0.95,
+            },
+          ],
+        },
+      },
+      minimumRequiredTokenBalance: 5,
+    });
+
+    useTransactionPayAvailableTokensMock.mockReturnValue({
+      availableTokens: [
+        {
+          address: TOKEN_ADDRESS_2_MOCK,
+          chainId: CHAIN_ID_2_MOCK,
+          fiat: { balance: 10 },
+        },
+        {
+          address: TOKEN_ADDRESS_1_MOCK,
+          chainId: CHAIN_ID_1_MOCK,
+          fiat: { balance: 20 },
+        },
+      ] as AssetType[],
+      hasTokens: true,
+    });
+
+    runHook();
+
+    expect(setPayTokenMock).toHaveBeenCalledWith({
+      address: TOKEN_ADDRESS_1_MOCK,
+      chainId: CHAIN_ID_1_MOCK,
+    });
+  });
+
+  it('skips preferred token from flags if balance is below minimum', () => {
+    selectMetaMaskPayTokensFlagsMock.mockReturnValue({
+      preferredTokens: {
+        default: [],
+        overrides: {
+          perpsDeposit: [
+            {
+              address: TOKEN_ADDRESS_1_MOCK,
+              chainId: CHAIN_ID_1_MOCK,
+              successRate: 0.95,
+            },
+            {
+              address: TOKEN_ADDRESS_2_MOCK,
+              chainId: CHAIN_ID_2_MOCK,
+              successRate: 0.7,
+            },
+          ],
+        },
+      },
+      minimumRequiredTokenBalance: 15,
+    });
+
+    useTransactionPayAvailableTokensMock.mockReturnValue({
+      availableTokens: [
+        {
+          address: TOKEN_ADDRESS_1_MOCK,
+          chainId: CHAIN_ID_1_MOCK,
+          fiat: { balance: 10 },
+        },
+        {
+          address: TOKEN_ADDRESS_2_MOCK,
+          chainId: CHAIN_ID_2_MOCK,
+          fiat: { balance: 20 },
+        },
+      ] as AssetType[],
+      hasTokens: true,
+    });
+
+    runHook();
+
+    expect(setPayTokenMock).toHaveBeenCalledWith({
+      address: TOKEN_ADDRESS_2_MOCK,
+      chainId: CHAIN_ID_2_MOCK,
+    });
+  });
+
+  it('falls back to first available token when no preferred tokens meet minimum balance', () => {
+    selectMetaMaskPayTokensFlagsMock.mockReturnValue({
+      preferredTokens: {
+        default: [],
+        overrides: {
+          perpsDeposit: [
+            {
+              address: TOKEN_ADDRESS_1_MOCK,
+              chainId: CHAIN_ID_1_MOCK,
+              successRate: 0.95,
+            },
+          ],
+        },
+      },
+      minimumRequiredTokenBalance: 100,
+    });
+
+    useTransactionPayAvailableTokensMock.mockReturnValue({
+      availableTokens: [
+        {
+          address: TOKEN_ADDRESS_1_MOCK,
+          chainId: CHAIN_ID_1_MOCK,
+          fiat: { balance: 5 },
+        },
+        {
+          address: TOKEN_ADDRESS_2_MOCK,
+          chainId: CHAIN_ID_2_MOCK,
+          fiat: { balance: 50 },
+        },
+      ] as AssetType[],
+      hasTokens: true,
+    });
+
+    runHook();
+
+    expect(setPayTokenMock).toHaveBeenCalledWith({
+      address: TOKEN_ADDRESS_1_MOCK,
+      chainId: CHAIN_ID_1_MOCK,
+    });
+  });
+
+  it('uses override tokens for predict deposit transactions', () => {
+    const predictStateMock = merge(
+      {},
+      simpleSendTransactionControllerMock,
+      transactionApprovalControllerMock,
+      {
+        engine: {
+          backgroundState: {
+            TransactionController: {
+              transactions: [
+                {
+                  type: TransactionType.predictDeposit,
+                },
+              ],
+            },
+          },
+        },
+      },
+    );
+
+    selectMetaMaskPayTokensFlagsMock.mockReturnValue({
+      preferredTokens: {
+        default: [],
+        overrides: {
+          predictDeposit: [
+            {
+              address: TOKEN_ADDRESS_2_MOCK,
+              chainId: CHAIN_ID_2_MOCK,
+              successRate: 0.9,
+            },
+          ],
+          perpsDeposit: [
+            {
+              address: TOKEN_ADDRESS_3_MOCK,
+              chainId: CHAIN_ID_2_MOCK,
+              successRate: 0.8,
+            },
+          ],
+        },
+      },
+      minimumRequiredTokenBalance: 0,
+    });
+
+    useTransactionPayAvailableTokensMock.mockReturnValue({
+      availableTokens: [
+        {
+          address: TOKEN_ADDRESS_1_MOCK,
+          chainId: CHAIN_ID_1_MOCK,
+          fiat: { balance: 10 },
+        },
+        {
+          address: TOKEN_ADDRESS_2_MOCK,
+          chainId: CHAIN_ID_2_MOCK,
+          fiat: { balance: 10 },
+        },
+      ] as AssetType[],
+      hasTokens: true,
+    });
+
+    renderHookWithProvider(() => useAutomaticTransactionPayToken(), {
+      state: predictStateMock,
+    });
+
+    expect(setPayTokenMock).toHaveBeenCalledWith({
+      address: TOKEN_ADDRESS_2_MOCK,
+      chainId: CHAIN_ID_2_MOCK,
+    });
+  });
+
+  it('treats missing fiat balance as 0 for minimum balance check', () => {
+    selectMetaMaskPayTokensFlagsMock.mockReturnValue({
+      preferredTokens: {
+        default: [],
+        overrides: {
+          perpsDeposit: [
+            {
+              address: TOKEN_ADDRESS_1_MOCK,
+              chainId: CHAIN_ID_1_MOCK,
+              successRate: 0.95,
+            },
+            {
+              address: TOKEN_ADDRESS_2_MOCK,
+              chainId: CHAIN_ID_2_MOCK,
+              successRate: 0.7,
+            },
+          ],
+        },
+      },
+      minimumRequiredTokenBalance: 5,
+    });
+
+    useTransactionPayAvailableTokensMock.mockReturnValue({
+      availableTokens: [
+        {
+          address: TOKEN_ADDRESS_1_MOCK,
+          chainId: CHAIN_ID_1_MOCK,
+        },
+        {
+          address: TOKEN_ADDRESS_2_MOCK,
+          chainId: CHAIN_ID_2_MOCK,
+          fiat: { balance: 10 },
+        },
+      ] as AssetType[],
+      hasTokens: true,
+    });
+
+    runHook();
+
+    expect(setPayTokenMock).toHaveBeenCalledWith({
+      address: TOKEN_ADDRESS_2_MOCK,
+      chainId: CHAIN_ID_2_MOCK,
+    });
+  });
 });
diff --git a/app/components/Views/confirmations/hooks/pay/useAutomaticTransactionPayToken.ts b/app/components/Views/confirmations/hooks/pay/useAutomaticTransactionPayToken.ts
index ad3084483131..fa5b427e67db 100644
--- a/app/components/Views/confirmations/hooks/pay/useAutomaticTransactionPayToken.ts
+++ b/app/components/Views/confirmations/hooks/pay/useAutomaticTransactionPayToken.ts
@@ -9,6 +9,12 @@ import { useTransactionPayRequiredTokens } from './useTransactionPayData';
 import { useTransactionPayAvailableTokens } from './useTransactionPayAvailableTokens';
 import { AssetType } from '../../types/token';
 import { isTransactionPayWithdraw } from '../../utils/transaction';
+import { useSelector } from 'react-redux';
+import {
+  selectMetaMaskPayTokensFlags,
+  PreferredToken,
+  getPreferredTokensForTransactionType,
+} from '../../../../../selectors/featureFlagController/confirmations';
 
 export interface SetPayTokenRequest {
   address: Hex;
@@ -28,14 +34,18 @@ export function useAutomaticTransactionPayToken({
   const { setPayToken } = useTransactionPayToken();
   const requiredTokens = useTransactionPayRequiredTokens();
   const { availableTokens: tokens } = useTransactionPayAvailableTokens();
+  const payTokensFlags = useSelector(selectMetaMaskPayTokensFlags);
 
   const tokensWithBalance = useMemo(
     () => tokens.filter((t) => !t.disabled),
     [tokens],
   );
 
-  const transactionMeta =
-    useTransactionMetadataRequest() ?? ({ txParams: {} } as TransactionMeta);
+  const transactionMetaRequest = useTransactionMetadataRequest();
+  const transactionMeta = useMemo(
+    () => transactionMetaRequest ?? ({ txParams: {} } as TransactionMeta),
+    [transactionMetaRequest],
+  );
 
   const {
     txParams: { from },
@@ -51,6 +61,15 @@ export function useAutomaticTransactionPayToken({
     [requiredTokens],
   );
 
+  const preferredTokensFromFlags = useMemo(
+    () =>
+      getPreferredTokensForTransactionType(
+        payTokensFlags.preferredTokens,
+        transactionMeta.type,
+      ),
+    [transactionMeta.type, payTokensFlags.preferredTokens],
+  );
+
   // For withdrawals, skip auto-selection — the default token is derived
   // from required tokens and shown via PayWithRow
   const isWithdraw = isTransactionPayWithdraw(transactionMeta);
@@ -65,6 +84,8 @@ export function useAutomaticTransactionPayToken({
       targetToken,
       tokens: tokensWithBalance,
       preferredToken,
+      preferredTokensFromFlags,
+      minimumRequiredTokenBalance: payTokensFlags.minimumRequiredTokenBalance,
     });
 
     if (!automaticToken) {
@@ -84,7 +105,9 @@ export function useAutomaticTransactionPayToken({
     disable,
     isHardwareWallet,
     isWithdraw,
+    payTokensFlags.minimumRequiredTokenBalance,
     preferredToken,
+    preferredTokensFromFlags,
     requiredTokens,
     setPayToken,
     targetToken,
@@ -95,11 +118,15 @@ export function useAutomaticTransactionPayToken({
 function getBestToken({
   isHardwareWallet,
   preferredToken,
+  preferredTokensFromFlags,
+  minimumRequiredTokenBalance,
   targetToken,
   tokens,
 }: {
   isHardwareWallet: boolean;
   preferredToken?: SetPayTokenRequest;
+  preferredTokensFromFlags: PreferredToken[];
+  minimumRequiredTokenBalance: number;
   targetToken?: { address: Hex; chainId: Hex };
   tokens: AssetType[];
 }): { address: Hex; chainId: Hex } | undefined {
@@ -126,6 +153,31 @@ function getBestToken({
     }
   }
 
+  if (preferredTokensFromFlags.length) {
+    const sorted = [...preferredTokensFromFlags].sort(
+      (a, b) => b.successRate - a.successRate,
+    );
+
+    for (const preferred of sorted) {
+      const matchingToken = tokens.find(
+        (token) =>
+          token.address.toLowerCase() === preferred.address.toLowerCase() &&
+          token.chainId?.toLowerCase() === preferred.chainId.toLowerCase(),
+      );
+
+      if (matchingToken) {
+        const fiatBalance = matchingToken.fiat?.balance ?? 0;
+
+        if (fiatBalance >= minimumRequiredTokenBalance) {
+          return {
+            address: matchingToken.address as Hex,
+            chainId: matchingToken.chainId as Hex,
+          };
+        }
+      }
+    }
+  }
+
   if (tokens?.length) {
     return {
       address: tokens[0].address as Hex,
diff --git a/app/components/Views/confirmations/hooks/pay/useTransactionPayPostQuote.test.ts b/app/components/Views/confirmations/hooks/pay/useTransactionPayPostQuote.test.ts
index 49432d76b242..9da1a56aa964 100644
--- a/app/components/Views/confirmations/hooks/pay/useTransactionPayPostQuote.test.ts
+++ b/app/components/Views/confirmations/hooks/pay/useTransactionPayPostQuote.test.ts
@@ -1,8 +1,10 @@
 import { renderHook } from '@testing-library/react-hooks';
+import type { Hex } from '@metamask/utils';
 import { useTransactionPayPostQuote } from './useTransactionPayPostQuote';
 import { useTransactionMetadataRequest } from '../transactions/useTransactionMetadataRequest';
 import { useTransactionPayWithdraw } from './useTransactionPayWithdraw';
 import Engine from '../../../../../core/Engine';
+import { computeProxyAddress } from '../../../../UI/Predict/providers/polymarket/safe/utils';
 
 jest.mock('../transactions/useTransactionMetadataRequest');
 jest.mock('./useTransactionPayWithdraw');
@@ -13,8 +15,13 @@ jest.mock('../../../../../core/Engine', () => ({
     },
   },
 }));
+jest.mock('../../../../UI/Predict/providers/polymarket/safe/utils', () => ({
+  computeProxyAddress: jest.fn(),
+}));
 
 const TRANSACTION_ID_MOCK = 'transaction-123';
+const FROM_MOCK = '0x1234567890123456789012345678901234567890' as Hex;
+const PROXY_ADDRESS_MOCK = '0xabcdefabcdefabcdefabcdefabcdefabcdefabcd' as Hex;
 
 describe('useTransactionPayPostQuote', () => {
   const useTransactionMetadataRequestMock = jest.mocked(
@@ -24,9 +31,11 @@ describe('useTransactionPayPostQuote', () => {
   const setTransactionConfigMock = jest.mocked(
     Engine.context.TransactionPayController.setTransactionConfig,
   );
+  const computeProxyAddressMock = jest.mocked(computeProxyAddress);
 
   beforeEach(() => {
     jest.clearAllMocks();
+    computeProxyAddressMock.mockReturnValue(PROXY_ADDRESS_MOCK);
     useTransactionPayWithdrawMock.mockReturnValue({
       isWithdraw: false,
       canSelectWithdrawToken: false,
@@ -60,6 +69,7 @@ describe('useTransactionPayPostQuote', () => {
   it('sets isPostQuote when canSelectWithdrawToken is true and transactionId exists', () => {
     useTransactionMetadataRequestMock.mockReturnValue({
       id: TRANSACTION_ID_MOCK,
+      txParams: { from: FROM_MOCK },
     } as never);
     useTransactionPayWithdrawMock.mockReturnValue({
       isWithdraw: true,
@@ -74,9 +84,54 @@ describe('useTransactionPayPostQuote', () => {
     );
   });
 
+  it('sets isPostQuote=true and refundTo=proxyAddress in config callback', () => {
+    useTransactionMetadataRequestMock.mockReturnValue({
+      id: TRANSACTION_ID_MOCK,
+      txParams: { from: FROM_MOCK },
+    } as never);
+    useTransactionPayWithdrawMock.mockReturnValue({
+      isWithdraw: true,
+      canSelectWithdrawToken: true,
+    });
+
+    renderHook(() => useTransactionPayPostQuote());
+
+    expect(computeProxyAddressMock).toHaveBeenCalledWith(FROM_MOCK);
+
+    const callback = setTransactionConfigMock.mock.calls[0][1];
+    const config = {} as { isPostQuote?: boolean; refundTo?: Hex };
+    callback(config);
+
+    expect(config.isPostQuote).toBe(true);
+    expect(config.refundTo).toBe(PROXY_ADDRESS_MOCK);
+  });
+
+  it('sets refundTo=undefined when txParams.from is missing', () => {
+    useTransactionMetadataRequestMock.mockReturnValue({
+      id: TRANSACTION_ID_MOCK,
+      txParams: {},
+    } as never);
+    useTransactionPayWithdrawMock.mockReturnValue({
+      isWithdraw: true,
+      canSelectWithdrawToken: true,
+    });
+
+    renderHook(() => useTransactionPayPostQuote());
+
+    expect(computeProxyAddressMock).not.toHaveBeenCalled();
+
+    const callback = setTransactionConfigMock.mock.calls[0][1];
+    const config = {} as { isPostQuote?: boolean; refundTo?: Hex };
+    callback(config);
+
+    expect(config.isPostQuote).toBe(true);
+    expect(config.refundTo).toBeUndefined();
+  });
+
   it('does not call setTransactionConfig twice for the same transactionId', () => {
     useTransactionMetadataRequestMock.mockReturnValue({
       id: TRANSACTION_ID_MOCK,
+      txParams: { from: FROM_MOCK },
     } as never);
     useTransactionPayWithdrawMock.mockReturnValue({
       isWithdraw: true,
@@ -113,6 +168,7 @@ describe('useTransactionPayPostQuote', () => {
     });
     useTransactionMetadataRequestMock.mockReturnValue({
       id: TRANSACTION_ID_MOCK,
+      txParams: { from: FROM_MOCK },
     } as never);
 
     const { rerender } = renderHook(() => useTransactionPayPostQuote());
@@ -120,6 +176,7 @@ describe('useTransactionPayPostQuote', () => {
 
     useTransactionMetadataRequestMock.mockReturnValue({
       id: 'transaction-456',
+      txParams: { from: FROM_MOCK },
     } as never);
     rerender();
 
diff --git a/app/components/Views/confirmations/hooks/pay/useTransactionPayPostQuote.ts b/app/components/Views/confirmations/hooks/pay/useTransactionPayPostQuote.ts
index 305311b2f33f..99100868fb0e 100644
--- a/app/components/Views/confirmations/hooks/pay/useTransactionPayPostQuote.ts
+++ b/app/components/Views/confirmations/hooks/pay/useTransactionPayPostQuote.ts
@@ -1,8 +1,9 @@
 import { useEffect, useRef } from 'react';
 import Engine from '../../../../../core/Engine';
-import { createProjectLogger } from '@metamask/utils';
+import { createProjectLogger, type Hex } from '@metamask/utils';
 import { useTransactionPayWithdraw } from './useTransactionPayWithdraw';
 import { useTransactionMetadataRequest } from '../transactions/useTransactionMetadataRequest';
+import { computeProxyAddress } from '../../../../UI/Predict/providers/polymarket/safe/utils';
 
 const log = createProjectLogger('transaction-pay-post-quote');
 
@@ -36,20 +37,22 @@ export function useTransactionPayPostQuote(): void {
 
     try {
       const { TransactionPayController } = Engine.context;
+      const from = transactionMeta?.txParams?.from as Hex | undefined;
+      const refundTo = from ? computeProxyAddress(from) : undefined;
 
-      // Set isPostQuote=true for post-quote transactions
       TransactionPayController.setTransactionConfig(transactionId, (config) => {
         config.isPostQuote = true;
+        config.refundTo = refundTo;
       });
 
       isSet.current = transactionId;
 
-      log('Initialized post-quote transaction', { transactionId });
+      log('Initialized post-quote transaction', { transactionId, refundTo });
     } catch (error) {
       log('Error initializing post-quote transaction', {
         error,
         transactionId,
       });
     }
-  }, [canSelectWithdrawToken, transactionId]);
+  }, [canSelectWithdrawToken, transactionId, transactionMeta?.txParams?.from]);
 }
diff --git a/app/components/Views/confirmations/legacy/components/AddressElement/__snapshots__/AddressElement.test.tsx.snap b/app/components/Views/confirmations/legacy/components/AddressElement/__snapshots__/AddressElement.test.tsx.snap
index b4df1759cf26..9a76a117629d 100644
--- a/app/components/Views/confirmations/legacy/components/AddressElement/__snapshots__/AddressElement.test.tsx.snap
+++ b/app/components/Views/confirmations/legacy/components/AddressElement/__snapshots__/AddressElement.test.tsx.snap
@@ -22,7 +22,7 @@ exports[`AddressElement should render correctly 1`] = `
     <View
       placeholderStyle={
         {
-          "backgroundColor": "#f3f5f9",
+          "backgroundColor": "#f3f3f4",
         }
       }
       useNativeDriver={true}
@@ -69,7 +69,7 @@ exports[`AddressElement should render correctly 1`] = `
                 "backgroundColor": "#eee",
               },
               {
-                "backgroundColor": "#f3f5f9",
+                "backgroundColor": "#f3f3f4",
               },
             ]
           }
@@ -99,7 +99,7 @@ exports[`AddressElement should render correctly 1`] = `
         numberOfLines={1}
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "flex": 1,
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
diff --git a/app/components/Views/confirmations/legacy/components/AddressList/__snapshots__/AddressList.test.tsx.snap b/app/components/Views/confirmations/legacy/components/AddressList/__snapshots__/AddressList.test.tsx.snap
index 486bceb1c81c..c320a7095e18 100644
--- a/app/components/Views/confirmations/legacy/components/AddressList/__snapshots__/AddressList.test.tsx.snap
+++ b/app/components/Views/confirmations/legacy/components/AddressList/__snapshots__/AddressList.test.tsx.snap
@@ -56,9 +56,9 @@ exports[`AddressList renders correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "fontFamily": "Geist-Medium",
-              "fontSize": 18,
+              "fontSize": 20,
               "letterSpacing": 0,
               "lineHeight": 24,
               "marginHorizontal": 16,
@@ -158,7 +158,7 @@ exports[`AddressList renders correctly 1`] = `
                       <View
                         placeholderStyle={
                           {
-                            "backgroundColor": "#f3f5f9",
+                            "backgroundColor": "#f3f3f4",
                           }
                         }
                         useNativeDriver={true}
@@ -205,7 +205,7 @@ exports[`AddressList renders correctly 1`] = `
                                   "backgroundColor": "#eee",
                                 },
                                 {
-                                  "backgroundColor": "#f3f5f9",
+                                  "backgroundColor": "#f3f3f4",
                                 },
                               ]
                             }
@@ -235,7 +235,7 @@ exports[`AddressList renders correctly 1`] = `
                           numberOfLines={1}
                           style={
                             {
-                              "color": "#121314",
+                              "color": "#131416",
                               "flex": 1,
                               "fontFamily": "Geist-Regular",
                               "fontSize": 16,
@@ -252,7 +252,7 @@ exports[`AddressList renders correctly 1`] = `
                         numberOfLines={1}
                         style={
                           {
-                            "color": "#686e7d",
+                            "color": "#66676a",
                             "fontFamily": "Geist-Regular",
                             "fontSize": 16,
                             "letterSpacing": 0,
diff --git a/app/components/Views/confirmations/legacy/components/Approval/ApprovalFlowLoader/__snapshots__/index.test.tsx.snap b/app/components/Views/confirmations/legacy/components/Approval/ApprovalFlowLoader/__snapshots__/index.test.tsx.snap
index 5493ef2dc53b..4e7d5c7c100f 100644
--- a/app/components/Views/confirmations/legacy/components/Approval/ApprovalFlowLoader/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/confirmations/legacy/components/Approval/ApprovalFlowLoader/__snapshots__/index.test.tsx.snap
@@ -23,7 +23,7 @@ exports[`ApprovalFlowLoader should render correctly 1`] = `
     <View
       style={
         {
-          "borderColor": "#f3f5f9",
+          "borderColor": "#f3f3f4",
           "borderRadius": 64,
           "borderWidth": 3.5,
           "height": 36,
@@ -76,7 +76,7 @@ exports[`ApprovalFlowLoader should render correctly 1`] = `
     style={
       [
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 30,
           "marginVertical": 2,
@@ -94,7 +94,7 @@ exports[`ApprovalFlowLoader should render correctly 1`] = `
         undefined,
         undefined,
         {
-          "color": "#121314",
+          "color": "#131416",
         },
         undefined,
         undefined,
diff --git a/app/components/Views/confirmations/legacy/components/Approval/TemplateConfirmation/Templates/__snapshots__/ApprovalResult.test.tsx.snap b/app/components/Views/confirmations/legacy/components/Approval/TemplateConfirmation/Templates/__snapshots__/ApprovalResult.test.tsx.snap
index fd6cf96c21fc..e82a68c0a6d7 100644
--- a/app/components/Views/confirmations/legacy/components/Approval/TemplateConfirmation/Templates/__snapshots__/ApprovalResult.test.tsx.snap
+++ b/app/components/Views/confirmations/legacy/components/Approval/TemplateConfirmation/Templates/__snapshots__/ApprovalResult.test.tsx.snap
@@ -25,7 +25,7 @@ exports[`ApprovalResult renders approval result with error type 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -93,9 +93,9 @@ exports[`ApprovalResult renders approval result with error type 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Bold",
-            "fontSize": 18,
+            "fontSize": 20,
             "letterSpacing": 0,
             "lineHeight": 24,
           }
@@ -116,7 +116,7 @@ exports[`ApprovalResult renders approval result with error type 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -130,7 +130,7 @@ exports[`ApprovalResult renders approval result with error type 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -173,7 +173,7 @@ exports[`ApprovalResult renders approval result with error type 1`] = `
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "flex": 1,
             "flexDirection": "row",
@@ -230,7 +230,7 @@ exports[`ApprovalResult renders approval result with success type 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -298,9 +298,9 @@ exports[`ApprovalResult renders approval result with success type 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Bold",
-            "fontSize": 18,
+            "fontSize": 20,
             "letterSpacing": 0,
             "lineHeight": 24,
           }
@@ -321,7 +321,7 @@ exports[`ApprovalResult renders approval result with success type 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -335,7 +335,7 @@ exports[`ApprovalResult renders approval result with success type 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 16,
             "letterSpacing": 0,
@@ -378,7 +378,7 @@ exports[`ApprovalResult renders approval result with success type 1`] = `
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "flex": 1,
             "flexDirection": "row",
diff --git a/app/components/Views/confirmations/legacy/components/Approval/TemplateConfirmation/__snapshots__/TemplateConfirmation.test.tsx.snap b/app/components/Views/confirmations/legacy/components/Approval/TemplateConfirmation/__snapshots__/TemplateConfirmation.test.tsx.snap
index 5e99268e1acc..2e9a7ee7265a 100644
--- a/app/components/Views/confirmations/legacy/components/Approval/TemplateConfirmation/__snapshots__/TemplateConfirmation.test.tsx.snap
+++ b/app/components/Views/confirmations/legacy/components/Approval/TemplateConfirmation/__snapshots__/TemplateConfirmation.test.tsx.snap
@@ -18,7 +18,7 @@ exports[`TemplateConfirmation renders content and actions 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
@@ -59,7 +59,7 @@ exports[`TemplateConfirmation renders content and actions 1`] = `
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#121314",
+            "backgroundColor": "#131416",
             "borderRadius": 12,
             "flex": 1,
             "flexDirection": "row",
@@ -97,7 +97,7 @@ exports[`TemplateConfirmation renders content and actions 1`] = `
           {
             "alignItems": "center",
             "alignSelf": "flex-start",
-            "backgroundColor": "#3c4d9d0f",
+            "backgroundColor": "#b4b4b528",
             "borderColor": "transparent",
             "borderRadius": 12,
             "borderWidth": 1,
@@ -117,7 +117,7 @@ exports[`TemplateConfirmation renders content and actions 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Medium",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -151,7 +151,7 @@ exports[`TemplateConfirmation renders content without actions 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
diff --git a/app/components/Views/confirmations/legacy/components/ApproveTransactionHeader/__snapshots__/ApproveTransactionHeader.test.tsx.snap b/app/components/Views/confirmations/legacy/components/ApproveTransactionHeader/__snapshots__/ApproveTransactionHeader.test.tsx.snap
index ab980a4e13d3..64ea1375b36b 100644
--- a/app/components/Views/confirmations/legacy/components/ApproveTransactionHeader/__snapshots__/ApproveTransactionHeader.test.tsx.snap
+++ b/app/components/Views/confirmations/legacy/components/ApproveTransactionHeader/__snapshots__/ApproveTransactionHeader.test.tsx.snap
@@ -15,7 +15,7 @@ exports[`ApproveTransactionHeader should render correctly 1`] = `
         "alignItems": "center",
         "alignSelf": "center",
         "backgroundColor": "#ffffff",
-        "borderColor": "#b7bbc8",
+        "borderColor": "#949596",
         "borderRadius": 99,
         "borderWidth": 1,
         "flexDirection": "row",
@@ -61,7 +61,7 @@ exports[`ApproveTransactionHeader should render correctly 1`] = `
       accessibilityRole="text"
       style={
         {
-          "color": "#686e7d",
+          "color": "#66676a",
           "flexShrink": 1,
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
@@ -77,7 +77,7 @@ exports[`ApproveTransactionHeader should render correctly 1`] = `
     style={
       {
         "backgroundColor": "#ffffff",
-        "borderColor": "#b7bbc8",
+        "borderColor": "#949596",
         "borderRadius": 4,
         "borderWidth": 1,
         "flexDirection": "row",
@@ -224,7 +224,7 @@ exports[`ApproveTransactionHeader should render correctly 1`] = `
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 14,
                 "letterSpacing": 0,
@@ -247,7 +247,7 @@ exports[`ApproveTransactionHeader should render correctly 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Bold",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -265,7 +265,7 @@ exports[`ApproveTransactionHeader should render correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 14,
               "letterSpacing": 0,
@@ -280,7 +280,7 @@ exports[`ApproveTransactionHeader should render correctly 1`] = `
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Bold",
               "fontSize": 16,
               "letterSpacing": 0,
@@ -309,7 +309,7 @@ exports[`ApproveTransactionHeader should return origin to be null when not prese
     style={
       {
         "backgroundColor": "#ffffff",
-        "borderColor": "#b7bbc8",
+        "borderColor": "#949596",
         "borderRadius": 4,
         "borderWidth": 1,
         "flexDirection": "row",
@@ -456,7 +456,7 @@ exports[`ApproveTransactionHeader should return origin to be null when not prese
             accessibilityRole="text"
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Regular",
                 "fontSize": 14,
                 "letterSpacing": 0,
@@ -479,7 +479,7 @@ exports[`ApproveTransactionHeader should return origin to be null when not prese
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Bold",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -497,7 +497,7 @@ exports[`ApproveTransactionHeader should return origin to be null when not prese
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Regular",
               "fontSize": 14,
               "letterSpacing": 0,
@@ -512,7 +512,7 @@ exports[`ApproveTransactionHeader should return origin to be null when not prese
           accessibilityRole="text"
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontFamily": "Geist-Bold",
               "fontSize": 16,
               "letterSpacing": 0,
diff --git a/app/components/Views/confirmations/legacy/components/CustomNonceModal/__snapshots__/index.test.tsx.snap b/app/components/Views/confirmations/legacy/components/CustomNonceModal/__snapshots__/index.test.tsx.snap
index 3d1a190bda0b..bd2f363fb222 100644
--- a/app/components/Views/confirmations/legacy/components/CustomNonceModal/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/confirmations/legacy/components/CustomNonceModal/__snapshots__/index.test.tsx.snap
@@ -7,7 +7,7 @@ exports[`CustomNonceModal renders correctly 1`] = `
   animationOut="slideOutDown"
   animationOutTiming={600}
   avoidKeyboard={false}
-  backdropColor="#3f434a66"
+  backdropColor="#0a0d135c"
   backdropOpacity={1}
   backdropTransitionInTiming={300}
   backdropTransitionOutTiming={300}
@@ -86,7 +86,7 @@ exports[`CustomNonceModal renders correctly 1`] = `
           centered={true}
           style={
             {
-              "color": "#121314",
+              "color": "#131416",
               "fontSize": 14,
             }
           }
@@ -114,12 +114,12 @@ exports[`CustomNonceModal renders correctly 1`] = `
             onChangeText={[Function]}
             onSubmitEditing={[Function]}
             placeholder="26"
-            placeholderTextColor="#b7bbc8"
+            placeholderTextColor="#babbbe"
             showSoftInputOnFocus={false}
             spellCheck={false}
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontFamily": "Geist-Bold",
                 "fontSize": 36,
                 "marginHorizontal": 24,
@@ -135,7 +135,7 @@ exports[`CustomNonceModal renders correctly 1`] = `
           centered={true}
           style={
             {
-              "color": "#686e7d",
+              "color": "#66676a",
               "fontSize": 14,
               "marginBottom": 10,
             }
@@ -211,7 +211,7 @@ exports[`CustomNonceModal renders correctly 1`] = `
             bold={true}
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontSize": 12,
                 "lineHeight": 16,
                 "marginVertical": 10,
@@ -223,7 +223,7 @@ exports[`CustomNonceModal renders correctly 1`] = `
           <Text
             style={
               {
-                "color": "#121314",
+                "color": "#131416",
                 "fontSize": 12,
                 "lineHeight": 16,
                 "marginVertical": 10,
diff --git a/app/components/Views/confirmations/legacy/components/EditGasFeeLegacyUpdate/__snapshots__/EditGasFeeLegacyUpdate.test.tsx.snap b/app/components/Views/confirmations/legacy/components/EditGasFeeLegacyUpdate/__snapshots__/EditGasFeeLegacyUpdate.test.tsx.snap
index 39e42e752d83..8ac551743e9e 100644
--- a/app/components/Views/confirmations/legacy/components/EditGasFeeLegacyUpdate/__snapshots__/EditGasFeeLegacyUpdate.test.tsx.snap
+++ b/app/components/Views/confirmations/legacy/components/EditGasFeeLegacyUpdate/__snapshots__/EditGasFeeLegacyUpdate.test.tsx.snap
@@ -64,7 +64,7 @@ exports[`EditGasFeeLegacyUpdate should match snapshot 1`] = `
                 style={
                   [
                     {
-                      "color": "#121314",
+                      "color": "#131416",
                       "fontSize": 24,
                     },
                     undefined,
@@ -84,7 +84,7 @@ exports[`EditGasFeeLegacyUpdate should match snapshot 1`] = `
               accessibilityRole="text"
               style={
                 {
-                  "color": "#121314",
+                  "color": "#131416",
                   "fontFamily": "Geist-Bold",
                   "fontSize": 16,
                   "letterSpacing": 0,
@@ -213,7 +213,7 @@ exports[`EditGasFeeLegacyUpdate should match snapshot 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#121314",
+                    "color": "#131416",
                     "fontFamily": "Geist-Bold",
                     "fontSize": 32,
                     "letterSpacing": 0,
@@ -235,9 +235,9 @@ exports[`EditGasFeeLegacyUpdate should match snapshot 1`] = `
                 accessibilityRole="text"
                 style={
                   {
-                    "color": "#686e7d",
+                    "color": "#66676a",
                     "fontFamily": "Geist-Medium",
-                    "fontSize": 18,
+                    "fontSize": 20,
                     "letterSpacing": 0,
                     "lineHeight": 24,
                   }
@@ -277,7 +277,7 @@ exports[`EditGasFeeLegacyUpdate should match snapshot 1`] = `
                       accessibilityRole="text"
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Bold",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -309,7 +309,7 @@ exports[`EditGasFeeLegacyUpdate should match snapshot 1`] = `
                               "fontSize": 14,
                             },
                             {
-                              "color": "#b7bbc8",
+                              "color": "#babbbe",
                             },
                             {
                               "fontFamily": "Material Design Icons",
@@ -329,7 +329,7 @@ exports[`EditGasFeeLegacyUpdate should match snapshot 1`] = `
                   style={
                     {
                       "alignItems": "center",
-                      "borderColor": "#b7bbc8",
+                      "borderColor": "#949596",
                       "borderRadius": 6,
                       "borderWidth": 1,
                       "flexDirection": "row",
@@ -411,7 +411,7 @@ exports[`EditGasFeeLegacyUpdate should match snapshot 1`] = `
                       onChangeText={[Function]}
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "height": 38,
                           "minWidth": 10,
                           "paddingRight": 6,
@@ -437,7 +437,7 @@ exports[`EditGasFeeLegacyUpdate should match snapshot 1`] = `
                       style={
                         [
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "fontFamily": "Geist-Regular",
                             "fontSize": 30,
                             "marginVertical": 2,
@@ -558,7 +558,7 @@ exports[`EditGasFeeLegacyUpdate should match snapshot 1`] = `
                       accessibilityRole="text"
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "fontFamily": "Geist-Bold",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -573,7 +573,7 @@ exports[`EditGasFeeLegacyUpdate should match snapshot 1`] = `
                       accessibilityRole="text"
                       style={
                         {
-                          "color": "#686e7d",
+                          "color": "#66676a",
                           "fontFamily": "Geist-Regular",
                           "fontSize": 16,
                           "letterSpacing": 0,
@@ -604,7 +604,7 @@ exports[`EditGasFeeLegacyUpdate should match snapshot 1`] = `
                               "fontSize": 14,
                             },
                             {
-                              "color": "#b7bbc8",
+                              "color": "#babbbe",
                             },
                             {
                               "fontFamily": "Material Design Icons",
@@ -624,7 +624,7 @@ exports[`EditGasFeeLegacyUpdate should match snapshot 1`] = `
                   style={
                     {
                       "alignItems": "center",
-                      "borderColor": "#b7bbc8",
+                      "borderColor": "#949596",
                       "borderRadius": 6,
                       "borderWidth": 1,
                       "flexDirection": "row",
@@ -706,7 +706,7 @@ exports[`EditGasFeeLegacyUpdate should match snapshot 1`] = `
                       onChangeText={[Function]}
                       style={
                         {
-                          "color": "#121314",
+                          "color": "#131416",
                           "height": 38,
                           "minWidth": 10,
                           "paddingRight": 6,
@@ -732,7 +732,7 @@ exports[`EditGasFeeLegacyUpdate should match snapshot 1`] = `
                       style={
                         [
                           {
-                            "color": "#121314",
+                            "color": "#131416",
                             "fontFamily": "Geist-Regular",
                             "fontSize": 30,
                             "marginVertical": 2,
diff --git a/app/components/Views/confirmations/legacy/components/ErrorMessage/__snapshots__/index.test.tsx.snap b/app/components/Views/confirmations/legacy/components/ErrorMessage/__snapshots__/index.test.tsx.snap
index 19bb4b0b1c5a..7d93fc606b89 100644
--- a/app/components/Views/confirmations/legacy/components/ErrorMessage/__snapshots__/index.test.tsx.snap
+++ b/app/components/Views/confirmations/legacy/components/ErrorMessage/__snapshots__/index.test.tsx.snap
@@ -25,7 +25,7 @@ exports[`ErrorMessage should render correctly 1`] = `
       style={
         [
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Regular",
             "fontSize": 30,
             "marginVertical": 2,
@@ -57,7 +57,7 @@ exports[`ErrorMessage should render correctly 1`] = `
           undefined,
           [
             {
-              "color": "#121314",
+              "color": "#131416",
               "flex": 1,
               "fontSize": 14,
               "lineHeight": 17,
diff --git a/app/components/hooks/useAnalytics/__mocks__/useAnalytics.ts b/app/components/hooks/useAnalytics/__mocks__/useAnalytics.ts
index 4cb8626e51b1..9bc74ec3cd98 100644
--- a/app/components/hooks/useAnalytics/__mocks__/useAnalytics.ts
+++ b/app/components/hooks/useAnalytics/__mocks__/useAnalytics.ts
@@ -11,6 +11,7 @@ export const useAnalytics = jest.fn(() => ({
     build: jest.fn().mockReturnValue({}),
   })),
   enable: jest.fn().mockResolvedValue(undefined),
+  identify: jest.fn().mockResolvedValue(undefined),
   addTraitsToUser: jest.fn().mockResolvedValue(undefined),
   createDataDeletionTask: jest.fn().mockResolvedValue({}),
   checkDataDeleteStatus: jest.fn().mockResolvedValue({}),
diff --git a/app/components/hooks/useAnalytics/useAnalytics.test.tsx b/app/components/hooks/useAnalytics/useAnalytics.test.tsx
index f90f75227fe9..39d7c8b94462 100644
--- a/app/components/hooks/useAnalytics/useAnalytics.test.tsx
+++ b/app/components/hooks/useAnalytics/useAnalytics.test.tsx
@@ -216,7 +216,18 @@ describe('useAnalytics', () => {
     expect(analytics.optOut).toHaveBeenCalledTimes(1);
   });
 
-  it('calls analytics identify with traits', async () => {
+  it('calls analytics identify via identify()', async () => {
+    const userTraits = { test: 'value' };
+    const { result } = renderHook(() => useAnalytics());
+
+    await act(async () => {
+      await result.current.identify(userTraits);
+    });
+
+    expect(analytics.identify).toHaveBeenCalledWith(userTraits);
+  });
+
+  it('calls analytics identify via deprecated addTraitsToUser()', async () => {
     const userTraits = { test: 'value' };
     const { result } = renderHook(() => useAnalytics());
 
diff --git a/app/components/hooks/useAnalytics/useAnalytics.ts b/app/components/hooks/useAnalytics/useAnalytics.ts
index 24a50e0bf354..a5dbece02193 100644
--- a/app/components/hooks/useAnalytics/useAnalytics.ts
+++ b/app/components/hooks/useAnalytics/useAnalytics.ts
@@ -82,6 +82,7 @@ import type { AnalyticsUserTraits } from '@metamask/analytics-controller';
  *   trackEvent,
  *   createEventBuilder,
  *   enable,
+ *   identify,
  *   addTraitsToUser,
  *   createDataDeletionTask,
  *   checkDataDeleteStatus,
@@ -113,6 +114,10 @@ export const useAnalytics = (): UseAnalyticsHook =>
           await analytics.optIn();
         }
       },
+      identify: async (userTraits: AnalyticsUserTraits): Promise<void> => {
+        analytics.identify(userTraits);
+      },
+      /** @deprecated Use {@link identify} instead — will be removed after consumers migrate */
       addTraitsToUser: async (
         userTraits: AnalyticsUserTraits,
       ): Promise<void> => {
diff --git a/app/components/hooks/useAnalytics/useAnalytics.types.ts b/app/components/hooks/useAnalytics/useAnalytics.types.ts
index 7af174210e30..bb388e7f23c4 100644
--- a/app/components/hooks/useAnalytics/useAnalytics.types.ts
+++ b/app/components/hooks/useAnalytics/useAnalytics.types.ts
@@ -30,6 +30,13 @@ export const SourceType = {
 export interface UseAnalyticsHook {
   isEnabled(): boolean;
   enable(enable?: boolean): Promise<void>;
+  /**
+   * Associate traits to the current user
+   */
+  identify(userTraits: AnalyticsUserTraits): Promise<void>;
+  /**
+   * @deprecated Use {@link identify} instead
+   */
   addTraitsToUser(userTraits: AnalyticsUserTraits): Promise<void>;
   trackEvent(event: AnalyticsTrackingEvent, saveDataRecording?: boolean): void;
   createDataDeletionTask(): Promise<IDeleteRegulationResponse>;
diff --git a/app/components/hooks/useOTAUpdates.test.ts b/app/components/hooks/useOTAUpdates.test.ts
index ad1a2c52d380..c202d7db8c38 100644
--- a/app/components/hooks/useOTAUpdates.test.ts
+++ b/app/components/hooks/useOTAUpdates.test.ts
@@ -4,6 +4,7 @@ import { InteractionManager } from 'react-native';
 import {
   checkForUpdateAsync,
   fetchUpdateAsync,
+  reloadAsync,
   UpdateCheckResultNotAvailableReason,
 } from 'expo-updates';
 import { useOTAUpdates } from './useOTAUpdates';
@@ -12,6 +13,7 @@ import Logger from '../../util/Logger';
 jest.mock('expo-updates', () => ({
   checkForUpdateAsync: jest.fn(),
   fetchUpdateAsync: jest.fn(),
+  reloadAsync: jest.fn().mockResolvedValue(undefined),
 }));
 
 const mockNavigate = jest.fn();
@@ -27,6 +29,11 @@ jest.mock('../../selectors/featureFlagController/otaUpdates', () => ({
   selectOtaUpdatesEnabledFlag: () => mockSelectOtaUpdatesEnabledFlag(),
 }));
 
+const mockSelectCompletedOnboarding = jest.fn();
+jest.mock('../../selectors/onboarding', () => ({
+  selectCompletedOnboarding: () => mockSelectCompletedOnboarding(),
+}));
+
 jest.mock('react-redux', () => ({
   ...jest.requireActual('react-redux'),
   useSelector: (selector: () => unknown) => selector(),
@@ -77,6 +84,7 @@ describe('useOTAUpdates', () => {
   beforeEach(() => {
     jest.clearAllMocks();
     mockSelectOtaUpdatesEnabledFlag.mockReturnValue(true);
+    mockSelectCompletedOnboarding.mockReturnValue(true);
     (global as unknown as { __DEV__: boolean }).__DEV__ = false;
   });
 
@@ -146,7 +154,8 @@ describe('useOTAUpdates', () => {
     });
   });
 
-  it('navigates to OTA update modal when a new update is available', async () => {
+  it('navigates to OTA update modal when a new update is available and user has completed onboarding', async () => {
+    mockSelectCompletedOnboarding.mockReturnValue(true);
     mockCheckForUpdateAsync.mockResolvedValue({
       isAvailable: true,
       manifest: mockManifest,
@@ -159,6 +168,10 @@ describe('useOTAUpdates', () => {
       manifest: mockManifest,
     });
 
+    const mockReloadAsync = reloadAsync as jest.MockedFunction<
+      typeof reloadAsync
+    >;
+
     renderHook(() => useOTAUpdates());
 
     await waitFor(() => {
@@ -171,6 +184,39 @@ describe('useOTAUpdates', () => {
           screen: 'OTAUpdatesModal',
         }),
       );
+      expect(mockReloadAsync).not.toHaveBeenCalled();
+    });
+  });
+
+  it('does not reload or show modal when a new update is available and user has not completed onboarding (applies on next launch)', async () => {
+    mockSelectCompletedOnboarding.mockReturnValue(false);
+    mockCheckForUpdateAsync.mockResolvedValue({
+      isAvailable: true,
+      manifest: mockManifest,
+      isRollBackToEmbedded: false,
+      reason: undefined,
+    });
+    mockFetchUpdateAsync.mockResolvedValue({
+      isNew: true,
+      isRollBackToEmbedded: false,
+      manifest: mockManifest,
+    });
+
+    const mockReloadAsync = reloadAsync as jest.MockedFunction<
+      typeof reloadAsync
+    >;
+
+    renderHook(() => useOTAUpdates());
+
+    await waitFor(() => {
+      expect(mockCheckForUpdateAsync).toHaveBeenCalledTimes(1);
+      expect(mockFetchUpdateAsync).toHaveBeenCalledTimes(1);
+      expect(mockRunAfterInteractions).toHaveBeenCalledTimes(1);
+      expect(mockReloadAsync).not.toHaveBeenCalled();
+      expect(mockNavigate).not.toHaveBeenCalled();
+      expect(mockLoggerLog).toHaveBeenCalledWith(
+        'OTA Updates: New update available on onboarding, will apply on next launch',
+      );
     });
   });
 
diff --git a/app/components/hooks/useOTAUpdates.ts b/app/components/hooks/useOTAUpdates.ts
index 15921fa1876e..bc5df8275d00 100644
--- a/app/components/hooks/useOTAUpdates.ts
+++ b/app/components/hooks/useOTAUpdates.ts
@@ -6,23 +6,26 @@ import { useNavigation } from '@react-navigation/native';
 import Logger from '../../util/Logger';
 import { createOTAUpdatesModalNavDetails } from '../UI/OTAUpdatesModal/OTAUpdatesModal';
 import { selectOtaUpdatesEnabledFlag } from '../../selectors/featureFlagController/otaUpdates';
+import { selectCompletedOnboarding } from '../../selectors/onboarding';
 /**
  * Hook to manage OTA updates based on a feature flag.
  *
  * Behavior:
  * - Runs once when the app initially opens.
  * - If the `otaUpdatesEnabled` flag is on and the app is not in development, checks for an OTA update via `checkForUpdateAsync`.
- * - When a new OTA update is downloaded (`fetchUpdateAsync().isNew === true`), navigates to the `OTAUpdatesModal` bottom sheet after interactions complete.
+ * - When a new OTA update is downloaded (`fetchUpdateAsync().isNew === true`):
+ * - If the user has not completed onboarding (e.g. fresh install, onboarding screen): the update is already fetched and will apply silently on next app launch (no reload, no modal).
+ * - If the user has completed onboarding (wallet screen): navigates to the `OTAUpdatesModal` bottom sheet after interactions complete; the modal calls `reloadAsync` when the user confirms.
  * - If no update is available or the fetched update is not new, logs and continues with the current version without blocking startup.
- *
- * This hook does not reload the app itself; the `OTAUpdatesModal` is responsible for
- * calling `reloadAsync` when the user confirms.
  */
 export const useOTAUpdates = () => {
   const otaUpdatesEnabled = useSelector(selectOtaUpdatesEnabledFlag);
+  const completedOnboarding = useSelector(selectCompletedOnboarding);
   const navigation = useNavigation();
 
   useEffect(() => {
+    const hadCompletedOnboarding = completedOnboarding;
+
     const checkForUpdates = async () => {
       if (!otaUpdatesEnabled || __DEV__) {
         return;
@@ -36,7 +39,13 @@ export const useOTAUpdates = () => {
 
           if (fetchResult.isNew) {
             InteractionManager.runAfterInteractions(() => {
-              navigation.navigate(...createOTAUpdatesModalNavDetails());
+              if (hadCompletedOnboarding) {
+                navigation.navigate(...createOTAUpdatesModalNavDetails());
+              } else {
+                Logger.log(
+                  'OTA Updates: New update available on onboarding, will apply on next launch',
+                );
+              }
             });
           } else {
             Logger.log('OTA Updates: Update fetched but not new');
@@ -53,5 +62,9 @@ export const useOTAUpdates = () => {
     };
 
     checkForUpdates();
+    // Intentionally omit completedOnboarding: we use its value at check start time
+    // so that finishing onboarding in the same session does not re-run the check
+    // and show the modal (update stays deferred to next launch).
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [navigation, otaUpdatesEnabled]);
 };
diff --git a/app/components/hooks/useOnboardingHeader.tsx b/app/components/hooks/useOnboardingHeader.tsx
index ad5969a62791..d227d3221a3c 100644
--- a/app/components/hooks/useOnboardingHeader.tsx
+++ b/app/components/hooks/useOnboardingHeader.tsx
@@ -19,7 +19,7 @@ export const useOnboardingHeader = (title: string) => {
   const renderBackButton = useCallback(
     () => (
       <ButtonIcon
-        size={ButtonIconSizes.Lg}
+        size={ButtonIconSizes.Md}
         iconName={IconName.ArrowLeft}
         accessibilityRole="button"
         accessibilityLabel="back"
diff --git a/app/constants/navigation/Routes.ts b/app/constants/navigation/Routes.ts
index 73e80137854c..d1ad254b5a9f 100644
--- a/app/constants/navigation/Routes.ts
+++ b/app/constants/navigation/Routes.ts
@@ -45,7 +45,9 @@ const Routes = {
       BUILD_QUOTE_SETTINGS: 'RampBuildQuoteSettingsModal',
       TOKEN_NOT_AVAILABLE: 'RampTokenNotAvailableModal',
       PROVIDER_SELECTION: 'RampProviderSelectionModal',
+      ERROR_DETAILS: 'RampErrorDetailsModal',
       PROCESSING_INFO: 'RampProcessingInfoModal',
+      SSN_INFO: 'RampSsnInfoModal',
     },
   },
   DEPOSIT: {
@@ -194,7 +196,6 @@ const Routes = {
     AMBIGUOUS_ADDRESS: 'AmbiguousAddress',
     BASIC_FUNCTIONALITY: 'BasicFunctionality',
     CONFIRM_TURN_ON_BACKUP_AND_SYNC: 'ConfirmTurnOnBackupAndSync',
-    RESET_NOTIFICATIONS: 'ResetNotifications',
     SDK_LOADING: 'SDKLoading',
     SDK_FEEDBACK: 'SDKFeedback',
     DATA_COLLECTION: 'DataCollection',
diff --git a/app/controllers/perps/PerpsController.test.ts b/app/controllers/perps/PerpsController.test.ts
index 3875eefac187..1fee0c0aee40 100644
--- a/app/controllers/perps/PerpsController.test.ts
+++ b/app/controllers/perps/PerpsController.test.ts
@@ -516,8 +516,8 @@ describe('PerpsController', () => {
     });
 
     it('reads current RemoteFeatureFlagController state during construction', () => {
-      // Given: A mock messenger that tracks calls
-      const mockCall = jest.fn().mockImplementation((action: string) => {
+      // Given: A messenger that returns remote feature flags state
+      const testMockCall = jest.fn().mockImplementation((action: string) => {
         if (action === 'RemoteFeatureFlagController:getState') {
           return {
             remoteFeatureFlags: {
@@ -529,24 +529,25 @@ describe('PerpsController', () => {
         }
         return undefined;
       });
+      const testMessenger = createMockMessenger({ call: testMockCall });
 
       // When: Controller is constructed
       const testController = new TestablePerpsController({
-        messenger: createMockMessenger({ call: mockCall }),
+        messenger: testMessenger,
         state: getDefaultPerpsControllerState(),
         infrastructure: createMockInfrastructure(),
       });
 
-      // Then: Should have called to get RemoteFeatureFlagController state
+      // Then: Should have called to get RemoteFeatureFlagController state via messenger
       expect(testController).toBeDefined();
-      expect(mockCall).toHaveBeenCalledWith(
+      expect(testMockCall).toHaveBeenCalledWith(
         'RemoteFeatureFlagController:getState',
       );
     });
 
     it('applies remote blocked regions when available during construction', () => {
-      // Given: Remote feature flags with blocked regions
-      const mockCall = jest.fn().mockImplementation((action: string) => {
+      // Given: Messenger that returns remote feature flags with blocked regions
+      const testMockCall = jest.fn().mockImplementation((action: string) => {
         if (action === 'RemoteFeatureFlagController:getState') {
           return {
             remoteFeatureFlags: {
@@ -561,7 +562,7 @@ describe('PerpsController', () => {
 
       // When: Controller is constructed
       const testController = new TestablePerpsController({
-        messenger: createMockMessenger({ call: mockCall }),
+        messenger: createMockMessenger({ call: testMockCall }),
         state: getDefaultPerpsControllerState(),
         infrastructure: createMockInfrastructure(),
         clientConfig: {
@@ -604,8 +605,8 @@ describe('PerpsController', () => {
     });
 
     it('never downgrade from remote to fallback regions', () => {
-      // Given: Remote feature flags with blocked regions
-      const mockCall = jest.fn().mockImplementation((action: string) => {
+      // Given: Messenger that returns remote feature flags with blocked regions
+      const testMockCall = jest.fn().mockImplementation((action: string) => {
         if (action === 'RemoteFeatureFlagController:getState') {
           return {
             remoteFeatureFlags: {
@@ -620,7 +621,7 @@ describe('PerpsController', () => {
 
       // When: Controller is constructed with both remote and fallback
       const testController = new TestablePerpsController({
-        messenger: createMockMessenger({ call: mockCall }),
+        messenger: createMockMessenger({ call: testMockCall }),
         state: getDefaultPerpsControllerState(),
         infrastructure: createMockInfrastructure(),
         clientConfig: {
@@ -643,16 +644,16 @@ describe('PerpsController', () => {
     });
 
     it('continues initialization when RemoteFeatureFlagController state call throws error', () => {
-      const mockCall = jest.fn().mockImplementation((action: string) => {
+      const testInfrastructure = createMockInfrastructure();
+      const testMockCall = jest.fn().mockImplementation((action: string) => {
         if (action === 'RemoteFeatureFlagController:getState') {
           throw new Error('RemoteFeatureFlagController not ready');
         }
         return undefined;
       });
-      const testInfrastructure = createMockInfrastructure();
 
       const testController = new TestablePerpsController({
-        messenger: createMockMessenger({ call: mockCall }),
+        messenger: createMockMessenger({ call: testMockCall }),
         state: getDefaultPerpsControllerState(),
         infrastructure: testInfrastructure,
         clientConfig: {
@@ -2388,9 +2389,9 @@ describe('PerpsController', () => {
     const mockTransactionMeta = { id: 'tx-meta-123' };
     const mockTxHash = '0xhash123';
 
-    // Local messenger mock for depositWithConfirmation tests
-    let depositMessengerMock: jest.Mock;
+    let depositInfrastructure: jest.Mocked<PerpsPlatformDependencies>;
     let depositController: TestablePerpsController;
+    let depositMockCall: jest.Mock;
 
     beforeEach(() => {
       // Mock DepositService
@@ -2402,38 +2403,42 @@ describe('PerpsController', () => {
           currentDepositId: mockDepositId,
         });
 
-      // Create a messenger mock that handles network and transaction actions
-      depositMessengerMock = jest.fn().mockImplementation((action: string) => {
-        if (action === 'RemoteFeatureFlagController:getState') {
-          return {
-            remoteFeatureFlags: {
-              perpsPerpTradingGeoBlockedCountriesV2: {
-                blockedRegions: [],
+      // Create infrastructure mock (controllers no longer on infra)
+      depositInfrastructure = createMockInfrastructure();
+
+      // Create messenger mock that handles network + transaction + account controller calls
+      depositMockCall = jest
+        .fn()
+        .mockImplementation((action: string, ..._args: unknown[]) => {
+          if (action === 'RemoteFeatureFlagController:getState') {
+            return {
+              remoteFeatureFlags: {
+                perpsPerpTradingGeoBlockedCountriesV2: { blockedRegions: [] },
               },
-            },
-          };
-        }
-        if (action === 'NetworkController:findNetworkClientIdByChainId') {
-          return mockNetworkClientId;
-        }
-        if (action === 'TransactionController:addTransaction') {
-          return Promise.resolve({
-            result: Promise.resolve(mockTxHash),
-            transactionMeta: mockTransactionMeta,
-          });
-        }
-        if (
-          action === 'AccountTreeController:getAccountsFromSelectedAccountGroup'
-        ) {
-          return [
-            {
-              address: mockTransaction.from,
-              type: 'eip155:eoa',
-            },
-          ];
-        }
-        return undefined;
-      });
+            };
+          }
+          if (
+            action ===
+            'AccountTreeController:getAccountsFromSelectedAccountGroup'
+          ) {
+            return [
+              {
+                address: '0x1234567890123456789012345678901234567890',
+                type: 'eip155:eoa',
+              },
+            ];
+          }
+          if (action === 'NetworkController:findNetworkClientIdByChainId') {
+            return mockNetworkClientId;
+          }
+          if (action === 'TransactionController:addTransaction') {
+            return Promise.resolve({
+              result: Promise.resolve(mockTxHash),
+              transactionMeta: mockTransactionMeta,
+            });
+          }
+          return undefined;
+        });
 
       Engine.context.TransactionController.estimateGasFee = jest
         .fn()
@@ -2463,11 +2468,11 @@ describe('PerpsController', () => {
         },
       };
 
-      // Create a controller with the custom messenger for this test suite
+      // Create a controller with the custom infrastructure for this test suite
       depositController = new TestablePerpsController({
-        messenger: createMockMessenger({ call: depositMessengerMock }),
+        messenger: createMockMessenger({ call: depositMockCall }),
         state: getDefaultPerpsControllerState(),
-        infrastructure: createMockInfrastructure(),
+        infrastructure: depositInfrastructure,
       });
     });
 
@@ -2515,7 +2520,7 @@ describe('PerpsController', () => {
 
       await depositController.depositWithConfirmation({ amount: '100' });
 
-      expect(depositMessengerMock).toHaveBeenCalledWith(
+      expect(depositMockCall).toHaveBeenCalledWith(
         'NetworkController:findNetworkClientIdByChainId',
         mockAssetChainId,
       );
@@ -2529,7 +2534,7 @@ describe('PerpsController', () => {
 
       await depositController.depositWithConfirmation({ amount: '100' });
 
-      expect(depositMessengerMock).toHaveBeenCalledWith(
+      expect(depositMockCall).toHaveBeenCalledWith(
         'TransactionController:addTransaction',
         mockTransaction,
         {
@@ -2579,17 +2584,28 @@ describe('PerpsController', () => {
         new Map([['hyperliquid', mockProvider]]),
       );
       const mockError = new Error('Network client not found');
-      depositMessengerMock.mockImplementation((action: string) => {
-        if (action === 'NetworkController:findNetworkClientIdByChainId') {
-          throw mockError;
-        }
-        if (
-          action === 'AccountTreeController:getAccountsFromSelectedAccountGroup'
-        ) {
-          return [{ address: mockTransaction.from, type: 'eip155:eoa' }];
-        }
-        return undefined;
-      });
+      depositMockCall.mockImplementation(
+        (action: string, ..._args: unknown[]) => {
+          if (
+            action ===
+            'AccountTreeController:getAccountsFromSelectedAccountGroup'
+          ) {
+            return [
+              {
+                address: '0x1234567890123456789012345678901234567890',
+                type: 'eip155:eoa',
+              },
+            ];
+          }
+          if (action === 'NetworkController:findNetworkClientIdByChainId') {
+            throw mockError;
+          }
+          if (action === 'RemoteFeatureFlagController:getState') {
+            return { remoteFeatureFlags: {} };
+          }
+          return undefined;
+        },
+      );
 
       await expect(
         depositController.depositWithConfirmation({ amount: '100' }),
@@ -2601,17 +2617,28 @@ describe('PerpsController', () => {
       depositController.testSetProviders(
         new Map([['hyperliquid', mockProvider]]),
       );
-      depositMessengerMock.mockImplementation((action: string) => {
-        if (action === 'NetworkController:findNetworkClientIdByChainId') {
+      depositMockCall.mockImplementation(
+        (action: string, ..._args: unknown[]) => {
+          if (
+            action ===
+            'AccountTreeController:getAccountsFromSelectedAccountGroup'
+          ) {
+            return [
+              {
+                address: '0x1234567890123456789012345678901234567890',
+                type: 'eip155:eoa',
+              },
+            ];
+          }
+          if (action === 'NetworkController:findNetworkClientIdByChainId') {
+            return undefined;
+          }
+          if (action === 'RemoteFeatureFlagController:getState') {
+            return { remoteFeatureFlags: {} };
+          }
           return undefined;
-        }
-        if (
-          action === 'AccountTreeController:getAccountsFromSelectedAccountGroup'
-        ) {
-          return [{ address: mockTransaction.from, type: 'eip155:eoa' }];
-        }
-        return undefined;
-      });
+        },
+      );
 
       await expect(
         depositController.depositWithConfirmation({ amount: '100' }),
@@ -2632,20 +2659,31 @@ describe('PerpsController', () => {
         new Map([['hyperliquid', mockProvider]]),
       );
       const mockError = new Error('Transaction failed');
-      depositMessengerMock.mockImplementation((action: string) => {
-        if (action === 'NetworkController:findNetworkClientIdByChainId') {
-          return mockNetworkClientId;
-        }
-        if (action === 'TransactionController:addTransaction') {
-          return Promise.reject(mockError);
-        }
-        if (
-          action === 'AccountTreeController:getAccountsFromSelectedAccountGroup'
-        ) {
-          return [{ address: mockTransaction.from, type: 'eip155:eoa' }];
-        }
-        return undefined;
-      });
+      depositMockCall.mockImplementation(
+        (action: string, ..._args: unknown[]) => {
+          if (
+            action ===
+            'AccountTreeController:getAccountsFromSelectedAccountGroup'
+          ) {
+            return [
+              {
+                address: '0x1234567890123456789012345678901234567890',
+                type: 'eip155:eoa',
+              },
+            ];
+          }
+          if (action === 'TransactionController:addTransaction') {
+            return Promise.reject(mockError);
+          }
+          if (action === 'NetworkController:findNetworkClientIdByChainId') {
+            return mockNetworkClientId;
+          }
+          if (action === 'RemoteFeatureFlagController:getState') {
+            return { remoteFeatureFlags: {} };
+          }
+          return undefined;
+        },
+      );
 
       await expect(
         depositController.depositWithConfirmation({ amount: '100' }),
@@ -2661,20 +2699,31 @@ describe('PerpsController', () => {
         state.lastDepositTransactionId = 'old-tx-id';
       });
       const mockError = new Error('Network error');
-      depositMessengerMock.mockImplementation((action: string) => {
-        if (action === 'NetworkController:findNetworkClientIdByChainId') {
-          return mockNetworkClientId;
-        }
-        if (action === 'TransactionController:addTransaction') {
-          return Promise.reject(mockError);
-        }
-        if (
-          action === 'AccountTreeController:getAccountsFromSelectedAccountGroup'
-        ) {
-          return [{ address: mockTransaction.from, type: 'eip155:eoa' }];
-        }
-        return undefined;
-      });
+      depositMockCall.mockImplementation(
+        (action: string, ..._args: unknown[]) => {
+          if (
+            action ===
+            'AccountTreeController:getAccountsFromSelectedAccountGroup'
+          ) {
+            return [
+              {
+                address: '0x1234567890123456789012345678901234567890',
+                type: 'eip155:eoa',
+              },
+            ];
+          }
+          if (action === 'TransactionController:addTransaction') {
+            return Promise.reject(mockError);
+          }
+          if (action === 'NetworkController:findNetworkClientIdByChainId') {
+            return mockNetworkClientId;
+          }
+          if (action === 'RemoteFeatureFlagController:getState') {
+            return { remoteFeatureFlags: {} };
+          }
+          return undefined;
+        },
+      );
 
       await expect(
         depositController.depositWithConfirmation({ amount: '100' }),
@@ -2692,20 +2741,31 @@ describe('PerpsController', () => {
         state.lastDepositTransactionId = 'old-tx-id';
       });
       const mockError = new Error('User denied transaction signature');
-      depositMessengerMock.mockImplementation((action: string) => {
-        if (action === 'NetworkController:findNetworkClientIdByChainId') {
-          return mockNetworkClientId;
-        }
-        if (action === 'TransactionController:addTransaction') {
-          return Promise.reject(mockError);
-        }
-        if (
-          action === 'AccountTreeController:getAccountsFromSelectedAccountGroup'
-        ) {
-          return [{ address: mockTransaction.from, type: 'eip155:eoa' }];
-        }
-        return undefined;
-      });
+      depositMockCall.mockImplementation(
+        (action: string, ..._args: unknown[]) => {
+          if (
+            action ===
+            'AccountTreeController:getAccountsFromSelectedAccountGroup'
+          ) {
+            return [
+              {
+                address: '0x1234567890123456789012345678901234567890',
+                type: 'eip155:eoa',
+              },
+            ];
+          }
+          if (action === 'TransactionController:addTransaction') {
+            return Promise.reject(mockError);
+          }
+          if (action === 'NetworkController:findNetworkClientIdByChainId') {
+            return mockNetworkClientId;
+          }
+          if (action === 'RemoteFeatureFlagController:getState') {
+            return { remoteFeatureFlags: {} };
+          }
+          return undefined;
+        },
+      );
 
       await expect(
         depositController.depositWithConfirmation({ amount: '100' }),
@@ -2864,8 +2924,8 @@ describe('PerpsController', () => {
         placeOrder: true,
       });
 
-      // placeOrder uses messenger-based submitTransaction with perpsDepositAndOrder type
-      expect(depositMessengerMock).toHaveBeenCalledWith(
+      // placeOrder uses messenger-based addTransaction with perpsDepositAndOrder type
+      expect(depositMockCall).toHaveBeenCalledWith(
         'TransactionController:addTransaction',
         mockTransaction,
         {
@@ -2876,7 +2936,7 @@ describe('PerpsController', () => {
         },
       );
       // Should NOT also call with perpsDeposit type
-      expect(depositMessengerMock).not.toHaveBeenCalledWith(
+      expect(depositMockCall).not.toHaveBeenCalledWith(
         'TransactionController:addTransaction',
         expect.anything(),
         expect.objectContaining({ type: 'perpsDeposit' }),
@@ -2939,23 +2999,34 @@ describe('PerpsController', () => {
 
       // Mock messenger to succeed initially, but result promise rejects
       const mockError = new Error('Network error occurred');
-      depositMessengerMock.mockImplementation((action: string) => {
-        if (action === 'NetworkController:findNetworkClientIdByChainId') {
-          return mockNetworkClientId;
-        }
-        if (action === 'TransactionController:addTransaction') {
-          return Promise.resolve({
-            result: Promise.reject(mockError),
-            transactionMeta: mockTransactionMeta,
-          });
-        }
-        if (
-          action === 'AccountTreeController:getAccountsFromSelectedAccountGroup'
-        ) {
-          return [{ address: mockTransaction.from, type: 'eip155:eoa' }];
-        }
-        return undefined;
-      });
+      depositMockCall.mockImplementation(
+        (action: string, ..._args: unknown[]) => {
+          if (
+            action ===
+            'AccountTreeController:getAccountsFromSelectedAccountGroup'
+          ) {
+            return [
+              {
+                address: '0x1234567890123456789012345678901234567890',
+                type: 'eip155:eoa',
+              },
+            ];
+          }
+          if (action === 'TransactionController:addTransaction') {
+            return Promise.resolve({
+              result: Promise.reject(mockError),
+              transactionMeta: mockTransactionMeta,
+            });
+          }
+          if (action === 'NetworkController:findNetworkClientIdByChainId') {
+            return mockNetworkClientId;
+          }
+          if (action === 'RemoteFeatureFlagController:getState') {
+            return { remoteFeatureFlags: {} };
+          }
+          return undefined;
+        },
+      );
 
       const { result } = await depositController.depositWithConfirmation({
         amount: '100',
@@ -3005,24 +3076,34 @@ describe('PerpsController', () => {
         jest.clearAllMocks();
         const mockError = new Error(message);
         // Mock messenger to succeed initially, but result promise rejects with user cancellation
-        depositMessengerMock.mockImplementation((action: string) => {
-          if (action === 'NetworkController:findNetworkClientIdByChainId') {
-            return mockNetworkClientId;
-          }
-          if (action === 'TransactionController:addTransaction') {
-            return Promise.resolve({
-              result: Promise.reject(mockError),
-              transactionMeta: mockTransactionMeta,
-            });
-          }
-          if (
-            action ===
-            'AccountTreeController:getAccountsFromSelectedAccountGroup'
-          ) {
-            return [{ address: mockTransaction.from, type: 'eip155:eoa' }];
-          }
-          return undefined;
-        });
+        depositMockCall.mockImplementation(
+          (action: string, ..._args: unknown[]) => {
+            if (
+              action ===
+              'AccountTreeController:getAccountsFromSelectedAccountGroup'
+            ) {
+              return [
+                {
+                  address: '0x1234567890123456789012345678901234567890',
+                  type: 'eip155:eoa',
+                },
+              ];
+            }
+            if (action === 'TransactionController:addTransaction') {
+              return Promise.resolve({
+                result: Promise.reject(mockError),
+                transactionMeta: mockTransactionMeta,
+              });
+            }
+            if (action === 'NetworkController:findNetworkClientIdByChainId') {
+              return mockNetworkClientId;
+            }
+            if (action === 'RemoteFeatureFlagController:getState') {
+              return { remoteFeatureFlags: {} };
+            }
+            return undefined;
+          },
+        );
 
         const { result } = await depositController.depositWithConfirmation({
           amount: '100',
@@ -4313,8 +4394,13 @@ describe('PerpsController', () => {
     });
 
     it('switches to myx provider successfully', async () => {
-      // Enable MYX feature flag via remote flags + version gating
-      const mockCall = jest.fn().mockImplementation((action: string) => {
+      // Create controller with MYX-enabled mocks
+      const myxInfrastructure = createMockInfrastructure();
+      (
+        myxInfrastructure.featureFlags.validateVersionGated as jest.Mock
+      ).mockReturnValue(true);
+      // Enable MYX feature flag via messenger
+      const myxMockCall = jest.fn().mockImplementation((action: string) => {
         if (action === 'RemoteFeatureFlagController:getState') {
           return {
             remoteFeatureFlags: {
@@ -4329,14 +4415,8 @@ describe('PerpsController', () => {
         return undefined;
       });
 
-      // Create controller with MYX-enabled mocks
-      const myxInfrastructure = createMockInfrastructure();
-      (
-        myxInfrastructure.featureFlags.validateVersionGated as jest.Mock
-      ).mockReturnValue(true);
-
       const myxController = new TestablePerpsController({
-        messenger: createMockMessenger({ call: mockCall }),
+        messenger: createMockMessenger({ call: myxMockCall }),
         state: getDefaultPerpsControllerState(),
         infrastructure: myxInfrastructure,
       });
@@ -4744,8 +4824,10 @@ describe('PerpsController', () => {
       controller.startMarketDataPreload();
       await jest.advanceTimersByTimeAsync(100);
 
-      expect(controller.state.cachedMarketData).toEqual(mockData);
-      expect(controller.state.cachedMarketDataTimestamp).toBeGreaterThan(0);
+      const entry =
+        controller.state.cachedMarketDataByProvider['hyperliquid:mainnet'];
+      expect(entry?.data).toEqual(mockData);
+      expect(entry?.timestamp).toBeGreaterThan(0);
     });
 
     it('respects 30s debounce guard', async () => {
@@ -4774,7 +4856,10 @@ describe('PerpsController', () => {
       controller.stopMarketDataPreload();
       // Set timestamp to recent to trigger debounce guard
       controller.testUpdate((state) => {
-        state.cachedMarketDataTimestamp = Date.now();
+        state.cachedMarketDataByProvider['hyperliquid:mainnet'] = {
+          data: mockData,
+          timestamp: Date.now(),
+        };
       });
       controller.startMarketDataPreload();
       await jest.advanceTimersByTimeAsync(100);
@@ -4952,14 +5037,14 @@ describe('PerpsController', () => {
       preloadController.startMarketDataPreload();
       await jest.advanceTimersByTimeAsync(500);
 
-      expect(preloadController.state.cachedPositions).toEqual(mockPositions);
-      expect(preloadController.state.cachedOrders).toEqual(mockOrders);
-      expect(preloadController.state.cachedAccountState).toEqual(
-        mockAccountState,
-      );
-      expect(preloadController.state.cachedUserDataTimestamp).toBeGreaterThan(
-        0,
-      );
+      const userCache = preloadController.state.cachedUserDataByProvider;
+      const cacheKey = Object.keys(userCache)[0] as string;
+      expect(cacheKey).toBeDefined();
+      const entry = userCache[cacheKey];
+      expect(entry.positions).toEqual(mockPositions);
+      expect(entry.orders).toEqual(mockOrders);
+      expect(entry.accountState).toEqual(mockAccountState);
+      expect(entry.timestamp).toBeGreaterThan(0);
     });
 
     it('skips when WebSocket is connected', async () => {
@@ -4978,7 +5063,9 @@ describe('PerpsController', () => {
       expect(preloadInfrastructure.debugLogger.log).toHaveBeenCalledWith(
         'PerpsController: Skipping user data preload \u2014 WebSocket connected',
       );
-      expect(preloadController.state.cachedPositions).toBeNull();
+      expect(
+        Object.keys(preloadController.state.cachedUserDataByProvider),
+      ).toHaveLength(0);
     });
 
     it('handles errors without throwing', async () => {
@@ -4998,7 +5085,9 @@ describe('PerpsController', () => {
       await jest.advanceTimersByTimeAsync(500);
 
       // Should not crash
-      expect(preloadController.state.cachedPositions).toBeNull();
+      expect(
+        Object.keys(preloadController.state.cachedUserDataByProvider),
+      ).toHaveLength(0);
     });
 
     it('skips when cache is fresh for same account', async () => {
@@ -5024,12 +5113,11 @@ describe('PerpsController', () => {
       preloadController.startMarketDataPreload();
       await jest.advanceTimersByTimeAsync(500);
 
-      expect(preloadController.state.cachedUserDataAddress).toBe(
-        mockEvmAccount.address,
-      );
-      expect(preloadController.state.cachedUserDataTimestamp).toBeGreaterThan(
-        0,
-      );
+      const freshCache = preloadController.state.cachedUserDataByProvider;
+      const freshKey = Object.keys(freshCache)[0] as string;
+      expect(freshKey).toBeDefined();
+      expect(freshCache[freshKey].address).toBe(mockEvmAccount.address);
+      expect(freshCache[freshKey].timestamp).toBeGreaterThan(0);
 
       // Reset call counts
       preloadMockProvider.getPositions.mockClear();
@@ -5128,4 +5216,343 @@ describe('PerpsController', () => {
       unsub();
     });
   });
+
+  describe('getCachedMarketDataForActiveProvider', () => {
+    it('returns null when no cache exists', () => {
+      markControllerAsInitialized();
+      controller.testSetProviders(new Map([['hyperliquid', mockProvider]]));
+      controller.testUpdate((state) => {
+        state.activeProvider = 'hyperliquid';
+      });
+
+      const result = controller.getCachedMarketDataForActiveProvider();
+
+      expect(result).toBeNull();
+    });
+
+    it('returns cached data for single provider', () => {
+      markControllerAsInitialized();
+      controller.testSetProviders(new Map([['hyperliquid', mockProvider]]));
+      controller.testUpdate((state) => {
+        state.activeProvider = 'hyperliquid';
+        state.cachedMarketDataByProvider['hyperliquid:mainnet'] = {
+          data: [{ symbol: 'BTC', name: 'BTC', price: '50000' } as any],
+          timestamp: Date.now(),
+        };
+      });
+
+      const result = controller.getCachedMarketDataForActiveProvider();
+
+      expect(result).toHaveLength(1);
+      expect(result?.[0].symbol).toBe('BTC');
+    });
+
+    it('returns null when single provider cache is expired', () => {
+      markControllerAsInitialized();
+      controller.testSetProviders(new Map([['hyperliquid', mockProvider]]));
+      controller.testUpdate((state) => {
+        state.activeProvider = 'hyperliquid';
+        state.cachedMarketDataByProvider['hyperliquid:mainnet'] = {
+          data: [{ symbol: 'BTC', name: 'BTC', price: '50000' } as any],
+          timestamp: Date.now() - 999_999_999, // very old
+        };
+      });
+
+      const result = controller.getCachedMarketDataForActiveProvider();
+
+      expect(result).toBeNull();
+    });
+
+    it('assembles data from multiple providers in aggregated mode', () => {
+      const mockMYXProvider = createMockHyperLiquidProvider();
+      markControllerAsInitialized();
+      controller.testSetProviders(
+        new Map([
+          ['hyperliquid', mockProvider],
+          ['myx', mockMYXProvider],
+        ] as any),
+      );
+      controller.testUpdate((state) => {
+        state.activeProvider = 'aggregated';
+        state.cachedMarketDataByProvider['hyperliquid:mainnet'] = {
+          data: [
+            {
+              symbol: 'BTC',
+              name: 'BTC',
+              price: '50000',
+              providerId: 'hyperliquid',
+            } as any,
+          ],
+          timestamp: Date.now(),
+        };
+        state.cachedMarketDataByProvider['myx:mainnet'] = {
+          data: [
+            {
+              symbol: 'MYX',
+              name: 'MYX',
+              price: '1',
+              providerId: 'myx',
+            } as any,
+          ],
+          timestamp: Date.now(),
+        };
+      });
+
+      const result = controller.getCachedMarketDataForActiveProvider();
+
+      expect(result).toHaveLength(2);
+      const symbols = (result ?? []).map((m: any) => m.symbol);
+      expect(symbols).toEqual(expect.arrayContaining(['BTC', 'MYX']));
+    });
+
+    it('returns null in aggregated mode when all provider caches are empty', () => {
+      const mockMYXProvider = createMockHyperLiquidProvider();
+      markControllerAsInitialized();
+      controller.testSetProviders(
+        new Map([
+          ['hyperliquid', mockProvider],
+          ['myx', mockMYXProvider],
+        ] as any),
+      );
+      controller.testUpdate((state) => {
+        state.activeProvider = 'aggregated';
+        state.cachedMarketDataByProvider['hyperliquid:mainnet'] = {
+          data: [],
+          timestamp: Date.now(),
+        };
+      });
+
+      const result = controller.getCachedMarketDataForActiveProvider();
+
+      expect(result).toBeNull();
+    });
+
+    it('returns null in aggregated mode when oldest entry exceeds TTL', () => {
+      const mockMYXProvider = createMockHyperLiquidProvider();
+      markControllerAsInitialized();
+      controller.testSetProviders(
+        new Map([
+          ['hyperliquid', mockProvider],
+          ['myx', mockMYXProvider],
+        ] as any),
+      );
+      controller.testUpdate((state) => {
+        state.activeProvider = 'aggregated';
+        state.cachedMarketDataByProvider['hyperliquid:mainnet'] = {
+          data: [{ symbol: 'BTC', name: 'BTC', price: '50000' } as any],
+          timestamp: Date.now() - 999_999_999, // very old
+        };
+        state.cachedMarketDataByProvider['myx:mainnet'] = {
+          data: [{ symbol: 'MYX', name: 'MYX', price: '1' } as any],
+          timestamp: Date.now(), // fresh
+        };
+      });
+
+      const result = controller.getCachedMarketDataForActiveProvider();
+
+      expect(result).toBeNull();
+    });
+  });
+
+  describe('getCachedUserDataForActiveProvider', () => {
+    const mockAddress = '0x1234567890123456789012345678901234567890';
+
+    it('returns null when no cache exists', () => {
+      markControllerAsInitialized();
+      controller.testSetProviders(new Map([['hyperliquid', mockProvider]]));
+      controller.testUpdate((state) => {
+        state.activeProvider = 'hyperliquid';
+      });
+
+      const result = controller.getCachedUserDataForActiveProvider();
+
+      expect(result).toBeNull();
+    });
+
+    it('returns cached user data for single provider', () => {
+      const mockPosition = createMockPosition({ symbol: 'BTC', size: '1.0' });
+      markControllerAsInitialized();
+      controller.testSetProviders(new Map([['hyperliquid', mockProvider]]));
+      controller.testUpdate((state) => {
+        state.activeProvider = 'hyperliquid';
+        state.cachedUserDataByProvider['hyperliquid:mainnet'] = {
+          positions: [mockPosition],
+          orders: [],
+          accountState: {
+            totalBalance: '50000',
+            availableBalance: '45000',
+            marginUsed: '5000',
+            unrealizedPnl: '1000',
+            returnOnEquity: '20',
+          },
+          timestamp: Date.now(),
+          address: mockAddress,
+        };
+      });
+
+      const result = controller.getCachedUserDataForActiveProvider();
+
+      expect(result).not.toBeNull();
+      expect(result?.positions).toHaveLength(1);
+      expect(result?.positions[0].symbol).toBe('BTC');
+      expect(result?.accountState?.totalBalance).toBe('50000');
+    });
+
+    it('assembles user data from multiple providers in aggregated mode', () => {
+      const hlPosition = createMockPosition({ symbol: 'BTC', size: '1.0' });
+      const myxPosition = createMockPosition({ symbol: 'MYX', size: '5.0' });
+      const mockMYXProvider = createMockHyperLiquidProvider();
+      markControllerAsInitialized();
+      controller.testSetProviders(
+        new Map([
+          ['hyperliquid', mockProvider],
+          ['myx', mockMYXProvider],
+        ] as any),
+      );
+      controller.testUpdate((state) => {
+        state.activeProvider = 'aggregated';
+        state.cachedUserDataByProvider['hyperliquid:mainnet'] = {
+          positions: [hlPosition],
+          orders: [],
+          accountState: {
+            totalBalance: '50000',
+            availableBalance: '45000',
+            marginUsed: '5000',
+            unrealizedPnl: '1000',
+            returnOnEquity: '20',
+          },
+          timestamp: Date.now(),
+          address: mockAddress,
+        };
+        state.cachedUserDataByProvider['myx:mainnet'] = {
+          positions: [myxPosition],
+          orders: [],
+          accountState: null,
+          timestamp: Date.now(),
+          address: mockAddress,
+        };
+      });
+
+      const result = controller.getCachedUserDataForActiveProvider();
+
+      expect(result).not.toBeNull();
+      expect(result?.positions).toHaveLength(2);
+      expect(result?.accountState?.totalBalance).toBe('50000');
+    });
+
+    it('returns null in aggregated mode when no valid entries exist', () => {
+      const mockMYXProvider = createMockHyperLiquidProvider();
+      markControllerAsInitialized();
+      controller.testSetProviders(
+        new Map([
+          ['hyperliquid', mockProvider],
+          ['myx', mockMYXProvider],
+        ] as any),
+      );
+      controller.testUpdate((state) => {
+        state.activeProvider = 'aggregated';
+      });
+
+      const result = controller.getCachedUserDataForActiveProvider();
+
+      expect(result).toBeNull();
+    });
+  });
+
+  describe('performMarketDataPreload aggregated mode', () => {
+    beforeEach(() => {
+      jest.useFakeTimers();
+    });
+
+    afterEach(() => {
+      controller.stopMarketDataPreload();
+      jest.useRealTimers();
+    });
+
+    it('splits market data by providerId into per-provider cache entries', async () => {
+      const base = {
+        maxLeverage: '50x',
+        change24h: '+1',
+        change24hPercent: '+0.1%',
+        volume: '$1M',
+      };
+      const mockData = [
+        {
+          ...base,
+          symbol: 'BTC',
+          name: 'BTC',
+          price: '50000',
+          providerId: 'hyperliquid' as const,
+        },
+        {
+          ...base,
+          symbol: 'ETH',
+          name: 'ETH',
+          price: '3000',
+          providerId: 'hyperliquid' as const,
+        },
+        {
+          ...base,
+          symbol: 'MYX',
+          name: 'MYX',
+          price: '1',
+          providerId: 'myx' as const,
+        },
+      ];
+      markControllerAsInitialized();
+      controller.testSetProviders(new Map([['hyperliquid', mockProvider]]));
+      controller.testUpdate((state) => {
+        state.activeProvider = 'aggregated';
+      });
+      mockProvider.getMarketDataWithPrices.mockResolvedValue(mockData);
+
+      controller.startMarketDataPreload();
+      await jest.advanceTimersByTimeAsync(100);
+
+      // Per-provider entries should be written
+      const hlEntry =
+        controller.state.cachedMarketDataByProvider['hyperliquid:mainnet'];
+      expect(hlEntry?.data).toHaveLength(2);
+      expect(hlEntry?.data[0].symbol).toBe('BTC');
+
+      const myxEntry =
+        controller.state.cachedMarketDataByProvider['myx:mainnet'];
+      expect(myxEntry?.data).toHaveLength(1);
+      expect(myxEntry?.data[0].symbol).toBe('MYX');
+
+      // Aggregated sentinel should be empty
+      const sentinel =
+        controller.state.cachedMarketDataByProvider['aggregated:mainnet'];
+      expect(sentinel?.data).toHaveLength(0);
+      expect(sentinel?.timestamp).toBeGreaterThan(0);
+    });
+
+    it('assigns items without providerId to hyperliquid fallback', async () => {
+      const mockData = [
+        {
+          symbol: 'BTC',
+          name: 'BTC',
+          price: '50000',
+          maxLeverage: '50x',
+          change24h: '+1',
+          change24hPercent: '+0.1%',
+          volume: '$1M',
+        }, // no providerId
+      ];
+      markControllerAsInitialized();
+      controller.testSetProviders(new Map([['hyperliquid', mockProvider]]));
+      controller.testUpdate((state) => {
+        state.activeProvider = 'aggregated';
+      });
+      mockProvider.getMarketDataWithPrices.mockResolvedValue(mockData);
+
+      controller.startMarketDataPreload();
+      await jest.advanceTimersByTimeAsync(100);
+
+      const hlEntry =
+        controller.state.cachedMarketDataByProvider['hyperliquid:mainnet'];
+      expect(hlEntry?.data).toHaveLength(1);
+      expect(hlEntry?.data[0].symbol).toBe('BTC');
+    });
+  });
 });
diff --git a/app/controllers/perps/PerpsController.ts b/app/controllers/perps/PerpsController.ts
index 108a1fa8ce0e..128346b071b1 100644
--- a/app/controllers/perps/PerpsController.ts
+++ b/app/controllers/perps/PerpsController.ts
@@ -1,7 +1,3 @@
-import type {
-  AccountTreeControllerGetAccountsFromSelectedAccountGroupAction,
-  AccountTreeControllerSelectedAccountGroupChangeEvent,
-} from '@metamask/account-tree-controller';
 import {
   BaseController,
   ControllerGetStateAction,
@@ -10,29 +6,7 @@ import {
 } from '@metamask/base-controller';
 import type { StateChangeListener } from '@metamask/base-controller';
 import { ORIGIN_METAMASK } from '@metamask/controller-utils';
-import type {
-  KeyringControllerGetStateAction,
-  KeyringControllerSignTypedMessageAction,
-} from '@metamask/keyring-controller';
 import type { Messenger } from '@metamask/messenger';
-import type {
-  NetworkControllerGetStateAction,
-  NetworkControllerGetNetworkClientByIdAction,
-  NetworkControllerFindNetworkClientIdByChainIdAction,
-} from '@metamask/network-controller';
-import type { AuthenticationController } from '@metamask/profile-sync-controller';
-import type {
-  RemoteFeatureFlagControllerState,
-  RemoteFeatureFlagControllerStateChangeEvent,
-  RemoteFeatureFlagControllerGetStateAction,
-} from '@metamask/remote-feature-flag-controller';
-import {
-  TransactionControllerAddTransactionAction,
-  TransactionControllerTransactionConfirmedEvent,
-  TransactionControllerTransactionFailedEvent,
-  TransactionControllerTransactionSubmittedEvent,
-  TransactionType,
-} from '@metamask/transaction-controller';
 import type { Json } from '@metamask/utils';
 import { v4 as uuidv4 } from 'uuid';
 
@@ -129,7 +103,14 @@ import type {
   PerpsActiveProviderMode,
   PerpsProviderType,
   PerpsSelectedPaymentToken,
+  PerpsRemoteFeatureFlagState,
+  PerpsTransactionParams,
+  PerpsAddTransactionOptions,
 } from './types';
+import type {
+  PerpsControllerAllowedActions,
+  PerpsControllerAllowedEvents,
+} from './types/messenger';
 import type { CandleData } from './types/perps-types';
 import {
   LastTransactionResult,
@@ -321,15 +302,24 @@ export type PerpsControllerState = {
   selectedPaymentToken: Json | null;
 
   // Cached market data from background preloading (REST snapshots, not WebSocket)
-  cachedMarketData: PerpsMarketData[] | null;
-  cachedMarketDataTimestamp: number;
+  // Keyed by "providerId:network" (e.g. 'hyperliquid:mainnet', 'myx:testnet')
+  cachedMarketDataByProvider: Record<
+    string,
+    { data: PerpsMarketData[]; timestamp: number }
+  >;
 
   // Cached user data from background preloading (REST snapshots, not WebSocket)
-  cachedPositions: Position[] | null;
-  cachedOrders: Order[] | null;
-  cachedAccountState: AccountState | null;
-  cachedUserDataTimestamp: number;
-  cachedUserDataAddress: string | null;
+  // Keyed by "providerId:network" (e.g. 'hyperliquid:mainnet', 'myx:testnet')
+  cachedUserDataByProvider: Record<
+    string,
+    {
+      positions: Position[];
+      orders: Order[];
+      accountState: AccountState | null;
+      timestamp: number;
+      address: string;
+    }
+  >;
 };
 
 /**
@@ -387,13 +377,8 @@ export const getDefaultPerpsControllerState = (): PerpsControllerState => ({
   },
   hip3ConfigVersion: 0,
   selectedPaymentToken: null,
-  cachedMarketData: null,
-  cachedMarketDataTimestamp: 0,
-  cachedPositions: null,
-  cachedOrders: null,
-  cachedAccountState: null,
-  cachedUserDataTimestamp: 0,
-  cachedUserDataAddress: null,
+  cachedMarketDataByProvider: {},
+  cachedUserDataByProvider: {},
 });
 
 /**
@@ -550,48 +535,18 @@ const metadata: StateMetadata<PerpsControllerState> = {
     includeInDebugSnapshot: false,
     usedInUi: true,
   },
-  cachedMarketData: {
+  cachedMarketDataByProvider: {
     includeInStateLogs: false,
     persist: false,
     includeInDebugSnapshot: false,
     usedInUi: true,
   },
-  cachedMarketDataTimestamp: {
-    includeInStateLogs: false,
-    persist: false,
-    includeInDebugSnapshot: false,
-    usedInUi: false,
-  },
-  cachedPositions: {
+  cachedUserDataByProvider: {
     includeInStateLogs: false,
     persist: false,
     includeInDebugSnapshot: false,
     usedInUi: true,
   },
-  cachedOrders: {
-    includeInStateLogs: false,
-    persist: false,
-    includeInDebugSnapshot: false,
-    usedInUi: true,
-  },
-  cachedAccountState: {
-    includeInStateLogs: false,
-    persist: false,
-    includeInDebugSnapshot: false,
-    usedInUi: true,
-  },
-  cachedUserDataTimestamp: {
-    includeInStateLogs: false,
-    persist: false,
-    includeInDebugSnapshot: false,
-    usedInUi: false,
-  },
-  cachedUserDataAddress: {
-    includeInStateLogs: false,
-    persist: false,
-    includeInDebugSnapshot: false,
-    usedInUi: false,
-  },
 };
 
 /**
@@ -745,36 +700,14 @@ export type PerpsControllerActions =
     };
 
 /**
- * External actions the PerpsController can call via messenger
- */
-export type AllowedActions =
-  | NetworkControllerGetStateAction
-  | AuthenticationController.AuthenticationControllerGetBearerToken
-  | RemoteFeatureFlagControllerGetStateAction
-  | AccountTreeControllerGetAccountsFromSelectedAccountGroupAction
-  | KeyringControllerGetStateAction
-  | KeyringControllerSignTypedMessageAction
-  | NetworkControllerGetNetworkClientByIdAction
-  | NetworkControllerFindNetworkClientIdByChainIdAction
-  | TransactionControllerAddTransactionAction;
-
-/**
- * External events the PerpsController can subscribe to
- */
-export type AllowedEvents =
-  | TransactionControllerTransactionSubmittedEvent
-  | TransactionControllerTransactionConfirmedEvent
-  | TransactionControllerTransactionFailedEvent
-  | RemoteFeatureFlagControllerStateChangeEvent
-  | AccountTreeControllerSelectedAccountGroupChangeEvent;
-
-/**
- * PerpsController messenger constraints
+ * PerpsController messenger constraints.
+ * Includes both PerpsController's own actions/events and
+ * allowed actions/events from external controllers.
  */
 export type PerpsControllerMessenger = Messenger<
   'PerpsController',
-  PerpsControllerActions | AllowedActions,
-  PerpsControllerEvents | AllowedEvents
+  PerpsControllerActions | PerpsControllerAllowedActions,
+  PerpsControllerEvents | PerpsControllerAllowedEvents
 >;
 
 /**
@@ -786,7 +719,8 @@ export type PerpsControllerOptions = {
   clientConfig?: PerpsControllerConfig;
   /**
    * Platform-specific dependencies (required)
-   * Provides logging, metrics, tracing, stream management, and account utilities.
+   * Provides logging, metrics, tracing, stream management, and rewards.
+   * Cross-controller communication uses the messenger pattern.
    * Must be provided by the platform (mobile/extension) at instantiation time.
    */
   infrastructure: PerpsPlatformDependencies;
@@ -884,12 +818,28 @@ export class PerpsController extends BaseController<
    * @returns True if the condition is met.
    */
   #isMYXProviderEnabled(): boolean {
-    const getLocalFlag = (): boolean =>
-      typeof globalThis.process !== 'undefined' &&
-      globalThis.process.env?.MM_PERPS_MYX_PROVIDER_ENABLED === 'true';
+    const config = this.#options.clientConfig ?? {};
+
+    // Local env-var override (MM_PERPS_MYX_PROVIDER_ENABLED) always wins —
+    // matches the UI selector (resolvePerpsMyxProviderEnabled) so controller
+    // and UI agree on whether MYX is available.
+    if (config.myxProviderEnabled) {
+      return true;
+    }
 
+    // Credentials present → MYX is enabled regardless of remote flag.
+    // Use || so empty-string env vars (default '') fall through.
+    const hasCredentials = Boolean(
+      // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
+      config.myxAppIdTestnet || config.myxAppIdMainnet,
+    );
+
+    if (hasCredentials) {
+      return true;
+    }
+
+    // No local override or credentials — check remote flag as fallback
     try {
-      const localFlag = getLocalFlag();
       const remoteState = this.messenger.call(
         'RemoteFeatureFlagController:getState',
       );
@@ -901,13 +851,12 @@ export class PerpsController extends BaseController<
           this.#options.infrastructure.featureFlags.validateVersionGated(
             remoteFlag,
           );
-        return validated ?? localFlag;
+        return validated ?? false;
       }
 
-      return localFlag;
+      return false;
     } catch {
-      // If RemoteFeatureFlagController not ready, use fallback
-      return getLocalFlag();
+      return false;
     }
   }
 
@@ -970,8 +919,8 @@ export class PerpsController extends BaseController<
       infrastructure,
     };
 
-    // Instantiate services with platform dependencies and messenger
-    // Services that need inter-controller communication receive the messenger
+    // Instantiate services with platform dependencies
+    // Services that need cross-controller access receive the messenger
     this.#tradingService = new TradingService(infrastructure);
     this.#marketDataService = new MarketDataService(infrastructure);
     this.#accountService = new AccountService(infrastructure, messenger);
@@ -1026,11 +975,12 @@ export class PerpsController extends BaseController<
       );
     }
 
-    const featureFlagHandler =
-      this.refreshEligibilityOnFeatureFlagChange.bind(this);
+    // Subscribe for the full controller lifetime — intentionally not stored;
+    // geo-blocking and HIP-3 flag propagation must remain active across
+    // disconnect → reconnect cycles and must never be torn down.
     this.messenger.subscribe(
       'RemoteFeatureFlagController:stateChange',
-      featureFlagHandler,
+      this.refreshEligibilityOnFeatureFlagChange.bind(this),
     );
 
     this.providers = new Map();
@@ -1071,6 +1021,183 @@ export class PerpsController extends BaseController<
     this.#options.infrastructure.debugLogger.log(...args);
   }
 
+  /**
+   * Build a cache key for per-provider market data.
+   * Format: "providerId:network" (e.g. 'hyperliquid:mainnet', 'myx:testnet')
+   *
+   * @param providerId - The provider identifier.
+   * @param isTestnet - Whether the provider is on testnet.
+   * @returns The cache key string.
+   */
+  #marketCacheKey(providerId: string, isTestnet: boolean): string {
+    return `${providerId}:${isTestnet ? 'testnet' : 'mainnet'}`;
+  }
+
+  /**
+   * Determine the effective testnet flag for a given provider.
+   * MYX may be forced to testnet via PROVIDER_CONFIG.MYX_TESTNET_ONLY.
+   *
+   * @param providerId - The provider identifier.
+   * @returns Whether this provider should use testnet.
+   */
+  #providerIsTestnet(providerId: string): boolean {
+    if (providerId === 'myx') {
+      return PROVIDER_CONFIG.MYX_TESTNET_ONLY || this.state.isTestnet;
+    }
+    return this.state.isTestnet;
+  }
+
+  /**
+   * Read cached market data for the currently active provider (or aggregated).
+   * Returns null when no valid cache exists or when cache has expired.
+   *
+   * @returns The cached market data array, or null if no valid cache.
+   */
+  getCachedMarketDataForActiveProvider(): PerpsMarketData[] | null {
+    const { activeProvider } = this.state;
+    const cache = this.state.cachedMarketDataByProvider;
+
+    if (activeProvider === 'aggregated') {
+      // Assemble from all registered provider entries
+      const assembled: PerpsMarketData[] = [];
+      let oldestTimestamp = Infinity;
+      for (const [providerId] of this.providers) {
+        const key = this.#marketCacheKey(
+          providerId,
+          this.#providerIsTestnet(providerId),
+        );
+        const entry = cache[key];
+        if (!entry || entry.data.length === 0) {
+          continue;
+        }
+        oldestTimestamp = Math.min(oldestTimestamp, entry.timestamp);
+        assembled.push(...entry.data);
+      }
+      if (assembled.length === 0) {
+        return null;
+      }
+      // Check TTL against the oldest entry
+      if (Date.now() - oldestTimestamp > PerpsController.#preloadGuardMs * 10) {
+        return null;
+      }
+      return assembled;
+    }
+
+    // Single provider mode
+    const key = this.#marketCacheKey(
+      activeProvider,
+      this.#providerIsTestnet(activeProvider),
+    );
+    const entry = cache[key];
+    if (!entry || entry.data.length === 0) {
+      return null;
+    }
+    if (Date.now() - entry.timestamp > PerpsController.#preloadGuardMs * 10) {
+      return null;
+    }
+    return entry.data;
+  }
+
+  /**
+   * Read cached user data for the currently active provider (or aggregated).
+   * Returns null when no valid cache exists, cache has expired, or address
+   * does not match the currently selected EVM account.
+   *
+   * @returns The cached user data, or null if no valid cache.
+   */
+  getCachedUserDataForActiveProvider(): {
+    positions: Position[];
+    orders: Order[];
+    accountState: AccountState | null;
+  } | null {
+    const { activeProvider } = this.state;
+    const cache = this.state.cachedUserDataByProvider;
+    const staleCutoff = PerpsController.#preloadGuardMs * 2; // 60s
+
+    // Get current user address for validation
+    let currentAddress: string | null = null;
+    try {
+      const evmAccount = getSelectedEvmAccount(
+        this.messenger.call(
+          'AccountTreeController:getAccountsFromSelectedAccountGroup',
+        ),
+      );
+      currentAddress = evmAccount?.address ?? null;
+    } catch {
+      // Can't determine current account — trust the cache
+    }
+
+    const isValidEntry = (
+      entry: { timestamp: number; address: string } | undefined,
+    ): entry is { timestamp: number; address: string } => {
+      if (!entry) {
+        return false;
+      }
+      if (Date.now() - entry.timestamp >= staleCutoff) {
+        return false;
+      }
+      if (
+        currentAddress &&
+        entry.address.toLowerCase() !== currentAddress.toLowerCase()
+      ) {
+        return false;
+      }
+      return true;
+    };
+
+    if (activeProvider === 'aggregated') {
+      // Assemble from all registered provider entries
+      const allPositions: Position[] = [];
+      const allOrders: Order[] = [];
+      let defaultAccountState: AccountState | null = null;
+      let hasValidEntry = false;
+
+      for (const [providerId] of this.providers) {
+        const key = this.#marketCacheKey(
+          providerId,
+          this.#providerIsTestnet(providerId),
+        );
+        const entry = cache[key];
+        if (!isValidEntry(entry)) {
+          continue;
+        }
+        hasValidEntry = true;
+        allPositions.push(...entry.positions);
+        allOrders.push(...entry.orders);
+        // AccountState from default provider (hyperliquid)
+        if (providerId === 'hyperliquid') {
+          defaultAccountState = entry.accountState;
+        }
+      }
+
+      if (!hasValidEntry) {
+        return null;
+      }
+
+      return {
+        positions: allPositions,
+        orders: allOrders,
+        accountState: defaultAccountState,
+      };
+    }
+
+    // Single provider mode
+    const key = this.#marketCacheKey(
+      activeProvider,
+      this.#providerIsTestnet(activeProvider),
+    );
+    const entry = cache[key];
+    if (!entry || !isValidEntry(entry)) {
+      return null;
+    }
+
+    return {
+      positions: entry.positions,
+      orders: entry.orders,
+      accountState: entry.accountState,
+    };
+  }
+
   /**
    * Returns a cached standalone HyperLiquidProvider for pre-initialization
    * discovery queries. Creates a new instance on first call or when the
@@ -1183,27 +1310,20 @@ export class PerpsController extends BaseController<
    * @returns The transaction result containing a hash promise and transaction metadata.
    */
   async #submitTransaction(
-    txParams: {
-      from: string;
-      to?: string;
-      value?: string;
-      data?: string;
-      gas?: string;
-    },
-    options: {
-      networkClientId: string;
-      origin?: string;
-      type?: TransactionType;
-      skipInitialGasEstimate?: boolean;
-    },
+    txParams: PerpsTransactionParams,
+    options: PerpsAddTransactionOptions,
   ): Promise<{
     result: Promise<string>;
     transactionMeta: { id: string; hash?: string };
   }> {
+    // Cast needed: PerpsController uses loose string types for txParams/options
+    // while TransactionController uses strict branded types (TransactionParams, AddTransactionOptions)
     return this.messenger.call(
       'TransactionController:addTransaction',
-      txParams,
-      options,
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      txParams as any,
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      options as any,
     );
   }
 
@@ -1256,7 +1376,7 @@ export class PerpsController extends BaseController<
    * @param remoteFeatureFlagControllerState - State from RemoteFeatureFlagController.
    */
   protected refreshEligibilityOnFeatureFlagChange(
-    remoteFeatureFlagControllerState: RemoteFeatureFlagControllerState,
+    remoteFeatureFlagControllerState: PerpsRemoteFeatureFlagState,
   ): void {
     this.#featureFlagConfigurationService.refreshEligibility({
       remoteFeatureFlagControllerState,
@@ -1467,13 +1587,44 @@ export class PerpsController extends BaseController<
         // Register MYX provider if enabled via feature flag
         const isMYXEnabled = this.#isMYXProviderEnabled();
         if (isMYXEnabled) {
+          const myxIsTestnet =
+            PROVIDER_CONFIG.MYX_TESTNET_ONLY || this.state.isTestnet;
+          const config = this.#options.clientConfig ?? {};
+          // When on mainnet, fall back to testnet credentials if mainnet ones are empty.
+          // Uses firstNonEmpty because env vars default to '' (not null/undefined),
+          // so ?? would not fall through on empty strings.
+          const firstNonEmpty = (...vals: (string | undefined)[]): string =>
+            vals.find(
+              (val) => val !== null && val !== undefined && val !== '',
+            ) ?? '';
+          const myxAppId = myxIsTestnet
+            ? (config.myxAppIdTestnet ?? '')
+            : firstNonEmpty(config.myxAppIdMainnet, config.myxAppIdTestnet);
+          const myxApiSecret = myxIsTestnet
+            ? (config.myxApiSecretTestnet ?? '')
+            : firstNonEmpty(
+                config.myxApiSecretMainnet,
+                config.myxApiSecretTestnet,
+              );
+          const myxBrokerAddress = myxIsTestnet
+            ? (config.myxBrokerAddressTestnet ?? '')
+            : firstNonEmpty(
+                config.myxBrokerAddressMainnet,
+                config.myxBrokerAddressTestnet,
+              );
           const myxProvider = new MYXProvider({
-            isTestnet: PROVIDER_CONFIG.MYX_TESTNET_ONLY || this.state.isTestnet,
+            isTestnet: myxIsTestnet,
             platformDependencies: this.#options.infrastructure,
+            messenger: this.messenger,
+            myxAuthConfig: {
+              appId: myxAppId,
+              apiSecret: myxApiSecret,
+              brokerAddress: myxBrokerAddress,
+            },
           });
           this.providers.set('myx', myxProvider);
           this.#debugLog('PerpsController: MYX provider registered', {
-            isTestnet: PROVIDER_CONFIG.MYX_TESTNET_ONLY || this.state.isTestnet,
+            isTestnet: myxIsTestnet,
           });
         }
 
@@ -1948,7 +2099,11 @@ export class PerpsController extends BaseController<
       currentDepositId = depositId;
 
       // Get current account address via messenger (outside of update() for proper typing)
-      const evmAccount = getSelectedEvmAccount(this.messenger);
+      const evmAccount = getSelectedEvmAccount(
+        this.messenger.call(
+          'AccountTreeController:getAccountsFromSelectedAccountGroup',
+        ),
+      );
       const accountAddress = evmAccount?.address ?? 'unknown';
 
       this.update((state) => {
@@ -1990,10 +2145,10 @@ export class PerpsController extends BaseController<
       };
 
       if (placeOrder) {
-        // Use messenger-based addTransaction to create transaction without navigating to confirmation screen
+        // Use addTransaction to create transaction without navigating to confirmation screen
         const addResult = await this.#submitTransaction(transaction, {
           ...defaultTransactionOptions,
-          type: TransactionType.perpsDepositAndOrder,
+          type: 'perpsDepositAndOrder',
         });
         transactionMeta = addResult.transactionMeta;
         // Return transaction ID immediately (fire-and-forget for caller)
@@ -2005,7 +2160,7 @@ export class PerpsController extends BaseController<
         // The promise will resolve when transaction completes or reject if cancelled/failed
         const submitResult = await this.#submitTransaction(transaction, {
           ...defaultTransactionOptions,
-          type: TransactionType.perpsDeposit,
+          type: 'perpsDeposit',
         });
         result = submitResult.result;
         transactionMeta = submitResult.transactionMeta;
@@ -2604,7 +2759,7 @@ export class PerpsController extends BaseController<
       });
     }, PerpsController.#preloadRefreshMs);
 
-    // Watch for isTestnet / hip3ConfigVersion / cachedUserDataAddress changes
+    // Watch for isTestnet / hip3ConfigVersion changes
     const handler: StateChangeListener<PerpsControllerState> = (
       _state,
       patches,
@@ -2640,16 +2795,9 @@ export class PerpsController extends BaseController<
         this.#previousIsTestnet = currentIsTestnet;
         this.#previousHip3ConfigVersion = currentHip3Version;
 
-        // Clear stale cache (market + user data)
-        this.update((state) => {
-          state.cachedMarketData = null;
-          state.cachedMarketDataTimestamp = 0;
-          state.cachedPositions = null;
-          state.cachedOrders = null;
-          state.cachedAccountState = null;
-          state.cachedUserDataTimestamp = 0;
-          state.cachedUserDataAddress = null;
-        });
+        // No need to clear user data cache — per-provider keys include the
+        // network, so different networks don't collide. Re-preload will
+        // populate the new key.
 
         this.#performMarketDataPreload().catch(() => {
           /* fire-and-forget */
@@ -2664,23 +2812,28 @@ export class PerpsController extends BaseController<
 
     // Watch for account changes via AccountTreeController
     const accountChangeHandler = (): void => {
-      const evmAccount = getSelectedEvmAccount(this.messenger);
+      const evmAccount = getSelectedEvmAccount(
+        this.messenger.call(
+          'AccountTreeController:getAccountsFromSelectedAccountGroup',
+        ),
+      );
       const currentAddress = evmAccount?.address ?? null;
 
-      // If there's cached data from a different account (or no EVM account now), clear it
-      if (
-        this.state.cachedUserDataAddress !== null &&
-        currentAddress !== this.state.cachedUserDataAddress
-      ) {
+      // If any cached entry belongs to a different account, clear all entries.
+      // Max 4 entries (2 providers × 2 networks) — clearing all is simple and safe.
+      const hasStaleEntries = Object.values(
+        this.state.cachedUserDataByProvider,
+      ).some(
+        (entry) =>
+          currentAddress === null ||
+          entry.address.toLowerCase() !== currentAddress.toLowerCase(),
+      );
+      if (hasStaleEntries) {
         this.#debugLog(
           'PerpsController: Account changed, clearing user data cache',
         );
         this.update((state) => {
-          state.cachedPositions = null;
-          state.cachedOrders = null;
-          state.cachedAccountState = null;
-          state.cachedUserDataTimestamp = 0;
-          state.cachedUserDataAddress = null;
+          state.cachedUserDataByProvider = {};
         });
         // Only preload if the new account is an EVM account
         if (currentAddress) {
@@ -2734,10 +2887,28 @@ export class PerpsController extends BaseController<
       return;
     }
 
+    // Skip preloading during provider/network reinitialisation.
+    // The activeProviderInstance still points to the OLD network's provider
+    // until init() completes, so fetching now would store stale data under
+    // the NEW network's cache key.
+    if (this.#isReinitializing) {
+      return;
+    }
+
+    // Determine actual provider and cache key for debounce
+    const actualProviderId = this.activeProviderInstance
+      ? this.state.activeProvider // includes 'aggregated'
+      : 'hyperliquid';
+    const cacheKey = this.#marketCacheKey(
+      actualProviderId,
+      this.#providerIsTestnet(actualProviderId),
+    );
+
     const now = Date.now();
+    const existingEntry = this.state.cachedMarketDataByProvider[cacheKey];
     if (
-      now - this.state.cachedMarketDataTimestamp <
-      PerpsController.#preloadGuardMs
+      existingEntry &&
+      now - existingEntry.timestamp < PerpsController.#preloadGuardMs
     ) {
       return;
     }
@@ -2763,10 +2934,46 @@ export class PerpsController extends BaseController<
       this.#debugLog('PerpsController: Fetching market data in background');
       const data = await this.getMarketDataWithPrices({ standalone: true });
 
-      this.update((state) => {
-        state.cachedMarketData = data;
-        state.cachedMarketDataTimestamp = Date.now();
-      });
+      // Store under per-provider key(s)
+      const ts = Date.now();
+      if (
+        this.state.activeProvider === 'aggregated' &&
+        this.activeProviderInstance
+      ) {
+        // Split returned data by providerId and store each slice
+        const fallbackProviderId = 'hyperliquid'; // default for items missing providerId
+        const byProvider = new Map<string, PerpsMarketData[]>();
+        for (const item of data) {
+          const pid = item.providerId ?? fallbackProviderId;
+          const existing = byProvider.get(pid);
+          if (existing) {
+            existing.push(item);
+          } else {
+            byProvider.set(pid, [item]);
+          }
+        }
+        this.update((state) => {
+          for (const [pid, slice] of byProvider) {
+            const key = this.#marketCacheKey(pid, this.#providerIsTestnet(pid));
+            state.cachedMarketDataByProvider[key] = {
+              data: slice,
+              timestamp: ts,
+            };
+          }
+          // Write aggregated sentinel so the staleness guard sees it
+          state.cachedMarketDataByProvider[cacheKey] = {
+            data: [], // sentinel — real data is in per-provider keys
+            timestamp: ts,
+          };
+        });
+      } else {
+        this.update((state) => {
+          state.cachedMarketDataByProvider[cacheKey] = {
+            data,
+            timestamp: ts,
+          };
+        });
+      }
 
       this.#debugLog('PerpsController: Market data preloaded', {
         marketCount: data.length,
@@ -2816,18 +3023,33 @@ export class PerpsController extends BaseController<
     }
 
     // Get current user address
-    const evmAccount = getSelectedEvmAccount(this.messenger);
+    const evmAccount = getSelectedEvmAccount(
+      this.messenger.call(
+        'AccountTreeController:getAccountsFromSelectedAccountGroup',
+      ),
+    );
     if (!evmAccount?.address) {
       return;
     }
 
     const userAddress = evmAccount.address;
 
+    // Determine actual provider (same logic as market preload)
+    const actualProviderId = this.activeProviderInstance
+      ? this.state.activeProvider // includes 'aggregated'
+      : 'hyperliquid';
+    const userCacheKey = this.#marketCacheKey(
+      actualProviderId,
+      this.#providerIsTestnet(actualProviderId),
+    );
+
     // Skip if cache is fresh and for same account
     const now = Date.now();
+    const existingEntry = this.state.cachedUserDataByProvider[userCacheKey];
     if (
-      this.state.cachedUserDataAddress === userAddress &&
-      now - this.state.cachedUserDataTimestamp < PerpsController.#preloadGuardMs
+      existingEntry &&
+      existingEntry.address === userAddress &&
+      now - existingEntry.timestamp < PerpsController.#preloadGuardMs
     ) {
       return;
     }
@@ -2876,13 +3098,77 @@ export class PerpsController extends BaseController<
         this.getAccountState({ standalone: true, userAddress }),
       ]);
 
-      this.update((state) => {
-        state.cachedPositions = positions;
-        state.cachedOrders = orders;
-        state.cachedAccountState = accountState;
-        state.cachedUserDataTimestamp = Date.now();
-        state.cachedUserDataAddress = userAddress;
-      });
+      if (
+        this.state.activeProvider === 'aggregated' &&
+        this.activeProviderInstance
+      ) {
+        // Split by providerId and write one cache entry per provider key
+        // (mirrors the market-data preload pattern at ~line 2976)
+        const ts = Date.now();
+        type UserDataBucket = {
+          positions: typeof positions;
+          orders: typeof orders;
+          accountState: typeof accountState | null;
+        };
+        const fallbackProviderId = 'hyperliquid'; // default for items missing providerId
+        const byProvider = new Map<string, UserDataBucket>();
+
+        const ensureBucket = (pid: string): UserDataBucket => {
+          let bucket = byProvider.get(pid);
+          if (!bucket) {
+            bucket = { positions: [], orders: [], accountState: null };
+            byProvider.set(pid, bucket);
+          }
+          return bucket;
+        };
+
+        for (const pos of positions) {
+          ensureBucket(pos.providerId ?? fallbackProviderId).positions.push(
+            pos,
+          );
+        }
+
+        for (const order of orders) {
+          ensureBucket(order.providerId ?? fallbackProviderId).orders.push(
+            order,
+          );
+        }
+
+        // AccountState — assign to its provider bucket
+        ensureBucket(
+          accountState.providerId ?? fallbackProviderId,
+        ).accountState = accountState;
+
+        this.update((state) => {
+          for (const [pid, data] of byProvider) {
+            const key = this.#marketCacheKey(pid, this.#providerIsTestnet(pid));
+            state.cachedUserDataByProvider[key] = {
+              ...data,
+              timestamp: ts,
+              address: userAddress,
+            };
+          }
+          // Write aggregated sentinel so the staleness guard sees it
+          state.cachedUserDataByProvider[userCacheKey] = {
+            positions: [],
+            orders: [],
+            accountState: null,
+            timestamp: ts,
+            address: userAddress,
+          };
+        });
+      } else {
+        // Single provider — store directly under its key
+        this.update((state) => {
+          state.cachedUserDataByProvider[userCacheKey] = {
+            positions,
+            orders,
+            accountState,
+            timestamp: Date.now(),
+            address: userAddress,
+          };
+        });
+      }
 
       this.#debugLog('PerpsController: User data preloaded', {
         positionCount: positions.length,
@@ -3159,6 +3445,16 @@ export class PerpsController extends BaseController<
       };
     } finally {
       this.#isReinitializing = false;
+
+      // Re-trigger preload now that reinit is complete and the
+      // activeProviderInstance points to the correct network.
+      // The state-change listener may have already fired during reinit
+      // but was skipped due to the #isReinitializing guard.
+      if (this.#preloadTimer) {
+        this.#performMarketDataPreload().catch(() => {
+          /* fire-and-forget */
+        });
+      }
     }
   }
 
@@ -3218,7 +3514,7 @@ export class PerpsController extends BaseController<
       // reinitialization. The disconnect() method skips provider teardown
       // when isReinitializing is true to prevent double-disconnect.
 
-      // Update state with new provider
+      // Update state with new provider (market data cache preserved per-provider)
       this.update((state) => {
         state.activeProvider = providerId;
         state.accountState = null;
@@ -3292,6 +3588,13 @@ export class PerpsController extends BaseController<
       };
     } finally {
       this.#isReinitializing = false;
+
+      // Re-trigger preload now that reinit is complete.
+      if (this.#preloadTimer) {
+        this.#performMarketDataPreload().catch(() => {
+          /* fire-and-forget */
+        });
+      }
     }
   }
 
@@ -4328,9 +4631,7 @@ export class PerpsController extends BaseController<
       slPrice: params.slPrice,
       tpPrice: params.tpPrice,
       isTestnet: this.state.isTestnet,
-      context: this.#createServiceContext('reportOrderToDataLake', {
-        messenger: this.messenger,
-      }),
+      context: this.#createServiceContext('reportOrderToDataLake', {}),
       retryCount: params.retryCount,
       _traceId: params._traceId,
     });
diff --git a/app/controllers/perps/constants/eventNames.ts b/app/controllers/perps/constants/eventNames.ts
index 2d596f1b56b3..4fd163f51a7d 100644
--- a/app/controllers/perps/constants/eventNames.ts
+++ b/app/controllers/perps/constants/eventNames.ts
@@ -190,6 +190,7 @@ export const PERPS_EVENT_VALUE = {
     PERPS_ASSET_SCREEN_NO_FUNDS: 'perps_asset_screen_no_funds',
     TRADE_MENU_ACTION: 'trade_menu_action',
     WALLET_HOME: 'wallet_home',
+    HOME_SECTION: 'home_section',
     TOOLTIP: 'tooltip',
     MAGNIFYING_GLASS: 'magnifying_glass',
     CRYPTO_BUTTON: 'crypto_button',
@@ -269,6 +270,7 @@ export const PERPS_EVENT_VALUE = {
     POSITION_UPDATE_FAILED: 'position_update_failed',
     TP_SL_UPDATE_FAILED: 'tp_sl_update_failed',
     MARGIN_UPDATE_FAILED: 'margin_update_failed',
+    UNKNOWN: 'unknown',
   },
   INTERACTION_TYPE: {
     TAP: 'tap',
@@ -388,6 +390,7 @@ export const PERPS_EVENT_VALUE = {
   },
   ACTION: {
     CONNECTION_RETRY: 'connection_retry',
+    CONNECTION_GO_BACK: 'connection_go_back',
     SHARE: 'share',
     // Risk management actions
     ADD_MARGIN: 'add_margin',
diff --git a/app/controllers/perps/constants/hyperLiquidConfig.ts b/app/controllers/perps/constants/hyperLiquidConfig.ts
index 3ae3eba6a76d..8188143b2d58 100644
--- a/app/controllers/perps/constants/hyperLiquidConfig.ts
+++ b/app/controllers/perps/constants/hyperLiquidConfig.ts
@@ -12,7 +12,7 @@ import type {
 } from '../types/perps-types';
 
 // Network constants
-export const ARBITRUM_MAINNET_CHAIN_ID_HEX = '0xa4b1';
+export const ARBITRUM_MAINNET_CHAIN_ID_HEX = '0xa4b1' as const;
 export const ARBITRUM_MAINNET_CHAIN_ID = '42161';
 export const ARBITRUM_TESTNET_CHAIN_ID = '421614';
 export const ARBITRUM_MAINNET_CAIP_CHAIN_ID = `eip155:${ARBITRUM_MAINNET_CHAIN_ID}`;
diff --git a/app/controllers/perps/constants/myxConfig.test.ts b/app/controllers/perps/constants/myxConfig.test.ts
index 745b2b8b6555..49435297f7d4 100644
--- a/app/controllers/perps/constants/myxConfig.test.ts
+++ b/app/controllers/perps/constants/myxConfig.test.ts
@@ -8,18 +8,13 @@ import {
   fromMYXCollateral,
   getMYXChainId,
   getMYXHttpEndpoint,
-  MYX_PRICE_DECIMALS,
   MYX_SIZE_DECIMALS,
 } from './myxConfig';
 
 describe('myxConfig', () => {
   describe('fromMYXPrice', () => {
-    it('converts a 30-decimal price string to a number', () => {
-      // 1000 * 10^30
-      const myxPrice = new BigNumber(1000)
-        .times(new BigNumber(10).pow(MYX_PRICE_DECIMALS))
-        .toFixed(0);
-      expect(fromMYXPrice(myxPrice)).toBe(1000);
+    it('parses a normal float price string', () => {
+      expect(fromMYXPrice('1000')).toBe(1000);
     });
 
     it('returns 0 for "0"', () => {
@@ -30,12 +25,14 @@ describe('myxConfig', () => {
       expect(fromMYXPrice('')).toBe(0);
     });
 
-    it('converts a realistic BTC price', () => {
-      // BTC ~65000 USD
-      const myxPrice = new BigNumber(65000)
-        .times(new BigNumber(10).pow(MYX_PRICE_DECIMALS))
-        .toFixed(0);
-      expect(fromMYXPrice(myxPrice)).toBe(65000);
+    it('parses a realistic BTC price from MYX API', () => {
+      // MYX API returns normal float strings like "64854.760266796727"
+      expect(fromMYXPrice('64854.760266796727')).toBeCloseTo(64854.76, 2);
+    });
+
+    it('parses a sub-dollar price', () => {
+      // MYX token price ≈ $0.39
+      expect(fromMYXPrice('0.390062307787905')).toBeCloseTo(0.39, 2);
     });
 
     it('returns 0 for invalid string', () => {
@@ -44,20 +41,12 @@ describe('myxConfig', () => {
   });
 
   describe('toMYXPrice', () => {
-    it('converts a number to 30-decimal price string', () => {
-      const result = toMYXPrice(1000);
-      const expected = new BigNumber(1000)
-        .times(new BigNumber(10).pow(MYX_PRICE_DECIMALS))
-        .toFixed(0);
-      expect(result).toBe(expected);
+    it('converts a number to string', () => {
+      expect(toMYXPrice(1000)).toBe('1000');
     });
 
     it('converts a string input', () => {
-      const result = toMYXPrice('2500.5');
-      const expected = new BigNumber('2500.5')
-        .times(new BigNumber(10).pow(MYX_PRICE_DECIMALS))
-        .toFixed(0);
-      expect(result).toBe(expected);
+      expect(toMYXPrice('2500.5')).toBe('2500.5');
     });
 
     it('returns "0" for invalid string', () => {
@@ -131,20 +120,18 @@ describe('myxConfig', () => {
   });
 
   describe('getMYXChainId', () => {
-    it('returns 97 for testnet', () => {
-      expect(getMYXChainId('testnet')).toBe(97);
+    it('returns 59141 (Linea Sepolia) for testnet', () => {
+      expect(getMYXChainId('testnet')).toBe(59141);
     });
 
-    it('returns 56 for mainnet', () => {
+    it('returns 56 (BNB) for mainnet', () => {
       expect(getMYXChainId('mainnet')).toBe(56);
     });
   });
 
   describe('getMYXHttpEndpoint', () => {
-    it('returns beta URL for testnet', () => {
-      expect(getMYXHttpEndpoint('testnet')).toBe(
-        'https://api-beta.myx.finance',
-      );
+    it('returns testnet URL for testnet', () => {
+      expect(getMYXHttpEndpoint('testnet')).toBe('https://api-test.myx.cash');
     });
 
     it('returns prod URL for mainnet', () => {
diff --git a/app/controllers/perps/constants/myxConfig.ts b/app/controllers/perps/constants/myxConfig.ts
index cec06e883b7c..5c0abacaa5a5 100644
--- a/app/controllers/perps/constants/myxConfig.ts
+++ b/app/controllers/perps/constants/myxConfig.ts
@@ -1,8 +1,8 @@
 /**
  * MYX Protocol Configuration Constants
  *
- * Stage 1 configuration for market display and price fetching.
- * Based on MYX SDK patterns but simplified for read-only operations.
+ * Configuration for market display, price fetching, and trading.
+ * Based on MYX SDK patterns.
  */
 
 import type { CaipChainId } from '@metamask/utils';
@@ -19,14 +19,18 @@ import type {
 // ============================================================================
 
 /**
- * BNB Chain IDs - MYX's primary network
+ * MYX Chain IDs
+ * Mainnet: BNB Chain (56)
+ * Testnet: Linea Sepolia (59141) — primary testnet chain with most active pools.
+ * The testnet API also has one pool on Arbitrum Sepolia (421614) but it has no
+ * ticker data, so Linea Sepolia is the effective testnet chain.
  */
-export const BNB_MAINNET_CHAIN_ID = '56' as const;
-export const BNB_TESTNET_CHAIN_ID = '97' as const;
-export const BNB_MAINNET_CAIP_CHAIN_ID =
-  `eip155:${BNB_MAINNET_CHAIN_ID}` as CaipChainId;
-export const BNB_TESTNET_CAIP_CHAIN_ID =
-  `eip155:${BNB_TESTNET_CHAIN_ID}` as CaipChainId;
+export const MYX_MAINNET_CHAIN_ID = '56' as const;
+export const MYX_TESTNET_CHAIN_ID = '59141' as const;
+export const MYX_MAINNET_CAIP_CHAIN_ID =
+  `eip155:${MYX_MAINNET_CHAIN_ID}` as CaipChainId;
+export const MYX_TESTNET_CAIP_CHAIN_ID =
+  `eip155:${MYX_TESTNET_CHAIN_ID}` as CaipChainId;
 
 /**
  * Get numeric chain ID for MYX network
@@ -36,8 +40,8 @@ export const BNB_TESTNET_CAIP_CHAIN_ID =
  */
 export function getMYXChainId(network: MYXNetwork): number {
   return network === 'testnet'
-    ? parseInt(BNB_TESTNET_CHAIN_ID, 10)
-    : parseInt(BNB_MAINNET_CHAIN_ID, 10);
+    ? parseInt(MYX_TESTNET_CHAIN_ID, 10)
+    : parseInt(MYX_MAINNET_CHAIN_ID, 10);
 }
 
 // ============================================================================
@@ -50,11 +54,11 @@ export function getMYXChainId(network: MYXNetwork): number {
 export const MYX_ENDPOINTS: MYXEndpoints = {
   mainnet: {
     http: 'https://api.myx.finance',
-    ws: 'wss://ws.myx.finance',
+    ws: 'wss://oapi.myx.finance/ws',
   },
   testnet: {
-    http: 'https://api-beta.myx.finance',
-    ws: 'wss://ws-beta.myx.finance',
+    http: 'https://api-test.myx.cash',
+    ws: 'wss://oapi-test.myx.cash/ws',
   },
 };
 
@@ -73,10 +77,13 @@ export function getMYXHttpEndpoint(network: MYXNetwork): string {
 // ============================================================================
 
 /**
- * MYX uses 30 decimals for price representation
- * This is consistent with the SDK's internal format
+ * MYX API returns prices as normal floating-point strings (e.g. "64854.76").
+ * No decimal scaling is needed for prices from the REST/WS API.
+ *
+ * Note: The SDK's internal contract layer uses 30 decimals, but the API
+ * endpoints (tickers, candles, order history) return human-readable values.
  */
-export const MYX_PRICE_DECIMALS = 30;
+export const MYX_PRICE_DECIMALS = 0;
 
 /**
  * MYX uses 18 decimals for position sizes
@@ -93,29 +100,36 @@ export const MYX_COLLATERAL_DECIMALS = 18;
 // ============================================================================
 
 /**
- * USDT token address on BNB testnet
+ * Collateral token address — testnet (USDC on Linea Sepolia)
+ * From SDK: LINEA_SEPOLIA.USDC
  */
-export const USDT_BNB_TESTNET =
-  '0x337610d27c682e347c9cd60bd4b3b107c9d34ddd' as const;
+export const MYX_COLLATERAL_TOKEN_TESTNET =
+  '0xD984fd34f91F92DA0586e1bE82E262fF27DC431b' as const;
 
 /**
- * USDT token address on BNB mainnet
+ * Collateral token address — mainnet (BUSD on BNB, per pool quoteToken)
+ * Note: individual pools may use different quote tokens
  */
-export const USDT_BNB_MAINNET =
-  '0x55d398326f99059ff775485246999027b3197955' as const;
+export const MYX_COLLATERAL_TOKEN_MAINNET =
+  '0x8bfc51e1928e91e47c6734983ac018b2fc0adf4e' as const;
+
+/** @deprecated Use MYX_COLLATERAL_TOKEN_TESTNET */
+export const USDT_BNB_TESTNET = MYX_COLLATERAL_TOKEN_TESTNET;
+/** @deprecated Use MYX_COLLATERAL_TOKEN_MAINNET */
+export const USDT_BNB_MAINNET = MYX_COLLATERAL_TOKEN_MAINNET;
 
 /**
- * USDT configuration by network
+ * Collateral token configuration by network
  */
 export const MYX_ASSET_CONFIGS: MYXAssetConfigs = {
   USDT: {
     mainnet: {
-      chainId: BNB_MAINNET_CAIP_CHAIN_ID,
-      tokenAddress: USDT_BNB_MAINNET,
+      chainId: MYX_MAINNET_CAIP_CHAIN_ID,
+      tokenAddress: MYX_COLLATERAL_TOKEN_MAINNET,
     },
     testnet: {
-      chainId: BNB_TESTNET_CAIP_CHAIN_ID,
-      tokenAddress: USDT_BNB_TESTNET,
+      chainId: MYX_TESTNET_CAIP_CHAIN_ID,
+      tokenAddress: MYX_COLLATERAL_TOKEN_TESTNET,
     },
   },
 };
@@ -125,9 +139,12 @@ export const MYX_ASSET_CONFIGS: MYXAssetConfigs = {
 // ============================================================================
 
 /**
- * Convert MYX SDK price (30 decimals) to standard number
+ * Convert MYX API price string to standard number.
+ *
+ * MYX API returns normal floating-point price strings (e.g. "64854.76"),
+ * NOT 30-decimal scaled integers. This is a simple parseFloat.
  *
- * @param myxPrice - Price string in 30-decimal format from SDK
+ * @param myxPrice - Price string from MYX API (e.g. "64854.760266796727")
  * @returns Standard decimal number
  */
 export function fromMYXPrice(myxPrice: string): number {
@@ -135,35 +152,21 @@ export function fromMYXPrice(myxPrice: string): number {
     return 0;
   }
 
-  try {
-    const bn = new BigNumber(myxPrice);
-    if (bn.isNaN()) {
-      return 0;
-    }
-    const divisor = new BigNumber(10).pow(MYX_PRICE_DECIMALS);
-    return bn.dividedBy(divisor).toNumber();
-  } catch {
-    return 0;
-  }
+  const parsed = parseFloat(myxPrice);
+  return isNaN(parsed) ? 0 : parsed;
 }
 
 /**
- * Convert standard number to MYX SDK price format (30 decimals)
+ * Convert standard number to MYX API price string.
+ *
+ * MYX API uses normal floating-point strings, so this is a simple toString.
  *
  * @param price - Standard decimal number
- * @returns Price string in 30-decimal format for SDK
+ * @returns Price string for MYX API
  */
 export function toMYXPrice(price: number | string): string {
-  try {
-    const bn = new BigNumber(price);
-    if (bn.isNaN()) {
-      return '0';
-    }
-    const multiplier = new BigNumber(10).pow(MYX_PRICE_DECIMALS);
-    return bn.multipliedBy(multiplier).toFixed(0);
-  } catch {
-    return '0';
-  }
+  const parsed = typeof price === 'string' ? parseFloat(price) : price;
+  return isNaN(parsed) ? '0' : parsed.toString();
 }
 
 /**
@@ -250,3 +253,32 @@ export const MYX_HTTP_TIMEOUT_MS = 10000;
  * Maximum retries for failed API requests
  */
 export const MYX_MAX_RETRIES = 3;
+
+/**
+ * Default slippage in basis points for MYX orders (1% — matches SDK default)
+ */
+export const MYX_DEFAULT_SLIPPAGE_BPS = 100;
+
+/**
+ * Maximum leverage supported by MYX (most markets)
+ */
+export const MYX_MAX_LEVERAGE = 100;
+
+/**
+ * Minimum order size in USD
+ */
+export const MYX_MINIMUM_ORDER_SIZE_USD = 10;
+
+/**
+ * MYX fee rates (placeholder — will be replaced with per-market rates)
+ */
+export const MYX_FEE_RATE = 0.0005; // 0.05% total fee rate
+export const MYX_PROTOCOL_FEE_RATE = 0.0005; // Protocol taker fee
+
+/**
+ * USDT execution fee token address per network (used for order execution fees)
+ */
+export const MYX_EXECUTION_FEE_TOKEN: Record<MYXNetwork, string> = {
+  testnet: MYX_COLLATERAL_TOKEN_TESTNET,
+  mainnet: MYX_COLLATERAL_TOKEN_MAINNET,
+};
diff --git a/app/controllers/perps/constants/perpsConfig.ts b/app/controllers/perps/constants/perpsConfig.ts
index d19c3184b20a..32b95b447d81 100644
--- a/app/controllers/perps/constants/perpsConfig.ts
+++ b/app/controllers/perps/constants/perpsConfig.ts
@@ -341,5 +341,5 @@ export const PROVIDER_CONFIG = {
   /** Default perpetual DEX provider when no explicit selection exists */
   DefaultProvider: 'hyperliquid' as const,
   /** Force MYX to testnet only (mainnet credentials not yet available) */
-  MYX_TESTNET_ONLY: true,
+  MYX_TESTNET_ONLY: false,
 } as const;
diff --git a/app/controllers/perps/providers/AggregatedPerpsProvider.test.ts b/app/controllers/perps/providers/AggregatedPerpsProvider.test.ts
index 63c61c1f3e59..2846b61e03ab 100644
--- a/app/controllers/perps/providers/AggregatedPerpsProvider.test.ts
+++ b/app/controllers/perps/providers/AggregatedPerpsProvider.test.ts
@@ -1,6 +1,13 @@
 import { createMockInfrastructure } from '../../../components/UI/Perps/__mocks__/serviceMocks';
 import { CandlePeriod } from '../constants/chartConfig';
-import type { PerpsProvider, Position, MarketInfo, Order } from '../types';
+import type {
+  PerpsProvider,
+  PerpsProviderType,
+  Position,
+  MarketInfo,
+  Order,
+} from '../types';
+import { WebSocketConnectionState } from '../types';
 
 import { AggregatedPerpsProvider } from './AggregatedPerpsProvider';
 
@@ -745,4 +752,111 @@ describe('AggregatedPerpsProvider', () => {
       expect(mockHLProvider.subscribeToOrderBook).toHaveBeenCalled();
     });
   });
+
+  describe('WebSocket', () => {
+    it('delegates getWebSocketConnectionState to default provider', () => {
+      // Arrange
+      (
+        mockHLProvider as jest.Mocked<PerpsProvider> & {
+          getWebSocketConnectionState: jest.Mock;
+        }
+      ).getWebSocketConnectionState = jest
+        .fn()
+        .mockReturnValue(WebSocketConnectionState.Connected);
+
+      // Act
+      const result = aggregatedProvider.getWebSocketConnectionState();
+
+      // Assert
+      expect(result).toBe(WebSocketConnectionState.Connected);
+    });
+
+    it('returns Disconnected when provider lacks getWebSocketConnectionState', () => {
+      // Arrange — provider without the optional method
+      const noWsProvider = createMockProvider('no-ws');
+      const testProvider = new AggregatedPerpsProvider({
+        providers: new Map([['no-ws' as PerpsProviderType, noWsProvider]]),
+        defaultProvider: 'no-ws' as PerpsProviderType,
+        infrastructure: mockInfrastructure,
+      });
+
+      // Act
+      const result = testProvider.getWebSocketConnectionState();
+
+      // Assert
+      expect(result).toBe(WebSocketConnectionState.Disconnected);
+    });
+
+    it('delegates subscribeToConnectionState to default provider', () => {
+      // Arrange
+      const unsubscribe = jest.fn();
+      (
+        mockHLProvider as jest.Mocked<PerpsProvider> & {
+          subscribeToConnectionState: jest.Mock;
+        }
+      ).subscribeToConnectionState = jest.fn().mockReturnValue(unsubscribe);
+      const listener = jest.fn();
+
+      // Act
+      const cleanup = aggregatedProvider.subscribeToConnectionState(listener);
+
+      // Assert
+      expect(cleanup).toBe(unsubscribe);
+    });
+
+    it('calls listener with Disconnected when provider lacks subscribeToConnectionState', () => {
+      // Arrange
+      const noWsProvider = createMockProvider('no-ws');
+      const testProvider = new AggregatedPerpsProvider({
+        providers: new Map([['no-ws' as PerpsProviderType, noWsProvider]]),
+        defaultProvider: 'no-ws' as PerpsProviderType,
+        infrastructure: mockInfrastructure,
+      });
+      const listener = jest.fn();
+
+      // Act
+      const cleanup = testProvider.subscribeToConnectionState(listener);
+      cleanup();
+
+      // Assert
+      expect(listener).toHaveBeenCalledWith(
+        WebSocketConnectionState.Disconnected,
+        0,
+      );
+    });
+
+    it('delegates reconnect to default provider', async () => {
+      // Arrange
+      (
+        mockHLProvider as jest.Mocked<PerpsProvider> & {
+          reconnect: jest.Mock;
+        }
+      ).reconnect = jest.fn().mockResolvedValue(undefined);
+
+      // Act
+      await aggregatedProvider.reconnect();
+
+      // Assert
+      expect(
+        (
+          mockHLProvider as jest.Mocked<PerpsProvider> & {
+            reconnect: jest.Mock;
+          }
+        ).reconnect,
+      ).toHaveBeenCalled();
+    });
+
+    it('does not throw when provider lacks reconnect', async () => {
+      // Arrange — provider without reconnect
+      const noWsProvider = createMockProvider('no-ws');
+      const testProvider = new AggregatedPerpsProvider({
+        providers: new Map([['no-ws' as PerpsProviderType, noWsProvider]]),
+        defaultProvider: 'no-ws' as PerpsProviderType,
+        infrastructure: mockInfrastructure,
+      });
+
+      // Act & Assert
+      await expect(testProvider.reconnect()).resolves.toBeUndefined();
+    });
+  });
 });
diff --git a/app/controllers/perps/providers/AggregatedPerpsProvider.ts b/app/controllers/perps/providers/AggregatedPerpsProvider.ts
index 87737f5cb06e..d94941bc3683 100644
--- a/app/controllers/perps/providers/AggregatedPerpsProvider.ts
+++ b/app/controllers/perps/providers/AggregatedPerpsProvider.ts
@@ -18,6 +18,7 @@ import type { CaipAccountId } from '@metamask/utils';
 
 import { SubscriptionMultiplexer } from '../aggregation/SubscriptionMultiplexer';
 import { ProviderRouter } from '../routing/ProviderRouter';
+import { WebSocketConnectionState } from '../types';
 import type {
   AccountState,
   AggregatedProviderConfig,
@@ -678,6 +679,37 @@ export class AggregatedPerpsProvider implements PerpsProvider {
     return this.#getDefaultProvider().ping(timeoutMs);
   }
 
+  getWebSocketConnectionState(): WebSocketConnectionState {
+    const provider = this.#getDefaultProvider();
+    if (provider.getWebSocketConnectionState) {
+      return provider.getWebSocketConnectionState();
+    }
+    return WebSocketConnectionState.Disconnected;
+  }
+
+  subscribeToConnectionState(
+    listener: (
+      state: WebSocketConnectionState,
+      reconnectionAttempt: number,
+    ) => void,
+  ): () => void {
+    const provider = this.#getDefaultProvider();
+    if (provider.subscribeToConnectionState) {
+      return provider.subscribeToConnectionState(listener);
+    }
+    listener(WebSocketConnectionState.Disconnected, 0);
+    return () => {
+      /* noop */
+    };
+  }
+
+  async reconnect(): Promise<void> {
+    const provider = this.#getDefaultProvider();
+    if (provider.reconnect) {
+      await provider.reconnect();
+    }
+  }
+
   // ============================================================================
   // Block Explorer
   // ============================================================================
diff --git a/app/controllers/perps/providers/HyperLiquidProvider.test.ts b/app/controllers/perps/providers/HyperLiquidProvider.test.ts
index e59ee50ae9b4..0a4e43d54604 100644
--- a/app/controllers/perps/providers/HyperLiquidProvider.test.ts
+++ b/app/controllers/perps/providers/HyperLiquidProvider.test.ts
@@ -300,6 +300,7 @@ const createMockExchangeClient = (overrides: Record<string, unknown> = {}) => ({
 // Create shared mock platform dependencies for provider tests
 const mockPlatformDependencies: PerpsPlatformDependencies =
   createMockInfrastructure();
+
 const mockMessenger = createMockMessenger();
 
 /**
@@ -1043,46 +1044,15 @@ describe('HyperLiquidProvider', () => {
         ],
       });
 
-      const pumpUniverse = [
-        { name: 'BTC', szDecimals: 3, maxLeverage: 50 },
-        { name: 'ETH', szDecimals: 4, maxLeverage: 50 },
-        { name: 'PUMP', szDecimals: 2, maxLeverage: 20 },
-      ];
       mockClientService.getInfoClient = jest.fn().mockReturnValue(
         createMockInfoClient({
-          meta: jest.fn().mockResolvedValue({ universe: pumpUniverse }),
-          metaAndAssetCtxs: jest.fn().mockResolvedValue([
-            { universe: pumpUniverse },
-            [
-              {
-                funding: '0.0001',
-                openInterest: '1000',
-                prevDayPx: '49000',
-                dayNtlVlm: '1000000',
-                markPx: '50000',
-                midPx: '50000',
-                oraclePx: '50000',
-              },
-              {
-                funding: '0.0001',
-                openInterest: '500',
-                prevDayPx: '2900',
-                dayNtlVlm: '500000',
-                markPx: '3000',
-                midPx: '3000',
-                oraclePx: '3000',
-              },
-              {
-                funding: '0.0001',
-                openInterest: '100',
-                prevDayPx: '0.003',
-                dayNtlVlm: '10000',
-                markPx: '0.003918',
-                midPx: '0.003918',
-                oraclePx: '0.003918',
-              },
+          meta: jest.fn().mockResolvedValue({
+            universe: [
+              { name: 'BTC', szDecimals: 3, maxLeverage: 50 },
+              { name: 'ETH', szDecimals: 4, maxLeverage: 50 },
+              { name: 'PUMP', szDecimals: 2, maxLeverage: 20 },
             ],
-          ]),
+          }),
           allMids: jest
             .fn()
             .mockResolvedValue({ BTC: '50000', ETH: '3000', PUMP: '0.003918' }),
@@ -1129,46 +1099,15 @@ describe('HyperLiquidProvider', () => {
         ],
       });
 
-      const pumpUniverse = [
-        { name: 'BTC', szDecimals: 3, maxLeverage: 50 },
-        { name: 'ETH', szDecimals: 4, maxLeverage: 50 },
-        { name: 'PUMP', szDecimals: 2, maxLeverage: 20 },
-      ];
       mockClientService.getInfoClient = jest.fn().mockReturnValue(
         createMockInfoClient({
-          meta: jest.fn().mockResolvedValue({ universe: pumpUniverse }),
-          metaAndAssetCtxs: jest.fn().mockResolvedValue([
-            { universe: pumpUniverse },
-            [
-              {
-                funding: '0.0001',
-                openInterest: '1000',
-                prevDayPx: '49000',
-                dayNtlVlm: '1000000',
-                markPx: '50000',
-                midPx: '50000',
-                oraclePx: '50000',
-              },
-              {
-                funding: '0.0001',
-                openInterest: '500',
-                prevDayPx: '2900',
-                dayNtlVlm: '500000',
-                markPx: '3000',
-                midPx: '3000',
-                oraclePx: '3000',
-              },
-              {
-                funding: '0.0001',
-                openInterest: '100',
-                prevDayPx: '0.003',
-                dayNtlVlm: '10000',
-                markPx: '0.003918',
-                midPx: '0.003918',
-                oraclePx: '0.003918',
-              },
+          meta: jest.fn().mockResolvedValue({
+            universe: [
+              { name: 'BTC', szDecimals: 3, maxLeverage: 50 },
+              { name: 'ETH', szDecimals: 4, maxLeverage: 50 },
+              { name: 'PUMP', szDecimals: 2, maxLeverage: 20 },
             ],
-          ]),
+          }),
           allMids: jest
             .fn()
             .mockResolvedValue({ BTC: '50000', ETH: '3000', PUMP: '0.003918' }),
@@ -1370,20 +1309,6 @@ describe('HyperLiquidProvider', () => {
         meta: jest.fn().mockResolvedValue({
           universe: [{ name: 'BTC', szDecimals: 3, maxLeverage: 50 }],
         }),
-        metaAndAssetCtxs: jest.fn().mockResolvedValue([
-          { universe: [{ name: 'BTC', szDecimals: 3, maxLeverage: 50 }] },
-          [
-            {
-              funding: '0.0001',
-              openInterest: '1000',
-              prevDayPx: '49000',
-              dayNtlVlm: '1000000',
-              markPx: '50000',
-              midPx: '50000',
-              oraclePx: '50000',
-            },
-          ],
-        ]),
         perpDexs: jest.fn().mockResolvedValue([null]),
         allMids: jest.fn().mockResolvedValue({ BTC: '50000' }),
         referral: jest.fn().mockResolvedValue({
@@ -1472,20 +1397,6 @@ describe('HyperLiquidProvider', () => {
         meta: jest.fn().mockResolvedValue({
           universe: [{ name: 'ETH', szDecimals: 4, maxLeverage: 50 }],
         }),
-        metaAndAssetCtxs: jest.fn().mockResolvedValue([
-          { universe: [{ name: 'ETH', szDecimals: 4, maxLeverage: 50 }] },
-          [
-            {
-              funding: '0.0001',
-              openInterest: '500',
-              prevDayPx: '2900',
-              dayNtlVlm: '500000',
-              markPx: '3000',
-              midPx: '3000',
-              oraclePx: '3000',
-            },
-          ],
-        ]),
         perpDexs: jest.fn().mockResolvedValue([null]),
         allMids: jest.fn().mockResolvedValue({ ETH: '3000' }),
         referral: jest.fn().mockResolvedValue({
@@ -1650,20 +1561,6 @@ describe('HyperLiquidProvider', () => {
         meta: jest.fn().mockResolvedValue({
           universe: [{ name: 'BTC', szDecimals: 3, maxLeverage: 50 }],
         }),
-        metaAndAssetCtxs: jest.fn().mockResolvedValue([
-          { universe: [{ name: 'BTC', szDecimals: 3, maxLeverage: 50 }] },
-          [
-            {
-              funding: '0.0001',
-              openInterest: '1000',
-              prevDayPx: '49000',
-              dayNtlVlm: '1000000',
-              markPx: '50000',
-              midPx: '50000',
-              oraclePx: '50000',
-            },
-          ],
-        ]),
         perpDexs: jest.fn().mockResolvedValue([null]),
         allMids: jest.fn().mockResolvedValue({ BTC: '50000' }),
         referral: jest.fn().mockResolvedValue({
@@ -1747,20 +1644,6 @@ describe('HyperLiquidProvider', () => {
         meta: jest.fn().mockResolvedValue({
           universe: [{ name: 'BTC', szDecimals: 3, maxLeverage: 50 }],
         }),
-        metaAndAssetCtxs: jest.fn().mockResolvedValue([
-          { universe: [{ name: 'BTC', szDecimals: 3, maxLeverage: 50 }] },
-          [
-            {
-              funding: '0.0001',
-              openInterest: '1000',
-              prevDayPx: '49000',
-              dayNtlVlm: '1000000',
-              markPx: '50000',
-              midPx: '50000',
-              oraclePx: '50000',
-            },
-          ],
-        ]),
         perpDexs: jest.fn().mockResolvedValue([null]),
         allMids: jest.fn().mockResolvedValue({ BTC: '50000' }),
         referral: jest.fn().mockResolvedValue({
@@ -2051,10 +1934,7 @@ describe('HyperLiquidProvider', () => {
 
       expect(Array.isArray(markets)).toBe(true);
       expect(markets.length).toBeGreaterThan(0);
-      // buildAssetMapping (via ensureReady) uses metaAndAssetCtxs to populate cache; getMarkets uses cached meta
-      expect(
-        mockClientService.getInfoClient().metaAndAssetCtxs,
-      ).toHaveBeenCalled();
+      expect(mockClientService.getInfoClient().meta).toHaveBeenCalled();
     });
 
     it('handles data retrieval errors gracefully', async () => {
@@ -3167,11 +3047,10 @@ describe('HyperLiquidProvider', () => {
       });
 
       it('handles string response from meta endpoint', async () => {
-        // metaAndAssetCtxs returns no valid meta so cache is not populated; buildAssetMapping leaves map empty
+        // Test updatePositionTPSL with string meta response (invalid data type)
         mockClientService.getInfoClient = jest.fn().mockReturnValue(
           createMockInfoClient({
             meta: jest.fn().mockResolvedValue('invalid string response' as any), // eslint-disable-line @typescript-eslint/no-explicit-any
-            metaAndAssetCtxs: jest.fn().mockResolvedValue([null, []]), // No valid meta -> no cache, no asset mapping
           }),
         );
 
@@ -3185,19 +3064,13 @@ describe('HyperLiquidProvider', () => {
         const result = await provider.updatePositionTPSL(updateParams);
 
         expect(result.success).toBe(false);
-        // With no valid meta from metaAndAssetCtxs, asset mapping is empty so we fail with asset not found
-        expect(
-          result.error?.includes('Asset ID not found') ||
-            result.error?.includes('Invalid meta response'),
-        ).toBe(true);
+        expect(result.error).toContain('Invalid meta response');
       });
 
       it('handles meta response without universe property', async () => {
-        // metaAndAssetCtxs returns no valid meta so cache is not populated; buildAssetMapping leaves map empty
         mockClientService.getInfoClient = jest.fn().mockReturnValue(
           createMockInfoClient({
             meta: jest.fn().mockResolvedValue({}), // Empty object without universe
-            metaAndAssetCtxs: jest.fn().mockResolvedValue([null, []]), // No valid meta -> no cache, no asset mapping
           }),
         );
 
@@ -3209,11 +3082,7 @@ describe('HyperLiquidProvider', () => {
         const result = await provider.updatePositionTPSL(updateParams);
 
         expect(result.success).toBe(false);
-        // With no valid meta from metaAndAssetCtxs, asset mapping is empty so we fail with asset not found
-        expect(
-          result.error?.includes('Asset ID not found') ||
-            result.error?.includes('Invalid meta response'),
-        ).toBe(true);
+        expect(result.error).toContain('Invalid meta response');
       });
     });
 
@@ -4907,34 +4776,6 @@ describe('HyperLiquidProvider', () => {
             { name: 'ETH', szDecimals: 4, maxLeverage: 50 },
           ],
         }),
-        metaAndAssetCtxs: jest.fn().mockResolvedValue([
-          {
-            universe: [
-              { name: 'BTC', szDecimals: 3, maxLeverage: 50 },
-              { name: 'ETH', szDecimals: 4, maxLeverage: 50 },
-            ],
-          },
-          [
-            {
-              funding: '0.0001',
-              openInterest: '1000',
-              prevDayPx: '49000',
-              dayNtlVlm: '1000000',
-              markPx: '50000',
-              midPx: '50000',
-              oraclePx: '50000',
-            },
-            {
-              funding: '0.0001',
-              openInterest: '500',
-              prevDayPx: '2900',
-              dayNtlVlm: '500000',
-              markPx: '3000',
-              midPx: '3000',
-              oraclePx: '3000',
-            },
-          ],
-        ]),
         perpDexs: jest.fn().mockResolvedValue([null]),
         allMids: jest.fn().mockResolvedValue({ BTC: '50000', ETH: '3000' }),
         frontendOpenOrders: jest.fn().mockResolvedValue([]),
@@ -5038,34 +4879,6 @@ describe('HyperLiquidProvider', () => {
             { name: 'ETH', szDecimals: 4, maxLeverage: 50 },
           ],
         }),
-        metaAndAssetCtxs: jest.fn().mockResolvedValue([
-          {
-            universe: [
-              { name: 'BTC', szDecimals: 3, maxLeverage: 50 },
-              { name: 'ETH', szDecimals: 4, maxLeverage: 50 },
-            ],
-          },
-          [
-            {
-              funding: '0.0001',
-              openInterest: '1000',
-              prevDayPx: '49000',
-              dayNtlVlm: '1000000',
-              markPx: '50000',
-              midPx: '50000',
-              oraclePx: '50000',
-            },
-            {
-              funding: '0.0001',
-              openInterest: '500',
-              prevDayPx: '2900',
-              dayNtlVlm: '500000',
-              markPx: '3000',
-              midPx: '3000',
-              oraclePx: '3000',
-            },
-          ],
-        ]),
         perpDexs: jest.fn().mockResolvedValue([null]),
         allMids: jest.fn().mockResolvedValue({ BTC: '50000', ETH: '3000' }),
         frontendOpenOrders: jest.fn().mockResolvedValue([]),
@@ -8733,4 +8546,26 @@ describe('HyperLiquidProvider', () => {
       });
     });
   });
+
+  describe('buildAssetMapping with perpDexs network failure', () => {
+    it('completes asset mapping using fallback when perpDexs throws', async () => {
+      // Arrange — perpDexs throws, so getValidatedDexs falls back to [null]
+      const freshProvider = createTestProvider({ hip3Enabled: true });
+      mockClientService.getInfoClient = jest.fn().mockReturnValue(
+        createMockInfoClient({
+          perpDexs: jest.fn().mockRejectedValue(new Error('Network timeout')),
+        }),
+      );
+      MockedHyperLiquidClientService.mockImplementation(
+        () => mockClientService,
+      );
+
+      // Act — triggering ensureReady -> buildAssetMapping via getPositions
+      await freshProvider.initialize();
+      const markets = await freshProvider.getMarkets();
+
+      // Assert — provider remains functional with main DEX only
+      expect(Array.isArray(markets)).toBe(true);
+    });
+  });
 });
diff --git a/app/controllers/perps/providers/HyperLiquidProvider.ts b/app/controllers/perps/providers/HyperLiquidProvider.ts
index 94bd9b27cbb9..57d45f64b56d 100644
--- a/app/controllers/perps/providers/HyperLiquidProvider.ts
+++ b/app/controllers/perps/providers/HyperLiquidProvider.ts
@@ -27,7 +27,6 @@ import {
   WITHDRAWAL_CONSTANTS,
 } from '../constants/perpsConfig';
 import { PERPS_TRANSACTIONS_HISTORY_CONSTANTS } from '../constants/transactionsHistoryConfig';
-import type { PerpsControllerMessenger } from '../PerpsController';
 import { PERPS_ERROR_CODES } from '../perpsErrorCodes';
 import {
   HyperLiquidClientService,
@@ -106,6 +105,7 @@ import type {
   FrontendOrder,
   SpotMetaResponse,
 } from '../types/hyperliquid-types';
+import type { PerpsControllerMessengerBase } from '../types/messenger';
 import type { ExtendedAssetMeta, ExtendedPerpDex } from '../types/perps-types';
 import { aggregateAccountStates } from '../utils/accountUtils';
 import { ensureError } from '../utils/errorUtils';
@@ -314,11 +314,6 @@ export class HyperLiquidProvider implements PerpsProvider {
 
   #cachedAllPerpDexs: ({ name: string } | null)[] | null = null;
 
-  // True once DEX discovery has succeeded with real data (not a fallback).
-  // When false, #ensureReadyPromise is reset after each init so the next
-  // caller retries DEX discovery instead of reusing a degraded mapping.
-  #dexDiscoveryComplete = false;
-
   // Pending promise to deduplicate concurrent getValidatedDexs() calls
   #pendingValidatedDexsPromise: Promise<(string | null)[]> | null = null;
 
@@ -338,6 +333,8 @@ export class HyperLiquidProvider implements PerpsProvider {
   // Promise-based lock to prevent race conditions in concurrent initialization
   #initializationPromise: Promise<void> | null = null;
 
+  readonly #messenger: PerpsControllerMessengerBase;
+
   constructor(options: {
     isTestnet?: boolean;
     hip3Enabled?: boolean;
@@ -345,10 +342,11 @@ export class HyperLiquidProvider implements PerpsProvider {
     blocklistMarkets?: string[];
     useDexAbstraction?: boolean;
     platformDependencies: PerpsPlatformDependencies;
-    messenger: PerpsControllerMessenger;
+    messenger: PerpsControllerMessengerBase;
     initialAssetMapping?: [string, number][];
   }) {
     this.#deps = options.platformDependencies;
+    this.#messenger = options.messenger;
     const isTestnet = options.isTestnet ?? false;
 
     // Dev-friendly defaults: Enable all markets by default for easier testing (discovery mode)
@@ -359,14 +357,16 @@ export class HyperLiquidProvider implements PerpsProvider {
     // Attempt native balance abstraction, fallback to programmatic transfer if unsupported
     this.#useDexAbstraction = options.useDexAbstraction ?? true;
 
-    // Initialize services with injected platform dependencies and messenger
+    // Initialize services with injected platform dependencies
     this.#clientService = new HyperLiquidClientService(this.#deps, {
       isTestnet,
     });
     this.#walletService = new HyperLiquidWalletService(
       this.#deps,
-      options.messenger,
-      { isTestnet },
+      this.#messenger,
+      {
+        isTestnet,
+      },
     );
     this.#subscriptionService = new HyperLiquidSubscriptionService(
       this.#clientService,
@@ -695,8 +695,8 @@ export class HyperLiquidProvider implements PerpsProvider {
       // Verify clients are properly initialized
       this.#clientService.ensureInitialized();
 
-      // Build asset mapping on first call, or retry if DEX discovery previously failed
-      if (this.#symbolToAssetId.size === 0 || !this.#dexDiscoveryComplete) {
+      // Build asset mapping on first call only (flags are immutable)
+      if (this.#symbolToAssetId.size === 0) {
         this.#deps.debugLogger.log(
           'HyperLiquidProvider: Building asset mapping',
           {
@@ -714,15 +714,8 @@ export class HyperLiquidProvider implements PerpsProvider {
     })();
 
     // Await initialization - keep the promise so subsequent calls resolve immediately
-    // The promise is only reset in disconnect() for clean reconnection,
-    // or when DEX discovery was degraded so the next caller retries.
+    // The promise is only reset in disconnect() for clean reconnection
     await this.#ensureReadyPromise;
-    if (!this.#dexDiscoveryComplete) {
-      // DEX discovery failed transiently — reset so next call retries.
-      // Trading still works (main DEX mapping is populated), but HIP-3 markets
-      // will be re-discovered on the next #ensureReady() call.
-      this.#ensureReadyPromise = null;
-    }
     this.#deps.debugLogger.log('[ensureReady] Initialization complete');
   }
 
@@ -1045,23 +1038,25 @@ export class HyperLiquidProvider implements PerpsProvider {
         ensureError(error, 'HyperLiquidProvider.fetchValidatedDexsInternal'),
         this.#getErrorContext('getValidatedDexs.perpDexs'),
       );
-      // Do not cache — transient error, allow retry on next call
-      return [null];
+      this.#cachedAllPerpDexs = [null];
+      this.#cachedValidatedDexs = [null];
+      return this.#cachedValidatedDexs;
     }
 
+    // Cache for buildAssetMapping() to avoid duplicate call
+    this.#cachedAllPerpDexs = allDexs;
+
     // Validate API response
     if (!allDexs || !Array.isArray(allDexs)) {
       this.#deps.debugLogger.log(
         'HyperLiquidProvider: Failed to fetch DEX list (invalid response), falling back to main DEX only',
         { allDexs },
       );
-      // Do not cache — may be transient, allow retry on next call
-      return [null];
+      this.#cachedAllPerpDexs = [null];
+      this.#cachedValidatedDexs = [null];
+      return this.#cachedValidatedDexs;
     }
 
-    // Cache for buildAssetMapping() to avoid duplicate call
-    this.#cachedAllPerpDexs = allDexs;
-
     // Extract HIP-3 DEX names (filter out null which represents main DEX)
     const availableHip3Dexs: string[] = [];
     allDexs.forEach((dex) => {
@@ -1249,7 +1244,9 @@ export class HyperLiquidProvider implements PerpsProvider {
 
     // Cache miss or skipCache=true - fetch from API
     const infoClient = this.#clientService.getInfoClient();
-    const meta = await infoClient.meta({ dex: dexKey });
+    // Pass dex only for HIP-3 DEXs; omit for main DEX (empty string).
+    // Testnet API returns null when dex="" is explicitly sent.
+    const meta = await infoClient.meta(dexKey ? { dex: dexKey } : undefined);
 
     // Defensive validation before caching
     if (!meta?.universe || !Array.isArray(meta.universe)) {
@@ -1943,24 +1940,16 @@ export class HyperLiquidProvider implements PerpsProvider {
     let dexsToMap: (string | null)[];
     try {
       dexsToMap = await this.#getValidatedDexs();
-      // Mark DEX discovery as complete only when we got real data (not a fallback).
-      // #cachedValidatedDexs is null when #fetchValidatedDexsInternal returned [null]
-      // without caching (transient failure) — in that case we stay incomplete so
-      // #ensureReady resets its promise and retries on the next call.
-      if (this.#cachedValidatedDexs !== null) {
-        this.#dexDiscoveryComplete = true;
-      }
     } catch (dexError) {
       // If getValidatedDexs fails, fall back to main DEX only to keep the provider
       // functional. Without this, a transient perpDexs() failure would permanently
       // brick #ensureReady via the cached rejected promise.
-      // Do not set #cachedAllPerpDexs or #cachedValidatedDexs here — leave them null
-      // so #getValidatedDexs retries on the next call (same as #fetchValidatedDexsInternal).
       this.#deps.debugLogger.log(
         '[buildAssetMapping] getValidatedDexs failed, falling back to main DEX',
         { error: String(dexError) },
       );
       this.#cachedAllPerpDexs = this.#cachedAllPerpDexs ?? [null];
+      this.#cachedValidatedDexs = this.#cachedValidatedDexs ?? [null];
       dexsToMap = [null];
     }
 
@@ -7326,7 +7315,6 @@ export class HyperLiquidProvider implements PerpsProvider {
       this.#cachedMetaByDex.clear();
       this.#cachedSpotMeta = null;
       this.#perpDexsCache = { data: null, timestamp: 0 };
-      this.#dexDiscoveryComplete = false;
 
       // Await pending initialization before clearing to prevent the IIFE from
       // setting clientsInitialized = true after disconnect completes
diff --git a/app/controllers/perps/providers/MYXProvider.test.ts b/app/controllers/perps/providers/MYXProvider.test.ts
index f6fc1a2a04e1..18d0c0a611dd 100644
--- a/app/controllers/perps/providers/MYXProvider.test.ts
+++ b/app/controllers/perps/providers/MYXProvider.test.ts
@@ -1,4 +1,7 @@
-import { createMockInfrastructure } from '../../../components/UI/Perps/__mocks__/serviceMocks';
+import {
+  createMockInfrastructure,
+  createMockMessenger,
+} from '../../../components/UI/Perps/__mocks__/serviceMocks';
 import { CandlePeriod } from '../constants/chartConfig';
 import { MYXClientService } from '../services/MYXClientService';
 import { WebSocketConnectionState } from '../types';
@@ -18,13 +21,33 @@ import { MYXProvider } from './MYXProvider';
 // Mocks
 // ============================================================================
 
+jest.mock('../../../core/AppConstants', () => ({
+  __esModule: true,
+  default: { ZERO_ADDRESS: '0x0000000000000000000000000000000000000000' },
+}));
 jest.mock('../services/MYXClientService');
+jest.mock('../services/MYXWalletService', () => ({
+  MYXWalletService: jest.fn().mockImplementation(() => ({
+    createEthersSigner: jest.fn().mockReturnValue({}),
+    createWalletClient: jest.fn().mockReturnValue({}),
+    getUserAddress: jest.fn().mockReturnValue('0xuser123'),
+  })),
+}));
 jest.mock('../utils/myxAdapter', () => ({
   adaptMarketFromMYX: jest.fn(),
   adaptMarketDataFromMYX: jest.fn(),
   adaptPriceFromMYX: jest.fn(),
+  adaptCandleFromMYX: jest.fn(),
+  adaptCandleFromMYXWebSocket: jest.fn(),
+  adaptPositionFromMYX: jest.fn(),
+  adaptOrderFromMYX: jest.fn(),
+  adaptAccountStateFromMYX: jest.fn(),
+  adaptOrderFillFromMYX: jest.fn(),
+  adaptFundingFromMYX: jest.fn(),
+  adaptUserHistoryFromMYX: jest.fn(),
   filterMYXExclusiveMarkets: jest.fn(),
   buildPoolSymbolMap: jest.fn(),
+  toMYXKlineResolution: jest.fn().mockReturnValue('1h'),
 }));
 // WebSocketConnectionState is now defined inline in types/index.ts (no mock needed)
 
@@ -53,7 +76,7 @@ const mockBuildPoolSymbolMap = buildPoolSymbolMap as jest.MockedFunction<
 
 function makePool(overrides: Partial<MYXPoolSymbol> = {}): MYXPoolSymbol {
   return {
-    chainId: 97,
+    chainId: 421614,
     marketId: 'market-1',
     poolId: '0xpool1',
     baseSymbol: 'RHEA',
@@ -67,10 +90,10 @@ function makePool(overrides: Partial<MYXPoolSymbol> = {}): MYXPoolSymbol {
 
 function makeTicker(overrides: Partial<MYXTicker> = {}): MYXTicker {
   return {
-    chainId: 97,
+    chainId: 421614,
     poolId: '0xpool1',
     oracleId: 1,
-    price: '1500000000000000000000000000000000',
+    price: '1500.00',
     change: '2.5',
     high: '0',
     low: '0',
@@ -258,19 +281,11 @@ describe('MYXProvider', () => {
 
       expect(result).toEqual({
         ready: false,
-        error: 'MYX trading not yet supported',
+        error: 'MYX provider requires messenger for wallet operations',
         walletConnected: false,
         networkSupported: true,
       });
     });
-
-    it('reports networkSupported false for mainnet provider', async () => {
-      const mainnetProvider = createProvider(mockDeps, false);
-
-      const result = await mainnetProvider.isReadyToTrade();
-
-      expect(result.networkSupported).toBe(false);
-    });
   });
 
   // ==========================================================================
@@ -294,14 +309,13 @@ describe('MYXProvider', () => {
       expect(result).toHaveLength(2);
     });
 
-    it('throws error on failure', async () => {
+    it('returns empty array on failure', async () => {
       mockClientService.getMarkets.mockRejectedValueOnce(
         new Error('Market fetch failed'),
       );
 
-      await expect(provider.getMarkets()).rejects.toThrow(
-        'Market fetch failed',
-      );
+      const result = await provider.getMarkets();
+      expect(result).toEqual([]);
       expect(mockDeps.logger.error).toHaveBeenCalled();
     });
   });
@@ -335,41 +349,26 @@ describe('MYXProvider', () => {
       );
     });
 
-    it('passes undefined ticker when pool has no matching ticker', async () => {
+    it('filters out pools with no matching ticker', async () => {
       const pools = [makePool({ poolId: '0xpool1' })];
       const tickers = [makeTicker({ poolId: '0xDIFFERENT' })];
       mockClientService.getMarkets.mockResolvedValue(pools);
       mockFilterMYXExclusiveMarkets.mockReturnValue(pools);
       mockClientService.getTickers.mockResolvedValueOnce(tickers);
-      mockAdaptMarketDataFromMYX.mockReturnValue({
-        symbol: 'RHEA',
-        name: 'Rhea Finance',
-        maxLeverage: '100x',
-        price: '$0.00',
-        change24h: '+$0.00',
-        change24hPercent: '+0.00%',
-        volume: '$0.00',
-        providerId: 'myx',
-      });
 
       const result = await provider.getMarketDataWithPrices();
 
-      expect(result).toHaveLength(1);
-      expect(mockAdaptMarketDataFromMYX).toHaveBeenCalledWith(
-        pools[0],
-        undefined,
-        mockDeps.marketDataFormatters,
-      );
+      expect(result).toHaveLength(0);
+      expect(mockAdaptMarketDataFromMYX).not.toHaveBeenCalled();
     });
 
-    it('throws error on failure', async () => {
+    it('returns empty array on failure', async () => {
       mockClientService.getMarkets.mockRejectedValueOnce(
         new Error('Data error'),
       );
 
-      await expect(provider.getMarketDataWithPrices()).rejects.toThrow(
-        'Data error',
-      );
+      const result = await provider.getMarketDataWithPrices();
+      expect(result).toEqual([]);
     });
   });
 
@@ -563,7 +562,6 @@ describe('MYXProvider', () => {
       const result = await provider.updateMargin({
         symbol: 'RHEA',
         amount: '100',
-        isAdd: true,
       });
 
       expect(result).toEqual({
@@ -868,13 +866,13 @@ describe('MYXProvider', () => {
   describe('getBlockExplorerUrl', () => {
     it('returns testnet explorer URL without address', () => {
       expect(provider.getBlockExplorerUrl()).toBe(
-        'https://testnet.bscscan.com',
+        'https://sepolia.arbiscan.io',
       );
     });
 
     it('returns testnet explorer URL with address', () => {
       expect(provider.getBlockExplorerUrl('0xabc')).toBe(
-        'https://testnet.bscscan.com/address/0xabc',
+        'https://sepolia.arbiscan.io/address/0xabc',
       );
     });
 
@@ -893,6 +891,214 @@ describe('MYXProvider', () => {
     });
   });
 
+  // ==========================================================================
+  // Authenticated Read Operations
+  // ==========================================================================
+
+  /* eslint-disable @typescript-eslint/no-explicit-any */
+  describe('authenticated reads', () => {
+    let authProvider: MYXProvider;
+    let authClientService: jest.Mocked<MYXClientService>;
+
+    beforeEach(() => {
+      // Re-set MYXWalletService mock (cleared by outer jest.clearAllMocks)
+      const { MYXWalletService } = jest.requireMock(
+        '../services/MYXWalletService',
+      ) as {
+        MYXWalletService: jest.Mock;
+      };
+      MYXWalletService.mockImplementation(() => ({
+        createEthersSigner: jest.fn().mockReturnValue({}),
+        createWalletClient: jest.fn().mockReturnValue({}),
+        getUserAddress: jest.fn().mockReturnValue('0xuser123'),
+      }));
+
+      const { createMockMessenger: createMsg } = jest.requireActual(
+        '../../../components/UI/Perps/__mocks__/serviceMocks',
+      ) as { createMockMessenger: typeof createMockMessenger };
+      const messenger = createMsg();
+
+      authProvider = new MYXProvider({
+        isTestnet: true,
+        platformDependencies: mockDeps,
+        messenger: messenger as any,
+      });
+      const instances = MockedMYXClientService.mock.instances;
+      authClientService = instances[
+        instances.length - 1
+      ] as jest.Mocked<MYXClientService>;
+
+      // Pre-authenticate so all reads succeed
+      authClientService.isAuthenticatedForAddress.mockReturnValue(true);
+      authClientService.authenticate.mockResolvedValue(undefined);
+    });
+
+    describe('getPositions', () => {
+      it('returns adapted positions after authentication', async () => {
+        const mockRawPositions = [
+          { size: '1.5', symbol: 'BTC', poolId: '0xpool1' },
+        ];
+        authClientService.listPositions.mockResolvedValue({
+          data: mockRawPositions,
+        } as any);
+        const { adaptPositionFromMYX: mockAdapt } = jest.requireMock(
+          '../utils/myxAdapter',
+        ) as { adaptPositionFromMYX: jest.Mock };
+        mockAdapt.mockReturnValue({
+          symbol: 'BTC',
+          size: '1.5',
+          providerId: 'myx',
+        });
+
+        const result = await authProvider.getPositions();
+
+        expect(result).toHaveLength(1);
+        expect(result[0].symbol).toBe('BTC');
+        expect(authClientService.listPositions).toHaveBeenCalledWith(
+          '0xuser123',
+        );
+      });
+
+      it('filters out zero-size positions', async () => {
+        authClientService.listPositions.mockResolvedValue({
+          data: [
+            { size: '0', symbol: 'BTC', poolId: '0xpool1' },
+            { size: '1.0', symbol: 'ETH', poolId: '0xpool2' },
+          ],
+        } as any);
+        const { adaptPositionFromMYX: mockAdapt } = jest.requireMock(
+          '../utils/myxAdapter',
+        ) as { adaptPositionFromMYX: jest.Mock };
+        mockAdapt.mockReturnValue({ symbol: 'ETH', size: '1.0' });
+
+        const result = await authProvider.getPositions();
+
+        expect(result).toHaveLength(1);
+      });
+
+      it('returns empty array when data is null', async () => {
+        authClientService.listPositions.mockResolvedValue({
+          data: null,
+        } as any);
+
+        const result = await authProvider.getPositions();
+
+        expect(result).toEqual([]);
+      });
+    });
+
+    describe('getAccountState', () => {
+      it('returns adapted account state', async () => {
+        authClientService.getChainId.mockReturnValue(421614);
+        authClientService.getWalletQuoteTokenBalance.mockResolvedValue({
+          data: '1000',
+        } as any);
+        authClientService.getAccountInfo.mockResolvedValue({
+          data: { balance: '1000' },
+        } as any);
+
+        const { adaptAccountStateFromMYX: mockAdapt } = jest.requireMock(
+          '../utils/myxAdapter',
+        ) as { adaptAccountStateFromMYX: jest.Mock };
+        mockAdapt.mockReturnValue({
+          totalBalance: '1000',
+          availableBalance: '800',
+          marginUsed: '200',
+          unrealizedPnl: '50',
+          returnOnEquity: '5',
+        });
+
+        // Need pools cache for account info fetch
+        authClientService.getMarkets.mockResolvedValue([makePool()]);
+        mockFilterMYXExclusiveMarkets.mockImplementation((pools) => pools);
+        mockBuildPoolSymbolMap.mockReturnValue(new Map());
+        await authProvider.initialize();
+
+        const result = await authProvider.getAccountState();
+
+        expect(result.totalBalance).toBe('1000');
+        expect(authClientService.getWalletQuoteTokenBalance).toHaveBeenCalled();
+        expect(authClientService.getAccountInfo).toHaveBeenCalled();
+      });
+    });
+
+    describe('getOrders', () => {
+      it('returns adapted orders', async () => {
+        authClientService.getOrderHistory.mockResolvedValue({
+          data: [{ orderId: 'o1', orderStatus: 1 }],
+        } as any);
+        const { adaptOrderFromMYX: mockAdapt } = jest.requireMock(
+          '../utils/myxAdapter',
+        ) as { adaptOrderFromMYX: jest.Mock };
+        mockAdapt.mockReturnValue({
+          orderId: 'o1',
+          status: 'open',
+          symbol: 'BTC',
+        });
+
+        const result = await authProvider.getOrders();
+
+        expect(result).toHaveLength(1);
+        expect(result[0].orderId).toBe('o1');
+      });
+
+      it('returns empty array when data is null', async () => {
+        authClientService.getOrderHistory.mockResolvedValue({
+          data: null,
+        } as any);
+
+        const result = await authProvider.getOrders();
+
+        expect(result).toEqual([]);
+      });
+    });
+
+    describe('getOrderFills', () => {
+      it('returns adapted fills for successful orders', async () => {
+        authClientService.getOrderHistory.mockResolvedValue({
+          data: [
+            { orderId: 'o1', orderStatus: 9 }, // Successful (OrderStatusEnum.Successful = 9)
+            { orderId: 'o2', orderStatus: 0 }, // Not successful
+          ],
+        } as any);
+        const { adaptOrderFillFromMYX: mockAdapt } = jest.requireMock(
+          '../utils/myxAdapter',
+        ) as { adaptOrderFillFromMYX: jest.Mock };
+        mockAdapt.mockReturnValue({ orderId: 'o1', symbol: 'BTC' });
+
+        const result = await authProvider.getOrderFills();
+
+        expect(result).toHaveLength(1);
+      });
+    });
+
+    describe('getFunding', () => {
+      it('returns adapted funding data', async () => {
+        authClientService.getTradeFlow.mockResolvedValue({
+          data: [{ amount: '100' }],
+        } as any);
+        const { adaptFundingFromMYX: mockAdapt } = jest.requireMock(
+          '../utils/myxAdapter',
+        ) as { adaptFundingFromMYX: jest.Mock };
+        mockAdapt.mockReturnValue([{ amount: '100', symbol: 'BTC' }]);
+
+        const result = await authProvider.getFunding();
+
+        expect(result).toHaveLength(1);
+      });
+
+      it('returns empty array when data is null', async () => {
+        authClientService.getTradeFlow.mockResolvedValue({
+          data: null,
+        } as any);
+
+        const result = await authProvider.getFunding();
+
+        expect(result).toEqual([]);
+      });
+    });
+  });
+
   // ==========================================================================
   // Fee Discount
   // ==========================================================================
@@ -913,4 +1119,118 @@ describe('MYXProvider', () => {
       expect(await provider.getAvailableDexs()).toEqual([]);
     });
   });
+
+  // ==========================================================================
+  // Authentication flow (isReadyToTrade + ensureAuthenticated)
+  // ==========================================================================
+
+  describe('isReadyToTrade with messenger', () => {
+    let authProvider: MYXProvider;
+    let authClientService: jest.Mocked<MYXClientService>;
+
+    beforeEach(() => {
+      // Re-set MYXWalletService mock (cleared by outer jest.clearAllMocks)
+      const { MYXWalletService } = jest.requireMock(
+        '../services/MYXWalletService',
+      ) as {
+        MYXWalletService: jest.Mock;
+      };
+      MYXWalletService.mockImplementation(() => ({
+        createEthersSigner: jest.fn().mockReturnValue({}),
+        createWalletClient: jest.fn().mockReturnValue({}),
+        getUserAddress: jest.fn().mockReturnValue('0xuser123'),
+      }));
+
+      const messenger = createMockMessenger();
+      authProvider = new MYXProvider({
+        isTestnet: true,
+        platformDependencies: mockDeps,
+        messenger: messenger as any,
+      });
+      // The new MYXProvider creates a new MYXClientService instance;
+      // grab the latest one
+      const instances = MockedMYXClientService.mock.instances;
+      authClientService = instances[
+        instances.length - 1
+      ] as jest.Mocked<MYXClientService>;
+    });
+
+    it('returns ready when already authenticated for current address', async () => {
+      authClientService.isAuthenticatedForAddress.mockReturnValue(true);
+      authClientService.getAuthenticatedAddress.mockReturnValue('0xuser123');
+
+      const result = await authProvider.isReadyToTrade();
+
+      expect(result.ready).toBe(true);
+      expect(result.walletConnected).toBe(true);
+      expect(result.networkSupported).toBe(true);
+      expect(result.authenticatedAddress).toBe('0xuser123');
+    });
+
+    it('authenticates and returns ready when not yet authenticated', async () => {
+      authClientService.isAuthenticatedForAddress.mockReturnValue(false);
+      authClientService.authenticate.mockResolvedValue(undefined);
+      authClientService.getAuthenticatedAddress.mockReturnValue('0xuser123');
+
+      const result = await authProvider.isReadyToTrade();
+
+      expect(result.ready).toBe(true);
+      expect(result.walletConnected).toBe(true);
+      expect(authClientService.authenticate).toHaveBeenCalledWith(
+        expect.anything(), // signer
+        expect.anything(), // walletClient
+        '0xuser123', // address
+      );
+    });
+
+    it('returns not ready when authentication fails', async () => {
+      authClientService.isAuthenticatedForAddress.mockReturnValue(false);
+      authClientService.authenticate.mockRejectedValue(
+        new Error('Auth rejected by user'),
+      );
+
+      const result = await authProvider.isReadyToTrade();
+
+      expect(result.ready).toBe(false);
+      expect(result.error).toContain('Auth rejected by user');
+      expect(result.walletConnected).toBe(false);
+    });
+
+    it('skips authentication when already authenticated', async () => {
+      // First call returns not-authenticated, triggering auth
+      authClientService.isAuthenticatedForAddress.mockReturnValue(false);
+      authClientService.authenticate.mockResolvedValue(undefined);
+      authClientService.getAuthenticatedAddress.mockReturnValue('0xuser123');
+
+      const result1 = await authProvider.isReadyToTrade();
+      expect(result1.ready).toBe(true);
+      expect(authClientService.authenticate).toHaveBeenCalledTimes(1);
+
+      // Second call finds already-authenticated — should skip auth
+      authClientService.isAuthenticatedForAddress.mockReturnValue(true);
+      authClientService.authenticate.mockClear();
+
+      const result2 = await authProvider.isReadyToTrade();
+      expect(result2.ready).toBe(true);
+      expect(authClientService.authenticate).not.toHaveBeenCalled();
+    });
+
+    it('re-authenticates when deduped auth was for a different address', async () => {
+      // First call: not authenticated, authenticate succeeds
+      let callCount = 0;
+      authClientService.isAuthenticatedForAddress.mockImplementation(() => {
+        callCount++;
+        // Not authenticated for any address on first 3 checks
+        // Authenticated after second authenticate call
+        return callCount > 3;
+      });
+      authClientService.authenticate.mockResolvedValue(undefined);
+      authClientService.getAuthenticatedAddress.mockReturnValue('0xuser123');
+
+      const result = await authProvider.isReadyToTrade();
+
+      expect(result.ready).toBe(true);
+    });
+  });
+  /* eslint-enable @typescript-eslint/no-explicit-any */
 });
diff --git a/app/controllers/perps/providers/MYXProvider.ts b/app/controllers/perps/providers/MYXProvider.ts
index 52d444e68cda..c22db6d5b0d0 100644
--- a/app/controllers/perps/providers/MYXProvider.ts
+++ b/app/controllers/perps/providers/MYXProvider.ts
@@ -1,20 +1,29 @@
 /**
  * MYXProvider
  *
- * Stage 1 provider implementation for MYX protocol.
- * Implements the PerpsProvider interface with read-only operations.
- * Trading functionality will be added in Stage 3.
+ * Provider implementation for MYX protocol.
+ * Implements the PerpsProvider interface with read-only and authenticated read operations.
+ * Trading write operations will be added in Phase 2.
  *
  * Key differences from HyperLiquid:
  * - Uses USDT collateral on BNB chain (vs USDC on Arbitrum)
  * - Multi-Pool Model: multiple pools can exist per symbol
- * - Uses REST polling for prices (WebSocket deferred to Stage 3)
+ * - Uses REST polling for prices (WebSocket deferred to Phase 4)
  */
 
 import type { CaipAccountId } from '@metamask/utils';
+import type { KlineResolution } from '@myx-trade/sdk';
 
+import { calculateCandleCount } from '../constants/chartConfig';
+import {
+  MYX_MAX_LEVERAGE,
+  MYX_FEE_RATE,
+  MYX_PROTOCOL_FEE_RATE,
+} from '../constants/myxConfig';
 import { PERPS_CONSTANTS } from '../constants/perpsConfig';
+import type { PerpsControllerMessenger } from '../PerpsController';
 import { MYXClientService } from '../services/MYXClientService';
+import { MYXWalletService } from '../services/MYXWalletService';
 import { WebSocketConnectionState } from '../types';
 import type {
   AccountState,
@@ -67,20 +76,37 @@ import type {
   SubscribePositionsParams,
   SubscribePricesParams,
   ToggleTestnetResult,
+  UpdateMarginParams,
   UpdatePositionTPSLParams,
   UserHistoryItem,
   WithdrawParams,
   WithdrawResult,
   RawLedgerUpdate,
 } from '../types';
-import type { MYXPoolSymbol, MYXTicker } from '../types/myx-types';
+import { MYXOrderStatusEnum } from '../types/myx-types';
+import type {
+  MYXAuthConfig,
+  MYXKlineDataResponse,
+  MYXPoolSymbol,
+  MYXTicker,
+} from '../types/myx-types';
+import type { CandleData } from '../types/perps-types';
 import { ensureError } from '../utils/errorUtils';
 import {
   adaptMarketFromMYX,
   adaptMarketDataFromMYX,
   adaptPriceFromMYX,
+  adaptPositionFromMYX,
+  adaptOrderFromMYX,
+  adaptOrderFillFromMYX,
+  adaptAccountStateFromMYX,
+  adaptCandleFromMYX,
+  adaptCandleFromMYXWebSocket,
+  adaptFundingFromMYX,
+  adaptUserHistoryFromMYX,
   filterMYXExclusiveMarkets,
   buildPoolSymbolMap,
+  toMYXKlineResolution,
 } from '../utils/myxAdapter';
 
 // ============================================================================
@@ -89,7 +115,7 @@ import {
 
 const MYX_NOT_SUPPORTED_ERROR = 'MYX trading not yet supported';
 const MYX_BLOCK_EXPLORER_URL = 'https://bscscan.com';
-const MYX_TESTNET_EXPLORER_URL = 'https://testnet.bscscan.com';
+const MYX_TESTNET_EXPLORER_URL = 'https://sepolia.arbiscan.io';
 
 // ============================================================================
 // MYXProvider
@@ -98,8 +124,8 @@ const MYX_TESTNET_EXPLORER_URL = 'https://testnet.bscscan.com';
 /**
  * MYX provider implementation
  *
- * Stage 1: Read-only operations (markets, prices)
- * Trading operations return errors until Stage 3.
+ * Authenticated read operations for positions, orders, account state.
+ * Trading write operations return errors until Phase 2.
  */
 export class MYXProvider implements PerpsProvider {
   readonly protocolId = 'myx';
@@ -110,6 +136,12 @@ export class MYXProvider implements PerpsProvider {
   // Client service
   readonly #clientService: MYXClientService;
 
+  // Wallet service (requires messenger for signing)
+  #walletService: MYXWalletService | null = null;
+
+  // Messenger for wallet operations
+  readonly #messenger: PerpsControllerMessenger | null;
+
   // Configuration
   readonly #isTestnet: boolean;
 
@@ -121,21 +153,29 @@ export class MYXProvider implements PerpsProvider {
   // Ticker cache for price data
   readonly #tickersCache: Map<string, MYXTicker> = new Map();
 
+  // Auth dedup promise
+  #authPromise: Promise<void> | null = null;
+
   constructor(options: {
     isTestnet?: boolean;
     platformDependencies: PerpsPlatformDependencies;
+    messenger?: PerpsControllerMessenger;
+    myxAuthConfig?: MYXAuthConfig;
   }) {
     this.#deps = options.platformDependencies;
-    this.#isTestnet = options.isTestnet ?? true; // Force testnet in Stage 1
+    this.#isTestnet = options.isTestnet ?? true;
+    this.#messenger = options.messenger ?? null;
 
-    // Initialize client service
+    // Initialize client service with auth config
     this.#clientService = new MYXClientService(this.#deps, {
       isTestnet: this.#isTestnet,
+      authConfig: options.myxAuthConfig,
     });
 
     this.#deps.debugLogger.log('[MYXProvider] Constructor complete', {
       protocolId: this.protocolId,
       isTestnet: this.#isTestnet,
+      hasMessenger: Boolean(this.#messenger),
     });
   }
 
@@ -231,21 +271,127 @@ export class MYXProvider implements PerpsProvider {
   }
 
   async isReadyToTrade(): Promise<ReadyToTradeResult> {
-    // Stage 1: Trading not supported
-    return {
-      ready: false,
-      error: 'MYX trading not yet supported',
-      walletConnected: false,
-      networkSupported: this.#isTestnet,
-    };
+    if (!this.#messenger) {
+      return {
+        ready: false,
+        error: 'MYX provider requires messenger for wallet operations',
+        walletConnected: false,
+        networkSupported: true,
+      };
+    }
+
+    try {
+      await this.#ensureAuthenticated();
+      return {
+        ready: true,
+        walletConnected: true,
+        networkSupported: true,
+        authenticatedAddress:
+          this.#clientService.getAuthenticatedAddress() ?? undefined,
+      };
+    } catch (caughtError) {
+      const wrappedError = ensureError(
+        caughtError,
+        'MYXProvider.isReadyToTrade',
+      );
+      return {
+        ready: false,
+        error: wrappedError.message,
+        walletConnected: false,
+        networkSupported: true,
+      };
+    }
+  }
+
+  /**
+   * Ensure the MYX client is authenticated.
+   * Lazy auth: creates signer + walletClient on first call, then calls clientService.authenticate().
+   * Uses promise dedup to prevent concurrent auth attempts.
+   */
+  async #ensureAuthenticated(): Promise<void> {
+    // Always resolve the current address first so we can check per-address auth
+    const currentAddress = this.#getCurrentAddress();
+
+    if (this.#clientService.isAuthenticatedForAddress(currentAddress)) {
+      return;
+    }
+
+    if (this.#authPromise) {
+      await this.#authPromise;
+      // Re-check: the in-flight auth may have been for a different address
+      if (this.#clientService.isAuthenticatedForAddress(currentAddress)) {
+        return;
+      }
+      // Otherwise fall through to start a new auth for the current address
+    }
+
+    this.#authPromise = this.#doEnsureAuthenticated();
+    try {
+      await this.#authPromise;
+    } finally {
+      this.#authPromise = null;
+    }
+  }
+
+  /**
+   * Get the current user address, creating the wallet service if needed.
+   *
+   * @returns The current user wallet address.
+   */
+  #getCurrentAddress(): string {
+    if (!this.#messenger) {
+      throw new Error(
+        'MYX provider requires messenger for authenticated operations',
+      );
+    }
+
+    if (!this.#walletService) {
+      this.#walletService = new MYXWalletService(this.#deps, this.#messenger, {
+        isTestnet: this.#isTestnet,
+      });
+    }
+
+    return this.#walletService.getUserAddress();
+  }
+
+  async #doEnsureAuthenticated(): Promise<void> {
+    if (!this.#messenger) {
+      throw new Error(
+        'MYX provider requires messenger for authenticated operations',
+      );
+    }
+
+    // Create wallet service if not yet created
+    if (!this.#walletService) {
+      this.#walletService = new MYXWalletService(this.#deps, this.#messenger, {
+        isTestnet: this.#isTestnet,
+      });
+    }
+
+    const signer = this.#walletService.createEthersSigner();
+    const walletClient = this.#walletService.createWalletClient();
+    const address = this.#walletService.getUserAddress();
+
+    await this.#clientService.authenticate(signer, walletClient, address);
+  }
+
+  /**
+   * Get the wallet service, throwing if not initialized.
+   * Call #ensureAuthenticated() before calling this.
+   *
+   * @returns The initialized MYXWalletService instance.
+   */
+  #getWalletService(): MYXWalletService {
+    if (!this.#walletService) {
+      throw new Error('MYX wallet service not initialized');
+    }
+    return this.#walletService;
   }
 
   // ============================================================================
   // Market Data Operations (Stage 1 - Fully Implemented)
   // ============================================================================
 
-  // TODO: Align error handling - read operations should return empty defaults
-  // instead of throwing, matching HyperLiquid pattern
   async getMarkets(_params?: GetMarketsParams): Promise<MarketInfo[]> {
     try {
       // Delegate cache freshness to MYXClientService
@@ -260,7 +406,7 @@ export class MYXProvider implements PerpsProvider {
         wrappedError,
         this.#getErrorContext('getMarkets'),
       );
-      throw wrappedError;
+      return [];
     }
   }
 
@@ -282,25 +428,29 @@ export class MYXProvider implements PerpsProvider {
         this.#tickersCache.set(ticker.poolId, ticker);
       }
 
-      // Transform to PerpsMarketData
-      return this.#poolsCache.map((pool) => {
-        const ticker = tickerMap.get(pool.poolId);
-        return adaptMarketDataFromMYX(
-          pool,
-          ticker,
-          this.#deps.marketDataFormatters,
+      // Transform to PerpsMarketData, only include pools with ticker data
+      return this.#poolsCache
+        .filter((pool) => tickerMap.has(pool.poolId))
+        .map((pool) =>
+          adaptMarketDataFromMYX(
+            pool,
+            tickerMap.get(pool.poolId),
+            this.#deps.marketDataFormatters,
+          ),
         );
-      });
     } catch (caughtError) {
       const wrappedError = ensureError(
         caughtError,
         'MYXProvider.getMarketDataWithPrices',
       );
-      this.#deps.logger.error(
-        wrappedError,
-        this.#getErrorContext('getMarketDataWithPrices'),
+      this.#deps.debugLogger.log(
+        '[MYXProvider] getMarketDataWithPrices failed',
+        {
+          error: String(wrappedError),
+          ...this.#getErrorContext('getMarketDataWithPrices'),
+        },
       );
-      throw wrappedError;
+      return [];
     }
   }
 
@@ -446,11 +596,7 @@ export class MYXProvider implements PerpsProvider {
     };
   }
 
-  async updateMargin(_params: {
-    symbol: string;
-    amount: string;
-    isAdd: boolean;
-  }): Promise<MarginResult> {
+  async updateMargin(_params: UpdateMarginParams): Promise<MarginResult> {
     return {
       success: false,
       error: MYX_NOT_SUPPORTED_ERROR,
@@ -465,50 +611,190 @@ export class MYXProvider implements PerpsProvider {
   }
 
   // ============================================================================
-  // Account Operations (Stage 1 - Empty Returns)
+  // Account Operations (Authenticated Reads)
   // ============================================================================
 
   async getPositions(_params?: GetPositionsParams): Promise<Position[]> {
-    // Stage 1: No position tracking
-    return [];
+    try {
+      await this.#ensureAuthenticated();
+      const address = this.#getWalletService().getUserAddress();
+      const result = await this.#clientService.listPositions(address);
+
+      if (!result.data || !Array.isArray(result.data)) {
+        return [];
+      }
+
+      // Filter out zero-size positions
+      return result.data
+        .filter((pos) => pos.size && pos.size !== '0')
+        .map((pos) => adaptPositionFromMYX(pos, this.#poolSymbolMap));
+    } catch (caughtError) {
+      const wrappedError = ensureError(caughtError, 'MYXProvider.getPositions');
+      this.#deps.debugLogger.log('[MYXProvider] getPositions failed', {
+        error: String(wrappedError),
+        ...this.#getErrorContext('getPositions'),
+      });
+      return [];
+    }
   }
 
   async getAccountState(
     _params?: GetAccountStateParams,
   ): Promise<AccountState> {
-    // Stage 1: Empty account state
-    return {
-      availableBalance: '0',
-      totalBalance: '0',
-      marginUsed: '0',
-      unrealizedPnl: '0',
-      returnOnEquity: '0',
-    };
+    try {
+      await this.#ensureAuthenticated();
+      const address = this.#getWalletService().getUserAddress();
+      const chainId = this.#clientService.getChainId();
+
+      // Fetch wallet balance
+      let walletBalance: string | undefined;
+      try {
+        const balanceResult =
+          await this.#clientService.getWalletQuoteTokenBalance(
+            chainId,
+            address,
+          );
+        walletBalance = String(balanceResult.data ?? '0');
+      } catch {
+        // Non-fatal: wallet balance is supplementary
+        walletBalance = '0';
+      }
+
+      // Try to get account info from first pool
+      let accountInfo: Record<string, unknown> | undefined;
+      if (this.#poolsCache.length > 0) {
+        try {
+          const infoResult = await this.#clientService.getAccountInfo(
+            chainId,
+            address,
+            this.#poolsCache[0].poolId,
+          );
+          accountInfo = infoResult.data;
+        } catch {
+          // Non-fatal: we'll return what we have
+        }
+      }
+
+      return adaptAccountStateFromMYX(accountInfo, walletBalance);
+    } catch (caughtError) {
+      const wrappedError = ensureError(
+        caughtError,
+        'MYXProvider.getAccountState',
+      );
+      this.#deps.debugLogger.log('[MYXProvider] getAccountState failed', {
+        error: String(wrappedError),
+        ...this.#getErrorContext('getAccountState'),
+      });
+      return {
+        availableBalance: '0',
+        totalBalance: '0',
+        marginUsed: '0',
+        unrealizedPnl: '0',
+        returnOnEquity: '0',
+      };
+    }
   }
 
   async getOrders(_params?: GetOrdersParams): Promise<Order[]> {
-    // Stage 1: No order tracking
-    return [];
+    try {
+      await this.#ensureAuthenticated();
+      const address = this.#getWalletService().getUserAddress();
+      const result = await this.#clientService.getOrderHistory(
+        { limit: 50 },
+        address,
+      );
+
+      if (!result.data || !Array.isArray(result.data)) {
+        return [];
+      }
+
+      return result.data.map((order) =>
+        adaptOrderFromMYX(order, this.#poolSymbolMap),
+      );
+    } catch (caughtError) {
+      const wrappedError = ensureError(caughtError, 'MYXProvider.getOrders');
+      this.#deps.debugLogger.log('[MYXProvider] getOrders failed', {
+        error: String(wrappedError),
+        ...this.#getErrorContext('getOrders'),
+      });
+      return [];
+    }
   }
 
   async getOpenOrders(_params?: GetOrdersParams): Promise<Order[]> {
-    // Stage 1: No order tracking
-    return [];
+    try {
+      const allOrders = await this.getOrders();
+      return allOrders.filter((order) => order.status === 'open');
+    } catch (caughtError) {
+      const wrappedError = ensureError(
+        caughtError,
+        'MYXProvider.getOpenOrders',
+      );
+      this.#deps.debugLogger.log('[MYXProvider] getOpenOrders failed', {
+        error: String(wrappedError),
+        ...this.#getErrorContext('getOpenOrders'),
+      });
+      return [];
+    }
   }
 
   async getOrderFills(_params?: GetOrderFillsParams): Promise<OrderFill[]> {
-    // Stage 1: No fill tracking
-    return [];
+    try {
+      await this.#ensureAuthenticated();
+      const address = this.#getWalletService().getUserAddress();
+      const result = await this.#clientService.getOrderHistory(
+        { limit: 50 },
+        address,
+      );
+
+      if (!result.data || !Array.isArray(result.data)) {
+        return [];
+      }
+
+      // Only return filled orders
+      return result.data
+        .filter((order) => order.orderStatus === MYXOrderStatusEnum.Successful)
+        .map((order) => adaptOrderFillFromMYX(order, this.#poolSymbolMap));
+    } catch (caughtError) {
+      const wrappedError = ensureError(
+        caughtError,
+        'MYXProvider.getOrderFills',
+      );
+      this.#deps.debugLogger.log('[MYXProvider] getOrderFills failed', {
+        error: String(wrappedError),
+        ...this.#getErrorContext('getOrderFills'),
+      });
+      return [];
+    }
   }
 
   async getOrFetchFills(_params?: GetOrFetchFillsParams): Promise<OrderFill[]> {
-    // Stage 1: No fill tracking
-    return [];
+    // No WS cache for MYX yet - always fetch via REST
+    return this.getOrderFills(_params);
   }
 
   async getFunding(_params?: GetFundingParams): Promise<Funding[]> {
-    // Stage 1: No funding tracking
-    return [];
+    try {
+      await this.#ensureAuthenticated();
+      const address = this.#getWalletService().getUserAddress();
+      const result = await this.#clientService.getTradeFlow(
+        { limit: 50 },
+        address,
+      );
+
+      if (!result.data || !Array.isArray(result.data)) {
+        return [];
+      }
+
+      return adaptFundingFromMYX(result.data, this.#poolSymbolMap);
+    } catch (caughtError) {
+      const wrappedError = ensureError(caughtError, 'MYXProvider.getFunding');
+      this.#deps.debugLogger.log('[MYXProvider] getFunding failed', {
+        error: String(wrappedError),
+        ...this.#getErrorContext('getFunding'),
+      });
+      return [];
+    }
   }
 
   async getHistoricalPortfolio(
@@ -533,7 +819,30 @@ export class MYXProvider implements PerpsProvider {
     startTime?: number;
     endTime?: number;
   }): Promise<UserHistoryItem[]> {
-    return [];
+    try {
+      await this.#ensureAuthenticated();
+      const address = this.#getWalletService().getUserAddress();
+      const result = await this.#clientService.getTradeFlow(
+        { limit: 50 },
+        address,
+      );
+
+      if (!result.data || !Array.isArray(result.data)) {
+        return [];
+      }
+
+      return adaptUserHistoryFromMYX(result.data);
+    } catch (caughtError) {
+      const wrappedError = ensureError(
+        caughtError,
+        'MYXProvider.getUserHistory',
+      );
+      this.#deps.debugLogger.log('[MYXProvider] getUserHistory failed', {
+        error: String(wrappedError),
+        ...this.#getErrorContext('getUserHistory'),
+      });
+      return [];
+    }
   }
 
   // ============================================================================
@@ -581,16 +890,15 @@ export class MYXProvider implements PerpsProvider {
   }
 
   async getMaxLeverage(_asset: string): Promise<number> {
-    return 100; // MYX default max leverage
+    return MYX_MAX_LEVERAGE;
   }
 
   async calculateFees(
     _params: FeeCalculationParams,
   ): Promise<FeeCalculationResult> {
-    // MYX fee structure (placeholder values)
     return {
-      feeRate: 0.0005, // 0.05% total fee rate
-      protocolFeeRate: 0.0005, // Protocol taker fee
+      feeRate: MYX_FEE_RATE,
+      protocolFeeRate: MYX_PROTOCOL_FEE_RATE,
     };
   }
 
@@ -651,19 +959,145 @@ export class MYXProvider implements PerpsProvider {
   }
 
   subscribeToCandles(params: SubscribeCandlesParams): () => void {
-    // Stage 1: No candle data - immediately call back with empty candles
-    // (matches HyperLiquid pattern which calls callback after initial fetch)
-    setTimeout(
-      () =>
-        params.callback({
-          symbol: params.symbol,
-          interval: params.interval,
-          candles: [],
-        }),
-      0,
+    const { symbol, interval, duration, callback, onError } = params;
+    let cancelled = false;
+    let wsCallback: ((data: MYXKlineDataResponse) => void) | null = null;
+    let globalId: number | null = null;
+    let currentCandleData: CandleData | null = null;
+
+    // Map CandlePeriod to MYX KlineResolution
+    const myxInterval = toMYXKlineResolution(interval);
+
+    // Resolve symbol → poolId (same pattern as subscribeToPrices)
+    const pool = this.#poolsCache.find(
+      (item) => (item.baseSymbol || item.poolId) === symbol,
     );
+
+    if (!pool) {
+      this.#deps.debugLogger.log(
+        '[MYXProvider] subscribeToCandles: No pool found for symbol',
+        { symbol },
+      );
+      setTimeout(() => callback({ symbol, interval, candles: [] }), 0);
+      return () => {
+        cancelled = true;
+      };
+    }
+
+    // Calculate limit from duration
+    const limit = duration ? calculateCandleCount(duration, interval) : 100;
+
+    this.#deps.debugLogger.log('[MYXProvider] subscribeToCandles', {
+      symbol,
+      interval,
+      myxInterval,
+      limit,
+      poolId: pool.poolId,
+    });
+
+    const initAndSubscribe = async (): Promise<void> => {
+      // Phase 1: REST fetch historical candles
+      const klineData = await this.#clientService.getKlineData({
+        poolId: pool.poolId,
+        interval: myxInterval as KlineResolution,
+        limit,
+      });
+
+      if (cancelled) {
+        return;
+      }
+
+      currentCandleData = {
+        symbol,
+        interval,
+        candles: klineData.map(adaptCandleFromMYX),
+      };
+
+      this.#deps.debugLogger.log('[MYXProvider] Historical candles received', {
+        symbol,
+        count: currentCandleData.candles.length,
+      });
+
+      callback(currentCandleData);
+
+      // Phase 2: WS live updates (independent — failure does NOT erase REST data)
+      try {
+        globalId = await this.#clientService.getGlobalId(pool.poolId);
+
+        if (cancelled) {
+          return;
+        }
+
+        wsCallback = (data: MYXKlineDataResponse): void => {
+          if (cancelled || !currentCandleData) {
+            return;
+          }
+
+          const newCandle = adaptCandleFromMYXWebSocket(data.data);
+          const { candles } = currentCandleData;
+          const lastCandle = candles[candles.length - 1];
+
+          if (lastCandle && lastCandle.time === newCandle.time) {
+            // Same timestamp: update existing candle (live tick)
+            currentCandleData = {
+              ...currentCandleData,
+              candles: [...candles.slice(0, -1), newCandle],
+            };
+          } else {
+            // New timestamp: append new candle
+            currentCandleData = {
+              ...currentCandleData,
+              candles: [...candles, newCandle],
+            };
+          }
+
+          callback(currentCandleData);
+        };
+
+        this.#clientService.subscribeToKline(
+          globalId,
+          myxInterval as KlineResolution,
+          wsCallback,
+        );
+
+        this.#deps.debugLogger.log(
+          '[MYXProvider] WS kline subscription active',
+          { symbol, globalId },
+        );
+      } catch (wsError) {
+        this.#deps.debugLogger.log(
+          '[MYXProvider] WS kline failed, REST data preserved',
+          { symbol, error: String(wsError) },
+        );
+      }
+    };
+
+    initAndSubscribe().catch((error: unknown) => {
+      if (cancelled) {
+        return;
+      }
+      const wrappedError = ensureError(error, 'MYXProvider.subscribeToCandles');
+      this.#deps.debugLogger.log('[MYXProvider] subscribeToCandles failed', {
+        error: String(wrappedError),
+        ...this.#getErrorContext('subscribeToCandles', { symbol, interval }),
+      });
+      if (onError) {
+        onError(wrappedError);
+      }
+      // Emit empty candles so the UI isn't stuck loading.
+      // Use setTimeout to avoid promise/no-callback-in-promise lint rule.
+      setTimeout(() => callback({ symbol, interval, candles: [] }), 0);
+    });
+
     return () => {
-      /* noop */
+      cancelled = true;
+      if (wsCallback && globalId !== null) {
+        this.#clientService.unsubscribeFromKline(
+          globalId,
+          myxInterval as KlineResolution,
+          wsCallback,
+        );
+      }
     };
   }
 
diff --git a/app/controllers/perps/services/AccountService.test.ts b/app/controllers/perps/services/AccountService.test.ts
index 128949908c89..934a202841b3 100644
--- a/app/controllers/perps/services/AccountService.test.ts
+++ b/app/controllers/perps/services/AccountService.test.ts
@@ -4,10 +4,7 @@ import {
   createMockInfrastructure,
   createMockMessenger,
 } from '../../../components/UI/Perps/__mocks__/serviceMocks';
-import type {
-  PerpsControllerState,
-  PerpsControllerMessenger,
-} from '../PerpsController';
+import type { PerpsControllerState } from '../PerpsController';
 import { PerpsAnalyticsEvent } from '../types';
 import type {
   PerpsProvider,
@@ -42,15 +39,15 @@ jest.mock('../perpsErrorCodes', () => ({
     WITHDRAW_FAILED: 'WITHDRAW_FAILED',
   },
 }));
-// Note: EVM account is now retrieved via dependency injection (deps.controllers.accounts.getSelectedEvmAccount)
-// The mock is set up via createMockInfrastructure() in serviceMocks.ts
+// Note: EVM account is now retrieved via messenger.call('AccountTreeController:getAccountsFromSelectedAccountGroup')
+// The mock is set up via createMockMessenger() in serviceMocks.ts
 
 describe('AccountService', () => {
   let mockProvider: jest.Mocked<PerpsProvider>;
   let mockContext: ServiceContext;
   let mockRefreshAccountState: jest.Mock;
   let mockDeps: PerpsPlatformDependencies;
-  let mockMessenger: jest.Mocked<PerpsControllerMessenger>;
+  let mockMessenger: ReturnType<typeof createMockMessenger>;
   let accountService: AccountService;
 
   const mockWithdrawParams: WithdrawParams = {
diff --git a/app/controllers/perps/services/AccountService.ts b/app/controllers/perps/services/AccountService.ts
index 56e1b31c9388..f6c121daa1e7 100644
--- a/app/controllers/perps/services/AccountService.ts
+++ b/app/controllers/perps/services/AccountService.ts
@@ -6,7 +6,6 @@ import {
 } from '../constants/eventNames';
 import { USDC_SYMBOL } from '../constants/hyperLiquidConfig';
 import { PERPS_CONSTANTS } from '../constants/perpsConfig';
-import type { PerpsControllerMessenger } from '../PerpsController';
 import { PERPS_ERROR_CODES } from '../perpsErrorCodes';
 import {
   PerpsAnalyticsEvent,
@@ -20,6 +19,7 @@ import type {
   PerpsPlatformDependencies,
 } from '../types';
 import type { ServiceContext } from './ServiceContext';
+import type { PerpsControllerMessengerBase } from '../types/messenger';
 import type { TransactionStatus } from '../types/transactionTypes';
 import { getSelectedEvmAccount } from '../utils/accountUtils';
 import { ensureError } from '../utils/errorUtils';
@@ -37,17 +37,17 @@ import { ensureError } from '../utils/errorUtils';
 export class AccountService {
   readonly #deps: PerpsPlatformDependencies;
 
-  readonly #messenger: PerpsControllerMessenger;
+  readonly #messenger: PerpsControllerMessengerBase;
 
   /**
    * Create a new AccountService instance
    *
    * @param deps - Platform dependencies for logging, metrics, etc.
-   * @param messenger - Messenger for inter-controller communication
+   * @param messenger - Controller messenger for cross-controller communication.
    */
   constructor(
     deps: PerpsPlatformDependencies,
-    messenger: PerpsControllerMessenger,
+    messenger: PerpsControllerMessengerBase,
   ) {
     this.#deps = deps;
     this.#messenger = messenger;
@@ -121,7 +121,11 @@ export class AccountService {
           const netAmount = Math.max(0, grossAmount - feeAmount);
 
           // Get current account address via messenger
-          const evmAccount = getSelectedEvmAccount(this.#messenger);
+          const evmAccount = getSelectedEvmAccount(
+            this.#messenger.call(
+              'AccountTreeController:getAccountsFromSelectedAccountGroup',
+            ),
+          );
           const accountAddress = evmAccount?.address ?? 'unknown';
 
           this.#deps.debugLogger.log(
diff --git a/app/controllers/perps/services/DataLakeService.test.ts b/app/controllers/perps/services/DataLakeService.test.ts
index 6ad5aff679b2..b45bc6e46aa8 100644
--- a/app/controllers/perps/services/DataLakeService.test.ts
+++ b/app/controllers/perps/services/DataLakeService.test.ts
@@ -4,7 +4,6 @@ import {
   createMockInfrastructure,
   createMockMessenger,
 } from '../../../components/UI/Perps/__mocks__/serviceMocks';
-import type { PerpsControllerMessenger } from '../PerpsController';
 import type { PerpsPlatformDependencies } from '../types';
 
 import { DataLakeService } from './DataLakeService';
@@ -21,12 +20,32 @@ global.setTimeout = jest.fn((fn: () => void) => {
 describe('DataLakeService', () => {
   let mockContext: ServiceContext;
   let mockDeps: jest.Mocked<PerpsPlatformDependencies>;
-  let mockMessenger: jest.Mocked<PerpsControllerMessenger>;
+  let mockMessenger: ReturnType<typeof createMockMessenger>;
   let dataLakeService: DataLakeService;
   const mockEvmAccount = createMockEvmAccount();
   const mockToken = 'mock-bearer-token';
 
+  /**
+   * Sets up the default messenger mock that returns a valid account and token.
+   * Called in beforeEach and after any mid-test jest.clearAllMocks().
+   */
+  function setupDefaultMessenger() {
+    (mockMessenger.call as jest.Mock).mockImplementation((action: string) => {
+      if (
+        action === 'AccountTreeController:getAccountsFromSelectedAccountGroup'
+      ) {
+        return [mockEvmAccount];
+      }
+      if (action === 'AuthenticationController:getBearerToken') {
+        return Promise.resolve(mockToken);
+      }
+      return undefined;
+    });
+  }
+
   beforeEach(() => {
+    jest.clearAllMocks();
+
     mockDeps = createMockInfrastructure();
     mockMessenger = createMockMessenger();
     dataLakeService = new DataLakeService(mockDeps, mockMessenger);
@@ -39,19 +58,7 @@ describe('DataLakeService', () => {
       },
     });
 
-    // Configure messenger to return expected values
-    (mockMessenger.call as jest.Mock).mockImplementation((action: string) => {
-      if (
-        action === 'AccountTreeController:getAccountsFromSelectedAccountGroup'
-      ) {
-        return [mockEvmAccount];
-      }
-      if (action === 'AuthenticationController:getBearerToken') {
-        return Promise.resolve(mockToken);
-      }
-      return undefined;
-    });
-    jest.clearAllMocks();
+    setupDefaultMessenger();
   });
 
   afterEach(() => {
@@ -278,6 +285,8 @@ describe('DataLakeService', () => {
       expect(setTimeout).toHaveBeenCalledWith(expect.any(Function), 1000);
 
       jest.clearAllMocks();
+      setupDefaultMessenger();
+      (fetch as jest.Mock).mockRejectedValue(new Error('Network error'));
 
       await dataLakeService.reportOrder({
         action: 'open',
@@ -289,6 +298,8 @@ describe('DataLakeService', () => {
       expect(setTimeout).toHaveBeenCalledWith(expect.any(Function), 2000);
 
       jest.clearAllMocks();
+      setupDefaultMessenger();
+      (fetch as jest.Mock).mockRejectedValue(new Error('Network error'));
 
       await dataLakeService.reportOrder({
         action: 'open',
diff --git a/app/controllers/perps/services/DataLakeService.ts b/app/controllers/perps/services/DataLakeService.ts
index 0f217666a606..18c0162d1e1b 100644
--- a/app/controllers/perps/services/DataLakeService.ts
+++ b/app/controllers/perps/services/DataLakeService.ts
@@ -5,10 +5,10 @@ import {
   DATA_LAKE_API_CONFIG,
   PERPS_CONSTANTS,
 } from '../constants/perpsConfig';
-import type { PerpsControllerMessenger } from '../PerpsController';
 import { PerpsTraceNames, PerpsTraceOperations } from '../types';
 import type { PerpsPlatformDependencies } from '../types';
 import type { ServiceContext } from './ServiceContext';
+import type { PerpsControllerMessengerBase } from '../types/messenger';
 import { getSelectedEvmAccount } from '../utils/accountUtils';
 import { ensureError } from '../utils/errorUtils';
 
@@ -19,30 +19,29 @@ import { ensureError } from '../utils/errorUtils';
  * Implements exponential backoff retry logic and performance tracing.
  * Stateless service that operates purely on external API calls.
  *
- * Instance-based service with constructor injection of platform dependencies
- * and messenger for inter-controller communication.
+ * Instance-based service with constructor injection of platform dependencies.
  */
 export class DataLakeService {
   readonly #deps: PerpsPlatformDependencies;
 
-  readonly #messenger: PerpsControllerMessenger;
+  readonly #messenger: PerpsControllerMessengerBase;
 
   /**
    * Create a new DataLakeService instance
    *
    * @param deps - Platform dependencies for logging, metrics, etc.
-   * @param messenger - Messenger for inter-controller communication
+   * @param messenger - Controller messenger for cross-controller communication.
    */
   constructor(
     deps: PerpsPlatformDependencies,
-    messenger: PerpsControllerMessenger,
+    messenger: PerpsControllerMessengerBase,
   ) {
     this.#deps = deps;
     this.#messenger = messenger;
   }
 
   /**
-   * Get bearer token via messenger
+   * Get bearer token via DI authentication controller
    *
    * @returns The bearer token string for API authentication.
    */
@@ -132,7 +131,11 @@ export class DataLakeService {
 
     try {
       const token = await this.#getBearerToken();
-      const evmAccount = getSelectedEvmAccount(this.#messenger);
+      const evmAccount = getSelectedEvmAccount(
+        this.#messenger.call(
+          'AccountTreeController:getAccountsFromSelectedAccountGroup',
+        ),
+      );
 
       if (!evmAccount || !token) {
         this.#deps.debugLogger.log('DataLake API: Missing requirements', {
diff --git a/app/controllers/perps/services/DepositService.test.ts b/app/controllers/perps/services/DepositService.test.ts
index 547877920911..7b2dea0bdb10 100644
--- a/app/controllers/perps/services/DepositService.test.ts
+++ b/app/controllers/perps/services/DepositService.test.ts
@@ -7,7 +7,6 @@ import {
   createMockInfrastructure,
   createMockMessenger,
 } from '../../../components/UI/Perps/__mocks__/serviceMocks';
-import type { PerpsControllerMessenger } from '../PerpsController';
 import type { PerpsProvider, PerpsPlatformDependencies } from '../types';
 import { generateDepositId } from '../utils/idUtils';
 import { generateERC20TransferData } from '../utils/transferData';
@@ -37,7 +36,7 @@ jest.mock('@metamask/controller-utils', () => {
 describe('DepositService', () => {
   let mockProvider: jest.Mocked<PerpsProvider>;
   let mockDeps: jest.Mocked<PerpsPlatformDependencies>;
-  let mockMessenger: jest.Mocked<PerpsControllerMessenger>;
+  let mockMessenger: ReturnType<typeof createMockMessenger>;
   let service: DepositService;
   const mockEvmAccount = createMockEvmAccount();
   const mockDepositId = 'deposit-123';
@@ -164,7 +163,7 @@ describe('DepositService', () => {
       expect(result.transaction.data).toMatch(/^0xa9059cbb/);
     });
 
-    it('retrieves EVM account from selected account group via messenger', async () => {
+    it('retrieves EVM account from messenger via accountTree action', async () => {
       await service.prepareTransaction({
         provider: mockProvider,
       });
diff --git a/app/controllers/perps/services/DepositService.ts b/app/controllers/perps/services/DepositService.ts
index 496724e6db11..a4ffe31e5191 100644
--- a/app/controllers/perps/services/DepositService.ts
+++ b/app/controllers/perps/services/DepositService.ts
@@ -1,10 +1,13 @@
 import { toHex } from '@metamask/controller-utils';
-import type { TransactionParams } from '@metamask/transaction-controller';
 import { parseCaipAssetId } from '@metamask/utils';
 import type { Hex } from '@metamask/utils';
 
-import type { PerpsControllerMessenger } from '../PerpsController';
-import type { PerpsProvider, PerpsPlatformDependencies } from '../types';
+import type {
+  PerpsProvider,
+  PerpsPlatformDependencies,
+  PerpsTransactionParams,
+} from '../types';
+import type { PerpsControllerMessengerBase } from '../types/messenger';
 import { getSelectedEvmAccount } from '../utils/accountUtils';
 import { generateDepositId } from '../utils/idUtils';
 import { generateERC20TransferData } from '../utils/transferData';
@@ -25,17 +28,17 @@ const DEPOSIT_GAS_LIMIT = toHex(100000);
 export class DepositService {
   readonly #deps: PerpsPlatformDependencies;
 
-  readonly #messenger: PerpsControllerMessenger;
+  readonly #messenger: PerpsControllerMessengerBase;
 
   /**
    * Create a new DepositService instance
    *
    * @param deps - Platform dependencies for logging, metrics, etc.
-   * @param messenger - Messenger for inter-controller communication
+   * @param messenger - Controller messenger for cross-controller communication.
    */
   constructor(
     deps: PerpsPlatformDependencies,
-    messenger: PerpsControllerMessenger,
+    messenger: PerpsControllerMessengerBase,
   ) {
     this.#deps = deps;
     this.#messenger = messenger;
@@ -50,7 +53,7 @@ export class DepositService {
    * @returns Transaction data ready for TransactionController.addTransaction
    */
   async prepareTransaction(options: { provider: PerpsProvider }): Promise<{
-    transaction: TransactionParams;
+    transaction: PerpsTransactionParams;
     assetChainId: Hex;
     currentDepositId: string;
   }> {
@@ -73,7 +76,11 @@ export class DepositService {
     );
 
     // Get EVM account from selected account group via messenger
-    const evmAccount = getSelectedEvmAccount(this.#messenger);
+    const evmAccount = getSelectedEvmAccount(
+      this.#messenger.call(
+        'AccountTreeController:getAccountsFromSelectedAccountGroup',
+      ),
+    );
     if (!evmAccount) {
       throw new Error(
         'No EVM-compatible account found in selected account group',
@@ -87,7 +94,7 @@ export class DepositService {
     const tokenAddress = parsedAsset.assetReference as Hex;
 
     // Build transaction parameters for TransactionController
-    const transaction: TransactionParams = {
+    const transaction: PerpsTransactionParams = {
       from: accountAddress,
       to: tokenAddress,
       value: '0x0',
diff --git a/app/controllers/perps/services/FeatureFlagConfigurationService.ts b/app/controllers/perps/services/FeatureFlagConfigurationService.ts
index ba5f2adafd33..ee0295035499 100644
--- a/app/controllers/perps/services/FeatureFlagConfigurationService.ts
+++ b/app/controllers/perps/services/FeatureFlagConfigurationService.ts
@@ -1,9 +1,11 @@
-import type { RemoteFeatureFlagControllerState } from '@metamask/remote-feature-flag-controller';
 import { hasProperty } from '@metamask/utils';
 
 import { PERPS_CONSTANTS } from '../constants/perpsConfig';
 import { isVersionGatedFeatureFlag } from '../types';
-import type { PerpsPlatformDependencies } from '../types';
+import type {
+  PerpsPlatformDependencies,
+  PerpsRemoteFeatureFlagState,
+} from '../types';
 import type { ServiceContext } from './ServiceContext';
 import { ensureError } from '../utils/errorUtils';
 import { validateMarketPattern } from '../utils/marketUtils';
@@ -182,11 +184,11 @@ export class FeatureFlagConfigurationService {
    * Follows the "sticky remote" pattern: once remote config is loaded, never downgrade to fallback.
    *
    * @param options - Configuration object
-   * @param options.remoteFeatureFlagControllerState - State from RemoteFeatureFlagController
+   * @param options.remoteFeatureFlagControllerState - Remote feature flag state
    * @param options.context - ServiceContext providing state access callbacks
    */
   refreshHip3Config(options: {
-    remoteFeatureFlagControllerState: RemoteFeatureFlagControllerState;
+    remoteFeatureFlagControllerState: PerpsRemoteFeatureFlagState;
     context: ServiceContext;
   }): void {
     const { remoteFeatureFlagControllerState, context } = options;
@@ -320,11 +322,11 @@ export class FeatureFlagConfigurationService {
    * Note: Initial eligibility is set in the constructor if fallback regions are provided.
    *
    * @param options - Configuration object
-   * @param options.remoteFeatureFlagControllerState - State from RemoteFeatureFlagController
+   * @param options.remoteFeatureFlagControllerState - Remote feature flag state
    * @param options.context - ServiceContext providing callbacks
    */
   refreshEligibility(options: {
-    remoteFeatureFlagControllerState: RemoteFeatureFlagControllerState;
+    remoteFeatureFlagControllerState: PerpsRemoteFeatureFlagState;
     context: ServiceContext;
   }): void {
     const { remoteFeatureFlagControllerState, context } = options;
diff --git a/app/controllers/perps/services/HyperLiquidWalletService.test.ts b/app/controllers/perps/services/HyperLiquidWalletService.test.ts
index 42b75323eb0c..3c9363ace640 100644
--- a/app/controllers/perps/services/HyperLiquidWalletService.test.ts
+++ b/app/controllers/perps/services/HyperLiquidWalletService.test.ts
@@ -11,37 +11,7 @@ jest.mock('@metamask/keyring-api', () => ({
   ),
 }));
 
-// Mock keyring controller to avoid import issues
-jest.mock('@metamask/keyring-controller', () => ({
-  SignTypedDataVersion: {
-    V1: 'V1',
-    V2: 'V2',
-    V3: 'V3',
-    V4: 'V4',
-  },
-}));
-
 // Mock MetaMask utils
-// Mock using the MetaMask mobile testing patterns
-const MOCK_SELECTED_ACCOUNT = {
-  address: '0x1234567890123456789012345678901234567890',
-};
-
-const MOCK_STORE_STATE = {
-  engine: {
-    backgroundState: {
-      AccountsController: {
-        internalAccounts: {
-          selectedAccount: 'test-account-id',
-          accounts: {
-            'test-account-id': MOCK_SELECTED_ACCOUNT,
-          },
-        },
-      },
-    },
-  },
-};
-
 jest.mock('@metamask/utils', () => ({
   parseCaipAccountId: jest.fn((accountId: string) => {
     const parts = accountId.split(':');
@@ -56,51 +26,6 @@ jest.mock('@metamask/utils', () => ({
   ),
 }));
 
-jest.mock('../../../store', () => ({
-  store: {
-    getState: jest.fn(() => MOCK_STORE_STATE),
-  },
-}));
-
-// Mock selectors
-jest.mock('../../../selectors/accountsController', () => ({
-  selectSelectedInternalAccountAddress: jest.fn(
-    () => MOCK_SELECTED_ACCOUNT.address,
-  ),
-}));
-
-jest.mock('../../../selectors/multichainAccounts/accounts', () => ({
-  selectSelectedInternalAccountByScope: jest.fn(
-    () => () => MOCK_SELECTED_ACCOUNT,
-  ),
-}));
-
-// Mock Engine with proper hoisting
-jest.mock('../../../core/Engine', () => {
-  const mockKeyringController = {
-    signTypedMessage: jest.fn().mockResolvedValue('0xSignatureResult'),
-  };
-
-  const mockAccountTreeController = {
-    getAccountsFromSelectedAccountGroup: jest.fn().mockReturnValue([
-      {
-        address: '0x1234567890123456789012345678901234567890',
-        type: 'eip155:1',
-      },
-    ]),
-  };
-
-  return {
-    __esModule: true,
-    default: {
-      context: {
-        KeyringController: mockKeyringController,
-        AccountTreeController: mockAccountTreeController,
-      },
-    },
-  };
-});
-
 // Mock config
 jest.mock('../constants/hyperLiquidConfig', () => ({
   getChainId: jest.fn((isTestnet: boolean) => (isTestnet ? '421614' : '42161')),
@@ -117,17 +42,16 @@ import type { CaipAccountId } from '@metamask/utils';
 
 import {
   createMockInfrastructure,
-  createMockMessenger,
   createMockEvmAccount,
+  createMockMessenger,
 } from '../../../components/UI/Perps/__mocks__/serviceMocks';
-import type { PerpsControllerMessenger } from '../PerpsController';
 
 import { HyperLiquidWalletService } from './HyperLiquidWalletService';
 
 describe('HyperLiquidWalletService', () => {
   let service: HyperLiquidWalletService;
   let mockDeps: ReturnType<typeof createMockInfrastructure>;
-  let mockMessenger: jest.Mocked<PerpsControllerMessenger>;
+  let mockMessenger: ReturnType<typeof createMockMessenger>;
   const mockEvmAccount = createMockEvmAccount();
 
   beforeEach(() => {
@@ -272,7 +196,7 @@ describe('HyperLiquidWalletService', () => {
       });
 
       it('should throw error when no account selected', async () => {
-        // Mock messenger to return empty array (no account selected)
+        // Mock accountTree to return empty array (no account selected)
         (mockMessenger.call as jest.Mock).mockImplementation(
           (action: string) => {
             if (
@@ -281,6 +205,12 @@ describe('HyperLiquidWalletService', () => {
             ) {
               return [];
             }
+            if (action === 'KeyringController:getState') {
+              return { isUnlocked: true };
+            }
+            if (action === 'KeyringController:signTypedMessage') {
+              return Promise.resolve('0xSignatureResult');
+            }
             return undefined;
           },
         );
@@ -310,8 +240,11 @@ describe('HyperLiquidWalletService', () => {
           },
         );
 
+        // Need to recreate the adapter after changing the mock
+        const freshAdapter = service.createWalletAdapter();
+
         await expect(
-          walletAdapter.signTypedData(mockTypedDataParams),
+          freshAdapter.signTypedData(mockTypedDataParams),
         ).rejects.toThrow('Signing failed');
       });
     });
@@ -321,7 +254,6 @@ describe('HyperLiquidWalletService', () => {
     it('should get current account ID for mainnet', async () => {
       const accountId = await service.getCurrentAccountId();
 
-      // Uses address from mockMessenger's AccountTreeController:getAccountsFromSelectedAccountGroup
       expect(accountId).toBe(`eip155:42161:${mockEvmAccount.address}`);
     });
 
@@ -334,7 +266,6 @@ describe('HyperLiquidWalletService', () => {
     });
 
     it('should throw error when getting account ID with no selected account', async () => {
-      // Mock messenger to return empty array (no account selected)
       (mockMessenger.call as jest.Mock).mockImplementation((action: string) => {
         if (
           action === 'AccountTreeController:getAccountsFromSelectedAccountGroup'
@@ -359,7 +290,6 @@ describe('HyperLiquidWalletService', () => {
     });
 
     it('should throw error for invalid address format', () => {
-      // Mock isValidHexAddress at the module level
       const { isValidHexAddress } = jest.requireMock('@metamask/utils');
       isValidHexAddress.mockReturnValueOnce(false);
 
@@ -382,7 +312,6 @@ describe('HyperLiquidWalletService', () => {
     it('should get user address with default fallback', async () => {
       const address = await service.getUserAddressWithDefault();
 
-      // Uses address from mockMessenger's AccountTreeController:getAccountsFromSelectedAccountGroup
       expect(address).toBe(mockEvmAccount.address);
     });
   });
@@ -412,8 +341,7 @@ describe('HyperLiquidWalletService', () => {
   });
 
   describe('Error Handling', () => {
-    it('should handle store state errors gracefully', async () => {
-      // Mock messenger to throw an error
+    it('should handle accountTree errors gracefully', async () => {
       (mockMessenger.call as jest.Mock).mockImplementation((action: string) => {
         if (
           action === 'AccountTreeController:getAccountsFromSelectedAccountGroup'
@@ -429,7 +357,6 @@ describe('HyperLiquidWalletService', () => {
     });
 
     it('should handle malformed CAIP account IDs', () => {
-      // Mock parseCaipAccountId at the module level
       const { parseCaipAccountId } = jest.requireMock('@metamask/utils');
       parseCaipAccountId.mockImplementationOnce(() => {
         throw new Error('Invalid CAIP account ID');
@@ -474,7 +401,6 @@ describe('HyperLiquidWalletService', () => {
       await expect(walletAdapter.signTypedData(mockTypedData)).rejects.toThrow(
         'KEYRING_LOCKED',
       );
-      // signTypedMessage should NOT have been called
       expect(mockMessenger.call).not.toHaveBeenCalledWith(
         'KeyringController:signTypedMessage',
         expect.anything(),
@@ -497,7 +423,6 @@ describe('HyperLiquidWalletService', () => {
 
     it('should handle keyring controller initialization errors', async () => {
       const walletAdapter = service.createWalletAdapter();
-      // Override messenger.call for the signing call
       (mockMessenger.call as jest.Mock).mockImplementation((action: string) => {
         if (
           action === 'AccountTreeController:getAccountsFromSelectedAccountGroup'
diff --git a/app/controllers/perps/services/HyperLiquidWalletService.ts b/app/controllers/perps/services/HyperLiquidWalletService.ts
index fd60d4a236ce..d1ac687ce7a9 100644
--- a/app/controllers/perps/services/HyperLiquidWalletService.ts
+++ b/app/controllers/perps/services/HyperLiquidWalletService.ts
@@ -1,12 +1,13 @@
-import { SignTypedDataVersion } from '@metamask/keyring-controller';
-import type { TypedMessageParams } from '@metamask/keyring-controller';
 import { parseCaipAccountId, isValidHexAddress } from '@metamask/utils';
 import type { CaipAccountId, Hex } from '@metamask/utils';
 
 import { getChainId } from '../constants/hyperLiquidConfig';
-import type { PerpsControllerMessenger } from '../PerpsController';
 import { PERPS_ERROR_CODES } from '../perpsErrorCodes';
-import type { PerpsPlatformDependencies } from '../types';
+import type {
+  PerpsPlatformDependencies,
+  PerpsTypedMessageParams,
+} from '../types';
+import type { PerpsControllerMessengerBase } from '../types/messenger';
 import { getSelectedEvmAccount } from '../utils/accountUtils';
 
 /**
@@ -19,12 +20,11 @@ export class HyperLiquidWalletService {
   // Platform dependencies for observability
   readonly #deps: PerpsPlatformDependencies;
 
-  // Messenger for inter-controller communication
-  readonly #messenger: PerpsControllerMessenger;
+  readonly #messenger: PerpsControllerMessengerBase;
 
   constructor(
     deps: PerpsPlatformDependencies,
-    messenger: PerpsControllerMessenger,
+    messenger: PerpsControllerMessengerBase,
     options: { isTestnet?: boolean } = {},
   ) {
     this.#deps = deps;
@@ -42,19 +42,23 @@ export class HyperLiquidWalletService {
   }
 
   /**
-   * Sign typed data via messenger
+   * Sign typed data via DI keyring controller
    *
    * @param msgParams - The typed message parameters including data and sender address.
    * @returns The signature string.
    */
-  async #signTypedMessage(msgParams: TypedMessageParams): Promise<string> {
+  async #signTypedMessage(msgParams: PerpsTypedMessageParams): Promise<string> {
     if (!this.isKeyringUnlocked()) {
       throw new Error(PERPS_ERROR_CODES.KEYRING_LOCKED);
     }
+    // Cast needed: PerpsTypedMessageParams uses loose `data: unknown` type
+    // while KeyringController uses strict TypedMessageParams / SignTypedDataVersion
     return this.#messenger.call(
       'KeyringController:signTypedMessage',
-      msgParams,
-      SignTypedDataVersion.V4,
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      msgParams as any,
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      'V4' as any,
     );
   }
 
@@ -81,8 +85,12 @@ export class HyperLiquidWalletService {
     }) => Promise<Hex>;
     getChainId?: () => Promise<number>;
   } {
-    // Get current EVM account using messenger
-    const evmAccount = getSelectedEvmAccount(this.#messenger);
+    // Get current EVM account via DI accountTree
+    const evmAccount = getSelectedEvmAccount(
+      this.#messenger.call(
+        'AccountTreeController:getAccountsFromSelectedAccountGroup',
+      ),
+    );
 
     if (!evmAccount?.address) {
       throw new Error(PERPS_ERROR_CODES.NO_ACCOUNT_SELECTED);
@@ -107,7 +115,11 @@ export class HyperLiquidWalletService {
       }): Promise<Hex> => {
         // Get FRESH account on every sign to handle account switches
         // This prevents race conditions where wallet adapter was created with old account
-        const currentEvmAccount = getSelectedEvmAccount(this.#messenger);
+        const currentEvmAccount = getSelectedEvmAccount(
+          this.#messenger.call(
+            'AccountTreeController:getAccountsFromSelectedAccountGroup',
+          ),
+        );
 
         if (!currentEvmAccount?.address) {
           throw new Error(PERPS_ERROR_CODES.NO_ACCOUNT_SELECTED);
@@ -151,7 +163,11 @@ export class HyperLiquidWalletService {
    * @returns The CAIP account ID for the current EVM account.
    */
   public async getCurrentAccountId(): Promise<CaipAccountId> {
-    const evmAccount = getSelectedEvmAccount(this.#messenger);
+    const evmAccount = getSelectedEvmAccount(
+      this.#messenger.call(
+        'AccountTreeController:getAccountsFromSelectedAccountGroup',
+      ),
+    );
 
     if (!evmAccount?.address) {
       throw new Error(PERPS_ERROR_CODES.NO_ACCOUNT_SELECTED);
diff --git a/app/controllers/perps/services/MYXClientService.test.ts b/app/controllers/perps/services/MYXClientService.test.ts
index 6eba7be71633..d306d3f0253c 100644
--- a/app/controllers/perps/services/MYXClientService.test.ts
+++ b/app/controllers/perps/services/MYXClientService.test.ts
@@ -15,13 +15,49 @@ import { MYXClientService } from './MYXClientService';
 
 const mockGetPoolSymbolAll = jest.fn().mockResolvedValue([]);
 const mockGetTickerList = jest.fn().mockResolvedValue([]);
+const mockWsConnect = jest.fn();
+const mockWsDisconnect = jest.fn();
+const mockListPositions = jest.fn();
+const mockGetOrders = jest.fn();
+const mockGetOrderHistory = jest.fn();
+const mockGetPositionHistory = jest.fn();
+const mockGetAccountInfo = jest.fn();
+const mockGetWalletQuoteTokenBalance = jest.fn();
+const mockGetTradeFlow = jest.fn();
+const mockGetKlineList = jest.fn();
+const mockGetMarketDetail = jest.fn();
+const mockSubscribeKline = jest.fn();
+const mockUnsubscribeKline = jest.fn();
+const mockAuth = jest.fn();
 
 jest.mock('@myx-trade/sdk', () => ({
   MyxClient: jest.fn(() => ({
     markets: {
       getPoolSymbolAll: mockGetPoolSymbolAll,
       getTickerList: mockGetTickerList,
+      getKlineList: mockGetKlineList,
+      getMarketDetail: mockGetMarketDetail,
     },
+    subscription: {
+      connect: mockWsConnect,
+      disconnect: mockWsDisconnect,
+      subscribeKline: mockSubscribeKline,
+      unsubscribeKline: mockUnsubscribeKline,
+    },
+    position: {
+      listPositions: mockListPositions,
+      getPositionHistory: mockGetPositionHistory,
+    },
+    order: {
+      getOrders: mockGetOrders,
+      getOrderHistory: mockGetOrderHistory,
+    },
+    account: {
+      getAccountInfo: mockGetAccountInfo,
+      getWalletQuoteTokenBalance: mockGetWalletQuoteTokenBalance,
+      getTradeFlow: mockGetTradeFlow,
+    },
+    auth: mockAuth,
   })),
 }));
 
@@ -31,7 +67,7 @@ jest.mock('@myx-trade/sdk', () => ({
 
 function makePool(overrides: Partial<MYXPoolSymbol> = {}): MYXPoolSymbol {
   return {
-    chainId: 97,
+    chainId: 59141,
     marketId: 'market-1',
     poolId: '0xpool1',
     baseSymbol: 'RHEA',
@@ -45,10 +81,10 @@ function makePool(overrides: Partial<MYXPoolSymbol> = {}): MYXPoolSymbol {
 
 function makeTicker(overrides: Partial<MYXTicker> = {}): MYXTicker {
   return {
-    chainId: 97,
+    chainId: 59141,
     poolId: '0xpool1',
     oracleId: 1,
-    price: '1500000000000000000000000000000000',
+    price: '1500.00',
     change: '2.5',
     high: '0',
     low: '0',
@@ -107,7 +143,7 @@ describe('MYXClientService', () => {
         '[MYXClientService] Initialized with SDK',
         expect.objectContaining({
           isTestnet: true,
-          chainId: 97,
+          chainId: 59141,
         }),
       );
     });
@@ -227,7 +263,7 @@ describe('MYXClientService', () => {
 
       expect(result).toEqual(tickers);
       expect(mockGetTickerList).toHaveBeenCalledWith({
-        chainId: 97,
+        chainId: 59141,
         poolIds: ['0xpool1'],
       });
     });
@@ -271,7 +307,7 @@ describe('MYXClientService', () => {
 
       expect(result).toEqual(tickers);
       expect(mockGetTickerList).toHaveBeenCalledWith({
-        chainId: 97,
+        chainId: 59141,
         poolIds: ['0xpool1', '0xpool2'],
       });
     });
@@ -564,4 +600,451 @@ describe('MYXClientService', () => {
       mainnetService.disconnect();
     });
   });
+
+  // ==========================================================================
+  // Authenticated Read Operations
+  // ==========================================================================
+
+  describe('listPositions', () => {
+    it('delegates to SDK and returns result', async () => {
+      const mockResult = { code: 9200, data: [{ poolId: '0x1', size: '100' }] };
+      mockListPositions.mockResolvedValueOnce(mockResult);
+
+      const result = await service.listPositions('0xuser');
+
+      expect(result).toEqual(mockResult);
+      expect(mockListPositions).toHaveBeenCalledWith('0xuser');
+    });
+
+    it('wraps and rethrows errors', async () => {
+      mockListPositions.mockRejectedValueOnce(new Error('API error'));
+
+      await expect(service.listPositions('0xuser')).rejects.toThrow(
+        'API error',
+      );
+      expect(mockDeps.logger.error).toHaveBeenCalled();
+    });
+  });
+
+  describe('getOrders', () => {
+    it('delegates to SDK and returns result', async () => {
+      const mockResult = { code: 9200, data: [] };
+      mockGetOrders.mockResolvedValueOnce(mockResult);
+
+      const result = await service.getOrders('0xuser');
+
+      expect(result).toEqual(mockResult);
+      expect(mockGetOrders).toHaveBeenCalledWith('0xuser');
+    });
+
+    it('wraps and rethrows errors', async () => {
+      mockGetOrders.mockRejectedValueOnce(new Error('Order error'));
+
+      await expect(service.getOrders('0xuser')).rejects.toThrow('Order error');
+      expect(mockDeps.logger.error).toHaveBeenCalled();
+    });
+  });
+
+  describe('getOrderHistory', () => {
+    it('delegates to SDK with params and address', async () => {
+      const params = { limit: 50, chainId: 59141 };
+      const mockResult = { code: 9200, data: [] };
+      mockGetOrderHistory.mockResolvedValueOnce(mockResult);
+
+      const result = await service.getOrderHistory(
+        params as Parameters<typeof service.getOrderHistory>[0],
+        '0xuser',
+      );
+
+      expect(result).toEqual(mockResult);
+      expect(mockGetOrderHistory).toHaveBeenCalledWith(params, '0xuser');
+    });
+
+    it('wraps and rethrows errors', async () => {
+      mockGetOrderHistory.mockRejectedValueOnce(new Error('History error'));
+
+      await expect(
+        service.getOrderHistory(
+          { limit: 50 } as Parameters<typeof service.getOrderHistory>[0],
+          '0xuser',
+        ),
+      ).rejects.toThrow('History error');
+    });
+  });
+
+  describe('getPositionHistory', () => {
+    it('delegates to SDK with params and address', async () => {
+      const params = { limit: 50 };
+      const mockResult = { code: 9200, data: [] };
+      mockGetPositionHistory.mockResolvedValueOnce(mockResult);
+
+      const result = await service.getPositionHistory(
+        params as Parameters<typeof service.getPositionHistory>[0],
+        '0xuser',
+      );
+
+      expect(result).toEqual(mockResult);
+      expect(mockGetPositionHistory).toHaveBeenCalledWith(params, '0xuser');
+    });
+
+    it('wraps and rethrows errors', async () => {
+      mockGetPositionHistory.mockRejectedValueOnce(new Error('Pos history'));
+
+      await expect(
+        service.getPositionHistory(
+          { limit: 50 } as Parameters<typeof service.getPositionHistory>[0],
+          '0xuser',
+        ),
+      ).rejects.toThrow('Pos history');
+    });
+  });
+
+  describe('getAccountInfo', () => {
+    it('delegates to SDK with chainId, address, poolId', async () => {
+      const mockResult = { code: 9200, data: { totalCollateral: '1000' } };
+      mockGetAccountInfo.mockResolvedValueOnce(mockResult);
+
+      const result = await service.getAccountInfo(59141, '0xuser', '0xpool1');
+
+      expect(result).toEqual(mockResult);
+      expect(mockGetAccountInfo).toHaveBeenCalledWith(
+        59141,
+        '0xuser',
+        '0xpool1',
+      );
+    });
+
+    it('wraps and rethrows errors', async () => {
+      mockGetAccountInfo.mockRejectedValueOnce(new Error('Account error'));
+
+      await expect(
+        service.getAccountInfo(59141, '0xuser', '0xpool1'),
+      ).rejects.toThrow('Account error');
+    });
+  });
+
+  describe('getWalletQuoteTokenBalance', () => {
+    it('delegates to SDK', async () => {
+      const mockResult = { code: 9200, data: '500000000' };
+      mockGetWalletQuoteTokenBalance.mockResolvedValueOnce(mockResult);
+
+      const result = await service.getWalletQuoteTokenBalance(59141, '0xuser');
+
+      expect(result).toEqual(mockResult);
+      expect(mockGetWalletQuoteTokenBalance).toHaveBeenCalledWith(
+        59141,
+        '0xuser',
+      );
+    });
+
+    it('wraps and rethrows errors', async () => {
+      mockGetWalletQuoteTokenBalance.mockRejectedValueOnce(
+        new Error('Balance error'),
+      );
+
+      await expect(
+        service.getWalletQuoteTokenBalance(59141, '0xuser'),
+      ).rejects.toThrow('Balance error');
+    });
+  });
+
+  describe('getTradeFlow', () => {
+    it('delegates to SDK with params and address', async () => {
+      const params = { limit: 50 };
+      const mockResult = { code: 9200, data: [] };
+      mockGetTradeFlow.mockResolvedValueOnce(mockResult);
+
+      const result = await service.getTradeFlow(
+        params as Parameters<typeof service.getTradeFlow>[0],
+        '0xuser',
+      );
+
+      expect(result).toEqual(mockResult);
+      expect(mockGetTradeFlow).toHaveBeenCalledWith(params, '0xuser');
+    });
+
+    it('wraps and rethrows errors', async () => {
+      mockGetTradeFlow.mockRejectedValueOnce(new Error('Flow error'));
+
+      await expect(
+        service.getTradeFlow(
+          { limit: 50 } as Parameters<typeof service.getTradeFlow>[0],
+          '0xuser',
+        ),
+      ).rejects.toThrow('Flow error');
+    });
+  });
+
+  // ==========================================================================
+  // Kline (Candle) Data
+  // ==========================================================================
+
+  describe('getKlineData', () => {
+    it('fetches kline data from SDK', async () => {
+      const klineData = [
+        {
+          time: 1700000000,
+          open: '50000',
+          close: '51000',
+          high: '52000',
+          low: '49000',
+        },
+      ];
+      mockGetKlineList.mockResolvedValueOnce(klineData);
+
+      const result = await service.getKlineData({
+        poolId: '0xpool1',
+        interval: '1h' as Parameters<
+          typeof service.getKlineData
+        >[0]['interval'],
+        limit: 100,
+      });
+
+      expect(result).toEqual(klineData);
+      expect(mockGetKlineList).toHaveBeenCalledWith(
+        expect.objectContaining({
+          poolId: '0xpool1',
+          chainId: 59141,
+          interval: '1h',
+          limit: 100,
+        }),
+      );
+    });
+
+    it('returns empty array when SDK returns null', async () => {
+      mockGetKlineList.mockResolvedValueOnce(null);
+
+      const result = await service.getKlineData({
+        poolId: '0xpool1',
+        interval: '1h' as Parameters<
+          typeof service.getKlineData
+        >[0]['interval'],
+        limit: 100,
+      });
+
+      expect(result).toEqual([]);
+    });
+
+    it('wraps and rethrows errors', async () => {
+      mockGetKlineList.mockRejectedValueOnce(new Error('Kline error'));
+
+      await expect(
+        service.getKlineData({
+          poolId: '0xpool1',
+          interval: '1h' as Parameters<
+            typeof service.getKlineData
+          >[0]['interval'],
+          limit: 100,
+        }),
+      ).rejects.toThrow('Kline error');
+    });
+  });
+
+  // ==========================================================================
+  // Global ID
+  // ==========================================================================
+
+  describe('getGlobalId', () => {
+    it('fetches globalId from market detail and caches it', async () => {
+      mockGetMarketDetail.mockResolvedValueOnce({ globalId: 42 });
+
+      const result = await service.getGlobalId('0xpool1');
+
+      expect(result).toBe(42);
+      expect(mockGetMarketDetail).toHaveBeenCalledWith({
+        chainId: 59141,
+        poolId: '0xpool1',
+      });
+    });
+
+    it('returns cached globalId on subsequent calls', async () => {
+      mockGetMarketDetail.mockResolvedValueOnce({ globalId: 42 });
+
+      await service.getGlobalId('0xpool1');
+      const result = await service.getGlobalId('0xpool1');
+
+      expect(result).toBe(42);
+      expect(mockGetMarketDetail).toHaveBeenCalledTimes(1);
+    });
+
+    it('wraps and rethrows errors', async () => {
+      mockGetMarketDetail.mockRejectedValueOnce(new Error('Detail error'));
+
+      await expect(service.getGlobalId('0xpool1')).rejects.toThrow(
+        'Detail error',
+      );
+    });
+  });
+
+  // ==========================================================================
+  // Kline WebSocket Subscriptions
+  // ==========================================================================
+
+  describe('subscribeToKline', () => {
+    it('delegates to SDK subscription', () => {
+      const callback = jest.fn();
+
+      service.subscribeToKline(
+        42,
+        '1h' as Parameters<typeof service.subscribeToKline>[1],
+        callback,
+      );
+
+      expect(mockSubscribeKline).toHaveBeenCalledWith(42, '1h', callback);
+    });
+  });
+
+  describe('unsubscribeFromKline', () => {
+    it('delegates to SDK unsubscription', () => {
+      const callback = jest.fn();
+
+      service.unsubscribeFromKline(
+        42,
+        '1h' as Parameters<typeof service.unsubscribeFromKline>[1],
+        callback,
+      );
+
+      expect(mockUnsubscribeKline).toHaveBeenCalledWith(42, '1h', callback);
+    });
+  });
+
+  // ==========================================================================
+  // Simple Getters
+  // ==========================================================================
+
+  describe('getChainId', () => {
+    it('returns testnet chain ID', () => {
+      expect(service.getChainId()).toBe(59141);
+    });
+
+    it('returns mainnet chain ID', () => {
+      const mainnetService = new MYXClientService(mockDeps, {
+        isTestnet: false,
+      });
+
+      expect(mainnetService.getChainId()).toBe(56);
+      mainnetService.disconnect();
+    });
+  });
+
+  describe('getNetwork', () => {
+    it('returns testnet for testnet service', () => {
+      expect(service.getNetwork()).toBe('testnet');
+    });
+
+    it('returns mainnet for mainnet service', () => {
+      const mainnetService = new MYXClientService(mockDeps, {
+        isTestnet: false,
+      });
+
+      expect(mainnetService.getNetwork()).toBe('mainnet');
+      mainnetService.disconnect();
+    });
+  });
+
+  describe('isAuthenticated', () => {
+    it('returns false before authentication', () => {
+      expect(service.isAuthenticated()).toBe(false);
+    });
+
+    it('returns true after successful authentication', async () => {
+      // authenticate() calls myxClient.auth() synchronously, then sets #authenticated
+      await service.authenticate({}, {}, '0xuser');
+
+      expect(service.isAuthenticated()).toBe(true);
+    });
+  });
+
+  describe('isAuthenticatedForAddress', () => {
+    it('returns false before authentication', () => {
+      expect(service.isAuthenticatedForAddress('0xuser')).toBe(false);
+    });
+
+    it('returns true for the authenticated address', async () => {
+      await service.authenticate({}, {}, '0xuser');
+
+      expect(service.isAuthenticatedForAddress('0xuser')).toBe(true);
+    });
+
+    it('returns true regardless of address casing', async () => {
+      await service.authenticate({}, {}, '0xUser');
+
+      expect(service.isAuthenticatedForAddress('0xuser')).toBe(true);
+      expect(service.isAuthenticatedForAddress('0xUSER')).toBe(true);
+    });
+
+    it('returns false for a different address', async () => {
+      await service.authenticate({}, {}, '0xuser');
+
+      expect(service.isAuthenticatedForAddress('0xother')).toBe(false);
+    });
+
+    it('returns false after disconnect', async () => {
+      await service.authenticate({}, {}, '0xuser');
+      service.disconnect();
+
+      expect(service.isAuthenticatedForAddress('0xuser')).toBe(false);
+    });
+  });
+
+  // ==========================================================================
+  // authenticate
+  // ==========================================================================
+
+  describe('authenticate', () => {
+    it('calls SDK auth with signer, getAccessToken, and walletClient', async () => {
+      const signer = { signMessage: jest.fn() };
+      const walletClient = {};
+
+      await service.authenticate(signer, walletClient, '0xuser');
+
+      expect(mockAuth).toHaveBeenCalledWith(
+        expect.objectContaining({
+          signer,
+          walletClient,
+          getAccessToken: expect.any(Function),
+        }),
+      );
+    });
+
+    it('skips if already authenticated', async () => {
+      await service.authenticate({}, {}, '0xuser');
+      mockAuth.mockClear();
+
+      await service.authenticate({}, {}, '0xuser');
+
+      expect(mockAuth).not.toHaveBeenCalled();
+    });
+
+    it('deduplicates concurrent auth calls', async () => {
+      // Slow auth: resolve after a tick
+      let resolveAuth: () => void = () => undefined;
+      mockAuth.mockImplementationOnce(
+        () =>
+          new Promise<void>((resolve) => {
+            resolveAuth = resolve;
+          }),
+      );
+
+      const p1 = service.authenticate({}, {}, '0xuser');
+      const p2 = service.authenticate({}, {}, '0xuser');
+
+      resolveAuth();
+      await Promise.all([p1, p2]);
+
+      // Only one SDK auth call despite two authenticate() calls
+      expect(mockAuth).toHaveBeenCalledTimes(1);
+    });
+
+    it('wraps and rethrows SDK auth errors', async () => {
+      mockAuth.mockImplementationOnce(() => {
+        throw new Error('Auth failed');
+      });
+
+      await expect(service.authenticate({}, {}, '0xuser')).rejects.toThrow(
+        'Auth failed',
+      );
+      expect(mockDeps.logger.error).toHaveBeenCalled();
+    });
+  });
 });
diff --git a/app/controllers/perps/services/MYXClientService.ts b/app/controllers/perps/services/MYXClientService.ts
index 00cf5ba55f79..0a2e2b804b54 100644
--- a/app/controllers/perps/services/MYXClientService.ts
+++ b/app/controllers/perps/services/MYXClientService.ts
@@ -1,22 +1,38 @@
 /**
  * MYXClientService
  *
- * Stage 1 service for fetching MYX market data using the @myx-trade/sdk.
- * Handles market listing, ticker fetching, and price polling.
+ * Service for managing MYX SDK client interactions.
+ * Handles market listing, ticker fetching, price polling, authentication,
+ * and authenticated reads (positions, orders, account info).
  *
  * Uses MyxClient SDK for API calls.
- * Trading functionality will be added in Stage 3.
  */
 
+import type {
+  KlineDataItemType,
+  KlineResolution,
+  KlineDataResponse,
+} from '@myx-trade/sdk';
 import { MyxClient } from '@myx-trade/sdk';
 
+import AppConstants from '../../../core/AppConstants';
 import {
   MYX_PRICE_POLLING_INTERVAL_MS,
   getMYXChainId,
+  getMYXHttpEndpoint,
 } from '../constants/myxConfig';
 import { PERPS_CONSTANTS } from '../constants/perpsConfig';
 import type { PerpsPlatformDependencies } from '../types';
-import type { MYXPoolSymbol, MYXTicker } from '../types/myx-types';
+import type {
+  MYXAuthConfig,
+  MYXPoolSymbol,
+  MYXTicker,
+  MYXPositionType,
+  MYXHistoryOrderItem,
+  MYXPositionHistoryItem,
+  MYXTradeFlowItem,
+  MYXGetHistoryOrdersParams,
+} from '../types/myx-types';
 import { ensureError } from '../utils/errorUtils';
 
 // ============================================================================
@@ -28,6 +44,7 @@ import { ensureError } from '../utils/errorUtils';
  */
 export type MYXClientConfig = {
   isTestnet: boolean;
+  authConfig?: MYXAuthConfig;
 };
 
 /**
@@ -40,8 +57,8 @@ export type PricePollingCallback = (tickers: MYXTicker[]) => void;
 // ============================================================================
 
 /**
- * Service for managing MYX SDK client interactions
- * Stage 1: Read-only operations (markets, prices)
+ * Service for managing MYX SDK client interactions.
+ * Handles markets, prices, authentication, and authenticated reads.
  */
 export class MYXClientService {
   // SDK Client
@@ -52,6 +69,16 @@ export class MYXClientService {
 
   readonly #chainId: number;
 
+  readonly #network: 'testnet' | 'mainnet';
+
+  // Auth config (passed at construction, not from runtime env vars)
+  readonly #authConfig: MYXAuthConfig;
+
+  // Auth state — null means unauthenticated, non-null is the lowercased address
+  #authenticatedAddress: string | null = null;
+
+  #authenticating: Promise<void> | null = null;
+
   // Price polling (sequential using setTimeout to prevent request pileup)
   #pricePollingTimeout?: ReturnType<typeof setTimeout>;
 
@@ -66,6 +93,9 @@ export class MYXClientService {
 
   readonly #marketsCacheTtlMs = 5 * 60 * 1000; // 5 minutes
 
+  // globalId cache: poolId → globalId (for WS subscriptions)
+  readonly #globalIdCache: Map<string, number> = new Map();
+
   // Platform dependencies
   readonly #deps: PerpsPlatformDependencies;
 
@@ -73,19 +103,45 @@ export class MYXClientService {
     this.#deps = deps;
 
     this.#isTestnet = config.isTestnet;
-    this.#chainId = getMYXChainId(this.#isTestnet ? 'testnet' : 'mainnet');
+    this.#network = this.#isTestnet ? 'testnet' : 'mainnet';
+    this.#chainId = getMYXChainId(this.#network);
 
-    // Initialize MyxClient
+    // Store auth config (from init file's babel-transformed process.env.X)
+    this.#authConfig = config.authConfig ?? {
+      appId: '',
+      apiSecret: '',
+      brokerAddress: '',
+    };
+
+    const brokerAddress =
+      this.#authConfig.brokerAddress || AppConstants.ZERO_ADDRESS;
+
+    if (brokerAddress === AppConstants.ZERO_ADDRESS) {
+      this.#deps.debugLogger.log(
+        '[MYXClientService] brokerAddress not configured, using zero address',
+      );
+    }
+
+    // Initialize MyxClient with broker address
     this.#myxClient = new MyxClient({
       chainId: this.#chainId,
-      brokerAddress: '0x0000000000000000000000000000000000000000', // Not needed for read-only
+      brokerAddress,
       isTestnet: this.#isTestnet,
-      isBetaMode: this.#isTestnet, // Use beta API for testnet
     });
 
+    // Connect WS at construction time (always-on, like HyperLiquid).
+    // Individual subscriptions (kline, tickers) subscribe/unsubscribe on
+    // this already-open socket.
+    this.#myxClient.subscription.connect();
+
     this.#deps.debugLogger.log('[MYXClientService] Initialized with SDK', {
       isTestnet: this.#isTestnet,
       chainId: this.#chainId,
+      wsConnected: true,
+      brokerAddress:
+        brokerAddress === AppConstants.ZERO_ADDRESS
+          ? 'zero (not configured)'
+          : 'configured',
     });
   }
 
@@ -192,12 +248,26 @@ export class MYXClientService {
         },
       );
 
-      const tickers = await this.#myxClient.markets.getTickerList({
-        chainId: this.#chainId,
-        poolIds,
-      });
+      // Group poolIds by their actual chainId from the markets cache.
+      // getPoolSymbolAll() can return pools across multiple chains (e.g. testnet
+      // spans chainId 59141 and 421614). The ticker API only returns results for
+      // pools that match the passed chainId, so we must call it once per chain.
+      const chainIdMap = new Map<number, string[]>();
+      for (const poolId of poolIds) {
+        const pool = this.#marketsCache.find((mp) => mp.poolId === poolId);
+        const chainId = pool?.chainId ?? this.#chainId;
+        const existing = chainIdMap.get(chainId) ?? [];
+        existing.push(poolId);
+        chainIdMap.set(chainId, existing);
+      }
+
+      const results = await Promise.all(
+        Array.from(chainIdMap.entries()).map(([chainId, ids]) =>
+          this.#myxClient.markets.getTickerList({ chainId, poolIds: ids }),
+        ),
+      );
 
-      return tickers || [];
+      return results.flat().filter(Boolean);
     } catch (caughtError) {
       const wrappedError = ensureError(
         caughtError,
@@ -335,6 +405,603 @@ export class MYXClientService {
     }, MYX_PRICE_POLLING_INTERVAL_MS);
   }
 
+  // ============================================================================
+  // Authentication
+  // ============================================================================
+
+  /**
+   * Authenticate the MYX client with signer and access token.
+   * Uses promise dedup to prevent concurrent auth attempts.
+   *
+   * @param signer - ethers v6 Signer-like object
+   * @param walletClient - viem WalletClient-like object
+   * @param address - User wallet address for token generation
+   */
+  async authenticate(
+    signer: unknown,
+    walletClient: unknown,
+    address: string,
+  ): Promise<void> {
+    if (this.#authenticatedAddress === address.toLowerCase()) {
+      return;
+    }
+
+    // Dedup concurrent auth calls
+    if (this.#authenticating) {
+      await this.#authenticating;
+      return;
+    }
+
+    this.#authenticating = this.#doAuthenticate(signer, walletClient, address);
+    try {
+      await this.#authenticating;
+    } finally {
+      this.#authenticating = null;
+    }
+  }
+
+  async #doAuthenticate(
+    signer: unknown,
+    walletClient: unknown,
+    address: string,
+  ): Promise<void> {
+    try {
+      this.#deps.debugLogger.log('[MYXClientService] Authenticating...', {
+        address: `${address.slice(0, 6)}...${address.slice(-4)}`,
+      });
+
+      // Create getAccessToken callback for the SDK.
+      // The SDK calls this when it needs a fresh token.
+      // Must return {accessToken, expireAt} or undefined.
+      const getAccessToken = async (): Promise<
+        { accessToken: string; expireAt: number } | undefined
+      > => {
+        try {
+          const token = await this.#generateAccessToken(address);
+          if (!token) {
+            return undefined;
+          }
+          // Workaround: MYX WS requires 'sdk.' prefix on access tokens.
+          // The SDK's subscription.auth() omits it — prepend here.
+          // Guard against double-prefix if SDK fixes this in the future.
+          const prefixed = token.accessToken.startsWith('sdk.')
+            ? token.accessToken
+            : `sdk.${token.accessToken}`;
+          return { accessToken: prefixed, expireAt: token.expireAt };
+        } catch (tokenError) {
+          this.#deps.debugLogger.log(
+            '[MYXClientService] Token generation failed',
+            { error: String(tokenError) },
+          );
+          return undefined;
+        }
+      };
+
+      // Call SDK auth with signer, walletClient, and getAccessToken
+      this.#myxClient.auth({
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        signer: signer as any,
+        getAccessToken,
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        walletClient: walletClient as any,
+      });
+
+      this.#authenticatedAddress = address.toLowerCase();
+
+      this.#deps.debugLogger.log(
+        '[MYXClientService] Authentication successful',
+      );
+    } catch (caughtError) {
+      const wrappedError = ensureError(
+        caughtError,
+        'MYXClientService.authenticate',
+      );
+      this.#deps.logger.error(
+        wrappedError,
+        this.#getErrorContext('authenticate'),
+      );
+      throw wrappedError;
+    }
+  }
+
+  // ============================================================================
+  // Token Generation (moved from myxConfig.ts)
+  // ============================================================================
+
+  /**
+   * Compute SHA-256 hex digest using the Web Crypto API (available in React Native).
+   *
+   * @param input - The string to hash.
+   * @returns Hex-encoded SHA-256 digest.
+   */
+  async #sha256Hex(input: string): Promise<string> {
+    const encoder = new TextEncoder();
+    const data = encoder.encode(input);
+    const hashBuffer = await globalThis.crypto.subtle.digest(
+      'SHA-256',
+      data.buffer as ArrayBuffer,
+    );
+    const hashArray = Array.from(new Uint8Array(hashBuffer));
+    return hashArray.map((b) => b.toString(16).padStart(2, '0')).join('');
+  }
+
+  /**
+   * Generate MYX access token via Token API.
+   * Token = SHA256({appId}&{timestamp}&{expireTime}&{address}&{secret})
+   *
+   * @param address - User wallet address.
+   * @returns Access token response with token string and expiry.
+   */
+  async #generateAccessToken(
+    address: string,
+  ): Promise<{ accessToken: string; expireAt: number }> {
+    const { appId, apiSecret } = this.#authConfig;
+
+    if (!appId || !apiSecret) {
+      throw new Error(
+        `MYX credentials not configured for ${this.#network}. Ensure MM_PERPS_MYX_APP_ID and MM_PERPS_MYX_API_SECRET are set in .js.env`,
+      );
+    }
+
+    const timestamp = Math.floor(Date.now() / 1000);
+    const expireTime = timestamp + 86400; // 24 hours
+    const signString = `${appId}&${timestamp}&${expireTime}&${address}&${apiSecret}`;
+    const signature = await this.#sha256Hex(signString);
+
+    // GET request with query params (per SDK integration guide)
+    const params = new URLSearchParams({
+      appId,
+      timestamp: String(timestamp),
+      expireTime: String(expireTime),
+      allowAccount: address,
+      signature,
+    });
+
+    const tokenApiUrl = `${getMYXHttpEndpoint(this.#network)}/openapi/gateway/auth/api_key/create_token`;
+
+    const response = await fetch(`${tokenApiUrl}?${params.toString()}`);
+
+    if (!response.ok) {
+      throw new Error(`MYX token API request failed: ${response.status}`);
+    }
+
+    const result = (await response.json()) as {
+      code: number;
+      data?: { accessToken: string; expireAt: number };
+      message?: string;
+    };
+
+    if (
+      (result.code !== 9200 && result.code !== 0) ||
+      !result.data?.accessToken
+    ) {
+      throw new Error(
+        `MYX token API error: code=${result.code} message=${result.message ?? 'unknown'}`,
+      );
+    }
+
+    return {
+      accessToken: result.data.accessToken,
+      expireAt: result.data.expireAt,
+    };
+  }
+
+  /**
+   * Check if the client is authenticated.
+   *
+   * @returns True if the client has been authenticated.
+   */
+  isAuthenticated(): boolean {
+    return this.#authenticatedAddress !== null;
+  }
+
+  /**
+   * Check if the client is authenticated for a specific address.
+   *
+   * @param address - The wallet address to check.
+   * @returns True if the client is authenticated for the given address.
+   */
+  isAuthenticatedForAddress(address: string): boolean {
+    return this.#authenticatedAddress === address.toLowerCase();
+  }
+
+  /**
+   * Get the currently authenticated address, or null if not authenticated.
+   *
+   * @returns The authenticated address or null.
+   */
+  getAuthenticatedAddress(): string | null {
+    return this.#authenticatedAddress;
+  }
+
+  // ============================================================================
+  // Authenticated Read Operations
+  // ============================================================================
+
+  /**
+   * List positions for the given address.
+   *
+   * @param address - User wallet address.
+   * @returns SDK response with position data.
+   */
+  async listPositions(
+    address: string,
+  ): Promise<{ code: number; data?: MYXPositionType[] }> {
+    try {
+      this.#deps.debugLogger.log('[MYXClientService] Listing positions');
+      const result = await this.#myxClient.position.listPositions(address);
+      return result as { code: number; data?: MYXPositionType[] };
+    } catch (caughtError) {
+      const wrappedError = ensureError(
+        caughtError,
+        'MYXClientService.listPositions',
+      );
+      this.#deps.logger.error(
+        wrappedError,
+        this.#getErrorContext('listPositions'),
+      );
+      throw wrappedError;
+    }
+  }
+
+  /**
+   * Get open orders for the given address.
+   *
+   * @param address - User wallet address.
+   * @returns SDK response with order data.
+   */
+  async getOrders(
+    address: string,
+  ): Promise<{ code: number; data?: MYXPositionType[] }> {
+    try {
+      this.#deps.debugLogger.log('[MYXClientService] Getting orders');
+      const result = await this.#myxClient.order.getOrders(address);
+      return result as { code: number; data?: MYXPositionType[] };
+    } catch (caughtError) {
+      const wrappedError = ensureError(
+        caughtError,
+        'MYXClientService.getOrders',
+      );
+      this.#deps.logger.error(wrappedError, this.#getErrorContext('getOrders'));
+      throw wrappedError;
+    }
+  }
+
+  /**
+   * Get order history.
+   *
+   * @param params - History query parameters (limit, chainId, poolId).
+   * @param address - User wallet address.
+   * @returns SDK response with historical order data.
+   */
+  async getOrderHistory(
+    params: MYXGetHistoryOrdersParams,
+    address: string,
+  ): Promise<{ code: number; data: MYXHistoryOrderItem[] }> {
+    try {
+      this.#deps.debugLogger.log('[MYXClientService] Getting order history');
+      const result = await this.#myxClient.order.getOrderHistory(
+        params,
+        address,
+      );
+      return result as { code: number; data: MYXHistoryOrderItem[] };
+    } catch (caughtError) {
+      const wrappedError = ensureError(
+        caughtError,
+        'MYXClientService.getOrderHistory',
+      );
+      this.#deps.logger.error(
+        wrappedError,
+        this.#getErrorContext('getOrderHistory'),
+      );
+      throw wrappedError;
+    }
+  }
+
+  /**
+   * Get position history.
+   *
+   * @param params - History query parameters (limit, chainId, poolId).
+   * @param address - User wallet address.
+   * @returns SDK response with historical position data.
+   */
+  async getPositionHistory(
+    params: MYXGetHistoryOrdersParams,
+    address: string,
+  ): Promise<{ code: number; data: MYXPositionHistoryItem[] }> {
+    try {
+      this.#deps.debugLogger.log('[MYXClientService] Getting position history');
+      const result = await this.#myxClient.position.getPositionHistory(
+        params,
+        address,
+      );
+      return result as { code: number; data: MYXPositionHistoryItem[] };
+    } catch (caughtError) {
+      const wrappedError = ensureError(
+        caughtError,
+        'MYXClientService.getPositionHistory',
+      );
+      this.#deps.logger.error(
+        wrappedError,
+        this.#getErrorContext('getPositionHistory'),
+      );
+      throw wrappedError;
+    }
+  }
+
+  /**
+   * Get account info for a specific pool.
+   *
+   * @param chainId - Chain ID for the query.
+   * @param address - User wallet address.
+   * @param poolId - Pool identifier.
+   * @returns SDK response with account info data.
+   */
+  async getAccountInfo(
+    chainId: number,
+    address: string,
+    poolId: string,
+  ): Promise<{ code: number; data?: Record<string, unknown> }> {
+    try {
+      this.#deps.debugLogger.log('[MYXClientService] Getting account info', {
+        poolId,
+      });
+      const result = await this.#myxClient.account.getAccountInfo(
+        chainId,
+        address,
+        poolId,
+      );
+      return result as { code: number; data?: Record<string, unknown> };
+    } catch (caughtError) {
+      const wrappedError = ensureError(
+        caughtError,
+        'MYXClientService.getAccountInfo',
+      );
+      this.#deps.logger.error(
+        wrappedError,
+        this.#getErrorContext('getAccountInfo'),
+      );
+      throw wrappedError;
+    }
+  }
+
+  /**
+   * Get wallet USDT balance.
+   *
+   * @param chainId - Chain ID for the query.
+   * @param address - User wallet address.
+   * @returns SDK response with balance data.
+   */
+  async getWalletQuoteTokenBalance(
+    chainId: number,
+    address: string,
+  ): Promise<{ code: number; data: string }> {
+    try {
+      this.#deps.debugLogger.log('[MYXClientService] Getting wallet balance');
+      const result = await this.#myxClient.account.getWalletQuoteTokenBalance(
+        chainId,
+        address,
+      );
+      return result as { code: number; data: string };
+    } catch (caughtError) {
+      const wrappedError = ensureError(
+        caughtError,
+        'MYXClientService.getWalletQuoteTokenBalance',
+      );
+      this.#deps.logger.error(
+        wrappedError,
+        this.#getErrorContext('getWalletQuoteTokenBalance'),
+      );
+      throw wrappedError;
+    }
+  }
+
+  /**
+   * Get trade flow (deposits, withdrawals, funding, etc.).
+   *
+   * @param params - History query parameters (limit, chainId, poolId).
+   * @param address - User wallet address.
+   * @returns SDK response with trade flow data.
+   */
+  async getTradeFlow(
+    params: MYXGetHistoryOrdersParams,
+    address: string,
+  ): Promise<{ code: number; data: MYXTradeFlowItem[] }> {
+    try {
+      this.#deps.debugLogger.log('[MYXClientService] Getting trade flow');
+      const result = await this.#myxClient.account.getTradeFlow(
+        params,
+        address,
+      );
+      return result as { code: number; data: MYXTradeFlowItem[] };
+    } catch (caughtError) {
+      const wrappedError = ensureError(
+        caughtError,
+        'MYXClientService.getTradeFlow',
+      );
+      this.#deps.logger.error(
+        wrappedError,
+        this.#getErrorContext('getTradeFlow'),
+      );
+      throw wrappedError;
+    }
+  }
+
+  /**
+   * Get chain ID.
+   *
+   * @returns The numeric chain ID.
+   */
+  getChainId(): number {
+    return this.#chainId;
+  }
+
+  /**
+   * Get network.
+   *
+   * @returns The network identifier string.
+   */
+  getNetwork(): 'testnet' | 'mainnet' {
+    return this.#network;
+  }
+
+  // ============================================================================
+  // Kline (Candle) Data
+  // ============================================================================
+
+  /**
+   * Get kline (candle) data for a pool.
+   *
+   * @param params - Kline query parameters.
+   * @param params.poolId - Pool identifier.
+   * @param params.interval - Kline resolution ('1m', '5m', '15m', '30m', '1h', '4h', '1d', '1w', '1M').
+   * @param params.limit - Number of candles to fetch.
+   * @param params.endTime - Optional end time (unix seconds).
+   * @returns Array of kline data items.
+   */
+  async getKlineData(params: {
+    poolId: string;
+    interval: KlineResolution;
+    limit: number;
+    endTime?: number;
+  }): Promise<KlineDataItemType[]> {
+    try {
+      this.#deps.debugLogger.log('[MYXClientService] Fetching kline data', {
+        poolId: params.poolId,
+        interval: params.interval,
+        limit: params.limit,
+      });
+
+      const result = await this.#myxClient.markets.getKlineList({
+        poolId: params.poolId,
+        chainId: this.#chainId,
+        interval: params.interval,
+        limit: params.limit,
+        endTime: params.endTime ?? Math.floor(Date.now() / 1000),
+      });
+
+      return result || [];
+    } catch (caughtError) {
+      const wrappedError = ensureError(
+        caughtError,
+        'MYXClientService.getKlineData',
+      );
+      this.#deps.logger.error(
+        wrappedError,
+        this.#getErrorContext('getKlineData', {
+          poolId: params.poolId,
+          interval: params.interval,
+        }),
+      );
+      throw wrappedError;
+    }
+  }
+
+  // ============================================================================
+  // Market Detail / Global ID
+  // ============================================================================
+
+  /**
+   * Get the globalId for a pool. Required for WebSocket subscriptions.
+   * Fetches via getMarketDetail and caches the result.
+   *
+   * @param poolId - Pool identifier.
+   * @returns The numeric globalId for WebSocket subscriptions.
+   */
+  async getGlobalId(poolId: string): Promise<number> {
+    const cached = this.#globalIdCache.get(poolId);
+    if (cached !== undefined) {
+      return cached;
+    }
+
+    try {
+      this.#deps.debugLogger.log(
+        '[MYXClientService] Fetching globalId via getMarketDetail',
+        { poolId },
+      );
+
+      const detail = await this.#myxClient.markets.getMarketDetail({
+        chainId: this.#chainId,
+        poolId,
+      });
+
+      const { globalId } = detail;
+      this.#globalIdCache.set(poolId, globalId);
+
+      this.#deps.debugLogger.log('[MYXClientService] globalId cached', {
+        poolId,
+        globalId,
+      });
+
+      return globalId;
+    } catch (caughtError) {
+      const wrappedError = ensureError(
+        caughtError,
+        'MYXClientService.getGlobalId',
+      );
+      this.#deps.logger.error(
+        wrappedError,
+        this.#getErrorContext('getGlobalId', { poolId }),
+      );
+      throw wrappedError;
+    }
+  }
+
+  // ============================================================================
+  // Kline WebSocket Subscriptions
+  // ============================================================================
+
+  /**
+   * Subscribe to live kline (candle) updates via WebSocket.
+   * WS is already connected (always-on from construction).
+   *
+   * @param globalId - Market globalId (from getGlobalId).
+   * @param resolution - Kline resolution.
+   * @param callback - Called on each WS kline update.
+   */
+  subscribeToKline(
+    globalId: number,
+    resolution: KlineResolution,
+    callback: (data: KlineDataResponse) => void,
+  ): void {
+    this.#deps.debugLogger.log('[MYXClientService] Subscribing to kline WS', {
+      globalId,
+      resolution,
+    });
+    this.#myxClient.subscription.subscribeKline(globalId, resolution, callback);
+  }
+
+  /**
+   * Unsubscribe from live kline updates.
+   *
+   * @param globalId - Market globalId.
+   * @param resolution - Kline resolution.
+   * @param callback - The same callback reference passed to subscribeToKline.
+   */
+  unsubscribeFromKline(
+    globalId: number,
+    resolution: KlineResolution,
+    callback: (data: KlineDataResponse) => void,
+  ): void {
+    this.#deps.debugLogger.log(
+      '[MYXClientService] Unsubscribing from kline WS',
+      { globalId, resolution },
+    );
+    try {
+      this.#myxClient.subscription.unsubscribeKline(
+        globalId,
+        resolution,
+        callback,
+      );
+    } catch (error) {
+      // SOCKET_NOT_CONNECTED is expected during cleanup — socket already torn down
+      this.#deps.debugLogger.log(
+        '[MYXClientService] Kline unsubscribe failed (expected during disconnect)',
+        { globalId, resolution, error: String(error) },
+      );
+    }
+  }
+
   // ============================================================================
   // Health Check
   // ============================================================================
@@ -386,8 +1053,12 @@ export class MYXClientService {
    */
   disconnect(): void {
     this.stopPricePolling();
+    this.#myxClient.subscription.disconnect();
     this.#marketsCache = [];
     this.#marketsCacheTimestamp = 0;
+    this.#globalIdCache.clear();
+    this.#authenticatedAddress = null;
+    this.#authenticating = null;
 
     this.#deps.debugLogger.log('[MYXClientService] Disconnected');
   }
diff --git a/app/controllers/perps/services/MYXWalletService.test.ts b/app/controllers/perps/services/MYXWalletService.test.ts
new file mode 100644
index 000000000000..a271209a987c
--- /dev/null
+++ b/app/controllers/perps/services/MYXWalletService.test.ts
@@ -0,0 +1,462 @@
+/**
+ * Unit tests for MYXWalletService
+ */
+
+/* eslint-disable @typescript-eslint/no-explicit-any */
+
+// Mock keyring-api to avoid import issues with definePattern
+jest.mock('@metamask/keyring-api', () => ({
+  isEvmAccountType: jest.fn((accountType: string) =>
+    accountType?.startsWith('eip155:'),
+  ),
+}));
+
+// Mock keyring-controller to avoid superstruct/abi-utils chain errors
+jest.mock('@metamask/keyring-controller', () => ({
+  SignTypedDataVersion: { V4: 'V4' },
+}));
+
+// Mock MetaMask utils
+jest.mock('@metamask/utils', () => ({
+  parseCaipAccountId: jest.fn((accountId: string) => {
+    const parts = accountId.split(':');
+    return {
+      chainNamespace: parts[0],
+      chainReference: parts[1],
+      address: parts[2],
+    };
+  }),
+  isValidHexAddress: jest.fn((address: string) =>
+    /^0x[0-9a-fA-F]{40}$/.test(address),
+  ),
+}));
+
+// Mock MYX config
+jest.mock('../constants/myxConfig', () => ({
+  getMYXChainId: jest.fn((network: string) =>
+    network === 'testnet' ? 421614 : 56,
+  ),
+  MYX_TESTNET_CHAIN_ID: '421614',
+  MYX_MAINNET_CHAIN_ID: '56',
+}));
+
+// Mock DevLogger
+jest.mock('../../../core/SDKConnect/utils/DevLogger', () => ({
+  DevLogger: {
+    log: jest.fn(),
+  },
+}));
+
+import type { CaipAccountId } from '@metamask/utils';
+
+import {
+  createMockInfrastructure,
+  createMockEvmAccount,
+  createMockMessenger,
+} from '../../../components/UI/Perps/__mocks__/serviceMocks';
+
+import { MYXWalletService } from './MYXWalletService';
+
+describe('MYXWalletService', () => {
+  let service: MYXWalletService;
+  let mockDeps: ReturnType<typeof createMockInfrastructure>;
+  let mockMessenger: ReturnType<typeof createMockMessenger>;
+  const mockEvmAccount = createMockEvmAccount();
+
+  beforeEach(() => {
+    jest.clearAllMocks();
+    mockDeps = createMockInfrastructure();
+    mockMessenger = createMockMessenger();
+    service = new MYXWalletService(mockDeps, mockMessenger);
+  });
+
+  describe('Constructor and Configuration', () => {
+    it('initializes with mainnet by default', () => {
+      expect(service.isTestnetMode()).toBe(false);
+    });
+
+    it('initializes with testnet when specified', () => {
+      const testnetService = new MYXWalletService(mockDeps, mockMessenger, {
+        isTestnet: true,
+      });
+
+      expect(testnetService.isTestnetMode()).toBe(true);
+    });
+
+    it('setTestnetMode / isTestnetMode toggles correctly', () => {
+      service.setTestnetMode(true);
+      expect(service.isTestnetMode()).toBe(true);
+
+      service.setTestnetMode(false);
+      expect(service.isTestnetMode()).toBe(false);
+    });
+
+    it('isKeyringUnlocked returns keyring state', () => {
+      expect(service.isKeyringUnlocked()).toBe(true);
+
+      (mockMessenger.call as jest.Mock).mockImplementation((action: string) => {
+        if (action === 'KeyringController:getState') {
+          return { isUnlocked: false };
+        }
+        return undefined;
+      });
+
+      expect(service.isKeyringUnlocked()).toBe(false);
+    });
+  });
+
+  describe('createEthersSigner', () => {
+    it('throws NO_ACCOUNT_SELECTED when no account', () => {
+      (mockMessenger.call as jest.Mock).mockImplementation((action: string) => {
+        if (
+          action === 'AccountTreeController:getAccountsFromSelectedAccountGroup'
+        ) {
+          return [];
+        }
+        return undefined;
+      });
+
+      expect(() => service.createEthersSigner()).toThrow('NO_ACCOUNT_SELECTED');
+    });
+
+    it('getAddress() returns current account address', async () => {
+      const signer = service.createEthersSigner();
+      const address = await signer.getAddress();
+
+      expect(address).toBe(mockEvmAccount.address);
+    });
+
+    it('getAddress() throws when account disappears', async () => {
+      const signer = service.createEthersSigner();
+
+      (mockMessenger.call as jest.Mock).mockImplementation((action: string) => {
+        if (
+          action === 'AccountTreeController:getAccountsFromSelectedAccountGroup'
+        ) {
+          return [];
+        }
+        return undefined;
+      });
+
+      await expect(signer.getAddress()).rejects.toThrow('NO_ACCOUNT_SELECTED');
+    });
+
+    it('signTypedData() calls messenger with correct params and returns signature', async () => {
+      const signer = service.createEthersSigner();
+      const domain = { name: 'MYX', version: '1', chainId: 56 };
+      const types = {
+        Order: [
+          { name: 'asset', type: 'uint32' },
+          { name: 'isBuy', type: 'bool' },
+        ],
+      };
+      const value = { asset: 0, isBuy: true };
+
+      const result = await signer.signTypedData(domain, types, value);
+
+      expect(result).toBe('0xSignatureResult');
+      expect(mockMessenger.call).toHaveBeenCalledWith(
+        'KeyringController:signTypedMessage',
+        {
+          from: mockEvmAccount.address,
+          data: {
+            domain,
+            types,
+            primaryType: 'Order',
+            message: value,
+          },
+        },
+        'V4',
+      );
+    });
+
+    it('signTypedData() derives primaryType (non-EIP712Domain key)', async () => {
+      const signer = service.createEthersSigner();
+      const domain = { name: 'MYX' };
+      const types = {
+        EIP712Domain: [{ name: 'name', type: 'string' }],
+        Transfer: [{ name: 'amount', type: 'uint256' }],
+      };
+      const value = { amount: '1000' };
+
+      await signer.signTypedData(domain, types, value);
+
+      expect(mockMessenger.call).toHaveBeenCalledWith(
+        'KeyringController:signTypedMessage',
+        expect.objectContaining({
+          data: expect.objectContaining({ primaryType: 'Transfer' }),
+        }),
+        'V4',
+      );
+    });
+
+    it('signTypedData() falls back to EIP712Domain when types only has that key', async () => {
+      const signer = service.createEthersSigner();
+      const domain = { name: 'MYX' };
+      const types = {
+        EIP712Domain: [{ name: 'name', type: 'string' }],
+      };
+      const value = {};
+
+      await signer.signTypedData(domain, types, value);
+
+      expect(mockMessenger.call).toHaveBeenCalledWith(
+        'KeyringController:signTypedMessage',
+        expect.objectContaining({
+          data: expect.objectContaining({ primaryType: 'EIP712Domain' }),
+        }),
+        'V4',
+      );
+    });
+
+    it('signTypedData() throws NO_ACCOUNT_SELECTED when account disappears', async () => {
+      const signer = service.createEthersSigner();
+
+      (mockMessenger.call as jest.Mock).mockImplementation((action: string) => {
+        if (
+          action === 'AccountTreeController:getAccountsFromSelectedAccountGroup'
+        ) {
+          return [];
+        }
+        if (action === 'KeyringController:getState') {
+          return { isUnlocked: true };
+        }
+        return undefined;
+      });
+
+      await expect(
+        signer.signTypedData({ name: 'MYX' }, { Test: [] }, {}),
+      ).rejects.toThrow('NO_ACCOUNT_SELECTED');
+    });
+
+    it('signTypedData() throws KEYRING_LOCKED when keyring locked', async () => {
+      const signer = service.createEthersSigner();
+
+      (mockMessenger.call as jest.Mock).mockImplementation((action: string) => {
+        if (
+          action === 'AccountTreeController:getAccountsFromSelectedAccountGroup'
+        ) {
+          return [mockEvmAccount];
+        }
+        if (action === 'KeyringController:getState') {
+          return { isUnlocked: false };
+        }
+        return undefined;
+      });
+
+      await expect(
+        signer.signTypedData({ name: 'MYX' }, { Test: [] }, {}),
+      ).rejects.toThrow('KEYRING_LOCKED');
+    });
+
+    it('provider is null', () => {
+      const signer = service.createEthersSigner();
+
+      expect(signer.provider).toBeNull();
+    });
+  });
+
+  describe('createWalletClient', () => {
+    it('throws NO_ACCOUNT_SELECTED when no account', () => {
+      (mockMessenger.call as jest.Mock).mockImplementation((action: string) => {
+        if (
+          action === 'AccountTreeController:getAccountsFromSelectedAccountGroup'
+        ) {
+          return [];
+        }
+        return undefined;
+      });
+
+      expect(() => service.createWalletClient()).toThrow('NO_ACCOUNT_SELECTED');
+    });
+
+    it('returns correct account address and chain ID for mainnet (56)', () => {
+      const client = service.createWalletClient();
+
+      expect(client.account.address).toBe(mockEvmAccount.address);
+      expect(client.chain.id).toBe(56);
+    });
+
+    it('returns correct chain ID for testnet (421614)', () => {
+      const testnetService = new MYXWalletService(mockDeps, mockMessenger, {
+        isTestnet: true,
+      });
+      const client = testnetService.createWalletClient();
+
+      expect(client.chain.id).toBe(421614);
+    });
+
+    it('signTypedData() calls messenger and returns signature', async () => {
+      const client = service.createWalletClient();
+      const args = {
+        domain: { name: 'MYX', chainId: 56 },
+        types: { Order: [{ name: 'asset', type: 'uint32' }] },
+        primaryType: 'Order',
+        message: { asset: 1 },
+      };
+
+      const result = await client.signTypedData(args);
+
+      expect(result).toBe('0xSignatureResult');
+      expect(mockMessenger.call).toHaveBeenCalledWith(
+        'KeyringController:signTypedMessage',
+        {
+          from: mockEvmAccount.address,
+          data: {
+            domain: args.domain,
+            types: args.types,
+            primaryType: args.primaryType,
+            message: args.message,
+          },
+        },
+        'V4',
+      );
+    });
+
+    it('signTypedData() throws NO_ACCOUNT_SELECTED when account disappears', async () => {
+      const client = service.createWalletClient();
+
+      (mockMessenger.call as jest.Mock).mockImplementation((action: string) => {
+        if (
+          action === 'AccountTreeController:getAccountsFromSelectedAccountGroup'
+        ) {
+          return [];
+        }
+        if (action === 'KeyringController:getState') {
+          return { isUnlocked: true };
+        }
+        return undefined;
+      });
+
+      await expect(
+        client.signTypedData({
+          domain: {},
+          types: {},
+          primaryType: 'Test',
+          message: {},
+        }),
+      ).rejects.toThrow('NO_ACCOUNT_SELECTED');
+    });
+
+    it('signTypedData() throws KEYRING_LOCKED when keyring locked', async () => {
+      const client = service.createWalletClient();
+
+      (mockMessenger.call as jest.Mock).mockImplementation((action: string) => {
+        if (
+          action === 'AccountTreeController:getAccountsFromSelectedAccountGroup'
+        ) {
+          return [mockEvmAccount];
+        }
+        if (action === 'KeyringController:getState') {
+          return { isUnlocked: false };
+        }
+        return undefined;
+      });
+
+      await expect(
+        client.signTypedData({
+          domain: {},
+          types: {},
+          primaryType: 'Test',
+          message: {},
+        }),
+      ).rejects.toThrow('KEYRING_LOCKED');
+    });
+  });
+
+  describe('getUserAddress', () => {
+    it('returns address as Hex', () => {
+      const address = service.getUserAddress();
+
+      expect(address).toBe(mockEvmAccount.address);
+    });
+
+    it('throws NO_ACCOUNT_SELECTED when no account', () => {
+      (mockMessenger.call as jest.Mock).mockImplementation((action: string) => {
+        if (
+          action === 'AccountTreeController:getAccountsFromSelectedAccountGroup'
+        ) {
+          return [];
+        }
+        return undefined;
+      });
+
+      expect(() => service.getUserAddress()).toThrow('NO_ACCOUNT_SELECTED');
+    });
+
+    it('throws INVALID_ADDRESS_FORMAT when isValidHexAddress returns false', () => {
+      const { isValidHexAddress } = jest.requireMock('@metamask/utils');
+      isValidHexAddress.mockReturnValueOnce(false);
+
+      expect(() => service.getUserAddress()).toThrow('INVALID_ADDRESS_FORMAT');
+    });
+  });
+
+  describe('getCurrentAccountId', () => {
+    it('returns CAIP ID with mainnet chain (eip155:56:address)', async () => {
+      const accountId = await service.getCurrentAccountId();
+
+      expect(accountId).toBe(`eip155:56:${mockEvmAccount.address}`);
+    });
+
+    it('returns CAIP ID with testnet chain (eip155:421614:address)', async () => {
+      service.setTestnetMode(true);
+
+      const accountId = await service.getCurrentAccountId();
+
+      expect(accountId).toBe(`eip155:421614:${mockEvmAccount.address}`);
+    });
+
+    it('throws NO_ACCOUNT_SELECTED when no account', async () => {
+      (mockMessenger.call as jest.Mock).mockImplementation((action: string) => {
+        if (
+          action === 'AccountTreeController:getAccountsFromSelectedAccountGroup'
+        ) {
+          return [];
+        }
+        return undefined;
+      });
+
+      await expect(service.getCurrentAccountId()).rejects.toThrow(
+        'NO_ACCOUNT_SELECTED',
+      );
+    });
+  });
+
+  describe('getUserAddressFromAccountId / getUserAddressWithDefault', () => {
+    it('parses address from CAIP account ID', () => {
+      const accountId =
+        'eip155:56:0x1234567890123456789012345678901234567890' as CaipAccountId;
+
+      const address = service.getUserAddressFromAccountId(accountId);
+
+      expect(address).toBe('0x1234567890123456789012345678901234567890');
+    });
+
+    it('throws INVALID_ADDRESS_FORMAT for invalid address', () => {
+      const { isValidHexAddress } = jest.requireMock('@metamask/utils');
+      isValidHexAddress.mockReturnValueOnce(false);
+
+      const accountId = 'eip155:56:invalid-address' as CaipAccountId;
+
+      expect(() => service.getUserAddressFromAccountId(accountId)).toThrow(
+        'INVALID_ADDRESS_FORMAT',
+      );
+    });
+
+    it('getUserAddressWithDefault uses provided accountId', async () => {
+      const accountId =
+        'eip155:56:0x9999999999999999999999999999999999999999' as CaipAccountId;
+
+      const address = await service.getUserAddressWithDefault(accountId);
+
+      expect(address).toBe('0x9999999999999999999999999999999999999999');
+    });
+
+    it('getUserAddressWithDefault falls back to getCurrentAccountId', async () => {
+      const address = await service.getUserAddressWithDefault();
+
+      expect(address).toBe(mockEvmAccount.address);
+    });
+  });
+});
diff --git a/app/controllers/perps/services/MYXWalletService.ts b/app/controllers/perps/services/MYXWalletService.ts
new file mode 100644
index 000000000000..ba3d9b2cd171
--- /dev/null
+++ b/app/controllers/perps/services/MYXWalletService.ts
@@ -0,0 +1,264 @@
+/**
+ * MYXWalletService
+ *
+ * Provides ethers v6 Signer and viem WalletClient adapters for the MYX SDK.
+ * Routes signing operations through MetaMask's KeyringController via messenger.
+ *
+ * The MYX SDK requires:
+ * - ethers.Signer (v6) for on-chain transaction signing
+ * - viem WalletClient for wallet interactions
+ * - getAccessToken callback for API auth
+ *
+ * This service creates lightweight adapter objects that satisfy these interfaces
+ * while delegating actual signing to the MetaMask keyring.
+ */
+
+import { SignTypedDataVersion } from '@metamask/keyring-controller';
+import type { TypedMessageParams } from '@metamask/keyring-controller';
+import { parseCaipAccountId, isValidHexAddress } from '@metamask/utils';
+import type { CaipAccountId, Hex } from '@metamask/utils';
+
+import {
+  getMYXChainId,
+  MYX_TESTNET_CHAIN_ID,
+  MYX_MAINNET_CHAIN_ID,
+} from '../constants/myxConfig';
+import type { PerpsControllerMessenger } from '../PerpsController';
+import { PERPS_ERROR_CODES } from '../perpsErrorCodes';
+import type { PerpsPlatformDependencies } from '../types';
+import { getSelectedEvmAccount } from '../utils/accountUtils';
+
+export class MYXWalletService {
+  #isTestnet: boolean;
+
+  readonly #deps: PerpsPlatformDependencies;
+
+  readonly #messenger: PerpsControllerMessenger;
+
+  constructor(
+    deps: PerpsPlatformDependencies,
+    messenger: PerpsControllerMessenger,
+    options: { isTestnet?: boolean } = {},
+  ) {
+    this.#deps = deps;
+    this.#messenger = messenger;
+    this.#isTestnet = options.isTestnet ?? false;
+  }
+
+  /**
+   * Check if the keyring is currently unlocked.
+   *
+   * @returns True if the keyring is unlocked and available for signing.
+   */
+  public isKeyringUnlocked(): boolean {
+    return this.#messenger.call('KeyringController:getState').isUnlocked;
+  }
+
+  async #signTypedMessage(msgParams: TypedMessageParams): Promise<string> {
+    if (!this.isKeyringUnlocked()) {
+      throw new Error(PERPS_ERROR_CODES.KEYRING_LOCKED);
+    }
+    return this.#messenger.call(
+      'KeyringController:signTypedMessage',
+      msgParams,
+      SignTypedDataVersion.V4,
+    );
+  }
+
+  /**
+   * Create an ethers v6 Signer-like object for the MYX SDK.
+   * The MYX SDK uses ethers v6 internally (bundled in its own node_modules).
+   * We return a plain object that satisfies the SDK's usage pattern:
+   * - getAddress(): returns the user's address
+   * - signTypedData(): delegates to MetaMask keyring
+   *
+   * @returns Signer-like adapter object for the MYX SDK.
+   */
+  public createEthersSigner(): {
+    getAddress: () => Promise<string>;
+    signTypedData: (
+      domain: Record<string, unknown>,
+      types: Record<string, { name: string; type: string }[]>,
+      value: Record<string, unknown>,
+    ) => Promise<string>;
+    provider: null;
+  } {
+    const evmAccount = getSelectedEvmAccount(
+      this.#messenger.call(
+        'AccountTreeController:getAccountsFromSelectedAccountGroup',
+      ),
+    );
+    if (!evmAccount?.address) {
+      throw new Error(PERPS_ERROR_CODES.NO_ACCOUNT_SELECTED);
+    }
+
+    return {
+      getAddress: async (): Promise<string> => {
+        const currentAccount = getSelectedEvmAccount(
+          this.#messenger.call(
+            'AccountTreeController:getAccountsFromSelectedAccountGroup',
+          ),
+        );
+        if (!currentAccount?.address) {
+          throw new Error(PERPS_ERROR_CODES.NO_ACCOUNT_SELECTED);
+        }
+        return currentAccount.address;
+      },
+      signTypedData: async (
+        domain: Record<string, unknown>,
+        types: Record<string, { name: string; type: string }[]>,
+        value: Record<string, unknown>,
+      ): Promise<string> => {
+        const currentAccount = getSelectedEvmAccount(
+          this.#messenger.call(
+            'AccountTreeController:getAccountsFromSelectedAccountGroup',
+          ),
+        );
+        if (!currentAccount?.address) {
+          throw new Error(PERPS_ERROR_CODES.NO_ACCOUNT_SELECTED);
+        }
+
+        // Determine primaryType from types (exclude EIP712Domain)
+        const typeKeys = Object.keys(types).filter((k) => k !== 'EIP712Domain');
+        const primaryType = typeKeys[0] ?? 'EIP712Domain';
+
+        this.#deps.debugLogger.log('MYXWalletService: Signing typed data', {
+          address: currentAccount.address,
+          primaryType,
+        });
+
+        const signature = await this.#signTypedMessage({
+          from: currentAccount.address as Hex,
+          data: {
+            domain,
+            types,
+            primaryType,
+            message: value,
+          },
+        });
+
+        return signature;
+      },
+      provider: null,
+    };
+  }
+
+  /**
+   * Create a viem WalletClient-like object for the MYX SDK.
+   * The SDK's auth() requires a walletClient parameter.
+   * We provide a minimal object that satisfies the SDK's usage.
+   *
+   * @returns WalletClient-like adapter object for the MYX SDK.
+   */
+  public createWalletClient(): {
+    account: { address: string };
+    chain: { id: number };
+    signTypedData: (args: {
+      domain: Record<string, unknown>;
+      types: Record<string, { name: string; type: string }[]>;
+      primaryType: string;
+      message: Record<string, unknown>;
+    }) => Promise<string>;
+  } {
+    const evmAccount = getSelectedEvmAccount(
+      this.#messenger.call(
+        'AccountTreeController:getAccountsFromSelectedAccountGroup',
+      ),
+    );
+    if (!evmAccount?.address) {
+      throw new Error(PERPS_ERROR_CODES.NO_ACCOUNT_SELECTED);
+    }
+    const chainId = getMYXChainId(this.#isTestnet ? 'testnet' : 'mainnet');
+
+    return {
+      account: { address: evmAccount.address },
+      chain: { id: chainId },
+      signTypedData: async (args): Promise<string> => {
+        const currentAccount = getSelectedEvmAccount(
+          this.#messenger.call(
+            'AccountTreeController:getAccountsFromSelectedAccountGroup',
+          ),
+        );
+        if (!currentAccount?.address) {
+          throw new Error(PERPS_ERROR_CODES.NO_ACCOUNT_SELECTED);
+        }
+
+        this.#deps.debugLogger.log(
+          'MYXWalletService: WalletClient signTypedData',
+          {
+            address: currentAccount.address,
+            primaryType: args.primaryType,
+          },
+        );
+
+        const signature = await this.#signTypedMessage({
+          from: currentAccount.address as Hex,
+          data: {
+            domain: args.domain,
+            types: args.types,
+            primaryType: args.primaryType,
+            message: args.message,
+          },
+        });
+
+        return signature;
+      },
+    };
+  }
+
+  public getUserAddress(): Hex {
+    const evmAccount = getSelectedEvmAccount(
+      this.#messenger.call(
+        'AccountTreeController:getAccountsFromSelectedAccountGroup',
+      ),
+    );
+    if (!evmAccount?.address) {
+      throw new Error(PERPS_ERROR_CODES.NO_ACCOUNT_SELECTED);
+    }
+    const address = evmAccount.address as Hex;
+    if (!isValidHexAddress(address)) {
+      throw new Error(PERPS_ERROR_CODES.INVALID_ADDRESS_FORMAT);
+    }
+    return address;
+  }
+
+  public async getCurrentAccountId(): Promise<CaipAccountId> {
+    const evmAccount = getSelectedEvmAccount(
+      this.#messenger.call(
+        'AccountTreeController:getAccountsFromSelectedAccountGroup',
+      ),
+    );
+    if (!evmAccount?.address) {
+      throw new Error(PERPS_ERROR_CODES.NO_ACCOUNT_SELECTED);
+    }
+    const chainId = this.#isTestnet
+      ? MYX_TESTNET_CHAIN_ID
+      : MYX_MAINNET_CHAIN_ID;
+    const caipAccountId: CaipAccountId = `eip155:${chainId}:${evmAccount.address}`;
+    return caipAccountId;
+  }
+
+  public getUserAddressFromAccountId(accountId: CaipAccountId): Hex {
+    const parsed = parseCaipAccountId(accountId);
+    const address = parsed.address as Hex;
+    if (!isValidHexAddress(address)) {
+      throw new Error(PERPS_ERROR_CODES.INVALID_ADDRESS_FORMAT);
+    }
+    return address;
+  }
+
+  public async getUserAddressWithDefault(
+    accountId?: CaipAccountId,
+  ): Promise<Hex> {
+    const id = accountId ?? (await this.getCurrentAccountId());
+    return this.getUserAddressFromAccountId(id);
+  }
+
+  public setTestnetMode(isTestnet: boolean): void {
+    this.#isTestnet = isTestnet;
+  }
+
+  public isTestnetMode(): boolean {
+    return this.#isTestnet;
+  }
+}
diff --git a/app/controllers/perps/services/RewardsIntegrationService.test.ts b/app/controllers/perps/services/RewardsIntegrationService.test.ts
index 4743bb20093f..c418c3c8c1e2 100644
--- a/app/controllers/perps/services/RewardsIntegrationService.test.ts
+++ b/app/controllers/perps/services/RewardsIntegrationService.test.ts
@@ -3,20 +3,48 @@ import {
   createMockInfrastructure,
   createMockMessenger,
 } from '../../../components/UI/Perps/__mocks__/serviceMocks';
-import type { PerpsControllerMessenger } from '../PerpsController';
 import type { PerpsPlatformDependencies } from '../types';
 
 import { RewardsIntegrationService } from './RewardsIntegrationService';
 
 describe('RewardsIntegrationService', () => {
-  let mockMessenger: jest.Mocked<PerpsControllerMessenger>;
   let mockDeps: jest.Mocked<PerpsPlatformDependencies>;
+  let mockMessenger: ReturnType<typeof createMockMessenger>;
   let service: RewardsIntegrationService;
   const mockEvmAccount = createMockEvmAccount();
 
+  /**
+   * Helper to set up mockMessenger.call with standard defaults,
+   * plus optional overrides for specific actions.
+   */
+  const setupMessengerDefaults = (overrides: Record<string, unknown> = {}) => {
+    (mockMessenger.call as jest.Mock).mockImplementation(
+      (action: string, ...args: unknown[]) => {
+        if (action in overrides) {
+          const val = overrides[action];
+          return typeof val === 'function'
+            ? (val as (...a: unknown[]) => unknown)(...args)
+            : val;
+        }
+        if (
+          action === 'AccountTreeController:getAccountsFromSelectedAccountGroup'
+        ) {
+          return [mockEvmAccount];
+        }
+        if (action === 'NetworkController:getState') {
+          return { selectedNetworkClientId: 'mainnet' };
+        }
+        if (action === 'NetworkController:getNetworkClientById') {
+          return { configuration: { chainId: '0x1' } };
+        }
+        return undefined;
+      },
+    );
+  };
+
   beforeEach(() => {
-    mockMessenger = createMockMessenger();
     mockDeps = createMockInfrastructure();
+    mockMessenger = createMockMessenger();
     service = new RewardsIntegrationService(mockDeps, mockMessenger);
 
     jest.clearAllMocks();
@@ -30,29 +58,15 @@ describe('RewardsIntegrationService', () => {
     it('calculates fee discount successfully with valid discount', async () => {
       const mockDiscountBips = 6500; // 65%
 
-      // Configure messenger to return expected values
-      (mockMessenger.call as jest.Mock).mockImplementation((action: string) => {
-        if (
-          action === 'AccountTreeController:getAccountsFromSelectedAccountGroup'
-        ) {
-          return [mockEvmAccount];
-        }
-        if (action === 'NetworkController:getState') {
-          return { selectedNetworkClientId: 'mainnet' };
-        }
-        if (action === 'NetworkController:getNetworkClientById') {
-          return { configuration: { chainId: '0x1' } };
-        }
-        return undefined;
-      });
-      (mockDeps.rewards.getFeeDiscount as jest.Mock).mockResolvedValue(
-        mockDiscountBips,
-      );
+      setupMessengerDefaults();
+      (
+        mockDeps.rewards.getPerpsDiscountForAccount as jest.Mock
+      ).mockResolvedValue(mockDiscountBips);
 
       const result = await service.calculateUserFeeDiscount();
 
       expect(result).toBe(6500);
-      expect(mockDeps.rewards.getFeeDiscount).toHaveBeenCalledWith(
+      expect(mockDeps.rewards.getPerpsDiscountForAccount).toHaveBeenCalledWith(
         expect.stringMatching(/^eip155:1:0x/),
       );
       expect(mockDeps.debugLogger.log).toHaveBeenCalledWith(
@@ -64,22 +78,11 @@ describe('RewardsIntegrationService', () => {
       );
     });
 
-    it('returns undefined when no discount available', async () => {
-      (mockMessenger.call as jest.Mock).mockImplementation((action: string) => {
-        if (
-          action === 'AccountTreeController:getAccountsFromSelectedAccountGroup'
-        ) {
-          return [mockEvmAccount];
-        }
-        if (action === 'NetworkController:getState') {
-          return { selectedNetworkClientId: 'mainnet' };
-        }
-        if (action === 'NetworkController:getNetworkClientById') {
-          return { configuration: { chainId: '0x1' } };
-        }
-        return undefined;
-      });
-      (mockDeps.rewards.getFeeDiscount as jest.Mock).mockResolvedValue(0);
+    it('returns 0 when no discount available', async () => {
+      setupMessengerDefaults();
+      (
+        mockDeps.rewards.getPerpsDiscountForAccount as jest.Mock
+      ).mockResolvedValue(0);
 
       const result = await service.calculateUserFeeDiscount();
 
@@ -87,13 +90,8 @@ describe('RewardsIntegrationService', () => {
     });
 
     it('returns undefined when no EVM account found', async () => {
-      (mockMessenger.call as jest.Mock).mockImplementation((action: string) => {
-        if (
-          action === 'AccountTreeController:getAccountsFromSelectedAccountGroup'
-        ) {
-          return [];
-        }
-        return undefined;
+      setupMessengerDefaults({
+        'AccountTreeController:getAccountsFromSelectedAccountGroup': [],
       });
 
       const result = await service.calculateUserFeeDiscount();
@@ -102,51 +100,33 @@ describe('RewardsIntegrationService', () => {
       expect(mockDeps.debugLogger.log).toHaveBeenCalledWith(
         'RewardsIntegrationService: No EVM account found for fee discount',
       );
-      expect(mockDeps.rewards.getFeeDiscount).not.toHaveBeenCalled();
+      expect(
+        mockDeps.rewards.getPerpsDiscountForAccount,
+      ).not.toHaveBeenCalled();
     });
 
     it('returns undefined when chain ID not found', async () => {
-      (mockMessenger.call as jest.Mock).mockImplementation((action: string) => {
-        if (
-          action === 'AccountTreeController:getAccountsFromSelectedAccountGroup'
-        ) {
-          return [mockEvmAccount];
-        }
-        if (action === 'NetworkController:getState') {
-          return { selectedNetworkClientId: 'mainnet' };
-        }
-        if (action === 'NetworkController:getNetworkClientById') {
+      setupMessengerDefaults({
+        'NetworkController:getNetworkClientById': () => {
           throw new Error('Network client not found');
-        }
-        return undefined;
+        },
       });
 
       const result = await service.calculateUserFeeDiscount();
 
       expect(result).toBeUndefined();
-      expect(mockDeps.rewards.getFeeDiscount).not.toHaveBeenCalled();
+      expect(
+        mockDeps.rewards.getPerpsDiscountForAccount,
+      ).not.toHaveBeenCalled();
     });
 
     it('returns undefined when getFeeDiscount throws error', async () => {
       const mockError = new Error('Rewards API error');
 
-      (mockMessenger.call as jest.Mock).mockImplementation((action: string) => {
-        if (
-          action === 'AccountTreeController:getAccountsFromSelectedAccountGroup'
-        ) {
-          return [mockEvmAccount];
-        }
-        if (action === 'NetworkController:getState') {
-          return { selectedNetworkClientId: 'mainnet' };
-        }
-        if (action === 'NetworkController:getNetworkClientById') {
-          return { configuration: { chainId: '0x1' } };
-        }
-        return undefined;
-      });
-      (mockDeps.rewards.getFeeDiscount as jest.Mock).mockRejectedValue(
-        mockError,
-      );
+      setupMessengerDefaults();
+      (
+        mockDeps.rewards.getPerpsDiscountForAccount as jest.Mock
+      ).mockRejectedValue(mockError);
 
       const result = await service.calculateUserFeeDiscount();
 
@@ -164,16 +144,10 @@ describe('RewardsIntegrationService', () => {
     it('returns undefined when NetworkController throws error', async () => {
       const mockError = new Error('Network error');
 
-      (mockMessenger.call as jest.Mock).mockImplementation((action: string) => {
-        if (
-          action === 'AccountTreeController:getAccountsFromSelectedAccountGroup'
-        ) {
-          return [mockEvmAccount];
-        }
-        if (action === 'NetworkController:getState') {
+      setupMessengerDefaults({
+        'NetworkController:getState': () => {
           throw mockError;
-        }
-        return undefined;
+        },
       });
 
       const result = await service.calculateUserFeeDiscount();
@@ -190,7 +164,6 @@ describe('RewardsIntegrationService', () => {
       ];
 
       for (const chain of chains) {
-        // Reset only specific mocks, keeping mockDeps intact
         jest.clearAllMocks();
         mockDeps = createMockInfrastructure();
         mockMessenger = createMockMessenger();
@@ -213,7 +186,9 @@ describe('RewardsIntegrationService', () => {
             return undefined;
           },
         );
-        (mockDeps.rewards.getFeeDiscount as jest.Mock).mockResolvedValue(5000);
+        (
+          mockDeps.rewards.getPerpsDiscountForAccount as jest.Mock
+        ).mockResolvedValue(5000);
 
         const result = await service.calculateUserFeeDiscount();
 
@@ -233,26 +208,10 @@ describe('RewardsIntegrationService', () => {
       for (const testCase of testCases) {
         jest.clearAllMocks();
 
-        (mockMessenger.call as jest.Mock).mockImplementation(
-          (action: string) => {
-            if (
-              action ===
-              'AccountTreeController:getAccountsFromSelectedAccountGroup'
-            ) {
-              return [mockEvmAccount];
-            }
-            if (action === 'NetworkController:getState') {
-              return { selectedNetworkClientId: 'mainnet' };
-            }
-            if (action === 'NetworkController:getNetworkClientById') {
-              return { configuration: { chainId: '0x1' } };
-            }
-            return undefined;
-          },
-        );
-        (mockDeps.rewards.getFeeDiscount as jest.Mock).mockResolvedValue(
-          testCase.bips,
-        );
+        setupMessengerDefaults();
+        (
+          mockDeps.rewards.getPerpsDiscountForAccount as jest.Mock
+        ).mockResolvedValue(testCase.bips);
 
         await service.calculateUserFeeDiscount();
 
@@ -273,7 +232,7 @@ describe('RewardsIntegrationService', () => {
       const mockMessenger2 = createMockMessenger();
       const service2 = new RewardsIntegrationService(mockDeps2, mockMessenger2);
 
-      // First service - mock messenger to return empty array (no EVM account)
+      // First service - no EVM account
       (mockMessenger.call as jest.Mock).mockImplementation((action: string) => {
         if (
           action === 'AccountTreeController:getAccountsFromSelectedAccountGroup'
@@ -284,7 +243,7 @@ describe('RewardsIntegrationService', () => {
       });
       await service.calculateUserFeeDiscount();
 
-      // Second service - uses same mock pattern
+      // Second service - no EVM account
       (mockMessenger2.call as jest.Mock).mockImplementation(
         (action: string) => {
           if (
diff --git a/app/controllers/perps/services/RewardsIntegrationService.ts b/app/controllers/perps/services/RewardsIntegrationService.ts
index 3754abed5a1d..ffd8eadbab28 100644
--- a/app/controllers/perps/services/RewardsIntegrationService.ts
+++ b/app/controllers/perps/services/RewardsIntegrationService.ts
@@ -1,6 +1,6 @@
 import { PERPS_CONSTANTS } from '../constants/perpsConfig';
-import type { PerpsControllerMessenger } from '../PerpsController';
 import type { PerpsPlatformDependencies } from '../types';
+import type { PerpsControllerMessengerBase } from '../types/messenger';
 import { getSelectedEvmAccount } from '../utils/accountUtils';
 import { ensureError } from '../utils/errorUtils';
 import { formatAccountToCaipAccountId } from '../utils/rewardsUtils';
@@ -11,30 +11,29 @@ import { formatAccountToCaipAccountId } from '../utils/rewardsUtils';
  * Handles rewards-related operations and fee discount calculations.
  * Stateless service that coordinates with RewardsController and NetworkController.
  *
- * Instance-based service with constructor injection of platform dependencies
- * and messenger for inter-controller communication.
+ * Instance-based service with constructor injection of platform dependencies.
  */
 export class RewardsIntegrationService {
   readonly #deps: PerpsPlatformDependencies;
 
-  readonly #messenger: PerpsControllerMessenger;
+  readonly #messenger: PerpsControllerMessengerBase;
 
   /**
    * Create a new RewardsIntegrationService instance
    *
    * @param deps - Platform dependencies for logging, metrics, etc.
-   * @param messenger - Messenger for inter-controller communication
+   * @param messenger - Controller messenger for cross-controller communication.
    */
   constructor(
     deps: PerpsPlatformDependencies,
-    messenger: PerpsControllerMessenger,
+    messenger: PerpsControllerMessengerBase,
   ) {
     this.#deps = deps;
     this.#messenger = messenger;
   }
 
   /**
-   * Get chain ID for a network client via messenger
+   * Get chain ID for a network client via DI network controller
    *
    * @param networkClientId - The network client identifier to look up.
    * @returns The chain ID string, or undefined if the network client is not found.
@@ -60,7 +59,11 @@ export class RewardsIntegrationService {
    */
   async calculateUserFeeDiscount(): Promise<number | undefined> {
     try {
-      const evmAccount = getSelectedEvmAccount(this.#messenger);
+      const evmAccount = getSelectedEvmAccount(
+        this.#messenger.call(
+          'AccountTreeController:getAccountsFromSelectedAccountGroup',
+        ),
+      );
 
       if (!evmAccount) {
         this.#deps.debugLogger.log(
@@ -69,7 +72,7 @@ export class RewardsIntegrationService {
         return undefined;
       }
 
-      // Get the chain ID using messenger
+      // Get the chain ID via DI network controller
       const networkState = this.#messenger.call('NetworkController:getState');
       const { selectedNetworkClientId } = networkState;
       const chainId = this.#getChainIdForNetwork(selectedNetworkClientId);
@@ -115,9 +118,9 @@ export class RewardsIntegrationService {
         return undefined;
       }
 
-      // Use rewards from deps (stays as DI - no messenger action in core)
+      // Use rewards via DI (no RewardsController in Core yet)
       const discountBips =
-        await this.#deps.rewards.getFeeDiscount(caipAccountId);
+        await this.#deps.rewards.getPerpsDiscountForAccount(caipAccountId);
 
       this.#deps.debugLogger.log(
         'RewardsIntegrationService: Fee discount calculated',
diff --git a/app/controllers/perps/services/ServiceContext.ts b/app/controllers/perps/services/ServiceContext.ts
index 1a0aa13ec2a2..a14cd024b93d 100644
--- a/app/controllers/perps/services/ServiceContext.ts
+++ b/app/controllers/perps/services/ServiceContext.ts
@@ -1,7 +1,4 @@
-import type {
-  PerpsControllerState,
-  PerpsControllerMessenger,
-} from '../PerpsController';
+import type { PerpsControllerState } from '../PerpsController';
 import type { Order, Position } from '../types';
 
 /**
@@ -56,13 +53,6 @@ export type ServiceContext = {
     getState: () => PerpsControllerState;
   };
 
-  /**
-   * Messenger for controller communication (optional)
-   * Required by: DataLakeService (getBearerToken)
-   * Note: TradingService now receives this via setControllerDependencies()
-   */
-  messenger?: PerpsControllerMessenger;
-
   /**
    * Query functions for dependent data
    * Required by: Operations that need to fetch related data
diff --git a/app/controllers/perps/types/index.ts b/app/controllers/perps/types/index.ts
index ca9c541810f5..3fb6e4efe1e2 100644
--- a/app/controllers/perps/types/index.ts
+++ b/app/controllers/perps/types/index.ts
@@ -310,6 +310,7 @@ export type ReadyToTradeResult = {
   error?: string;
   walletConnected?: boolean;
   networkSupported?: boolean;
+  authenticatedAddress?: string;
 };
 
 export type DisconnectResult = {
@@ -592,6 +593,23 @@ export type PerpsControllerConfig = {
    * The fallback is set by default if defined and replaced with remote feature flag once available.
    */
   fallbackHip3BlocklistMarkets?: string[];
+
+  /**
+   * MYX provider credentials.
+   * Passed from the init file where `process.env.X` is babel-transformed at build time.
+   */
+  myxAppIdTestnet?: string;
+  myxApiSecretTestnet?: string;
+  myxBrokerAddressTestnet?: string;
+  myxAppIdMainnet?: string;
+  myxApiSecretMainnet?: string;
+  myxBrokerAddressMainnet?: string;
+
+  /**
+   * Whether MYX provider is enabled via local env var (MM_PERPS_MYX_PROVIDER_ENABLED).
+   * Must match the UI selector logic so the controller and UI agree on MYX availability.
+   */
+  myxProviderEnabled?: boolean;
 };
 
 export type PriceUpdate = {
@@ -892,7 +910,7 @@ export type Order = {
 export type Funding = {
   symbol: string; // Asset symbol (e.g., 'ETH', 'BTC')
   amountUsd: string; // Funding amount in USD (positive = received, negative = paid)
-  rate: string; // Funding rate applied
+  rate?: string; // Funding rate applied (undefined when not available from provider)
   timestamp: number; // Funding payment timestamp
   transactionHash?: string; // Optional transaction hash
 };
@@ -1377,21 +1395,56 @@ export type PerpsTracer = {
 };
 
 // ============================================================================
-// Rewards Interface
+// Minimal local types for cross-controller DI (no external controller imports)
 // ============================================================================
 
 /**
- * Rewards controller operations required by Perps.
- * Provides fee discount capabilities for MetaMask rewards program.
+ * Minimal typed-message params passed to keyring for EIP-712 signing.
+ * Structurally matches KeyringController's TypedMessageParams.
  */
-export type PerpsRewardsOperations = {
-  /**
-   * Get fee discount for an account.
-   * Returns discount in basis points (e.g., 6500 = 65% discount)
-   */
-  getFeeDiscount(
-    caipAccountId: `${string}:${string}:${string}`,
-  ): Promise<number>;
+export type PerpsTypedMessageParams = {
+  from: string;
+  data: unknown;
+};
+
+/**
+ * Minimal transaction params passed to TransactionController.addTransaction.
+ * Only the fields PerpsController actually sets.
+ */
+export type PerpsTransactionParams = {
+  from: string;
+  to?: string;
+  value?: string;
+  data?: string;
+  gas?: string;
+};
+
+/**
+ * Options passed to TransactionController.addTransaction.
+ */
+export type PerpsAddTransactionOptions = {
+  networkClientId: string;
+  origin?: string;
+  type?: string;
+  skipInitialGasEstimate?: boolean;
+};
+
+/**
+ * Minimal account shape read from AccountTreeController.
+ * Only the fields PerpsController and its services actually use.
+ */
+export type PerpsInternalAccount = {
+  address: string;
+  type: string;
+  id: string;
+};
+
+/**
+ * Minimal remote feature flag state shape.
+ * Only the remoteFeatureFlags record is needed by PerpsController.
+ */
+export type PerpsRemoteFeatureFlagState = {
+  remoteFeatureFlags: Record<string, unknown>;
 };
 
 /**
@@ -1400,10 +1453,11 @@ export type PerpsRewardsOperations = {
  * Architecture:
  * - Observability: logger, debugLogger, metrics, performance, tracer
  * - Platform: streamManager (mobile/extension specific)
- * - Rewards: fee discount operations
  * - Cache: cache invalidation for standalone queries
+ * - Rewards: delegated rewards interaction (DI — no RewardsController in Core yet)
  *
- * Controller access uses messenger pattern (messenger.call()).
+ * Cross-controller communication uses the messenger pattern (messenger.call).
+ * Only rewards remains as DI because RewardsController is not yet in Core.
  */
 export type PerpsPlatformDependencies = {
   // === Observability (stateless utilities) ===
@@ -1416,9 +1470,6 @@ export type PerpsPlatformDependencies = {
   // === Platform Services (mobile/extension specific) ===
   streamManager: PerpsStreamManager;
 
-  // === Rewards (no standard messenger action in core) ===
-  rewards: PerpsRewardsOperations;
-
   // === Feature Flags (platform-specific version gating) ===
   featureFlags: {
     /**
@@ -1437,6 +1488,17 @@ export type PerpsPlatformDependencies = {
 
   // === Cache Invalidation (for standalone query caches) ===
   cacheInvalidator: PerpsCacheInvalidator;
+
+  // === Rewards (DI — no RewardsController in Core yet) ===
+  rewards: {
+    /**
+     * Get fee discount for an account from the RewardsController.
+     * Returns discount in basis points (e.g., 6500 = 65% discount)
+     */
+    getPerpsDiscountForAccount(
+      caipAccountId: `${string}:${string}:${string}`,
+    ): Promise<number>;
+  };
 };
 
 /**
diff --git a/app/controllers/perps/types/messenger.ts b/app/controllers/perps/types/messenger.ts
new file mode 100644
index 000000000000..182d030ca4c0
--- /dev/null
+++ b/app/controllers/perps/types/messenger.ts
@@ -0,0 +1,57 @@
+import type {
+  AccountTreeControllerGetAccountsFromSelectedAccountGroupAction,
+  AccountTreeControllerSelectedAccountGroupChangeEvent,
+} from '@metamask/account-tree-controller';
+import type {
+  KeyringControllerGetStateAction,
+  KeyringControllerSignTypedMessageAction,
+} from '@metamask/keyring-controller';
+import type { Messenger } from '@metamask/messenger';
+import type {
+  NetworkControllerGetStateAction,
+  NetworkControllerGetNetworkClientByIdAction,
+  NetworkControllerFindNetworkClientIdByChainIdAction,
+} from '@metamask/network-controller';
+import type { AuthenticationController } from '@metamask/profile-sync-controller';
+import type {
+  RemoteFeatureFlagControllerGetStateAction,
+  RemoteFeatureFlagControllerStateChangeEvent,
+} from '@metamask/remote-feature-flag-controller';
+import type { TransactionControllerAddTransactionAction } from '@metamask/transaction-controller';
+
+/**
+ * Actions from other controllers that PerpsController is allowed to call.
+ */
+export type PerpsControllerAllowedActions =
+  | NetworkControllerGetStateAction
+  | NetworkControllerGetNetworkClientByIdAction
+  | NetworkControllerFindNetworkClientIdByChainIdAction
+  | KeyringControllerGetStateAction
+  | KeyringControllerSignTypedMessageAction
+  | TransactionControllerAddTransactionAction
+  | RemoteFeatureFlagControllerGetStateAction
+  | AccountTreeControllerGetAccountsFromSelectedAccountGroupAction
+  | AuthenticationController.AuthenticationControllerGetBearerToken;
+
+/**
+ * Events from other controllers that PerpsController is allowed to subscribe to.
+ */
+export type PerpsControllerAllowedEvents =
+  | RemoteFeatureFlagControllerStateChangeEvent
+  | AccountTreeControllerSelectedAccountGroupChangeEvent;
+
+/**
+ * The messenger type used by PerpsController and its services.
+ * Defined here (rather than in PerpsController.ts) to avoid circular imports
+ * between the controller and service files.
+ *
+ * The first two type parameters (Actions, Events) are filled in by
+ * PerpsController.ts when it unions in its own actions/events.
+ * Services use this base type directly since they only need the allowed
+ * external actions/events.
+ */
+export type PerpsControllerMessengerBase = Messenger<
+  'PerpsController',
+  PerpsControllerAllowedActions,
+  PerpsControllerAllowedEvents
+>;
diff --git a/app/controllers/perps/types/myx-types.ts b/app/controllers/perps/types/myx-types.ts
index e0b6d3f5f3ed..e313f0bc7943 100644
--- a/app/controllers/perps/types/myx-types.ts
+++ b/app/controllers/perps/types/myx-types.ts
@@ -1,8 +1,8 @@
 /**
  * MYX Protocol Type Definitions
  *
- * Minimal types needed for Stage 1 (market display and price fetching).
- * Only defines what's needed - SDK types are re-exported with MYX prefix.
+ * SDK types re-exported with MYX prefix for consistency.
+ * Includes types for market display, positions, orders, and trading.
  */
 
 import type { CaipChainId } from '@metamask/utils';
@@ -14,6 +14,53 @@ import type { CaipChainId } from '@metamask/utils';
 export type { PoolSymbolAllResponse as MYXPoolSymbol } from '@myx-trade/sdk';
 export type { TickerDataItem as MYXTicker } from '@myx-trade/sdk';
 
+// Position & order types from SDK
+export type { PositionType as MYXPositionType } from '@myx-trade/sdk';
+export type { HistoryOrderItem as MYXHistoryOrderItem } from '@myx-trade/sdk';
+export type { PositionHistoryItem as MYXPositionHistoryItem } from '@myx-trade/sdk';
+export type { TradeFlowItem as MYXTradeFlowItem } from '@myx-trade/sdk';
+export type { KlineDataItemType as MYXKlineData } from '@myx-trade/sdk';
+// KlineData is declared but not exported by @myx-trade/sdk — define locally.
+// Property names match the SDK's wire format (single-char keys).
+export type MYXKlineWsData = {
+  // eslint-disable-next-line @typescript-eslint/naming-convention
+  E: number; // Timestamp
+  // eslint-disable-next-line @typescript-eslint/naming-convention
+  T: string; // Turnover
+  c: string; // Close price
+  h: string; // High price
+  l: string; // Low price
+  o: string; // Open price
+  t: number; // Timestamp
+  v: string; // Volume
+};
+export type { KlineDataResponse as MYXKlineDataResponse } from '@myx-trade/sdk';
+
+// SDK enums (re-exported as types since they're const objects in the SDK)
+export {
+  Direction as MYXDirection,
+  OrderType as MYXOrderType,
+  OperationType as MYXOperationType,
+  TriggerType as MYXTriggerType,
+  OrderStatus as MYXOrderStatus,
+  TimeInForce as MYXTimeInForce,
+} from '@myx-trade/sdk';
+
+// History enums
+export {
+  DirectionEnum as MYXDirectionEnum,
+  OrderTypeEnum as MYXOrderTypeEnum,
+  OperationEnum as MYXOperationEnum,
+  OrderStatusEnum as MYXOrderStatusEnum,
+  ExecTypeEnum as MYXExecTypeEnum,
+  TradeFlowTypeEnum as MYXTradeFlowTypeEnum,
+} from '@myx-trade/sdk';
+
+// Trading params types
+export type { PlaceOrderParams as MYXPlaceOrderParams } from '@myx-trade/sdk';
+export type { PositionTpSlOrderParams as MYXPositionTpSlOrderParams } from '@myx-trade/sdk';
+export type { GetHistoryOrdersParams as MYXGetHistoryOrdersParams } from '@myx-trade/sdk';
+
 // ============================================================================
 // Network Configuration Types
 // ============================================================================
@@ -78,6 +125,21 @@ export const MYX_HL_OVERLAPPING_MARKETS = [
 
 export type MYXOverlappingMarket = (typeof MYX_HL_OVERLAPPING_MARKETS)[number];
 
+// ============================================================================
+// Auth Configuration (passed from init file via babel-transformed env vars)
+// ============================================================================
+
+/**
+ * MYX auth credentials passed at construction time.
+ * Eliminates runtime `process.env` lookups — values come from the init file
+ * where `process.env.X` is babel-transformed at build time.
+ */
+export type MYXAuthConfig = {
+  appId: string;
+  apiSecret: string;
+  brokerAddress: string;
+};
+
 // ============================================================================
 // Client Service Types
 // ============================================================================
diff --git a/app/controllers/perps/utils/accountUtils.ts b/app/controllers/perps/utils/accountUtils.ts
index 2c9f2cd66659..377cdde6f1d8 100644
--- a/app/controllers/perps/utils/accountUtils.ts
+++ b/app/controllers/perps/utils/accountUtils.ts
@@ -2,16 +2,20 @@
  * Account utilities for Perps components
  * Handles account selection and EVM account filtering
  */
-import { isEvmAccountType } from '@metamask/keyring-api';
 import type { InternalAccount } from '@metamask/keyring-internal-api';
 
 import { PERPS_CONSTANTS } from '../constants/perpsConfig';
-import { PerpsControllerMessenger } from '../PerpsController';
-import type { AccountState } from '../types';
+import type { AccountState, PerpsInternalAccount } from '../types';
+
+const EVM_ACCOUNT_TYPES = new Set(['eip155:eoa', 'eip155:erc4337']);
+
+function isEvmAccountType(type: string): boolean {
+  return EVM_ACCOUNT_TYPES.has(type);
+}
 
 export function findEvmAccount(
-  accounts: InternalAccount[],
-): InternalAccount | null {
+  accounts: (InternalAccount | PerpsInternalAccount)[],
+): { address: string; type: string } | null {
   const evmAccount = accounts.find(
     (account) =>
       account && isEvmAccountType(account.type as InternalAccount['type']),
@@ -20,19 +24,16 @@ export function findEvmAccount(
 }
 
 export function getEvmAccountFromAccountGroup(
-  accounts: InternalAccount[],
+  accounts: (InternalAccount | PerpsInternalAccount)[],
 ): { address: string } | undefined {
   const evmAccount = findEvmAccount(accounts);
   return evmAccount ? { address: evmAccount.address } : undefined;
 }
 
 export function getSelectedEvmAccount(
-  messenger: PerpsControllerMessenger,
+  accounts: (InternalAccount | PerpsInternalAccount)[],
 ): { address: string } | undefined {
-  const accounts = messenger.call(
-    'AccountTreeController:getAccountsFromSelectedAccountGroup',
-  );
-  return getEvmAccountFromAccountGroup(accounts as InternalAccount[]);
+  return getEvmAccountFromAccountGroup(accounts);
 }
 
 export type ReturnOnEquityInput = {
diff --git a/app/controllers/perps/utils/myxAdapter.test.ts b/app/controllers/perps/utils/myxAdapter.test.ts
index 78af6244b239..c7ace150b9a0 100644
--- a/app/controllers/perps/utils/myxAdapter.test.ts
+++ b/app/controllers/perps/utils/myxAdapter.test.ts
@@ -1,8 +1,21 @@
 import BigNumber from 'bignumber.js';
 
-import { MYX_PRICE_DECIMALS } from '../constants/myxConfig';
+import {
+  MYX_PRICE_DECIMALS,
+  MYX_SIZE_DECIMALS,
+  MYX_PRICE_DECIMALS as PRICE_DEC,
+  MYX_COLLATERAL_DECIMALS,
+} from '../constants/myxConfig';
 import type { MarketDataFormatters } from '../types';
-import type { MYXPoolSymbol, MYXTicker } from '../types/myx-types';
+import type {
+  MYXPoolSymbol,
+  MYXTicker,
+  MYXPositionType,
+  MYXHistoryOrderItem,
+  MYXTradeFlowItem,
+  MYXKlineData,
+  MYXKlineWsData,
+} from '../types/myx-types';
 
 import {
   adaptMarketFromMYX,
@@ -13,7 +26,26 @@ import {
   buildPoolSymbolMap,
   buildSymbolPoolsMap,
   extractSymbolFromPoolId,
+  adaptPositionFromMYX,
+  adaptOrderFromMYX,
+  adaptAccountStateFromMYX,
+  adaptOrderFillFromMYX,
+  adaptFundingFromMYX,
+  adaptUserHistoryFromMYX,
+  adaptCandleFromMYX,
+  adaptCandleFromMYXWebSocket,
+  toMYXKlineResolution,
+  assertMYXSuccess,
 } from './myxAdapter';
+import {
+  MYXDirection,
+  MYXDirectionEnum,
+  MYXOperationEnum,
+  MYXOrderStatusEnum,
+  MYXOrderTypeEnum,
+  MYXExecTypeEnum,
+  MYXTradeFlowTypeEnum,
+} from '../types/myx-types';
 
 // Mock formatters matching the MarketDataFormatters interface
 const mockFormatters: MarketDataFormatters = {
@@ -211,4 +243,622 @@ describe('myxAdapter', () => {
       expect(extractSymbolFromPoolId('0xSomePool')).toBe('0xSomePool');
     });
   });
+
+  // ============================================================================
+  // Position Adapter
+  // ============================================================================
+
+  describe('adaptPositionFromMYX', () => {
+    function makePosition(
+      overrides: Partial<MYXPositionType> = {},
+    ): MYXPositionType {
+      return {
+        poolId: '0xpool1',
+        positionId: 'pos-1',
+        direction: MYXDirection.LONG,
+        entryPrice: new BigNumber(50000)
+          .times(new BigNumber(10).pow(PRICE_DEC))
+          .toFixed(0),
+        fundingRateIndex: '0',
+        size: new BigNumber(1)
+          .times(new BigNumber(10).pow(MYX_SIZE_DECIMALS))
+          .toFixed(0),
+        riskTier: 0,
+        collateralAmount: new BigNumber(5000)
+          .times(new BigNumber(10).pow(MYX_COLLATERAL_DECIMALS))
+          .toFixed(0),
+        txTime: 1700000000,
+        ...overrides,
+      };
+    }
+
+    const poolSymbolMap = new Map([['0xpool1', 'BTC']]);
+
+    it('adapts a long position with correct symbol, size, and leverage', () => {
+      const result = adaptPositionFromMYX(makePosition(), poolSymbolMap);
+
+      expect(result.symbol).toBe('BTC');
+      expect(Number(result.size)).toBeGreaterThan(0); // Long = positive
+      expect(Number(result.entryPrice)).toBe(50000);
+      expect(result.leverage.type).toBe('isolated');
+      expect(result.leverage.value).toBe(10); // 50000 * 1 / 5000 = 10x
+      expect(result.providerId).toBe('myx');
+    });
+
+    it('adapts a short position with negative size', () => {
+      const result = adaptPositionFromMYX(
+        makePosition({ direction: MYXDirection.SHORT }),
+        poolSymbolMap,
+      );
+
+      expect(Number(result.size)).toBeLessThan(0);
+    });
+
+    it('falls back to poolId when symbol not in map', () => {
+      const emptyMap = new Map<string, string>();
+      const result = adaptPositionFromMYX(makePosition(), emptyMap);
+
+      expect(result.symbol).toBe('0xpool1');
+    });
+
+    it('uses leverage 1 when collateral is zero', () => {
+      const result = adaptPositionFromMYX(
+        makePosition({ collateralAmount: '0' }),
+        poolSymbolMap,
+      );
+
+      expect(result.leverage.value).toBe(1);
+    });
+  });
+
+  // ============================================================================
+  // Order Adapter
+  // ============================================================================
+
+  describe('adaptOrderFromMYX', () => {
+    function makeHistoryOrder(
+      overrides: Partial<MYXHistoryOrderItem> = {},
+    ): MYXHistoryOrderItem {
+      return {
+        chainId: 56,
+        poolId: '0xpool1',
+        orderId: 42,
+        txTime: 1700000000,
+        txHash: 0xabc as unknown as number,
+        orderType: MYXOrderTypeEnum.Market,
+        operation: MYXOperationEnum.Increase,
+        triggerType: 0 as MYXHistoryOrderItem['triggerType'],
+        direction: MYXDirectionEnum.Long,
+        size: new BigNumber(2)
+          .times(new BigNumber(10).pow(MYX_SIZE_DECIMALS))
+          .toFixed(0),
+        filledSize: new BigNumber(2)
+          .times(new BigNumber(10).pow(MYX_SIZE_DECIMALS))
+          .toFixed(0),
+        filledAmount: '0',
+        price: new BigNumber(60000)
+          .times(new BigNumber(10).pow(PRICE_DEC))
+          .toFixed(0),
+        lastPrice: '0',
+        orderStatus: MYXOrderStatusEnum.Successful,
+        execType: MYXExecTypeEnum.Market,
+        slippagePct: 0,
+        executionFeeToken: '0x0' as MYXHistoryOrderItem['executionFeeToken'],
+        executionFeeAmount: '0',
+        tradingFee: '0',
+        fundingFee: '0',
+        realizedPnl: '0',
+        baseSymbol: 'BTC',
+        quoteSymbol: 'USDT',
+        userLeverage: 10,
+        ...overrides,
+      };
+    }
+
+    const poolSymbolMap = new Map([['0xpool1', 'BTC']]);
+
+    it('maps a filled long market order correctly', () => {
+      const result = adaptOrderFromMYX(makeHistoryOrder(), poolSymbolMap);
+
+      expect(result.orderId).toBe('42');
+      expect(result.symbol).toBe('BTC');
+      expect(result.side).toBe('buy');
+      expect(result.orderType).toBe('market');
+      expect(result.status).toBe('filled');
+      expect(result.isTrigger).toBe(false);
+      expect(result.providerId).toBe('myx');
+    });
+
+    it('maps a short limit order as sell', () => {
+      const result = adaptOrderFromMYX(
+        makeHistoryOrder({
+          direction: MYXDirectionEnum.Short,
+          orderType: MYXOrderTypeEnum.Limit,
+          orderStatus: MYXOrderStatusEnum.Cancelled,
+        }),
+        poolSymbolMap,
+      );
+
+      expect(result.side).toBe('sell');
+      expect(result.orderType).toBe('limit');
+      expect(result.status).toBe('canceled');
+    });
+
+    it('maps expired status to canceled', () => {
+      const result = adaptOrderFromMYX(
+        makeHistoryOrder({ orderStatus: MYXOrderStatusEnum.Expired }),
+        poolSymbolMap,
+      );
+
+      expect(result.status).toBe('canceled');
+    });
+
+    it('maps unknown status to open', () => {
+      const result = adaptOrderFromMYX(
+        makeHistoryOrder({ orderStatus: 99 as MYXOrderStatusEnum }),
+        poolSymbolMap,
+      );
+
+      expect(result.status).toBe('open');
+    });
+
+    it('detects TP trigger order', () => {
+      const result = adaptOrderFromMYX(
+        makeHistoryOrder({ execType: MYXExecTypeEnum.TP }),
+        poolSymbolMap,
+      );
+
+      expect(result.isTrigger).toBe(true);
+      expect(result.detailedOrderType).toBe('Take Profit');
+    });
+
+    it('detects SL trigger order', () => {
+      const result = adaptOrderFromMYX(
+        makeHistoryOrder({ execType: MYXExecTypeEnum.SL }),
+        poolSymbolMap,
+      );
+
+      expect(result.isTrigger).toBe(true);
+      expect(result.detailedOrderType).toBe('Stop Loss');
+    });
+
+    it('detects liquidation order', () => {
+      const result = adaptOrderFromMYX(
+        makeHistoryOrder({ execType: MYXExecTypeEnum.Liquidation }),
+        poolSymbolMap,
+      );
+
+      expect(result.detailedOrderType).toBe('Liquidation');
+    });
+
+    it('sets reduceOnly for decrease operations', () => {
+      const result = adaptOrderFromMYX(
+        makeHistoryOrder({ operation: MYXOperationEnum.Decrease }),
+        poolSymbolMap,
+      );
+
+      expect(result.reduceOnly).toBe(true);
+    });
+
+    it('falls back to poolSymbolMap then poolId for symbol', () => {
+      const result = adaptOrderFromMYX(
+        makeHistoryOrder({ baseSymbol: undefined as unknown as string }),
+        poolSymbolMap,
+      );
+      expect(result.symbol).toBe('BTC');
+
+      const emptyMap = new Map<string, string>();
+      const result2 = adaptOrderFromMYX(
+        makeHistoryOrder({ baseSymbol: undefined as unknown as string }),
+        emptyMap,
+      );
+      expect(result2.symbol).toBe('0xpool1');
+    });
+  });
+
+  // ============================================================================
+  // Account State Adapter
+  // ============================================================================
+
+  describe('adaptAccountStateFromMYX', () => {
+    it('computes balances from account info and wallet balance', () => {
+      const accountInfo = {
+        totalCollateral: new BigNumber(1000)
+          .times(new BigNumber(10).pow(MYX_COLLATERAL_DECIMALS))
+          .toFixed(0),
+        unrealizedPnl: new BigNumber(50)
+          .times(new BigNumber(10).pow(MYX_COLLATERAL_DECIMALS))
+          .toFixed(0),
+      };
+      const walletBalance = new BigNumber(500)
+        .times(new BigNumber(10).pow(MYX_COLLATERAL_DECIMALS))
+        .toFixed(0);
+
+      const result = adaptAccountStateFromMYX(accountInfo, walletBalance);
+
+      expect(Number(result.marginUsed)).toBe(1000);
+      expect(Number(result.unrealizedPnl)).toBe(50);
+      expect(Number(result.availableBalance)).toBe(500);
+      // totalBalance = balance + marginUsed + unrealizedPnl = 500 + 1000 + 50
+      expect(Number(result.totalBalance)).toBe(1550);
+    });
+
+    it('returns zeros when accountInfo is undefined', () => {
+      const result = adaptAccountStateFromMYX(undefined);
+
+      expect(Number(result.marginUsed)).toBe(0);
+      expect(Number(result.unrealizedPnl)).toBe(0);
+      expect(Number(result.totalBalance)).toBe(0);
+      expect(Number(result.availableBalance)).toBe(0);
+    });
+
+    it('returns zeros when walletBalance is undefined', () => {
+      const result = adaptAccountStateFromMYX(undefined, undefined);
+
+      expect(Number(result.availableBalance)).toBe(0);
+    });
+  });
+
+  // ============================================================================
+  // Order Fill Adapter
+  // ============================================================================
+
+  describe('adaptOrderFillFromMYX', () => {
+    function makeHistoryOrder(
+      overrides: Partial<MYXHistoryOrderItem> = {},
+    ): MYXHistoryOrderItem {
+      return {
+        chainId: 56,
+        poolId: '0xpool1',
+        orderId: 99,
+        txTime: 1700000000,
+        txHash: 0xdef as unknown as number,
+        orderType: MYXOrderTypeEnum.Market,
+        operation: MYXOperationEnum.Increase,
+        triggerType: 0 as MYXHistoryOrderItem['triggerType'],
+        direction: MYXDirectionEnum.Long,
+        size: new BigNumber(3)
+          .times(new BigNumber(10).pow(MYX_SIZE_DECIMALS))
+          .toFixed(0),
+        filledSize: new BigNumber(3)
+          .times(new BigNumber(10).pow(MYX_SIZE_DECIMALS))
+          .toFixed(0),
+        filledAmount: '0',
+        price: new BigNumber(45000)
+          .times(new BigNumber(10).pow(PRICE_DEC))
+          .toFixed(0),
+        lastPrice: new BigNumber(45100)
+          .times(new BigNumber(10).pow(PRICE_DEC))
+          .toFixed(0),
+        orderStatus: MYXOrderStatusEnum.Successful,
+        execType: MYXExecTypeEnum.Market,
+        slippagePct: 0,
+        executionFeeToken: '0x0' as MYXHistoryOrderItem['executionFeeToken'],
+        executionFeeAmount: '0',
+        tradingFee: new BigNumber(5)
+          .times(new BigNumber(10).pow(MYX_COLLATERAL_DECIMALS))
+          .toFixed(0),
+        fundingFee: '0',
+        realizedPnl: new BigNumber(100)
+          .times(new BigNumber(10).pow(MYX_COLLATERAL_DECIMALS))
+          .toFixed(0),
+        baseSymbol: 'BTC',
+        quoteSymbol: 'USDT',
+        userLeverage: 10,
+        ...overrides,
+      };
+    }
+
+    const poolSymbolMap = new Map([['0xpool1', 'BTC']]);
+
+    it('adapts a filled order to OrderFill with correct fields', () => {
+      const result = adaptOrderFillFromMYX(makeHistoryOrder(), poolSymbolMap);
+
+      expect(result.orderId).toBe('99');
+      expect(result.symbol).toBe('BTC');
+      expect(result.side).toBe('buy');
+      expect(Number(result.size)).toBe(3);
+      expect(Number(result.price)).toBe(45100); // Uses lastPrice
+      expect(Number(result.fee)).toBe(5);
+      expect(Number(result.pnl)).toBe(100);
+      expect(result.feeToken).toBe('USDT');
+      expect(result.success).toBe(true);
+      expect(result.orderType).toBe('regular');
+      expect(result.providerId).toBe('myx');
+    });
+
+    it('uses size as fallback when filledSize is empty', () => {
+      const result = adaptOrderFillFromMYX(
+        makeHistoryOrder({ filledSize: '' }),
+        poolSymbolMap,
+      );
+
+      expect(Number(result.size)).toBe(3); // Falls back to size
+    });
+
+    it('uses price as fallback when lastPrice is empty', () => {
+      const result = adaptOrderFillFromMYX(
+        makeHistoryOrder({ lastPrice: '' }),
+        poolSymbolMap,
+      );
+
+      expect(Number(result.price)).toBe(45000); // Falls back to price
+    });
+
+    it('maps TP exec type to take_profit', () => {
+      const result = adaptOrderFillFromMYX(
+        makeHistoryOrder({ execType: MYXExecTypeEnum.TP }),
+        poolSymbolMap,
+      );
+
+      expect(result.orderType).toBe('take_profit');
+    });
+
+    it('maps SL exec type to stop_loss', () => {
+      const result = adaptOrderFillFromMYX(
+        makeHistoryOrder({ execType: MYXExecTypeEnum.SL }),
+        poolSymbolMap,
+      );
+
+      expect(result.orderType).toBe('stop_loss');
+    });
+
+    it('maps Liquidation exec type', () => {
+      const result = adaptOrderFillFromMYX(
+        makeHistoryOrder({ execType: MYXExecTypeEnum.Liquidation }),
+        poolSymbolMap,
+      );
+
+      expect(result.orderType).toBe('liquidation');
+    });
+
+    it('marks unsuccessful orders', () => {
+      const result = adaptOrderFillFromMYX(
+        makeHistoryOrder({ orderStatus: MYXOrderStatusEnum.Cancelled }),
+        poolSymbolMap,
+      );
+
+      expect(result.success).toBe(false);
+    });
+  });
+
+  // ============================================================================
+  // Funding Adapter
+  // ============================================================================
+
+  describe('adaptFundingFromMYX', () => {
+    function makeFlowItem(
+      overrides: Partial<MYXTradeFlowItem> = {},
+    ): MYXTradeFlowItem {
+      return {
+        chainId: 56,
+        orderId: 1,
+        user: '0xuser' as MYXTradeFlowItem['user'],
+        poolId: '0xpool1',
+        fundingFee: new BigNumber(10)
+          .times(new BigNumber(10).pow(MYX_COLLATERAL_DECIMALS))
+          .toFixed(0),
+        tradingFee: '0',
+        charge: '0',
+        collateralAmount: '0',
+        collateralBase: '0',
+        txHash: '0xhash',
+        txTime: 1700000000,
+        type: MYXTradeFlowTypeEnum.Increase,
+        accountType: 1 as MYXTradeFlowItem['accountType'],
+        executionFee: '0',
+        seamlessFee: '0',
+        seamlessFeeSymbol: '',
+        basePnl: '0',
+        quotePnl: '0',
+        referrerRebate: '0',
+        referralRebate: '0',
+        rebateClaimedAmount: '0',
+        ...overrides,
+      };
+    }
+
+    const poolSymbolMap = new Map([['0xpool1', 'BTC']]);
+
+    it('adapts flows with non-zero funding fees', () => {
+      const result = adaptFundingFromMYX([makeFlowItem()], poolSymbolMap);
+
+      expect(result).toHaveLength(1);
+      expect(result[0].symbol).toBe('BTC');
+      expect(Number(result[0].amountUsd)).toBe(10);
+      expect(result[0].transactionHash).toBe('0xhash');
+    });
+
+    it('filters out flows with zero or empty funding fees', () => {
+      const flows = [
+        makeFlowItem({ fundingFee: '0' }),
+        makeFlowItem({ fundingFee: '' }),
+      ];
+
+      const result = adaptFundingFromMYX(flows, poolSymbolMap);
+
+      expect(result).toHaveLength(0);
+    });
+
+    it('falls back to poolId when symbol not in map', () => {
+      const emptyMap = new Map<string, string>();
+      const result = adaptFundingFromMYX([makeFlowItem()], emptyMap);
+
+      expect(result[0].symbol).toBe('0xpool1');
+    });
+  });
+
+  // ============================================================================
+  // User History Adapter
+  // ============================================================================
+
+  describe('adaptUserHistoryFromMYX', () => {
+    function makeFlowItem(
+      overrides: Partial<MYXTradeFlowItem> = {},
+    ): MYXTradeFlowItem {
+      return {
+        chainId: 56,
+        orderId: 1,
+        user: '0xuser' as MYXTradeFlowItem['user'],
+        poolId: '0xpool1',
+        fundingFee: '0',
+        tradingFee: '0',
+        charge: '0',
+        collateralAmount: new BigNumber(200)
+          .times(new BigNumber(10).pow(MYX_COLLATERAL_DECIMALS))
+          .toFixed(0),
+        collateralBase: '0',
+        txHash: '0xhash',
+        txTime: 1700000000,
+        type: MYXTradeFlowTypeEnum.MarginAccountDeposit,
+        accountType: 1 as MYXTradeFlowItem['accountType'],
+        executionFee: '0',
+        seamlessFee: '0',
+        seamlessFeeSymbol: '',
+        basePnl: '0',
+        quotePnl: '0',
+        referrerRebate: '0',
+        referralRebate: '0',
+        rebateClaimedAmount: '0',
+        ...overrides,
+      };
+    }
+
+    it('adapts deposit flows', () => {
+      const result = adaptUserHistoryFromMYX([makeFlowItem()]);
+
+      expect(result).toHaveLength(1);
+      expect(result[0].type).toBe('deposit');
+      expect(Number(result[0].amount)).toBe(200);
+      expect(result[0].asset).toBe('USDT');
+      expect(result[0].status).toBe('completed');
+    });
+
+    it('adapts withdrawal flows', () => {
+      const result = adaptUserHistoryFromMYX([
+        makeFlowItem({ type: MYXTradeFlowTypeEnum.TransferToWallet }),
+      ]);
+
+      expect(result).toHaveLength(1);
+      expect(result[0].type).toBe('withdrawal');
+    });
+
+    it('filters out non-deposit/withdrawal flow types', () => {
+      const result = adaptUserHistoryFromMYX([
+        makeFlowItem({ type: MYXTradeFlowTypeEnum.Increase }),
+        makeFlowItem({ type: MYXTradeFlowTypeEnum.Decrease }),
+        makeFlowItem({ type: MYXTradeFlowTypeEnum.Liquidation }),
+      ]);
+
+      expect(result).toHaveLength(0);
+    });
+  });
+
+  // ============================================================================
+  // Candle Adapters
+  // ============================================================================
+
+  describe('adaptCandleFromMYX', () => {
+    it('maps REST kline fields to CandleStick', () => {
+      const kline: MYXKlineData = {
+        time: 1700000000,
+        open: '50000',
+        close: '51000',
+        high: '52000',
+        low: '49000',
+      };
+
+      const result = adaptCandleFromMYX(kline);
+
+      expect(result.time).toBe(1700000000);
+      expect(result.open).toBe('50000');
+      expect(result.close).toBe('51000');
+      expect(result.high).toBe('52000');
+      expect(result.low).toBe('49000');
+      expect(result.volume).toBe('0');
+    });
+  });
+
+  describe('adaptCandleFromMYXWebSocket', () => {
+    it('maps WS single-letter fields to CandleStick', () => {
+      const wsData: MYXKlineWsData = {
+        E: 1700000000,
+        T: '100',
+        t: 1700000000,
+        o: '50000',
+        h: '52000',
+        l: '49000',
+        c: '51000',
+        v: '1500',
+      };
+
+      const result = adaptCandleFromMYXWebSocket(wsData);
+
+      expect(result.time).toBe(1700000000);
+      expect(result.open).toBe('50000');
+      expect(result.high).toBe('52000');
+      expect(result.low).toBe('49000');
+      expect(result.close).toBe('51000');
+      expect(result.volume).toBe('1500');
+    });
+  });
+
+  // ============================================================================
+  // Resolution Mapper
+  // ============================================================================
+
+  describe('toMYXKlineResolution', () => {
+    it.each([
+      ['1m', '1m'],
+      ['5m', '5m'],
+      ['15m', '15m'],
+      ['1h', '1h'],
+      ['4h', '4h'],
+      ['1d', '1d'],
+      ['1w', '1w'],
+      ['1M', '1M'],
+    ] as const)('maps %s to %s', (input, expected) => {
+      expect(toMYXKlineResolution(input)).toBe(expected);
+    });
+
+    it.each([
+      ['3m', '5m'],
+      ['2h', '4h'],
+      ['8h', '4h'],
+      ['12h', '1d'],
+      ['3d', '1w'],
+    ] as const)('maps unsupported %s to nearest %s', (input, expected) => {
+      expect(toMYXKlineResolution(input)).toBe(expected);
+    });
+
+    it('defaults unknown periods to 1h', () => {
+      expect(toMYXKlineResolution('99x')).toBe('1h');
+    });
+  });
+
+  // ============================================================================
+  // Response Validation
+  // ============================================================================
+
+  describe('assertMYXSuccess', () => {
+    it('does not throw for code 9200', () => {
+      expect(() => assertMYXSuccess({ code: 9200 }, 'test')).not.toThrow();
+    });
+
+    it('does not throw for code 0', () => {
+      expect(() => assertMYXSuccess({ code: 0 }, 'test')).not.toThrow();
+    });
+
+    it('throws for non-success code', () => {
+      expect(() =>
+        assertMYXSuccess({ code: 500, message: 'Server Error' }, 'fetch'),
+      ).toThrow('MYX fetch failed: code=500 message=Server Error');
+    });
+
+    it('includes "unknown" when message is null', () => {
+      expect(() =>
+        assertMYXSuccess({ code: 400, message: null }, 'auth'),
+      ).toThrow('MYX auth failed: code=400 message=unknown');
+    });
+  });
 });
diff --git a/app/controllers/perps/utils/myxAdapter.ts b/app/controllers/perps/utils/myxAdapter.ts
index 698467c37cc1..aaeee8a92fde 100644
--- a/app/controllers/perps/utils/myxAdapter.ts
+++ b/app/controllers/perps/utils/myxAdapter.ts
@@ -1,27 +1,57 @@
 /**
  * MYX SDK Adapter Utilities
  *
- * Stage 1 adapters for transforming between MetaMask Perps API types and MYX SDK types.
- * Only includes adapters needed for market display and price fetching.
+ * Adapters for transforming between MetaMask Perps API types and MYX SDK types.
+ * Includes adapters for market display, positions, orders, account state, and fills.
  *
  * Portable: no mobile-specific imports.
  * Formatters are injected via MarketDataFormatters interface (same pattern as marketDataTransform.ts).
  *
  * Key differences from HyperLiquid:
- * - Prices use 30 decimals
+ * - API prices are normal floats (SDK contract layer uses 30 decimals internally)
  * - Sizes use 18 decimals (vs HyperLiquid's szDecimals per asset)
  * - Multiple pools can exist per symbol (MPM model)
  * - USDT collateral (vs USDC)
  */
 
-import { fromMYXPrice } from '../constants/myxConfig';
+import {
+  fromMYXPrice,
+  fromMYXSize,
+  fromMYXCollateral,
+  MYX_MAX_LEVERAGE,
+  MYX_MINIMUM_ORDER_SIZE_USD,
+} from '../constants/myxConfig';
 import type {
+  AccountState,
+  CandleStick,
+  Funding,
   MarketInfo,
+  Order,
+  OrderFill,
   PerpsMarketData,
+  Position,
   MarketDataFormatters,
+  UserHistoryItem,
 } from '../types';
-import { MYX_HL_OVERLAPPING_MARKETS } from '../types/myx-types';
-import type { MYXPoolSymbol, MYXTicker } from '../types/myx-types';
+import {
+  MYX_HL_OVERLAPPING_MARKETS,
+  MYXDirection,
+  MYXDirectionEnum,
+  MYXOperationEnum,
+  MYXOrderStatusEnum,
+  MYXOrderTypeEnum,
+  MYXExecTypeEnum,
+  MYXTradeFlowTypeEnum,
+} from '../types/myx-types';
+import type {
+  MYXPoolSymbol,
+  MYXTicker,
+  MYXPositionType,
+  MYXHistoryOrderItem,
+  MYXTradeFlowItem,
+  MYXKlineData,
+  MYXKlineWsData,
+} from '../types/myx-types';
 
 /**
  * Format a price change value with sign prefix.
@@ -67,16 +97,12 @@ export function adaptMarketFromMYX(pool: MYXPoolSymbol): MarketInfo {
   // MYX uses fixed 18 decimals for sizes
   const szDecimals = 18;
 
-  // Default max leverage - MYX supports up to 100x on most markets
-  // Will be refined when pool level config is fetched
-  const maxLeverage = 100;
-
   return {
     name: symbol,
     szDecimals,
-    maxLeverage,
+    maxLeverage: MYX_MAX_LEVERAGE,
     marginTableId: 0, // MYX doesn't use margin tables like HyperLiquid
-    minimumOrderSize: 10, // MYX minimum order size is $10
+    minimumOrderSize: MYX_MINIMUM_ORDER_SIZE_USD,
     providerId: 'myx',
   };
 }
@@ -91,7 +117,7 @@ export function adaptPriceFromMYX(ticker: MYXTicker): {
   price: string;
   change24h: number;
 } {
-  // MYX ticker prices are in 30-decimal format
+  // MYX API returns normal float strings (e.g. "64854.76")
   const priceNum = fromMYXPrice(ticker.price);
 
   // Change is provided as a percentage string (e.g., "2.5" means 2.5%)
@@ -142,7 +168,7 @@ export function adaptMarketDataFromMYX(
   return {
     symbol,
     name: getTokenName(symbol),
-    maxLeverage: '100x', // MYX default
+    maxLeverage: `${MYX_MAX_LEVERAGE}x`,
     price: formattedPrice,
     change24h: formattedChange,
     change24hPercent: formattedChangePercent,
@@ -228,15 +254,19 @@ export function buildSymbolPoolsMap(
 
 /**
  * Extract symbol from pool ID
- * Pool IDs typically contain the symbol as a suffix or can be parsed
+ * Pool IDs typically contain the symbol as a suffix or can be parsed.
+ * When baseSymbol is unavailable, returns a truncated address for UI display.
  *
  * @param poolId - MYX pool ID string
- * @returns Extracted symbol or poolId as fallback
+ * @returns Extracted symbol or truncated poolId as fallback
  */
 export function extractSymbolFromPoolId(poolId: string): string {
-  // Pool IDs in MYX typically look like "0x..." hex addresses
+  // Pool IDs in MYX are hex addresses ("0x...")
   // The actual symbol comes from the pool's baseSymbol field
-  // This is a fallback when baseSymbol is not available
+  // Truncate hex addresses so they're UI-friendly
+  if (poolId.startsWith('0x') && poolId.length > 10) {
+    return `${poolId.slice(0, 6)}...${poolId.slice(-4)}`;
+  }
   return poolId;
 }
 
@@ -262,3 +292,401 @@ function getTokenName(symbol: string): string {
 
   return tokenNames[symbol] || symbol;
 }
+
+// ============================================================================
+// Position Adapter
+// ============================================================================
+
+/**
+ * Adapt MYX SDK PositionType to MetaMask Position
+ *
+ * @param pos - MYX position from SDK
+ * @param poolSymbolMap - Map of poolId to symbol
+ * @returns MetaMask Position object
+ */
+export function adaptPositionFromMYX(
+  pos: MYXPositionType,
+  poolSymbolMap: Map<string, string>,
+): Position {
+  const symbol = poolSymbolMap.get(pos.poolId) ?? pos.poolId;
+  const sizeNum = fromMYXSize(pos.size);
+  const entryPriceNum = fromMYXPrice(pos.entryPrice);
+  const collateralNum = fromMYXCollateral(pos.collateralAmount);
+
+  // Direction: 0 = LONG (positive size), 1 = SHORT (negative size)
+  const isLong = pos.direction === MYXDirection.LONG;
+  const signedSize = isLong ? sizeNum : -sizeNum;
+
+  // Position value = size * entry price
+  const positionValue = Math.abs(sizeNum * entryPriceNum);
+
+  // Leverage = position value / collateral (approximate)
+  const leverage = collateralNum > 0 ? positionValue / collateralNum : 1;
+
+  return {
+    symbol,
+    size: signedSize.toString(),
+    entryPrice: entryPriceNum.toString(),
+    positionValue: positionValue.toString(),
+    unrealizedPnl: '0', // Requires mark price - will be enriched by WS or separate call
+    marginUsed: collateralNum.toString(),
+    leverage: {
+      type: 'isolated',
+      value: Math.round(leverage),
+      rawUsd: collateralNum.toString(),
+    },
+    liquidationPrice: null, // Requires separate calculation
+    maxLeverage: MYX_MAX_LEVERAGE,
+    returnOnEquity: '0',
+    cumulativeFunding: {
+      allTime: '0',
+      sinceOpen: '0',
+      sinceChange: '0',
+    },
+    takeProfitPrice: undefined,
+    stopLossPrice: undefined,
+    takeProfitCount: 0,
+    stopLossCount: 0,
+    providerId: 'myx',
+  };
+}
+
+// ============================================================================
+// Order Adapter
+// ============================================================================
+
+/**
+ * Adapt MYX SDK open order (PositionType-shaped from getOrders) to MetaMask Order.
+ * Note: getOrders returns PositionType[] per the SDK types.
+ * For richer order data, use getOrderHistory.
+ *
+ * @param historyOrder - MYX history order item
+ * @param poolSymbolMap - Map of poolId to symbol
+ * @returns MetaMask Order object
+ */
+export function adaptOrderFromMYX(
+  historyOrder: MYXHistoryOrderItem,
+  poolSymbolMap: Map<string, string>,
+): Order {
+  const symbol =
+    historyOrder.baseSymbol ??
+    poolSymbolMap.get(historyOrder.poolId) ??
+    historyOrder.poolId;
+
+  const priceNum = fromMYXPrice(historyOrder.price);
+  const sizeNum = fromMYXSize(historyOrder.size);
+  const filledSizeNum = fromMYXSize(historyOrder.filledSize);
+  const remainingSize = Math.max(0, sizeNum - filledSizeNum);
+
+  // Map direction
+  const side: 'buy' | 'sell' =
+    historyOrder.direction === MYXDirectionEnum.Long ? 'buy' : 'sell';
+
+  // Map order type
+  let orderType: 'market' | 'limit' = 'market';
+  if (historyOrder.orderType === MYXOrderTypeEnum.Limit) {
+    orderType = 'limit';
+  }
+
+  // Map status
+  let status: Order['status'] = 'open';
+  switch (historyOrder.orderStatus) {
+    case MYXOrderStatusEnum.Successful:
+      status = 'filled';
+      break;
+    case MYXOrderStatusEnum.Cancelled:
+      status = 'canceled';
+      break;
+    case MYXOrderStatusEnum.Expired:
+      status = 'canceled';
+      break;
+    default:
+      status = 'open';
+  }
+
+  // Detect trigger orders
+  const isTrigger =
+    historyOrder.execType === MYXExecTypeEnum.TP ||
+    historyOrder.execType === MYXExecTypeEnum.SL;
+  let detailedOrderType: string | undefined;
+  if (historyOrder.execType === MYXExecTypeEnum.TP) {
+    detailedOrderType = 'Take Profit';
+  } else if (historyOrder.execType === MYXExecTypeEnum.SL) {
+    detailedOrderType = 'Stop Loss';
+  } else if (historyOrder.execType === MYXExecTypeEnum.Liquidation) {
+    detailedOrderType = 'Liquidation';
+  }
+
+  return {
+    orderId: String(historyOrder.orderId),
+    symbol,
+    side,
+    orderType,
+    size: sizeNum.toString(),
+    originalSize: sizeNum.toString(),
+    price: priceNum.toString(),
+    filledSize: filledSizeNum.toString(),
+    remainingSize: remainingSize.toString(),
+    status,
+    timestamp: historyOrder.txTime,
+    isTrigger,
+    detailedOrderType,
+    reduceOnly:
+      historyOrder.operation === MYXOperationEnum.Decrease ? true : undefined,
+    providerId: 'myx',
+  };
+}
+
+// ============================================================================
+// Account State Adapter
+// ============================================================================
+
+/**
+ * Adapt MYX account info response to MetaMask AccountState.
+ *
+ * @param accountInfo - Raw account info from MYX SDK
+ * @param walletBalance - Wallet USDT balance (from getWalletQuoteTokenBalance)
+ * @returns MetaMask AccountState
+ */
+export function adaptAccountStateFromMYX(
+  accountInfo: Record<string, unknown> | undefined,
+  walletBalance?: string,
+): AccountState {
+  // accountInfo structure varies; extract what we can
+  // TODO: Verify SDK semantics — if totalCollateral already includes unrealizedPnl,
+  // the totalBalance formula below double-counts. Needs SDK documentation check.
+  const marginUsed = accountInfo
+    ? fromMYXCollateral(String(accountInfo.totalCollateral ?? '0'))
+    : 0;
+  const unrealizedPnl = accountInfo
+    ? fromMYXCollateral(String(accountInfo.unrealizedPnl ?? '0'))
+    : 0;
+  const balance = walletBalance ? fromMYXCollateral(walletBalance) : 0;
+
+  const totalBalance = balance + marginUsed + unrealizedPnl;
+  const availableBalance = balance;
+
+  return {
+    availableBalance: availableBalance.toString(),
+    totalBalance: totalBalance.toString(),
+    marginUsed: marginUsed.toString(),
+    unrealizedPnl: unrealizedPnl.toString(),
+    returnOnEquity: '0',
+  };
+}
+
+// ============================================================================
+// Order Fill Adapter
+// ============================================================================
+
+/**
+ * Adapt MYX history order item (filled) to MetaMask OrderFill
+ *
+ * @param order - MYX history order item
+ * @param poolSymbolMap - Map of poolId to symbol
+ * @returns MetaMask OrderFill
+ */
+export function adaptOrderFillFromMYX(
+  order: MYXHistoryOrderItem,
+  poolSymbolMap: Map<string, string>,
+): OrderFill {
+  const symbol =
+    order.baseSymbol ?? poolSymbolMap.get(order.poolId) ?? order.poolId;
+  const sizeNum = fromMYXSize(order.filledSize || order.size);
+  const priceNum = fromMYXPrice(order.lastPrice || order.price);
+  const side = order.direction === MYXDirectionEnum.Long ? 'buy' : 'sell';
+  const feeNum = fromMYXCollateral(order.tradingFee || '0');
+  const pnlNum = fromMYXCollateral(order.realizedPnl || '0');
+
+  let orderType: OrderFill['orderType'] = 'regular';
+  if (order.execType === MYXExecTypeEnum.TP) {
+    orderType = 'take_profit';
+  } else if (order.execType === MYXExecTypeEnum.SL) {
+    orderType = 'stop_loss';
+  } else if (order.execType === MYXExecTypeEnum.Liquidation) {
+    orderType = 'liquidation';
+  }
+
+  return {
+    orderId: String(order.orderId),
+    symbol,
+    side,
+    size: sizeNum.toString(),
+    price: priceNum.toString(),
+    pnl: pnlNum.toString(),
+    direction: side,
+    fee: feeNum.toString(),
+    feeToken: 'USDT',
+    timestamp: order.txTime,
+    success: order.orderStatus === MYXOrderStatusEnum.Successful,
+    orderType,
+    providerId: 'myx',
+  };
+}
+
+// ============================================================================
+// Funding Adapter
+// ============================================================================
+
+/**
+ * Adapt MYX trade flow items (funding type) to MetaMask Funding
+ *
+ * @param flows - MYX trade flow items filtered to funding type
+ * @param poolSymbolMap - Map of poolId to symbol
+ * @returns Array of MetaMask Funding objects
+ */
+export function adaptFundingFromMYX(
+  flows: MYXTradeFlowItem[],
+  poolSymbolMap: Map<string, string>,
+): Funding[] {
+  return flows
+    .filter(
+      (flow) =>
+        flow.fundingFee && flow.fundingFee !== '0' && flow.fundingFee !== '',
+    )
+    .map((flow) => {
+      const symbol = poolSymbolMap.get(flow.poolId) ?? flow.poolId;
+      const amountUsd = fromMYXCollateral(flow.fundingFee);
+      return {
+        symbol,
+        amountUsd: amountUsd.toString(),
+        rate: undefined, // Funding rate not available in MYX trade flow data
+        timestamp: flow.txTime,
+        transactionHash: flow.txHash,
+      };
+    });
+}
+
+// ============================================================================
+// User History Adapter
+// ============================================================================
+
+/**
+ * Adapt MYX trade flow items to MetaMask UserHistoryItem
+ *
+ * @param flows - MYX trade flow items
+ * @returns Array of UserHistoryItem
+ */
+export function adaptUserHistoryFromMYX(
+  flows: MYXTradeFlowItem[],
+): UserHistoryItem[] {
+  return flows
+    .filter(
+      (flow) =>
+        flow.type === MYXTradeFlowTypeEnum.MarginAccountDeposit ||
+        flow.type === MYXTradeFlowTypeEnum.TransferToWallet,
+    )
+    .map((flow) => {
+      const isDeposit = flow.type === MYXTradeFlowTypeEnum.MarginAccountDeposit;
+      const amount = fromMYXCollateral(flow.collateralAmount || '0');
+      return {
+        id: String(flow.orderId),
+        timestamp: flow.txTime,
+        type: isDeposit ? 'deposit' : 'withdrawal',
+        amount: Math.abs(amount).toString(),
+        asset: 'USDT',
+        txHash: flow.txHash,
+        status: 'completed' as const,
+        details: {
+          source: 'myx',
+        },
+      };
+    });
+}
+
+// ============================================================================
+// Candle (Kline) Adapter
+// ============================================================================
+
+/**
+ * Adapt MYX KlineDataItemType to MetaMask CandleStick.
+ * KlineDataItemType fields (time, open, close, high, low) are already
+ * human-readable strings — no 30-decimal conversion needed.
+ *
+ * @param item - MYX kline data item from SDK
+ * @returns MetaMask CandleStick object
+ */
+export function adaptCandleFromMYX(item: MYXKlineData): CandleStick {
+  return {
+    time: item.time,
+    open: item.open,
+    high: item.high,
+    low: item.low,
+    close: item.close,
+    volume: '0', // KlineDataItemType has no volume field
+  };
+}
+
+/**
+ * Adapt MYX WebSocket KlineData to MetaMask CandleStick.
+ * WS KlineData uses single-letter fields: {t, o, h, l, c, v}.
+ *
+ * @param data - MYX WebSocket kline data
+ * @returns MetaMask CandleStick object
+ */
+export function adaptCandleFromMYXWebSocket(data: MYXKlineWsData): CandleStick {
+  return {
+    time: data.t,
+    open: data.o,
+    high: data.h,
+    low: data.l,
+    close: data.c,
+    volume: data.v,
+  };
+}
+
+/**
+ * Map CandlePeriod values to MYX KlineResolution.
+ * MYX SDK supports: '1m', '5m', '15m', '30m', '1h', '4h', '1d', '1w', '1M'.
+ * Unsupported CandlePeriod values are mapped to the nearest supported resolution.
+ */
+const CANDLE_PERIOD_TO_MYX_RESOLUTION: Record<string, string> = {
+  '1m': '1m',
+  '3m': '5m', // No 3m → use 5m
+  '5m': '5m',
+  '15m': '15m',
+  '30m': '30m',
+  '1h': '1h',
+  '2h': '4h', // No 2h → use 4h
+  '4h': '4h',
+  '8h': '4h', // No 8h → use 4h
+  '12h': '1d', // No 12h → use 1d
+  '1d': '1d',
+  '3d': '1w', // No 3d → use 1w
+  '1w': '1w',
+  '1M': '1M',
+};
+
+/**
+ * Convert a CandlePeriod string to MYX KlineResolution.
+ *
+ * @param period - CandlePeriod value (e.g., '1m', '3m', '1h')
+ * @returns MYX KlineResolution string
+ */
+export function toMYXKlineResolution(period: string): string {
+  return CANDLE_PERIOD_TO_MYX_RESOLUTION[period] ?? '1h';
+}
+
+// ============================================================================
+// Response Validation
+// ============================================================================
+
+/**
+ * Assert MYX API response is successful.
+ * MYX uses code 9200 or 0 for success.
+ *
+ * @param response - MYX API response with code field
+ * @param response.code - Response code (9200 or 0 = success)
+ * @param response.message - Optional error message
+ * @param context - Context string for error messages
+ */
+export function assertMYXSuccess(
+  response: { code: number; message?: string | null },
+  context: string,
+): void {
+  if (response.code !== 9200 && response.code !== 0) {
+    throw new Error(
+      `MYX ${context} failed: code=${response.code} message=${response.message ?? 'unknown'}`,
+    );
+  }
+}
diff --git a/app/controllers/perps/utils/rewardsUtils.test.ts b/app/controllers/perps/utils/rewardsUtils.test.ts
new file mode 100644
index 000000000000..202afe684f30
--- /dev/null
+++ b/app/controllers/perps/utils/rewardsUtils.test.ts
@@ -0,0 +1,102 @@
+import {
+  formatAccountToCaipAccountId,
+  isCaipAccountId,
+  handleRewardsError,
+} from './rewardsUtils';
+import type { PerpsLogger } from '../types';
+
+describe('rewardsUtils', () => {
+  describe('formatAccountToCaipAccountId', () => {
+    it('formats hex chain ID and address to CAIP-10', () => {
+      const result = formatAccountToCaipAccountId(
+        '0xAb5801a7D398351b8bE11C439e05C5B3259aeC9B',
+        '0xa4b1',
+      );
+      expect(result).toMatch(/^eip155:42161:0x/);
+    });
+
+    it('formats decimal chain ID and address to CAIP-10', () => {
+      const result = formatAccountToCaipAccountId(
+        '0xAb5801a7D398351b8bE11C439e05C5B3259aeC9B',
+        '42161',
+      );
+      expect(result).toMatch(/^eip155:42161:0x/);
+    });
+
+    it('returns null for invalid chain ID (NaN) and logs error', () => {
+      const mockLogger: PerpsLogger = {
+        error: jest.fn(),
+      };
+
+      const result = formatAccountToCaipAccountId(
+        '0xAb5801a7D398351b8bE11C439e05C5B3259aeC9B',
+        'abc',
+        mockLogger,
+      );
+
+      expect(result).toBeNull();
+      expect(mockLogger.error).toHaveBeenCalledWith(
+        expect.objectContaining({
+          message: expect.stringContaining('Invalid chain ID: abc'),
+        }),
+        expect.any(Object),
+      );
+    });
+
+    it('returns null for empty chain ID and logs error', () => {
+      const mockLogger: PerpsLogger = {
+        error: jest.fn(),
+      };
+
+      const result = formatAccountToCaipAccountId(
+        '0xAb5801a7D398351b8bE11C439e05C5B3259aeC9B',
+        '',
+        mockLogger,
+      );
+
+      expect(result).toBeNull();
+      expect(mockLogger.error).toHaveBeenCalled();
+    });
+
+    it('returns null without logger for invalid chain ID', () => {
+      const result = formatAccountToCaipAccountId(
+        '0xAb5801a7D398351b8bE11C439e05C5B3259aeC9B',
+        'not-a-number',
+      );
+
+      expect(result).toBeNull();
+    });
+  });
+
+  describe('isCaipAccountId', () => {
+    it('returns true for valid CAIP-10 account ID', () => {
+      expect(isCaipAccountId('eip155:1:0xABC')).toBe(true);
+    });
+
+    it('returns false for non-string value', () => {
+      expect(isCaipAccountId(123)).toBe(false);
+      expect(isCaipAccountId(null)).toBe(false);
+    });
+
+    it('returns false for non-eip155 namespace', () => {
+      expect(isCaipAccountId('solana:1:abc')).toBe(false);
+    });
+
+    it('returns false for string with fewer than 3 parts', () => {
+      expect(isCaipAccountId('eip155:1')).toBe(false);
+    });
+  });
+
+  describe('handleRewardsError', () => {
+    it('returns user-friendly error message', () => {
+      const result = handleRewardsError(new Error('test'));
+      expect(result).toBe('Rewards operation failed');
+    });
+
+    it('logs error when logger is provided', () => {
+      const mockLogger: PerpsLogger = { error: jest.fn() };
+      handleRewardsError(new Error('test'), mockLogger, { key: 'value' });
+      expect(mockLogger.error).toHaveBeenCalled();
+    });
+  });
+});
diff --git a/app/controllers/perps/utils/rewardsUtils.ts b/app/controllers/perps/utils/rewardsUtils.ts
index 487c706a9e1a..afb4f2c37aab 100644
--- a/app/controllers/perps/utils/rewardsUtils.ts
+++ b/app/controllers/perps/utils/rewardsUtils.ts
@@ -5,7 +5,6 @@
  * Portable: no mobile-specific imports.
  * Logger is injected as optional parameter for platform-agnostic error reporting.
  */
-import { formatChainIdToCaip } from '@metamask/bridge-controller';
 import { toChecksumHexAddress } from '@metamask/controller-utils';
 import {
   toCaipAccountId,
@@ -16,6 +15,23 @@ import {
 import type { PerpsLogger } from '../types';
 import { ensureError } from './errorUtils';
 
+/**
+ * Converts a numeric or hex chain ID to a CAIP-2 chain ID string.
+ * e.g. '0x1' → 'eip155:1', '42161' → 'eip155:42161'
+ *
+ * @param chainId - Numeric string or hex string chain ID.
+ * @returns CAIP-2 formatted chain ID.
+ */
+function formatChainIdToCaip(chainId: string): string {
+  const decimal = chainId.startsWith('0x')
+    ? parseInt(chainId, 16)
+    : parseInt(chainId, 10);
+  if (isNaN(decimal)) {
+    throw new Error(`Invalid chain ID: ${chainId}`);
+  }
+  return `eip155:${decimal}`;
+}
+
 /**
  * Formats an address to CAIP-10 account ID format
  *
@@ -35,7 +51,7 @@ export const formatAccountToCaipAccountId = (
   logger?: PerpsLogger,
 ): CaipAccountId | null => {
   try {
-    const caipChainId = formatChainIdToCaip(chainId);
+    const caipChainId = formatChainIdToCaip(chainId) as `${string}:${string}`;
     const { namespace, reference } = parseCaipChainId(caipChainId);
 
     // Normalize EVM addresses to checksummed format for consistent CAIP IDs
diff --git a/app/core/Analytics/MetaMetrics.events.ts b/app/core/Analytics/MetaMetrics.events.ts
index 67887610acf8..832d82479374 100644
--- a/app/core/Analytics/MetaMetrics.events.ts
+++ b/app/core/Analytics/MetaMetrics.events.ts
@@ -80,6 +80,8 @@ enum EVENT_NAME {
   DEFI_TAB_SELECTED = 'DeFi Tab Selected',
   DEFI_PROTOCOL_DETAILS_OPENED = 'DeFi Protocol Details Opened',
   VIEW_ALL_ASSETS_CLICKED = 'View All Assets Clicked',
+  HOME_VIEWED = 'Home Viewed',
+  POSITION_SCREEN_VIEWED = 'Position Screen Viewed',
 
   // Network
   NETWORK_SWITCHED = 'Network Switched',
@@ -120,6 +122,7 @@ enum EVENT_NAME {
 
   // Analytics
   ANALYTICS_PREFERENCE_SELECTED = 'Analytics Preference Selected',
+  METRICS_OPT_OUT = 'Metrics Opt Out',
   ANALYTICS_REQUEST_DATA_DELETION = 'Delete MetaMetrics Data Request Submitted',
   EXPERIMENT_VIEWED = 'Experiment Viewed',
 
@@ -141,6 +144,10 @@ enum EVENT_NAME {
   WALLET_CREATION_ATTEMPTED = 'Wallet Creation Attempted',
   WALLET_CREATED = 'Wallet Created',
   WALLET_SETUP_FAILURE = 'Wallet Setup Failure',
+  WALLET_CREATION_ERROR_SCREEN_VIEWED = 'Wallet Creation Error Screen Viewed',
+  WALLET_CREATION_ERROR_RETRY_CLICKED = 'Wallet Creation Error Retry Clicked',
+  WALLET_CREATION_ERROR_REPORT_SENT = 'Wallet Creation Error Report Sent',
+  WALLET_CREATION_ERROR_SUPPORT_CLICKED = 'Wallet Creation Error Support Clicked',
   WALLET_SETUP_COMPLETED = 'Wallet Setup Completed',
   SOCIAL_LOGIN_COMPLETED = 'Social Login Completed',
   SOCIAL_LOGIN_FAILED = 'Social Login Failed',
@@ -301,6 +308,27 @@ enum EVENT_NAME {
   RAMPS_PAYMENT_METHOD_ADDED = 'Ramps Payment Method Added',
   RAMPS_USER_DETAILS_FETCHED = 'Ramps User Details Fetched',
 
+  // Unified Buy v2
+  RAMPS_SCREEN_VIEWED = 'Ramps Screen Viewed',
+  RAMPS_BACK_BUTTON_CLICKED = 'Ramps Back Button Clicked',
+  RAMPS_NETWORK_FILTER_CLICKED = 'Ramps Network Filter Clicked',
+  RAMPS_TOKEN_SEARCHED = 'Ramps Token Searched',
+  RAMPS_SETTINGS_CLICKED = 'Ramps Settings Clicked',
+  RAMPS_SETTING_OPTION_CLICKED = 'Ramps Setting Option Clicked',
+  RAMPS_PAYMENT_METHOD_SELECTOR_CLICKED = 'Ramps Payment Method Selector Clicked',
+  RAMPS_QUICK_AMOUNT_CLICKED = 'Ramps Quick Amount Clicked',
+  RAMPS_CHANGE_PROVIDER_BUTTON_CLICKED = 'Ramps Change Provider Button Clicked',
+  RAMPS_PROVIDER_SELECTED = 'Ramps Provider Selected',
+  RAMPS_CONTINUE_BUTTON_CLICKED = 'Ramps Continue Button Clicked',
+  RAMPS_TERMS_CONSENT_CLICKED = 'Ramps Terms Consent Clicked',
+  RAMPS_EXTERNAL_LINK_CLICKED = 'Ramps External Link Clicked',
+  RAMPS_CLOSE_BUTTON_CLICKED = 'Ramps Close Button Clicked',
+  RAMPS_QUOTE_ERROR = 'Ramps Quote Error',
+  RAMPS_QUOTE_ERROR_TOOLTIP_CLICKED = 'Ramps Quote Error Tooltip Clicked',
+  RAMPS_UNSUPPORTED_TOKEN_TOOLTIP_CLICKED = 'Ramps Unsupported Token Tooltip Clicked',
+  RAMPS_INFO_TOOLTIP_CLICKED = 'Ramps Info Tooltip Clicked',
+  RAMPS_TOAST_BUTTON_CLICKED = 'Ramps Toast Button Clicked',
+
   ACCOUNTS = 'Accounts',
   DAPP_VIEW = 'Dapp View',
   NAVIGATION_DRAWER = 'Navigation Drawer',
@@ -740,6 +768,8 @@ const events = {
     EVENT_NAME.DEFI_PROTOCOL_DETAILS_OPENED,
   ),
   VIEW_ALL_ASSETS_CLICKED: generateOpt(EVENT_NAME.VIEW_ALL_ASSETS_CLICKED),
+  HOME_VIEWED: generateOpt(EVENT_NAME.HOME_VIEWED),
+  POSITION_SCREEN_VIEWED: generateOpt(EVENT_NAME.POSITION_SCREEN_VIEWED),
   CURRENCY_CHANGED: generateOpt(EVENT_NAME.CURRENCY_CHANGED),
   NETWORK_SWITCHED: generateOpt(EVENT_NAME.NETWORK_SWITCHED),
   RPC_ADDED: generateOpt(EVENT_NAME.RPC_ADDED),
@@ -792,6 +822,7 @@ const events = {
   ANALYTICS_PREFERENCE_SELECTED: generateOpt(
     EVENT_NAME.ANALYTICS_PREFERENCE_SELECTED,
   ),
+  METRICS_OPT_OUT: generateOpt(EVENT_NAME.METRICS_OPT_OUT),
   ANALYTICS_REQUEST_DATA_DELETION: generateOpt(
     EVENT_NAME.ANALYTICS_REQUEST_DATA_DELETION,
   ),
@@ -819,6 +850,18 @@ const events = {
   WALLET_CREATION_ATTEMPTED: generateOpt(EVENT_NAME.WALLET_CREATION_ATTEMPTED),
   WALLET_CREATED: generateOpt(EVENT_NAME.WALLET_CREATED),
   WALLET_SETUP_FAILURE: generateOpt(EVENT_NAME.WALLET_SETUP_FAILURE),
+  WALLET_CREATION_ERROR_SCREEN_VIEWED: generateOpt(
+    EVENT_NAME.WALLET_CREATION_ERROR_SCREEN_VIEWED,
+  ),
+  WALLET_CREATION_ERROR_RETRY_CLICKED: generateOpt(
+    EVENT_NAME.WALLET_CREATION_ERROR_RETRY_CLICKED,
+  ),
+  WALLET_CREATION_ERROR_REPORT_SENT: generateOpt(
+    EVENT_NAME.WALLET_CREATION_ERROR_REPORT_SENT,
+  ),
+  WALLET_CREATION_ERROR_SUPPORT_CLICKED: generateOpt(
+    EVENT_NAME.WALLET_CREATION_ERROR_SUPPORT_CLICKED,
+  ),
   WALLET_SETUP_COMPLETED: generateOpt(EVENT_NAME.WALLET_SETUP_COMPLETED),
   SOCIAL_LOGIN_COMPLETED: generateOpt(EVENT_NAME.SOCIAL_LOGIN_COMPLETED),
   SOCIAL_LOGIN_FAILED: generateOpt(EVENT_NAME.SOCIAL_LOGIN_FAILED),
@@ -1055,6 +1098,51 @@ const events = {
   RAMPS_USER_DETAILS_FETCHED: generateOpt(
     EVENT_NAME.RAMPS_USER_DETAILS_FETCHED,
   ),
+  RAMPS_SCREEN_VIEWED: generateOpt(EVENT_NAME.RAMPS_SCREEN_VIEWED),
+  RAMPS_BACK_BUTTON_CLICKED: generateOpt(EVENT_NAME.RAMPS_BACK_BUTTON_CLICKED),
+  RAMPS_NETWORK_FILTER_CLICKED: generateOpt(
+    EVENT_NAME.RAMPS_NETWORK_FILTER_CLICKED,
+  ),
+  RAMPS_TOKEN_SEARCHED: generateOpt(EVENT_NAME.RAMPS_TOKEN_SEARCHED),
+  RAMPS_SETTINGS_CLICKED: generateOpt(EVENT_NAME.RAMPS_SETTINGS_CLICKED),
+  RAMPS_SETTING_OPTION_CLICKED: generateOpt(
+    EVENT_NAME.RAMPS_SETTING_OPTION_CLICKED,
+  ),
+  RAMPS_PAYMENT_METHOD_SELECTOR_CLICKED: generateOpt(
+    EVENT_NAME.RAMPS_PAYMENT_METHOD_SELECTOR_CLICKED,
+  ),
+  RAMPS_QUICK_AMOUNT_CLICKED: generateOpt(
+    EVENT_NAME.RAMPS_QUICK_AMOUNT_CLICKED,
+  ),
+  RAMPS_CHANGE_PROVIDER_BUTTON_CLICKED: generateOpt(
+    EVENT_NAME.RAMPS_CHANGE_PROVIDER_BUTTON_CLICKED,
+  ),
+  RAMPS_PROVIDER_SELECTED: generateOpt(EVENT_NAME.RAMPS_PROVIDER_SELECTED),
+  RAMPS_CONTINUE_BUTTON_CLICKED: generateOpt(
+    EVENT_NAME.RAMPS_CONTINUE_BUTTON_CLICKED,
+  ),
+  RAMPS_TERMS_CONSENT_CLICKED: generateOpt(
+    EVENT_NAME.RAMPS_TERMS_CONSENT_CLICKED,
+  ),
+  RAMPS_EXTERNAL_LINK_CLICKED: generateOpt(
+    EVENT_NAME.RAMPS_EXTERNAL_LINK_CLICKED,
+  ),
+  RAMPS_CLOSE_BUTTON_CLICKED: generateOpt(
+    EVENT_NAME.RAMPS_CLOSE_BUTTON_CLICKED,
+  ),
+  RAMPS_QUOTE_ERROR: generateOpt(EVENT_NAME.RAMPS_QUOTE_ERROR),
+  RAMPS_QUOTE_ERROR_TOOLTIP_CLICKED: generateOpt(
+    EVENT_NAME.RAMPS_QUOTE_ERROR_TOOLTIP_CLICKED,
+  ),
+  RAMPS_UNSUPPORTED_TOKEN_TOOLTIP_CLICKED: generateOpt(
+    EVENT_NAME.RAMPS_UNSUPPORTED_TOKEN_TOOLTIP_CLICKED,
+  ),
+  RAMPS_INFO_TOOLTIP_CLICKED: generateOpt(
+    EVENT_NAME.RAMPS_INFO_TOOLTIP_CLICKED,
+  ),
+  RAMPS_TOAST_BUTTON_CLICKED: generateOpt(
+    EVENT_NAME.RAMPS_TOAST_BUTTON_CLICKED,
+  ),
 
   FORCE_UPGRADE_UPDATE_NEEDED_PROMPT_VIEWED: generateOpt(
     EVENT_NAME.FORCE_UPGRADE_UPDATE_NEEDED_PROMPT_VIEWED,
diff --git a/app/core/AppConstants.ts b/app/core/AppConstants.ts
index 544255e6c599..24c5dc7e8a1e 100644
--- a/app/core/AppConstants.ts
+++ b/app/core/AppConstants.ts
@@ -93,6 +93,7 @@ export default {
     },
   },
   MM_UNIVERSAL_LINK_HOST: 'metamask.app.link',
+  MM_UNIVERSAL_LINK_HOST_ALTERNATE: 'metamask-alternate.app.link',
   MM_IO_UNIVERSAL_LINK_HOST: 'link.metamask.io',
   MM_IO_UNIVERSAL_LINK_TEST_HOST: 'link-test.metamask.io',
   MM_DEEP_ITMS_APP_LINK: 'https://metamask.app.link/skAH3BaF99',
@@ -210,9 +211,9 @@ export default {
   DECODING_API_URL:
     process.env.DECODING_API_URL ||
     'https://signature-insights.api.cx.metamask.io/v1',
-  TERMINAL_API_URL:
-    process.env.TERMINAL_API_URL ||
-    'https://terminal.dev-api.cx.metamask.io/api/v1',
+  DIGEST_API_URL:
+    process.env.DIGEST_API_URL ||
+    'https://digest-api.dev-api.cx.metamask.io/api/v1',
   // Rewards/Baanx: GH Actions use builds.yml (env set per build). Fallback mapping for local when env not set.
   REWARDS_API_URL: {
     DEV: 'https://rewards.dev-api.cx.metamask.io',
diff --git a/app/core/Authentication/Authentication.test.ts b/app/core/Authentication/Authentication.test.ts
index f95278e4dd31..d6cabaf60eee 100644
--- a/app/core/Authentication/Authentication.test.ts
+++ b/app/core/Authentication/Authentication.test.ts
@@ -730,7 +730,7 @@ describe('Authentication', () => {
       jest.replaceProperty(Platform, 'OS', 'ios'); // restore default for other tests
     });
 
-    it('returns authType unchanged when Platform.OS is ios but authType is not BIOMETRIC', async () => {
+    it('returns authType unchanged when Platform.OS is ios but authType is not BIOMETRIC or DEVICE_AUTHENTICATION', async () => {
       jest.replaceProperty(Platform, 'OS', 'ios');
 
       const passcodeResult =
@@ -789,6 +789,48 @@ describe('Authentication', () => {
         disableDeviceFallback: true,
       });
     });
+
+    it('returns authType when Platform.OS is ios and authType is DEVICE_AUTHENTICATION and authenticateAsync succeeds', async () => {
+      jest.replaceProperty(Platform, 'OS', 'ios');
+      mockAuthenticateAsync.mockResolvedValue({ success: true });
+
+      const result = await Authentication.requestBiometricsAccessControlForIOS(
+        AUTHENTICATION_TYPE.DEVICE_AUTHENTICATION,
+      );
+
+      expect(result).toBe(AUTHENTICATION_TYPE.DEVICE_AUTHENTICATION);
+      expect(mockAuthenticateAsync).toHaveBeenCalledWith({
+        disableDeviceFallback: true,
+      });
+    });
+
+    it('returns PASSWORD when Platform.OS is ios and authType is DEVICE_AUTHENTICATION and authenticateAsync returns success false', async () => {
+      jest.replaceProperty(Platform, 'OS', 'ios');
+      mockAuthenticateAsync.mockResolvedValue({ success: false });
+
+      const result = await Authentication.requestBiometricsAccessControlForIOS(
+        AUTHENTICATION_TYPE.DEVICE_AUTHENTICATION,
+      );
+
+      expect(result).toBe(AUTHENTICATION_TYPE.PASSWORD);
+      expect(mockAuthenticateAsync).toHaveBeenCalledWith({
+        disableDeviceFallback: true,
+      });
+    });
+
+    it('returns PASSWORD when Platform.OS is ios and authType is DEVICE_AUTHENTICATION and authenticateAsync throws', async () => {
+      jest.replaceProperty(Platform, 'OS', 'ios');
+      mockAuthenticateAsync.mockRejectedValue(new Error('User cancelled'));
+
+      const result = await Authentication.requestBiometricsAccessControlForIOS(
+        AUTHENTICATION_TYPE.DEVICE_AUTHENTICATION,
+      );
+
+      expect(result).toBe(AUTHENTICATION_TYPE.PASSWORD);
+      expect(mockAuthenticateAsync).toHaveBeenCalledWith({
+        disableDeviceFallback: true,
+      });
+    });
   });
 
   describe('storePassword', () => {
diff --git a/app/core/Authentication/Authentication.ts b/app/core/Authentication/Authentication.ts
index d6c7ef1853f7..a49a87cd702f 100644
--- a/app/core/Authentication/Authentication.ts
+++ b/app/core/Authentication/Authentication.ts
@@ -489,7 +489,11 @@ class AuthenticationService {
   requestBiometricsAccessControlForIOS = async (
     authType: AUTHENTICATION_TYPE,
   ): Promise<AUTHENTICATION_TYPE> => {
-    if (Platform.OS === 'ios' && authType === AUTHENTICATION_TYPE.BIOMETRIC) {
+    if (
+      Platform.OS === 'ios' &&
+      (authType === AUTHENTICATION_TYPE.BIOMETRIC ||
+        authType === AUTHENTICATION_TYPE.DEVICE_AUTHENTICATION)
+    ) {
       try {
         // Prompt user for biometrics access control
         const result = await authenticateAsync({ disableDeviceFallback: true });
@@ -1197,7 +1201,6 @@ class AuthenticationService {
 
         await this.newWalletVaultAndRestore(password, seedPhrase, false);
         // add in more srps
-        const entropySources: EntropySourceId[] = [];
         if (restOfSeedPhrases.length > 0) {
           for (const item of restOfSeedPhrases) {
             try {
@@ -1209,9 +1212,7 @@ class AuthenticationService {
                 });
               } else if (item.type === SecretType.Mnemonic) {
                 const mnemonic = uint8ArrayToMnemonic(item.data, wordlist);
-                const entropySource =
-                  await this.importSeedlessMnemonicToVault(mnemonic);
-                entropySources.push(entropySource);
+                await this.importSeedlessMnemonicToVault(mnemonic);
               } else {
                 Logger.error(
                   new Error(
@@ -1231,10 +1232,6 @@ class AuthenticationService {
         }
         await this.syncKeyringEncryptionKey();
 
-        for (const entropySource of entropySources) {
-          // NOTE: Initial implementation of discovery was not awaited, thus we also follow this pattern here.
-          this.attemptMultichainAccountWalletDiscovery(entropySource);
-        }
         this.dispatchOauthReset();
         ReduxService.store.dispatch(setExistingUser(true));
 
@@ -1342,9 +1339,6 @@ class AuthenticationService {
       });
       await KeyringController.changePassword(globalPassword);
       await this.syncKeyringEncryptionKey();
-      renewSeedlessControllerRefreshTokens(globalPassword).catch((err) => {
-        Logger.error(err, 'Failed to renew refresh token');
-      });
     } catch (err) {
       // lock app again on error after submitPassword succeeded
       await this.lockApp({ locked: true, reset: false });
diff --git a/app/core/Authentication/hooks/useAuthentication.test.ts b/app/core/Authentication/hooks/useAuthentication.test.ts
index 72d851bcb045..8cbdaa176e95 100644
--- a/app/core/Authentication/hooks/useAuthentication.test.ts
+++ b/app/core/Authentication/hooks/useAuthentication.test.ts
@@ -22,6 +22,7 @@ describe('useAuthentication', () => {
       expect(result.current.updateAuthPreference).toBeDefined();
       expect(result.current.getAuthCapabilities).toBeDefined();
       expect(result.current.updateOsAuthEnabled).toBeDefined();
+      expect(result.current.requestBiometricsAccessControlForIOS).toBeDefined();
       expect(result.current.checkIsSeedlessPasswordOutdated).toBeDefined();
 
       expect(typeof result.current.unlockWallet).toBe('function');
@@ -36,6 +37,9 @@ describe('useAuthentication', () => {
       expect(typeof result.current.updateAuthPreference).toBe('function');
       expect(typeof result.current.getAuthCapabilities).toBe('function');
       expect(typeof result.current.updateOsAuthEnabled).toBe('function');
+      expect(typeof result.current.requestBiometricsAccessControlForIOS).toBe(
+        'function',
+      );
       expect(typeof result.current.checkIsSeedlessPasswordOutdated).toBe(
         'function',
       );
diff --git a/app/core/Authentication/hooks/useAuthentication.ts b/app/core/Authentication/hooks/useAuthentication.ts
index 91b38f8b3462..cb67b99a6e39 100644
--- a/app/core/Authentication/hooks/useAuthentication.ts
+++ b/app/core/Authentication/hooks/useAuthentication.ts
@@ -14,6 +14,8 @@ export default () => ({
   updateAuthPreference: Authentication.updateAuthPreference,
   getAuthCapabilities: Authentication.getAuthCapabilities,
   updateOsAuthEnabled: Authentication.updateOsAuthEnabled,
+  requestBiometricsAccessControlForIOS:
+    Authentication.requestBiometricsAccessControlForIOS,
   checkIsSeedlessPasswordOutdated:
     Authentication.checkIsSeedlessPasswordOutdated,
 });
diff --git a/app/core/DeeplinkManager/DeeplinkManager.test.ts b/app/core/DeeplinkManager/DeeplinkManager.test.ts
index 5aa1055957f8..f77f417a66f9 100644
--- a/app/core/DeeplinkManager/DeeplinkManager.test.ts
+++ b/app/core/DeeplinkManager/DeeplinkManager.test.ts
@@ -2,7 +2,11 @@ import { NavigationProp, ParamListBase } from '@react-navigation/native';
 import { waitFor } from '@testing-library/react-native';
 import FCMService from '../../util/notifications/services/FCMService';
 import NavigationService from '../NavigationService';
-import SharedDeeplinkManager, { DeeplinkManager } from './DeeplinkManager';
+import SharedDeeplinkManager, {
+  DeeplinkManager,
+  rewriteBranchUri,
+} from './DeeplinkManager';
+import type { BranchParams } from './types/deepLinkAnalytics.types';
 import { handleDeeplink } from './handlers/legacy/handleDeeplink';
 import switchNetwork from '../../util/networks/switchNetwork';
 import parseDeeplink from './utils/parseDeeplink';
@@ -282,6 +286,34 @@ describe('SharedDeeplinkManager', () => {
   });
 });
 
+describe('rewriteBranchUri', () => {
+  it('rewrites host and path to link.metamask.io and preserves query when +clicked_branch_link and $deeplink_path are set', () => {
+    const uri =
+      'https://metamask-alternate.app.link/1WkF6GmE40b?amount=100&from=0x';
+    const params: BranchParams = {
+      '+clicked_branch_link': true,
+      $deeplink_path: 'swap',
+    };
+    expect(rewriteBranchUri(uri, params)).toBe(
+      'https://link.metamask.io/swap?amount=100&from=0x',
+    );
+  });
+
+  it('returns uri unchanged when +clicked_branch_link is false', () => {
+    const uri = 'https://metamask.app.link/swap';
+    expect(
+      rewriteBranchUri(uri, { '+clicked_branch_link': false } as BranchParams),
+    ).toBe(uri);
+  });
+
+  it('returns uri unchanged when $deeplink_path is missing', () => {
+    const uri = 'https://metamask.app.link/swap';
+    expect(
+      rewriteBranchUri(uri, { '+clicked_branch_link': true } as BranchParams),
+    ).toBe(uri);
+  });
+});
+
 describe('DeeplinkManager.start Branch deeplink handling', () => {
   beforeEach(() => {
     jest.clearAllMocks();
@@ -304,6 +336,31 @@ describe('DeeplinkManager.start Branch deeplink handling', () => {
     expect(handleDeeplink).toHaveBeenCalledWith({ uri: mockDeeplink });
   });
 
+  it('rewrites cold start Branch link using $deeplink_path from getLatestReferringParams', async () => {
+    (branch.getLatestReferringParams as jest.Mock).mockResolvedValue({
+      '+clicked_branch_link': true,
+      $deeplink_path: 'swap',
+      '~referring_link':
+        'https://metamask-alternate.app.link/1WkF6GmE40b?amount=500',
+    });
+    DeeplinkManager.start();
+    await new Promise((resolve) => setImmediate(resolve));
+    expect(handleDeeplink).toHaveBeenCalledWith({
+      uri: 'https://link.metamask.io/swap?amount=500',
+    });
+  });
+
+  it('falls back to +non_branch_link on cold start when +clicked_branch_link is false', async () => {
+    const mockDeeplink = 'https://link.metamask.io/home';
+    (branch.getLatestReferringParams as jest.Mock).mockResolvedValue({
+      '+clicked_branch_link': false,
+      '+non_branch_link': mockDeeplink,
+    });
+    DeeplinkManager.start();
+    await new Promise((resolve) => setImmediate(resolve));
+    expect(handleDeeplink).toHaveBeenCalledWith({ uri: mockDeeplink });
+  });
+
   it('subscribes to Branch deeplink events', async () => {
     DeeplinkManager.start();
     expect(branch.subscribe).toHaveBeenCalled();
@@ -318,4 +375,68 @@ describe('DeeplinkManager.start Branch deeplink handling', () => {
     await new Promise((resolve) => setImmediate(resolve));
     expect(handleDeeplink).toHaveBeenCalledWith({ uri: mockUri });
   });
+
+  it('rewrites Branch short link to link.metamask.io when +clicked_branch_link and $deeplink_path are present', async () => {
+    DeeplinkManager.start();
+    const callback = (branch.subscribe as jest.Mock).mock.calls[0][0];
+
+    callback({
+      uri: 'https://metamask-alternate.app.link/1WkF6GmE40b?amount=1000000&from=eip155%3A1%2Ferc20%3A0xabc',
+      params: {
+        '+clicked_branch_link': true,
+        $deeplink_path: 'swap',
+      },
+    });
+
+    await new Promise((resolve) => setImmediate(resolve));
+    expect(handleDeeplink).toHaveBeenCalledWith({
+      uri: 'https://link.metamask.io/swap?amount=1000000&from=eip155%3A1%2Ferc20%3A0xabc',
+    });
+  });
+
+  it('passes URI through unchanged when +clicked_branch_link is false', async () => {
+    DeeplinkManager.start();
+    const callback = (branch.subscribe as jest.Mock).mock.calls[0][0];
+    const mockUri = 'https://metamask.app.link/swap?amount=100';
+
+    callback({
+      uri: mockUri,
+      params: { '+clicked_branch_link': false },
+    });
+
+    await new Promise((resolve) => setImmediate(resolve));
+    expect(handleDeeplink).toHaveBeenCalledWith({ uri: mockUri });
+  });
+
+  it('passes URI through unchanged when $deeplink_path is missing', async () => {
+    DeeplinkManager.start();
+    const callback = (branch.subscribe as jest.Mock).mock.calls[0][0];
+    const mockUri = 'https://metamask.app.link/swap?amount=100';
+
+    callback({
+      uri: mockUri,
+      params: { '+clicked_branch_link': true },
+    });
+
+    await new Promise((resolve) => setImmediate(resolve));
+    expect(handleDeeplink).toHaveBeenCalledWith({ uri: mockUri });
+  });
+
+  it('strips leading slash from $deeplink_path when rewriting', async () => {
+    DeeplinkManager.start();
+    const callback = (branch.subscribe as jest.Mock).mock.calls[0][0];
+
+    callback({
+      uri: 'https://metamask-alternate.app.link/ABC123',
+      params: {
+        '+clicked_branch_link': true,
+        $deeplink_path: '/swap/token',
+      },
+    });
+
+    await new Promise((resolve) => setImmediate(resolve));
+    expect(handleDeeplink).toHaveBeenCalledWith({
+      uri: 'https://link.metamask.io/swap/token',
+    });
+  });
 });
diff --git a/app/core/DeeplinkManager/DeeplinkManager.ts b/app/core/DeeplinkManager/DeeplinkManager.ts
index 82592138411b..1c145b39b6d0 100644
--- a/app/core/DeeplinkManager/DeeplinkManager.ts
+++ b/app/core/DeeplinkManager/DeeplinkManager.ts
@@ -7,6 +7,33 @@ import Logger from '../../util/Logger';
 import { handleDeeplink } from './handlers/legacy/handleDeeplink';
 import FCMService from '../../util/notifications/services/FCMService';
 import AppConstants from '../AppConstants';
+import { BranchParams } from './types/deepLinkAnalytics.types';
+
+/**
+ * When Branch resolves a short link (e.g. metamask-alternate.app.link/1WkF6GmE40b),
+ * the URI path may be link ID, not an in-app route. If the resolved params indicate
+ * a clicked Branch link with a $deeplink_path, replace the host and path segment
+ * with link.metamask.io/$deeplink_path while preserving the original query string.
+ */
+export function rewriteBranchUri(
+  uri: string | undefined,
+  params: BranchParams | undefined,
+): string | undefined {
+  try {
+    if (!uri || !params?.['+clicked_branch_link']) return uri;
+    const rawPath = params.$deeplink_path;
+    if (typeof rawPath !== 'string') return uri;
+
+    const parsed = new URL(uri);
+    parsed.host = AppConstants.MM_IO_UNIVERSAL_LINK_HOST;
+    // Set the pathname to the sanitized $deeplink_path
+    parsed.pathname = `/${rawPath.replace(/^\//, '')}`;
+    return parsed.toString();
+  } catch (error) {
+    Logger.error(error as Error, `Error rewriting Branch URI: ${uri}`);
+    return uri;
+  }
+}
 
 export class DeeplinkManager {
   // singleton instance
@@ -66,6 +93,17 @@ export class DeeplinkManager {
 
       try {
         const latestParams = await branch.getLatestReferringParams();
+
+        // Cold start: params may contain a resolved Branch link with $deeplink_path.
+        const rewritten = rewriteBranchUri(
+          latestParams?.['~referring_link'] as string | undefined,
+          latestParams as Record<string, unknown> | undefined,
+        );
+        if (rewritten) {
+          handleDeeplink({ uri: rewritten });
+          return;
+        }
+
         const deeplink = latestParams?.['+non_branch_link'] as string;
         if (deeplink) {
           handleDeeplink({ uri: deeplink });
@@ -117,12 +155,11 @@ export class DeeplinkManager {
         const branchError = new Error(error);
         Logger.error(branchError, 'Error subscribing to branch.');
       }
-      getBranchDeeplink(opts.uri);
-      //TODO: that async call in the subscribe doesn't look good to me
-      branch.getLatestReferringParams().then((val) => {
-        const deeplink = opts.uri || (val['+non_branch_link'] as string);
-        handleDeeplink({ uri: deeplink });
-      });
+      const rewritten = rewriteBranchUri(
+        opts.uri,
+        opts.params as Record<string, unknown> | undefined,
+      );
+      getBranchDeeplink(rewritten ?? opts.uri);
     });
   }
 }
diff --git a/app/core/DeeplinkManager/handlers/legacy/handleUniversalLink.ts b/app/core/DeeplinkManager/handlers/legacy/handleUniversalLink.ts
index 7a4a84d625c3..e82b3472119a 100644
--- a/app/core/DeeplinkManager/handlers/legacy/handleUniversalLink.ts
+++ b/app/core/DeeplinkManager/handlers/legacy/handleUniversalLink.ts
@@ -57,6 +57,7 @@ import Logger from '../../../../util/Logger';
 
 const {
   MM_UNIVERSAL_LINK_HOST,
+  MM_UNIVERSAL_LINK_HOST_ALTERNATE,
   MM_IO_UNIVERSAL_LINK_HOST,
   MM_IO_UNIVERSAL_LINK_TEST_HOST,
 } = AppConstants;
@@ -216,6 +217,7 @@ async function handleUniversalLink({
 
   const isSupportedDomain =
     urlObj.hostname === MM_UNIVERSAL_LINK_HOST ||
+    urlObj.hostname === MM_UNIVERSAL_LINK_HOST_ALTERNATE ||
     urlObj.hostname === MM_IO_UNIVERSAL_LINK_HOST ||
     urlObj.hostname === MM_IO_UNIVERSAL_LINK_TEST_HOST;
 
diff --git a/app/core/DeeplinkManager/util/deeplinks/index.ts b/app/core/DeeplinkManager/util/deeplinks/index.ts
index 869650104010..530628cb4e39 100644
--- a/app/core/DeeplinkManager/util/deeplinks/index.ts
+++ b/app/core/DeeplinkManager/util/deeplinks/index.ts
@@ -2,6 +2,7 @@ import AppConstants from '../../../AppConstants';
 
 const {
   MM_UNIVERSAL_LINK_HOST,
+  MM_UNIVERSAL_LINK_HOST_ALTERNATE,
   MM_IO_UNIVERSAL_LINK_HOST,
   MM_IO_UNIVERSAL_LINK_TEST_HOST,
 } = AppConstants;
@@ -10,6 +11,7 @@ const METAMASK_HOSTS = [
   ...new Set(
     [
       MM_UNIVERSAL_LINK_HOST || 'link.metamask.io',
+      MM_UNIVERSAL_LINK_HOST_ALTERNATE || 'metamask-alternate.app.link',
       MM_IO_UNIVERSAL_LINK_HOST || 'link.metamask.io',
       MM_IO_UNIVERSAL_LINK_TEST_HOST || 'link-test.metamask.io',
       'metamask.app.link',
diff --git a/app/core/Engine/Engine.ts b/app/core/Engine/Engine.ts
index c7e4eecdcaf8..c786bf74ca06 100644
--- a/app/core/Engine/Engine.ts
+++ b/app/core/Engine/Engine.ts
@@ -177,6 +177,7 @@ import { profileMetricsServiceInit } from './controllers/profile-metrics-service
 import { rampsServiceInit } from './controllers/ramps-controller/ramps-service-init';
 import { rampsControllerInit } from './controllers/ramps-controller/ramps-controller-init';
 import { aiDigestControllerInit } from './controllers/ai-digest-controller-init';
+import { cardControllerInit } from './controllers/card-controller';
 import { transakServiceInit } from './controllers/ramps-controller/transak-service-init';
 
 // TODO: Replace "any" with type
@@ -371,6 +372,7 @@ export class Engine {
         TransakService: transakServiceInit,
         RampsController: rampsControllerInit,
         AiDigestController: aiDigestControllerInit,
+        CardController: cardControllerInit,
       },
       persistedState: initialState as EngineState,
       baseControllerMessenger: this.controllerMessenger,
@@ -411,6 +413,7 @@ export class Engine {
     const transakService = controllersByName.TransakService;
     const rampsController = controllersByName.RampsController;
     const aiDigestController = controllersByName.AiDigestController;
+    const cardController = controllersByName.CardController;
 
     // Backwards compatibility for existing references
     this.accountsController = accountsController;
@@ -569,6 +572,7 @@ export class Engine {
       TransakService: transakService,
       RampsController: rampsController,
       AiDigestController: aiDigestController,
+      CardController: cardController,
     };
 
     const childControllers = Object.assign({}, this.context);
@@ -1291,6 +1295,7 @@ export default {
       ApprovalController,
       BridgeController,
       BridgeStatusController,
+      CardController,
       ConnectivityController,
       CurrencyRateController,
       DeFiPositionsController,
@@ -1394,6 +1399,7 @@ export default {
       TransactionPayController: TransactionPayController.state,
       RampsController: RampsController.state,
       AiDigestController: AiDigestController.state,
+      CardController: CardController.state,
       ///: BEGIN:ONLY_INCLUDE_IF(preinstalled-snaps,external-snaps)
       AuthenticationController: AuthenticationController.state,
       CronjobController: CronjobController.state,
diff --git a/app/core/Engine/constants.ts b/app/core/Engine/constants.ts
index 1e102b0c5252..4ab93dfccaa7 100644
--- a/app/core/Engine/constants.ts
+++ b/app/core/Engine/constants.ts
@@ -83,6 +83,7 @@ export const BACKGROUND_STATE_CHANGE_EVENT_NAMES = [
   ///: END:ONLY_INCLUDE_IF
   'NetworkEnablementController:stateChange',
   'PredictController:stateChange',
+  'CardController:stateChange',
   'DelegationController:stateChange',
   'ProfileMetricsController:stateChange',
 ] as const;
diff --git a/app/core/Engine/controllers/ai-digest-controller-init.test.ts b/app/core/Engine/controllers/ai-digest-controller-init.test.ts
new file mode 100644
index 000000000000..176386dd12d6
--- /dev/null
+++ b/app/core/Engine/controllers/ai-digest-controller-init.test.ts
@@ -0,0 +1,56 @@
+import { buildControllerInitRequestMock } from '../utils/test-utils';
+import { ExtendedMessenger } from '../../ExtendedMessenger';
+import { getAiDigestControllerMessenger } from '../messengers/ai-digest-controller-messenger';
+import { ControllerInitRequest } from '../types';
+import { aiDigestControllerInit } from './ai-digest-controller-init';
+import {
+  AiDigestController,
+  AiDigestService,
+  type AiDigestControllerMessenger,
+} from '@metamask/ai-controllers';
+import { MOCK_ANY_NAMESPACE, MockAnyNamespace } from '@metamask/messenger';
+import AppConstants from '../../AppConstants';
+
+jest.mock('@metamask/ai-controllers');
+
+function getInitRequestMock(): jest.Mocked<
+  ControllerInitRequest<AiDigestControllerMessenger>
+> {
+  const baseMessenger = new ExtendedMessenger<MockAnyNamespace, never>({
+    namespace: MOCK_ANY_NAMESPACE,
+  });
+
+  return {
+    ...buildControllerInitRequestMock(baseMessenger),
+    controllerMessenger: getAiDigestControllerMessenger(baseMessenger),
+  };
+}
+
+describe('aiDigestControllerInit', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  it('initializes the controller', () => {
+    const { controller } = aiDigestControllerInit(getInitRequestMock());
+    expect(controller).toBeInstanceOf(AiDigestController);
+  });
+
+  it('passes the correct baseUrl (DIGEST_API_URL) to AiDigestService', () => {
+    aiDigestControllerInit(getInitRequestMock());
+
+    expect(jest.mocked(AiDigestService)).toHaveBeenCalledWith({
+      baseUrl: AppConstants.DIGEST_API_URL,
+    });
+  });
+
+  it('passes the service and messenger to AiDigestController', () => {
+    aiDigestControllerInit(getInitRequestMock());
+
+    expect(jest.mocked(AiDigestController)).toHaveBeenCalledWith({
+      messenger: expect.any(Object),
+      state: undefined,
+      digestService: expect.any(AiDigestService),
+    });
+  });
+});
diff --git a/app/core/Engine/controllers/ai-digest-controller-init.ts b/app/core/Engine/controllers/ai-digest-controller-init.ts
index 63021f44f629..2c0563d6ed51 100644
--- a/app/core/Engine/controllers/ai-digest-controller-init.ts
+++ b/app/core/Engine/controllers/ai-digest-controller-init.ts
@@ -19,7 +19,7 @@ export const aiDigestControllerInit: ControllerInitFunction<
   AiDigestControllerMessenger
 > = ({ controllerMessenger, persistedState }) => {
   const digestService = new AiDigestService({
-    baseUrl: AppConstants.TERMINAL_API_URL,
+    baseUrl: AppConstants.DIGEST_API_URL,
   });
 
   const controller = new AiDigestController({
diff --git a/app/core/Engine/controllers/card-controller/CardController.test.ts b/app/core/Engine/controllers/card-controller/CardController.test.ts
new file mode 100644
index 000000000000..b13b98ef09b0
--- /dev/null
+++ b/app/core/Engine/controllers/card-controller/CardController.test.ts
@@ -0,0 +1,77 @@
+import { Messenger } from '@metamask/messenger';
+import { CardController, defaultCardControllerState } from './CardController';
+import { type CardControllerActions, type CardControllerEvents } from './types';
+
+function buildMessenger() {
+  return new Messenger<
+    'CardController',
+    CardControllerActions,
+    CardControllerEvents
+  >({ namespace: 'CardController' });
+}
+
+describe('CardController', () => {
+  it('initializes with default state when no state is provided', () => {
+    const controller = new CardController({
+      messenger: buildMessenger(),
+    });
+
+    expect(controller.state).toStrictEqual(defaultCardControllerState);
+  });
+
+  it('initializes with provided state merged over defaults', () => {
+    const controller = new CardController({
+      messenger: buildMessenger(),
+      state: {
+        selectedCountry: 'US',
+        activeProviderId: 'baanx',
+        isAuthenticated: true,
+      },
+    });
+
+    expect(controller.state).toStrictEqual({
+      selectedCountry: 'US',
+      activeProviderId: 'baanx',
+      isAuthenticated: true,
+      cardholderAccounts: [],
+      providerData: {},
+    });
+  });
+
+  it('preserves default values for fields not in partial state', () => {
+    const controller = new CardController({
+      messenger: buildMessenger(),
+      state: {
+        selectedCountry: 'GB',
+      },
+    });
+
+    expect(controller.state.selectedCountry).toBe('GB');
+    expect(controller.state.activeProviderId).toBeNull();
+    expect(controller.state.isAuthenticated).toBe(false);
+    expect(controller.state.cardholderAccounts).toStrictEqual([]);
+    expect(controller.state.providerData).toStrictEqual({});
+  });
+
+  it('initializes with full persisted state including providerData', () => {
+    const controller = new CardController({
+      messenger: buildMessenger(),
+      state: {
+        selectedCountry: 'US',
+        activeProviderId: 'baanx',
+        isAuthenticated: true,
+        cardholderAccounts: ['eip155:1:0xabc'],
+        providerData: {
+          baanx: { location: 'us' },
+        },
+      },
+    });
+
+    expect(controller.state.cardholderAccounts).toStrictEqual([
+      'eip155:1:0xabc',
+    ]);
+    expect(controller.state.providerData).toStrictEqual({
+      baanx: { location: 'us' },
+    });
+  });
+});
diff --git a/app/core/Engine/controllers/card-controller/CardController.ts b/app/core/Engine/controllers/card-controller/CardController.ts
new file mode 100644
index 000000000000..4095077945af
--- /dev/null
+++ b/app/core/Engine/controllers/card-controller/CardController.ts
@@ -0,0 +1,79 @@
+import { BaseController, type StateMetadata } from '@metamask/base-controller';
+import {
+  CARD_CONTROLLER_NAME,
+  type CardControllerMessenger,
+  type CardControllerState,
+} from './types';
+
+const metadata: StateMetadata<CardControllerState> = {
+  selectedCountry: {
+    persist: true,
+    includeInDebugSnapshot: true,
+    includeInStateLogs: true,
+    usedInUi: true,
+  },
+  activeProviderId: {
+    persist: true,
+    includeInDebugSnapshot: true,
+    includeInStateLogs: true,
+    usedInUi: true,
+  },
+  isAuthenticated: {
+    persist: true,
+    includeInDebugSnapshot: true,
+    includeInStateLogs: true,
+    usedInUi: true,
+  },
+  cardholderAccounts: {
+    persist: true,
+    includeInDebugSnapshot: true,
+    includeInStateLogs: true,
+    usedInUi: true,
+  },
+  providerData: {
+    persist: true,
+    includeInDebugSnapshot: false,
+    includeInStateLogs: false,
+    usedInUi: false,
+  },
+};
+
+export const defaultCardControllerState: CardControllerState = {
+  selectedCountry: null,
+  activeProviderId: null,
+  isAuthenticated: false,
+  cardholderAccounts: [],
+  providerData: {},
+};
+
+/**
+ * CardController manages the MetaMask Card feature state.
+ *
+ * This is a thin coordination layer that will eventually delegate
+ * to provider implementations. For now it owns the persisted state
+ * (country, provider, auth status) and syncs it to Redux via the
+ * standard Engine batcher.
+ */
+export class CardController extends BaseController<
+  typeof CARD_CONTROLLER_NAME,
+  CardControllerState,
+  CardControllerMessenger
+> {
+  constructor({
+    messenger,
+    state,
+  }: {
+    messenger: CardControllerMessenger;
+    state?: Partial<CardControllerState>;
+  }) {
+    super({
+      name: CARD_CONTROLLER_NAME,
+      messenger,
+      metadata,
+      state: {
+        ...defaultCardControllerState,
+        ...state,
+      },
+    });
+  }
+}
diff --git a/app/core/Engine/controllers/card-controller/index.test.ts b/app/core/Engine/controllers/card-controller/index.test.ts
new file mode 100644
index 000000000000..614766ae45bf
--- /dev/null
+++ b/app/core/Engine/controllers/card-controller/index.test.ts
@@ -0,0 +1,70 @@
+import { ExtendedMessenger } from '../../../ExtendedMessenger';
+import { buildControllerInitRequestMock } from '../../utils/test-utils';
+import { ControllerInitRequest } from '../../types';
+import { CardController, defaultCardControllerState } from './CardController';
+import {
+  type CardControllerMessenger,
+  type CardControllerState,
+} from './types';
+import { cardControllerInit } from '.';
+import { MOCK_ANY_NAMESPACE, MockAnyNamespace } from '@metamask/messenger';
+
+jest.mock('./CardController', () => {
+  const actual = jest.requireActual('./CardController');
+  return {
+    ...actual,
+    CardController: jest.fn(actual.CardController),
+  };
+});
+
+describe('cardControllerInit', () => {
+  const cardControllerClassMock = jest.mocked(CardController);
+  let initRequestMock: jest.Mocked<
+    ControllerInitRequest<CardControllerMessenger>
+  >;
+
+  beforeEach(() => {
+    jest.resetAllMocks();
+
+    const baseControllerMessenger = new ExtendedMessenger<MockAnyNamespace>({
+      namespace: MOCK_ANY_NAMESPACE,
+    });
+
+    initRequestMock = buildControllerInitRequestMock(baseControllerMessenger);
+  });
+
+  it('returns a controller instance', () => {
+    const result = cardControllerInit(initRequestMock);
+
+    expect(result.controller).toBeInstanceOf(CardController);
+  });
+
+  it('uses default state when no persisted state is provided', () => {
+    initRequestMock.persistedState = {};
+
+    cardControllerInit(initRequestMock);
+
+    const constructorArgs = cardControllerClassMock.mock.calls[0][0];
+    expect(constructorArgs.state).toStrictEqual(defaultCardControllerState);
+  });
+
+  it('uses persisted state when provided', () => {
+    const persistedState: CardControllerState = {
+      selectedCountry: 'US',
+      activeProviderId: 'baanx',
+      isAuthenticated: true,
+      cardholderAccounts: ['eip155:1:0xabc'],
+      providerData: { baanx: { location: 'us' } },
+    };
+
+    initRequestMock.persistedState = {
+      ...initRequestMock.persistedState,
+      CardController: persistedState,
+    };
+
+    cardControllerInit(initRequestMock);
+
+    const constructorArgs = cardControllerClassMock.mock.calls[0][0];
+    expect(constructorArgs.state).toStrictEqual(persistedState);
+  });
+});
diff --git a/app/core/Engine/controllers/card-controller/index.ts b/app/core/Engine/controllers/card-controller/index.ts
new file mode 100644
index 000000000000..f5b1d1f04ceb
--- /dev/null
+++ b/app/core/Engine/controllers/card-controller/index.ts
@@ -0,0 +1,26 @@
+import type { ControllerInitFunction } from '../../types';
+import { CardController, defaultCardControllerState } from './CardController';
+import type { CardControllerMessenger } from './types';
+
+/**
+ * Initialize the CardController.
+ *
+ * @param request - The request object.
+ * @returns The CardController.
+ */
+export const cardControllerInit: ControllerInitFunction<
+  CardController,
+  CardControllerMessenger
+> = (request) => {
+  const { controllerMessenger, persistedState } = request;
+
+  const controller = new CardController({
+    messenger: controllerMessenger,
+    state: persistedState.CardController ?? defaultCardControllerState,
+  });
+
+  return { controller };
+};
+
+export { CardController };
+export type { CardControllerMessenger };
diff --git a/app/core/Engine/controllers/card-controller/types.ts b/app/core/Engine/controllers/card-controller/types.ts
new file mode 100644
index 000000000000..10924d2540f7
--- /dev/null
+++ b/app/core/Engine/controllers/card-controller/types.ts
@@ -0,0 +1,41 @@
+import type {
+  ControllerGetStateAction,
+  ControllerStateChangeEvent,
+} from '@metamask/base-controller';
+import type { Messenger } from '@metamask/messenger';
+import type { Json } from '@metamask/utils';
+
+export const CARD_CONTROLLER_NAME = 'CardController';
+
+// eslint-disable-next-line @typescript-eslint/consistent-type-definitions
+export type CardControllerState = {
+  /** ISO 3166-1 alpha-2 country code selected by the user. */
+  selectedCountry: string | null;
+  /** Active provider ID, derived from selectedCountry. */
+  activeProviderId: string | null;
+  /** Whether the user is authenticated with the active provider. */
+  isAuthenticated: boolean;
+  /** CAIP-10 account IDs that are card holders. */
+  cardholderAccounts: string[];
+  /**
+   * Per-provider persistent data keyed by provider ID.
+   * Values are JSON-serializable objects (e.g. `{ location: 'us' }`).
+   */
+  providerData: Record<string, Record<string, Json>>;
+};
+
+export type CardControllerActions = ControllerGetStateAction<
+  typeof CARD_CONTROLLER_NAME,
+  CardControllerState
+>;
+
+export type CardControllerEvents = ControllerStateChangeEvent<
+  typeof CARD_CONTROLLER_NAME,
+  CardControllerState
+>;
+
+export type CardControllerMessenger = Messenger<
+  typeof CARD_CONTROLLER_NAME,
+  CardControllerActions,
+  CardControllerEvents
+>;
diff --git a/app/core/Engine/controllers/network-controller/utils.test.ts b/app/core/Engine/controllers/network-controller/utils.test.ts
index 2012abf43654..daa59dab5b96 100644
--- a/app/core/Engine/controllers/network-controller/utils.test.ts
+++ b/app/core/Engine/controllers/network-controller/utils.test.ts
@@ -420,6 +420,7 @@ function setQuicknodeEnvironmentVariables() {
   process.env.QUICKNODE_BSC_URL = 'https://example.quicknode.com/bsc';
   process.env.QUICKNODE_SEI_URL = 'https://example.quicknode.com/sei';
   process.env.QUICKNODE_MONAD_URL = 'https://example.quicknode.com/monad';
+  process.env.QUICKNODE_HYPEREVM_URL = 'https://example.quicknode.com/hyperevm';
 }
 
 /**
diff --git a/app/core/Engine/controllers/perps-controller/index.test.ts b/app/core/Engine/controllers/perps-controller/index.test.ts
index a06ded1ccf82..829ff3d2d88c 100644
--- a/app/core/Engine/controllers/perps-controller/index.test.ts
+++ b/app/core/Engine/controllers/perps-controller/index.test.ts
@@ -140,13 +140,8 @@ describe('perps controller init', () => {
       initializationError: null,
       initializationAttempts: 0,
       selectedPaymentToken: null,
-      cachedMarketData: null,
-      cachedMarketDataTimestamp: 0,
-      cachedPositions: null,
-      cachedOrders: null,
-      cachedAccountState: null,
-      cachedUserDataTimestamp: 0,
-      cachedUserDataAddress: null,
+      cachedMarketDataByProvider: {},
+      cachedUserDataByProvider: {},
     };
 
     initRequestMock.persistedState = {
diff --git a/app/core/Engine/controllers/perps-controller/index.ts b/app/core/Engine/controllers/perps-controller/index.ts
index 5e0c9fbc759e..94065a09d552 100644
--- a/app/core/Engine/controllers/perps-controller/index.ts
+++ b/app/core/Engine/controllers/perps-controller/index.ts
@@ -41,6 +41,15 @@ export const perpsControllerInit: ControllerInitFunction<
       fallbackHip3BlocklistMarkets: parseCommaSeparatedString(
         process.env.MM_PERPS_HIP3_BLOCKLIST_MARKETS ?? '',
       ),
+      myxProviderEnabled: process.env.MM_PERPS_MYX_PROVIDER_ENABLED === 'true',
+      myxAppIdTestnet: process.env.MM_PERPS_MYX_APP_ID_TESTNET ?? '',
+      myxApiSecretTestnet: process.env.MM_PERPS_MYX_API_SECRET_TESTNET ?? '',
+      myxBrokerAddressTestnet:
+        process.env.MM_PERPS_MYX_BROKER_ADDRESS_TESTNET ?? '',
+      myxAppIdMainnet: process.env.MM_PERPS_MYX_APP_ID_MAINNET ?? '',
+      myxApiSecretMainnet: process.env.MM_PERPS_MYX_API_SECRET_MAINNET ?? '',
+      myxBrokerAddressMainnet:
+        process.env.MM_PERPS_MYX_BROKER_ADDRESS_MAINNET ?? '',
     },
   });
 
diff --git a/app/core/Engine/controllers/ramps-controller/event-handlers/__snapshots__/analytics.test.ts.snap b/app/core/Engine/controllers/ramps-controller/event-handlers/__snapshots__/analytics.test.ts.snap
new file mode 100644
index 000000000000..18b7e3794de9
--- /dev/null
+++ b/app/core/Engine/controllers/ramps-controller/event-handlers/__snapshots__/analytics.test.ts.snap
@@ -0,0 +1,17 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`handleOrderStatusChangedForMetrics BUY orders tracks ONRAMP_PURCHASE_COMPLETED with calculated exchange rate 1`] = `
+{
+  "amount": 100,
+  "amount_in_usd": 100,
+  "chain_id_destination": "eip155:1",
+  "crypto_out": "0.5",
+  "currency_destination": "ETH",
+  "currency_source": "USD",
+  "exchange_rate": 190,
+  "order_type": "BUY",
+  "payment_method_id": "card-1",
+  "provider_onramp": "Transak",
+  "total_fee": 5,
+}
+`;
diff --git a/app/core/Engine/controllers/ramps-controller/event-handlers/analytics.test.ts b/app/core/Engine/controllers/ramps-controller/event-handlers/analytics.test.ts
new file mode 100644
index 000000000000..e92387e07fec
--- /dev/null
+++ b/app/core/Engine/controllers/ramps-controller/event-handlers/analytics.test.ts
@@ -0,0 +1,275 @@
+import {
+  RampsOrderStatus as Status,
+  type RampsOrder,
+} from '@metamask/ramps-controller';
+import { handleOrderStatusChangedForMetrics } from './analytics';
+
+const mockTrackEvent = jest.fn();
+
+jest.mock('../../../../Analytics', () => ({
+  MetaMetrics: {
+    getInstance: () => ({
+      trackEvent: mockTrackEvent,
+    }),
+  },
+  MetaMetricsEvents: {
+    ONRAMP_PURCHASE_COMPLETED: { category: 'On-ramp Purchase Completed' },
+    ONRAMP_PURCHASE_FAILED: { category: 'On-ramp Purchase Failed' },
+    ONRAMP_PURCHASE_CANCELLED: { category: 'On-ramp Purchase Cancelled' },
+    OFFRAMP_PURCHASE_COMPLETED: { category: 'Off-ramp Purchase Completed' },
+    OFFRAMP_PURCHASE_FAILED: { category: 'Off-ramp Purchase Failed' },
+    OFFRAMP_PURCHASE_CANCELLED: { category: 'Off-ramp Purchase Cancelled' },
+  },
+}));
+
+import Logger from '../../../../../util/Logger';
+
+jest.mock('../../../../../util/Logger', () => ({
+  __esModule: true,
+  default: { error: jest.fn() },
+}));
+
+const createMockOrder = (overrides: Partial<RampsOrder> = {}): RampsOrder => ({
+  isOnlyLink: false,
+  success: true,
+  cryptoAmount: '0.5',
+  fiatAmount: 100,
+  providerOrderId: 'order-1',
+  providerOrderLink: 'https://example.com',
+  createdAt: Date.now(),
+  totalFeesFiat: 5,
+  txHash: '0xabc',
+  walletAddress: '0x123',
+  status: Status.Completed,
+  network: { name: 'Ethereum', chainId: 'eip155:1' },
+  canBeUpdated: false,
+  idHasExpired: false,
+  excludeFromPurchases: false,
+  timeDescriptionPending: '5-10 minutes',
+  orderType: 'BUY',
+  provider: {
+    id: 'transak',
+    name: 'Transak',
+    environmentType: 'PRODUCTION',
+    description: '',
+    hqAddress: '',
+    links: [],
+    logos: { light: '', dark: '', height: 24, width: 79 },
+  },
+  cryptoCurrency: { symbol: 'ETH' },
+  fiatCurrency: { symbol: 'USD' },
+  paymentMethod: { id: 'card-1', name: 'Card' },
+  fiatAmountInUsd: 100,
+  ...overrides,
+});
+
+describe('handleOrderStatusChangedForMetrics', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  describe('BUY orders', () => {
+    it('tracks ONRAMP_PURCHASE_COMPLETED with calculated exchange rate', () => {
+      const order = createMockOrder({ status: Status.Completed });
+
+      handleOrderStatusChangedForMetrics({
+        order,
+        previousStatus: Status.Pending,
+      });
+
+      expect(mockTrackEvent).toHaveBeenCalledTimes(1);
+      const trackedEvent = mockTrackEvent.mock.calls[0][0];
+      expect(trackedEvent.name).toBe('On-ramp Purchase Completed');
+      expect(trackedEvent.properties).toMatchSnapshot();
+    });
+
+    it('tracks ONRAMP_PURCHASE_FAILED for Failed status', () => {
+      const order = createMockOrder({ status: Status.Failed });
+
+      handleOrderStatusChangedForMetrics({
+        order,
+        previousStatus: Status.Pending,
+      });
+
+      expect(mockTrackEvent).toHaveBeenCalledWith(
+        expect.objectContaining({
+          name: 'On-ramp Purchase Failed',
+          properties: expect.objectContaining({ order_type: 'BUY' }),
+        }),
+      );
+    });
+
+    it('tracks ONRAMP_PURCHASE_FAILED for IdExpired status', () => {
+      const order = createMockOrder({ status: Status.IdExpired });
+
+      handleOrderStatusChangedForMetrics({
+        order,
+        previousStatus: Status.Pending,
+      });
+
+      expect(mockTrackEvent).toHaveBeenCalledWith(
+        expect.objectContaining({
+          name: 'On-ramp Purchase Failed',
+          properties: expect.objectContaining({ order_type: 'BUY' }),
+        }),
+      );
+    });
+
+    it('tracks ONRAMP_PURCHASE_CANCELLED', () => {
+      const order = createMockOrder({ status: Status.Cancelled });
+
+      handleOrderStatusChangedForMetrics({
+        order,
+        previousStatus: Status.Pending,
+      });
+
+      expect(mockTrackEvent).toHaveBeenCalledWith(
+        expect.objectContaining({
+          name: 'On-ramp Purchase Cancelled',
+          properties: expect.objectContaining({ order_type: 'BUY' }),
+        }),
+      );
+    });
+  });
+
+  describe('SELL orders', () => {
+    it('tracks OFFRAMP_PURCHASE_COMPLETED', () => {
+      const order = createMockOrder({
+        orderType: 'SELL',
+        status: Status.Completed,
+      });
+
+      handleOrderStatusChangedForMetrics({
+        order,
+        previousStatus: Status.Pending,
+      });
+
+      expect(mockTrackEvent).toHaveBeenCalledWith(
+        expect.objectContaining({
+          name: 'Off-ramp Purchase Completed',
+          properties: expect.objectContaining({
+            order_type: 'SELL',
+            chain_id_source: 'eip155:1',
+            provider_offramp: 'Transak',
+          }),
+        }),
+      );
+    });
+
+    it('tracks OFFRAMP_PURCHASE_FAILED', () => {
+      const order = createMockOrder({
+        orderType: 'SELL',
+        status: Status.Failed,
+      });
+
+      handleOrderStatusChangedForMetrics({
+        order,
+        previousStatus: Status.Pending,
+      });
+
+      expect(mockTrackEvent).toHaveBeenCalledWith(
+        expect.objectContaining({
+          name: 'Off-ramp Purchase Failed',
+          properties: expect.objectContaining({ order_type: 'SELL' }),
+        }),
+      );
+    });
+
+    it('tracks OFFRAMP_PURCHASE_CANCELLED', () => {
+      const order = createMockOrder({
+        orderType: 'SELL',
+        status: Status.Cancelled,
+      });
+
+      handleOrderStatusChangedForMetrics({
+        order,
+        previousStatus: Status.Pending,
+      });
+
+      expect(mockTrackEvent).toHaveBeenCalledWith(
+        expect.objectContaining({
+          name: 'Off-ramp Purchase Cancelled',
+          properties: expect.objectContaining({ order_type: 'SELL' }),
+        }),
+      );
+    });
+  });
+
+  it('does not track for non-terminal statuses', () => {
+    const nonTerminalStatuses = [
+      Status.Pending,
+      Status.Created,
+      Status.Precreated,
+      Status.Unknown,
+    ];
+
+    for (const status of nonTerminalStatuses) {
+      mockTrackEvent.mockClear();
+      const order = createMockOrder({ status });
+
+      handleOrderStatusChangedForMetrics({
+        order,
+        previousStatus: Status.Pending,
+      });
+
+      expect(mockTrackEvent).not.toHaveBeenCalled();
+    }
+  });
+
+  it('handles exchange rate calculation when cryptoAmount is 0', () => {
+    const order = createMockOrder({
+      status: Status.Completed,
+      cryptoAmount: '0',
+    });
+
+    handleOrderStatusChangedForMetrics({
+      order,
+      previousStatus: Status.Pending,
+    });
+
+    const { properties } = mockTrackEvent.mock.calls[0][0];
+    expect(properties.exchange_rate).toBe(0);
+  });
+
+  it('handles missing optional fields gracefully', () => {
+    const order = createMockOrder({
+      status: Status.Completed,
+      provider: undefined,
+      cryptoCurrency: undefined,
+      fiatCurrency: undefined,
+      paymentMethod: undefined,
+    });
+
+    handleOrderStatusChangedForMetrics({
+      order,
+      previousStatus: Status.Pending,
+    });
+
+    expect(mockTrackEvent).toHaveBeenCalledTimes(1);
+    const { properties } = mockTrackEvent.mock.calls[0][0];
+    expect(properties.currency_source).toBe('');
+    expect(properties.provider_onramp).toBe('');
+    expect(properties.payment_method_id).toBe('');
+  });
+
+  it('logs error when trackEvent throws', () => {
+    mockTrackEvent.mockImplementationOnce(() => {
+      throw new Error('tracking failed');
+    });
+
+    const order = createMockOrder({ status: Status.Completed });
+
+    handleOrderStatusChangedForMetrics({
+      order,
+      previousStatus: Status.Pending,
+    });
+
+    expect((Logger as jest.Mocked<typeof Logger>).error).toHaveBeenCalledWith(
+      expect.any(Error),
+      expect.objectContaining({
+        message:
+          'RampsController: Failed to track order status changed analytics',
+      }),
+    );
+  });
+});
diff --git a/app/core/Engine/controllers/ramps-controller/event-handlers/analytics.ts b/app/core/Engine/controllers/ramps-controller/event-handlers/analytics.ts
new file mode 100644
index 000000000000..41949d17de46
--- /dev/null
+++ b/app/core/Engine/controllers/ramps-controller/event-handlers/analytics.ts
@@ -0,0 +1,107 @@
+import {
+  type RampsOrder,
+  type RampsOrderStatus,
+  RampsOrderStatus as Status,
+} from '@metamask/ramps-controller';
+import { MetaMetrics, MetaMetricsEvents } from '../../../../Analytics';
+import { MetricsEventBuilder } from '../../../../Analytics/MetricsEventBuilder';
+import Logger from '../../../../../util/Logger';
+
+function buildV2AnalyticsPayload(
+  order: RampsOrder,
+  _previousStatus: RampsOrderStatus,
+) {
+  const isBuy = order.orderType === 'BUY';
+
+  const baseParams = {
+    amount: order.fiatAmount,
+    currency_source: isBuy
+      ? (order.fiatCurrency?.symbol ?? '')
+      : (order.cryptoCurrency?.symbol ?? ''),
+    currency_destination: isBuy
+      ? (order.cryptoCurrency?.symbol ?? '')
+      : (order.fiatCurrency?.symbol ?? ''),
+    order_type: order.orderType,
+    payment_method_id: order.paymentMethod?.id ?? '',
+    ...(isBuy
+      ? {
+          chain_id_destination: order.network?.chainId ?? '',
+          provider_onramp: order.provider?.name ?? '',
+        }
+      : {
+          chain_id_source: order.network?.chainId ?? '',
+          provider_offramp: order.provider?.name ?? '',
+        }),
+  };
+
+  switch (order.status) {
+    case Status.Completed: {
+      const cryptoAmount = Number(order.cryptoAmount);
+      const feeTotal = Number(order.totalFeesFiat);
+      const exchangeRate =
+        cryptoAmount > 0
+          ? (Number(order.fiatAmount) - feeTotal) / cryptoAmount
+          : 0;
+
+      return {
+        event: isBuy
+          ? MetaMetricsEvents.ONRAMP_PURCHASE_COMPLETED
+          : MetaMetricsEvents.OFFRAMP_PURCHASE_COMPLETED,
+        params: {
+          ...baseParams,
+          total_fee: feeTotal,
+          exchange_rate: exchangeRate,
+          amount_in_usd: order.fiatAmountInUsd,
+          ...(isBuy
+            ? { crypto_out: order.cryptoAmount }
+            : { fiat_out: order.fiatAmount }),
+        },
+      };
+    }
+
+    case Status.Failed:
+    case Status.IdExpired:
+      return {
+        event: isBuy
+          ? MetaMetricsEvents.ONRAMP_PURCHASE_FAILED
+          : MetaMetricsEvents.OFFRAMP_PURCHASE_FAILED,
+        params: baseParams,
+      };
+
+    case Status.Cancelled:
+      return {
+        event: isBuy
+          ? MetaMetricsEvents.ONRAMP_PURCHASE_CANCELLED
+          : MetaMetricsEvents.OFFRAMP_PURCHASE_CANCELLED,
+        params: baseParams,
+      };
+
+    default:
+      return null;
+  }
+}
+
+export function handleOrderStatusChangedForMetrics({
+  order,
+  previousStatus,
+}: {
+  order: RampsOrder;
+  previousStatus: RampsOrderStatus;
+}): void {
+  const analyticsPayload = buildV2AnalyticsPayload(order, previousStatus);
+
+  if (analyticsPayload) {
+    try {
+      MetaMetrics.getInstance().trackEvent(
+        MetricsEventBuilder.createEventBuilder(analyticsPayload.event)
+          .addProperties(analyticsPayload.params)
+          .build(),
+      );
+    } catch (error) {
+      Logger.error(error as Error, {
+        message:
+          'RampsController: Failed to track order status changed analytics',
+      });
+    }
+  }
+}
diff --git a/app/core/Engine/controllers/ramps-controller/event-handlers/notification.test.ts b/app/core/Engine/controllers/ramps-controller/event-handlers/notification.test.ts
new file mode 100644
index 000000000000..024bcccdbad5
--- /dev/null
+++ b/app/core/Engine/controllers/ramps-controller/event-handlers/notification.test.ts
@@ -0,0 +1,130 @@
+import {
+  RampsOrderStatus as Status,
+  type RampsOrder,
+} from '@metamask/ramps-controller';
+import { handleOrderStatusChangedForNotifications } from './notification';
+import { showV2OrderToast } from '../../../../../components/UI/Ramp/utils/v2OrderToast';
+
+jest.mock('../../../../../components/UI/Ramp/utils/v2OrderToast', () => ({
+  showV2OrderToast: jest.fn(),
+}));
+
+const createMockOrder = (overrides: Partial<RampsOrder> = {}): RampsOrder => ({
+  isOnlyLink: false,
+  success: true,
+  cryptoAmount: '0.5',
+  fiatAmount: 100,
+  providerOrderId: 'order-1',
+  providerOrderLink: 'https://example.com',
+  createdAt: Date.now(),
+  totalFeesFiat: 5,
+  txHash: '0xabc',
+  walletAddress: '0x123',
+  status: Status.Completed,
+  network: { name: 'Ethereum', chainId: 'eip155:1' },
+  canBeUpdated: false,
+  idHasExpired: false,
+  excludeFromPurchases: false,
+  timeDescriptionPending: '5-10 minutes',
+  orderType: 'BUY',
+  cryptoCurrency: { symbol: 'ETH' },
+  ...overrides,
+});
+
+describe('handleOrderStatusChangedForNotifications', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  it('calls showV2OrderToast with correct params for Completed status', () => {
+    handleOrderStatusChangedForNotifications({
+      order: createMockOrder({ status: Status.Completed }),
+      previousStatus: Status.Pending,
+    });
+
+    expect(showV2OrderToast).toHaveBeenCalledWith({
+      orderId: 'order-1',
+      cryptocurrency: 'ETH',
+      cryptoAmount: '0.5',
+      status: Status.Completed,
+    });
+  });
+
+  it('calls showV2OrderToast for Failed status', () => {
+    handleOrderStatusChangedForNotifications({
+      order: createMockOrder({ status: Status.Failed }),
+      previousStatus: Status.Pending,
+    });
+
+    expect(showV2OrderToast).toHaveBeenCalledWith(
+      expect.objectContaining({ status: Status.Failed }),
+    );
+  });
+
+  it('calls showV2OrderToast for Cancelled status', () => {
+    handleOrderStatusChangedForNotifications({
+      order: createMockOrder({ status: Status.Cancelled }),
+      previousStatus: Status.Pending,
+    });
+
+    expect(showV2OrderToast).toHaveBeenCalledWith(
+      expect.objectContaining({ status: Status.Cancelled }),
+    );
+  });
+
+  it('calls showV2OrderToast for Pending status', () => {
+    handleOrderStatusChangedForNotifications({
+      order: createMockOrder({ status: Status.Pending }),
+      previousStatus: Status.Created,
+    });
+
+    expect(showV2OrderToast).toHaveBeenCalledWith(
+      expect.objectContaining({ status: Status.Pending }),
+    );
+  });
+
+  it('delegates to showV2OrderToast for all statuses (toast handles no-op internally)', () => {
+    const statuses = [
+      Status.Created,
+      Status.Precreated,
+      Status.Unknown,
+      Status.IdExpired,
+    ];
+
+    for (const status of statuses) {
+      jest.clearAllMocks();
+
+      handleOrderStatusChangedForNotifications({
+        order: createMockOrder({ status }),
+        previousStatus: Status.Unknown,
+      });
+
+      expect(showV2OrderToast).toHaveBeenCalledTimes(1);
+    }
+  });
+
+  it('uses fallback "crypto" when cryptoCurrency is undefined', () => {
+    handleOrderStatusChangedForNotifications({
+      order: createMockOrder({
+        status: Status.Completed,
+        cryptoCurrency: undefined,
+      }),
+      previousStatus: Status.Pending,
+    });
+
+    expect(showV2OrderToast).toHaveBeenCalledWith(
+      expect.objectContaining({ cryptocurrency: 'crypto' }),
+    );
+  });
+
+  it('passes providerOrderId as orderId', () => {
+    handleOrderStatusChangedForNotifications({
+      order: createMockOrder({ providerOrderId: 'my-provider-order-123' }),
+      previousStatus: Status.Pending,
+    });
+
+    expect(showV2OrderToast).toHaveBeenCalledWith(
+      expect.objectContaining({ orderId: 'my-provider-order-123' }),
+    );
+  });
+});
diff --git a/app/core/Engine/controllers/ramps-controller/event-handlers/notification.ts b/app/core/Engine/controllers/ramps-controller/event-handlers/notification.ts
new file mode 100644
index 000000000000..42a8e8d6836d
--- /dev/null
+++ b/app/core/Engine/controllers/ramps-controller/event-handlers/notification.ts
@@ -0,0 +1,19 @@
+import {
+  type RampsOrder,
+  type RampsOrderStatus,
+} from '@metamask/ramps-controller';
+import { showV2OrderToast } from '../../../../../components/UI/Ramp/utils/v2OrderToast';
+
+export function handleOrderStatusChangedForNotifications({
+  order,
+}: {
+  order: RampsOrder;
+  previousStatus: RampsOrderStatus;
+}): void {
+  showV2OrderToast({
+    orderId: order.providerOrderId,
+    cryptocurrency: order.cryptoCurrency?.symbol ?? 'crypto',
+    cryptoAmount: order.cryptoAmount,
+    status: order.status,
+  });
+}
diff --git a/app/core/Engine/controllers/ramps-controller/ramps-controller-init.test.ts b/app/core/Engine/controllers/ramps-controller/ramps-controller-init.test.ts
index 5547b2db476a..a47f66344cfe 100644
--- a/app/core/Engine/controllers/ramps-controller/ramps-controller-init.test.ts
+++ b/app/core/Engine/controllers/ramps-controller/ramps-controller-init.test.ts
@@ -82,6 +82,7 @@ const createMockInitMessenger = (
         },
       },
     }),
+    subscribe: jest.fn(),
   } as unknown as RampsControllerInitMessenger;
 };
 
@@ -176,6 +177,7 @@ describe('ramps controller init', () => {
           },
         },
       },
+      orders: [],
     };
 
     initRequestMock.persistedState = {
diff --git a/app/core/Engine/controllers/ramps-controller/ramps-controller-init.ts b/app/core/Engine/controllers/ramps-controller/ramps-controller-init.ts
index 2336e985e02e..a419253e8fb0 100644
--- a/app/core/Engine/controllers/ramps-controller/ramps-controller-init.ts
+++ b/app/core/Engine/controllers/ramps-controller/ramps-controller-init.ts
@@ -6,6 +6,8 @@ import {
 } from '@metamask/ramps-controller';
 import type { RampsControllerInitMessenger } from '../../messengers/ramps-controller-messenger';
 import { hasMinimumRequiredVersion } from '../../../../components/UI/Ramp/utils/hasMinimumRequiredVersion';
+import { handleOrderStatusChangedForNotifications } from './event-handlers/notification';
+import { handleOrderStatusChangedForMetrics } from './event-handlers/analytics';
 
 interface RampsUnifiedBuyV2Config {
   active?: boolean;
@@ -66,13 +68,26 @@ export const rampsControllerInit: ControllerInitFunction<
   const isV2Enabled = getIsRampsUnifiedBuyV2Enabled(initMessenger);
 
   if (isV2Enabled) {
-    // Initialize controller at app startup (non-blocking)
-    // Defer to next tick to avoid affecting initial state snapshot
-    Promise.resolve().then(() => {
-      controller.init().catch(() => {
+    initMessenger.subscribe(
+      'RampsController:orderStatusChanged',
+      handleOrderStatusChangedForNotifications,
+    );
+
+    initMessenger.subscribe(
+      'RampsController:orderStatusChanged',
+      handleOrderStatusChangedForMetrics,
+    );
+
+    // Start init immediately so tokens (and providers) load on app start.
+    // init() is async and does not block controller creation.
+    controller
+      .init()
+      .then(() => {
+        controller.startOrderPolling();
+      })
+      .catch(() => {
         // Initialization failed - error state will be available via selectors
       });
-    });
   }
 
   return {
diff --git a/app/core/Engine/controllers/ramps-controller/ramps-service-init.test.ts b/app/core/Engine/controllers/ramps-controller/ramps-service-init.test.ts
index 9fbb56e947c5..9f94d0ce9c84 100644
--- a/app/core/Engine/controllers/ramps-controller/ramps-service-init.test.ts
+++ b/app/core/Engine/controllers/ramps-controller/ramps-service-init.test.ts
@@ -27,37 +27,32 @@ jest.mock('@metamask/ramps-controller', () => {
 
 describe('getRampsEnvironment', () => {
   const originalEnv = process.env.METAMASK_ENVIRONMENT;
-  const originalGithubActions = process.env.GITHUB_ACTIONS;
+  const originalBuildsEnabled =
+    process.env.BUILDS_ENABLED_WITH_GH_ACTIONS_TEMPORARY;
   const originalRampsEnvironment = process.env.RAMPS_ENVIRONMENT;
-  const originalE2e = process.env.E2E;
 
   beforeEach(() => {
-    process.env.GITHUB_ACTIONS = 'false';
+    process.env.BUILDS_ENABLED_WITH_GH_ACTIONS_TEMPORARY = 'false';
   });
 
   afterEach(() => {
     process.env.METAMASK_ENVIRONMENT = originalEnv;
-    if (originalGithubActions !== undefined) {
-      process.env.GITHUB_ACTIONS = originalGithubActions;
+    if (originalBuildsEnabled !== undefined) {
+      process.env.BUILDS_ENABLED_WITH_GH_ACTIONS_TEMPORARY =
+        originalBuildsEnabled;
     } else {
-      delete process.env.GITHUB_ACTIONS;
+      delete process.env.BUILDS_ENABLED_WITH_GH_ACTIONS_TEMPORARY;
     }
     if (originalRampsEnvironment !== undefined) {
       process.env.RAMPS_ENVIRONMENT = originalRampsEnvironment;
     } else {
       delete process.env.RAMPS_ENVIRONMENT;
     }
-    if (originalE2e !== undefined) {
-      process.env.E2E = originalE2e;
-    } else {
-      delete process.env.E2E;
-    }
   });
 
-  describe('when GITHUB_ACTIONS (builds.yml path)', () => {
+  describe('when BUILDS_ENABLED_WITH_GH_ACTIONS_TEMPORARY (builds.yml path)', () => {
     beforeEach(() => {
-      process.env.GITHUB_ACTIONS = 'true';
-      delete process.env.E2E;
+      process.env.BUILDS_ENABLED_WITH_GH_ACTIONS_TEMPORARY = 'true';
     });
 
     it('returns Production when RAMPS_ENVIRONMENT is production', () => {
@@ -80,14 +75,6 @@ describe('getRampsEnvironment', () => {
       process.env.RAMPS_ENVIRONMENT = 'staging';
       expect(getRampsEnvironment()).toBe(RampsEnvironment.Staging);
     });
-
-    it('uses METAMASK_ENVIRONMENT when E2E is true (E2E path)', () => {
-      process.env.GITHUB_ACTIONS = 'true';
-      process.env.E2E = 'true';
-      process.env.RAMPS_ENVIRONMENT = 'staging';
-      process.env.METAMASK_ENVIRONMENT = 'production';
-      expect(getRampsEnvironment()).toBe(RampsEnvironment.Production);
-    });
   });
 
   describe('Production Environment', () => {
@@ -167,13 +154,13 @@ describe('rampsServiceInit', () => {
   >;
   const originalEnv = process.env.METAMASK_ENVIRONMENT;
   const originalOS = Platform.OS;
-  const originalGithubActions = process.env.GITHUB_ACTIONS;
+  const originalBuildsEnabled =
+    process.env.BUILDS_ENABLED_WITH_GH_ACTIONS_TEMPORARY;
   const originalRampsEnvironment = process.env.RAMPS_ENVIRONMENT;
-  const originalE2e = process.env.E2E;
 
   beforeEach(() => {
     jest.resetAllMocks();
-    process.env.GITHUB_ACTIONS = 'false';
+    process.env.BUILDS_ENABLED_WITH_GH_ACTIONS_TEMPORARY = 'false';
     const baseControllerMessenger = new ExtendedMessenger<MockAnyNamespace>({
       namespace: MOCK_ANY_NAMESPACE,
     });
@@ -183,21 +170,17 @@ describe('rampsServiceInit', () => {
   afterEach(() => {
     process.env.METAMASK_ENVIRONMENT = originalEnv;
     Platform.OS = originalOS;
-    if (originalGithubActions !== undefined) {
-      process.env.GITHUB_ACTIONS = originalGithubActions;
+    if (originalBuildsEnabled !== undefined) {
+      process.env.BUILDS_ENABLED_WITH_GH_ACTIONS_TEMPORARY =
+        originalBuildsEnabled;
     } else {
-      delete process.env.GITHUB_ACTIONS;
+      delete process.env.BUILDS_ENABLED_WITH_GH_ACTIONS_TEMPORARY;
     }
     if (originalRampsEnvironment !== undefined) {
       process.env.RAMPS_ENVIRONMENT = originalRampsEnvironment;
     } else {
       delete process.env.RAMPS_ENVIRONMENT;
     }
-    if (originalE2e !== undefined) {
-      process.env.E2E = originalE2e;
-    } else {
-      delete process.env.E2E;
-    }
   });
 
   it('returns service instance', () => {
@@ -305,9 +288,9 @@ describe('rampsServiceInit', () => {
     });
   });
 
-  describe('when GITHUB_ACTIONS (builds.yml path)', () => {
+  describe('when BUILDS_ENABLED_WITH_GH_ACTIONS_TEMPORARY (builds.yml path)', () => {
     beforeEach(() => {
-      process.env.GITHUB_ACTIONS = 'true';
+      process.env.BUILDS_ENABLED_WITH_GH_ACTIONS_TEMPORARY = 'true';
       delete process.env.E2E;
     });
 
diff --git a/app/core/Engine/controllers/ramps-controller/ramps-service-init.ts b/app/core/Engine/controllers/ramps-controller/ramps-service-init.ts
index 97d41753ecf1..9fa5264e6645 100644
--- a/app/core/Engine/controllers/ramps-controller/ramps-service-init.ts
+++ b/app/core/Engine/controllers/ramps-controller/ramps-service-init.ts
@@ -7,11 +7,11 @@ import {
 } from '@metamask/ramps-controller';
 
 /**
- * When GITHUB_ACTIONS (and not E2E), uses RAMPS_ENVIRONMENT (set by builds.yml).
+ * When BUILDS_ENABLED_WITH_GH_ACTIONS_TEMPORARY (and not E2E), uses RAMPS_ENVIRONMENT (set by builds.yml).
  * When not (Bitrise / .js.env / E2E), uses METAMASK_ENVIRONMENT switch.
  */
 export function getRampsEnvironment(): RampsEnvironment {
-  if (process.env.GITHUB_ACTIONS === 'true' && process.env.E2E !== 'true') {
+  if (process.env.BUILDS_ENABLED_WITH_GH_ACTIONS_TEMPORARY === 'true') {
     const rampsEnv = process.env.RAMPS_ENVIRONMENT;
     return rampsEnv === 'production'
       ? RampsEnvironment.Production
diff --git a/app/core/Engine/controllers/remote-feature-flag-build-time-defaults-config.ts b/app/core/Engine/controllers/remote-feature-flag-build-time-defaults-config.ts
deleted file mode 100644
index e000d6d43177..000000000000
--- a/app/core/Engine/controllers/remote-feature-flag-build-time-defaults-config.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-/**
- * Config for build-time defaults.
- * Production: uses GITHUB_ACTIONS and E2E. Tests: mock this module to control shouldApply().
- */
-export const buildTimeDefaultsConfig = {
-  shouldApply(): boolean {
-    return process.env.GITHUB_ACTIONS === 'true' && process.env.E2E !== 'true';
-  },
-};
diff --git a/app/core/Engine/controllers/remote-feature-flag-controller-init.test.ts b/app/core/Engine/controllers/remote-feature-flag-controller-init.test.ts
index 54f1f0683666..87af1adc163b 100644
--- a/app/core/Engine/controllers/remote-feature-flag-controller-init.test.ts
+++ b/app/core/Engine/controllers/remote-feature-flag-controller-init.test.ts
@@ -10,13 +10,6 @@ import { ExtendedMessenger } from '../../ExtendedMessenger';
 import { buildControllerInitRequestMock } from '../utils/test-utils';
 import { MOCK_ANY_NAMESPACE, MockAnyNamespace } from '@metamask/messenger';
 import Logger from '../../../util/Logger';
-import { buildTimeDefaultsConfig } from './remote-feature-flag-build-time-defaults-config';
-
-jest.mock('./remote-feature-flag-build-time-defaults-config', () => ({
-  buildTimeDefaultsConfig: {
-    shouldApply: jest.fn(),
-  },
-}));
 
 jest.mock('../../../util/Logger', () => ({
   log: jest.fn(),
@@ -29,12 +22,9 @@ jest.mock('@metamask/remote-feature-flag-controller', () => ({
   })),
 }));
 
-function getInitRequestMock(
-  overrides?: Partial<{
-    persistedState: ControllerInitRequest<RemoteFeatureFlagControllerMessenger>['persistedState'];
-    __testRemoteFeatureFlagDefaultsJson?: string;
-  }>,
-): jest.Mocked<ControllerInitRequest<RemoteFeatureFlagControllerMessenger>> {
+function getInitRequestMock(): jest.Mocked<
+  ControllerInitRequest<RemoteFeatureFlagControllerMessenger>
+> {
   const baseMessenger = new ExtendedMessenger<MockAnyNamespace, never, never>({
     namespace: MOCK_ANY_NAMESPACE,
   });
@@ -43,7 +33,6 @@ function getInitRequestMock(
     ...buildControllerInitRequestMock(baseMessenger),
     controllerMessenger: getRemoteFeatureFlagControllerMessenger(baseMessenger),
     initMessenger: undefined,
-    ...overrides,
   };
 
   // @ts-expect-error: Partial mock.
@@ -74,7 +63,6 @@ describe('remoteFeatureFlagControllerInit', () => {
     const controllerMock = jest.mocked(RemoteFeatureFlagController);
     expect(controllerMock).toHaveBeenCalledWith({
       messenger: expect.any(Object),
-      state: undefined,
       disabled: false,
       getMetaMetricsId: expect.any(Function),
       clientConfigApiService: expect.any(ClientConfigApiService),
@@ -149,127 +137,4 @@ describe('remoteFeatureFlagControllerInit', () => {
       mockError,
     );
   });
-
-  describe('build-time feature flag defaults (builds.yml)', () => {
-    const originalGithubActions = process.env.GITHUB_ACTIONS;
-    const originalE2E = process.env.E2E;
-    const originalRemoteFeatureFlagDefaults =
-      process.env.REMOTE_FEATURE_FLAG_DEFAULTS;
-
-    beforeEach(() => {
-      jest.mocked(RemoteFeatureFlagController).mockClear();
-    });
-
-    afterEach(() => {
-      jest.mocked(buildTimeDefaultsConfig.shouldApply).mockReset();
-      if (originalGithubActions !== undefined) {
-        process.env.GITHUB_ACTIONS = originalGithubActions;
-      } else {
-        delete process.env.GITHUB_ACTIONS;
-      }
-      if (originalE2E !== undefined) {
-        process.env.E2E = originalE2E;
-      } else {
-        delete process.env.E2E;
-      }
-      if (originalRemoteFeatureFlagDefaults !== undefined) {
-        process.env.REMOTE_FEATURE_FLAG_DEFAULTS =
-          originalRemoteFeatureFlagDefaults;
-      } else {
-        delete process.env.REMOTE_FEATURE_FLAG_DEFAULTS;
-      }
-    });
-
-    it('passes persisted state as-is when not in GitHub Actions', () => {
-      jest.mocked(buildTimeDefaultsConfig.shouldApply).mockReturnValue(false);
-      process.env.GITHUB_ACTIONS = 'false';
-      delete process.env.E2E;
-      delete process.env.REMOTE_FEATURE_FLAG_DEFAULTS;
-
-      const persistedState = {
-        RemoteFeatureFlagController: {
-          remoteFeatureFlags: { customFlag: true },
-        },
-      };
-      remoteFeatureFlagControllerInit(
-        getInitRequestMock({
-          persistedState,
-        } as Parameters<typeof getInitRequestMock>[0]),
-      );
-
-      const controllerMock = jest.mocked(RemoteFeatureFlagController);
-      expect(controllerMock).toHaveBeenCalledWith(
-        expect.objectContaining({
-          state: persistedState.RemoteFeatureFlagController,
-        }),
-      );
-    });
-
-    it('merges REMOTE_FEATURE_FLAG_DEFAULTS when GITHUB_ACTIONS is true and E2E is not set', () => {
-      jest.mocked(buildTimeDefaultsConfig.shouldApply).mockReturnValue(true);
-
-      remoteFeatureFlagControllerInit(
-        getInitRequestMock({
-          __testRemoteFeatureFlagDefaultsJson: JSON.stringify({
-            perpsPerpTradingEnabled: true,
-            earnPooledStakingEnabled: false,
-          }),
-        } as Parameters<typeof getInitRequestMock>[0]),
-      );
-
-      const controllerMock = jest.mocked(RemoteFeatureFlagController);
-      const callArg = controllerMock.mock.calls[0][0];
-      expect(callArg.state).toBeDefined();
-      expect(callArg.state?.remoteFeatureFlags).toMatchObject({
-        perpsPerpTradingEnabled: true,
-        earnPooledStakingEnabled: false,
-      });
-    });
-
-    it('passes persisted state as-is when GITHUB_ACTIONS is true and E2E is true', () => {
-      jest.mocked(buildTimeDefaultsConfig.shouldApply).mockReturnValue(false);
-      process.env.GITHUB_ACTIONS = 'true';
-      process.env.E2E = 'true';
-      process.env.REMOTE_FEATURE_FLAG_DEFAULTS = JSON.stringify({
-        perpsPerpTradingEnabled: true,
-      });
-
-      remoteFeatureFlagControllerInit(getInitRequestMock());
-
-      const controllerMock = jest.mocked(RemoteFeatureFlagController);
-      expect(controllerMock).toHaveBeenCalledWith(
-        expect.objectContaining({
-          state: undefined,
-        }),
-      );
-    });
-
-    it('persisted state overrides build-time defaults when both present', () => {
-      jest.mocked(buildTimeDefaultsConfig.shouldApply).mockReturnValue(true);
-
-      const persistedState = {
-        RemoteFeatureFlagController: {
-          remoteFeatureFlags: {
-            perpsPerpTradingEnabled: true,
-          },
-        },
-      };
-      remoteFeatureFlagControllerInit(
-        getInitRequestMock({
-          persistedState,
-          __testRemoteFeatureFlagDefaultsJson: JSON.stringify({
-            perpsPerpTradingEnabled: false,
-            earnPooledStakingEnabled: true,
-          }),
-        } as Parameters<typeof getInitRequestMock>[0]),
-      );
-
-      const controllerMock = jest.mocked(RemoteFeatureFlagController);
-      const callArg = controllerMock.mock.calls[0][0];
-      expect(callArg.state?.remoteFeatureFlags).toMatchObject({
-        perpsPerpTradingEnabled: true,
-        earnPooledStakingEnabled: true,
-      });
-    });
-  });
 });
diff --git a/app/core/Engine/controllers/remote-feature-flag-controller-init.ts b/app/core/Engine/controllers/remote-feature-flag-controller-init.ts
index 4c4b432dcf4b..33e55f2e8cf3 100644
--- a/app/core/Engine/controllers/remote-feature-flag-controller-init.ts
+++ b/app/core/Engine/controllers/remote-feature-flag-controller-init.ts
@@ -4,7 +4,6 @@ import {
   ClientType,
   RemoteFeatureFlagController,
   type RemoteFeatureFlagControllerMessenger,
-  type RemoteFeatureFlagControllerState,
 } from '@metamask/remote-feature-flag-controller';
 import { selectBasicFunctionalityEnabled } from '../../../selectors/settings';
 import AppConstants from '../../AppConstants';
@@ -15,67 +14,6 @@ import {
   isRemoteFeatureFlagOverrideActivated,
 } from './remote-feature-flag-controller';
 import { getBaseSemVerVersion } from '../../../util/version';
-import { buildTimeDefaultsConfig } from './remote-feature-flag-build-time-defaults-config';
-
-/**
- * Get build-time feature flag defaults from environment variable.
- * Set by apply-build-config.js from builds.yml (e.g. in GitHub Actions "Apply build config" step).
- *
- * @returns Parsed defaults object or empty object if unset/invalid.
- */
-function getBuildTimeFeatureFlagDefaults(): Record<string, unknown> {
-  try {
-    const defaults = process.env.REMOTE_FEATURE_FLAG_DEFAULTS;
-    if (defaults) {
-      return JSON.parse(defaults);
-    }
-  } catch (error) {
-    Logger.log('Failed to parse REMOTE_FEATURE_FLAG_DEFAULTS:', error);
-  }
-  return {};
-}
-
-/**
- * Merge build-time defaults with persisted state.
- * Build-time defaults (from builds.yml) are used as initial values; persisted state takes precedence.
- * Only applied when running in GitHub Actions (non-E2E); Bitrise/local unchanged.
- *
- * @param persistedState - Persisted RemoteFeatureFlagController state, if any.
- * @param buildTimeDefaultsJsonOverride - Optional JSON string (e.g. for tests) to use instead of REMOTE_FEATURE_FLAG_DEFAULTS env.
- * @returns State to pass to the controller (merged when GH Actions, else persisted as-is).
- */
-function getInitialState(
-  persistedState: RemoteFeatureFlagControllerState | undefined,
-  buildTimeDefaultsJsonOverride?: string,
-): RemoteFeatureFlagControllerState | undefined {
-  if (!buildTimeDefaultsConfig.shouldApply()) {
-    return persistedState;
-  }
-
-  let buildTimeDefaults: Record<string, unknown>;
-  if (buildTimeDefaultsJsonOverride !== undefined) {
-    try {
-      buildTimeDefaults = JSON.parse(buildTimeDefaultsJsonOverride);
-    } catch {
-      buildTimeDefaults = {};
-    }
-  } else {
-    buildTimeDefaults = getBuildTimeFeatureFlagDefaults();
-  }
-  if (Object.keys(buildTimeDefaults).length === 0) {
-    return persistedState;
-  }
-
-  const mergedRemoteFeatureFlags = {
-    ...buildTimeDefaults,
-    ...(persistedState?.remoteFeatureFlags ?? {}),
-  };
-
-  return {
-    ...persistedState,
-    remoteFeatureFlags: mergedRemoteFeatureFlags,
-  } as RemoteFeatureFlagControllerState;
-}
 
 /**
  * Initialize the remote feature flag controller.
@@ -87,27 +25,18 @@ function getInitialState(
 export const remoteFeatureFlagControllerInit: ControllerInitFunction<
   RemoteFeatureFlagController,
   RemoteFeatureFlagControllerMessenger
-> = (request) => {
-  const { controllerMessenger, persistedState, getState, analyticsId } =
-    request;
+> = ({ controllerMessenger, persistedState, getState, analyticsId }) => {
   const disabled = !selectBasicFunctionalityEnabled(getState());
-
-  // Test-only: inject build-time defaults JSON so tests need not rely on process.env
-  const testDefaultsJson = (request as Record<string, unknown>)
-    .__testRemoteFeatureFlagDefaultsJson as string | undefined;
-  const initialState = getInitialState(
-    persistedState.RemoteFeatureFlagController as
-      | RemoteFeatureFlagControllerState
-      | undefined,
-    testDefaultsJson,
-  );
+  const prevClientVersion =
+    persistedState?.AppMetadataController?.currentAppVersion;
 
   const controller = new RemoteFeatureFlagController({
     messenger: controllerMessenger,
-    state: initialState,
+    state: persistedState.RemoteFeatureFlagController,
     disabled,
     getMetaMetricsId: () => analyticsId,
     clientVersion: getBaseSemVerVersion(),
+    prevClientVersion,
     clientConfigApiService: new ClientConfigApiService({
       fetch,
       config: {
diff --git a/app/core/Engine/controllers/rewards-controller/RewardsController.test.ts b/app/core/Engine/controllers/rewards-controller/RewardsController.test.ts
index 698fd02a73ec..078318e5edba 100644
--- a/app/core/Engine/controllers/rewards-controller/RewardsController.test.ts
+++ b/app/core/Engine/controllers/rewards-controller/RewardsController.test.ts
@@ -2459,11 +2459,6 @@ describe('RewardsController', () => {
       await expect(controller.getPointsEvents(mockRequest)).rejects.toThrow(
         'API error',
       );
-
-      expect(mockLogger.log).toHaveBeenCalledWith(
-        'RewardsController: Failed to get points events:',
-        'API error',
-      );
     });
 
     describe('balance updated event emission', () => {
@@ -4997,9 +4992,10 @@ describe('RewardsController', () => {
 
     it('reauthenticates and retries after 403 error', async () => {
       // Arrange
+      mockStoreSubscriptionToken.mockResolvedValue({ success: true });
       jest.spyOn(Date, 'now').mockImplementation(() => 1000000);
       const mock403Error = new AuthorizationFailedError(
-        'Rewards authorization failed. Please login and try again.',
+        'Authorization failed: 403',
       );
       const mockAccount = {
         id: 'test-account-id',
@@ -5127,17 +5123,14 @@ describe('RewardsController', () => {
         }),
       );
       expect(mockLogger.log).toHaveBeenCalledWith(
-        'RewardsController: Attempting to reauth with a valid account after 403 error',
-      );
-      expect(mockLogger.log).toHaveBeenCalledWith(
-        'RewardsController: Successfully fetched season status after reauth',
+        'RewardsController: Attempting reauth with active account after 403',
       );
     });
 
     it('handles 403 error, reauth, and re-throw error if reauth failed', async () => {
       // Arrange
       const mock403Error = new AuthorizationFailedError(
-        'Rewards authorization failed. Please login and try again.',
+        'Authorization failed: 403',
       );
       const mockReauthError = new Error('Reauth failed');
       const mockAccount = {
@@ -5198,12 +5191,10 @@ describe('RewardsController', () => {
         state.pointsEvents = {};
       });
 
-      // Mock the messenger calls
-      let getSeasonStatusCallCount = 0;
+      // Mock the messenger calls — login rejects to simulate reauth failure
       localMockMessenger.call.mockImplementation(
         async (method, ..._args): Promise<any> => {
           if (method === 'RewardsDataService:getSeasonStatus') {
-            getSeasonStatusCallCount++;
             return Promise.reject(mock403Error);
           }
           if (method === 'AccountsController:getSelectedMultichainAccount') {
@@ -5219,22 +5210,14 @@ describe('RewardsController', () => {
         },
       );
 
-      const invalidateSubscriptionCacheSpy = jest.spyOn(
-        testableController,
-        'invalidateSubscriptionCache' as any,
-      );
-      const invalidateSubscriptionAndAccountsSpy = jest.spyOn(
-        testableController,
-        'invalidateSubscriptionAndAccounts' as any,
-      );
-
-      // Act & Assert
+      // Act & Assert — reauth login fails (silently absorbed by performSilentAuth),
+      // performReauthForSubscription throws, caches are invalidated, and the
+      // reauth error propagates (retry is never reached)
       await expect(
         testableController.getSeasonStatus(mockSubscriptionId, mockSeasonId),
-      ).rejects.toThrow(mock403Error);
+      ).rejects.toThrow(`Reauth failed for subscription ${mockSubscriptionId}`);
 
-      // Verify reauth was attempted and status was fetched again
-      expect(getSeasonStatusCallCount).toBe(2);
+      // Verify reauth was attempted
       expect(localMockMessenger.call).toHaveBeenCalledWith(
         'AccountsController:getSelectedMultichainAccount',
       );
@@ -5245,25 +5228,16 @@ describe('RewardsController', () => {
         }),
       );
       expect(mockLogger.log).toHaveBeenCalledWith(
-        'RewardsController: Attempting to reauth with a valid account after 403 error',
-      );
-      expect(mockLogger.log).toHaveBeenCalledWith(
-        'RewardsController: Failed to reauth with a valid account after 403 error',
-        mock403Error.message,
-      );
-      expect(invalidateSubscriptionCacheSpy).toHaveBeenCalledWith(
-        mockSubscriptionId,
-      );
-      expect(invalidateSubscriptionAndAccountsSpy).toHaveBeenCalledWith(
-        mockSubscriptionId,
+        'RewardsController: Attempting reauth with active account after 403',
       );
     });
 
     it('reauthenticates with active account and retries after 403 error', async () => {
       // Arrange
+      mockStoreSubscriptionToken.mockResolvedValue({ success: true });
       jest.spyOn(Date, 'now').mockImplementation(() => 1000000);
       const mock403Error = new AuthorizationFailedError(
-        'Rewards authorization failed. Please login and try again.',
+        'Authorization failed: 403',
       );
       const mockAccount = {
         id: 'test-account-id',
@@ -5403,18 +5377,16 @@ describe('RewardsController', () => {
         }),
       );
       expect(mockLogger.log).toHaveBeenCalledWith(
-        'RewardsController: Attempting to reauth with a valid account after 403 error',
-      );
-      expect(mockLogger.log).toHaveBeenCalledWith(
-        'RewardsController: Successfully fetched season status after reauth',
+        'RewardsController: Attempting reauth with active account after 403',
       );
     });
 
     it('reauthenticates with non-active account and retries after 403 error', async () => {
       // Arrange
+      mockStoreSubscriptionToken.mockResolvedValue({ success: true });
       jest.spyOn(Date, 'now').mockImplementation(() => 1000000);
       const mock403Error = new AuthorizationFailedError(
-        'Rewards authorization failed. Please login and try again.',
+        'Authorization failed: 403',
       );
       const mockAccount = {
         id: 'test-account-id-2',
@@ -5562,17 +5534,14 @@ describe('RewardsController', () => {
         }),
       );
       expect(mockLogger.log).toHaveBeenCalledWith(
-        'RewardsController: Attempting to reauth with a valid account after 403 error',
-      );
-      expect(mockLogger.log).toHaveBeenCalledWith(
-        'RewardsController: Successfully fetched season status after reauth',
+        'RewardsController: Attempting reauth with active account after 403',
       );
     });
 
     it('throws authorization error when account for subscription not found after 403', async () => {
       // Arrange
       const mock403Error = new AuthorizationFailedError(
-        'Rewards authorization failed. Please login and try again.',
+        'Authorization failed: 403',
       );
       const testSubscriptionId = 'test-sub-id';
 
@@ -5664,7 +5633,7 @@ describe('RewardsController', () => {
     it('throws authorization error when converted account not found after 403', async () => {
       // Arrange
       const mock403Error = new AuthorizationFailedError(
-        'Rewards authorization failed. Please login and try again.',
+        'Authorization failed: 403',
       );
       const testSubscriptionId = 'test-sub-id';
       const mockAccount = {
@@ -5772,7 +5741,7 @@ describe('RewardsController', () => {
     it('throws authorization error when accounts state is undefined after 403', async () => {
       // Arrange
       const mock403Error = new AuthorizationFailedError(
-        'Rewards authorization failed. Please login and try again.',
+        'Authorization failed: 403',
       );
 
       const localMockMessenger = {
@@ -5852,7 +5821,7 @@ describe('RewardsController', () => {
     it('throws authorization error when accounts state is empty after 403', async () => {
       // Arrange
       const mock403Error = new AuthorizationFailedError(
-        'Rewards authorization failed. Please login and try again.',
+        'Authorization failed: 403',
       );
 
       const localMockMessenger = {
@@ -6878,13 +6847,9 @@ describe('RewardsController', () => {
       await expect(
         controller.getReferralDetails(mockSubscriptionId, mockSeasonId),
       ).rejects.toThrow('API connection failed');
-      expect(mockLogger.log).toHaveBeenCalledWith(
-        'RewardsController: Failed to get referral details:',
-        'API connection failed',
-      );
     });
 
-    it('logs and rethrows non-Error objects when API call fails', async () => {
+    it('rethrows non-Error objects when API call fails', async () => {
       controller = new RewardsController({
         messenger: mockMessenger,
         state: {
@@ -6913,10 +6878,6 @@ describe('RewardsController', () => {
       await expect(
         controller.getReferralDetails(mockSubscriptionId, mockSeasonId),
       ).rejects.toEqual(404);
-      expect(mockLogger.log).toHaveBeenCalledWith(
-        'RewardsController: Failed to get referral details:',
-        '404',
-      );
     });
   });
 
@@ -14799,6 +14760,134 @@ describe('RewardsController', () => {
         'boost-B-Y',
       );
     });
+
+    it('reauthenticates and retries after 403 error on active boosts', async () => {
+      mockStoreSubscriptionToken.mockResolvedValue({ success: true });
+      const seasonId = 'season-123';
+      const subscriptionId = 'sub-456';
+      const mock403Error = new AuthorizationFailedError(
+        'Authorization failed: 403',
+      );
+      const mockAccount = {
+        id: 'test-account-id',
+        address: '0x123',
+        name: 'Test Account',
+        type: 'eip155:eoa',
+        options: {},
+        metadata: {},
+      };
+      const mockLoginResponse = {
+        subscription: { id: subscriptionId },
+      };
+      const mockBoosts = {
+        boosts: [
+          {
+            id: 'boost-1',
+            name: 'Test Boost',
+            icon: {
+              lightModeUrl: 'https://example.com/light.png',
+              darkModeUrl: 'https://example.com/dark.png',
+            },
+            boostBips: 500,
+            seasonLong: false,
+            backgroundColor: '#00FF00',
+          },
+        ],
+      };
+
+      const localMockMessenger = {
+        subscribe: jest.fn(),
+        call: jest.fn(),
+        registerActionHandler: jest.fn(),
+        unregisterActionHandler: jest.fn(),
+        publish: jest.fn(),
+        clearEventSubscriptions: jest.fn(),
+        registerInitialEventPayload: jest.fn(),
+        unsubscribe: jest.fn(),
+      } as unknown as jest.Mocked<RewardsControllerMessenger>;
+
+      const testableController = new TestableRewardsController({
+        messenger: localMockMessenger,
+        isDisabled: () => false,
+      });
+      testableController.testUpdate((state) => {
+        state.activeAccount = {
+          subscriptionId,
+          account: 'eip155:1:0x123',
+          hasOptedIn: true,
+          perpsFeeDiscount: null,
+          lastPerpsDiscountRateFetched: null,
+        };
+        state.accounts = {};
+        state.subscriptions = {
+          [subscriptionId]: {
+            id: subscriptionId,
+            referralCode: 'REF123',
+            accounts: [],
+          },
+        };
+      });
+
+      let getBoostsCallCount = 0;
+      localMockMessenger.call.mockImplementation(
+        async (method, ..._args): Promise<any> => {
+          if (method === 'RewardsDataService:getActivePointsBoosts') {
+            getBoostsCallCount++;
+            if (getBoostsCallCount === 1) {
+              return Promise.reject(mock403Error);
+            }
+            return mockBoosts;
+          }
+          if (method === 'AccountsController:getSelectedMultichainAccount') {
+            return mockAccount;
+          }
+          if (method === 'KeyringController:signPersonalMessage') {
+            return 'mock-signature';
+          }
+          if (method === 'RewardsDataService:login') {
+            return mockLoginResponse;
+          }
+          return undefined;
+        },
+      );
+
+      // Act
+      const result = await testableController.getActivePointsBoosts(
+        seasonId,
+        subscriptionId,
+      );
+
+      // Assert — retried successfully after reauth
+      expect(getBoostsCallCount).toBe(2);
+      expect(result).toHaveLength(1);
+      expect(result[0].id).toBe('boost-1');
+      expect(localMockMessenger.call).toHaveBeenCalledWith(
+        'AccountsController:getSelectedMultichainAccount',
+      );
+      expect(localMockMessenger.call).toHaveBeenCalledWith(
+        'RewardsDataService:login',
+        expect.objectContaining({
+          account: mockAccount.address,
+        }),
+      );
+    });
+
+    it('does not retry on non-403 errors', async () => {
+      const seasonId = 'season-123';
+      const subscriptionId = 'sub-456';
+      const genericError = new Error('Network error');
+
+      mockMessenger.call.mockRejectedValue(genericError);
+
+      await expect(
+        controller.getActivePointsBoosts(seasonId, subscriptionId),
+      ).rejects.toThrow('Network error');
+
+      // Should NOT attempt reauth for non-403 errors
+      expect(mockMessenger.call).not.toHaveBeenCalledWith(
+        'AccountsController:getSelectedMultichainAccount',
+      );
+    });
   });
 
   describe('getUnlockedRewards', () => {
@@ -18619,11 +18708,6 @@ describe('RewardsController', () => {
       await expect(
         controller.getSnapshots(mockSeasonId, mockSubscriptionId),
       ).rejects.toThrow('Network timeout');
-
-      expect(mockLogger.log).toHaveBeenCalledWith(
-        'RewardsController: Failed to get snapshots:',
-        'Network timeout',
-      );
     });
 
     it('logs when fetching fresh snapshots data', async () => {
diff --git a/app/core/Engine/controllers/rewards-controller/RewardsController.ts b/app/core/Engine/controllers/rewards-controller/RewardsController.ts
index d4c8afac526a..9c26aad66b73 100644
--- a/app/core/Engine/controllers/rewards-controller/RewardsController.ts
+++ b/app/core/Engine/controllers/rewards-controller/RewardsController.ts
@@ -292,6 +292,7 @@ export class RewardsController extends BaseController<
   #isBitcoinOptinEnabled: () => boolean;
   #isTronOptinEnabled: () => boolean;
   #isSnapshotsEnabled: () => boolean;
+  #reauthPromises: Map<string, Promise<void>> = new Map();
 
   /**
    * Calculate tier status and next tier information
@@ -823,6 +824,113 @@ export class RewardsController extends BaseController<
     });
   }
 
+  /**
+   * Re-authenticate the account linked to a given subscription.
+   * Resolves the matching InternalAccount and calls performSilentAuth.
+   */
+  async #performReauthForSubscription(subscriptionId: string): Promise<void> {
+    await removeSubscriptionToken(subscriptionId);
+
+    if (this.state.activeAccount?.subscriptionId === subscriptionId) {
+      const account = await this.messenger.call(
+        'AccountsController:getSelectedMultichainAccount',
+      );
+      if (this.isOptInSupported(account as InternalAccount)) {
+        Logger.log(
+          'RewardsController: Attempting reauth with active account after 403',
+        );
+        const result = await this.performSilentAuth(account, false, false);
+        if (!result) {
+          throw new Error(`Reauth failed for subscription ${subscriptionId}`);
+        }
+        return;
+      }
+    }
+
+    // Active account can't sign (e.g. hardware wallet) or doesn't match —
+    // find any software account linked to this subscription.
+    if (this.state.accounts && Object.values(this.state.accounts).length > 0) {
+      const allLinkedAccounts = Object.values(this.state.accounts).filter(
+        (acc) => acc.subscriptionId === subscriptionId,
+      );
+      if (allLinkedAccounts.length > 0) {
+        const accounts = await this.messenger.call(
+          'AccountsController:listMultichainAccounts',
+        );
+        for (const linkedAccount of allLinkedAccounts) {
+          const intAccount = accounts.find((acc: InternalAccount) => {
+            const accCaipId = this.convertInternalAccountToCaipAccountId(acc);
+            return accCaipId === linkedAccount.account;
+          });
+          if (intAccount && this.isOptInSupported(intAccount)) {
+            Logger.log(
+              'RewardsController: Attempting reauth with linked account after 403',
+            );
+            const result = await this.performSilentAuth(
+              intAccount as InternalAccount,
+              false,
+              false,
+            );
+            if (!result) {
+              throw new Error(
+                `Reauth failed for subscription ${subscriptionId}`,
+              );
+            }
+            return;
+          }
+        }
+      }
+    }
+
+    throw new Error(
+      `No signable account found for subscription ${subscriptionId} to reauth`,
+    );
+  }
+
+  /**
+   * Wrap an authenticated async call with automatic 403 retry.
+   * On AuthorizationFailedError, coalesces concurrent reauths into a single
+   * performSilentAuth call, then retries the original function once.
+   */
+  async #withAuthRetry<T>(
+    fn: () => Promise<T>,
+    subscriptionId: string,
+  ): Promise<T> {
+    try {
+      return await fn();
+    } catch (error) {
+      if (!(error instanceof AuthorizationFailedError)) throw error;
+
+      if (!this.#reauthPromises.has(subscriptionId)) {
+        Logger.log(
+          'RewardsController: 403 detected, initiating reauth for subscription',
+          subscriptionId,
+        );
+        const promise = this.#performReauthForSubscription(
+          subscriptionId,
+        ).finally(() => {
+          this.#reauthPromises.delete(subscriptionId);
+        });
+        this.#reauthPromises.set(subscriptionId, promise);
+      } else {
+        Logger.log(
+          'RewardsController: 403 detected, reauth already in progress for subscription',
+          subscriptionId,
+        );
+      }
+
+      try {
+        await this.#reauthPromises.get(subscriptionId);
+      } catch (reauthError) {
+        this.invalidateSubscriptionCache(subscriptionId);
+        await this.invalidateSubscriptionAndAccounts(subscriptionId);
+        throw reauthError;
+      }
+
+      return await fn();
+    }
+  }
+
   /**
    * Handle authentication triggers (account changes, keyring unlock)
    */
@@ -1589,16 +1697,19 @@ export class RewardsController extends BaseController<
 
     // If cursor is provided, always fetch fresh and do not touch cache
     if (params.cursor) {
-      const dto = await this.messenger.call(
-        'RewardsDataService:getPointsEvents',
-        params,
+      const dto = await this.#withAuthRetry(
+        () => this.messenger.call('RewardsDataService:getPointsEvents', params),
+        params.subscriptionId,
       );
       this.triggerBalanceUpdateIfNeeded(dto, params);
       return dto;
     }
 
     if (params.forceFresh) {
-      const dto = await this.getPointsEventsIfChanged(params);
+      const dto = await this.#withAuthRetry(
+        () => this.getPointsEventsIfChanged(params),
+        params.subscriptionId,
+      );
       this.triggerBalanceUpdateIfNeeded(dto, params);
       return dto;
     }
@@ -1625,8 +1736,8 @@ export class RewardsController extends BaseController<
             }
           : undefined;
       },
-      fetchFresh: async () => {
-        try {
+      fetchFresh: async () =>
+        this.#withAuthRetry(async () => {
           Logger.log(
             'RewardsController: Fetching fresh points events data via API call for seasonId & subscriptionId & type & page cursor',
             {
@@ -1639,14 +1750,7 @@ export class RewardsController extends BaseController<
           const pointsEvents = await this.getPointsEventsIfChanged(params);
           this.triggerBalanceUpdateIfNeeded(pointsEvents, params);
           return pointsEvents;
-        } catch (error) {
-          Logger.log(
-            'RewardsController: Failed to get points events:',
-            error instanceof Error ? error.message : String(error),
-          );
-          throw error;
-        }
-      },
+        }, params.subscriptionId),
       writeCache: (key, pointsEventsDto) => {
         this.update((state: RewardsControllerState) => {
           state.pointsEvents[key] =
@@ -1720,11 +1824,14 @@ export class RewardsController extends BaseController<
       'RewardsController: Getting fresh points events last updated for seasonId & subscriptionId',
       params,
     );
-    const result = await this.messenger.call(
-      'RewardsDataService:getPointsEventsLastUpdated',
-      params,
+    return this.#withAuthRetry(
+      () =>
+        this.messenger.call(
+          'RewardsDataService:getPointsEventsLastUpdated',
+          params,
+        ),
+      params.subscriptionId,
     );
-    return result;
   }
 
   /**
@@ -2045,110 +2152,40 @@ export class RewardsController extends BaseController<
         if (!cached) return;
         return { payload: cached, lastFetched: cached.lastFetched };
       },
-      fetchFresh: async () => {
-        try {
-          Logger.log(
-            'RewardsController: Fetching fresh season status data via API call for subscriptionId & seasonId',
-            subscriptionId,
-            seasonId,
-          );
-
-          // Now fetch season status (balance, currentTierId, etc.)
-          const seasonState = await this.messenger.call(
-            'RewardsDataService:getSeasonStatus',
-            seasonId,
-            subscriptionId,
-          );
-
-          // Combine all data into SeasonStatusDto
-          const seasonStatus = this.convertToSeasonStatusDto(
-            season,
-            seasonState,
-          );
-          return this.#convertSeasonStatusToSubscriptionState(seasonStatus);
-        } catch (error) {
-          if (error instanceof AuthorizationFailedError) {
-            // Attempt to reauth with a valid account.
-            try {
-              if (this.state.activeAccount?.subscriptionId === subscriptionId) {
-                const account = await this.messenger.call(
-                  'AccountsController:getSelectedMultichainAccount',
-                );
-                Logger.log(
-                  'RewardsController: Attempting to reauth with a valid account after 403 error',
-                );
-                await this.performSilentAuth(account, false, false); // try and auth.
-              } else if (
-                this.state.accounts &&
-                Object.values(this.state.accounts).length > 0
-              ) {
-                const accountForSub = Object.values(this.state.accounts).find(
-                  (acc) => acc.subscriptionId === subscriptionId,
-                );
-                if (accountForSub) {
-                  const accounts = await this.messenger.call(
-                    'AccountsController:listMultichainAccounts',
-                  );
-                  const convertInternalAccountToCaipAccountId =
-                    this.convertInternalAccountToCaipAccountId;
-                  const intAccountForSub = accounts.find(
-                    (acc: InternalAccount) => {
-                      const accCaipId =
-                        convertInternalAccountToCaipAccountId(acc);
-                      return accCaipId === accountForSub.account;
-                    },
-                  );
-                  if (intAccountForSub) {
-                    Logger.log(
-                      'RewardsController: Attempting to reauth with any valid account after 403 error',
-                    );
-                    await this.performSilentAuth(
-                      intAccountForSub as InternalAccount,
-                      false,
-                      false,
-                    );
-                  }
-                }
-              }
-              // Now fetch season status (balance, currentTierId, etc.)
-              const seasonState = await this.messenger.call(
-                'RewardsDataService:getSeasonStatus',
-                season.id,
-                subscriptionId,
-              );
+      fetchFresh: async () =>
+        this.#withAuthRetry(async () => {
+          try {
+            Logger.log(
+              'RewardsController: Fetching fresh season status data via API call for subscriptionId & seasonId',
+              subscriptionId,
+              seasonId,
+            );
 
-              // Combine all data into SeasonStatusDto
-              const seasonStatus = this.convertToSeasonStatusDto(
-                season,
-                seasonState,
-              );
+            const seasonState = await this.messenger.call(
+              'RewardsDataService:getSeasonStatus',
+              seasonId,
+              subscriptionId,
+            );
 
-              Logger.log(
-                'RewardsController: Successfully fetched season status after reauth',
-              );
-              return this.#convertSeasonStatusToSubscriptionState(seasonStatus);
-            } catch {
-              Logger.log(
-                'RewardsController: Failed to reauth with a valid account after 403 error',
-                error instanceof Error ? error.message : String(error),
-              );
-              this.invalidateSubscriptionCache(subscriptionId);
-              await this.invalidateSubscriptionAndAccounts(subscriptionId);
+            const seasonStatus = this.convertToSeasonStatusDto(
+              season,
+              seasonState,
+            );
+            return this.#convertSeasonStatusToSubscriptionState(seasonStatus);
+          } catch (error) {
+            if (error instanceof SeasonNotFoundError) {
+              this.update((state: RewardsControllerState) => {
+                state.seasons = {};
+              });
               throw error;
             }
-          } else if (error instanceof SeasonNotFoundError) {
-            this.update((state: RewardsControllerState) => {
-              state.seasons = {};
-            });
+            Logger.log(
+              'RewardsController: Failed to get season status:',
+              error instanceof Error ? error.message : String(error),
+            );
             throw error;
           }
-          Logger.log(
-            'RewardsController: Failed to get season status:',
-            error instanceof Error ? error.message : String(error),
-          );
-          throw error;
-        }
-      },
+        }, subscriptionId),
       writeCache: (key, subscriptionSeasonStatus) => {
         this.update((state: RewardsControllerState) => {
           // Update season status with composite key
@@ -2234,8 +2271,8 @@ export class RewardsController extends BaseController<
         if (!cached) return;
         return { payload: cached, lastFetched: cached.lastFetched };
       },
-      fetchFresh: async () => {
-        try {
+      fetchFresh: async () =>
+        this.#withAuthRetry(async () => {
           Logger.log(
             'RewardsController: Fetching fresh referral details data via API call for',
             { subscriptionId, seasonId },
@@ -2252,14 +2289,7 @@ export class RewardsController extends BaseController<
             referredByCode: referralDetails.referredByCode,
             lastFetched: Date.now(),
           };
-        } catch (error) {
-          Logger.log(
-            'RewardsController: Failed to get referral details:',
-            error instanceof Error ? error.message : String(error),
-          );
-          throw error;
-        }
-      },
+        }, subscriptionId),
       writeCache: (key, payload) => {
         this.update((state: RewardsControllerState) => {
           state.subscriptionReferralDetails[key] = payload;
@@ -2701,9 +2731,13 @@ export class RewardsController extends BaseController<
     }
 
     try {
-      const response = await this.messenger.call(
-        'RewardsDataService:validateBonusCode',
-        code,
+      const response = await this.#withAuthRetry(
+        () =>
+          this.messenger.call(
+            'RewardsDataService:validateBonusCode',
+            code,
+            subscriptionId,
+          ),
         subscriptionId,
       );
       return response.valid;
@@ -3081,8 +3115,8 @@ export class RewardsController extends BaseController<
       }
 
       // Call the opt-out endpoint
-      const result = await this.messenger.call(
-        'RewardsDataService:optOut',
+      const result = await this.#withAuthRetry(
+        () => this.messenger.call('RewardsDataService:optOut', subscriptionId),
         subscriptionId,
       );
 
@@ -3135,8 +3169,8 @@ export class RewardsController extends BaseController<
           lastFetched: cachedActiveBoosts.lastFetched,
         };
       },
-      fetchFresh: async () => {
-        try {
+      fetchFresh: async () =>
+        this.#withAuthRetry(async () => {
           Logger.log(
             'RewardsController: Fetching fresh active boosts data via API call for subscriptionId & seasonId',
             subscriptionId,
@@ -3148,14 +3182,7 @@ export class RewardsController extends BaseController<
             subscriptionId,
           );
           return response.boosts;
-        } catch (error) {
-          Logger.log(
-            'RewardsController: Failed to get active points boosts:',
-            error instanceof Error ? error.message : String(error),
-          );
-          throw error;
-        }
-      },
+        }, subscriptionId),
       writeCache: (key, payload) => {
         this.update((state: RewardsControllerState) => {
           state.activeBoosts[key] = {
@@ -3195,8 +3222,8 @@ export class RewardsController extends BaseController<
           lastFetched: cachedUnlockedRewards.lastFetched,
         };
       },
-      fetchFresh: async () => {
-        try {
+      fetchFresh: async () =>
+        this.#withAuthRetry(async () => {
           Logger.log(
             'RewardsController: Fetching fresh unlocked rewards data via API call for subscriptionId & seasonId',
             subscriptionId,
@@ -3208,14 +3235,7 @@ export class RewardsController extends BaseController<
             subscriptionId,
           )) as RewardDto[];
           return response || [];
-        } catch (error) {
-          Logger.log(
-            'RewardsController: Failed to get unlocked rewards:',
-            error instanceof Error ? error.message : String(error),
-          );
-          throw error;
-        }
-      },
+        }, subscriptionId),
       writeCache: (key, payload) => {
         this.update((state: RewardsControllerState) => {
           state.unlockedRewards[key] = {
@@ -3257,8 +3277,8 @@ export class RewardsController extends BaseController<
           lastFetched: cachedSnapshots.lastFetched,
         };
       },
-      fetchFresh: async () => {
-        try {
+      fetchFresh: async () =>
+        this.#withAuthRetry(async () => {
           Logger.log(
             'RewardsController: Fetching fresh snapshots data via API call for seasonId',
             seasonId,
@@ -3269,14 +3289,7 @@ export class RewardsController extends BaseController<
             subscriptionId,
           )) as SnapshotDto[];
           return response || [];
-        } catch (error) {
-          Logger.log(
-            'RewardsController: Failed to get snapshots:',
-            error instanceof Error ? error.message : String(error),
-          );
-          throw error;
-        }
-      },
+        }, subscriptionId),
       writeCache: (key, payload) => {
         this.update((state: RewardsControllerState) => {
           state.snapshots[key] = {
@@ -3306,11 +3319,15 @@ export class RewardsController extends BaseController<
       throw new Error('Rewards are not enabled');
     }
     try {
-      await this.messenger.call(
-        'RewardsDataService:claimReward',
-        rewardId,
+      await this.#withAuthRetry(
+        () =>
+          this.messenger.call(
+            'RewardsDataService:claimReward',
+            rewardId,
+            subscriptionId,
+            dto,
+          ),
         subscriptionId,
-        dto,
       );
 
       // Invalidate cache for the active subscription
@@ -3349,8 +3366,12 @@ export class RewardsController extends BaseController<
     }
 
     try {
-      const result = await this.messenger.call(
-        'RewardsDataService:getSeasonOneLineaRewardTokens',
+      const result = await this.#withAuthRetry(
+        () =>
+          this.messenger.call(
+            'RewardsDataService:getSeasonOneLineaRewardTokens',
+            subscriptionId,
+          ),
         subscriptionId,
       );
       return result;
@@ -3380,9 +3401,13 @@ export class RewardsController extends BaseController<
     }
 
     try {
-      await this.messenger.call(
-        'RewardsDataService:applyReferralCode',
-        { referralCode },
+      await this.#withAuthRetry(
+        () =>
+          this.messenger.call(
+            'RewardsDataService:applyReferralCode',
+            { referralCode },
+            subscriptionId,
+          ),
         subscriptionId,
       );
 
@@ -3419,9 +3444,13 @@ export class RewardsController extends BaseController<
     }
 
     try {
-      await this.messenger.call(
-        'RewardsDataService:applyBonusCode',
-        { bonusCode },
+      await this.#withAuthRetry(
+        () =>
+          this.messenger.call(
+            'RewardsDataService:applyBonusCode',
+            { bonusCode },
+            subscriptionId,
+          ),
         subscriptionId,
       );
 
diff --git a/app/core/Engine/controllers/rewards-controller/services/rewards-data-service.test.ts b/app/core/Engine/controllers/rewards-controller/services/rewards-data-service.test.ts
index bafee9a14d72..b197e6666e30 100644
--- a/app/core/Engine/controllers/rewards-controller/services/rewards-data-service.test.ts
+++ b/app/core/Engine/controllers/rewards-controller/services/rewards-data-service.test.ts
@@ -76,7 +76,7 @@ describe('RewardsDataService', () => {
   beforeEach(() => {
     jest.clearAllMocks();
     process.env = { ...originalEnv };
-    process.env.GITHUB_ACTIONS = 'false';
+    process.env.BUILDS_ENABLED_WITH_GH_ACTIONS_TEMPORARY = 'false';
 
     // Allow env overrides by default (canChange = true).
     // getRewardsEnvUrl reads canChange from the tuple, so the second element
@@ -1138,6 +1138,121 @@ describe('RewardsDataService', () => {
     });
   });
 
+  describe('centralized 403 detection in makeRequest', () => {
+    it('throws AuthorizationFailedError for any endpoint returning 403', async () => {
+      const mockResponse = {
+        ok: false,
+        status: 403,
+      } as unknown as Response;
+      mockFetch.mockResolvedValue(mockResponse);
+
+      await expect(
+        service.getActivePointsBoosts('season-1', 'sub-1'),
+      ).rejects.toBeInstanceOf(AuthorizationFailedError);
+    });
+
+    it('throws AuthorizationFailedError with status in message', async () => {
+      const mockResponse = {
+        ok: false,
+        status: 403,
+      } as unknown as Response;
+      mockFetch.mockResolvedValue(mockResponse);
+
+      await expect(
+        service.getActivePointsBoosts('season-1', 'sub-1'),
+      ).rejects.toThrow('Authorization failed: 403');
+    });
+
+    it('does not throw AuthorizationFailedError for non-403 errors', async () => {
+      const mockResponse = {
+        ok: false,
+        status: 401,
+        json: jest.fn().mockResolvedValue({ message: 'Unauthorized' }),
+      } as unknown as Response;
+      mockFetch.mockResolvedValue(mockResponse);
+
+      await expect(
+        service.getReferralDetails('season-1', 'sub-1'),
+      ).rejects.toThrow('Get referral details failed: 401');
+    });
+
+    it('throws AuthorizationFailedError for 403 on different endpoints', async () => {
+      const mockResponse = {
+        ok: false,
+        status: 403,
+      } as unknown as Response;
+
+      mockFetch.mockResolvedValue(mockResponse);
+      await expect(
+        service.getUnlockedRewards('season-1', 'sub-1'),
+      ).rejects.toBeInstanceOf(AuthorizationFailedError);
+
+      mockFetch.mockResolvedValue(mockResponse);
+      await expect(
+        service.getSnapshots('season-1', 'sub-1'),
+      ).rejects.toBeInstanceOf(AuthorizationFailedError);
+
+      mockFetch.mockResolvedValue(mockResponse);
+      await expect(service.optOut('sub-1')).rejects.toBeInstanceOf(
+        AuthorizationFailedError,
+      );
+    });
+
+    it('does not throw AuthorizationFailedError for 403 on unauthenticated endpoints', async () => {
+      const mockResponse = {
+        ok: false,
+        status: 403,
+        json: jest.fn().mockResolvedValue({ message: 'Forbidden' }),
+      } as unknown as Response;
+      mockFetch.mockResolvedValue(mockResponse);
+
+      await expect(
+        service.estimatePoints({
+          activityType: 'SWAP',
+          account: 'eip155:1:0x123',
+          activityContext: {
+            swapContext: {
+              srcAsset: {
+                id: 'eip155:1/slip44:60',
+                amount: '1000000000000000000',
+              },
+              destAsset: {
+                id: 'eip155:1/erc20:0xa0b86991c6218b36c1d19d4a2e9eb0ce3606eb48',
+                amount: '4500000000',
+              },
+              feeAsset: {
+                id: 'eip155:1/slip44:60',
+                amount: '5000000000000000',
+              },
+            },
+          },
+        }),
+      ).rejects.toThrow('Points estimation failed: 403');
+      await expect(
+        service.estimatePoints({
+          activityType: 'SWAP',
+          account: 'eip155:1:0x123',
+          activityContext: {
+            swapContext: {
+              srcAsset: {
+                id: 'eip155:1/slip44:60',
+                amount: '1000000000000000000',
+              },
+              destAsset: {
+                id: 'eip155:1/erc20:0xa0b86991c6218b36c1d19d4a2e9eb0ce3606eb48',
+                amount: '4500000000',
+              },
+              feeAsset: {
+                id: 'eip155:1/slip44:60',
+                amount: '5000000000000000',
+              },
+            },
+          },
+        }),
+      ).rejects.not.toBeInstanceOf(AuthorizationFailedError);
+    });
+  });
+
   const mockSeasonStateResponse: SeasonStateDto = {
     balance: 1000,
     currentTierId: 'tier-gold',
@@ -1224,10 +1339,10 @@ describe('RewardsDataService', () => {
       ).rejects.toThrow('Get season state failed: 404');
     });
 
-    it('throws AuthorizationFailedError when rewards authorization fails', async () => {
+    it('throws AuthorizationFailedError when server returns 403', async () => {
       const mockResponse = {
         ok: false,
-        status: 401,
+        status: 403,
         json: jest.fn().mockResolvedValue({
           message: 'Rewards authorization failed',
         }),
@@ -1244,25 +1359,7 @@ describe('RewardsDataService', () => {
       expect(caughtError).toBeInstanceOf(AuthorizationFailedError);
       const authError = caughtError as AuthorizationFailedError;
       expect(authError.name).toBe('AuthorizationFailedError');
-      expect(authError.message).toBe(
-        'Rewards authorization failed. Please login and try again.',
-      );
-    });
-
-    it('detects authorization failure when message contains the phrase', async () => {
-      const mockResponse = {
-        ok: false,
-        status: 403,
-        json: jest.fn().mockResolvedValue({
-          message:
-            'Some other error: Rewards authorization failed due to expiry',
-        }),
-      } as unknown as Response;
-      mockFetch.mockResolvedValue(mockResponse);
-
-      await expect(
-        service.getSeasonStatus(mockSeasonId, mockSubscriptionId),
-      ).rejects.toBeInstanceOf(AuthorizationFailedError);
+      expect(authError.message).toBe('Authorization failed: 403');
     });
 
     it('throws SeasonNotFoundError when season is not found', async () => {
diff --git a/app/core/Engine/controllers/rewards-controller/services/rewards-data-service.ts b/app/core/Engine/controllers/rewards-controller/services/rewards-data-service.ts
index 2468209ca25a..90397c9fc528 100644
--- a/app/core/Engine/controllers/rewards-controller/services/rewards-data-service.ts
+++ b/app/core/Engine/controllers/rewards-controller/services/rewards-data-service.ts
@@ -526,6 +526,13 @@ export class RewardsDataService {
       });
 
       clearTimeout(timeoutId);
+
+      if (response.status === 403 && subscriptionId) {
+        throw new AuthorizationFailedError(
+          `Authorization failed: ${response.status}`,
+        );
+      }
+
       return response;
     } catch (error) {
       clearTimeout(timeoutId);
@@ -787,11 +794,6 @@ export class RewardsDataService {
 
     if (!response.ok) {
       const errorData = await response.json();
-      if (errorData?.message?.includes('Rewards authorization failed')) {
-        throw new AuthorizationFailedError(
-          'Rewards authorization failed. Please login and try again.',
-        );
-      }
 
       if (errorData?.message?.includes('Season not found')) {
         throw new SeasonNotFoundError(
diff --git a/app/core/Engine/controllers/rewards-controller/utils/rewards-api-url.test.ts b/app/core/Engine/controllers/rewards-controller/utils/rewards-api-url.test.ts
index cbc48f9fcaab..8604c4e9ada9 100644
--- a/app/core/Engine/controllers/rewards-controller/utils/rewards-api-url.test.ts
+++ b/app/core/Engine/controllers/rewards-controller/utils/rewards-api-url.test.ts
@@ -38,18 +38,17 @@ describe('getDefaultRewardsApiBaseUrlForMetaMaskEnv', () => {
   beforeEach(() => {
     process.env = { ...originalEnv };
     delete process.env.REWARDS_API_URL;
-    delete process.env.GITHUB_ACTIONS;
-    delete process.env.E2E;
+    delete process.env.BUILDS_ENABLED_WITH_GH_ACTIONS_TEMPORARY;
   });
 
   afterEach(() => {
     process.env = originalEnv;
   });
 
-  describe('GITHUB_ACTIONS override', () => {
-    it('returns custom URL when REWARDS_API_URL is set and GITHUB_ACTIONS is true and E2E is not true', () => {
+  describe('BUILDS_ENABLED_WITH_GH_ACTIONS_TEMPORARY override', () => {
+    it('returns custom URL when REWARDS_API_URL is set and BUILDS_ENABLED_WITH_GH_ACTIONS_TEMPORARY is true', () => {
       process.env.REWARDS_API_URL = 'https://custom.api';
-      process.env.GITHUB_ACTIONS = 'true';
+      process.env.BUILDS_ENABLED_WITH_GH_ACTIONS_TEMPORARY = 'true';
 
       const [apiUrl, canChange] =
         getDefaultRewardsApiBaseUrlForMetaMaskEnv('dev');
@@ -59,7 +58,7 @@ describe('getDefaultRewardsApiBaseUrlForMetaMaskEnv', () => {
 
     it('preserves canChange based on env when returning custom URL', () => {
       process.env.REWARDS_API_URL = 'https://custom.api';
-      process.env.GITHUB_ACTIONS = 'true';
+      process.env.BUILDS_ENABLED_WITH_GH_ACTIONS_TEMPORARY = 'true';
 
       const [apiUrl, canChange] =
         getDefaultRewardsApiBaseUrlForMetaMaskEnv('production');
@@ -67,25 +66,16 @@ describe('getDefaultRewardsApiBaseUrlForMetaMaskEnv', () => {
       expect(canChange).toBe(false);
     });
 
-    it('falls through to switch when E2E is true', () => {
+    it('falls through to switch when BUILDS_ENABLED_WITH_GH_ACTIONS_TEMPORARY is not true', () => {
       process.env.REWARDS_API_URL = 'https://custom.api';
-      process.env.GITHUB_ACTIONS = 'true';
-      process.env.E2E = 'true';
-
-      const [apiUrl] = getDefaultRewardsApiBaseUrlForMetaMaskEnv('dev');
-      expect(apiUrl).toEqual('https://api.uat');
-    });
-
-    it('falls through to switch when GITHUB_ACTIONS is not true', () => {
-      process.env.REWARDS_API_URL = 'https://custom.api';
-      process.env.GITHUB_ACTIONS = 'false';
+      process.env.BUILDS_ENABLED_WITH_GH_ACTIONS_TEMPORARY = 'false';
 
       const [apiUrl] = getDefaultRewardsApiBaseUrlForMetaMaskEnv('dev');
       expect(apiUrl).toEqual('https://api.uat');
     });
 
     it('falls through to switch when REWARDS_API_URL is not set', () => {
-      process.env.GITHUB_ACTIONS = 'true';
+      process.env.BUILDS_ENABLED_WITH_GH_ACTIONS_TEMPORARY = 'true';
 
       const [apiUrl] = getDefaultRewardsApiBaseUrlForMetaMaskEnv('dev');
       expect(apiUrl).toEqual('https://api.uat');
diff --git a/app/core/Engine/controllers/rewards-controller/utils/rewards-api-url.ts b/app/core/Engine/controllers/rewards-controller/utils/rewards-api-url.ts
index 2151933b35fd..e36008cdf97b 100644
--- a/app/core/Engine/controllers/rewards-controller/utils/rewards-api-url.ts
+++ b/app/core/Engine/controllers/rewards-controller/utils/rewards-api-url.ts
@@ -17,7 +17,7 @@ export const canChangeRewardsEnvUrl = (
 
 /**
  * Returns the rewards API base URL for the given MetaMask environment.
- * When GITHUB_ACTIONS (and not E2E), uses process.env.REWARDS_API_URL (set by builds.yml).
+ * When BUILDS_ENABLED_WITH_GH_ACTIONS_TEMPORARY (and not E2E), uses process.env.REWARDS_API_URL (set by builds.yml).
  * When not (Bitrise / .js.env / E2E), uses AppConstants.REWARDS_API_URL per env.
  */
 export const getDefaultRewardsApiBaseUrlForMetaMaskEnv = (
@@ -27,8 +27,7 @@ export const getDefaultRewardsApiBaseUrlForMetaMaskEnv = (
 
   if (
     process.env.REWARDS_API_URL &&
-    process.env.GITHUB_ACTIONS === 'true' &&
-    process.env.E2E !== 'true'
+    process.env.BUILDS_ENABLED_WITH_GH_ACTIONS_TEMPORARY === 'true'
   ) {
     return [process.env.REWARDS_API_URL, canChange];
   }
diff --git a/app/core/Engine/controllers/transaction-controller/metrics_properties/gas.test.ts b/app/core/Engine/controllers/transaction-controller/metrics_properties/gas.test.ts
index bfca61f71ead..9b3f47537c82 100644
--- a/app/core/Engine/controllers/transaction-controller/metrics_properties/gas.test.ts
+++ b/app/core/Engine/controllers/transaction-controller/metrics_properties/gas.test.ts
@@ -165,4 +165,24 @@ describe('getGasMetricsProperties', () => {
 
     expect(result.properties.gas_insufficient_native_asset).toBe(false);
   });
+
+  describe('MM Pay transactions', () => {
+    it('derives gas_paid_with from metamaskPay.tokenAddress instead of selectedGasFeeToken', () => {
+      const request = createMockRequest({
+        selectedGasFeeToken: '0xignored',
+        metamaskPay: {
+          chainId: '0x1',
+          tokenAddress: '0xusdc',
+        },
+        gasFeeTokens: [
+          { symbol: 'USDC', tokenAddress: '0xusdc' },
+          { symbol: 'IGNORED', tokenAddress: '0xignored' },
+        ] as unknown as TransactionMeta['gasFeeTokens'],
+      });
+
+      const result = getGasMetricsProperties(request);
+
+      expect(result.properties.gas_paid_with).toBe('USDC');
+    });
+  });
 });
diff --git a/app/core/Engine/controllers/transaction-controller/metrics_properties/gas.ts b/app/core/Engine/controllers/transaction-controller/metrics_properties/gas.ts
index 3cc816d29451..a03cce2f5796 100644
--- a/app/core/Engine/controllers/transaction-controller/metrics_properties/gas.ts
+++ b/app/core/Engine/controllers/transaction-controller/metrics_properties/gas.ts
@@ -40,19 +40,25 @@ export function getGasMetricsProperties({
     (token) => token.symbol,
   );
 
+  const { metamaskPay } = transactionMeta;
+  const gasFeeTokenAddress = metamaskPay?.tokenAddress ?? selectedGasFeeToken;
+  const gasFeeChainId = metamaskPay?.chainId ?? chainId;
+
   let gas_paid_with = gasFeeTokens?.find(
     (token) =>
-      token.tokenAddress.toLowerCase() === selectedGasFeeToken?.toLowerCase(),
+      token.tokenAddress.toLowerCase() === gasFeeTokenAddress?.toLowerCase(),
   )?.symbol;
 
-  if (selectedGasFeeToken?.toLowerCase() === getNativeTokenAddress(chainId)) {
+  if (
+    gasFeeTokenAddress?.toLowerCase() === getNativeTokenAddress(gasFeeChainId)
+  ) {
     gas_paid_with = 'pre-funded_ETH';
   }
 
   const state = getState();
   const gas_insufficient_native_asset = getNativeBalance(
     state,
-    chainId,
+    gasFeeChainId,
     from,
   ).lt(getMaxGasCost(transactionMeta));
 
diff --git a/app/core/Engine/messengers/bridge-controller-messenger/index.ts b/app/core/Engine/messengers/bridge-controller-messenger/index.ts
index 6f4f3b0fac24..46f8a945f1e3 100644
--- a/app/core/Engine/messengers/bridge-controller-messenger/index.ts
+++ b/app/core/Engine/messengers/bridge-controller-messenger/index.ts
@@ -35,6 +35,7 @@ export function getBridgeControllerMessenger(
       'MultichainAssetsRatesController:getState',
       'CurrencyRateController:getState',
       'RemoteFeatureFlagController:getState',
+      'AuthenticationController:getBearerToken',
     ],
     events: [],
     messenger,
diff --git a/app/core/Engine/messengers/bridge-status-controller-messenger/index.ts b/app/core/Engine/messengers/bridge-status-controller-messenger/index.ts
index af49f33edd3a..9a1c1dbcd4ce 100644
--- a/app/core/Engine/messengers/bridge-status-controller-messenger/index.ts
+++ b/app/core/Engine/messengers/bridge-status-controller-messenger/index.ts
@@ -36,6 +36,7 @@ export function getBridgeStatusControllerMessenger(
       'SnapController:handleRequest',
       'TransactionController:getState',
       'RemoteFeatureFlagController:getState',
+      'AuthenticationController:getBearerToken',
     ],
     events: [
       'TransactionController:transactionConfirmed',
diff --git a/app/core/Engine/messengers/card-controller-messenger/index.ts b/app/core/Engine/messengers/card-controller-messenger/index.ts
new file mode 100644
index 000000000000..d04a479f8594
--- /dev/null
+++ b/app/core/Engine/messengers/card-controller-messenger/index.ts
@@ -0,0 +1,27 @@
+import {
+  Messenger,
+  type MessengerActions,
+  type MessengerEvents,
+} from '@metamask/messenger';
+import type { CardControllerMessenger } from '../../controllers/card-controller/types';
+import type { RootMessenger } from '../../types';
+
+/**
+ * Get the CardControllerMessenger for the CardController.
+ *
+ * @param rootMessenger - The root messenger.
+ * @returns The CardControllerMessenger.
+ */
+export function getCardControllerMessenger(
+  rootMessenger: RootMessenger,
+): CardControllerMessenger {
+  return new Messenger<
+    'CardController',
+    MessengerActions<CardControllerMessenger>,
+    MessengerEvents<CardControllerMessenger>,
+    RootMessenger
+  >({
+    namespace: 'CardController',
+    parent: rootMessenger,
+  });
+}
diff --git a/app/core/Engine/messengers/index.ts b/app/core/Engine/messengers/index.ts
index 9b236597cebe..ca66ebb04597 100644
--- a/app/core/Engine/messengers/index.ts
+++ b/app/core/Engine/messengers/index.ts
@@ -149,6 +149,7 @@ import {
 import { getProfileMetricsServiceMessenger } from './profile-metrics-service-messenger';
 import { getAnalyticsControllerMessenger } from './analytics-controller-messenger';
 import { getAiDigestControllerMessenger } from './ai-digest-controller-messenger';
+import { getCardControllerMessenger } from './card-controller-messenger';
 
 /**
  * The messengers for the controllers that have been.
@@ -460,4 +461,8 @@ export const CONTROLLER_MESSENGERS = {
     getMessenger: getAiDigestControllerMessenger,
     getInitMessenger: noop,
   },
+  CardController: {
+    getMessenger: getCardControllerMessenger,
+    getInitMessenger: noop,
+  },
 } as const;
diff --git a/app/core/Engine/messengers/perps-controller-messenger/index.ts b/app/core/Engine/messengers/perps-controller-messenger/index.ts
index 1d86a21b68b1..6d63c356751d 100644
--- a/app/core/Engine/messengers/perps-controller-messenger/index.ts
+++ b/app/core/Engine/messengers/perps-controller-messenger/index.ts
@@ -9,6 +9,12 @@ import {
 /**
  * Get the PerpsControllerMessenger for the PerpsController.
  *
+ * PerpsController uses the messenger for all cross-controller communication:
+ * NetworkController, KeyringController, TransactionController,
+ * RemoteFeatureFlagController, AccountTreeController, AuthenticationController.
+ * The root messenger already registers actions for these controllers,
+ * so the child messenger can call them through the parent.
+ *
  * @param rootExtendedMessenger - The root extended messenger.
  * @returns The PerpsControllerMessenger.
  */
@@ -27,19 +33,16 @@ export function getPerpsControllerMessenger(
   rootExtendedMessenger.delegate({
     actions: [
       'NetworkController:getState',
-      'AuthenticationController:getBearerToken',
-      'RemoteFeatureFlagController:getState',
-      'AccountTreeController:getAccountsFromSelectedAccountGroup',
-      'KeyringController:getState',
-      'KeyringController:signTypedMessage',
       'NetworkController:getNetworkClientById',
       'NetworkController:findNetworkClientIdByChainId',
+      'KeyringController:getState',
+      'KeyringController:signTypedMessage',
       'TransactionController:addTransaction',
+      'RemoteFeatureFlagController:getState',
+      'AccountTreeController:getAccountsFromSelectedAccountGroup',
+      'AuthenticationController:getBearerToken',
     ],
     events: [
-      'TransactionController:transactionSubmitted',
-      'TransactionController:transactionConfirmed',
-      'TransactionController:transactionFailed',
       'RemoteFeatureFlagController:stateChange',
       'AccountTreeController:selectedAccountGroupChange',
     ],
diff --git a/app/core/Engine/messengers/ramps-controller-messenger/ramps-controller-messenger.ts b/app/core/Engine/messengers/ramps-controller-messenger/ramps-controller-messenger.ts
index 673dea11cccb..3f6b438cc9d6 100644
--- a/app/core/Engine/messengers/ramps-controller-messenger/ramps-controller-messenger.ts
+++ b/app/core/Engine/messengers/ramps-controller-messenger/ramps-controller-messenger.ts
@@ -1,4 +1,7 @@
-import { RampsControllerMessenger } from '@metamask/ramps-controller';
+import {
+  RampsControllerMessenger,
+  type RampsControllerOrderStatusChangedEvent,
+} from '@metamask/ramps-controller';
 import {
   Messenger,
   MessengerActions,
@@ -88,7 +91,7 @@ export function getRampsControllerInitMessenger(rootMessenger: RootMessenger) {
   const messenger = new Messenger<
     'RampsControllerInit',
     RemoteFeatureFlagControllerGetStateAction,
-    never,
+    RampsControllerOrderStatusChangedEvent,
     RootMessenger
   >({
     namespace: 'RampsControllerInit',
@@ -97,7 +100,7 @@ export function getRampsControllerInitMessenger(rootMessenger: RootMessenger) {
 
   rootMessenger.delegate({
     actions: ['RemoteFeatureFlagController:getState'],
-    events: [],
+    events: ['RampsController:orderStatusChanged'],
     messenger,
   });
 
diff --git a/app/core/Engine/types.ts b/app/core/Engine/types.ts
index 4deb5f1b0fe0..c6009673e522 100644
--- a/app/core/Engine/types.ts
+++ b/app/core/Engine/types.ts
@@ -324,6 +324,12 @@ import {
   PredictControllerActions,
   PredictControllerEvents,
 } from '../../components/UI/Predict/controllers/PredictController';
+import { CardController } from './controllers/card-controller/CardController';
+import type {
+  CardControllerState,
+  CardControllerActions,
+  CardControllerEvents,
+} from './controllers/card-controller/types';
 import {
   SeedlessOnboardingController,
   SeedlessOnboardingControllerState,
@@ -518,6 +524,7 @@ type GlobalActions =
   | EarnControllerActions
   | PerpsControllerActions
   | PredictControllerActions
+  | CardControllerActions
   | RewardsControllerActions
   | RewardsDataServiceActions
   | AppMetadataControllerActions
@@ -598,6 +605,7 @@ type GlobalEvents =
   | EarnControllerEvents
   | PerpsControllerEvents
   | PredictControllerEvents
+  | CardControllerEvents
   | RewardsControllerEvents
   | AppMetadataControllerEvents
   | SeedlessOnboardingControllerEvents
@@ -719,6 +727,7 @@ export type Controllers = {
   EarnController: EarnController;
   PerpsController: PerpsController;
   PredictController: PredictController;
+  CardController: CardController;
   RewardsController: RewardsController;
   RewardsDataService: RewardsDataService;
   SeedlessOnboardingController: SeedlessOnboardingController<EncryptionKey>;
@@ -799,6 +808,7 @@ export type EngineState = {
   EarnController: EarnControllerState;
   PerpsController: PerpsControllerState;
   PredictController: PredictControllerState;
+  CardController: CardControllerState;
   RewardsController: RewardsControllerState;
   SeedlessOnboardingController: SeedlessOnboardingControllerState;
   ///: BEGIN:ONLY_INCLUDE_IF(sample-feature)
@@ -901,6 +911,7 @@ export type ControllersToInitialize =
   | 'PermissionController'
   | 'PerpsController'
   | 'PredictController'
+  | 'CardController'
   | 'PreferencesController'
   | 'BridgeController'
   | 'BridgeStatusController'
diff --git a/app/core/HardwareWallet/HardwareWalletProvider.test.tsx b/app/core/HardwareWallet/HardwareWalletProvider.test.tsx
new file mode 100644
index 000000000000..e9bfcf63c33e
--- /dev/null
+++ b/app/core/HardwareWallet/HardwareWalletProvider.test.tsx
@@ -0,0 +1,650 @@
+import React from 'react';
+import { renderHook, act } from '@testing-library/react-hooks';
+import { render, waitFor } from '@testing-library/react-native';
+import { Text } from 'react-native';
+import { useSelector } from 'react-redux';
+import { HardwareWalletProvider } from './HardwareWalletProvider';
+import { useHardwareWallet } from './contexts';
+import { getHardwareWalletTypeForAddress } from './helpers';
+import { createAdapter } from './adapters';
+import { HardwareWalletType, ConnectionStatus } from '@metamask/hw-wallet-sdk';
+
+jest.mock('react-redux', () => ({
+  ...jest.requireActual('react-redux'),
+  useSelector: jest.fn(),
+}));
+
+jest.mock('./helpers', () => ({
+  ...jest.requireActual('./helpers'),
+  getHardwareWalletTypeForAddress: jest.fn(),
+}));
+
+const mockAdapterInstance = {
+  walletType: 'Ledger',
+  requiresDeviceDiscovery: true,
+  connect: jest.fn().mockResolvedValue(undefined),
+  disconnect: jest.fn().mockResolvedValue(undefined),
+  getConnectedDeviceId: jest.fn().mockReturnValue('device-123'),
+  ensureDeviceReady: jest.fn().mockResolvedValue(true),
+  isConnected: jest.fn().mockReturnValue(true),
+  reset: jest.fn(),
+  markFlowComplete: jest.fn(),
+  isFlowComplete: jest.fn().mockReturnValue(false),
+  resetFlowState: jest.fn(),
+  destroy: jest.fn(),
+  startDeviceDiscovery: jest.fn(),
+  stopDeviceDiscovery: jest.fn(),
+  isTransportAvailable: jest.fn().mockReturnValue(true),
+  onTransportStateChange: jest
+    .fn()
+    .mockImplementation((callback: (available: boolean) => void) => {
+      // Immediately call with available=true
+      callback(true);
+      return jest.fn();
+    }),
+  getRequiredAppName: jest.fn().mockReturnValue('Ethereum'),
+  getTransportDisabledErrorCode: jest.fn().mockReturnValue('BluetoothDisabled'),
+};
+
+jest.mock('./adapters', () => ({
+  createAdapter: jest.fn(() => mockAdapterInstance),
+}));
+
+jest.mock('@ledgerhq/react-native-hw-transport-ble', () => ({
+  __esModule: true,
+  default: {
+    observeState: jest.fn(() => ({
+      subscribe: jest.fn(() => ({
+        unsubscribe: jest.fn(),
+      })),
+    })),
+    open: jest.fn(),
+  },
+}));
+
+jest.mock('react-native', () => ({
+  ...jest.requireActual('react-native'),
+  Linking: {
+    openURL: jest.fn(),
+    openSettings: jest.fn(),
+  },
+  Platform: {
+    OS: 'ios',
+  },
+}));
+
+// Capture bottom sheet props so we can invoke internal actions in tests
+let capturedBottomSheetProps: Record<string, unknown> = {};
+jest.mock('./components', () => ({
+  HardwareWalletBottomSheet: (props: Record<string, unknown>) => {
+    capturedBottomSheetProps = props;
+    return null;
+  },
+}));
+
+describe('HardwareWalletProvider', () => {
+  const mockUseSelector = useSelector as jest.MockedFunction<
+    typeof useSelector
+  >;
+  const mockGetHardwareWalletType =
+    getHardwareWalletTypeForAddress as jest.MockedFunction<
+      typeof getHardwareWalletTypeForAddress
+    >;
+  const mockCreateAdapter = createAdapter as jest.MockedFunction<
+    typeof createAdapter
+  >;
+
+  beforeEach(() => {
+    jest.clearAllMocks();
+    capturedBottomSheetProps = {};
+    // Default: non-hardware wallet account
+    mockUseSelector.mockReturnValue(null);
+    mockGetHardwareWalletType.mockReturnValue(undefined);
+  });
+
+  const TestConsumer: React.FC = () => {
+    const { walletType, connectionState, ensureDeviceReady } =
+      useHardwareWallet();
+    return (
+      <>
+        <Text testID="walletType">{walletType ?? 'null'}</Text>
+        <Text testID="connectionStatus">{connectionState.status}</Text>
+        <Text testID="hasEnsureDeviceReady">
+          {String(typeof ensureDeviceReady === 'function')}
+        </Text>
+      </>
+    );
+  };
+
+  const renderProvider = (
+    props?: Partial<React.ComponentProps<typeof HardwareWalletProvider>>,
+  ) =>
+    render(
+      <HardwareWalletProvider {...props}>
+        <TestConsumer />
+      </HardwareWalletProvider>,
+    );
+
+  describe('context provision', () => {
+    it('provides config context', () => {
+      const { getByTestId } = renderProvider();
+
+      expect(getByTestId('walletType').children[0]).toBe('null');
+    });
+
+    it('provides state context', () => {
+      const { getByTestId } = renderProvider();
+
+      expect(getByTestId('connectionStatus').children[0]).toBe(
+        ConnectionStatus.Disconnected,
+      );
+    });
+
+    it('provides actions context', () => {
+      const { getByTestId } = renderProvider();
+
+      expect(getByTestId('hasEnsureDeviceReady').children[0]).toBe('true');
+    });
+  });
+
+  describe('wallet type detection', () => {
+    it('detects hardware wallet from selected account', async () => {
+      const mockAccount = { address: '0x1234' };
+      mockUseSelector.mockReturnValue(mockAccount);
+      mockGetHardwareWalletType.mockReturnValue(HardwareWalletType.Ledger);
+
+      const { getByTestId } = renderProvider();
+
+      await waitFor(() => {
+        expect(getByTestId('walletType').children[0]).toBe(
+          HardwareWalletType.Ledger,
+        );
+      });
+    });
+
+    it('identifies non-hardware accounts', () => {
+      mockUseSelector.mockReturnValue({ address: '0xsoftware' });
+      mockGetHardwareWalletType.mockReturnValue(undefined);
+
+      const { getByTestId } = renderProvider();
+
+      expect(getByTestId('walletType').children[0]).toBe('null');
+    });
+  });
+
+  describe('adapter creation', () => {
+    it('creates adapter when wallet type is set', async () => {
+      mockUseSelector.mockReturnValue({ address: '0x1234' });
+      mockGetHardwareWalletType.mockReturnValue(HardwareWalletType.Ledger);
+
+      renderProvider();
+
+      await waitFor(() => {
+        expect(mockCreateAdapter).toHaveBeenCalledWith(
+          HardwareWalletType.Ledger,
+          expect.objectContaining({
+            onDisconnect: expect.any(Function),
+            onDeviceEvent: expect.any(Function),
+          }),
+        );
+      });
+    });
+
+    it('creates non-hardware adapter for non-hardware accounts', () => {
+      mockUseSelector.mockReturnValue({ address: '0xsoftware' });
+      mockGetHardwareWalletType.mockReturnValue(undefined);
+
+      renderProvider();
+
+      // The provider always creates an adapter - for non-hardware accounts it creates
+      // a NonHardwareAdapter (passthrough) by calling createAdapter(null, ...)
+      expect(mockCreateAdapter).toHaveBeenCalledWith(
+        null,
+        expect.objectContaining({
+          onDisconnect: expect.any(Function),
+          onDeviceEvent: expect.any(Function),
+        }),
+      );
+    });
+  });
+
+  describe('actions', () => {
+    // Hook to access actions for testing
+    const useTestActions = () => {
+      const hw = useHardwareWallet();
+      return {
+        actions: hw,
+        state: {
+          connectionState: hw.connectionState,
+          deviceSelection: hw.deviceSelection,
+        },
+      };
+    };
+
+    const renderWithActions = () => {
+      mockUseSelector.mockReturnValue({ address: '0x1234' });
+      mockGetHardwareWalletType.mockReturnValue(HardwareWalletType.Ledger);
+
+      return renderHook(() => useTestActions(), {
+        wrapper: ({ children }: { children: React.ReactNode }) => (
+          <HardwareWalletProvider>{children}</HardwareWalletProvider>
+        ),
+      });
+    };
+
+    describe('connect (internal, via bottom sheet props)', () => {
+      it('connects to device', async () => {
+        renderWithActions();
+
+        const internalConnect = capturedBottomSheetProps.connect as (
+          deviceId: string,
+        ) => Promise<void>;
+        expect(internalConnect).toBeDefined();
+
+        await act(async () => {
+          await internalConnect('device-123');
+        });
+
+        const adapter = mockCreateAdapter.mock.results[0]?.value;
+        expect(adapter?.connect).toHaveBeenCalledWith('device-123');
+      });
+    });
+
+    describe('ensureDeviceReady', () => {
+      it('starts the device readiness flow', async () => {
+        const { result } = renderWithActions();
+
+        // Start the ensureDeviceReady flow (don't await - it's blocking)
+        // The provider's ensureDeviceReady returns a promise that only resolves
+        // when the success screen dismisses, which doesn't happen in tests
+        act(() => {
+          result.current.actions.ensureDeviceReady('device-123');
+        });
+
+        // Give time for the async flow to start
+        await act(async () => {
+          await new Promise((resolve) => setTimeout(resolve, 100));
+        });
+
+        // Verify the adapter method was called
+        expect(mockAdapterInstance.ensureDeviceReady).toHaveBeenCalledWith(
+          'device-123',
+        );
+      });
+    });
+  });
+
+  describe('props', () => {
+    it('renders with default props', async () => {
+      mockUseSelector.mockReturnValue({ address: '0x1234' });
+      mockGetHardwareWalletType.mockReturnValue(HardwareWalletType.Ledger);
+
+      const { getByTestId } = render(
+        <HardwareWalletProvider>
+          <TestConsumer />
+        </HardwareWalletProvider>,
+      );
+
+      await waitFor(() => {
+        expect(getByTestId('connectionStatus')).toBeOnTheScreen();
+      });
+    });
+  });
+
+  describe('device selection flow (internal actions via bottom sheet props)', () => {
+    const useTestActions = () => {
+      const hw = useHardwareWallet();
+      return {
+        actions: hw,
+        state: {
+          connectionState: hw.connectionState,
+          deviceSelection: hw.deviceSelection,
+        },
+      };
+    };
+
+    const renderWithActions = () => {
+      mockUseSelector.mockReturnValue({ address: '0x1234' });
+      mockGetHardwareWalletType.mockReturnValue(HardwareWalletType.Ledger);
+
+      return renderHook(() => useTestActions(), {
+        wrapper: ({ children }: { children: React.ReactNode }) => (
+          <HardwareWalletProvider>{children}</HardwareWalletProvider>
+        ),
+      });
+    };
+
+    describe('closeDeviceSelection', () => {
+      it('returns to disconnected state', async () => {
+        const { result } = renderWithActions();
+
+        act(() => {
+          result.current.actions.ensureDeviceReady();
+        });
+        await act(async () => {
+          await new Promise((resolve) => setTimeout(resolve, 50));
+        });
+
+        expect(result.current.state.connectionState.status).toBe(
+          ConnectionStatus.Scanning,
+        );
+
+        const internalClose = capturedBottomSheetProps.onClose as () => void;
+        await act(async () => {
+          internalClose();
+        });
+
+        expect(result.current.state.connectionState.status).toBe(
+          ConnectionStatus.Disconnected,
+        );
+      });
+    });
+
+    describe('selectDevice', () => {
+      it('updates selected device in state', async () => {
+        const { result } = renderWithActions();
+
+        const mockDevice = { id: 'device-1', name: 'Nano X' };
+
+        const internalSelectDevice =
+          capturedBottomSheetProps.selectDevice as (device: {
+            id: string;
+            name: string;
+          }) => void;
+
+        await act(async () => {
+          internalSelectDevice(mockDevice);
+        });
+
+        expect(result.current.state.deviceSelection.selectedDevice).toEqual(
+          mockDevice,
+        );
+      });
+    });
+
+    describe('rescan', () => {
+      it('resets devices and restarts scanning', async () => {
+        const { result } = renderWithActions();
+
+        act(() => {
+          result.current.actions.ensureDeviceReady();
+        });
+        await act(async () => {
+          await new Promise((resolve) => setTimeout(resolve, 50));
+        });
+
+        const internalSelectDevice =
+          capturedBottomSheetProps.selectDevice as (device: {
+            id: string;
+            name: string;
+          }) => void;
+        const internalRescan = capturedBottomSheetProps.rescan as () => void;
+
+        const mockDevice = { id: 'device-1', name: 'Nano X' };
+        await act(async () => {
+          internalSelectDevice(mockDevice);
+        });
+
+        await act(async () => {
+          internalRescan();
+        });
+
+        expect(result.current.state.deviceSelection.isScanning).toBe(true);
+        expect(result.current.state.deviceSelection.devices).toEqual([]);
+      });
+    });
+  });
+
+  describe('awaiting confirmation flow', () => {
+    const useTestActions = () => {
+      const hw = useHardwareWallet();
+      return {
+        actions: hw,
+        state: {
+          connectionState: hw.connectionState,
+          deviceSelection: hw.deviceSelection,
+        },
+      };
+    };
+
+    const renderWithActions = () => {
+      mockUseSelector.mockReturnValue({ address: '0x1234' });
+      mockGetHardwareWalletType.mockReturnValue(HardwareWalletType.Ledger);
+
+      return renderHook(() => useTestActions(), {
+        wrapper: ({ children }: { children: React.ReactNode }) => (
+          <HardwareWalletProvider>{children}</HardwareWalletProvider>
+        ),
+      });
+    };
+
+    describe('showAwaitingConfirmation', () => {
+      it('transitions to awaiting confirmation state', async () => {
+        const { result } = renderWithActions();
+
+        await act(async () => {
+          result.current.actions.showAwaitingConfirmation('transaction');
+        });
+
+        expect(result.current.state.connectionState.status).toBe(
+          ConnectionStatus.AwaitingConfirmation,
+        );
+      });
+
+      it('sets operationType to message for message operations', async () => {
+        const { result } = renderWithActions();
+
+        await act(async () => {
+          result.current.actions.showAwaitingConfirmation('message');
+        });
+
+        expect(result.current.state.connectionState.status).toBe(
+          ConnectionStatus.AwaitingConfirmation,
+        );
+        // Type narrow to access operationType
+        if (
+          result.current.state.connectionState.status ===
+          ConnectionStatus.AwaitingConfirmation
+        ) {
+          expect(result.current.state.connectionState.operationType).toBe(
+            'message',
+          );
+        }
+      });
+    });
+
+    describe('hideAwaitingConfirmation', () => {
+      it('returns to disconnected state', async () => {
+        const { result } = renderWithActions();
+
+        // Show awaiting confirmation
+        await act(async () => {
+          result.current.actions.showAwaitingConfirmation('transaction');
+        });
+
+        // Hide it
+        await act(async () => {
+          result.current.actions.hideAwaitingConfirmation();
+        });
+
+        expect(result.current.state.connectionState.status).toBe(
+          ConnectionStatus.Disconnected,
+        );
+      });
+    });
+  });
+
+  describe('error handling', () => {
+    const useTestActions = () => {
+      const hw = useHardwareWallet();
+      return {
+        actions: hw,
+        state: {
+          connectionState: hw.connectionState,
+          deviceSelection: hw.deviceSelection,
+        },
+      };
+    };
+
+    const renderWithActions = () => {
+      mockUseSelector.mockReturnValue({ address: '0x1234' });
+      mockGetHardwareWalletType.mockReturnValue(HardwareWalletType.Ledger);
+
+      return renderHook(() => useTestActions(), {
+        wrapper: ({ children }: { children: React.ReactNode }) => (
+          <HardwareWalletProvider>{children}</HardwareWalletProvider>
+        ),
+      });
+    };
+
+    describe('showHardwareWalletError', () => {
+      it('transitions to error state', async () => {
+        const { result } = renderWithActions();
+
+        await act(async () => {
+          result.current.actions.showHardwareWalletError(
+            new Error('Test error'),
+          );
+        });
+
+        expect(result.current.state.connectionState.status).toBe(
+          ConnectionStatus.ErrorState,
+        );
+      });
+    });
+
+    describe('retryEnsureDeviceReady (internal, via bottom sheet props)', () => {
+      it('transitions to connecting state when retrying', async () => {
+        const { result } = renderWithActions();
+
+        act(() => {
+          result.current.actions.ensureDeviceReady('device-123');
+        });
+
+        await act(async () => {
+          await new Promise((resolve) => setTimeout(resolve, 50));
+        });
+
+        await act(async () => {
+          result.current.actions.showHardwareWalletError(
+            new Error('Connection failed'),
+          );
+        });
+
+        expect(result.current.state.connectionState.status).toBe(
+          ConnectionStatus.ErrorState,
+        );
+
+        const internalRetry =
+          capturedBottomSheetProps.retryEnsureDeviceReady as () => Promise<void>;
+        await act(async () => {
+          await internalRetry();
+        });
+
+        expect(mockAdapterInstance.ensureDeviceReady).toHaveBeenCalled();
+      });
+    });
+  });
+
+  describe('transport state monitoring', () => {
+    it('updates bluetooth enabled state from adapter', async () => {
+      mockUseSelector.mockReturnValue({ address: '0x1234' });
+      mockGetHardwareWalletType.mockReturnValue(HardwareWalletType.Ledger);
+
+      // Mock adapter to call the transport state change callback
+      let transportCallback: ((available: boolean) => void) | null = null;
+      mockAdapterInstance.onTransportStateChange.mockImplementation(
+        (callback: (available: boolean) => void) => {
+          transportCallback = callback;
+          callback(true); // Initially available
+          return jest.fn();
+        },
+      );
+
+      const { getByTestId } = renderProvider();
+
+      await waitFor(() => {
+        expect(getByTestId('connectionStatus')).toBeOnTheScreen();
+      });
+
+      // Simulate transport becoming unavailable
+      if (transportCallback) {
+        await act(async () => {
+          transportCallback?.(false);
+        });
+      }
+
+      // Adapter should have received onTransportStateChange registration
+      expect(mockAdapterInstance.onTransportStateChange).toHaveBeenCalled();
+    });
+  });
+
+  describe('connect error handling (internal, via bottom sheet props)', () => {
+    it('transitions to error state when adapter connect rejects', async () => {
+      mockUseSelector.mockReturnValue({ address: '0x1234' });
+      mockGetHardwareWalletType.mockReturnValue(HardwareWalletType.Ledger);
+
+      mockAdapterInstance.connect.mockRejectedValueOnce(
+        new Error('Connection failed'),
+      );
+
+      const useTestActions = () => {
+        const hw = useHardwareWallet();
+        return {
+          state: {
+            connectionState: hw.connectionState,
+          },
+        };
+      };
+
+      const { result } = renderHook(() => useTestActions(), {
+        wrapper: ({ children }: { children: React.ReactNode }) => (
+          <HardwareWalletProvider>{children}</HardwareWalletProvider>
+        ),
+      });
+
+      const internalConnect = capturedBottomSheetProps.connect as (
+        deviceId: string,
+      ) => Promise<void>;
+
+      await act(async () => {
+        await internalConnect('device-123');
+      });
+
+      expect(result.current.state.connectionState.status).toBe(
+        ConnectionStatus.ErrorState,
+      );
+    });
+  });
+
+  describe('setTargetWalletType', () => {
+    const useTestActions = () => {
+      const hw = useHardwareWallet();
+      return {
+        actions: hw,
+        config: { walletType: hw.walletType, deviceId: hw.deviceId },
+      };
+    };
+
+    it('updates wallet type when set', async () => {
+      mockUseSelector.mockReturnValue(null);
+      mockGetHardwareWalletType.mockReturnValue(undefined);
+
+      const { result } = renderHook(() => useTestActions(), {
+        wrapper: ({ children }: { children: React.ReactNode }) => (
+          <HardwareWalletProvider>{children}</HardwareWalletProvider>
+        ),
+      });
+
+      await act(async () => {
+        result.current.actions.setTargetWalletType(HardwareWalletType.Ledger);
+      });
+
+      await waitFor(() => {
+        expect(result.current.config.walletType).toBe(
+          HardwareWalletType.Ledger,
+        );
+      });
+    });
+  });
+});
diff --git a/app/core/HardwareWallet/HardwareWalletProvider.tsx b/app/core/HardwareWallet/HardwareWalletProvider.tsx
new file mode 100644
index 000000000000..2d5c8b82db39
--- /dev/null
+++ b/app/core/HardwareWallet/HardwareWalletProvider.tsx
@@ -0,0 +1,171 @@
+import React, { ReactNode, useCallback, useMemo, useRef } from 'react';
+
+import HardwareWalletContext from './contexts/HardwareWalletContext';
+import { HardwareWalletBottomSheet } from './components';
+import {
+  useHardwareWalletStateManager,
+  useDeviceEventHandlers,
+  useAdapterLifecycle,
+  useTransportMonitoring,
+  useDeviceDiscovery,
+  useDeviceConnectionFlow,
+} from './hooks';
+import { ConnectionStatus } from '@metamask/hw-wallet-sdk';
+import DevLogger from '../SDKConnect/utils/DevLogger';
+
+interface HardwareWalletProviderProps {
+  children: ReactNode;
+}
+
+/**
+ * Unified Hardware Wallet Provider
+ *
+ * Manages all hardware wallet state and actions, automatically creating
+ * the appropriate adapter based on wallet type, handling device events,
+ * coordinating the connection / readiness flow and surfacing transport
+ * or device errors to the user via a bottom sheet UI.
+ */
+export const HardwareWalletProvider: React.FC<HardwareWalletProviderProps> = ({
+  children,
+}) => {
+  const { state, refs, setters } = useHardwareWalletStateManager();
+  const { connectionState, deviceId, walletType, targetWalletType } = state;
+
+  const effectiveWalletType = targetWalletType ?? walletType;
+
+  const { handleDeviceEvent, handleError, updateConnectionState } =
+    useDeviceEventHandlers({
+      refs,
+      setters,
+      walletType: effectiveWalletType,
+    });
+
+  const {
+    isTransportAvailable,
+    previousTransportAvailableRef,
+    createAdapterWithCallbacks,
+    initializeAdapter,
+  } = useAdapterLifecycle({
+    walletType: effectiveWalletType,
+    adapterRef: refs.adapterRef,
+    handleDeviceEvent,
+    handleError,
+    updateConnectionState,
+  });
+
+  const { checkTransportEnabledOrShowError } = useTransportMonitoring({
+    isTransportAvailable,
+    previousTransportAvailableRef,
+    connectionState,
+    adapterRef: refs.adapterRef,
+    walletType: effectiveWalletType,
+    updateConnectionState,
+  });
+
+  const { deviceSelection, selectDevice, rescan } = useDeviceDiscovery({
+    adapterRef: refs.adapterRef,
+    walletType: effectiveWalletType,
+    connectionState,
+    updateConnectionState,
+  });
+
+  const {
+    ensureDeviceReady,
+    connect,
+    retryEnsureDeviceReady,
+    closeFlow,
+    handleConnectionSuccess,
+  } = useDeviceConnectionFlow({
+    refs,
+    setters,
+    walletType: effectiveWalletType,
+    deviceId,
+    handleError,
+    updateConnectionState,
+    createAdapterWithCallbacks,
+    initializeAdapter,
+    checkTransportEnabledOrShowError,
+  });
+
+  const awaitingConfirmationRejectRef = useRef<(() => void) | null>(null);
+
+  const showHardwareWalletError = useCallback(
+    (error: unknown) => {
+      DevLogger.log('[HardwareWallet] showHardwareWalletError:', error);
+      handleError(error);
+    },
+    [handleError],
+  );
+
+  const showAwaitingConfirmation = useCallback(
+    (operationType: 'transaction' | 'message', onReject?: () => void) => {
+      DevLogger.log(
+        '[HardwareWallet] showAwaitingConfirmation:',
+        operationType,
+      );
+      awaitingConfirmationRejectRef.current = onReject ?? null;
+
+      updateConnectionState({
+        status: ConnectionStatus.AwaitingConfirmation,
+        deviceId: deviceId ?? 'unknown',
+        operationType,
+      });
+    },
+    [deviceId, updateConnectionState],
+  );
+
+  const hideAwaitingConfirmation = useCallback(() => {
+    DevLogger.log('[HardwareWallet] hideAwaitingConfirmation');
+    awaitingConfirmationRejectRef.current = null;
+    updateConnectionState({ status: ConnectionStatus.Disconnected });
+  }, [updateConnectionState]);
+
+  const handleAwaitingConfirmationCancel = useCallback(() => {
+    DevLogger.log('[HardwareWallet] handleAwaitingConfirmationCancel');
+    awaitingConfirmationRejectRef.current?.();
+    hideAwaitingConfirmation();
+  }, [hideAwaitingConfirmation]);
+
+  const contextValue = useMemo(
+    () => ({
+      walletType: effectiveWalletType,
+      deviceId,
+      connectionState,
+      deviceSelection,
+      ensureDeviceReady,
+      setTargetWalletType: setters.setTargetWalletType,
+      showHardwareWalletError,
+      showAwaitingConfirmation,
+      hideAwaitingConfirmation,
+    }),
+    [
+      effectiveWalletType,
+      deviceId,
+      connectionState,
+      deviceSelection,
+      ensureDeviceReady,
+      setters.setTargetWalletType,
+      showHardwareWalletError,
+      showAwaitingConfirmation,
+      hideAwaitingConfirmation,
+    ],
+  );
+
+  return (
+    <HardwareWalletContext.Provider value={contextValue}>
+      {children}
+      <HardwareWalletBottomSheet
+        connectionState={connectionState}
+        deviceSelection={deviceSelection}
+        walletType={effectiveWalletType}
+        retryEnsureDeviceReady={retryEnsureDeviceReady}
+        selectDevice={selectDevice}
+        rescan={rescan}
+        connect={connect}
+        onClose={closeFlow}
+        onAwaitingConfirmationCancel={handleAwaitingConfirmationCancel}
+        onConnectionSuccess={handleConnectionSuccess}
+      />
+    </HardwareWalletContext.Provider>
+  );
+};
diff --git a/app/core/HardwareWallet/adapters/LedgerBluetoothAdapter.test.ts b/app/core/HardwareWallet/adapters/LedgerBluetoothAdapter.test.ts
index 4b02cbe86f88..7eca6e729415 100644
--- a/app/core/HardwareWallet/adapters/LedgerBluetoothAdapter.test.ts
+++ b/app/core/HardwareWallet/adapters/LedgerBluetoothAdapter.test.ts
@@ -162,16 +162,14 @@ describe('LedgerBluetoothAdapter', () => {
       expect(mockedTransportBLE.open).toHaveBeenCalledTimes(2);
     });
 
-    it('emits ConnectionFailed on error', async () => {
+    it('throws and clears state on connect error', async () => {
       const error = new Error('BLE connection failed');
       mockedTransportBLE.open.mockRejectedValueOnce(error);
 
       await expect(adapter.connect('device-123')).rejects.toThrow(error);
 
-      expect(onDeviceEvent).toHaveBeenCalledWith({
-        event: DeviceEvent.ConnectionFailed,
-        error,
-      });
+      expect(adapter.isConnected()).toBe(false);
+      expect(adapter.getConnectedDeviceId()).toBeNull();
     });
 
     it('throws if adapter is destroyed', async () => {
@@ -206,20 +204,14 @@ describe('LedgerBluetoothAdapter', () => {
       expect(adapter.isConnected()).toBe(false);
     });
 
-    it('emits ConnectionFailed with normalized error when connect rejects non-Error', async () => {
+    it('throws non-Error values as-is on connect failure', async () => {
       mockedTransportBLE.open.mockRejectedValueOnce('connection failed');
 
       await expect(adapter.connect('device-123')).rejects.toBe(
         'connection failed',
       );
 
-      expect(onDeviceEvent).toHaveBeenCalledWith({
-        event: DeviceEvent.ConnectionFailed,
-        error: expect.any(Error),
-      });
-      expect(
-        (onDeviceEvent.mock.calls[0][0] as { error: Error }).error.message,
-      ).toBe('connection failed');
+      expect(adapter.isConnected()).toBe(false);
     });
 
     it('ignores transport error event when flow is complete', async () => {
@@ -300,7 +292,7 @@ describe('LedgerBluetoothAdapter', () => {
   });
 
   describe('handleDisconnect (via transport events)', () => {
-    it('calls onDisconnect when restart limit reached after repeated disconnect events', async () => {
+    it('clears transport without calling onDisconnect', async () => {
       await adapter.connect('device-123');
       onDisconnect.mockClear();
 
@@ -309,28 +301,33 @@ describe('LedgerBluetoothAdapter', () => {
       )?.[1];
       expect(disconnectHandler).toBeDefined();
 
-      // First 5 calls increment restartCount and return; 6th call hits limit and calls onDisconnect
-      for (let i = 0; i < 6; i++) {
-        disconnectHandler?.();
-      }
+      disconnectHandler?.();
 
-      expect(onDisconnect).toHaveBeenCalledTimes(1);
-      expect(onDisconnect).toHaveBeenCalledWith(
-        expect.objectContaining({ message: 'Device disconnected' }),
-      );
+      expect(onDisconnect).not.toHaveBeenCalled();
+      expect(adapter.isConnected()).toBe(false);
     });
 
-    it('ignores disconnect event when flow is complete', async () => {
+    it('ignores stale events from a replaced transport', async () => {
       await adapter.connect('device-123');
-      adapter.markFlowComplete();
-      onDisconnect.mockClear();
 
-      const disconnectHandler = mockTransportInstance.on.mock.calls.find(
+      const oldDisconnectHandler = mockTransportInstance.on.mock.calls.find(
         (call: [string, () => void]) => call[0] === 'disconnect',
       )?.[1];
-      disconnectHandler?.();
 
-      expect(onDisconnect).not.toHaveBeenCalled();
+      const newTransport = {
+        on: jest.fn(),
+        close: jest.fn().mockResolvedValue(undefined),
+      };
+      mockedTransportBLE.open.mockResolvedValueOnce(
+        newTransport as unknown as TransportBLE,
+      );
+      await adapter.connect('device-456');
+
+      expect(adapter.isConnected()).toBe(true);
+
+      oldDisconnectHandler?.();
+
+      expect(adapter.isConnected()).toBe(true);
     });
   });
 
@@ -426,13 +423,11 @@ describe('LedgerBluetoothAdapter', () => {
     });
 
     it('returns false when no transport after connect', async () => {
-      // Mock connect to succeed but leave transport as null
       mockedTransportBLE.open.mockResolvedValueOnce(
         null as unknown as TransportBLE,
       );
 
       const result = await adapter.ensureDeviceReady('device-123');
-
       expect(result).toBe(false);
     });
 
diff --git a/app/core/HardwareWallet/adapters/LedgerBluetoothAdapter.ts b/app/core/HardwareWallet/adapters/LedgerBluetoothAdapter.ts
index 3b1fd4cf38d1..e4e5278f5bd3 100644
--- a/app/core/HardwareWallet/adapters/LedgerBluetoothAdapter.ts
+++ b/app/core/HardwareWallet/adapters/LedgerBluetoothAdapter.ts
@@ -1,5 +1,3 @@
-// TODO: when hw overhaul is complete, all DevLogger.log calls should be removed
-
 import TransportBLE from '@ledgerhq/react-native-hw-transport-ble';
 import { State as BleState } from 'react-native-ble-plx';
 import { Observable, Subscription } from 'rxjs';
@@ -25,9 +23,8 @@ import DevLogger from '../../SDKConnect/utils/DevLogger';
 const DEVICE_LOCKED_STATUS_CODE = 0x6b0c;
 const LEDGER_OPERATION_TIMEOUT_MS = 10000;
 const DEFAULT_SCAN_TIMEOUT_MS = 30000;
-const CONNECTION_RESTART_LIMIT = 5;
 const MAX_DISCONNECT_RETRIES = 3;
-const RETRY_DELAY_MS = 1000;
+const RETRY_DELAY_MS = 2000;
 
 /**
  * Adapter for Ledger hardware wallets using Bluetooth Low Energy (BLE).
@@ -44,7 +41,6 @@ export class LedgerBluetoothAdapter implements HardwareWalletAdapter {
   #transport: TransportBLE | null = null;
   #deviceId: string | null = null;
   #options: HardwareWalletAdapterOptions;
-  #restartCount = 0;
   #isDestroyed = false;
   #connectInFlight: Promise<void> | null = null;
   #flowComplete = false;
@@ -116,15 +112,14 @@ export class LedgerBluetoothAdapter implements HardwareWalletAdapter {
 
       this.#transport = transport;
       this.#deviceId = deviceId;
-      this.#restartCount = 0;
 
       transport.on('disconnect', () => {
-        if (this.#transport != null && this.#transport !== transport) return;
+        if (this.#transport !== transport) return;
         this.#handleDisconnect();
       });
 
       transport.on('error', (error: Error) => {
-        if (this.#transport != null && this.#transport !== transport) return;
+        if (this.#transport !== transport) return;
         DevLogger.log(
           '[LedgerBluetoothAdapter] Transport error:',
           error.message,
@@ -313,15 +308,6 @@ export class LedgerBluetoothAdapter implements HardwareWalletAdapter {
     return ErrorCode.BluetoothDisabled;
   }
 
-  getConnectionTips(): string[] {
-    return [
-      'hardware_wallet.connecting.tip_unlock',
-      'hardware_wallet.connecting.tip_open_app',
-      'hardware_wallet.connecting.tip_enable_bluetooth',
-      'hardware_wallet.connecting.tip_dnd_off',
-    ];
-  }
-
   /**
    * Ensure the device is ready for operations.
    *
@@ -331,7 +317,7 @@ export class LedgerBluetoothAdapter implements HardwareWalletAdapter {
    * 3. If not open, emits AppClosed event and returns false
    * 4. If open, verifies device is unlocked
    *
-   * Handles transient disconnects (e.g., during app switch) by retrying.
+   * Handles transient BLE errors (e.g., during app switch) by retrying.
    *
    * @param deviceId - The device ID to connect to
    * @returns true if device is ready, false otherwise
@@ -346,24 +332,24 @@ export class LedgerBluetoothAdapter implements HardwareWalletAdapter {
       deviceId,
     );
 
-    // Retry on transient disconnects (e.g., device switching apps)
+    // Retry on transient BLE errors (e.g., device switching apps)
     for (let attempt = 1; attempt <= MAX_DISCONNECT_RETRIES; attempt++) {
       try {
         return await this.#doEnsureDeviceReady(deviceId);
       } catch (error) {
         if (
-          this.#isDisconnectError(error) &&
+          this.#isTransientBleError(error) &&
           attempt < MAX_DISCONNECT_RETRIES
         ) {
           DevLogger.log(
-            `[LedgerBluetoothAdapter] Disconnect during check (attempt ${attempt}/${MAX_DISCONNECT_RETRIES}), retrying...`,
+            `[LedgerBluetoothAdapter] Transient BLE error during check (attempt ${attempt}/${MAX_DISCONNECT_RETRIES}), retrying...`,
           );
           await this.#closeTransport();
           await new Promise((resolve) => setTimeout(resolve, RETRY_DELAY_MS));
           continue;
         }
 
-        // Non-disconnect error or max retries reached
+        // Non-transient error or max retries reached
         throw error;
       }
     }
@@ -417,7 +403,7 @@ export class LedgerBluetoothAdapter implements HardwareWalletAdapter {
 
   /**
    * Verify the Ethereum app is unlocked by requesting an address.
-   * Rethrows disconnect errors to allow retry in ensureDeviceReady.
+   * Rethrows transient BLE errors to allow retry in ensureDeviceReady.
    */
   async #verifyEthereumAppUnlocked(): Promise<boolean> {
     DevLogger.log(
@@ -447,7 +433,7 @@ export class LedgerBluetoothAdapter implements HardwareWalletAdapter {
         verifyError,
       );
 
-      if (this.#isDisconnectError(verifyError)) {
+      if (this.#isTransientBleError(verifyError)) {
         throw verifyError;
       }
 
@@ -516,43 +502,19 @@ export class LedgerBluetoothAdapter implements HardwareWalletAdapter {
   }
 
   /**
-   * Handle disconnect events from the transport
-   *
-   * Note: We only clear transport but preserve deviceId to allow reconnection
-   * during app switch scenarios (BOLOS → Ethereum). The deviceId is only cleared
-   * when explicitly disconnecting via disconnect() method.
+   * Handle disconnect events from the transport.
    *
-   * When checking for app readiness, we do not emit disconnect events or call
-   * onDisconnect callback since disconnects during app switch are expected.
+   * Clears the transport reference but preserves deviceId for reconnection.
+   * Does NOT call onDisconnect — disconnect handling is consolidated into
+   * ensureDeviceReady's retry loop, which catches transport errors and
+   * retries automatically. This avoids false-positive error UI from
+   * transient BLE disconnects (e.g. Ledger app switching).
    */
   #handleDisconnect(): void {
     this.#transport = null;
-    // If flow is complete, ignore disconnect events entirely
-    // This prevents errors from showing after a successful connection
-    if (this.#flowComplete) {
-      DevLogger.log(
-        '[LedgerBluetoothAdapter] handleDisconnect - flow complete, ignoring disconnect',
-      );
-      return;
-    }
-
-    // Check if we should try to reconnect (without emitting error)
-    if (this.#restartCount < CONNECTION_RESTART_LIMIT) {
-      this.#restartCount++;
-      DevLogger.log(
-        '[LedgerBluetoothAdapter] handleDisconnect - transport cleared, will attempt reconnect. restartCount:',
-        this.#restartCount,
-      );
-      return;
-    }
-
-    // Restart limit reached
     DevLogger.log(
-      '[LedgerBluetoothAdapter] handleDisconnect - restart limit reached, emitting error',
+      '[LedgerBluetoothAdapter] handleDisconnect - transport cleared',
     );
-    this.#clearTransportState();
-
-    this.#options.onDisconnect(new Error('Device disconnected'));
   }
 
   #emitEvent(payload: DeviceEventPayload): void {
@@ -574,7 +536,6 @@ export class LedgerBluetoothAdapter implements HardwareWalletAdapter {
   #clearTransportState(): void {
     this.#transport = null;
     this.#deviceId = null;
-    this.#restartCount = 0;
   }
 
   /**
@@ -655,14 +616,19 @@ export class LedgerBluetoothAdapter implements HardwareWalletAdapter {
   }
 
   /**
-   * Check if error indicates a Ledger transport disconnect (so caller can retry).
+   * Check if error is a transient BLE error that can be retried
+   * (disconnects during app switch, pairing failures during reconnect, etc.)
    */
-  #isDisconnectError(error: unknown): boolean {
-    return (
-      error instanceof Error &&
-      (error.name === 'DisconnectedDevice' ||
-        error.name === 'DisconnectedDeviceDuringOperation')
-    );
+  #isTransientBleError(error: unknown): boolean {
+    if (!(error instanceof Error)) return false;
+    const transientBleErrorNames = [
+      'DisconnectedDevice',
+      'DisconnectedDeviceDuringOperation',
+      'PairingFailed',
+      'PeerRemovedPairing',
+      'BleError',
+    ];
+    return transientBleErrorNames.includes(error.name);
   }
 
   /**
diff --git a/app/core/HardwareWallet/adapters/NonHardwareAdapter.ts b/app/core/HardwareWallet/adapters/NonHardwareAdapter.ts
index 079aca903694..9d2be4a3adf3 100644
--- a/app/core/HardwareWallet/adapters/NonHardwareAdapter.ts
+++ b/app/core/HardwareWallet/adapters/NonHardwareAdapter.ts
@@ -78,8 +78,4 @@ export class NonHardwareAdapter implements HardwareWalletAdapter {
   getTransportDisabledErrorCode(): ErrorCode | null {
     return null;
   }
-
-  getConnectionTips(): string[] {
-    return [];
-  }
 }
diff --git a/app/core/HardwareWallet/components/HardwareWalletBottomSheet/HardwareWalletBottomSheet.test.tsx b/app/core/HardwareWallet/components/HardwareWalletBottomSheet/HardwareWalletBottomSheet.test.tsx
new file mode 100644
index 000000000000..81cf2b14fef1
--- /dev/null
+++ b/app/core/HardwareWallet/components/HardwareWalletBottomSheet/HardwareWalletBottomSheet.test.tsx
@@ -0,0 +1,586 @@
+// Mock dependencies
+jest.mock('../../../../util/theme', () => ({
+  useTheme: () => ({
+    colors: {
+      background: { default: '#FFFFFF' },
+    },
+  }),
+}));
+
+// Mutable state objects for tests to manipulate
+const mockConnectionState: Record<string, unknown> = { status: 'disconnected' };
+const mockDeviceSelection = {
+  devices: [],
+  selectedDevice: null,
+  isScanning: false,
+  scanError: null,
+};
+const mockActions = {
+  retryEnsureDeviceReady: jest.fn(),
+  selectDevice: jest.fn(),
+  rescan: jest.fn(),
+  connect: jest.fn(),
+  onClose: jest.fn(),
+};
+
+// Track props passed to content components for testing handlers
+let lastDeviceSelectionProps: Record<string, unknown> = {};
+let lastErrorContentProps: Record<string, unknown> = {};
+let lastSuccessContentProps: Record<string, unknown> = {};
+let lastAwaitingConfirmationProps: Record<string, unknown> = {};
+let lastAwaitingAppProps: Record<string, unknown> = {};
+
+// Mock content components - capture props for testing
+jest.mock('./contents', () => ({
+  ConnectingContent: () => null,
+  DeviceSelectionContent: (props: Record<string, unknown>) => {
+    lastDeviceSelectionProps = props;
+    return null;
+  },
+  AwaitingAppContent: (props: Record<string, unknown>) => {
+    lastAwaitingAppProps = props;
+    return null;
+  },
+  AwaitingConfirmationContent: (props: Record<string, unknown>) => {
+    lastAwaitingConfirmationProps = props;
+    return null;
+  },
+  ErrorContent: (props: Record<string, unknown>) => {
+    lastErrorContentProps = props;
+    return null;
+  },
+  SuccessContent: (props: Record<string, unknown>) => {
+    lastSuccessContentProps = props;
+    return null;
+  },
+}));
+
+// Track BottomSheet onClose callback
+let lastBottomSheetOnClose: (() => void) | undefined;
+
+// Mock bottom sheet
+jest.mock(
+  '../../../../component-library/components/BottomSheets/BottomSheet',
+  () => {
+    const { View } = jest.requireActual('react-native');
+    return {
+      __esModule: true,
+      default: ({
+        children,
+        testID,
+        onClose,
+      }: {
+        children: React.ReactNode;
+        testID?: string;
+        onClose?: () => void;
+      }) => {
+        lastBottomSheetOnClose = onClose;
+        return <View testID={testID}>{children}</View>;
+      },
+    };
+  },
+);
+
+import React from 'react';
+import { render } from '@testing-library/react-native';
+import {
+  HardwareWalletError,
+  ErrorCode,
+  Severity,
+  Category,
+  ConnectionStatus,
+  HardwareWalletType,
+} from '@metamask/hw-wallet-sdk';
+
+import {
+  HardwareWalletBottomSheet,
+  HardwareWalletBottomSheetProps,
+  HARDWARE_WALLET_BOTTOM_SHEET_TEST_ID,
+} from './HardwareWalletBottomSheet';
+
+/**
+ * Build default props using the mutable mock objects.
+ * Tests mutate mockConnectionState / mockDeviceSelection before calling this.
+ */
+const createDefaultProps = (
+  overrides: Partial<HardwareWalletBottomSheetProps> = {},
+): HardwareWalletBottomSheetProps => ({
+  connectionState:
+    mockConnectionState as HardwareWalletBottomSheetProps['connectionState'],
+  deviceSelection:
+    mockDeviceSelection as HardwareWalletBottomSheetProps['deviceSelection'],
+  walletType: HardwareWalletType.Ledger,
+  ...mockActions,
+  ...overrides,
+});
+
+describe('HardwareWalletBottomSheet', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+    // Reset mock connection state
+    Object.assign(mockConnectionState, {
+      status: ConnectionStatus.Disconnected,
+    });
+    // Reset device selection state
+    Object.assign(mockDeviceSelection, {
+      devices: [],
+      selectedDevice: null,
+      isScanning: false,
+      scanError: null,
+    });
+  });
+
+  describe('visibility', () => {
+    it('does not render when disconnected', () => {
+      mockConnectionState.status = ConnectionStatus.Disconnected;
+      const { queryByTestId } = render(
+        <HardwareWalletBottomSheet {...createDefaultProps()} />,
+      );
+
+      expect(queryByTestId(HARDWARE_WALLET_BOTTOM_SHEET_TEST_ID)).toBeNull();
+    });
+
+    it('renders when connected (polling may still be in progress)', () => {
+      Object.assign(mockConnectionState, {
+        status: ConnectionStatus.Connected,
+        deviceId: 'device-123',
+      });
+      const { getByTestId } = render(
+        <HardwareWalletBottomSheet {...createDefaultProps()} />,
+      );
+
+      expect(
+        getByTestId(HARDWARE_WALLET_BOTTOM_SHEET_TEST_ID),
+      ).toBeOnTheScreen();
+    });
+
+    it('renders when connecting', () => {
+      mockConnectionState.status = ConnectionStatus.Connecting;
+      const { getByTestId } = render(
+        <HardwareWalletBottomSheet {...createDefaultProps()} />,
+      );
+
+      expect(
+        getByTestId(HARDWARE_WALLET_BOTTOM_SHEET_TEST_ID),
+      ).toBeOnTheScreen();
+    });
+
+    it('renders when awaiting app', () => {
+      Object.assign(mockConnectionState, {
+        status: ConnectionStatus.AwaitingApp,
+        deviceId: 'device-123',
+      });
+      const { getByTestId } = render(
+        <HardwareWalletBottomSheet {...createDefaultProps()} />,
+      );
+
+      expect(
+        getByTestId(HARDWARE_WALLET_BOTTOM_SHEET_TEST_ID),
+      ).toBeOnTheScreen();
+    });
+
+    it('renders when awaiting confirmation', () => {
+      Object.assign(mockConnectionState, {
+        status: ConnectionStatus.AwaitingConfirmation,
+        deviceId: 'device-123',
+      });
+      const { getByTestId } = render(
+        <HardwareWalletBottomSheet {...createDefaultProps()} />,
+      );
+
+      expect(
+        getByTestId(HARDWARE_WALLET_BOTTOM_SHEET_TEST_ID),
+      ).toBeOnTheScreen();
+    });
+
+    it('renders when in error state', () => {
+      const error = new HardwareWalletError('Test error', {
+        code: ErrorCode.Unknown,
+        severity: Severity.Err,
+        category: Category.Unknown,
+        userMessage: 'Test error message',
+      });
+      Object.assign(mockConnectionState, {
+        status: ConnectionStatus.ErrorState,
+        error,
+      });
+      const { getByTestId } = render(
+        <HardwareWalletBottomSheet {...createDefaultProps()} />,
+      );
+
+      expect(
+        getByTestId(HARDWARE_WALLET_BOTTOM_SHEET_TEST_ID),
+      ).toBeOnTheScreen();
+    });
+
+    it('renders when scanning', () => {
+      mockConnectionState.status = ConnectionStatus.Scanning;
+      const { getByTestId } = render(
+        <HardwareWalletBottomSheet {...createDefaultProps()} />,
+      );
+
+      expect(
+        getByTestId(HARDWARE_WALLET_BOTTOM_SHEET_TEST_ID),
+      ).toBeOnTheScreen();
+    });
+
+    it('renders when in success state', () => {
+      Object.assign(mockConnectionState, {
+        status: ConnectionStatus.Ready,
+        deviceId: 'device-123',
+      });
+      const { getByTestId } = render(
+        <HardwareWalletBottomSheet {...createDefaultProps()} />,
+      );
+
+      expect(
+        getByTestId(HARDWARE_WALLET_BOTTOM_SHEET_TEST_ID),
+      ).toBeOnTheScreen();
+    });
+  });
+
+  describe('props', () => {
+    it('accepts custom successAutoDismissMs', () => {
+      Object.assign(mockConnectionState, {
+        status: ConnectionStatus.Ready,
+        deviceId: 'device-123',
+      });
+      const { getByTestId } = render(
+        <HardwareWalletBottomSheet
+          {...createDefaultProps({ successAutoDismissMs: 2000 })}
+        />,
+      );
+
+      expect(
+        getByTestId(HARDWARE_WALLET_BOTTOM_SHEET_TEST_ID),
+      ).toBeOnTheScreen();
+    });
+
+    it('uses default successAutoDismissMs when not provided', () => {
+      Object.assign(mockConnectionState, {
+        status: ConnectionStatus.Ready,
+        deviceId: 'device-123',
+      });
+      const { getByTestId } = render(
+        <HardwareWalletBottomSheet {...createDefaultProps()} />,
+      );
+
+      expect(
+        getByTestId(HARDWARE_WALLET_BOTTOM_SHEET_TEST_ID),
+      ).toBeOnTheScreen();
+    });
+  });
+
+  describe('device selection state', () => {
+    it('renders when scanning with devices', () => {
+      mockConnectionState.status = ConnectionStatus.Scanning;
+      Object.assign(mockDeviceSelection, {
+        devices: [{ id: 'device-1', name: 'Nano X' }],
+        selectedDevice: null,
+        isScanning: true,
+      });
+      const { getByTestId } = render(
+        <HardwareWalletBottomSheet {...createDefaultProps()} />,
+      );
+
+      expect(
+        getByTestId(HARDWARE_WALLET_BOTTOM_SHEET_TEST_ID),
+      ).toBeOnTheScreen();
+    });
+
+    it('renders when scanning with selected device', () => {
+      mockConnectionState.status = ConnectionStatus.Scanning;
+      const device = { id: 'device-1', name: 'Nano X' };
+      Object.assign(mockDeviceSelection, {
+        devices: [device],
+        selectedDevice: device,
+        isScanning: false,
+      });
+      const { getByTestId } = render(
+        <HardwareWalletBottomSheet {...createDefaultProps()} />,
+      );
+
+      expect(
+        getByTestId(HARDWARE_WALLET_BOTTOM_SHEET_TEST_ID),
+      ).toBeOnTheScreen();
+    });
+  });
+
+  describe('handleClose behavior', () => {
+    beforeEach(() => {
+      lastBottomSheetOnClose = undefined;
+    });
+
+    it('calls onClose when sheet closes during scanning', () => {
+      const onClose = jest.fn();
+      mockConnectionState.status = ConnectionStatus.Scanning;
+      render(
+        <HardwareWalletBottomSheet {...createDefaultProps({ onClose })} />,
+      );
+
+      expect(lastBottomSheetOnClose).toBeDefined();
+      lastBottomSheetOnClose?.();
+
+      expect(onClose).toHaveBeenCalled();
+    });
+
+    it('calls onClose when sheet closes during connecting', () => {
+      const onClose = jest.fn();
+      mockConnectionState.status = ConnectionStatus.Connecting;
+      render(
+        <HardwareWalletBottomSheet {...createDefaultProps({ onClose })} />,
+      );
+
+      expect(lastBottomSheetOnClose).toBeDefined();
+      lastBottomSheetOnClose?.();
+
+      expect(onClose).toHaveBeenCalled();
+    });
+
+    it('calls onClose when sheet closes during awaiting app', () => {
+      const onClose = jest.fn();
+      Object.assign(mockConnectionState, {
+        status: ConnectionStatus.AwaitingApp,
+        deviceId: 'device-123',
+      });
+      render(
+        <HardwareWalletBottomSheet {...createDefaultProps({ onClose })} />,
+      );
+
+      expect(lastBottomSheetOnClose).toBeDefined();
+      lastBottomSheetOnClose?.();
+
+      expect(onClose).toHaveBeenCalled();
+    });
+
+    it('calls onClose when sheet closes during error state', () => {
+      const onClose = jest.fn();
+      const error = new HardwareWalletError('Test error', {
+        code: ErrorCode.Unknown,
+        severity: Severity.Err,
+        category: Category.Unknown,
+        userMessage: 'Test error',
+      });
+      Object.assign(mockConnectionState, {
+        status: ConnectionStatus.ErrorState,
+        error,
+      });
+      render(
+        <HardwareWalletBottomSheet {...createDefaultProps({ onClose })} />,
+      );
+
+      expect(lastBottomSheetOnClose).toBeDefined();
+      lastBottomSheetOnClose?.();
+
+      expect(onClose).toHaveBeenCalled();
+    });
+
+    it('calls onClose when sheet closes during success state', () => {
+      const onClose = jest.fn();
+      Object.assign(mockConnectionState, {
+        status: ConnectionStatus.Ready,
+        deviceId: 'device-123',
+      });
+      render(
+        <HardwareWalletBottomSheet {...createDefaultProps({ onClose })} />,
+      );
+
+      expect(lastBottomSheetOnClose).toBeDefined();
+      lastBottomSheetOnClose?.();
+
+      expect(onClose).toHaveBeenCalled();
+    });
+
+    it('calls onAwaitingConfirmationCancel and onClose when sheet closes during confirmation', () => {
+      const onClose = jest.fn();
+      const onAwaitingConfirmationCancel = jest.fn();
+      Object.assign(mockConnectionState, {
+        status: ConnectionStatus.AwaitingConfirmation,
+        deviceId: 'device-123',
+      });
+      render(
+        <HardwareWalletBottomSheet
+          {...createDefaultProps({ onClose, onAwaitingConfirmationCancel })}
+        />,
+      );
+
+      expect(lastBottomSheetOnClose).toBeDefined();
+      lastBottomSheetOnClose?.();
+
+      expect(onAwaitingConfirmationCancel).toHaveBeenCalled();
+      expect(onClose).toHaveBeenCalled();
+    });
+  });
+
+  describe('handler invocations', () => {
+    beforeEach(() => {
+      lastDeviceSelectionProps = {};
+      lastErrorContentProps = {};
+      lastSuccessContentProps = {};
+      lastAwaitingConfirmationProps = {};
+      lastAwaitingAppProps = {};
+    });
+
+    it('calls selectDevice when device is selected', () => {
+      mockConnectionState.status = ConnectionStatus.Scanning;
+      const device = { id: 'device-1', name: 'Nano X' };
+      Object.assign(mockDeviceSelection, {
+        devices: [device],
+        selectedDevice: null,
+        isScanning: false,
+      });
+      render(<HardwareWalletBottomSheet {...createDefaultProps()} />);
+
+      const onSelectDevice = lastDeviceSelectionProps.onSelectDevice as (
+        d: unknown,
+      ) => void;
+      expect(onSelectDevice).toBeDefined();
+      onSelectDevice(device);
+
+      expect(mockActions.selectDevice).toHaveBeenCalledWith(device);
+    });
+
+    it('calls rescan when rescan is triggered', () => {
+      mockConnectionState.status = ConnectionStatus.Scanning;
+      render(<HardwareWalletBottomSheet {...createDefaultProps()} />);
+
+      const onRescan = lastDeviceSelectionProps.onRescan as () => void;
+      expect(onRescan).toBeDefined();
+      onRescan();
+
+      expect(mockActions.rescan).toHaveBeenCalled();
+    });
+
+    it('calls onClose when cancel is triggered', () => {
+      const onClose = jest.fn();
+      mockConnectionState.status = ConnectionStatus.Scanning;
+      render(
+        <HardwareWalletBottomSheet {...createDefaultProps({ onClose })} />,
+      );
+
+      const onCancelSelection = lastDeviceSelectionProps.onCancel as () => void;
+      expect(onCancelSelection).toBeDefined();
+      onCancelSelection();
+
+      expect(onClose).toHaveBeenCalled();
+    });
+
+    it('calls connect when device selection is confirmed', async () => {
+      mockConnectionState.status = ConnectionStatus.Scanning;
+      const device = { id: 'device-1', name: 'Nano X' };
+      Object.assign(mockDeviceSelection, {
+        devices: [device],
+        selectedDevice: device,
+        isScanning: false,
+      });
+      mockActions.connect.mockResolvedValue(undefined);
+      render(<HardwareWalletBottomSheet {...createDefaultProps()} />);
+
+      const onConfirmSelection =
+        lastDeviceSelectionProps.onConfirmSelection as () => Promise<void>;
+      expect(onConfirmSelection).toBeDefined();
+      await onConfirmSelection();
+
+      expect(mockActions.connect).toHaveBeenCalledWith('device-1');
+    });
+
+    it('calls retryEnsureDeviceReady when error continue is triggered', async () => {
+      const error = new HardwareWalletError('Test error', {
+        code: ErrorCode.Unknown,
+        severity: Severity.Err,
+        category: Category.Unknown,
+        userMessage: 'Test error',
+      });
+      Object.assign(mockConnectionState, {
+        status: ConnectionStatus.ErrorState,
+        error,
+      });
+      mockActions.retryEnsureDeviceReady.mockResolvedValue(undefined);
+      render(<HardwareWalletBottomSheet {...createDefaultProps()} />);
+
+      const onContinue =
+        lastErrorContentProps.onContinue as () => Promise<void>;
+      expect(onContinue).toBeDefined();
+      await onContinue();
+
+      expect(mockActions.retryEnsureDeviceReady).toHaveBeenCalled();
+    });
+
+    it('calls onClose when error dismiss is triggered', () => {
+      const onClose = jest.fn();
+      const error = new HardwareWalletError('Test error', {
+        code: ErrorCode.Unknown,
+        severity: Severity.Err,
+        category: Category.Unknown,
+        userMessage: 'Test error',
+      });
+      Object.assign(mockConnectionState, {
+        status: ConnectionStatus.ErrorState,
+        error,
+      });
+      render(
+        <HardwareWalletBottomSheet {...createDefaultProps({ onClose })} />,
+      );
+
+      const onDismiss = lastErrorContentProps.onDismiss as () => void;
+      expect(onDismiss).toBeDefined();
+      onDismiss();
+
+      expect(onClose).toHaveBeenCalled();
+    });
+
+    it('calls onConnectionSuccess when success dismiss is triggered', () => {
+      const onConnectionSuccess = jest.fn();
+      Object.assign(mockConnectionState, {
+        status: ConnectionStatus.Ready,
+        deviceId: 'device-123',
+      });
+      render(
+        <HardwareWalletBottomSheet
+          {...createDefaultProps({ onConnectionSuccess })}
+        />,
+      );
+
+      const onDismiss = lastSuccessContentProps.onDismiss as () => void;
+      expect(onDismiss).toBeDefined();
+      onDismiss();
+
+      expect(onConnectionSuccess).toHaveBeenCalled();
+    });
+
+    it('calls onAwaitingConfirmationCancel when cancel is triggered during confirmation', () => {
+      const onAwaitingConfirmationCancel = jest.fn();
+      Object.assign(mockConnectionState, {
+        status: ConnectionStatus.AwaitingConfirmation,
+        deviceId: 'device-123',
+      });
+      render(
+        <HardwareWalletBottomSheet
+          {...createDefaultProps({ onAwaitingConfirmationCancel })}
+        />,
+      );
+
+      const onCancel = lastAwaitingConfirmationProps.onCancel as () => void;
+      expect(onCancel).toBeDefined();
+      onCancel();
+
+      expect(onAwaitingConfirmationCancel).toHaveBeenCalled();
+    });
+
+    it('calls retryEnsureDeviceReady when awaiting app continue is triggered', async () => {
+      Object.assign(mockConnectionState, {
+        status: ConnectionStatus.AwaitingApp,
+        deviceId: 'device-123',
+        requiredApp: 'Ethereum',
+      });
+      mockActions.retryEnsureDeviceReady.mockResolvedValue(undefined);
+      render(<HardwareWalletBottomSheet {...createDefaultProps()} />);
+
+      const onContinue = lastAwaitingAppProps.onContinue as () => Promise<void>;
+      expect(onContinue).toBeDefined();
+      await onContinue();
+
+      expect(mockActions.retryEnsureDeviceReady).toHaveBeenCalled();
+    });
+  });
+});
diff --git a/app/core/HardwareWallet/components/HardwareWalletBottomSheet/HardwareWalletBottomSheet.tsx b/app/core/HardwareWallet/components/HardwareWalletBottomSheet/HardwareWalletBottomSheet.tsx
new file mode 100644
index 000000000000..5d1bec1841d0
--- /dev/null
+++ b/app/core/HardwareWallet/components/HardwareWalletBottomSheet/HardwareWalletBottomSheet.tsx
@@ -0,0 +1,244 @@
+import React, { useMemo, useRef, useCallback, useEffect } from 'react';
+import { StyleSheet } from 'react-native';
+
+import BottomSheet, {
+  BottomSheetRef,
+} from '../../../../component-library/components/BottomSheets/BottomSheet';
+
+import { useTheme } from '../../../../util/theme';
+
+import {
+  HardwareWalletType,
+  HardwareWalletConnectionState,
+  ConnectionStatus,
+} from '@metamask/hw-wallet-sdk';
+
+import {
+  ConnectingContent,
+  DeviceSelectionContent,
+  AwaitingAppContent,
+  AwaitingConfirmationContent,
+  ErrorContent,
+  SuccessContent,
+} from './contents';
+import { DiscoveredDevice, type DeviceSelectionState } from '../../types';
+import DevLogger from '../../../SDKConnect/utils/DevLogger';
+
+export const HARDWARE_WALLET_BOTTOM_SHEET_TEST_ID =
+  'hardware-wallet-bottom-sheet';
+
+const createStyles = (colors: { background: { default: string } }) =>
+  StyleSheet.create({
+    bottomSheet: {
+      backgroundColor: colors.background.default,
+    },
+  });
+
+export interface HardwareWalletBottomSheetProps {
+  connectionState: HardwareWalletConnectionState;
+  deviceSelection: DeviceSelectionState;
+  walletType: HardwareWalletType | null;
+
+  retryEnsureDeviceReady: () => Promise<void>;
+  selectDevice: (device: DiscoveredDevice) => void;
+  rescan: () => void;
+  connect: (deviceId: string) => Promise<void>;
+
+  /** Callback when sheet is dismissed (handles all cleanup) */
+  onClose: () => void;
+  /** Show success state briefly before hiding (ms, 0 to disable) */
+  successAutoDismissMs?: number;
+  /** Callback when connection succeeds (e.g., to navigate to account selection) */
+  onConnectionSuccess?: () => void;
+  /** Callback when user cancels during awaiting confirmation state */
+  onAwaitingConfirmationCancel?: () => void;
+}
+
+/**
+ * Unified Hardware Wallet Bottom Sheet
+ *
+ * Automatically displays the appropriate content based on connection state:
+ * - Scanning: Device selection list
+ * - Connecting: Shows tips and loading spinner
+ * - AwaitingApp: Prompts user to open correct app
+ * - AwaitingConfirmation: Prompts user to confirm on device
+ * - Error: Shows error with recovery actions
+ * - Ready: Shows success feedback
+ */
+export const HardwareWalletBottomSheet: React.FC<
+  HardwareWalletBottomSheetProps
+> = ({
+  connectionState,
+  deviceSelection,
+  walletType,
+  retryEnsureDeviceReady,
+  selectDevice,
+  rescan,
+  connect,
+  onClose,
+  successAutoDismissMs = 1000,
+  onConnectionSuccess,
+  onAwaitingConfirmationCancel,
+}) => {
+  const { colors } = useTheme();
+  const styles = useMemo(() => createStyles(colors), [colors]);
+
+  const bottomSheetRef = useRef<BottomSheetRef>(null);
+
+  const { devices, selectedDevice, isScanning } = deviceSelection;
+
+  const shouldShow = useMemo(() => {
+    switch (connectionState.status) {
+      case ConnectionStatus.Scanning:
+      case ConnectionStatus.Connecting:
+      case ConnectionStatus.Connected:
+      case ConnectionStatus.AwaitingApp:
+      case ConnectionStatus.AwaitingConfirmation:
+      case ConnectionStatus.ErrorState:
+      case ConnectionStatus.Ready:
+        return true;
+      default:
+        return false;
+    }
+  }, [connectionState.status]);
+
+  useEffect(() => {
+    DevLogger.log(
+      '[HardwareWalletBottomSheet] shouldShow:',
+      shouldShow,
+      'status:',
+      connectionState.status,
+    );
+  }, [shouldShow, connectionState.status]);
+
+  const handleClose = useCallback(() => {
+    if (connectionState.status === ConnectionStatus.AwaitingConfirmation) {
+      onAwaitingConfirmationCancel?.();
+    }
+    onClose();
+  }, [connectionState.status, onAwaitingConfirmationCancel, onClose]);
+
+  const handleAwaitingConfirmationCancel = useCallback(() => {
+    onAwaitingConfirmationCancel?.();
+  }, [onAwaitingConfirmationCancel]);
+
+  const handleErrorContinue = useCallback(async () => {
+    await retryEnsureDeviceReady();
+  }, [retryEnsureDeviceReady]);
+
+  const handleErrorDismiss = useCallback(() => {
+    onClose();
+  }, [onClose]);
+
+  const handleSuccessDismiss = useCallback(() => {
+    onConnectionSuccess?.();
+  }, [onConnectionSuccess]);
+
+  const handleSelectDevice = useCallback(
+    (selectedDev: DiscoveredDevice) => {
+      selectDevice(selectedDev);
+    },
+    [selectDevice],
+  );
+
+  const handleConfirmDeviceSelection = useCallback(async () => {
+    if (selectedDevice) {
+      DevLogger.log(
+        '[HardwareWalletBottomSheet] Connecting to device:',
+        selectedDevice.id,
+      );
+      await connect(selectedDevice.id);
+    }
+  }, [selectedDevice, connect]);
+
+  const handleRescan = useCallback(() => {
+    rescan();
+  }, [rescan]);
+
+  const handleCancelDeviceSelection = useCallback(() => {
+    onClose();
+  }, [onClose]);
+
+  // The effective device type — only used when the sheet is visible,
+  // so walletType should always be set by then.
+  const deviceType = walletType ?? HardwareWalletType.Ledger;
+
+  const renderContent = () => {
+    switch (connectionState.status) {
+      case ConnectionStatus.Ready:
+        return (
+          <SuccessContent
+            deviceType={deviceType}
+            onDismiss={handleSuccessDismiss}
+            autoDismissMs={successAutoDismissMs}
+          />
+        );
+
+      case ConnectionStatus.Scanning:
+        return (
+          <DeviceSelectionContent
+            devices={devices}
+            selectedDevice={selectedDevice ?? undefined}
+            isScanning={isScanning}
+            deviceType={deviceType}
+            onSelectDevice={handleSelectDevice}
+            onConfirmSelection={handleConfirmDeviceSelection}
+            onRescan={handleRescan}
+            onCancel={handleCancelDeviceSelection}
+          />
+        );
+
+      case ConnectionStatus.Connecting:
+      case ConnectionStatus.Connected:
+        return <ConnectingContent deviceType={deviceType} />;
+
+      case ConnectionStatus.AwaitingApp:
+        return (
+          <AwaitingAppContent
+            deviceType={deviceType}
+            requiredApp={connectionState.appName}
+            onContinue={handleErrorContinue}
+          />
+        );
+
+      case ConnectionStatus.AwaitingConfirmation:
+        return (
+          <AwaitingConfirmationContent
+            deviceType={deviceType}
+            operationType={connectionState.operationType}
+            onCancel={handleAwaitingConfirmationCancel}
+          />
+        );
+
+      case ConnectionStatus.ErrorState:
+        return (
+          <ErrorContent
+            error={connectionState.error}
+            deviceType={deviceType}
+            onContinue={handleErrorContinue}
+            onDismiss={handleErrorDismiss}
+          />
+        );
+
+      default:
+        return null;
+    }
+  };
+
+  if (!shouldShow) {
+    return null;
+  }
+
+  return (
+    <BottomSheet
+      ref={bottomSheetRef}
+      testID={HARDWARE_WALLET_BOTTOM_SHEET_TEST_ID}
+      isFullscreen={false}
+      onClose={handleClose}
+      shouldNavigateBack={false}
+      style={styles.bottomSheet}
+    >
+      {renderContent()}
+    </BottomSheet>
+  );
+};
diff --git a/app/core/HardwareWallet/components/HardwareWalletBottomSheet/contents/AwaitingAppContent.test.tsx b/app/core/HardwareWallet/components/HardwareWalletBottomSheet/contents/AwaitingAppContent.test.tsx
new file mode 100644
index 000000000000..ca952bdbfbeb
--- /dev/null
+++ b/app/core/HardwareWallet/components/HardwareWalletBottomSheet/contents/AwaitingAppContent.test.tsx
@@ -0,0 +1,107 @@
+import React from 'react';
+import { fireEvent } from '@testing-library/react-native';
+import { HardwareWalletType } from '@metamask/hw-wallet-sdk';
+import renderWithProvider from '../../../../../util/test/renderWithProvider';
+import { AppThemeKey } from '../../../../../util/theme/models';
+
+import {
+  AwaitingAppContent,
+  AWAITING_APP_CONTENT_TEST_ID,
+} from './AwaitingAppContent';
+
+// Mock locales
+jest.mock('../../../../../../locales/i18n', () => ({
+  strings: (key: string, params?: Record<string, string>) => {
+    if (params) {
+      return `${key} ${JSON.stringify(params)}`;
+    }
+    return key;
+  },
+}));
+
+describe('AwaitingAppContent', () => {
+  const mockInitialState = {
+    user: {
+      appTheme: AppThemeKey.light,
+    },
+    settings: {
+      useBlockieIcon: false,
+    },
+    engine: {
+      backgroundState: {
+        PreferencesController: {},
+      },
+    },
+  };
+
+  const defaultProps = {
+    deviceType: HardwareWalletType.Ledger,
+  };
+
+  const renderComponent = (props = {}) =>
+    renderWithProvider(
+      <AwaitingAppContent {...defaultProps} {...props} />,
+      { state: mockInitialState },
+      false,
+      false,
+    );
+
+  it('renders with test ID', () => {
+    const { getByTestId } = renderComponent();
+
+    expect(getByTestId(AWAITING_APP_CONTENT_TEST_ID)).toBeOnTheScreen();
+  });
+
+  it('renders open app message', () => {
+    const { getByText } = renderComponent();
+
+    expect(getByText(/hardware_wallet\.awaiting_app\.title/)).toBeOnTheScreen();
+    expect(
+      getByText(/hardware_wallet\.awaiting_app\.message/),
+    ).toBeOnTheScreen();
+  });
+
+  it('shows current app when different from required', () => {
+    const { getByText } = renderComponent({
+      currentApp: 'Bitcoin',
+      requiredApp: 'Ethereum',
+    });
+
+    expect(
+      getByText('hardware_wallet.awaiting_app.current_app {"app":"Bitcoin"}'),
+    ).toBeOnTheScreen();
+  });
+
+  it('does not show current app when same as required', () => {
+    const { queryByText } = renderComponent({
+      currentApp: 'Ethereum',
+      requiredApp: 'Ethereum',
+    });
+
+    expect(queryByText(/current_app/)).toBeNull();
+  });
+
+  it('does not show current app for BOLOS', () => {
+    const { queryByText } = renderComponent({
+      currentApp: 'BOLOS',
+      requiredApp: 'Ethereum',
+    });
+
+    expect(queryByText(/current_app/)).toBeNull();
+  });
+
+  it('renders continue button when onContinue provided', () => {
+    const onContinue = jest.fn();
+    const { getByText } = renderComponent({ onContinue });
+
+    const continueButton = getByText('hardware_wallet.common.continue');
+    fireEvent.press(continueButton);
+    expect(onContinue).toHaveBeenCalled();
+  });
+
+  it('does not render continue button when onContinue not provided', () => {
+    const { queryByText } = renderComponent();
+
+    expect(queryByText('hardware_wallet.common.continue')).toBeNull();
+  });
+});
diff --git a/app/core/HardwareWallet/components/HardwareWalletBottomSheet/contents/AwaitingAppContent.tsx b/app/core/HardwareWallet/components/HardwareWalletBottomSheet/contents/AwaitingAppContent.tsx
new file mode 100644
index 000000000000..7a5984ef7cba
--- /dev/null
+++ b/app/core/HardwareWallet/components/HardwareWalletBottomSheet/contents/AwaitingAppContent.tsx
@@ -0,0 +1,132 @@
+import React, { useMemo } from 'react';
+import { View, StyleSheet } from 'react-native';
+
+import Text, {
+  TextVariant,
+  TextColor,
+} from '../../../../../component-library/components/Texts/Text';
+import Button, {
+  ButtonVariants,
+  ButtonSize,
+  ButtonWidthTypes,
+} from '../../../../../component-library/components/Buttons/Button';
+import Icon, {
+  IconName,
+  IconSize,
+  IconColor,
+} from '../../../../../component-library/components/Icons/Icon';
+
+import { strings } from '../../../../../../locales/i18n';
+import { useTheme } from '../../../../../util/theme';
+import { Colors } from '../../../../../util/theme/models';
+import { HardwareWalletType } from '@metamask/hw-wallet-sdk';
+import { getHardwareWalletTypeName } from '../../../helpers';
+import { ContentLayout } from './ContentLayout';
+
+export const AWAITING_APP_CONTENT_TEST_ID = 'awaiting-app-content';
+
+const createStyles = (colors: Colors) =>
+  StyleSheet.create({
+    messageText: {
+      textAlign: 'center',
+      marginBottom: 8,
+    },
+    currentAppContainer: {
+      backgroundColor: colors.background.alternative,
+      paddingHorizontal: 12,
+      paddingVertical: 8,
+      borderRadius: 8,
+      marginTop: 12,
+    },
+    currentAppText: {
+      textAlign: 'center',
+    },
+  });
+
+export interface AwaitingAppContentProps {
+  /** The device type for context in messages */
+  deviceType: HardwareWalletType;
+  /** The name of the app currently open on the device (if known) */
+  currentApp?: string;
+  /** The required app name (defaults to 'Ethereum') */
+  requiredApp?: string;
+  /** Callback when user taps Continue to retry */
+  onContinue?: () => void;
+  /** Whether a retry is in progress */
+  isLoading?: boolean;
+}
+
+/**
+ * Content component shown when the user needs to open the correct app on their hardware wallet.
+ */
+export const AwaitingAppContent: React.FC<AwaitingAppContentProps> = ({
+  deviceType,
+  currentApp,
+  requiredApp = 'Ethereum',
+  onContinue,
+  isLoading = false,
+}) => {
+  const { colors } = useTheme();
+  const styles = useMemo(() => createStyles(colors), [colors]);
+  const deviceName = getHardwareWalletTypeName(deviceType);
+
+  const showCurrentApp =
+    currentApp && currentApp !== requiredApp && currentApp !== 'BOLOS';
+
+  return (
+    <ContentLayout
+      testID={AWAITING_APP_CONTENT_TEST_ID}
+      icon={
+        <Icon
+          name={IconName.Setting}
+          size={IconSize.Xl}
+          color={IconColor.Primary}
+        />
+      }
+      title={strings('hardware_wallet.awaiting_app.title', {
+        app: requiredApp,
+      })}
+      body={
+        <>
+          <Text
+            variant={TextVariant.BodyMD}
+            color={TextColor.Default}
+            style={styles.messageText}
+          >
+            {strings('hardware_wallet.awaiting_app.message', {
+              device: deviceName,
+              app: requiredApp,
+            })}
+          </Text>
+
+          {showCurrentApp && (
+            <View style={styles.currentAppContainer}>
+              <Text
+                variant={TextVariant.BodySM}
+                color={TextColor.Default}
+                style={styles.currentAppText}
+              >
+                {strings('hardware_wallet.awaiting_app.current_app', {
+                  app: currentApp,
+                })}
+              </Text>
+            </View>
+          )}
+        </>
+      }
+      footer={
+        onContinue ? (
+          <Button
+            variant={ButtonVariants.Primary}
+            size={ButtonSize.Lg}
+            width={ButtonWidthTypes.Full}
+            label={strings('hardware_wallet.common.continue')}
+            onPress={onContinue}
+            loading={isLoading}
+            isDisabled={isLoading}
+          />
+        ) : undefined
+      }
+    />
+  );
+};
diff --git a/app/core/HardwareWallet/components/HardwareWalletBottomSheet/contents/AwaitingConfirmationContent.test.tsx b/app/core/HardwareWallet/components/HardwareWalletBottomSheet/contents/AwaitingConfirmationContent.test.tsx
new file mode 100644
index 000000000000..b4d858e3d1bc
--- /dev/null
+++ b/app/core/HardwareWallet/components/HardwareWalletBottomSheet/contents/AwaitingConfirmationContent.test.tsx
@@ -0,0 +1,104 @@
+import React from 'react';
+import { fireEvent } from '@testing-library/react-native';
+import renderWithProvider from '../../../../../util/test/renderWithProvider';
+import { AppThemeKey } from '../../../../../util/theme/models';
+import { HardwareWalletType } from '@metamask/hw-wallet-sdk';
+
+import {
+  AwaitingConfirmationContent,
+  AWAITING_CONFIRMATION_CONTENT_TEST_ID,
+  AWAITING_CONFIRMATION_SPINNER_TEST_ID,
+} from './AwaitingConfirmationContent';
+
+// Mock locales
+jest.mock('../../../../../../locales/i18n', () => ({
+  strings: (key: string, params?: Record<string, string>) => {
+    if (params) {
+      return `${key} ${JSON.stringify(params)}`;
+    }
+    return key;
+  },
+}));
+
+describe('AwaitingConfirmationContent', () => {
+  const mockInitialState = {
+    user: {
+      appTheme: AppThemeKey.light,
+    },
+    settings: {
+      useBlockieIcon: false,
+    },
+    engine: {
+      backgroundState: {
+        PreferencesController: {},
+      },
+    },
+  };
+
+  const defaultProps = {
+    deviceType: HardwareWalletType.Ledger,
+  };
+
+  const renderComponent = (props = {}) =>
+    renderWithProvider(
+      <AwaitingConfirmationContent {...defaultProps} {...props} />,
+      { state: mockInitialState },
+      false,
+      false,
+    );
+
+  it('renders with test ID', () => {
+    const { getByTestId } = renderComponent();
+
+    expect(
+      getByTestId(AWAITING_CONFIRMATION_CONTENT_TEST_ID),
+    ).toBeOnTheScreen();
+  });
+
+  it('renders activity indicator', () => {
+    const { getByTestId } = renderComponent();
+
+    expect(
+      getByTestId(AWAITING_CONFIRMATION_SPINNER_TEST_ID),
+    ).toBeOnTheScreen();
+  });
+
+  it('renders review message', () => {
+    const { getByText } = renderComponent();
+
+    expect(
+      getByText(/hardware_wallet\.awaiting_confirmation\.message/),
+    ).toBeOnTheScreen();
+  });
+
+  it('shows transaction title by default', () => {
+    const { getByText } = renderComponent();
+
+    expect(
+      getByText(/hardware_wallet\.awaiting_confirmation\.title_transaction/),
+    ).toBeOnTheScreen();
+  });
+
+  it('shows message title for message operation', () => {
+    const { getByText } = renderComponent({ operationType: 'message' });
+
+    expect(
+      getByText(/hardware_wallet\.awaiting_confirmation\.title_message/),
+    ).toBeOnTheScreen();
+  });
+
+  it('renders cancel button when onCancel provided', () => {
+    const onCancel = jest.fn();
+    const { getByText } = renderComponent({ onCancel });
+
+    const cancelButton = getByText('hardware_wallet.common.cancel');
+    fireEvent.press(cancelButton);
+    expect(onCancel).toHaveBeenCalled();
+  });
+
+  it('does not render cancel button when onCancel not provided', () => {
+    const { queryByText } = renderComponent();
+
+    expect(queryByText('hardware_wallet.common.cancel')).toBeNull();
+  });
+});
diff --git a/app/core/HardwareWallet/components/HardwareWalletBottomSheet/contents/AwaitingConfirmationContent.tsx b/app/core/HardwareWallet/components/HardwareWalletBottomSheet/contents/AwaitingConfirmationContent.tsx
new file mode 100644
index 000000000000..61e4ec80e987
--- /dev/null
+++ b/app/core/HardwareWallet/components/HardwareWalletBottomSheet/contents/AwaitingConfirmationContent.tsx
@@ -0,0 +1,114 @@
+import React, { useMemo } from 'react';
+import { View, StyleSheet, ActivityIndicator } from 'react-native';
+
+import Text, {
+  TextVariant,
+  TextColor,
+} from '../../../../../component-library/components/Texts/Text';
+import Button, {
+  ButtonVariants,
+  ButtonSize,
+  ButtonWidthTypes,
+} from '../../../../../component-library/components/Buttons/Button';
+import Icon, {
+  IconName,
+  IconSize,
+  IconColor,
+} from '../../../../../component-library/components/Icons/Icon';
+
+import { strings } from '../../../../../../locales/i18n';
+import { useTheme } from '../../../../../util/theme';
+import { HardwareWalletType } from '@metamask/hw-wallet-sdk';
+import { getHardwareWalletTypeName } from '../../../helpers';
+import { ContentLayout } from './ContentLayout';
+
+export const AWAITING_CONFIRMATION_CONTENT_TEST_ID =
+  'awaiting-confirmation-content';
+export const AWAITING_CONFIRMATION_SPINNER_TEST_ID =
+  'awaiting-confirmation-spinner';
+
+const styles = StyleSheet.create({
+  messageText: {
+    textAlign: 'center',
+  },
+  spinnerContainer: {
+    alignItems: 'center',
+    marginTop: 8,
+  },
+});
+
+export interface AwaitingConfirmationContentProps {
+  /** The device type for context in messages */
+  deviceType: HardwareWalletType;
+  /** The type of operation awaiting confirmation (e.g., 'transaction', 'message') */
+  operationType?: string;
+  /** Optional callback when user wants to cancel/reject */
+  onCancel?: () => void;
+}
+
+export const AwaitingConfirmationContent: React.FC<
+  AwaitingConfirmationContentProps
+> = ({ deviceType, operationType, onCancel }) => {
+  const { colors } = useTheme();
+  const deviceName = getHardwareWalletTypeName(deviceType);
+
+  const title = useMemo(() => {
+    switch (operationType) {
+      case 'message':
+        return strings('hardware_wallet.awaiting_confirmation.title_message', {
+          device: deviceName,
+        });
+      case 'transaction':
+      default:
+        return strings(
+          'hardware_wallet.awaiting_confirmation.title_transaction',
+          { device: deviceName },
+        );
+    }
+  }, [operationType, deviceName]);
+
+  return (
+    <ContentLayout
+      testID={AWAITING_CONFIRMATION_CONTENT_TEST_ID}
+      icon={
+        <Icon
+          name={IconName.SecurityTick}
+          size={IconSize.Xl}
+          color={IconColor.Primary}
+        />
+      }
+      title={title}
+      body={
+        <>
+          <Text
+            variant={TextVariant.BodyMD}
+            color={TextColor.Default}
+            style={styles.messageText}
+          >
+            {strings('hardware_wallet.awaiting_confirmation.message', {
+              device: deviceName,
+            })}
+          </Text>
+          <View style={styles.spinnerContainer}>
+            <ActivityIndicator
+              testID={AWAITING_CONFIRMATION_SPINNER_TEST_ID}
+              size="large"
+              color={colors.primary.default}
+            />
+          </View>
+        </>
+      }
+      footer={
+        onCancel ? (
+          <Button
+            variant={ButtonVariants.Secondary}
+            size={ButtonSize.Lg}
+            label={strings('hardware_wallet.common.cancel')}
+            width={ButtonWidthTypes.Full}
+            onPress={onCancel}
+          />
+        ) : undefined
+      }
+    />
+  );
+};
diff --git a/app/core/HardwareWallet/components/HardwareWalletBottomSheet/contents/ConnectingContent.test.tsx b/app/core/HardwareWallet/components/HardwareWalletBottomSheet/contents/ConnectingContent.test.tsx
new file mode 100644
index 000000000000..0a1d0c22ae38
--- /dev/null
+++ b/app/core/HardwareWallet/components/HardwareWalletBottomSheet/contents/ConnectingContent.test.tsx
@@ -0,0 +1,86 @@
+import React from 'react';
+import { HardwareWalletType } from '@metamask/hw-wallet-sdk';
+import renderWithProvider from '../../../../../util/test/renderWithProvider';
+import { AppThemeKey } from '../../../../../util/theme/models';
+
+import {
+  ConnectingContent,
+  CONNECTING_CONTENT_TEST_ID,
+  CONNECTING_CONTENT_SPINNER_TEST_ID,
+} from './ConnectingContent';
+
+// Mock locales
+jest.mock('../../../../../../locales/i18n', () => ({
+  strings: (key: string, params?: Record<string, string>) => {
+    if (params) {
+      return `${key} ${JSON.stringify(params)}`;
+    }
+    return key;
+  },
+}));
+
+// Mock react-native-device-info
+jest.mock('react-native-device-info', () => ({
+  getSystemVersion: jest.fn().mockReturnValue('14'),
+}));
+
+describe('ConnectingContent', () => {
+  const mockInitialState = {
+    user: {
+      appTheme: AppThemeKey.light,
+    },
+    settings: {
+      useBlockieIcon: false,
+    },
+    engine: {
+      backgroundState: {
+        PreferencesController: {},
+      },
+    },
+  };
+
+  const defaultProps = {
+    deviceType: HardwareWalletType.Ledger,
+  };
+
+  const renderComponent = (props = {}) =>
+    renderWithProvider(
+      <ConnectingContent {...defaultProps} {...props} />,
+      { state: mockInitialState },
+      false,
+      false,
+    );
+
+  it('renders with test ID', () => {
+    const { getByTestId } = renderComponent();
+
+    expect(getByTestId(CONNECTING_CONTENT_TEST_ID)).toBeOnTheScreen();
+  });
+
+  it('renders activity indicator', () => {
+    const { getByTestId } = renderComponent();
+
+    expect(getByTestId(CONNECTING_CONTENT_SPINNER_TEST_ID)).toBeOnTheScreen();
+  });
+
+  it('renders tips', () => {
+    const { getByText } = renderComponent();
+
+    expect(
+      getByText('hardware_wallet.connecting.tips_header'),
+    ).toBeOnTheScreen();
+    // All tips are rendered with { device: deviceName } interpolation params
+    expect(
+      getByText(/hardware_wallet\.connecting\.tip_unlock/),
+    ).toBeOnTheScreen();
+    expect(
+      getByText(/hardware_wallet\.connecting\.tip_open_app/),
+    ).toBeOnTheScreen();
+    expect(
+      getByText(/hardware_wallet\.connecting\.tip_enable_bluetooth/),
+    ).toBeOnTheScreen();
+    expect(
+      getByText(/hardware_wallet\.connecting\.tip_dnd_off/),
+    ).toBeOnTheScreen();
+  });
+});
diff --git a/app/core/HardwareWallet/components/HardwareWalletBottomSheet/contents/ConnectingContent.tsx b/app/core/HardwareWallet/components/HardwareWalletBottomSheet/contents/ConnectingContent.tsx
new file mode 100644
index 000000000000..fd4ba6edb894
--- /dev/null
+++ b/app/core/HardwareWallet/components/HardwareWalletBottomSheet/contents/ConnectingContent.tsx
@@ -0,0 +1,100 @@
+import React from 'react';
+import { View, StyleSheet } from 'react-native';
+
+import Text, {
+  TextVariant,
+  TextColor,
+} from '../../../../../component-library/components/Texts/Text';
+import Button, {
+  ButtonVariants,
+  ButtonSize,
+  ButtonWidthTypes,
+} from '../../../../../component-library/components/Buttons/Button';
+
+import { strings } from '../../../../../../locales/i18n';
+import { HardwareWalletType } from '@metamask/hw-wallet-sdk';
+import {
+  getHardwareWalletTypeName,
+  getConnectionTipsForWalletType,
+} from '../../../helpers';
+import { ContentLayout } from './ContentLayout';
+
+export const CONNECTING_CONTENT_TEST_ID = 'connecting-content';
+export const CONNECTING_CONTENT_SPINNER_TEST_ID = 'connecting-content-spinner';
+
+const styles = StyleSheet.create({
+  tipItem: {
+    flexDirection: 'row',
+    marginBottom: 8,
+    paddingLeft: 8,
+  },
+  tipBullet: {
+    marginRight: 8,
+  },
+  tipText: {
+    flex: 1,
+  },
+});
+
+export interface ConnectingContentProps {
+  /** The device type for context in messages */
+  deviceType: HardwareWalletType;
+}
+
+export const ConnectingContent: React.FC<ConnectingContentProps> = ({
+  deviceType,
+}) => {
+  const deviceName = getHardwareWalletTypeName(deviceType);
+  const connectionTips = getConnectionTipsForWalletType(deviceType);
+
+  return (
+    <ContentLayout
+      testID={CONNECTING_CONTENT_TEST_ID}
+      title={strings('hardware_wallet.connecting.title', {
+        device: deviceName,
+      })}
+      body={
+        connectionTips.length > 0 ? (
+          <View>
+            <Text variant={TextVariant.BodyMD} color={TextColor.Default}>
+              {strings('hardware_wallet.connecting.tips_header')}
+            </Text>
+
+            {connectionTips.map((tipKey) => (
+              <View key={tipKey} style={styles.tipItem}>
+                <Text
+                  variant={TextVariant.BodyMD}
+                  color={TextColor.Default}
+                  style={styles.tipBullet}
+                >
+                  •
+                </Text>
+                <Text
+                  variant={TextVariant.BodyMD}
+                  color={TextColor.Default}
+                  style={styles.tipText}
+                >
+                  {strings(tipKey, { device: deviceName })}
+                </Text>
+              </View>
+            ))}
+          </View>
+        ) : undefined
+      }
+      footer={
+        <Button
+          variant={ButtonVariants.Primary}
+          size={ButtonSize.Lg}
+          width={ButtonWidthTypes.Full}
+          label=""
+          onPress={
+            // eslint-disable-next-line no-empty-function
+            () => {}
+          }
+          loading
+          testID={CONNECTING_CONTENT_SPINNER_TEST_ID}
+        />
+      }
+    />
+  );
+};
diff --git a/app/core/HardwareWallet/components/HardwareWalletBottomSheet/contents/ContentLayout.tsx b/app/core/HardwareWallet/components/HardwareWalletBottomSheet/contents/ContentLayout.tsx
new file mode 100644
index 000000000000..06b5b462d9f6
--- /dev/null
+++ b/app/core/HardwareWallet/components/HardwareWalletBottomSheet/contents/ContentLayout.tsx
@@ -0,0 +1,88 @@
+import React from 'react';
+import { View, StyleSheet } from 'react-native';
+
+import Text, {
+  TextVariant,
+  TextColor,
+} from '../../../../../component-library/components/Texts/Text';
+
+export const CONTENT_LAYOUT_TEST_ID = 'content-layout';
+
+const styles = StyleSheet.create({
+  container: {
+    paddingHorizontal: 24,
+    paddingBottom: 24,
+  },
+  iconContainer: {
+    alignItems: 'center',
+    justifyContent: 'center',
+    marginBottom: 16,
+    marginTop: 8,
+  },
+  titleContainer: {
+    alignItems: 'center',
+    marginBottom: 16,
+  },
+  titleContainerNoIcon: {
+    alignItems: 'center',
+    marginBottom: 16,
+    marginTop: 24,
+  },
+  title: {
+    textAlign: 'center',
+  },
+  bodyContainer: {
+    marginBottom: 0,
+  },
+  footerContainer: {
+    marginTop: 16,
+    width: '100%',
+    gap: 8,
+  },
+});
+
+export interface ContentLayoutProps {
+  /** Icon element rendered at the top */
+  icon?: React.ReactNode;
+  /** Title text */
+  title: string;
+  /** Optional body content rendered between title and footer */
+  body?: React.ReactNode;
+  /** Optional footer content (buttons, spinners, etc.) */
+  footer?: React.ReactNode;
+  /** Optional testID override */
+  testID?: string;
+  /** Optional testID for the title Text element */
+  titleTestID?: string;
+}
+
+/**
+ * Shared layout skeleton for all HardwareWalletBottomSheet content components.
+ */
+export const ContentLayout: React.FC<ContentLayoutProps> = ({
+  icon,
+  title,
+  body,
+  footer,
+  testID = CONTENT_LAYOUT_TEST_ID,
+  titleTestID,
+}) => (
+  <View style={styles.container} testID={testID}>
+    {icon && <View style={styles.iconContainer}>{icon}</View>}
+
+    <View style={icon ? styles.titleContainer : styles.titleContainerNoIcon}>
+      <Text
+        testID={titleTestID}
+        variant={TextVariant.HeadingMD}
+        color={TextColor.Default}
+        style={styles.title}
+      >
+        {title}
+      </Text>
+    </View>
+
+    {body && <View style={styles.bodyContainer}>{body}</View>}
+
+    {footer && <View style={styles.footerContainer}>{footer}</View>}
+  </View>
+);
diff --git a/app/core/HardwareWallet/components/HardwareWalletBottomSheet/contents/DeviceSelectionContent.test.tsx b/app/core/HardwareWallet/components/HardwareWalletBottomSheet/contents/DeviceSelectionContent.test.tsx
new file mode 100644
index 000000000000..5734ca670bda
--- /dev/null
+++ b/app/core/HardwareWallet/components/HardwareWalletBottomSheet/contents/DeviceSelectionContent.test.tsx
@@ -0,0 +1,201 @@
+import React from 'react';
+import { fireEvent } from '@testing-library/react-native';
+import renderWithProvider from '../../../../../util/test/renderWithProvider';
+import { AppThemeKey } from '../../../../../util/theme/models';
+import { HardwareWalletType } from '@metamask/hw-wallet-sdk';
+import { DiscoveredDevice } from '../../../types';
+import {
+  DeviceSelectionContent,
+  DEVICE_SELECTION_CONTENT_TEST_ID,
+  DEVICE_SELECTION_ITEM_TEST_ID,
+  DEVICE_SELECTION_EMPTY_TEST_ID,
+  DEVICE_SELECTION_SCANNING_TEST_ID,
+} from './DeviceSelectionContent';
+
+// Mock i18n
+jest.mock('../../../../../../locales/i18n', () => ({
+  strings: (key: string, params?: Record<string, string>) => {
+    const translations: Record<string, string> = {
+      'hardware_wallet.device_names.ledger': 'Ledger',
+      'hardware_wallet.device_selection.title': `Select ${params?.device || 'device'}`,
+      'hardware_wallet.device_selection.scanning': 'Scanning...',
+      'hardware_wallet.device_selection.no_devices_found': 'No devices found',
+      'hardware_wallet.device_selection.no_devices_hint': `Make sure your ${params?.device || 'device'} is on`,
+      'hardware_wallet.device_selection.tips': `Tips for ${params?.device || 'device'}`,
+      'hardware_wallet.device_selection.connect': 'Connect',
+      'hardware_wallet.device_selection.rescan': 'Scan Again',
+      'hardware_wallet.device_selection.unknown_device': 'Unknown Device',
+      'hardware_wallet.device_selection.signal_strength': `Signal: ${params?.rssi || '0'}`,
+      'hardware_wallet.common.cancel': 'Cancel',
+    };
+    return translations[key] || key;
+  },
+}));
+
+const mockDevices: DiscoveredDevice[] = [
+  { id: 'device-1', name: 'Nano X 1234', metadata: { rssi: -45 } },
+  { id: 'device-2', name: 'Nano X 5678', metadata: { rssi: -60 } },
+  { id: 'device-3', name: 'Nano S Plus', metadata: { rssi: -75 } },
+];
+
+const mockInitialState = {
+  user: {
+    appTheme: AppThemeKey.light,
+  },
+};
+
+describe('DeviceSelectionContent', () => {
+  const defaultProps = {
+    devices: mockDevices,
+    selectedDevice: undefined,
+    isScanning: false,
+    deviceType: HardwareWalletType.Ledger,
+    onSelectDevice: jest.fn(),
+    onConfirmSelection: jest.fn(),
+    onRescan: jest.fn(),
+    onCancel: jest.fn(),
+  };
+
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  it('renders correctly with devices', () => {
+    const { getByTestId, getByText } = renderWithProvider(
+      <DeviceSelectionContent {...defaultProps} />,
+      { state: mockInitialState },
+    );
+
+    expect(getByTestId(DEVICE_SELECTION_CONTENT_TEST_ID)).toBeOnTheScreen();
+    expect(getByText('Select Ledger')).toBeOnTheScreen();
+    expect(getByText('Nano X 1234')).toBeOnTheScreen();
+    expect(getByText('Nano X 5678')).toBeOnTheScreen();
+    expect(getByText('Nano S Plus')).toBeOnTheScreen();
+  });
+
+  it('renders empty state when no devices', () => {
+    const { getByTestId, getByText } = renderWithProvider(
+      <DeviceSelectionContent {...defaultProps} devices={[]} />,
+      { state: mockInitialState },
+    );
+
+    expect(getByTestId(DEVICE_SELECTION_EMPTY_TEST_ID)).toBeOnTheScreen();
+    expect(getByText('No devices found')).toBeOnTheScreen();
+  });
+
+  it('shows scanning indicator when scanning', () => {
+    const { getByTestId, getAllByText } = renderWithProvider(
+      <DeviceSelectionContent {...defaultProps} isScanning devices={[]} />,
+      { state: mockInitialState },
+    );
+
+    expect(getByTestId(DEVICE_SELECTION_SCANNING_TEST_ID)).toBeOnTheScreen();
+    expect(getAllByText('Scanning...').length).toBeGreaterThan(0);
+  });
+
+  it('calls onSelectDevice when device is tapped', () => {
+    const onSelectDevice = jest.fn();
+    const { getByTestId } = renderWithProvider(
+      <DeviceSelectionContent
+        {...defaultProps}
+        onSelectDevice={onSelectDevice}
+      />,
+      { state: mockInitialState },
+    );
+
+    fireEvent.press(getByTestId(`${DEVICE_SELECTION_ITEM_TEST_ID}-device-1`));
+    expect(onSelectDevice).toHaveBeenCalledWith(mockDevices[0]);
+  });
+
+  it('highlights selected device', () => {
+    const { getByTestId } = renderWithProvider(
+      <DeviceSelectionContent
+        {...defaultProps}
+        selectedDevice={mockDevices[0]}
+      />,
+      { state: mockInitialState },
+    );
+
+    const selectedItem = getByTestId(
+      `${DEVICE_SELECTION_ITEM_TEST_ID}-device-1`,
+    );
+    // Check that selected item has the right accessibility state
+    expect(selectedItem.props.accessibilityState.selected).toBe(true);
+  });
+
+  it('shows connect button when device is selected', () => {
+    const { getByText } = renderWithProvider(
+      <DeviceSelectionContent
+        {...defaultProps}
+        selectedDevice={mockDevices[0]}
+      />,
+      { state: mockInitialState },
+    );
+
+    expect(getByText('Connect')).toBeOnTheScreen();
+  });
+
+  it('calls onConfirmSelection when connect button is pressed', () => {
+    const onConfirmSelection = jest.fn();
+    const { getByText } = renderWithProvider(
+      <DeviceSelectionContent
+        {...defaultProps}
+        selectedDevice={mockDevices[0]}
+        onConfirmSelection={onConfirmSelection}
+      />,
+      { state: mockInitialState },
+    );
+
+    fireEvent.press(getByText('Connect'));
+    expect(onConfirmSelection).toHaveBeenCalled();
+  });
+
+  it('calls onRescan when rescan button is pressed', () => {
+    const onRescan = jest.fn();
+    const { getByText } = renderWithProvider(
+      <DeviceSelectionContent {...defaultProps} onRescan={onRescan} />,
+      { state: mockInitialState },
+    );
+
+    fireEvent.press(getByText('Scan Again'));
+    expect(onRescan).toHaveBeenCalled();
+  });
+
+  it('calls onCancel when cancel button is pressed', () => {
+    const onCancel = jest.fn();
+    const { getByText } = renderWithProvider(
+      <DeviceSelectionContent {...defaultProps} onCancel={onCancel} />,
+      { state: mockInitialState },
+    );
+
+    fireEvent.press(getByText('Cancel'));
+    expect(onCancel).toHaveBeenCalled();
+  });
+
+  it('hides rescan button when scanning', () => {
+    const { queryByText } = renderWithProvider(
+      <DeviceSelectionContent {...defaultProps} isScanning />,
+      { state: mockInitialState },
+    );
+
+    expect(queryByText('Scan Again')).toBeNull();
+  });
+
+  it('renders without optional callbacks', () => {
+    const { getByTestId, queryByText } = renderWithProvider(
+      <DeviceSelectionContent
+        devices={mockDevices}
+        selectedDevice={undefined}
+        isScanning={false}
+        deviceType={HardwareWalletType.Ledger}
+        onSelectDevice={jest.fn()}
+        onConfirmSelection={jest.fn()}
+      />,
+      { state: mockInitialState },
+    );
+
+    expect(getByTestId(DEVICE_SELECTION_CONTENT_TEST_ID)).toBeOnTheScreen();
+    expect(queryByText('Scan Again')).toBeNull();
+    expect(queryByText('Cancel')).toBeNull();
+  });
+});
diff --git a/app/core/HardwareWallet/components/HardwareWalletBottomSheet/contents/DeviceSelectionContent.tsx b/app/core/HardwareWallet/components/HardwareWalletBottomSheet/contents/DeviceSelectionContent.tsx
new file mode 100644
index 000000000000..b86b09e44916
--- /dev/null
+++ b/app/core/HardwareWallet/components/HardwareWalletBottomSheet/contents/DeviceSelectionContent.tsx
@@ -0,0 +1,309 @@
+import React, { useMemo } from 'react';
+import {
+  View,
+  StyleSheet,
+  TouchableOpacity,
+  ActivityIndicator,
+  FlatList,
+} from 'react-native';
+
+import Text, {
+  TextVariant,
+  TextColor,
+} from '../../../../../component-library/components/Texts/Text';
+import Button, {
+  ButtonVariants,
+  ButtonSize,
+  ButtonWidthTypes,
+} from '../../../../../component-library/components/Buttons/Button';
+import Icon, {
+  IconName,
+  IconSize,
+  IconColor,
+} from '../../../../../component-library/components/Icons/Icon';
+
+import { strings } from '../../../../../../locales/i18n';
+import { useTheme } from '../../../../../util/theme';
+import { Colors } from '../../../../../util/theme/models';
+import { HardwareWalletType } from '@metamask/hw-wallet-sdk';
+import { DiscoveredDevice } from '../../../types';
+import { getHardwareWalletTypeName } from '../../../helpers';
+import { ContentLayout } from './ContentLayout';
+
+export const DEVICE_SELECTION_CONTENT_TEST_ID = 'device-selection-content';
+export const DEVICE_SELECTION_ITEM_TEST_ID = 'device-selection-item';
+export const DEVICE_SELECTION_EMPTY_TEST_ID = 'device-selection-empty';
+export const DEVICE_SELECTION_SCANNING_TEST_ID = 'device-selection-scanning';
+
+const createStyles = (colors: Colors) =>
+  StyleSheet.create({
+    scanningContainer: {
+      flexDirection: 'row',
+      alignItems: 'center',
+      justifyContent: 'center',
+      paddingVertical: 16,
+      marginBottom: 8,
+    },
+    scanningText: {
+      marginLeft: 12,
+    },
+    deviceList: {
+      maxHeight: 300,
+    },
+    deviceItem: {
+      flexDirection: 'row',
+      alignItems: 'center',
+      paddingVertical: 16,
+      paddingHorizontal: 16,
+      borderRadius: 8,
+      marginBottom: 8,
+      backgroundColor: colors.background.alternative,
+    },
+    deviceItemSelected: {
+      borderWidth: 2,
+      borderColor: colors.primary.default,
+      backgroundColor: colors.primary.muted,
+    },
+    deviceIconContainer: {
+      marginRight: 16,
+    },
+    deviceInfo: {
+      flex: 1,
+    },
+    deviceName: {
+      marginBottom: 2,
+    },
+    checkmarkContainer: {
+      marginLeft: 8,
+    },
+    emptyContainer: {
+      alignItems: 'center',
+      paddingVertical: 32,
+    },
+    emptyIcon: {
+      marginBottom: 16,
+    },
+    emptyText: {
+      textAlign: 'center',
+      marginBottom: 8,
+    },
+    emptySubtext: {
+      textAlign: 'center',
+    },
+    tipsContainer: {
+      marginBottom: 16,
+      padding: 12,
+      borderRadius: 8,
+      backgroundColor: colors.background.alternative,
+    },
+    tipText: {
+      lineHeight: 20,
+    },
+  });
+
+export interface DeviceSelectionContentProps {
+  /** List of discovered devices */
+  devices: DiscoveredDevice[];
+  /** Currently selected device (if any) */
+  selectedDevice?: DiscoveredDevice;
+  /** Whether scanning is in progress */
+  isScanning: boolean;
+  /** The device type for context in messages */
+  deviceType: HardwareWalletType;
+  /** Callback when a device is selected */
+  onSelectDevice: (device: DiscoveredDevice) => void;
+  /** Callback when user confirms selection */
+  onConfirmSelection: () => void;
+  /** Callback when user wants to rescan */
+  onRescan?: () => void;
+  /** Optional callback when user wants to cancel */
+  onCancel?: () => void;
+}
+
+/**
+ * Content component for selecting a discovered hardware wallet device.
+ * Shows a list of available devices with selection highlighting.
+ */
+export const DeviceSelectionContent: React.FC<DeviceSelectionContentProps> = ({
+  devices,
+  selectedDevice,
+  isScanning,
+  deviceType,
+  onSelectDevice,
+  onConfirmSelection,
+  onRescan,
+  onCancel,
+}) => {
+  const { colors } = useTheme();
+  const styles = useMemo(() => createStyles(colors), [colors]);
+  const deviceName = getHardwareWalletTypeName(deviceType);
+
+  const renderDevice = ({ item }: { item: DiscoveredDevice }) => {
+    const isSelected = selectedDevice?.id === item.id;
+
+    return (
+      <TouchableOpacity
+        style={[styles.deviceItem, isSelected && styles.deviceItemSelected]}
+        onPress={() => onSelectDevice(item)}
+        testID={`${DEVICE_SELECTION_ITEM_TEST_ID}-${item.id}`}
+        accessibilityRole="button"
+        accessibilityState={{ selected: isSelected }}
+        accessibilityLabel={`${item.name}${isSelected ? ', selected' : ''}`}
+      >
+        <View style={styles.deviceIconContainer}>
+          <Icon
+            name={IconName.Hardware}
+            size={IconSize.Lg}
+            color={isSelected ? IconColor.Primary : IconColor.Default}
+          />
+        </View>
+        <View style={styles.deviceInfo}>
+          <Text
+            variant={TextVariant.BodyMDBold}
+            color={isSelected ? TextColor.Primary : TextColor.Default}
+            style={styles.deviceName}
+          >
+            {item.name ||
+              strings('hardware_wallet.device_selection.unknown_device')}
+          </Text>
+          {item.metadata?.rssi !== undefined && (
+            <Text variant={TextVariant.BodySM} color={TextColor.Default}>
+              {strings('hardware_wallet.device_selection.signal_strength', {
+                rssi: String(item.metadata.rssi),
+              })}
+            </Text>
+          )}
+        </View>
+        {isSelected && (
+          <View style={styles.checkmarkContainer}>
+            <Icon
+              name={IconName.Check}
+              size={IconSize.Md}
+              color={IconColor.Primary}
+            />
+          </View>
+        )}
+      </TouchableOpacity>
+    );
+  };
+
+  const renderEmpty = () => (
+    <View style={styles.emptyContainer} testID={DEVICE_SELECTION_EMPTY_TEST_ID}>
+      <Icon
+        name={IconName.Search}
+        size={IconSize.Xl}
+        color={IconColor.Alternative}
+        style={styles.emptyIcon}
+      />
+      <Text
+        variant={TextVariant.BodyMD}
+        color={TextColor.Default}
+        style={styles.emptyText}
+      >
+        {isScanning
+          ? strings('hardware_wallet.device_selection.scanning')
+          : strings('hardware_wallet.device_selection.no_devices_found')}
+      </Text>
+      {!isScanning && (
+        <Text
+          variant={TextVariant.BodySM}
+          color={TextColor.Default}
+          style={styles.emptySubtext}
+        >
+          {strings('hardware_wallet.device_selection.no_devices_hint', {
+            device: deviceName,
+          })}
+        </Text>
+      )}
+    </View>
+  );
+
+  return (
+    <ContentLayout
+      testID={DEVICE_SELECTION_CONTENT_TEST_ID}
+      icon={
+        <Icon
+          name={IconName.Hardware}
+          size={IconSize.Xl}
+          color={IconColor.Primary}
+        />
+      }
+      title={strings('hardware_wallet.device_selection.title', {
+        device: deviceName,
+      })}
+      body={
+        <>
+          {isScanning && (
+            <View
+              style={styles.scanningContainer}
+              testID={DEVICE_SELECTION_SCANNING_TEST_ID}
+            >
+              <ActivityIndicator color={colors.primary.default} />
+              <Text
+                variant={TextVariant.BodyMD}
+                color={TextColor.Default}
+                style={styles.scanningText}
+              >
+                {strings('hardware_wallet.device_selection.scanning')}
+              </Text>
+            </View>
+          )}
+
+          <View style={styles.tipsContainer}>
+            <Text
+              variant={TextVariant.BodySM}
+              color={TextColor.Default}
+              style={styles.tipText}
+            >
+              {strings('hardware_wallet.device_selection.tips', {
+                device: deviceName,
+              })}
+            </Text>
+          </View>
+
+          {devices.length > 0 ? (
+            <FlatList
+              data={devices}
+              renderItem={renderDevice}
+              keyExtractor={(item) => item.id}
+              style={styles.deviceList}
+              showsVerticalScrollIndicator={false}
+            />
+          ) : (
+            renderEmpty()
+          )}
+        </>
+      }
+      footer={
+        <>
+          {selectedDevice && (
+            <Button
+              variant={ButtonVariants.Primary}
+              size={ButtonSize.Lg}
+              width={ButtonWidthTypes.Full}
+              label={strings('hardware_wallet.device_selection.connect')}
+              onPress={onConfirmSelection}
+            />
+          )}
+          {onRescan && !isScanning && (
+            <Button
+              variant={ButtonVariants.Secondary}
+              size={ButtonSize.Lg}
+              width={ButtonWidthTypes.Full}
+              label={strings('hardware_wallet.device_selection.rescan')}
+              onPress={onRescan}
+            />
+          )}
+          {onCancel && (
+            <Button
+              variant={ButtonVariants.Link}
+              size={ButtonSize.Lg}
+              label={strings('hardware_wallet.common.cancel')}
+              onPress={onCancel}
+            />
+          )}
+        </>
+      }
+    />
+  );
+};
diff --git a/app/core/HardwareWallet/components/HardwareWalletBottomSheet/contents/ErrorContent.test.tsx b/app/core/HardwareWallet/components/HardwareWalletBottomSheet/contents/ErrorContent.test.tsx
new file mode 100644
index 000000000000..5aea536575ce
--- /dev/null
+++ b/app/core/HardwareWallet/components/HardwareWalletBottomSheet/contents/ErrorContent.test.tsx
@@ -0,0 +1,274 @@
+import React from 'react';
+import { render, fireEvent, waitFor } from '@testing-library/react-native';
+import {
+  HardwareWalletError,
+  HardwareWalletType,
+  ErrorCode,
+  Severity,
+  Category,
+} from '@metamask/hw-wallet-sdk';
+
+import {
+  ErrorContent,
+  ERROR_CONTENT_TEST_ID,
+  ERROR_CONTENT_ICON_TEST_ID,
+  ERROR_CONTENT_TITLE_TEST_ID,
+  ERROR_CONTENT_MESSAGE_TEST_ID,
+  ERROR_CONTENT_CONTINUE_BUTTON_TEST_ID,
+} from './ErrorContent';
+
+// Mock dependencies
+jest.mock('../../../../../util/theme', () => ({
+  useTheme: () => ({
+    colors: {
+      background: { default: '#FFFFFF', alternative: '#F2F4F6' },
+      text: { default: '#24272A', alternative: '#6A737D' },
+      primary: { default: '#037DD6', inverse: '#FFFFFF' },
+      error: { default: '#D73A49' },
+    },
+  }),
+}));
+
+jest.mock('../../../../../../locales/i18n', () => ({
+  strings: (key: string) => key,
+}));
+
+jest.mock('../../../errors', () => ({
+  getIconForErrorCode: jest.fn().mockReturnValue('Danger'),
+  getIconColorForErrorCode: jest.fn().mockReturnValue('Error'),
+  getTitleForErrorCode: jest.fn().mockReturnValue('Error Title'),
+  getRecoveryActionForErrorCode: jest.fn().mockReturnValue('retry'),
+  RecoveryAction: {
+    RETRY: 'retry',
+    ACKNOWLEDGE: 'acknowledge',
+  },
+}));
+
+// Mock component library
+jest.mock('../../../../../component-library/components/Texts/Text', () => {
+  const { Text } = jest.requireActual('react-native');
+  return {
+    __esModule: true,
+    default: ({
+      children,
+      testID,
+    }: {
+      children: React.ReactNode;
+      testID?: string;
+    }) => <Text testID={testID}>{children}</Text>,
+    TextVariant: { HeadingMD: 'HeadingMD', BodyMD: 'BodyMD' },
+    TextColor: { Default: 'Default', Alternative: 'Alternative' },
+  };
+});
+
+jest.mock('../../../../../component-library/components/Buttons/Button', () => {
+  const { TouchableOpacity, Text, View } = jest.requireActual('react-native');
+  return {
+    __esModule: true,
+    default: ({
+      label,
+      onPress,
+      testID,
+      isDisabled,
+    }: {
+      label: React.ReactNode;
+      onPress?: () => void;
+      testID?: string;
+      isDisabled?: boolean;
+    }) => (
+      <TouchableOpacity
+        testID={testID}
+        onPress={isDisabled ? undefined : onPress}
+        isDisabled={isDisabled}
+      >
+        {typeof label === 'string' ? (
+          <Text>{label}</Text>
+        ) : (
+          <View>{label}</View>
+        )}
+      </TouchableOpacity>
+    ),
+    ButtonVariants: { Primary: 'Primary', Secondary: 'Secondary' },
+    ButtonSize: { Lg: 'Lg' },
+    ButtonWidthTypes: { Full: 'Full' },
+  };
+});
+
+jest.mock(
+  '../../../../../component-library/components/Sheet/SheetHeader',
+  () => {
+    const { Text } = jest.requireActual('react-native');
+    return {
+      __esModule: true,
+      default: ({ title }: { title: string }) => <Text>{title}</Text>,
+    };
+  },
+);
+
+jest.mock('../../../../../component-library/components/Icons/Icon', () => {
+  const { View } = jest.requireActual('react-native');
+  return {
+    __esModule: true,
+    default: ({ testID }: { testID?: string }) => <View testID={testID} />,
+    IconSize: { Xl: 'Xl' },
+  };
+});
+
+describe('ErrorContent', () => {
+  const createError = (
+    message: string,
+    code: ErrorCode = ErrorCode.Unknown,
+    userMessage?: string,
+  ): HardwareWalletError =>
+    new HardwareWalletError(message, {
+      code,
+      severity: Severity.Err,
+      category: Category.Unknown,
+      userMessage: userMessage ?? message,
+    });
+
+  it('renders with test ID', () => {
+    const error = createError('Test error');
+    const { getByTestId } = render(
+      <ErrorContent error={error} deviceType={HardwareWalletType.Ledger} />,
+    );
+
+    expect(getByTestId(ERROR_CONTENT_TEST_ID)).toBeOnTheScreen();
+  });
+
+  it('renders error icon', () => {
+    const error = createError('Test error');
+    const { getByTestId } = render(
+      <ErrorContent error={error} deviceType={HardwareWalletType.Ledger} />,
+    );
+
+    expect(getByTestId(ERROR_CONTENT_ICON_TEST_ID)).toBeOnTheScreen();
+  });
+
+  it('renders error title', () => {
+    const error = createError('Test error');
+    const { getByTestId } = render(
+      <ErrorContent error={error} deviceType={HardwareWalletType.Ledger} />,
+    );
+
+    expect(getByTestId(ERROR_CONTENT_TITLE_TEST_ID)).toBeOnTheScreen();
+  });
+
+  it('renders error message when available', () => {
+    const error = createError(
+      'Test error',
+      ErrorCode.Unknown,
+      'User-friendly error message',
+    );
+    const { getByTestId } = render(
+      <ErrorContent error={error} deviceType={HardwareWalletType.Ledger} />,
+    );
+
+    expect(getByTestId(ERROR_CONTENT_MESSAGE_TEST_ID)).toBeOnTheScreen();
+  });
+
+  it('does not render message when not available', () => {
+    // Create error without userMessage by setting it to empty string
+    const error = new HardwareWalletError('Test error', {
+      code: ErrorCode.Unknown,
+      severity: Severity.Err,
+      category: Category.Unknown,
+      userMessage: '',
+    });
+    const { queryByTestId } = render(
+      <ErrorContent error={error} deviceType={HardwareWalletType.Ledger} />,
+    );
+
+    expect(queryByTestId(ERROR_CONTENT_MESSAGE_TEST_ID)).toBeNull();
+  });
+
+  it('returns null when error is null', () => {
+    const { queryByTestId } = render(
+      <ErrorContent error={null} deviceType={HardwareWalletType.Ledger} />,
+    );
+
+    expect(queryByTestId(ERROR_CONTENT_TEST_ID)).toBeNull();
+  });
+
+  it('renders Continue button', () => {
+    const error = createError('Test error');
+    const { getByTestId } = render(
+      <ErrorContent error={error} deviceType={HardwareWalletType.Ledger} />,
+    );
+
+    expect(
+      getByTestId(ERROR_CONTENT_CONTINUE_BUTTON_TEST_ID),
+    ).toBeOnTheScreen();
+  });
+
+  it('calls onContinue when continue button pressed', async () => {
+    const onContinue = jest.fn().mockResolvedValue(undefined);
+    const error = createError('Test error');
+    const { getByTestId } = render(
+      <ErrorContent
+        error={error}
+        onContinue={onContinue}
+        deviceType={HardwareWalletType.Ledger}
+      />,
+    );
+
+    fireEvent.press(getByTestId(ERROR_CONTENT_CONTINUE_BUTTON_TEST_ID));
+
+    await waitFor(() => {
+      expect(onContinue).toHaveBeenCalled();
+    });
+  });
+
+  it('disables button when isLoading is true', () => {
+    const onContinue = jest.fn();
+    const error = createError('Test error');
+    const { getByTestId } = render(
+      <ErrorContent
+        error={error}
+        onContinue={onContinue}
+        isLoading
+        deviceType={HardwareWalletType.Ledger}
+      />,
+    );
+
+    const button = getByTestId(ERROR_CONTENT_CONTINUE_BUTTON_TEST_ID);
+    fireEvent.press(button);
+
+    expect(onContinue).not.toHaveBeenCalled();
+  });
+
+  it('prevents double-tap while retrying', async () => {
+    // eslint-disable-next-line no-empty-function
+    let resolveRetry: () => void = () => {};
+    const retryPromise = new Promise<void>((resolve) => {
+      resolveRetry = resolve;
+    });
+    const onContinue = jest.fn().mockReturnValue(retryPromise);
+    const error = createError('Test error');
+    const { getByTestId } = render(
+      <ErrorContent
+        error={error}
+        onContinue={onContinue}
+        deviceType={HardwareWalletType.Ledger}
+      />,
+    );
+
+    const button = getByTestId(ERROR_CONTENT_CONTINUE_BUTTON_TEST_ID);
+
+    // First press
+    fireEvent.press(button);
+    expect(onContinue).toHaveBeenCalledTimes(1);
+
+    // Second press while still loading - should be ignored
+    fireEvent.press(button);
+    expect(onContinue).toHaveBeenCalledTimes(1);
+
+    // Resolve the promise - resolveRetry should be defined at this point
+    if (resolveRetry) {
+      resolveRetry();
+    }
+    await waitFor(() => {
+      expect(onContinue).toHaveBeenCalledTimes(1);
+    });
+  });
+});
diff --git a/app/core/HardwareWallet/components/HardwareWalletBottomSheet/contents/ErrorContent.tsx b/app/core/HardwareWallet/components/HardwareWalletBottomSheet/contents/ErrorContent.tsx
new file mode 100644
index 000000000000..c43cbf0106fe
--- /dev/null
+++ b/app/core/HardwareWallet/components/HardwareWalletBottomSheet/contents/ErrorContent.tsx
@@ -0,0 +1,148 @@
+import React, { useMemo, useCallback, useState } from 'react';
+import { StyleSheet } from 'react-native';
+import {
+  HardwareWalletError,
+  HardwareWalletType,
+} from '@metamask/hw-wallet-sdk';
+
+import Button, {
+  ButtonVariants,
+  ButtonSize,
+  ButtonWidthTypes,
+} from '../../../../../component-library/components/Buttons/Button';
+import Icon, {
+  IconSize,
+} from '../../../../../component-library/components/Icons/Icon';
+
+import Text, {
+  TextVariant,
+  TextColor,
+} from '../../../../../component-library/components/Texts/Text';
+
+import { strings } from '../../../../../../locales/i18n';
+
+import {
+  getIconForErrorCode,
+  getIconColorForErrorCode,
+  getTitleForErrorCode,
+  getRecoveryActionForErrorCode,
+  RecoveryAction,
+} from '../../../errors';
+import { ContentLayout } from './ContentLayout';
+
+export const ERROR_CONTENT_TEST_ID = 'error-content';
+export const ERROR_CONTENT_ICON_TEST_ID = 'error-content-icon';
+export const ERROR_CONTENT_TITLE_TEST_ID = 'error-content-title';
+export const ERROR_CONTENT_MESSAGE_TEST_ID = 'error-content-message';
+export const ERROR_CONTENT_CONTINUE_BUTTON_TEST_ID =
+  'error-content-continue-button';
+
+const styles = StyleSheet.create({
+  message: {
+    textAlign: 'center',
+  },
+});
+
+export interface ErrorContentProps {
+  /** The error to display */
+  error: HardwareWalletError | null;
+  /** The device type for context in error messages */
+  deviceType: HardwareWalletType;
+  /** Callback when user taps Continue and recovery action is RETRY */
+  onContinue?: () => void | Promise<void>;
+  /** Callback when user taps Continue and recovery action is ACKNOWLEDGE (just dismiss) */
+  onDismiss?: () => void;
+  /** Whether a retry is currently in progress */
+  isLoading?: boolean;
+}
+
+/**
+ * Content component for displaying hardware wallet errors.
+ * Button behavior depends on the error's recovery action:
+ * - RETRY: Retries the operation
+ * - ACKNOWLEDGE: Just dismisses the sheet
+ */
+export const ErrorContent: React.FC<ErrorContentProps> = ({
+  error,
+  deviceType,
+  onContinue,
+  onDismiss,
+  isLoading = false,
+}) => {
+  const [isRetrying, setIsRetrying] = useState(false);
+
+  const recoveryAction = useMemo(() => {
+    if (!error) return RecoveryAction.RETRY;
+    return getRecoveryActionForErrorCode(error.code);
+  }, [error]);
+
+  const showLoading =
+    recoveryAction === RecoveryAction.RETRY && (isLoading || isRetrying);
+
+  const errorTitle = useMemo(() => {
+    if (!error) return strings('hardware_wallet.error.something_went_wrong');
+    return getTitleForErrorCode(error.code, deviceType);
+  }, [error, deviceType]);
+
+  const errorMessage = useMemo(() => error?.userMessage ?? null, [error]);
+
+  const handleContinue = useCallback(async () => {
+    if (recoveryAction === RecoveryAction.ACKNOWLEDGE) {
+      onDismiss?.();
+      return;
+    }
+
+    if (showLoading) return;
+
+    setIsRetrying(true);
+    try {
+      await onContinue?.();
+    } finally {
+      setIsRetrying(false);
+    }
+  }, [onContinue, onDismiss, recoveryAction, showLoading]);
+
+  if (!error) {
+    return null;
+  }
+
+  return (
+    <ContentLayout
+      testID={ERROR_CONTENT_TEST_ID}
+      titleTestID={ERROR_CONTENT_TITLE_TEST_ID}
+      icon={
+        <Icon
+          testID={ERROR_CONTENT_ICON_TEST_ID}
+          name={getIconForErrorCode(error.code)}
+          size={IconSize.Xl}
+          color={getIconColorForErrorCode(error.code)}
+        />
+      }
+      title={errorTitle}
+      body={
+        errorMessage ? (
+          <Text
+            testID={ERROR_CONTENT_MESSAGE_TEST_ID}
+            variant={TextVariant.BodyMD}
+            color={TextColor.Default}
+            style={styles.message}
+          >
+            {errorMessage}
+          </Text>
+        ) : undefined
+      }
+      footer={
+        <Button
+          testID={ERROR_CONTENT_CONTINUE_BUTTON_TEST_ID}
+          variant={ButtonVariants.Primary}
+          size={ButtonSize.Lg}
+          width={ButtonWidthTypes.Full}
+          label={strings('hardware_wallet.common.continue')}
+          onPress={handleContinue}
+          isDisabled={showLoading}
+          loading={showLoading}
+        />
+      }
+    />
+  );
+};
diff --git a/app/core/HardwareWallet/components/HardwareWalletBottomSheet/contents/SuccessContent.test.tsx b/app/core/HardwareWallet/components/HardwareWalletBottomSheet/contents/SuccessContent.test.tsx
new file mode 100644
index 000000000000..950d83fa5727
--- /dev/null
+++ b/app/core/HardwareWallet/components/HardwareWalletBottomSheet/contents/SuccessContent.test.tsx
@@ -0,0 +1,158 @@
+import React from 'react';
+import { render, act } from '@testing-library/react-native';
+
+import {
+  SuccessContent,
+  SUCCESS_CONTENT_TEST_ID,
+  SUCCESS_CONTENT_ICON_TEST_ID,
+} from './SuccessContent';
+import { HardwareWalletType } from '@metamask/hw-wallet-sdk';
+
+// Mock dependencies
+jest.mock('../../../../../util/theme', () => ({
+  useTheme: () => ({
+    colors: {
+      background: { default: '#FFFFFF', alternative: '#F2F4F6' },
+      text: { default: '#24272A', alternative: '#6A737D' },
+      success: { default: '#28A745' },
+    },
+  }),
+}));
+
+jest.mock('../../../../../../locales/i18n', () => ({
+  strings: (key: string) => key,
+}));
+
+// Mock component library
+jest.mock('../../../../../component-library/components/Texts/Text', () => {
+  const { Text } = jest.requireActual('react-native');
+  return {
+    __esModule: true,
+    default: Text,
+    TextVariant: { BodyMD: 'BodyMD' },
+    TextColor: { Default: 'Default' },
+  };
+});
+
+jest.mock(
+  '../../../../../component-library/components/Sheet/SheetHeader',
+  () => {
+    const { Text } = jest.requireActual('react-native');
+    return {
+      __esModule: true,
+      default: ({ title }: { title: string }) => <Text>{title}</Text>,
+    };
+  },
+);
+
+jest.mock('../../../../../component-library/components/Icons/Icon', () => {
+  const { View } = jest.requireActual('react-native');
+  return {
+    __esModule: true,
+    default: ({ testID }: { testID?: string }) => <View testID={testID} />,
+    IconName: { CheckBold: 'CheckBold' },
+    IconSize: { Xl: 'Xl' },
+    IconColor: { Success: 'Success' },
+  };
+});
+
+describe('SuccessContent', () => {
+  beforeEach(() => {
+    jest.useFakeTimers();
+  });
+
+  afterEach(() => {
+    jest.useRealTimers();
+  });
+
+  it('renders with test ID', () => {
+    const { getByTestId } = render(
+      <SuccessContent deviceType={HardwareWalletType.Ledger} />,
+    );
+
+    expect(getByTestId(SUCCESS_CONTENT_TEST_ID)).toBeOnTheScreen();
+  });
+
+  it('renders success icon', () => {
+    const { getByTestId } = render(
+      <SuccessContent deviceType={HardwareWalletType.Ledger} />,
+    );
+
+    expect(getByTestId(SUCCESS_CONTENT_ICON_TEST_ID)).toBeOnTheScreen();
+  });
+
+  it('renders with device type', () => {
+    const { getByText } = render(
+      <SuccessContent deviceType={HardwareWalletType.Ledger} />,
+    );
+
+    // Component renders hardware_wallet.success.title with device param
+    expect(getByText('hardware_wallet.success.title')).toBeOnTheScreen();
+  });
+
+  it('does not render any button (auto-dismiss only)', () => {
+    const onDismiss = jest.fn();
+    const { queryByText } = render(
+      <SuccessContent
+        onDismiss={onDismiss}
+        deviceType={HardwareWalletType.Ledger}
+      />,
+    );
+
+    // No button should be rendered - success auto-dismisses
+    expect(queryByText('hardware_wallet.success.done')).toBeNull();
+    expect(queryByText('hardware_wallet.common.continue')).toBeNull();
+  });
+
+  it('auto-dismisses after specified time', () => {
+    const onDismiss = jest.fn();
+    render(
+      <SuccessContent
+        onDismiss={onDismiss}
+        autoDismissMs={1000}
+        deviceType={HardwareWalletType.Ledger}
+      />,
+    );
+
+    expect(onDismiss).not.toHaveBeenCalled();
+
+    act(() => {
+      jest.advanceTimersByTime(1000);
+    });
+
+    expect(onDismiss).toHaveBeenCalled();
+  });
+
+  it('does not auto-dismiss when autoDismissMs is 0', () => {
+    const onDismiss = jest.fn();
+    render(
+      <SuccessContent
+        onDismiss={onDismiss}
+        autoDismissMs={0}
+        deviceType={HardwareWalletType.Ledger}
+      />,
+    );
+
+    act(() => {
+      jest.advanceTimersByTime(5000);
+    });
+
+    expect(onDismiss).not.toHaveBeenCalled();
+  });
+
+  it('does not auto-dismiss when onDismiss not provided', () => {
+    // This should not throw
+    render(
+      <SuccessContent
+        autoDismissMs={1000}
+        deviceType={HardwareWalletType.Ledger}
+      />,
+    );
+
+    act(() => {
+      jest.advanceTimersByTime(1000);
+    });
+
+    // No error should occur
+  });
+});
diff --git a/app/core/HardwareWallet/components/HardwareWalletBottomSheet/contents/SuccessContent.tsx b/app/core/HardwareWallet/components/HardwareWalletBottomSheet/contents/SuccessContent.tsx
new file mode 100644
index 000000000000..75aef0013622
--- /dev/null
+++ b/app/core/HardwareWallet/components/HardwareWalletBottomSheet/contents/SuccessContent.tsx
@@ -0,0 +1,62 @@
+import React, { useEffect } from 'react';
+
+import Icon, {
+  IconName,
+  IconSize,
+  IconColor,
+} from '../../../../../component-library/components/Icons/Icon';
+
+import { strings } from '../../../../../../locales/i18n';
+import { HardwareWalletType } from '@metamask/hw-wallet-sdk';
+import { getHardwareWalletTypeName } from '../../../helpers';
+import { ContentLayout } from './ContentLayout';
+
+export const SUCCESS_CONTENT_TEST_ID = 'success-content';
+export const SUCCESS_CONTENT_ICON_TEST_ID = 'success-content-icon';
+
+export interface SuccessContentProps {
+  /** The device type for context in messages */
+  deviceType: HardwareWalletType;
+  /** Callback when auto-dismiss triggers */
+  onDismiss?: () => void;
+  /** Auto-dismiss after this many milliseconds (0 to disable) */
+  autoDismissMs?: number;
+}
+
+/**
+ * Content component for displaying success feedback.
+ * Auto-dismisses after the specified timeout.
+ */
+export const SuccessContent: React.FC<SuccessContentProps> = ({
+  deviceType,
+  onDismiss,
+  autoDismissMs = 0,
+}) => {
+  useEffect(() => {
+    if (autoDismissMs > 0 && onDismiss) {
+      const timer = setTimeout(() => {
+        onDismiss();
+      }, autoDismissMs);
+
+      return () => clearTimeout(timer);
+    }
+    return undefined;
+  }, [autoDismissMs, onDismiss]);
+
+  return (
+    <ContentLayout
+      testID={SUCCESS_CONTENT_TEST_ID}
+      icon={
+        <Icon
+          testID={SUCCESS_CONTENT_ICON_TEST_ID}
+          name={IconName.CheckBold}
+          size={IconSize.Xl}
+          color={IconColor.Success}
+        />
+      }
+      title={strings('hardware_wallet.success.title', {
+        device: getHardwareWalletTypeName(deviceType),
+      })}
+    />
+  );
+};
diff --git a/app/core/HardwareWallet/components/HardwareWalletBottomSheet/contents/index.ts b/app/core/HardwareWallet/components/HardwareWalletBottomSheet/contents/index.ts
new file mode 100644
index 000000000000..2103251a790c
--- /dev/null
+++ b/app/core/HardwareWallet/components/HardwareWalletBottomSheet/contents/index.ts
@@ -0,0 +1,6 @@
+export { ConnectingContent } from './ConnectingContent';
+export { DeviceSelectionContent } from './DeviceSelectionContent';
+export { AwaitingAppContent } from './AwaitingAppContent';
+export { AwaitingConfirmationContent } from './AwaitingConfirmationContent';
+export { ErrorContent } from './ErrorContent';
+export { SuccessContent } from './SuccessContent';
diff --git a/app/core/HardwareWallet/components/HardwareWalletBottomSheet/index.ts b/app/core/HardwareWallet/components/HardwareWalletBottomSheet/index.ts
new file mode 100644
index 000000000000..a03ca3297b98
--- /dev/null
+++ b/app/core/HardwareWallet/components/HardwareWalletBottomSheet/index.ts
@@ -0,0 +1,8 @@
+/**
+ * Hardware Wallet Bottom Sheet
+ *
+ * Unified bottom sheet component for hardware wallet operations.
+ * Replaces legacy modal steps with a state-driven approach.
+ */
+
+export { HardwareWalletBottomSheet } from './HardwareWalletBottomSheet';
diff --git a/app/core/HardwareWallet/components/index.ts b/app/core/HardwareWallet/components/index.ts
new file mode 100644
index 000000000000..f64aeea0da2c
--- /dev/null
+++ b/app/core/HardwareWallet/components/index.ts
@@ -0,0 +1,5 @@
+/**
+ * Hardware Wallet Components Module
+ */
+
+export { HardwareWalletBottomSheet } from './HardwareWalletBottomSheet';
diff --git a/app/core/HardwareWallet/contexts/HardwareWalletContext.tsx b/app/core/HardwareWallet/contexts/HardwareWalletContext.tsx
index fd15aa098210..983854e5ab7c 100644
--- a/app/core/HardwareWallet/contexts/HardwareWalletContext.tsx
+++ b/app/core/HardwareWallet/contexts/HardwareWalletContext.tsx
@@ -20,7 +20,7 @@ export interface HardwareWalletContextValue {
    * @param deviceId - Optional. If not provided, shows device selection for hardware wallets.
    * @returns true if device is ready, false if user cancelled
    */
-  ensureDeviceReady: (deviceId?: string) => Promise<boolean>;
+  ensureDeviceReady: (deviceId?: string | null) => Promise<boolean>;
   /** Set the target wallet type for "Add Hardware Wallet" flows (no account yet). */
   setTargetWalletType: (walletType: HardwareWalletType) => void;
   /** Show a hardware wallet error in the bottom sheet. Use after ensureDeviceReady succeeds. */
diff --git a/app/core/HardwareWallet/errors/parser.test.ts b/app/core/HardwareWallet/errors/parser.test.ts
index 902df4188842..0bfcc0228042 100644
--- a/app/core/HardwareWallet/errors/parser.test.ts
+++ b/app/core/HardwareWallet/errors/parser.test.ts
@@ -42,6 +42,18 @@ describe('parseErrorByType', () => {
       expect(result.code).toBe(ErrorCode.BluetoothDisabled);
       expect(result).toBeInstanceOf(HardwareWalletError);
     });
+
+    it('re-parses ErrorCode.Unknown objects', () => {
+      const error = {
+        code: ErrorCode.Unknown,
+        message:
+          'Please enable Blind signing or Contract data in the Ethereum app Settings',
+      };
+
+      const result = parseErrorByType(error, walletType);
+
+      expect(result.code).toBe(ErrorCode.DeviceStateBlindSignNotSupported);
+    });
   });
 
   describe('when error is LedgerCommunicationErrors enum', () => {
@@ -352,6 +364,16 @@ describe('parseErrorByType', () => {
       expect(result.code).toBe(ErrorCode.ConnectionTimeout);
     });
 
+    it('parses scan timeout message containing "unlocked" as ConnectionTimeout, not AuthenticationDeviceLocked', () => {
+      const error = new Error(
+        'Scan timeout: No Ledger devices found. Make sure your Ledger is unlocked and Bluetooth is enabled on the device.',
+      );
+
+      const result = parseErrorByType(error, walletType);
+
+      expect(result.code).toBe(ErrorCode.ConnectionTimeout);
+    });
+
     it('parses "bluetooth" with "off" message', () => {
       const error = new Error('Bluetooth is off');
 
diff --git a/app/core/HardwareWallet/errors/parser.ts b/app/core/HardwareWallet/errors/parser.ts
index add8894c7ac5..362009b1c36a 100644
--- a/app/core/HardwareWallet/errors/parser.ts
+++ b/app/core/HardwareWallet/errors/parser.ts
@@ -222,6 +222,7 @@ function parseErrorByMessage(
       patterns: ['disconnected', 'disconnect', 'connection lost'],
       code: ErrorCode.DeviceDisconnected,
     },
+    { patterns: ['timeout', 'timed out'], code: ErrorCode.ConnectionTimeout },
     {
       patterns: ['locked', 'unlock'],
       code: ErrorCode.AuthenticationDeviceLocked,
@@ -240,7 +241,6 @@ function parseErrorByMessage(
       patterns: ['rejected', 'cancelled', 'refused'],
       code: ErrorCode.UserRejected,
     },
-    { patterns: ['timeout', 'timed out'], code: ErrorCode.ConnectionTimeout },
     {
       patterns: ['not authorized', 'unauthorized'],
       code: ErrorCode.PermissionNearbyDevicesDenied,
@@ -292,6 +292,12 @@ export function parseErrorByType(
   }
 
   if (isErrorCodeObject(error)) {
+    if (error.code === ErrorCode.Unknown && isErrorLike(error)) {
+      const reParsed = parseErrorByMessage(error, walletType);
+      if (reParsed) {
+        return reParsed;
+      }
+    }
     const message =
       typeof error.message === 'string' ? error.message : undefined;
     return createHardwareWalletError(error.code, walletType, message);
diff --git a/app/core/HardwareWallet/helpers.ts b/app/core/HardwareWallet/helpers.ts
index f5cb207ddbcf..39de5546f9aa 100644
--- a/app/core/HardwareWallet/helpers.ts
+++ b/app/core/HardwareWallet/helpers.ts
@@ -1,7 +1,7 @@
-import { strings } from '../../../locales/i18n';
 import { isHardwareAccount } from '../../util/address';
 import ExtendedKeyringTypes from '../../constants/keyringTypes';
 import { HardwareWalletType } from '@metamask/hw-wallet-sdk';
+import { strings } from '../../../locales/i18n';
 
 /**
  * Helper to get wallet type display name
@@ -36,3 +36,22 @@ export function getHardwareWalletTypeForAddress(
   }
   return undefined;
 }
+
+/**
+ * Returns i18n keys for connection tips based on the wallet type.
+ */
+export function getConnectionTipsForWalletType(
+  walletType: HardwareWalletType | null,
+): string[] {
+  switch (walletType) {
+    case HardwareWalletType.Ledger:
+      return [
+        'hardware_wallet.connecting.tip_unlock',
+        'hardware_wallet.connecting.tip_open_app',
+        'hardware_wallet.connecting.tip_enable_bluetooth',
+        'hardware_wallet.connecting.tip_dnd_off',
+      ];
+    default:
+      return [];
+  }
+}
diff --git a/app/core/HardwareWallet/hooks/index.ts b/app/core/HardwareWallet/hooks/index.ts
new file mode 100644
index 000000000000..0331ae67985d
--- /dev/null
+++ b/app/core/HardwareWallet/hooks/index.ts
@@ -0,0 +1,10 @@
+export {
+  useHardwareWalletStateManager,
+  type HardwareWalletRefs,
+  type HardwareWalletStateSetters,
+} from './useHardwareWalletStateManager';
+export { useDeviceEventHandlers } from './useDeviceEventHandlers';
+export { useAdapterLifecycle } from './useAdapterLifecycle';
+export { useTransportMonitoring } from './useTransportMonitoring';
+export { useDeviceDiscovery } from './useDeviceDiscovery';
+export { useDeviceConnectionFlow } from './useDeviceConnectionFlow';
diff --git a/app/core/HardwareWallet/hooks/useAdapterLifecycle.ts b/app/core/HardwareWallet/hooks/useAdapterLifecycle.ts
new file mode 100644
index 000000000000..1cb8be29aa54
--- /dev/null
+++ b/app/core/HardwareWallet/hooks/useAdapterLifecycle.ts
@@ -0,0 +1,137 @@
+import { useCallback, useEffect, useRef, useState } from 'react';
+import {
+  HardwareWalletType,
+  HardwareWalletConnectionState,
+  DeviceEventPayload,
+  ConnectionStatus,
+} from '@metamask/hw-wallet-sdk';
+
+import { createAdapter } from '../adapters';
+import { HardwareWalletAdapter } from '../types';
+import DevLogger from '../../SDKConnect/utils/DevLogger';
+
+interface UseAdapterLifecycleOptions {
+  walletType: HardwareWalletType | null;
+  adapterRef: React.MutableRefObject<HardwareWalletAdapter | null>;
+  handleDeviceEvent: (payload: DeviceEventPayload) => void;
+  handleError: (error: unknown) => void;
+  updateConnectionState: (state: HardwareWalletConnectionState) => void;
+}
+
+interface UseAdapterLifecycleResult {
+  isTransportAvailable: boolean;
+  previousTransportAvailableRef: React.MutableRefObject<boolean | null>;
+  createAdapterWithCallbacks: (
+    targetType: HardwareWalletType,
+  ) => HardwareWalletAdapter;
+  initializeAdapter: (adapter: HardwareWalletAdapter) => void;
+}
+
+/**
+ * Manages the hardware wallet adapter lifecycle: creates the appropriate adapter
+ * when the effective wallet type changes, subscribes to transport state changes,
+ * and cleans up on unmount.
+ *
+ * The provider always keeps an adapter instance — for non-hardware accounts,
+ * a NonHardwareAdapter (null-object pattern) is created so consumers never
+ * need to null-check. NonHardwareAdapter methods are no-ops or return "ready"
+ * immediately.
+ */
+export const useAdapterLifecycle = ({
+  walletType,
+  adapterRef,
+  handleDeviceEvent,
+  handleError,
+  updateConnectionState,
+}: UseAdapterLifecycleOptions): UseAdapterLifecycleResult => {
+  const [isTransportAvailable, setIsTransportAvailable] = useState(false);
+  const previousTransportAvailableRef = useRef<boolean | null>(null);
+  const transportCleanupRef = useRef<(() => void) | null>(null);
+
+  const createAdapterWithCallbacks = useCallback(
+    (targetType: HardwareWalletType) =>
+      createAdapter(targetType, {
+        onDisconnect: (error) => {
+          if (error) {
+            handleError(error);
+          } else {
+            updateConnectionState({ status: ConnectionStatus.Disconnected });
+          }
+        },
+        onDeviceEvent: handleDeviceEvent,
+      }),
+    [handleDeviceEvent, handleError, updateConnectionState],
+  );
+
+  const initializeAdapter = useCallback(
+    (adapter: ReturnType<typeof createAdapter>): void => {
+      transportCleanupRef.current?.();
+      transportCleanupRef.current = null;
+
+      adapterRef.current = adapter;
+
+      if (adapter.onTransportStateChange) {
+        transportCleanupRef.current = adapter.onTransportStateChange(
+          (isAvailable) => {
+            DevLogger.log(
+              '[HardwareWallet] Transport state changed:',
+              isAvailable,
+            );
+            setIsTransportAvailable(isAvailable);
+          },
+        );
+      } else {
+        setIsTransportAvailable(true);
+      }
+    },
+    // Stable ref (adapterRef) — not needed as a dep
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [],
+  );
+
+  useEffect(() => {
+    if (adapterRef.current) {
+      adapterRef.current.disconnect().catch(() => {
+        // Ignore disconnect errors during cleanup
+      });
+      adapterRef.current = null;
+    }
+
+    previousTransportAvailableRef.current = null;
+
+    const adapter = walletType
+      ? createAdapterWithCallbacks(walletType)
+      : createAdapter(null, {
+          // eslint-disable-next-line no-empty-function
+          onDisconnect: () => {},
+          onDeviceEvent: handleDeviceEvent,
+        });
+
+    initializeAdapter(adapter);
+
+    return () => {
+      transportCleanupRef.current?.();
+      transportCleanupRef.current = null;
+      if (adapterRef.current) {
+        adapterRef.current.disconnect().catch(() => {
+          // Ignore cleanup errors
+        });
+        adapterRef.current = null;
+      }
+    };
+    // Stable ref (adapterRef) — not needed as a dep
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [
+    walletType,
+    handleDeviceEvent,
+    createAdapterWithCallbacks,
+    initializeAdapter,
+  ]);
+
+  return {
+    isTransportAvailable,
+    previousTransportAvailableRef,
+    createAdapterWithCallbacks,
+    initializeAdapter,
+  };
+};
diff --git a/app/core/HardwareWallet/hooks/useDeviceConnectionFlow.ts b/app/core/HardwareWallet/hooks/useDeviceConnectionFlow.ts
new file mode 100644
index 000000000000..6700ef4b00f6
--- /dev/null
+++ b/app/core/HardwareWallet/hooks/useDeviceConnectionFlow.ts
@@ -0,0 +1,312 @@
+import { useCallback, useRef } from 'react';
+import {
+  HardwareWalletType,
+  HardwareWalletConnectionState,
+  ConnectionStatus,
+} from '@metamask/hw-wallet-sdk';
+
+import { HardwareWalletAdapter } from '../types';
+import {
+  HardwareWalletRefs,
+  HardwareWalletStateSetters,
+} from './useHardwareWalletStateManager';
+import DevLogger from '../../SDKConnect/utils/DevLogger';
+
+interface UseDeviceConnectionFlowOptions {
+  refs: HardwareWalletRefs;
+  setters: HardwareWalletStateSetters;
+  walletType: HardwareWalletType | null;
+  deviceId: string | null;
+  handleError: (error: unknown) => void;
+  updateConnectionState: (state: HardwareWalletConnectionState) => void;
+  createAdapterWithCallbacks: (
+    targetType: HardwareWalletType,
+  ) => HardwareWalletAdapter;
+  initializeAdapter: (adapter: HardwareWalletAdapter) => void;
+  checkTransportEnabledOrShowError: (
+    adapter: HardwareWalletAdapter,
+  ) => Promise<boolean>;
+}
+
+interface UseDeviceConnectionFlowResult {
+  ensureDeviceReady: (targetDeviceId?: string | null) => Promise<boolean>;
+  connect: (targetDeviceId: string) => Promise<void>;
+  retryEnsureDeviceReady: () => Promise<void>;
+  closeFlow: () => void;
+  handleConnectionSuccess: () => void;
+}
+
+/**
+ * Manages the device connection flow: the consumer calls `ensureDeviceReady`
+ * which returns a Promise that only resolves when the device is confirmed
+ * ready (or the user cancels). Internally coordinates adapter resolution,
+ * transport checks, device connection, and retry logic.
+ */
+export const useDeviceConnectionFlow = ({
+  refs,
+  setters,
+  walletType,
+  deviceId,
+  handleError,
+  updateConnectionState,
+  createAdapterWithCallbacks,
+  initializeAdapter,
+  checkTransportEnabledOrShowError,
+}: UseDeviceConnectionFlowOptions): UseDeviceConnectionFlowResult => {
+  const pendingReadyResolveRef = useRef<((ready: boolean) => void) | null>(
+    null,
+  );
+
+  const connectionSuccessCallbackRef = useRef<(() => void) | null>(null);
+
+  /**
+   * Resolve an existing adapter or create a new one if the wallet type
+   * doesn't match. Named replacement for the inline IIFE that was previously
+   * in `ensureDeviceReady`.
+   */
+  const resolveOrCreateAdapter = useCallback(
+    (targetType: HardwareWalletType): HardwareWalletAdapter => {
+      const existing = refs.adapterRef.current;
+      if (existing && existing.walletType === targetType) {
+        return existing;
+      }
+
+      DevLogger.log(
+        '[HardwareWallet] Creating adapter for:',
+        targetType,
+        '(existing was:',
+        existing?.walletType,
+        ')',
+      );
+      // eslint-disable-next-line no-empty-function
+      existing?.disconnect().catch(() => {});
+      const adapter = createAdapterWithCallbacks(targetType);
+      initializeAdapter(adapter);
+      return adapter;
+    },
+    [refs, createAdapterWithCallbacks, initializeAdapter],
+  );
+
+  /**
+   * Wire up the blocking promise refs. Both the "transport unavailable"
+   * and "normal" code paths share this setup.
+   */
+  const createBlockingPromise = useCallback(
+    (afterSetup?: () => void): Promise<boolean> =>
+      new Promise<boolean>((resolve) => {
+        pendingReadyResolveRef.current = resolve;
+
+        connectionSuccessCallbackRef.current = () => {
+          DevLogger.log(
+            '[HardwareWallet] Success callback - resolving with true',
+          );
+          if (pendingReadyResolveRef.current === resolve) {
+            pendingReadyResolveRef.current = null;
+            resolve(true);
+          }
+        };
+
+        afterSetup?.();
+      }),
+    [],
+  );
+
+  const tryEnsureReady = useCallback(
+    async (
+      adapter: {
+        ensureDeviceReady: (id: string) => Promise<boolean>;
+        markFlowComplete: () => void;
+      },
+      targetDeviceId: string,
+    ): Promise<boolean> => {
+      const isReady = await adapter.ensureDeviceReady(targetDeviceId);
+      if (isReady) {
+        adapter.markFlowComplete();
+        updateConnectionState({
+          status: ConnectionStatus.Ready,
+          deviceId: targetDeviceId,
+        });
+      } else {
+        DevLogger.log(
+          '[HardwareWallet] Device not ready — adapter event already handled state transition',
+        );
+      }
+      return isReady;
+    },
+    [updateConnectionState],
+  );
+
+  const connect = useCallback(
+    async (targetDeviceId: string): Promise<void> => {
+      if (refs.isConnectingRef.current) {
+        return;
+      }
+
+      refs.isConnectingRef.current = true;
+      updateConnectionState({ status: ConnectionStatus.Connecting });
+
+      try {
+        const adapter = refs.adapterRef.current;
+        if (!adapter) {
+          throw new Error('No adapter available');
+        }
+
+        await adapter.connect(targetDeviceId);
+
+        if (!pendingReadyResolveRef.current) {
+          DevLogger.log(
+            '[HardwareWallet] Connect completed but flow was cancelled — ignoring',
+          );
+          return;
+        }
+
+        setters.setDeviceId(targetDeviceId);
+
+        DevLogger.log(
+          '[HardwareWallet] Connect succeeded, continuing readiness check...',
+        );
+
+        try {
+          await tryEnsureReady(adapter, targetDeviceId);
+        } catch (error) {
+          DevLogger.log('[HardwareWallet] Readiness check failed:', error);
+          handleError(error);
+        }
+      } catch (error) {
+        handleError(error);
+      } finally {
+        refs.isConnectingRef.current = false;
+      }
+    },
+    [refs, setters, handleError, updateConnectionState, tryEnsureReady],
+  );
+
+  const ensureDeviceReady = useCallback(
+    async (targetDeviceId?: string | null): Promise<boolean> => {
+      DevLogger.log(
+        '[HardwareWallet] ensureDeviceReady called with deviceId:',
+        targetDeviceId,
+      );
+
+      if (pendingReadyResolveRef.current) {
+        DevLogger.log(
+          '[HardwareWallet] Abandoning previous pending readiness check (not resolving)',
+        );
+        pendingReadyResolveRef.current = null;
+      }
+
+      const targetType =
+        refs.targetWalletTypeRef.current ??
+        walletType ??
+        HardwareWalletType.Ledger;
+
+      if (!targetDeviceId) {
+        setters.setDeviceId(null);
+      }
+
+      const adapter = resolveOrCreateAdapter(targetType);
+
+      if (adapter.resetFlowState) {
+        adapter.resetFlowState();
+      }
+
+      const transportUnavailable =
+        await checkTransportEnabledOrShowError(adapter);
+      if (transportUnavailable) {
+        return createBlockingPromise();
+      }
+
+      return createBlockingPromise(() => {
+        if (!targetDeviceId) {
+          DevLogger.log(
+            '[HardwareWallet] No device ID - starting device selection',
+          );
+          updateConnectionState({ status: ConnectionStatus.Scanning });
+          return;
+        }
+
+        DevLogger.log('[HardwareWallet] Have device ID, checking readiness...');
+
+        updateConnectionState({ status: ConnectionStatus.Connecting });
+
+        (async () => {
+          try {
+            refs.abortControllerRef.current = new AbortController();
+            await tryEnsureReady(adapter, targetDeviceId);
+          } catch (error) {
+            DevLogger.log('[HardwareWallet] ensureDeviceReady error:', error);
+            handleError(error);
+          } finally {
+            refs.abortControllerRef.current = null;
+          }
+        })();
+      });
+    },
+    [
+      refs,
+      setters,
+      handleError,
+      walletType,
+      updateConnectionState,
+      resolveOrCreateAdapter,
+      tryEnsureReady,
+      checkTransportEnabledOrShowError,
+      createBlockingPromise,
+    ],
+  );
+
+  const retryEnsureDeviceReady = useCallback(async (): Promise<void> => {
+    const adapter = refs.adapterRef.current;
+    if (adapter?.resetFlowState) {
+      adapter.resetFlowState();
+    }
+
+    if (adapter && (await checkTransportEnabledOrShowError(adapter))) {
+      return;
+    }
+
+    if (deviceId && adapter) {
+      updateConnectionState({ status: ConnectionStatus.Connecting });
+      try {
+        await tryEnsureReady(adapter, deviceId);
+      } catch (error) {
+        handleError(error);
+      }
+    } else {
+      updateConnectionState({ status: ConnectionStatus.Scanning });
+    }
+  }, [
+    deviceId,
+    handleError,
+    updateConnectionState,
+    refs,
+    checkTransportEnabledOrShowError,
+    tryEnsureReady,
+  ]);
+
+  const closeFlow = useCallback(() => {
+    if (pendingReadyResolveRef.current) {
+      pendingReadyResolveRef.current(false);
+      pendingReadyResolveRef.current = null;
+    }
+    setters.setTargetWalletType(null);
+    updateConnectionState({ status: ConnectionStatus.Disconnected });
+  }, [setters, updateConnectionState]);
+
+  const handleConnectionSuccess = useCallback(() => {
+    const callback = connectionSuccessCallbackRef.current;
+    if (callback) {
+      connectionSuccessCallbackRef.current = null;
+      callback();
+    }
+    updateConnectionState({ status: ConnectionStatus.Disconnected });
+  }, [updateConnectionState]);
+
+  return {
+    ensureDeviceReady,
+    connect,
+    retryEnsureDeviceReady,
+    closeFlow,
+    handleConnectionSuccess,
+  };
+};
diff --git a/app/core/HardwareWallet/hooks/useDeviceDiscovery.ts b/app/core/HardwareWallet/hooks/useDeviceDiscovery.ts
new file mode 100644
index 000000000000..d5497759a3d8
--- /dev/null
+++ b/app/core/HardwareWallet/hooks/useDeviceDiscovery.ts
@@ -0,0 +1,134 @@
+import { useCallback, useEffect, useRef, useState } from 'react';
+import {
+  HardwareWalletType,
+  HardwareWalletConnectionState,
+  ConnectionStatus,
+} from '@metamask/hw-wallet-sdk';
+
+import {
+  DiscoveredDevice,
+  DeviceSelectionState,
+  HardwareWalletAdapter,
+} from '../types';
+import { parseErrorByType } from '../errors';
+import DevLogger from '../../SDKConnect/utils/DevLogger';
+
+const INITIAL_DEVICE_SELECTION: DeviceSelectionState = {
+  devices: [],
+  selectedDevice: null,
+  isScanning: false,
+  scanError: null,
+};
+
+interface UseDeviceDiscoveryOptions {
+  adapterRef: React.MutableRefObject<HardwareWalletAdapter | null>;
+  walletType: HardwareWalletType | null;
+  connectionState: HardwareWalletConnectionState;
+  updateConnectionState: (state: HardwareWalletConnectionState) => void;
+}
+
+interface UseDeviceDiscoveryResult {
+  deviceSelection: DeviceSelectionState;
+  selectDevice: (device: DiscoveredDevice) => void;
+  rescan: () => void;
+}
+
+/**
+ * Manages device scanning, the discovered-device list, and
+ * selection. Automatically starts and stops discovery when the connection
+ * status transitions to/from Scanning.
+ */
+export const useDeviceDiscovery = ({
+  adapterRef,
+  walletType,
+  connectionState,
+  updateConnectionState,
+}: UseDeviceDiscoveryOptions): UseDeviceDiscoveryResult => {
+  const [deviceSelection, setDeviceSelection] = useState<DeviceSelectionState>(
+    INITIAL_DEVICE_SELECTION,
+  );
+
+  const discoveryCleanupRef = useRef<(() => void) | null>(null);
+
+  const stopDiscovery = useCallback(() => {
+    discoveryCleanupRef.current?.();
+    discoveryCleanupRef.current = null;
+  }, []);
+
+  const startDiscovery = useCallback(() => {
+    const adapter = adapterRef.current;
+
+    stopDiscovery();
+
+    setDeviceSelection((prev) => ({
+      ...prev,
+      devices: [],
+      selectedDevice: null,
+      isScanning: !!adapter?.requiresDeviceDiscovery,
+      scanError: null,
+    }));
+
+    if (!adapter?.requiresDeviceDiscovery) return;
+
+    DevLogger.log('[HardwareWallet] Starting adapter device discovery');
+
+    const cleanupFn = adapter.startDeviceDiscovery(
+      (device: DiscoveredDevice) => {
+        DevLogger.log('[HardwareWallet] Device found:', device.name, device.id);
+        setDeviceSelection((prev) => {
+          const exists = prev.devices.some((d) => d.id === device.id);
+          if (exists) return prev;
+          return {
+            ...prev,
+            devices: [...prev.devices, device],
+          };
+        });
+      },
+      (error: Error) => {
+        DevLogger.log('[HardwareWallet] Device discovery error:', error);
+        const scanError = parseErrorByType(
+          error,
+          walletType ?? adapter.walletType ?? HardwareWalletType.Ledger,
+        );
+        updateConnectionState({
+          status: ConnectionStatus.ErrorState,
+          error: scanError,
+        });
+      },
+    );
+
+    discoveryCleanupRef.current = () => {
+      cleanupFn?.();
+      adapter.stopDeviceDiscovery();
+    };
+  }, [adapterRef, walletType, updateConnectionState, stopDiscovery]);
+
+  useEffect(() => {
+    if (connectionState.status === ConnectionStatus.Scanning) {
+      DevLogger.log('[HardwareWallet] Scanning state entered');
+      startDiscovery();
+      return () => stopDiscovery();
+    }
+
+    stopDiscovery();
+    setDeviceSelection(INITIAL_DEVICE_SELECTION);
+    return undefined;
+  }, [connectionState.status, startDiscovery, stopDiscovery]);
+
+  const selectDevice = useCallback((device: DiscoveredDevice) => {
+    setDeviceSelection((prev) => ({
+      ...prev,
+      selectedDevice: device,
+    }));
+  }, []);
+
+  const rescan = useCallback(() => {
+    startDiscovery();
+  }, [startDiscovery]);
+
+  return {
+    deviceSelection,
+    selectDevice,
+    rescan,
+  };
+};
diff --git a/app/core/HardwareWallet/HardwareWalletEventHandlers.test.tsx b/app/core/HardwareWallet/hooks/useDeviceEventHandlers.test.ts
similarity index 93%
rename from app/core/HardwareWallet/HardwareWalletEventHandlers.test.tsx
rename to app/core/HardwareWallet/hooks/useDeviceEventHandlers.test.ts
index 8bc0b525c645..d5b161e0b691 100644
--- a/app/core/HardwareWallet/HardwareWalletEventHandlers.test.tsx
+++ b/app/core/HardwareWallet/hooks/useDeviceEventHandlers.test.ts
@@ -9,12 +9,12 @@ import {
   DeviceEvent,
   HardwareWalletConnectionState,
 } from '@metamask/hw-wallet-sdk';
-import { useDeviceEventHandlers } from './HardwareWalletEventHandlers';
-import { HardwareWalletAdapter } from './types';
+import { useDeviceEventHandlers } from './useDeviceEventHandlers';
+import { HardwareWalletAdapter } from '../types';
 import {
   HardwareWalletRefs,
   HardwareWalletStateSetters,
-} from './HardwareWalletStateManager';
+} from './useHardwareWalletStateManager';
 
 describe('useDeviceEventHandlers', () => {
   let mockRefs: HardwareWalletRefs;
@@ -45,7 +45,6 @@ describe('useDeviceEventHandlers', () => {
       getTransportDisabledErrorCode: jest
         .fn()
         .mockReturnValue(ErrorCode.BluetoothDisabled),
-      getConnectionTips: jest.fn().mockReturnValue([]),
     };
 
     // Create mock refs
@@ -53,6 +52,7 @@ describe('useDeviceEventHandlers', () => {
       adapterRef: { current: mockAdapter },
       isConnectingRef: { current: false },
       abortControllerRef: { current: null },
+      targetWalletTypeRef: { current: null },
     };
 
     // Track last connection state for assertion
@@ -169,41 +169,6 @@ describe('useDeviceEventHandlers', () => {
     });
   });
 
-  describe('clearError', () => {
-    it('clears error state and returns to disconnected', () => {
-      const error = new HardwareWalletError('Test', {
-        code: ErrorCode.Unknown,
-        severity: Severity.Err,
-        category: Category.Unknown,
-        userMessage: 'Test',
-      });
-      lastConnectionState = { status: ConnectionStatus.ErrorState, error };
-
-      const { result } = createHook();
-
-      act(() => {
-        result.current.clearError();
-      });
-
-      expect(lastConnectionState.status).toBe(ConnectionStatus.Disconnected);
-    });
-
-    it('does not change non-error states', () => {
-      lastConnectionState = {
-        status: ConnectionStatus.Connected,
-        deviceId: 'device-123',
-      };
-
-      const { result } = createHook();
-
-      act(() => {
-        result.current.clearError();
-      });
-
-      expect(lastConnectionState.status).toBe(ConnectionStatus.Connected);
-    });
-  });
-
   describe('handleDeviceEvent', () => {
     describe('Connected event', () => {
       it('updates to connected state', () => {
diff --git a/app/core/HardwareWallet/HardwareWalletEventHandlers.tsx b/app/core/HardwareWallet/hooks/useDeviceEventHandlers.ts
similarity index 89%
rename from app/core/HardwareWallet/HardwareWalletEventHandlers.tsx
rename to app/core/HardwareWallet/hooks/useDeviceEventHandlers.ts
index d2a18594dacc..b9ab35c83c11 100644
--- a/app/core/HardwareWallet/HardwareWalletEventHandlers.tsx
+++ b/app/core/HardwareWallet/hooks/useDeviceEventHandlers.ts
@@ -11,9 +11,9 @@ import {
 import {
   HardwareWalletStateSetters,
   HardwareWalletRefs,
-} from './HardwareWalletStateManager';
-import { parseErrorByType, createHardwareWalletError } from './errors';
-import DevLogger from '../SDKConnect/utils/DevLogger';
+} from './useHardwareWalletStateManager';
+import { parseErrorByType, createHardwareWalletError } from '../errors';
+import DevLogger from '../../SDKConnect/utils/DevLogger';
 
 /** Options for the {@link useDeviceEventHandlers} hook. */
 interface UseDeviceEventHandlersOptions {
@@ -33,8 +33,6 @@ interface DeviceEventHandlersResult {
   handleDeviceEvent: (payload: DeviceEventPayload) => void;
   /** Parses an error into a HardwareWalletError and transitions to ErrorState. */
   handleError: (error: unknown) => void;
-  /** Clears the current error, returning to Disconnected if in ErrorState. */
-  clearError: () => void;
 }
 
 /**
@@ -80,15 +78,6 @@ export const useDeviceEventHandlers = ({
     [updateConnectionState, walletType, refs],
   );
 
-  const clearError = useCallback(() => {
-    setters.setConnectionState((prev) => {
-      if (prev.status === ConnectionStatus.ErrorState) {
-        return { status: ConnectionStatus.Disconnected };
-      }
-      return prev;
-    });
-  }, [setters]);
-
   const handleDeviceEvent = useCallback(
     (payload: DeviceEventPayload) => {
       switch (payload.event) {
@@ -121,8 +110,6 @@ export const useDeviceEventHandlers = ({
           break;
 
         case DeviceEvent.AppNotOpen:
-          // Get required app from adapter (e.g., 'Ethereum' for Ledger)
-          // payload.appName contains what's currently open (e.g., 'BOLOS', 'Bitcoin')
           updateConnectionState({
             status: ConnectionStatus.AwaitingApp,
             deviceId: refs.adapterRef.current?.getConnectedDeviceId() ?? '',
@@ -209,6 +196,5 @@ export const useDeviceEventHandlers = ({
     updateConnectionState,
     handleDeviceEvent,
     handleError,
-    clearError,
   };
 };
diff --git a/app/core/HardwareWallet/HardwareWalletStateManager.test.tsx b/app/core/HardwareWallet/hooks/useHardwareWalletStateManager.test.ts
similarity index 96%
rename from app/core/HardwareWallet/HardwareWalletStateManager.test.tsx
rename to app/core/HardwareWallet/hooks/useHardwareWalletStateManager.test.ts
index f47f0b92f0f8..8e3b283c9dfe 100644
--- a/app/core/HardwareWallet/HardwareWalletStateManager.test.tsx
+++ b/app/core/HardwareWallet/hooks/useHardwareWalletStateManager.test.ts
@@ -1,16 +1,16 @@
 import { act } from '@testing-library/react-hooks';
 import { HardwareWalletType, ConnectionStatus } from '@metamask/hw-wallet-sdk';
-import { useHardwareWalletStateManager } from './HardwareWalletStateManager';
-import { getHardwareWalletTypeForAddress } from './helpers';
+import { useHardwareWalletStateManager } from './useHardwareWalletStateManager';
+import { getHardwareWalletTypeForAddress } from '../helpers';
 import {
   renderHookWithProvider,
   DeepPartial,
-} from '../../util/test/renderWithProvider';
-import { RootState } from '../../reducers';
-import { createMockAccountsControllerState } from '../../util/test/accountsControllerTestUtils';
+} from '../../../util/test/renderWithProvider';
+import { RootState } from '../../../reducers';
+import { createMockAccountsControllerState } from '../../../util/test/accountsControllerTestUtils';
 
-jest.mock('./helpers', () => ({
-  ...jest.requireActual('./helpers'),
+jest.mock('../helpers', () => ({
+  ...jest.requireActual('../helpers'),
   getHardwareWalletTypeForAddress: jest.fn(),
 }));
 
diff --git a/app/core/HardwareWallet/HardwareWalletStateManager.tsx b/app/core/HardwareWallet/hooks/useHardwareWalletStateManager.ts
similarity index 82%
rename from app/core/HardwareWallet/HardwareWalletStateManager.tsx
rename to app/core/HardwareWallet/hooks/useHardwareWalletStateManager.ts
index 9eae2ad49de2..1094a8a45d04 100644
--- a/app/core/HardwareWallet/HardwareWalletStateManager.tsx
+++ b/app/core/HardwareWallet/hooks/useHardwareWalletStateManager.ts
@@ -6,9 +6,9 @@ import {
   ConnectionStatus,
 } from '@metamask/hw-wallet-sdk';
 
-import { selectSelectedInternalAccount } from '../../selectors/accountsController';
-import { getHardwareWalletTypeForAddress } from './helpers';
-import { HardwareWalletAdapter } from './types';
+import { selectSelectedInternalAccount } from '../../../selectors/accountsController';
+import { getHardwareWalletTypeForAddress } from '../helpers';
+import { HardwareWalletAdapter } from '../types';
 
 /** Core state managed by the hardware wallet state manager. */
 interface HardwareWalletManagedState {
@@ -30,6 +30,8 @@ export interface HardwareWalletRefs {
   isConnectingRef: React.MutableRefObject<boolean>;
   /** AbortController for cancelling in-flight connection operations. */
   abortControllerRef: React.MutableRefObject<AbortController | null>;
+  /** Synchronously-updated mirror of targetWalletType for use in callbacks. */
+  targetWalletTypeRef: React.MutableRefObject<HardwareWalletType | null>;
 }
 
 /** State setter functions exposed by the state manager. */
@@ -79,6 +81,7 @@ export const useHardwareWalletStateManager =
     const adapterRef = useRef<HardwareWalletAdapter | null>(null);
     const isConnectingRef = useRef<boolean>(false);
     const abortControllerRef = useRef<AbortController | null>(null);
+    const targetWalletTypeRef = useRef<HardwareWalletType | null>(null);
 
     const selectedAccount = useSelector(selectSelectedInternalAccount);
 
@@ -104,23 +107,37 @@ export const useHardwareWalletStateManager =
         adapterRef,
         isConnectingRef,
         abortControllerRef,
+        targetWalletTypeRef,
       }),
       [],
     );
 
+    const setTargetWalletTypeSync = useCallback(
+      (value: React.SetStateAction<HardwareWalletType | null>) => {
+        const newValue =
+          typeof value === 'function'
+            ? value(targetWalletTypeRef.current)
+            : value;
+        targetWalletTypeRef.current = newValue;
+        setTargetWalletType(newValue);
+      },
+      [],
+    );
+
     const setters = useMemo<HardwareWalletStateSetters>(
       () => ({
         setConnectionState,
         setDeviceId,
-        setTargetWalletType,
+        setTargetWalletType: setTargetWalletTypeSync,
       }),
-      [],
+      [setTargetWalletTypeSync],
     );
 
     const resetState = useCallback(() => {
       setConnectionState({ status: ConnectionStatus.Disconnected });
       setDeviceId(null);
       setTargetWalletType(null);
+      targetWalletTypeRef.current = null;
       isConnectingRef.current = false;
       adapterRef.current = null;
 
diff --git a/app/core/HardwareWallet/hooks/useTransportMonitoring.ts b/app/core/HardwareWallet/hooks/useTransportMonitoring.ts
new file mode 100644
index 000000000000..bbeaceda488c
--- /dev/null
+++ b/app/core/HardwareWallet/hooks/useTransportMonitoring.ts
@@ -0,0 +1,120 @@
+import { useCallback, useEffect } from 'react';
+import {
+  HardwareWalletType,
+  HardwareWalletConnectionState,
+  HardwareWalletError,
+  ConnectionStatus,
+} from '@metamask/hw-wallet-sdk';
+
+import { createHardwareWalletError } from '../errors';
+import { HardwareWalletAdapter } from '../types';
+import DevLogger from '../../SDKConnect/utils/DevLogger';
+
+interface UseTransportMonitoringOptions {
+  isTransportAvailable: boolean;
+  previousTransportAvailableRef: React.MutableRefObject<boolean | null>;
+  connectionState: HardwareWalletConnectionState;
+  adapterRef: React.MutableRefObject<HardwareWalletAdapter | null>;
+  walletType: HardwareWalletType | null;
+  updateConnectionState: (state: HardwareWalletConnectionState) => void;
+}
+
+interface UseTransportMonitoringResult {
+  /**
+   * Checks transport availability via the adapter and shows an error if
+   * unavailable. Returns `true` when transport is unavailable (caller should
+   * abort), `false` when transport is ready.
+   */
+  checkTransportEnabledOrShowError: (
+    adapter: HardwareWalletAdapter,
+  ) => Promise<boolean>;
+}
+
+/**
+ * Monitors transport availability (e.g. Bluetooth on/off) and reacts to
+ * changes. Provides helpers for imperative transport checks used by the
+ * connection and retry flows.
+ */
+export const useTransportMonitoring = ({
+  isTransportAvailable,
+  previousTransportAvailableRef,
+  connectionState,
+  adapterRef,
+  walletType,
+  updateConnectionState,
+}: UseTransportMonitoringOptions): UseTransportMonitoringResult => {
+  const createTransportDisabledError =
+    useCallback((): HardwareWalletError | null => {
+      const adapter = adapterRef.current;
+      const errorCode = adapter?.getTransportDisabledErrorCode() ?? null;
+      if (errorCode === null) {
+        return null;
+      }
+      const targetType =
+        walletType ?? adapter?.walletType ?? HardwareWalletType.Ledger;
+      return createHardwareWalletError(errorCode, targetType);
+      // Stable ref (adapterRef) — not needed as a dep
+      // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [walletType]);
+
+  const checkTransportEnabledOrShowError = useCallback(
+    async (adapter: HardwareWalletAdapter): Promise<boolean> => {
+      const isReady = await adapter.isTransportAvailable();
+      const error = createTransportDisabledError();
+      if (!isReady && error) {
+        updateConnectionState({
+          status: ConnectionStatus.ErrorState,
+          error,
+        });
+        return true;
+      }
+      return false;
+    },
+    [createTransportDisabledError, updateConnectionState],
+  );
+
+  useEffect(() => {
+    const wasAvailable = previousTransportAvailableRef.current;
+    previousTransportAvailableRef.current = isTransportAvailable;
+
+    if (!wasAvailable || isTransportAvailable) {
+      return;
+    }
+
+    DevLogger.log(
+      '[HardwareWallet] Transport went from available to unavailable',
+    );
+
+    const activeStates = [
+      ConnectionStatus.Scanning,
+      ConnectionStatus.Connecting,
+      ConnectionStatus.AwaitingApp,
+      ConnectionStatus.AwaitingConfirmation,
+      ConnectionStatus.Connected,
+    ];
+
+    const isInActiveState = activeStates.includes(connectionState.status);
+    const transportError = createTransportDisabledError();
+
+    if (isInActiveState && transportError) {
+      DevLogger.log(
+        '[HardwareWallet] Transport disabled during active operation - showing error',
+      );
+      updateConnectionState({
+        status: ConnectionStatus.ErrorState,
+        error: transportError,
+      });
+    }
+    // Stable ref (previousTransportAvailableRef) — not needed as a dep
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [
+    isTransportAvailable,
+    connectionState.status,
+    updateConnectionState,
+    createTransportDisabledError,
+  ]);
+
+  return {
+    checkTransportEnabledOrShowError,
+  };
+};
diff --git a/app/core/HardwareWallet/index.ts b/app/core/HardwareWallet/index.ts
index 1106b2e990ba..f12789cfa2be 100644
--- a/app/core/HardwareWallet/index.ts
+++ b/app/core/HardwareWallet/index.ts
@@ -1,2 +1,4 @@
+export { HardwareWalletProvider } from './HardwareWalletProvider';
+
 export { useHardwareWallet } from './contexts';
 export { isUserCancellation } from './errors';
diff --git a/app/core/HardwareWallet/types.ts b/app/core/HardwareWallet/types.ts
index b91a31db41d1..a379d049f116 100644
--- a/app/core/HardwareWallet/types.ts
+++ b/app/core/HardwareWallet/types.ts
@@ -138,14 +138,6 @@ export interface HardwareWalletAdapter {
    * active operation.
    */
   getTransportDisabledErrorCode(): ErrorCode | null;
-
-  /**
-   * Get connection tips relevant to this adapter's transport mechanism.
-   * Returns an array of i18n string keys.
-   * For Ledger: BLE-specific tips (unlock, open app, enable bluetooth, DND)
-   * For QR: camera-specific tips
-   */
-  getConnectionTips(): string[];
 }
 
 /**
diff --git a/app/core/NavigationService/NavigationService.ts b/app/core/NavigationService/NavigationService.ts
index 0f3aa1b8c81e..f33a58380ff9 100644
--- a/app/core/NavigationService/NavigationService.ts
+++ b/app/core/NavigationService/NavigationService.ts
@@ -95,12 +95,18 @@ class NavigationService {
     this.#assertNavigationRefType(navRef);
     this.#navigation = this.#createReactAwareNavigation(navRef);
 
-    // Agentic bridge — exposes navigation primitives on globalThis so that
-    // AI coding agents (Claude Code, Cursor, etc.) can inspect and drive the
-    // app remotely via Metro's Hermes CDP WebSocket. The bridge is consumed
-    // by the scripts in `scripts/perps/agentic/` (cdp-bridge.js).
+    // Agentic bridge — exposes navigation primitives and account helpers on
+    // globalThis so that AI coding agents (Claude Code, Cursor, etc.) can
+    // inspect and drive the app remotely via Metro's Hermes CDP WebSocket.
+    // The bridge is consumed by the scripts in `scripts/perps/agentic/`.
     //
-    // __DEV__ only — completely stripped from production builds.
+    // Why NavigationService? It is the single guaranteed init point that runs
+    // once the navigation container is ready, making it the natural place to
+    // install any __DEV__ globals that need a live app reference (nav + Engine).
+    // Account helpers (listAccounts, switchAccount) live here rather than in a
+    // separate file to avoid an extra module boundary in __DEV__-only code.
+    //
+    // __DEV__ only — completely stripped from production builds by Metro/Babel.
     // See docs/perps/perps-agentic-feedback-loop.md for the full workflow.
     if (__DEV__) {
       Logger.log('[NavigationService] __AGENTIC__ bridge installed');
@@ -115,6 +121,47 @@ class NavigationService {
         getState: () => navRef.dangerouslyGetState(),
         canGoBack: () => navRef.canGoBack(),
         goBack: () => deferredNav.goBack(),
+        listAccounts: () => {
+          const ctrl = Engine.context.AccountsController;
+          return ctrl
+            .listAccounts()
+            .map(
+              (a: {
+                id: string;
+                address: string;
+                metadata: { name: string };
+              }) => ({
+                id: a.id,
+                address: a.address,
+                name: a.metadata.name,
+              }),
+            );
+        },
+        getSelectedAccount: () => {
+          const ctrl = Engine.context.AccountsController;
+          const a = ctrl.getSelectedAccount();
+          return { id: a.id, address: a.address, name: a.metadata.name };
+        },
+        switchAccount: (address: string) => {
+          const ctrl = Engine.context.AccountsController;
+          const accounts = ctrl.listAccounts();
+          const target = accounts.find(
+            (a: { address: string }) =>
+              a.address.toLowerCase() === address.toLowerCase(),
+          );
+          if (!target) {
+            throw new Error(`No account found for address ${address}`);
+          }
+          // Use Engine.setSelectedAddress to sync both AccountsController
+          // and PreferencesController (not AccountsController.setSelectedAccount directly).
+          Engine.setSelectedAddress(target.address);
+          return {
+            switched: true,
+            id: target.id,
+            address: target.address,
+            name: target.metadata.name,
+          };
+        },
       };
       try {
         (globalThis as Record<string, unknown>).store = ReduxService.store;
diff --git a/app/core/NavigationService/types.ts b/app/core/NavigationService/types.ts
index 252da173e994..2b374781dd69 100644
--- a/app/core/NavigationService/types.ts
+++ b/app/core/NavigationService/types.ts
@@ -385,7 +385,6 @@ export interface RootStackParamList extends ParamListBase {
   AmbiguousAddress: AmbiguousAddressParams | undefined;
   BasicFunctionality: undefined;
   ConfirmTurnOnBackupAndSync: undefined;
-  ResetNotifications: undefined;
   SDKLoading: SDKLoadingParams | undefined;
   SDKFeedback: SDKFeedbackParams | undefined;
   DataCollection: undefined;
diff --git a/app/core/OAuthService/OAuthLoginHandlers/androidHandlers/google.test.ts b/app/core/OAuthService/OAuthLoginHandlers/androidHandlers/google.test.ts
new file mode 100644
index 000000000000..325144c59c12
--- /dev/null
+++ b/app/core/OAuthService/OAuthLoginHandlers/androidHandlers/google.test.ts
@@ -0,0 +1,105 @@
+import { AuthConnection } from '../../OAuthInterface';
+import { OAuthError, OAuthErrorType } from '../../error';
+import { AndroidGoogleLoginHandler } from './google';
+import { Web3AuthNetwork } from '@metamask/seedless-onboarding-controller';
+import { signInWithGoogle } from '@metamask/react-native-acm';
+
+jest.mock('@metamask/react-native-acm', () => ({
+  signInWithGoogle: jest.fn(),
+}));
+
+jest.mock('../../../../util/Logger', () => ({
+  log: jest.fn(),
+}));
+
+const mockSignInWithGoogle = signInWithGoogle as jest.Mock;
+
+describe('AndroidGoogleLoginHandler', () => {
+  let handler: AndroidGoogleLoginHandler;
+
+  beforeEach(() => {
+    jest.clearAllMocks();
+
+    handler = new AndroidGoogleLoginHandler({
+      clientId: 'test-client-id',
+      authServerUrl: 'https://test-auth-server.com',
+      web3AuthNetwork: Web3AuthNetwork.Mainnet,
+    });
+  });
+
+  describe('login', () => {
+    it('throws GoogleLoginUserDisabledOneTapFeature when user disabled One Tap', async () => {
+      mockSignInWithGoogle.mockRejectedValue(
+        new Error('user disabled the feature'),
+      );
+
+      await expect(handler.login()).rejects.toThrow(OAuthError);
+      await expect(handler.login()).rejects.toMatchObject({
+        code: OAuthErrorType.GoogleLoginUserDisabledOneTapFeature,
+      });
+    });
+
+    it('throws GoogleLoginNoProviderDependencies when provider dependencies not found', async () => {
+      mockSignInWithGoogle.mockRejectedValue(
+        new Error(
+          'e1 error N0.j: getCredentialAsync no provider dependencies found - please ensure the desired provider dependencies are added',
+        ),
+      );
+
+      await expect(handler.login()).rejects.toThrow(OAuthError);
+      await expect(handler.login()).rejects.toMatchObject({
+        code: OAuthErrorType.GoogleLoginNoProviderDependencies,
+      });
+    });
+  });
+
+  describe('getAuthTokenRequestData', () => {
+    it('returns correct auth request params when idToken is provided', () => {
+      const params = {
+        authConnection: AuthConnection.Google,
+        idToken: 'test-id-token',
+        clientId: 'test-client-id',
+        web3AuthNetwork: Web3AuthNetwork.Mainnet,
+      };
+
+      const result = handler.getAuthTokenRequestData(params);
+
+      expect(result).toEqual({
+        client_id: 'test-client-id',
+        id_token: 'test-id-token',
+        login_provider: AuthConnection.Google,
+        network: Web3AuthNetwork.Mainnet,
+      });
+    });
+
+    it('throws InvalidGetAuthTokenParams error when idToken is missing', () => {
+      const params = {
+        authConnection: AuthConnection.Google,
+        code: 'test-code',
+        clientId: 'test-client-id',
+        web3AuthNetwork: Web3AuthNetwork.Mainnet,
+      };
+
+      expect(() =>
+        handler.getAuthTokenRequestData(
+          params as unknown as Parameters<
+            typeof handler.getAuthTokenRequestData
+          >[0],
+        ),
+      ).toThrow(OAuthError);
+      expect(() =>
+        handler.getAuthTokenRequestData(
+          params as unknown as Parameters<
+            typeof handler.getAuthTokenRequestData
+          >[0],
+        ),
+      ).toThrow('handleAndroidGoogleLogin: Invalid params');
+    });
+  });
+
+  describe('properties', () => {
+    it('has correct authConnection', () => {
+      expect(handler.authConnection).toBe(AuthConnection.Google);
+    });
+  });
+});
diff --git a/app/core/OAuthService/OAuthLoginHandlers/androidHandlers/google.ts b/app/core/OAuthService/OAuthLoginHandlers/androidHandlers/google.ts
index 4dfdb005b57b..bf9a242969a5 100644
--- a/app/core/OAuthService/OAuthLoginHandlers/androidHandlers/google.ts
+++ b/app/core/OAuthService/OAuthLoginHandlers/androidHandlers/google.ts
@@ -23,6 +23,7 @@ import Logger from '../../../../util/Logger';
  * 3. NO_CREDENTIAL - no Google account available
  * 4. NO_MATCHING_CREDENTIAL - account exists but doesn't match (contains "matching credential")
  * 5. ONE_TAP_FAILURE - generic One Tap failure (catch-all for other One Tap issues)
+ * 6. NO_PROVIDER_DEPENDENCIES - credential provider not available (e.g., missing Google Play Services)
  *
  * If you modify these patterns or add new ones, ensure the check order in login()
  * handles overlapping matches correctly.
@@ -33,6 +34,7 @@ const ACM_ERRORS_REGEX = {
   NO_MATCHING_CREDENTIAL: /matching credential/i,
   USER_DISABLED_FEATURE: /user disabled the feature/i,
   ONE_TAP_FAILURE: /failure response from one tap/i,
+  NO_PROVIDER_DEPENDENCIES: /no provider dependencies found/i,
 };
 
 /**
@@ -111,6 +113,14 @@ export class AndroidGoogleLoginHandler extends BaseLoginHandler {
             'handleGoogleLogin: User disabled One Tap sign-in feature',
             OAuthErrorType.GoogleLoginUserDisabledOneTapFeature,
           );
+        } else if (
+          ACM_ERRORS_REGEX.NO_PROVIDER_DEPENDENCIES.test(error.message)
+        ) {
+          // Credential provider not available. Fallback to browser-based OAuth.
+          throw new OAuthError(
+            'handleGoogleLogin: Credential provider not available',
+            OAuthErrorType.GoogleLoginNoProviderDependencies,
+          );
         } else if (ACM_ERRORS_REGEX.NO_CREDENTIAL.test(error.message)) {
           if (!this.retried) {
             this.retried = true;
diff --git a/app/core/OAuthService/error.ts b/app/core/OAuthService/error.ts
index ce39684f1b15..4c1f8bf72ef9 100644
--- a/app/core/OAuthService/error.ts
+++ b/app/core/OAuthService/error.ts
@@ -15,6 +15,7 @@ export enum OAuthErrorType {
   GoogleLoginNoMatchingCredential = 10014,
   GoogleLoginUserDisabledOneTapFeature = 10015,
   GoogleLoginOneTapFailure = 10016,
+  GoogleLoginNoProviderDependencies = 10017,
 }
 
 export const OAuthErrorMessages: Record<OAuthErrorType, string> = {
@@ -36,6 +37,8 @@ export const OAuthErrorMessages: Record<OAuthErrorType, string> = {
   [OAuthErrorType.GoogleLoginUserDisabledOneTapFeature]:
     'Google login user disabled one tap feature',
   [OAuthErrorType.GoogleLoginOneTapFailure]: 'Google login one tap failure',
+  [OAuthErrorType.GoogleLoginNoProviderDependencies]:
+    'Google login credential provider not available',
 } as const;
 
 export class OAuthError extends Error {
diff --git a/app/core/SDKConnect/ECIES/ECIES.ts b/app/core/SDKConnect/ECIES/ECIES.ts
deleted file mode 100644
index 9b73c9cebf11..000000000000
--- a/app/core/SDKConnect/ECIES/ECIES.ts
+++ /dev/null
@@ -1,139 +0,0 @@
-import { decrypt, encrypt, PrivateKey } from 'eciesjs';
-import DevLogger from '../utils/DevLogger';
-
-/**
- * These properties are optional and should only be used during development for debugging purposes.
- */
-export interface ECIESProps {
-  debug?: boolean;
-  pkey?: string;
-}
-
-/**
- * Class that exposes methods to generate and compute
- * Elliptic Curve Integrated Encryption Scheme (ECIES) for key exchange and symmetric encryption/decryption
- *
- * It also exposes encryption/decryption methods that are used
- * by the communication layer to encrypt/decrypt in/out data
- * The encryption/decryption is made using a symmetric key generated from the ECIES key exchange
- */
-export class ECIES {
-  private ecies: PrivateKey;
-
-  private enabled = true;
-
-  constructor(props?: ECIESProps) {
-    if (props?.pkey) {
-      this.ecies = PrivateKey.fromHex(props.pkey);
-    } else {
-      this.ecies = new PrivateKey();
-    }
-
-    DevLogger.log(
-      `[ECIES constructor()] initialized secret: `,
-      this.ecies.toHex(),
-    );
-
-    DevLogger.log(
-      `[ECIES constructor()] initialized public: `,
-      this.ecies.publicKey.toHex(),
-    );
-    DevLogger.log(`[ECIES constructor()] init with`, this);
-  }
-
-  /**
-   * Creates new ECIES instance
-   *
-   * @returns - Generates ECIES instance
-   */
-  generateECIES(): void {
-    this.ecies = new PrivateKey();
-  }
-
-  /**
-   * Returns ECIES instance public key
-   *
-   * @returns - public key in base64 format
-   */
-  getPublicKey(): string {
-    return this.ecies.publicKey.toHex();
-  }
-
-  /**
-   * Encrypts a data message using the public key of the side to encrypt data for
-   *
-   * @param {string} data - data string to be encrypted
-   * @param {string} otherPublicKey - public key of the side to encrypt data for
-   * @returns - encrypted string in base64
-   */
-  encrypt(data: string, otherPublicKey: string): string {
-    let encryptedString = data;
-    if (this.enabled) {
-      try {
-        DevLogger.log(
-          `[ECIES: encrypt()] using otherPublicKey`,
-          otherPublicKey,
-        );
-        const payload = Buffer.from(data);
-        const encryptedData = encrypt(otherPublicKey, payload);
-        encryptedString = Buffer.from(encryptedData).toString('base64');
-      } catch (err) {
-        DevLogger.log(`[ECIES: encrypt()] error encrypt:`, err);
-        DevLogger.log(`[ECIES: encrypt()] private: `, this.ecies.toHex());
-        DevLogger.log('[ECIES: encrypt()] data: ', data);
-        DevLogger.log(`[ECIES: encrypt()] otherkey: `, otherPublicKey);
-        throw err;
-      }
-    }
-    return encryptedString;
-  }
-
-  /**
-   * Decrypts a data message using the instance private key
-   *
-   * @param {string} encryptedData - base64 data string to be decrypted
-   * @returns - decrypted data || error message
-   */
-  decrypt(encryptedData: string): string {
-    let decryptedString = encryptedData;
-    if (this.enabled) {
-      try {
-        DevLogger.log(
-          `[ECIES: decrypt()] using privateKey`,
-          this.ecies.toHex(),
-        );
-        const payload = Buffer.from(encryptedData.toString(), 'base64');
-        DevLogger.log(
-          `[ECIES: decrypt()] encryptedData.toString()`,
-          encryptedData.toString(),
-        );
-
-        DevLogger.log(`[ECIES: decrypt()] Buffer.from`, payload);
-
-        const decrypted = decrypt(this.ecies.toHex(), payload);
-        DevLogger.log(`[ECIES: decrypt()] decrypt`);
-
-        DevLogger.log(`[ECIES: decrypt()] decrypted.toString();`);
-        decryptedString = decrypted.toString();
-      } catch (error) {
-        DevLogger.log(`[ECIES: decrypt()] error decrypt`, error);
-        DevLogger.log(`[ECIES: decrypt()] private: `, this.ecies.toHex());
-        DevLogger.log(`[ECIES: decrypt()] encryptedData: `, encryptedData);
-        throw error;
-      }
-    }
-
-    return decryptedString;
-  }
-
-  getKeyInfo(): { private: string; public: string } {
-    return {
-      private: this.ecies.toHex(),
-      public: this.ecies.publicKey.toHex(),
-    };
-  }
-
-  toString() {
-    DevLogger.log(`[ECIES: toString()]`, this.getKeyInfo());
-  }
-}
diff --git a/app/core/SDKConnectV2/adapters/host-application-adapter.test.ts b/app/core/SDKConnectV2/adapters/host-application-adapter.test.ts
index 73ac0aaff65d..660e7bdaf638 100644
--- a/app/core/SDKConnectV2/adapters/host-application-adapter.test.ts
+++ b/app/core/SDKConnectV2/adapters/host-application-adapter.test.ts
@@ -136,6 +136,74 @@ describe('HostApplicationAdapter', () => {
     });
   });
 
+  describe('showInternalError', () => {
+    it('dispatches an error notification with internal error message', () => {
+      jest.spyOn(Date, 'now').mockReturnValue(1234567890);
+
+      adapter.showInternalError();
+
+      expect(showSimpleNotification).toHaveBeenCalledTimes(1);
+      expect(showSimpleNotification).toHaveBeenCalledWith({
+        id: '1234567890',
+        autodismiss: 5000,
+        title: 'sdk_connect_v2.show_internal_error.title',
+        description: 'sdk_connect_v2.show_internal_error.description',
+        status: 'error',
+      });
+      expect(store.dispatch).toHaveBeenCalledTimes(1);
+    });
+
+    it('dispatches an internal error notification with connection info', () => {
+      adapter.showInternalError(
+        createMockConnectionInfo('session-123', 'Test DApp'),
+      );
+
+      expect(showSimpleNotification).toHaveBeenCalledTimes(1);
+      expect(showSimpleNotification).toHaveBeenCalledWith({
+        id: 'session-123',
+        autodismiss: 5000,
+        title: 'sdk_connect_v2.show_internal_error.title',
+        description: 'sdk_connect_v2.show_internal_error.description',
+        status: 'error',
+      });
+      expect(store.dispatch).toHaveBeenCalledTimes(1);
+    });
+  });
+
+  describe('showMethodError', () => {
+    it('dispatches an error notification with method error message', () => {
+      jest.spyOn(Date, 'now').mockReturnValue(1234567890);
+
+      adapter.showMethodError();
+
+      expect(showSimpleNotification).toHaveBeenCalledTimes(1);
+      expect(showSimpleNotification).toHaveBeenCalledWith({
+        id: '1234567890',
+        autodismiss: 5000,
+        title: 'sdk_connect_v2.show_method_error.title',
+        description: 'sdk_connect_v2.show_method_error.description',
+        status: 'error',
+      });
+      expect(store.dispatch).toHaveBeenCalledTimes(1);
+    });
+
+    it('dispatches a method error notification with connection info', () => {
+      adapter.showMethodError(
+        createMockConnectionInfo('session-123', 'Test DApp'),
+      );
+
+      expect(showSimpleNotification).toHaveBeenCalledTimes(1);
+      expect(showSimpleNotification).toHaveBeenCalledWith({
+        id: 'session-123',
+        autodismiss: 5000,
+        title: 'sdk_connect_v2.show_method_error.title',
+        description: 'sdk_connect_v2.show_method_error.description',
+        status: 'error',
+      });
+      expect(store.dispatch).toHaveBeenCalledTimes(1);
+    });
+  });
+
   describe('showConfirmationRejectionError', () => {
     it('dispatches a rejection error notification with connection info', () => {
       adapter.showConfirmationRejectionError(
diff --git a/app/core/SDKConnectV2/adapters/host-application-adapter.ts b/app/core/SDKConnectV2/adapters/host-application-adapter.ts
index 61910b89550e..33044969465d 100644
--- a/app/core/SDKConnectV2/adapters/host-application-adapter.ts
+++ b/app/core/SDKConnectV2/adapters/host-application-adapter.ts
@@ -45,6 +45,30 @@ export class HostApplicationAdapter implements IHostApplicationAdapter {
     );
   }
 
+  showInternalError(conninfo?: ConnectionInfo): void {
+    store.dispatch(
+      showSimpleNotification({
+        id: conninfo?.id || Date.now().toString(),
+        autodismiss: 5000,
+        title: strings('sdk_connect_v2.show_internal_error.title'),
+        description: strings('sdk_connect_v2.show_internal_error.description'),
+        status: 'error',
+      }),
+    );
+  }
+
+  showMethodError(conninfo?: ConnectionInfo): void {
+    store.dispatch(
+      showSimpleNotification({
+        id: conninfo?.id || Date.now().toString(),
+        autodismiss: 5000,
+        title: strings('sdk_connect_v2.show_method_error.title'),
+        description: strings('sdk_connect_v2.show_method_error.description'),
+        status: 'error',
+      }),
+    );
+  }
+
   showConfirmationRejectionError(conninfo?: ConnectionInfo): void {
     store.dispatch(
       showSimpleNotification({
diff --git a/app/core/SDKConnectV2/services/connection-registry.test.ts b/app/core/SDKConnectV2/services/connection-registry.test.ts
index 8a5036e9755a..d95eeea21044 100644
--- a/app/core/SDKConnectV2/services/connection-registry.test.ts
+++ b/app/core/SDKConnectV2/services/connection-registry.test.ts
@@ -24,48 +24,6 @@ jest.mock('../../../store', () => ({
   },
 }));
 
-// A valid, sample connection request payload for use in tests
-const mockConnectionRequest: ConnectionRequest = {
-  sessionRequest: {
-    id: '11111111-2222-3333-4444-555555555555',
-    publicKeyB64: 'AoBDLWxRbJNe8yUv5bmmoVnNo8DCilzbFz/nWD+RKC2V',
-    channel: 'websocket-channel-id',
-    mode: 'trusted',
-    expiresAt: 1757410033264,
-  },
-  metadata: {
-    dapp: {
-      name: 'Test DApp',
-      url: 'https://test.dapp',
-    },
-    sdk: {
-      version: '2.0.0',
-      platform: 'JavaScript',
-    },
-  },
-};
-
-// A valid, sample connection request payload for use in tests
-const mockConnectionInfo: ConnectionInfo = {
-  id: '11111111-2222-3333-4444-555555555555',
-  metadata: {
-    dapp: {
-      name: 'Test DApp',
-      url: 'https://test.dapp',
-    },
-    sdk: {
-      version: '2.0.0',
-      platform: 'JavaScript',
-    },
-  },
-  expiresAt: 1757410033264,
-};
-
-// A valid deeplink URL containing the encoded connection request
-const validDeeplink = `metamask://connect/mwp?p=${encodeURIComponent(
-  JSON.stringify(mockConnectionRequest),
-)}`;
-
 // Factory functions for creating mock objects
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 const createMockConnection = (id: string, overrides: any = {}) => ({
@@ -101,12 +59,54 @@ describe('ConnectionRegistry', () => {
   let mockStore: jest.Mocked<ConnectionStore>;
   let mockKeyManager: jest.Mocked<KeyManager>;
   let mockConnection: jest.Mocked<Connection>;
+  let mockConnectionRequest: ConnectionRequest;
+  let mockConnectionInfo: ConnectionInfo;
+  let validDeeplink: string;
 
   const RELAY_URL = 'wss://test-relay.example.com';
 
   beforeEach(async () => {
     jest.clearAllMocks();
 
+    mockConnectionRequest = {
+      sessionRequest: {
+        id: '11111111-2222-3333-4444-555555555555',
+        publicKeyB64: 'AoBDLWxRbJNe8yUv5bmmoVnNo8DCilzbFz/nWD+RKC2V',
+        channel: 'handshake:aabbccdd-1122-3344-5566-778899aabbcc',
+        mode: 'trusted',
+        expiresAt: Date.now() + 600_000,
+      },
+      metadata: {
+        dapp: {
+          name: 'Test DApp',
+          url: 'https://test.dapp',
+        },
+        sdk: {
+          version: '2.0.0',
+          platform: 'JavaScript',
+        },
+      },
+    };
+
+    mockConnectionInfo = {
+      id: '11111111-2222-3333-4444-555555555555',
+      metadata: {
+        dapp: {
+          name: 'Test DApp',
+          url: 'https://test.dapp',
+        },
+        sdk: {
+          version: '2.0.0',
+          platform: 'JavaScript',
+        },
+      },
+      expiresAt: Date.now() + 600_000,
+    };
+
+    validDeeplink = `metamask://connect/mwp?p=${encodeURIComponent(
+      JSON.stringify(mockConnectionRequest),
+    )}`;
+
     Engine.context.KeyringController.isUnlocked = jest
       .fn()
       .mockReturnValue(true);
@@ -249,7 +249,7 @@ describe('ConnectionRegistry', () => {
 
       // @ts-expect-error test non-string input
       await expect(registry.handleMwpDeeplink(null)).rejects.toThrow(
-        'Invalid MWP deeplink: null',
+        'Invalid MWP deeplink: [invalid URL]',
       );
     });
   });
@@ -566,6 +566,36 @@ describe('ConnectionRegistry', () => {
       expect(mockStore.save).not.toHaveBeenCalled();
     });
 
+    it('should reject decompressed payloads larger than 1MB', async () => {
+      jest.mock('../utils/compression-utils', () => ({
+        decompressPayloadB64: () => 'x'.repeat(1024 * 1024 + 1),
+      }));
+
+      // Re-import to pick up the mock
+      const {
+        ConnectionRegistry: FreshRegistry,
+        // eslint-disable-next-line @typescript-eslint/no-require-imports, @typescript-eslint/no-var-requires
+      } = require('./connection-registry');
+
+      const freshRegistry = new FreshRegistry(
+        RELAY_URL,
+        mockKeyManager,
+        mockHostApp,
+        mockStore,
+      );
+
+      const compressedDeeplink =
+        'metamask://connect/mwp?p=smallbutdecompresseshuge&c=1';
+
+      await freshRegistry.handleConnectDeeplink(compressedDeeplink);
+
+      expect(mockHostApp.showConnectionError).toHaveBeenCalledTimes(1);
+      expect(Connection.create).not.toHaveBeenCalled();
+      expect(mockStore.save).not.toHaveBeenCalled();
+
+      jest.restoreAllMocks();
+    });
+
     it('should reject payloads larger than 1MB', async () => {
       // Given: a registry ready to handle connections
       registry = new ConnectionRegistry(
@@ -632,7 +662,17 @@ describe('ConnectionRegistry', () => {
       expect(mockStore.save).not.toHaveBeenCalled();
     });
 
-    it('blocks connection requests with `metamask` as origin', async () => {
+    it('blocks connection requests with an internal origin as dapp url (defense-in-depth)', async () => {
+      // isConnectionRequest() normally rejects non-URL dapp.url values,
+      // making this code path unreachable. We bypass that validation here
+      // to verify the defense-in-depth check still works if the upstream
+      // guard is ever relaxed.
+      // eslint-disable-next-line @typescript-eslint/no-require-imports, @typescript-eslint/no-var-requires
+      const connReqModule = require('../types/connection-request');
+      const spy = jest
+        .spyOn(connReqModule, 'isConnectionRequest')
+        .mockReturnValueOnce(true);
+
       registry = new ConnectionRegistry(
         RELAY_URL,
         mockKeyManager,
@@ -660,9 +700,11 @@ describe('ConnectionRegistry', () => {
       expect(mockHostApp.showConnectionError).toHaveBeenCalledTimes(1);
       expect(Connection.create).not.toHaveBeenCalled();
       expect(mockStore.save).not.toHaveBeenCalled();
+
+      spy.mockRestore();
     });
 
-    it('blocks connection requests with `metamask` as dapp name', async () => {
+    it('blocks connection requests with an internal origin as dapp name', async () => {
       registry = new ConnectionRegistry(
         RELAY_URL,
         mockKeyManager,
@@ -686,6 +728,10 @@ describe('ConnectionRegistry', () => {
       )}`;
 
       await registry.handleConnectDeeplink(blockedDeeplink);
+
+      expect(mockHostApp.showConnectionError).toHaveBeenCalledTimes(1);
+      expect(Connection.create).not.toHaveBeenCalled();
+      expect(mockStore.save).not.toHaveBeenCalled();
     });
   });
 
diff --git a/app/core/SDKConnectV2/services/connection-registry.ts b/app/core/SDKConnectV2/services/connection-registry.ts
index 645d3dcb36be..b9cffda667e5 100644
--- a/app/core/SDKConnectV2/services/connection-registry.ts
+++ b/app/core/SDKConnectV2/services/connection-registry.ts
@@ -11,7 +11,7 @@ import { IConnectionStore } from '../types/connection-store';
 import { IHostApplicationAdapter } from '../types/host-application-adapter';
 import { Connection } from './connection';
 import { ConnectionInfo } from '../types/connection-info';
-import logger from './logger';
+import logger, { redactUrl } from './logger';
 import { ACTIONS, PREFIXES } from '../../../constants/deeplinks';
 import { decompressPayloadB64 } from '../utils/compression-utils';
 import { whenStoreReady } from '../utils/when-store-ready';
@@ -89,7 +89,7 @@ export class ConnectionRegistry {
 
   public async handleMwpDeeplink(url: string): Promise<void> {
     if (!this.isMwpDeeplink(url)) {
-      throw new Error(`Invalid MWP deeplink: ${url}`);
+      throw new Error(`Invalid MWP deeplink: ${redactUrl(url)}`);
     }
 
     try {
@@ -164,15 +164,21 @@ export class ConnectionRegistry {
     if (this.deeplinks.has(url)) return;
     this.deeplinks.add(url);
 
-    logger.debug('Handling connect deeplink:', url);
+    logger.debug('Handling connect deeplink:', redactUrl(url));
 
     let conn: Connection | undefined;
     let connInfo: ConnectionInfo | undefined;
 
     try {
       const connReq = this.parseConnectionRequest(url);
-      // Prevent external connections from using internal origins
-      // This is an external connection (SDK V2), so block any internal origin
+
+      // Defense-in-depth: block connections whose self-reported dapp metadata
+      // matches a known internal origin. This check is currently redundant
+      // because isConnectionRequest() validates dapp.url as a valid https://
+      // URL, which can never equal plain-string INTERNAL_ORIGINS values like
+      // 'metamask'. It remains as a safety net in case that upstream
+      // validation is ever relaxed. See isConnectionRequest() for the
+      // primary security boundary.
       if (
         INTERNAL_ORIGINS.includes(connReq.metadata.dapp.url) ||
         INTERNAL_ORIGINS.includes(connReq.metadata.dapp.name)
@@ -194,9 +200,9 @@ export class ConnectionRegistry {
       this.connections.set(conn.id, conn);
       await this.store.save(connInfo);
       this.hostapp.syncConnectionList(Array.from(this.connections.values()));
-      logger.debug('Handled connect deeplink.', connInfo);
+      logger.debug('Handled connect deeplink.', connInfo?.id);
     } catch (error) {
-      logger.error('Failed to handle connect deeplink:', error, url);
+      logger.error('Failed to handle connect deeplink:', error, redactUrl(url));
       this.hostapp.showConnectionError();
       if (conn) await this.disconnect(conn.id);
     } finally {
@@ -241,6 +247,10 @@ export class ConnectionRegistry {
     const jsonString =
       compressionFlag === '1' ? decompressPayloadB64(payload) : payload;
 
+    if (jsonString.length > 1024 * 1024) {
+      throw new Error('Decompressed payload too large (max 1MB).');
+    }
+
     const connReq: unknown = JSON.parse(jsonString);
 
     if (!isConnectionRequest(connReq)) {
diff --git a/app/core/SDKConnectV2/services/connection.test.ts b/app/core/SDKConnectV2/services/connection.test.ts
index 051e75f8ff1b..f7f54d0b821e 100644
--- a/app/core/SDKConnectV2/services/connection.test.ts
+++ b/app/core/SDKConnectV2/services/connection.test.ts
@@ -76,6 +76,8 @@ const mockHostApp: jest.Mocked<HostApplicationAdapter> = {
   showConnectionLoading: jest.fn(),
   hideConnectionLoading: jest.fn(),
   showConnectionError: jest.fn(),
+  showInternalError: jest.fn(),
+  showMethodError: jest.fn(),
   showNotFoundError: jest.fn(),
   showConfirmationRejectionError: jest.fn(),
   showReturnToApp: jest.fn(),
@@ -427,7 +429,7 @@ describe('Connection', () => {
       );
     });
 
-    it('shows error toast when bridge response includes an error', async () => {
+    it('shows internal error toast for server-range error codes (-32000 to -32099)', async () => {
       await Connection.create(
         mockConnectionInfo,
         mockKeyManager,
@@ -441,29 +443,94 @@ describe('Connection', () => {
           jsonrpc: '2.0',
           error: {
             code: -32000,
-            message: 'User rejected the request',
+            message: 'Server error',
           },
         },
       };
 
-      // Simulate the RPCBridgeAdapter emitting an error response
       onBridgeResponseCallback(errorResponsePayload);
 
-      // Should show error toast, not success toast
-      expect(mockHostApp.showConnectionError).toHaveBeenCalledTimes(1);
-      expect(mockHostApp.showConnectionError).toHaveBeenCalledWith(
+      expect(mockHostApp.showInternalError).toHaveBeenCalledTimes(1);
+      expect(mockHostApp.showInternalError).toHaveBeenCalledWith(
         mockConnectionInfo,
       );
+      expect(mockHostApp.showMethodError).not.toHaveBeenCalled();
+      expect(mockHostApp.showConfirmationRejectionError).not.toHaveBeenCalled();
       expect(mockHostApp.showReturnToApp).not.toHaveBeenCalled();
 
-      // And still send the error response to the client
       expect(mockWalletClientInstance.sendResponse).toHaveBeenCalledTimes(1);
       expect(mockWalletClientInstance.sendResponse).toHaveBeenCalledWith(
         errorResponsePayload,
       );
     });
 
-    it('shows confirmation rejection error toast when bridge response includes user rejected request error', async () => {
+    it('shows internal error toast for JSON-RPC internal error code (-32603)', async () => {
+      await Connection.create(
+        mockConnectionInfo,
+        mockKeyManager,
+        RELAY_URL,
+        mockHostApp,
+      );
+
+      const errorResponsePayload = {
+        data: {
+          id: 1,
+          jsonrpc: '2.0',
+          error: {
+            code: -32603,
+            message: 'Internal error',
+          },
+        },
+      };
+
+      onBridgeResponseCallback(errorResponsePayload);
+
+      expect(mockHostApp.showInternalError).toHaveBeenCalledTimes(1);
+      expect(mockHostApp.showInternalError).toHaveBeenCalledWith(
+        mockConnectionInfo,
+      );
+      expect(mockHostApp.showMethodError).not.toHaveBeenCalled();
+      expect(mockHostApp.showReturnToApp).not.toHaveBeenCalled();
+
+      expect(mockWalletClientInstance.sendResponse).toHaveBeenCalledTimes(1);
+    });
+
+    it('shows method error toast for non-rejection, non-internal error codes', async () => {
+      await Connection.create(
+        mockConnectionInfo,
+        mockKeyManager,
+        RELAY_URL,
+        mockHostApp,
+      );
+
+      const errorResponsePayload = {
+        data: {
+          id: 1,
+          jsonrpc: '2.0',
+          error: {
+            code: 53,
+            reason: 'Invalid URL',
+          },
+        },
+      };
+
+      onBridgeResponseCallback(errorResponsePayload);
+
+      expect(mockHostApp.showMethodError).toHaveBeenCalledTimes(1);
+      expect(mockHostApp.showMethodError).toHaveBeenCalledWith(
+        mockConnectionInfo,
+      );
+      expect(mockHostApp.showInternalError).not.toHaveBeenCalled();
+      expect(mockHostApp.showConfirmationRejectionError).not.toHaveBeenCalled();
+      expect(mockHostApp.showReturnToApp).not.toHaveBeenCalled();
+
+      expect(mockWalletClientInstance.sendResponse).toHaveBeenCalledTimes(1);
+      expect(mockWalletClientInstance.sendResponse).toHaveBeenCalledWith(
+        errorResponsePayload,
+      );
+    });
+
+    it('shows confirmation rejection error toast for EVM user rejected request (4001)', async () => {
       await Connection.create(
         mockConnectionInfo,
         mockKeyManager,
@@ -482,26 +549,158 @@ describe('Connection', () => {
         },
       };
 
-      // Simulate the RPCBridgeAdapter emitting a user rejected error response
       onBridgeResponseCallback(userRejectedErrorResponsePayload);
 
-      // Should show confirmation rejection error toast, not generic error toast
       expect(mockHostApp.showConfirmationRejectionError).toHaveBeenCalledTimes(
         1,
       );
       expect(mockHostApp.showConfirmationRejectionError).toHaveBeenCalledWith(
         mockConnectionInfo,
       );
-      expect(mockHostApp.showConnectionError).not.toHaveBeenCalled();
+      expect(mockHostApp.showMethodError).not.toHaveBeenCalled();
+      expect(mockHostApp.showInternalError).not.toHaveBeenCalled();
       expect(mockHostApp.showReturnToApp).not.toHaveBeenCalled();
 
-      // And still send the error response to the client
       expect(mockWalletClientInstance.sendResponse).toHaveBeenCalledTimes(1);
       expect(mockWalletClientInstance.sendResponse).toHaveBeenCalledWith(
         userRejectedErrorResponsePayload,
       );
     });
 
+    it('shows confirmation rejection error toast for Solana user rejection (5000)', async () => {
+      await Connection.create(
+        mockConnectionInfo,
+        mockKeyManager,
+        RELAY_URL,
+        mockHostApp,
+      );
+
+      const solanaRejectionPayload = {
+        data: {
+          id: 1,
+          jsonrpc: '2.0',
+          error: {
+            code: 5000,
+            message: 'User rejected the request',
+          },
+        },
+      };
+
+      onBridgeResponseCallback(solanaRejectionPayload);
+
+      expect(mockHostApp.showConfirmationRejectionError).toHaveBeenCalledTimes(
+        1,
+      );
+      expect(mockHostApp.showConfirmationRejectionError).toHaveBeenCalledWith(
+        mockConnectionInfo,
+      );
+      expect(mockHostApp.showMethodError).not.toHaveBeenCalled();
+      expect(mockHostApp.showInternalError).not.toHaveBeenCalled();
+      expect(mockHostApp.showReturnToApp).not.toHaveBeenCalled();
+
+      expect(mockWalletClientInstance.sendResponse).toHaveBeenCalledTimes(1);
+    });
+
+    it('shows rejection toast when SnapKeyring strips the code but message contains rejection text', async () => {
+      await Connection.create(
+        mockConnectionInfo,
+        mockKeyManager,
+        RELAY_URL,
+        mockHostApp,
+      );
+
+      const snapKeyringRejectionPayload = {
+        data: {
+          id: 1,
+          jsonrpc: '2.0',
+          error: {
+            code: -32603,
+            message: 'Request rejected by user or snap.',
+          },
+        },
+      };
+
+      onBridgeResponseCallback(snapKeyringRejectionPayload);
+
+      expect(mockHostApp.showConfirmationRejectionError).toHaveBeenCalledTimes(
+        1,
+      );
+      expect(mockHostApp.showConfirmationRejectionError).toHaveBeenCalledWith(
+        mockConnectionInfo,
+      );
+      expect(mockHostApp.showInternalError).not.toHaveBeenCalled();
+      expect(mockHostApp.showMethodError).not.toHaveBeenCalled();
+      expect(mockHostApp.showReturnToApp).not.toHaveBeenCalled();
+
+      expect(mockWalletClientInstance.sendResponse).toHaveBeenCalledTimes(1);
+    });
+
+    it('shows rejection toast when error message contains "User rejected" regardless of code', async () => {
+      await Connection.create(
+        mockConnectionInfo,
+        mockKeyManager,
+        RELAY_URL,
+        mockHostApp,
+      );
+
+      const wrappedRejectionPayload = {
+        data: {
+          id: 1,
+          jsonrpc: '2.0',
+          error: {
+            code: -32603,
+            message: 'User rejected the request',
+          },
+        },
+      };
+
+      onBridgeResponseCallback(wrappedRejectionPayload);
+
+      expect(mockHostApp.showConfirmationRejectionError).toHaveBeenCalledTimes(
+        1,
+      );
+      expect(mockHostApp.showInternalError).not.toHaveBeenCalled();
+      expect(mockHostApp.showMethodError).not.toHaveBeenCalled();
+
+      expect(mockWalletClientInstance.sendResponse).toHaveBeenCalledTimes(1);
+    });
+
+    it('logs error payload at warn level when error toast is shown', async () => {
+      const warnSpy = jest.spyOn(console, 'warn').mockImplementation();
+
+      await Connection.create(
+        mockConnectionInfo,
+        mockKeyManager,
+        RELAY_URL,
+        mockHostApp,
+      );
+
+      const errorResponsePayload = {
+        data: {
+          id: 1,
+          jsonrpc: '2.0',
+          error: {
+            code: 53,
+            message: 'Invalid URL',
+          },
+        },
+      };
+
+      onBridgeResponseCallback(errorResponsePayload);
+
+      expect(warnSpy).toHaveBeenCalledWith(
+        '[SDKConnectV2]',
+        'RPC error response',
+        {
+          connectionId: mockConnectionInfo.id,
+          code: 53,
+          message: 'Invalid URL',
+        },
+      );
+
+      warnSpy.mockRestore();
+    });
+
     it('shows success toast for successful response with result', async () => {
       await Connection.create(
         mockConnectionInfo,
diff --git a/app/core/SDKConnectV2/services/connection.ts b/app/core/SDKConnectV2/services/connection.ts
index a19afc3ae76b..66f1f4bf151d 100644
--- a/app/core/SDKConnectV2/services/connection.ts
+++ b/app/core/SDKConnectV2/services/connection.ts
@@ -17,6 +17,40 @@ import { errorCodes, providerErrors } from '@metamask/rpc-errors';
 import Engine from '../../Engine';
 import NavigationService from '../../NavigationService';
 
+/**
+ * Known user-rejection error codes across ecosystems.
+ * - 4001: EVM standard (EIP-1193)
+ * - 5000: Solana wallet standard (user rejected)
+ */
+const REJECTION_CODES: ReadonlySet<number> = new Set([
+  errorCodes.provider.userRejectedRequest, // 4001
+  5000, // Solana wallet-standard user rejection
+]);
+
+/**
+ * Message patterns that indicate a user rejection even when the original
+ * error code has been lost. The SnapKeyring strips the 4001 code from
+ * approval rejections and re-throws a plain Error, which serializeError
+ * then wraps with the fallback code -32603. We match on the message to
+ * recover the user-rejection intent.
+ */
+const REJECTION_MESSAGE_PATTERNS: readonly string[] = [
+  'request rejected by user or snap',
+  'user rejected',
+];
+
+const isRejectionMessage = (message: unknown): boolean => {
+  if (typeof message !== 'string') return false;
+  const lower = message.toLowerCase();
+  return REJECTION_MESSAGE_PATTERNS.some((pattern) => lower.includes(pattern));
+};
+
+/**
+ * Standard JSON-RPC internal error range: -32603, and server errors -32000 to -32099.
+ */
+const isInternalError = (code: number): boolean =>
+  code === errorCodes.rpc.internal || (code >= -32099 && code <= -32000);
+
 /**
  * Connection is a live, runtime representation of a dApp connection.
  */
@@ -39,7 +73,14 @@ export class Connection {
     this.bridge = new RPCBridgeAdapter(this.info);
 
     this.client.on('message', async (payload) => {
-      logger.debug('Received message:', this.id, payload);
+      const data =
+        payload && typeof payload === 'object' && 'data' in payload
+          ? (payload.data as Record<string, unknown>)
+          : undefined;
+      logger.debug('Received message:', this.id, {
+        method: data?.method,
+        id: data?.id,
+      });
 
       const isWalletCreateSessionRequest =
         payload &&
@@ -76,7 +117,14 @@ export class Connection {
     });
 
     this.bridge.on('response', (payload) => {
-      logger.debug('Sending message:', this.id, payload);
+      const responseData =
+        'data' in payload
+          ? (payload.data as Record<string, unknown>)
+          : (payload as Record<string, unknown>);
+      logger.debug('Sending message:', this.id, {
+        method: responseData?.method,
+        id: responseData?.id,
+      });
 
       // If the payload includes an id, its a JSON-RPC response, otherwise its a notification
       if ('data' in payload && 'id' in payload.data) {
@@ -86,12 +134,23 @@ export class Connection {
           'error' in responseData && responseData.error !== undefined;
 
         if (isError) {
-          if (
-            responseData.error.code === errorCodes.provider.userRejectedRequest
-          ) {
+          const errCode = responseData.error.code as number;
+          const errMessage =
+            (responseData.error as Record<string, unknown>).message ??
+            (responseData.error as Record<string, unknown>).reason;
+
+          logger.warn('RPC error response', {
+            connectionId: this.id,
+            code: errCode,
+            message: errMessage,
+          });
+
+          if (REJECTION_CODES.has(errCode) || isRejectionMessage(errMessage)) {
             this.hostApp.showConfirmationRejectionError(this.info);
+          } else if (isInternalError(errCode)) {
+            this.hostApp.showInternalError(this.info);
           } else {
-            this.hostApp.showConnectionError(this.info);
+            this.hostApp.showMethodError(this.info);
           }
         } else {
           this.hostApp.showReturnToApp(this.info);
diff --git a/app/core/SDKConnectV2/services/key-manager.ts b/app/core/SDKConnectV2/services/key-manager.ts
index db9a0650ba92..c6e4f0ea9b43 100644
--- a/app/core/SDKConnectV2/services/key-manager.ts
+++ b/app/core/SDKConnectV2/services/key-manager.ts
@@ -5,8 +5,8 @@ export class KeyManager implements IKeyManager {
   generateKeyPair(): KeyPair {
     const privateKey = new PrivateKey();
     return {
-      privateKey: Uint8Array.from(privateKey.secret),
-      publicKey: Uint8Array.from(privateKey.publicKey.compressed),
+      privateKey: new Uint8Array(privateKey.secret),
+      publicKey: privateKey.publicKey.toBytes(true),
     };
   }
 
@@ -15,9 +15,8 @@ export class KeyManager implements IKeyManager {
     theirPublicKey: Uint8Array,
   ): Promise<string> {
     const plaintextBuffer = Buffer.from(plaintext, 'utf8');
-    const theirPublicKeyBuffer = Buffer.from(theirPublicKey);
-    const encryptedBuffer = encrypt(theirPublicKeyBuffer, plaintextBuffer);
-    return encryptedBuffer.toString('base64');
+    const encryptedBuffer = encrypt(theirPublicKey, plaintextBuffer);
+    return Buffer.from(encryptedBuffer).toString('base64');
   }
 
   async decrypt(
@@ -25,8 +24,7 @@ export class KeyManager implements IKeyManager {
     myPrivateKey: Uint8Array,
   ): Promise<string> {
     const encryptedBuffer = Buffer.from(encryptedB64, 'base64');
-    const myPrivateKeyBuffer = Buffer.from(myPrivateKey);
-    const decryptedBuffer = decrypt(myPrivateKeyBuffer, encryptedBuffer);
-    return decryptedBuffer.toString('utf8');
+    const decryptedBuffer = decrypt(myPrivateKey, encryptedBuffer);
+    return Buffer.from(decryptedBuffer).toString('utf8');
   }
 }
diff --git a/app/core/SDKConnectV2/services/logger.ts b/app/core/SDKConnectV2/services/logger.ts
index c693c2c065b7..31c0dc1a42f9 100644
--- a/app/core/SDKConnectV2/services/logger.ts
+++ b/app/core/SDKConnectV2/services/logger.ts
@@ -5,6 +5,20 @@ const prettify = (...args: unknown[]) =>
     .map((arg) => (typeof arg === 'object' ? JSON.stringify(arg) : String(arg)))
     .join(' ');
 
+/**
+ * Redacts query and fragment parameters from a URL to prevent
+ * leaking sensitive connection parameters (channel ID, public key)
+ * in logs.
+ */
+export const redactUrl = (url: string): string => {
+  try {
+    const parsed = new URL(url);
+    return `${parsed.protocol}//${parsed.host}${parsed.pathname}?[REDACTED]`;
+  } catch {
+    return '[invalid URL]';
+  }
+};
+
 export default {
   debug: (...args: unknown[]) => {
     if (process.env.SDK_CONNECT_V2_DEBUG === 'true') {
@@ -12,6 +26,10 @@ export default {
       console.debug(prettify(prefix, ...args));
     }
   },
+  warn: (...args: unknown[]) => {
+    // eslint-disable-next-line no-console
+    console.warn(prefix, ...args);
+  },
   error: (...args: unknown[]) => {
     // eslint-disable-next-line no-console
     console.error(prefix, ...args);
diff --git a/app/core/SDKConnectV2/types/connection-request.test.ts b/app/core/SDKConnectV2/types/connection-request.test.ts
new file mode 100644
index 000000000000..994c0ff49125
--- /dev/null
+++ b/app/core/SDKConnectV2/types/connection-request.test.ts
@@ -0,0 +1,337 @@
+import { isConnectionRequest, ConnectionRequest } from './connection-request';
+
+/**
+ * A compressed secp256k1 public key is exactly 33 bytes.
+ * This helper builds a base64 string from an arbitrary 33-byte buffer.
+ */
+function make33ByteB64(): string {
+  const buf = Buffer.alloc(33, 0x02); // 0x02 prefix is a valid compressed key prefix
+  return buf.toString('base64');
+}
+
+function validRequest(
+  overrides: Record<string, unknown> = {},
+): ConnectionRequest {
+  return {
+    sessionRequest: {
+      id: '11111111-2222-3333-4444-555555555555',
+      publicKeyB64: make33ByteB64(),
+      channel: 'handshake:aabbccdd-1122-3344-5566-778899aabbcc',
+      mode: 'trusted',
+      expiresAt: Date.now() + 60_000,
+      ...(overrides.sessionRequest as Record<string, unknown>),
+    },
+    metadata: {
+      dapp: {
+        name: 'Test DApp',
+        url: 'https://test.dapp',
+        ...(overrides.dapp as Record<string, unknown>),
+      },
+      sdk: {
+        version: '2.0.0',
+        platform: 'JavaScript',
+        ...(overrides.sdk as Record<string, unknown>),
+      },
+      ...(overrides.metadata as Record<string, unknown>),
+    },
+    ...overrides,
+  } as unknown as ConnectionRequest;
+}
+
+describe('isConnectionRequest', () => {
+  // ──────────────────────────────────────────
+  // top-level shape
+  // ──────────────────────────────────────────
+  it('returns true for a fully valid request', () => {
+    expect(isConnectionRequest(validRequest())).toBe(true);
+  });
+
+  it.each([null, undefined, 42, 'string', true, []])(
+    'returns false for non-object input: %p',
+    (input) => {
+      expect(isConnectionRequest(input)).toBe(false);
+    },
+  );
+
+  it('returns false when sessionRequest is missing', () => {
+    const req = validRequest();
+    delete (req as unknown as Record<string, unknown>).sessionRequest;
+    expect(isConnectionRequest(req)).toBe(false);
+  });
+
+  it('returns false when sessionRequest is not an object', () => {
+    expect(
+      isConnectionRequest({ ...validRequest(), sessionRequest: 'bad' }),
+    ).toBe(false);
+  });
+
+  // ──────────────────────────────────────────
+  // sessionRequest.id
+  // ──────────────────────────────────────────
+  it('returns false when id is missing', () => {
+    const req = validRequest();
+    delete (req.sessionRequest as Record<string, unknown>).id;
+    expect(isConnectionRequest(req)).toBe(false);
+  });
+
+  it('returns false when id is not a UUID', () => {
+    const req = validRequest();
+    (req.sessionRequest as Record<string, unknown>).id = 'not-a-uuid';
+    expect(isConnectionRequest(req)).toBe(false);
+  });
+
+  // ──────────────────────────────────────────
+  // sessionRequest.publicKeyB64
+  // ──────────────────────────────────────────
+  it('returns false when publicKeyB64 is missing', () => {
+    const req = validRequest();
+    delete (req.sessionRequest as Record<string, unknown>).publicKeyB64;
+    expect(isConnectionRequest(req)).toBe(false);
+  });
+
+  it('returns false when publicKeyB64 exceeds 200 characters', () => {
+    const req = validRequest();
+    (req.sessionRequest as Record<string, unknown>).publicKeyB64 = 'A'.repeat(
+      201,
+    );
+    expect(isConnectionRequest(req)).toBe(false);
+  });
+
+  it('returns false when publicKeyB64 does not decode to 33 bytes', () => {
+    const req = validRequest();
+    // 16 bytes → not 33
+    (req.sessionRequest as Record<string, unknown>).publicKeyB64 = Buffer.alloc(
+      16,
+      0x02,
+    ).toString('base64');
+    expect(isConnectionRequest(req)).toBe(false);
+  });
+
+  it('accepts a valid 33-byte compressed public key', () => {
+    expect(isConnectionRequest(validRequest())).toBe(true);
+  });
+
+  // ──────────────────────────────────────────
+  // sessionRequest.channel
+  // ──────────────────────────────────────────
+  it('returns false when channel is missing', () => {
+    const req = validRequest();
+    delete (req.sessionRequest as Record<string, unknown>).channel;
+    expect(isConnectionRequest(req)).toBe(false);
+  });
+
+  it('returns false when channel does not match handshake:<uuid> pattern', () => {
+    const req = validRequest();
+    (req.sessionRequest as Record<string, unknown>).channel =
+      'websocket-channel-id';
+    expect(isConnectionRequest(req)).toBe(false);
+  });
+
+  it('returns false when channel has the wrong prefix', () => {
+    const req = validRequest();
+    (req.sessionRequest as Record<string, unknown>).channel =
+      'badprefix:aabbccdd-1122-3344-5566-778899aabbcc';
+    expect(isConnectionRequest(req)).toBe(false);
+  });
+
+  it('accepts a valid handshake channel', () => {
+    const req = validRequest();
+    (req.sessionRequest as Record<string, unknown>).channel =
+      'handshake:aabbccdd-1122-3344-5566-778899aabbcc';
+    expect(isConnectionRequest(req)).toBe(true);
+  });
+
+  // ──────────────────────────────────────────
+  // sessionRequest.mode
+  // ──────────────────────────────────────────
+  it('returns false when mode is missing', () => {
+    const req = validRequest();
+    delete (req.sessionRequest as Record<string, unknown>).mode;
+    expect(isConnectionRequest(req)).toBe(false);
+  });
+
+  it.each(['invalid', 'TRUSTED', 'Untrusted', ''])(
+    'returns false for invalid mode value: %p',
+    (mode) => {
+      const req = validRequest();
+      (req.sessionRequest as Record<string, unknown>).mode = mode;
+      expect(isConnectionRequest(req)).toBe(false);
+    },
+  );
+
+  it.each(['trusted', 'untrusted'])('accepts valid mode: %p', (mode) => {
+    const req = validRequest();
+    (req.sessionRequest as Record<string, unknown>).mode = mode;
+    expect(isConnectionRequest(req)).toBe(true);
+  });
+
+  // ──────────────────────────────────────────
+  // sessionRequest.expiresAt
+  // ──────────────────────────────────────────
+  it('returns false when expiresAt is not a number', () => {
+    const req = validRequest();
+    (req.sessionRequest as Record<string, unknown>).expiresAt = '12345';
+    expect(isConnectionRequest(req)).toBe(false);
+  });
+
+  it('returns false when expiresAt is NaN', () => {
+    const req = validRequest();
+    (req.sessionRequest as Record<string, unknown>).expiresAt = NaN;
+    expect(isConnectionRequest(req)).toBe(false);
+  });
+
+  it('returns false when expiresAt is in the past', () => {
+    const req = validRequest();
+    (req.sessionRequest as Record<string, unknown>).expiresAt =
+      Date.now() - 1000;
+    expect(isConnectionRequest(req)).toBe(false);
+  });
+
+  it('accepts an expiresAt in the future', () => {
+    const req = validRequest();
+    (req.sessionRequest as Record<string, unknown>).expiresAt =
+      Date.now() + 60_000;
+    expect(isConnectionRequest(req)).toBe(true);
+  });
+
+  // ──────────────────────────────────────────
+  // metadata (top-level)
+  // ──────────────────────────────────────────
+  it('returns false when metadata is missing', () => {
+    const req = validRequest();
+    delete (req as unknown as Record<string, unknown>).metadata;
+    expect(isConnectionRequest(req)).toBe(false);
+  });
+
+  it('returns false when metadata is not an object', () => {
+    expect(isConnectionRequest({ ...validRequest(), metadata: 'bad' })).toBe(
+      false,
+    );
+  });
+
+  // ──────────────────────────────────────────
+  // metadata.dapp
+  // ──────────────────────────────────────────
+  it('returns false when metadata.dapp is missing', () => {
+    const req = validRequest();
+    delete (req.metadata as unknown as Record<string, unknown>).dapp;
+    expect(isConnectionRequest(req)).toBe(false);
+  });
+
+  it('returns false when dapp.name is missing', () => {
+    const req = validRequest();
+    delete (req.metadata.dapp as Record<string, unknown>).name;
+    expect(isConnectionRequest(req)).toBe(false);
+  });
+
+  it('returns false when dapp.name exceeds 256 characters', () => {
+    const req = validRequest();
+    (req.metadata.dapp as Record<string, unknown>).name = 'x'.repeat(257);
+    expect(isConnectionRequest(req)).toBe(false);
+  });
+
+  it('returns false when dapp.url is missing', () => {
+    const req = validRequest();
+    delete (req.metadata.dapp as Record<string, unknown>).url;
+    expect(isConnectionRequest(req)).toBe(false);
+  });
+
+  it('returns false when dapp.url exceeds 1024 characters', () => {
+    const req = validRequest();
+    (req.metadata.dapp as Record<string, unknown>).url =
+      `https://example.com/${'x'.repeat(1024)}`;
+    expect(isConnectionRequest(req)).toBe(false);
+  });
+
+  it('returns false when dapp.url is not a parseable URL', () => {
+    const req = validRequest();
+    (req.metadata.dapp as Record<string, unknown>).url = 'not a url';
+    expect(isConnectionRequest(req)).toBe(false);
+  });
+
+  it.each(['metamask://evil.com', 'ftp://example.com', 'file:///etc/passwd'])(
+    'returns false when dapp.url uses a non-http(s) scheme: %p',
+    (url) => {
+      const req = validRequest();
+      (req.metadata.dapp as Record<string, unknown>).url = url;
+      expect(isConnectionRequest(req)).toBe(false);
+    },
+  );
+
+  it.each(['https://example.com', 'http://localhost:3000'])(
+    'accepts dapp.url with http(s) scheme: %p',
+    (url) => {
+      const req = validRequest();
+      (req.metadata.dapp as Record<string, unknown>).url = url;
+      expect(isConnectionRequest(req)).toBe(true);
+    },
+  );
+
+  // ──────────────────────────────────────────
+  // metadata.dapp.icon (optional)
+  // ──────────────────────────────────────────
+  it('accepts a request without dapp.icon', () => {
+    const req = validRequest();
+    delete (req.metadata.dapp as Record<string, unknown>).icon;
+    expect(isConnectionRequest(req)).toBe(true);
+  });
+
+  it('accepts a valid dapp.icon URL', () => {
+    const req = validRequest();
+    (req.metadata.dapp as Record<string, unknown>).icon =
+      'https://example.com/icon.png';
+    expect(isConnectionRequest(req)).toBe(true);
+  });
+
+  it('returns false when dapp.icon is not a string', () => {
+    const req = validRequest();
+    (req.metadata.dapp as Record<string, unknown>).icon = 42;
+    expect(isConnectionRequest(req)).toBe(false);
+  });
+
+  it('returns false when dapp.icon exceeds 1024 characters', () => {
+    const req = validRequest();
+    (req.metadata.dapp as Record<string, unknown>).icon =
+      `https://example.com/${'x'.repeat(1024)}`;
+    expect(isConnectionRequest(req)).toBe(false);
+  });
+
+  it('returns false when dapp.icon is not a parseable URL', () => {
+    const req = validRequest();
+    (req.metadata.dapp as Record<string, unknown>).icon = 'bad icon url';
+    expect(isConnectionRequest(req)).toBe(false);
+  });
+
+  // ──────────────────────────────────────────
+  // metadata.sdk
+  // ──────────────────────────────────────────
+  it('returns false when metadata.sdk is missing', () => {
+    const req = validRequest();
+    delete (req.metadata as unknown as Record<string, unknown>).sdk;
+    expect(isConnectionRequest(req)).toBe(false);
+  });
+
+  it('returns false when sdk.version is missing', () => {
+    const req = validRequest();
+    delete (req.metadata.sdk as Record<string, unknown>).version;
+    expect(isConnectionRequest(req)).toBe(false);
+  });
+
+  it('returns false when sdk.version exceeds 64 characters', () => {
+    const req = validRequest();
+    (req.metadata.sdk as Record<string, unknown>).version = 'v'.repeat(65);
+    expect(isConnectionRequest(req)).toBe(false);
+  });
+
+  it('returns false when sdk.platform is missing', () => {
+    const req = validRequest();
+    delete (req.metadata.sdk as Record<string, unknown>).platform;
+    expect(isConnectionRequest(req)).toBe(false);
+  });
+
+  it('returns false when sdk.platform exceeds 64 characters', () => {
+    const req = validRequest();
+    (req.metadata.sdk as Record<string, unknown>).platform = 'p'.repeat(65);
+    expect(isConnectionRequest(req)).toBe(false);
+  });
+});
diff --git a/app/core/SDKConnectV2/types/connection-request.ts b/app/core/SDKConnectV2/types/connection-request.ts
index d96012b31707..37ed563e3500 100644
--- a/app/core/SDKConnectV2/types/connection-request.ts
+++ b/app/core/SDKConnectV2/types/connection-request.ts
@@ -2,6 +2,9 @@ import { SessionRequest } from '@metamask/mobile-wallet-protocol-core';
 import { Metadata } from './metadata';
 import { isUUID } from '../../SDKConnect/utils/isUUID';
 
+const HANDSHAKE_CHANNEL_REGEX =
+  /^handshake:[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/i;
+
 /**
  * Represents an incoming connection request parsed from a QR code or deep link.
  * This is the shared data contract between the dApp SDK and the mobile wallet,
@@ -41,14 +44,45 @@ export function isConnectionRequest(data: unknown): data is ConnectionRequest {
   if (
     !sessionReq.id ||
     typeof sessionReq.id !== 'string' ||
-    !isUUID(sessionReq.id) ||
+    !isUUID(sessionReq.id)
+  ) {
+    return false;
+  }
+
+  if (
     !sessionReq.publicKeyB64 ||
     typeof sessionReq.publicKeyB64 !== 'string' ||
+    sessionReq.publicKeyB64.length > 200
+  ) {
+    return false;
+  }
+  try {
+    const decoded = Buffer.from(sessionReq.publicKeyB64, 'base64');
+    if (decoded.length !== 33) return false; // compressed secp256k1
+  } catch {
+    return false;
+  }
+
+  if (
     !sessionReq.channel ||
     typeof sessionReq.channel !== 'string' ||
+    !HANDSHAKE_CHANNEL_REGEX.test(sessionReq.channel)
+  ) {
+    return false;
+  }
+
+  if (
     !sessionReq.mode ||
     typeof sessionReq.mode !== 'string' ||
-    typeof sessionReq.expiresAt !== 'number'
+    !['trusted', 'untrusted'].includes(sessionReq.mode)
+  ) {
+    return false;
+  }
+
+  if (
+    typeof sessionReq.expiresAt !== 'number' ||
+    isNaN(sessionReq.expiresAt) ||
+    sessionReq.expiresAt < Date.now()
   ) {
     return false;
   }
@@ -63,28 +97,56 @@ export function isConnectionRequest(data: unknown): data is ConnectionRequest {
     typeof metadata.dapp !== 'object' ||
     !metadata.dapp.name ||
     typeof metadata.dapp.name !== 'string' ||
+    metadata.dapp.name.length > 256 ||
     !metadata.dapp.url ||
-    typeof metadata.dapp.url !== 'string'
+    typeof metadata.dapp.url !== 'string' ||
+    metadata.dapp.url.length > 1024
   ) {
     return false;
   }
 
+  // SECURITY: The try/catch rejects plain strings (e.g. 'metamask') that
+  // aren't parseable URLs. The protocol check additionally blocks custom
+  // schemes like metamask:// that are valid URLs but could collide with
+  // internal origin identifiers. Together these ensure dapp.url can never
+  // match INTERNAL_ORIGINS values used in downstream privilege checks.
+  // Do not relax this without also updating the defense-in-depth check
+  // in ConnectionRegistry.handleConnectDeeplink().
+  try {
+    const parsed = new URL(metadata.dapp.url);
+    if (parsed.protocol !== 'http:' && parsed.protocol !== 'https:') {
+      return false;
+    }
+  } catch {
+    return false;
+  }
+
+  if (metadata.dapp.icon) {
+    if (
+      typeof metadata.dapp.icon !== 'string' ||
+      metadata.dapp.icon.length > 1024
+    ) {
+      return false;
+    }
+    try {
+      new URL(metadata.dapp.icon);
+    } catch {
+      return false;
+    }
+  }
+
   if (
     !metadata.sdk ||
     typeof metadata.sdk !== 'object' ||
     !metadata.sdk.version ||
     typeof metadata.sdk.version !== 'string' ||
+    metadata.sdk.version.length > 64 ||
     !metadata.sdk.platform ||
-    typeof metadata.sdk.platform !== 'string'
+    typeof metadata.sdk.platform !== 'string' ||
+    metadata.sdk.platform.length > 64
   ) {
     return false;
   }
 
-  try {
-    new URL(metadata.dapp.url);
-  } catch {
-    return false;
-  }
-
   return true;
 }
diff --git a/app/core/SDKConnectV2/types/host-application-adapter.ts b/app/core/SDKConnectV2/types/host-application-adapter.ts
index 8686c2f3794d..444d61daa834 100644
--- a/app/core/SDKConnectV2/types/host-application-adapter.ts
+++ b/app/core/SDKConnectV2/types/host-application-adapter.ts
@@ -21,10 +21,23 @@ export interface IHostApplicationAdapter {
   hideConnectionLoading(conninfo: ConnectionInfo): void;
 
   /**
-   * Displays a global, non-interactive error modal.
+   * Displays a connection-level error toast. Use only when the MWP
+   * session/handshake itself fails, not for RPC method errors.
    */
   showConnectionError(conninfo?: ConnectionInfo): void;
 
+  /**
+   * Displays a toast for an unexpected internal error (e.g. URL parsing
+   * failure, uncategorized error codes).
+   */
+  showInternalError(conninfo?: ConnectionInfo): void;
+
+  /**
+   * Displays a toast for an RPC method error that is not a user rejection
+   * (e.g. invalid params, method not found).
+   */
+  showMethodError(conninfo?: ConnectionInfo): void;
+
   /**
    * Displays a global, non-interactive not found modal.
    */
diff --git a/app/core/redux/slices/card/index.test.ts b/app/core/redux/slices/card/index.test.ts
index 5bb7f7d76696..440df785c717 100644
--- a/app/core/redux/slices/card/index.test.ts
+++ b/app/core/redux/slices/card/index.test.ts
@@ -3,13 +3,8 @@ import cardReducer, {
   CardSliceState,
   selectCardholderAccounts,
   selectIsCardholder,
-  selectCardPriorityToken,
-  selectCardPriorityTokenLastFetched,
-  selectIsCardCacheValid,
   loadCardholderAccounts,
   resetCardState,
-  setCardPriorityToken,
-  setCardPriorityTokenLastFetched,
   initialState,
   setHasViewedCardButton,
   selectHasViewedCardButton,
@@ -21,27 +16,18 @@ import cardReducer, {
   selectUserCardLocation,
   setIsAuthenticatedCard,
   setUserCardLocation,
-  setAuthenticatedPriorityToken,
-  setAuthenticatedPriorityTokenLastFetched,
   verifyCardAuthentication,
   setOnboardingId,
   setSelectedCountry,
   setContactVerificationId,
   setConsentSetId,
   resetOnboardingState,
-  setCacheData,
-  clearCacheData,
-  clearAllCache,
   selectOnboardingId,
   selectSelectedCountry,
   selectContactVerificationId,
   selectConsentSetId,
   resetAuthenticatedData,
 } from '.';
-import {
-  CardTokenAllowance,
-  AllowanceState,
-} from '../../../../components/UI/Card/types';
 import { Region } from '../../../../components/UI/Card/components/Onboarding/RegionSelectorModal';
 
 // Mock the multichain selectors
@@ -106,18 +92,6 @@ const CARDHOLDER_ACCOUNTS_MOCK: string[] = [
   '0xabcdefabcdefabcdefabcdefabcdefabcdefabcd',
 ];
 
-const MOCK_PRIORITY_TOKEN: CardTokenAllowance = {
-  address: '0xToken1',
-  caipChainId: 'eip155:1' as const,
-  decimals: 18,
-  symbol: 'USDC',
-  name: 'USD Coin',
-  allowanceState: AllowanceState.Enabled,
-  allowance: '5000000000000',
-};
-
-const testAddress = '0x1234567890123456789012345678901234567890';
-
 // Mock Region objects for testing
 const MOCK_REGION_US: Region = {
   key: 'US',
@@ -137,14 +111,6 @@ const MOCK_REGION_JP: Region = { key: 'JP', name: 'Japan', emoji: '🇯🇵' };
 const CARD_STATE_MOCK: CardSliceState = {
   cardholderAccounts: CARDHOLDER_ACCOUNTS_MOCK,
   isDaimoDemo: false,
-  priorityTokensByAddress: {
-    [testAddress.toLowerCase()]: MOCK_PRIORITY_TOKEN,
-  },
-  lastFetchedByAddress: {
-    [testAddress.toLowerCase()]: new Date('2025-08-21T10:00:00Z'),
-  },
-  authenticatedPriorityToken: MOCK_PRIORITY_TOKEN,
-  authenticatedPriorityTokenLastFetched: new Date('2025-08-21T10:00:00Z'),
   isLoaded: true,
   hasViewedCardButton: true,
   alwaysShowCardButton: false,
@@ -157,19 +123,11 @@ const CARD_STATE_MOCK: CardSliceState = {
     contactVerificationId: null,
     consentSetId: null,
   },
-  cache: {
-    data: {},
-    timestamps: {},
-  },
 };
 
 const EMPTY_CARD_STATE_MOCK: CardSliceState = {
   cardholderAccounts: [],
   isDaimoDemo: false,
-  priorityTokensByAddress: {},
-  lastFetchedByAddress: {},
-  authenticatedPriorityToken: null,
-  authenticatedPriorityTokenLastFetched: null,
   isLoaded: false,
   hasViewedCardButton: false,
   alwaysShowCardButton: false,
@@ -182,10 +140,6 @@ const EMPTY_CARD_STATE_MOCK: CardSliceState = {
     contactVerificationId: null,
     consentSetId: null,
   },
-  cache: {
-    data: {},
-    timestamps: {},
-  },
 };
 
 // Mock account object that matches the expected structure
@@ -562,14 +516,6 @@ describe('Card Reducer', () => {
       const currentState: CardSliceState = {
         cardholderAccounts: ['0x123'],
         isDaimoDemo: false,
-        priorityTokensByAddress: {
-          '0x123': MOCK_PRIORITY_TOKEN,
-        },
-        lastFetchedByAddress: {
-          '0x123': new Date(),
-        },
-        authenticatedPriorityToken: MOCK_PRIORITY_TOKEN,
-        authenticatedPriorityTokenLastFetched: new Date('2025-08-21T10:00:00Z'),
         isLoaded: true,
         hasViewedCardButton: true,
         alwaysShowCardButton: true,
@@ -582,10 +528,6 @@ describe('Card Reducer', () => {
           contactVerificationId: null,
           consentSetId: null,
         },
-        cache: {
-          data: {},
-          timestamps: {},
-        },
       };
 
       const state = cardReducer(currentState, resetCardState());
@@ -813,257 +755,15 @@ describe('Card Reducer', () => {
       });
     });
 
-    describe('Cache Actions', () => {
-      describe('setCacheData', () => {
-        it('should set cache data with key, data, and timestamp', () => {
-          const cacheKey = 'test-key';
-          const cacheData = { value: 'test-data' };
-          const timestamp = Date.now();
-
-          const state = cardReducer(
-            initialState,
-            setCacheData({
-              key: cacheKey,
-              data: cacheData,
-              timestamp,
-            }),
-          );
-
-          expect(state.cache.data[cacheKey]).toEqual(cacheData);
-          expect(state.cache.timestamps[cacheKey]).toBe(timestamp);
-        });
-
-        it('should handle different data types', () => {
-          const testCases = [
-            { key: 'string-data', data: 'test string', timestamp: 1000 },
-            { key: 'number-data', data: 42, timestamp: 2000 },
-            { key: 'boolean-data', data: true, timestamp: 3000 },
-            { key: 'array-data', data: [1, 2, 3], timestamp: 4000 },
-            {
-              key: 'object-data',
-              data: { nested: { value: 'test' } },
-              timestamp: 5000,
-            },
-            { key: 'null-data', data: null, timestamp: 6000 },
-          ];
-
-          let state = initialState;
-          testCases.forEach(({ key, data, timestamp }) => {
-            state = cardReducer(state, setCacheData({ key, data, timestamp }));
-          });
-
-          testCases.forEach(({ key, data, timestamp }) => {
-            expect(state.cache.data[key]).toEqual(data);
-            expect(state.cache.timestamps[key]).toBe(timestamp);
-          });
-        });
-
-        it('should overwrite existing cache data for the same key', () => {
-          const cacheKey = 'overwrite-test';
-          const oldData = { value: 'old' };
-          const newData = { value: 'new' };
-          const oldTimestamp = 1000;
-          const newTimestamp = 2000;
-
-          let state = cardReducer(
-            initialState,
-            setCacheData({
-              key: cacheKey,
-              data: oldData,
-              timestamp: oldTimestamp,
-            }),
-          );
-
-          state = cardReducer(
-            state,
-            setCacheData({
-              key: cacheKey,
-              data: newData,
-              timestamp: newTimestamp,
-            }),
-          );
-
-          expect(state.cache.data[cacheKey]).toEqual(newData);
-          expect(state.cache.timestamps[cacheKey]).toBe(newTimestamp);
-        });
-
-        it('should not affect other cache entries', () => {
-          const existingKey = 'existing';
-          const existingData = { value: 'existing' };
-          const existingTimestamp = 1000;
-
-          const newKey = 'new';
-          const newData = { value: 'new' };
-          const newTimestamp = 2000;
-
-          let state = cardReducer(
-            initialState,
-            setCacheData({
-              key: existingKey,
-              data: existingData,
-              timestamp: existingTimestamp,
-            }),
-          );
-
-          state = cardReducer(
-            state,
-            setCacheData({
-              key: newKey,
-              data: newData,
-              timestamp: newTimestamp,
-            }),
-          );
-
-          expect(state.cache.data[existingKey]).toEqual(existingData);
-          expect(state.cache.timestamps[existingKey]).toBe(existingTimestamp);
-          expect(state.cache.data[newKey]).toEqual(newData);
-          expect(state.cache.timestamps[newKey]).toBe(newTimestamp);
-        });
-      });
-
-      describe('clearCacheData', () => {
-        it('should clear cache data for specific key', () => {
-          const cacheKey = 'test-key';
-          const cacheData = { value: 'test-data' };
-          const timestamp = Date.now();
-
-          let state = cardReducer(
-            initialState,
-            setCacheData({
-              key: cacheKey,
-              data: cacheData,
-              timestamp,
-            }),
-          );
-
-          state = cardReducer(state, clearCacheData(cacheKey));
-
-          expect(state.cache.data[cacheKey]).toBeUndefined();
-          expect(state.cache.timestamps[cacheKey]).toBeUndefined();
-        });
-
-        it('should only clear the specified key, not others', () => {
-          const key1 = 'key1';
-          const key2 = 'key2';
-          const data1 = { value: 'data1' };
-          const data2 = { value: 'data2' };
-          const timestamp1 = 1000;
-          const timestamp2 = 2000;
-
-          let state = cardReducer(
-            initialState,
-            setCacheData({ key: key1, data: data1, timestamp: timestamp1 }),
-          );
-
-          state = cardReducer(
-            state,
-            setCacheData({ key: key2, data: data2, timestamp: timestamp2 }),
-          );
-
-          state = cardReducer(state, clearCacheData(key1));
-
-          expect(state.cache.data[key1]).toBeUndefined();
-          expect(state.cache.timestamps[key1]).toBeUndefined();
-          expect(state.cache.data[key2]).toEqual(data2);
-          expect(state.cache.timestamps[key2]).toBe(timestamp2);
-        });
-
-        it('should handle clearing non-existent key gracefully', () => {
-          const nonExistentKey = 'non-existent';
-          const existingKey = 'existing';
-          const existingData = { value: 'existing' };
-          const existingTimestamp = 1000;
-
-          let state = cardReducer(
-            initialState,
-            setCacheData({
-              key: existingKey,
-              data: existingData,
-              timestamp: existingTimestamp,
-            }),
-          );
-
-          state = cardReducer(state, clearCacheData(nonExistentKey));
-
-          expect(state.cache.data[existingKey]).toEqual(existingData);
-          expect(state.cache.timestamps[existingKey]).toBe(existingTimestamp);
-          expect(state.cache.data[nonExistentKey]).toBeUndefined();
-          expect(state.cache.timestamps[nonExistentKey]).toBeUndefined();
-        });
-      });
-
-      describe('clearAllCache', () => {
-        it('should clear all cache data and timestamps', () => {
-          const testData = [
-            { key: 'key1', data: { value: 'data1' }, timestamp: 1000 },
-            { key: 'key2', data: { value: 'data2' }, timestamp: 2000 },
-            { key: 'key3', data: { value: 'data3' }, timestamp: 3000 },
-          ];
-
-          let state = initialState;
-          testData.forEach(({ key, data, timestamp }) => {
-            state = cardReducer(state, setCacheData({ key, data, timestamp }));
-          });
-
-          // Verify data was set
-          testData.forEach(({ key, data, timestamp }) => {
-            expect(state.cache.data[key]).toEqual(data);
-            expect(state.cache.timestamps[key]).toBe(timestamp);
-          });
-
-          state = cardReducer(state, clearAllCache());
-
-          expect(state.cache.data).toEqual({});
-          expect(state.cache.timestamps).toEqual({});
-        });
-
-        it('should not affect other state properties', () => {
-          const testData = {
-            key: 'test',
-            data: { value: 'test' },
-            timestamp: 1000,
-          };
-
-          let state = cardReducer(initialState, setCacheData(testData));
-
-          state = cardReducer(state, clearAllCache());
-
-          expect(state.cache.data).toEqual({});
-          expect(state.cache.timestamps).toEqual({});
-          expect(state.cardholderAccounts).toEqual(
-            initialState.cardholderAccounts,
-          );
-          expect(state.priorityTokensByAddress).toEqual(
-            initialState.priorityTokensByAddress,
-          );
-          expect(state.onboarding).toEqual(initialState.onboarding);
-        });
-
-        it('should work when cache is already empty', () => {
-          const state = cardReducer(initialState, clearAllCache());
-
-          expect(state.cache.data).toEqual({});
-          expect(state.cache.timestamps).toEqual({});
-        });
-      });
-    });
-
     describe('resetAuthenticatedData', () => {
-      it('resets all authenticated-related state to initial values', () => {
+      it('resets isAuthenticated to false', () => {
         const currentState: CardSliceState = {
           ...initialState,
-          authenticatedPriorityToken: MOCK_PRIORITY_TOKEN,
-          authenticatedPriorityTokenLastFetched: new Date(
-            '2025-08-21T10:00:00Z',
-          ),
-          userCardLocation: 'us',
           isAuthenticated: true,
         };
 
         const state = cardReducer(currentState, resetAuthenticatedData());
 
-        expect(state.authenticatedPriorityToken).toBeNull();
-        expect(state.authenticatedPriorityTokenLastFetched).toBeNull();
         expect(state.isAuthenticated).toBe(false);
       });
 
@@ -1088,18 +788,8 @@ describe('Card Reducer', () => {
           isLoaded: true,
           hasViewedCardButton: true,
           alwaysShowCardButton: true,
-          authenticatedPriorityToken: MOCK_PRIORITY_TOKEN,
-          authenticatedPriorityTokenLastFetched: new Date(
-            '2025-08-21T10:00:00Z',
-          ),
           userCardLocation: 'us',
           isAuthenticated: true,
-          priorityTokensByAddress: {
-            [testAddress.toLowerCase()]: MOCK_PRIORITY_TOKEN,
-          },
-          lastFetchedByAddress: {
-            [testAddress.toLowerCase()]: new Date('2025-08-21T10:00:00Z'),
-          },
           onboarding: {
             onboardingId: 'test-id',
             selectedCountry: MOCK_REGION_US,
@@ -1110,9 +800,6 @@ describe('Card Reducer', () => {
 
         const state = cardReducer(currentState, resetAuthenticatedData());
 
-        // Authenticated data is reset
-        expect(state.authenticatedPriorityToken).toBeNull();
-        expect(state.authenticatedPriorityTokenLastFetched).toBeNull();
         expect(state.isAuthenticated).toBe(false);
 
         // userCardLocation is preserved (not part of auth data)
@@ -1124,12 +811,6 @@ describe('Card Reducer', () => {
         expect(state.isLoaded).toBe(true);
         expect(state.hasViewedCardButton).toBe(true);
         expect(state.alwaysShowCardButton).toBe(true);
-        expect(
-          state.priorityTokensByAddress[testAddress.toLowerCase()],
-        ).toEqual(MOCK_PRIORITY_TOKEN);
-        expect(state.lastFetchedByAddress[testAddress.toLowerCase()]).toEqual(
-          new Date('2025-08-21T10:00:00Z'),
-        );
         expect(state.onboarding).toEqual({
           onboardingId: 'test-id',
           selectedCountry: MOCK_REGION_US,
@@ -1141,666 +822,193 @@ describe('Card Reducer', () => {
       it('works when authenticated data is already at initial values', () => {
         const state = cardReducer(initialState, resetAuthenticatedData());
 
-        expect(state.authenticatedPriorityToken).toBeNull();
-        expect(state.authenticatedPriorityTokenLastFetched).toBeNull();
         expect(state.userCardLocation).toBe('international');
         expect(state.isAuthenticated).toBe(false);
       });
-
-      it('resets string date format for authenticatedPriorityTokenLastFetched', () => {
-        const currentState: CardSliceState = {
-          ...initialState,
-          authenticatedPriorityTokenLastFetched: '2025-08-21T10:00:00Z',
-          isAuthenticated: true,
-        };
-
-        const state = cardReducer(currentState, resetAuthenticatedData());
-
-        expect(state.authenticatedPriorityTokenLastFetched).toBeNull();
-        expect(state.isAuthenticated).toBe(false);
-      });
     });
   });
 });
 
-describe('Card Caching Functionality', () => {
-  describe('selectCardPriorityToken', () => {
-    it('should return the priority token when it exists for the given address', () => {
-      const mockRootState = {
-        card: CARD_STATE_MOCK,
-      } as unknown as RootState;
+describe('Card Button Display Selectors', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
 
-      const selector = selectCardPriorityToken(false, testAddress);
-      expect(selector(mockRootState)).toEqual(MOCK_PRIORITY_TOKEN);
-    });
+  describe('selectAlwaysShowCardButton', () => {
+    it('should return false when experimental switch is disabled', () => {
+      mockSelectCardExperimentalSwitch.mockReturnValue(false);
+
+      const stateWithAlwaysShow: CardSliceState = {
+        ...initialState,
+        alwaysShowCardButton: true,
+      };
 
-    it('should return null when no priority token exists for the given address', () => {
       const mockRootState = {
-        card: EMPTY_CARD_STATE_MOCK,
+        card: stateWithAlwaysShow,
       } as unknown as RootState;
 
-      const selector = selectCardPriorityToken(false, testAddress);
-      expect(selector(mockRootState)).toBeNull();
+      expect(selectAlwaysShowCardButton(mockRootState)).toBe(false);
     });
 
-    it('should return null when address is not provided', () => {
-      const mockRootState = {
-        card: CARD_STATE_MOCK,
-      } as unknown as RootState;
+    it('should return stored value when experimental switch is enabled', () => {
+      mockSelectCardExperimentalSwitch.mockReturnValue(true);
 
-      const selector = selectCardPriorityToken(false);
-      expect(selector(mockRootState)).toBeNull();
-    });
+      const stateWithAlwaysShow: CardSliceState = {
+        ...initialState,
+        alwaysShowCardButton: true,
+      };
 
-    it('should handle different address cases', () => {
       const mockRootState = {
-        card: CARD_STATE_MOCK,
+        card: stateWithAlwaysShow,
       } as unknown as RootState;
 
-      // Test with uppercase address
-      const upperCaseSelector = selectCardPriorityToken(
-        false,
-        testAddress.toUpperCase(),
-      );
-      expect(upperCaseSelector(mockRootState)).toEqual(MOCK_PRIORITY_TOKEN);
-
-      // Test with different address that doesn't exist
-      const differentAddressSelector = selectCardPriorityToken(
-        false,
-        '0x9999999999999999999999999999999999999999',
-      );
-      expect(differentAddressSelector(mockRootState)).toBeNull();
+      expect(selectAlwaysShowCardButton(mockRootState)).toBe(true);
     });
-  });
 
-  describe('selectCardPriorityTokenLastFetched', () => {
-    it('should return the last fetched timestamp when it exists for the given address', () => {
-      const mockRootState = {
-        card: CARD_STATE_MOCK,
-      } as unknown as RootState;
+    it('should return false when experimental switch is enabled but stored value is false', () => {
+      mockSelectCardExperimentalSwitch.mockReturnValue(true);
 
-      const selector = selectCardPriorityTokenLastFetched(false, testAddress);
-      expect(selector(mockRootState)).toEqual(new Date('2025-08-21T10:00:00Z'));
-    });
+      const stateWithoutAlwaysShow: CardSliceState = {
+        ...initialState,
+        alwaysShowCardButton: false,
+      };
 
-    it('should return null when no last fetched timestamp exists for the given address', () => {
       const mockRootState = {
-        card: EMPTY_CARD_STATE_MOCK,
+        card: stateWithoutAlwaysShow,
       } as unknown as RootState;
 
-      const selector = selectCardPriorityTokenLastFetched(false, testAddress);
-      expect(selector(mockRootState)).toBeNull();
+      expect(selectAlwaysShowCardButton(mockRootState)).toBe(false);
     });
 
-    it('should return null when address is not provided', () => {
+    it('should return false by default with initial state', () => {
+      mockSelectCardExperimentalSwitch.mockReturnValue(false);
+
       const mockRootState = {
-        card: CARD_STATE_MOCK,
+        card: initialState,
       } as unknown as RootState;
 
-      const selector = selectCardPriorityTokenLastFetched(false);
-      expect(selector(mockRootState)).toBeNull();
+      expect(selectAlwaysShowCardButton(mockRootState)).toBe(false);
     });
+  });
 
-    it('should handle different address cases', () => {
-      const mockRootState = {
-        card: CARD_STATE_MOCK,
-      } as unknown as RootState;
+  describe('setAlwaysShowCardButton', () => {
+    it('should set alwaysShowCardButton to true', () => {
+      const state = cardReducer(initialState, setAlwaysShowCardButton(true));
+      expect(state.alwaysShowCardButton).toBe(true);
+    });
 
-      // Test with uppercase address
-      const upperCaseSelector = selectCardPriorityTokenLastFetched(
-        false,
-        testAddress.toUpperCase(),
-      );
-      expect(upperCaseSelector(mockRootState)).toEqual(
-        new Date('2025-08-21T10:00:00Z'),
-      );
+    it('should set alwaysShowCardButton to false', () => {
+      const currentState: CardSliceState = {
+        ...initialState,
+        alwaysShowCardButton: true,
+      };
 
-      // Test with different address that doesn't exist
-      const differentAddressSelector = selectCardPriorityTokenLastFetched(
-        false,
-        '0x9999999999999999999999999999999999999999',
-      );
-      expect(differentAddressSelector(mockRootState)).toBeNull();
+      const state = cardReducer(currentState, setAlwaysShowCardButton(false));
+      expect(state.alwaysShowCardButton).toBe(false);
+    });
+
+    it('should not affect other state properties', () => {
+      const state = cardReducer(initialState, setAlwaysShowCardButton(true));
+      expect(state.cardholderAccounts).toEqual(initialState.cardholderAccounts);
+      expect(state.geoLocation).toEqual(initialState.geoLocation);
+      expect(state.isLoaded).toEqual(initialState.isLoaded);
     });
   });
 
-  describe('selectIsCardCacheValid', () => {
-    let dateNowSpy: jest.SpyInstance;
+  describe('selectDisplayCardButton', () => {
+    const mockAccountAddress = '0x1234567890123456789012345678901234567890';
+    const mockAccount = {
+      address: mockAccountAddress.toLowerCase(),
+      id: 'mock-id',
+      metadata: {
+        name: 'Mock Account',
+        importTime: Date.now(),
+        keyring: { type: 'HD Key Tree' },
+      },
+      options: {},
+      methods: [],
+      type: 'eip155:eoa' as const,
+      scopes: ['eip155:59144' as const],
+    };
 
     beforeEach(() => {
-      dateNowSpy = jest.spyOn(Date, 'now');
+      // Reset all mocks to default false/empty values
+      mockSelectCardExperimentalSwitch.mockReturnValue(false);
+      mockSelectCardSupportedCountries.mockReturnValue({});
+      mockSelectDisplayCardButtonFeatureFlag.mockReturnValue(false);
+      mockSelectSelectedInternalAccountByScope.mockReturnValue(() => undefined);
+      mockIsEthAccount.mockReturnValue(false);
     });
 
-    afterEach(() => {
-      dateNowSpy.mockRestore();
-    });
+    it('should return true when alwaysShowCardButton is true', () => {
+      mockSelectCardExperimentalSwitch.mockReturnValue(true);
 
-    it('should return true when cache is within 5-minute window for the given address', () => {
-      // Mock Date.now to return 4 minutes after fetch time
-      dateNowSpy.mockReturnValue(new Date('2025-08-21T10:04:00Z').getTime());
+      const stateWithAlwaysShow: CardSliceState = {
+        ...initialState,
+        alwaysShowCardButton: true,
+        geoLocation: 'XX', // Unsupported country
+        cardholderAccounts: [], // Not a cardholder
+      };
 
       const mockRootState = {
-        card: CARD_STATE_MOCK,
+        card: stateWithAlwaysShow,
       } as unknown as RootState;
 
-      const selector = selectIsCardCacheValid(false, testAddress);
-      expect(selector(mockRootState)).toBe(true);
+      expect(selectDisplayCardButton(mockRootState)).toBe(true);
     });
 
-    it('should return false when cache is older than 5 minutes for the given address', () => {
-      // Mock Date.now to return 6 minutes after fetch time
-      dateNowSpy.mockReturnValue(new Date('2025-08-21T10:06:00Z').getTime());
-
-      const stateWithOldCache: CardSliceState = {
-        ...CARD_STATE_MOCK,
-        lastFetchedByAddress: {
-          [testAddress.toLowerCase()]: new Date('2025-08-21T10:00:00Z'),
-        },
+    it('should return true when user is a cardholder', () => {
+      const stateWithCardholder: CardSliceState = {
+        ...initialState,
+        cardholderAccounts: [mockAccountAddress.toLowerCase()],
+        alwaysShowCardButton: false,
+        geoLocation: 'XX', // Unsupported country
       };
 
+      mockSelectSelectedInternalAccountByScope.mockReturnValue(
+        () => mockAccount,
+      );
+      mockIsEthAccount.mockReturnValue(true);
+      mockSelectCardExperimentalSwitch.mockReturnValue(false);
+
       const mockRootState = {
-        card: stateWithOldCache,
+        card: stateWithCardholder,
       } as unknown as RootState;
 
-      const selector = selectIsCardCacheValid(false, testAddress);
-      expect(selector(mockRootState)).toBe(false);
+      expect(selectDisplayCardButton(mockRootState)).toBe(true);
     });
 
-    it('should return false when no last fetched timestamp exists for the given address', () => {
-      // Mock Date.now to any time
-      dateNowSpy.mockReturnValue(new Date('2025-08-21T10:04:00Z').getTime());
+    it('should return true when in supported country with feature flag enabled', () => {
+      mockSelectCardSupportedCountries.mockReturnValue({ US: true });
+      mockSelectDisplayCardButtonFeatureFlag.mockReturnValue(true);
+
+      const stateWithGeoLocation: CardSliceState = {
+        ...initialState,
+        geoLocation: 'US',
+        cardholderAccounts: [],
+        alwaysShowCardButton: false,
+      };
 
       const mockRootState = {
-        card: EMPTY_CARD_STATE_MOCK,
+        card: stateWithGeoLocation,
       } as unknown as RootState;
 
-      const selector = selectIsCardCacheValid(false, testAddress);
-      expect(selector(mockRootState)).toBe(false);
+      expect(selectDisplayCardButton(mockRootState)).toBe(true);
     });
 
-    it('should handle ISO date strings from redux-persist', () => {
-      // Mock Date.now to return 4 minutes after fetch time
-      dateNowSpy.mockReturnValue(new Date('2025-08-21T10:04:00Z').getTime());
+    it('should return false when in supported country but feature flag is disabled', () => {
+      mockSelectCardSupportedCountries.mockReturnValue({ US: true });
+      mockSelectDisplayCardButtonFeatureFlag.mockReturnValue(false);
 
-      const stateWithStringDate: CardSliceState = {
-        ...CARD_STATE_MOCK,
-        lastFetchedByAddress: {
-          [testAddress.toLowerCase()]: '2025-08-21T10:00:00Z', // String instead of Date object
-        },
+      const stateWithGeoLocation: CardSliceState = {
+        ...initialState,
+        geoLocation: 'US',
+        cardholderAccounts: [],
+        alwaysShowCardButton: false,
       };
 
       const mockRootState = {
-        card: stateWithStringDate,
-      } as unknown as RootState;
-
-      const selector = selectIsCardCacheValid(false, testAddress);
-      expect(selector(mockRootState)).toBe(true);
-    });
-
-    it('should return false when address is not provided', () => {
-      // Mock Date.now to return 4 minutes after fetch time
-      dateNowSpy.mockReturnValue(new Date('2025-08-21T10:04:00Z').getTime());
-
-      const mockRootState = {
-        card: CARD_STATE_MOCK,
-      } as unknown as RootState;
-
-      const selector = selectIsCardCacheValid(false);
-      expect(selector(mockRootState)).toBe(false);
-    });
-
-    it('should return false for cache exactly 5 minutes old', () => {
-      // Mock Date.now to return exactly 5 minutes after fetch time
-      dateNowSpy.mockReturnValue(new Date('2025-08-21T10:05:00Z').getTime());
-
-      const stateWithExactlyOldCache: CardSliceState = {
-        ...CARD_STATE_MOCK,
-        lastFetchedByAddress: {
-          [testAddress.toLowerCase()]: new Date('2025-08-21T10:00:00Z'),
-        },
-      };
-
-      const mockRootState = {
-        card: stateWithExactlyOldCache,
-      } as unknown as RootState;
-
-      const selector = selectIsCardCacheValid(false, testAddress);
-      expect(selector(mockRootState)).toBe(false);
-    });
-
-    it('should return true for cache 4 minutes and 59 seconds old', () => {
-      // Mock Date.now to return 4:59 after fetch time (still valid)
-      dateNowSpy.mockReturnValue(new Date('2025-08-21T10:04:59Z').getTime());
-
-      const mockRootState = {
-        card: CARD_STATE_MOCK,
-      } as unknown as RootState;
-
-      const selector = selectIsCardCacheValid(false, testAddress);
-      expect(selector(mockRootState)).toBe(true);
-    });
-  });
-
-  describe('setCardPriorityToken', () => {
-    it('should set the priority token for the given address', () => {
-      const state = cardReducer(
-        initialState,
-        setCardPriorityToken({
-          address: testAddress,
-          token: MOCK_PRIORITY_TOKEN,
-        }),
-      );
-
-      expect(state.priorityTokensByAddress[testAddress.toLowerCase()]).toEqual(
-        MOCK_PRIORITY_TOKEN,
-      );
-      expect(state.lastFetchedByAddress).toEqual(
-        initialState.lastFetchedByAddress,
-      );
-    });
-
-    it('should set priority token to null for the given address', () => {
-      const stateWithToken = {
-        ...initialState,
-        priorityTokensByAddress: {
-          [testAddress.toLowerCase()]: MOCK_PRIORITY_TOKEN,
-        },
-      };
-
-      const state = cardReducer(
-        stateWithToken,
-        setCardPriorityToken({
-          address: testAddress,
-          token: null,
-        }),
-      );
-
-      expect(
-        state.priorityTokensByAddress[testAddress.toLowerCase()],
-      ).toBeNull();
-    });
-
-    it('should update existing priority token for the given address', () => {
-      const newToken: CardTokenAllowance = {
-        ...MOCK_PRIORITY_TOKEN,
-        symbol: 'UPDATED',
-      };
-
-      const stateWithToken = {
-        ...initialState,
-        priorityTokensByAddress: {
-          [testAddress.toLowerCase()]: MOCK_PRIORITY_TOKEN,
-        },
-      };
-
-      const state = cardReducer(
-        stateWithToken,
-        setCardPriorityToken({
-          address: testAddress,
-          token: newToken,
-        }),
-      );
-
-      expect(state.priorityTokensByAddress[testAddress.toLowerCase()]).toEqual(
-        newToken,
-      );
-    });
-
-    it('should store tokens for different addresses separately', () => {
-      const address1 = testAddress;
-      const address2 = '0xabcdefabcdefabcdefabcdefabcdefabcdefabcd';
-      const token2: CardTokenAllowance = {
-        ...MOCK_PRIORITY_TOKEN,
-        symbol: 'TOKEN2',
-      };
-
-      let state = cardReducer(
-        initialState,
-        setCardPriorityToken({
-          address: address1,
-          token: MOCK_PRIORITY_TOKEN,
-        }),
-      );
-
-      state = cardReducer(
-        state,
-        setCardPriorityToken({
-          address: address2,
-          token: token2,
-        }),
-      );
-
-      expect(state.priorityTokensByAddress[address1.toLowerCase()]).toEqual(
-        MOCK_PRIORITY_TOKEN,
-      );
-      expect(state.priorityTokensByAddress[address2.toLowerCase()]).toEqual(
-        token2,
-      );
-    });
-
-    it('should normalize address to lowercase', () => {
-      const upperCaseAddress = testAddress.toUpperCase();
-
-      const state = cardReducer(
-        initialState,
-        setCardPriorityToken({
-          address: upperCaseAddress,
-          token: MOCK_PRIORITY_TOKEN,
-        }),
-      );
-
-      expect(state.priorityTokensByAddress[testAddress.toLowerCase()]).toEqual(
-        MOCK_PRIORITY_TOKEN,
-      );
-      expect(state.priorityTokensByAddress[upperCaseAddress]).toBeUndefined();
-    });
-  });
-
-  describe('setCardPriorityTokenLastFetched', () => {
-    it('should set the last fetched timestamp for the given address', () => {
-      const testDate = new Date('2025-08-21T10:00:00Z');
-
-      const state = cardReducer(
-        initialState,
-        setCardPriorityTokenLastFetched({
-          address: testAddress,
-          lastFetched: testDate,
-        }),
-      );
-
-      expect(state.lastFetchedByAddress[testAddress.toLowerCase()]).toEqual(
-        testDate,
-      );
-      expect(state.priorityTokensByAddress).toEqual(
-        initialState.priorityTokensByAddress,
-      );
-    });
-
-    it('should handle ISO date strings', () => {
-      const testDateString = '2025-08-21T10:00:00Z';
-
-      const state = cardReducer(
-        initialState,
-        setCardPriorityTokenLastFetched({
-          address: testAddress,
-          lastFetched: testDateString,
-        }),
-      );
-
-      expect(state.lastFetchedByAddress[testAddress.toLowerCase()]).toEqual(
-        testDateString,
-      );
-    });
-
-    it('should store last fetched timestamps for different addresses separately', () => {
-      const address1 = testAddress;
-      const address2 = '0xabcdefabcdefabcdefabcdefabcdefabcdefabcd';
-      const date1 = new Date('2025-08-21T10:00:00Z');
-      const date2 = new Date('2025-08-21T11:00:00Z');
-
-      let state = cardReducer(
-        initialState,
-        setCardPriorityTokenLastFetched({
-          address: address1,
-          lastFetched: date1,
-        }),
-      );
-
-      state = cardReducer(
-        state,
-        setCardPriorityTokenLastFetched({
-          address: address2,
-          lastFetched: date2,
-        }),
-      );
-
-      expect(state.lastFetchedByAddress[address1.toLowerCase()]).toEqual(date1);
-      expect(state.lastFetchedByAddress[address2.toLowerCase()]).toEqual(date2);
-    });
-
-    it('should normalize address to lowercase', () => {
-      const upperCaseAddress = testAddress.toUpperCase();
-      const testDate = new Date('2025-08-21T10:00:00Z');
-
-      const state = cardReducer(
-        initialState,
-        setCardPriorityTokenLastFetched({
-          address: upperCaseAddress,
-          lastFetched: testDate,
-        }),
-      );
-
-      expect(state.lastFetchedByAddress[testAddress.toLowerCase()]).toEqual(
-        testDate,
-      );
-      expect(state.lastFetchedByAddress[upperCaseAddress]).toBeUndefined();
-    });
-
-    it('should set lastFetched to null for the given address', () => {
-      const stateWithTimestamp = {
-        ...initialState,
-        lastFetchedByAddress: {
-          [testAddress.toLowerCase()]: new Date(),
-        },
-      };
-
-      const state = cardReducer(
-        stateWithTimestamp,
-        setCardPriorityTokenLastFetched({
-          address: testAddress,
-          lastFetched: null,
-        }),
-      );
-
-      expect(state.lastFetchedByAddress[testAddress.toLowerCase()]).toBeNull();
-    });
-
-    it('should overwrite existing timestamp for the given address', () => {
-      const oldTimestamp = new Date('2025-08-21T10:00:00Z');
-      const newTimestamp = new Date('2025-08-21T11:00:00Z');
-
-      const stateWithTimestamp = {
-        ...initialState,
-        lastFetchedByAddress: {
-          [testAddress.toLowerCase()]: oldTimestamp,
-        },
-      };
-
-      const state = cardReducer(
-        stateWithTimestamp,
-        setCardPriorityTokenLastFetched({
-          address: testAddress,
-          lastFetched: newTimestamp,
-        }),
-      );
-
-      expect(state.lastFetchedByAddress[testAddress.toLowerCase()]).toEqual(
-        newTimestamp,
-      );
-    });
-  });
-});
-
-describe('Card Button Display Selectors', () => {
-  beforeEach(() => {
-    jest.clearAllMocks();
-  });
-
-  describe('selectAlwaysShowCardButton', () => {
-    it('should return false when experimental switch is disabled', () => {
-      mockSelectCardExperimentalSwitch.mockReturnValue(false);
-
-      const stateWithAlwaysShow: CardSliceState = {
-        ...initialState,
-        alwaysShowCardButton: true,
-      };
-
-      const mockRootState = {
-        card: stateWithAlwaysShow,
-      } as unknown as RootState;
-
-      expect(selectAlwaysShowCardButton(mockRootState)).toBe(false);
-    });
-
-    it('should return stored value when experimental switch is enabled', () => {
-      mockSelectCardExperimentalSwitch.mockReturnValue(true);
-
-      const stateWithAlwaysShow: CardSliceState = {
-        ...initialState,
-        alwaysShowCardButton: true,
-      };
-
-      const mockRootState = {
-        card: stateWithAlwaysShow,
-      } as unknown as RootState;
-
-      expect(selectAlwaysShowCardButton(mockRootState)).toBe(true);
-    });
-
-    it('should return false when experimental switch is enabled but stored value is false', () => {
-      mockSelectCardExperimentalSwitch.mockReturnValue(true);
-
-      const stateWithoutAlwaysShow: CardSliceState = {
-        ...initialState,
-        alwaysShowCardButton: false,
-      };
-
-      const mockRootState = {
-        card: stateWithoutAlwaysShow,
-      } as unknown as RootState;
-
-      expect(selectAlwaysShowCardButton(mockRootState)).toBe(false);
-    });
-
-    it('should return false by default with initial state', () => {
-      mockSelectCardExperimentalSwitch.mockReturnValue(false);
-
-      const mockRootState = {
-        card: initialState,
-      } as unknown as RootState;
-
-      expect(selectAlwaysShowCardButton(mockRootState)).toBe(false);
-    });
-  });
-
-  describe('setAlwaysShowCardButton', () => {
-    it('should set alwaysShowCardButton to true', () => {
-      const state = cardReducer(initialState, setAlwaysShowCardButton(true));
-      expect(state.alwaysShowCardButton).toBe(true);
-    });
-
-    it('should set alwaysShowCardButton to false', () => {
-      const currentState: CardSliceState = {
-        ...initialState,
-        alwaysShowCardButton: true,
-      };
-
-      const state = cardReducer(currentState, setAlwaysShowCardButton(false));
-      expect(state.alwaysShowCardButton).toBe(false);
-    });
-
-    it('should not affect other state properties', () => {
-      const state = cardReducer(initialState, setAlwaysShowCardButton(true));
-      expect(state.cardholderAccounts).toEqual(initialState.cardholderAccounts);
-      expect(state.geoLocation).toEqual(initialState.geoLocation);
-      expect(state.isLoaded).toEqual(initialState.isLoaded);
-    });
-  });
-
-  describe('selectDisplayCardButton', () => {
-    const mockAccountAddress = '0x1234567890123456789012345678901234567890';
-    const mockAccount = {
-      address: mockAccountAddress.toLowerCase(),
-      id: 'mock-id',
-      metadata: {
-        name: 'Mock Account',
-        importTime: Date.now(),
-        keyring: { type: 'HD Key Tree' },
-      },
-      options: {},
-      methods: [],
-      type: 'eip155:eoa' as const,
-      scopes: ['eip155:59144' as const],
-    };
-
-    beforeEach(() => {
-      // Reset all mocks to default false/empty values
-      mockSelectCardExperimentalSwitch.mockReturnValue(false);
-      mockSelectCardSupportedCountries.mockReturnValue({});
-      mockSelectDisplayCardButtonFeatureFlag.mockReturnValue(false);
-      mockSelectSelectedInternalAccountByScope.mockReturnValue(() => undefined);
-      mockIsEthAccount.mockReturnValue(false);
-    });
-
-    it('should return true when alwaysShowCardButton is true', () => {
-      mockSelectCardExperimentalSwitch.mockReturnValue(true);
-
-      const stateWithAlwaysShow: CardSliceState = {
-        ...initialState,
-        alwaysShowCardButton: true,
-        geoLocation: 'XX', // Unsupported country
-        cardholderAccounts: [], // Not a cardholder
-      };
-
-      const mockRootState = {
-        card: stateWithAlwaysShow,
-      } as unknown as RootState;
-
-      expect(selectDisplayCardButton(mockRootState)).toBe(true);
-    });
-
-    it('should return true when user is a cardholder', () => {
-      const stateWithCardholder: CardSliceState = {
-        ...initialState,
-        cardholderAccounts: [mockAccountAddress.toLowerCase()],
-        alwaysShowCardButton: false,
-        geoLocation: 'XX', // Unsupported country
-      };
-
-      mockSelectSelectedInternalAccountByScope.mockReturnValue(
-        () => mockAccount,
-      );
-      mockIsEthAccount.mockReturnValue(true);
-      mockSelectCardExperimentalSwitch.mockReturnValue(false);
-
-      const mockRootState = {
-        card: stateWithCardholder,
-      } as unknown as RootState;
-
-      expect(selectDisplayCardButton(mockRootState)).toBe(true);
-    });
-
-    it('should return true when in supported country with feature flag enabled', () => {
-      mockSelectCardSupportedCountries.mockReturnValue({ US: true });
-      mockSelectDisplayCardButtonFeatureFlag.mockReturnValue(true);
-
-      const stateWithGeoLocation: CardSliceState = {
-        ...initialState,
-        geoLocation: 'US',
-        cardholderAccounts: [],
-        alwaysShowCardButton: false,
-      };
-
-      const mockRootState = {
-        card: stateWithGeoLocation,
-      } as unknown as RootState;
-
-      expect(selectDisplayCardButton(mockRootState)).toBe(true);
-    });
-
-    it('should return false when in supported country but feature flag is disabled', () => {
-      mockSelectCardSupportedCountries.mockReturnValue({ US: true });
-      mockSelectDisplayCardButtonFeatureFlag.mockReturnValue(false);
-
-      const stateWithGeoLocation: CardSliceState = {
-        ...initialState,
-        geoLocation: 'US',
-        cardholderAccounts: [],
-        alwaysShowCardButton: false,
-      };
-
-      const mockRootState = {
-        card: stateWithGeoLocation,
+        card: stateWithGeoLocation,
       } as unknown as RootState;
 
       expect(selectDisplayCardButton(mockRootState)).toBe(false);
@@ -2038,119 +1246,6 @@ describe('Authentication Selectors and Actions', () => {
       expect(state.isAuthenticated).toEqual(initialState.isAuthenticated);
     });
   });
-
-  describe('setAuthenticatedPriorityToken', () => {
-    it('sets authenticatedPriorityToken to a token', () => {
-      const state = cardReducer(
-        initialState,
-        setAuthenticatedPriorityToken(MOCK_PRIORITY_TOKEN),
-      );
-      expect(state.authenticatedPriorityToken).toEqual(MOCK_PRIORITY_TOKEN);
-    });
-
-    it('sets authenticatedPriorityToken to null', () => {
-      const currentState: CardSliceState = {
-        ...initialState,
-        authenticatedPriorityToken: MOCK_PRIORITY_TOKEN,
-      };
-      const state = cardReducer(
-        currentState,
-        setAuthenticatedPriorityToken(null),
-      );
-      expect(state.authenticatedPriorityToken).toBeNull();
-    });
-
-    it('updates existing authenticatedPriorityToken', () => {
-      const newToken: CardTokenAllowance = {
-        ...MOCK_PRIORITY_TOKEN,
-        symbol: 'DAI',
-      };
-      const currentState: CardSliceState = {
-        ...initialState,
-        authenticatedPriorityToken: MOCK_PRIORITY_TOKEN,
-      };
-      const state = cardReducer(
-        currentState,
-        setAuthenticatedPriorityToken(newToken),
-      );
-      expect(state.authenticatedPriorityToken).toEqual(newToken);
-    });
-
-    it('does not affect other state properties', () => {
-      const state = cardReducer(
-        initialState,
-        setAuthenticatedPriorityToken(MOCK_PRIORITY_TOKEN),
-      );
-      expect(state.priorityTokensByAddress).toEqual(
-        initialState.priorityTokensByAddress,
-      );
-      expect(state.authenticatedPriorityTokenLastFetched).toEqual(
-        initialState.authenticatedPriorityTokenLastFetched,
-      );
-    });
-  });
-
-  describe('setAuthenticatedPriorityTokenLastFetched', () => {
-    it('sets authenticatedPriorityTokenLastFetched to a date', () => {
-      const testDate = new Date('2025-08-21T10:00:00Z');
-      const state = cardReducer(
-        initialState,
-        setAuthenticatedPriorityTokenLastFetched(testDate),
-      );
-      expect(state.authenticatedPriorityTokenLastFetched).toEqual(testDate);
-    });
-
-    it('sets authenticatedPriorityTokenLastFetched to a string', () => {
-      const testDateString = '2025-08-21T10:00:00Z';
-      const state = cardReducer(
-        initialState,
-        setAuthenticatedPriorityTokenLastFetched(testDateString),
-      );
-      expect(state.authenticatedPriorityTokenLastFetched).toEqual(
-        testDateString,
-      );
-    });
-
-    it('sets authenticatedPriorityTokenLastFetched to null', () => {
-      const currentState: CardSliceState = {
-        ...initialState,
-        authenticatedPriorityTokenLastFetched: new Date(),
-      };
-      const state = cardReducer(
-        currentState,
-        setAuthenticatedPriorityTokenLastFetched(null),
-      );
-      expect(state.authenticatedPriorityTokenLastFetched).toBeNull();
-    });
-
-    it('updates existing authenticatedPriorityTokenLastFetched', () => {
-      const oldDate = new Date('2025-08-21T10:00:00Z');
-      const newDate = new Date('2025-08-21T11:00:00Z');
-      const currentState: CardSliceState = {
-        ...initialState,
-        authenticatedPriorityTokenLastFetched: oldDate,
-      };
-      const state = cardReducer(
-        currentState,
-        setAuthenticatedPriorityTokenLastFetched(newDate),
-      );
-      expect(state.authenticatedPriorityTokenLastFetched).toEqual(newDate);
-    });
-
-    it('does not affect other state properties', () => {
-      const testDate = new Date('2025-08-21T10:00:00Z');
-      const state = cardReducer(
-        initialState,
-        setAuthenticatedPriorityTokenLastFetched(testDate),
-      );
-      expect(state.lastFetchedByAddress).toEqual(
-        initialState.lastFetchedByAddress,
-      );
-      expect(state.authenticatedPriorityToken).toEqual(
-        initialState.authenticatedPriorityToken,
-      );
-    });
-  });
 });
 
 describe('verifyCardAuthentication Async Thunk', () => {
@@ -2278,8 +1373,6 @@ describe('verifyCardAuthentication Async Thunk', () => {
         ...initialState,
         isAuthenticated: true,
         userCardLocation: 'us',
-        authenticatedPriorityToken: MOCK_PRIORITY_TOKEN,
-        authenticatedPriorityTokenLastFetched: new Date('2025-08-21T10:00:00Z'),
       };
 
       const action = {
@@ -2292,8 +1385,6 @@ describe('verifyCardAuthentication Async Thunk', () => {
 
       expect(state.isAuthenticated).toBe(false);
       expect(state.userCardLocation).toBe('us');
-      expect(state.authenticatedPriorityToken).toBeNull();
-      expect(state.authenticatedPriorityTokenLastFetched).toBeNull();
     });
 
     it('handles rejection from initial state', () => {
@@ -2307,8 +1398,6 @@ describe('verifyCardAuthentication Async Thunk', () => {
 
       expect(state.isAuthenticated).toBe(false);
       expect(state.userCardLocation).toBe('international');
-      expect(state.authenticatedPriorityToken).toBeNull();
-      expect(state.authenticatedPriorityTokenLastFetched).toBeNull();
     });
 
     it('does not affect other state properties', () => {
@@ -2334,220 +1423,3 @@ describe('verifyCardAuthentication Async Thunk', () => {
     });
   });
 });
-
-describe('Authenticated Priority Token Selectors', () => {
-  describe('selectCardPriorityToken with authenticated=true', () => {
-    it('returns authenticatedPriorityToken when authenticated', () => {
-      const mockRootState = {
-        card: CARD_STATE_MOCK,
-      } as unknown as RootState;
-
-      const selector = selectCardPriorityToken(true);
-      expect(selector(mockRootState)).toEqual(MOCK_PRIORITY_TOKEN);
-    });
-
-    it('returns null when no authenticatedPriorityToken exists', () => {
-      const mockRootState = {
-        card: EMPTY_CARD_STATE_MOCK,
-      } as unknown as RootState;
-
-      const selector = selectCardPriorityToken(true);
-      expect(selector(mockRootState)).toBeNull();
-    });
-
-    it('ignores address parameter when authenticated', () => {
-      const mockRootState = {
-        card: CARD_STATE_MOCK,
-      } as unknown as RootState;
-
-      const selector = selectCardPriorityToken(true, '0xDifferentAddress');
-      expect(selector(mockRootState)).toEqual(MOCK_PRIORITY_TOKEN);
-    });
-
-    it('returns authenticatedPriorityToken even when address has different token', () => {
-      const differentToken: CardTokenAllowance = {
-        ...MOCK_PRIORITY_TOKEN,
-        symbol: 'DAI',
-      };
-
-      const stateWithDifferentTokens: CardSliceState = {
-        ...CARD_STATE_MOCK,
-        authenticatedPriorityToken: differentToken,
-      };
-
-      const mockRootState = {
-        card: stateWithDifferentTokens,
-      } as unknown as RootState;
-
-      const selector = selectCardPriorityToken(true, testAddress);
-      expect(selector(mockRootState)).toEqual(differentToken);
-      expect(selector(mockRootState)).not.toEqual(MOCK_PRIORITY_TOKEN);
-    });
-  });
-
-  describe('selectCardPriorityTokenLastFetched with authenticated=true', () => {
-    it('returns authenticatedPriorityTokenLastFetched when authenticated', () => {
-      const mockRootState = {
-        card: CARD_STATE_MOCK,
-      } as unknown as RootState;
-
-      const selector = selectCardPriorityTokenLastFetched(true);
-      expect(selector(mockRootState)).toEqual(new Date('2025-08-21T10:00:00Z'));
-    });
-
-    it('returns null when no authenticatedPriorityTokenLastFetched exists', () => {
-      const mockRootState = {
-        card: EMPTY_CARD_STATE_MOCK,
-      } as unknown as RootState;
-
-      const selector = selectCardPriorityTokenLastFetched(true);
-      expect(selector(mockRootState)).toBeNull();
-    });
-
-    it('ignores address parameter when authenticated', () => {
-      const mockRootState = {
-        card: CARD_STATE_MOCK,
-      } as unknown as RootState;
-
-      const selector = selectCardPriorityTokenLastFetched(
-        true,
-        '0xDifferentAddress',
-      );
-      expect(selector(mockRootState)).toEqual(new Date('2025-08-21T10:00:00Z'));
-    });
-
-    it('handles ISO date strings from redux-persist', () => {
-      const stateWithStringDate: CardSliceState = {
-        ...CARD_STATE_MOCK,
-        authenticatedPriorityTokenLastFetched: '2025-08-21T10:00:00Z',
-      };
-
-      const mockRootState = {
-        card: stateWithStringDate,
-      } as unknown as RootState;
-
-      const selector = selectCardPriorityTokenLastFetched(true);
-      expect(selector(mockRootState)).toEqual('2025-08-21T10:00:00Z');
-    });
-  });
-
-  describe('selectIsCardCacheValid with authenticated=true (30 second window)', () => {
-    let dateNowSpy: jest.SpyInstance;
-
-    beforeEach(() => {
-      dateNowSpy = jest.spyOn(Date, 'now');
-    });
-
-    afterEach(() => {
-      dateNowSpy.mockRestore();
-    });
-
-    it('returns true when cache is within 30-second window for authenticated', () => {
-      // Mock Date.now to return 20 seconds after fetch time
-      dateNowSpy.mockReturnValue(new Date('2025-08-21T10:00:20Z').getTime());
-
-      const mockRootState = {
-        card: CARD_STATE_MOCK,
-      } as unknown as RootState;
-
-      const selector = selectIsCardCacheValid(true);
-      expect(selector(mockRootState)).toBe(true);
-    });
-
-    it('returns false when cache is older than 30 seconds for authenticated', () => {
-      // Mock Date.now to return 31 seconds after fetch time
-      dateNowSpy.mockReturnValue(new Date('2025-08-21T10:00:31Z').getTime());
-
-      const mockRootState = {
-        card: CARD_STATE_MOCK,
-      } as unknown as RootState;
-
-      const selector = selectIsCardCacheValid(true);
-      expect(selector(mockRootState)).toBe(false);
-    });
-
-    it('returns false for cache exactly 30 seconds old', () => {
-      // Mock Date.now to return exactly 30 seconds after fetch time
-      dateNowSpy.mockReturnValue(new Date('2025-08-21T10:00:30Z').getTime());
-
-      const mockRootState = {
-        card: CARD_STATE_MOCK,
-      } as unknown as RootState;
-
-      const selector = selectIsCardCacheValid(true);
-      expect(selector(mockRootState)).toBe(false);
-    });
-
-    it('returns true for cache 29 seconds old', () => {
-      // Mock Date.now to return 29 seconds after fetch time
-      dateNowSpy.mockReturnValue(new Date('2025-08-21T10:00:29Z').getTime());
-
-      const mockRootState = {
-        card: CARD_STATE_MOCK,
-      } as unknown as RootState;
-
-      const selector = selectIsCardCacheValid(true);
-      expect(selector(mockRootState)).toBe(true);
-    });
-
-    it('returns false when no authenticatedPriorityTokenLastFetched exists', () => {
-      dateNowSpy.mockReturnValue(new Date('2025-08-21T10:00:20Z').getTime());
-
-      const mockRootState = {
-        card: EMPTY_CARD_STATE_MOCK,
-      } as unknown as RootState;
-
-      const selector = selectIsCardCacheValid(true);
-      expect(selector(mockRootState)).toBe(false);
-    });
-
-    it('handles ISO date strings from redux-persist for authenticated', () => {
-      // Mock Date.now to return 20 seconds after fetch time
-      dateNowSpy.mockReturnValue(new Date('2025-08-21T10:00:20Z').getTime());
-
-      const stateWithStringDate: CardSliceState = {
-        ...CARD_STATE_MOCK,
-        authenticatedPriorityTokenLastFetched: '2025-08-21T10:00:00Z',
-      };
-
-      const mockRootState = {
-        card: stateWithStringDate,
-      } as unknown as RootState;
-
-      const selector = selectIsCardCacheValid(true);
-      expect(selector(mockRootState)).toBe(true);
-    });
-
-    it('ignores address parameter when authenticated', () => {
-      dateNowSpy.mockReturnValue(new Date('2025-08-21T10:00:20Z').getTime());
-
-      const mockRootState = {
-        card: CARD_STATE_MOCK,
-      } as unknown as RootState;
-
-      // Even though address has different lastFetched, should use authenticated
-      const selector = selectIsCardCacheValid(true, '0xDifferentAddress');
-      expect(selector(mockRootState)).toBe(true);
-    });
-
-    it('uses 30-second window for authenticated vs 5-minute for unauthenticated', () => {
-      // Mock Date.now to return 2 minutes after fetch time
-      dateNowSpy.mockReturnValue(new Date('2025-08-21T10:02:00Z').getTime());
-
-      const mockRootState = {
-        card: CARD_STATE_MOCK,
-      } as unknown as RootState;
-
-      // Authenticated: should be false (> 30 seconds)
-      const authenticatedSelector = selectIsCardCacheValid(true);
-      expect(authenticatedSelector(mockRootState)).toBe(false);
-
-      // Unauthenticated: should be true (< 5 minutes)
-      const unauthenticatedSelector = selectIsCardCacheValid(
-        false,
-        testAddress,
-      );
-      expect(unauthenticatedSelector(mockRootState)).toBe(true);
-    });
-  });
-});
diff --git a/app/core/redux/slices/card/index.ts b/app/core/redux/slices/card/index.ts
index 171fc289be2d..151d92084256 100644
--- a/app/core/redux/slices/card/index.ts
+++ b/app/core/redux/slices/card/index.ts
@@ -5,10 +5,7 @@ import { getCardholder } from '../../../../components/UI/Card/util/getCardholder
 import Logger from '../../../../util/Logger';
 import { selectSelectedInternalAccountByScope } from '../../../../selectors/multichainAccounts/accounts';
 import { isEthAccount } from '../../../Multichain/utils';
-import {
-  CardLocation,
-  CardTokenAllowance,
-} from '../../../../components/UI/Card/types';
+import { CardLocation } from '../../../../components/UI/Card/types';
 import {
   selectCardExperimentalSwitch,
   selectCardSupportedCountries,
@@ -24,17 +21,8 @@ export interface OnboardingState {
   consentSetId: string | null;
 }
 
-export interface CacheState {
-  data: Record<string, unknown>;
-  timestamps: Record<string, number>;
-}
-
 export interface CardSliceState {
   cardholderAccounts: string[];
-  priorityTokensByAddress: Record<string, CardTokenAllowance | null>;
-  lastFetchedByAddress: Record<string, Date | string | null>;
-  authenticatedPriorityToken: CardTokenAllowance | null;
-  authenticatedPriorityTokenLastFetched: Date | string | null;
   hasViewedCardButton: boolean;
   isLoaded: boolean;
   alwaysShowCardButton: boolean;
@@ -42,16 +30,11 @@ export interface CardSliceState {
   isAuthenticated: boolean;
   userCardLocation: CardLocation;
   onboarding: OnboardingState;
-  cache: CacheState;
   isDaimoDemo: boolean;
 }
 
 export const initialState: CardSliceState = {
   cardholderAccounts: [],
-  priorityTokensByAddress: {},
-  lastFetchedByAddress: {},
-  authenticatedPriorityToken: null,
-  authenticatedPriorityTokenLastFetched: null,
   hasViewedCardButton: false,
   isLoaded: false,
   alwaysShowCardButton: false,
@@ -64,10 +47,6 @@ export const initialState: CardSliceState = {
     contactVerificationId: null,
     consentSetId: null,
   },
-  cache: {
-    data: {},
-    timestamps: {},
-  },
   isDaimoDemo: false,
 };
 
@@ -90,41 +69,9 @@ const slice = createSlice({
   initialState,
   reducers: {
     resetCardState: () => initialState,
-    setAuthenticatedPriorityToken: (
-      state,
-      action: PayloadAction<CardTokenAllowance | null>,
-    ) => {
-      state.authenticatedPriorityToken = action.payload;
-    },
     setHasViewedCardButton: (state, action: PayloadAction<boolean>) => {
       state.hasViewedCardButton = action.payload;
     },
-    setCardPriorityToken: (
-      state,
-      action: PayloadAction<{
-        address: string;
-        token: CardTokenAllowance | null;
-      }>,
-    ) => {
-      state.priorityTokensByAddress[action.payload.address.toLowerCase()] =
-        action.payload.token;
-    },
-    setCardPriorityTokenLastFetched: (
-      state,
-      action: PayloadAction<{
-        address: string;
-        lastFetched: Date | string | null;
-      }>,
-    ) => {
-      state.lastFetchedByAddress[action.payload.address.toLowerCase()] =
-        action.payload.lastFetched;
-    },
-    setAuthenticatedPriorityTokenLastFetched: (
-      state,
-      action: PayloadAction<Date | string | null>,
-    ) => {
-      state.authenticatedPriorityTokenLastFetched = action.payload;
-    },
     setAlwaysShowCardButton: (state, action: PayloadAction<boolean>) => {
       state.alwaysShowCardButton = action.payload;
     },
@@ -161,27 +108,8 @@ const slice = createSlice({
       };
     },
     resetAuthenticatedData: (state) => {
-      state.authenticatedPriorityToken = null;
-      state.authenticatedPriorityTokenLastFetched = null;
       state.isAuthenticated = false;
     },
-    setCacheData: (
-      state,
-      action: PayloadAction<{ key: string; data: unknown; timestamp: number }>,
-    ) => {
-      const { key, data, timestamp } = action.payload;
-      state.cache.data[key] = data;
-      state.cache.timestamps[key] = timestamp;
-    },
-    clearCacheData: (state, action: PayloadAction<string>) => {
-      const key = action.payload;
-      delete state.cache.data[key];
-      delete state.cache.timestamps[key];
-    },
-    clearAllCache: (state) => {
-      state.cache.data = {};
-      state.cache.timestamps = {};
-    },
   },
   extraReducers: (builder) => {
     builder
@@ -209,8 +137,6 @@ const slice = createSlice({
           action?.error?.message,
         );
         state.isAuthenticated = false;
-        state.authenticatedPriorityToken = null;
-        state.authenticatedPriorityTokenLastFetched = null;
       });
   },
 });
@@ -231,51 +157,6 @@ export const selectCardholderAccounts = createSelector(
 const selectedAccount = (rootState: RootState) =>
   selectSelectedInternalAccountByScope(rootState)('eip155:0');
 
-export const selectCardPriorityToken = (
-  authenticated: boolean,
-  address?: string,
-) =>
-  createSelector(selectCardState, (card) =>
-    authenticated
-      ? card.authenticatedPriorityToken
-      : address
-        ? card.priorityTokensByAddress[address.toLowerCase()] || null
-        : null,
-  );
-
-export const selectCardPriorityTokenLastFetched = (
-  authenticated: boolean,
-  address?: string,
-) =>
-  createSelector(selectCardState, (card) =>
-    authenticated
-      ? card.authenticatedPriorityTokenLastFetched
-      : address
-        ? card.lastFetchedByAddress[address.toLowerCase()] || null
-        : null,
-  );
-
-export const selectIsCardCacheValid = (
-  authenticated: boolean,
-  address?: string,
-) =>
-  createSelector(
-    selectCardPriorityTokenLastFetched(authenticated, address),
-    (lastFetched) => {
-      if (!lastFetched) return false;
-      const thirtySecondsAgo = new Date(Date.now() - 30 * 1000);
-      const fiveMinutesAgo = new Date(Date.now() - 5 * 60 * 1000);
-      const lastFetchedDate =
-        lastFetched instanceof Date ? lastFetched : new Date(lastFetched);
-
-      if (authenticated) {
-        return lastFetchedDate > thirtySecondsAgo;
-      }
-
-      return lastFetchedDate > fiveMinutesAgo;
-    },
-  );
-
 export const selectAlwaysShowCardButton = createSelector(
   selectCardState,
   selectCardExperimentalSwitch,
@@ -392,19 +273,12 @@ export const {
   setAlwaysShowCardButton,
   setHasViewedCardButton,
   setIsAuthenticatedCard,
-  setCardPriorityToken,
-  setCardPriorityTokenLastFetched,
-  setAuthenticatedPriorityToken,
-  setAuthenticatedPriorityTokenLastFetched,
   setUserCardLocation,
   setOnboardingId,
   setSelectedCountry,
   setContactVerificationId,
   setConsentSetId,
   resetOnboardingState,
-  setCacheData,
-  clearCacheData,
-  clearAllCache,
   resetAuthenticatedData,
   setIsDaimoDemo,
 } = actions;
diff --git a/app/features/SampleFeature/README.md b/app/features/SampleFeature/README.md
index 0d63d1210fdd..e7c5fecf3c02 100644
--- a/app/features/SampleFeature/README.md
+++ b/app/features/SampleFeature/README.md
@@ -41,7 +41,7 @@ This feature demonstrates:
 - Form validation and error handling
 - Navigation patterns within the app
 - UI component library usage and styling
-- MetaMetrics tracking implementation
+- Analytics tracking implementation
 - Performance tracing patterns and monitoring
 - Comprehensive unit testing
 - End-to-end testing
@@ -66,7 +66,7 @@ The SampleFeature's structure mirrors the main `/app` directory. This helps devs
 
 ```
 app/features/SampleFeature/
-├── analytics/              # MetaMetrics event definitions
+├── analytics/              # Analytics event definitions
 │   └── events.ts
 ├── components/             # React components
 │   ├── hooks/             # Custom React hooks
@@ -109,7 +109,7 @@ A simple counter implementation demonstrating:
 - Redux Toolkit state management
 - Custom hooks (`useSampleCounter`)
 - Action dispatching
-- MetaMetrics event tracking
+- Analytics event tracking
 
 **Key Files:**
 
@@ -208,14 +208,13 @@ The feature extensively uses the MetaMask component library:
 - Follows MetaMask design system
 - Responsive layout with KeyboardAwareScrollView
 
-## MetaMetrics Tracking
+## Analytics Tracking
 
 Events are defined in `analytics/events.ts` following the event builder pattern:
 
 - Centralized event definitions in a dedicated analytics module
 - Event builder helper functions for consistent event creation
-- Type-safe event generation using the `generateOpt` utility
-- Integration with the global MetaMetrics system
+- Integration with the `useAnalytics` hook and `AnalyticsEventBuilder`
 - Separation of event definition from event dispatching
 
 ### Privacy Considerations
@@ -424,7 +423,7 @@ The SampleFeature demonstrates comprehensive testing patterns and best practices
 - Module mocking for native dependencies
 - Redux store mocking with `configureStore`
 - Navigation mocking for testing navigation flows
-- MetaMetrics tracking mock verification
+- Analytics tracking mock verification
 - Controller mocking for isolated component tests
 
 **Best Practices Demonstrated:**
diff --git a/app/features/SampleFeature/analytics/events.ts b/app/features/SampleFeature/analytics/events.ts
index 2a231915f0b1..33f91fa946a0 100644
--- a/app/features/SampleFeature/analytics/events.ts
+++ b/app/features/SampleFeature/analytics/events.ts
@@ -1,6 +1,6 @@
 import {
   generateOpt,
-  EVENT_NAME as METRICS_EVENT_NAME,
+  EVENT_NAME as ANALYTICS_EVENT_NAME,
 } from '../../../core/Analytics/MetaMetrics.events';
 
 // Feature-specific event names (match EVENT_NAME style: SCREAMING_SNAKE_CASE keys, Initial Case string values with spaces)
@@ -13,7 +13,7 @@ export enum EVENT_NAME {
 
 // Helper to create events (type-casting to global event name type if needed)
 const createEvent = (name: EVENT_NAME) =>
-  generateOpt(name as unknown as METRICS_EVENT_NAME);
+  generateOpt(name as unknown as ANALYTICS_EVENT_NAME);
 
 // Export your events for use in the feature
 export const SAMPLE_FEATURE_EVENTS = {
diff --git a/app/features/SampleFeature/components/views/SampleCounterPane/SampleCounterPane.test.tsx b/app/features/SampleFeature/components/views/SampleCounterPane/SampleCounterPane.test.tsx
index a9add888356e..ab30a91ae561 100644
--- a/app/features/SampleFeature/components/views/SampleCounterPane/SampleCounterPane.test.tsx
+++ b/app/features/SampleFeature/components/views/SampleCounterPane/SampleCounterPane.test.tsx
@@ -3,28 +3,15 @@ import { fireEvent, waitFor } from '@testing-library/react-native';
 import renderWithProvider from '../../../../../util/test/renderWithProvider';
 import { SampleCounterPane } from './SampleCounterPane';
 import { strings } from '../../../../../../locales/i18n';
-import useMetrics from '../../../../../components/hooks/useMetrics/useMetrics';
 import { SAMPLE_FEATURE_EVENTS } from '../../../analytics/events';
-import { MetricsEventBuilder } from '../../../../../core/Analytics/MetricsEventBuilder.ts';
+import { useAnalytics } from '../../../../../components/hooks/useAnalytics/useAnalytics';
 
-/**
- * Mock implementation for react-native Linking module
- * Required for testing components that use deep linking functionality
- */
 jest.mock('react-native/Libraries/Linking/Linking', () => ({
   addEventListener: jest.fn(() => ({ remove: jest.fn() })),
 }));
 
-/**
- * Mock implementation of the increment function
- * Used to verify counter increment functionality
- */
 const mockIncrement = jest.fn();
 
-/**
- * Mock implementation of the useSampleCounter hook
- * Provides a controlled test environment for the counter functionality
- */
 jest.mock('../../hooks/useSampleCounter/useSampleCounter', () => ({
   __esModule: true,
   useSampleCounter: () => ({
@@ -33,32 +20,11 @@ jest.mock('../../hooks/useSampleCounter/useSampleCounter', () => ({
   }),
 }));
 
-jest.mock('../../../../../components/hooks/useMetrics/useMetrics');
+const mockAnalytics = jest.mocked(useAnalytics)();
 
-const mockTrackEvent = jest.fn();
-
-/**
- * Test suite for SampleCounterPane component
- *
- * @group Components
- * @group SampleCounterPane
- */
 describe('SampleCounterPane', () => {
   beforeEach(() => {
     jest.clearAllMocks();
-    (useMetrics as jest.MockedFn<typeof useMetrics>).mockReturnValue({
-      trackEvent: mockTrackEvent,
-      createEventBuilder: MetricsEventBuilder.createEventBuilder,
-      enable: jest.fn(),
-      addTraitsToUser: jest.fn(),
-      createDataDeletionTask: jest.fn(),
-      checkDataDeleteStatus: jest.fn(),
-      getDeleteRegulationCreationDate: jest.fn(),
-      getDeleteRegulationId: jest.fn(),
-      isDataRecorded: jest.fn(),
-      isEnabled: jest.fn(),
-      getMetaMetricsId: jest.fn(),
-    });
   });
 
   /**
@@ -107,10 +73,9 @@ describe('SampleCounterPane', () => {
     fireEvent.press(getByTestId('sample-counter-pane-increment-button'));
 
     await waitFor(() => {
-      expect(mockTrackEvent).toHaveBeenCalledWith(
-        expect.objectContaining({
-          name: SAMPLE_FEATURE_EVENTS.COUNTER_INCREMENTED.category,
-        }),
+      expect(mockAnalytics.trackEvent).toHaveBeenCalled();
+      expect(mockAnalytics.createEventBuilder).toHaveBeenCalledWith(
+        SAMPLE_FEATURE_EVENTS.COUNTER_INCREMENTED,
       );
     });
   });
diff --git a/app/features/SampleFeature/components/views/SampleCounterPane/SampleCounterPane.tsx b/app/features/SampleFeature/components/views/SampleCounterPane/SampleCounterPane.tsx
index 0e013abb0c69..68cdb86da9f9 100644
--- a/app/features/SampleFeature/components/views/SampleCounterPane/SampleCounterPane.tsx
+++ b/app/features/SampleFeature/components/views/SampleCounterPane/SampleCounterPane.tsx
@@ -10,8 +10,7 @@ import { useSampleCounter } from '../../hooks/useSampleCounter/useSampleCounter'
 import { strings } from '../../../../../../locales/i18n';
 import Card from '../../../../../component-library/components/Cards/Card';
 import { useStyles } from '../../../../../component-library/hooks';
-import useMetrics from '../../../../../components/hooks/useMetrics/useMetrics';
-import { MetricsEventBuilder } from '../../../../../core/Analytics/MetricsEventBuilder';
+import { useAnalytics } from '../../../../../components/hooks/useAnalytics/useAnalytics';
 import { SAMPLE_FEATURE_EVENTS } from '../../../analytics/events';
 
 /**
@@ -43,13 +42,11 @@ import { SAMPLE_FEATURE_EVENTS } from '../../../analytics/events';
 export function SampleCounterPane() {
   const { styles } = useStyles(styleSheet, {});
   const counter = useSampleCounter();
-  const { trackEvent } = useMetrics();
+  const { trackEvent, createEventBuilder } = useAnalytics();
 
   const incrementCount = () => {
     trackEvent(
-      MetricsEventBuilder.createEventBuilder(
-        SAMPLE_FEATURE_EVENTS.COUNTER_INCREMENTED,
-      ).build(),
+      createEventBuilder(SAMPLE_FEATURE_EVENTS.COUNTER_INCREMENTED).build(),
     );
     counter.incrementCount();
   };
diff --git a/app/features/SampleFeature/components/views/SampleCounterPane/__snapshots__/SampleCounterPane.test.tsx.snap b/app/features/SampleFeature/components/views/SampleCounterPane/__snapshots__/SampleCounterPane.test.tsx.snap
index 08efb160d1fd..5ef83edda397 100644
--- a/app/features/SampleFeature/components/views/SampleCounterPane/__snapshots__/SampleCounterPane.test.tsx.snap
+++ b/app/features/SampleFeature/components/views/SampleCounterPane/__snapshots__/SampleCounterPane.test.tsx.snap
@@ -5,7 +5,7 @@ exports[`SampleCounterPane matches rendered snapshot 1`] = `
   style={
     {
       "backgroundColor": "#ffffff",
-      "borderColor": "#b7bbc8",
+      "borderColor": "#949596",
       "borderRadius": 4,
       "borderWidth": 1,
       "padding": 16,
@@ -17,7 +17,7 @@ exports[`SampleCounterPane matches rendered snapshot 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Bold",
         "fontSize": 16,
         "letterSpacing": 0,
@@ -32,7 +32,7 @@ exports[`SampleCounterPane matches rendered snapshot 1`] = `
     accessibilityRole="text"
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
         "fontFamily": "Geist-Regular",
         "fontSize": 16,
         "letterSpacing": 0,
@@ -54,7 +54,7 @@ exports[`SampleCounterPane matches rendered snapshot 1`] = `
       {
         "alignItems": "center",
         "alignSelf": "flex-start",
-        "backgroundColor": "#121314",
+        "backgroundColor": "#131416",
         "borderRadius": 12,
         "flexDirection": "row",
         "height": 40,
diff --git a/app/features/SampleFeature/components/views/SampleFeatureDevSettingsEntryPoint/SampleFeatureDevSettingsEntryPoint.tsx b/app/features/SampleFeature/components/views/SampleFeatureDevSettingsEntryPoint/SampleFeatureDevSettingsEntryPoint.tsx
index 19498826c84f..57c83ceb87ec 100644
--- a/app/features/SampleFeature/components/views/SampleFeatureDevSettingsEntryPoint/SampleFeatureDevSettingsEntryPoint.tsx
+++ b/app/features/SampleFeature/components/views/SampleFeatureDevSettingsEntryPoint/SampleFeatureDevSettingsEntryPoint.tsx
@@ -14,12 +14,12 @@ import Button, {
 import { MetaMetricsEvents } from '../../../../../core/Analytics';
 import { useNavigation } from '@react-navigation/native';
 import styleSheet from './SampleFeatureDevSettingsEntryPoint.styles';
-import { useMetrics } from '../../../../../components/hooks/useMetrics';
+import { useAnalytics } from '../../../../../components/hooks/useAnalytics/useAnalytics';
 
 function NavigateToSampleFeature() {
   const theme = useTheme();
   const { styles } = useStyles(styleSheet, { theme });
-  const { trackEvent, createEventBuilder } = useMetrics();
+  const { trackEvent, createEventBuilder } = useAnalytics();
   const navigation = useNavigation();
 
   const onPressNavigate = () => {
diff --git a/app/features/SampleFeature/components/views/SampleNetworkDisplay/__snapshots__/SampleNetworkDisplay.test.tsx.snap b/app/features/SampleFeature/components/views/SampleNetworkDisplay/__snapshots__/SampleNetworkDisplay.test.tsx.snap
index 052c34339a52..bc337b3c695f 100644
--- a/app/features/SampleFeature/components/views/SampleNetworkDisplay/__snapshots__/SampleNetworkDisplay.test.tsx.snap
+++ b/app/features/SampleFeature/components/views/SampleNetworkDisplay/__snapshots__/SampleNetworkDisplay.test.tsx.snap
@@ -42,7 +42,7 @@ exports[`SampleNetworkDisplay matches rendered snapshot 1`] = `
   <Text
     style={
       {
-        "color": "#121314",
+        "color": "#131416",
       }
     }
   >
diff --git a/app/features/SampleFeature/components/views/SamplePetNames/SamplePetNamesForm.test.tsx b/app/features/SampleFeature/components/views/SamplePetNames/SamplePetNamesForm.test.tsx
index 1bf8322d2a26..dce86d95b72c 100644
--- a/app/features/SampleFeature/components/views/SamplePetNames/SamplePetNamesForm.test.tsx
+++ b/app/features/SampleFeature/components/views/SamplePetNames/SamplePetNamesForm.test.tsx
@@ -10,9 +10,8 @@ jest.mock('react-native/Libraries/Linking/Linking', () => ({
 
 import { SamplePetNamesForm } from './SamplePetNamesForm';
 import Engine from '../../../../../core/Engine';
-import useMetrics from '../../../../../components/hooks/useMetrics/useMetrics';
 import { SAMPLE_FEATURE_EVENTS } from '../../../analytics/events';
-import { MetricsEventBuilder } from '../../../../../core/Analytics/MetricsEventBuilder.ts';
+import { useAnalytics } from '../../../../../components/hooks/useAnalytics/useAnalytics';
 
 jest.mock('../../../../../core/Engine', () => ({
   context: {
@@ -22,44 +21,25 @@ jest.mock('../../../../../core/Engine', () => ({
   },
 }));
 
-// Mock the useSamplePetNames hook
 jest.mock('../../hooks/useSamplePetNames', () => ({
   useSamplePetNames: jest.fn(),
 }));
 
-jest.mock('../../../../../components/hooks/useMetrics/useMetrics');
-
 import { useSamplePetNames } from '../../hooks/useSamplePetNames';
 
+const mockAnalytics = jest.mocked(useAnalytics)();
+
 const mockUseSamplePetNames = useSamplePetNames as jest.MockedFunction<
   typeof useSamplePetNames
 >;
 
-const mockTrackEvent = jest.fn();
-
 describe('SamplePetNamesForm', () => {
   let alertSpy: jest.SpyInstance;
 
   beforeEach(() => {
     jest.clearAllMocks();
-    // Default mock return value - no existing pet names
     mockUseSamplePetNames.mockReturnValue({ petNames: [] });
-    // Create spy on Alert.alert
     alertSpy = jest.spyOn(Alert, 'alert').mockImplementation(jest.fn());
-
-    (useMetrics as jest.MockedFn<typeof useMetrics>).mockReturnValue({
-      trackEvent: mockTrackEvent,
-      createEventBuilder: MetricsEventBuilder.createEventBuilder,
-      enable: jest.fn(),
-      addTraitsToUser: jest.fn(),
-      createDataDeletionTask: jest.fn(),
-      checkDataDeleteStatus: jest.fn(),
-      getDeleteRegulationCreationDate: jest.fn(),
-      getDeleteRegulationId: jest.fn(),
-      isDataRecorded: jest.fn(),
-      isEnabled: jest.fn(),
-      getMetaMetricsId: jest.fn(),
-    });
   });
 
   afterEach(() => {
@@ -130,15 +110,16 @@ describe('SamplePetNamesForm', () => {
 
     // Assert
     await waitFor(() => {
-      expect(mockTrackEvent).toHaveBeenCalledWith(
-        expect.objectContaining({
-          name: SAMPLE_FEATURE_EVENTS.PETNAME_ADDED.category,
-          properties: {
-            totalPetNames: 0,
-            chainId: '0x1',
-          },
-        }),
+      expect(mockAnalytics.trackEvent).toHaveBeenCalled();
+      expect(mockAnalytics.createEventBuilder).toHaveBeenCalledWith(
+        SAMPLE_FEATURE_EVENTS.PETNAME_ADDED,
       );
+      const builder = jest.mocked(mockAnalytics.createEventBuilder).mock
+        .results[0].value;
+      expect(builder.addProperties).toHaveBeenCalledWith({
+        totalPetNames: 0,
+        chainId: '0x1',
+      });
     });
   });
 
@@ -246,15 +227,16 @@ describe('SamplePetNamesForm', () => {
 
     // Assert
     await waitFor(() => {
-      expect(mockTrackEvent).toHaveBeenCalledWith(
-        expect.objectContaining({
-          name: SAMPLE_FEATURE_EVENTS.PETNAME_UPDATED.category,
-          properties: {
-            totalPetNames: 1,
-            chainId: '0x1',
-          },
-        }),
+      expect(mockAnalytics.trackEvent).toHaveBeenCalled();
+      expect(mockAnalytics.createEventBuilder).toHaveBeenCalledWith(
+        SAMPLE_FEATURE_EVENTS.PETNAME_UPDATED,
       );
+      const builder = jest.mocked(mockAnalytics.createEventBuilder).mock
+        .results[0].value;
+      expect(builder.addProperties).toHaveBeenCalledWith({
+        totalPetNames: 1,
+        chainId: '0x1',
+      });
     });
   });
 });
diff --git a/app/features/SampleFeature/components/views/SamplePetNames/SamplePetNamesForm.tsx b/app/features/SampleFeature/components/views/SamplePetNames/SamplePetNamesForm.tsx
index 05677b2eb8ea..2ba29a8a7152 100644
--- a/app/features/SampleFeature/components/views/SamplePetNames/SamplePetNamesForm.tsx
+++ b/app/features/SampleFeature/components/views/SamplePetNames/SamplePetNamesForm.tsx
@@ -10,8 +10,7 @@ import styleSheet from './SamplePetNamesForm.styles';
 import { strings } from '../../../../../../locales/i18n';
 import { SamplePetNamesFormContentProps } from './SamplePetNamesForm.types';
 import { useSamplePetNamesForm } from '../../hooks/useSamplePetNamesForm';
-import useMetrics from '../../../../../components/hooks/useMetrics/useMetrics';
-import { MetricsEventBuilder } from '../../../../../core/Analytics/MetricsEventBuilder';
+import { useAnalytics } from '../../../../../components/hooks/useAnalytics/useAnalytics';
 import { SAMPLE_FEATURE_EVENTS } from '../../../analytics/events';
 import trackErrorAsAnalytics from '../../../../../util/metrics/TrackError/trackErrorAsAnalytics';
 import { useSamplePetNames } from '../../hooks/useSamplePetNames';
@@ -57,7 +56,7 @@ export function SamplePetNamesForm({
 
   const { onSubmit, isValid, name, setName, setAddress, address } =
     useSamplePetNamesForm(chainId, initialAddress, initialName);
-  const { trackEvent } = useMetrics();
+  const { trackEvent, createEventBuilder } = useAnalytics();
   const { petNames } = useSamplePetNames(chainId);
 
   const submit = () => {
@@ -71,9 +70,7 @@ export function SamplePetNamesForm({
       if (isEditMode) {
         // User pressed existing pet name - direct update
         trackEvent(
-          MetricsEventBuilder.createEventBuilder(
-            SAMPLE_FEATURE_EVENTS.PETNAME_UPDATED,
-          )
+          createEventBuilder(SAMPLE_FEATURE_EVENTS.PETNAME_UPDATED)
             .addProperties({
               totalPetNames: petNames.length,
               chainId: chainId as string,
@@ -101,9 +98,7 @@ export function SamplePetNamesForm({
               text: strings('sample_feature.pet_name.update'),
               onPress: () => {
                 trackEvent(
-                  MetricsEventBuilder.createEventBuilder(
-                    SAMPLE_FEATURE_EVENTS.PETNAME_UPDATED,
-                  )
+                  createEventBuilder(SAMPLE_FEATURE_EVENTS.PETNAME_UPDATED)
                     .addProperties({
                       totalPetNames: petNames.length,
                       chainId: chainId as string,
@@ -119,9 +114,7 @@ export function SamplePetNamesForm({
     } else {
       // No duplicate - add new pet name
       trackEvent(
-        MetricsEventBuilder.createEventBuilder(
-          SAMPLE_FEATURE_EVENTS.PETNAME_ADDED,
-        )
+        createEventBuilder(SAMPLE_FEATURE_EVENTS.PETNAME_ADDED)
           .addProperties({
             totalPetNames: petNames.length,
             chainId: chainId as string,
diff --git a/app/features/SampleFeature/components/views/SamplePetNames/__snapshots__/SamplePetNames.test.tsx.snap b/app/features/SampleFeature/components/views/SamplePetNames/__snapshots__/SamplePetNames.test.tsx.snap
index 42272514132d..000a7791dfa2 100644
--- a/app/features/SampleFeature/components/views/SamplePetNames/__snapshots__/SamplePetNames.test.tsx.snap
+++ b/app/features/SampleFeature/components/views/SamplePetNames/__snapshots__/SamplePetNames.test.tsx.snap
@@ -29,7 +29,7 @@ exports[`SamplePetNames matches rendered snapshot 1`] = `
       style={
         {
           "backgroundColor": "#ffffff",
-          "borderColor": "#b7bbc8",
+          "borderColor": "#949596",
           "borderRadius": 4,
           "borderWidth": 1,
           "padding": 16,
@@ -41,7 +41,7 @@ exports[`SamplePetNames matches rendered snapshot 1`] = `
         accessibilityRole="text"
         style={
           {
-            "color": "#121314",
+            "color": "#131416",
             "fontFamily": "Geist-Bold",
             "fontSize": 16,
             "letterSpacing": 0,
diff --git a/app/features/SampleFeature/components/views/__snapshots__/SampleFeature.test.tsx.snap b/app/features/SampleFeature/components/views/__snapshots__/SampleFeature.test.tsx.snap
index 5fc3b6272e21..270a131167fd 100644
--- a/app/features/SampleFeature/components/views/__snapshots__/SampleFeature.test.tsx.snap
+++ b/app/features/SampleFeature/components/views/__snapshots__/SampleFeature.test.tsx.snap
@@ -56,7 +56,7 @@ exports[`SampleFeature Snapshot Tests matches rendered snapshot when feature fla
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Bold",
           "fontSize": 24,
           "letterSpacing": 0,
@@ -71,7 +71,7 @@ exports[`SampleFeature Snapshot Tests matches rendered snapshot when feature fla
       accessibilityRole="text"
       style={
         {
-          "color": "#686e7d",
+          "color": "#66676a",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
@@ -159,7 +159,7 @@ exports[`SampleFeature Snapshot Tests matches rendered snapshot when feature fla
       accessibilityRole="text"
       style={
         {
-          "color": "#121314",
+          "color": "#131416",
           "fontFamily": "Geist-Bold",
           "fontSize": 24,
           "letterSpacing": 0,
@@ -174,7 +174,7 @@ exports[`SampleFeature Snapshot Tests matches rendered snapshot when feature fla
       accessibilityRole="text"
       style={
         {
-          "color": "#686e7d",
+          "color": "#66676a",
           "fontFamily": "Geist-Regular",
           "fontSize": 16,
           "letterSpacing": 0,
diff --git a/app/features/SampleFeature/e2e/README.md b/app/features/SampleFeature/e2e/README.md
index 66272733255e..fdbe42f5ddfe 100644
--- a/app/features/SampleFeature/e2e/README.md
+++ b/app/features/SampleFeature/e2e/README.md
@@ -11,7 +11,7 @@ The Sample Feature is a development/testing feature that demonstrates:
 - Form validation and error handling
 - Navigation patterns within the app
 - UI component library usage and styling
-- Metametrics tracking
+- Analytics tracking
 - Unit testing
 - End-to-end testing
 
diff --git a/app/images/reveal_srp_intro.png b/app/images/reveal_srp_intro.png
new file mode 100644
index 000000000000..e39d754dbdd0
Binary files /dev/null and b/app/images/reveal_srp_intro.png differ
diff --git a/app/selectors/bridgeController/index.ts b/app/selectors/bridgeController/index.ts
index 5cb96fab78cd..1666dde1fb85 100644
--- a/app/selectors/bridgeController/index.ts
+++ b/app/selectors/bridgeController/index.ts
@@ -5,7 +5,7 @@ import {
   selectMinimumBalanceForRentExemptionInSOL,
 } from '@metamask/bridge-controller';
 import { selectRemoteFeatureFlags } from '../featureFlagController';
-import { MetaMetrics } from '../../core/Analytics';
+import { analytics } from '../../util/analytics/analytics';
 
 export const selectBridgeControllerState = (state: RootState) =>
   state.engine.backgroundState.BridgeController;
@@ -25,7 +25,7 @@ export const selectBridgeAppState = (state: RootState) => ({
   ...state.engine.backgroundState.MultichainAssetsRatesController,
   ...state.engine.backgroundState.TokenRatesController,
   ...state.engine.backgroundState.CurrencyRateController,
-  participateInMetaMetrics: MetaMetrics.getInstance().isEnabled(),
+  participateInMetaMetrics: analytics.isEnabled(),
   remoteFeatureFlags: {
     bridgeConfig: selectRemoteFeatureFlags(state).bridgeConfig,
   },
diff --git a/app/selectors/cardController.test.ts b/app/selectors/cardController.test.ts
new file mode 100644
index 000000000000..7966cf9edbcf
--- /dev/null
+++ b/app/selectors/cardController.test.ts
@@ -0,0 +1,107 @@
+import { RootState } from '../reducers';
+import {
+  selectCardSelectedCountry,
+  selectCardActiveProviderId,
+  selectIsCardAuthenticated,
+  selectCardholderAccounts,
+} from './cardController';
+import type { CardControllerState } from '../core/Engine/controllers/card-controller/types';
+
+const createMockRootState = (
+  overrides: Partial<CardControllerState> = {},
+): RootState =>
+  ({
+    engine: {
+      backgroundState: {
+        CardController: {
+          selectedCountry: null,
+          activeProviderId: null,
+          isAuthenticated: false,
+          cardholderAccounts: [],
+          providerData: {},
+          ...overrides,
+        },
+      },
+    },
+  }) as unknown as RootState;
+
+describe('CardController selectors', () => {
+  describe('selectCardSelectedCountry', () => {
+    it('returns null when no country is selected', () => {
+      const state = createMockRootState();
+
+      expect(selectCardSelectedCountry(state)).toBeNull();
+    });
+
+    it('returns the selected country', () => {
+      const state = createMockRootState({ selectedCountry: 'US' });
+
+      expect(selectCardSelectedCountry(state)).toBe('US');
+    });
+  });
+
+  describe('selectCardActiveProviderId', () => {
+    it('returns null when no provider is active', () => {
+      const state = createMockRootState();
+
+      expect(selectCardActiveProviderId(state)).toBeNull();
+    });
+
+    it('returns the active provider ID', () => {
+      const state = createMockRootState({ activeProviderId: 'baanx' });
+
+      expect(selectCardActiveProviderId(state)).toBe('baanx');
+    });
+  });
+
+  describe('selectIsCardAuthenticated', () => {
+    it('returns false by default', () => {
+      const state = createMockRootState();
+
+      expect(selectIsCardAuthenticated(state)).toBe(false);
+    });
+
+    it('returns true when authenticated', () => {
+      const state = createMockRootState({ isAuthenticated: true });
+
+      expect(selectIsCardAuthenticated(state)).toBe(true);
+    });
+  });
+
+  describe('selectCardholderAccounts', () => {
+    it('returns empty array by default', () => {
+      const state = createMockRootState();
+
+      expect(selectCardholderAccounts(state)).toStrictEqual([]);
+    });
+
+    it('returns cardholder accounts', () => {
+      const accounts = ['eip155:1:0xabc', 'eip155:1:0xdef'];
+      const state = createMockRootState({ cardholderAccounts: accounts });
+
+      expect(selectCardholderAccounts(state)).toStrictEqual(accounts);
+    });
+  });
+
+  describe('when CardController state is undefined', () => {
+    const state = {
+      engine: { backgroundState: {} },
+    } as unknown as RootState;
+
+    it('returns null for selectedCountry', () => {
+      expect(selectCardSelectedCountry(state)).toBeNull();
+    });
+
+    it('returns null for activeProviderId', () => {
+      expect(selectCardActiveProviderId(state)).toBeNull();
+    });
+
+    it('returns false for isAuthenticated', () => {
+      expect(selectIsCardAuthenticated(state)).toBe(false);
+    });
+
+    it('returns empty array for cardholderAccounts', () => {
+      expect(selectCardholderAccounts(state)).toStrictEqual([]);
+    });
+  });
+});
diff --git a/app/selectors/cardController.ts b/app/selectors/cardController.ts
new file mode 100644
index 000000000000..d51e45fa7e8b
--- /dev/null
+++ b/app/selectors/cardController.ts
@@ -0,0 +1,30 @@
+import { createSelector } from 'reselect';
+import { RootState } from '../reducers';
+import type { CardControllerState } from '../core/Engine/controllers/card-controller/types';
+
+const selectCardControllerState = (state: RootState) =>
+  state.engine?.backgroundState?.CardController;
+
+export const selectCardSelectedCountry = createSelector(
+  selectCardControllerState,
+  (cardState: CardControllerState | undefined) =>
+    cardState?.selectedCountry ?? null,
+);
+
+export const selectCardActiveProviderId = createSelector(
+  selectCardControllerState,
+  (cardState: CardControllerState | undefined) =>
+    cardState?.activeProviderId ?? null,
+);
+
+export const selectIsCardAuthenticated = createSelector(
+  selectCardControllerState,
+  (cardState: CardControllerState | undefined) =>
+    cardState?.isAuthenticated ?? false,
+);
+
+export const selectCardholderAccounts = createSelector(
+  selectCardControllerState,
+  (cardState: CardControllerState | undefined) =>
+    cardState?.cardholderAccounts ?? [],
+);
diff --git a/app/selectors/featureFlagController/confirmations/index.test.ts b/app/selectors/featureFlagController/confirmations/index.test.ts
index d1c2781dbcb4..a0e1ab382981 100644
--- a/app/selectors/featureFlagController/confirmations/index.test.ts
+++ b/app/selectors/featureFlagController/confirmations/index.test.ts
@@ -1,6 +1,7 @@
 import { cloneDeep } from 'lodash';
 import {
   selectMetaMaskPayFlags,
+  selectMetaMaskPayTokensFlags,
   BUFFER_STEP_DEFAULT,
   BUFFER_INITIAL_DEFAULT,
   ATTEMPTS_MAX_DEFAULT,
@@ -10,6 +11,8 @@ import {
   selectGasFeeTokenFlags,
   GasFeeTokenFlags,
   selectPayQuoteConfig,
+  PreferredToken,
+  getPreferredTokensForTransactionType,
 } from '.';
 import mockedEngine from '../../../core/__mocks__/MockedEngine';
 import { mockedEmptyFlagsState, mockedUndefinedFlagsState } from '../mocks';
@@ -336,3 +339,109 @@ describe('selectPayQuoteConfig', () => {
     expect(result).toEqual({ enabled: false, tokens: undefined });
   });
 });
+
+describe('selectMetaMaskPayTokensFlags (confirmations_pay_tokens)', () => {
+  const preferredTokensMock: PreferredToken[] = [
+    { address: '0xtoken1', chainId: '0x1', successRate: 0.95 },
+    { address: '0xtoken2', chainId: '0x89', successRate: 0.8 },
+  ];
+
+  it('returns empty preferred tokens when confirmations_pay_tokens is missing', () => {
+    const result = selectMetaMaskPayTokensFlags(mockedEmptyFlagsState);
+
+    expect(result.preferredTokens).toEqual({ default: [], overrides: {} });
+  });
+
+  it('returns default minimumRequiredTokenBalance of 0 when not in feature flags', () => {
+    const result = selectMetaMaskPayTokensFlags(mockedEmptyFlagsState);
+
+    expect(result.minimumRequiredTokenBalance).toBe(0);
+  });
+
+  it('returns preferredTokens with overrides from feature flag', () => {
+    const state = cloneDeep(mockedEmptyFlagsState);
+    state.engine.backgroundState.RemoteFeatureFlagController.remoteFeatureFlags =
+      {
+        confirmations_pay_tokens: {
+          preferredTokens: {
+            default: [],
+            overrides: {
+              perpsDeposit: preferredTokensMock,
+            },
+          },
+        },
+      };
+
+    const result = selectMetaMaskPayTokensFlags(state);
+    expect(result.preferredTokens.overrides.perpsDeposit).toEqual(
+      preferredTokensMock,
+    );
+    expect(result.preferredTokens.default).toEqual([]);
+  });
+
+  it('returns preferredTokens default from feature flag', () => {
+    const state = cloneDeep(mockedEmptyFlagsState);
+    state.engine.backgroundState.RemoteFeatureFlagController.remoteFeatureFlags =
+      {
+        confirmations_pay_tokens: {
+          preferredTokens: {
+            default: preferredTokensMock,
+            overrides: {},
+          },
+        },
+      };
+
+    const result = selectMetaMaskPayTokensFlags(state);
+    expect(result.preferredTokens.default).toEqual(preferredTokensMock);
+    expect(result.preferredTokens.overrides).toEqual({});
+  });
+
+  it('returns minimumRequiredTokenBalance from feature flag', () => {
+    const state = cloneDeep(mockedEmptyFlagsState);
+    state.engine.backgroundState.RemoteFeatureFlagController.remoteFeatureFlags =
+      {
+        confirmations_pay_tokens: {
+          minimumRequiredTokenBalance: 10,
+        },
+      };
+
+    const result = selectMetaMaskPayTokensFlags(state);
+    expect(result.minimumRequiredTokenBalance).toBe(10);
+  });
+});
+
+describe('getPreferredTokensForTransactionType', () => {
+  const defaultTokens: PreferredToken[] = [
+    { address: '0xdefault', chainId: '0x1', successRate: 90 },
+  ];
+
+  const perpsTokens: PreferredToken[] = [
+    { address: '0xperps1', chainId: '0x1', successRate: 95 },
+    { address: '0xperps2', chainId: '0xa4b1', successRate: 92 },
+  ];
+
+  const config = {
+    default: defaultTokens,
+    overrides: {
+      perpsDeposit: perpsTokens,
+    },
+  };
+
+  it('returns override tokens when transaction type has an override', () => {
+    expect(
+      getPreferredTokensForTransactionType(config, 'perpsDeposit'),
+    ).toEqual(perpsTokens);
+  });
+
+  it('returns default tokens when transaction type has no override', () => {
+    expect(
+      getPreferredTokensForTransactionType(config, 'predictDeposit'),
+    ).toEqual(defaultTokens);
+  });
+
+  it('returns default tokens when transaction type is undefined', () => {
+    expect(getPreferredTokensForTransactionType(config, undefined)).toEqual(
+      defaultTokens,
+    );
+  });
+});
diff --git a/app/selectors/featureFlagController/confirmations/index.ts b/app/selectors/featureFlagController/confirmations/index.ts
index 4145d5ca12fc..698716155b31 100644
--- a/app/selectors/featureFlagController/confirmations/index.ts
+++ b/app/selectors/featureFlagController/confirmations/index.ts
@@ -9,6 +9,17 @@ export const BUFFER_STEP_DEFAULT = 0.025;
 export const BUFFER_SUBSEQUENT_DEFAULT = 0.05;
 export const SLIPPAGE_DEFAULT = 0.005;
 
+export interface PreferredToken {
+  address: string;
+  chainId: string;
+  successRate: number;
+}
+
+export interface PreferredTokensConfig {
+  default: PreferredToken[];
+  overrides: Record<string, PreferredToken[]>;
+}
+
 export interface MetaMaskPayFlags {
   attemptsMax: number;
   bufferInitial: number;
@@ -17,6 +28,11 @@ export interface MetaMaskPayFlags {
   slippage: number;
 }
 
+export interface MetaMaskPayTokensFlags {
+  preferredTokens: PreferredTokensConfig;
+  minimumRequiredTokenBalance: number;
+}
+
 export interface PayPostQuoteConfig {
   enabled?: boolean;
   tokens?: Record<Hex, Hex[]>;
@@ -71,6 +87,29 @@ export const selectMetaMaskPayFlags = createSelector(
   },
 );
 
+export const selectMetaMaskPayTokensFlags = createSelector(
+  selectRemoteFeatureFlags,
+  (featureFlags): MetaMaskPayTokensFlags => {
+    const payTokenFlags = (featureFlags as Record<string, Json>)
+      ?.confirmations_pay_tokens as
+      | Record<string, Json | PreferredTokensConfig>
+      | undefined;
+
+    return {
+      preferredTokens: {
+        default:
+          ((payTokenFlags?.preferredTokens as PreferredTokensConfig)
+            ?.default as PreferredToken[]) ?? [],
+        overrides:
+          ((payTokenFlags?.preferredTokens as PreferredTokensConfig)
+            ?.overrides as Record<string, PreferredToken[]>) ?? {},
+      },
+      minimumRequiredTokenBalance:
+        (payTokenFlags?.minimumRequiredTokenBalance as number) ?? 0,
+    };
+  },
+);
+
 interface RawPayPostQuoteFlag {
   default?: PayPostQuoteConfig;
   overrides?: Record<string, PayPostQuoteConfig>;
@@ -120,6 +159,16 @@ export const selectPayQuoteConfig = createSelector(
   },
 );
 
+export function getPreferredTokensForTransactionType(
+  preferredTokens: PreferredTokensConfig,
+  transactionType?: string,
+): PreferredToken[] {
+  if (transactionType && preferredTokens.overrides[transactionType]) {
+    return preferredTokens.overrides[transactionType];
+  }
+  return preferredTokens.default;
+}
+
 /**
  * Selector to get the allow list for non-zero unused approvals from remote feature flags.
  *
diff --git a/app/selectors/featureFlagController/legalNotices/index.test.ts b/app/selectors/featureFlagController/legalNotices/index.test.ts
index 4a5652ec2c96..85d01d1f2b0b 100644
--- a/app/selectors/featureFlagController/legalNotices/index.test.ts
+++ b/app/selectors/featureFlagController/legalNotices/index.test.ts
@@ -48,47 +48,12 @@ function mockStateWithUndefinedController() {
 }
 
 describe('selectIsPna25FlagEnabled', () => {
-  const originalGithubActions = process.env.GITHUB_ACTIONS;
-  const originalE2E = process.env.E2E;
-
   afterEach(() => {
     jest.clearAllMocks();
-    if (originalGithubActions !== undefined) {
-      process.env.GITHUB_ACTIONS = originalGithubActions;
-    } else {
-      delete process.env.GITHUB_ACTIONS;
-    }
-    if (originalE2E !== undefined) {
-      process.env.E2E = originalE2E;
-    } else {
-      delete process.env.E2E;
-    }
-  });
-
-  describe('when GITHUB_ACTIONS uses only remote (no env)', () => {
-    beforeEach(() => {
-      process.env.GITHUB_ACTIONS = 'true';
-      delete process.env.E2E;
-    });
-
-    it('returns true when remote flag is true', () => {
-      const mockedState = mockStateWith(true);
-      const result = selectIsPna25FlagEnabled(mockedState);
-      expect(result).toBe(true);
-      expect(getFeatureFlagValue).not.toHaveBeenCalled();
-    });
-
-    it('returns false when remote flag is false', () => {
-      const mockedState = mockStateWith(false);
-      const result = selectIsPna25FlagEnabled(mockedState);
-      expect(result).toBe(false);
-      expect(getFeatureFlagValue).not.toHaveBeenCalled();
-    });
   });
 
   describe('without environment variable override', () => {
     beforeEach(() => {
-      process.env.GITHUB_ACTIONS = 'false';
       (getFeatureFlagValue as jest.Mock).mockImplementation(
         (_envValue: string | undefined, remoteValue: boolean) => remoteValue,
       );
@@ -129,7 +94,7 @@ describe('selectIsPna25FlagEnabled', () => {
 
   describe('with environment variable override to true', () => {
     beforeEach(() => {
-      process.env.GITHUB_ACTIONS = 'false';
+      // Mock behavior: always returns true (env override)
       (getFeatureFlagValue as jest.Mock).mockReturnValue(true);
     });
 
@@ -160,7 +125,7 @@ describe('selectIsPna25FlagEnabled', () => {
 
   describe('with environment variable override to false', () => {
     beforeEach(() => {
-      process.env.GITHUB_ACTIONS = 'false';
+      // Mock behavior: always returns false (env override)
       (getFeatureFlagValue as jest.Mock).mockReturnValue(false);
     });
 
diff --git a/app/selectors/featureFlagController/legalNotices/index.ts b/app/selectors/featureFlagController/legalNotices/index.ts
index 41af6a20722d..e2a41a29a4c8 100644
--- a/app/selectors/featureFlagController/legalNotices/index.ts
+++ b/app/selectors/featureFlagController/legalNotices/index.ts
@@ -3,9 +3,8 @@ import { selectRemoteFeatureFlags } from '..';
 import { getFeatureFlagValue } from '../env';
 
 /**
- * Selector for PNA25 feature flag.
- * When GITHUB_ACTIONS (and not E2E): use only remote (builds.yml). Otherwise
- * MM_EXTENSION_UX_PNA25 can override the remote flag.
+ * Selector for PNA25 feature flag
+ * Checks the environment variable `MM_EXTENSION_UX_PNA25` to override the remote flag
  *
  * @returns {boolean} True if PNA25 feature is enabled
  */
@@ -13,16 +12,10 @@ export const selectIsPna25FlagEnabled = createSelector(
   selectRemoteFeatureFlags,
   (remoteFeatureFlags): boolean => {
     const remoteValue = remoteFeatureFlags?.extensionUxPna25;
-    const useRemoteOnly =
-      process.env.GITHUB_ACTIONS === 'true' && process.env.E2E !== 'true';
-
-    if (useRemoteOnly) {
-      return remoteValue === true;
-    }
 
     return getFeatureFlagValue(
       process.env.MM_EXTENSION_UX_PNA25,
-      remoteValue === true,
+      Boolean(remoteValue),
     );
   },
 );
diff --git a/app/selectors/featureFlagController/networkBlacklist/index.test.ts b/app/selectors/featureFlagController/networkBlacklist/index.test.ts
index 2f49c86f77c9..42fe0c0ee791 100644
--- a/app/selectors/featureFlagController/networkBlacklist/index.test.ts
+++ b/app/selectors/featureFlagController/networkBlacklist/index.test.ts
@@ -20,13 +20,12 @@ describe('selectAdditionalNetworksBlacklistFeatureFlag', () => {
   });
 
   beforeEach(() => {
-    // Reset environment variables (ensure non-GH path for tests that use env)
+    // Reset environment variables
     process.env = { ...originalEnv };
-    delete process.env.GITHUB_ACTIONS;
-    delete process.env.E2E;
   });
 
   afterEach(() => {
+    // Restore original environment
     process.env = originalEnv;
   });
 
@@ -96,17 +95,4 @@ describe('selectAdditionalNetworksBlacklistFeatureFlag', () => {
     const result = selectAdditionalNetworksBlacklistFeatureFlag(state);
     expect(result).toEqual(['0x8f', 123, null, '0x531']);
   });
-
-  it('when GITHUB_ACTIONS uses only remote and ignores env override', () => {
-    process.env.GITHUB_ACTIONS = 'true';
-    delete process.env.E2E;
-    process.env.MM_ADDITIONAL_NETWORK_BLACKLIST = '0x1,0x2';
-
-    const state = createTestState({
-      additionalNetworksBlacklist: ['0x8f', '0x531'],
-    });
-
-    const result = selectAdditionalNetworksBlacklistFeatureFlag(state);
-    expect(result).toEqual(['0x8f', '0x531']);
-  });
 });
diff --git a/app/selectors/featureFlagController/networkBlacklist/index.ts b/app/selectors/featureFlagController/networkBlacklist/index.ts
index ab895a6cec37..5f626d9d0c5b 100644
--- a/app/selectors/featureFlagController/networkBlacklist/index.ts
+++ b/app/selectors/featureFlagController/networkBlacklist/index.ts
@@ -10,8 +10,8 @@ export interface AdditionalNetworksBlacklistFeatureFlag {
  * Allows to remove a network from the additional network selection.
  * Returns an array of chain IDs that should be hidden from the Additional Networks list.
  *
- * When GITHUB_ACTIONS (and not E2E): use only remote (builds.yml). Otherwise supports
- * local override via MM_ADDITIONAL_NETWORK_BLACKLIST (comma-separated chain IDs).
+ * Supports local environment variable override via MM_ADDITIONAL_NETWORK_BLACKLIST
+ * (comma-separated chain IDs, e.g., "0x8f,0x531")
  *
  * @param state - The Redux state
  * @returns Array of blacklisted chain IDs
@@ -23,11 +23,7 @@ export const selectAdditionalNetworksBlacklistFeatureFlag = createSelector(
       | string[]
       | undefined;
 
-    if (process.env.GITHUB_ACTIONS === 'true' && process.env.E2E !== 'true') {
-      const value = remoteValue || [];
-      return Array.isArray(value) ? value : [];
-    }
-
+    // Parse environment variable override
     const envValue = process.env.MM_ADDITIONAL_NETWORK_BLACKLIST;
     let envArray: string[] = [];
 
@@ -38,7 +34,10 @@ export const selectAdditionalNetworksBlacklistFeatureFlag = createSelector(
         .filter((id) => id.length > 0);
     }
 
+    // Use environment variable if provided, otherwise use remote value, fallback to empty array
     const finalValue = envArray.length > 0 ? envArray : remoteValue || [];
+
+    // Ensure we return an array of strings
     return Array.isArray(finalValue) ? finalValue : [];
   },
 );
diff --git a/app/selectors/legalNotices/index.test.ts b/app/selectors/legalNotices/index.test.ts
index 96c0b72115f6..ad41eb80bf44 100644
--- a/app/selectors/legalNotices/index.test.ts
+++ b/app/selectors/legalNotices/index.test.ts
@@ -5,16 +5,15 @@ import {
 } from '.';
 import { RootState } from '../../reducers';
 import { selectIsPna25FlagEnabled } from '../featureFlagController/legalNotices';
-import { MetaMetrics } from '../../core/Analytics';
+import { analytics } from '../../util/analytics/analytics';
 
 jest.mock('../featureFlagController/legalNotices');
-jest.mock('../../core/Analytics');
+jest.mock('../../util/analytics/analytics');
 
 const mockSelectIsPna25FlagEnabled =
   selectIsPna25FlagEnabled as jest.MockedFunction<
     typeof selectIsPna25FlagEnabled
   >;
-const mockMetaMetrics = MetaMetrics as jest.Mocked<typeof MetaMetrics>;
 
 describe('legalNotices selectors', () => {
   beforeEach(() => {
@@ -110,9 +109,7 @@ describe('legalNotices selectors', () => {
       }) as RootState;
 
     beforeEach(() => {
-      mockMetaMetrics.getInstance.mockReturnValue({
-        isEnabled: jest.fn().mockReturnValue(true),
-      } as never);
+      jest.mocked(analytics.isEnabled).mockReturnValue(true);
     });
 
     it('returns false when onboarding is not completed', () => {
@@ -142,12 +139,10 @@ describe('legalNotices selectors', () => {
       expect(result).toBe(false);
     });
 
-    it('returns false when MetaMetrics is disabled', () => {
+    it('returns false when analytics is disabled', () => {
       const state = createMockState({});
       mockSelectIsPna25FlagEnabled.mockReturnValue(true);
-      mockMetaMetrics.getInstance.mockReturnValue({
-        isEnabled: jest.fn().mockReturnValue(false),
-      } as never);
+      jest.mocked(analytics.isEnabled).mockReturnValue(false);
 
       const result = selectShouldShowPna25Notice(state);
 
diff --git a/app/selectors/legalNotices/index.ts b/app/selectors/legalNotices/index.ts
index e5e9ffcaa06b..8380e4bb5b35 100644
--- a/app/selectors/legalNotices/index.ts
+++ b/app/selectors/legalNotices/index.ts
@@ -1,6 +1,6 @@
 import { RootState } from '../../reducers';
 import { selectIsPna25FlagEnabled } from '../featureFlagController/legalNotices';
-import { MetaMetrics } from '../../core/Analytics';
+import { analytics } from '../../util/analytics/analytics';
 import { newPrivacyPolicyDate } from '../../reducers/legalNotices';
 import { selectCompletedOnboarding } from '../onboarding';
 
@@ -59,7 +59,7 @@ export const selectShouldShowPna25Notice = (state: RootState): boolean => {
     return false;
   }
 
-  const areMetametricsEnabled = MetaMetrics.getInstance().isEnabled();
+  const areMetametricsEnabled = analytics.isEnabled();
 
   if (areMetametricsEnabled === false) {
     return false;
diff --git a/app/selectors/multichainAccounts/wallets.test.ts b/app/selectors/multichainAccounts/wallets.test.ts
index 92b8a9cc2e37..a7158c9c6b13 100644
--- a/app/selectors/multichainAccounts/wallets.test.ts
+++ b/app/selectors/multichainAccounts/wallets.test.ts
@@ -27,98 +27,16 @@ const createMockState = (
   accountTreeController:
     | DeepPartial<AccountTreeControllerState>
     | undefined = {},
-  multichainAccountsEnabled: boolean = true,
 ): RootState =>
   ({
     engine: {
       backgroundState: {
         AccountTreeController: accountTreeController,
-        RemoteFeatureFlagController: {
-          remoteFeatureFlags: {
-            enableMultichainAccounts: {
-              enabled: multichainAccountsEnabled,
-              featureVersion: '1',
-              minimumVersion: '1.0.0',
-            },
-          },
-        },
       },
     },
   }) as unknown as RootState;
 
 describe('selectWallets', () => {
-  it('returns empty array when multichain accounts feature is disabled', () => {
-    const mockState = createMockState(
-      {
-        accountTree: {
-          wallets: {
-            [WALLET_ID_1]: {
-              id: WALLET_ID_1,
-              type: AccountWalletType.Keyring,
-              metadata: {
-                name: 'Wallet 1',
-                keyring: {
-                  type: mockKeyringTypes.HD_KEY_TREE,
-                },
-              },
-              groups: {
-                [GROUP_ID_1]: {
-                  accounts: ['account1' as const],
-                  id: GROUP_ID_1,
-                  type: AccountGroupType.SingleAccount,
-                  metadata: {
-                    name: 'Account 1',
-                  },
-                },
-              },
-            },
-            [WALLET_ID_2]: {
-              id: WALLET_ID_2,
-              type: AccountWalletType.Keyring,
-              metadata: {
-                name: 'Wallet 2',
-                keyring: {
-                  type: mockKeyringTypes.HD_KEY_TREE,
-                },
-              },
-              groups: {
-                [GROUP_ID_2]: {
-                  accounts: ['account2' as const],
-                  id: GROUP_ID_2,
-                  type: AccountGroupType.SingleAccount,
-                  metadata: {
-                    name: 'Account 2',
-                  },
-                },
-              },
-            },
-          },
-          selectedAccountGroup: '',
-        },
-        accountGroupsMetadata: {
-          [GROUP_ID_1]: {
-            name: { value: 'Account 1', lastUpdatedAt: expect.any(Number) },
-          },
-          [GROUP_ID_2]: {
-            name: { value: 'Account 2', lastUpdatedAt: expect.any(Number) },
-          },
-        },
-        accountWalletsMetadata: {
-          [WALLET_ID_1]: {
-            name: { value: 'Wallet 1', lastUpdatedAt: expect.any(Number) },
-          },
-          [WALLET_ID_2]: {
-            name: { value: 'Wallet 2', lastUpdatedAt: expect.any(Number) },
-          },
-        },
-      },
-      false,
-    );
-
-    const result = selectWallets(mockState);
-    expect(result).toEqual([]);
-  });
-
   it('returns wallets array when multichain accounts feature is enabled and wallets exist', () => {
     const wallet1: AccountWalletObject = {
       id: WALLET_ID_1,
@@ -248,12 +166,6 @@ describe('selectWallets', () => {
 });
 
 describe('selectMultichainWallets', () => {
-  it('returns empty array when multichain accounts feature is disabled', () => {
-    const mockState = createMockState(undefined, false);
-    const result = selectMultichainWallets(mockState);
-    expect(result).toEqual([]);
-  });
-
   it('returns multichain wallets when multichain accounts feature is enabled and multichain wallets exist', () => {
     const mockState = createMockState({
       accountTree: {
diff --git a/app/selectors/multichainAccounts/wallets.ts b/app/selectors/multichainAccounts/wallets.ts
index d252f0164533..a9c0ca0e856e 100644
--- a/app/selectors/multichainAccounts/wallets.ts
+++ b/app/selectors/multichainAccounts/wallets.ts
@@ -1,15 +1,10 @@
 import { selectAccountTreeControllerState } from './accountTreeController';
-import { selectMultichainAccountsState1Enabled } from '../featureFlagController/multichainAccounts';
 import { createDeepEqualSelector } from '../util';
 import { AccountWalletType } from '@metamask/account-api';
 
 export const selectWallets = createDeepEqualSelector(
-  [selectAccountTreeControllerState, selectMultichainAccountsState1Enabled],
-  (accountTreeState, multichainAccountsState1Enabled) => {
-    if (!multichainAccountsState1Enabled) {
-      return [];
-    }
-
+  [selectAccountTreeControllerState],
+  (accountTreeState) => {
     if (!accountTreeState?.accountTree?.wallets) {
       return [];
     }
diff --git a/app/selectors/rampsController/index.test.ts b/app/selectors/rampsController/index.test.ts
index a03ab030092b..dd17c1ed4caf 100644
--- a/app/selectors/rampsController/index.test.ts
+++ b/app/selectors/rampsController/index.test.ts
@@ -13,6 +13,7 @@ import {
   selectCountries,
   selectPaymentMethods,
   selectRampsControllerState,
+  selectRampsOrders,
   selectTransak,
 } from './index';
 
@@ -271,6 +272,48 @@ describe('RampsController Selectors', () => {
     });
   });
 
+  describe('selectRampsOrders', () => {
+    it('returns orders when they exist', () => {
+      const mockOrders = [
+        {
+          providerOrderId: 'order-1',
+          status: 'COMPLETED',
+          createdAt: 1000,
+        },
+        {
+          providerOrderId: 'order-2',
+          status: 'PENDING',
+          createdAt: 2000,
+        },
+      ];
+      const state = createMockState({
+        orders: mockOrders,
+      } as never);
+
+      const result = selectRampsOrders(state);
+      expect(result).toEqual(mockOrders);
+    });
+
+    it('returns empty array when orders are undefined', () => {
+      const state = createMockState();
+      const result = selectRampsOrders(state);
+      expect(result).toEqual([]);
+    });
+
+    it('returns empty array when RampsController is undefined', () => {
+      const state = {
+        engine: {
+          backgroundState: {
+            RampsController: undefined,
+          },
+        },
+      } as unknown as RootState;
+
+      const result = selectRampsOrders(state);
+      expect(result).toEqual([]);
+    });
+  });
+
   describe('selectTransak', () => {
     it('returns transak state when nativeProviders.transak is set', () => {
       const mockTransakState = {
diff --git a/app/selectors/rampsController/index.ts b/app/selectors/rampsController/index.ts
index bc55404af186..aa30fd4b8aaa 100644
--- a/app/selectors/rampsController/index.ts
+++ b/app/selectors/rampsController/index.ts
@@ -8,6 +8,7 @@ import {
   type TokensResponse,
   type ResourceState,
   type TransakState,
+  type RampsOrder,
 } from '@metamask/ramps-controller';
 import { RootState } from '../../reducers';
 
@@ -88,6 +89,14 @@ export const selectPaymentMethods = createSelector(
     createDefaultResourceState<PaymentMethod[], PaymentMethod | null>([], null),
 );
 
+/**
+ * Selects V2 orders from RampsController state.
+ */
+export const selectRampsOrders = createSelector(
+  selectRampsControllerState,
+  (rampsControllerState): RampsOrder[] => rampsControllerState?.orders ?? [],
+);
+
 /**
  * Selects the transak native provider state (isAuthenticated, userDetails, buyQuote, kycRequirement).
  */
diff --git a/app/store/migrations/123.test.ts b/app/store/migrations/123.test.ts
new file mode 100644
index 000000000000..7dbc5736e493
--- /dev/null
+++ b/app/store/migrations/123.test.ts
@@ -0,0 +1,610 @@
+import { captureException } from '@sentry/react-native';
+import { cloneDeep } from 'lodash';
+
+import { ensureValidState } from './util';
+import migrate, { migrationVersion, HYPEREVM_CHAIN_ID } from './123';
+import { Hex } from '@metamask/utils';
+
+jest.mock('@sentry/react-native', () => ({
+  captureException: jest.fn(),
+}));
+
+jest.mock('./util', () => ({
+  ensureValidState: jest.fn(),
+  addFailoverUrlToNetworkConfiguration:
+    jest.requireActual('./util').addFailoverUrlToNetworkConfiguration, // Actual one
+}));
+
+jest.mock('uuid', () => ({ v4: () => 'mock-uuid' }));
+
+const mockedCaptureException = jest.mocked(captureException);
+const mockedEnsureValidState = jest.mocked(ensureValidState);
+
+const QUICKNODE_HYPEREVM_URL = 'https://failover.com';
+
+const mainnetConfiguration = {
+  '0x1': {
+    chainId: '0x1',
+    name: 'Ethereum',
+    nativeCurrency: 'ETH',
+    blockExplorerUrls: ['https://explorer.com'],
+    defaultRpcEndpointIndex: 0,
+    defaultBlockExplorerUrlIndex: 0,
+    rpcEndpoints: [
+      {
+        networkClientId: 'mainnet',
+        type: 'custom',
+        url: 'https://mainnet.com',
+      },
+    ],
+  },
+};
+
+const hyperevmInitialConfiguration = {
+  [HYPEREVM_CHAIN_ID]: {
+    chainId: HYPEREVM_CHAIN_ID,
+    name: 'HyperEVM',
+    nativeCurrency: 'HYPE',
+    blockExplorerUrls: ['https://hyperevmscan.io/'],
+    defaultRpcEndpointIndex: 0,
+    defaultBlockExplorerUrlIndex: 0,
+    rpcEndpoints: [
+      {
+        networkClientId: 'hyperevm',
+        type: 'custom',
+        url: 'https://rpc.hyperliquid.xyz/evm',
+      },
+    ],
+  },
+};
+
+interface RpcEndpoint {
+  failoverUrls?: string[];
+  name?: string;
+  networkClientId: string;
+  url: string;
+  type: string;
+}
+
+interface NetworkConfiguration {
+  blockExplorerUrls: string[];
+  chainId: Hex;
+  defaultBlockExplorerUrlIndex?: number;
+  defaultRpcEndpointIndex: number;
+  name: string;
+  nativeCurrency: string;
+  rpcEndpoints: RpcEndpoint[];
+}
+
+const unitTestInfuraId = 'unitTestInfuraId';
+
+const NEW_TEST_INFURA_ENDPOINT = `https://hyperevm-mainnet.infura.io/v3/${unitTestInfuraId}`;
+
+export const HYPEREVM_CLEAN_CONFIG: NetworkConfiguration = {
+  chainId: HYPEREVM_CHAIN_ID,
+  name: 'HyperEVM',
+  nativeCurrency: 'HYPE',
+  blockExplorerUrls: ['https://hyperevmscan.io/'],
+  defaultRpcEndpointIndex: 0,
+  defaultBlockExplorerUrlIndex: 0,
+  rpcEndpoints: [
+    {
+      failoverUrls: [QUICKNODE_HYPEREVM_URL],
+      networkClientId: 'hyperevm',
+      type: 'custom',
+      url: NEW_TEST_INFURA_ENDPOINT,
+    },
+  ],
+};
+
+describe(`migration #${migrationVersion}`, () => {
+  let originalEnv: NodeJS.ProcessEnv;
+
+  beforeEach(() => {
+    jest.restoreAllMocks();
+    jest.resetAllMocks();
+
+    originalEnv = { ...process.env };
+    process.env.MM_INFURA_PROJECT_ID = unitTestInfuraId;
+    process.env.QUICKNODE_HYPEREVM_URL = QUICKNODE_HYPEREVM_URL;
+  });
+
+  afterEach(() => {
+    for (const key of new Set([
+      ...Object.keys(originalEnv),
+      ...Object.keys(process.env),
+    ])) {
+      if (originalEnv[key]) {
+        process.env[key] = originalEnv[key];
+      } else {
+        delete process.env[key];
+      }
+    }
+  });
+
+  it('returns state unchanged if ensureValidState fails', () => {
+    const state = { some: 'state' };
+    mockedEnsureValidState.mockReturnValue(false);
+
+    const migratedState = migrate(state);
+
+    expect(migratedState).toStrictEqual({ some: 'state' });
+    expect(mockedCaptureException).not.toHaveBeenCalled();
+  });
+
+  const invalidStates = [
+    {
+      state: {
+        engine: {},
+      },
+      scenario: 'empty engine state',
+    },
+    {
+      state: {
+        engine: {
+          backgroundState: {},
+        },
+      },
+      scenario: 'empty backgroundState',
+    },
+    {
+      state: {
+        engine: {
+          backgroundState: {
+            NetworkController: 'invalid',
+          },
+        },
+      },
+      scenario: 'invalid NetworkController state',
+    },
+    {
+      state: {
+        engine: {
+          backgroundState: {
+            NetworkController: {},
+          },
+        },
+      },
+      scenario: 'missing networkConfigurationsByChainId property',
+    },
+    {
+      state: {
+        engine: {
+          backgroundState: {
+            NetworkController: {
+              networkConfigurationsByChainId: 'invalid',
+            },
+          },
+        },
+      },
+      scenario: 'invalid networkConfigurationsByChainId state',
+    },
+    {
+      state: {
+        engine: {
+          backgroundState: {
+            NetworkController: {
+              networkConfigurationsByChainId: {
+                [HYPEREVM_CHAIN_ID]: {
+                  chainId: HYPEREVM_CHAIN_ID,
+                  name: 'HyperEVM',
+                  nativeCurrency: 'HYPE',
+                  blockExplorerUrls: ['https://hyperevmscan.io/'],
+                  defaultRpcEndpointIndex: 0,
+                  defaultBlockExplorerUrlIndex: 0,
+                  rpcEndpoints: [
+                    {
+                      networkClientId: 'hyperevm',
+                      type: 'custom',
+                      url: 'https://rpc.hyperliquid.xyz/evm',
+                    },
+                  ],
+                },
+              },
+            },
+          },
+        },
+      },
+      scenario: 'selectedNetworkClientId is missing',
+    },
+    {
+      state: {
+        engine: {
+          backgroundState: {
+            NetworkController: {
+              selectedNetworkClientId: {},
+              networkConfigurationsByChainId: {
+                [HYPEREVM_CHAIN_ID]: {
+                  chainId: HYPEREVM_CHAIN_ID,
+                  name: 'HyperEVM',
+                  nativeCurrency: 'HYPE',
+                  blockExplorerUrls: ['https://hyperevmscan.io/'],
+                  defaultRpcEndpointIndex: 0,
+                  defaultBlockExplorerUrlIndex: 0,
+                  rpcEndpoints: [
+                    {
+                      networkClientId: 'HYPE',
+                      type: 'custom',
+                      url: 'https://rpc.hyperliquid.xyz/evm',
+                    },
+                  ],
+                },
+              },
+            },
+          },
+        },
+      },
+      scenario: 'selectedNetworkClientId is not a string',
+    },
+  ];
+
+  it.each(invalidStates)('captures exception if $scenario', ({ state }) => {
+    const orgState = cloneDeep(state);
+    mockedEnsureValidState.mockReturnValue(true);
+
+    const migratedState = migrate(state);
+
+    // State should be unchanged
+    expect(migratedState).toStrictEqual(orgState);
+    expect(mockedCaptureException).toHaveBeenCalledWith(expect.any(Error));
+  });
+
+  it('keeps config as is without error, if already clean', async () => {
+    const orgState = {
+      engine: {
+        backgroundState: {
+          NetworkController: {
+            selectedNetworkClientId: 'mainnet',
+            networksMetadata: {},
+            networkConfigurationsByChainId: {
+              [HYPEREVM_CHAIN_ID]: HYPEREVM_CLEAN_CONFIG,
+            },
+          },
+        },
+      },
+    };
+
+    const expectedState = cloneDeep(orgState);
+
+    mockedEnsureValidState.mockReturnValue(true);
+
+    const migratedState = await migrate(orgState);
+
+    expect(mockedCaptureException).not.toHaveBeenCalled();
+
+    expect(migratedState).toStrictEqual(expectedState);
+  });
+
+  it('merges the existing HyperEVM network configuration if there is one', async () => {
+    const orgState = {
+      engine: {
+        backgroundState: {
+          NetworkController: {
+            selectedNetworkClientId: 'uuid',
+            networksMetadata: {},
+            networkConfigurationsByChainId: {
+              ...mainnetConfiguration,
+              ...hyperevmInitialConfiguration,
+            },
+          },
+        },
+      },
+    };
+
+    const expectedState = {
+      engine: {
+        backgroundState: {
+          NetworkController: {
+            selectedNetworkClientId: 'uuid',
+            networksMetadata: {},
+            networkConfigurationsByChainId: {
+              ...mainnetConfiguration,
+              [HYPEREVM_CHAIN_ID]: {
+                ...HYPEREVM_CLEAN_CONFIG,
+                rpcEndpoints: [
+                  {
+                    networkClientId: 'hyperevm',
+                    url: 'https://rpc.hyperliquid.xyz/evm',
+                    type: 'custom',
+                  },
+                  {
+                    ...HYPEREVM_CLEAN_CONFIG.rpcEndpoints[0],
+                    networkClientId: 'mock-uuid',
+                  },
+                ],
+                defaultRpcEndpointIndex: 1,
+                defaultBlockExplorerUrlIndex: 0,
+                blockExplorerUrls: ['https://hyperevmscan.io/'],
+              },
+            },
+          },
+        },
+      },
+    };
+
+    mockedEnsureValidState.mockReturnValue(true);
+
+    const migratedState = await migrate(orgState);
+
+    expect(mockedCaptureException).not.toHaveBeenCalled();
+
+    expect(migratedState).toStrictEqual(expectedState);
+  });
+
+  it('keeps original RPC if no infura key is found, and does not add failover', async () => {
+    delete process.env.MM_INFURA_PROJECT_ID;
+
+    const orgState = {
+      engine: {
+        backgroundState: {
+          NetworkController: {
+            selectedNetworkClientId: 'uuid',
+            networksMetadata: {},
+            networkConfigurationsByChainId: {
+              ...mainnetConfiguration,
+              ...hyperevmInitialConfiguration,
+              [HYPEREVM_CHAIN_ID]: {
+                ...HYPEREVM_CLEAN_CONFIG,
+                name: 'HyperEVM',
+                nativeCurrency: 'HYPE',
+                rpcEndpoints: [
+                  {
+                    networkClientId: 'hyperevm',
+                    url: 'https://rpc.hyperliquid.xyz/evm',
+                    type: 'custom',
+                  },
+                ],
+                defaultRpcEndpointIndex: 0,
+                defaultBlockExplorerUrlIndex: 0,
+                blockExplorerUrls: ['https://hyperevmscan.io/'],
+              },
+            },
+          },
+        },
+      },
+    };
+
+    const expectedState = {
+      engine: {
+        backgroundState: {
+          NetworkController: {
+            selectedNetworkClientId: 'uuid',
+            networksMetadata: {},
+            networkConfigurationsByChainId: {
+              ...mainnetConfiguration,
+              [HYPEREVM_CHAIN_ID]: {
+                ...HYPEREVM_CLEAN_CONFIG,
+                rpcEndpoints: hyperevmInitialConfiguration[
+                  HYPEREVM_CHAIN_ID
+                ].rpcEndpoints.map((endpoint) => ({
+                  ...endpoint,
+                })),
+                defaultRpcEndpointIndex: 0,
+                defaultBlockExplorerUrlIndex: 0,
+                blockExplorerUrls: ['https://hyperevmscan.io/'],
+              },
+            },
+          },
+        },
+      },
+    };
+
+    mockedEnsureValidState.mockReturnValue(true);
+
+    const migratedState = await migrate(orgState);
+
+    expect(mockedCaptureException).toHaveBeenCalledWith(
+      expect.objectContaining({
+        message: expect.stringContaining(
+          'Infura project ID is not set, skip the HyperEVM RPC migration',
+        ),
+      }),
+    );
+
+    expect(migratedState).toStrictEqual(expectedState);
+  });
+
+  it('does not add failover URL if there is already a failover URL', async () => {
+    const orgState = {
+      engine: {
+        backgroundState: {
+          NetworkController: {
+            selectedNetworkClientId: 'uuid',
+            networksMetadata: {},
+            networkConfigurationsByChainId: {
+              ...mainnetConfiguration,
+              ...hyperevmInitialConfiguration,
+              [HYPEREVM_CHAIN_ID]: {
+                ...HYPEREVM_CLEAN_CONFIG,
+                name: 'HyperEVM',
+                nativeCurrency: 'HYPE',
+                rpcEndpoints: [
+                  {
+                    networkClientId: 'hyperevm',
+                    url: 'https://rpc.hyperliquid.xyz/evm',
+                    type: 'custom',
+                    failoverUrls: ['https://existingFailover'],
+                  },
+                ],
+                defaultRpcEndpointIndex: 0,
+                defaultBlockExplorerUrlIndex: 0,
+                blockExplorerUrls: ['https://hyperevmscan.io/'],
+              },
+            },
+          },
+        },
+      },
+    };
+
+    const expectedState = {
+      engine: {
+        backgroundState: {
+          NetworkController: {
+            selectedNetworkClientId: 'uuid',
+            networksMetadata: {},
+            networkConfigurationsByChainId: {
+              ...mainnetConfiguration,
+              [HYPEREVM_CHAIN_ID]: {
+                ...HYPEREVM_CLEAN_CONFIG,
+                rpcEndpoints: [
+                  {
+                    // Untouched first endpoint, including existing failover
+                    networkClientId: 'hyperevm',
+                    url: 'https://rpc.hyperliquid.xyz/evm',
+                    type: 'custom',
+                    failoverUrls: ['https://existingFailover'],
+                  },
+                  {
+                    // New endpoint, including QuickNode failover
+                    networkClientId: 'mock-uuid',
+                    url: NEW_TEST_INFURA_ENDPOINT,
+                    type: 'custom',
+                    failoverUrls: [QUICKNODE_HYPEREVM_URL],
+                  },
+                ],
+                defaultRpcEndpointIndex: 1,
+                defaultBlockExplorerUrlIndex: 0,
+                blockExplorerUrls: ['https://hyperevmscan.io/'],
+              },
+            },
+          },
+        },
+      },
+    };
+
+    mockedEnsureValidState.mockReturnValue(true);
+
+    const migratedState = await migrate(orgState);
+
+    expect(mockedCaptureException).not.toHaveBeenCalled();
+
+    expect(migratedState).toStrictEqual(expectedState);
+  });
+
+  it('does not add failover URL if QUICKNODE_HYPEREVM_URL env variable is not set', async () => {
+    delete process.env.QUICKNODE_HYPEREVM_URL;
+
+    const orgState = {
+      engine: {
+        backgroundState: {
+          NetworkController: {
+            selectedNetworkClientId: 'uuid',
+            networksMetadata: {},
+            networkConfigurationsByChainId: {
+              ...mainnetConfiguration,
+              ...hyperevmInitialConfiguration,
+              [HYPEREVM_CHAIN_ID]: {
+                ...HYPEREVM_CLEAN_CONFIG,
+                name: 'HyperEVM',
+                nativeCurrency: 'HYPE',
+                rpcEndpoints: [
+                  {
+                    networkClientId: 'hyperevm',
+                    url: 'https://rpc.hyperliquid.xyz/evm',
+                    type: 'custom',
+                    failoverUrls: ['https://existingFailover'],
+                  },
+                ],
+                defaultRpcEndpointIndex: 0,
+                defaultBlockExplorerUrlIndex: 0,
+                blockExplorerUrls: ['https://hyperevmscan.io/'],
+              },
+            },
+          },
+        },
+      },
+    };
+
+    const expectedState = {
+      engine: {
+        backgroundState: {
+          NetworkController: {
+            selectedNetworkClientId: 'uuid',
+            networksMetadata: {},
+            networkConfigurationsByChainId: {
+              ...mainnetConfiguration,
+              [HYPEREVM_CHAIN_ID]: {
+                ...HYPEREVM_CLEAN_CONFIG,
+                rpcEndpoints: [
+                  {
+                    // Untouched first endpoint, including existing failover
+                    networkClientId: 'hyperevm',
+                    url: 'https://rpc.hyperliquid.xyz/evm',
+                    type: 'custom',
+                    failoverUrls: ['https://existingFailover'],
+                  },
+                  {
+                    // New endpoint, missing QuickNode failover because of the missing env var
+                    networkClientId: 'mock-uuid',
+                    url: NEW_TEST_INFURA_ENDPOINT,
+                    type: 'custom',
+                    failoverUrls: [],
+                  },
+                ],
+                defaultRpcEndpointIndex: 1,
+                defaultBlockExplorerUrlIndex: 0,
+                blockExplorerUrls: ['https://hyperevmscan.io/'],
+              },
+            },
+          },
+        },
+      },
+    };
+
+    mockedEnsureValidState.mockReturnValue(true);
+
+    const migratedState = await migrate(orgState);
+
+    expect(mockedCaptureException).not.toHaveBeenCalled();
+
+    expect(migratedState).toStrictEqual(expectedState);
+  });
+
+  it('returns the original state if the HyperEVM network configuration exists but is invalid', async () => {
+    const orgState = {
+      engine: {
+        backgroundState: {
+          NetworkController: {
+            selectedNetworkClientId: 'uuid',
+            networksMetadata: {},
+            networkConfigurationsByChainId: {
+              ...mainnetConfiguration,
+              [HYPEREVM_CHAIN_ID]: {
+                ...HYPEREVM_CLEAN_CONFIG,
+                name: 'HyperEVM',
+                nativeCurrency: 'HYPE',
+                rpcEndpoints: 'invalid',
+              },
+            },
+          },
+        },
+      },
+    };
+
+    const expectedState = {
+      engine: {
+        backgroundState: {
+          NetworkController: {
+            selectedNetworkClientId: 'uuid',
+            networksMetadata: {},
+            networkConfigurationsByChainId: {
+              ...mainnetConfiguration,
+              [HYPEREVM_CHAIN_ID]: {
+                ...HYPEREVM_CLEAN_CONFIG,
+                name: 'HyperEVM',
+                nativeCurrency: 'HYPE',
+                rpcEndpoints: 'invalid',
+              },
+            },
+          },
+        },
+      },
+    };
+
+    mockedEnsureValidState.mockReturnValue(true);
+
+    const migratedState = await migrate(orgState);
+
+    expect(migratedState).toStrictEqual(expectedState);
+  });
+});
diff --git a/app/store/migrations/123.ts b/app/store/migrations/123.ts
new file mode 100644
index 000000000000..726b14ad90ea
--- /dev/null
+++ b/app/store/migrations/123.ts
@@ -0,0 +1,268 @@
+import { captureException } from '@sentry/react-native';
+import {
+  getErrorMessage,
+  hasProperty,
+  Hex,
+  isHexString,
+  isObject,
+} from '@metamask/utils';
+import { v4 as uuidV4 } from 'uuid';
+
+import { ensureValidState, ValidState } from './util';
+import { cloneDeep } from 'lodash';
+
+/**
+ * A Copy of the RpcEndpoint type from the network controller,
+ * This is used to avoid the dependency on the network controller.
+ */
+interface RpcEndpoint {
+  failoverUrls?: string[];
+  name?: string;
+  networkClientId: string;
+  url: string;
+  type: string;
+}
+
+/**
+ * A Copy of the NetworkConfiguration type from the network controller,
+ * This is used to avoid the dependency on the network controller.
+ */
+interface NetworkConfiguration {
+  blockExplorerUrls: string[];
+  chainId: Hex;
+  defaultBlockExplorerUrlIndex?: number;
+  defaultRpcEndpointIndex: number;
+  name: string;
+  nativeCurrency: string;
+  rpcEndpoints: RpcEndpoint[];
+}
+
+export const migrationVersion = 123;
+
+// Export for tests
+export const HYPEREVM_CHAIN_ID = '0x3e7';
+
+/**
+ * This migration does:
+ * - Adds Infura RPC + Quicknode Failover to HyperEVM and set as default if Infura not already present.
+ * Otherwise leaves RPC config untouched (not adding the failover to existing Infura).
+ * - Adds Blockscout Explorer URL to list of explorers if not already present.
+ *
+ * @param versionedState - MetaMask state, exactly
+ * what we persist to disk.
+ * @returns Updated MetaMask state.
+ */
+export default function migrate(versionedState: unknown) {
+  // Putting env-fetching here for easier testing.
+  // Ideally all "infuraProjectId" logic should use a getter.
+  const INFURA_KEY = process.env.MM_INFURA_PROJECT_ID;
+  const infuraProjectId = INFURA_KEY === 'null' ? '' : INFURA_KEY;
+  const QUICKNODE_HYPEREVM_URL = process.env.QUICKNODE_HYPEREVM_URL;
+  const quickNodeUrl =
+    QUICKNODE_HYPEREVM_URL && QUICKNODE_HYPEREVM_URL !== 'null'
+      ? QUICKNODE_HYPEREVM_URL
+      : undefined;
+
+  const state = cloneDeep(versionedState);
+  try {
+    if (!ensureValidState(state, migrationVersion)) {
+      return state;
+    }
+
+    const networkState = validateNetworkController(state);
+    // No Migration should be performed if the NetworkController state is invalid.
+    if (networkState === undefined) {
+      console.warn(
+        `Migration ${migrationVersion}: Missing or invalid NetworkController state, skip the migration`,
+      );
+      return state;
+    }
+
+    const { networkConfigurationsByChainId } = networkState;
+
+    // Migrate NetworkController:
+    // - Merges the HyperEVM Mainnet network configuration if user already has it.
+    if (hasProperty(networkConfigurationsByChainId, HYPEREVM_CHAIN_ID)) {
+      const hyperevmConfiguration =
+        networkConfigurationsByChainId[HYPEREVM_CHAIN_ID];
+      if (!isValidNetworkConfiguration(hyperevmConfiguration)) {
+        console.warn(
+          `Migration ${migrationVersion}: Invalid HyperEVM network configuration, skip the migration`,
+        );
+        return state;
+      }
+
+      if (infuraProjectId) {
+        const newInfuraURL = `https://hyperevm-mainnet.infura.io/v3/${infuraProjectId}`;
+        const isInfuraRpcPresent = hyperevmConfiguration.rpcEndpoints.find(
+          (rpc) => rpc.url === newInfuraURL,
+        );
+        // Avoid RPC duplication if Infura is already present.
+        if (!isInfuraRpcPresent) {
+          const failoverUrls = quickNodeUrl ? [quickNodeUrl] : [];
+          // Add Infura RPC
+          hyperevmConfiguration.rpcEndpoints.push({
+            failoverUrls,
+            // Normally networkClientId should be 'hyperevm-mainnet' and type 'infura'.
+            // This is because "InfuraNetworkType" has this network missing.
+            // Planning to run a dedicated migration script for set all infura RPCs to 'infura' type.
+            // Dicussion: https://github.com/MetaMask/metamask-extension/pull/39635#issuecomment-3861983789
+            networkClientId: uuidV4(),
+            type: 'custom',
+            url: newInfuraURL,
+          });
+          // Set newly added Infura RPC as default RPC.
+          hyperevmConfiguration.defaultRpcEndpointIndex =
+            hyperevmConfiguration.rpcEndpoints.length - 1;
+        }
+      } else {
+        captureException(
+          new Error(
+            `Migration ${migrationVersion}: Infura project ID is not set, skip the HyperEVM RPC migration`,
+          ),
+        );
+      }
+    }
+
+    return state;
+  } catch (error) {
+    console.error(error);
+    captureException(
+      new Error(`Migration ${migrationVersion}: ${getErrorMessage(error)}`),
+    );
+    // Return the original state if migration fails to avoid breaking the app
+    return versionedState;
+  }
+}
+
+// Copied from 111.ts/113.ts
+function validateNetworkController(state: ValidState):
+  | {
+      networkConfigurationsByChainId: Record<Hex, unknown>;
+      selectedNetworkClientId: string;
+    }
+  | undefined {
+  if (!hasProperty(state.engine.backgroundState, 'NetworkController')) {
+    // We catch the exception here, as we don't expect the NetworkController state is missing.
+    captureException(
+      new Error(
+        `Migration ${migrationVersion}: Invalid NetworkController state: missing NetworkController`,
+      ),
+    );
+    return undefined;
+  }
+
+  const networkState = state.engine.backgroundState.NetworkController;
+
+  // To narrow the type of the networkState to the expected type.
+  if (!isValidNetworkControllerState(networkState)) {
+    return undefined;
+  }
+
+  return networkState;
+}
+
+// Copied from 111.ts/113.ts
+function isValidNetworkControllerState(value: unknown): value is {
+  networkConfigurationsByChainId: Record<Hex, unknown>;
+  selectedNetworkClientId: string;
+} {
+  if (!isObject(value)) {
+    captureException(
+      new Error(
+        `Migration ${migrationVersion}: Invalid NetworkController state: NetworkController state is not an object: '${typeof value}'`,
+      ),
+    );
+    return false;
+  }
+
+  if (!hasProperty(value, 'networkConfigurationsByChainId')) {
+    captureException(
+      new Error(
+        `Migration ${migrationVersion}: Invalid NetworkController state: missing networkConfigurationsByChainId property`,
+      ),
+    );
+    return false;
+  }
+
+  if (
+    !isValidNetworkConfigurationsByChainId(value.networkConfigurationsByChainId)
+  ) {
+    captureException(
+      new Error(
+        `Migration ${migrationVersion}: Invalid NetworkController state: networkConfigurationsByChainId is not a valid Record<Hex, unknown>`,
+      ),
+    );
+    return false;
+  }
+
+  if (!hasProperty(value, 'selectedNetworkClientId')) {
+    captureException(
+      new Error(
+        `Migration ${migrationVersion}: Invalid NetworkController state: missing selectedNetworkClientId property`,
+      ),
+    );
+    return false;
+  }
+
+  if (typeof value.selectedNetworkClientId !== 'string') {
+    captureException(
+      new Error(
+        `Migration ${migrationVersion}: Invalid NetworkController state: selectedNetworkClientId is not a string: '${typeof value.selectedNetworkClientId}'`,
+      ),
+    );
+    return false;
+  }
+
+  return true;
+}
+
+// Copied from 111.ts/113.ts
+function isValidNetworkConfigurationsByChainId(
+  value: unknown,
+): value is Record<Hex, unknown> {
+  return (
+    isObject(value) &&
+    Object.entries(value).every(
+      ([chainId]) => typeof chainId === 'string' && isHexString(chainId),
+    )
+  );
+}
+
+// Copied from 111.ts/113.ts
+function isValidNetworkConfiguration(
+  object: unknown,
+): object is NetworkConfiguration {
+  return (
+    isObject(object) &&
+    hasProperty(object, 'chainId') &&
+    typeof object.chainId === 'string' &&
+    isHexString(object.chainId) &&
+    hasProperty(object, 'rpcEndpoints') &&
+    Array.isArray(object.rpcEndpoints) &&
+    object.rpcEndpoints.every(isValidRpcEndpoint) &&
+    hasProperty(object, 'name') &&
+    typeof object.name === 'string' &&
+    hasProperty(object, 'nativeCurrency') &&
+    typeof object.nativeCurrency === 'string' &&
+    hasProperty(object, 'blockExplorerUrls') &&
+    Array.isArray(object.blockExplorerUrls) &&
+    object.blockExplorerUrls.every((url) => typeof url === 'string') &&
+    hasProperty(object, 'defaultRpcEndpointIndex') &&
+    typeof object.defaultRpcEndpointIndex === 'number' &&
+    (!hasProperty(object, 'defaultBlockExplorerUrlIndex') ||
+      (hasProperty(object, 'defaultBlockExplorerUrlIndex') &&
+        typeof object.defaultBlockExplorerUrlIndex === 'number'))
+  );
+}
+
+// Copied from 111.ts/113.ts
+function isValidRpcEndpoint(object: unknown): boolean {
+  return (
+    isObject(object) &&
+    hasProperty(object, 'networkClientId') &&
+    typeof object.networkClientId === 'string' &&
+    hasProperty(object, 'url') &&
+    typeof object.url === 'string'
+  );
+}
diff --git a/app/store/migrations/124.test.ts b/app/store/migrations/124.test.ts
new file mode 100644
index 000000000000..dbddfb876821
--- /dev/null
+++ b/app/store/migrations/124.test.ts
@@ -0,0 +1,186 @@
+import migrate, { migrationVersion } from './124';
+
+jest.mock('@sentry/react-native', () => ({
+  captureException: jest.fn(),
+}));
+
+describe(`Migration ${migrationVersion}: Remove stale cache and priority token fields from Card state`, () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  it('returns state unchanged when ensureValidState fails', () => {
+    const invalidState = 'not an object';
+    const result = migrate(invalidState);
+
+    expect(result).toBe(invalidState);
+  });
+
+  it('returns state unchanged when card property is missing', () => {
+    const state = {
+      engine: { backgroundState: {} },
+      settings: {},
+      security: {},
+    };
+
+    const result = migrate(state) as typeof state;
+
+    expect(result).toStrictEqual(state);
+  });
+
+  it('returns state unchanged when card is not an object', () => {
+    const state = {
+      engine: { backgroundState: {} },
+      settings: {},
+      security: {},
+      card: 'invalid',
+    };
+
+    const result = migrate(state) as typeof state;
+
+    expect(result).toStrictEqual(state);
+  });
+
+  it('removes stale fields from card state', () => {
+    const state = {
+      engine: { backgroundState: {} },
+      settings: {},
+      security: {},
+      card: {
+        cardholderAccounts: ['0x123'],
+        isLoaded: true,
+        hasViewedCardButton: true,
+        alwaysShowCardButton: false,
+        geoLocation: 'US',
+        isAuthenticated: false,
+        userCardLocation: 'international',
+        isDaimoDemo: false,
+        onboarding: {
+          onboardingId: null,
+          selectedCountry: null,
+          contactVerificationId: null,
+          consentSetId: null,
+        },
+        cache: {
+          data: { 'some-key': { value: 'test' } },
+          timestamps: { 'some-key': 1000 },
+        },
+        priorityTokensByAddress: {
+          '0x123': { address: '0xToken1', symbol: 'USDC' },
+        },
+        lastFetchedByAddress: {
+          '0x123': '2025-08-21T10:00:00Z',
+        },
+        authenticatedPriorityToken: {
+          address: '0xToken1',
+          symbol: 'USDC',
+        },
+        authenticatedPriorityTokenLastFetched: '2025-08-21T10:00:00Z',
+      },
+    };
+
+    const result = migrate(state) as typeof state;
+    const card = result.card as Record<string, unknown>;
+
+    expect(card.cache).toBeUndefined();
+    expect(card.priorityTokensByAddress).toBeUndefined();
+    expect(card.lastFetchedByAddress).toBeUndefined();
+    expect(card.authenticatedPriorityToken).toBeUndefined();
+    expect(card.authenticatedPriorityTokenLastFetched).toBeUndefined();
+  });
+
+  it('preserves other card state fields', () => {
+    const state = {
+      engine: { backgroundState: {} },
+      settings: {},
+      security: {},
+      card: {
+        cardholderAccounts: ['0x123', '0x456'],
+        isLoaded: true,
+        hasViewedCardButton: true,
+        alwaysShowCardButton: true,
+        geoLocation: 'GB',
+        isAuthenticated: true,
+        userCardLocation: 'us',
+        isDaimoDemo: false,
+        onboarding: {
+          onboardingId: 'test-id',
+          selectedCountry: { key: 'US', name: 'United States', emoji: '🇺🇸' },
+          contactVerificationId: 'ver-123',
+          consentSetId: 'consent-456',
+        },
+        cache: { data: {}, timestamps: {} },
+        priorityTokensByAddress: {},
+        lastFetchedByAddress: {},
+        authenticatedPriorityToken: null,
+        authenticatedPriorityTokenLastFetched: null,
+      },
+    };
+
+    const result = migrate(state) as typeof state;
+    const card = result.card as Record<string, unknown>;
+
+    expect(card.cardholderAccounts).toEqual(['0x123', '0x456']);
+    expect(card.isLoaded).toBe(true);
+    expect(card.hasViewedCardButton).toBe(true);
+    expect(card.alwaysShowCardButton).toBe(true);
+    expect(card.geoLocation).toBe('GB');
+    expect(card.isAuthenticated).toBe(true);
+    expect(card.userCardLocation).toBe('us');
+    expect(card.isDaimoDemo).toBe(false);
+    expect(card.onboarding).toEqual({
+      onboardingId: 'test-id',
+      selectedCountry: { key: 'US', name: 'United States', emoji: '🇺🇸' },
+      contactVerificationId: 'ver-123',
+      consentSetId: 'consent-456',
+    });
+  });
+
+  it('handles card state that already lacks the removed fields', () => {
+    const state = {
+      engine: { backgroundState: {} },
+      settings: {},
+      security: {},
+      card: {
+        cardholderAccounts: [],
+        isLoaded: false,
+        hasViewedCardButton: false,
+        alwaysShowCardButton: false,
+        geoLocation: 'UNKNOWN',
+        isAuthenticated: false,
+        userCardLocation: 'international',
+        isDaimoDemo: false,
+        onboarding: {
+          onboardingId: null,
+          selectedCountry: null,
+          contactVerificationId: null,
+          consentSetId: null,
+        },
+      },
+    };
+
+    const result = migrate(state) as typeof state;
+    const card = result.card as Record<string, unknown>;
+
+    expect(card.cardholderAccounts).toEqual([]);
+    expect(card.isLoaded).toBe(false);
+    expect(card.cache).toBeUndefined();
+    expect(card.priorityTokensByAddress).toBeUndefined();
+    expect(card.lastFetchedByAddress).toBeUndefined();
+    expect(card.authenticatedPriorityToken).toBeUndefined();
+    expect(card.authenticatedPriorityTokenLastFetched).toBeUndefined();
+  });
+
+  it('handles empty card object', () => {
+    const state = {
+      engine: { backgroundState: {} },
+      settings: {},
+      security: {},
+      card: {},
+    };
+
+    const result = migrate(state) as typeof state;
+
+    expect(result.card).toEqual({});
+  });
+});
diff --git a/app/store/migrations/124.ts b/app/store/migrations/124.ts
new file mode 100644
index 000000000000..a1b7768217ad
--- /dev/null
+++ b/app/store/migrations/124.ts
@@ -0,0 +1,33 @@
+import { isObject, hasProperty } from '@metamask/utils';
+import { ensureValidState } from './util';
+
+export const migrationVersion = 124;
+
+/**
+ * Migration 124: Remove stale cache data and priority token fields from the
+ * Card Redux slice. Data fetching has been migrated to React Query.
+ *
+ * @param state - The persisted Redux state
+ * @returns The migrated Redux state
+ */
+const migration = (state: unknown): unknown => {
+  if (!ensureValidState(state, migrationVersion)) {
+    return state;
+  }
+
+  if (!hasProperty(state, 'card') || !isObject(state.card)) {
+    return state;
+  }
+
+  const card = state.card as Record<string, unknown>;
+
+  delete card.cache;
+  delete card.priorityTokensByAddress;
+  delete card.lastFetchedByAddress;
+  delete card.authenticatedPriorityToken;
+  delete card.authenticatedPriorityTokenLastFetched;
+
+  return state;
+};
+
+export default migration;
diff --git a/app/store/migrations/index.ts b/app/store/migrations/index.ts
index 820fc0292887..fb0bc32d8832 100644
--- a/app/store/migrations/index.ts
+++ b/app/store/migrations/index.ts
@@ -123,6 +123,8 @@ import migration119 from './119';
 import migration120 from './120';
 import migration121 from './121';
 import migration122 from './122';
+import migration123 from './123';
+import migration124 from './124';
 
 // Add migrations above this line
 import { ControllerStorage } from '../persistConfig';
@@ -265,6 +267,8 @@ export const migrationList: MigrationsList = {
   120: migration120,
   121: migration121,
   122: migration122,
+  123: migration123,
+  124: migration124,
 };
 
 // Enable both synchronous and asynchronous migrations
diff --git a/app/util/confirmation/gas.test.ts b/app/util/confirmation/gas.test.ts
new file mode 100644
index 000000000000..4268528b9274
--- /dev/null
+++ b/app/util/confirmation/gas.test.ts
@@ -0,0 +1,139 @@
+import {
+  GasFeeEstimateType,
+  GasFeeEstimateLevel,
+} from '@metamask/transaction-controller';
+import { getMediumGasPriceHex } from './gas';
+
+jest.mock('../conversions', () => ({
+  decGWEIToHexWEI: jest.fn((value: string) => {
+    if (value === '0') return '0';
+    const dec = Number(value);
+    return dec.toString(16);
+  }),
+}));
+
+jest.mock('../number', () => ({
+  addHexPrefix: jest.fn((str: string) =>
+    str && !String(str).startsWith('0x') ? `0x${str}` : str,
+  ),
+}));
+
+const mockDecGWEIToHexWEI = jest.requireMock('../conversions').decGWEIToHexWEI;
+const mockAddHexPrefix = jest.requireMock('../number').addHexPrefix;
+
+describe('getMediumGasPriceHex', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+    (mockAddHexPrefix as jest.Mock).mockImplementation((str: string) =>
+      str && !String(str).startsWith('0x') ? `0x${str}` : str,
+    );
+    (mockDecGWEIToHexWEI as jest.Mock).mockImplementation((value: string) => {
+      if (value === '0') return '0';
+      const dec = Number(value);
+      return dec.toString(16);
+    });
+  });
+
+  it('returns 0x-prefixed zero when gasFeeEstimates is null', () => {
+    const result = getMediumGasPriceHex(null);
+
+    expect(mockDecGWEIToHexWEI).toHaveBeenCalledWith('0');
+    expect(mockAddHexPrefix).toHaveBeenCalled();
+    expect(result).toBeDefined();
+  });
+
+  it('returns 0x-prefixed zero when gasFeeEstimates is undefined', () => {
+    const result = getMediumGasPriceHex(undefined);
+
+    expect(mockDecGWEIToHexWEI).toHaveBeenCalledWith('0');
+    expect(result).toBeDefined();
+  });
+
+  it('uses FeeMarket type and medium suggestedMaxFeePerGas', () => {
+    const estimates = {
+      type: GasFeeEstimateType.FeeMarket,
+      [GasFeeEstimateLevel.Medium]: { suggestedMaxFeePerGas: '25' },
+    };
+
+    const result = getMediumGasPriceHex(estimates);
+
+    expect(mockDecGWEIToHexWEI).toHaveBeenCalledWith('25');
+    expect(mockAddHexPrefix).toHaveBeenCalled();
+    expect(result).toBeDefined();
+  });
+
+  it('uses Legacy type and medium value', () => {
+    const estimates = {
+      type: GasFeeEstimateType.Legacy,
+      [GasFeeEstimateLevel.Medium]: '20',
+    };
+
+    const result = getMediumGasPriceHex(estimates);
+
+    expect(mockDecGWEIToHexWEI).toHaveBeenCalledWith('20');
+    expect(result).toBeDefined();
+  });
+
+  it('uses GasPrice type gasPrice', () => {
+    const estimates = {
+      type: GasFeeEstimateType.GasPrice,
+      gasPrice: '15',
+    };
+
+    const result = getMediumGasPriceHex(estimates);
+
+    expect(mockDecGWEIToHexWEI).toHaveBeenCalledWith('15');
+    expect(result).toBeDefined();
+  });
+
+  it('uses default 0 for unknown type', () => {
+    const estimates = {
+      type: 'Unknown',
+    } as Parameters<typeof getMediumGasPriceHex>[0];
+
+    const result = getMediumGasPriceHex(estimates);
+
+    expect(mockDecGWEIToHexWEI).toHaveBeenCalledWith('0');
+    expect(result).toBeDefined();
+  });
+
+  it('uses legacy shape medium.suggestedMaxFeePerGas when type is missing', () => {
+    const estimates = {
+      medium: { suggestedMaxFeePerGas: '30' },
+    };
+
+    const result = getMediumGasPriceHex(estimates);
+
+    expect(mockDecGWEIToHexWEI).toHaveBeenCalledWith('30');
+    expect(result).toBeDefined();
+  });
+
+  it('uses legacy shape medium as string when type is missing', () => {
+    const estimates = {
+      medium: '22',
+    };
+
+    const result = getMediumGasPriceHex(estimates);
+
+    expect(mockDecGWEIToHexWEI).toHaveBeenCalledWith('22');
+    expect(result).toBeDefined();
+  });
+
+  it('uses gasPrice fallback when type is missing and medium not object', () => {
+    const estimates = {
+      gasPrice: '10',
+    };
+
+    const result = getMediumGasPriceHex(estimates);
+
+    expect(mockDecGWEIToHexWEI).toHaveBeenCalledWith('10');
+    expect(result).toBeDefined();
+  });
+
+  it('returns 0x-prefixed zero when no usable estimate', () => {
+    const result = getMediumGasPriceHex({});
+
+    expect(mockDecGWEIToHexWEI).toHaveBeenCalledWith('0');
+    expect(result).toBeDefined();
+  });
+});
diff --git a/app/util/confirmation/gas.ts b/app/util/confirmation/gas.ts
new file mode 100644
index 000000000000..bab39051dc34
--- /dev/null
+++ b/app/util/confirmation/gas.ts
@@ -0,0 +1,99 @@
+import {
+  GasFeeEstimateLevel,
+  GasFeeEstimateType,
+  type FeeMarketGasFeeEstimates,
+  type GasFeeEstimates,
+  type GasPriceGasFeeEstimates,
+  type LegacyGasFeeEstimates,
+} from '@metamask/transaction-controller';
+import { decGWEIToHexWEI } from '../conversions';
+import { addHexPrefix } from '../number';
+
+/**
+ * Returns the hex gas price (in wei) for the "medium" tier from gas fee estimates.
+ * Used when a legacy tx has existing gasPrice 0x0 so cancel/speed-up can fall back to a mineable price.
+ */
+export function getMediumGasPriceHex(
+  gasFeeEstimates:
+    | GasFeeEstimates
+    | { medium?: unknown; gasPrice?: string }
+    | null
+    | undefined,
+): string {
+  if (!gasFeeEstimates) {
+    return addHexPrefix(String(decGWEIToHexWEI('0')));
+  }
+
+  if ('type' in (gasFeeEstimates as object)) {
+    const typedEstimates = gasFeeEstimates as GasFeeEstimates;
+    let estimateGweiDecimalRaw: string;
+
+    switch (typedEstimates.type) {
+      case GasFeeEstimateType.FeeMarket: {
+        const level = (typedEstimates as FeeMarketGasFeeEstimates)[
+          GasFeeEstimateLevel.Medium
+        ];
+        estimateGweiDecimalRaw = (
+          level as unknown as { suggestedMaxFeePerGas: string }
+        ).suggestedMaxFeePerGas;
+        break;
+      }
+      case GasFeeEstimateType.Legacy: {
+        estimateGweiDecimalRaw = (typedEstimates as LegacyGasFeeEstimates)[
+          GasFeeEstimateLevel.Medium
+        ] as unknown as string;
+        break;
+      }
+      case GasFeeEstimateType.GasPrice: {
+        estimateGweiDecimalRaw = (typedEstimates as GasPriceGasFeeEstimates)
+          .gasPrice as string;
+        break;
+      }
+      default: {
+        estimateGweiDecimalRaw = '0';
+      }
+    }
+
+    return addHexPrefix(
+      String(decGWEIToHexWEI(String(estimateGweiDecimalRaw))),
+    );
+  }
+
+  const maybeFeeMarket = (
+    gasFeeEstimates as {
+      medium?: { suggestedMaxFeePerGas?: string } | string;
+    }
+  ).medium;
+
+  if (
+    maybeFeeMarket &&
+    typeof maybeFeeMarket === 'object' &&
+    'suggestedMaxFeePerGas' in maybeFeeMarket
+  ) {
+    return addHexPrefix(
+      String(
+        decGWEIToHexWEI(
+          String(
+            (maybeFeeMarket as { suggestedMaxFeePerGas?: string })
+              .suggestedMaxFeePerGas ?? '0',
+          ),
+        ),
+      ),
+    );
+  }
+
+  if (
+    maybeFeeMarket &&
+    typeof maybeFeeMarket === 'string' &&
+    maybeFeeMarket.length > 0
+  ) {
+    return addHexPrefix(String(decGWEIToHexWEI(maybeFeeMarket)));
+  }
+
+  const maybeGasPrice = (gasFeeEstimates as { gasPrice?: string }).gasPrice;
+  if (maybeGasPrice) {
+    return addHexPrefix(String(decGWEIToHexWEI(String(maybeGasPrice))));
+  }
+
+  return addHexPrefix(String(decGWEIToHexWEI('0')));
+}
diff --git a/app/util/formatFiat.test.ts b/app/util/formatFiat.test.ts
new file mode 100644
index 000000000000..b3e182fba7b4
--- /dev/null
+++ b/app/util/formatFiat.test.ts
@@ -0,0 +1,118 @@
+import { BigNumber } from 'bignumber.js';
+import I18n from '../../locales/i18n';
+import formatFiat from './formatFiat';
+
+jest.mock('../../locales/i18n', () => ({
+  __esModule: true,
+  default: {
+    locale: 'en-US',
+  },
+}));
+
+describe('formatFiat', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+    I18n.locale = 'en-US';
+  });
+
+  describe('standard formatting', () => {
+    it('formats large fiat amounts correctly', () => {
+      expect(
+        formatFiat(new BigNumber('987543219876543219876.54321'), 'USD'),
+      ).toBe('$987,543,219,876,543,219,876.54');
+    });
+
+    it('formats whole numbers without decimals', () => {
+      expect(formatFiat(new BigNumber(1000), 'USD')).toBe('$1,000');
+    });
+
+    it('formats decimal amounts with two decimal places', () => {
+      expect(formatFiat(new BigNumber(500.5), 'USD')).toBe('$500.50');
+    });
+
+    it('formats zero correctly', () => {
+      expect(formatFiat(new BigNumber(0), 'USD')).toBe('$0');
+    });
+  });
+
+  describe('small amount handling', () => {
+    it('displays "<$0.01" for amounts less than 0.01', () => {
+      expect(formatFiat(new BigNumber(0.005), 'USD')).toBe('<$0.01');
+      expect(formatFiat(new BigNumber(0.0049), 'USD')).toBe('<$0.01');
+    });
+
+    it('does not display "<" prefix for exactly 0.01', () => {
+      expect(formatFiat(new BigNumber(0.01), 'USD')).toBe('$0.01');
+    });
+
+    it('does not display "<" prefix for amounts greater than 0.01', () => {
+      expect(formatFiat(new BigNumber(0.02), 'USD')).toBe('$0.02');
+    });
+  });
+
+  describe('currency handling', () => {
+    it('formats EUR correctly', () => {
+      I18n.locale = 'fr-FR';
+
+      expect(formatFiat(new BigNumber(1000), 'EUR')).toContain('1');
+      expect(formatFiat(new BigNumber(1000), 'EUR')).toContain('000');
+    });
+
+    it('formats GBP correctly', () => {
+      I18n.locale = 'en-GB';
+
+      expect(formatFiat(new BigNumber(1000), 'GBP')).toBe('£1,000');
+      expect(formatFiat(new BigNumber(500.5), 'GBP')).toBe('£500.50');
+      expect(formatFiat(new BigNumber(0), 'GBP')).toBe('£0');
+    });
+
+    it('gracefully handles unknown currencies by returning amount followed by currency code', () => {
+      expect(
+        formatFiat(new BigNumber('98754321987654321987654321'), 'storj'),
+      ).toBe('98754321987654321987654321 storj');
+      expect(formatFiat(new BigNumber(1000), 'storj')).toBe('1000 storj');
+      expect(formatFiat(new BigNumber(500.5), 'storj')).toBe('500.5 storj');
+      expect(formatFiat(new BigNumber(0), 'storj')).toBe('0 storj');
+    });
+
+    it('removes "US$" prefix and replaces with "$"', () => {
+      const result = formatFiat(new BigNumber(1000), 'USD');
+      expect(result).not.toContain('US$');
+      expect(result).toBe('$1,000');
+    });
+  });
+
+  describe('edge cases', () => {
+    it('handles very small non-zero amounts', () => {
+      expect(formatFiat(new BigNumber(0.001), 'USD')).toBe('<$0.01');
+      expect(formatFiat(new BigNumber(0.00001), 'USD')).toBe('<$0.01');
+    });
+
+    it('handles negative amounts', () => {
+      expect(formatFiat(new BigNumber(-1000), 'USD')).toBe('-$1,000');
+      expect(formatFiat(new BigNumber(-500.5), 'USD')).toBe('-$500.50');
+    });
+
+    it('handles amounts with many decimal places', () => {
+      expect(formatFiat(new BigNumber(123.456789), 'USD')).toBe('$123.46');
+    });
+  });
+
+  describe('locale variations', () => {
+    it('respects locale formatting for en-US', () => {
+      I18n.locale = 'en-US';
+      expect(formatFiat(new BigNumber(1234567.89), 'USD')).toBe(
+        '$1,234,567.89',
+      );
+    });
+
+    it('respects locale formatting for de-DE', () => {
+      I18n.locale = 'de-DE';
+      const result = formatFiat(new BigNumber(1234567.89), 'EUR');
+      // German locale uses different separators
+      expect(result).toContain('1');
+      expect(result).toContain('234');
+      expect(result).toContain('567');
+    });
+  });
+});
diff --git a/app/util/formatFiat.ts b/app/util/formatFiat.ts
new file mode 100644
index 000000000000..4ad158343207
--- /dev/null
+++ b/app/util/formatFiat.ts
@@ -0,0 +1,45 @@
+import { BigNumber } from 'bignumber.js';
+import I18n from '../../locales/i18n';
+import { getIntlNumberFormatter } from './intl';
+
+/**
+ * Formats a fiat amount as a localized string.
+ *
+ * Example usage:
+ *
+ * ```
+ * const formattedAmount = formatFiat(new BigNumber(1000), 'usd');
+ * ```
+ *
+ * @returns A formatted string.
+ */
+const formatFiat = (fiatAmount: BigNumber, currency?: string) => {
+  const hasDecimals = !fiatAmount.isInteger();
+
+  const isSmall =
+    fiatAmount.toFixed(2, BigNumber.ROUND_DOWN) === '0.00' &&
+    !fiatAmount.isZero();
+
+  const value = isSmall ? 0.01 : fiatAmount.toFixed();
+  let result: string;
+
+  try {
+    result = getIntlNumberFormatter(I18n.locale, {
+      style: 'currency',
+      currency,
+      minimumFractionDigits: hasDecimals ? 2 : 0,
+      // string is valid parameter for format function
+      // for some reason it gives TS issue
+      // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat/format#number
+    }).format(value as unknown as number);
+  } catch (error) {
+    // Fallback for unknown or unsupported currencies
+    result = `${value} ${currency}`;
+  }
+
+  result = result.replace('US$', '$');
+
+  return isSmall ? `<${result}` : result;
+};
+
+export default formatFiat;
diff --git a/app/util/logs/__snapshots__/index.test.ts.snap b/app/util/logs/__snapshots__/index.test.ts.snap
index 29a6c4fb17f2..e051f2e0bbfa 100644
--- a/app/util/logs/__snapshots__/index.test.ts.snap
+++ b/app/util/logs/__snapshots__/index.test.ts.snap
@@ -30,6 +30,7 @@ exports[`logs :: generateStateLogs Sanitized SeedlessOnboardingController State
       },
       "AiDigestController": {
         "marketInsights": {},
+        "marketOverview": null,
       },
       "AnalyticsController": {
         "analyticsId": "59710bcf-06cc-4247-9386-12425e7fc905",
@@ -66,6 +67,13 @@ exports[`logs :: generateStateLogs Sanitized SeedlessOnboardingController State
       "BridgeStatusController": {
         "txHistory": {},
       },
+      "CardController": {
+        "activeProviderId": null,
+        "cardholderAccounts": [],
+        "isAuthenticated": false,
+        "providerData": {},
+        "selectedCountry": null,
+      },
       "ConnectivityController": {
         "connectivityStatus": "online",
       },
@@ -498,13 +506,8 @@ exports[`logs :: generateStateLogs Sanitized SeedlessOnboardingController State
       "PerpsController": {
         "accountState": null,
         "activeProvider": "hyperliquid",
-        "cachedAccountState": null,
-        "cachedMarketData": null,
-        "cachedMarketDataTimestamp": 0,
-        "cachedOrders": null,
-        "cachedPositions": null,
-        "cachedUserDataAddress": null,
-        "cachedUserDataTimestamp": 0,
+        "cachedMarketDataByProvider": {},
+        "cachedUserDataByProvider": {},
         "depositInProgress": false,
         "depositRequests": [],
         "hasPlacedFirstOrder": {
@@ -634,6 +637,7 @@ exports[`logs :: generateStateLogs Sanitized SeedlessOnboardingController State
             },
           },
         },
+        "orders": [],
         "paymentMethods": {
           "data": [],
           "error": null,
@@ -884,6 +888,7 @@ exports[`logs :: generateStateLogs generates a valid json export 1`] = `
       },
       "AiDigestController": {
         "marketInsights": {},
+        "marketOverview": null,
       },
       "AnalyticsController": {
         "analyticsId": "59710bcf-06cc-4247-9386-12425e7fc905",
@@ -920,6 +925,13 @@ exports[`logs :: generateStateLogs generates a valid json export 1`] = `
       "BridgeStatusController": {
         "txHistory": {},
       },
+      "CardController": {
+        "activeProviderId": null,
+        "cardholderAccounts": [],
+        "isAuthenticated": false,
+        "providerData": {},
+        "selectedCountry": null,
+      },
       "ConnectivityController": {
         "connectivityStatus": "online",
       },
@@ -1352,13 +1364,8 @@ exports[`logs :: generateStateLogs generates a valid json export 1`] = `
       "PerpsController": {
         "accountState": null,
         "activeProvider": "hyperliquid",
-        "cachedAccountState": null,
-        "cachedMarketData": null,
-        "cachedMarketDataTimestamp": 0,
-        "cachedOrders": null,
-        "cachedPositions": null,
-        "cachedUserDataAddress": null,
-        "cachedUserDataTimestamp": 0,
+        "cachedMarketDataByProvider": {},
+        "cachedUserDataByProvider": {},
         "depositInProgress": false,
         "depositRequests": [],
         "hasPlacedFirstOrder": {
@@ -1488,6 +1495,7 @@ exports[`logs :: generateStateLogs generates a valid json export 1`] = `
             },
           },
         },
+        "orders": [],
         "paymentMethods": {
           "data": [],
           "error": null,
diff --git a/app/util/networks/customNetworks.tsx b/app/util/networks/customNetworks.tsx
index 728c02fe92a2..fa354ffaeb75 100644
--- a/app/util/networks/customNetworks.tsx
+++ b/app/util/networks/customNetworks.tsx
@@ -27,6 +27,7 @@ export const QUICKNODE_ENDPOINT_URLS_BY_INFURA_NETWORK_NAME = {
   'bsc-mainnet': () => process.env.QUICKNODE_BSC_URL,
   'sei-mainnet': () => process.env.QUICKNODE_SEI_URL,
   'monad-mainnet': () => process.env.QUICKNODE_MONAD_URL,
+  'hyperevm-mainnet': () => process.env.QUICKNODE_HYPEREVM_URL,
 };
 
 export function getFailoverUrlsForInfuraNetwork(
@@ -93,8 +94,8 @@ export const PopularList = [
   {
     chainId: toHex('999'),
     nickname: 'HyperEVM',
-    rpcUrl: 'https://rpc.hyperliquid.xyz/evm',
-    failoverRpcUrls: [],
+    rpcUrl: `https://hyperevm-mainnet.infura.io/v3/${infuraProjectId}`,
+    failoverRpcUrls: getFailoverUrlsForInfuraNetwork('hyperevm-mainnet'),
     ticker: 'HYPE',
     warning: true,
     rpcPrefs: {
@@ -387,6 +388,7 @@ export const NETWORK_CHAIN_ID: {
   readonly ROOTSTOCK: '0x1e';
   readonly ROOTSTOCK_TESTNET: '0x1f';
   readonly TEMPO_TESTNET: '0xa5bf';
+  readonly TEMPO_MAINNET: '0x1079';
   readonly CHILIZ: '0x15b38';
 } & typeof CHAIN_IDS = {
   FLARE_MAINNET: '0xe',
@@ -431,6 +433,7 @@ export const NETWORK_CHAIN_ID: {
   ROOTSTOCK: '0x1e',
   ROOTSTOCK_TESTNET: '0x1f',
   TEMPO_TESTNET: '0xa5bf',
+  TEMPO_MAINNET: '0x1079',
   CHILIZ: '0x15b38',
   ...CHAIN_IDS,
 };
@@ -480,5 +483,6 @@ export const CustomNetworkImgMapping: Record<Hex, string> = {
   [NETWORK_CHAIN_ID.ROOTSTOCK]: require('../../images/rootstock.png'),
   [NETWORK_CHAIN_ID.ROOTSTOCK_TESTNET]: require('../../images/rootstock.png'),
   [NETWORK_CHAIN_ID.TEMPO_TESTNET]: require('../../images/tempo.png'),
+  [NETWORK_CHAIN_ID.TEMPO_MAINNET]: require('../../images/tempo.png'),
   [NETWORK_CHAIN_ID.CHILIZ]: require('../../images/chiliz.png'),
 };
diff --git a/app/util/networks/index.js b/app/util/networks/index.js
index 379bf693d9e6..62df848cc7fc 100644
--- a/app/util/networks/index.js
+++ b/app/util/networks/index.js
@@ -343,6 +343,21 @@ export const isTestNetworkWithFaucet = (chainId) =>
  */
 export const isTestNet = (chainId) => TESTNET_CHAIN_IDS.includes(chainId);
 
+/**
+ * Returns whether the network can be deleted by the user.
+ * Aligns with NetworkSelector: mainnet, Linea mainnet, and testnets cannot be removed.
+ *
+ * @param {string} chainId - The chain ID to check (e.g. '0x1', '0x89').
+ * @returns {boolean} True if the network can be deleted, false otherwise.
+ */
+export const canDeleteNetwork = (chainId) =>
+  Boolean(
+    chainId &&
+      !isTestNet(chainId) &&
+      !isMainNet(chainId) &&
+      !isLineaMainnetChainId(chainId),
+  );
+
 export function getNetworkTypeById(id) {
   if (!id) {
     throw new Error(NetworkSwitchErrorType.missingNetworkId);
diff --git a/app/util/networks/index.test.ts b/app/util/networks/index.test.ts
index d79efe305dbe..60c1a04da1ba 100644
--- a/app/util/networks/index.test.ts
+++ b/app/util/networks/index.test.ts
@@ -19,6 +19,7 @@ import NetworkList, {
   isWhitelistedSymbol,
   isWhitelistedRpcUrl,
   isWhitelistedNetworkName,
+  canDeleteNetwork,
 } from '.';
 import {
   convertNetworkId,
@@ -162,6 +163,33 @@ describe('network-utils', () => {
     });
   });
 
+  describe('canDeleteNetwork', () => {
+    it('returns false for Ethereum mainnet', () => {
+      expect(canDeleteNetwork('0x1')).toBe(false);
+    });
+    it('returns false for Linea mainnet', () => {
+      expect(canDeleteNetwork(NETWORKS_CHAIN_ID.LINEA_MAINNET)).toBe(false);
+    });
+    it('returns false for Goerli', () => {
+      expect(canDeleteNetwork(NETWORKS_CHAIN_ID.GOERLI)).toBe(false);
+    });
+    it.each(TESTNET_CHAIN_IDS)(
+      'returns false for testnet chain ID %s',
+      (chainId) => {
+        expect(canDeleteNetwork(chainId)).toBe(false);
+      },
+    );
+    it('returns false for empty/falsy chainId', () => {
+      expect(canDeleteNetwork('')).toBe(false);
+    });
+    it('returns true for custom mainnet (e.g. Polygon)', () => {
+      expect(canDeleteNetwork(NETWORKS_CHAIN_ID.POLYGON)).toBe(true);
+    });
+    it('returns true for custom chain ID 0x2a', () => {
+      expect(canDeleteNetwork('0x2a')).toBe(true);
+    });
+  });
+
   describe('getNetworkTypeById', () => {
     it.each([getAllNetworks()])(
       'should get network type by Id - %s',
diff --git a/app/util/notifications/hooks/useNotifications.test.tsx b/app/util/notifications/hooks/useNotifications.test.tsx
index 8953082233a0..24fab2a9057d 100644
--- a/app/util/notifications/hooks/useNotifications.test.tsx
+++ b/app/util/notifications/hooks/useNotifications.test.tsx
@@ -25,6 +25,14 @@ jest.mock('../constants', () => ({
   isNotificationsFeatureEnabled: () => true,
 }));
 
+jest.mock('./usePushNotifications', () => ({
+  usePushNotificationsToggle: jest.fn(),
+}));
+
+beforeEach(() => {
+  jest.clearAllMocks();
+});
+
 describe('useNotifications - useListNotifications()', () => {
   const arrangeMocks = () => {
     const mockFetchNotifications = jest.spyOn(Actions, 'fetchNotifications');
@@ -76,7 +84,7 @@ describe('useNotifications - useEnableNotifications()', () => {
   const arrangeMocks = () => {
     const mockTogglePushNotification = jest.fn().mockResolvedValue(true);
     const mockUsePushNotificationsToggle = jest
-      .spyOn(UsePushNotifications, 'usePushNotificationsToggle')
+      .mocked(UsePushNotifications.usePushNotificationsToggle)
       .mockReturnValue({
         data: true,
         loading: false,
@@ -138,7 +146,7 @@ describe('useNotifications - useDisableNotifications()', () => {
   const arrangeMocks = () => {
     const mockTogglePushNotification = jest.fn().mockResolvedValue(true);
     const mockUsePushNotificationsToggle = jest
-      .spyOn(UsePushNotifications, 'usePushNotificationsToggle')
+      .mocked(UsePushNotifications.usePushNotificationsToggle)
       .mockReturnValue({
         data: true,
         loading: false,
diff --git a/app/util/termsOfUse/index.test.tsx b/app/util/termsOfUse/index.test.tsx
index b801aea68201..7f9bb5d89380 100644
--- a/app/util/termsOfUse/index.test.tsx
+++ b/app/util/termsOfUse/index.test.tsx
@@ -1,5 +1,6 @@
-import { MetaMetrics, MetaMetricsEvents } from '../../core/Analytics';
-import { MetricsEventBuilder } from '../../core/Analytics/MetricsEventBuilder';
+import { MetaMetricsEvents } from '../../core/Analytics';
+import { AnalyticsEventBuilder } from '../analytics/AnalyticsEventBuilder';
+import { analytics } from '../analytics/analytics';
 import { TRUE, USE_TERMS } from '../../constants/storage';
 import Routes from '../../constants/navigation/Routes';
 import { strings } from '../../../locales/i18n';
@@ -8,22 +9,18 @@ import StorageWrapper from '../../store/storage-wrapper';
 import navigateTermsOfUse from './termsOfUse';
 import termsOfUse from './termsOfUseContent';
 
-jest.mock('../../core/Analytics');
+jest.mock('../analytics/analytics');
 jest.mock('../../store/storage-wrapper');
 jest.mock('../../../locales/i18n');
 
 describe('Terms of Use', () => {
   const mockNavigate = jest.fn();
   const mockOnAccept = jest.fn();
-  const mockTrackEvent = jest.fn();
   const mockGetItem = jest.fn();
   const mockSetItem = jest.fn();
 
   beforeEach(() => {
     jest.clearAllMocks();
-    (MetaMetrics.getInstance as jest.Mock).mockReturnValue({
-      trackEvent: mockTrackEvent,
-    });
     (StorageWrapper.getItem as jest.Mock) = mockGetItem;
     (StorageWrapper.setItem as jest.Mock) = mockSetItem;
     (strings as jest.Mock).mockImplementation((key) => key);
@@ -75,8 +72,8 @@ describe('Terms of Use', () => {
 
       expect(mockSetItem).toHaveBeenCalledWith(USE_TERMS, TRUE);
       expect(mockOnAccept).toHaveBeenCalled();
-      expect(mockTrackEvent).toHaveBeenCalledWith(
-        MetricsEventBuilder.createEventBuilder(
+      expect(jest.mocked(analytics.trackEvent)).toHaveBeenCalledWith(
+        AnalyticsEventBuilder.createEventBuilder(
           MetaMetricsEvents.USER_TERMS_ACCEPTED,
         ).build(),
       );
@@ -90,8 +87,8 @@ describe('Terms of Use', () => {
       await onAccept();
 
       expect(mockSetItem).toHaveBeenCalledWith(USE_TERMS, TRUE);
-      expect(mockTrackEvent).toHaveBeenCalledWith(
-        MetricsEventBuilder.createEventBuilder(
+      expect(jest.mocked(analytics.trackEvent)).toHaveBeenCalledWith(
+        AnalyticsEventBuilder.createEventBuilder(
           MetaMetricsEvents.USER_TERMS_ACCEPTED,
         ).build(),
       );
@@ -106,8 +103,8 @@ describe('Terms of Use', () => {
       const { onRender } = mockNavigate.mock.calls[0][1].params;
       onRender();
 
-      expect(mockTrackEvent).toHaveBeenCalledWith(
-        MetricsEventBuilder.createEventBuilder(
+      expect(jest.mocked(analytics.trackEvent)).toHaveBeenCalledWith(
+        AnalyticsEventBuilder.createEventBuilder(
           MetaMetricsEvents.USER_TERMS_SHOWN,
         ).build(),
       );
diff --git a/app/util/termsOfUse/termsOfUse.ts b/app/util/termsOfUse/termsOfUse.ts
index b68cb4de82c3..1c05f9c8dcb3 100644
--- a/app/util/termsOfUse/termsOfUse.ts
+++ b/app/util/termsOfUse/termsOfUse.ts
@@ -1,5 +1,6 @@
-import { MetaMetrics, MetaMetricsEvents } from '../../core/Analytics';
-import { MetricsEventBuilder } from '../../core/Analytics/MetricsEventBuilder';
+import { MetaMetricsEvents } from '../../core/Analytics';
+import { analytics } from '../analytics/analytics';
+import { AnalyticsEventBuilder } from '../analytics/AnalyticsEventBuilder';
 import { TRUE, USE_TERMS } from '../../constants/storage';
 import Routes from '../../constants/navigation/Routes';
 import { strings } from '../../../locales/i18n';
@@ -32,16 +33,16 @@ const onConfirmUseTerms = async (onAccept?: () => void) => {
   if (onAccept) {
     onAccept();
   }
-  MetaMetrics.getInstance().trackEvent(
-    MetricsEventBuilder.createEventBuilder(
+  analytics.trackEvent(
+    AnalyticsEventBuilder.createEventBuilder(
       MetaMetricsEvents.USER_TERMS_ACCEPTED,
     ).build(),
   );
 };
 
 const useTermsDisplayed = () => {
-  MetaMetrics.getInstance().trackEvent(
-    MetricsEventBuilder.createEventBuilder(
+  analytics.trackEvent(
+    AnalyticsEventBuilder.createEventBuilder(
       MetaMetricsEvents.USER_TERMS_SHOWN,
     ).build(),
   );
diff --git a/app/util/test/analyticsMock.ts b/app/util/test/analyticsMock.ts
index d32c9ffdf494..a6760ce602e0 100644
--- a/app/util/test/analyticsMock.ts
+++ b/app/util/test/analyticsMock.ts
@@ -4,6 +4,8 @@
  * that can be used across test files for consistency
  */
 
+import type { UseAnalyticsHook } from '../../components/hooks/useAnalytics/useAnalytics.types';
+
 export interface MockAnalytics {
   isEnabled: jest.Mock<boolean, []>;
   trackEvent: jest.Mock<void, [event: unknown]>;
@@ -52,3 +54,55 @@ export function createAnalyticsMockModule(overrides?: Partial<MockAnalytics>) {
     analytics: mockAnalytics,
   };
 }
+
+/**
+ * Creates a fresh `UseAnalyticsHook` mock on every call.
+ *
+ * Always use this factory rather than a shared constant, since
+ * `jest.resetAllMocks()` / `jest.clearAllMocks()` wipe mock implementations
+ * on any shared jest.fn() reference.
+ *
+ * @example
+ * jest.mocked(useAnalytics).mockReturnValue(
+ *   createMockUseAnalyticsHook({ trackEvent: mockTrackEvent }),
+ * );
+ *
+ * @example with beforeEach reset
+ * beforeEach(() => {
+ *   jest.resetAllMocks();
+ *   jest.mocked(useAnalytics).mockReturnValue(createMockUseAnalyticsHook());
+ * });
+ */
+export const createMockUseAnalyticsHook = (
+  overrides?: Partial<UseAnalyticsHook>,
+): UseAnalyticsHook => ({
+  trackEvent: jest.fn(),
+  createEventBuilder: jest.fn(() => ({
+    addProperties: jest.fn().mockReturnThis(),
+    addSensitiveProperties: jest.fn().mockReturnThis(),
+    removeProperties: jest.fn().mockReturnThis(),
+    removeSensitiveProperties: jest.fn().mockReturnThis(),
+    setSaveDataRecording: jest.fn().mockReturnThis(),
+    build: jest.fn().mockReturnValue({
+      name: 'mock-event',
+      properties: {},
+      sensitiveProperties: {},
+      saveDataRecording: false,
+    }),
+  })),
+  isEnabled: jest.fn().mockReturnValue(true),
+  identify: jest.fn().mockResolvedValue(undefined),
+  enable: jest.fn().mockResolvedValue(undefined),
+  addTraitsToUser: jest.fn().mockResolvedValue(undefined),
+  createDataDeletionTask: jest.fn().mockResolvedValue({ status: 'ok' }),
+  checkDataDeleteStatus: jest.fn().mockResolvedValue({
+    deletionRequestDate: undefined,
+    hasCollectedDataSinceDeletionRequest: false,
+    dataDeletionRequestStatus: 'UNKNOWN',
+  }),
+  getDeleteRegulationCreationDate: jest.fn().mockReturnValue('20/04/2024'),
+  getDeleteRegulationId: jest.fn().mockReturnValue('mock-regulation-id'),
+  isDataRecorded: jest.fn().mockReturnValue(true),
+  getAnalyticsId: jest.fn().mockResolvedValue('mock-analytics-id'),
+  ...overrides,
+});
diff --git a/app/util/test/initial-background-state.json b/app/util/test/initial-background-state.json
index b00773dafc05..ec92df286c90 100644
--- a/app/util/test/initial-background-state.json
+++ b/app/util/test/initial-background-state.json
@@ -516,13 +516,8 @@
     "hip3ConfigVersion": 0,
     "perpsBalances": {},
     "selectedPaymentToken": null,
-    "cachedMarketData": null,
-    "cachedMarketDataTimestamp": 0,
-    "cachedPositions": null,
-    "cachedOrders": null,
-    "cachedAccountState": null,
-    "cachedUserDataTimestamp": 0,
-    "cachedUserDataAddress": null
+    "cachedMarketDataByProvider": {},
+    "cachedUserDataByProvider": {}
   },
   "RemoteFeatureFlagController": {
     "cacheTimestamp": 0,
@@ -679,6 +674,13 @@
   "BridgeStatusController": {
     "txHistory": {}
   },
+  "CardController": {
+    "selectedCountry": null,
+    "activeProviderId": null,
+    "isAuthenticated": false,
+    "cardholderAccounts": [],
+    "providerData": {}
+  },
   "ConnectivityController": {
     "connectivityStatus": "online"
   },
@@ -769,7 +771,8 @@
     "accountMeta": {}
   },
   "AiDigestController": {
-    "marketInsights": {}
+    "marketInsights": {},
+    "marketOverview": null
   },
   "RampsController": {
     "userRegion": null,
@@ -820,6 +823,7 @@
         }
       }
     },
-    "requests": {}
+    "requests": {},
+    "orders": []
   }
 }
diff --git a/app/util/test/testSetup.js b/app/util/test/testSetup.js
index 4b9b7d962ecb..12443e1d5f82 100644
--- a/app/util/test/testSetup.js
+++ b/app/util/test/testSetup.js
@@ -209,32 +209,9 @@ jest.mock('../../core/NotificationManager', () => ({
   showSimpleNotification: jest.fn(),
 }));
 
-const createMockAnalyticsEventBuilder = () => ({
-  addProperties: jest.fn().mockReturnThis(),
-  addSensitiveProperties: jest.fn().mockReturnThis(),
-  removeProperties: jest.fn().mockReturnThis(),
-  removeSensitiveProperties: jest.fn().mockReturnThis(),
-  setSaveDataRecording: jest.fn().mockReturnThis(),
-  build: jest.fn(() => ({})),
-});
+const { createMockUseAnalyticsHook } = require('./analyticsMock');
 
-const mockUseAnalytics = {
-  trackEvent: jest.fn(),
-  createEventBuilder: jest.fn(() => createMockAnalyticsEventBuilder()),
-  isEnabled: jest.fn().mockReturnValue(true),
-  enable: jest.fn().mockResolvedValue(undefined),
-  addTraitsToUser: jest.fn().mockResolvedValue(undefined),
-  createDataDeletionTask: jest.fn().mockResolvedValue({ status: 'ok' }),
-  checkDataDeleteStatus: jest.fn().mockResolvedValue({
-    deletionRequestDate: undefined,
-    hasCollectedDataSinceDeletionRequest: false,
-    dataDeletionRequestStatus: 'UNKNOWN',
-  }),
-  getDeleteRegulationCreationDate: jest.fn().mockReturnValue('20/04/2024'),
-  getDeleteRegulationId: jest.fn().mockReturnValue('mock-regulation-id'),
-  isDataRecorded: jest.fn().mockReturnValue(true),
-  getAnalyticsId: jest.fn().mockResolvedValue('mock-analytics-id'),
-};
+const mockUseAnalytics = createMockUseAnalyticsHook();
 
 jest.mock('../../components/hooks/useAnalytics/useAnalytics', () => ({
   useAnalytics: jest.fn(() => mockUseAnalytics),
diff --git a/babel.config.tests.js b/babel.config.tests.js
index 91a8f51546fc..4744648f4e3f 100644
--- a/babel.config.tests.js
+++ b/babel.config.tests.js
@@ -13,9 +13,6 @@ const newOverrides = [
     exclude: [
       'app/components/UI/Earn/selectors/featureFlags/index.ts',
       'app/components/UI/Perps/selectors/featureFlags/index.ts',
-      'app/components/UI/Predict/selectors/featureFlags/index.ts',
-      'app/selectors/featureFlagController/legalNotices/index.ts',
-      'app/selectors/featureFlagController/networkBlacklist/index.ts',
       'app/core/Engine/controllers/network-controller/utils.ts',
       'app/core/Engine/controllers/network-controller/utils.test.ts',
       'app/core/Engine/controllers/gator-permissions-controller/gator-permissions-controller-init.ts',
@@ -32,6 +29,8 @@ const newOverrides = [
       'app/components/UI/Ramp/hooks/useRampsUnifiedV1Enabled.test.ts',
       'app/components/UI/Ramp/hooks/useRampsUnifiedV2Enabled.ts',
       'app/components/UI/Ramp/hooks/useRampsUnifiedV2Enabled.test.ts',
+      'app/components/UI/Ramp/utils/isRampsUnifiedV2Enabled.ts',
+      'app/components/UI/Ramp/utils/isRampsUnifiedV2Enabled.test.ts',
       'app/components/UI/Ramp/hooks/useRampsSmartRouting.ts',
       'app/components/UI/Ramp/hooks/useRampsSmartRouting.test.ts',
       'app/components/UI/Ramp/hooks/useRampTokens.ts',
diff --git a/bitrise.yml b/bitrise.yml
index 2c29506f5d22..0e2421d7717e 100644
--- a/bitrise.yml
+++ b/bitrise.yml
@@ -130,7 +130,7 @@ pipelines:
         - pr_check_build_cache
   expo_dev_pipeline:
     stages:
-      - create_build_qa_and_expo: {}
+      - create_build_dev_expo: {}
       # - app_launch_times_test_stage: {}
   #Main expo pipeline
   expo_main_pipeline:
@@ -254,13 +254,11 @@ stages:
   deploy_android_release:
     workflows:
       - deploy_android_to_store: {}
-  create_build_qa_and_expo:
+  create_build_dev_expo:
     workflows:
       - build_android_devbuild: {}
-      - build_android_qa: {}
       - build_ios_devbuild: {}
       - build_ios_simbuild: {}
-      - build_ios_qa: {}
   create_build_main_expo:
     workflows:
       - build_android_devbuild: {}
@@ -2374,6 +2372,15 @@ workflows:
             - pipeline_intermediate_files: $PROJECT_LOCATION/app/build/outputs/bundle/$OUTPUT_PATH/$RENAMED_AAB_FILE:BITRISE_PLAY_STORE_ABB_PATH
             - deploy_path: $PROJECT_LOCATION/app/build/outputs/bundle/$OUTPUT_PATH/$RENAMED_AAB_FILE
           title: Bitrise Deploy AAB
+      - deploy-to-bitrise-io@2.2.3:
+          is_always_run: false
+          is_skippable: true
+          run_if: '{{not (enveq "IS_DEV_BUILD" "true")}}'
+          inputs:
+            - deploy_path: $PROJECT_LOCATION/app/build/generated/sourcemaps/react/$OUTPUT_PATH
+            - is_compress: true
+            - zip_name: Android_Sourcemaps_$OUTPUT_PATH
+          title: Deploy Android Sourcemaps
       - script@1:
           title: Prepare Android build outputs for caching
           run_if: '{{and (getenv "ANDROID_PR_BUILD_CACHE_KEY" | ne "") (getenv "SHARE_WITH_DETOX" | eq "true")}}'
@@ -3050,6 +3057,14 @@ workflows:
           inputs:
             - deploy_path: ios/build/$RENAMED_ARCHIVE_FILE
           title: Deploy Symbols File
+      - deploy-to-bitrise-io@2.2.3:
+          is_always_run: false
+          is_skippable: true
+          run_if: '{{not (enveq "IS_SIM_BUILD" "true")}}' # Only run for physical builds
+          inputs:
+            - pipeline_intermediate_files: sourcemaps/ios/index.js.map:BITRISE_APP_STORE_SOURCEMAP_PATH
+            - deploy_path: sourcemaps/ios/index.js.map
+          title: Deploy Source Map
       - save-cache@1:
           title: Save iOS PR Build Cache
           run_if: '{{and (getenv "IOS_PR_BUILD_CACHE_KEY" | ne "") (getenv "SHARE_WITH_DETOX" | eq "true")}}'
@@ -3076,7 +3091,7 @@ workflows:
             - paths: /tmp/last-build-commit
     meta:
       bitrise.io:
-        stack: osx-xcode-16.3.x
+        stack: osx-xcode-26.2.x
         machine_type_id: g2.mac.4large
   # TODO: Remove this workflow once new build configuration is consolidated
   build_ios_release:
@@ -3432,7 +3447,7 @@ workflows:
                 echo "🧹 Cleaned up API key file"
     meta:
       bitrise.io:
-        stack: osx-xcode-16.3.x
+        stack: osx-xcode-26.2.x
         machine_type_id: g2.mac.4large
   set_main_target_workflow:
     steps:
@@ -3516,16 +3531,16 @@ app:
       PROJECT_LOCATION_IOS: ios
     - opts:
         is_expand: false
-      VERSION_NAME: 7.68.1
+      VERSION_NAME: 7.69.0
     - opts:
         is_expand: false
-      VERSION_NUMBER: 4009
+      VERSION_NUMBER: 4015
     - opts:
         is_expand: false
-      FLASK_VERSION_NAME: 7.68.1
+      FLASK_VERSION_NAME: 7.69.0
     - opts:
         is_expand: false
-      FLASK_VERSION_NUMBER: 4009
+      FLASK_VERSION_NUMBER: 4015
     - opts:
         is_expand: false
       ANDROID_APK_LINK: ''
@@ -3555,7 +3570,7 @@ app:
       SEEDLESS_ONBOARDING_ENABLED: true
 meta:
   bitrise.io:
-    stack: osx-xcode-16.3.x
+    stack: osx-xcode-26.2.x
     machine_type_id: g2.mac.4large
 trigger_map:
   # Disable auto RC generation
diff --git a/builds.yml b/builds.yml
index 7cee1b608cc6..127d5d22a737 100644
--- a/builds.yml
+++ b/builds.yml
@@ -4,14 +4,12 @@
 # Usage:
 #   - CI reads this file to configure builds
 #   - Local dev can override via .js.env (takes precedence)
-#   - LaunchDarkly overrides remote_feature_flags at runtime
 #
 # Structure:
 #   - env: sets environment variables directly (servers, build config, etc.)
 #   - secrets: maps env var names to GitHub Secret names
 #   - signing: (optional) AWS role + secret for code signing (omit for dev/simulator builds)
 #   - code_fencing: features to include via code fencing
-#   - remote_feature_flags: build-time defaults for LaunchDarkly flags (seeded into RemoteFeatureFlagController)
 #
 # GitHub Environment determines actual secret values - builds.yml just maps the names.
 # Signing: AWS Secrets Manager (Account 363762752069) - see Mobile Signer Roles & Secrets doc.
@@ -27,6 +25,7 @@ _public_envs: &public_envs # Servers (production)
   SECURITY_ALERTS_API_URL: 'https://security-alerts.api.cx.metamask.io'
   DECODING_API_URL: 'https://signature-insights.api.cx.metamask.io/v1'
   AUTH_SERVICE_URL: 'https://auth-service.api.cx.metamask.io'
+  DIGEST_API_URL: 'https://digest-api.api.cx.metamask.io/api/v1'
   REWARDS_API_URL: 'https://rewards.api.cx.metamask.io'
   BAANX_API_URL: 'https://api.baanx.com'
   RAMPS_ENVIRONMENT: 'production'
@@ -41,6 +40,8 @@ _public_envs: &public_envs # Servers (production)
   MM_PERPS_HIP3_ALLOWLIST_MARKETS: ''
   MM_PERPS_HIP3_BLOCKLIST_MARKETS: ''
   MM_PERPS_HIP3_ENABLED: 'true'
+  # Temporary flag to enable builds with GitHub Actions, remove it when deprecating bitrise
+  BUILDS_ENABLED_WITH_GH_ACTIONS_TEMPORARY: 'true'
 
 # Common secrets (shared across ALL builds - same names, GitHub Environment determines values)
 _secrets: &secrets # Infrastructure
@@ -79,8 +80,6 @@ _secrets: &secrets # Infrastructure
   QUICKNODE_MONAD_URL: 'QUICKNODE_MONAD_URL'
   QUICKNODE_OPTIMISM_URL: 'QUICKNODE_OPTIMISM_URL'
   QUICKNODE_POLYGON_URL: 'QUICKNODE_POLYGON_URL'
-  QUICKNODE_BSC_URL: 'QUICKNODE_BSC_URL'
-  QUICKNODE_SEI_URL: 'QUICKNODE_SEI_URL'
   QUICKNODE_HYPEREVM_URL: 'QUICKNODE_HYPEREVM_URL'
   # OAuth
   IOS_GOOGLE_CLIENT_ID: 'IOS_GOOGLE_CLIENT_ID'
@@ -90,6 +89,8 @@ _secrets: &secrets # Infrastructure
   ANDROID_GOOGLE_SERVER_CLIENT_ID: 'ANDROID_GOOGLE_SERVER_CLIENT_ID'
   # Card/Baanx
   MM_CARD_BAANX_API_CLIENT_KEY: 'MM_CARD_BAANX_API_CLIENT_KEY'
+  # Expo
+  EXPO_PROJECT_ID: 'EXPO_PROJECT_ID'
 
 # Signing config (AWS Secrets Manager) - omit for dev/simulator builds
 # android_keystore_path: filename in android/keystores/ (build.gradle expects fixed paths)
@@ -155,157 +156,6 @@ _code_fencing_flask: &code_fencing_flask
   - bitcoin
   - tron
 
-# =============================================================================
-# Remote Feature Flags - Build-time defaults (seeded into RemoteFeatureFlagController)
-# LaunchDarkly will override these at runtime
-# Production (conservative) defaults - override in dev/exp builds as needed
-# =============================================================================
-_remote_feature_flags: &remote_feature_flags
-  # Bitcoin/Tron/Multichain accounts (prod LD values — each uses a custom type-guard validator)
-  bitcoinAccounts:
-    enabled: true
-    minimumVersion: '7.59.0'
-  tronAccounts:
-    enabled: true
-    minimumVersion: '7.61.6'
-  # enableMultichainAccounts requires the extra featureVersion field (assertMultichainAccountsFeatureFlagType)
-  enableMultichainAccounts:
-    enabled: true
-    featureVersion: '1'
-    minimumVersion: '7.53.0'
-  enableMultichainAccountsState2:
-    enabled: true
-    featureVersion: '2'
-    minimumVersion: '7.57.0'
-  # Perps (prod LD values — version gates preserved for safety)
-  perpsPerpTradingEnabled:
-    enabled: true
-    minimumVersion: '7.56.2'
-  perpsPerpTradingServiceInterruptionBannerEnabled:
-    enabled: false
-    minimumVersion: '0.0.0'
-  perpsPerpGtmOnboardingModalEnabled:
-    enabled: false
-    minimumVersion: '0.0.0'
-  perpsOrderBookEnabled:
-    enabled: false
-    minimumVersion: '0.0.0'
-  perpsFeedbackEnabled:
-    enabled: true
-    minimumVersion: '7.62.0'
-  perpsHip3Enabled:
-    enabled: true
-    minimumVersion: '7.60.4'
-  # LD sends { enabled: false } without minimumVersion — keeping minimumVersion for selector type-guard
-  perpsTradeWithAnyTokenIsEnabled:
-    enabled: false
-    minimumVersion: '7.66.0'
-  perpsMyxProviderEnabled:
-    enabled: false
-    minimumVersion: '0.0.0'
-  rewardsReferralCodeEnabled:
-    enabled: false
-    minimumVersion: '0.0.0'
-  # Earn/Staking
-  earnPooledStakingEnabled:
-    enabled: true
-    minimumVersion: '7.47.0'
-  earnPooledStakingServiceInterruptionBannerEnabled:
-    enabled: false
-    minimumVersion: '0.0.0'
-  earnStablecoinLendingEnabled:
-    enabled: true
-    minimumVersion: '7.51.0'
-  earnStablecoinLendingServiceInterruptionBannerEnabled:
-    enabled: false
-    minimumVersion: '0.0.0'
-  earnMusdConversionFlowEnabled:
-    enabled: true
-    minimumVersion: '7.65.0'
-  earnMusdCtaEnabled:
-    enabled: true
-    minimumVersion: '7.65.0'
-  earnMusdConversionAssetOverviewCtaEnabled:
-    enabled: true
-    minimumVersion: '7.65.0'
-  earnMusdConversionTokenListItemCtaEnabled:
-    enabled: true
-    minimumVersion: '7.65.0'
-  earnMusdConversionRewardsUiEnabled:
-    enabled: false
-    minimumVersion: '0.0.0'
-  earnMerklCampaignClaiming:
-    enabled: false
-    minimumVersion: '0.0.0'
-  # Predict
-  predictHotTab:
-    enabled: false
-    minimumVersion: '0.0.0'
-  # predictHomeFeaturedVariant has an extended structure: variant controls which layout is shown
-  predictHomeFeaturedVariant:
-    enabled: true
-    minimumVersion: '7.65.0'
-    variant: 'carousel'
-  predictGtmOnboardingModalEnabled:
-    enabled: true
-    minimumVersion: '7.60.0'
-  predictTradingEnabled:
-    enabled: true
-    minimumVersion: '7.60.0'
-  # Market Insights
-  aiSocialMarketAnalysisEnabled:
-    enabled: true
-    minimumVersion: '7.66.0'
-  # Card Features
-  # displayCardButton is a phased rollout in LD (10% enabled) — conservative disabled default
-  displayCardButton:
-    enabled: false
-    minimumVersion: '0.0.0'
-  cardExperimentalSwitch2:
-    enabled: true
-    minimumVersion: '7.58.1'
-  metalCardCheckoutEnabled:
-    enabled: false
-    minimumVersion: '0.0.0'
-  galileoAppleWalletInAppProvisioningEnabled:
-    enabled: false
-    minimumVersion: '0.0.0'
-  galileoGoogleWalletInAppProvisioningEnabled:
-    enabled: false
-    minimumVersion: '0.0.0'
-  # Homepage
-  homepageRedesignV1:
-    enabled: true
-    minimumVersion: '7.59.0'
-  homepageSectionsV1:
-    enabled: false
-    minimumVersion: '0.0.0'
-  # OTA Updates
-  otaUpdatesEnabled:
-    enabled: true
-    minimumVersion: '7.63.90'
-  # Token Details
-  tokenDetailsV2ButtonLayout:
-    enabled: false
-    minimumVersion: '7.67.0'
-  tokenListItemV2AbtestVersioned:
-    enabled: false
-    minimumVersion: '7.67.0'
-  # Tron Staking
-  trxStakingEnabled:
-    enabled: true
-    minimumVersion: '7.61.6'
-  # Assets
-  assetsAccountApiBalances:
-    - '0x1'
-    - '0xe708'
-    - '0x2105'
-    - '0x89'
-    - '0xa4b1'
-    - '0xa'
-    - '0x38'
-  additionalNetworksBlacklist: []
-
 # =============================================================================
 # Build Configurations
 # =============================================================================
@@ -327,7 +177,6 @@ builds:
       METAMASK_BUILD_TYPE: 'main'
     secrets: *secrets
     code_fencing: *code_fencing_main
-    remote_feature_flags: *remote_feature_flags
 
   # Beta (production APIs, RC signing; TestFlight / Play Store beta track)
   main-beta:
@@ -339,7 +188,6 @@ builds:
       METAMASK_BUILD_TYPE: 'main'
     secrets: *secrets
     code_fencing: *code_fencing_beta
-    remote_feature_flags: *remote_feature_flags
 
   # Release candidate
   main-rc:
@@ -351,7 +199,6 @@ builds:
       METAMASK_BUILD_TYPE: 'main'
     secrets: *secrets
     code_fencing: *code_fencing_main
-    remote_feature_flags: *remote_feature_flags
 
   # Test builds (QA)
   main-test:
@@ -364,6 +211,7 @@ builds:
       MM_PORTFOLIO_URL: 'https://portfolio.dev-api.cx.metamask.io'
       REWARDS_API_URL: 'https://rewards.uat-api.cx.metamask.io'
       BAANX_API_URL: 'https://dev.api.baanx.com'
+      DIGEST_API_URL: 'https://digest-api.dev-api.cx.metamask.io/api/v1'
       RAMPS_ENVIRONMENT: 'staging'
       BRIDGE_USE_DEV_APIS: 'true'
       RAMP_INTERNAL_BUILD: 'true'
@@ -372,7 +220,6 @@ builds:
       IS_SIM_BUILD: 'true'
     secrets: *secrets
     code_fencing: *code_fencing_main
-    remote_feature_flags: *remote_feature_flags
 
   # E2E test builds (no Sentry)
   main-e2e:
@@ -385,6 +232,7 @@ builds:
       MM_PORTFOLIO_URL: 'https://portfolio.dev-api.cx.metamask.io'
       REWARDS_API_URL: 'https://rewards.uat-api.cx.metamask.io'
       BAANX_API_URL: 'https://dev.api.baanx.com'
+      DIGEST_API_URL: 'https://digest-api.dev-api.cx.metamask.io/api/v1'
       RAMPS_ENVIRONMENT: 'staging'
       BRIDGE_USE_DEV_APIS: 'true'
       RAMP_INTERNAL_BUILD: 'true'
@@ -393,7 +241,6 @@ builds:
       IS_SIM_BUILD: 'true'
     secrets: *secrets
     code_fencing: *code_fencing_main
-    remote_feature_flags: *remote_feature_flags
 
   # Experimental builds
   main-exp:
@@ -406,6 +253,7 @@ builds:
       MM_PORTFOLIO_URL: 'https://portfolio.dev-api.cx.metamask.io'
       REWARDS_API_URL: 'https://rewards.uat-api.cx.metamask.io'
       BAANX_API_URL: 'https://dev.api.baanx.com'
+      DIGEST_API_URL: 'https://digest-api.dev-api.cx.metamask.io/api/v1'
       RAMPS_ENVIRONMENT: 'staging'
       BRIDGE_USE_DEV_APIS: 'true'
       RAMP_INTERNAL_BUILD: 'true'
@@ -413,7 +261,6 @@ builds:
       MM_ENABLE_SETTINGS_PAGE_DEV_OPTIONS: 'true'
     secrets: *secrets
     code_fencing: *code_fencing_experimental
-    remote_feature_flags: *remote_feature_flags
 
   # Local development / Expo development build (Runway .app for simulator)
   main-dev:
@@ -425,6 +272,7 @@ builds:
       MM_PORTFOLIO_URL: 'https://portfolio.dev-api.cx.metamask.io'
       REWARDS_API_URL: 'https://rewards.uat-api.cx.metamask.io'
       BAANX_API_URL: 'https://dev.api.baanx.com'
+      DIGEST_API_URL: 'https://digest-api.dev-api.cx.metamask.io/api/v1'
       RAMPS_ENVIRONMENT: 'staging'
       BRIDGE_USE_DEV_APIS: 'true'
       RAMP_INTERNAL_BUILD: 'true'
@@ -435,7 +283,6 @@ builds:
       DEV_OAUTH_CONFIG: 'true'
     secrets: *secrets
     code_fencing: *code_fencing_main
-    remote_feature_flags: *remote_feature_flags
 
   # ---------------------------------------------------------------------------
   # FLASK BUILDS
@@ -451,7 +298,6 @@ builds:
       METAMASK_BUILD_TYPE: 'flask'
     secrets: *secrets
     code_fencing: *code_fencing_flask
-    remote_feature_flags: *remote_feature_flags
 
   # Flask test builds (QA)
   flask-test:
@@ -464,6 +310,7 @@ builds:
       MM_PORTFOLIO_URL: 'https://portfolio.dev-api.cx.metamask.io'
       REWARDS_API_URL: 'https://rewards.uat-api.cx.metamask.io'
       BAANX_API_URL: 'https://dev.api.baanx.com'
+      DIGEST_API_URL: 'https://digest-api.dev-api.cx.metamask.io/api/v1'
       RAMPS_ENVIRONMENT: 'staging'
       BRIDGE_USE_DEV_APIS: 'true'
       RAMP_INTERNAL_BUILD: 'true'
@@ -472,7 +319,6 @@ builds:
       IS_SIM_BUILD: 'true'
     secrets: *secrets
     code_fencing: *code_fencing_flask
-    remote_feature_flags: *remote_feature_flags
 
   # Flask E2E test builds (no Sentry)
   flask-e2e:
@@ -485,6 +331,7 @@ builds:
       MM_PORTFOLIO_URL: 'https://portfolio.dev-api.cx.metamask.io'
       REWARDS_API_URL: 'https://rewards.uat-api.cx.metamask.io'
       BAANX_API_URL: 'https://dev.api.baanx.com'
+      DIGEST_API_URL: 'https://digest-api.dev-api.cx.metamask.io/api/v1'
       RAMPS_ENVIRONMENT: 'staging'
       BRIDGE_USE_DEV_APIS: 'true'
       RAMP_INTERNAL_BUILD: 'true'
@@ -493,7 +340,6 @@ builds:
       IS_SIM_BUILD: 'true'
     secrets: *secrets
     code_fencing: *code_fencing_flask
-    remote_feature_flags: *remote_feature_flags
 
   # Flask local development / Expo development build (Runway .app for simulator)
   flask-dev:
@@ -505,6 +351,7 @@ builds:
       MM_PORTFOLIO_URL: 'https://portfolio.dev-api.cx.metamask.io'
       REWARDS_API_URL: 'https://rewards.uat-api.cx.metamask.io'
       BAANX_API_URL: 'https://dev.api.baanx.com'
+      DIGEST_API_URL: 'https://digest-api.dev-api.cx.metamask.io/api/v1'
       RAMPS_ENVIRONMENT: 'staging'
       BRIDGE_USE_DEV_APIS: 'true'
       RAMP_INTERNAL_BUILD: 'true'
@@ -515,7 +362,6 @@ builds:
       DEV_OAUTH_CONFIG: 'true'
     secrets: *secrets
     code_fencing: *code_fencing_flask
-    remote_feature_flags: *remote_feature_flags
 
   # ─────────────────────────────────────────────────────────────────────────────
   # QA Builds (legacy - for internal testing)
@@ -544,7 +390,6 @@ builds:
       ANDROID_GOOGLE_SERVER_CLIENT_ID: MAIN_ANDROID_GOOGLE_SERVER_CLIENT_ID_UAT
       MM_CARD_BAANX_API_CLIENT_KEY: MM_CARD_BAANX_API_CLIENT_KEY_UAT
     code_fencing: *code_fencing_main
-    remote_feature_flags: *remote_feature_flags
 
   # QA dev build / Expo development build (Runway .app for simulator)
   qa-dev:
@@ -556,6 +401,7 @@ builds:
       MM_PORTFOLIO_URL: 'https://portfolio.dev-api.cx.metamask.io'
       REWARDS_API_URL: 'https://rewards.uat-api.cx.metamask.io'
       BAANX_API_URL: 'https://dev.api.baanx.com'
+      DIGEST_API_URL: 'https://digest-api.dev-api.cx.metamask.io/api/v1'
       RAMPS_ENVIRONMENT: 'staging'
       BRIDGE_USE_DEV_APIS: 'true'
       RAMP_INTERNAL_BUILD: 'true'
@@ -579,5 +425,3 @@ builds:
       ANDROID_GOOGLE_SERVER_CLIENT_ID: MAIN_ANDROID_GOOGLE_SERVER_CLIENT_ID_UAT
       MM_CARD_BAANX_API_CLIENT_KEY: MM_CARD_BAANX_API_CLIENT_KEY_UAT
     code_fencing: *code_fencing_main
-    remote_feature_flags: *remote_feature_flags
-
diff --git a/docs/musd/musd-convert-list.md b/docs/musd/musd-convert-list.md
index 2c989002d12d..65cb86ab8296 100644
--- a/docs/musd/musd-convert-list.md
+++ b/docs/musd/musd-convert-list.md
@@ -324,7 +324,11 @@ Creates max-amount transaction and sets payment token. Leverages existing infras
 ```typescript
 export const useMusdMaxConversion = () => {
   const createMaxConversion = async (token: ConvertibleToken) => {
-    const { NetworkController, TransactionController, TransactionPayController } = Engine.context;
+    const {
+      NetworkController,
+      TransactionController,
+      TransactionPayController,
+    } = Engine.context;
 
     // 1. Calculate max amount from token balance
     const maxAmount = toHex(token.balance);
@@ -333,7 +337,8 @@ export const useMusdMaxConversion = () => {
     const outputChainId = getOutputChainId(token.chainId);
 
     // 3. Get network client for the output chain
-    const networkClientId = NetworkController.findNetworkClientIdByChainId(outputChainId);
+    const networkClientId =
+      NetworkController.findNetworkClientIdByChainId(outputChainId);
 
     // 4. Generate transfer data with max amount
     const transferData = generateTransferData('transfer', {
@@ -745,9 +750,12 @@ export const selectMusdConversionStatuses = createSelector(
           statusMap[key] = {
             txId: tx.id,
             status: tx.status as TransactionStatus,
-            isPending: ['unapproved', 'approved', 'signed', 'submitted'].includes(
-              tx.status,
-            ),
+            isPending: [
+              'unapproved',
+              'approved',
+              'signed',
+              'submitted',
+            ].includes(tx.status),
             isConfirmed: tx.status === TransactionStatus.confirmed,
           };
         }
diff --git a/docs/perps/myx-integration-status.md b/docs/perps/myx-integration-status.md
new file mode 100644
index 000000000000..c10dba220262
--- /dev/null
+++ b/docs/perps/myx-integration-status.md
@@ -0,0 +1,123 @@
+# MYX Integration Status
+
+**Date:** 2026-02-25 (updated)
+**Branch:** `fet/perps/myx-reads-write`
+**Jira Tracking:** [myx-jira-tracking.md](myx-jira-tracking.md)
+
+---
+
+## Executive Summary
+
+MYX provider is **integrated for public reads**. Markets, prices, candles (REST + WS), and price streams all work on both networks. Pools without ticker data are filtered out automatically.
+
+**Important:** Auth-dependent features (getPositions, getOrders, getAccountState) have code but **auth was never validated**. These do NOT count as working. All writes are untouched.
+
+| Metric              | Testnet         | Mainnet                             |
+| ------------------- | --------------- | ----------------------------------- |
+| Pools on API        | 2               | 27                                  |
+| Active (with price) | 1 (KNY=$65,629) | 3 (WBTC=$65k, MYX=$0.40, WBNB=$602) |
+| Candles             | Yes             | Yes                                 |
+| WS streams          | Yes             | Yes                                 |
+| Auth                | **Unverified**  | **Unverified**                      |
+| Tests passed        | 10/14           | 10/14                               |
+
+## Bug Fixes Applied (latest commit)
+
+- **HyperLiquidProvider**: Fixed testnet meta fetch URL, prevented bricked provider state
+- **PerpsController**: Fixed preloader race condition on provider init
+- **PerpsStreamManager**: Composite cache key (provider:network) prevents stale data
+- **PerpsSelectProviderView**: Network selector integrated alongside provider selector
+- **PerpsProviderSelector**: Cleaned up types, constants, styles, sheet, badge components
+
+---
+
+## Network Configuration
+
+| Environment | Chain ID | Network          | REST API            | WebSocket                     |
+| ----------- | -------- | ---------------- | ------------------- | ----------------------------- |
+| Mainnet     | 56       | BNB Chain        | `api.myx.finance`   | `wss://oapi.myx.finance/ws`   |
+| Testnet     | 421614   | Arbitrum Sepolia | `api-test.myx.cash` | `wss://oapi-test.myx.cash/ws` |
+
+The SDK selects the API host based on `isTestnet` passed to `MyxClient`.
+
+---
+
+## Market Filtering
+
+MYX uses a **Multi-Pool Model** — anyone can create pools. Most pools are inactive (no ticker data from the API).
+
+`getMarketDataWithPrices()` in `MYXProvider.ts` filters out pools that have no ticker data, so only active pools with real prices are returned to the UI.
+
+### Testnet
+
+| Symbol | Price   | Candles | Chain              |
+| ------ | ------- | ------- | ------------------ |
+| KNY    | $65,629 | Yes     | Arb Sepolia 421614 |
+
+1 filtered out (SGLT — paused, no data).
+
+### Mainnet
+
+| Symbol | Price   | Candles | Volume |
+| ------ | ------- | ------- | ------ |
+| WBTC   | $65,585 | —       | $0     |
+| MYX    | $0.40   | Yes     | $50.34 |
+| WBNB   | $602    | —       | $0     |
+
+24 filtered out (community/meme tokens, dead duplicates).
+
+---
+
+## API Endpoints (verified curl commands)
+
+### Mainnet (chainId 56)
+
+```bash
+# List all pools
+curl -s 'https://api.myx.finance/openapi/gateway/scan/pools?chainId=56' \
+  | python3 -m json.tool | head -60
+
+# Tickers
+MYX_POOL="0x4486a8e524308e9f426f0500bee2b0ac2c421a5d849836d4891f3cb17457e2ef"
+curl -s "https://api.myx.finance/openapi/gateway/quote/candle/tickers?chainId=56&poolIds=${MYX_POOL}" \
+  | python3 -m json.tool
+
+# Candles (interval: 1=1m, 5=5m, 60=1h, 1440=1d)
+ENDTIME=$(date +%s)
+curl -s "https://api.myx.finance/openapi/gateway/quote/candles?chainId=56&poolId=${MYX_POOL}&interval=60&endTime=${ENDTIME}&limit=5" \
+  | python3 -m json.tool
+```
+
+### Testnet (chainId 421614)
+
+```bash
+curl -s 'https://api-test.myx.cash/openapi/gateway/scan/pools?chainId=421614' \
+  | python3 -m json.tool
+```
+
+---
+
+## Active Pool IDs (Mainnet)
+
+| Symbol | poolId                                                               |
+| ------ | -------------------------------------------------------------------- |
+| MYX    | `0x4486a8e524308e9f426f0500bee2b0ac2c421a5d849836d4891f3cb17457e2ef` |
+| WBTC   | `0x082c5d94e37ef9d51d9475eb54f8e4a3765e8dd09c49213864f77652a9f51cf9` |
+| WBNB   | `0x76593937ac0157ec106833688834765e57f2d8ad0a7bf35bb75334de4d589bc6` |
+
+---
+
+## Current Blockers
+
+1. **Auth never validated** — `myxClient.auth()` is sync, empty results prove nothing.
+2. **No mainnet credentials** — `.js.env` has testnet creds only.
+3. **Limited active pools** — only 3 mainnet pools have data. May need curated list from MYX team.
+
+---
+
+## What We Need from MYX Team
+
+1. **Curated pool list** — which `poolId`s to display, or confirmation that ticker-based filtering is sufficient.
+2. **Testnet guidance** — current testnet has 1 active test token (KNY).
+3. **Mainnet credentials** — dedicated `appId` / `apiSecret`.
+4. **Auth validation endpoint** — API call that confirms auth status.
diff --git a/docs/perps/myx-jira-tracking.md b/docs/perps/myx-jira-tracking.md
new file mode 100644
index 000000000000..1dfad90fb595
--- /dev/null
+++ b/docs/perps/myx-jira-tracking.md
@@ -0,0 +1,81 @@
+# MYX Jira Tracking
+
+## Current PR: `fet/perps/myx-reads-write`
+
+### Issues Addressed (In Progress)
+
+| Jira     | Summary                           | Status                                                                                 |
+| -------- | --------------------------------- | -------------------------------------------------------------------------------------- |
+| TAT-2471 | Feature flag                      | Feature flag `MM_PERPS_MYX_PROVIDER_ENABLED` integrated, version-gated                 |
+| TAT-2472 | Perps Home - Selector UI          | Selector bottom sheet built (PerpsProviderSelectorSheet + Badge). No design review yet |
+| TAT-2531 | Perps Home - Selector Logic       | Provider+network switching implemented and CDP-validated. All 4 combos work            |
+| TAT-2473 | Perp Market - Selector logic      | Market list updates correctly on provider/network switch. Cache invalidation fixed     |
+| TAT-2474 | Perp Market - Price data on chart | MYX candles (REST+WS) and price polling implemented. Both networks                     |
+| TAT-2475 | Perp Market - Stats data          | Funding, OI, volume, 24h change from MYX API. Inactive pools filtered                  |
+| TAT-2580 | Markets view - MYX Markets        | MYX markets list. Testnet: 1 active, Mainnet: 3 active pools                           |
+| TAT-2524 | Cleanup: provider switch cache    | Composite provider:network cache key. Fills, candles, topOfBook invalidated            |
+| TAT-2476 | Protocol feature map config       | Needed to hide unsupported MYX features. Not yet implemented                           |
+
+### What's Validated (CDP)
+
+- Provider switching: HL ↔ MYX on both mainnet and testnet
+- Market data: prices, funding rates, OI, volume
+- Candles: REST fetch + WebSocket streaming
+- Price streams: real-time price updates via WS
+- Cache invalidation: composite keys prevent stale data across provider/network switches
+
+### What's NOT Validated
+
+- Authentication (auth code exists but was never validated with real credentials)
+- Any authenticated reads (getPositions, getOrders, getAccountState)
+- Any writes (placeOrder, closePosition, etc.)
+
+---
+
+## Next PR: Auth + Read Subscriptions
+
+| Jira     | Summary                        | What to Do                                        |
+| -------- | ------------------------------ | ------------------------------------------------- |
+| TAT-2462 | Positions read                 | Validate auth → getPositions with real data       |
+| TAT-2508 | Historic trades/orders/funding | Validate getOrderFills, getFunding with real data |
+| TAT-2476 | Protocol feature map           | Hide orderbook, TP/SL, limit orders for MYX       |
+| TAT-2459 | Collateral gating              | Only show MYX when user has BNB assets            |
+
+### Prerequisites
+
+- Mainnet credentials from MYX team
+- Auth validation endpoint confirmation
+- Feature map design agreement
+
+---
+
+## Future PR: Trading Writes (Phase 2)
+
+| Jira     | Summary              | What to Do                                 |
+| -------- | -------------------- | ------------------------------------------ |
+| TAT-2461 | Place order          | Implement placeOrder for MYX               |
+| TAT-2477 | Place order (market) | Market order flow                          |
+| TAT-2478 | Close position       | closePosition implementation               |
+| TAT-2532 | Update margin        | updateMargin implementation                |
+| TAT-2533 | Flip position        | Flip position direction                    |
+| TAT-2534 | Update TP/SL         | updatePositionTPSL implementation          |
+| TAT-2463 | Modify position      | Umbrella ticket for position modifications |
+
+### Prerequisites
+
+- Auth validated (from previous PR)
+- Feature map implemented
+- Testnet trading confirmed working
+
+---
+
+## Issues NOT In Scope
+
+| Jira     | Summary                | Reason         |
+| -------- | ---------------------- | -------------- |
+| TAT-2503 | Provider metrics       | Not started    |
+| TAT-2504 | Performance monitoring | Not started    |
+| TAT-2505 | Error analytics        | Lower priority |
+| TAT-2507 | Provider health checks | Lower priority |
+| TAT-2509 | A/B testing            | Lower priority |
+| TAT-2510 | User feedback          | Lower priority |
diff --git a/docs/perps/myx-validation-report.md b/docs/perps/myx-validation-report.md
new file mode 100644
index 000000000000..496012b866ec
--- /dev/null
+++ b/docs/perps/myx-validation-report.md
@@ -0,0 +1,103 @@
+# MYX Provider Validation Report
+
+**Date:** 2026-02-25
+**Branch:** `fet/perps/myx-reads-write`
+**Script:** `scripts/perps/agentic/validate-myx.sh`
+
+---
+
+## Testnet (chainId 421614, Arbitrum Sepolia → `api-test.myx.cash`)
+
+| Category     | Test                     | Result     | Details                          |
+| ------------ | ------------------------ | ---------- | -------------------------------- |
+| Init         | Provider registered      | PASS       | `myx` in providers map           |
+| Init         | Markets loaded           | PASS       | 2 pools, 1 with price data       |
+| Init         | Markets have name        | PASS       |                                  |
+| Prices       | Tickers with real prices | PASS       | KNY=$65,629                      |
+| Candles REST | 1h historical            | PASS       | 101 candles                      |
+| Candles REST | 1D historical            | PASS       | 101 candles                      |
+| Candles REST | 5m historical            | PASS       | 101 candles                      |
+| Candles WS   | Sustained kline updates  | PASS       | 3 WS callbacks                   |
+| Prices WS    | Live ticker update       | PASS       | KNY `"65587.50"`                 |
+| Auth         | isReadyToTrade           | UNVERIFIED | `auth()` is sync, proves nothing |
+| Positions    | getPositions             | UNVERIFIED | 0 (auth not validated)           |
+| Orders       | getOrders                | UNVERIFIED | 0 (auth not validated)           |
+| Account      | getAccountState          | UNVERIFIED | all zeros (auth not validated)   |
+| Ping         | Health check             | PASS       |                                  |
+
+**Summary:** 10 passed, 0 failed, 0 skipped, 4 unverified
+
+### Testnet Markets
+
+2 pools on API, 1 returned after filtering (pools without ticker data are excluded):
+
+| Symbol | Price   | Candles | Volume | Chain              |
+| ------ | ------- | ------- | ------ | ------------------ |
+| KNY    | $65,629 | Yes     | $0.53  | Arb Sepolia 421614 |
+
+SGLT (Linea Sepolia 59141) is filtered out — paused pool, no ticker data.
+
+---
+
+## Mainnet (chainId 56, BNB Chain → `api.myx.finance`)
+
+| Category     | Test                     | Result     | Details                            |
+| ------------ | ------------------------ | ---------- | ---------------------------------- |
+| Init         | Provider registered      | PASS       | `myx` in providers map             |
+| Init         | Markets loaded           | PASS       | 27 pools, 3 with price data        |
+| Init         | Markets have name        | PASS       |                                    |
+| Prices       | Tickers with real prices | PASS       | WBTC=$65,585, MYX=$0.40, WBNB=$602 |
+| Candles REST | 1h historical            | PASS       | 101 candles (MYX token)            |
+| Candles REST | 1D historical            | PASS       | 101 candles (MYX token)            |
+| Candles REST | 5m historical            | PASS       | 101 candles (MYX token)            |
+| Candles WS   | Sustained kline updates  | PASS       | 3 WS callbacks                     |
+| Prices WS    | Live ticker update       | PASS       | MYX `"0.4012..."`                  |
+| Auth         | isReadyToTrade           | UNVERIFIED | `auth()` is sync, proves nothing   |
+| Positions    | getPositions             | UNVERIFIED | 0 (auth not validated)             |
+| Orders       | getOrders                | UNVERIFIED | 0 (auth not validated)             |
+| Account      | getAccountState          | UNVERIFIED | all zeros (auth not validated)     |
+| Ping         | Health check             | PASS       |                                    |
+
+**Summary:** 10 passed, 0 failed, 0 skipped, 4 unverified
+
+### Mainnet Markets
+
+27 pools on API, 3 returned after filtering:
+
+| Symbol | Price   | Candles | Volume |
+| ------ | ------- | ------- | ------ |
+| WBTC   | $65,585 | —       | $0     |
+| MYX    | $0.40   | Yes     | $50.34 |
+| WBNB   | $602    | —       | $0     |
+
+24 pools filtered out — community/meme tokens with no ticker data. MYX uses a Multi-Pool Model where anyone can create pools; most are inactive.
+
+---
+
+## Testnet vs Mainnet Comparison
+
+| Dimension             | Testnet       | Mainnet                         |
+| --------------------- | ------------- | ------------------------------- |
+| Pools on API          | 2             | 27                              |
+| Active (with prices)  | 1             | 3                               |
+| Prices                | KNY=$65,629   | WBTC=$65k, MYX=$0.40, WBNB=$602 |
+| REST candles          | All intervals | All intervals                   |
+| WS candles + prices   | Yes           | Yes                             |
+| Auth/positions/orders | Unverified    | Unverified                      |
+| Tests passed          | 10/14         | 10/14                           |
+
+---
+
+## Known Issues
+
+1. **Most pools have no ticker data** — API only returns prices for active pools (1/2 testnet, 3/27 mainnet). `getMarketDataWithPrices()` filters these out.
+2. **Auth never validated** — `myxClient.auth()` is sync (stores callbacks, no API call). Empty results prove nothing.
+3. **No mainnet credentials** — `.js.env` has testnet creds only.
+
+---
+
+## Next Steps
+
+1. **Validate auth** — call token API directly or attempt a testnet order.
+2. **Mainnet credentials** — get dedicated `appId`/`apiSecret` from MYX team.
+3. **Curated pool list** — get from MYX team which pools to show, or rely on the active-ticker filter.
diff --git a/docs/perps/myx/whitepaper.md b/docs/perps/myx/whitepaper.md
new file mode 100644
index 000000000000..ee582f9097f6
--- /dev/null
+++ b/docs/perps/myx/whitepaper.md
@@ -0,0 +1,495 @@
+# MYX V2 Whitepaper
+
+# **1. Abstract**
+
+Crypto traders have historically faced an impossible trilemma: **trustlessness, accessibility, and usability**—specifically, **asset security and fairness of execution**, **comprehensive access to opportunities**, and **liquidity depth with user experience**. No single venue has successfully delivered all three essential elements.
+
+Top centralized exchanges gained dominance in an otherwise commoditized market by combining **custody trust** with the **wealth effects of curated listings**. These advantages are now challenged by decentralized alternatives, as seen in the rise of platforms like Pumpfun, where **immediacy of opportunity outweighs polished interfaces or deeper liquidity**.
+
+**We propose MYX V2**, a non-custodial, permissionless infrastructure for perpetual futures. It enforces security through **deterministic self-custody**, enables **day-one perpetual markets for any token**, and provides **execution quality comparable to centralized venues**.
+
+Just as ERC-20 removed permission from token issuance and Uniswap from spot exchange, MYX V2 removes permission from perpetuals**—closing the execution gap while unlocking what only decentralization makes possible.**
+
+# **2. Introduction & Motivation**
+
+MYX’s first phase addressed the core inefficiencies of decentralized derivatives. V1 proved that an on-chain **Matching Pool Mechanism** could match centralized exchanges on liquidity and fees while preserving self-custody and transparent settlement. It also closed the usability gap through **seamless trading**—making execution gasless and walletless.
+
+**V2 raises the bar.** The question now becomes: _what unique capabilities can a decentralized system offer?_
+
+MYX V2 introduces a new era for on-chain trading by extending permissionlessness to perpetuals. Creating a perpetual market becomes as simple as launching a token. Any on-chain asset can immediately support leverage and hedging without approvals or gatekeepers—a chain-abstracted model impossible for custodial exchanges to replicate.
+
+Institutions gain certainty through transparent rules, user-controlled custody, and code-defined outcomes rather than discretionary decisions. This provides the predictability needed for large-scale institutional participation.
+
+LPs gain access to programmable liquidity via risk-aligned vaults and mTokens that enable spot holders to earn on deposits. \*\*\*\*Markets can be supported with either base or quote asset alone, reducing participation barriers. This single-sided approach eliminates impermanent loss while maintaining risk alignment. Deposits become composable yield instruments with transparent, efficient compounding instead of facing asymmetric exposure erosion or being limited to low money-market yields.
+
+V2's goal is applying V1's performance gains to permissionless design, enabling day-one perpetual markets for any asset with transparent rules and self-reinforcing liquidity.
+
+The following sections detail the mechanisms ensuring this framework's practicality, resilience, and security.
+
+# **3. Design Objectives**
+
+MYX V2's design translates philosophy into concrete constraints, ensuring performance while maintaining decentralization, sustainability, and openness—building on V1 lessons and addressing next-generation market demands.
+
+1. **Permissionless Market Creation** Any on-chain asset can host a perpetual market from day one, removing centralized listing bottlenecks and making hedging and leverage immediately available for all assets, aligning market access with blockchain innovation.
+2. **Elimination of Impermanent Loss** MYX V2 aligns risk and return transparently through independent vaults and mTokens, allowing liquidity providers to earn based on chosen exposure without structural arbitrage penalties, creating sustainable liquidity provision.
+3. **Decentralization and Trustless Custody** On-chain margining and settlement with user custody and code-enforced outcomes replace discretionary authority, providing necessary guarantees for institutional and retail adoption.
+4. **Broker-Facing Infrastructure** MYX V2 serves as a service layer for brokers and trading interfaces, enabling connection to shared liquidity without custody competition—creating an aligned ecosystem with concentrated rather than fragmented liquidity.
+5. **Resistance to Price Manipulation** A dynamic risk framework prices manipulation costs through risk-weighted, time-bounded profit locks, making price distortion prohibitively expensive by embedding protection directly into the mechanism.
+6. **Native Chain Abstraction Support** Capital flows across chains with margin provable on a source chain and deployable to a target chain within two blocks. This creates seamless cross-ecosystem participation with full auditability, offering a unified venue without manual bridging.
+
+# **4. Core Mechanisms**
+
+## **4.1 System Overview**
+
+MYX operates as a fully on-chain perpetual trading system where all participants interact under a deterministic framework. The protocol unifies users, brokers, oracles, vaults, and execution infrastructure, replacing discretionary control with transparent rules encoded in smart contracts.
+
+At the system's edge are **brokers**—user-facing gateways to MYX. Each operates its own customizable contract for fees, referrals, and onboarding. The MYX front end is one such broker, alongside wallets, brokers, and independent platforms competing for distribution.
+
+Orders flow through brokers into **MYX Core**, which governs execution, risk, orders, and accounting. Core logic is immutable: pricing, matching, and settlement are enforced by code, not intermediaries. **Keepers** monitor the system, relay transactions, and stake MYX tokens but cannot alter outcomes as all paths are pre-defined.
+
+Each perpetual market uses two **asset-pure vaults**: **Base Vault** (underlying asset) and **Quote Vault** (stablecoins). Together they provide collateral and underwrite **residual exposure** after trader-to-trader netting. This structure eliminates impermanent loss, aligns coin-native and cash-native investor mandates, and ensures fully-backed trader profits. Depositors receive **mTokens** that preserve exposure while accruing fees, funding, and PnL.
+
+**Active market makers (AMM)** complement passive vault liquidity by absorbing directional risk when open interest becomes imbalanced, earning rebates and funding fees. Vaults and AMMs form a dual liquidity layer that creates the depth for scaled operations..
+
+**Permissionless oracles** stream verifiable price data, with multiple providers ensuring no single point of failure. **Perpetual traders** interact with brokers and generate fees, funding flows, and open interest. **Spot holders** can convert their assets into mTokens to become liquidity providers and earn yield on their holdings.
+
+**Relayers** forward transactions and abstract gas costs, enabling signature-free, gasless trading while maintaining user custody and settlement determinism.
+
+The system functions as a closed loop where brokers connect users, vaults supply capital, oracles anchor prices, market makers balance flow, and keepers ensure execution—all governed by MYX Core's code-enforced rules. The result is a transparent, auditable, permissionless trading system delivering execution quality comparable to top centralized exchanges.
+
+## **4.2 The Life Cycle of a Permissionless Market**
+
+Crypto adoption accelerates when barriers fall. ERC-20 enabled permissionless token creation, unleashing the ICO boom. Uniswap made liquidity provision permissionless, transforming spot exchange into a public good. Recently, creation platforms have helped communities crowdsource liquidity, while broker platforms have broken down user frictions. MYX V2 continues this evolution by **making perpetual futures themselves permissionless.**
+
+While other venues require gatekeepers for listings and market management, MYX V2 encodes these decisions in smart contracts. Markets form through liquidity, not discretion—instantiated by capital, activated by thresholds, and governed by transparent, auditable rules.
+
+A market is **created** when someone deploys a pair through the MYX factory contract, specifying base and quote assets. The quote must be a stablecoin for now, simplifying execution to a single BASE/USD oracle feed. This restriction will disappear as oracle infrastructure evolves to further support reliable cross-pairs such as BTC/ETH.
+
+**Activation** occurs when vaults meet an initial liquidity threshold. The protocol then charges a one-time fee to fund the oracle feed, which automatically begins streaming verifiable prices. Early liquidity providers receive Genesis LP tokens, granting a permanent 2% share of trading fees plus regular vault returns—fairly compensating those who enable new markets.
+
+Once **activated**, trading begins. Orders execute at oracle prices with deterministic slippage curves. Only residual exposure passes to vaults after user flow nets. Risk parameters are maintained by the risk engine and enforced by keepers. Larger trades can use RFQ paths for specialized liquidity.
+
+Markets must maintain minimum monthly volumes to cover oracle costs. If activity drops, the market enters **pending-deactivation**, allowing only position closing. Keepers assist in ensuring orderly settlement before trading halts. Deactivated markets can be revived by paying a new activation fee.
+
+This creates a market lifecycle governed by code, not committees. Capital initiates markets; thresholds activate them; rules govern them; inactivity pauses them; renewed demand restores them. Like ERC-20 and Uniswap before it, MYX V2 extends permissionlessness to perpetual futures—crypto's most important market.
+
+## **4.3 Liquidity Provisioning**
+
+Derivatives venues depend on their capital backing. This capital follows two distinct paths: **Asset-denominated investors** seek to accumulate more of the underlying asset, while **Dollar-denominated investors** target stable returns regardless of the coin's performance. Traditional protocols force these different objectives into a single pool, creating inefficiencies.
+
+**MYX V2 separates what must be separate.** Markets utilize two **asset-pure vaults**: a Base Vault (underlying asset) and a Quote Vault (stablecoin). Deposits generate **mTokens** that preserve the depositor's intended exposure while accumulating market earnings. By eliminating forced rebalancing, **impermanent loss is eliminated**. Each liquidity provider measures success in their preferred currency while contributing to the same market.
+
+Returns are generated from three sources: **trading fees**, **funding transfers**, and **counterparty P&L**. MYX directs these earnings to risk-bearing vaults and **reinvests** them, enabling mTokens to compound over time. For blue-chip markets, returns can **autocompound** directly into base assets, while long-tail markets can maintain stable returns. All policies are transparently disclosed upfront for each market.
+
+LPs maintain control over investment exposures with **opt-in take-profit and stop-loss policies** at the contract level. Coin-native providers can limit downside risk while earning returns, and cash-native providers can set return boundaries without sacrificing custody. Capital is programmable and portable with **no subscription or redemption fees** or slippage charges. This directs liquidity to its most productive use, with market depth following activity frictionlessly.
+
+For token holders, mTokens improve upon spot by preserving price exposure while adding fee income, funding, and P&L claims with optional risk controls and self-custody. As adoption grows, markets naturally deepen, creating a self-reinforcing cycle of liquidity.
+
+MYX liquidity is **fit-for-mandate, asset-pure, and compounding**. By aligning with investor objectives through code-enforced transparency, MYX creates sustainable market depth without impermanent loss or hidden costs, resulting in **lower LP hurdle rates and deeper liquidity for perpetual futures.**
+
+## **4.4 Withdrawal, Redemption & Vault Accounting**
+
+Per-market liquidity is held in two asset-pure vaults: the **Base Vault** (underlying asset) and the **Quote Vault** (stable quote). Deposits mint fungible **mTokens**, while redemptions burn them for a rule-based claim on vault assets. There are no protocol subscription or redemption fees; economics accrue transparently in the redemption ratios and public state.
+
+### What an LP owns
+
+- A **Quote LP** owns mTokens redeemable for more **QUOTE** over time.
+- A **Base LP** owns mTokens redeemable for more **BASE** over time, plus a pro-rata claim on QUOTE proceeds attributed to the Base Vault.
+
+These claims evolve deterministically via two core quantities:
+
+1. **Redemption ratios** (public, per vault)
+
+$$
+R_{B} = \frac{\text{BASE units held by Base Vault}}{\text{Base mTokens outstanding}},
+
+
+$$
+
+$$
+R_{Q} = \frac{\text{QUOTE units held by Quote Vault}}{\text{Quote mTokens outstanding}}.
+
+
+$$
+
+_where the Base or Quote units held by each vault is adjusted for any unrealized profit and losses._
+
+A burn of $s$ mTokens returns $s R_{\mathrm{B}} \;\text{BASE}$
+or $R_{\mathrm{Q}} \;\text{QUOTE}$, respectively (modulo any position-level risk controls the depositor attached to the mTokens).
+
+1. **Quote tracker for Base LPs** (public, per market): QUOTE-denominated proceeds attributable to the Base Vault (fees, funding, and its share of residual P&L) are recorded as a cumulative **tracker** $\Theta$
+   (QUOTE per Base mToken). A Base LP who minted when the tracker was $\Theta_{\text{entry}}$
+   may, upon redemption, claim:
+
+$$
+⁍
+$$
+
+Intuition: Base LPs remain coin-native; QUOTE flows owed to them are accounted explicitly, not commingled, and paid on exit—or reinvested automatically if compounding is enabled.
+
+### Pre-settlement Profit and Loss attribution
+
+Before processing any **mint** or **burn**, outstanding QUOTE proceeds are attributed so new capital cannot capture old profits and exiting capital cannot leave liabilities behind. Attribution splits the pending QUOTE buffer $B$ by each vault's QUOTE value at the oracle anchor $P_{\text{oracle}}$
+:
+
+$$
+⁍
+$$
+
+$$
+⁍
+$$
+
+Then update redemption ratio for quote $R_Q$ and Quote tracker for Base $\Theta$ accordingly:
+
+$$
+⁍
+$$
+
+$$
+\Theta \leftarrow \Theta + \frac{B_{\mathrm{B}}}{\text{Base mTokens outstanding}},B \leftarrow 0
+
+
+$$
+
+This single step keeps entry/exit equitable without pausing the market or introducing discretionary "gates."
+
+**Mint and burn Formulas**
+
+**Mint Base:** depositor receives $s = \frac{\text{BASE}{\text{in}}}{R{\mathrm{B}}}$
+; records $\Theta_{\text{entry}} = \Theta$
+
+**Burn Base:** receives $sR_{\mathrm{B}}$ BASE **and** $s \bigl(\Theta - \Theta_{\text{entry}}\bigr) \;\text{QUOTE}$
+
+**Mint Quote:** depositor receives $s = \frac{\text{QUOTE}{\text{in}}}{R{\mathrm{Q}}}$
+
+**Burn Quote:** receives $s R_{\mathrm{Q}} \;\text{QUOTE}$
+
+All quantities are on-chain and auditable.
+
+## 4.5 Brokers as Distribution and Infrastructure
+
+MYX separates execution core from distribution edge. **MYX Core** handles trading logic, risk, and settlement, while brokers function as the access layer. This architecture creates neutral infrastructure with competitive front ends.
+
+Brokers deploy permissionlessly through the **broker factory**. Any entity can create a broker contract defining its own fees, referrals, and onboarding processes, while leveraging MYX Core for execution. The MYX front end operates as just one broker among many.
+
+MYX Core applies a **base protocol fee** scaled to broker volume—larger brokers pay less, smaller ones pay more. This approach rewards scale, drives competition, and maintains efficient distribution without fragmenting liquidity. All trades clear against the same pool under identical rules.
+
+This model effectively modularizes compliance. Brokers implement their own KYC/AML requirements based on jurisdiction. Regulated and permissionless brokers coexist, both accessing the same liquidity pool while custody remains on-chain and settlement stays deterministic.
+
+MYX functions as an **infrastructure layer for perpetual futures** rather than a single decentralized exchange. Brokers serve different audiences at the surface, while MYX Core provides shared liquidity. This balance combines decentralization with usability: core rules remain on-chain, with flexibility at the edge.
+
+## **4.6 Seamless Trading**
+
+Users default to centralized venues due to friction in decentralized venues, despite custody concerns in centralized ones. MYX V2 addresses this with its **seamless key** design and relayer-based submission, eliminating gas pre-funding, repetitive prompts, and custodial designs.
+
+Seamless keys can be authorized by asset holding EOAs or smart contracts in MYX core to trade on their behalf. Orders are signed by authrozied seamless keys and submitted through MYX Relayers while maintaining security. The keys are **not** custody keys—they cannot withdraw funds or bypass checks. This enables **gasless, wallet-less entry** through broker interfaces or Telegram without sharing private keys with operators.
+
+The benefits are substantial: retail users enjoy frictionless position management without repetitive signing; traders can secure assets in cold storage while actively trading via non-custodial seamless keys; investors can delegate trading authority to specialized trading firms without surrendering custody; and brokers can decentralize their infrastructure while maintaining seamless user experiences.
+
+Seamless trading bridges the usability gap between centralized platforms while preserving trustlessness. Users maintain custody, brokers extend their reach, and MYX Core ensures verifiability—combining an app-like experience with auditable settlement.
+
+## **4.7 Matching Engine**
+
+Matching is the core challenge of exchange design. Centralized orderbooks pair makers and takers through proprietary engines, with market makers effectively matching takers while managing inventory. Though high-performing, this approach is expensive and impractical on-chain due to prohibitive costs and latencies.
+
+First-generation decentralized derivatives (e.g., GMX) introduced peer-to-pool models where takers traded directly against liquidity pools at oracle prices. This solved posting issues but used liquidity sub-optimally as traders never matched against each other.
+
+MYX V1 pioneered **peer-to-pool-to-peer** settlement, or **asynchronous matching**. LPs act as temporary counterparties until offsetting positions appear, then exposure nets through the pool and redistributes among traders. This innovation delivered industry-leading capital efficiency and competitive fee structures.
+
+**MYX V2 enhances asynchronous matching with a slippage function** that distributes depth across a virtual curve, resembling traditional orderbooks. This compensates LPs for taking imbalanced flow while protecting against one-sided position accumulation. As markets move directionally, additional exposure becomes more expensive, stabilizing long-tail assets by discouraging toxic flow.
+
+MYX V2 implements three complementary matching modes:
+
+1. **Asynchronous matching** remains the foundation. When Alice opens a long at price A against the LP, and Bob and Jack later open shorts at prices B and C, the LP closes equivalent exposure and effectively connects Alice to Bob and Jack. Market makers receive rebates to tighten Lp entry and exit spreads and help realize LP’s paper gains. The slippage function distributes depth around oracle prices, enabling higher capital efficiency with auto-deleveraging as a final safeguard.
+2. **Instant in-block matching** pairs offsetting orders arriving in the same block directly, with only residual exposure absorbed by vaults. This minimizes slippage, reduces LP capital requirements, and improves system efficiency at scale.
+3. **Off-chain matching** enables high-frequency and dark orders. Users sign orders without broadcasting them on-chain; dark pools route this information to market makers streaming prices. Matches execute on-chain for settlement, creating a distributed dark pool architecture that improves performance and privacy while maintaining settlement guarantees.
+
+Together, these mechanisms create a flexible matching engine balancing decentralization constraints with professional trading requirements. Liquidity flows through multiple pathways: asynchronous bridging, slippage-shaped virtual depth, in-block netting, and decentralized RFQ. The result is an execution layer serving both retail and institutional needs without compromising decentralization.
+
+## **4.8 Trading Rules and Settlement**
+
+MYX V2 establishes a **QUOTE-margined, isolated perpetual market** as its default structure. Every position is collateralized exclusively in the market's designated quote asset, which the protocol assumes to be worth one U.S. dollar at par. This simplifies accounting and ensures consistency. If a stablecoin depegs, trading continues uninterrupted with the base vault's purchasing power intact, though users' collateral and P&L remain exposed to quote asset devaluation.
+
+MYX V2's risk framework centers on two parameters: **initial margin rate** (determining maximum leverage) and **maintenance margin rate** (setting liquidation threshold). A $x%$ initial margin enables $\frac{\text{1}}{x}$ leverage. When a position's value drops below maintenance requirements, it's liquidated with remaining margin directed to the market's **risk reserve**.
+
+Formally, if a user opens a position of notional value $V$, then:
+
+$$
+⁍
+$$
+
+$$
+⁍
+$$
+
+Where $\text m_{\text{init}}$ is the initial margin rate and $\text m_{\text{maint}}$ is the maintenance margin rate
+
+Both parameters are **dynamic**. Assets receive deterministic liquidity ratings based on depth, volatility, and manipulation risk. More liquid pairs like BTC/ETH have lower margin requirements allowing higher leverage, while long-tail assets have stricter requirements. Liquidity ratings only affect new or modified positions—existing positions maintain entry parameters to prevent retroactive liquidations.
+
+Each market maintains its own segregated **risk reserve** from collected liquidation margins. This prevents extreme events in one market from affecting others—a volatile altcoin's collapse won't impact BTC or ETH markets. These reserves serve as buffers against shortfalls and provide transparent accounting of system risk.
+
+This structure balances flexibility with prudence. Institutions can trade in highly liquid markets with competitive leverage and segregated reserves, while retail traders can access long-tail markets with appropriate risk parameters. The system remains rule-based, predictable, and protected against contagion.
+
+### 4.8.2 Prices: Execution Anchors and Slippage
+
+Trade execution in MYX V2 is anchored to **verifiable oracle prices**, ensuring reproducible and tamper-proof settlement. In MYX V1, each order executed at the oracle price, with cross-referencing checks comparing an index price to the oracle price at execution. While this provided transparency, it failed to account for the real-world cost of liquidity, especially in thin or asymmetric markets.
+
+MYX V2 addresses this by introducing a **slippage function** that distributes liquidity around the oracle anchor like an orderbook. Instead of filling all trades at a single price point, the protocol prices depth along a deterministic curve. This creates two key benefits: first, it enhances asynchronous matching profitability by compensating LPs for one-sided flow, preventing liquidity providers from being drained without reward; second, it acts as a stabilizer—as a market moves in one direction without offsetting flow, the marginal cost of new positions increases. This discourages toxic position buildup and strengthens long-tail markets where liquidity is naturally thin.
+
+Formally, let $\text P_{\text{oracle}}$ be the oracle price, and $Q$ the net position imbalance. The execution price can be expressed as:
+
+$$
+P_{\mathrm{exec}} = P_{\mathrm{oracle}} \bigl(1 + f(Q)\bigr)
+
+
+$$
+
+Where $f(Q)$ is a slippage function increasing in $Q$, calibrated by the asset's liquidity rating. In liquid markets, $f(Q)$ is shallow, closely approximating the oracle price; in illiquid markets, it steepens quickly, making large imbalances prohibitively expensive.
+
+In practice, these rules make MYX V2 markets behave more like traditional orderbooks in both price formation and liquidity cost. Oracle anchors ensure fairness and reproducibility, while the slippage function creates depth and protects LPs. Traders benefit from transparent and predictable execution, LPs maintain capital efficiency, and the overall system preserves market integrity.
+
+### 4.8.3 Trading Fee
+
+MYX V2 charges a **transaction fee** on each trade's notional value. If $N$ is the trade size and $f$ is the fee rate:
+
+$$
+\text{Trading Fee} = N \times f
+$$
+
+Fee rates vary across three dimensions:
+
+1. **Broker policies**: Front-end entities set their own fee schedules and referral programs, creating competition without changing MYX's core rules.
+2. **Tiered VIP systems**: Brokers can offer reduced fees to high-volume traders, aligning with industry standards.
+3. **Asset liquidity profile**: Liquid assets like BTC have lower fees, while less liquid markets have higher fees to compensate for additional risk.
+
+This structure benefits all participants: brokers gain flexibility, institutions receive predictable scaling costs, retail traders access transparent markets with potential fee reductions, and the protocol maintains sustainability with risk-aligned fee income.
+
+### 4.8.4 Funding as a balancing mechanism
+
+Funding transfers shift costs from the **crowded** side of open interest to the **uncrowded** side, nudging positions toward equilibrium. In MYX V2's **QUOTE-margined** model, all amounts are denominated in Base units. The **risk engine** calculates the funding rate based on the net long/short imbalance, the steepness of the slippage function curve, and the market's liquidity rating. Funding accrues **continuously** in time but settles **discretely** when a user interacts with their position (open/increase/decrease/close), preserving accuracy while minimizing chain updates across markets.
+
+**Formalization**
+
+Let $r_{daily}(t)$ represent the daily funding rate at time $t$, defined as **positive when longs pay shorts**. This converts to a per-second rate:
+
+$$
+\hat r(t) = \frac{r_{\text{daily}}(t)}{86{,}400}
+$$
+
+Let $P_{\text{oracle}}(t)$ be the execution anchor (QUOTE per 1 unit of BASE). We define a **global funding index** $F(t)$ with units "QUOTE per 1 BASE," updated at keeper broadcast times $t_k$ as:
+
+$$
+F(t_{k+1}) = F(t_k) + \hat r(t_k)\,\Delta t_k\, P_{\text{oracle}}(t_k),\Delta t_k = t_{k+1} - t_k
+$$
+
+_Intuition:_ During the period $[t_k, t_{k+1})$, each **+1 BASE** long position accrues a payable of $\hat r \cdot \Delta t \cdot P_{oracle}$ QUOTE (while each short receives the equivalent amount).
+
+For a user position $i$ with **BASE-denominated size** $q_i$ (long if $>0$, short if $<0$), we store its **position funding index** $F_i$ at the last interaction. On the next interaction at time $t$:
+
+$$
+\mathrm{FundingPayable}_i(t) \;=\; \bigl(F(t)-F_i\bigr)\, q_i .
+$$
+
+- If $r>0$ and $q_i>0$ (crowded longs), then $\mathrm{FundingPayable}_i>0$: the long position **pays** QUOTE.
+- If $r>0$ and $q_i<0$, the short position **receives** QUOTE (negative payable).
+
+After settlement, we set $F_i\leftarrow F(t)$ and update $q_i$ according to the user's new position size. This approach is algebraically equivalent to continuous integration but realized **only** when users interact with the system, which is critical for scalability.
+
+Funding credits and debits are posted to the position's **QUOTE margin balance** at settlement. **Debits** reduce free margin, while **credits** increase it. Funding is calculated before liquidation tests; consequently, prolonged adverse funding can push a position toward its maintenance threshold even when the price remains flat.
+
+### **4.8.5 Trader PnL and Settlement**
+
+MYX V2 operates entirely in QUOTE under an isolated, QUOTE-margined model. A position holds $q$ units of BASE (long when $q>0$, short when $q<0$), with a volume-weighted entry price $P_{\text{entry}}$. At any oracle mark price $P_{\text{oracle}}$ (QUOTE per BASE), the notional value is $N(P)=|q|\,P$. Unrealized PnL is marked continuously:
+
+$$
+\mathrm{UPnL} = (P_{\text{oracle}} - P_{\text{entry}})\, q \quad (\text{QUOTE}).
+$$
+
+When a position is partially reduced by $\Delta q$ (same sign as $q$) at execution price $P_{\text{exec}}$, the realized PnL is:
+
+$$
+\mathrm{RPnL}{\text{slice}} = (P_{\text{exec}} - P_{\text{entry}})\,\Delta q \quad (\text{QUOTE}).
+$$
+
+Adding to a position updates $P_{\text{entry}}$ by VWAP, while reductions keep $P_{\text{entry}}$ unchanged for the remaining position.
+
+Position equity is calculated as:
+
+$$
+\mathrm{Equity} = \mathrm{Collateral} + \mathrm{RPnL}_{\text{cum}} + \mathrm{UPnL} - \mathrm{Fees}_{\text{cum}} - \mathrm{FundingPayable}_{\text{net}} \quad (\text{QUOTE}),
+$$
+
+Trading fees are applied on notional value at execution, and funding is settled upon interaction via the global funding index. Both fees and funding are posted before any liquidation checks are performed.
+
+### **4.8.6 Liquidation and Bankruptcy Handling**
+
+Liquidation in MYX V2 operates under an isolated, QUOTE-margined framework designed to guarantee that traders cannot incur negative balances. Each position is continuously monitored against its maintenance margin requirement. A position of size $q$ BASE units (long when $q>0$, short when $q<0$), held at price $P_{\text{oracle}}$, carries initial notional
+
+$$
+N_{t} = |q| \cdot P_{\text{oracle}}
+$$
+
+Liquidation is triggered when equity falls to or below
+
+$$
+\mathrm{Equity} \;\le\; m_{\text{maint}} \cdot N_{t} ,
+$$
+
+where $m_{\text{maint}}$ is the maintenance margin rate.
+
+From this condition, the protocol derives closed-form liquidation levels. For a **long position** ($q>0$):
+
+$$
+P_{\text{liq}}^{\text{long}}  = P_{\text{entry}} \Bigl( 1 + m_{\text{maint}} - \tfrac{\Phi}{N_{t}} \Bigr),
+$$
+
+and for a **short position** ($q<0$):
+
+$$
+P_{\text{liq}}^{\text{short}}  = P_{\text{entry}} \Bigl( 1 - m_{\text{maint}} + \tfrac{\Phi}{N_t} \Bigr),
+$$
+
+where $\Phi$ is the adjusted free balance after fees and funding are settled.
+
+The execution price of liquidation is straightforward—it is the **liquidation price itself**. By design, the liquidation engine guarantees that a trader's balance cannot fall below zero. Liquidity providers know the exact liquidation level in advance, allowing them to hedge proactively if desired. This deterministic liquidation price ensures losses are capped at the user's posted collateral, preventing deficit situations.
+
+All liquidations incur a **liquidation fee**, charged on the position's notional value at liquidation. Unlike trading fees, this fee goes entirely to the market's **risk reserve** rather than to LPs. The reserve acts as an insurance buffer that absorbs any mismatch between collateral and payout obligations. Each market maintains its own reserve, ensuring that shortfalls remain contained within that specific market without spreading elsewhere.
+
+## 4.9 LPs as Counterparties
+
+Liquidity providers on MYX V2 underwrite the net exposure remaining after trader-to-trader positions are offset. Their role follows transparent, rule-based processes through two **asset-pure vaults**: the Base Vault (holding the underlying token) and the Quote Vault (holding the market's stable quote). This separation eliminates impermanent loss and ensures each provider maintains exposure in their chosen denomination while guaranteeing user profits are always fully collateralized.
+
+**Collateral allocation.** When aggregate user flow is net long, the protocol first draws on the Base Vault, as BASE naturally counters long positions. Each unit of residual long is matched with an equivalent unit of locked BASE collateral. If BASE is insufficient, the Quote Vault supplements by locking QUOTE according to a **Quote-lock coefficient** $k_Q$, which determines the forced take-profit (FTP) threshold. Conversely, when net flow is short, the Quote Vault supplies QUOTE first. If Quote depth is insufficient, the Base Vault locks additional BASE under a **Base-lock coefficient** $k_B$. These coefficients determine both how much collateral is immobilized per unit of exposure and how far price can move before triggering an FTP. For example, a coefficient of 2 means positions are forcibly realized after a 66.7% adverse move, ensuring LP losses never exceed their posted collateral.
+
+Despite the preferred sequence of collateral usage based on net exposures, the Base and Quote vaults share market exposure proportionally to their TVL. This prevents Base vaults from assuming excessive short positions against traders and Quote vaults from taking on too many long positions.
+
+LP Pending PnL pools temporarily store profits and losses, settling directly with traders without distributing to vaults per transaction. This reduces gas costs from the asset-pure vault design and enables profit reinvestment.
+
+The result is balanced risk exposure for LPs with no impermanent losses and well-managed risks to prevent bankruptcy.
+
+## 4.10 Clearing and Settlement Center
+
+The Clearing and Settlement Center reconciles BASE and QUOTE flows, enables compounding, and executes automated risk controls including stop-loss, take-profit, and liquidation payouts.
+
+This system operates through **spot swap intents**. Vaults publish standing intents to rebalance collateral when needed. These on-chain intents are fulfilled by solvers who deliver assets at oracle-anchored prices plus incentive spreads, ensuring fair, immediate, and fully collateralized conversions while maintaining open competition.
+
+The Center supports four key functions:
+
+1. **Debt Coverage.** When user profits exceed LP pending PnL buffer, the Base Vault posts BASE as collateral needed double the size of debt(Quote payout borrowed from pool). Solvers can deliver QUOTE for BASE at a discounted oracle price until Debt is covered, with surplus BASE returning to the vault. This maintains QUOTE-denominated payouts while preserving LP solvency.
+2. **Profit Compounding.** Compounding vaults convert accumulated QUOTE profits to BASE through swap intents. Solvers provide BASE for QUOTE at oracle price plus discount, automatically growing Base Vault holdings without manual intervention.
+3. **mToken Stop-Loss/Take-Profit.** Token holders can set on-chain trigger orders. When triggered, vaults express swap intents at execution price. Solvers fulfill these orders without requiring centralized matching engines, enabling automated portfolio management.
+4. **Oracle Fee Funding.** The Center collects activation fees from vaults proportional to TVL, converting collateral through swap intents when necessary to compensate oracle providers without external dependencies.
+
+This intent-solver model creates a **robust and composable** clearing layer. Competitive solving ensures efficiency, LPs maintain asset purity with seamless rebalancing, and users receive predictable QUOTE payouts even under stressThis effectively creates the foundation for expanding into an intent based spot trading facility within the MYX protocol.
+
+## 4.11 Risk Management
+
+MYX V2's trustworthiness is built on transparent failure handling. All failure modes follow explicit, verifiable rules that any participant or independent keeper can validate. This version introduces four key improvements: (i) **a decentralized Liquidity Assessment System**; (ii) **dynamic margins** based on this assessment; (iii) **slippage & OI controls** that protect LPs while attracting counter-flow; and (iv) **lock-coefficient–based forced take-profit** ensuring solvency within MYX's asset-underwriting model. We also maintain core V1 safeguards.
+
+1. **Dynamic Liquidity Assessment**
+
+**Risk.** Long-tail assets, episodic liquidity, or sudden crowding can render static parameters unsafe.
+
+**Control.** MYX V2 introduces a **Liquidity Assessment System** computed by **decentralized keepers nodes** under a public rulebook. Each keeper ingests a published **factor library** (e.g., depth/impact around the oracle, short-horizon volatility, spread dispersion, frequency of oracle deviations, OI concentration and turnover, slot-pressure metrics) and applies a **deterministic scoring function** to produce a scalar **liquidity rating** $L$ (e.g. ,$L\in[0,1]$ or tiered). Keepers stake to publish $L$ per market and epoch; MYX aggregates via a robust operator (e.g., weighted median over honest quorums). Because the mapping **factors → $L$** and **$L$ → parameters** is public, independent keeper systems arrive at the **same rating** for the same inputs.
+
+Crucially, $L$ **couples** into risk-critical parameters via monotone, published formulas, for example:
+
+$$
+\begin{aligned}m_{\text{init}}(L) &= m_{\min} + \alpha L, \\m_{\text{maint}}(L) &= m_{\min}^{\!*} + \beta L, \\\kappa_{\text{slip}}(L) &\uparrow \ \text{with } L \;(\text{steeper curve in thinner markets}), \\r_{\text{fund}}(L) &\uparrow \ \text{with imbalance and thinness}, \\\tau_{\text{lock}}(L) &\uparrow \ \text{(longer profit-lock horizon in thinner markets)}.\end{aligned}
+$$
+
+Parameters are **applied prospectively**: new positions bind to current $L$; existing positions retain their entry-time parameters (no retroactive liquidations). The rulebook, factors, and formulas are on-chain or anchor-hashed so any party can recompute and audit.
+
+Determinism replaces discretion; parameter tightness scales with measured liquidity, not headlines. Liquid majors remain efficient; long tails are constrained before they become dangerous.
+
+1. **Dynamic Initial & Maintenance Margins**
+
+**Risk.** Static margin ladders either strand capital on major assets or inadequately margin volatile assets.
+
+**Control.** MYX sets **initial** and **maintenance** margin rates as direct functions of the liquidity rating $L$. Higher $L$ (thinner markets) results in higher $m_{\text{init}}$ (lower max leverage $=1/m_{\text{init}}$) and higher $m_{\text{maint}}$ (earlier liquidation), strengthening safety cushions **before** stress occurs. Smoothing mechanisms and floors/ceilings prevent abrupt changes; updates happen dynamically and apply **only to new or updated positions**. Liquidation prices for long/short positions remain closed-form and publicly calculable, allowing traders to know exact thresholds in advance. Suppose $L$ deteriorates for an asset, a user holding an existing position who wants to increase their holdings will face the new initial margin requirement. This ensures users have sufficient margin to meet the updated market requirements before adding to their positions.
+
+Leverage is proportional to liquidity. Long-tail assets can list permissionlessly, but cannot over-leverage the system.
+
+1. **Slippage & OI Control (LP protection and maker incentives)**
+
+**Risk.** One-sided flow can accumulate against LPs. Static fills at oracle prices invite predatory flow, especially in thin markets.
+
+**Control.** Execution anchors to the **oracle**, but price is shaped by a **slippage function** that distributes virtual depth around the anchor:
+
+$$
+P_{\text{exec}} \;=\; P_{\text{oracle}} \bigl( 1 + f(Q; \kappa_{\text{slip}}(L)) \bigr), \quad f'(\cdot)>0,
+$$
+
+where $Q$ is net residual order size and $\kappa_{\text{slip}}(L)$ steepens impact as markets thin. Flow inside the slot nets with minimal impact, while orders pushing beyond limits face sharply rising slippage. Rebates and RFQ integrations invite **external market makers** to provide counter-flow, compressing the curve.
+
+LPs receive compensation for adverse selection, making one-sided accumulations expensive and economically incentivizing market makers to balance open interest.
+
+1. **Lock Coefficients & Forced Take-Profit (FTP) under flexible underwriting**
+
+**Risk.** Under V2's flexible underwriting (Base and Quote can back either side when primary collateral is insufficient), collateral must still cap maximum payable profit **deterministically**.
+
+**Control.** MYX uses per-side **lock coefficients** to immobilize collateral when the primary vault has insufficient funds:
+
+- **Long-skew** (users net long). The **Base Vault** locks BASE first; if insufficient, the **Quote Vault** posts QUOTE using a **Quote-lock coefficient** $k_Q$.
+- **Short-skew** (users net short). The **Quote Vault** posts QUOTE first; if insufficient, the **Base Vault** locks BASE under a **Base-lock coefficient** $k_B$.
+
+Invoking $k_Q$ or $k_B$ establishes a **Forced Take-Profit (FTP)** level: when price moves so far that user profit would exceed posted collateral, the system automatically realizes the position at FTP. Higher $k$ values push FTP further away (e.g., $k{=}1\approx50\%$ adverse move; $k{=}2\approx66.7\%$; $k{=}3\approx75\%$). When the **Base Vault** owes QUOTE, it over-collateralizes with BASE and creates a **spot swap intent**. Any solver can then deliver QUOTE (at oracle-anchored, discounted prices) to retire the liability, with surplus BASE collateral returned to the vault. Throughout this process, user accounting remains QUOTE-native, with all collateralization happening behind the scenes.
+
+Even with flexible asset application, the system mechanically enforces that **liability ≤ collateral**; FTP prevents bankruptcy.
+
+1. **Manipulation Deterrence**
+
+Thin markets are vulnerable to price manipulations. MYX V2 counters this with a **PnL Lock** on gains in long-tail pairs: profits **vest over time** based on liquidity rating $L$. Each position's PnL enters a **locked balance** vesting over $\tau_{\text{lock}}(L)$; new PnL $\Delta$ **resets** the vesting clock. While locked portions cannot be withdrawn, unrealized PnL remains usable as margin.
+
+This lock operates under public rules and includes an **objective review process**. During the vesting period, if trades exhibit manipulation patterns, LPs can submit an **on-chain challenge** using mToken as bonds. Keeper votes determine outcomes. Successful challenges redirect **locked PnL back to LPs**, while rejected challenges allow normal vesting to continue.
+
+This mechanism renders manipulation **net negative EV** (expected value): costs occur immediately while gains are delayed and remain at risk. Legitimate trading proceeds unaffected: liquid pairs have minimal or no locks, while long-tail markets have longer locks (up to 24 hours). This creates effective **risk-pricing friction** that protects market integrity without impeding legitimate activity.
+
+1. **Circuit Breakers**
+
+MYX operates without discretionary controls like whitelists or blacklists. All users interact with the protocol under the same rules, with on-chain custody and settlement enforcement. Consistent with its permissionless design, markets remain continuously open except during narrowly defined risk events.
+
+During exceptional cases—such as oracle failure or extreme divergence from fair value—the protocol may enter a **reduce-only state** at the market level. In this mode, traders can close or reduce positions but cannot add new exposure. This ensures risk can be unwound while preventing the introduction of new liabilities.
+
+The **DAO** governs these circuit-breaker rules through transparent governance. The DAO determines the exact conditions under which markets may enter or exit reduce-only status. This approach balances permissionless access with systemic safety—preserving user rights while maintaining deterministic protections against scenarios where continued risk-opening would threaten solvency.
+
+1. **Inherited Safeguards from V1**
+
+While MYX V2 introduces new mechanisms for liquidity assessment and collateral management, it also preserves key safeguards pioneered in V1 that continue to form the backbone of execution integrity.
+
+**Time Rewind.** On-chain execution is vulnerable to congestion, block delays, and temporary oracle outages. In conventional systems, these interruptions can reorder trades, distort fill prices, and create unwarranted bankruptcies. MYX's time rewind mechanism prevents this by deterministically "replaying" orders against the oracle price points that would have applied without disruption. This ensures orders execute in the correct sequence at the correct prices, preserving stop-loss and take-profit integrity, maintaining effective hedges, and preventing LPs from inheriting unhedged exposures due to delayed balancing trades.
+
+**Index vs. Oracle Cross-Check.** Execution requires the oracle anchor and index reference to remain within a defined tolerance. Orders are rejected if divergence exceeds this threshold, ensuring settlement occurs near fair value and preventing exploitation of stale or manipulated prices.
+
+**Two-Step Execution.** Order submission and execution occur in separate blocks, reducing MEV vulnerability and ensuring committed orders execute deterministically under published rules.
+
+**Auto-Deleveraging (ADL).** When liquidations or exits skew open interest beyond vault collateral capacity, MYX activates auto-deleveraging. This partially reduces profitable positions to release capacity, based on a transparent priority function of effective leverage and unrealized PnL per notional. Unlike reserves or spot swap intents, ADL addresses the structural risk when the counterparty base disappears entirely.
+
+V2's risk framework replaces discretionary judgment with **public formulas coupled to a decentralized rating**. Margins, slippage, funding sensitivity, profit-lock horizons, and FTP levels all function as **measures of liquidity**. Under flexible underwriting, **lock coefficients** and **spot swap intents** make insolvency mechanically impossible, while inherited controls (time rewind, index–oracle checks, two-step execution, ADL) preserve execution integrity. The result is a system where **risk is priced, collateralized, and auditable**—before, during, and after stress.
+
+# 5. Compliance
+
+MYX V2 is built as neutral, permissionless infrastructure. Code enforces execution, custody, and settlement; the protocol has no whitelists, blacklists, or ability to censor individual on-chain accounts. Compliance responsibilities reside at the edges.
+
+Broker mandate covers KYC: each broker integrating MYX Core implements jurisdiction-appropriate onboarding and access controls—ranging from full regulatory KYC for licensed operators to lighter approaches where permitted—without passing identity data to the protocol.
+
+AML oversight follows this same boundary: the protocol maintains complete, public ledgers of orders, positions, funding transfers, liquidations, and redemptions. Brokers handle sanctions screening, transaction monitoring, and required reporting. This separation preserves MYX as an execution and settlement layer while equipping regulated distributors with tools to meet legal obligations.
+
+This model aligns with major regulatory frameworks: licensed access points perform KYC/AML and maintain audit trails, while immutable settlement layers remain identity-agnostic. MYX's design achieves this by making all state transitions on-chain auditable and positioning identity and reporting where law can effectively apply—at the broker interface. In practice, MYX serves as an infrastructure layer: open by default, fully transparent for supervisors, and compatible with various broker compliance models, enabling institutions to meet obligations without compromising the protocol's permissionless core.
+
+# Conclusion and Future Directions
+
+MYX V2 transforms perpetual trading through permissionless design. By separating liquidity functions, implementing efficient matching, and codifying risk rules, the protocol delivers centralized-quality execution with on-chain guarantees. All participants benefit—traders get access, institutions receive certainty, and LPs earn mandate-aligned returns without hidden costs or intervention.
+
+This foundation opens several development paths:
+
+**Chain abstraction.** The system will support proving margin on one chain while executing on another, creating a unified experience across execution layers.
+
+**Multi-collateral margining.** MYX will accept **mTokens and other receipt tokens as collateral**, letting users leverage **without selling into stables**. Capital stays productive while securing positions.
+
+**Cross-margin via risk units.** Built-in **risk units** will contain positions and collateral under shared limits. By netting exposures at portfolio level, accounts become **more resilient** while maintaining clear liquidation prices.
+
+**Transferable positions.** Positions will become **transferable**, enabling risk markets and broker workflows without closing and reopening.
+
+MYX V2 does for derivatives what ERC-20 did for issuance and Uniswap for spot trading. The future is expansion across chains, collaterals, and account models while preserving neutrality—transforming on-chain finance into true **infrastructure**: user custody, transparent rules, and verifiable outcomes.
diff --git a/docs/perps/perps-agentic-feedback-loop.md b/docs/perps/perps-agentic-feedback-loop.md
index b722610db989..e8240e2a65fa 100644
--- a/docs/perps/perps-agentic-feedback-loop.md
+++ b/docs/perps/perps-agentic-feedback-loop.md
@@ -110,11 +110,25 @@ scripts/perps/agentic/app-state.sh eval-async "<js-expression>" # run JS returni
 scripts/perps/agentic/app-state.sh nav                          # full navigation tree
 scripts/perps/agentic/app-state.sh can-go-back                  # check if can go back
 scripts/perps/agentic/app-state.sh go-back                      # navigate back
+scripts/perps/agentic/app-state.sh accounts                     # list all accounts
+scripts/perps/agentic/app-state.sh account                      # get selected account
+scripts/perps/agentic/app-state.sh switch-account <addr>        # switch to account by address
+scripts/perps/agentic/app-state.sh recipe <team/name>           # run a recipe (e.g. perps/positions)
+scripts/perps/agentic/app-state.sh recipe --list                # list all available recipes
 scripts/perps/agentic/screenshot.sh [label]                     # take screenshot, returns path
 scripts/perps/agentic/start-metro.sh                            # ensure Metro is running
 scripts/perps/agentic/stop-metro.sh                             # stop Metro background process
-scripts/perps/agentic/reload-metro.sh                            # trigger hot-reload on all connected apps
-scripts/perps/agentic/test-trade-flow.sh                         # end-to-end trade validation harness
+scripts/perps/agentic/reload-metro.sh                           # trigger hot-reload on all connected apps
+```
+
+**yarn shortcuts** (human-friendly aliases):
+
+```bash
+yarn a:start      # start/attach Metro
+yarn a:stop       # stop Metro
+yarn a:status     # current route
+yarn a:reload     # hot-reload all connected apps
+yarn a:navigate   # navigate to a screen (pass route + optional params)
 ```
 
 **Metro log**: `.agent/metro.log` — grep for errors after changes.
@@ -123,17 +137,19 @@ scripts/perps/agentic/test-trade-flow.sh                         # end-to-end tr
 
 ```
 scripts/perps/agentic/
-├── cdp-bridge.js       # CDP engine: WebSocket client, target discovery, eval, navigate
-├── app-navigate.sh     # Navigate wrapper (calls cdp-bridge + auto-screenshot)
-├── app-state.sh        # State/route/eval wrapper (calls cdp-bridge)
-├── screenshot.sh       # Cross-platform screenshot (iOS simctl / Android adb)
-├── start-metro.sh      # Start Metro (or attach to existing)
-├── stop-metro.sh       # Stop Metro background process
-├── reload-metro.sh     # Trigger hot-reload on all connected apps
-└── test-trade-flow.sh  # End-to-end trade validation (place → verify → close)
+├── cdp-bridge.js          # CDP engine: WebSocket client, target discovery, eval, navigate
+├── app-navigate.sh        # Navigate wrapper (calls cdp-bridge + auto-screenshot)
+├── app-state.sh           # State/route/eval/accounts/recipe wrapper (calls cdp-bridge)
+├── screenshot.sh          # Cross-platform screenshot (iOS simctl / Android adb)
+├── start-metro.sh         # Start Metro (or attach to existing)
+├── stop-metro.sh          # Stop Metro background process
+├── reload-metro.sh        # Trigger hot-reload on all connected apps
+└── recipes/               # Per-team recipe files (see recipes/README.md)
+    ├── perps.json          # Perps team recipes (positions, auth, balances, markets, trade-flow, etc.)
+    └── README.md           # How to add recipes for your team
 ```
 
-The `__AGENTIC__` bridge on `globalThis` exposes: `navigate()`, `getRoute()`, `getState()`, `canGoBack()`, `goBack()`. These work identically on both platforms via Metro's Hermes CDP.
+The `__AGENTIC__` bridge on `globalThis` exposes: `navigate()`, `getRoute()`, `getState()`, `canGoBack()`, `goBack()`, `listAccounts()`, `getSelectedAccount()`, `switchAccount()`. These work identically on both platforms via Metro's Hermes CDP.
 
 > **Platform targeting**: CDP-based commands (navigate, state, eval, go-back) are platform-agnostic — they go through Metro's WebSocket and reach whichever app is connected. Screenshots require direct device access (`xcrun simctl` or `adb`), so `screenshot.sh` auto-detects the platform. When both iOS and Android devices are connected, set `PLATFORM=android` or `PLATFORM=ios` to disambiguate. Since `app-navigate.sh` takes a verification screenshot, pass `PLATFORM` when needed:
 >
@@ -239,53 +255,40 @@ scripts/perps/agentic/app-state.sh eval-async \
 
 ### Trade Flow Validation
 
-`test-trade-flow.sh` is an end-to-end trade validation harness that places a real order, monitors WebSocket data flow, and verifies position state changes. It was created to validate fixes for TAT-2597 (position not appearing after trade) and TAT-2598 (missing prices / can't trade).
+The trade flow validation pattern uses three recipes in `recipes/perps.json` to capture pre/post state around an order. This replaces a shell script with composable `eval-async` calls that an agent can orchestrate directly.
 
-**Usage:**
+**Recipes:**
+
+| Recipe              | Description                                        |
+| ------------------- | -------------------------------------------------- |
+| `perps/pre-trade`   | Position count + balance snapshot before the trade |
+| `perps/place-order` | **TEMPLATE** — market buy BTC $10 at 2x leverage   |
+| `perps/post-trade`  | Same snapshot shape as pre-trade for comparison    |
+
+**Orchestration pattern:**
 
 ```bash
-# Default: BTC long, $10, 2x leverage
-scripts/perps/agentic/test-trade-flow.sh
+# 1. Capture baseline
+scripts/perps/agentic/app-state.sh recipe perps/pre-trade
 
-# Custom symbol, side, size
-SYMBOL=ETH SIDE=sell SIZE=0.01 USD_AMOUNT=20 \
-  scripts/perps/agentic/test-trade-flow.sh
+# 2. Place order (template — edit the expression or use eval-async for custom params)
+scripts/perps/agentic/app-state.sh recipe perps/place-order
 
-# Skip navigation (already on Perps screen)
-SKIP_NAV=1 scripts/perps/agentic/test-trade-flow.sh
+# 3. Wait for WebSocket updates
+sleep 5
 
-# Keep position open after test
-SKIP_CLOSE=1 scripts/perps/agentic/test-trade-flow.sh
+# 4. Capture post-trade state
+scripts/perps/agentic/app-state.sh recipe perps/post-trade
 ```
 
-**Environment variables:**
-
-| Variable      | Default   | Description                                |
-| ------------- | --------- | ------------------------------------------ |
-| `SYMBOL`      | `BTC`     | Market symbol                              |
-| `SIDE`        | `buy`     | `buy` (long) or `sell` (short)             |
-| `SIZE`        | `0.0001`  | Position size in base asset                |
-| `USD_AMOUNT`  | `10`      | Notional USD value                         |
-| `LEVERAGE`    | `2`       | Leverage multiplier                        |
-| `ORDER_TYPE`  | `market`  | `market` or `limit`                        |
-| `LIMIT_PRICE` | _(empty)_ | Price for limit orders                     |
-| `SLIPPAGE`    | `500`     | Max slippage in basis points               |
-| `SKIP_NAV`    | _(empty)_ | Set to `1` to skip navigation to Perps     |
-| `SKIP_CLOSE`  | _(empty)_ | Set to `1` to keep position open           |
-| `PLATFORM`    | `android` | Platform for screenshots                   |
-| `WAIT_SECS`   | `5`       | Seconds to wait for WS updates after order |
-
-**What it validates:**
-
-1. Engine accessibility via CDP
-2. Pre-trade position count capture
-3. Live price fetch from `getMarketDataWithPrices()`
-4. Order validation via `validateOrder()`
-5. Order placement via `placeOrder()` + latency measurement
-6. Post-trade position count increase (TAT-2597)
-7. WebSocket position callbacks (`PositionStreamChannel`) (TAT-2597)
-8. Price stream first-data receipt (TAT-2598)
-9. Position cleanup via `closePosition()` (unless `SKIP_CLOSE`)
+**Custom order via `eval-async`** (substitute your own params):
+
+```bash
+scripts/perps/agentic/app-state.sh eval-async \
+  "Engine.context.PerpsController.placeOrder({symbol:'ETH',isBuy:false,orderType:'market',size:'0.01',leverage:3,usdAmount:'20',maxSlippageBps:500}).then(function(r){return JSON.stringify(r)})"
+```
+
+> **Important:** `perps/place-order` places a real order. It is labeled as a template/example. Always verify auth state (`perps/auth`) and balances (`perps/balances`) before running.
 
 ### Metro Log Debugging
 
@@ -315,6 +318,39 @@ grep 'PERPS_DEBUG.*cache' .agent/metro.log | tail -20
 
 > When debugging WS issues, the key signal is whether `PositionStreamChannel: WS callback` appears after placing an order. If it doesn't, the WebSocket subscription may be stale — check `ensureReady` logs for connection state.
 
+### Account Management
+
+The `__AGENTIC__` bridge exposes account methods at the root level. These are available via `cdp-bridge.js` commands or `app-state.sh` wrappers.
+
+```bash
+# List all accounts (id, address, name)
+scripts/perps/agentic/app-state.sh accounts
+
+# Get the currently selected account
+scripts/perps/agentic/app-state.sh account
+
+# Switch to a different account by address
+scripts/perps/agentic/app-state.sh switch-account 0x1234...abcd
+```
+
+Useful for auth scoping validation — switch accounts and verify that controller state (e.g. perps auth) updates correctly. Combine with `recipe perps/auth` to check auth state after switching.
+
+### Recipes
+
+Recipes are per-team JSON files in `scripts/perps/agentic/recipes/` that define reusable CDP expressions. This keeps domain-specific helpers in the scripts layer rather than the app source — any controller method accessible via `Engine.context` can be a recipe.
+
+```bash
+# Run a recipe
+scripts/perps/agentic/app-state.sh recipe perps/positions
+scripts/perps/agentic/app-state.sh recipe perps/auth
+scripts/perps/agentic/app-state.sh recipe perps/markets
+
+# List all available recipes
+scripts/perps/agentic/app-state.sh recipe --list
+```
+
+**Adding recipes for your team:** Create `recipes/<team>.json` — see `recipes/README.md` for the format. Each recipe has a description, a JS expression, and an `async` flag.
+
 ---
 
 ## 5. State Paths & Routes
diff --git a/docs/perps/perps-connection-architecture.md b/docs/perps/perps-connection-architecture.md
index d1cb7298fcfe..87693d9048e1 100644
--- a/docs/perps/perps-connection-architecture.md
+++ b/docs/perps/perps-connection-architecture.md
@@ -204,20 +204,17 @@ The Perps system preloads market data and user data in the background before the
 
 The controller stores preloaded user data in transient (non-persisted) state fields:
 
-| Field                       | Type                        | Description                           |
-| --------------------------- | --------------------------- | ------------------------------------- |
-| `cachedMarketData`          | `PerpsMarketData[] \| null` | Preloaded market data from REST       |
-| `cachedMarketDataTimestamp` | `number`                    | Timestamp of last market data preload |
-| `cachedPositions`           | `Position[] \| null`        | Preloaded positions from REST         |
-| `cachedOrders`              | `Order[] \| null`           | Preloaded open orders from REST       |
-| `cachedAccountState`        | `AccountState \| null`      | Preloaded account state from REST     |
-| `cachedUserDataTimestamp`   | `number`                    | Timestamp of last user data preload   |
-| `cachedUserDataAddress`     | `string \| null`            | Address the cached data belongs to    |
+| Field                       | Type                        | Description                                                                                                       |
+| --------------------------- | --------------------------- | ----------------------------------------------------------------------------------------------------------------- |
+| `cachedMarketData`          | `PerpsMarketData[] \| null` | Preloaded market data from REST                                                                                   |
+| `cachedMarketDataTimestamp` | `number`                    | Timestamp of last market data preload                                                                             |
+| `cachedUserDataByProvider`  | `Record<string, {...}>`     | Per-provider cached user data (positions, orders, accountState, timestamp, address) keyed by `providerId:network` |
 
 User data cache is automatically cleared when:
 
-- The selected account changes (detected in preload state handler)
-- Network or HIP-3 config changes (cleared alongside market data cache)
+- The selected account changes (all entries cleared since all provider data is stale for new account)
+
+Network and testnet toggle do NOT clear the cache — different network keys prevent collisions.
 
 ### Hook Behavior When Not Connected
 
diff --git a/docs/perps/perps-sentry-reference.md b/docs/perps/perps-sentry-reference.md
index aad47db3fb77..bab3f21cfa0f 100644
--- a/docs/perps/perps-sentry-reference.md
+++ b/docs/perps/perps-sentry-reference.md
@@ -564,6 +564,27 @@ catch (error) {
 9. **Use `Logger.error()` with context** for all error logging (see Error Logging Best Practices)
 10. **Use `ensureError()` helper** to normalize caught errors before logging
 
+## Connection Error Screen Monitoring
+
+### Sentry Filter
+
+```
+component:PerpsConnectionManager action:connection_connection
+```
+
+Use this to isolate genuine perps connection failures. You can also use `feature:perps` as a broader filter — the `feature` tag is set on all perps errors and already excludes Polymarket noise.
+
+Fires on initial `connect()` failures and programmatic `reconnectWithNewContext()` calls. User-initiated retries from the error screen only add a Sentry breadcrumb (no new event) to avoid noise.
+
+### MixPanel
+
+| Event                  | Key Properties                                                                        |
+| ---------------------- | ------------------------------------------------------------------------------------- |
+| `PERPS_SCREEN_VIEWED`  | `screen_name: connection_error`, `error_message`, `retry_attempts`                    |
+| `PERPS_UI_INTERACTION` | `action: connection_retry` or `connection_go_back`, `error_message`, `attempt_number` |
+
+---
+
 ## Related Files
 
 - **Trace utilities**: `app/util/trace.ts`
diff --git a/ios/Gemfile b/ios/Gemfile
index f761002d3e0f..e88ad88131f7 100644
--- a/ios/Gemfile
+++ b/ios/Gemfile
@@ -1,7 +1,7 @@
 source 'https://rubygems.org'
 
 # Recommended to use http://rbenv.org/ to install and use this version
-ruby '>= 3.1.6'
+ruby '>= 3.2.9'
 
 # Allow minor version updates up to but excluding 2.0.0
 gem 'cocoapods', '1.16.2'
diff --git a/ios/Gemfile.lock b/ios/Gemfile.lock
index 59cfe984b20f..fa26886a05bb 100644
--- a/ios/Gemfile.lock
+++ b/ios/Gemfile.lock
@@ -301,7 +301,7 @@ DEPENDENCIES
   fastlane (>= 2.220.0)
 
 RUBY VERSION
-   ruby 3.1.6p260
+   ruby 3.2.9
 
 BUNDLED WITH
    2.5.8
diff --git a/ios/MetaMask.xcodeproj/project.pbxproj b/ios/MetaMask.xcodeproj/project.pbxproj
index 2a878cfebeb5..f90d59676664 100644
--- a/ios/MetaMask.xcodeproj/project.pbxproj
+++ b/ios/MetaMask.xcodeproj/project.pbxproj
@@ -1281,7 +1281,7 @@
 				CODE_SIGN_IDENTITY = "Apple Development";
 				"CODE_SIGN_IDENTITY[sdk=iphoneos*]" = "iPhone Developer";
 				CODE_SIGN_STYLE = Manual;
-				CURRENT_PROJECT_VERSION = 4009;
+				CURRENT_PROJECT_VERSION = 4015;
 				DEAD_CODE_STRIPPING = YES;
 				DEBUG_INFORMATION_FORMAT = dwarf;
 				DEVELOPMENT_TEAM = 48XVW22RCG;
@@ -1319,7 +1319,7 @@
 					"${inherited}",
 				);
 				LLVM_LTO = YES;
-				MARKETING_VERSION = 7.68.1;
+				MARKETING_VERSION = 7.69.0;
 				ONLY_ACTIVE_ARCH = YES;
 				OTHER_CFLAGS = "$(inherited)";
 				OTHER_LDFLAGS = (
@@ -1330,8 +1330,8 @@
 				OTHER_SWIFT_FLAGS = "$(inherited) -D EXPO_CONFIGURATION_DEBUG";
 				PRODUCT_BUNDLE_IDENTIFIER = "io.metamask.$(PRODUCT_NAME:rfc1034identifier)";
 				PRODUCT_NAME = MetaMask;
-				PROVISIONING_PROFILE_SPECIFIER = "match Development io.metamask.MetaMask";
-				"PROVISIONING_PROFILE_SPECIFIER[sdk=iphoneos*]" = "match Development io.metamask.MetaMask";
+				PROVISIONING_PROFILE_SPECIFIER = "development-metamask";
+				"PROVISIONING_PROFILE_SPECIFIER[sdk=iphoneos*]" = "development-metamask";
 				SWIFT_OBJC_BRIDGING_HEADER = "MetaMask-Bridging-Header.h";
 				SWIFT_OPTIMIZATION_LEVEL = "-Onone";
 				SWIFT_PRECOMPILE_BRIDGING_HEADER = NO;
@@ -1350,7 +1350,7 @@
 				CODE_SIGN_ENTITLEMENTS = MetaMask/MetaMask.entitlements;
 				CODE_SIGN_IDENTITY = "iPhone Distribution";
 				CODE_SIGN_STYLE = Manual;
-				CURRENT_PROJECT_VERSION = 4009;
+				CURRENT_PROJECT_VERSION = 4015;
 				DEBUG_INFORMATION_FORMAT = "dwarf-with-dsym";
 				DEVELOPMENT_TEAM = 48XVW22RCG;
 				"DEVELOPMENT_TEAM[sdk=iphoneos*]" = 48XVW22RCG;
@@ -1385,7 +1385,7 @@
 					"${inherited}",
 				);
 				LLVM_LTO = YES;
-				MARKETING_VERSION = 7.68.1;
+				MARKETING_VERSION = 7.69.0;
 				ONLY_ACTIVE_ARCH = NO;
 				OTHER_CFLAGS = "$(inherited)";
 				OTHER_LDFLAGS = (
@@ -1416,7 +1416,7 @@
 				CODE_SIGN_IDENTITY = "Apple Development";
 				"CODE_SIGN_IDENTITY[sdk=iphoneos*]" = "iPhone Developer";
 				CODE_SIGN_STYLE = Manual;
-				CURRENT_PROJECT_VERSION = 4009;
+				CURRENT_PROJECT_VERSION = 4015;
 				DEAD_CODE_STRIPPING = YES;
 				DEBUG_INFORMATION_FORMAT = dwarf;
 				DEVELOPMENT_TEAM = 48XVW22RCG;
@@ -1454,7 +1454,7 @@
 					"\"$(SRCROOT)/MetaMask/System/Library/Frameworks\"",
 				);
 				LLVM_LTO = YES;
-				MARKETING_VERSION = 7.68.1;
+				MARKETING_VERSION = 7.69.0;
 				ONLY_ACTIVE_ARCH = YES;
 				OTHER_CFLAGS = "$(inherited)";
 				OTHER_LDFLAGS = (
@@ -1483,7 +1483,7 @@
 				CODE_SIGN_ENTITLEMENTS = MetaMask/MetaMask.entitlements;
 				CODE_SIGN_IDENTITY = "iPhone Distribution";
 				CODE_SIGN_STYLE = Manual;
-				CURRENT_PROJECT_VERSION = 4009;
+				CURRENT_PROJECT_VERSION = 4015;
 				DEBUG_INFORMATION_FORMAT = "dwarf-with-dsym";
 				DEVELOPMENT_TEAM = 48XVW22RCG;
 				"DEVELOPMENT_TEAM[sdk=iphoneos*]" = 48XVW22RCG;
@@ -1518,7 +1518,7 @@
 					"\"$(SRCROOT)/MetaMask/System/Library/Frameworks\"",
 				);
 				LLVM_LTO = YES;
-				MARKETING_VERSION = 7.68.1;
+				MARKETING_VERSION = 7.69.0;
 				ONLY_ACTIVE_ARCH = NO;
 				OTHER_CFLAGS = "$(inherited)";
 				OTHER_LDFLAGS = (
@@ -1646,7 +1646,7 @@
 				CODE_SIGN_IDENTITY = "Apple Development";
 				"CODE_SIGN_IDENTITY[sdk=iphoneos*]" = "iPhone Developer";
 				CODE_SIGN_STYLE = Manual;
-				CURRENT_PROJECT_VERSION = 4009;
+				CURRENT_PROJECT_VERSION = 4015;
 				DEAD_CODE_STRIPPING = YES;
 				DEBUG_INFORMATION_FORMAT = dwarf;
 				DEVELOPMENT_TEAM = 48XVW22RCG;
@@ -1684,7 +1684,7 @@
 					"\"$(SRCROOT)/MetaMask/System/Library/Frameworks\"",
 				);
 				LLVM_LTO = YES;
-				MARKETING_VERSION = 7.68.1;
+				MARKETING_VERSION = 7.69.0;
 				ONLY_ACTIVE_ARCH = YES;
 				OTHER_CFLAGS = (
 					"$(inherited)",
@@ -1716,7 +1716,7 @@
 				CODE_SIGN_ENTITLEMENTS = MetaMask/MetaMask.entitlements;
 				CODE_SIGN_IDENTITY = "iPhone Distribution";
 				CODE_SIGN_STYLE = Manual;
-				CURRENT_PROJECT_VERSION = 4009;
+				CURRENT_PROJECT_VERSION = 4015;
 				DEBUG_INFORMATION_FORMAT = "dwarf-with-dsym";
 				DEVELOPMENT_TEAM = 48XVW22RCG;
 				"DEVELOPMENT_TEAM[sdk=iphoneos*]" = 48XVW22RCG;
@@ -1751,7 +1751,7 @@
 					"\"$(SRCROOT)/MetaMask/System/Library/Frameworks\"",
 				);
 				LLVM_LTO = YES;
-				MARKETING_VERSION = 7.68.1;
+				MARKETING_VERSION = 7.69.0;
 				ONLY_ACTIVE_ARCH = NO;
 				OTHER_CFLAGS = (
 					"$(inherited)",
diff --git a/locales/languages/de.json b/locales/languages/de.json
index 7d9193f8219a..5480fbd625b9 100644
--- a/locales/languages/de.json
+++ b/locales/languages/de.json
@@ -104,8 +104,8 @@
       "title": "Unzureichende Gelder"
     },
     "insufficient_pay_token_native_post_quote": {
-      "message": "Not enough {{ticker}} to cover fees. Add {{ticker}} to continue.",
-      "title": "Insufficient funds for post quote"
+      "message": "Nicht genug {{ticker}}, um die Gebühren zu decken. Fügen Sie {{ticker}} hinzu, um fortzufahren.",
+      "title": "Unzureichende Mittel für nachträgliche Angebote"
     },
     "no_pay_token_quotes": {
       "message": "Diese Zahlungsroute ist derzeit nicht verfügbar. Versuchen Sie, den Betrag, das Netzwerk oder das Token zu ändern, und wir finden die beste Option.",
@@ -207,7 +207,7 @@
     "connector": "bei"
   },
   "autocomplete": {
-    "placeholder": "Suche nach Website oder Adresse",
+    "placeholder": "Search by site or address",
     "recents": "Aktuelle",
     "favorites": "Favoriten",
     "sites": "Websites",
@@ -1184,7 +1184,6 @@
       "title": "Neue Order",
       "leverage": "Hebel",
       "limit_price": "Limitpreis",
-      "market_price": "Marktpreis",
       "enter_price": "Preis eingeben",
       "trigger_price": "Auslösungspreis",
       "liquidation_price": "Liquidationspreis",
@@ -1328,7 +1327,6 @@
       "funds_are_available_to_trade": "Gelder sind für den Handel verfügbar",
       "close_order_still_active": "Schließung der Order noch aktiv",
       "order_submitted": "Order übermittelt",
-      "submitting_your_trade": "Handel übermitteln",
       "order_filled": "Order ausgeführt",
       "order_placed": "Order erteilt",
       "order_placement_subtitle": "{{direction}} {{amount}} {{assetSymbol}}",
@@ -1346,26 +1344,14 @@
       "title": "Order-Details",
       "cancel_order": "Order stornieren",
       "date": "Datum",
-      "trigger_condition": "Auslösebedingung",
-      "price": "Preis",
       "fee": "Gebühr",
       "limit_buy": "Long-Position limitieren",
       "limit_price": "Limitpreis",
       "limit_sell": "Short-Position limitieren",
       "market_buy": "Markt-Long-Position",
       "market_sell": "Markt-Short-Position",
-      "market": "Markt",
       "open": "Eröffnen",
       "size": "Größe",
-      "original_size": "Originalgröße",
-      "order_value": "Orderwert",
-      "reduce_only": "Nur reduzieren",
-      "yes": "Ja",
-      "no": "Nein",
-      "price_above": "Preis über {{price}}",
-      "price_below": "Preis unter {{price}}",
-      "take_profit": "Take-Profit",
-      "stop_loss": "Stop-Loss",
       "status": "Status",
       "view_explorer": "Im Explorer anzeigen"
     },
@@ -2197,6 +2183,7 @@
     "available_balance": "Verfügbares Guthaben",
     "claim_amount_text": "{{amount}} $ einfordern",
     "claim_winnings_text": "Gewinne einfordern",
+    "claiming_text": "Claiming...",
     "unrealized_pnl_label": "Nicht realisierte GuV",
     "unrealized_pnl_value": "{{amount}} ({{percent}})",
     "unrealized_pnl_error": "Laden nicht möglich",
@@ -2275,6 +2262,9 @@
           "title": "Hoppla! Etwas ist schiefgelaufen ...",
           "description": "Fortfahren mit Einforderung fehlgeschlagen",
           "try_again": "Erneut versuchen"
+        },
+        "in_progress": {
+          "title": "Claim already in progress"
         }
       }
     },
@@ -2308,7 +2298,6 @@
       "withdrawing_subtitle": "Verfügbar in etwa 1 Minute",
       "withdraw_completed": "Auszahlung abgeschlossen",
       "withdraw_completed_subtitle": "{{amount}} USDC wurden Ihre Wallet hinzugefügt",
-      "withdraw_any_token_completed_subtitle": "{{amount}} {{token}} wurde Ihrer Wallet hinzugefügt",
       "error_title": "Hoppla! Etwas ist schiefgelaufen ...",
       "error_description": "Fortfahren mit Auszahlung fehlgeschlagen",
       "try_again": "Erneut versuchen"
@@ -2440,7 +2429,7 @@
     "add_tokens": "Token importieren",
     "are_you_sure_exit": "Are you sure you want to exit?",
     "import_token": "Would you like to import this token?",
-    "import_tokens": "Möchten Sie diese Token importieren?",
+    "import_tokens": "Would you like to import these tokens?",
     "tokens_detected_in_account": "{{tokenCount}} neue {{tokensLabel}} in diesem Konto gefunden",
     "token_toast": {
       "tokens_imported_title": "Importierte Tokens",
@@ -2705,7 +2694,7 @@
     "decimals_cant_be_empty": "Token-Dezimalzahlen können nicht leer sein.",
     "decimals_is_required": "Decimal is required. Find it on:",
     "no_tokens_found": "Wir konnten keine Token mit diesem Namen finden.",
-    "tokens_empty_description": "Nach einem beliebigen Token suchen und importieren",
+    "tokens_empty_description": "Search for any token and import it",
     "select_token": "Token auswählen",
     "address_must_be_smart_contract": "Privatadresse erkannt. Geben Sie die Token-Contract-Adresse ein.",
     "billion_abbreviation": "Mrd.",
@@ -2915,10 +2904,6 @@
     "enabling_notifications": "Benachrichtigungen aktivieren ...",
     "updating_notifications": "Aktualisierung der Benachrichtigungen ...",
     "updating_account_settings": "Aktualisierung der Kontoeinstellungen ...",
-    "reset_notifications_title": "Benachrichtigungen zurücksetzen",
-    "reset_notifications_description": "Das Zurücksetzen von Benachrichtigungen führt zum Löschen Ihrer Speicherschlüssel für Benachrichtigungen sowie zum Zurücksetzen Ihres gesamten Benachrichtigungsverlaufs. Möchten Sie diesen Vorgang wirklich fortsetzen?",
-    "reset_notifications": "Benachrichtigungen zurücksetzen",
-    "reset_notifications_success": "Der Speicherungsschlüssel für Benachrichtigungen wurde gelöscht/neu erstellt und der Benachrichtigungsverlauf zurückgesetzt.",
     "notifications_dismiss_modal": "Verwerfen",
     "select_rpc_url": "RPC-URL auswählen",
     "title": "Einstellungen",
@@ -3040,9 +3025,9 @@
     "add_rpc_url": "RPC-URL hinzufügen",
     "add_block_explorer_url": "Block-Explorer-URL hinzufügen",
     "networks_desc": "Benutzerdefinierte RPC-Netzwerke hinzufügen und verwalten",
-    "networks_enabled": "Aktivierte Netzwerke",
-    "networks_test_networks": "Testnetzwerke",
-    "networks_additional": "Zusätzliche Netzwerke",
+    "networks_enabled": "Enabled Networks",
+    "networks_test_networks": "Test Networks",
+    "networks_additional": "Additional Networks",
     "networks_search_placeholder": "Netzwerk suchen",
     "networks_no_results": "Keine Netzwerke gefunden",
     "network_name_label": "Netzwerkname",
@@ -3062,15 +3047,15 @@
     "network_rpc_networks": "RPC-Netzwerke",
     "network_add_network": "Netzwerk hinzufügen",
     "add_chain_title": "Ein Netzwerk hinzufügen",
-    "add_chain_search_placeholder": "Suche nach Name, Chain-ID oder Währung",
-    "add_chain_loading": "Netzwerke werden geladen…",
-    "add_chain_error": "Netzwerke konnten nicht geladen werden. Bitte versuchen Sie es erneut.",
+    "add_chain_search_placeholder": "Search by name, chain ID, or currency",
+    "add_chain_loading": "Loading networks…",
+    "add_chain_error": "Failed to load networks. Please try again.",
     "add_chain_retry": "Erneut versuchen",
-    "add_chain_added": "Hinzugefügt",
+    "add_chain_added": "Added",
     "add_chain_or": "oder",
     "add_chain_custom_link": "Benutzerdefiniertes Netzwerk hinzufügen",
     "network_add_custom_network": "Benutzerdefiniertes Netzwerk hinzufügen",
-    "network_add_test_network": "Testnetzwerk hinzufügen",
+    "network_add_test_network": "Add a test network",
     "network_add": "Hinzufügen",
     "network_save": "Speichern",
     "remove_network_title": "Möchten Sie dieses Netzwerk entfernen?",
@@ -3394,9 +3379,11 @@
     ],
     "private_key_explanation": "Speichern Sie diese an einem sicheren und geheimen Ort.",
     "private_key_warning": "Dies ist der private Key für das aktuell ausgewählte Konto: {{accountName}}. Geben Sie diesen Key niemals weiter. Jeder, der über Ihren privaten Key verfügt, kann Ihr Konto vollständig kontrollieren, einschließlich der Überweisung von Geldern.",
-    "seed_phrase_warning_explanation": "Stellen Sie sicher, dass niemand auf Ihren Bildschirm schaut. Der MetaMask-Support wird Sie nie danach fragen.",
+    "seed_phrase_warning_explanation": [
+      "Stellen Sie sicher, dass niemand auf Ihren Bildschirm schaut.",
+      "Der MetaMask Support wird Sie nie danach fragen."
+    ],
     "private_key_warning_explanation": "Geben Sie diesen Key niemals weiter. Jeder, der Ihren privaten Key hat, kann Ihr Konto vollständig kontrollieren, einschließlich der Überweisung Ihrer Gelder.",
-    "reveal_srp_description": "Mit Ihrer geheimen Wiederherstellungsphrase haben Sie uneingeschränkten Zugriff auf Ihre Wallet. Geben Sie diese nicht an Dritte weiter.",
     "reveal_credential_modal": [
       "Ihr {{credentialName}} bietet ",
       "vollständigen Zugriff auf Ihr Konto sowie Ihre Gelder.\n\nTeilen Sie dies mit niemandem.\n",
@@ -3428,8 +3415,7 @@
     "srp_text": "Geheime Wiederherstellungsphrase",
     "private_key_text": "Privater Schlüssel",
     "got_it": "Verstanden",
-    "learn_more": "Mehr erfahren",
-    "copied_to_clipboard": "In die Zwischenablage kopiert"
+    "learn_more": "Mehr erfahren"
   },
   "screenshot_deterrent": {
     "title": "Sicherheitsbenachrichtigung",
@@ -3810,7 +3796,7 @@
     "transaction_fee_explanation": "Bei dieser Genehmigung fällt eine Transaktionsgebühr an.",
     "view_details": "Detail ansehen",
     "view_transaction_details": "Transaktionsdetails anzeigen",
-    "view_data": "Daten anzeigen",
+    "view_data": "View data",
     "transaction_details": "Transaktionsdetails",
     "site_url": "Seiten-URL",
     "permission_request": "Berechtigungsanfrage",
@@ -3865,7 +3851,7 @@
     "no_tabs_desc": "Öffnen Sie einen neuen Tab, um im dezentralisieren Web zu surfen.",
     "got_it": "Verstanden",
     "max_tabs_title": "Maximale Anzahl an Tabs erreicht",
-    "max_tabs_desc": "Derzeit können nur 20 Tabs gleichzeitig geöffnet werden. Bitte schließen Sie vorhandene Tabs, bevor Sie neue hinzufügen.",
+    "max_tabs_desc": "We currently only support 20 open tabs at once. Please close existing tabs before adding new ones.",
     "failed_to_resolve_ens_name": "Wir konnten diesen ENS-Namen nicht lösen",
     "remove_bookmark_title": "Favoriten entfernen",
     "remove_bookmark_msg": "Möchten Sie diese Seite wirklich aus Ihren Favoriten entfernen?",
@@ -3891,7 +3877,7 @@
     "right_button": "Wallet schützen"
   },
   "add_favorite": {
-    "title": "Favoriten hinzufügen",
+    "title": "Add favorite",
     "title_label": "Name",
     "url_label": "URL",
     "add_button": "Hinzufügen",
@@ -4245,8 +4231,8 @@
   "biometrics": {
     "enable_touchid": "Mit Touch ID entsperren?",
     "enable_faceid": "Mit Face ID entsperren?",
-    "enable_fingerprint": "Mit Fingerabdruck entsperren?",
-    "enable_biometrics": "Mit Biometrisch entsperren?",
+    "enable_fingerprint": "Unlock with fingerprint?",
+    "enable_biometrics": "Unlock with biometrics?",
     "enable_device_passcode_ios": "Mit Geräte-Passcode entsperren?",
     "enable_device_passcode_android": "Mit Geräte-PIN entsperren?"
   },
@@ -4772,7 +4758,7 @@
     "public_address": "Öffentliche Adresse",
     "public_address_qr_code": "Öffentliche Adresse",
     "coming_soon": "In Kürze ...",
-    "request_payment": "Zahlung anfragen",
+    "request_payment": "Request payment",
     "copy": "Kopieren",
     "scan_address": "Adresse scannen, um Zahlung zu erhalten",
     "copy_address": "Adresse kopieren"
@@ -4786,8 +4772,8 @@
     "switch_network": "Bitte wechseln Sie auf Mainnet oder Sepolia.",
     "card_title": "Schaltfläche MetaMask-Karte immer anzeigen",
     "card_desc": "MetaMask-Karte ist nur für Einwohner ausgewählter Länder verfügbar.",
-    "daimo_demo_title": "DaimoPay-Demo-Umgebung verwenden",
-    "daimo_demo_desc": "Wechseln Sie für Kartenzahlungen zwischen der DaimoPay-Demo- und Produktionsumgebung."
+    "daimo_demo_title": "Use DaimoPay demo environment",
+    "daimo_demo_desc": "Toggle between DaimoPay demo and production environments for card payments."
   },
   "walletconnect_sessions": {
     "no_active_sessions": "Sie haben keine aktiven Sitzungen",
@@ -4800,10 +4786,10 @@
     "close_current_session": "Schließen Sie die aktuelle Sitzung, bevor Sie eine neue beginnen."
   },
   "paymentRequest": {
-    "title": "Zahlungsanfrage",
-    "title_complete": "Zahlung abgeschlossen",
+    "title": "Payment request",
+    "title_complete": "Payment complete",
     "confirm": "Bezahlen",
-    "cancel": "Ablehnen",
+    "cancel": "Decline",
     "is_requesting_you_to_pay": "bittet Sie um eine Zahlung",
     "total": "Insgesamt:"
   },
@@ -4838,7 +4824,6 @@
     "no_payment_methods_available": "Es stehen keine Zahlungsmethoden zur Verfügung.",
     "error_fetching_quotes": "Etwas ist schiefgelaufen! Bitte versuchen Sie es erneut.",
     "no_quotes_available": "Keine Anbieter verfügbar.",
-    "quote_unavailable": "Angebot nicht verfügbar.",
     "providers": "Anbieter",
     "quotes_displayed_for": "Angebote angezeigt für {{paymentMethodName}}.",
     "other_options": "Other options",
@@ -4944,10 +4929,10 @@
       "logged_out_error": "Fehler beim Abmelden"
     },
     "token_unavailable_modal": {
-      "title": "Nicht verfügbar",
-      "description": "{{token}} ist bei {{provider}} in Ihrer Region nicht verfügbar.",
-      "change_token": "Token ändern",
-      "change_provider": "Anbieter wechseln"
+      "title": "Not available",
+      "description": "{{token}} is not available with {{provider}} in your region.",
+      "change_token": "Change token",
+      "change_provider": "Change provider"
     },
     "provider_picker_modal": {
       "title": "Anbieter auswählen"
@@ -5185,39 +5170,6 @@
     },
     "deposit_order_title": "{{currency}}-Einzahlung"
   },
-  "ramps_order_details": {
-    "title": "Order-Details",
-    "status": "Status",
-    "processing": "Verarbeitung",
-    "complete": "Abgeschlossen",
-    "failed": "Fehlgeschlagen",
-    "cancelled": "Abgebrochen",
-    "view_on_provider": "Auf {{provider}} anzeigen",
-    "order_id": "Auftrags-ID",
-    "date_and_time": "Datum und Uhrzeit",
-    "fees": "Gebühren",
-    "total": "Insgesamt",
-    "card_processing_info": "Kartenkäufe dauern in der Regel nur wenige Minuten",
-    "processing_info_modal_description": "Kartenkäufe dauern in der Regel nur wenige Minuten. Bei Fragen können Sie sich gerne an den Support wenden.",
-    "go_to_provider_support": "Zur Supportseite des {{provider}}",
-    "error_title": "Hoppla! Etwas ist schiefgelaufen ...",
-    "error_message": "Order-Details können nicht geladen werden. Bitte versuchen Sie es erneut.",
-    "try_again": "Erneut versuchen",
-    "close": "Schließen"
-  },
-  "ramps_v2": {
-    "notifications": {
-      "purchase_pending_title": "Bearbeitung Ihres Kaufs von {{cryptocurrency}}",
-      "purchase_pending_description": "Dies sollte nur ein paar Minuten dauern ...",
-      "purchase_completed_title": "Ihr Kauf von {{amount}} {{cryptocurrency}} war erfolgreich!",
-      "purchase_completed_description": "Ihr {{cryptocurrency}} ist jetzt verfügbar",
-      "purchase_failed_title": "Kauf von {{cryptocurrency}} fehlgeschlagen",
-      "purchase_failed_description": "Bitte versuchen Sie es in Kürze erneut",
-      "purchase_cancelled_title": "Ihr Kauf wurde storniert",
-      "purchase_cancelled_description": "Ihr Kauf von {{cryptocurrency}} wurde storniert",
-      "track": "Verfolgen"
-    }
-  },
   "swaps": {
     "title": "Swap",
     "onboarding": {
@@ -5734,15 +5686,12 @@
     "new_wallet_needed_description_part_three": "Halten Sie Ihre MetaMask-App und Ihr Betriebssystem immer auf dem neuesten Stand, um zu vermeiden, dass dies erneut geschieht."
   },
   "srp_security_quiz": {
-    "question_step": "Frage {{step}} von {{total}}",
     "title": "Sicherheitsquiz",
     "introduction": "Zur Enthüllung Ihrer geheimen Wiederherstellungsphrase müssen Sie zwei Fragen beantworten.",
     "get_started": "Erste Schritte",
     "learn_more": "Erfahren Sie mehr",
     "try_again": "Erneut versuchen",
     "continue": "Fortfahren",
-    "correct": "Richtig!",
-    "incorrect": "Falsch!",
     "of": "von",
     "question_one": {
       "question": "Wenn Sie Ihre geheime Wiederherstellungsphrase verlieren, kann MetaMask ...",
@@ -5921,8 +5870,8 @@
     "claimable_bonus_tooltip": "The annualized bonus you’ve earned for holding mUSD. Your bonus is claimable daily on Linea.",
     "earn_a_percentage_bonus": "Verdienen Sie einen Bonus von {{percentage}} %",
     "claimable_bonus": "Anspruchsberechtigter Bonus",
-    "claim_bonus": "Bonus einfordern",
-    "claim_bonus_subtitle": "Der Bonus wird auf {{networkName}} ausgezahlt.",
+    "claim_bonus": "Claim bonus",
+    "claim_bonus_subtitle": "Bonus will be paid out on {{networkName}}.",
     "empty_state_cta": {
       "heading": "Verleihen Sie {{tokenSymbol}} und verdienen Sie",
       "body": "Verleihen Sie Ihre {{tokenSymbol}} mit {{protocol}} und verdienen Sie",
@@ -5933,7 +5882,7 @@
     "service_interruption_banner": {
       "maintenance_message": "Wir sind wegen Wartungsarbeiten nicht erreichbar. Wir sind bald wieder online!"
     },
-    "supply": "Vorrat",
+    "supply": "Supply",
     "deposit": "Einzahlung",
     "approve": "Genehmigen",
     "approval": "Genehmigung",
@@ -5982,7 +5931,7 @@
     "network": "Netzwerk",
     "health_factor": "Gesundheitsfaktor",
     "liquidation_risk": "Liquidationsrisiko",
-    "insufficient_pool_liquidity": "Unzureichende Pool-Liquidität",
+    "insufficient_pool_liquidity": "Insufficient pool liquidity",
     "available_to_withdraw": "zur Auszahlung verfügbar",
     "unknown": "unbekannt",
     "how_it_works": "Wie es funktioniert",
@@ -6001,7 +5950,7 @@
       "lending": "Positionsverlauf",
       "staking": "Auszahlungsverlauf"
     },
-    "allowance_reset": "Zulagen zurücksetzen",
+    "allowance_reset": "Allowance reset",
     "tron": {
       "fee": "Gebühr"
     },
@@ -6009,20 +5958,8 @@
       "ok": "OK",
       "continue": "Fortfahren",
       "convert_and_get_percentage_bonus": "Konvertieren und {{percentage}} % erhalten",
-      "your_musd": "Ihre mUSD",
-      "balance_breakdown_title": "Ihr mUSD-Guthaben nach Netzwerk",
-      "balance_amount": "{{amount}} mUSD",
-      "balance_amount_with_symbol": "{{amount}} {{symbol}}",
-      "balance_fiat_unavailable": "—",
-      "convert_to_musd": "Zu mUSD konvertieren",
       "get_a_percentage_musd_bonus": "Erhalten Sie {{percentage}} % mUSD-Bonus",
       "convert": "Konvertieren",
-      "fetching_quote": "Angebot einholen...",
-      "you_convert": "Sie konvertieren",
-      "network_fee": "Netzwerkgebühr",
-      "earning": "Verdienen",
-      "quick_convert_description": "Wählen Sie einen Token zur Konvertierung Ihres gesamten Guthabens oder klicken Sie auf das Bearbeitungssymbol, um einen eigenen Betrag einzugeben.",
-      "no_tokens_to_convert": "Sie haben keine Token, die in mUSD konvertiert werden können.",
       "toasts": {
         "converting": "Konvertierung von {{token}} → mUSD",
         "eta": "~{{time}}",
@@ -6062,7 +5999,7 @@
       "toasts": {
         "claiming": "Ihr mUSD-Bonus wird bearbeitet",
         "delivered": "Ihr mUSD-Bonus ist hier!",
-        "failed": "Einfordern des Bonus fehlgeschlagen"
+        "failed": "Bonus claim failed"
       }
     },
     "rewards": {
@@ -6073,8 +6010,7 @@
       "tooltip_opted_in_footer": "Die Punkte werden Ihrem Konto automatisch gutgeschrieben.",
       "tooltip_not_opted_in_footer": "Melden Sie sich für Belohnungen an, um Ihre Punkte zu erhalten.",
       "tooltip_close": "Schließen"
-    },
-    "your_stablecoins": "Ihre Stablecoins"
+    }
   },
   "stake": {
     "stake": "Stake",
@@ -6096,7 +6032,9 @@
       "fee": "Gebühr",
       "errors": {
         "insufficient_balance": "Sie haben nicht genügend Ressourcen, um diese Aktion durchzuführen."
-      }
+      },
+      "trx_unstaking_in_progress": "Unstaken {{amount}} TRX in Bearbeitung. Das Unstaken erfordert 14 Tage.",
+      "has_claimable_trx": "You can claim {{amount}} TRX. Once claimed you'll get TRX back in your wallet."
     },
     "stake_eth": "ETH staken",
     "unstake_eth": "ETH unstaken",
@@ -6574,7 +6512,7 @@
     "hardware_wallet_not_supported": "Hardware-Wallets werden noch nicht unterstützt. Verwenden Sie eine Hot Wallet, um fortzufahren.",
     "hardware_wallet_not_supported_solana": "Hardware-Wallets werden für Solana noch nicht unterstützt. Verwenden Sie ein Hot Wallet, um fortzufahren.",
     "price_impact_info_title": "Preiseinfluss",
-    "price_impact_info_description": "Der Preiseinfluss spiegelt wider, wie Ihre Swap-Order den Marktpreis des Assets beeinflusst. Er hängt von der Trade-Größe und der verfügbaren Liquidität im Pool ab. MetaMask hat keinerlei Kontrolle über den Preiseinfluss.",
+    "price_impact_info_description": "This is how your trade changes the market price of a token. It depends on the trade size, available liquidity, and provider fees. MetaMask doesn't control price impact.",
     "price_impact_info_gasless_description": "Die Preisauswirkung spiegelt wider, wie Ihre Swap-Order den Marktpreis des Assets beeinflusst. Falls Sie nicht über genügend Gelder für Gas halten, wird ein Teil Ihres Quelltokens automatisch zur Deckung der Gebühren verwendet, was die Preisauswirkung erhöht. MetaMask hat keinerlei Kontrolle über die Preisauswirkung.",
     "price_impact_warning_description": "This trade has an estimated {{priceImpact}} price impact, which reflects how much your trade changes the market price. The quote already reflects this.",
     "price_impact_high": "High price impact",
@@ -6600,6 +6538,7 @@
     },
     "submit": "Absenden",
     "default_slippage_description": "Ihre Transaktion wird nicht durchgeführt, wenn sich der Preis um mehr als den Slippage-Prozentsatz ändert.",
+    "cancel": "Stornieren",
     "confirm": "Bestätigen",
     "exceeding_upper_slippage_warning": "Hohe Slippage, was zu einem ungünstigen Swap führen kann",
     "exceeding_lower_slippage_warning": "Niedrige Slippage, was zu einem ungünstigen Swap führen kann",
@@ -7282,19 +7221,6 @@
       "retry": "Erneut versuchen",
       "on_linea": "auf Linea"
     },
-    "cashback_screen": {
-      "title": "Cashback",
-      "available_cashback": "Verfügbares Cashback",
-      "network_fee": "Netzwerkgebühr",
-      "expected_to_receive": "Erwartet zu empfangen",
-      "withdraw": "Auszahlen",
-      "withdraw_unavailable": "Auszahlung nicht verfügbar",
-      "withdrawal_initiated": "Auszahlung wurde eingeleitet",
-      "withdrawal_success": "Auszahlung erfolgreich abgeschlossen",
-      "withdrawal_failed": "Auszahlung fehlgeschlagen. Bitte versuchen Sie es erneut.",
-      "no_cashback": "Kein Cashback verfügbar",
-      "loading_error": "Cashback konnte nicht geladen werden. Bitte versuchen Sie es erneut."
-    },
     "change_asset": {
       "title": "Token und Netzwerk ändern",
       "full_spending_access": "Vollständiger Zugriff auf die Ausgaben",
@@ -7469,10 +7395,7 @@
       "service_not_available": "Der Dienst ist derzeit nicht verfügbar. Bitte versuchen Sie es in Kürze erneut.",
       "invalid_referral_code": "Ungültiger Empfehlungscode. Bitte überprüfen Sie ihn und versuchen Sie es erneut.",
       "already_referred": "Sie wurden bereits von einem anderen Nutzer empfohlen.",
-      "cannot_use_own_referral_code": "Sie können nicht Ihren eigenen Empfehlungscode verwenden.",
-      "invalid_bonus_code": "Ungültiger Bonuscode",
-      "already_redeemed": "Sie haben diesen Bonuscode bereits eingelöst",
-      "reached_maximum": "Dieser Bonuscode hat seine maximale Anzahl an Nutzungen erreicht"
+      "cannot_use_own_referral_code": "Sie können nicht Ihren eigenen Empfehlungscode verwenden."
     },
     "claim_reward_error": {
       "title": "Einforderung der Belohnung fehlgeschlagen"
@@ -7529,10 +7452,8 @@
         "predict": "Prognose",
         "musd_deposit": "mUSD-Einzahlung",
         "apply_referral_bonus": "Empfehlungscode-Bonus",
-        "bonus_code": "Bonuscode",
         "uncategorized_event": "Nicht kategorisiertes Ereignis"
       },
-      "code": "Code",
       "date": "Datum",
       "account": "Konto",
       "bonus": "Bonus",
@@ -7651,10 +7572,6 @@
       "invalid_code": "Ungültiger Empfehlungscode",
       "apply_button": "Empfehlungscode anwenden"
     },
-    "bonus_code": {
-      "input_placeholder": "Bonuscode eingeben",
-      "apply_success": "Bonuscode angewandt!"
-    },
     "optout": {
       "title": "Rewards-Fortschritt löschen",
       "description": "Dadurch werden Ihre Konten aus dem Rewards-Programm entfernt und Ihre Punkte sowie Ihr Fortschritt gelöscht. Diese Aktion kann nicht rückgängig gemacht werden.",
@@ -7791,14 +7708,12 @@
     },
     "label": {
       "bridge_fee": "Bridge-Gebühr",
-      "provider_fee": "Anbietergebühr",
       "network_fee": "Netzwerk-Gebühr",
       "paid_with": "Bezahlt mit",
-      "receive_token": "Token empfangen",
       "retry_button": "Erneut versuchen",
       "total": "Insgesamt",
       "account": "Konto",
-      "received_total": "Insgesamt erhalten"
+      "received_total": "Received total"
     },
     "summary_title": {
       "bridge_approval": "{{approveSymbol}} genehmigen",
@@ -7851,15 +7766,14 @@
     "still_connecting_network": "Noch beim Verbindungsaufbau zu {{networkName}} ...",
     "unable_to_connect_network": "Verbindungsherstellung mit {{networkName}} nicht möglich.",
     "update_rpc": "RPC aktualisieren",
-    "switch_to_metamask_default_rpc": "Zu MetaMask Standard-RPC wechseln",
+    "switch_to_metamask_default_rpc": "Switch to MetaMask default RPC",
     "check_network_connectivity": "Überprüfen Sie Ihre Netzwerkverbindung.",
     "check_network_connectivity_or": "Überprüfen Sie Ihre Netzwerkverbindung oder",
-    "updated_to_metamask_default": "Auf Standardeinstellung von MetaMask aktualisiert"
+    "updated_to_metamask_default": "Updated to MetaMask default"
   },
   "trending": {
     "title": "Entdecken",
     "trending_tokens": "Trendige Tokens",
-    "stocks": "Aktien",
     "price_change": "Preisänderung",
     "all_networks": "Alle Netzwerke",
     "24h": "24 Stunden",
@@ -8007,8 +7921,8 @@
       }
     },
     "error": {
-      "unable_to_load": "{{section}} kann nicht geladen werden",
-      "retry": "Erneut versuchen"
+      "unable_to_load": "Unable to load {{section}}",
+      "retry": "Retry"
     }
   }
-}
\ No newline at end of file
+}
diff --git a/locales/languages/el.json b/locales/languages/el.json
index 3503b6e06d14..dad1215323a2 100644
--- a/locales/languages/el.json
+++ b/locales/languages/el.json
@@ -104,8 +104,8 @@
       "title": "Ανεπαρκές ποσό"
     },
     "insufficient_pay_token_native_post_quote": {
-      "message": "Not enough {{ticker}} to cover fees. Add {{ticker}} to continue.",
-      "title": "Insufficient funds for post quote"
+      "message": "Μη επαρκές υπόλοιπο σε {{ticker}} για την κάλυψη των χρεώσεων. Προσθέστε {{ticker}} για να συνεχίσετε.",
+      "title": "Ανεπαρκές υπόλοιπο για την υποβολή της προσφοράς"
     },
     "no_pay_token_quotes": {
       "message": "Αυτή η διαδρομή πληρωμής δεν είναι διαθέσιμη αυτή τη στιγμή. Δοκιμάστε να αλλάξετε το ποσό, το δίκτυο ή το token και θα βρούμε την καλύτερη επιλογή.",
@@ -1184,7 +1184,6 @@
       "title": "Νέα εντολή",
       "leverage": "Μόχλευση",
       "limit_price": "Τιμή ορίου",
-      "market_price": "Τιμή αγοράς",
       "enter_price": "Εισάγετε τιμή",
       "trigger_price": "Τιμή ενεργοποίησης",
       "liquidation_price": "Τιμή ρευστοποίησης",
@@ -1328,7 +1327,6 @@
       "funds_are_available_to_trade": "Τα κεφάλαια είναι διαθέσιμα για συναλλαγές",
       "close_order_still_active": "Η εντολή κλεισίματος είναι ακόμα ενεργή",
       "order_submitted": "Η εντολή υποβλήθηκε",
-      "submitting_your_trade": "Υποβολή της συναλλαγής σας",
       "order_filled": "Η εντολή εκτελέστηκε",
       "order_placed": "Η εντολή καταχωρήθηκε",
       "order_placement_subtitle": "{{direction}} {{amount}} {{assetSymbol}}",
@@ -1346,26 +1344,14 @@
       "title": "Λεπτομέρειες εντολής",
       "cancel_order": "Ακύρωση εντολής",
       "date": "Ημερομηνία",
-      "trigger_condition": "Συνθήκη ενεργοποίησης",
-      "price": "Τιμή",
       "fee": "Τέλη",
       "limit_buy": "Εντολή Αγοράς με Όριο",
       "limit_price": "Τιμή ορίου",
       "limit_sell": "Εντολή Πώλησης με Όριο",
       "market_buy": "Εντολή Αγοράς στην Τιμή Αγοράς",
       "market_sell": "Εντολή Πώλησης στην Τιμή Αγοράς",
-      "market": "Τιμή αγοράς",
       "open": "Άνοιγμα",
       "size": "Μέγεθος",
-      "original_size": "Αρχικό μέγεθος",
-      "order_value": "Αξία εντολής",
-      "reduce_only": "Μόνο μείωση",
-      "yes": "Ναι",
-      "no": "Όχι",
-      "price_above": "Τιμή πάνω από {{price}}",
-      "price_below": "Τιμή κάτω από {{price}}",
-      "take_profit": "Λήψη κερδών",
-      "stop_loss": "Περιορισμός ζημιών",
       "status": "Κατάσταση",
       "view_explorer": "Προβολή στο Explorer"
     },
@@ -2197,6 +2183,7 @@
     "available_balance": "Διαθέσιμο υπόλοιπο",
     "claim_amount_text": "Εξαργυρώστε ${{amount}}",
     "claim_winnings_text": "Εξαργύρωση κερδών",
+    "claiming_text": "Claiming...",
     "unrealized_pnl_label": "Μη οριστικοποιημένα κέρδη & ζημίες",
     "unrealized_pnl_value": "{{amount}} ({{percent}})",
     "unrealized_pnl_error": "Δεν ήταν δυνατή η φόρτωση",
@@ -2275,6 +2262,9 @@
           "title": "Κάτι πήγε στραβά",
           "description": "Αποτυχία συνέχισης της αξίωσης",
           "try_again": "Προσπαθήστε ξανά"
+        },
+        "in_progress": {
+          "title": "Claim already in progress"
         }
       }
     },
@@ -2308,7 +2298,6 @@
       "withdrawing_subtitle": "Διαθέσιμο σε περίπου 1 λεπτό",
       "withdraw_completed": "Η ανάληψη ολοκληρώθηκε",
       "withdraw_completed_subtitle": "{{amount}} USDC μεταφέρθηκαν στο πορτοφόλι σας",
-      "withdraw_any_token_completed_subtitle": "{{amount}} {{token}} μεταφέρθηκαν στο πορτοφόλι σας",
       "error_title": "Κάτι πήγε στραβά",
       "error_description": "Δεν ήταν δυνατή η συνέχιση της ανάληψης",
       "try_again": "Προσπαθήστε ξανά"
@@ -2440,7 +2429,7 @@
     "add_tokens": "Εισαγωγή tokens",
     "are_you_sure_exit": "Are you sure you want to exit?",
     "import_token": "Would you like to import this token?",
-    "import_tokens": "Θέλετε να εισαγάγετε αυτά τα tokens;",
+    "import_tokens": "Would you like to import these tokens?",
     "tokens_detected_in_account": "{{tokenCount}} νέο {{tokensLabel}} βρέθηκε σε αυτόν τον λογαριασμό",
     "token_toast": {
       "tokens_imported_title": "Εισαγόμενα tokens",
@@ -2705,7 +2694,7 @@
     "decimals_cant_be_empty": "Τα δεκαδικά ψηφία του token δεν μπορεί να είναι κενά.",
     "decimals_is_required": "Decimal is required. Find it on:",
     "no_tokens_found": "Δεν μπορέσαμε να βρούμε κανένα token με αυτό το όνομα.",
-    "tokens_empty_description": "Αναζητήστε οποιοδήποτε token και εισαγάγετέ το",
+    "tokens_empty_description": "Search for any token and import it",
     "select_token": "Επιλέξτε token",
     "address_must_be_smart_contract": "Εντοπίστηκε προσωπική διεύθυνση. Εισαγάγετε τη διεύθυνση συμβολαίου του token.",
     "billion_abbreviation": "Δ",
@@ -2915,10 +2904,6 @@
     "enabling_notifications": "Ενεργοποίηση ειδοποιήσεων...",
     "updating_notifications": "Ενημέρωση ειδοποιήσεων...",
     "updating_account_settings": "Ενημέρωση ρυθμίσεων λογαριασμού...",
-    "reset_notifications_title": "Επαναφορά ειδοποιήσεων",
-    "reset_notifications_description": "Η επαναφορά των ειδοποιήσεων σημαίνει ότι διαγράφετε τα κλειδιά αποθήκευσης ειδοποιήσεων και επαναφέρετε όλο το ιστορικό ειδοποιήσεων. Είστε σίγουροι ότι θέλετε να προχωρήσετε;",
-    "reset_notifications": "Επαναφορά ειδοποιήσεων",
-    "reset_notifications_success": "Διαγραφή/δημιουργία εκ νέου κλειδιού αποθήκευσης ειδοποιήσεων και επαναφορά ιστορικού ειδοποιήσεων.",
     "notifications_dismiss_modal": "Απόρριψη",
     "select_rpc_url": "Επιλέξτε την διεύθυνση URL του RPC",
     "title": "Ρυθμίσεις",
@@ -3040,9 +3025,9 @@
     "add_rpc_url": "Προσθήκη διεύθυνσης URL του RPC",
     "add_block_explorer_url": "Προσθήκη διεύθυνσης URL στο block explorer",
     "networks_desc": "Προσθέστε και επεξεργαστείτε προσαρμοσμένα δίκτυα RPC",
-    "networks_enabled": "Ενεργοποιημένα δίκτυα",
-    "networks_test_networks": "Δοκιμαστικά δίκτυα",
-    "networks_additional": "Πρόσθετα δίκτυα",
+    "networks_enabled": "Enabled Networks",
+    "networks_test_networks": "Test Networks",
+    "networks_additional": "Additional Networks",
     "networks_search_placeholder": "Αναζήτηση δικτύων",
     "networks_no_results": "Δεν βρέθηκαν δίκτυα",
     "network_name_label": "Όνομα δικτύου",
@@ -3062,15 +3047,15 @@
     "network_rpc_networks": "Δίκτυα RPC",
     "network_add_network": "Προσθήκη δικτύου",
     "add_chain_title": "Προσθήκη δικτύου",
-    "add_chain_search_placeholder": "Αναζήτηση με βάση το όνομα, το αναγνωριστικό δικτύου ή το νόμισμα",
-    "add_chain_loading": "Φόρτωση δικτύων…",
-    "add_chain_error": "Δεν ήταν δυνατή η φόρτωση των δικτύων. Παρακαλούμε προσπαθήστε ξανά.",
+    "add_chain_search_placeholder": "Search by name, chain ID, or currency",
+    "add_chain_loading": "Loading networks…",
+    "add_chain_error": "Failed to load networks. Please try again.",
     "add_chain_retry": "Επανάληψη",
-    "add_chain_added": "Προστέθηκε",
+    "add_chain_added": "Added",
     "add_chain_or": "ή",
     "add_chain_custom_link": "Προσθήκη προσαρμοσμένου δικτύου",
     "network_add_custom_network": "Προσθήκη προσαρμοσμένου δικτύου",
-    "network_add_test_network": "Προσθήκη δοκιμαστικού δικτύου",
+    "network_add_test_network": "Add a test network",
     "network_add": "Προσθήκη",
     "network_save": "Αποθήκευση",
     "remove_network_title": "Θέλετε να αφαιρέσετε αυτό το δίκτυο;",
@@ -3394,9 +3379,11 @@
     ],
     "private_key_explanation": "Αποθηκεύστε την κάπου μυστικά και με ασφάλεια.",
     "private_key_warning": "Αυτό είναι το ιδιωτικό κλειδί για τον τρέχοντα επιλεγμένο λογαριασμό: {{accountName}}. Μην αποκαλύψετε ποτέ αυτό το κλειδί. Όποιος έχει το ιδιωτικό σας κλειδί μπορεί να έχει τον πλήρη έλεγχο του λογαριασμού σας, όπως και τη μεταφορά των χρημάτων σας.",
-    "seed_phrase_warning_explanation": "Βεβαιωθείτε ότι κανείς δεν κοιτάζει την οθόνη σας. Η υποστήριξη του MetaMask δεν θα σας ζητήσει ποτέ κάτι τέτοιο.",
+    "seed_phrase_warning_explanation": [
+      "Σιγουρευτείτε ότι δεν κοιτάζει κανείς την οθόνη σας.",
+      "Η Υποστήριξη του MetaMask δεν θα σας το ζητήσει ποτέ."
+    ],
     "private_key_warning_explanation": "Μην αποκαλύψετε ποτέ αυτό το κλειδί. Όποιος έχει το ιδιωτικό σας κλειδί μπορεί να ελέγξει πλήρως τον λογαριασμό σας, όπως και τη μεταφορά των χρημάτων σας.",
-    "reveal_srp_description": "Η Μυστική Φράση Ανάκτησής σας δίνει πλήρη πρόσβαση στο πορτοφόλι σας. Μην την αναφέρετε σε κανέναν.",
     "reveal_credential_modal": [
       "Το {{credentialName}} σάς παρέχει ",
       "πλήρη πρόσβαση στον λογαριασμό σας και τα χρήματά σας.\n\nΜην το μοιράζεστε με κανέναν.\n",
@@ -3428,8 +3415,7 @@
     "srp_text": "Μυστική Φράση Ανάκτησής σας",
     "private_key_text": "Ιδιωτικό κλειδί",
     "got_it": "Κατανοητό",
-    "learn_more": "Μάθετε περισσότερα",
-    "copied_to_clipboard": "Αντιγραφή στο πρόχειρο"
+    "learn_more": "Μάθετε περισσότερα"
   },
   "screenshot_deterrent": {
     "title": "Ειδοποίηση ασφαλείας",
@@ -3810,7 +3796,7 @@
     "transaction_fee_explanation": "Ένα τέλος συναλλαγής σχετίζεται με αυτήν την άδεια.",
     "view_details": "Προβολή λεπτομερειών",
     "view_transaction_details": "Προβολή λεπτομερειών συναλλαγής",
-    "view_data": "Προβολή δεδομένων",
+    "view_data": "View data",
     "transaction_details": "Λεπτομέρειες συναλλαγής",
     "site_url": "URL ιστότοπου",
     "permission_request": "Αίτημα άδειας",
@@ -3891,7 +3877,7 @@
     "right_button": "Προστατέψτε το πορτοφόλι"
   },
   "add_favorite": {
-    "title": "Προσθήκη στα αγαπημένα",
+    "title": "Add favorite",
     "title_label": "Όνομα",
     "url_label": "Διεύθυνση URL",
     "add_button": "Προσθήκη",
@@ -4245,8 +4231,8 @@
   "biometrics": {
     "enable_touchid": "Ξεκλείδωμα με Touch ID;",
     "enable_faceid": "Ξεκλείδωμα με Face ID;",
-    "enable_fingerprint": "Ξεκλείδωμα με δακτυλικό αποτύπωμα;",
-    "enable_biometrics": "Ξεκλείδωμα με βιομετρικά στοιχεία;",
+    "enable_fingerprint": "Unlock with fingerprint?",
+    "enable_biometrics": "Unlock with biometrics?",
     "enable_device_passcode_ios": "Ξεκλείδωμα με κωδικό συσκευής;",
     "enable_device_passcode_android": "Ξεκλείδωμα με PIN συσκευής;"
   },
@@ -4772,7 +4758,7 @@
     "public_address": "Δημόσια διεύθυνση",
     "public_address_qr_code": "Δημόσια διεύθυνση",
     "coming_soon": "Προσεχώς...",
-    "request_payment": "Αίτημα πληρωμής",
+    "request_payment": "Request payment",
     "copy": "Αντιγραφή",
     "scan_address": "Σαρώστε τη διεύθυνση για να λάβετε την πληρωμή",
     "copy_address": "Αντιγραφή διεύθυνσης"
@@ -4786,8 +4772,8 @@
     "switch_network": "Παρακαλούμε μεταβείτε στο mainnet ή το sepolia",
     "card_title": "Να εμφανίζεται πάντα το κουμπί MetaMask Card",
     "card_desc": "Η MetaMask Card είναι διαθέσιμη μόνο για κατοίκους επιλεγμένων χωρών.",
-    "daimo_demo_title": "Χρήση του δοκιμαστικού περιβάλλοντος της DaimoPay",
-    "daimo_demo_desc": "Εναλλαγή μεταξύ των περιβαλλόντων δοκιμής και παραγωγής του DaimoPay για πληρωμές με κάρτα."
+    "daimo_demo_title": "Use DaimoPay demo environment",
+    "daimo_demo_desc": "Toggle between DaimoPay demo and production environments for card payments."
   },
   "walletconnect_sessions": {
     "no_active_sessions": "Δεν έχετε ενεργές συνεδρίες",
@@ -4800,10 +4786,10 @@
     "close_current_session": "Κλείστε την τρέχουσα συνεδρία πριν ξεκινήσετε μια νέα."
   },
   "paymentRequest": {
-    "title": "Αίτημα πληρωμής",
-    "title_complete": "Η πληρωμή ολοκληρώθηκε",
+    "title": "Payment request",
+    "title_complete": "Payment complete",
     "confirm": "Πληρωμή",
-    "cancel": "Απόρριψη",
+    "cancel": "Decline",
     "is_requesting_you_to_pay": "σας ζητά να πληρώσετε",
     "total": "Σύνολο:"
   },
@@ -4838,7 +4824,6 @@
     "no_payment_methods_available": "Δεν υπάρχουν διαθέσιμες μέθοδοι πληρωμής.",
     "error_fetching_quotes": "Κάτι πήγε στραβά. Παρακαλούμε προσπαθήστε ξανά.",
     "no_quotes_available": "Δεν υπάρχουν διαθέσιμοι πάροχοι.",
-    "quote_unavailable": "Δεν υπάρχει διαθέσιμη προσφορά.",
     "providers": "Πάροχοι",
     "quotes_displayed_for": "Οι προσφορές που εμφανίζονται για το {{paymentMethodName}}.",
     "other_options": "Other options",
@@ -4944,10 +4929,10 @@
       "logged_out_error": "Σφάλμα κατά την αποσύνδεση"
     },
     "token_unavailable_modal": {
-      "title": "Μη διαθέσιμο",
-      "description": "Το {{token}} δεν είναι διαθέσιμο μέσω του {{provider}} στην περιοχή σας.",
-      "change_token": "Αλλαγή token",
-      "change_provider": "Αλλαγή παρόχου"
+      "title": "Not available",
+      "description": "{{token}} is not available with {{provider}} in your region.",
+      "change_token": "Change token",
+      "change_provider": "Change provider"
     },
     "provider_picker_modal": {
       "title": "Επιλέξτε πάροχο"
@@ -5185,39 +5170,6 @@
     },
     "deposit_order_title": "Κατάθεση σε {{currency}}"
   },
-  "ramps_order_details": {
-    "title": "Λεπτομέρειες εντολής",
-    "status": "Κατάσταση",
-    "processing": "Επεξεργασία",
-    "complete": "Ολοκληρώθηκε",
-    "failed": "Απέτυχε",
-    "cancelled": "Ακυρώθηκε",
-    "view_on_provider": "Προβολή στο {{provider}}",
-    "order_id": "Αριθμός Εντολής",
-    "date_and_time": "Ημερομηνία και ώρα",
-    "fees": "Τέλη",
-    "total": "Σύνολο",
-    "card_processing_info": "Οι αγορές με κάρτα συνήθως διαρκούν λίγα λεπτά",
-    "processing_info_modal_description": "Οι αγορές με κάρτα ολοκληρώνονται συνήθως μέσα σε λίγα λεπτά. Μπορείτε να επικοινωνήσετε με την υποστήριξη αν έχετε απορίες.",
-    "go_to_provider_support": "Μεταβείτε στη σελίδα υποστήριξης του {{provider}}",
-    "error_title": "Κάτι πήγε στραβά",
-    "error_message": "Δεν είναι δυνατή η φόρτωση των λεπτομερειών της εντολής. Παρακαλούμε δοκιμάστε ξανά.",
-    "try_again": "Προσπαθήστε ξανά",
-    "close": "Κλείσιμο"
-  },
-  "ramps_v2": {
-    "notifications": {
-      "purchase_pending_title": "Επεξεργασία της αγοράς σας των {{cryptocurrency}}",
-      "purchase_pending_description": "Αναμένεται να ολοκληρωθεί σε λίγα λεπτά...",
-      "purchase_completed_title": "Η αγορά {{amount}} {{cryptocurrency}} ήταν επιτυχής!",
-      "purchase_completed_description": "Τα {{cryptocurrency}} είναι τώρα διαθέσιμα",
-      "purchase_failed_title": "Η αγορά του {{cryptocurrency}} απέτυχε",
-      "purchase_failed_description": "Παρακαλούμε δοκιμάστε ξανά σε λίγο",
-      "purchase_cancelled_title": "Η αγορά σας ακυρώθηκε",
-      "purchase_cancelled_description": "Η αγορά του {{cryptocurrency}} ακυρώθηκε",
-      "track": "Παρακολούθηση"
-    }
-  },
   "swaps": {
     "title": "Ανταλλαγή",
     "onboarding": {
@@ -5734,15 +5686,12 @@
     "new_wallet_needed_description_part_three": "Για να μη συμβεί αυτό ξανά, φροντίστε να διατηρείτε πάντα την εφαρμογή MetaMask και το λειτουργικό σας σύστημα ενημερωμένα στην τελευταία έκδοση."
   },
   "srp_security_quiz": {
-    "question_step": "Ερώτηση {{step}} από {{total}}",
     "title": "Ερώτηση ασφαλείας",
     "introduction": "Για να αποκαλύψετε τη Μυστική Φράση Ανάκτησης, πρέπει να απαντήσετε σωστά σε δύο ερωτήσεις",
     "get_started": "Ξεκινήστε",
     "learn_more": "Μάθετε περισσότερα",
     "try_again": "Προσπαθήστε ξανά",
     "continue": "Συνεχίστε",
-    "correct": "Σωστό!",
-    "incorrect": "Λάθος!",
     "of": "από",
     "question_one": {
       "question": "Αν χάσετε τη Μυστική Φράση Ανάκτησης, το MetaMask...",
@@ -5921,8 +5870,8 @@
     "claimable_bonus_tooltip": "The annualized bonus you’ve earned for holding mUSD. Your bonus is claimable daily on Linea.",
     "earn_a_percentage_bonus": "Κερδίστε ένα μπόνους {{percentage}}%",
     "claimable_bonus": "Μπόνους προς εξαργύρωση",
-    "claim_bonus": "Εξαργύρωση του μπόνους",
-    "claim_bonus_subtitle": "Το μπόνους θα καταβληθεί στο δίκτυο {{networkName}}.",
+    "claim_bonus": "Claim bonus",
+    "claim_bonus_subtitle": "Bonus will be paid out on {{networkName}}.",
     "empty_state_cta": {
       "heading": "Δανείστε {{tokenSymbol}} και κερδίστε",
       "body": "Δανείστε τα {{tokenSymbol}} μέσω του {{protocol}} και κερδίστε",
@@ -5933,7 +5882,7 @@
     "service_interruption_banner": {
       "maintenance_message": "Είμαστε εκτός λειτουργίας για συντήρηση. Θα επανέλθουμε σύντομα!"
     },
-    "supply": "Διαθέσιμη ποσότητα",
+    "supply": "Supply",
     "deposit": "Κατάθεση",
     "approve": "Εγκρίνετε",
     "approval": "Έγκριση",
@@ -5982,7 +5931,7 @@
     "network": "Δίκτυο",
     "health_factor": "Δείκτης ασφάλειας",
     "liquidation_risk": "Κίνδυνος ρευστοποίησης",
-    "insufficient_pool_liquidity": "Ανεπαρκής ρευστότητα στη δεξαμένη (liquidity pool)",
+    "insufficient_pool_liquidity": "Insufficient pool liquidity",
     "available_to_withdraw": "διαθέσιμα για ανάληψη",
     "unknown": "άγνωστο",
     "how_it_works": "Πώς λειτουργεί",
@@ -6001,7 +5950,7 @@
       "lending": "Ιστορικό θέσεων",
       "staking": "Ιστορικό πληρωμών"
     },
-    "allowance_reset": "Επαναφορά έγκρισης",
+    "allowance_reset": "Allowance reset",
     "tron": {
       "fee": "Τέλη"
     },
@@ -6009,20 +5958,8 @@
       "ok": "Εντάξει",
       "continue": "Συνεχίστε",
       "convert_and_get_percentage_bonus": "Μετατρέψτε και κερδίστε {{percentage}}%",
-      "your_musd": "Τα mUSD σας",
-      "balance_breakdown_title": "Το υπόλοιπό σας σε mUSD ανά δίκτυο",
-      "balance_amount": "{{amount}} mUSD",
-      "balance_amount_with_symbol": "{{amount}} {{symbol}}",
-      "balance_fiat_unavailable": "—",
-      "convert_to_musd": "Μετατροπή σε mUSD",
       "get_a_percentage_musd_bonus": "Κερδίστε {{percentage}}% μπόνους σε mUSD",
       "convert": "Μετατροπή",
-      "fetching_quote": "Λήψη προσφοράς...",
-      "you_convert": "Μετατρέπετε",
-      "network_fee": "Τέλη δικτύου",
-      "earning": "Κέρδος",
-      "quick_convert_description": "Επιλέξτε ένα token για να μετατρέψετε όλο το υπόλοιπό σας ή πατήστε το εικονίδιο επεξεργασίας για να πληκτρολογήσετε ένα προσαρμοσμένο ποσό.",
-      "no_tokens_to_convert": "Δεν έχετε tokens που μπορούν να μετατραπούν σε mUSD.",
       "toasts": {
         "converting": "Μετατροπή {{token}} → mUSD",
         "eta": "~{{time}}",
@@ -6062,7 +5999,7 @@
       "toasts": {
         "claiming": "Γίνεται επεξεργασία του μπόνους σας σε mUSD",
         "delivered": "Το μπόνους σας σε mUSD είναι εδώ!",
-        "failed": "Αποτυχία εξαργύρωσης του μπόνους"
+        "failed": "Bonus claim failed"
       }
     },
     "rewards": {
@@ -6073,8 +6010,7 @@
       "tooltip_opted_in_footer": "Οι πόντοι θα προστεθούν αυτόματα στον λογαριασμό σας.",
       "tooltip_not_opted_in_footer": "Εγγραφείτε στις ανταμοιβές για να λάβετε τους πόντους σας.",
       "tooltip_close": "Κλείσιμο"
-    },
-    "your_stablecoins": "Τα stablecoins σας"
+    }
   },
   "stake": {
     "stake": "Stake",
@@ -6096,7 +6032,9 @@
       "fee": "Τέλη",
       "errors": {
         "insufficient_balance": "Δεν έχετε αρκετό υπόλοιπο πόρων για να εκτελέσετε αυτή την ενέργεια."
-      }
+      },
+      "trx_unstaking_in_progress": "Η αποδέσμευση {{amount}} TRX βρίσκεται σε εξέλιξη. Η διαδικασία διαρκεί 14 ημέρες.",
+      "has_claimable_trx": "You can claim {{amount}} TRX. Once claimed you'll get TRX back in your wallet."
     },
     "stake_eth": "Ποντάρισμα σε ETH",
     "unstake_eth": "Ακύρωση πονταρίσματος σε ETH",
@@ -6574,7 +6512,7 @@
     "hardware_wallet_not_supported": "Τα πορτοφόλια υλικού δεν υποστηρίζονται ακόμη. Χρησιμοποιήστε ένα θερμό πορτοφόλι για να συνεχίσετε.",
     "hardware_wallet_not_supported_solana": "Τα πορτοφόλια υλικού δεν υποστηρίζουν ακόμα την Solana. Χρησιμοποιήστε ένα θερμό πορτοφόλι για να συνεχίσετε.",
     "price_impact_info_title": "Αντίκτυπος στην τιμή",
-    "price_impact_info_description": "Η επίδραση στη τιμή (price impact) δείχνει πόσο επηρεάζει η εντολή ανταλλαγής σας την τιμή του περιουσιακού στοιχείου στην αγορά. Εξαρτάται από το μέγεθος της συναλλαγής και τη διαθέσιμη ρευστότητα στη δεξαμενή (pool). Το MetaMask δεν επηρεάζει ούτε ελέγχει την επίδραση στη τιμή.",
+    "price_impact_info_description": "This is how your trade changes the market price of a token. It depends on the trade size, available liquidity, and provider fees. MetaMask doesn't control price impact.",
     "price_impact_info_gasless_description": "Η επίδραση στην τιμή αντικατοπτρίζει το πώς η εντολή ανταλλαγής σας επηρεάζει την τιμή αγοράς του περιουσιακού στοιχείου. Αν δεν διαθέτετε αρκετά κεφάλαια για τα τέλη συναλλαγής, μέρος του αρχικού σας token κατανέμεται αυτόματα για την κάλυψη των χρεώσεων, γεγονός που αυξάνει την επίδραση στην τιμή. Το MetaMask δεν επηρεάζει ούτε ελέγχει την επίδραση στην τιμή.",
     "price_impact_warning_description": "This trade has an estimated {{priceImpact}} price impact, which reflects how much your trade changes the market price. The quote already reflects this.",
     "price_impact_high": "High price impact",
@@ -6600,6 +6538,7 @@
     },
     "submit": "Υποβολή",
     "default_slippage_description": "Η συναλλαγή σας δεν θα ολοκληρωθεί εάν η τιμή αλλάξει περισσότερο από το ποσοστό απόκλισης.",
+    "cancel": "Άκυρο",
     "confirm": "Επιβεβαίωση",
     "exceeding_upper_slippage_warning": "Υψηλή απόκλιση— αυτό μπορεί να οδηγήσει σε μη ευνοϊκή ανταλλαγή",
     "exceeding_lower_slippage_warning": "Χαμηλή απόκλιση— αυτό μπορεί να οδηγήσει σε μη ευνοϊκή ανταλλαγή",
@@ -7282,19 +7221,6 @@
       "retry": "Προσπαθήστε ξανά",
       "on_linea": "στο δίκτυο Linea"
     },
-    "cashback_screen": {
-      "title": "Επιστροφή χρημάτων",
-      "available_cashback": "Διαθέσιμη επιστροφή χρημάτων",
-      "network_fee": "Τέλη δικτύου",
-      "expected_to_receive": "Αναμένεται να λάβετε",
-      "withdraw": "Ανάληψη",
-      "withdraw_unavailable": "Η ανάληψη δεν είναι διαθέσιμη",
-      "withdrawal_initiated": "Η διαδικασία ανάληψης ξεκίνησε",
-      "withdrawal_success": "Η ανάληψη ολοκληρώθηκε με επιτυχία",
-      "withdrawal_failed": "Η ανάληψη απέτυχε. Προσπαθήστε ξανά.",
-      "no_cashback": "Δεν υπάρχει διαθέσιμη επιστροφή χρημάτων",
-      "loading_error": "Αποτυχία φόρτωσης της επιστροφής χρημάτων. Προσπαθήστε ξανά."
-    },
     "change_asset": {
       "title": "Αλλαγή token και δικτύου",
       "full_spending_access": "Πλήρης πρόσβαση για δαπάνες",
@@ -7469,10 +7395,7 @@
       "service_not_available": "Η υπηρεσία δεν είναι διαθέσιμη αυτήν τη στιγμή. Παρακαλούμε προσπαθήστε ξανά σε λίγο.",
       "invalid_referral_code": "Μη έγκυρος κωδικός παραπομπής. Ελέγξτε τον και προσπαθήστε ξανά.",
       "already_referred": "Έχετε ήδη παραπεμφθεί από άλλον χρήστη.",
-      "cannot_use_own_referral_code": "Δεν μπορείτε να χρησιμοποιήσετε τον δικό σας κωδικό παραπομπής.",
-      "invalid_bonus_code": "Μη έγκυρος κωδικός μπόνους",
-      "already_redeemed": "Έχετε ήδη εξαργυρώσει αυτόν τον κωδικό μπόνους",
-      "reached_maximum": "Αυτός ο κωδικός μπόνους έχει φτάσει το μέγιστο όριο χρήσεων"
+      "cannot_use_own_referral_code": "Δεν μπορείτε να χρησιμοποιήσετε τον δικό σας κωδικό παραπομπής."
     },
     "claim_reward_error": {
       "title": "Η ενεργοποίηση της ανταμοιβής απέτυχε"
@@ -7529,10 +7452,8 @@
         "predict": "Πρόβλεψη",
         "musd_deposit": "Κατάθεση σε mUSD",
         "apply_referral_bonus": "Μπόνους κωδικού παραπομπής",
-        "bonus_code": "Κωδικός μπόνους",
         "uncategorized_event": "Μη κατηγοριοποιημένο συμβάν"
       },
-      "code": "Κωδικός",
       "date": "Ημερομηνία",
       "account": "Λογαριασμός",
       "bonus": "Μπόνους",
@@ -7651,10 +7572,6 @@
       "invalid_code": "Μη έγκυρος κωδικός παραπομπής",
       "apply_button": "Εφαρμογή κωδικού παραπομπής"
     },
-    "bonus_code": {
-      "input_placeholder": "Πληκτρολογήστε τον κωδικό μπόνους",
-      "apply_success": "Ο κωδικός μπόνους εφαρμόστηκε!"
-    },
     "optout": {
       "title": "Διαγραφή προόδου Ανταμοιβών",
       "description": "Αυτή η ενέργεια θα αφαιρέσει τους λογαριασμούς σας από το πρόγραμμα Ανταμοιβών και θα διαγράψει τους πόντους και την πρόοδό σας. Αυτή η ενέργεια δεν μπορεί να αναιρεθεί.",
@@ -7791,14 +7708,12 @@
     },
     "label": {
       "bridge_fee": "Τέλη διασύνδεσης",
-      "provider_fee": "Τέλη παρόχου",
       "network_fee": "Τέλη δικτύου",
       "paid_with": "Πληρώθηκε με",
-      "receive_token": "Λήψη token",
       "retry_button": "Προσπαθήστε ξανά",
       "total": "Σύνολο",
       "account": "Λογαριασμός",
-      "received_total": "Σύνολο που ελήφθη"
+      "received_total": "Received total"
     },
     "summary_title": {
       "bridge_approval": "Έγκριση {{approveSymbol}}",
@@ -7851,15 +7766,14 @@
     "still_connecting_network": "Ακόμη γίνεται σύνδεση με το {{networkName}}...",
     "unable_to_connect_network": "Δεν είναι δυνατή η σύνδεση με το {{networkName}}.",
     "update_rpc": "Ενημέρωση RPC",
-    "switch_to_metamask_default_rpc": "Μετάβαση στο προεπιλεγμένο RPC του MetaMask",
+    "switch_to_metamask_default_rpc": "Switch to MetaMask default RPC",
     "check_network_connectivity": "Ελέγξτε τη σύνδεση δικτύου σας.",
     "check_network_connectivity_or": "Ελέγξτε τη σύνδεση δικτύου σας ή",
-    "updated_to_metamask_default": "Ενημερώθηκε στο προεπιλεγμένο MetaMask"
+    "updated_to_metamask_default": "Updated to MetaMask default"
   },
   "trending": {
     "title": "Εξερεύνηση",
     "trending_tokens": "Δημοφιλή token",
-    "stocks": "Μετοχές",
     "price_change": "Αλλαγή τιμής",
     "all_networks": "Όλα τα δίκτυα",
     "24h": "24ω",
@@ -8007,8 +7921,8 @@
       }
     },
     "error": {
-      "unable_to_load": "Δεν είναι δυνατή η φόρτωση του {{section}}",
-      "retry": "Επανάληψη"
+      "unable_to_load": "Unable to load {{section}}",
+      "retry": "Retry"
     }
   }
-}
\ No newline at end of file
+}
diff --git a/locales/languages/en.json b/locales/languages/en.json
index fe3569ac5800..13e8fe8c171a 100644
--- a/locales/languages/en.json
+++ b/locales/languages/en.json
@@ -103,6 +103,10 @@
       "message": "Not enough {{ticker}} to cover fees. Use a token on another network or add more {{ticker}} to continue.",
       "title": "Insufficient funds"
     },
+    "insufficient_pay_token_native_post_quote": {
+      "message": "Not enough {{ticker}} to cover fees. Add {{ticker}} to continue.",
+      "title": "Insufficient funds for post quote"
+    },
     "no_pay_token_quotes": {
       "message": "This payment route isn't available right now. Try changing the amount, network, or token and we'll find the best option.",
       "title": "No quotes"
@@ -2071,14 +2075,14 @@
   },
   "market_insights": {
     "title": "Market insights",
-    "disclaimer": "AI insights. Not financial advice.",
     "a_closer_look": "A closer look",
     "whats_being_said": "What's being said",
-    "fixed_footer_disclaimer": "AI summary • Not financial advice",
+    "footer_disclaimer": "AI summary for information only",
     "trade_button": "Trade",
     "sources_count": "+{{count}} sources",
-    "sources_title": "Sources",
+    "sources_title": "News sources",
     "feedback_submitted": "Feedback submitted",
+    "helpful_prompt": "Was this helpful?",
     "feedback": {
       "title": "Feedback",
       "description": "Help improve our AI-generated market insights.",
@@ -2329,7 +2333,8 @@
       "exchange_fee": "Exchange fee",
       "exchange_fee_description": "Fee paid to the exchange or market",
       "total_incl_fees": "incl. fees",
-      "close": "Close"
+      "close": "Close",
+      "fak_partial_fill_note": "Prices shown assume your order is fully filled. Actual amounts may vary if the order is only partially filled."
     },
     "error": {
       "title": "Unable to connect to predictions",
@@ -2911,10 +2916,6 @@
     "enabling_notifications": "Enabling notifications...",
     "updating_notifications": "Updating notifications...",
     "updating_account_settings": "Updating account settings...",
-    "reset_notifications_title": "Reset notifications",
-    "reset_notifications_description": "Resetting notifications, means you're deleting your notifications storage keys and resetting all your notification history. Are you sure you want to do this?",
-    "reset_notifications": "Reset notifications",
-    "reset_notifications_success": "Notifications storage key deleted/recreated, and notifications history reset.",
     "notifications_dismiss_modal": "Dismiss",
     "select_rpc_url": "Select RPC URL",
     "title": "Settings",
@@ -3390,11 +3391,10 @@
     ],
     "private_key_explanation": "Save it somewhere safe and secret.",
     "private_key_warning": "This is the private key for the current selected account: {{accountName}}. Never disclose this key. Anyone with your private key can fully control your account, including transferring away any of your funds.",
-    "seed_phrase_warning_explanation": [
-      "Make sure nobody is looking at your screen. ",
-      "MetaMask Support will never request this."
-    ],
+    "seed_phrase_warning_explanation":
+      "Make sure nobody is looking at your screen. MetaMask Support will never ask for this.",
     "private_key_warning_explanation": "Never disclose this key. Anyone with your private key can fully control your account, including transferring away any of your funds.",
+    "reveal_srp_description": "Your Secret Recovery Phrase gives full access to your wallet. Do not share it with anyone.",
     "reveal_credential_modal": [
       "Your {{credentialName}} provides ",
       "full access to your account and funds.\n\nDo not share this with anyone.\n",
@@ -3426,7 +3426,8 @@
     "srp_text": "Secret Recovery Phrase",
     "private_key_text": "Private key",
     "got_it": "Got it",
-    "learn_more": "Learn more"
+    "learn_more": "Learn more",
+    "copied_to_clipboard": "Copied to clipboard"
   },
   "screenshot_deterrent": {
     "title": "Safety alert",
@@ -3702,6 +3703,10 @@
     "speedup_tx_title": "Attempt to speed up?",
     "speedup_tx_message": "Submitting this attempt does not guarantee your original transaction will be accelerated. If the speed up attempt is successful, you will be charged the transaction fee above.",
     "nevermind": "Never mind",
+    "cancel_speedup_speedup_title": "Speed up Transaction",
+    "cancel_speedup_cancel_title": "Cancel Transaction",
+    "cancel_speedup_speedup_message": "This network fee will replace the original.",
+    "cancel_speedup_cancel_message": "This transaction will be canceled and this network fee will replace the original.",
     "edit_network_fee": "Edit gas fee",
     "edit_priority": "Edit priority",
     "gas_cancel_fee": "Gas cancellation fee",
@@ -4834,6 +4839,10 @@
     "quote_unavailable": "Quote unavailable.",
     "providers": "Providers",
     "quotes_displayed_for": "Quotes displayed for {{paymentMethodName}}.",
+    "other_options": "Other options",
+    "previously_used": "Previously used",
+    "best_rate": "Best rate",
+    "most_reliable": "Most reliable",
     "continue": "Continue",
     "powered_by_provider": "Powered by {{provider}}",
     "purchased_currency": "Purchased {{currency}}",
@@ -4940,7 +4949,12 @@
     },
     "provider_picker_modal": {
       "title": "Choose a provider"
-    }
+    },
+    "contact_provider_support": "Contact {{provider}} support",
+    "got_it": "Got it",
+    "encountered_error": "We've encountered an error",
+    "no_quotes_error": "We encountered a problem fetching quotes from {{provider}}. Try a different amount or changing provider.",
+    "change_provider_button": "Change provider"
   },
   "fiat_on_ramp_aggregator": {
     "buy": "buy",
@@ -5189,6 +5203,19 @@
     "try_again": "Try again",
     "close": "Close"
   },
+  "ramps_v2": {
+    "notifications": {
+      "purchase_pending_title": "Processing your purchase of {{cryptocurrency}}",
+      "purchase_pending_description": "This should only take a few minutes...",
+      "purchase_completed_title": "Your purchase of {{amount}} {{cryptocurrency}} was successful!",
+      "purchase_completed_description": "Your {{cryptocurrency}} is now available",
+      "purchase_failed_title": "Purchase of {{cryptocurrency}} failed",
+      "purchase_failed_description": "Please try again momentarily",
+      "purchase_cancelled_title": "Your purchase was cancelled",
+      "purchase_cancelled_description": "Your purchase of {{cryptocurrency}} has been cancelled",
+      "track": "Track"
+    }
+  },
   "swaps": {
     "title": "Swap",
     "onboarding": {
@@ -5705,12 +5732,15 @@
     "new_wallet_needed_description_part_three": "To keep this from happening again, be sure to always keep your MetaMask app and OS updated to the latest version."
   },
   "srp_security_quiz": {
+    "question_step": "Question {{step}} of {{total}}",
     "title": "Security quiz",
     "introduction": "To reveal your Secret Recovery Phrase, you need to correctly answer two questions",
     "get_started": "Get started",
     "learn_more": "Learn more",
     "try_again": "Try again",
     "continue": "Continue",
+    "correct": "Correct!",
+    "incorrect": "Incorrect!",
     "of": "of",
     "question_one": {
       "question": "If you lose your Secret Recovery Phrase, MetaMask...",
@@ -5886,7 +5916,7 @@
     "error_description": "Installation of {{snap}} failed."
   },
   "earn": {
-    "claimable_bonus_tooltip": "An annual bonus claimable daily from your wallet.",
+    "claimable_bonus_tooltip": "The annualized bonus you’ve earned for holding mUSD. Your bonus is claimable daily on Linea.",
     "earn_a_percentage_bonus": "Earn a {{percentage}}% bonus",
     "claimable_bonus": "Claimable bonus",
     "claim_bonus": "Claim bonus",
@@ -5977,7 +6007,6 @@
       "ok": "OK",
       "continue": "Continue",
       "convert_and_get_percentage_bonus": "Convert and get {{percentage}}%",
-      "no_boost": "No boost",
       "your_musd": "Your mUSD",
       "balance_breakdown_title": "Your mUSD balances by network",
       "balance_amount": "{{amount}} mUSD",
@@ -5995,39 +6024,36 @@
       "toasts": {
         "converting": "Converting {{token}} → mUSD",
         "eta": "~{{time}}",
-        "delivered": "Your mUSD is here!",
+        "delivered": "mUSD conversion successful",
+        "delivered_description": "Bonus will be claimable within a day.",
         "failed": "mUSD conversion failed"
       },
       "education": {
         "heading": "GET {{percentage}}% ON\nSTABLECOINS",
-        "description": "Convert your stablecoins to mUSD, MetaMask’s US dollar-backed stablecoin, and receive up to a {{percentage}}% bonus.",
+        "description": "Convert your stablecoins to mUSD and earn up to a {{percentage}}% annualized bonus that you can claim daily.",
         "terms_apply": "Terms apply.",
         "primary_button": "Get Started",
         "secondary_button": "Not now"
       },
       "buy_musd": "Buy mUSD",
       "get_musd": "Get mUSD",
-      "boost_title": "Get {{percentage}}% on your stablecoins",
-      "boost_description": "Convert your stablecoins to mUSD and receive up to a {{percentage}}% bonus.",
+      "bonus_title": "Get {{percentage}}% on your stablecoins",
+      "bonus_description": "Convert your stablecoins to mUSD and get a {{percentage}}% annualized bonus.",
       "powered_by_relay": "Powered by Relay",
-      "earn_rewards_when": "Earn rewards when",
-      "you_convert_to": "you convert to",
       "max": "Max",
       "quick_convert_button": "Convert",
-      "cta_body_earn_apy": "Earn {{apy}} yield automatically for holding mUSD.",
       "learn_more": "Learn more",
       "tooltip_title": "Earn yield with mUSD",
       "tooltip_content": "Convert your USDC, USDT, or DAI for mUSD, MetaMask's dollar-backed stablecoin. Earn {{apy}} yield on every dollar you hold.",
       "quick_convert": {
-        "title": "Convert and get {{apy}}%",
-        "subtitle": "Convert your stablecoins to mUSD and receive up to a {{apy}}% bonus.",
+        "title": "Convert and get {{percentage}}%",
+        "subtitle": "Convert your stablecoins to mUSD and receive up to a {{percentage}}% annualized bonus that you can claim daily.",
         "inline_failed_message": "Conversion failed. Try again.",
         "confirmation": {
           "title": "Convert max"
-        },
-        "failed_to_get_quotes": "Failed to get quotes. Please close this modal and try again."
+        }
       },
-      "percentage_boost": "{{percentage}}% boost",
+      "percentage_bonus": "{{percentage}}% bonus",
       "rate": "Rate"
     },
     "bonus_claim": {
@@ -7211,6 +7237,7 @@
         "order_metal_card_description": "Order your physical Metal Card now",
         "cashback": "Cashback",
         "cashback_description": "Earn 1% back on all spending",
+        "cashback_description_metal": "Earn 3% back on all spending",
         "freeze_card": "Freeze card",
         "unfreeze_card": "Unfreeze card",
         "freeze_card_description": "Pause all spending on your card",
@@ -7797,6 +7824,14 @@
     "show_not_found": {
       "title": "Connection Not Found",
       "description": "Please establish a new connection from the app to continue."
+    },
+    "show_internal_error": {
+      "title": "Something went wrong",
+      "description": "An unexpected error occurred. Please try again."
+    },
+    "show_method_error": {
+      "title": "Request failed",
+      "description": "The request could not be completed. Please try again."
     }
   },
   "network_connection_banner": {
@@ -7855,6 +7890,95 @@
     "primary_action_reload": "Reload",
     "primary_action_acknowledge": "Got it"
   },
+  "hardware_wallet": {
+    "device_names": {
+      "ledger": "Ledger",
+      "qr": "QR Hardware Wallet",
+      "hardware_wallet": "Hardware Wallet"
+    },
+    "common": {
+      "cancel": "Cancel",
+      "continue": "Continue"
+    },
+    "connecting": {
+      "title": "Connect your {{device}}",
+      "searching": "Looking for {{device}}...",
+      "tips_header": "To continue, make sure:",
+      "tip_unlock": "Your {{device}} is unlocked",
+      "tip_open_app": "The Ethereum app is open",
+      "tip_enable_bluetooth": "Bluetooth is turned on",
+      "tip_dnd_off": "Do Not Disturb is turned off",
+      "tip_bluetooth_permission": "Location and Bluetooth permission is granted",
+      "tip_bluetooth_permission_v12": "Nearby devices permission is granted",
+      "tip_stay_close": "Your device stays close to your phone"
+    },
+    "awaiting_app": {
+      "title": "Open {{app}}",
+      "message": "Please open the {{app}} app on your {{device}}",
+      "current_app": "Currently open: {{app}}"
+    },
+    "awaiting_confirmation": {
+      "title_transaction": "Confirm on {{device}}",
+      "title_message": "Sign on {{device}}",
+      "message": "Review and confirm on your {{device}}"
+    },
+    "success": {
+      "title": "{{device}} connected"
+    },
+    "errors": {
+      "device_locked": "Unlock it and try again to continue",
+      "app_not_open": "Please open the Ethereum app on your device",
+      "device_disconnected": "Your {{device}} was disconnected. Please reconnect and try again",
+      "device_not_found": "Could not find your {{device}}. Please make sure it's connected",
+      "device_not_ready": "Your device is not ready. Please check it and try again",
+      "blind_signing": "Blind signing is disabled. Please enable it in your device settings",
+      "connection_closed": "The connection was lost. Please try again",
+      "connection_timeout": "Connection timed out. Please try again",
+      "user_cancelled": "The action was cancelled on your device",
+      "pending_confirmation": "There's a pending action on your device. Please complete or cancel it",
+      "bluetooth_permission_denied": "Bluetooth permission is required to connect to your device",
+      "location_permission_denied": "Location permission is required to scan for devices",
+      "nearby_permission_denied": "Nearby devices permission is required",
+      "bluetooth_off": "Please turn on Bluetooth to connect to your device",
+      "bluetooth_scan_failed": "Failed to scan for devices. Please try again",
+      "bluetooth_connection_failed": "Enable Bluetooth on your device to continue",
+      "not_supported": "This operation is not supported",
+      "unknown_error": "Make sure your {{device}} is set up with the Secret Recovery Phrase or passphrase for this account"
+    },
+    "error": {
+      "title": "Something went wrong",
+      "default_title": "An error occurred",
+      "continue": "Continue",
+      "retry": "Retry",
+      "view_settings": "View Settings",
+      "device_locked_title": "{{device}} locked",
+      "device_disconnected_title": "{{device}} disconnected",
+      "device_not_found_title": "{{device}} not found",
+      "app_not_open": "Ethereum App Not Open",
+      "blind_signing_disabled": "Blind Signing Disabled",
+      "connection_timeout": "Device Unresponsive",
+      "connection_closed": "Connection Lost",
+      "user_cancelled": "Action Cancelled",
+      "pending_confirmation": "Pending Confirmation",
+      "bluetooth_required": "Bluetooth required",
+      "bluetooth_permission_denied": "Bluetooth Permission Required",
+      "location_permission_denied": "Location Permission Required",
+      "nearby_devices_permission_denied": "Nearby Devices Permission Required",
+      "scan_failed": "Scan Failed",
+      "something_went_wrong": "Something went wrong"
+    },
+    "device_selection": {
+      "title": "Select {{device}}",
+      "scanning": "Scanning for devices...",
+      "no_devices_found": "No devices found",
+      "no_devices_hint": "Make sure your {{device}} is unlocked and Bluetooth is enabled",
+      "tips": "Unlock your {{device}}, enable Bluetooth, and ensure Do Not Disturb is turned off",
+      "connect": "Connect",
+      "rescan": "Scan Again",
+      "unknown_device": "Unknown Device",
+      "signal_strength": "Signal: {{rssi}} dBm"
+    }
+  },
   "homepage": {
     "sections": {
       "tokens": "Tokens",
@@ -7864,8 +7988,7 @@
       "nfts": "NFTs",
       "import_nfts": "Import NFTs",
       "import_nfts_description": "Easily add your collectibles",
-      "more_predictions": "More predictions",
-      "more_perps": "More perps",
+      "view_more": "View more",
       "positions": {
         "no_tp_sl": "No TP/SL"
       }
diff --git a/locales/languages/es.json b/locales/languages/es.json
index 67a267167f1e..aeab82505906 100644
--- a/locales/languages/es.json
+++ b/locales/languages/es.json
@@ -104,8 +104,8 @@
       "title": "Fondos insuficientes"
     },
     "insufficient_pay_token_native_post_quote": {
-      "message": "Not enough {{ticker}} to cover fees. Add {{ticker}} to continue.",
-      "title": "Insufficient funds for post quote"
+      "message": "No hay suficiente {{ticker}} para cubrir las tarifas. Añade {{ticker}} para continuar.",
+      "title": "Fondos insuficientes para la cotización enviada"
     },
     "no_pay_token_quotes": {
       "message": "Esta ruta de pago no está disponible en este momento. Intenta cambiar el monto, la red o el token y encontraremos la mejor opción.",
@@ -1184,7 +1184,6 @@
       "title": "Nueva orden",
       "leverage": "Apalancamiento",
       "limit_price": "Precio límite",
-      "market_price": "Precio de mercado",
       "enter_price": "Ingresar precio",
       "trigger_price": "Precio de activación",
       "liquidation_price": "Precio de liquidación",
@@ -1328,7 +1327,6 @@
       "funds_are_available_to_trade": "Los fondos están disponibles para operar",
       "close_order_still_active": "Cerrar orden aún activa",
       "order_submitted": "Orden enviada",
-      "submitting_your_trade": "Enviando tu operación",
       "order_filled": "Orden ejecutada",
       "order_placed": "Orden colocada",
       "order_placement_subtitle": "{{direction}} {{amount}} {{assetSymbol}}",
@@ -1346,26 +1344,14 @@
       "title": "Detalles de la orden",
       "cancel_order": "Cancelar orden",
       "date": "Fecha",
-      "trigger_condition": "Condición de activación",
-      "price": "Precio",
       "fee": "Tarifa",
       "limit_buy": "Límite de posición larga",
       "limit_price": "Precio límite",
       "limit_sell": "Límite de posición corta",
       "market_buy": "Posición larga de mercado",
       "market_sell": "Posición corta de mercado",
-      "market": "Mercado",
       "open": "Abierto",
       "size": "Tamaño",
-      "original_size": "Tamaño original",
-      "order_value": "Valor de la orden",
-      "reduce_only": "Reducir solamente",
-      "yes": "Sí",
-      "no": "No",
-      "price_above": "Precio por encima de {{price}}",
-      "price_below": "Precio por debajo de {{price}}",
-      "take_profit": "Toma de ganancias",
-      "stop_loss": "Límite de pérdidas",
       "status": "Estado",
       "view_explorer": "Ver en Explorer"
     },
@@ -2197,6 +2183,7 @@
     "available_balance": "Saldo disponible",
     "claim_amount_text": "Reclamar ${{amount}}",
     "claim_winnings_text": "Reclama tus ganancias",
+    "claiming_text": "Claiming...",
     "unrealized_pnl_label": "P&L no realizado",
     "unrealized_pnl_value": "{{amount}} ({{percent}})",
     "unrealized_pnl_error": "No se puede cargar",
@@ -2275,6 +2262,9 @@
           "title": "Algo salió mal",
           "description": "No se pudo proceder con la reclamación",
           "try_again": "Inténtalo de nuevo"
+        },
+        "in_progress": {
+          "title": "Claim already in progress"
         }
       }
     },
@@ -2308,7 +2298,6 @@
       "withdrawing_subtitle": "Disponible en aproximadamente 1 minuto",
       "withdraw_completed": "Retiro finalizado",
       "withdraw_completed_subtitle": "Se han transferido {{amount}} USDC a tu billetera",
-      "withdraw_any_token_completed_subtitle": "Se transfirieron {{amount}} {{token}} a tu billetera",
       "error_title": "Algo salió mal",
       "error_description": "No se pudo proceder con el retiro",
       "try_again": "Inténtalo de nuevo"
@@ -2440,7 +2429,7 @@
     "add_tokens": "Agregar activo",
     "are_you_sure_exit": "Are you sure you want to exit?",
     "import_token": "Would you like to import this token?",
-    "import_tokens": "¿Deseas importar estos tokens?",
+    "import_tokens": "Would you like to import these tokens?",
     "tokens_detected_in_account": "{{tokenCount}} nuevos {{tokensLabel}} se han encontrado en esta cuenta",
     "token_toast": {
       "tokens_imported_title": "Tokens importados",
@@ -2705,7 +2694,7 @@
     "decimals_cant_be_empty": "Los decimales del token no pueden estar vacíos.",
     "decimals_is_required": "Decimal is required. Find it on:",
     "no_tokens_found": "No se encontró ningún token con ese nombre.",
-    "tokens_empty_description": "Busca cualquier token e impórtalo",
+    "tokens_empty_description": "Search for any token and import it",
     "select_token": "Selecciona un token",
     "address_must_be_smart_contract": "Se detectó una dirección personal. Escriba la dirección de contrato del token.",
     "billion_abbreviation": "B",
@@ -2915,10 +2904,6 @@
     "enabling_notifications": "Activando notificaciones...",
     "updating_notifications": "Actualizando notificaciones...",
     "updating_account_settings": "Actualizando la configuración de la cuenta...",
-    "reset_notifications_title": "Restablecer notificaciones",
-    "reset_notifications_description": "Restablecer notificaciones significa que está eliminando sus claves de almacenamiento de notificaciones y reiniciando todo su historial de notificaciones. ¿Está seguro de que desea hacer esto?",
-    "reset_notifications": "Restablecer notificaciones",
-    "reset_notifications_success": "Se eliminó/recreó la clave de almacenamiento de notificaciones y se restableció el historial de notificaciones.",
     "notifications_dismiss_modal": "Ignorar",
     "select_rpc_url": "Seleccionar URL de RPC",
     "title": "Configuración",
@@ -3040,9 +3025,9 @@
     "add_rpc_url": "Agregar URL de RPC",
     "add_block_explorer_url": "Añadir URL del explorador de bloques",
     "networks_desc": "Agregar y editar redes RPC personalizadas",
-    "networks_enabled": "Redes habilitadas",
-    "networks_test_networks": "Redes de prueba",
-    "networks_additional": "Redes adicionales",
+    "networks_enabled": "Enabled Networks",
+    "networks_test_networks": "Test Networks",
+    "networks_additional": "Additional Networks",
     "networks_search_placeholder": "Buscar redes",
     "networks_no_results": "No se encontraron redes",
     "network_name_label": "Nombre de la red",
@@ -3062,15 +3047,15 @@
     "network_rpc_networks": "Redes RPC",
     "network_add_network": "Añadir red",
     "add_chain_title": "Agregar una red",
-    "add_chain_search_placeholder": "Buscar por nombre, ID de cadena o moneda",
-    "add_chain_loading": "Cargando redes…",
-    "add_chain_error": "Error al cargar las redes. Inténtalo de nuevo.",
+    "add_chain_search_placeholder": "Search by name, chain ID, or currency",
+    "add_chain_loading": "Loading networks…",
+    "add_chain_error": "Failed to load networks. Please try again.",
     "add_chain_retry": "Reintentar",
-    "add_chain_added": "Agregada",
+    "add_chain_added": "Added",
     "add_chain_or": "o",
     "add_chain_custom_link": "Agregar una red personalizada",
     "network_add_custom_network": "Agregar una red personalizada",
-    "network_add_test_network": "Agregar una red de prueba",
+    "network_add_test_network": "Add a test network",
     "network_add": "Agregar",
     "network_save": "Guardar",
     "remove_network_title": "¿Quiere quitar esta red?",
@@ -3394,9 +3379,11 @@
     ],
     "private_key_explanation": "Guárdela en un lugar seguro y secreto.",
     "private_key_warning": "Esta es la clave privada para la cuenta seleccionada actual: {{accountName}}. No revele esta clave. Cualquier persona que tenga su clave privada podrá controlar completamente su cuenta, incluida la transferencia de sus fondos.",
-    "seed_phrase_warning_explanation": "Asegúrate de que nadie esté mirando tu pantalla. El soporte de MetaMask nunca te pedirá esto.",
+    "seed_phrase_warning_explanation": [
+      "Asegúrese de que nadie esté viendo su pantalla.",
+      "El soporte técnico de MetaMask nunca se lo solicitará."
+    ],
     "private_key_warning_explanation": "No revele esta clave. Cualquier persona que tenga su clave privada podrá controlar completamente su cuenta, incluida la transferencia de sus fondos.",
-    "reveal_srp_description": "Tu frase secreta de recuperación da acceso completo a tu billetera. No la compartas con nadie.",
     "reveal_credential_modal": [
       "Su {{credentialName}} le proporciona ",
       "acceso completo a su monedero y fondos. \n\nNo la comparta con nadie.\n",
@@ -3428,8 +3415,7 @@
     "srp_text": "Frase secreta de recuperación",
     "private_key_text": "Clave privada",
     "got_it": "Entendido",
-    "learn_more": "Más información",
-    "copied_to_clipboard": "Copiado al portapapeles"
+    "learn_more": "Más información"
   },
   "screenshot_deterrent": {
     "title": "Alerta de seguridad",
@@ -3810,7 +3796,7 @@
     "transaction_fee_explanation": "Este permiso tiene asociada una tarifa de transacción.",
     "view_details": "Ver detalles",
     "view_transaction_details": "Ver detalles de la transacción",
-    "view_data": "Ver datos",
+    "view_data": "View data",
     "transaction_details": "Detalles de la transacción",
     "site_url": "Dirección URL del sitio",
     "permission_request": "Solicitud de permiso",
@@ -3891,7 +3877,7 @@
     "right_button": "Proteger monedero"
   },
   "add_favorite": {
-    "title": "Agregar a favoritos",
+    "title": "Add favorite",
     "title_label": "Nombre",
     "url_label": "URL",
     "add_button": "Agregar",
@@ -4772,7 +4758,7 @@
     "public_address": "Dirección pública",
     "public_address_qr_code": "Dirección pública",
     "coming_soon": "Próximamente…",
-    "request_payment": "Solicitar pago",
+    "request_payment": "Request payment",
     "copy": "Copiar",
     "scan_address": "Escanear dirección para recibir pago",
     "copy_address": "Copiar dirección"
@@ -4786,8 +4772,8 @@
     "switch_network": "Cambie a la red principal o a Sepolia",
     "card_title": "Mostrar siempre el botón de la tarjeta MetaMask",
     "card_desc": "La tarjeta MetaMask solo está disponible para residentes de países seleccionados.",
-    "daimo_demo_title": "Usar el entorno de demostración de DaimoPay",
-    "daimo_demo_desc": "Alterna entre los entornos de demostración y producción de DaimoPay para pagos con tarjeta."
+    "daimo_demo_title": "Use DaimoPay demo environment",
+    "daimo_demo_desc": "Toggle between DaimoPay demo and production environments for card payments."
   },
   "walletconnect_sessions": {
     "no_active_sessions": "No tiene sesiones activas",
@@ -4800,10 +4786,10 @@
     "close_current_session": "Cierre la sesión actual antes de iniciar una nueva."
   },
   "paymentRequest": {
-    "title": "Solicitud de pago",
-    "title_complete": "Pago finalizado",
+    "title": "Payment request",
+    "title_complete": "Payment complete",
     "confirm": "Pagar",
-    "cancel": "Rechazar",
+    "cancel": "Decline",
     "is_requesting_you_to_pay": "le solicita que pague",
     "total": "Total:"
   },
@@ -4838,7 +4824,6 @@
     "no_payment_methods_available": "No hay métodos de pago disponibles.",
     "error_fetching_quotes": "Se produjo un error. Inténtalo de nuevo.",
     "no_quotes_available": "No hay proveedores disponibles.",
-    "quote_unavailable": "Cotización no disponible.",
     "providers": "Proveedores",
     "quotes_displayed_for": "Cotizaciones mostradas para {{paymentMethodName}}.",
     "other_options": "Other options",
@@ -4944,10 +4929,10 @@
       "logged_out_error": "Error al cerrar sesión"
     },
     "token_unavailable_modal": {
-      "title": "No disponible",
-      "description": "{{token}} no está disponible con {{provider}} en tu región.",
-      "change_token": "Cambiar token",
-      "change_provider": "Cambiar de proveedor"
+      "title": "Not available",
+      "description": "{{token}} is not available with {{provider}} in your region.",
+      "change_token": "Change token",
+      "change_provider": "Change provider"
     },
     "provider_picker_modal": {
       "title": "Elegir un proveedor"
@@ -5185,39 +5170,6 @@
     },
     "deposit_order_title": "Depósito de {{currency}}"
   },
-  "ramps_order_details": {
-    "title": "Detalles de la orden",
-    "status": "Estado",
-    "processing": "Procesando",
-    "complete": "Completado",
-    "failed": "Fallido",
-    "cancelled": "Cancelado",
-    "view_on_provider": "Ver en {{provider}}",
-    "order_id": "Id. de orden",
-    "date_and_time": "Fecha y hora",
-    "fees": "Tarifas",
-    "total": "Total",
-    "card_processing_info": "Las compras con tarjeta suelen tardar unos minutos",
-    "processing_info_modal_description": "Las compras con tarjeta suelen tardar unos minutos. Si tienes alguna pregunta, puedes comunicarte con el equipo de soporte.",
-    "go_to_provider_support": "Ir a la página de soporte de {{provider}}",
-    "error_title": "Algo salió mal",
-    "error_message": "No se pueden cargar los detalles de la orden. Inténtalo de nuevo.",
-    "try_again": "Inténtalo de nuevo",
-    "close": "Cerrar"
-  },
-  "ramps_v2": {
-    "notifications": {
-      "purchase_pending_title": "Procesando su compra de {{cryptocurrency}}",
-      "purchase_pending_description": "Esto solo tardará unos minutos...",
-      "purchase_completed_title": "Tu compra de {{amount}} {{cryptocurrency}} se realizó correctamente!",
-      "purchase_completed_description": "Su {{cryptocurrency}} ahora está disponible",
-      "purchase_failed_title": "Compra de {{cryptocurrency}} fallida",
-      "purchase_failed_description": "Inténtalo de nuevo en unos momentos",
-      "purchase_cancelled_title": "Su compra fue cancelada",
-      "purchase_cancelled_description": "Se canceló tu compra de {{cryptocurrency}}",
-      "track": "Hacer seguimiento"
-    }
-  },
   "swaps": {
     "title": "Canjear",
     "onboarding": {
@@ -5734,15 +5686,12 @@
     "new_wallet_needed_description_part_three": "Para evitar que esto vuelva a ocurrir, asegúrese de mantener siempre actualizados a la última versión la aplicación de MetaMask y el sistema operativo."
   },
   "srp_security_quiz": {
-    "question_step": "Pregunta {{step}} de {{total}}",
     "title": "Cuestionario de seguridad",
     "introduction": "Para revelar tu frase secreta de recuperación, debes responder correctamente dos preguntas",
     "get_started": "Comenzar",
     "learn_more": "Conozca más",
     "try_again": "Inténtalo de nuevo",
     "continue": "Continuar",
-    "correct": "¡Correcto!",
-    "incorrect": "¡Incorrecto!",
     "of": "de",
     "question_one": {
       "question": "Si extravía su frase secreta de recuperación, MetaMask...",
@@ -5921,8 +5870,8 @@
     "claimable_bonus_tooltip": "The annualized bonus you’ve earned for holding mUSD. Your bonus is claimable daily on Linea.",
     "earn_a_percentage_bonus": "Gana un bono del {{percentage}} %",
     "claimable_bonus": "Bonificación reclamable",
-    "claim_bonus": "Reclamar bono",
-    "claim_bonus_subtitle": "El bono se pagará en {{networkName}}.",
+    "claim_bonus": "Claim bonus",
+    "claim_bonus_subtitle": "Bonus will be paid out on {{networkName}}.",
     "empty_state_cta": {
       "heading": "Presta {{tokenSymbol}} y gana",
       "body": "Presta tu {{tokenSymbol}} con {{protocol}} y gana",
@@ -5933,7 +5882,7 @@
     "service_interruption_banner": {
       "maintenance_message": "Estamos en mantenimiento. ¡Pronto volveremos a estar en línea!"
     },
-    "supply": "Suministro",
+    "supply": "Supply",
     "deposit": "Depósito",
     "approve": "Aprobar",
     "approval": "Aprobación",
@@ -5982,7 +5931,7 @@
     "network": "Red",
     "health_factor": "Factor de salud",
     "liquidation_risk": "Riesgo de liquidación",
-    "insufficient_pool_liquidity": "Liquidez insuficiente del fondo",
+    "insufficient_pool_liquidity": "Insufficient pool liquidity",
     "available_to_withdraw": "disponible para retirar",
     "unknown": "desconocida",
     "how_it_works": "Cómo funciona",
@@ -6001,7 +5950,7 @@
       "lending": "Historial de posiciones",
       "staking": "Historial de pagos"
     },
-    "allowance_reset": "Restablecimiento de asignación",
+    "allowance_reset": "Allowance reset",
     "tron": {
       "fee": "Tarifa"
     },
@@ -6009,20 +5958,8 @@
       "ok": "OK",
       "continue": "Continuar",
       "convert_and_get_percentage_bonus": "Convierte y obtén un {{percentage}} %",
-      "your_musd": "Tus mUSD",
-      "balance_breakdown_title": "Tu saldo de mUSD por red",
-      "balance_amount": "{{amount}} mUSD",
-      "balance_amount_with_symbol": "{{amount}} {{symbol}}",
-      "balance_fiat_unavailable": "—",
-      "convert_to_musd": "Convertir a mUSD",
       "get_a_percentage_musd_bonus": "Obtén un bono del {{percentage}} % en mUSD",
       "convert": "Convertir",
-      "fetching_quote": "Obteniendo cotización...",
-      "you_convert": "Conviertes",
-      "network_fee": "Tarifa de red",
-      "earning": "Ganancia",
-      "quick_convert_description": "Selecciona un token para convertir tu saldo completo o toca el ícono de edición para ingresar un monto personalizado.",
-      "no_tokens_to_convert": "No tienes ningún token que se pueda convertir a mUSD.",
       "toasts": {
         "converting": "Convirtiendo {{token}} → mUSD",
         "eta": "~{{time}}",
@@ -6062,7 +5999,7 @@
       "toasts": {
         "claiming": "Tu bono en mUSD está en proceso",
         "delivered": "¡Tu bono en mUSD ya está disponible!",
-        "failed": "Reclamación de bono fallida"
+        "failed": "Bonus claim failed"
       }
     },
     "rewards": {
@@ -6073,8 +6010,7 @@
       "tooltip_opted_in_footer": "Los puntos se agregarán automáticamente a tu cuenta.",
       "tooltip_not_opted_in_footer": "Regístrate en las recompensas para recibir tus puntos.",
       "tooltip_close": "Cerrar"
-    },
-    "your_stablecoins": "Tus monedas estables"
+    }
   },
   "stake": {
     "stake": "Stake",
@@ -6096,7 +6032,9 @@
       "fee": "Tarifa",
       "errors": {
         "insufficient_balance": "No tienes suficiente saldo de recursos para realizar esta acción."
-      }
+      },
+      "trx_unstaking_in_progress": "Unstaking de {{amount}} n curso. El unstaking tarda 14 días.",
+      "has_claimable_trx": "You can claim {{amount}} TRX. Once claimed you'll get TRX back in your wallet."
     },
     "stake_eth": "Hacer staking de ETH",
     "unstake_eth": "Dejar de hacer staking de ETH",
@@ -6574,7 +6512,7 @@
     "hardware_wallet_not_supported": "Las billeteras físicas aún no son compatibles. Usa una billetera en caliente para continuar.",
     "hardware_wallet_not_supported_solana": "Las billeteras físicas aún no son compatibles con Solana. Usa una billetera en caliente para continuar.",
     "price_impact_info_title": "Impacto sobre el precio",
-    "price_impact_info_description": "El impacto en el precio refleja cómo tu orden de canje afecta el precio de mercado del activo. Depende del tamaño de la operación y de la liquidez disponible en el fondo. MetaMask no influye ni controla el impacto en el precio.",
+    "price_impact_info_description": "This is how your trade changes the market price of a token. It depends on the trade size, available liquidity, and provider fees. MetaMask doesn't control price impact.",
     "price_impact_info_gasless_description": "El impacto en el precio refleja cómo tu orden de canje afecta el precio de mercado del activo. Si no tienes suficientes fondos para gas, parte de tu token de origen se asigna automáticamente para cubrir las tarifas, lo que aumenta el impacto en el precio. MetaMask no influye ni controla el impacto en el precio.",
     "price_impact_warning_description": "This trade has an estimated {{priceImpact}} price impact, which reflects how much your trade changes the market price. The quote already reflects this.",
     "price_impact_high": "High price impact",
@@ -6600,6 +6538,7 @@
     },
     "submit": "Enviar",
     "default_slippage_description": "Tu transacción no se realizará si el precio cambia más que el porcentaje de deslizamiento.",
+    "cancel": "Cancelar",
     "confirm": "Confirmar",
     "exceeding_upper_slippage_warning": "Alto deslizamiento, lo que puede resultar en un canje desfavorable",
     "exceeding_lower_slippage_warning": "Bajo deslizamiento, lo que puede resultar en un canje desfavorable",
@@ -7282,19 +7221,6 @@
       "retry": "Inténtalo de nuevo",
       "on_linea": "en Linea"
     },
-    "cashback_screen": {
-      "title": "Cashback",
-      "available_cashback": "Cashback disponible",
-      "network_fee": "Tarifa de red",
-      "expected_to_receive": "Se espera recibir",
-      "withdraw": "Retirar",
-      "withdraw_unavailable": "Retiro no disponible",
-      "withdrawal_initiated": "Se ha iniciado el retiro",
-      "withdrawal_success": "Retiro finalizado correctamente",
-      "withdrawal_failed": "Retiro fallido. Inténtalo de nuevo.",
-      "no_cashback": "No hay cashback disponible",
-      "loading_error": "Error al cargar el cashback. Inténtalo de nuevo."
-    },
     "change_asset": {
       "title": "Cambiar token y red",
       "full_spending_access": "Acceso total al gasto",
@@ -7469,10 +7395,7 @@
       "service_not_available": "El servicio no está disponible en este momento. Inténtalo de nuevo en breve.",
       "invalid_referral_code": "Código de recomendación no válido. Compruébalo e inténtalo de nuevo.",
       "already_referred": "Ya otro usuario te ha recomendado.",
-      "cannot_use_own_referral_code": "No puedes usar tu propio código de recomendación.",
-      "invalid_bonus_code": "Código de bono no válido",
-      "already_redeemed": "Ya canjeaste este código de bono",
-      "reached_maximum": "Este código de bono alcanzó su número máximo de usos"
+      "cannot_use_own_referral_code": "No puedes usar tu propio código de recomendación."
     },
     "claim_reward_error": {
       "title": "No se pudo reclamar la recompensa"
@@ -7529,10 +7452,8 @@
         "predict": "Predicción",
         "musd_deposit": "Depósito en mUSD",
         "apply_referral_bonus": "Bono por código de recomendación",
-        "bonus_code": "Código de bono",
         "uncategorized_event": "Evento sin categoría"
       },
-      "code": "Código",
       "date": "Fecha",
       "account": "Cuenta",
       "bonus": "Bonificación",
@@ -7651,10 +7572,6 @@
       "invalid_code": "Código de recomendación no válido",
       "apply_button": "Aplicar código de recomendación"
     },
-    "bonus_code": {
-      "input_placeholder": "Ingresa el código de bono",
-      "apply_success": "¡Código de bono aplicado!"
-    },
     "optout": {
       "title": "Eliminar del programa de Recompensas",
       "description": "Esta acción eliminará tus cuentas del programa de Recompensas y borrará tus puntos y progreso. No podrás deshacer esta acción.",
@@ -7791,14 +7708,12 @@
     },
     "label": {
       "bridge_fee": "Tarifa de puente",
-      "provider_fee": "Tarifa del proveedor",
       "network_fee": "Tarifa de red",
       "paid_with": "Pagado con",
-      "receive_token": "Token a recibir",
       "retry_button": "Inténtalo de nuevo",
       "total": "Total",
       "account": "Cuenta",
-      "received_total": "Total recibido"
+      "received_total": "Received total"
     },
     "summary_title": {
       "bridge_approval": "Aprobar {{approveSymbol}}",
@@ -7851,15 +7766,14 @@
     "still_connecting_network": "Todavía conectándose a {{networkName}}...",
     "unable_to_connect_network": "No se puede conectar a {{networkName}}.",
     "update_rpc": "Actualizar RPC",
-    "switch_to_metamask_default_rpc": "Cambiar al RPC por defecto de MetaMask",
+    "switch_to_metamask_default_rpc": "Switch to MetaMask default RPC",
     "check_network_connectivity": "Comprueba tu conectividad de red.",
     "check_network_connectivity_or": "Comprueba tu conectividad de red o",
-    "updated_to_metamask_default": "Se actualizó a la configuración por defecto de MetaMask"
+    "updated_to_metamask_default": "Updated to MetaMask default"
   },
   "trending": {
     "title": "Explorar",
     "trending_tokens": "Tokens de tendencia",
-    "stocks": "Acciones",
     "price_change": "Cambio de precio",
     "all_networks": "Todas las redes",
     "24h": "24h",
@@ -8007,8 +7921,8 @@
       }
     },
     "error": {
-      "unable_to_load": "No se pudo cargar {{section}}",
-      "retry": "Reintentar"
+      "unable_to_load": "Unable to load {{section}}",
+      "retry": "Retry"
     }
   }
-}
\ No newline at end of file
+}
diff --git a/locales/languages/fr.json b/locales/languages/fr.json
index f02a1372cf5b..ee68fd73faf3 100644
--- a/locales/languages/fr.json
+++ b/locales/languages/fr.json
@@ -104,8 +104,8 @@
       "title": "Fonds insuffisants"
     },
     "insufficient_pay_token_native_post_quote": {
-      "message": "Not enough {{ticker}} to cover fees. Add {{ticker}} to continue.",
-      "title": "Insufficient funds for post quote"
+      "message": "Pas assez de {{ticker}} pour couvrir les frais. Ajoutez des {{ticker}} pour continuer.",
+      "title": "Fonds insuffisants pour l’étape post-cotation"
     },
     "no_pay_token_quotes": {
       "message": "Cette voie de paiement n’est pas disponible pour le moment. Essayez de modifier le montant, le réseau ou le jeton, et nous trouverons la meilleure option.",
@@ -1184,7 +1184,6 @@
       "title": "Nouvel ordre",
       "leverage": "Effet de levier",
       "limit_price": "Prix limite",
-      "market_price": "Prix du marché",
       "enter_price": "Saisir le prix",
       "trigger_price": "Prix déclencheur",
       "liquidation_price": "Prix de liquidation",
@@ -1328,7 +1327,6 @@
       "funds_are_available_to_trade": "Fonds disponibles pour le trading",
       "close_order_still_active": "Ordre de fermeture toujours actif",
       "order_submitted": "Ordre envoyé",
-      "submitting_your_trade": "Soumettre votre ordre",
       "order_filled": "Ordre exécuté",
       "order_placed": "Ordre passé",
       "order_placement_subtitle": "{{direction}} à {{amount}} {{assetSymbol}}",
@@ -1346,26 +1344,14 @@
       "title": "Détails de l’ordre de bourse",
       "cancel_order": "Annuler l’ordre",
       "date": "Date",
-      "trigger_condition": "Condition d’exécution",
-      "price": "Prix",
       "fee": "Frais",
       "limit_buy": "Ordre d’achat à cours limité",
       "limit_price": "Prix limite",
       "limit_sell": "Ordre de vente à cours limité",
       "market_buy": "Ordre d’achat au marché",
       "market_sell": "Ordre de vente au marché",
-      "market": "Marché",
       "open": "Ouvert",
       "size": "Taille",
-      "original_size": "Taille originale",
-      "order_value": "Valeur de l’ordre",
-      "reduce_only": "Réduire uniquement",
-      "yes": "Oui",
-      "no": "Non",
-      "price_above": "Prix supérieur à {{price}}",
-      "price_below": "Prix inférieur à {{price}}",
-      "take_profit": "Take profit",
-      "stop_loss": "Stop loss",
       "status": "État",
       "view_explorer": "Afficher sur l’explorateur"
     },
@@ -2197,6 +2183,7 @@
     "available_balance": "Solde disponible",
     "claim_amount_text": "Réclamer {{amount}} $",
     "claim_winnings_text": "Réclamer vos gains",
+    "claiming_text": "Claiming...",
     "unrealized_pnl_label": "Profits et pertes non réalisés",
     "unrealized_pnl_value": "{{amount}} ({{percent}})",
     "unrealized_pnl_error": "Impossible de charger",
@@ -2275,6 +2262,9 @@
           "title": "Quelque chose a mal tourné",
           "description": "Échec de la réclamation",
           "try_again": "Réessayez"
+        },
+        "in_progress": {
+          "title": "Claim already in progress"
         }
       }
     },
@@ -2308,7 +2298,6 @@
       "withdrawing_subtitle": "Disponible dans environ 1 minute",
       "withdraw_completed": "Retrait effectué",
       "withdraw_completed_subtitle": "{{amount}} USDC transféré vers votre portefeuille",
-      "withdraw_any_token_completed_subtitle": "{{amount}} {{token}} transféré(s) vers votre portefeuille",
       "error_title": "Quelque chose a mal tourné",
       "error_description": "Échec du retrait",
       "try_again": "Réessayez"
@@ -2440,7 +2429,7 @@
     "add_tokens": "Importer des jetons",
     "are_you_sure_exit": "Are you sure you want to exit?",
     "import_token": "Would you like to import this token?",
-    "import_tokens": "Voulez-vous importer ces jetons ?",
+    "import_tokens": "Would you like to import these tokens?",
     "tokens_detected_in_account": "{{tokenCount}} nouveaux {{tokensLabel}} trouvés dans ce compte",
     "token_toast": {
       "tokens_imported_title": "Jetons importés",
@@ -2705,7 +2694,7 @@
     "decimals_cant_be_empty": "Le nombre de décimales du jeton ne peut être vide.",
     "decimals_is_required": "Decimal is required. Find it on:",
     "no_tokens_found": "Nous n’avons pas trouvé de jetons portant ce nom.",
-    "tokens_empty_description": "Recherchez n’importe quel jeton et importez-le",
+    "tokens_empty_description": "Search for any token and import it",
     "select_token": "Sélectionnez un jeton",
     "address_must_be_smart_contract": "Adresse personnelle détectée. Saisissez l’adresse du contrat de jeton.",
     "billion_abbreviation": "Mrd",
@@ -2915,10 +2904,6 @@
     "enabling_notifications": "Activation des notifications…",
     "updating_notifications": "Mise à jour des notifications...",
     "updating_account_settings": "Mise à jour des paramètres du compte...",
-    "reset_notifications_title": "Réinitialiser les notifications",
-    "reset_notifications_description": "La réinitialisation des notifications entrainera la suppression des clés de stockage des notifications et de l’historique des notifications. Êtes-vous sûr(e) de vouloir continuer ?",
-    "reset_notifications": "Réinitialiser les notifications",
-    "reset_notifications_success": "La clé de stockage des notifications a été supprimée/recréée et l’historique des notifications a été réinitialisé.",
     "notifications_dismiss_modal": "Ignorer",
     "select_rpc_url": "Sélectionner l’URL du RPC",
     "title": "Paramètres",
@@ -3040,9 +3025,9 @@
     "add_rpc_url": "Ajouter l’URL de l’appel de procédure à distance (RPC)",
     "add_block_explorer_url": "Ajouter l’URL de l’explorateur de blocs",
     "networks_desc": "Ajouter et modifier des réseaux RPC personnalisés",
-    "networks_enabled": "Réseaux activés",
-    "networks_test_networks": "Réseaux de test",
-    "networks_additional": "Réseaux supplémentaires",
+    "networks_enabled": "Enabled Networks",
+    "networks_test_networks": "Test Networks",
+    "networks_additional": "Additional Networks",
     "networks_search_placeholder": "Rechercher un réseau",
     "networks_no_results": "Aucun réseau trouvé",
     "network_name_label": "Nom du réseau",
@@ -3062,15 +3047,15 @@
     "network_rpc_networks": "Réseaux RPC",
     "network_add_network": "Ajouter un réseau",
     "add_chain_title": "Ajouter un réseau",
-    "add_chain_search_placeholder": "Recherchez par nom, ID de chaîne ou devise",
-    "add_chain_loading": "Chargement des réseaux…",
-    "add_chain_error": "Échec du chargement des réseaux. Veuillez réessayer.",
+    "add_chain_search_placeholder": "Search by name, chain ID, or currency",
+    "add_chain_loading": "Loading networks…",
+    "add_chain_error": "Failed to load networks. Please try again.",
     "add_chain_retry": "Réessayer",
-    "add_chain_added": "Ajoutée",
+    "add_chain_added": "Added",
     "add_chain_or": "ou",
     "add_chain_custom_link": "Ajouter un réseau personnalisé",
     "network_add_custom_network": "Ajouter un réseau personnalisé",
-    "network_add_test_network": "Ajouter un réseau de test",
+    "network_add_test_network": "Add a test network",
     "network_add": "Ajouter",
     "network_save": "Enregistrer",
     "remove_network_title": "Voulez-vous supprimer ce réseau ?",
@@ -3394,9 +3379,11 @@
     ],
     "private_key_explanation": "Conservez-la dans un endroit sûr et secret.",
     "private_key_warning": "Il s’agit de la clé privée du compte actuellement sélectionné : {{accountName}}. Ne divulguez jamais cette clé. Quiconque est en sa possession peut exercer un contrôle total sur votre compte, y compris le transfert de vos fonds.",
-    "seed_phrase_warning_explanation": "Assurez-vous que personne ne regarde votre écran. Le service d’assistance de MetaMask ne vous demandera jamais de fournir ce type d’information.",
+    "seed_phrase_warning_explanation": [
+      "Assurez-vous que personne ne regarde votre écran.",
+      "Le service d’assistance MetaMask ne vous la demandera jamais."
+    ],
     "private_key_warning_explanation": "Ne divulguez jamais cette clé. Quiconque est en sa possession peut exercer un contrôle total sur votre compte, y compris le transfert de vos fonds.",
-    "reveal_srp_description": "Votre phrase secrète de récupération donne un accès complet à votre portefeuille. Ne la partagez avec personne.",
     "reveal_credential_modal": [
       "Votre {{credentialName}} donne ",
       "un accès complet à votre compte et vos fonds. \n\nNe la partagez avec personne.",
@@ -3428,8 +3415,7 @@
     "srp_text": "Phrase secrète de récupération",
     "private_key_text": "Clé privée",
     "got_it": "J’ai compris",
-    "learn_more": "En savoir plus",
-    "copied_to_clipboard": "Copié dans le presse-papiers"
+    "learn_more": "En savoir plus"
   },
   "screenshot_deterrent": {
     "title": "Alerte de sécurité",
@@ -3810,7 +3796,7 @@
     "transaction_fee_explanation": "Des frais de transaction sont associés à cette autorisation.",
     "view_details": "Voir les détails",
     "view_transaction_details": "Afficher les détails de la transaction",
-    "view_data": "Afficher les données",
+    "view_data": "View data",
     "transaction_details": "Détails de la transaction",
     "site_url": "URL du site",
     "permission_request": "Demande d’autorisation",
@@ -3891,7 +3877,7 @@
     "right_button": "Protéger le portefeuille"
   },
   "add_favorite": {
-    "title": "Ajouter aux favoris",
+    "title": "Add favorite",
     "title_label": "Nom",
     "url_label": "URL",
     "add_button": "Ajouter",
@@ -4245,8 +4231,8 @@
   "biometrics": {
     "enable_touchid": "Déverrouiller avec Touch ID ?",
     "enable_faceid": "Déverrouiller avec Face ID ?",
-    "enable_fingerprint": "Déverrouiller à l’aide de votre empreinte digitale ?",
-    "enable_biometrics": "Déverrouiller grâce à la reconnaissance biométrique ?",
+    "enable_fingerprint": "Unlock with fingerprint?",
+    "enable_biometrics": "Unlock with biometrics?",
     "enable_device_passcode_ios": "Déverrouiller avec le code secret de l’appareil ?",
     "enable_device_passcode_android": "Déverrouiller avec le code PIN de l’appareil ?"
   },
@@ -4772,7 +4758,7 @@
     "public_address": "Adresse publique",
     "public_address_qr_code": "Adresse publique",
     "coming_soon": "Bientôt disponible…",
-    "request_payment": "Demander un paiement",
+    "request_payment": "Request payment",
     "copy": "Copiez",
     "scan_address": "Scanner l’adresse pour recevoir le paiement",
     "copy_address": "Copier l’adresse"
@@ -4786,8 +4772,8 @@
     "switch_network": "Veuillez passer à Mainnet ou à Sepolia",
     "card_title": "Toujours afficher le bouton MetaMask Card",
     "card_desc": "MetaMask Card est uniquement disponible pour les résidents de certains pays.",
-    "daimo_demo_title": "Utiliser l’environnement de démonstration de DaimoPay",
-    "daimo_demo_desc": "Basculez entre les environnements de démonstration et de production de DaimoPay pour les paiements par carte."
+    "daimo_demo_title": "Use DaimoPay demo environment",
+    "daimo_demo_desc": "Toggle between DaimoPay demo and production environments for card payments."
   },
   "walletconnect_sessions": {
     "no_active_sessions": "Vous n’avez aucune session active",
@@ -4800,10 +4786,10 @@
     "close_current_session": "Fermez la session en cours avant d’en commencer une nouvelle."
   },
   "paymentRequest": {
-    "title": "Demande de paiement",
-    "title_complete": "Paiement effectué",
+    "title": "Payment request",
+    "title_complete": "Payment complete",
     "confirm": "Payer",
-    "cancel": "Refuser",
+    "cancel": "Decline",
     "is_requesting_you_to_pay": "vous demande de payer",
     "total": "Total:"
   },
@@ -4838,7 +4824,6 @@
     "no_payment_methods_available": "Aucun moyen de paiement n’est disponible.",
     "error_fetching_quotes": "Un problème est survenu, veuillez réessayer.",
     "no_quotes_available": "Aucun fournisseur disponible.",
-    "quote_unavailable": "Cotation non disponible.",
     "providers": "Fournisseurs",
     "quotes_displayed_for": "Cotations affichées pour {{paymentMethodName}}.",
     "other_options": "Other options",
@@ -4944,10 +4929,10 @@
       "logged_out_error": "Erreur lors de la déconnexion"
     },
     "token_unavailable_modal": {
-      "title": "Non disponible",
-      "description": "{{token}} n’est pas pris en charge par {{provider}} dans votre région.",
-      "change_token": "Changer de jeton",
-      "change_provider": "Changer de fournisseur"
+      "title": "Not available",
+      "description": "{{token}} is not available with {{provider}} in your region.",
+      "change_token": "Change token",
+      "change_provider": "Change provider"
     },
     "provider_picker_modal": {
       "title": "Choisir un fournisseur"
@@ -5185,39 +5170,6 @@
     },
     "deposit_order_title": "Dépôt en {{currency}}"
   },
-  "ramps_order_details": {
-    "title": "Détails de l’ordre",
-    "status": "État",
-    "processing": "Traitement en cours",
-    "complete": "Terminé",
-    "failed": "Échec",
-    "cancelled": "Annulé",
-    "view_on_provider": "Afficher sur {{provider}}",
-    "order_id": "Numéro de la commande",
-    "date_and_time": "Date et heure",
-    "fees": "Frais",
-    "total": "Total",
-    "card_processing_info": "Vous pouvez finaliser les achats par carte de crédit/débit en quelques minutes",
-    "processing_info_modal_description": "Les achats par carte prennent généralement quelques minutes. Vous pouvez contacter le service d’assistance si vous avez des questions.",
-    "go_to_provider_support": "Accéder à la page d’assistance de {{provider}}",
-    "error_title": "Quelque chose a mal tourné",
-    "error_message": "Impossible de charger les détails de l’ordre. Veuillez réessayer.",
-    "try_again": "Réessayez",
-    "close": "Fermer"
-  },
-  "ramps_v2": {
-    "notifications": {
-      "purchase_pending_title": "Traitement de votre ordre d’achat de {{cryptocurrency}}",
-      "purchase_pending_description": "Cela ne devrait prendre que quelques minutes…",
-      "purchase_completed_title": "L’achat de {{amount}} {{cryptocurrency}} a été effectué avec succès !",
-      "purchase_completed_description": "Vos {{cryptocurrency}} sont maintenant disponibles",
-      "purchase_failed_title": "L’achat de {{cryptocurrency}} a échoué",
-      "purchase_failed_description": "Veuillez réessayer dans quelques instants",
-      "purchase_cancelled_title": "Votre achat a été annulé",
-      "purchase_cancelled_description": "Votre achat de {{cryptocurrency}} a été annulé",
-      "track": "Suivre"
-    }
-  },
   "swaps": {
     "title": "Échanger",
     "onboarding": {
@@ -5734,15 +5686,12 @@
     "new_wallet_needed_description_part_three": "Pour éviter que cela ne se reproduise, veillez à ce que votre application MetaMask et votre système d'exploitation soient toujours mis à jour."
   },
   "srp_security_quiz": {
-    "question_step": "Question {{step}} sur {{total}}",
     "title": "Quiz sur la sécurité",
     "introduction": "Pour révéler votre Phrase secrète de récupération, vous devez répondre correctement à deux questions",
     "get_started": "Commencer",
     "learn_more": "En savoir plus",
     "try_again": "Réessayez",
     "continue": "Continuer",
-    "correct": "Correct !",
-    "incorrect": "Incorrect !",
     "of": "de",
     "question_one": {
       "question": "Si vous perdez votre Phrase secrète de récupération, MetaMask...",
@@ -5921,8 +5870,8 @@
     "claimable_bonus_tooltip": "The annualized bonus you’ve earned for holding mUSD. Your bonus is claimable daily on Linea.",
     "earn_a_percentage_bonus": "Obtenez un bonus de {{percentage}} %",
     "claimable_bonus": "Bonus réclamable",
-    "claim_bonus": "Réclamer le bonus",
-    "claim_bonus_subtitle": "Le bonus sera versé sur {{networkName}}.",
+    "claim_bonus": "Claim bonus",
+    "claim_bonus_subtitle": "Bonus will be paid out on {{networkName}}.",
     "empty_state_cta": {
       "heading": "Prêtez des {{tokenSymbol}} et gagnez",
       "body": "Prêtez vos {{tokenSymbol}} avec {{protocol}} et touchez un revenu",
@@ -5933,7 +5882,7 @@
     "service_interruption_banner": {
       "maintenance_message": "Maintenance en cours. Le service sera bientôt rétabli !"
     },
-    "supply": "Offre",
+    "supply": "Supply",
     "deposit": "Dépôt",
     "approve": "Approuver",
     "approval": "Approbation",
@@ -5982,7 +5931,7 @@
     "network": "Réseau",
     "health_factor": "Facteur de santé financière",
     "liquidation_risk": "Risque de liquidation",
-    "insufficient_pool_liquidity": "Pool de liquidités insuffisant",
+    "insufficient_pool_liquidity": "Insufficient pool liquidity",
     "available_to_withdraw": "disponible pour le retrait",
     "unknown": "inconnu",
     "how_it_works": "Comment ça marche ",
@@ -6001,7 +5950,7 @@
       "lending": "Historique des positions",
       "staking": "Historique des paiements"
     },
-    "allowance_reset": "Réinitialisation de la provision",
+    "allowance_reset": "Allowance reset",
     "tron": {
       "fee": "Frais"
     },
@@ -6009,20 +5958,8 @@
       "ok": "OK",
       "continue": "Continuer",
       "convert_and_get_percentage_bonus": "Convertissez et obtenez {{percentage}} %",
-      "your_musd": "Vos mUSD",
-      "balance_breakdown_title": "Vos soldes mUSD par réseau",
-      "balance_amount": "{{amount}} mUSD",
-      "balance_amount_with_symbol": "{{amount}} {{symbol}}",
-      "balance_fiat_unavailable": "—",
-      "convert_to_musd": "Convertir en mUSD",
       "get_a_percentage_musd_bonus": "Obtenir {{percentage}} % de bonus en mUSD",
       "convert": "Convertir",
-      "fetching_quote": "Récupération de la cotation...",
-      "you_convert": "Vous convertissez",
-      "network_fee": "Frais de réseau",
-      "earning": "Revenus",
-      "quick_convert_description": "Sélectionnez un jeton pour convertir la totalité de votre solde ou appuyez sur l’icône de modification pour saisir un montant personnalisé.",
-      "no_tokens_to_convert": "Vous ne disposez d’aucun jeton pouvant être converti en mUSD.",
       "toasts": {
         "converting": "Conversion de {{token}} → mUSD",
         "eta": "Environ {{time}}",
@@ -6062,7 +5999,7 @@
       "toasts": {
         "claiming": "Votre bonus mUSD est en cours de traitement",
         "delivered": "Votre bonus mUSD est arrivé !",
-        "failed": "Échec de la réclamation du bonus"
+        "failed": "Bonus claim failed"
       }
     },
     "rewards": {
@@ -6073,8 +6010,7 @@
       "tooltip_opted_in_footer": "Les points seront automatiquement ajoutés à votre compte.",
       "tooltip_not_opted_in_footer": "Inscrivez-vous au programme de fidélité pour recevoir vos points.",
       "tooltip_close": "Fermer"
-    },
-    "your_stablecoins": "Vos stablecoins"
+    }
   },
   "stake": {
     "stake": "Stake",
@@ -6096,7 +6032,9 @@
       "fee": "Frais",
       "errors": {
         "insufficient_balance": "Vous ne disposez pas d’un solde suffisant pour effectuer cette action."
-      }
+      },
+      "trx_unstaking_in_progress": "Déstaking de {{amount}} TRX en cours. Le déstaking prend 14 jours.",
+      "has_claimable_trx": "You can claim {{amount}} TRX. Once claimed you'll get TRX back in your wallet."
     },
     "stake_eth": "Staker des ETH",
     "unstake_eth": "Déstaker des ETH",
@@ -6574,7 +6512,7 @@
     "hardware_wallet_not_supported": "Les portefeuilles matériels ne sont pas encore pris en charge. Utilisez un portefeuille connecté pour continuer.",
     "hardware_wallet_not_supported_solana": "Les portefeuilles matériels ne sont pas encore pris en charge pour Solana. Utilisez un portefeuille connecté pour continuer.",
     "price_impact_info_title": "Impact sur les prix",
-    "price_impact_info_description": "L’impact sur le prix reflète la manière dont votre ordre de swap affecte le prix du marché de l’actif. Il dépend du volume de la transaction et de la liquidité disponible dans le pool. MetaMask n’influence ni ne contrôle l’impact sur le prix.",
+    "price_impact_info_description": "This is how your trade changes the market price of a token. It depends on the trade size, available liquidity, and provider fees. MetaMask doesn't control price impact.",
     "price_impact_info_gasless_description": "L’impact sur le prix reflète la manière dont votre ordre de swap affecte le prix de l’actif sur le marché. Si vous ne disposez pas de fonds suffisants pour payer les frais de gaz, une partie de votre jeton source est automatiquement allouée pour couvrir ces frais, ce qui augmente l’impact sur le prix. MetaMask n’influence ni ne contrôle l’impact sur le prix.",
     "price_impact_warning_description": "This trade has an estimated {{priceImpact}} price impact, which reflects how much your trade changes the market price. The quote already reflects this.",
     "price_impact_high": "High price impact",
@@ -6600,6 +6538,7 @@
     },
     "submit": "Soumettre",
     "default_slippage_description": "Votre transaction n’aboutira pas si la variation de prix dépasse le pourcentage de slippage.",
+    "cancel": "Annuler",
     "confirm": "Confirmer",
     "exceeding_upper_slippage_warning": "Slippage élevé, cela peut entraîner un swap défavorable",
     "exceeding_lower_slippage_warning": "Slippage faible, cela peut entraîner un swap défavorable",
@@ -7282,19 +7221,6 @@
       "retry": "Réessayez",
       "on_linea": "sur Linea"
     },
-    "cashback_screen": {
-      "title": "Cashback",
-      "available_cashback": "Cashback disponible",
-      "network_fee": "Frais de réseau",
-      "expected_to_receive": "Montant estimé à recevoir",
-      "withdraw": "Retirer",
-      "withdraw_unavailable": "Retrait non disponible",
-      "withdrawal_initiated": "Le retrait a été initié",
-      "withdrawal_success": "Retrait effectué avec succès",
-      "withdrawal_failed": "Le retrait a échoué. Veuillez réessayer.",
-      "no_cashback": "Aucun cashback disponible",
-      "loading_error": "Échec du chargement du cashback. Veuillez réessayer."
-    },
     "change_asset": {
       "title": "Modifier le jeton et le réseau",
       "full_spending_access": "Possibilité de dépenser sans restriction",
@@ -7469,10 +7395,7 @@
       "service_not_available": "Le service n’est pas disponible pour le moment. Veuillez réessayer dans quelques instants.",
       "invalid_referral_code": "Code de parrainage non valide. Veuillez vérifier et réessayer.",
       "already_referred": "Vous avez déjà été parrainé par un autre utilisateur.",
-      "cannot_use_own_referral_code": "Vous ne pouvez pas utiliser votre propre code de parrainage.",
-      "invalid_bonus_code": "Code bonus non valide",
-      "already_redeemed": "Vous avez déjà utilisé ce code bonus",
-      "reached_maximum": "Ce code bonus a été utilisé le nombre maximum de fois"
+      "cannot_use_own_referral_code": "Vous ne pouvez pas utiliser votre propre code de parrainage."
     },
     "claim_reward_error": {
       "title": "Impossible de réclamer la récompense"
@@ -7529,10 +7452,8 @@
         "predict": "Prédiction",
         "musd_deposit": "Dépôt en mUSD",
         "apply_referral_bonus": "Bonus code de parrainage",
-        "bonus_code": "Code bonus",
         "uncategorized_event": "Événement non classé"
       },
-      "code": "Code",
       "date": "Date",
       "account": "Compte",
       "bonus": "Bonus",
@@ -7651,10 +7572,6 @@
       "invalid_code": "Code de parrainage non valide",
       "apply_button": "Appliquer le code de parrainage"
     },
-    "bonus_code": {
-      "input_placeholder": "Saisir le code bonus",
-      "apply_success": "Code bonus appliqué !"
-    },
     "optout": {
       "title": "Supprimer la progression Rewards",
       "description": "Cette action retirera vos comptes du programme Rewards et effacera vos points ainsi que votre progression. Cette action est irréversible.",
@@ -7791,14 +7708,12 @@
     },
     "label": {
       "bridge_fee": "Frais de passerelle",
-      "provider_fee": "Commission du fournisseur",
       "network_fee": "Frais de réseau",
       "paid_with": "Payé avec",
-      "receive_token": "Recevoir le jeton",
       "retry_button": "Réessayez",
       "total": "Total",
       "account": "Compte",
-      "received_total": "Total reçu"
+      "received_total": "Received total"
     },
     "summary_title": {
       "bridge_approval": "Approuver {{approveSymbol}}",
@@ -7851,15 +7766,14 @@
     "still_connecting_network": "Connexion en cours à {{networkName}}…",
     "unable_to_connect_network": "Impossible de se connecter à {{networkName}}.",
     "update_rpc": "Mettre à jour le RPC",
-    "switch_to_metamask_default_rpc": "Passer au RPC par défaut de MetaMask",
+    "switch_to_metamask_default_rpc": "Switch to MetaMask default RPC",
     "check_network_connectivity": "Vérifiez votre connexion réseau.",
     "check_network_connectivity_or": "Vérifiez votre connexion réseau ou",
-    "updated_to_metamask_default": "Configuration par défaut de MetaMask appliquée"
+    "updated_to_metamask_default": "Updated to MetaMask default"
   },
   "trending": {
     "title": "Explorer",
     "trending_tokens": "Jetons tendance",
-    "stocks": "Actions",
     "price_change": "Variation du prix",
     "all_networks": "Tous les réseaux",
     "24h": "24 h",
@@ -8007,8 +7921,8 @@
       }
     },
     "error": {
-      "unable_to_load": "Impossible de charger {{section}}",
-      "retry": "Réessayer"
+      "unable_to_load": "Unable to load {{section}}",
+      "retry": "Retry"
     }
   }
-}
\ No newline at end of file
+}
diff --git a/locales/languages/hi-in.json b/locales/languages/hi-in.json
index cb54eff68e0e..4a420c7381d7 100644
--- a/locales/languages/hi-in.json
+++ b/locales/languages/hi-in.json
@@ -582,6 +582,7 @@
     "ok": "ठीक है",
     "cancel": "रद्द करें",
     "error": "त्रुटि",
+    "open_settings": "सेटिंग",
     "attempting_to_scan_with_wallet_locked": "ऐसा लगता है कि आप QR कोड स्कैन करने का प्रयास कर रहे हैं, इसका उपयोग करने में सक्षम होने के लिए आपको अपने वॉलेट को अनलॉक करना होगा।",
     "attempting_sync_from_wallet_error": "लगता है कि आप एक्सटेंशन के साथ सिंक करने का प्रयास कर रहे हैं। ऐसा करने के लिए, आपको अपने वर्तमान वॉलेट को मिटाना होगा। \n\nजब आप ऐप को मिटा देते हैं या उसके नए संस्करण को फिर से इंस्टॉल करते हैं, तो \"MetaMask एक्सटेंशन के साथ सिंक करें\" विकल्प का चयन करें। महत्वपूर्ण! अपना वॉलेट मिटाने से पहले, सुनिश्चित करें कि आपने अपने गुप्त रिकवरी फ्रेज़ का बैकअप ले लिया है।"
   },
diff --git a/locales/languages/hi.json b/locales/languages/hi.json
index 0811c680d26d..c41498bc0be7 100644
--- a/locales/languages/hi.json
+++ b/locales/languages/hi.json
@@ -104,8 +104,8 @@
       "title": "अपर्याप्त फंड"
     },
     "insufficient_pay_token_native_post_quote": {
-      "message": "Not enough {{ticker}} to cover fees. Add {{ticker}} to continue.",
-      "title": "Insufficient funds for post quote"
+      "message": "शुल्क कवर करने के लिए पर्याप्त {{ticker}} नहीं है। जारी रखने के लिए {{ticker}} जोड़ें।",
+      "title": "पोस्ट कोटेशन के लिए पर्याप्त फंड नहीं है"
     },
     "no_pay_token_quotes": {
       "message": "यह भुगतान रूट अभी उपलब्ध नहीं है। राशि, नेटवर्क या टोकन बदलने का प्रयास करें और हम सबसे अच्छा विकल्प ढूँढ लेंगे।",
@@ -1184,7 +1184,6 @@
       "title": "नया ऑर्डर",
       "leverage": "लीवरेज",
       "limit_price": "लिमिट प्राइस",
-      "market_price": "मार्केट प्राइस",
       "enter_price": "एंटर प्राइस",
       "trigger_price": "ट्रिगर प्राइस",
       "liquidation_price": "लिक्विडेशन प्राइस",
@@ -1328,7 +1327,6 @@
       "funds_are_available_to_trade": "फंड्स ट्रेड करने के लिए उपलब्ध हैं",
       "close_order_still_active": "क्लोज़ ऑर्डर अभी भी सक्रिय है",
       "order_submitted": "ऑर्डर सबमिट किया गया",
-      "submitting_your_trade": "आपका ट्रेड सबमिट कर रहे हैं",
       "order_filled": "ऑर्डर पूरा हो गया",
       "order_placed": "ऑर्डर लगाया गया",
       "order_placement_subtitle": "{{direction}} {{amount}} {{assetSymbol}}",
@@ -1346,26 +1344,14 @@
       "title": "ऑर्डर का विवरण",
       "cancel_order": "ऑर्डर कैंसिल करें",
       "date": "तिथि",
-      "trigger_condition": "ट्रिगर का शर्त",
-      "price": "प्राइस",
       "fee": "फीस",
       "limit_buy": "लिमिट लॉन्ग",
       "limit_price": "लिमिट प्राइस",
       "limit_sell": "लिमिट शॉर्ट",
       "market_buy": "मार्केट लॉन्ग",
       "market_sell": "मार्केट शॉर्ट",
-      "market": "मार्केट",
       "open": "ओपन",
       "size": "आकार",
-      "original_size": "मूल आकार",
-      "order_value": "ऑर्डर वैल्यू",
-      "reduce_only": "केवल घटाएं",
-      "yes": "हां",
-      "no": "नहीं",
-      "price_above": "{{price}} से ऊपर प्राइस",
-      "price_below": "{{price}} से नीचे प्राइस",
-      "take_profit": "टेक प्रॉफ़िट",
-      "stop_loss": "स्टॉप लॉस",
       "status": "स्टेटस",
       "view_explorer": "एक्सप्लोरर पर देखें"
     },
@@ -2197,6 +2183,7 @@
     "available_balance": "उपलब्ध बैलेंस",
     "claim_amount_text": "${{amount}} क्लेम करें",
     "claim_winnings_text": "जीत का ईनाम क्लेम करें",
+    "claiming_text": "Claiming...",
     "unrealized_pnl_label": "अनरियलाइज्ड P&L",
     "unrealized_pnl_value": "{{amount}} ({{percent}})",
     "unrealized_pnl_error": "लोड करने में असमर्थ",
@@ -2275,6 +2262,9 @@
           "title": "कुछ गलत हो गया",
           "description": "क्लेम नहीं हो पाया",
           "try_again": "फिर से प्रयास करें"
+        },
+        "in_progress": {
+          "title": "Claim already in progress"
         }
       }
     },
@@ -2308,7 +2298,6 @@
       "withdrawing_subtitle": "लगभग 1 मिनट में उपलब्ध होगा",
       "withdraw_completed": "विदड्रॉवल पूरा हुआ",
       "withdraw_completed_subtitle": "{{amount}} USDC आपके वॉलेट में भेज दिया गया",
-      "withdraw_any_token_completed_subtitle": "{{amount}} {{token}} आपके वॉलेट में भेजा गया",
       "error_title": "कुछ गलत हो गया",
       "error_description": "निकालना जारी नहीं हो पाया",
       "try_again": "फिर से प्रयास करें"
@@ -2440,7 +2429,7 @@
     "add_tokens": "टोकन इम्पोर्ट करें",
     "are_you_sure_exit": "Are you sure you want to exit?",
     "import_token": "Would you like to import this token?",
-    "import_tokens": "क्या आप इन टोकन को इंपोर्ट करना चाहते हैं?",
+    "import_tokens": "Would you like to import these tokens?",
     "tokens_detected_in_account": "इस खाते में {{tokenCount}} नया {{tokensLabel}} मिला",
     "token_toast": {
       "tokens_imported_title": "इंपोर्ट किए गए टोकन",
@@ -2705,7 +2694,7 @@
     "decimals_cant_be_empty": "टोकन का दशमलव खाली नहीं रह सकता।",
     "decimals_is_required": "Decimal is required. Find it on:",
     "no_tokens_found": "हम उस नाम के साथ कोई टोकन नहीं ढ़ूंढ़ सके।",
-    "tokens_empty_description": "किसी भी टोकन को ढूंढें और इंपोर्ट करें",
+    "tokens_empty_description": "Search for any token and import it",
     "select_token": "टोकन चुनें",
     "address_must_be_smart_contract": "व्यक्तिगत पता का पहचान हुई। टोकन अनुबंध पता दर्ज करें।",
     "billion_abbreviation": "B",
@@ -2915,10 +2904,6 @@
     "enabling_notifications": "नोटिफिकेशंस चालू किया जा रहा है...",
     "updating_notifications": "नोटिफिकेशंस अपडेट किया जा रहा है...",
     "updating_account_settings": "अकाउंट सेटिंग्स अपडेट किया जा रहा है...",
-    "reset_notifications_title": "नोटीफिकेशंस रीसेट करें",
-    "reset_notifications_description": "नोटीफिकेशंस को रीसेट करने का मतलब है कि आप अपनी नोटीफिकेशंस स्टोरेज कीज़ डिलीट कर रहे हैं और अपने सभी नोटीफिकेशंस इतिहास को रीसेट कर रहे हैं। क्या आप वास्तव में इसे करना चाहते हैं?",
-    "reset_notifications": "नोटीफिकेशंस रीसेट करें",
-    "reset_notifications_success": "नोटीफिकेशंस स्टोरेज की डिलीट की गई/फिर से बनाई गई और नोटीफिकेशंस इतिहास रीसेट किया गया।",
     "notifications_dismiss_modal": "खारिज करें",
     "select_rpc_url": "RPC URL को चुनें",
     "title": "सेटिंग",
@@ -3040,9 +3025,9 @@
     "add_rpc_url": "RPC URL जोड़ें",
     "add_block_explorer_url": "ब्लॉक एक्सप्लोरर URL जोड़ें",
     "networks_desc": "कस्टम RPC नेटवर्क को जोड़ें और संपादित करें",
-    "networks_enabled": "चालू किए गए नेटवर्क्स",
-    "networks_test_networks": "टेस्ट नेटवर्क्स",
-    "networks_additional": "अतिरिक्त नेटवर्क्स",
+    "networks_enabled": "Enabled Networks",
+    "networks_test_networks": "Test Networks",
+    "networks_additional": "Additional Networks",
     "networks_search_placeholder": "नेटवर्क ढूंढें",
     "networks_no_results": "कोई नेटवर्क नहीं मिला",
     "network_name_label": "नेटवर्क का नाम",
@@ -3062,15 +3047,15 @@
     "network_rpc_networks": "RPC नेटवर्क",
     "network_add_network": "नेटवर्क जोड़ें",
     "add_chain_title": "एक नेटवर्क जोड़ें",
-    "add_chain_search_placeholder": "नाम, चैन ID, या करेंसी से ढूंढें",
-    "add_chain_loading": "नेटवर्क लोड हो रहे हैं…",
-    "add_chain_error": "नेटवर्क लोड करना नहीं हो पाया। कृपया फिर से प्रयास करें।",
+    "add_chain_search_placeholder": "Search by name, chain ID, or currency",
+    "add_chain_loading": "Loading networks…",
+    "add_chain_error": "Failed to load networks. Please try again.",
     "add_chain_retry": "फिर से प्रयास करें",
-    "add_chain_added": "जोड़ा गया",
+    "add_chain_added": "Added",
     "add_chain_or": "या",
     "add_chain_custom_link": "एक कस्टम नेटवर्क जोड़ें",
     "network_add_custom_network": "एक कस्टम नेटवर्क जोड़ें",
-    "network_add_test_network": "एक टेस्ट नेटवर्क जोड़ें",
+    "network_add_test_network": "Add a test network",
     "network_add": "जोड़ें",
     "network_save": "सहेजें",
     "remove_network_title": "क्या आप इस नेटवर्क को हटाना चाहते हैं?",
@@ -3394,9 +3379,11 @@
     ],
     "private_key_explanation": "इसे कहीं सुरक्षित और गुप्त जगह पर सहेजें।",
     "private_key_warning": "वर्तमान चयनित अकाउंट के लिए यह गोपनीय की है: {{accountName}}। इस की को कभी उजागर ना करें आपकी गोपनीय की के साथ कोई भी आपके अकाउंट पर पूरा नियंत्रण रख सकता है, जिसमें आपके फंड का स्थानांतरण भी शामिल है।। ",
-    "seed_phrase_warning_explanation": "सुनिश्चित करें कि कोई आपकी स्क्रीन को न देख रहा हो। MetaMask सपोर्ट कभी भी इसके लिए नहीं कहेगा।",
+    "seed_phrase_warning_explanation": [
+      "यह सुनिश्चित करें कि कोई भी आपकी स्क्रीन ना देख रहा हो।",
+      "MetaMask सपोर्ट कभी इसका अनुरोध नहीं करेगा।"
+    ],
     "private_key_warning_explanation": "इस की को कभी उजागर ना करें। आपकी निजी की के साथ कोई भी आपके अकाउंट पर पूरा नियंत्रण रख सकता है, जिसमें आपके किसी फंड का स्थानांतरण शामिल है।",
-    "reveal_srp_description": "आपका सीक्रेट रिकवरी फ्रेज़ आपके वॉलेट का पूरा एक्सेस देता है। इसे किसी के साथ साझा न करें।",
     "reveal_credential_modal": [
       "आपके {{credentialName}} ",
       "आपके खाते तथा धनराशि तक पूर्ण पहुंच प्रदान करते हैं।\n\nइसे किसी के साथ साझा न करें।",
@@ -3428,8 +3415,7 @@
     "srp_text": "सीक्रेट रिकवरी फ्रेज़ है",
     "private_key_text": "प्राइवेट की (key)",
     "got_it": "समझ गए",
-    "learn_more": "ज़्यादा जानें",
-    "copied_to_clipboard": "क्लिपबोर्ड पर कॉपी किया गया"
+    "learn_more": "ज़्यादा जानें"
   },
   "screenshot_deterrent": {
     "title": "सुरक्षा चेतावनी",
@@ -3810,7 +3796,7 @@
     "transaction_fee_explanation": "लेन-देन का शुल्क इस अनुमति से संबंधित है।",
     "view_details": "विवरण देखें",
     "view_transaction_details": "लेन-देन विवरण देखें",
-    "view_data": "डेटा देखें",
+    "view_data": "View data",
     "transaction_details": "ट्रांसेक्शन संबंधी विवरण",
     "site_url": "साइट URL",
     "permission_request": "अनुमति के लिए अनुरोध",
@@ -3891,7 +3877,7 @@
     "right_button": "वॉलेट को सुरक्षित रखें"
   },
   "add_favorite": {
-    "title": "पसंदीदा जोड़ें",
+    "title": "Add favorite",
     "title_label": "नाम",
     "url_label": "URL",
     "add_button": "जोड़ें",
@@ -4245,8 +4231,8 @@
   "biometrics": {
     "enable_touchid": "टच ID के साथ अनलॉक करें?",
     "enable_faceid": "फेस ID के साथ अनलॉक करें?",
-    "enable_fingerprint": "फिंगरप्रिंट के साथ अनलॉक करें?",
-    "enable_biometrics": "बायोमेट्रिक्स के साथ अनलॉक करें?",
+    "enable_fingerprint": "Unlock with fingerprint?",
+    "enable_biometrics": "Unlock with biometrics?",
     "enable_device_passcode_ios": "डिवाइस के पासकोड के साथ अनलॉक करें?",
     "enable_device_passcode_android": "डिवाइस के PIN के साथ अनलॉक करें?"
   },
@@ -4772,7 +4758,7 @@
     "public_address": "पब्लिक एड्रेस",
     "public_address_qr_code": "पब्लिक एड्रेस",
     "coming_soon": "जल्द आ रहा है...",
-    "request_payment": "भुगतान का अनुरोध करें",
+    "request_payment": "Request payment",
     "copy": "कॉपी करें",
     "scan_address": "भुगतान प्राप्त करने के लिए पता को स्कैन करें",
     "copy_address": "एड्रेस कॉपी करें"
@@ -4786,8 +4772,8 @@
     "switch_network": "कृपया Mainnet या sepolia पर बदलें",
     "card_title": "हमेशा MetaMask कार्ड बटन दिखाएं",
     "card_desc": "MetaMask कार्ड केवल कुछ चुने हुए देशों के निवासियों के लिए उपलब्ध है।",
-    "daimo_demo_title": "DaimoPay का डेमो वातावरण उपयोग करें",
-    "daimo_demo_desc": "कार्ड भुगतान के लिए DaimoPay के डेमो और प्रोडक्शन वातावरण के बीच बदलें।"
+    "daimo_demo_title": "Use DaimoPay demo environment",
+    "daimo_demo_desc": "Toggle between DaimoPay demo and production environments for card payments."
   },
   "walletconnect_sessions": {
     "no_active_sessions": "आपके पास सक्रिय सत्र नहीं हैं",
@@ -4800,10 +4786,10 @@
     "close_current_session": "नया सत्र शुरू करने से पहले वर्तमान सत्र को बंद कर दें।"
   },
   "paymentRequest": {
-    "title": "भुगतान अनुरोध",
-    "title_complete": "भुगतान पूरा हुआ",
+    "title": "Payment request",
+    "title_complete": "Payment complete",
     "confirm": "भुगतान करें",
-    "cancel": "अस्वीकार करें",
+    "cancel": "Decline",
     "is_requesting_you_to_pay": "आपसे भुगतान करने का अनुरोध कर रहा है",
     "total": "कुल:"
   },
@@ -4838,7 +4824,6 @@
     "no_payment_methods_available": "पेमेंट का कोई तरीका उपलब्ध नहीं है।",
     "error_fetching_quotes": "कुछ गलत हो गया। कृपया फिर से कोशिश करें।",
     "no_quotes_available": "कोई प्रोवाइडर उपलब्ध नहीं है।",
-    "quote_unavailable": "कोटेशन उपलब्ध नहीं है।",
     "providers": "प्रोवाइडर्स",
     "quotes_displayed_for": "{{paymentMethodName}} के लिए कोटेशन दिखाए गए हैं।",
     "other_options": "Other options",
@@ -4944,10 +4929,10 @@
       "logged_out_error": "लॉग आउट करते समय गड़बड़ी"
     },
     "token_unavailable_modal": {
-      "title": "उपलब्ध नहीं है",
-      "description": "{{token}} आपके क्षेत्र में {{provider}} के साथ उपलब्ध नहीं है।",
-      "change_token": "टोकन बदलें",
-      "change_provider": "प्रदाता बदलें"
+      "title": "Not available",
+      "description": "{{token}} is not available with {{provider}} in your region.",
+      "change_token": "Change token",
+      "change_provider": "Change provider"
     },
     "provider_picker_modal": {
       "title": "एक प्रदाता चुनें"
@@ -5185,39 +5170,6 @@
     },
     "deposit_order_title": "{{currency}} डिपॉज़िट करें"
   },
-  "ramps_order_details": {
-    "title": "ऑर्डर का विवरण",
-    "status": "स्टेटस",
-    "processing": "प्रोसेस हो रहा है",
-    "complete": "पूरा",
-    "failed": "नहीं हो पाया",
-    "cancelled": "कैंसिल किया गया",
-    "view_on_provider": "{{provider}} पर देखें",
-    "order_id": "ऑर्डर ID",
-    "date_and_time": "दिनांक और समय",
-    "fees": "फीस",
-    "total": "कुल",
-    "card_processing_info": "कार्ड से की गई खरीदारी में आमतौर पर कुछ मिनट लगते हैं",
-    "processing_info_modal_description": "कार्ड से खरीदारी में आमतौर पर कुछ मिनट लगते हैं। यदि आपके पास सवाल हैं तो आप सपोर्ट से कॉन्टेक्ट कर सकते हैं।",
-    "go_to_provider_support": "{{provider}} सपोर्ट पेज पर जाएँ",
-    "error_title": "कुछ गलत हो गया",
-    "error_message": "ऑर्डर विवरण लोड नहीं हो पाया। कृपया फिर से प्रयास करें।",
-    "try_again": "फिर से प्रयास करें",
-    "close": "बंद करें"
-  },
-  "ramps_v2": {
-    "notifications": {
-      "purchase_pending_title": "{{cryptocurrency}} की आपकी खरीद प्रोसेस की जा रही है",
-      "purchase_pending_description": "इसमें केवल कुछ मिनटों का समय लगना चाहिए...",
-      "purchase_completed_title": "{{amount}} {{cryptocurrency}} की आपकी खरीद सफल रही!",
-      "purchase_completed_description": "आपकी {{cryptocurrency}} अब उपलब्ध है",
-      "purchase_failed_title": "{{cryptocurrency}} की खरीद नहीं हो पायी",
-      "purchase_failed_description": "कृपया कुछ समय बाद फिर से प्रयास करें",
-      "purchase_cancelled_title": "आपकी खरीद कैंसिल कर दी गई थी",
-      "purchase_cancelled_description": "आपकी {{cryptocurrency}} की खरीद कैंसिल कर दी गई है",
-      "track": "ट्रैक करें"
-    }
-  },
   "swaps": {
     "title": "स्वैप करें",
     "onboarding": {
@@ -5734,15 +5686,12 @@
     "new_wallet_needed_description_part_three": "इसे फिर से होने से रोकने के लिए, सुनिश्चित करें कि आपका MetaMask ऐप और OS हमेशा नवीनतम संस्करण में अपडेट रहें।"
   },
   "srp_security_quiz": {
-    "question_step": "{{total}} में से सवाल {{step}}",
     "title": "सुरक्षा प्रश्नोत्तरी",
     "introduction": "अपना सीक्रेट रिकवरी फ्रेज़ देखने के लिए, आपको दो प्रश्नों का सही उत्तर देना होगा",
     "get_started": "शुरू करें",
     "learn_more": "ज़्यादा जानें",
     "try_again": "फिर से कोशिश करें",
     "continue": "जारी रखें",
-    "correct": "सही!",
-    "incorrect": "गलत!",
     "of": "का",
     "question_one": {
       "question": "यदि आप अपना सीक्रेट रिकवरी फ्रेज़ खो देते हैं, तो MetaMask...",
@@ -5921,8 +5870,8 @@
     "claimable_bonus_tooltip": "The annualized bonus you’ve earned for holding mUSD. Your bonus is claimable daily on Linea.",
     "earn_a_percentage_bonus": "{{percentage}}% बोनस कमाएं",
     "claimable_bonus": "क्लेम करने योग्य बोनस",
-    "claim_bonus": "बोनस क्लेम करें",
-    "claim_bonus_subtitle": "बोनस {{networkName}} पर दिया जाएगा।",
+    "claim_bonus": "Claim bonus",
+    "claim_bonus_subtitle": "Bonus will be paid out on {{networkName}}.",
     "empty_state_cta": {
       "heading": "{{tokenSymbol}} उधार दें और कमाएं",
       "body": "{{protocol}} के साथ अपना {{tokenSymbol}} उधार दें और सालाना",
@@ -5933,7 +5882,7 @@
     "service_interruption_banner": {
       "maintenance_message": "हम रखरखाव की वजह से उपलब्ध नहीं हैं। हम जल्द ही ऑनलाइन वापस आएँगे!"
     },
-    "supply": "सप्लाई करें",
+    "supply": "Supply",
     "deposit": "डिपॉज़िट करें",
     "approve": "एप्रूव करें",
     "approval": "एप्रूवल",
@@ -5982,7 +5931,7 @@
     "network": "नेटवर्क",
     "health_factor": "स्वास्थ्य कारक",
     "liquidation_risk": "लिक्विडेशन जोखिम",
-    "insufficient_pool_liquidity": "पूल की लिक्विडिटी अपर्याप्त है",
+    "insufficient_pool_liquidity": "Insufficient pool liquidity",
     "available_to_withdraw": "निकालने के लिए उपलब्ध है",
     "unknown": "अज्ञात",
     "how_it_works": "ये कैसे काम करता है",
@@ -6001,7 +5950,7 @@
       "lending": "पोजीशन का इतिहास",
       "staking": "भुगतान इतिहास"
     },
-    "allowance_reset": "भत्ता रीसेट करें",
+    "allowance_reset": "Allowance reset",
     "tron": {
       "fee": "फीस"
     },
@@ -6009,20 +5958,8 @@
       "ok": "ठीक है",
       "continue": "जारी रखें",
       "convert_and_get_percentage_bonus": "कन्वर्ट करें और {{percentage}}% पाएं",
-      "your_musd": "आपका mUSD",
-      "balance_breakdown_title": "आपका mUSD बैलेंस नेटवर्क के अनुसार",
-      "balance_amount": "{{amount}} mUSD",
-      "balance_amount_with_symbol": "{{amount}} {{symbol}}",
-      "balance_fiat_unavailable": "—",
-      "convert_to_musd": "mUSD में कन्वर्ट करें",
       "get_a_percentage_musd_bonus": "{{percentage}}% mUSD बोनस पाएं",
       "convert": "कन्वर्ट करें",
-      "fetching_quote": "कोटेशन लाया जा रहा है...",
-      "you_convert": "आप बदलते हैं",
-      "network_fee": "नेटवर्क फीस",
-      "earning": "कमाना",
-      "quick_convert_description": "अपने पूरे बैलेंस को बदलने के लिए एक टोकन चुनें या कस्टम राशि डालने के लिए एडिट आइकन पर टैप करें।",
-      "no_tokens_to_convert": "आपके पास कोई भी टोकन नहीं है जिसे mUSD में बदला जा सके।",
       "toasts": {
         "converting": "{{token}} → mUSD में कन्वर्ट किया जा रहा है",
         "eta": "~{{time}}",
@@ -6062,7 +5999,7 @@
       "toasts": {
         "claiming": "आपका mUSD बोनस प्रोसेस हो रहा है",
         "delivered": "आपका mUSD बोनस यहाँ है!",
-        "failed": "बोनस क्लेम नहीं हो पाया"
+        "failed": "Bonus claim failed"
       }
     },
     "rewards": {
@@ -6073,8 +6010,7 @@
       "tooltip_opted_in_footer": "पॉइंट्स अपने आप आपके अकाउंट में जुड़ जाएंगे।",
       "tooltip_not_opted_in_footer": "अपने पॉइंट्स प्राप्त करने के लिए रिवॉर्ड्स के लिए ऑप्ट-इन करें।",
       "tooltip_close": "बंद करें"
-    },
-    "your_stablecoins": "आपके स्टेबलकॉइन"
+    }
   },
   "stake": {
     "stake": "Stake",
@@ -6096,7 +6032,9 @@
       "fee": "फीस",
       "errors": {
         "insufficient_balance": "आपके पास यह काम करने के लिए पर्याप्त रिसोर्स बैलेंस नहीं है।"
-      }
+      },
+      "trx_unstaking_in_progress": "{{amount}} TRX का अनस्टेकिंग जारी है। अनस्टेकिंग में 14 दिन लगते हैं।",
+      "has_claimable_trx": "You can claim {{amount}} TRX. Once claimed you'll get TRX back in your wallet."
     },
     "stake_eth": "ETH स्टेक करें",
     "unstake_eth": "ETH अनस्टेक करें",
@@ -6574,7 +6512,7 @@
     "hardware_wallet_not_supported": "हार्डवेयर वॉलेट अभी तक सपोर्टेड नहीं हैं। जारी रखने के लिए हॉट वॉलेट का उपयोग करें।",
     "hardware_wallet_not_supported_solana": "Solana के लिए हार्डवेयर वॉलेट अभी तक सपोर्टेड नहीं हैं। जारी रखने के लिए हॉट वॉलेट का उपयोग करें।",
     "price_impact_info_title": "कीमत का प्रभाव",
-    "price_impact_info_description": "प्राइस इम्पैक्ट यह दर्शाता है कि आपका स्वैप ऑर्डर एसेट की मार्केट प्राइस को कैसे प्रभावित करता है। यह ट्रेड के आकार और पूल में उपलब्ध लिक्विडिटी पर निर्भर करता है। MetaMask प्राइस इम्पैक्ट को प्रभावित या नियंत्रित नहीं करता।  ",
+    "price_impact_info_description": "This is how your trade changes the market price of a token. It depends on the trade size, available liquidity, and provider fees. MetaMask doesn't control price impact.",
     "price_impact_info_gasless_description": "प्राइस इम्पैक्ट यह दर्शाता है कि आपका स्वैप ऑर्डर एसेट की मार्केट प्राइस को कैसे प्रभावित करता है। अगर आपके पास गैस के लिए पर्याप्त फंड नहीं हैं, तो आपके स्रोत टोकन का एक हिस्सा ऑटोमैटिकली फीस को कवर करने के लिए इस्तेमाल किया जाएगा, जिससे प्राइस इम्पैक्ट बढ़ जाता है। MetaMask प्राइस इम्पैक्ट को प्रभावित या नियंत्रित नहीं करता।",
     "price_impact_warning_description": "This trade has an estimated {{priceImpact}} price impact, which reflects how much your trade changes the market price. The quote already reflects this.",
     "price_impact_high": "High price impact",
@@ -6600,6 +6538,7 @@
     },
     "submit": "सबमिट करें",
     "default_slippage_description": "अगर प्राइस स्लिपेज परसेंट से ज़्यादा बदल जाता है, तो आपका ट्रांसेक्शन पूरा नहीं होगा।",
+    "cancel": "कैंसिल करें",
     "confirm": "कन्फर्म करें",
     "exceeding_upper_slippage_warning": "ज़्यादा स्लिपेज (slippage), इससे स्वैप बिगड़ सकता है",
     "exceeding_lower_slippage_warning": "कम स्लिपेज (slippage), इससे स्वैप बिगड़ सकता है",
@@ -7282,19 +7221,6 @@
       "retry": "फिर से प्रयास करें",
       "on_linea": "Linea पर"
     },
-    "cashback_screen": {
-      "title": "कैशबैक",
-      "available_cashback": "उपलब्ध कैशबैक",
-      "network_fee": "नेटवर्क फीस",
-      "expected_to_receive": "प्राप्त होने की उम्मीद",
-      "withdraw": "निकालें",
-      "withdraw_unavailable": "विदड्रॉवल उपलब्ध नहीं है",
-      "withdrawal_initiated": "विदड्रॉवल शुरू कर दिया गया है",
-      "withdrawal_success": "विदड्रॉवल सफलतापूर्वक पूरा हुआ",
-      "withdrawal_failed": "विदड्रॉवल नहीं हो पाया। कृपया फिर से प्रयास करें।",
-      "no_cashback": "कोई कैशबैक उपलब्ध नहीं है",
-      "loading_error": "कैशबैक लोड करना नहीं हो पाया। कृपया फिर से प्रयास करें।"
-    },
     "change_asset": {
       "title": "टोकन और नेटवर्क बदलें",
       "full_spending_access": "पूर्ण खर्च की एक्सेस",
@@ -7469,10 +7395,7 @@
       "service_not_available": "सेवा इस समय उपलब्ध नहीं है। कृपया थोड़ी देर में फिर से प्रयास करें।",
       "invalid_referral_code": "रेफरल कोड ग़लत है। कृपया जांचें और फिर से प्रयास करें।",
       "already_referred": "आप पहले ही किसी अन्य उपयोगकर्ता द्वारा रेफर किए जा चुके हैं।",
-      "cannot_use_own_referral_code": "आप अपना स्वयं का रेफरल कोड उपयोग नहीं कर सकते।",
-      "invalid_bonus_code": "बोनस कोड ग़लत है",
-      "already_redeemed": "आपने यह बोनस कोड पहले ही रिडीम कर लिया है",
-      "reached_maximum": "इस बोनस कोड का अधिकतम उपयोग संख्या पूरी हो गई है"
+      "cannot_use_own_referral_code": "आप अपना स्वयं का रेफरल कोड उपयोग नहीं कर सकते।"
     },
     "claim_reward_error": {
       "title": "रिवॉर्ड क्लेम नहीं हो पाया"
@@ -7529,10 +7452,8 @@
         "predict": "प्रेडिक्शन",
         "musd_deposit": "mUSD डिपॉज़िट",
         "apply_referral_bonus": "रेफरल कोड बोनस",
-        "bonus_code": "बोनस कोड",
         "uncategorized_event": "अवर्गीकृत इवेंट"
       },
-      "code": "कोड",
       "date": "तिथि",
       "account": "अकाउंट",
       "bonus": "बोनस",
@@ -7651,10 +7572,6 @@
       "invalid_code": "रेफरल कोड ग़लत है",
       "apply_button": "रेफरल कोड लागू करें"
     },
-    "bonus_code": {
-      "input_placeholder": "बोनस कोड दर्ज करें",
-      "apply_success": "बोनस कोड लागू किया गया!"
-    },
     "optout": {
       "title": "रिवॉर्ड्स प्रगति हटाएँ",
       "description": "यह क्रिया आपके खाते को रिवॉर्ड्स प्रोग्राम से हटा देगी और आपके पॉइंट्स व प्रगति को मिटा देगी। यह कार्रवाई वापस नहीं की जा सकती।",
@@ -7791,14 +7708,12 @@
     },
     "label": {
       "bridge_fee": "ब्रिज फीस",
-      "provider_fee": "प्रदाता फीस",
       "network_fee": "नेटवर्क फीस",
       "paid_with": "के साथ भुगतान किया गया",
-      "receive_token": "टोकन प्राप्त करें",
       "retry_button": "फिर से प्रयास करें",
       "total": "कुल",
       "account": "अकाउंट",
-      "received_total": "कुल प्राप्त हुआ"
+      "received_total": "Received total"
     },
     "summary_title": {
       "bridge_approval": "{{approveSymbol}} एप्रूव करें",
@@ -7851,15 +7766,14 @@
     "still_connecting_network": "अब भी {{networkName}} से कनेक्ट किया जा रहा है...",
     "unable_to_connect_network": "{{networkName}} से कनेक्ट करने में असमर्थ।",
     "update_rpc": "RPC अपडेट करें",
-    "switch_to_metamask_default_rpc": "MetaMask डिफ़ॉल्ट RPC पर स्विच करें",
+    "switch_to_metamask_default_rpc": "Switch to MetaMask default RPC",
     "check_network_connectivity": "अपनी नेटवर्क कनेक्टिविटी जाँचें।",
     "check_network_connectivity_or": "अपनी नेटवर्क कनेक्टिविटी जाँचें या",
-    "updated_to_metamask_default": "MetaMask डिफ़ॉल्ट में अपडेट किया गया"
+    "updated_to_metamask_default": "Updated to MetaMask default"
   },
   "trending": {
     "title": "एक्सप्लोर करें",
     "trending_tokens": "ट्रेंडिंग टोकन",
-    "stocks": "स्टॉक्स",
     "price_change": "प्राइस में बदलाव",
     "all_networks": "सभी नेटवर्क",
     "24h": "24 घंटे",
@@ -8007,8 +7921,8 @@
       }
     },
     "error": {
-      "unable_to_load": "{{section}} लोड करने में असमर्थ",
-      "retry": "फिर से प्रयास करें"
+      "unable_to_load": "Unable to load {{section}}",
+      "retry": "Retry"
     }
   }
-}
\ No newline at end of file
+}
diff --git a/locales/languages/id-id.json b/locales/languages/id-id.json
index 244b8266fd9c..cc0190af6a93 100644
--- a/locales/languages/id-id.json
+++ b/locales/languages/id-id.json
@@ -582,6 +582,7 @@
     "ok": "Oke",
     "cancel": "Batal",
     "error": "Kesalahan",
+    "open_settings": "Pengaturan",
     "attempting_to_scan_with_wallet_locked": "Sepertinya Anda mencoba memindai kode QR, Anda perlu membuka dompet agar dapat menggunakannya.",
     "attempting_sync_from_wallet_error": "Sepertinya Anda mencoba menyinkronkan dengan ekstensi. Untuk melakukannya, Anda akan perlu menghapus dompet Anda saat ini. \n\nSetelah Anda menghapus atau menginstal ulang versi baru aplikasi, pilih opsi untuk \"Menyinkronkan dengan Ekstensi MetaMask\". Penting! Sebelum menghapus dompet, pastikan Anda telah mencadangkan Frasa Pemulihan Rahasia."
   },
diff --git a/locales/languages/id.json b/locales/languages/id.json
index 55f4ae033450..f79675eb7823 100644
--- a/locales/languages/id.json
+++ b/locales/languages/id.json
@@ -104,8 +104,8 @@
       "title": "Dana tidak cukup"
     },
     "insufficient_pay_token_native_post_quote": {
-      "message": "Not enough {{ticker}} to cover fees. Add {{ticker}} to continue.",
-      "title": "Insufficient funds for post quote"
+      "message": "{{ticker}} tidak cukup untuk menutupi biaya. Tambahkan {{ticker}} untuk melanjutkan.",
+      "title": "Dana tidak cukup untuk memposting kuotasi"
     },
     "no_pay_token_quotes": {
       "message": "Rute pembayaran ini tidak tersedia untuk saat ini. Coba ubah jumlah, jaringan, atau token, dan kami akan mencari opsi terbaik.",
@@ -1184,7 +1184,6 @@
       "title": "Order baru",
       "leverage": "Leverage",
       "limit_price": "Harga limit",
-      "market_price": "Harga pasar",
       "enter_price": "Harga masuk",
       "trigger_price": "Harga pemicu",
       "liquidation_price": "Harga likuidasi",
@@ -1328,7 +1327,6 @@
       "funds_are_available_to_trade": "Dana tersedia untuk diperdagangkan",
       "close_order_still_active": "Tutup order masih aktif",
       "order_submitted": "Order dikirim",
-      "submitting_your_trade": "Mengirimkan perdagangan Anda",
       "order_filled": "Order terpenuhi",
       "order_placed": "Order dibuat",
       "order_placement_subtitle": "{{direction}} {{amount}} {{assetSymbol}}",
@@ -1344,28 +1342,16 @@
     },
     "order_details": {
       "title": "Detail Order",
-      "cancel_order": "Batalkan order",
+      "cancel_order": "Batalkan Order",
       "date": "Tanggal",
-      "trigger_condition": "Kondisi pemicu",
-      "price": "Harga",
       "fee": "Biaya",
       "limit_buy": "Batas Long",
       "limit_price": "Harga Limit",
       "limit_sell": "Batas Short",
       "market_buy": "Pasar Long",
       "market_sell": "Pasar Short",
-      "market": "Pasar",
       "open": "Buka",
       "size": "Ukuran",
-      "original_size": "Ukuran asli",
-      "order_value": "Nilai order",
-      "reduce_only": "Kurangi saja",
-      "yes": "Ya",
-      "no": "Tidak",
-      "price_above": "Harga di atas {{price}}",
-      "price_below": "Harga di bawah {{price}}",
-      "take_profit": "Take profit",
-      "stop_loss": "Stop loss",
       "status": "Status",
       "view_explorer": "Lihat di Explorer"
     },
@@ -2197,6 +2183,7 @@
     "available_balance": "Saldo tersedia",
     "claim_amount_text": "Klaim ${{amount}}",
     "claim_winnings_text": "Klaim kemenangan",
+    "claiming_text": "Claiming...",
     "unrealized_pnl_label": "P&L Belum Terealisasi",
     "unrealized_pnl_value": "{{amount}} ({{percent}})",
     "unrealized_pnl_error": "Tidak dapat memuat",
@@ -2275,6 +2262,9 @@
           "title": "Terjadi kesalahan",
           "description": "Gagal memproses klaim",
           "try_again": "Coba lagi"
+        },
+        "in_progress": {
+          "title": "Claim already in progress"
         }
       }
     },
@@ -2308,7 +2298,6 @@
       "withdrawing_subtitle": "Tersedia dalam waktu sekitar 1 menit",
       "withdraw_completed": "Penarikan selesai",
       "withdraw_completed_subtitle": "{{amount}} USDC dipindahkan ke dompet Anda",
-      "withdraw_any_token_completed_subtitle": "{{amount}} {{token}} dipindahkan ke dompet Anda",
       "error_title": "Terjadi kesalahan",
       "error_description": "Gagal melanjutkan penarikan",
       "try_again": "Coba lagi"
@@ -2440,7 +2429,7 @@
     "add_tokens": "Impor token",
     "are_you_sure_exit": "Are you sure you want to exit?",
     "import_token": "Would you like to import this token?",
-    "import_tokens": "Ingin mengimpor token-token ini?",
+    "import_tokens": "Would you like to import these tokens?",
     "tokens_detected_in_account": "{{tokenCount}} {{tokensLabel}} baru ditemukan di akun ini",
     "token_toast": {
       "tokens_imported_title": "Token yang diimpor",
@@ -2705,7 +2694,7 @@
     "decimals_cant_be_empty": "Desimal token wajib diisi.",
     "decimals_is_required": "Decimal is required. Find it on:",
     "no_tokens_found": "Kami tidak dapat menemukan token dengan nama tersebut.",
-    "tokens_empty_description": "Cari token apa pun dan impor token tersebut",
+    "tokens_empty_description": "Search for any token and import it",
     "select_token": "Pilih token",
     "address_must_be_smart_contract": "Alamat pribadi terdeteksi. Masukkan alamat kontrak token.",
     "billion_abbreviation": "M",
@@ -2915,10 +2904,6 @@
     "enabling_notifications": "Mengaktifkan notifikasi...",
     "updating_notifications": "Memperbarui notifikasi...",
     "updating_account_settings": "Memperbarui pengaturan akun...",
-    "reset_notifications_title": "Reset notifikasi",
-    "reset_notifications_description": "Mereset notifikasi berarti Anda menghapus kunci penyimpanan notifikasi dan mereset semua riwayat notifikasi. Yakin ingin melakukan ini?",
-    "reset_notifications": "Reset notifikasi",
-    "reset_notifications_success": "Kunci penyimpanan notifikasi dihapus/dibuat ulang dan riwayat notifikasi direset.",
     "notifications_dismiss_modal": "Lewatkan",
     "select_rpc_url": "Pilih URL RPC",
     "title": "Pengaturan",
@@ -3040,9 +3025,9 @@
     "add_rpc_url": "Tambahkan URL RPC",
     "add_block_explorer_url": "Tambahkan URL block explorer",
     "networks_desc": "Tambahkan dan edit jaringan RPC khusus",
-    "networks_enabled": "Jaringan yang Diaktifkan",
-    "networks_test_networks": "Jaringan Uji",
-    "networks_additional": "Jaringan Tambahan",
+    "networks_enabled": "Enabled Networks",
+    "networks_test_networks": "Test Networks",
+    "networks_additional": "Additional Networks",
     "networks_search_placeholder": "Cari jaringan",
     "networks_no_results": "Jaringan tidak ditemukan",
     "network_name_label": "Nama jaringan",
@@ -3062,15 +3047,15 @@
     "network_rpc_networks": "Jaringan RPC",
     "network_add_network": "Tambahkan jaringan",
     "add_chain_title": "Tambahkan jaringan",
-    "add_chain_search_placeholder": "Cari berdasarkan nama, ID chain, atau mata uang",
-    "add_chain_loading": "Sedang memuat jaringan…",
-    "add_chain_error": "Gagal memuat jaringan. Coba lagi.",
+    "add_chain_search_placeholder": "Search by name, chain ID, or currency",
+    "add_chain_loading": "Loading networks…",
+    "add_chain_error": "Failed to load networks. Please try again.",
     "add_chain_retry": "Coba lagi",
-    "add_chain_added": "Ditambahkan",
+    "add_chain_added": "Added",
     "add_chain_or": "atau",
     "add_chain_custom_link": "Tambahkan jaringan khusus",
     "network_add_custom_network": "Tambahkan jaringan khusus",
-    "network_add_test_network": "Tambahkan jaringan uji",
+    "network_add_test_network": "Add a test network",
     "network_add": "Tambahkan",
     "network_save": "Simpan",
     "remove_network_title": "Apakah Anda ingin menghapus jaringan ini?",
@@ -3394,9 +3379,11 @@
     ],
     "private_key_explanation": "Simpan di tempat yang aman dan rahasia.",
     "private_key_warning": "Ini merupakan kunci pribadi untuk akun yang dipilih saat ini: {{accountName}}. Jangan pernah mengungkapkan kunci ini. Siapa pun yang memiliki kunci pribadi Anda dapat mengontrol akun Anda sepenuhnya, termasuk mentransfer semua dana Anda.",
-    "seed_phrase_warning_explanation": "Pastikan tidak ada orang yang melihat layar Anda. Dukungan MetaMask tidak akan pernah meminta hal ini.",
+    "seed_phrase_warning_explanation": [
+      "Pastikan tidak ada yang melihat layar Anda.",
+      "Dukungan MetaMask tidak akan pernah memintanya."
+    ],
     "private_key_warning_explanation": "Jangan pernah mengungkapkan kunci ini. Siapa pun yang memiliki kunci pribadi Anda dapat mengontrol akun Anda sepenuhnya, termasuk mentransfer semua dana Anda.",
-    "reveal_srp_description": "Frasa Pemulihan Rahasia memberikan akses penuh ke dompet Anda. Jangan membagikannya kepada siapa pun.",
     "reveal_credential_modal": [
       "{{credentialName}} memberikan ",
       "akses penuh ke akun dan dana Anda.\n\nJangan membagikannya kepada siapa pun.\n",
@@ -3428,8 +3415,7 @@
     "srp_text": "Frasa Pemulihan Rahasia",
     "private_key_text": "Kunci pribadi",
     "got_it": "Mengerti",
-    "learn_more": "Selengkapnya",
-    "copied_to_clipboard": "Disalin ke papan klip"
+    "learn_more": "Selengkapnya"
   },
   "screenshot_deterrent": {
     "title": "Peringatan keamanan",
@@ -3810,7 +3796,7 @@
     "transaction_fee_explanation": "Biaya transaksi dikaitkan dengan izin ini.",
     "view_details": "Lihat detail",
     "view_transaction_details": "Lihat detail transaksi",
-    "view_data": "Lihat data",
+    "view_data": "View data",
     "transaction_details": "Detail transaksi",
     "site_url": "URL Situs",
     "permission_request": "Permintaan izin",
@@ -3891,7 +3877,7 @@
     "right_button": "Lindungi dompet"
   },
   "add_favorite": {
-    "title": "Tambahkan ke favorit",
+    "title": "Add favorite",
     "title_label": "Nama",
     "url_label": "URL",
     "add_button": "Tambahkan",
@@ -4245,8 +4231,8 @@
   "biometrics": {
     "enable_touchid": "Buka dengan ID Sentuh?",
     "enable_faceid": "Buka dengan ID Wajah?",
-    "enable_fingerprint": "Buka dengan sidik jari?",
-    "enable_biometrics": "Buka dengan biometrik?",
+    "enable_fingerprint": "Unlock with fingerprint?",
+    "enable_biometrics": "Unlock with biometrics?",
     "enable_device_passcode_ios": "Buka dengan kode sandi perangkat?",
     "enable_device_passcode_android": "Buka dengan PIN perangkat?"
   },
@@ -4772,7 +4758,7 @@
     "public_address": "Alamat publik",
     "public_address_qr_code": "Alamat publik",
     "coming_soon": "Segera hadir...",
-    "request_payment": "Permintaan pembayaran",
+    "request_payment": "Request payment",
     "copy": "Salin",
     "scan_address": "Pindai alamat untuk menerima pembayaran",
     "copy_address": "Salin alamat"
@@ -4786,8 +4772,8 @@
     "switch_network": "Harap beralih ke mainnet atau sepolia",
     "card_title": "Selalu tampilkan tombol Kartu MetaMask",
     "card_desc": "Kartu MetaMask hanya tersedia untuk penduduk negara tertentu.",
-    "daimo_demo_title": "Gunakan lingkungan demo DaimoPay",
-    "daimo_demo_desc": "Beralih antara lingkungan demo dan produksi DaimoPay untuk pembayaran kartu."
+    "daimo_demo_title": "Use DaimoPay demo environment",
+    "daimo_demo_desc": "Toggle between DaimoPay demo and production environments for card payments."
   },
   "walletconnect_sessions": {
     "no_active_sessions": "Anda tidak memiliki sesi aktif",
@@ -4800,10 +4786,10 @@
     "close_current_session": "Tutup sesi saat ini sebelum memulai yang baru."
   },
   "paymentRequest": {
-    "title": "Permintaan pembayaran",
-    "title_complete": "Pembayaran selesai",
+    "title": "Payment request",
+    "title_complete": "Payment complete",
     "confirm": "Bayar",
-    "cancel": "Tolak",
+    "cancel": "Decline",
     "is_requesting_you_to_pay": "meminta Anda untuk membayar",
     "total": "Total:"
   },
@@ -4838,7 +4824,6 @@
     "no_payment_methods_available": "Tidak ada metode pembayaran yang tersedia.",
     "error_fetching_quotes": "Terjadi kesalahan. Coba lagi.",
     "no_quotes_available": "Penyedia tidak tersedia.",
-    "quote_unavailable": "Kuotasi tidak tersedia.",
     "providers": "Penyedia",
     "quotes_displayed_for": "Kuotasi yang ditampilkan untuk {{paymentMethodName}}.",
     "other_options": "Other options",
@@ -4944,10 +4929,10 @@
       "logged_out_error": "Kesalahan saat keluar"
     },
     "token_unavailable_modal": {
-      "title": "Tidak tersedia",
-      "description": "{{token}} tidak tersedia dengan {{provider}} di wilayah Anda.",
-      "change_token": "Ubah token",
-      "change_provider": "Ubah penyedia"
+      "title": "Not available",
+      "description": "{{token}} is not available with {{provider}} in your region.",
+      "change_token": "Change token",
+      "change_provider": "Change provider"
     },
     "provider_picker_modal": {
       "title": "Pilih penyedia"
@@ -5185,39 +5170,6 @@
     },
     "deposit_order_title": "Deposit {{currency}}"
   },
-  "ramps_order_details": {
-    "title": "Detail order",
-    "status": "Status",
-    "processing": "Memproses",
-    "complete": "Selesaikan",
-    "failed": "Gagal",
-    "cancelled": "Dibatalkan",
-    "view_on_provider": "Lihat di {{provider}}",
-    "order_id": "ID Order",
-    "date_and_time": "Tanggal dan waktu",
-    "fees": "Biaya",
-    "total": "Total",
-    "card_processing_info": "Pembelian kartu umumnya memerlukan waktu beberapa menit",
-    "processing_info_modal_description": "Pembelian menggunakan kartu umumnya hanya membutuhkan beberapa menit. Anda dapat menghubungi dukungan pelanggan jika ada pertanyaan.",
-    "go_to_provider_support": "Kunjungi halaman dukungan {{provider}}",
-    "error_title": "Terjadi kesalahan",
-    "error_message": "Tidak dapat memuat detail order. Coba lagi.",
-    "try_again": "Coba lagi",
-    "close": "Tutup"
-  },
-  "ramps_v2": {
-    "notifications": {
-      "purchase_pending_title": "Memproses pembelian {{cryptocurrency}}",
-      "purchase_pending_description": "Hanya perlu beberapa menit...",
-      "purchase_completed_title": "Pembelian senilai {{amount}} {{cryptocurrency}} berhasil!",
-      "purchase_completed_description": "{{cryptocurrency}} kini telah tersedia",
-      "purchase_failed_title": "Pembelian {{cryptocurrency}} gagal",
-      "purchase_failed_description": "Cobalah beberapa saat lagi",
-      "purchase_cancelled_title": "Pembelian dibatalkan",
-      "purchase_cancelled_description": "Pembelian {{cryptocurrency}} telah dibatalkan",
-      "track": "Lacak"
-    }
-  },
   "swaps": {
     "title": "Swap",
     "onboarding": {
@@ -5734,15 +5686,12 @@
     "new_wallet_needed_description_part_three": "Agar hal ini tidak terjadi lagi, pastikan untuk selalu memperbarui aplikasi dan OS MetaMask ke versi terbaru."
   },
   "srp_security_quiz": {
-    "question_step": "Pertanyaan {{step}} dari {{total}}",
     "title": "Kuis keamanan",
     "introduction": "Untuk mengungkapkan Frasa Pemulihan Rahasia, Anda perlu menjawab dua pertanyaan dengan benar",
     "get_started": "Mulai",
     "learn_more": "Pelajari selengkapnya",
     "try_again": "Coba lagi",
     "continue": "Lanjutkan",
-    "correct": "Benar!",
-    "incorrect": "Salah!",
     "of": "dari",
     "question_one": {
       "question": "Jika Anda kehilangan Frasa Pemulihan Rahasia, MetaMask...",
@@ -5921,8 +5870,8 @@
     "claimable_bonus_tooltip": "The annualized bonus you’ve earned for holding mUSD. Your bonus is claimable daily on Linea.",
     "earn_a_percentage_bonus": "Dapatkan bonus sebesar {{percentage}}%",
     "claimable_bonus": "Bonus yang dapat diklaim",
-    "claim_bonus": "Klaim bonus",
-    "claim_bonus_subtitle": "Bonus akan dibayarkan melalui {{networkName}}.",
+    "claim_bonus": "Claim bonus",
+    "claim_bonus_subtitle": "Bonus will be paid out on {{networkName}}.",
     "empty_state_cta": {
       "heading": "Pinjamkan {{tokenSymbol}} dan hasilkan",
       "body": "Pinjamkan {{tokenSymbol}} Anda dengan {{protocol}} dan dapatkan",
@@ -5933,7 +5882,7 @@
     "service_interruption_banner": {
       "maintenance_message": "Kami sedang dalam perbaikan dan akan segera kembali online!"
     },
-    "supply": "Suplai",
+    "supply": "Supply",
     "deposit": "Deposit",
     "approve": "Setujui",
     "approval": "Persetujuan",
@@ -5982,7 +5931,7 @@
     "network": "Jaringan",
     "health_factor": "Faktor kesehatan",
     "liquidation_risk": "Risiko likuidasi",
-    "insufficient_pool_liquidity": "Likuiditas pool tidak cukup",
+    "insufficient_pool_liquidity": "Insufficient pool liquidity",
     "available_to_withdraw": "tersedia untuk ditarik",
     "unknown": "tidak dikenal",
     "how_it_works": "Cara kerjanya",
@@ -6001,7 +5950,7 @@
       "lending": "Riwayat posisi",
       "staking": "Riwayat pembayaran"
     },
-    "allowance_reset": "Reset tunjangan",
+    "allowance_reset": "Allowance reset",
     "tron": {
       "fee": "Biaya"
     },
@@ -6009,20 +5958,8 @@
       "ok": "Oke",
       "continue": "Lanjutkan",
       "convert_and_get_percentage_bonus": "Konversi dan dapatkan {{percentage}}%",
-      "your_musd": "mUSD Anda",
-      "balance_breakdown_title": "Saldo mUSD Anda berdasarkan jaringan",
-      "balance_amount": "{{amount}} mUSD",
-      "balance_amount_with_symbol": "{{amount}} {{symbol}}",
-      "balance_fiat_unavailable": "—",
-      "convert_to_musd": "Konversikan ke mUSD",
       "get_a_percentage_musd_bonus": "Dapatkan bonus {{percentage}}% mUSD",
       "convert": "Konversikan",
-      "fetching_quote": "Mengambil kuotasi...",
-      "you_convert": "Anda mengonversi",
-      "network_fee": "Biaya jaringan",
-      "earning": "Penghasilan",
-      "quick_convert_description": "Pilih token untuk mengonversi seluruh saldo Anda atau ketuk ikon edit untuk memasukkan jumlah khusus.",
-      "no_tokens_to_convert": "Anda tidak memiliki token yang dapat dikonversi ke mUSD.",
       "toasts": {
         "converting": "Mengonversi {{token}} → mUSD",
         "eta": "~{{time}}",
@@ -6062,7 +5999,7 @@
       "toasts": {
         "claiming": "Bonus mUSD sedang diproses",
         "delivered": "Bonus mUSD telah tiba!",
-        "failed": "Klaim bonus gagal"
+        "failed": "Bonus claim failed"
       }
     },
     "rewards": {
@@ -6073,8 +6010,7 @@
       "tooltip_opted_in_footer": "Poin akan ditambahkan secara otomatis ke akun Anda.",
       "tooltip_not_opted_in_footer": "Ikuti program reward untuk mendapatkan poin Anda.",
       "tooltip_close": "Tutup"
-    },
-    "your_stablecoins": "Stablecoin Anda"
+    }
   },
   "stake": {
     "stake": "Stake",
@@ -6096,7 +6032,9 @@
       "fee": "Biaya",
       "errors": {
         "insufficient_balance": "Anda tidak memiliki cukup saldo sumber daya untuk melakukan tindakan ini."
-      }
+      },
+      "trx_unstaking_in_progress": "Proses pembatalan stake {{amount}} TRX sedang berlangsung. Proses ini membutuhkan waktu 14 hari.",
+      "has_claimable_trx": "You can claim {{amount}} TRX. Once claimed you'll get TRX back in your wallet."
     },
     "stake_eth": "Stake ETH",
     "unstake_eth": "Batalkan stake ETH",
@@ -6574,7 +6512,7 @@
     "hardware_wallet_not_supported": "Dompet perangkat keras belum didukung. Gunakan hot wallet untuk melanjutkan.",
     "hardware_wallet_not_supported_solana": "Dompet perangkat keras belum didukung untuk Solana. Gunakan hot wallet untuk melanjutkan.",
     "price_impact_info_title": "Dampak harga",
-    "price_impact_info_description": "Dampak harga mencerminkan bagaimana order swap Anda memengaruhi harga pasar aset. Hal ini bergantung pada ukuran perdagangan dan likuiditas yang tersedia di pool. MetaMask tidak memengaruhi atau mengontrol dampak harga.",
+    "price_impact_info_description": "This is how your trade changes the market price of a token. It depends on the trade size, available liquidity, and provider fees. MetaMask doesn't control price impact.",
     "price_impact_info_gasless_description": "Dampak harga mencerminkan bagaimana perintah swap Anda memengaruhi harga pasar aset. Jika Anda tidak memiliki cukup dana untuk gas, sebagian token sumber akan dialokasikan secara otomatis untuk menutupi biaya, yang meningkatkan dampak harga. MetaMask tidak memengaruhi atau mengendalikan dampak harga.",
     "price_impact_warning_description": "This trade has an estimated {{priceImpact}} price impact, which reflects how much your trade changes the market price. The quote already reflects this.",
     "price_impact_high": "High price impact",
@@ -6600,6 +6538,7 @@
     },
     "submit": "Kirim",
     "default_slippage_description": "Transaksi Anda tidak akan berhasil jika harga berubah lebih dari persentase selip.",
+    "cancel": "Batal",
     "confirm": "Konfirmasikan",
     "exceeding_upper_slippage_warning": "Selip tinggi, ini dapat mengakibatkan swap yang tidak menguntungkan",
     "exceeding_lower_slippage_warning": "Selip rendah, ini dapat mengakibatkan swap yang tidak menguntungkan",
@@ -7282,19 +7221,6 @@
       "retry": "Coba lagi",
       "on_linea": "di Linea"
     },
-    "cashback_screen": {
-      "title": "Cashback",
-      "available_cashback": "Cashback yang tersedia",
-      "network_fee": "Biaya jaringan",
-      "expected_to_receive": "Diharapkan menerima",
-      "withdraw": "Tarik",
-      "withdraw_unavailable": "Penarikan tidak tersedia",
-      "withdrawal_initiated": "Penarikan telah dimulai",
-      "withdrawal_success": "Penarikan berhasil diselesaikan",
-      "withdrawal_failed": "Penarikan gagal. Coba lagi.",
-      "no_cashback": "Cashback tidak tersedia",
-      "loading_error": "Gagal memuat cashback. Coba lagi."
-    },
     "change_asset": {
       "title": "Ubah token dan jaringan",
       "full_spending_access": "Akses penggunaan penuh",
@@ -7469,10 +7395,7 @@
       "service_not_available": "Layanan tidak tersedia untuk saat ini. Coba lagi nanti.",
       "invalid_referral_code": "Kode referensi tidak valid. Periksa dan coba lagi.",
       "already_referred": "Anda telah dirujuk oleh pengguna lain.",
-      "cannot_use_own_referral_code": "Anda tidak dapat menggunakan kode referensi milik Anda sendiri.",
-      "invalid_bonus_code": "Kode bonus tidak valid",
-      "already_redeemed": "Anda telah menukarkan kode bonus ini",
-      "reached_maximum": "Kode bonus ini telah mencapai jumlah penggunaan maksimum"
+      "cannot_use_own_referral_code": "Anda tidak dapat menggunakan kode referensi milik Anda sendiri."
     },
     "claim_reward_error": {
       "title": "Gagal mengklaim reward"
@@ -7529,10 +7452,8 @@
         "predict": "Prediksi",
         "musd_deposit": "Deposit mUSD",
         "apply_referral_bonus": "Bonus kode referensi",
-        "bonus_code": "Kode bonus",
         "uncategorized_event": "Acara yang tidak dikategorikan"
       },
-      "code": "Kode",
       "date": "Tanggal",
       "account": "Akun",
       "bonus": "Bonus",
@@ -7651,10 +7572,6 @@
       "invalid_code": "Kode referensi tidak valid",
       "apply_button": "Gunakan kode referensi"
     },
-    "bonus_code": {
-      "input_placeholder": "Masukkan kode bonus",
-      "apply_success": "Kode bonus telah diterapkan!"
-    },
     "optout": {
       "title": "Hapus progres Rewards",
       "description": "Tindakan ini akan menghapus akun Anda dari program Rewards serta menghapus semua poin dan progres Anda. Tindakan ini tidak dapat dibatalkan.",
@@ -7791,14 +7708,12 @@
     },
     "label": {
       "bridge_fee": "Biaya bridge",
-      "provider_fee": "Biaya penyedia",
       "network_fee": "Biaya jaringan",
       "paid_with": "Dibayar dengan",
-      "receive_token": "Terima token",
       "retry_button": "Coba lagi",
       "total": "Total",
       "account": "Akun",
-      "received_total": "Total yang diterima"
+      "received_total": "Received total"
     },
     "summary_title": {
       "bridge_approval": "Setujui {{approveSymbol}}",
@@ -7851,15 +7766,14 @@
     "still_connecting_network": "Masih terhubung ke {{networkName}}...",
     "unable_to_connect_network": "Tidak dapat terhubung ke {{networkName}}.",
     "update_rpc": "Perbarui RPC",
-    "switch_to_metamask_default_rpc": "Beralih ke RPC default MetaMask",
+    "switch_to_metamask_default_rpc": "Switch to MetaMask default RPC",
     "check_network_connectivity": "Periksa konektivitas jaringan Anda.",
     "check_network_connectivity_or": "Periksa konektivitas jaringan Anda atau",
-    "updated_to_metamask_default": "Diperbarui ke default MetaMask"
+    "updated_to_metamask_default": "Updated to MetaMask default"
   },
   "trending": {
     "title": "Jelajahi",
     "trending_tokens": "Token yang tren",
-    "stocks": "Saham",
     "price_change": "Perubahan harga",
     "all_networks": "Semua jaringan",
     "24h": "24 jam",
@@ -8007,8 +7921,8 @@
       }
     },
     "error": {
-      "unable_to_load": "Tidak dapat memuat {{section}}",
-      "retry": "Coba lagi"
+      "unable_to_load": "Unable to load {{section}}",
+      "retry": "Retry"
     }
   }
-}
\ No newline at end of file
+}
diff --git a/locales/languages/ja-jp.json b/locales/languages/ja-jp.json
index af6f4fd0e7e7..ab099a12fefd 100644
--- a/locales/languages/ja-jp.json
+++ b/locales/languages/ja-jp.json
@@ -582,6 +582,7 @@
     "ok": "OK",
     "cancel": "キャンセル",
     "error": "エラー",
+    "open_settings": "設定",
     "attempting_to_scan_with_wallet_locked": "QRコードを読み取ろうとしていますが、ウォレットのロックを解除する必要があります。",
     "attempting_sync_from_wallet_error": "拡張機能と同期しようとしています。実行するには、現在のウォレットを消去する必要があります。\n\n新しいバージョンのアプリを消去または再インストールした後、[Sync with MetaMask Extension]というオプションを選択してください。重要！ウォレットを消去する前に、シークレットリカバリーフレーズのバックアップを取っておくことをお勧めします。"
   },
diff --git a/locales/languages/ja.json b/locales/languages/ja.json
index 58f0008e2c9b..29045c32904f 100644
--- a/locales/languages/ja.json
+++ b/locales/languages/ja.json
@@ -104,8 +104,8 @@
       "title": "資金不足"
     },
     "insufficient_pay_token_native_post_quote": {
-      "message": "Not enough {{ticker}} to cover fees. Add {{ticker}} to continue.",
-      "title": "Insufficient funds for post quote"
+      "message": "手数料をカバーするのに十分な{{ticker}}がありません。続行するには{{ticker}}を追加してください。",
+      "title": "クォート後に必要な資金が不足しています"
     },
     "no_pay_token_quotes": {
       "message": "この決済ルートは現在使用できません。金額、ネットワーク、またはトークンを変更してみてください。最善のオプションを探します。",
@@ -1184,7 +1184,6 @@
       "title": "新規注文",
       "leverage": "レバレッジ",
       "limit_price": "リミット価格",
-      "market_price": "市場価格",
       "enter_price": "価格を入力してください",
       "trigger_price": "トリガー価格",
       "liquidation_price": "清算価格",
@@ -1328,7 +1327,6 @@
       "funds_are_available_to_trade": "資金を取引に利用できます",
       "close_order_still_active": "クローズ注文は引き続き有効です",
       "order_submitted": "注文が送信されました",
-      "submitting_your_trade": "取引を送信中",
       "order_filled": "注文が約定しました",
       "order_placed": "注文が発注されました",
       "order_placement_subtitle": "{{direction}} {{amount}} {{assetSymbol}}",
@@ -1346,26 +1344,14 @@
       "title": "注文詳細",
       "cancel_order": "注文取消",
       "date": "日付",
-      "trigger_condition": "トリガー条件",
-      "price": "価格",
       "fee": "手数料",
       "limit_buy": "リミットロング",
       "limit_price": "リミット価格",
       "limit_sell": "リミットショート",
       "market_buy": "成行ロング",
       "market_sell": "成行ショート",
-      "market": "マーケット",
       "open": "未約定",
       "size": "サイズ",
-      "original_size": "元のサイズ",
-      "order_value": "注文額",
-      "reduce_only": "リデュースオンリー",
-      "yes": "はい",
-      "no": "いいえ",
-      "price_above": "価格が{{price}}を超えた場合",
-      "price_below": "価格が{{price}}を下回った場合",
-      "take_profit": "利益確定",
-      "stop_loss": "ストップロス",
       "status": "ステータス",
       "view_explorer": "エクスプローラーで表示"
     },
@@ -2197,6 +2183,7 @@
     "available_balance": "利用可能残高",
     "claim_amount_text": "請求額 ${{amount}}",
     "claim_winnings_text": "報酬を請求",
+    "claiming_text": "Claiming...",
     "unrealized_pnl_label": "含み損益",
     "unrealized_pnl_value": "{{amount}} ({{percent}})",
     "unrealized_pnl_error": "読み込めません",
@@ -2275,6 +2262,9 @@
           "title": "問題が発生しました",
           "description": "請求に失敗しました",
           "try_again": "再試行してください"
+        },
+        "in_progress": {
+          "title": "Claim already in progress"
         }
       }
     },
@@ -2308,7 +2298,6 @@
       "withdrawing_subtitle": "約1分後にご利用可能となります",
       "withdraw_completed": "出金完了",
       "withdraw_completed_subtitle": "{{amount}} USDCがウォレットに移動されました",
-      "withdraw_any_token_completed_subtitle": "{{amount}} {{token}}がウォレットに移動されました",
       "error_title": "問題が発生しました",
       "error_description": "出金に失敗しました",
       "try_again": "再試行してください"
@@ -2440,7 +2429,7 @@
     "add_tokens": "トークンをインポート",
     "are_you_sure_exit": "Are you sure you want to exit?",
     "import_token": "Would you like to import this token?",
-    "import_tokens": "これらのトークンをインポートしますか？",
+    "import_tokens": "Would you like to import these tokens?",
     "tokens_detected_in_account": "このアカウントに{{tokenCount}}件の新しい{{tokensLabel}}が見つかりました",
     "token_toast": {
       "tokens_imported_title": "トークンをインポートしました",
@@ -2705,7 +2694,7 @@
     "decimals_cant_be_empty": "トークンの小数点以下は必須入力項目です。",
     "decimals_is_required": "Decimal is required. Find it on:",
     "no_tokens_found": "その名前のトークンは見つかりませんでした。",
-    "tokens_empty_description": "お好きなトークンを検索して、インポートしてください",
+    "tokens_empty_description": "Search for any token and import it",
     "select_token": "トークンを選択",
     "address_must_be_smart_contract": "パーソナルアドレスが検出されました。トークンのコントラクトアドレスを入力してください。",
     "billion_abbreviation": "B",
@@ -2915,10 +2904,6 @@
     "enabling_notifications": "通知を有効にしています...",
     "updating_notifications": "通知を更新しています...",
     "updating_account_settings": "アカウント設定を更新しています...",
-    "reset_notifications_title": "通知をリセット",
-    "reset_notifications_description": "通知をリセットすると、通知ストレージキーが削除され、通知履歴がすべてリセットされます。よろしいですか？",
-    "reset_notifications": "通知のリセット",
-    "reset_notifications_success": "通知ストレージキーが削除/再作成され、通知履歴がリセットされました。",
     "notifications_dismiss_modal": "閉じる",
     "select_rpc_url": "RPC URLを選択",
     "title": "設定",
@@ -3040,9 +3025,9 @@
     "add_rpc_url": "RPC URLを追加",
     "add_block_explorer_url": "ブロックエクスプローラーURLを追加",
     "networks_desc": "カスタムRPCネットワークの追加と編集",
-    "networks_enabled": "有効なネットワーク",
-    "networks_test_networks": "テストネットワーク",
-    "networks_additional": "他のネットワーク",
+    "networks_enabled": "Enabled Networks",
+    "networks_test_networks": "Test Networks",
+    "networks_additional": "Additional Networks",
     "networks_search_placeholder": "ネットワークを検索",
     "networks_no_results": "ネットワークが見つかりません",
     "network_name_label": "ネットワーク名",
@@ -3062,15 +3047,15 @@
     "network_rpc_networks": "RPCネットワーク",
     "network_add_network": "ネットワークを追加",
     "add_chain_title": "ネットワークを追加",
-    "add_chain_search_placeholder": "名前、チェーンID、通貨で検索できます",
-    "add_chain_loading": "ネットワークを読み込み中…",
-    "add_chain_error": "ネットワークを読み込めませんでした。もう一度お試しください。",
+    "add_chain_search_placeholder": "Search by name, chain ID, or currency",
+    "add_chain_loading": "Loading networks…",
+    "add_chain_error": "Failed to load networks. Please try again.",
     "add_chain_retry": "再試行",
-    "add_chain_added": "追加されました",
+    "add_chain_added": "Added",
     "add_chain_or": "または",
     "add_chain_custom_link": "カスタムネットワークを追加",
     "network_add_custom_network": "カスタムネットワークを追加",
-    "network_add_test_network": "テストネットワークを追加",
+    "network_add_test_network": "Add a test network",
     "network_add": "追加",
     "network_save": "保存",
     "remove_network_title": "このネットワークを削除しますか？",
@@ -3394,9 +3379,11 @@
     ],
     "private_key_explanation": "安全な秘密の場所に保管してください。",
     "private_key_warning": "これは現在選択されたアカウント {{accountName}} の秘密鍵です。この鍵は絶対に開示しないでください。資金の送金を含め、秘密鍵を持っていれば誰でもアカウントを完全にコントロールできます。",
-    "seed_phrase_warning_explanation": "誰にも画面を見られていないことを確認してください。MetaMaskサポートがフレーズをお尋ねすることはありません。",
+    "seed_phrase_warning_explanation": [
+      "誰にも画面を見られていないことを確認してください。",
+      "MetaMaskサポートがこれを求めることはありません。"
+    ],
     "private_key_warning_explanation": "この鍵は絶対に開示しないでください。資金の送金を含め、秘密鍵を持っていれば誰でもアカウントを完全にコントロールできます。",
-    "reveal_srp_description": "シークレットリカバリーフレーズがあれば、ウォレットに自由にアクセスできます。このフレーズは誰にも教えないでください。",
     "reveal_credential_modal": [
       "{{credentialName}}があれば、",
       "アカウントと資金に完全にアクセスできます。\n\n誰にも教えないでください。",
@@ -3428,8 +3415,7 @@
     "srp_text": "シークレットリカバリーフレーズです。",
     "private_key_text": "秘密鍵",
     "got_it": "了解",
-    "learn_more": "詳細",
-    "copied_to_clipboard": "クリップボードにコピーしました"
+    "learn_more": "詳細"
   },
   "screenshot_deterrent": {
     "title": "安全性に関するアラート",
@@ -3810,7 +3796,7 @@
     "transaction_fee_explanation": "この許可に関連するトランザクション手数料。",
     "view_details": "詳細を表示",
     "view_transaction_details": "トランザクションの詳細を表示",
-    "view_data": "データを表示",
+    "view_data": "View data",
     "transaction_details": "トランザクションの詳細",
     "site_url": "サイトURL",
     "permission_request": "許可のリクエスト",
@@ -3891,7 +3877,7 @@
     "right_button": "ウォレットを保護"
   },
   "add_favorite": {
-    "title": "お気に入りに追加",
+    "title": "Add favorite",
     "title_label": "名前",
     "url_label": "URL",
     "add_button": "追加",
@@ -4245,8 +4231,8 @@
   "biometrics": {
     "enable_touchid": "Touch IDでロックを解除しますか？",
     "enable_faceid": "Face IDでロックを解除しますか？",
-    "enable_fingerprint": "指紋でロックを解除しますか？",
-    "enable_biometrics": "生体認証でロックを解除しますか？",
+    "enable_fingerprint": "Unlock with fingerprint?",
+    "enable_biometrics": "Unlock with biometrics?",
     "enable_device_passcode_ios": "デバイスのパスコードでロックを解除しますか？",
     "enable_device_passcode_android": "デバイスの暗証番号でロックを解除しますか？"
   },
@@ -4772,7 +4758,7 @@
     "public_address": "パブリックアドレス",
     "public_address_qr_code": "パブリックアドレス",
     "coming_soon": "近日追加予定...",
-    "request_payment": "支払いをリクエスト",
+    "request_payment": "Request payment",
     "copy": "コピー",
     "scan_address": "支払いを受け取るにはアドレスをスキャンしてください",
     "copy_address": "アドレスをコピー"
@@ -4786,8 +4772,8 @@
     "switch_network": "メインネットまたはSepoliaに切り替えてください",
     "card_title": "MetaMaskカードボタンを常に表示する",
     "card_desc": "MetaMaskカードは一部の国にお住まいの方のみご利用いただけます.",
-    "daimo_demo_title": "DaimoPayのデモ環境を使用する",
-    "daimo_demo_desc": "カード決済のためのDaimoPayのデモ環境と本番環境を切り替えます。"
+    "daimo_demo_title": "Use DaimoPay demo environment",
+    "daimo_demo_desc": "Toggle between DaimoPay demo and production environments for card payments."
   },
   "walletconnect_sessions": {
     "no_active_sessions": "アクティブなセッションがありません",
@@ -4800,10 +4786,10 @@
     "close_current_session": "新しいセッションを開始する前に、現在のセッションを閉じてください。"
   },
   "paymentRequest": {
-    "title": "支払いのリクエスト",
-    "title_complete": "支払い完了",
+    "title": "Payment request",
+    "title_complete": "Payment complete",
     "confirm": "支払う",
-    "cancel": "拒否",
+    "cancel": "Decline",
     "is_requesting_you_to_pay": "が支払いを求めています",
     "total": "合計:"
   },
@@ -4838,7 +4824,6 @@
     "no_payment_methods_available": "使用可能な支払方法がありません。",
     "error_fetching_quotes": "問題が発生しました。もう一度お試しください。",
     "no_quotes_available": "利用可能なプロバイダーがありません。",
-    "quote_unavailable": "クォートが利用できません。",
     "providers": "プロバイダー",
     "quotes_displayed_for": "{{paymentMethodName}}用のクォートが表示されています。",
     "other_options": "Other options",
@@ -4944,10 +4929,10 @@
       "logged_out_error": "ログアウト中にエラーが発生しました"
     },
     "token_unavailable_modal": {
-      "title": "利用できません",
-      "description": "お住まいの地域の{{provider}}では{{token}}を利用できません。",
-      "change_token": "トークンを変更",
-      "change_provider": "プロバイダーを変更"
+      "title": "Not available",
+      "description": "{{token}} is not available with {{provider}} in your region.",
+      "change_token": "Change token",
+      "change_provider": "Change provider"
     },
     "provider_picker_modal": {
       "title": "プロバイダーの選択"
@@ -5185,39 +5170,6 @@
     },
     "deposit_order_title": "{{currency}}のデポジット"
   },
-  "ramps_order_details": {
-    "title": "注文詳細",
-    "status": "ステータス",
-    "processing": "処理中",
-    "complete": "完了",
-    "failed": "失敗",
-    "cancelled": "キャンセル済み",
-    "view_on_provider": "{{provider}}で表示",
-    "order_id": "注文ID",
-    "date_and_time": "日付と時刻",
-    "fees": "手数料",
-    "total": "合計",
-    "card_processing_info": "カードでの購入には通常数分かかります",
-    "processing_info_modal_description": "カードでのご購入には通常数分かかります。ご質問がある場合は、サポートにお問い合わせください。",
-    "go_to_provider_support": "{{provider}}のサポートページに移動",
-    "error_title": "問題が発生しました",
-    "error_message": "注文情報を読み込めません。もう一度お試しください。",
-    "try_again": "もう一度お試しください",
-    "close": "閉じる"
-  },
-  "ramps_v2": {
-    "notifications": {
-      "purchase_pending_title": "{{cryptocurrency}}の購入を処理中です",
-      "purchase_pending_description": "この処理はほんの数分で完了する予定です...",
-      "purchase_completed_title": "{{amount}}{{cryptocurrency}}の購入が完了しました",
-      "purchase_completed_description": "{{cryptocurrency}}が利用可能になりました",
-      "purchase_failed_title": "{{cryptocurrency}}の購入に失敗しました",
-      "purchase_failed_description": "直ちに再試行してださい",
-      "purchase_cancelled_title": "購入がキャンセルされました",
-      "purchase_cancelled_description": "{{cryptocurrency}}の購入がキャンセルされました",
-      "track": "追跡"
-    }
-  },
   "swaps": {
     "title": "スワップ",
     "onboarding": {
@@ -5734,15 +5686,12 @@
     "new_wallet_needed_description_part_three": "再びこのような事態が起こらないように、常にMetaMaskアプリとOSを最新バージョンにアップデートしてください。"
   },
   "srp_security_quiz": {
-    "question_step": "質問 {{step}} / {{total}}",
     "title": "セキュリティの質問",
     "introduction": "シークレットリカバリーフレーズを表示するには、2つの質問に正しく答える必要があります",
     "get_started": "開始",
     "learn_more": "詳細",
     "try_again": "再試行してください",
     "continue": "続行",
-    "correct": "正解です！",
-    "incorrect": "不正解です！",
     "of": "-",
     "question_one": {
       "question": "シークレットリカバリーフレーズをなくした場合、MetaMaskは...",
@@ -5921,8 +5870,8 @@
     "claimable_bonus_tooltip": "The annualized bonus you’ve earned for holding mUSD. Your bonus is claimable daily on Linea.",
     "earn_a_percentage_bonus": "{{percentage}}%のボーナスを獲得",
     "claimable_bonus": "獲得できるボーナス",
-    "claim_bonus": "ボーナスを請求する",
-    "claim_bonus_subtitle": "ボーナスは{{networkName}}上で支払われます。",
+    "claim_bonus": "Claim bonus",
+    "claim_bonus_subtitle": "Bonus will be paid out on {{networkName}}.",
     "empty_state_cta": {
       "heading": "{{tokenSymbol}}を貸して収益化",
       "body": "{{protocol}}で{{tokenSymbol}}を貸し付けて、",
@@ -5933,7 +5882,7 @@
     "service_interruption_banner": {
       "maintenance_message": "メンテナンス中のためご利用いただけません。再開まで今しばらくお待ちください。"
     },
-    "supply": "供給量",
+    "supply": "Supply",
     "deposit": "入金する",
     "approve": "承認",
     "approval": "承認",
@@ -5982,7 +5931,7 @@
     "network": "ネットワーク",
     "health_factor": "健全性指標",
     "liquidation_risk": "清算リスク",
-    "insufficient_pool_liquidity": "プールの流動性不足",
+    "insufficient_pool_liquidity": "Insufficient pool liquidity",
     "available_to_withdraw": "引き出し可能額",
     "unknown": "不明",
     "how_it_works": "使い方",
@@ -6001,7 +5950,7 @@
       "lending": "ポジション履歴",
       "staking": "払出履歴"
     },
-    "allowance_reset": "許容額のリセット",
+    "allowance_reset": "Allowance reset",
     "tron": {
       "fee": "手数料"
     },
@@ -6009,20 +5958,8 @@
       "ok": "OK",
       "continue": "続行",
       "convert_and_get_percentage_bonus": "変換して{{percentage}}%をゲット",
-      "your_musd": "保有中のmUSD",
-      "balance_breakdown_title": "ネットワークごとのmUSD残高",
-      "balance_amount": "{{amount}} mUSD",
-      "balance_amount_with_symbol": "{{amount}} {{symbol}}",
-      "balance_fiat_unavailable": "—",
-      "convert_to_musd": "mUSDに変換",
       "get_a_percentage_musd_bonus": "{{percentage}}%のmUSDボーナスを獲得",
       "convert": "変換",
-      "fetching_quote": "クォートを取得中...",
-      "you_convert": "変換するトークン",
-      "network_fee": "ネットワーク手数料",
-      "earning": "収益",
-      "quick_convert_description": "トークンを選択して全残高を変換するか、編集アイコンをタップしてご自身で金額を入力してください。",
-      "no_tokens_to_convert": "mUSDに変換可能なトークンがありません。",
       "toasts": {
         "converting": "{{token}} → mUSDに変換中",
         "eta": "~{{time}}",
@@ -6062,7 +5999,7 @@
       "toasts": {
         "claiming": "mUSDのボーナスを処理しています",
         "delivered": "mUSDのボーナスを獲得しました！",
-        "failed": "ボーナスの請求に失敗しました"
+        "failed": "Bonus claim failed"
       }
     },
     "rewards": {
@@ -6073,8 +6010,7 @@
       "tooltip_opted_in_footer": "ポイントは自動的にアカウントに追加されます。",
       "tooltip_not_opted_in_footer": "リワードに参加してポイントを受け取りましょう。",
       "tooltip_close": "閉じる"
-    },
-    "your_stablecoins": "保有中のステーブルコイン"
+    }
   },
   "stake": {
     "stake": "Stake",
@@ -6096,7 +6032,9 @@
       "fee": "手数料",
       "errors": {
         "insufficient_balance": "この操作を行うのに十分なリソース残高がありません。"
-      }
+      },
+      "trx_unstaking_in_progress": "{{amount}}TRXのステーキング解除を実行中です。ステーキング解除には14日かかります。",
+      "has_claimable_trx": "You can claim {{amount}} TRX. Once claimed you'll get TRX back in your wallet."
     },
     "stake_eth": "ETHをステーキング",
     "unstake_eth": "ETHのステーキングを解除",
@@ -6574,7 +6512,7 @@
     "hardware_wallet_not_supported": "まだハードウェアウォレットに対応していません。続行するにはホットウォレットをご使用ください。",
     "hardware_wallet_not_supported_solana": "Solanaはまだハードウェアウォレットに対応していません。続行するにはホットウォレットをご使用ください。",
     "price_impact_info_title": "プライスインパクト",
-    "price_impact_info_description": "プライスインパクトは、スワップ注文がその資産の市場価格にどのように影響するかを反映します。取引のサイズとプールの利用可能な流動性によって異なります。MetaMaskがプライスインパクトに影響を与えたりコントロールしたりすることはありません。",
+    "price_impact_info_description": "This is how your trade changes the market price of a token. It depends on the trade size, available liquidity, and provider fees. MetaMask doesn't control price impact.",
     "price_impact_info_gasless_description": "プライスインパクトは、スワップ注文がその資産の市場価格にどのように影響するかを反映します。ガス代の支払いに十分な資金を保有していない場合、交換前のトークンの一部が自動的に手数料の支払いに充当され、プライスインパクトが増大します。MetaMaskがプライスインパクトに影響を与えたりコントロールしたりすることはありません。",
     "price_impact_warning_description": "This trade has an estimated {{priceImpact}} price impact, which reflects how much your trade changes the market price. The quote already reflects this.",
     "price_impact_high": "High price impact",
@@ -6600,6 +6538,7 @@
     },
     "submit": "送信",
     "default_slippage_description": "価格がスリッページの割合を超えて変動した場合、トランザクションは処理されません。",
+    "cancel": "キャンセル",
     "confirm": "確定",
     "exceeding_upper_slippage_warning": "高スリッページ、これにより不利なスワップになる可能性があります",
     "exceeding_lower_slippage_warning": "低スリッページ、これにより不利なスワップになる可能性があります",
@@ -7282,19 +7221,6 @@
       "retry": "再試行してください",
       "on_linea": "Lineaで"
     },
-    "cashback_screen": {
-      "title": "キャッシュバック",
-      "available_cashback": "利用可能なキャッシュバック",
-      "network_fee": "ネットワーク手数料",
-      "expected_to_receive": "受取予定額",
-      "withdraw": "出金",
-      "withdraw_unavailable": "出金できません",
-      "withdrawal_initiated": "出金が開始されました",
-      "withdrawal_success": "出金が完了しました",
-      "withdrawal_failed": "出金に失敗しました。もう一度お試しください。",
-      "no_cashback": "利用可能なキャッシュバックはありません",
-      "loading_error": "キャッシュバックを読み込めませんでした。もう一度お試しください。"
-    },
     "change_asset": {
       "title": "トークンとネットワークの変更",
       "full_spending_access": "全額使用アクセス",
@@ -7469,10 +7395,7 @@
       "service_not_available": "現在サービスをご利用いただけません。しばらくしてからもう一度お試しください。",
       "invalid_referral_code": "紹介コードが無効です。ご確認の上、もう一度お試しください。",
       "already_referred": "お客様はすでに別のユーザーにより招待されています。",
-      "cannot_use_own_referral_code": "ご自身の紹介コードを利用することはできません。",
-      "invalid_bonus_code": "無効なボーナスコード",
-      "already_redeemed": "このボーナスコードはすでに使用されています",
-      "reached_maximum": "このボーナスコードは使用回数の上限に達しました"
+      "cannot_use_own_referral_code": "ご自身の紹介コードを利用することはできません。"
     },
     "claim_reward_error": {
       "title": "リワードの請求に失敗しました"
@@ -7529,10 +7452,8 @@
         "predict": "予測",
         "musd_deposit": "mUSDデポジット",
         "apply_referral_bonus": "紹介コードボーナス",
-        "bonus_code": "ボーナスコード",
         "uncategorized_event": "未分類のイベント"
       },
-      "code": "コード",
       "date": "日付",
       "account": "アカウント",
       "bonus": "ボーナス",
@@ -7651,10 +7572,6 @@
       "invalid_code": "無効な紹介コード",
       "apply_button": "紹介コードを適用"
     },
-    "bonus_code": {
-      "input_placeholder": "ボーナスコードを入力してください",
-      "apply_success": "ボーナスコードが適用されました！"
-    },
     "optout": {
       "title": "リワードの進行状況を削除",
       "description": "この操作を行うと、アカウントがリワードプログラムから削除され、すべてのポイントと進行状況が失われます。この操作は元に戻せません。",
@@ -7791,14 +7708,12 @@
     },
     "label": {
       "bridge_fee": "ブリッジ手数料",
-      "provider_fee": "プロバイダーの手数料",
       "network_fee": "ネットワーク手数料",
       "paid_with": "支払方法:",
-      "receive_token": "トークンの受取",
       "retry_button": "再試行してください",
       "total": "合計",
       "account": "アカウント",
-      "received_total": "受取額合計"
+      "received_total": "Received total"
     },
     "summary_title": {
       "bridge_approval": "{{approveSymbol}}を承認",
@@ -7851,15 +7766,14 @@
     "still_connecting_network": "{{networkName}}に引き続き接続中です...",
     "unable_to_connect_network": "{{networkName}}に接続できません。",
     "update_rpc": "RPCを更新",
-    "switch_to_metamask_default_rpc": "MetaMaskのデフォルトRPCに切り替え",
+    "switch_to_metamask_default_rpc": "Switch to MetaMask default RPC",
     "check_network_connectivity": "ネットワーク接続を確認してください。",
     "check_network_connectivity_or": "ネットワーク接続を確認するか、",
-    "updated_to_metamask_default": "MetaMaskのデフォルトに更新されました"
+    "updated_to_metamask_default": "Updated to MetaMask default"
   },
   "trending": {
     "title": "閲覧",
     "trending_tokens": "流行のトークン",
-    "stocks": "株式",
     "price_change": "価格変動",
     "all_networks": "すべてのネットワーク",
     "24h": "24時間",
@@ -8007,8 +7921,8 @@
       }
     },
     "error": {
-      "unable_to_load": "{{section}}を読み込めませんでした",
-      "retry": "再試行"
+      "unable_to_load": "Unable to load {{section}}",
+      "retry": "Retry"
     }
   }
-}
\ No newline at end of file
+}
diff --git a/locales/languages/ko-kr.json b/locales/languages/ko-kr.json
index 2313fe9662d8..1ee186bc10bd 100644
--- a/locales/languages/ko-kr.json
+++ b/locales/languages/ko-kr.json
@@ -582,6 +582,7 @@
     "ok": "확인",
     "cancel": "취소",
     "error": "오류",
+    "open_settings": "설정",
     "attempting_to_scan_with_wallet_locked": "QR 코드 스캔을 시도 중이십니까? 이를 사용하려면 지갑을 잠금 해제해야 합니다.",
     "attempting_sync_from_wallet_error": "확장 프로그램과 동기화를 시도 중인 것 같습니다. 이를 위해서는 기존 지갑을 지워야 합니다. \n\n지우기를 완료한 후 또는 최신 버전의 앱을 재설치한 후 \"MetaMask 확장 프로그램과 동기화\" 옵션을 선택하십시오. 중요! 지갑을 지우기 전에 계정 시드 구문을 백업했는지 확인하십시오."
   },
diff --git a/locales/languages/ko.json b/locales/languages/ko.json
index ad29316e6a65..439af4800908 100644
--- a/locales/languages/ko.json
+++ b/locales/languages/ko.json
@@ -104,8 +104,8 @@
       "title": "자금 부족"
     },
     "insufficient_pay_token_native_post_quote": {
-      "message": "Not enough {{ticker}} to cover fees. Add {{ticker}} to continue.",
-      "title": "Insufficient funds for post quote"
+      "message": "{{ticker}} 잔액이 부족하여 수수료를 지불할 수 없습니다. 계속하려면 {{ticker}}을(를) 추가하세요.",
+      "title": "견적 적용을 위한 잔액이 부족합니다"
     },
     "no_pay_token_quotes": {
       "message": "현재, 이 결제 경로를 이용할 수 없습니다. 금액이나 네트워크, 토큰을 변경해 보세요. 최적의 옵션을 찾아드리겠습니다.",
@@ -1184,7 +1184,6 @@
       "title": "신규 주문",
       "leverage": "레버리지",
       "limit_price": "지정가",
-      "market_price": "시장 가격",
       "enter_price": "가격 입력",
       "trigger_price": "트리거 가격",
       "liquidation_price": "청산 가격",
@@ -1328,7 +1327,6 @@
       "funds_are_available_to_trade": "자금을 거래에 사용할 수 있습니다",
       "close_order_still_active": "종료 주문이 여전히 유효합니다",
       "order_submitted": "주문 제출됨",
-      "submitting_your_trade": "거래 제출 중",
       "order_filled": "주문 체결 완료",
       "order_placed": "주문 접수 완료",
       "order_placement_subtitle": "{{direction}} {{amount}} {{assetSymbol}}",
@@ -1346,26 +1344,14 @@
       "title": "주문 세부 정보",
       "cancel_order": "주문 취소",
       "date": "날짜",
-      "trigger_condition": "트리거 조건",
-      "price": "가격",
       "fee": "수수료",
       "limit_buy": "롱 지정가",
       "limit_price": "지정가",
       "limit_sell": "숏 지정가",
       "market_buy": "롱 시장가",
       "market_sell": "숏 시장가",
-      "market": "시장",
       "open": "미체결",
       "size": "규모",
-      "original_size": "원주문 규모",
-      "order_value": "주문 금액",
-      "reduce_only": "청산 전용",
-      "yes": "예",
-      "no": "아니요",
-      "price_above": "{{price}} 이상의 가격",
-      "price_below": "{{price}} 이하의 가격",
-      "take_profit": "익절",
-      "stop_loss": "손절",
       "status": "상태",
       "view_explorer": "익스플로러에서 보기"
     },
@@ -2197,6 +2183,7 @@
     "available_balance": "사용 가능한 잔액",
     "claim_amount_text": "${{amount}} 수령",
     "claim_winnings_text": "수익금 수령",
+    "claiming_text": "Claiming...",
     "unrealized_pnl_label": "미실현 손익",
     "unrealized_pnl_value": "{{amount}}({{percent}})",
     "unrealized_pnl_error": "불러올 수 없습니다",
@@ -2275,6 +2262,9 @@
           "title": "문제가 발생했습니다",
           "description": "수익금 수령을 진행할 수 없음",
           "try_again": "다시 시도"
+        },
+        "in_progress": {
+          "title": "Claim already in progress"
         }
       }
     },
@@ -2308,7 +2298,6 @@
       "withdrawing_subtitle": "약 1분 후 사용 가능",
       "withdraw_completed": "출금 완료",
       "withdraw_completed_subtitle": "{{amount}} USDC가 지갑으로 전송되었습니다",
-      "withdraw_any_token_completed_subtitle": "{{amount}} {{token}}이(가) 지갑으로 이동했습니다",
       "error_title": "문제가 발생했습니다",
       "error_description": "출금에 실패했습니다",
       "try_again": "다시 시도"
@@ -2440,7 +2429,7 @@
     "add_tokens": "토큰 가져오기",
     "are_you_sure_exit": "Are you sure you want to exit?",
     "import_token": "Would you like to import this token?",
-    "import_tokens": "이 토큰을 가져올까요?",
+    "import_tokens": "Would you like to import these tokens?",
     "tokens_detected_in_account": "계정에서 {{tokenCount}}개의 신규 {{tokensLabel}} 발견됨",
     "token_toast": {
       "tokens_imported_title": "가져온 토큰",
@@ -2705,7 +2694,7 @@
     "decimals_cant_be_empty": "토큰 십진수는 비워둘 수 없습니다.",
     "decimals_is_required": "Decimal is required. Find it on:",
     "no_tokens_found": "해당 이름의 토큰을 찾을 수 없습니다.",
-    "tokens_empty_description": "토큰을 검색하여 가져오기",
+    "tokens_empty_description": "Search for any token and import it",
     "select_token": "토큰 선택",
     "address_must_be_smart_contract": "개인 주소가 탐지되었습니다. 토큰 거래 주소를 입력하세요.",
     "billion_abbreviation": "B",
@@ -2915,10 +2904,6 @@
     "enabling_notifications": "알림 활성화 중...",
     "updating_notifications": "알림 업데이트 중...",
     "updating_account_settings": "계정 설정 업데이트 중...",
-    "reset_notifications_title": "알림 초기화",
-    "reset_notifications_description": "알림 초기화는 알림 스토리지 키를 삭제하고 모든 알림 기록을 초기화한다는 의미입니다. 정말 알림을 초기화하시겠습니까?",
-    "reset_notifications": "알림 초기화",
-    "reset_notifications_success": "알림 스토리지 키 삭제/재생성 및 알림 기록 초기화.",
     "notifications_dismiss_modal": "닫기",
     "select_rpc_url": "RPC URL을 선택하세요",
     "title": "설정",
@@ -3040,9 +3025,9 @@
     "add_rpc_url": "RPC URL 추가",
     "add_block_explorer_url": "블록 탐색기 URL 추가",
     "networks_desc": "맞춤 RPC 네트워크 추가 및 수정",
-    "networks_enabled": "활성화된 네트워크",
-    "networks_test_networks": "테스트 네트워크",
-    "networks_additional": "추가 네트워크",
+    "networks_enabled": "Enabled Networks",
+    "networks_test_networks": "Test Networks",
+    "networks_additional": "Additional Networks",
     "networks_search_placeholder": "네트워크 검색",
     "networks_no_results": "네트워크를 찾을 수 없습니다",
     "network_name_label": "네트워크 이름",
@@ -3062,15 +3047,15 @@
     "network_rpc_networks": "RPC 네트워크",
     "network_add_network": "네트워크 추가",
     "add_chain_title": "네트워크 추가",
-    "add_chain_search_placeholder": "이름별, 체인 ID별, 통화별 검색",
-    "add_chain_loading": "네트워크를 불러오는 중…",
-    "add_chain_error": "네트워크를 불러오지 못했습니다. 다시 시도하세요.",
+    "add_chain_search_placeholder": "Search by name, chain ID, or currency",
+    "add_chain_loading": "Loading networks…",
+    "add_chain_error": "Failed to load networks. Please try again.",
     "add_chain_retry": "다시 시도",
-    "add_chain_added": "추가함",
+    "add_chain_added": "Added",
     "add_chain_or": "또는",
     "add_chain_custom_link": "사용자 지정 네트워크 추가",
     "network_add_custom_network": "사용자 지정 네트워크 추가",
-    "network_add_test_network": "테스트 네트워크 추가",
+    "network_add_test_network": "Add a test network",
     "network_add": "추가",
     "network_save": "저장",
     "remove_network_title": "해당 네트워크를 제거하시겠습니까?",
@@ -3394,9 +3379,11 @@
     ],
     "private_key_explanation": "그러니 이를 안전하게 다른 사람이 볼 수 없게 보관해 놓으시기 바랍니다.",
     "private_key_warning": "이것은 현재 선택된 계정용 개인 키 {{accountName}} 입니다. 이 키를 절대 다른 사람에게 공개하지 마세요. 개인 키를 가지고 있는 사람은 누구든 해당 계정을 완전히 통제할 수 있습니다. 계정의 자금을 다른 곳에 송금할 수도 있습니다.",
-    "seed_phrase_warning_explanation": "다른 사람에게 화면을 보여주지 마세요. MetaMask 지원팀은 해당 정보를 절대 요구하지 않습니다.",
+    "seed_phrase_warning_explanation": [
+      "본인의 화면을 아무도 보지 못하게 하세요.",
+      "MetaMask 지원팀은 절대 개인 키를 알려달라고 요청하지 않습니다."
+    ],
     "private_key_warning_explanation": "이 키를 절대 다른 사람에게 공개하지 마세요. 개인 키를 가지고 있는 사람은 누구든 해당 계정을 완전히 통제할 수 있습니다. 계정의 자금을 다른 곳에 송금할 수도 있습니다.",
-    "reveal_srp_description": "비밀복구구문을 알면 지갑을 완전히 제어할 수 있습니다. 절대로 타인과 공유하지 마세요.",
     "reveal_credential_modal": [
       "{{credentialName}} 사용자 이름으로 ",
       "계정과 자금에 완전히 액세스할 수 있습니다.\n\n이 정보를 아무에게도 알려주지 마세요.\n",
@@ -3428,8 +3415,7 @@
     "srp_text": "비밀복구구문입니다",
     "private_key_text": "개인 키",
     "got_it": "확인",
-    "learn_more": "더 보기",
-    "copied_to_clipboard": "클립보드에 복사되었습니다"
+    "learn_more": "더 보기"
   },
   "screenshot_deterrent": {
     "title": "안전성 알림",
@@ -3810,7 +3796,7 @@
     "transaction_fee_explanation": "거래 수수료는 이 권한과 연관되어 있습니다.",
     "view_details": "세부 사항 확인",
     "view_transaction_details": "트랜잭션 세부 정보 보기",
-    "view_data": "데이터 보기",
+    "view_data": "View data",
     "transaction_details": "트랜잭션 세부 사항",
     "site_url": "사이트 URL",
     "permission_request": "권한 요청",
@@ -3891,7 +3877,7 @@
     "right_button": "지갑 보호하기"
   },
   "add_favorite": {
-    "title": "즐겨찾기 추가",
+    "title": "Add favorite",
     "title_label": "이름",
     "url_label": "URL",
     "add_button": "추가",
@@ -4245,8 +4231,8 @@
   "biometrics": {
     "enable_touchid": "터치 ID로 잠금 해제하시겠습니까?",
     "enable_faceid": "페이스 ID로 잠금 해제하시겠습니까?",
-    "enable_fingerprint": "지문으로 잠금 해제하시겠습니까?",
-    "enable_biometrics": "바이오메트릭으로 잠금 해제하시겠습니까?",
+    "enable_fingerprint": "Unlock with fingerprint?",
+    "enable_biometrics": "Unlock with biometrics?",
     "enable_device_passcode_ios": "기기 비밀번호로 잠금 해제하시겠습니까?",
     "enable_device_passcode_android": "기기 PIN으로 잠금 해제하시겠습니까?"
   },
@@ -4772,7 +4758,7 @@
     "public_address": "공개 주소",
     "public_address_qr_code": "공개 주소",
     "coming_soon": "곧 추가 예정...",
-    "request_payment": "결제 요청",
+    "request_payment": "Request payment",
     "copy": "복사",
     "scan_address": "결제 받은 주소를 스캔하세요",
     "copy_address": "주소 복사"
@@ -4786,8 +4772,8 @@
     "switch_network": "메인넷이나 세폴리아로 전환하세요",
     "card_title": "MetaMask 카드 버튼 항상 표시",
     "card_desc": "MetaMask 카드는 일부 국가의 거주자만 사용할 수 있습니다.",
-    "daimo_demo_title": "DaimoPay 데모 환경 사용",
-    "daimo_demo_desc": "카드 결제를 위해 DaimoPay 데모와 실제 서비스 환경 간을 전환할 수 있습니다."
+    "daimo_demo_title": "Use DaimoPay demo environment",
+    "daimo_demo_desc": "Toggle between DaimoPay demo and production environments for card payments."
   },
   "walletconnect_sessions": {
     "no_active_sessions": "현재 활성화된 세션이 없습니다",
@@ -4800,10 +4786,10 @@
     "close_current_session": "새 세션을 시작하기 전에 현재 세션을 닫아야 합니다."
   },
   "paymentRequest": {
-    "title": "결제 요청",
-    "title_complete": "결제 완료",
+    "title": "Payment request",
+    "title_complete": "Payment complete",
     "confirm": "결제",
-    "cancel": "거절",
+    "cancel": "Decline",
     "is_requesting_you_to_pay": "이(가) 결제를 요청했습니다",
     "total": "총액:"
   },
@@ -4838,7 +4824,6 @@
     "no_payment_methods_available": "사용 가능한 결제 방법이 없습니다.",
     "error_fetching_quotes": "오류가 발생했습니다. 다시 시도해 주세요.",
     "no_quotes_available": "공급자가 없습니다.",
-    "quote_unavailable": "견적을 확인할 수 없습니다.",
     "providers": "공급자",
     "quotes_displayed_for": "{{paymentMethodName}}에 대한 견적이 표시됨",
     "other_options": "Other options",
@@ -4944,10 +4929,10 @@
       "logged_out_error": "로그아웃 오류"
     },
     "token_unavailable_modal": {
-      "title": "이용할 수 없음",
-      "description": "현재 지역의 경우 {{provider}}에서 {{token}}을(를) 지원하지 않습니다.",
-      "change_token": "토큰 변경",
-      "change_provider": "공급자를 변경하세요"
+      "title": "Not available",
+      "description": "{{token}} is not available with {{provider}} in your region.",
+      "change_token": "Change token",
+      "change_provider": "Change provider"
     },
     "provider_picker_modal": {
       "title": "공급업체 변경"
@@ -5185,39 +5170,6 @@
     },
     "deposit_order_title": "{{currency}} 예치"
   },
-  "ramps_order_details": {
-    "title": "주문 세부 정보",
-    "status": "상태",
-    "processing": "처리 중",
-    "complete": "완료",
-    "failed": "실패",
-    "cancelled": "취소됨",
-    "view_on_provider": "{{provider}}에서 보기",
-    "order_id": "주문 ID",
-    "date_and_time": "날짜 및 시간",
-    "fees": "수수료",
-    "total": "총액",
-    "card_processing_info": "카드 결제는 일반적으로 몇 분 내로 처리됩니다",
-    "processing_info_modal_description": "카드 결제는 보통 몇 분 정도 소요됩니다. 문의 사항이 있으면 지원팀에 연락해 주세요.",
-    "go_to_provider_support": "{{provider}} 지원 페이지로 이동",
-    "error_title": "문제가 발생했습니다",
-    "error_message": "주문 정보를 불러올 수 없습니다. 다시 시도하세요.",
-    "try_again": "다시 시도",
-    "close": "닫기"
-  },
-  "ramps_v2": {
-    "notifications": {
-      "purchase_pending_title": "{{cryptocurrency}} 매수 처리 중",
-      "purchase_pending_description": "몇 분 정도 소요됩니다...",
-      "purchase_completed_title": "{{amount}} {{cryptocurrency}} 매수에 성공했습니다!",
-      "purchase_completed_description": "{{cryptocurrency}}을(를) 사용할 수 있습니다",
-      "purchase_failed_title": "{{cryptocurrency}} 구매 실패",
-      "purchase_failed_description": "잠시 후 다시 시도하세요",
-      "purchase_cancelled_title": "매수 주문이 취소되었습니다",
-      "purchase_cancelled_description": "{{cryptocurrency}} 구매가 취소되었습니다",
-      "track": "조회"
-    }
-  },
   "swaps": {
     "title": "스왑",
     "onboarding": {
@@ -5734,15 +5686,12 @@
     "new_wallet_needed_description_part_three": "이런 일이 다시 발생하지 않도록 MetaMask 앱과 OS를 항상 최신 버전으로 업데이트하세요."
   },
   "srp_security_quiz": {
-    "question_step": "총 {{total}}개 중 {{step}}번째 질문",
     "title": "보안 퀴즈",
     "introduction": "비밀복구구문을 찾으려면 두 가지 질문에 올바르게 답해야 합니다",
     "get_started": "지금 시작하세요",
     "learn_more": "더 보기",
     "try_again": "다시 시도",
     "continue": "계속",
-    "correct": "맞습니다!",
-    "incorrect": "틀렸습니다!",
     "of": "따른",
     "question_one": {
       "question": "비밀복구구문을 분실하시면 MetaMask가...",
@@ -5921,8 +5870,8 @@
     "claimable_bonus_tooltip": "The annualized bonus you’ve earned for holding mUSD. Your bonus is claimable daily on Linea.",
     "earn_a_percentage_bonus": "{{percentage}}% 보너스 받기",
     "claimable_bonus": "청구 가능한 보너스",
-    "claim_bonus": "보너스 수령",
-    "claim_bonus_subtitle": "보너스는 {{networkName}}에서 지급됩니다.",
+    "claim_bonus": "Claim bonus",
+    "claim_bonus_subtitle": "Bonus will be paid out on {{networkName}}.",
     "empty_state_cta": {
       "heading": "{{tokenSymbol}} 토큰을 빌려주고 수익을 올리세요",
       "body": "{{protocol}}에서 {{tokenSymbol}}을 예치하고 연간 이자를",
@@ -5933,7 +5882,7 @@
     "service_interruption_banner": {
       "maintenance_message": "현재 점검 중입니다. 빠른 시일 내에 서비스를 재개하겠습니다!"
     },
-    "supply": "공급",
+    "supply": "Supply",
     "deposit": "예치",
     "approve": "승인",
     "approval": "승인",
@@ -5982,7 +5931,7 @@
     "network": "네트워크",
     "health_factor": "청산 위험 지수",
     "liquidation_risk": "청산 위험",
-    "insufficient_pool_liquidity": "풀 유동성 부족",
+    "insufficient_pool_liquidity": "Insufficient pool liquidity",
     "available_to_withdraw": "출금 가능",
     "unknown": "알 수 없음",
     "how_it_works": "작동 원리",
@@ -6001,7 +5950,7 @@
       "lending": "포지션 내역",
       "staking": "지급 내역"
     },
-    "allowance_reset": "허용량 초기화",
+    "allowance_reset": "Allowance reset",
     "tron": {
       "fee": "수수료"
     },
@@ -6009,20 +5958,8 @@
       "ok": "확인",
       "continue": "계속",
       "convert_and_get_percentage_bonus": "전환 후 {{percentage}}% 받기",
-      "your_musd": "내 mUSD",
-      "balance_breakdown_title": "네트워크별 mUSD 잔액",
-      "balance_amount": "{{amount}} mUSD",
-      "balance_amount_with_symbol": "{{amount}} {{symbol}}",
-      "balance_fiat_unavailable": "—",
-      "convert_to_musd": "mUSD로 전환",
       "get_a_percentage_musd_bonus": "{{percentage}}%의 mUSD 보너스 혜택",
       "convert": "전환",
-      "fetching_quote": "견적 가져오기...",
-      "you_convert": "전환 전:",
-      "network_fee": "네트워크 수수료",
-      "earning": "수익 창출",
-      "quick_convert_description": "전체 잔액을 전환할 토큰을 선택하거나 편집 아이콘을 탭하여 사용자 지정 금액을 입력하세요.",
-      "no_tokens_to_convert": "mUSD로 전환할 수 있는 토큰이 없습니다.",
       "toasts": {
         "converting": "{{token}} → mUSD로 전환 중",
         "eta": "~{{time}}",
@@ -6062,7 +5999,7 @@
       "toasts": {
         "claiming": "mUSD 보너스를 처리 중입니다",
         "delivered": "mUSD 보너스가 지급되었습니다!",
-        "failed": "보너스 수령 실패"
+        "failed": "Bonus claim failed"
       }
     },
     "rewards": {
@@ -6073,8 +6010,7 @@
       "tooltip_opted_in_footer": "포인트는 계정에 자동으로 추가됩니다.",
       "tooltip_not_opted_in_footer": "보상 프로그램에 가입하면 포인트를 받을 수 있습니다.",
       "tooltip_close": "닫기"
-    },
-    "your_stablecoins": "사용자의 스테이블코인"
+    }
   },
   "stake": {
     "stake": "Stake",
@@ -6096,7 +6032,9 @@
       "fee": "수수료",
       "errors": {
         "insufficient_balance": "이 작업을 수행하기에 리소스 잔액이 부족합니다."
-      }
+      },
+      "trx_unstaking_in_progress": "{{amount}} TRX 언스테이킹이 진행 중입니다. 언스테이킹에는 14일이 소요됩니다.",
+      "has_claimable_trx": "You can claim {{amount}} TRX. Once claimed you'll get TRX back in your wallet."
     },
     "stake_eth": "ETH 스테이크",
     "unstake_eth": "ETH 언스테이크",
@@ -6574,7 +6512,7 @@
     "hardware_wallet_not_supported": "하드웨어 지갑은 아직 지원되지 않습니다. 핫월렛을 사용하여 계속하세요.",
     "hardware_wallet_not_supported_solana": "솔라나는 아직 하드웨어 지갑이 지원하지 않습니다. 계속하려면 핫월렛을 사용하세요.",
     "price_impact_info_title": "가격 영향",
-    "price_impact_info_description": "가격 영향은 회원님의 스왑 주문이 자산의 시장 가격에 미치는 영향을 나타냅니다. 이는 거래 규모와 풀의 가용 유동성에 따라 달라집니다. MetaMask는 가격 영향에 관여하지 않으며 이를 통제하지도 않습니다.",
+    "price_impact_info_description": "This is how your trade changes the market price of a token. It depends on the trade size, available liquidity, and provider fees. MetaMask doesn't control price impact.",
     "price_impact_info_gasless_description": "가격 영향은 사용자의 스왑 주문이 자산의 시장 가격에 미치는 영향을 의미합니다. 가스비를 지불할 충분한 자금이 없는 경우, 스왑할 토큰 일부가 자동으로 수수료로 사용되므로 가격 영향이 커질 수 있습니다. MetaMask는 가격 영향에 관여하지 않으며 이를 통제하지도 않습니다.",
     "price_impact_warning_description": "This trade has an estimated {{priceImpact}} price impact, which reflects how much your trade changes the market price. The quote already reflects this.",
     "price_impact_high": "High price impact",
@@ -6600,6 +6538,7 @@
     },
     "submit": "제출",
     "default_slippage_description": "가격이 슬리피지 비율보다 더 크게 변동하면 트랜잭션이 처리되지 않습니다.",
+    "cancel": "취소",
     "confirm": "컨펌",
     "exceeding_upper_slippage_warning": "슬리피지가 높아 스왑이 불리한 조건으로 이루어질 수 있습니다",
     "exceeding_lower_slippage_warning": "슬리피지가 높아 스왑이 불리한 조건으로 이루어질 수 있습니다",
@@ -7282,19 +7221,6 @@
       "retry": "다시 시도",
       "on_linea": "Linea 네트워크에서"
     },
-    "cashback_screen": {
-      "title": "캐시백",
-      "available_cashback": "사용 가능한 캐시백",
-      "network_fee": "네트워크 수수료",
-      "expected_to_receive": "예상 수령액",
-      "withdraw": "출금",
-      "withdraw_unavailable": "출금할 수 없음",
-      "withdrawal_initiated": "출금이 시작되었습니다",
-      "withdrawal_success": "성공적으로 출금 완료",
-      "withdrawal_failed": "출금에 실패했습니다. 다시 시도하세요.",
-      "no_cashback": "캐시백을 사용할 수 없음",
-      "loading_error": "캐시백을 불러오지 못했습니다. 다시 시도하세요."
-    },
     "change_asset": {
       "title": "토큰 및 네트워크 변경",
       "full_spending_access": "지출에 대한 전체 접근 권한",
@@ -7469,10 +7395,7 @@
       "service_not_available": "현재 서비스를 이용할 수 없습니다. 잠시 후 다시 시도해 주세요.",
       "invalid_referral_code": "잘못된 추천 코드입니다. 확인 후 다시 입력해 주세요.",
       "already_referred": "이미 다른 사용자의 추천을 받았습니다.",
-      "cannot_use_own_referral_code": "본인의 추천 코드는 사용할 수 없습니다.",
-      "invalid_bonus_code": "잘못된 보너스 코드",
-      "already_redeemed": "이미 이 보너스 코드를 사용하셨습니다",
-      "reached_maximum": "이 보너스 코드는 최대 사용 한도에 도달했습니다"
+      "cannot_use_own_referral_code": "본인의 추천 코드는 사용할 수 없습니다."
     },
     "claim_reward_error": {
       "title": "보상을 수령할 수 없습니다"
@@ -7529,10 +7452,8 @@
         "predict": "예측",
         "musd_deposit": "mUSD 예치",
         "apply_referral_bonus": "추천 코드 보너스",
-        "bonus_code": "보너스 코드",
         "uncategorized_event": "미분류 이벤트"
       },
-      "code": "코드",
       "date": "날짜",
       "account": "계정",
       "bonus": "보너스",
@@ -7651,10 +7572,6 @@
       "invalid_code": "잘못된 추천 코드",
       "apply_button": "추천 코드 적용"
     },
-    "bonus_code": {
-      "input_placeholder": "보너스 코드 입력",
-      "apply_success": "보너스 코드가 적용되었습니다!"
-    },
     "optout": {
       "title": "보상 프로그램 영구 탈퇴",
       "description": "이 작업을 수행하면 보상 프로그램에서 계정이 완전히 삭제되며, 모든 포인트와 진행 상황이 사라집니다. 이 작업은 되돌릴 수 없습니다.",
@@ -7791,14 +7708,12 @@
     },
     "label": {
       "bridge_fee": "브릿지 수수료",
-      "provider_fee": "공급자 수수료",
       "network_fee": "네트워크 수수료",
       "paid_with": "결제 수단:",
-      "receive_token": "토큰 받기",
       "retry_button": "다시 시도",
       "total": "총액",
       "account": "계정",
-      "received_total": "총 수령액"
+      "received_total": "Received total"
     },
     "summary_title": {
       "bridge_approval": "{{approveSymbol}} 승인",
@@ -7851,15 +7766,14 @@
     "still_connecting_network": "아직 {{networkName}}에 연결 중입니다...",
     "unable_to_connect_network": "{{networkName}}에 연결할 수 없습니다.",
     "update_rpc": "RPC 업데이트",
-    "switch_to_metamask_default_rpc": "MetaMask 기본 RPC로 전환",
+    "switch_to_metamask_default_rpc": "Switch to MetaMask default RPC",
     "check_network_connectivity": "네트워크 연결을 확인하세요.",
     "check_network_connectivity_or": "네트워크 연결을 확인하거나",
-    "updated_to_metamask_default": "MetaMask 기본값으로 업데이트함"
+    "updated_to_metamask_default": "Updated to MetaMask default"
   },
   "trending": {
     "title": "둘러보기",
     "trending_tokens": "인기 토큰",
-    "stocks": "주식",
     "price_change": "가격 변동",
     "all_networks": "모든 네트워크",
     "24h": "24시간",
@@ -8007,8 +7921,8 @@
       }
     },
     "error": {
-      "unable_to_load": "{{section}} 불러올 수 없음",
-      "retry": "다시 시도"
+      "unable_to_load": "Unable to load {{section}}",
+      "retry": "Retry"
     }
   }
-}
\ No newline at end of file
+}
diff --git a/locales/languages/pt-br.json b/locales/languages/pt-br.json
index 7ad0976e19bd..3922b24b723b 100644
--- a/locales/languages/pt-br.json
+++ b/locales/languages/pt-br.json
@@ -582,6 +582,7 @@
     "ok": "OK",
     "cancel": "Cancelar",
     "error": "Erro",
+    "open_settings": "Configurações",
     "attempting_to_scan_with_wallet_locked": "Parece que você está tentando escanear um código QR. Você deve destravar sua carteira para conseguir usá-la.",
     "attempting_sync_from_wallet_error": "Parece que você está tentando sincronizar com uma extensão. Para fazê-lo, você precisará excluir sua carteira atual. \n\nApós ter excluído ou reinstalado uma versão mais recente do app, selecione a opção para \"Sincronizar com a Extensão MetaMask\". Importante! Antes de excluir a sua carteira, certifique-se de ter feito uma cópia de segurança da sua Frase de Recuperação Secreta."
   },
diff --git a/locales/languages/pt.json b/locales/languages/pt.json
index 3466543dd817..ac361f4a04f1 100644
--- a/locales/languages/pt.json
+++ b/locales/languages/pt.json
@@ -104,8 +104,8 @@
       "title": "Fundos insuficientes"
     },
     "insufficient_pay_token_native_post_quote": {
-      "message": "Not enough {{ticker}} to cover fees. Add {{ticker}} to continue.",
-      "title": "Insufficient funds for post quote"
+      "message": "Não há {{ticker}} suficiente para cobrir as taxas. Adicione {{ticker}} para continuar.",
+      "title": "Fundos insuficientes para colocar cotação"
     },
     "no_pay_token_quotes": {
       "message": "Esta rota de pagamento não está disponível no momento. Experimente mudar o valor, a rede ou o token, e encontraremos a melhor opção.",
@@ -1184,7 +1184,6 @@
       "title": "Nova ordem",
       "leverage": "Alavancagem",
       "limit_price": "Preço limite",
-      "market_price": "Preço de mercado",
       "enter_price": "Insira o preço",
       "trigger_price": "Preço de disparo",
       "liquidation_price": "Preço de liquidação",
@@ -1328,7 +1327,6 @@
       "funds_are_available_to_trade": "Os fundos estão disponíveis para negociação",
       "close_order_still_active": "Ordem de encerramento ainda ativa",
       "order_submitted": "Ordem enviada",
-      "submitting_your_trade": "Enviando sua negociação",
       "order_filled": "Ordem executada",
       "order_placed": "Ordem realizada",
       "order_placement_subtitle": "{{direction}} {{amount}} {{assetSymbol}}",
@@ -1346,26 +1344,14 @@
       "title": "Detalhes da ordem",
       "cancel_order": "Cancelar ordem",
       "date": "Data",
-      "trigger_condition": "Condição de acionamento",
-      "price": "Preço",
       "fee": "Taxa",
       "limit_buy": "Limitar posição long",
       "limit_price": "Preço limite",
       "limit_sell": "Limitar posição short",
       "market_buy": "Compra a mercado",
       "market_sell": "Mercado short",
-      "market": "Mercado",
       "open": "Abrir",
       "size": "Tamanho",
-      "original_size": "Tamanho original",
-      "order_value": "Valor da ordem",
-      "reduce_only": "Reduzir apenas",
-      "yes": "Sim",
-      "no": "Não",
-      "price_above": "Preço acima de {{price}}",
-      "price_below": "Preço abaixo de {{price}}",
-      "take_profit": "Take profit",
-      "stop_loss": "Stop loss",
       "status": "Status",
       "view_explorer": "Ver no Explorer"
     },
@@ -2197,6 +2183,7 @@
     "available_balance": "Saldo disponível",
     "claim_amount_text": "Resgatar $ {{amount}}",
     "claim_winnings_text": "Resgatar ganhos",
+    "claiming_text": "Claiming...",
     "unrealized_pnl_label": "P&L não realizados",
     "unrealized_pnl_value": "{{amount}} ({{percent}})",
     "unrealized_pnl_error": "Não foi possível carregar",
@@ -2275,6 +2262,9 @@
           "title": "Ocorreu algum erro",
           "description": "Falha ao continuar com o resgate",
           "try_again": "Tentar novamente"
+        },
+        "in_progress": {
+          "title": "Claim already in progress"
         }
       }
     },
@@ -2308,7 +2298,6 @@
       "withdrawing_subtitle": "Disponível em cerca de 1 minuto",
       "withdraw_completed": "Saque concluído",
       "withdraw_completed_subtitle": "{{amount}} USDC transferidos para sua carteira",
-      "withdraw_any_token_completed_subtitle": "{{amount}} {{token}} transferidos para sua carteira",
       "error_title": "Ocorreu algum erro",
       "error_description": "Falha ao continuar com a retirada",
       "try_again": "Tentar novamente"
@@ -2440,7 +2429,7 @@
     "add_tokens": "Importar tokens",
     "are_you_sure_exit": "Are you sure you want to exit?",
     "import_token": "Would you like to import this token?",
-    "import_tokens": "Deseja importar esses tokens?",
+    "import_tokens": "Would you like to import these tokens?",
     "tokens_detected_in_account": "{{tokenCount}} novo(s) {{tokensLabel}} encontrado(s) nesta conta",
     "token_toast": {
       "tokens_imported_title": "Tokens importados",
@@ -2705,7 +2694,7 @@
     "decimals_cant_be_empty": "Os números decimais do token não podem ficar em branco.",
     "decimals_is_required": "Decimal is required. Find it on:",
     "no_tokens_found": "Não encontramos nenhum token com esse nome.",
-    "tokens_empty_description": "Procure qualquer token e importe-o",
+    "tokens_empty_description": "Search for any token and import it",
     "select_token": "Selecionar token",
     "address_must_be_smart_contract": "Endereço pessoal detectado. Insira o endereço do contrato do token.",
     "billion_abbreviation": "B",
@@ -2915,10 +2904,6 @@
     "enabling_notifications": "Ativando notificações...",
     "updating_notifications": "Atualizando notificações...",
     "updating_account_settings": "Atualizando configurações da conta...",
-    "reset_notifications_title": "Redefinir notificações",
-    "reset_notifications_description": "Redefinir as notificações significa que você está excluindo suas chaves de armazenamento de notificações e redefinindo todo o seu histórico de notificações. Tem certeza de que deseja fazer isso?",
-    "reset_notifications": "Redefinir notificações",
-    "reset_notifications_success": "Chave de armazenamento de notificações excluída/recriada e histórico de notificações redefinido.",
     "notifications_dismiss_modal": "Ignorar",
     "select_rpc_url": "Selecionar URL da RPC",
     "title": "Configurações",
@@ -3040,9 +3025,9 @@
     "add_rpc_url": "Adicionar URL da RPC",
     "add_block_explorer_url": "Adicionar URL do explorador de blocos",
     "networks_desc": "Adicione e edite redes RPC personalizadas",
-    "networks_enabled": "Redes habilitadas",
-    "networks_test_networks": "Redes de teste",
-    "networks_additional": "Redes adicionais",
+    "networks_enabled": "Enabled Networks",
+    "networks_test_networks": "Test Networks",
+    "networks_additional": "Additional Networks",
     "networks_search_placeholder": "Pesquisar redes",
     "networks_no_results": "Nenhuma rede encontrada",
     "network_name_label": "Nome da rede",
@@ -3062,15 +3047,15 @@
     "network_rpc_networks": "Redes RPC",
     "network_add_network": "Adicionar rede",
     "add_chain_title": "Adicionar uma rede",
-    "add_chain_search_placeholder": "Pesquisar por nome, ID da rede ou moeda",
-    "add_chain_loading": "Carregando redes…",
-    "add_chain_error": "Não foi possível carregar redes. Tente novamente.",
+    "add_chain_search_placeholder": "Search by name, chain ID, or currency",
+    "add_chain_loading": "Loading networks…",
+    "add_chain_error": "Failed to load networks. Please try again.",
     "add_chain_retry": "Tentar novamente",
-    "add_chain_added": "Adicionado",
+    "add_chain_added": "Added",
     "add_chain_or": "ou",
     "add_chain_custom_link": "Adicionar uma rede personalizada",
     "network_add_custom_network": "Adicionar uma rede personalizada",
-    "network_add_test_network": "Adicionar uma rede de teste",
+    "network_add_test_network": "Add a test network",
     "network_add": "Adicionar",
     "network_save": "Salvar",
     "remove_network_title": "Deseja remover essa rede?",
@@ -3394,9 +3379,11 @@
     ],
     "private_key_explanation": "Guarde-a em um lugar seguro e secreto.",
     "private_key_warning": "Esta é a chave privada da conta atual selecionada: {{accountName}}. Nunca divulgue esta chave. Qualquer pessoa que tiver a chave privada poderá controlar totalmente a sua conta, inclusive retirar seus fundos.",
-    "seed_phrase_warning_explanation": "Certifique-se de que ninguém esteja olhando para a sua tela. O Suporte da MetaMask nunca solicitará isso.",
+    "seed_phrase_warning_explanation": [
+      "Certifique-se de que não há ninguém olhando para a sua tela. ",
+      "O suporte da MetaMask nunca solicitará essa informação."
+    ],
     "private_key_warning_explanation": "Nunca divulgue esta chave. Qualquer pessoa que tiver a chave privada poderá controlar totalmente a sua conta, inclusive retirar seus fundos.",
-    "reveal_srp_description": "Sua Frase de Recuperação Secreta concede acesso total à sua carteira. Não a compartilhe com ninguém.",
     "reveal_credential_modal": [
       "Sua {{credentialName}} oferece ",
       "acesso total à sua conta e fundos.\n\nNão compartilhe com ninguém.\n",
@@ -3428,8 +3415,7 @@
     "srp_text": "Frase de recuperação secreta",
     "private_key_text": "Chave privada",
     "got_it": "Entendi",
-    "learn_more": "Saiba mais",
-    "copied_to_clipboard": "Copiado para a área de transferência"
+    "learn_more": "Saiba mais"
   },
   "screenshot_deterrent": {
     "title": "Alerta de segurança",
@@ -3810,7 +3796,7 @@
     "transaction_fee_explanation": "Há uma taxa de transação associada a esta permissão.",
     "view_details": "Ver detalhes",
     "view_transaction_details": "Ver detalhes da transação",
-    "view_data": "Visualizar dados",
+    "view_data": "View data",
     "transaction_details": "Detalhes da transação",
     "site_url": "URL do site",
     "permission_request": "Solicitação de permissão",
@@ -3891,7 +3877,7 @@
     "right_button": "Proteger carteira"
   },
   "add_favorite": {
-    "title": "Adicionar favorito",
+    "title": "Add favorite",
     "title_label": "Nome",
     "url_label": "URL",
     "add_button": "Adicionar",
@@ -4245,8 +4231,8 @@
   "biometrics": {
     "enable_touchid": "Desbloquear com Touch ID?",
     "enable_faceid": "Desbloquear com Face ID?",
-    "enable_fingerprint": "Desbloquear com impressão digital?",
-    "enable_biometrics": "Desbloquear com biometria?",
+    "enable_fingerprint": "Unlock with fingerprint?",
+    "enable_biometrics": "Unlock with biometrics?",
     "enable_device_passcode_ios": "Desbloquear com o código de acesso do dispositivo?",
     "enable_device_passcode_android": "Desbloquear com o PIN do dispositivo?"
   },
@@ -4772,7 +4758,7 @@
     "public_address": "Endereço público",
     "public_address_qr_code": "Endereço público",
     "coming_soon": "Em breve...",
-    "request_payment": "Solicitar pagamento",
+    "request_payment": "Request payment",
     "copy": "Copiar",
     "scan_address": "Leia o endereço para receber um pagamento",
     "copy_address": "Copiar endereço"
@@ -4786,8 +4772,8 @@
     "switch_network": "Alterne para a Mainnet ou Sepolia",
     "card_title": "Sempre exibir o botão do cartão MetaMask",
     "card_desc": "O cartão MetaMask só está disponível para residentes de países selecionados.",
-    "daimo_demo_title": "Utilize o ambiente de demonstração do DaimoPay",
-    "daimo_demo_desc": "Alternar entre os ambientes de demonstração e produção do DaimoPay para pagamentos com cartão."
+    "daimo_demo_title": "Use DaimoPay demo environment",
+    "daimo_demo_desc": "Toggle between DaimoPay demo and production environments for card payments."
   },
   "walletconnect_sessions": {
     "no_active_sessions": "Você não tem nenhuma sessão ativa",
@@ -4800,10 +4786,10 @@
     "close_current_session": "Encerre a sessão atual antes de iniciar outra."
   },
   "paymentRequest": {
-    "title": "Solicitação de pagamento",
-    "title_complete": "Pagamento concluído",
+    "title": "Payment request",
+    "title_complete": "Payment complete",
     "confirm": "Pagar",
-    "cancel": "Recusar",
+    "cancel": "Decline",
     "is_requesting_you_to_pay": "está solicitando que você pague",
     "total": "Total:"
   },
@@ -4838,7 +4824,6 @@
     "no_payment_methods_available": "Nenhum método de pagamento disponível.",
     "error_fetching_quotes": "Algo deu errado. Tente novamente.",
     "no_quotes_available": "Nenhum provedor disponível.",
-    "quote_unavailable": "Cotação não disponível.",
     "providers": "Fornecedores",
     "quotes_displayed_for": "Cotações exibidas para {{paymentMethodName}}.",
     "other_options": "Other options",
@@ -4944,10 +4929,10 @@
       "logged_out_error": "Erro ao desconectar"
     },
     "token_unavailable_modal": {
-      "title": "Não disponível",
-      "description": "O token {{token}} não está disponível com o provedor {{provider}} em sua região.",
-      "change_token": "Alterar token",
-      "change_provider": "Alterar fornecedor"
+      "title": "Not available",
+      "description": "{{token}} is not available with {{provider}} in your region.",
+      "change_token": "Change token",
+      "change_provider": "Change provider"
     },
     "provider_picker_modal": {
       "title": "Escolher um provedor"
@@ -5185,39 +5170,6 @@
     },
     "deposit_order_title": "Depósito em {{currency}}"
   },
-  "ramps_order_details": {
-    "title": "Detalhes da ordem",
-    "status": "Status",
-    "processing": "Em processamento",
-    "complete": "Concluído",
-    "failed": "Falha",
-    "cancelled": "Cancelado",
-    "view_on_provider": "Ver no {{provider}}",
-    "order_id": "ID do pedido",
-    "date_and_time": "Data e hora",
-    "fees": "Taxas",
-    "total": "Total",
-    "card_processing_info": "Compras no cartão normalmente levam alguns minutos",
-    "processing_info_modal_description": "Compras com cartão geralmente levam alguns minutos. Entre em contato com o suporte em caso de dúvidas.",
-    "go_to_provider_support": "Acesse a página de suporte do {{provider}}",
-    "error_title": "Ocorreu algum erro",
-    "error_message": "Não foi possível carregar os detalhes do pedido. Tente novamente.",
-    "try_again": "Tentar novamente",
-    "close": "Fechar"
-  },
-  "ramps_v2": {
-    "notifications": {
-      "purchase_pending_title": "Processando sua compra de {{cryptocurrency}}",
-      "purchase_pending_description": "Isso deve levar apenas alguns minutos...",
-      "purchase_completed_title": "Sua compra de {{amount}} {{cryptocurrency}} foi bem-sucedida!",
-      "purchase_completed_description": "Seu {{cryptocurrency}} já está disponível",
-      "purchase_failed_title": "A compra de {{cryptocurrency}} falhou",
-      "purchase_failed_description": "Tente novamente daqui a pouco",
-      "purchase_cancelled_title": "Sua compra foi cancelada",
-      "purchase_cancelled_description": "Sua compra de {{cryptocurrency}} foi cancelada",
-      "track": "Rastrear"
-    }
-  },
   "swaps": {
     "title": "Troca",
     "onboarding": {
@@ -5734,15 +5686,12 @@
     "new_wallet_needed_description_part_three": "Para evitar que isso ocorra novamente, certifique-se de sempre manter seu app MetaMask e sistema operacional atualizados com a última versão."
   },
   "srp_security_quiz": {
-    "question_step": "Questão {{step}} de {{total}}",
     "title": "Questionário de segurança",
     "introduction": "Para revelar sua Frase de Recuperação Secreta, você precisa responder corretamente duas perguntas.",
     "get_started": "Começar",
     "learn_more": "Saiba mais",
     "try_again": "Tentar novamente",
     "continue": "Continuar",
-    "correct": "Correto!",
-    "incorrect": "Incorreto!",
     "of": "de",
     "question_one": {
       "question": "Se você perder sua Frase de Recuperação Secreta, a MetaMask...",
@@ -5921,8 +5870,8 @@
     "claimable_bonus_tooltip": "The annualized bonus you’ve earned for holding mUSD. Your bonus is claimable daily on Linea.",
     "earn_a_percentage_bonus": "Ganhe um bônus de {{percentage}}%",
     "claimable_bonus": "Bônus resgatável",
-    "claim_bonus": "Resgatar bônus",
-    "claim_bonus_subtitle": "O bônus será pago em {{networkName}}.",
+    "claim_bonus": "Claim bonus",
+    "claim_bonus_subtitle": "Bonus will be paid out on {{networkName}}.",
     "empty_state_cta": {
       "heading": "Empreste {{tokenSymbol}} e ganhe",
       "body": "Empreste seus {{tokenSymbol}} com {{protocol}} e ganhe",
@@ -5933,7 +5882,7 @@
     "service_interruption_banner": {
       "maintenance_message": "Estamos em manutenção. Estaremos on-line novamente em breve!"
     },
-    "supply": "Fornecimento",
+    "supply": "Supply",
     "deposit": "Depositar",
     "approve": "Aprovar",
     "approval": "Aprovação",
@@ -5982,7 +5931,7 @@
     "network": "Rede",
     "health_factor": "Fator de saúde",
     "liquidation_risk": "Risco de liquidação",
-    "insufficient_pool_liquidity": "Liquidez do pool insuficiente",
+    "insufficient_pool_liquidity": "Insufficient pool liquidity",
     "available_to_withdraw": "disponível para sacar",
     "unknown": "desconhecido",
     "how_it_works": "Como funciona",
@@ -6001,7 +5950,7 @@
       "lending": "Histórico de posições",
       "staking": "Histórico de pagamentos"
     },
-    "allowance_reset": "Redefinição de limite",
+    "allowance_reset": "Allowance reset",
     "tron": {
       "fee": "Taxa"
     },
@@ -6009,20 +5958,8 @@
       "ok": "OK",
       "continue": "Continuar",
       "convert_and_get_percentage_bonus": "Converta e ganhe {{percentage}}%",
-      "your_musd": "Seu mUSD",
-      "balance_breakdown_title": "Seus saldos em mUSD por rede",
-      "balance_amount": "{{amount}} mUSD",
-      "balance_amount_with_symbol": "{{amount}} {{symbol}}",
-      "balance_fiat_unavailable": "—",
-      "convert_to_musd": "Converter para mUSD",
       "get_a_percentage_musd_bonus": "Ganhe {{percentage}}% de bônus em mUSD",
       "convert": "Converter",
-      "fetching_quote": "Buscando cotação...",
-      "you_convert": "Você converte",
-      "network_fee": "Taxa de rede",
-      "earning": "Ganho",
-      "quick_convert_description": "Selecione um token para converter todo o seu saldo ou toque no ícone de edição para inserir um valor personalizado.",
-      "no_tokens_to_convert": "Você não possui nenhum token que possa ser convertido em mUSD.",
       "toasts": {
         "converting": "Convertendo {{token}} → mUSD",
         "eta": "~{{time}}",
@@ -6062,7 +5999,7 @@
       "toasts": {
         "claiming": "Seu bônus em mUSD está sendo processado",
         "delivered": "Seu bônus em mUSD chegou!",
-        "failed": "Resgate de bônus falhou"
+        "failed": "Bonus claim failed"
       }
     },
     "rewards": {
@@ -6073,8 +6010,7 @@
       "tooltip_opted_in_footer": "Pontos serão adicionados automaticamente à sua conta.",
       "tooltip_not_opted_in_footer": "Inscreva-se no programa de recompensas para receber seus pontos.",
       "tooltip_close": "Fechar"
-    },
-    "your_stablecoins": "Suas stablecoins"
+    }
   },
   "stake": {
     "stake": "Stake",
@@ -6096,7 +6032,9 @@
       "fee": "Taxa",
       "errors": {
         "insufficient_balance": "Você não possui saldo de recursos suficiente para realizar esta ação."
-      }
+      },
+      "trx_unstaking_in_progress": "Desfazer staking de {{amount}} TRX em andamento. O processo de desfazer staking leva 14 dias.",
+      "has_claimable_trx": "You can claim {{amount}} TRX. Once claimed you'll get TRX back in your wallet."
     },
     "stake_eth": "Fazer staking de ETH",
     "unstake_eth": "Retirar ETH do staking",
@@ -6574,7 +6512,7 @@
     "hardware_wallet_not_supported": "Ainda não oferecemos suporte a carteiras de hardware. Use uma hot wallet para continuar.",
     "hardware_wallet_not_supported_solana": "Carteiras de hardware ainda não são compatíveis com Solana. Use uma hot wallet para continuar.",
     "price_impact_info_title": "Impacto do preço",
-    "price_impact_info_description": "O impacto no preço reflete como sua ordem de troca afeta o preço de mercado do ativo. Ele depende do tamanho da negociação e da liquidez disponível no pool. A MetaMask não influencia nem controla o impacto no preço.",
+    "price_impact_info_description": "This is how your trade changes the market price of a token. It depends on the trade size, available liquidity, and provider fees. MetaMask doesn't control price impact.",
     "price_impact_info_gasless_description": "O impacto no preço reflete como sua ordem de troca afeta o preço de mercado do ativo. Se você não tiver fundos suficientes para o gás, parte do seu token de origem será automaticamente alocada para cobrir taxas, o que aumenta o impacto no preço. A MetaMask não influencia nem controla o impacto no preço.",
     "price_impact_warning_description": "This trade has an estimated {{priceImpact}} price impact, which reflects how much your trade changes the market price. The quote already reflects this.",
     "price_impact_high": "High price impact",
@@ -6600,6 +6538,7 @@
     },
     "submit": "Enviar",
     "default_slippage_description": "Sua transação não será concluída se a variação de preço for maior que a porcentagem de slippage.",
+    "cancel": "Cancelar",
     "confirm": "Confirmar",
     "exceeding_upper_slippage_warning": "Slippage elevado, que pode resultar em swap desfavorável",
     "exceeding_lower_slippage_warning": "Slippage reduzido, que pode resultar em swap desfavorável",
@@ -7282,19 +7221,6 @@
       "retry": "Tentar novamente",
       "on_linea": "na Linea"
     },
-    "cashback_screen": {
-      "title": "Cashback",
-      "available_cashback": "Cashback disponível",
-      "network_fee": "Taxa de rede",
-      "expected_to_receive": "Recebimento previsto",
-      "withdraw": "Sacar",
-      "withdraw_unavailable": "Saque indisponível",
-      "withdrawal_initiated": "O processo de saque foi iniciado",
-      "withdrawal_success": "Saque concluído com sucesso",
-      "withdrawal_failed": "Saque falhou. Tente novamente.",
-      "no_cashback": "Sem cashback disponível",
-      "loading_error": "Falha ao carregar cashback. Tente novamente."
-    },
     "change_asset": {
       "title": "Alterar token e rede",
       "full_spending_access": "Acesso total aos gastos",
@@ -7469,10 +7395,7 @@
       "service_not_available": "Serviço não disponível no momento. Tente novamente em instantes.",
       "invalid_referral_code": "Código de indicação inválido. Verifique e tente novamente.",
       "already_referred": "Você já foi indicado por outro usuário.",
-      "cannot_use_own_referral_code": "Você não pode usar seu próprio código de indicação.",
-      "invalid_bonus_code": "Código de bônus inválido",
-      "already_redeemed": "Você já resgatou este código de bônus",
-      "reached_maximum": "Este código de bônus atingiu o número máximo de utilizações"
+      "cannot_use_own_referral_code": "Você não pode usar seu próprio código de indicação."
     },
     "claim_reward_error": {
       "title": "Falha ao resgatar a recompensa"
@@ -7529,10 +7452,8 @@
         "predict": "Previsão",
         "musd_deposit": "Depósito em mUSD",
         "apply_referral_bonus": "Bônus de código de indicação",
-        "bonus_code": "Código de bônus",
         "uncategorized_event": "Evento não categorizado"
       },
-      "code": "Código",
       "date": "Data",
       "account": "Conta",
       "bonus": "Bônus",
@@ -7651,10 +7572,6 @@
       "invalid_code": "Código de indicação inválido",
       "apply_button": "Aplicar código de indicação"
     },
-    "bonus_code": {
-      "input_placeholder": "Inserir código de bônus",
-      "apply_success": "Código de bônus aplicado!"
-    },
     "optout": {
       "title": "Sair do programa de recompensas",
       "description": "Essa ação removerá suas contas do programa de recompensas e apagará seus pontos e progresso. Essa ação não poderá ser desfeita.",
@@ -7791,14 +7708,12 @@
     },
     "label": {
       "bridge_fee": "Taxa de ponte",
-      "provider_fee": "Taxa do provedor",
       "network_fee": "Taxa de rede",
       "paid_with": "Paga com",
-      "receive_token": "Receber token",
       "retry_button": "Tentar novamente",
       "total": "Total",
       "account": "Conta",
-      "received_total": "Total recebido"
+      "received_total": "Received total"
     },
     "summary_title": {
       "bridge_approval": "Aprovar {{approveSymbol}}",
@@ -7851,15 +7766,14 @@
     "still_connecting_network": "Ainda conectando-se à {{networkName}}...",
     "unable_to_connect_network": "Não é possível conectar-se à {{networkName}}.",
     "update_rpc": "Atualizar RPC",
-    "switch_to_metamask_default_rpc": "Alternar para o RPC padrão da MetaMask",
+    "switch_to_metamask_default_rpc": "Switch to MetaMask default RPC",
     "check_network_connectivity": "Verifique a conexão de sua rede.",
     "check_network_connectivity_or": "Verifique a conexão de sua rede ou",
-    "updated_to_metamask_default": "Atualizado para o padrão da MetaMask"
+    "updated_to_metamask_default": "Updated to MetaMask default"
   },
   "trending": {
     "title": "Explorar",
     "trending_tokens": "Tokens em alta",
-    "stocks": "Ações",
     "price_change": "Variação de preço",
     "all_networks": "Todas as redes",
     "24h": "24h",
@@ -8007,8 +7921,8 @@
       }
     },
     "error": {
-      "unable_to_load": "Não foi possível carregar {{section}}",
-      "retry": "Tentar novamente"
+      "unable_to_load": "Unable to load {{section}}",
+      "retry": "Retry"
     }
   }
-}
\ No newline at end of file
+}
diff --git a/locales/languages/ru-ru.json b/locales/languages/ru-ru.json
index f064b3e261de..3ba2d8bacef5 100644
--- a/locales/languages/ru-ru.json
+++ b/locales/languages/ru-ru.json
@@ -582,6 +582,7 @@
     "ok": "ОК",
     "cancel": "Отмена",
     "error": "Ошибка",
+    "open_settings": "Настройки",
     "attempting_to_scan_with_wallet_locked": "Похоже, вы пытаетесь отсканировать QR-код. Чтобы использовать его, нужно разблокировать кошелек.",
     "attempting_sync_from_wallet_error": "Похоже, вы пытаетесь выполнить синхронизацию с расширением. Сначала нужно удалить текущий кошелек. \n\nКогда вы удалите кошелек или установите новую версию приложения, выберите параметр «Синхронизировать с расширением MetaMask». Важно! Прежде чем удалять кошелек, создайте резервную копию секретной фразы восстановления."
   },
diff --git a/locales/languages/ru.json b/locales/languages/ru.json
index d0859bb41995..5e32bd233e34 100644
--- a/locales/languages/ru.json
+++ b/locales/languages/ru.json
@@ -104,8 +104,8 @@
       "title": "Недостаточно средств"
     },
     "insufficient_pay_token_native_post_quote": {
-      "message": "Not enough {{ticker}} to cover fees. Add {{ticker}} to continue.",
-      "title": "Insufficient funds for post quote"
+      "message": "Недостаточно {{ticker}} для покрытия комиссий. Добавьте {{ticker}}, чтобы продолжить.",
+      "title": "Недостаточно средств для публикации котировки"
     },
     "no_pay_token_quotes": {
       "message": "Этот путь оплаты сейчас недоступен. Попробуйте изменить сумму, сеть или токен, и мы подберём оптимальный вариант.",
@@ -1184,7 +1184,6 @@
       "title": "Новый ордер",
       "leverage": "Кредитное плечо",
       "limit_price": "Предельная цена",
-      "market_price": "Рыночная цена",
       "enter_price": "Введите цену",
       "trigger_price": "Триггерная цена",
       "liquidation_price": "Цена ликвидации",
@@ -1328,7 +1327,6 @@
       "funds_are_available_to_trade": "Средства доступны для торговли",
       "close_order_still_active": "Закрытие ордера все еще активно",
       "order_submitted": "Ордер отправлен",
-      "submitting_your_trade": "Ваша сделка отправляется",
       "order_filled": "Ордер выполнен",
       "order_placed": "Ордер размещен",
       "order_placement_subtitle": "{{direction}} {{amount}} {{assetSymbol}}",
@@ -1346,26 +1344,14 @@
       "title": "Информация об ордере",
       "cancel_order": "Отменить ордер",
       "date": "Дата",
-      "trigger_condition": "Условие срабатывания",
-      "price": "Цена",
       "fee": "Комиссия",
       "limit_buy": "Ограничить длинные",
       "limit_price": "Предельная цена",
       "limit_sell": "Ограничить короткие",
       "market_buy": "Рыночная длинная",
       "market_sell": "Рыночная короткая",
-      "market": "Рынок",
       "open": "Открыть",
       "size": "Размер",
-      "original_size": "Исходный размер",
-      "order_value": "Стоимость ордера",
-      "reduce_only": "Только уменьшить",
-      "yes": "Да",
-      "no": "Нет",
-      "price_above": "Цена выше {{price}}",
-      "price_below": "Цена ниже {{price}}",
-      "take_profit": "Тейк-профит",
-      "stop_loss": "Стоп-лосс",
       "status": "Статус",
       "view_explorer": "Смотреть в Обозревателе"
     },
@@ -2197,6 +2183,7 @@
     "available_balance": "Доступный баланс",
     "claim_amount_text": "Получить {{amount}} $",
     "claim_winnings_text": "Получить выигрыши",
+    "claiming_text": "Claiming...",
     "unrealized_pnl_label": "Нереализованные П/У",
     "unrealized_pnl_value": "{{amount}} ({{percent}})",
     "unrealized_pnl_error": "Не удалось загрузить",
@@ -2275,6 +2262,9 @@
           "title": "Что-то пошло не так",
           "description": "Не удалось востребовать",
           "try_again": "Повторить попытку"
+        },
+        "in_progress": {
+          "title": "Claim already in progress"
         }
       }
     },
@@ -2308,7 +2298,6 @@
       "withdrawing_subtitle": "Доступно примерно через 1 минуту",
       "withdraw_completed": "Вывод средств завершен",
       "withdraw_completed_subtitle": "{{amount}} USDC переведены в ваш кошелек",
-      "withdraw_any_token_completed_subtitle": "{{amount}} {{token}} переведены в ваш кошелек",
       "error_title": "Что-то пошло не так",
       "error_description": "Не удалось продолжить вывод средств",
       "try_again": "Повторить попытку"
@@ -2440,7 +2429,7 @@
     "add_tokens": "Импорт токенов",
     "are_you_sure_exit": "Are you sure you want to exit?",
     "import_token": "Would you like to import this token?",
-    "import_tokens": "Хотите импортировать эти токены?",
+    "import_tokens": "Would you like to import these tokens?",
     "tokens_detected_in_account": "{{tokenCount}} новый {{tokensLabel}} найден в этом счете",
     "token_toast": {
       "tokens_imported_title": "Импортированные токены",
@@ -2705,7 +2694,7 @@
     "decimals_cant_be_empty": "Десятичные знаки токена не могут быть пустыми.",
     "decimals_is_required": "Decimal is required. Find it on:",
     "no_tokens_found": "нам не удалось найти токены с таким именем.",
-    "tokens_empty_description": "Найдите любой токен и импортируйте его",
+    "tokens_empty_description": "Search for any token and import it",
     "select_token": "Выбрать токен",
     "address_must_be_smart_contract": "Обнаружен личный адрес. Введите адрес контракта токена.",
     "billion_abbreviation": "Б",
@@ -2915,10 +2904,6 @@
     "enabling_notifications": "Включение уведомлений...",
     "updating_notifications": "Обновление уведомлений...",
     "updating_account_settings": "Обновление настроек счета…",
-    "reset_notifications_title": "Сбросить уведомления",
-    "reset_notifications_description": "Сброс уведомлений приведет к удалению ключей хранения уведомлений и сбросу всей истории уведомлений. Уверены, что хотите это сделать?",
-    "reset_notifications": "Сбросить уведомления",
-    "reset_notifications_success": "Ключ хранения уведомлений удален и/или создан заново, а история уведомлений сброшена.",
     "notifications_dismiss_modal": "Отклонить",
     "select_rpc_url": "Выберите URL-адрес RPC",
     "title": "Настройки",
@@ -3040,9 +3025,9 @@
     "add_rpc_url": "Добавить URL-адрес RPC",
     "add_block_explorer_url": "Добавить URL обозревателя блоков",
     "networks_desc": "Добавляйте и редактируйте пользовательские сети RPC",
-    "networks_enabled": "Включенные сети",
-    "networks_test_networks": "Тестовые сети",
-    "networks_additional": "Дополнительные сети",
+    "networks_enabled": "Enabled Networks",
+    "networks_test_networks": "Test Networks",
+    "networks_additional": "Additional Networks",
     "networks_search_placeholder": "Поиск сетей",
     "networks_no_results": "Сети не найдены",
     "network_name_label": "Имя сети",
@@ -3062,15 +3047,15 @@
     "network_rpc_networks": "RPC-сети",
     "network_add_network": "Добавить сеть",
     "add_chain_title": "Добавить сеть",
-    "add_chain_search_placeholder": "Поиск по названию, ID блокчейна или валюте",
-    "add_chain_loading": "Загрузка сетей…",
-    "add_chain_error": "Не удалось загрузить сети. Повторите попытку.",
+    "add_chain_search_placeholder": "Search by name, chain ID, or currency",
+    "add_chain_loading": "Loading networks…",
+    "add_chain_error": "Failed to load networks. Please try again.",
     "add_chain_retry": "Повтор",
-    "add_chain_added": "Добавлено",
+    "add_chain_added": "Added",
     "add_chain_or": "или",
     "add_chain_custom_link": "Добавить пользовательскую сеть",
     "network_add_custom_network": "Добавить пользовательскую сеть",
-    "network_add_test_network": "Добавить тестовую сеть",
+    "network_add_test_network": "Add a test network",
     "network_add": "Добавить",
     "network_save": "Сохранить",
     "remove_network_title": "Вы хотите удалить эту сеть?",
@@ -3394,9 +3379,11 @@
     ],
     "private_key_explanation": "Сохраните ее в надежном секретном месте.",
     "private_key_warning": "Это закрытый ключ для текущего выбранного счета: {{accountName}}. Никогда никому не сообщайте этот ключ. Любой, у кого есть ваш закрытый ключ, может полностью контролировать ваш счет, включая перевод любых средств.",
-    "seed_phrase_warning_explanation": "Убедитесь, что никто не смотрит на ваш экран. Служба поддержки MetaMask никогда не будет задавать этот вопрос.",
+    "seed_phrase_warning_explanation": [
+      "Убедитесь, что никто не смотрит на ваш экран.",
+      "Служба поддержки MetaMask никогда не будет запрашивать этот ключ."
+    ],
     "private_key_warning_explanation": "Никогда никому не сообщайте этот ключ. Любой, у кого есть ваш закрытый ключ, может полностью контролировать ваш счет, включая перевод любых ваших средств.",
-    "reveal_srp_description": "Ваша секретная фраза для восстановления предоставляет полный доступ к вашему кошельку. Не сообщайте ее никому.",
     "reveal_credential_modal": [
       "Ваш {{credentialName}} предоставляет ",
       "полный доступ к вашему счету и средствам.\n\nНикому не сообщайте эти сведения.\n",
@@ -3428,8 +3415,7 @@
     "srp_text": "секретная фраза для восстановления",
     "private_key_text": "Закрытый ключ",
     "got_it": "Понятно",
-    "learn_more": "Подробнее",
-    "copied_to_clipboard": "Скопировано в буфер обмена"
+    "learn_more": "Подробнее"
   },
   "screenshot_deterrent": {
     "title": "Предупреждение о безопасности",
@@ -3810,7 +3796,7 @@
     "transaction_fee_explanation": "Комиссия за транзакцию связана с этим разрешением.",
     "view_details": "Просмотр сведений",
     "view_transaction_details": "Смотреть реквизиты транзакции",
-    "view_data": "Просмотреть данные",
+    "view_data": "View data",
     "transaction_details": "Сведения о транзакции",
     "site_url": "URL сайта",
     "permission_request": "Запрос разрешения",
@@ -3891,7 +3877,7 @@
     "right_button": "Защитить кошелек"
   },
   "add_favorite": {
-    "title": "Добавить в избранное",
+    "title": "Add favorite",
     "title_label": "Имя",
     "url_label": "URL",
     "add_button": "Добавить",
@@ -4245,8 +4231,8 @@
   "biometrics": {
     "enable_touchid": "Разблокировать с помощью Touch ID?",
     "enable_faceid": "Разблокировать с помощью Face ID?",
-    "enable_fingerprint": "Разблокировать по отпечатку пальца?",
-    "enable_biometrics": "Разблокировать с помощью биометрии?",
+    "enable_fingerprint": "Unlock with fingerprint?",
+    "enable_biometrics": "Unlock with biometrics?",
     "enable_device_passcode_ios": "Разблокировать с помощью пароля устройства?",
     "enable_device_passcode_android": "Разблокировать с помощью PIN-кода устройства?"
   },
@@ -4772,7 +4758,7 @@
     "public_address": "Публичный адрес",
     "public_address_qr_code": "Публичный адрес",
     "coming_soon": "Скоро появится...",
-    "request_payment": "Запросить платеж",
+    "request_payment": "Request payment",
     "copy": "Копировать",
     "scan_address": "Отсканируйте адрес для получения платежа",
     "copy_address": "Копировать адрес"
@@ -4786,8 +4772,8 @@
     "switch_network": "Переключитесь на мейн-нет или Sepolia",
     "card_title": "Всегда показывать кнопку Карты MetaMask",
     "card_desc": "Карта MetaMask доступна только для жителей отдельных стран.",
-    "daimo_demo_title": "Использовать демо-среду DaimoPay",
-    "daimo_demo_desc": "Переключение между демо- и рабочей средой DaimoPay для платежей по картам."
+    "daimo_demo_title": "Use DaimoPay demo environment",
+    "daimo_demo_desc": "Toggle between DaimoPay demo and production environments for card payments."
   },
   "walletconnect_sessions": {
     "no_active_sessions": "У вас нет активных сеансов",
@@ -4800,10 +4786,10 @@
     "close_current_session": "Закройте текущий сеанс перед началом нового."
   },
   "paymentRequest": {
-    "title": "Запрос платежа",
-    "title_complete": "Платеж завершен",
+    "title": "Payment request",
+    "title_complete": "Payment complete",
     "confirm": "Оплатить",
-    "cancel": "Отклонить",
+    "cancel": "Decline",
     "is_requesting_you_to_pay": "просит вас заплатить",
     "total": "Итого:"
   },
@@ -4838,7 +4824,6 @@
     "no_payment_methods_available": "Нет доступных способов оплаты.",
     "error_fetching_quotes": "Возникла какая-то проблема. Повторите попытку.",
     "no_quotes_available": "Нет доступных поставщиков.",
-    "quote_unavailable": "Котировка недоступна.",
     "providers": "Поставщики",
     "quotes_displayed_for": "Котировки отображаются для {{paymentMethodName}}.",
     "other_options": "Other options",
@@ -4944,10 +4929,10 @@
       "logged_out_error": "Ошибка выхода"
     },
     "token_unavailable_modal": {
-      "title": "Недоступен",
-      "description": "{{token}} недоступен через {{provider}} в вашем регионе.",
-      "change_token": "Сменить токен",
-      "change_provider": "Изменить поставщика"
+      "title": "Not available",
+      "description": "{{token}} is not available with {{provider}} in your region.",
+      "change_token": "Change token",
+      "change_provider": "Change provider"
     },
     "provider_picker_modal": {
       "title": "Выберите поставщика"
@@ -5185,39 +5170,6 @@
     },
     "deposit_order_title": "Депозит на сумму {{currency}}"
   },
-  "ramps_order_details": {
-    "title": "Сведения об ордере",
-    "status": "Статус",
-    "processing": "Обработка...",
-    "complete": "Завершено",
-    "failed": "Ошибка",
-    "cancelled": "Отменено",
-    "view_on_provider": "Просмотр на {{provider}}",
-    "order_id": "Ид. ордера",
-    "date_and_time": "Дата и время",
-    "fees": "Комиссии",
-    "total": "Итого",
-    "card_processing_info": "Покупки по карте обычно занимают несколько минут",
-    "processing_info_modal_description": "Оформление покупки с помощью карты обычно занимает несколько минут. Если у вас возникнут вопросы, вы можете обратиться в службу поддержки.",
-    "go_to_provider_support": "Перейти на страницу поддержки {{provider}}",
-    "error_title": "Что-то пошло не так",
-    "error_message": "Не удалось загрузить сведения об ордере. Повторите попытку.",
-    "try_again": "Повторить попытку",
-    "close": "Закрыть"
-  },
-  "ramps_v2": {
-    "notifications": {
-      "purchase_pending_title": "Обработка вашей покупки {{cryptocurrency}}...",
-      "purchase_pending_description": "Это должно занять всего несколько минут...",
-      "purchase_completed_title": "Ваша покупка {{amount}} {{cryptocurrency}} успешно выполнена!",
-      "purchase_completed_description": "Ваша {{cryptocurrency}} уже доступна",
-      "purchase_failed_title": "Покупка {{cryptocurrency}} не удалась",
-      "purchase_failed_description": "Попробуйте еще раз через минуту",
-      "purchase_cancelled_title": "Ваша покупка отменена",
-      "purchase_cancelled_description": "Ваша покупка {{cryptocurrency}} была отменена",
-      "track": "Отследить"
-    }
-  },
   "swaps": {
     "title": "Обменять",
     "onboarding": {
@@ -5734,15 +5686,12 @@
     "new_wallet_needed_description_part_three": "Чтобы этого больше не повторилось, всегда обновляйте приложение MetaMask и ОС до последней версии."
   },
   "srp_security_quiz": {
-    "question_step": "Вопрос {{step}} из {{total}}",
     "title": "Тест по безопасности",
     "introduction": "Чтобы увидеть свою секретную фразу для восстановления, вам нужно правильно ответить на два вопроса",
     "get_started": "С чего начать",
     "learn_more": "Узнайте подробнее",
     "try_again": "Повторить попытку",
     "continue": "Продолжить",
-    "correct": "Правильно!",
-    "incorrect": "Неправильно!",
     "of": "из",
     "question_one": {
       "question": "Если вы потеряете свою секретную фразу для восстановления, MetaMask...",
@@ -5921,8 +5870,8 @@
     "claimable_bonus_tooltip": "The annualized bonus you’ve earned for holding mUSD. Your bonus is claimable daily on Linea.",
     "earn_a_percentage_bonus": "Заработайте бонус в размере {{percentage}}%",
     "claimable_bonus": "Встребуемый бонус",
-    "claim_bonus": "Получить бонус",
-    "claim_bonus_subtitle": "Бонус будет выплачен в сети {{networkName}}.",
+    "claim_bonus": "Claim bonus",
+    "claim_bonus_subtitle": "Bonus will be paid out on {{networkName}}.",
     "empty_state_cta": {
       "heading": "Давайте взаймы {{tokenSymbol}} и зарабатывайте",
       "body": "Одолжите свой {{tokenSymbol}} с помощью {{protocol}} и зарабатывайте",
@@ -5933,7 +5882,7 @@
     "service_interruption_banner": {
       "maintenance_message": "Мы закрыты на техобслуживание. Скоро вернемся в сеть!"
     },
-    "supply": "Предложение",
+    "supply": "Supply",
     "deposit": "Внести депозит",
     "approve": "Одобрить",
     "approval": "Одобрение",
@@ -5982,7 +5931,7 @@
     "network": "Сеть",
     "health_factor": "Фактор здоровья",
     "liquidation_risk": "Риск ликвидации",
-    "insufficient_pool_liquidity": "Недостаточно ликвидности в пуле",
+    "insufficient_pool_liquidity": "Insufficient pool liquidity",
     "available_to_withdraw": "доступно для вывода",
     "unknown": "неизвестно",
     "how_it_works": "Как это работает",
@@ -6001,7 +5950,7 @@
       "lending": "История позиций",
       "staking": "История выплат"
     },
-    "allowance_reset": "Сброс разрешения",
+    "allowance_reset": "Allowance reset",
     "tron": {
       "fee": "Комиссия"
     },
@@ -6009,20 +5958,8 @@
       "ok": "ОК",
       "continue": "Продолжить",
       "convert_and_get_percentage_bonus": "Конвертируйте и получите {{percentage}}%",
-      "your_musd": "Ваш mUSD",
-      "balance_breakdown_title": "Ваши балансы mUSD по сетям",
-      "balance_amount": "{{amount}} mUSD",
-      "balance_amount_with_symbol": "{{amount}} {{symbol}}",
-      "balance_fiat_unavailable": "—",
-      "convert_to_musd": "Конвертировать в mUSD",
       "get_a_percentage_musd_bonus": "Получите бонус в размере {{percentage}}% в mUSD",
       "convert": "Конвертировать",
-      "fetching_quote": "Получение котировки...",
-      "you_convert": "Вы конвертируете",
-      "network_fee": "Комиссия сети",
-      "earning": "Заработок",
-      "quick_convert_description": "Выберите токен, чтобы конвертировать весь баланс, или нажмите на значок редактирования, чтобы ввести свою сумму.",
-      "no_tokens_to_convert": "У вас нет токенов, которые можно конвертировать в mUSD.",
       "toasts": {
         "converting": "Конвертация {{token}} → mUSD",
         "eta": "~{{time}}",
@@ -6062,7 +5999,7 @@
       "toasts": {
         "claiming": "Ваш бонус mUSD bonus обрабатывается",
         "delivered": "Ваш бонус в mUSDуже поступил!",
-        "failed": "Не удалось получить бонус"
+        "failed": "Bonus claim failed"
       }
     },
     "rewards": {
@@ -6073,8 +6010,7 @@
       "tooltip_opted_in_footer": "Баллы автоматически зачисляются на ваш счет.",
       "tooltip_not_opted_in_footer": "Чтобы получать баллы, согласитесь с получением бонусов.",
       "tooltip_close": "Закрыть"
-    },
-    "your_stablecoins": "Ваши стейблкоины"
+    }
   },
   "stake": {
     "stake": "Stake",
@@ -6096,7 +6032,9 @@
       "fee": "Комиссия",
       "errors": {
         "insufficient_balance": "У вас недостаточно ресурсов для выполнения этого действия."
-      }
+      },
+      "trx_unstaking_in_progress": "Выполняется вывод {{amount}} TRX из стейкинга. Он займет 14 дней.",
+      "has_claimable_trx": "You can claim {{amount}} TRX. Once claimed you'll get TRX back in your wallet."
     },
     "stake_eth": "Выполнить стейкинг ETH",
     "unstake_eth": "Отменить стейкинг ETH",
@@ -6574,7 +6512,7 @@
     "hardware_wallet_not_supported": "Аппаратные кошельки пока не поддерживаются. Используйте горячий кошелек, чтобы продолжить.",
     "hardware_wallet_not_supported_solana": "Аппаратные кошельки пока не поддерживаются для Solana. Используйте горячий кошелек, чтобы продолжить.",
     "price_impact_info_title": "Влияние на цену",
-    "price_impact_info_description": "Влияние на цену отражает, как ваш своп-ордер влияет на рыночную цену актива. Оно зависит от объёма сделки и доступной ликвидности в пуле. MetaMask не имеет отношения к влиянию на цену и не контролирует его.",
+    "price_impact_info_description": "This is how your trade changes the market price of a token. It depends on the trade size, available liquidity, and provider fees. MetaMask doesn't control price impact.",
     "price_impact_info_gasless_description": "Влияние на цену отражает, как ваш ордер на своп влияет на рыночную цену актива. Если у вас недостаточно средств для оплаты газа, часть вашего исходного токена автоматически выделяется на покрытие комиссий, что увеличивает влияние на цену. MetaMask не влияет на воздействие цену и не контролирует его.",
     "price_impact_warning_description": "This trade has an estimated {{priceImpact}} price impact, which reflects how much your trade changes the market price. The quote already reflects this.",
     "price_impact_high": "High price impact",
@@ -6600,6 +6538,7 @@
     },
     "submit": "Отправить",
     "default_slippage_description": "Ваша транзакция не будет завершена, если изменение цены превысит допустимый процент проскальзывания.",
+    "cancel": "Отмена",
     "confirm": "Подтвердить",
     "exceeding_upper_slippage_warning": "Высокое проскальзывание может привести к невыгодному свопу",
     "exceeding_lower_slippage_warning": "Низкое проскальзывание может привести к невыгодному свопу",
@@ -7282,19 +7221,6 @@
       "retry": "Повторить попытку",
       "on_linea": "на Linea"
     },
-    "cashback_screen": {
-      "title": "Кэшбэк",
-      "available_cashback": "Доступный кешбэк",
-      "network_fee": "Комиссия сети",
-      "expected_to_receive": "Ожидается к получению",
-      "withdraw": "Вывести средства",
-      "withdraw_unavailable": "Вывод недоступен",
-      "withdrawal_initiated": "Вывод инициирован",
-      "withdrawal_success": "Вывод успешно завершен",
-      "withdrawal_failed": "Ошибка вывода. Повторите попытку.",
-      "no_cashback": "Нет доступного кешбэка",
-      "loading_error": "Не удалось загрузить кешбэк. Повторите попытку."
-    },
     "change_asset": {
       "title": "Измените токен и сеть",
       "full_spending_access": "Полный доступ к расходам",
@@ -7469,10 +7395,7 @@
       "service_not_available": "В данный момент сервис недоступен. Повторите попытку позже.",
       "invalid_referral_code": "Неверный реферальный код. Проверьте и повторите попытку.",
       "already_referred": "Вас уже направил другой пользователь.",
-      "cannot_use_own_referral_code": "Вы не можете использовать собственный реферальный код.",
-      "invalid_bonus_code": "Недействительный бонусный код",
-      "already_redeemed": "Вы уже использовали этот бонусный код",
-      "reached_maximum": "Этот бонусный код достиг использован максимальное количество раз"
+      "cannot_use_own_referral_code": "Вы не можете использовать собственный реферальный код."
     },
     "claim_reward_error": {
       "title": "Не удалось получить вознаграждение"
@@ -7529,10 +7452,8 @@
         "predict": "Прогноз",
         "musd_deposit": "Депозит mUSD",
         "apply_referral_bonus": "Бонус за реферальный код",
-        "bonus_code": "Бонусный код",
         "uncategorized_event": "Событие без категории"
       },
-      "code": "Код",
       "date": "Дата",
       "account": "Счет",
       "bonus": "Бонус",
@@ -7651,10 +7572,6 @@
       "invalid_code": "Недействительный реферальный код",
       "apply_button": "Применить реферальный код"
     },
-    "bonus_code": {
-      "input_placeholder": "Введите бонусный код",
-      "apply_success": "Бонусный код применен!"
-    },
     "optout": {
       "title": "Отказаться от участия в программе вознаграждений",
       "description": "Это приведет к удалению ваших счетов из программы вознаграждений, а также к потере баллов и прогресса. Отменить это действие будет невозможно.",
@@ -7791,14 +7708,12 @@
     },
     "label": {
       "bridge_fee": "Комиссия моста",
-      "provider_fee": "Комиссия поставщика",
       "network_fee": "Комиссия сети",
       "paid_with": "Оплачено с помощью",
-      "receive_token": "Получить токен",
       "retry_button": "Повторить попытку",
       "total": "Итого",
       "account": "Счет",
-      "received_total": "Всего получено"
+      "received_total": "Received total"
     },
     "summary_title": {
       "bridge_approval": "Одобрить {{approveSymbol}}",
@@ -7851,15 +7766,14 @@
     "still_connecting_network": "Все еще выполняется подключение к {{networkName}}...",
     "unable_to_connect_network": "Не удалось подключиться к {{networkName}}.",
     "update_rpc": "Обновить RPC",
-    "switch_to_metamask_default_rpc": "Переключиться на RPC MetaMask по умолчанию",
+    "switch_to_metamask_default_rpc": "Switch to MetaMask default RPC",
     "check_network_connectivity": "Проверьте подключение к сети.",
     "check_network_connectivity_or": "Проверьте подключение к сети или",
-    "updated_to_metamask_default": "Обновлено на настройки MetaMask по умолчанию"
+    "updated_to_metamask_default": "Updated to MetaMask default"
   },
   "trending": {
     "title": "Обзор",
     "trending_tokens": "Популярные токены",
-    "stocks": "Акции",
     "price_change": "Изменение цены",
     "all_networks": "Все сети",
     "24h": "24 ч",
@@ -8007,8 +7921,8 @@
       }
     },
     "error": {
-      "unable_to_load": "Не удалось загрузить {{section}}",
-      "retry": "Повтор"
+      "unable_to_load": "Unable to load {{section}}",
+      "retry": "Retry"
     }
   }
-}
\ No newline at end of file
+}
diff --git a/locales/languages/tl.json b/locales/languages/tl.json
index 196d484d42ca..17ac2f790fcf 100644
--- a/locales/languages/tl.json
+++ b/locales/languages/tl.json
@@ -104,8 +104,8 @@
       "title": "Hindi sapat ang mga pondo"
     },
     "insufficient_pay_token_native_post_quote": {
-      "message": "Not enough {{ticker}} to cover fees. Add {{ticker}} to continue.",
-      "title": "Insufficient funds for post quote"
+      "message": "Hindi sapat ang {{ticker}} para masagot ang mga bayarin. Magdagdag ng {{ticker}} para magpatuloy.",
+      "title": "Hindi sapat ang mga pondo para sa post quote"
     },
     "no_pay_token_quotes": {
       "message": "Hindi available ang ruta ng pagbabayad na ito sa ngayon. Subukang baguhin ang halaga, network, o token at hahanapin namin ang pinakamainam na opsyon.",
@@ -1184,7 +1184,6 @@
       "title": "Bagong order",
       "leverage": "Leverage",
       "limit_price": "Limit price",
-      "market_price": "Market price",
       "enter_price": "Enter price",
       "trigger_price": "Trigger price",
       "liquidation_price": "Liquidation price",
@@ -1328,7 +1327,6 @@
       "funds_are_available_to_trade": "Ang mga pondo ay available na i-trade",
       "close_order_still_active": "Aktibo parin ang order na isara",
       "order_submitted": "Naisumite ang order",
-      "submitting_your_trade": "Isinusumite ang trade mo",
       "order_filled": "Na-fill ang order",
       "order_placed": "Nailagay ang oder",
       "order_placement_subtitle": "{{direction}} {{amount}} {{assetSymbol}}",
@@ -1344,28 +1342,16 @@
     },
     "order_details": {
       "title": "Mga Detalye ng Order",
-      "cancel_order": "Kanselahin ang order",
+      "cancel_order": "Kanselahin ang Order",
       "date": "Petsa",
-      "trigger_condition": "Kondisyon ng trigger",
-      "price": "Presyo",
       "fee": "Bayarin",
       "limit_buy": "Limitahan ang Long",
       "limit_price": "Limit Price",
       "limit_sell": "Limitahan ang Short",
       "market_buy": "Market Long",
       "market_sell": "Market Short",
-      "market": "Market",
       "open": "Bukas",
       "size": "Laki",
-      "original_size": "Orihinal na laki",
-      "order_value": "Halaga ng order",
-      "reduce_only": "Reduce only",
-      "yes": "Oo",
-      "no": "Hindi",
-      "price_above": "Presyong mas mataas sa {{price}}",
-      "price_below": "Presyong mas mababa sa {{price}}",
-      "take_profit": "Take profit",
-      "stop_loss": "Stop loss",
       "status": "Katayuan",
       "view_explorer": "Tingnan sa Explorer"
     },
@@ -2197,6 +2183,7 @@
     "available_balance": "Available na balanse",
     "claim_amount_text": "I-claim ang ${{amount}}",
     "claim_winnings_text": "I-claim ang mga panalo",
+    "claiming_text": "Claiming...",
     "unrealized_pnl_label": "Unrealized P&L",
     "unrealized_pnl_value": "{{amount}} ({{percent}})",
     "unrealized_pnl_error": "Hindi mai-load",
@@ -2275,6 +2262,9 @@
           "title": "Mayroong nang mali",
           "description": "Nabigong magpatuloy sa pag-claim",
           "try_again": "Subukang muli"
+        },
+        "in_progress": {
+          "title": "Claim already in progress"
         }
       }
     },
@@ -2308,7 +2298,6 @@
       "withdrawing_subtitle": "Available sa loob ng humigit-kumulang 1 minuto",
       "withdraw_completed": "Tapos ng mag-withdraw",
       "withdraw_completed_subtitle": "Nailipat ang {{amount}} USDC sa iyong wallet",
-      "withdraw_any_token_completed_subtitle": "Nailipat ang {{amount}}{{token}} sa iyong wallet",
       "error_title": "Mayroong nang mali",
       "error_description": "Nabigong magpatuloy sa pag-withdraw",
       "try_again": "Subukang muli"
@@ -2440,7 +2429,7 @@
     "add_tokens": "Mag-import ng mga token",
     "are_you_sure_exit": "Are you sure you want to exit?",
     "import_token": "Would you like to import this token?",
-    "import_tokens": "Gusto mo bang i-import ang mga token na ito?",
+    "import_tokens": "Would you like to import these tokens?",
     "tokens_detected_in_account": "{{tokenCount}} (na) bagong {{tokensLabel}} ang natagpuan sa account na ito",
     "token_toast": {
       "tokens_imported_title": "Na-import na mga token",
@@ -2705,7 +2694,7 @@
     "decimals_cant_be_empty": "Hindi maaaring walang laman ang smga decimal ng token.",
     "decimals_is_required": "Decimal is required. Find it on:",
     "no_tokens_found": "Wala kaming mahanap na anumang token na may ganyang pangalan.",
-    "tokens_empty_description": "Maghanap ng kahit anong token at i-import ito",
+    "tokens_empty_description": "Search for any token and import it",
     "select_token": "Pumili ng token",
     "address_must_be_smart_contract": "Natukoy ang personal na address. Ilagay ang address ng kontrata ng token.",
     "billion_abbreviation": "B",
@@ -2915,10 +2904,6 @@
     "enabling_notifications": "Pinapagana ang mga notipikasyon...",
     "updating_notifications": "Ina-update ang mga notipikasyon...",
     "updating_account_settings": "Ina-update ang mga setting ng account...",
-    "reset_notifications_title": "I-reset ang mga notipikasyon",
-    "reset_notifications_description": "Ang pag-reset sa mga notipikasyon, ay nangangahulungan na tinatanggal mo ang iyong mga storage key ng mga notipikasyon at inire-reset ang lahat ng iyong kasaysayan ng notipikasyon. Sigurado ka ba na gusto mo itong gawin?",
-    "reset_notifications": "I-reset ang mga notipikasyon",
-    "reset_notifications_success": "Tinanggal/nilikha muli ang storage key ng mga notipikasyon, at ini-reset ang kasaysayan ng mga notipikasyon.",
     "notifications_dismiss_modal": "I-dismiss",
     "select_rpc_url": "Pumili ng RPC URL",
     "title": "Mga Setting",
@@ -3040,9 +3025,9 @@
     "add_rpc_url": "Magdagdag ng RPC URL",
     "add_block_explorer_url": "Magdagdag ng URL ng block explorer",
     "networks_desc": "Magdagdag at mag-edit ng mga custom na RPC network",
-    "networks_enabled": "Mga Naka-enable na Network",
-    "networks_test_networks": "Mga Test Network",
-    "networks_additional": "Mga Karagdagang Network",
+    "networks_enabled": "Enabled Networks",
+    "networks_test_networks": "Test Networks",
+    "networks_additional": "Additional Networks",
     "networks_search_placeholder": "Pumili ng mga network",
     "networks_no_results": "Walang nahanap na network",
     "network_name_label": "Pangalan ng network",
@@ -3062,15 +3047,15 @@
     "network_rpc_networks": "Mga RPC network",
     "network_add_network": "Magdagdag ng network",
     "add_chain_title": "Magdagdag ng network",
-    "add_chain_search_placeholder": "Maghanap ayon sa pangalan, chain ID, o currency",
-    "add_chain_loading": "Naglo-load ng mga network…",
-    "add_chain_error": "Hindi nakapag-load ng mga network. Subukan ulit.",
+    "add_chain_search_placeholder": "Search by name, chain ID, or currency",
+    "add_chain_loading": "Loading networks…",
+    "add_chain_error": "Failed to load networks. Please try again.",
     "add_chain_retry": "Subukang muli",
-    "add_chain_added": "Naidagdag",
+    "add_chain_added": "Added",
     "add_chain_or": "o",
     "add_chain_custom_link": "Magdagdag ng custom na network",
     "network_add_custom_network": "Magdagdag ng custom na network",
-    "network_add_test_network": "Magdagdag ng test network",
+    "network_add_test_network": "Add a test network",
     "network_add": "Idagdag",
     "network_save": "I-save",
     "remove_network_title": "Gusto mo bang alisin ang network na ito?",
@@ -3394,9 +3379,11 @@
     ],
     "private_key_explanation": "I-save ito sa isang ligtas at sikretong lugar.",
     "private_key_warning": "Ito ang pribadong key para sa kasalukuyang napiling account: {{accountName}}. Huwag ipaalam ang key na ito. Ang sinumang nakakaalam ng iyong pribadong key ay ganap na makokontrol ang iyong account, pati na ang paglilipat ng alinman sa iyong mga pondo.",
-    "seed_phrase_warning_explanation": "Siguraduhing walang nakatingin sa screen mo. Hindi ito kailanman hihingin ng Suporta ng MetaMask.",
+    "seed_phrase_warning_explanation": [
+      "Tiyaking walang tumitingin sa iyong screen. ",
+      "Hindi ito kailanman hihilingin ng Suporta sa MetaMask."
+    ],
     "private_key_warning_explanation": "Huwag ipaalam ang key na ito. Ang sinumang nakakaalam ng iyong pribadong key ay ganap na makokontrol ang iyong account, pati na ang paglilipat ng alinman sa iyong mga pondo.",
-    "reveal_srp_description": "Maa-access nang buo ang wallet mo sa pamamagitan ng Lihim na Parirala sa Pagbawi. Huwag itong ibahagi sa kahit sino.",
     "reveal_credential_modal": [
       "Ang iyong {{credentialName}} ay nagbibigay ng ",
       "buong access sa iyong account at pondo.\n\nHuwag ibahagi ito sa iba.\n",
@@ -3428,8 +3415,7 @@
     "srp_text": "Lihim na Parirala sa Pagbawi (Secret Recovery Phrase)",
     "private_key_text": "Pribadong key",
     "got_it": "Nakuha ko",
-    "learn_more": "Matuto pa",
-    "copied_to_clipboard": "Nakopya sa clipboard"
+    "learn_more": "Matuto pa"
   },
   "screenshot_deterrent": {
     "title": "Alertong pangkaligtasan",
@@ -3810,7 +3796,7 @@
     "transaction_fee_explanation": "May nauugnay na bayad sa transaksyon sa pahintulot na ito.",
     "view_details": "Tingnan ang mga detalye",
     "view_transaction_details": "Tingnan ang mga detalye ng transaksyon",
-    "view_data": "Tingnan ang data",
+    "view_data": "View data",
     "transaction_details": "Mga detalye ng transaksyon",
     "site_url": "URL ng Site",
     "permission_request": "Kahilingan sa pahintulot",
@@ -3891,7 +3877,7 @@
     "right_button": "Protektahan ang wallet"
   },
   "add_favorite": {
-    "title": "Magdagdag ng paborito",
+    "title": "Add favorite",
     "title_label": "Pangalan",
     "url_label": "URL",
     "add_button": "Idagdag",
@@ -4245,8 +4231,8 @@
   "biometrics": {
     "enable_touchid": "I-unlock gamit ang Touch ID?",
     "enable_faceid": "I-unlock gamit ang Face ID?",
-    "enable_fingerprint": "I-unlock gamit ang fingerprint?",
-    "enable_biometrics": "I-unlock gamit ang biometrics?",
+    "enable_fingerprint": "Unlock with fingerprint?",
+    "enable_biometrics": "Unlock with biometrics?",
     "enable_device_passcode_ios": "I-unlock gamit ang passcode ng device?",
     "enable_device_passcode_android": "I-unlock gamit ang PIN ng device?"
   },
@@ -4772,7 +4758,7 @@
     "public_address": "Pampublikong address",
     "public_address_qr_code": "Pampublikong address",
     "coming_soon": "Paparating na...",
-    "request_payment": "Humiling ng bayad",
+    "request_payment": "Request payment",
     "copy": "Kopyahin",
     "scan_address": "I-scan ang address para matanggap ang bayad",
     "copy_address": "Kopyahin ang address"
@@ -4786,8 +4772,8 @@
     "switch_network": "Mangyaring lumipat sa mainnet o sepolia",
     "card_title": "Laging ipakita ang button ng MetaMask Card",
     "card_desc": "Available lang ang MetaMask Card sa mga residente ng mga piling bansa.",
-    "daimo_demo_title": "Gamitin ang demo environment ng DaimoPay",
-    "daimo_demo_desc": "Mag-toggle sa pagitan ng mga demo at production environment ng DaimoPay para sa mga pagbabayad gamit ang card."
+    "daimo_demo_title": "Use DaimoPay demo environment",
+    "daimo_demo_desc": "Toggle between DaimoPay demo and production environments for card payments."
   },
   "walletconnect_sessions": {
     "no_active_sessions": "Wala kang aktibong session",
@@ -4800,10 +4786,10 @@
     "close_current_session": "Isara ang kasalukuyang sesyon bago magsimula ng bago."
   },
   "paymentRequest": {
-    "title": "Kahilingan sa bayad",
-    "title_complete": "Kumpleto ang pagbabayad",
+    "title": "Payment request",
+    "title_complete": "Payment complete",
     "confirm": "Magbayad",
-    "cancel": "Tumanggi",
+    "cancel": "Decline",
     "is_requesting_you_to_pay": "ay humihiling sa iyong bayaran ang",
     "total": "Kabuuan:"
   },
@@ -4838,7 +4824,6 @@
     "no_payment_methods_available": "Walang available na mga paraan ng pagbabayad.",
     "error_fetching_quotes": "Nagkaproblema. Subukang muli.",
     "no_quotes_available": "Wala available na mga provider.",
-    "quote_unavailable": "Hindi available ang quote.",
     "providers": "Mga Provider",
     "quotes_displayed_for": "Mga quote na ipinapakita para sa {{paymentMethodName}}.",
     "other_options": "Other options",
@@ -4944,10 +4929,10 @@
       "logged_out_error": "Error sa pag-log out"
     },
     "token_unavailable_modal": {
-      "title": "Hindi available",
-      "description": "Hindi available ang {{token}} sa {{provider}} sa rehiyon mo.",
-      "change_token": "Baguhin ang token",
-      "change_provider": "Magpalit ng provider"
+      "title": "Not available",
+      "description": "{{token}} is not available with {{provider}} in your region.",
+      "change_token": "Change token",
+      "change_provider": "Change provider"
     },
     "provider_picker_modal": {
       "title": "Pumili ng provider"
@@ -5185,39 +5170,6 @@
     },
     "deposit_order_title": "{{currency}} Deposito"
   },
-  "ramps_order_details": {
-    "title": "Mga detalye ng order",
-    "status": "Katayuan",
-    "processing": "Pinoproseso",
-    "complete": "Kumpleto na",
-    "failed": "Nabigo",
-    "cancelled": "Nakansela",
-    "view_on_provider": "Tingnan sa {{provider}}",
-    "order_id": "Order ID",
-    "date_and_time": "Petsa at oras",
-    "fees": "Mga Bayarin",
-    "total": "Kabuuan",
-    "card_processing_info": "Karaniwang tumatagal ng ilang minuto ang mga pagbili gamit ang Card",
-    "processing_info_modal_description": "Karaniwang tumatagal nang ilang minuto ang pagbili gamit ang card. Puwede kang makipag-ugnayan sa suporta kung may mga tanong ka.",
-    "go_to_provider_support": "Pumunta sa page ng suporta ng {{provider}}",
-    "error_title": "Mayroong nang mali",
-    "error_message": "Hindi mai-load ang mga detalye ng order. Subukan ulit.",
-    "try_again": "Subukang muli",
-    "close": "Isara"
-  },
-  "ramps_v2": {
-    "notifications": {
-      "purchase_pending_title": "Pinoproseso ang pagbili mo ng {{cryptocurrency}}",
-      "purchase_pending_description": "Tatagal lang ito nang ilang minuto...",
-      "purchase_completed_title": "Matagumpay ang pagbili mo ng {{amount}} {{cryptocurrency}}!",
-      "purchase_completed_description": "Available na ang iyong {{cryptocurrency}}",
-      "purchase_failed_title": "Hindi nakabili ng {{cryptocurrency}}",
-      "purchase_failed_description": "Subukan ulit sa ilang sandali",
-      "purchase_cancelled_title": "Kinansela ang iyong pagbili",
-      "purchase_cancelled_description": "Nakansela ang pagbili mo ng {{cryptocurrency}}",
-      "track": "Subaybayan"
-    }
-  },
   "swaps": {
     "title": "I-swap",
     "onboarding": {
@@ -5734,15 +5686,12 @@
     "new_wallet_needed_description_part_three": "Para maiwasan na mangyari itong muli, tiyakin na laging naka-update sa pinakabagong bersyon ang iyong MetaMask app at OS."
   },
   "srp_security_quiz": {
-    "question_step": "Tanong {{step}} sa {{total}}",
     "title": "Pagsusulit sa seguridad",
     "introduction": "Upang ibunyag ang iyong Lihim na Parirala sa Pagbawi, kailangan mong sagutin nang tama ang dalawang tanong",
     "get_started": "Magsimula",
     "learn_more": "Matuto pa",
     "try_again": "Subukang muli",
     "continue": "Magpatuloy",
-    "correct": "Tama!",
-    "incorrect": "Mali!",
     "of": "ng",
     "question_one": {
       "question": "Kung mawala mo ang iyong Lihim na Parirala sa Pagbawi, ang MetaMask ay...",
@@ -5921,8 +5870,8 @@
     "claimable_bonus_tooltip": "The annualized bonus you’ve earned for holding mUSD. Your bonus is claimable daily on Linea.",
     "earn_a_percentage_bonus": "Kumita ng {{percentage}}% bonus",
     "claimable_bonus": "Naki-claim na bonus",
-    "claim_bonus": "I-claim ang bonus",
-    "claim_bonus_subtitle": "Ibibigay ang bonus sa {{networkName}}.",
+    "claim_bonus": "Claim bonus",
+    "claim_bonus_subtitle": "Bonus will be paid out on {{networkName}}.",
     "empty_state_cta": {
       "heading": "Magpahiram ng {{tokenSymbol}} at kumita ng",
       "body": "Ipahiram ang iyong {{tokenSymbol}} sa {{protocol}} at kumita",
@@ -5982,7 +5931,7 @@
     "network": "Network",
     "health_factor": "Health factor",
     "liquidation_risk": "Panganib ng liquidation",
-    "insufficient_pool_liquidity": "Hindi sapat na pool liquidity",
+    "insufficient_pool_liquidity": "Insufficient pool liquidity",
     "available_to_withdraw": "available para i-withdraw",
     "unknown": "hindi Kilala",
     "how_it_works": "Paano ito gumagana",
@@ -6001,7 +5950,7 @@
       "lending": "Talaan ng posisyon",
       "staking": "Talaan ng payout"
     },
-    "allowance_reset": "Pag-resent ng allowance",
+    "allowance_reset": "Allowance reset",
     "tron": {
       "fee": "Bayarin"
     },
@@ -6009,20 +5958,8 @@
       "ok": "OK",
       "continue": "Magpatuloy",
       "convert_and_get_percentage_bonus": "I-convert at makakuha ng {{percentage}}%",
-      "your_musd": "Ang mUSD mo",
-      "balance_breakdown_title": "Ang mga balanse mo sa mUSD ayon sa network",
-      "balance_amount": "{{amount}} mUSD",
-      "balance_amount_with_symbol": "{{amount}} {{symbol}}",
-      "balance_fiat_unavailable": "—",
-      "convert_to_musd": "I-convert sa mUSD",
       "get_a_percentage_musd_bonus": "Makakuha ng {{percentage}}% mUSD bonus",
       "convert": "I-convert",
-      "fetching_quote": "Kumukuha ng quote...",
-      "you_convert": "Nagko-convert ka ng",
-      "network_fee": "Bayad sa network",
-      "earning": "Kumikita",
-      "quick_convert_description": "Pumili ng token para mai-convert mo ang buo mong balanse o i-tap ang icon ng pag-edit para maglagay ng gusto mong halaga.",
-      "no_tokens_to_convert": "Wala kang kahit anong token na puwedeng i-convert sa mUSD.",
       "toasts": {
         "converting": "Ikino-convert ang {{token}} → mUSD",
         "eta": "~{{time}}",
@@ -6062,7 +5999,7 @@
       "toasts": {
         "claiming": "Pinoproseso ang mUSD bonus mo",
         "delivered": "Ang mUSD na bonus mo ay narito na!",
-        "failed": "Hindi na-claim ang bonus"
+        "failed": "Bonus claim failed"
       }
     },
     "rewards": {
@@ -6073,8 +6010,7 @@
       "tooltip_opted_in_footer": "Awtomatikong idadagdag ang mga point sa account mo.",
       "tooltip_not_opted_in_footer": "Mag-opt-in sa mga reward para matanggap ang mga point mo.",
       "tooltip_close": "Isara"
-    },
-    "your_stablecoins": "Mga stablecoin mo"
+    }
   },
   "stake": {
     "stake": "Mag-stake",
@@ -6096,7 +6032,9 @@
       "fee": "Bayarin",
       "errors": {
         "insufficient_balance": "Wala kang sapat na balanse ng mapagkukunan para gawin ang aksyong ito."
-      }
+      },
+      "trx_unstaking_in_progress": "Kasalukuyang ina-unstake ang {{amount}} TRX. Umaabot nang 14 na araw ang pag-unstake.",
+      "has_claimable_trx": "You can claim {{amount}} TRX. Once claimed you'll get TRX back in your wallet."
     },
     "stake_eth": "Mag-stake ng ETH",
     "unstake_eth": "Mag-unstake ng ETH",
@@ -6574,7 +6512,7 @@
     "hardware_wallet_not_supported": "Hindi pa sinusuportahan ang mga wallet na hardware. Gumamit ng hot wallet para magpatuloy.",
     "hardware_wallet_not_supported_solana": "Hindi pa sinusuportahan ang mga wallet na hardware sa Solana. Gumamit ng hot wallet para magpatuloy.",
     "price_impact_info_title": "Epekto ng presyo",
-    "price_impact_info_description": "Ipinapakita ng epekto sa presyo kung paano naaapektuhan ng iyong swap order ang market price ng asset. Nakadepende ito sa laki ng trade at sa available na liquidity sa pool. Walang kontrol o impluwensya ang MetaMask sa epekto sa presyo.",
+    "price_impact_info_description": "This is how your trade changes the market price of a token. It depends on the trade size, available liquidity, and provider fees. MetaMask doesn't control price impact.",
     "price_impact_info_gasless_description": "Ipinapakita ng epekto sa presyo kung paano naaapektuhan ng iyong swap order ang market price ng asset. Kung wala kang sapat na pondo para sa gas, awtomatikong ilalaan ang isang bahagi ng source token mo para sa mga bayarin, na magdaragdag sa epekto ng presyo. Walang impluwensya o kontrol ang MetaMask sa epekto sa presyo.",
     "price_impact_warning_description": "This trade has an estimated {{priceImpact}} price impact, which reflects how much your trade changes the market price. The quote already reflects this.",
     "price_impact_high": "High price impact",
@@ -6600,6 +6538,7 @@
     },
     "submit": "Isumite",
     "default_slippage_description": "Hindi magpapatuloy ang iyong transaksyon kapag nagbago ang presyo nang higit sa porsiyento ng slippage.",
+    "cancel": "Kanselahin",
     "confirm": "Kumpirmahin",
     "exceeding_upper_slippage_warning": "Mataas na slippage, maaari itong magresulta sa hindi kanais-nais na pag-swap",
     "exceeding_lower_slippage_warning": "Mababang slippage, maaari itong magresulta sa hindi kanais-nais na pag-swap",
@@ -7282,19 +7221,6 @@
       "retry": "Subukang muli",
       "on_linea": "sa Linea"
     },
-    "cashback_screen": {
-      "title": "Cashback",
-      "available_cashback": "Available na cashback",
-      "network_fee": "Bayad sa network",
-      "expected_to_receive": "Inaasahang matanggap",
-      "withdraw": "Mag-withdraw",
-      "withdraw_unavailable": "Hindi available ang pag-withdraw",
-      "withdrawal_initiated": "Nasimulan na ang pag-withdraw",
-      "withdrawal_success": "Matagumpay na nakumpleto ang pag-withdraw",
-      "withdrawal_failed": "Pumalya ang pag-withdraw. Subukan ulit mamaya.",
-      "no_cashback": "Walang cashback na available",
-      "loading_error": "Hindi nakapag-load ng cashback. Subukan ulit."
-    },
     "change_asset": {
       "title": "Palitan ang token at network",
       "full_spending_access": "Buong pag-access sa paggastos",
@@ -7469,10 +7395,7 @@
       "service_not_available": "Hindi available sa sandaling ito ang serbisyo. Pakisubukang muli maya-maya.",
       "invalid_referral_code": "Di-wastong referral code. Pakisuriin at subukang muli.",
       "already_referred": "Nai-refer ka na ng ibang user.",
-      "cannot_use_own_referral_code": "Hindi mo maaaring gamitin ang sarili mong referral code.",
-      "invalid_bonus_code": "Di-wastong bonus code",
-      "already_redeemed": "Na-redeem mo na ang bonus code na ito",
-      "reached_maximum": "Naabot na ang maximum na bilang ng paggamit para sa bonus code na ito"
+      "cannot_use_own_referral_code": "Hindi mo maaaring gamitin ang sarili mong referral code."
     },
     "claim_reward_error": {
       "title": "Nabigong ma-claim ang reward"
@@ -7529,10 +7452,8 @@
         "predict": "Prediksyon",
         "musd_deposit": "depositong mUSD",
         "apply_referral_bonus": "Bonus sa referral code",
-        "bonus_code": "Bonus code",
         "uncategorized_event": "Hindi nakakategoryang event"
       },
-      "code": "Code",
       "date": "Petsa",
       "account": "Account",
       "bonus": "Bonus",
@@ -7651,10 +7572,6 @@
       "invalid_code": "Hindi valid na referral code",
       "apply_button": "Gamitin ang referral code"
     },
-    "bonus_code": {
-      "input_placeholder": "Maglagay ng bonus code",
-      "apply_success": "Nailapat na ang bonus code!"
-    },
     "optout": {
       "title": "Umalis sa Rewards program",
       "description": "Ang aksyong ito ay aalis sa iyong account mula sa Rewards program at buburahin ang lahat ng iyong puntos at progreso. Hindi na ito maaaring ibalik.",
@@ -7791,14 +7708,12 @@
     },
     "label": {
       "bridge_fee": "Bayad sa bridge",
-      "provider_fee": "Bayad sa provider",
       "network_fee": "Bayad sa network",
       "paid_with": "Magbayad gamit ang",
-      "receive_token": "Tumanggap ng token",
       "retry_button": "Subukang muli",
       "total": "Kabuuan",
       "account": "Account",
-      "received_total": "Kabuuan ng natanggap"
+      "received_total": "Received total"
     },
     "summary_title": {
       "bridge_approval": "Aprubahan ang {{approveSymbol}}",
@@ -7851,15 +7766,14 @@
     "still_connecting_network": "Patuloy na kumukonekta sa {{networkName}}...",
     "unable_to_connect_network": "Hindi makakonekta sa {{networkName}}.",
     "update_rpc": "I-update ang RPC",
-    "switch_to_metamask_default_rpc": "Lumipat sa default RPC ng MetaMask",
+    "switch_to_metamask_default_rpc": "Switch to MetaMask default RPC",
     "check_network_connectivity": "Tingnan ang konektibidad ng network mo.",
     "check_network_connectivity_or": "Tingnan ang konektibidad ng network mo o",
-    "updated_to_metamask_default": "Na-update sa default ng MetaMask"
+    "updated_to_metamask_default": "Updated to MetaMask default"
   },
   "trending": {
     "title": "Tuklasin",
     "trending_tokens": "Mga trending na token",
-    "stocks": "Stocks",
     "price_change": "Pagbabago ng presyo",
     "all_networks": "Lahat ng network",
     "24h": "24 na oras",
@@ -8007,8 +7921,8 @@
       }
     },
     "error": {
-      "unable_to_load": "Hindi nai-load ang {{section}}",
-      "retry": "Subukang muli"
+      "unable_to_load": "Unable to load {{section}}",
+      "retry": "Retry"
     }
   }
-}
\ No newline at end of file
+}
diff --git a/locales/languages/tr.json b/locales/languages/tr.json
index 8360a3dbc9e1..e4df8613a045 100644
--- a/locales/languages/tr.json
+++ b/locales/languages/tr.json
@@ -104,8 +104,8 @@
       "title": "Yetersiz bakiye"
     },
     "insufficient_pay_token_native_post_quote": {
-      "message": "Not enough {{ticker}} to cover fees. Add {{ticker}} to continue.",
-      "title": "Insufficient funds for post quote"
+      "message": "Ücretleri karşılamak için yeterli {{ticker}} yok. Devam etmek için {{ticker}} ekleyin.",
+      "title": "Teklifi yayınlamak için fon yetersiz"
     },
     "no_pay_token_quotes": {
       "message": "Bu ödeme rotası şu anda kullanılamıyor. Tutarı, ağı veya token'ı değiştirmeyi deneyin ve sizin için en iyi seçeneği bulalım.",
@@ -1184,7 +1184,6 @@
       "title": "Yeni emir",
       "leverage": "Kaldıraç",
       "limit_price": "Limit fiyatı",
-      "market_price": "Piyasa fiyatı",
       "enter_price": "Fiyatı gir",
       "trigger_price": "Tetikleme fiyatı",
       "liquidation_price": "Likidasyon fiyatı",
@@ -1328,7 +1327,6 @@
       "funds_are_available_to_trade": "Fonlar işlem yapmak için kullanılabilir",
       "close_order_still_active": "Kapama emri halen aktif",
       "order_submitted": "Emir gönderildi",
-      "submitting_your_trade": "İşleminiz gönderiliyor",
       "order_filled": "Emir gerçekleşti",
       "order_placed": "Emir verildi",
       "order_placement_subtitle": "{{direction}} {{amount}} {{assetSymbol}}",
@@ -1344,28 +1342,16 @@
     },
     "order_details": {
       "title": "Emir Bilgileri",
-      "cancel_order": "Emri iptal et",
+      "cancel_order": "Emri İptal Et",
       "date": "Tarih",
-      "trigger_condition": "Tetikleme koşulu",
-      "price": "Fiyat",
       "fee": "Ücret",
       "limit_buy": "Limit Long",
       "limit_price": "Limit Fiyatı",
       "limit_sell": "Limit Short",
       "market_buy": "Piyasa Long",
       "market_sell": "Piyasa Short",
-      "market": "Piyasa",
       "open": "Açık",
       "size": "Boyut",
-      "original_size": "Orijinal boyut",
-      "order_value": "Emir değeri",
-      "reduce_only": "Yalnızca azalt",
-      "yes": "Evet",
-      "no": "Hayır",
-      "price_above": "Fiyat {{price}} üzerinde",
-      "price_below": "Fiyat {{price}} altında",
-      "take_profit": "Kazancı al",
-      "stop_loss": "Zararda durdur",
       "status": "Durum",
       "view_explorer": "Blok Gezgininde Görüntüle"
     },
@@ -2197,6 +2183,7 @@
     "available_balance": "Kullanılabilir bakiye",
     "claim_amount_text": "{{amount}}$ al",
     "claim_winnings_text": "Kazançları al",
+    "claiming_text": "Claiming...",
     "unrealized_pnl_label": "Gerçekleşmemiş K&Z",
     "unrealized_pnl_value": "({{percent}}) {{amount}}",
     "unrealized_pnl_error": "Yüklenemiyor",
@@ -2275,6 +2262,9 @@
           "title": "Bir şeyler ters gitti",
           "description": "Alım ile ilerleme başarısız oldu",
           "try_again": "Tekrar dene"
+        },
+        "in_progress": {
+          "title": "Claim already in progress"
         }
       }
     },
@@ -2308,7 +2298,6 @@
       "withdrawing_subtitle": "Yaklaşık 1 dakika sonra kullanılabilir",
       "withdraw_completed": "Çekme işlemi tamamlandı",
       "withdraw_completed_subtitle": "{{amount}} USDC cüzdanınıza aktarıldı",
-      "withdraw_any_token_completed_subtitle": "{{amount}} {{token}} cüzdanınıza taşındı",
       "error_title": "Bir şeyler ters gitti",
       "error_description": "Çekme işlemine ilerlenemedi",
       "try_again": "Tekrar dene"
@@ -2440,7 +2429,7 @@
     "add_tokens": "Tokenleri içe aktar",
     "are_you_sure_exit": "Are you sure you want to exit?",
     "import_token": "Would you like to import this token?",
-    "import_tokens": "Bu tokenları içeri aktarmak istiyor musunuz?",
+    "import_tokens": "Would you like to import these tokens?",
     "tokens_detected_in_account": "Bu hesapta {{tokenCount}} yeni {{tokensLabel}} bulundu",
     "token_toast": {
       "tokens_imported_title": "İçe aktarılan tokenlar",
@@ -2705,7 +2694,7 @@
     "decimals_cant_be_empty": "Token ondalıkları boş olamaz.",
     "decimals_is_required": "Decimal is required. Find it on:",
     "no_tokens_found": "Bu isimde token bulamadık.",
-    "tokens_empty_description": "Herhangi bir tokenı ara veya içe aktar",
+    "tokens_empty_description": "Search for any token and import it",
     "select_token": "Token seç",
     "address_must_be_smart_contract": "Kişisel adres algılandı. Token sözleşme adresini girin.",
     "billion_abbreviation": "MR",
@@ -2915,10 +2904,6 @@
     "enabling_notifications": "Bildirimler etkinleştiriliyor...",
     "updating_notifications": "Bildirimler güncelleniyor...",
     "updating_account_settings": "Hesap ayarları güncelleniyor...",
-    "reset_notifications_title": "Bildirimleri sıfırla",
-    "reset_notifications_description": "Bildirimlerin sıfırlanması, bildirim depolama anahtarlarınızı sildiğiniz ve tüm bildirim geçmişinizi sıfırladığınız anlamına gelir. Bunu yapmak istediğinizden emin misiniz?",
-    "reset_notifications": "Bildirimleri sıfırla",
-    "reset_notifications_success": "Bildirim depolama anahtarı silindi/yeniden oluşturuldu ve bildirim geçmişi sıfırlandı.",
     "notifications_dismiss_modal": "Yok say",
     "select_rpc_url": "RPC URL adresini seç",
     "title": "Ayarlar",
@@ -3040,9 +3025,9 @@
     "add_rpc_url": "RPC URL adresi ekle",
     "add_block_explorer_url": "Blok Gezgini URL adresi ekle",
     "networks_desc": "Kişisel RPC ağı ekle ve düzenle",
-    "networks_enabled": "Etkinleştirilen Ağlar",
-    "networks_test_networks": "Test Ağları",
-    "networks_additional": "İlave Ağlar",
+    "networks_enabled": "Enabled Networks",
+    "networks_test_networks": "Test Networks",
+    "networks_additional": "Additional Networks",
     "networks_search_placeholder": "Ağ ara",
     "networks_no_results": "Ağ bulunamadı",
     "network_name_label": "Ağ adı",
@@ -3062,15 +3047,15 @@
     "network_rpc_networks": "RPC ağları",
     "network_add_network": "Ağ ekle",
     "add_chain_title": "Ağ ekle",
-    "add_chain_search_placeholder": "Ada, zincir kimliğine veya para birimine göre ara",
-    "add_chain_loading": "Ağlar yükleniyor…",
-    "add_chain_error": "Ağlar yüklenemedi. Lütfen tekrar deneyin.",
+    "add_chain_search_placeholder": "Search by name, chain ID, or currency",
+    "add_chain_loading": "Loading networks…",
+    "add_chain_error": "Failed to load networks. Please try again.",
     "add_chain_retry": "Tekrar Dene",
-    "add_chain_added": "Eklendi",
+    "add_chain_added": "Added",
     "add_chain_or": "veya",
     "add_chain_custom_link": "Özel bir ağ ekle",
     "network_add_custom_network": "Özel bir ağ ekle",
-    "network_add_test_network": "Bir test ağı ekle",
+    "network_add_test_network": "Add a test network",
     "network_add": "Ekle",
     "network_save": "Kaydet",
     "remove_network_title": "Bu ağı kaldırmak istiyor musunuz?",
@@ -3394,9 +3379,11 @@
     ],
     "private_key_explanation": "Güvenli ve gizli bir yere kaydedin.",
     "private_key_warning": "Bu, halihazırda seçili hesabın özel anahtarıdır: {{accountName}}. Bu anahtarı hiçbir zaman ifşa etmeyin. Özel anahtara sahip olan herkes, paranızın tamamını transfer etmek de dahil olmak üzere hesabınızı tam olarak kontrol edebilir.",
-    "seed_phrase_warning_explanation": "Hiç kimsenin ekranınıza bakmadığından emin olun. MetaMask Destek ekibi asla bunu istemez.",
+    "seed_phrase_warning_explanation": [
+      "Hiç kimsenin ekranınıza bakmadığından emin olun.",
+      "MetaMask Destek bölümü bunu asla talep etmez."
+    ],
     "private_key_warning_explanation": "Bu anahtarı hiçbir zaman ifşa etmeyin. Özel anahtarınıza sahip olan herkes, paranızın tamamını transfer etmek de dahil olmak üzere hesabınızı tamamen kontrol edebilir.",
-    "reveal_srp_description": "Gizli Kurtarma İfadeniz cüzdanınıza tam erişim verir. Kimseyle paylaşmayın.",
     "reveal_credential_modal": [
       "{{credentialName}} bilgileriniz ",
       "hesabınıza ve paranıza tam erişim sunar.\n\nBunu hiç kimseyle paylaşmayın.",
@@ -3428,8 +3415,7 @@
     "srp_text": "Gizli Kurtarma İfadesi",
     "private_key_text": "Özel anahtar",
     "got_it": "Anladım",
-    "learn_more": "Daha fazla bilgi edin",
-    "copied_to_clipboard": "Panoya kopyalandı"
+    "learn_more": "Daha fazla bilgi edin"
   },
   "screenshot_deterrent": {
     "title": "Güvenlik uyarısı",
@@ -3810,7 +3796,7 @@
     "transaction_fee_explanation": "Bu izinle ilişkili bir işlem ücreti.",
     "view_details": "Ayrıntıları görüntüle",
     "view_transaction_details": "İşlem bilgilerini görüntüle",
-    "view_data": "Verileri görüntüle",
+    "view_data": "View data",
     "transaction_details": "İşlem bilgileri",
     "site_url": "Site URL adresi",
     "permission_request": "İzin talebi",
@@ -3891,7 +3877,7 @@
     "right_button": "Cüzdanı koru"
   },
   "add_favorite": {
-    "title": "Favori ekle",
+    "title": "Add favorite",
     "title_label": "Adı",
     "url_label": "URL Adresi",
     "add_button": "Ekle",
@@ -4245,8 +4231,8 @@
   "biometrics": {
     "enable_touchid": "Touch ID ile kilidi aç?",
     "enable_faceid": "Face ID ile kilidi aç?",
-    "enable_fingerprint": "Parmak izi ile kilidi aç?",
-    "enable_biometrics": "Biyometri ile kilidi aç?",
+    "enable_fingerprint": "Unlock with fingerprint?",
+    "enable_biometrics": "Unlock with biometrics?",
     "enable_device_passcode_ios": "Cihaz parolası ile kilidi aç?",
     "enable_device_passcode_android": "Cihazın PIN kodu ile kilidi aç?"
   },
@@ -4772,7 +4758,7 @@
     "public_address": "Genel adres",
     "public_address_qr_code": "Genel adres",
     "coming_soon": "Çok yakında...",
-    "request_payment": "Ödeme iste",
+    "request_payment": "Request payment",
     "copy": "Hata",
     "scan_address": "Ödeme almak için adresi tara",
     "copy_address": "Adresi kopyala"
@@ -4786,8 +4772,8 @@
     "switch_network": "Lütfen ana ağa veya sepolia ağına geçin",
     "card_title": "MetaMask Kartı düğmesini her zaman göster",
     "card_desc": "MetaMask Kartı yalnızca seçili ülkelerde ikamet edenler için mevcuttur.",
-    "daimo_demo_title": "DaimoPay demo ortamını kullan",
-    "daimo_demo_desc": "Kart ödemeleri için DaimoPay demo ve üretim ortamları arasında değiştir."
+    "daimo_demo_title": "Use DaimoPay demo environment",
+    "daimo_demo_desc": "Toggle between DaimoPay demo and production environments for card payments."
   },
   "walletconnect_sessions": {
     "no_active_sessions": "Aktif oturumunuz yok",
@@ -4800,10 +4786,10 @@
     "close_current_session": "Yeni bir oturum başlatmadan önce geçerli oturumu kapat."
   },
   "paymentRequest": {
-    "title": "Ödeme talebi",
-    "title_complete": "Ödeme tamamlandı",
+    "title": "Payment request",
+    "title_complete": "Payment complete",
     "confirm": "Öde",
-    "cancel": "Reddet",
+    "cancel": "Decline",
     "is_requesting_you_to_pay": "ödeme yapmanızı istiyor",
     "total": "Toplam:"
   },
@@ -4838,7 +4824,6 @@
     "no_payment_methods_available": "Kullanılabilir ödeme yöntemi yok.",
     "error_fetching_quotes": "Bir şeyler ters gitti. Lütfen tekrar deneyin.",
     "no_quotes_available": "Sağlayıcı mevcut değil.",
-    "quote_unavailable": "Teklif kullanılamıyor.",
     "providers": "Sağlayıcılar",
     "quotes_displayed_for": "{{paymentMethodName}} için teklifler görüntüleniyor.",
     "other_options": "Other options",
@@ -4944,10 +4929,10 @@
       "logged_out_error": "Oturum kapatılırken hata"
     },
     "token_unavailable_modal": {
-      "title": "Mevcut değil",
-      "description": "{{token}} bölgenizde {{provider}} ile kullanılamıyor.",
-      "change_token": "Tokenı değiştir",
-      "change_provider": "Sağlayıcı değiştirin"
+      "title": "Not available",
+      "description": "{{token}} is not available with {{provider}} in your region.",
+      "change_token": "Change token",
+      "change_provider": "Change provider"
     },
     "provider_picker_modal": {
       "title": "Bir sağlayıcı seç"
@@ -5185,39 +5170,6 @@
     },
     "deposit_order_title": "{{currency}} Para Yatırma İşlemi"
   },
-  "ramps_order_details": {
-    "title": "Emir bilgileri",
-    "status": "Durum",
-    "processing": "Gerçekleştiriliyor",
-    "complete": "Tamamlandı",
-    "failed": "Başarısız oldu",
-    "cancelled": "İptal edildi",
-    "view_on_provider": "{{provider}} üzerinde görüntüle",
-    "order_id": "Emir Numarası",
-    "date_and_time": "Tarih ve saat",
-    "fees": "Ücretler",
-    "total": "Toplam",
-    "card_processing_info": "Kart ile satın alma işlemleri genellikle birkaç dakika sürer",
-    "processing_info_modal_description": "Kart ile satın alma işlemleri genellikle birkaç dakika sürer. Sorularınız olursa destek ekibine ulaşabilirsiniz.",
-    "go_to_provider_support": "{{provider}} destek sayfasına git",
-    "error_title": "Bir şeyler ters gitti",
-    "error_message": "Emir bilgileri yüklenemiyor. Lütfen tekrar deneyin.",
-    "try_again": "Tekrar dene",
-    "close": "Kapat"
-  },
-  "ramps_v2": {
-    "notifications": {
-      "purchase_pending_title": "{{cryptocurrency}} satın alma işleminiz gerçekleşiyor",
-      "purchase_pending_description": "Bu işlem sadece birkaç dakika sürecektir...",
-      "purchase_completed_title": "{{amount}} {{cryptocurrency}} satın alma işleminiz başarılı oldu!",
-      "purchase_completed_description": "{{cryptocurrency}} para biriminiz artık kullanılabilir",
-      "purchase_failed_title": "{{cryptocurrency}} satın alma işlemi başarısız oldu",
-      "purchase_failed_description": "Lütfen kısa bir süre sonra tekrar deneyin",
-      "purchase_cancelled_title": "Satın alma işleminiz iptal edildi",
-      "purchase_cancelled_description": "{{cryptocurrency}} satın alma işleminiz iptal edildi",
-      "track": "Takip Et"
-    }
-  },
   "swaps": {
     "title": "Takas Et",
     "onboarding": {
@@ -5734,15 +5686,12 @@
     "new_wallet_needed_description_part_three": "Bunun tekrar olmasını önlemek için her zaman MetaMask uygulamanı ve işletim sistemini en yeni sürümde güncel tuttuğundan emin ol."
   },
   "srp_security_quiz": {
-    "question_step": "Soru {{step}} / {{total}}",
     "title": "Güvenlik testi",
     "introduction": "Gizli Kurtarma İfadenizi görmek için iki soruyu doğru cevaplamanız gerekmektedir",
     "get_started": "Başlarken",
     "learn_more": "Daha fazla bilgi edin",
     "try_again": "Tekrar dene",
     "continue": "Devam et",
-    "correct": "Doğru!",
-    "incorrect": "Yanlış!",
     "of": "/",
     "question_one": {
       "question": "Gizli Kurtarma İfadenizi kaybederseniz MetaMask...",
@@ -5921,8 +5870,8 @@
     "claimable_bonus_tooltip": "The annualized bonus you’ve earned for holding mUSD. Your bonus is claimable daily on Linea.",
     "earn_a_percentage_bonus": "%{{percentage}} bonus kazanın",
     "claimable_bonus": "Alınabilir bonus",
-    "claim_bonus": "Bonusu al",
-    "claim_bonus_subtitle": "Bonus, {{networkName}} üzerinde ödenecektir.",
+    "claim_bonus": "Claim bonus",
+    "claim_bonus_subtitle": "Bonus will be paid out on {{networkName}}.",
     "empty_state_cta": {
       "heading": "{{tokenSymbol}} borç verin ve kazanın",
       "body": "{{protocol}} ile {{tokenSymbol}} token'ınızı borç verin ve",
@@ -5933,7 +5882,7 @@
     "service_interruption_banner": {
       "maintenance_message": "Bakım çalışması nedeniyle kapalıyız. Kısa sürede tekrar burada olacağız!"
     },
-    "supply": "Arz",
+    "supply": "Supply",
     "deposit": "Para Yatır",
     "approve": "Onayla",
     "approval": "Onay",
@@ -5982,7 +5931,7 @@
     "network": "Ağ",
     "health_factor": "Sağlık faktörü",
     "liquidation_risk": "Likidasyon riski",
-    "insufficient_pool_liquidity": "Havuz likiditesi yetersiz",
+    "insufficient_pool_liquidity": "Insufficient pool liquidity",
     "available_to_withdraw": "çekilebilir",
     "unknown": "bilinmeyen",
     "how_it_works": "Nasıl çalışır?",
@@ -6001,7 +5950,7 @@
       "lending": "Pozisyon geçmişi",
       "staking": "Ödeme geçmişi"
     },
-    "allowance_reset": "Kullanım izni sıfırlandı",
+    "allowance_reset": "Allowance reset",
     "tron": {
       "fee": "Ücret"
     },
@@ -6009,20 +5958,8 @@
       "ok": "Tamam",
       "continue": "Devam et",
       "convert_and_get_percentage_bonus": "Dönüştür ve %{{percentage}} al",
-      "your_musd": "mUSD bakiyeniz",
-      "balance_breakdown_title": "Ağa göre mUSD bakiyeleriniz",
-      "balance_amount": "{{amount}} mUSD",
-      "balance_amount_with_symbol": "{{amount}} {{symbol}}",
-      "balance_fiat_unavailable": "—",
-      "convert_to_musd": "mUSD'ye dönüştür",
       "get_a_percentage_musd_bonus": "%{{percentage}} mUSD bonus al",
       "convert": "Dönüştür",
-      "fetching_quote": "Teklif alınıyor...",
-      "you_convert": "Dönüştürdüğünüz tutar",
-      "network_fee": "Ağ ücreti",
-      "earning": "Kazanç",
-      "quick_convert_description": "Tüm bakiyenizi dönüştürmek için bir token seçin veya düzenle simgesine dokunarak özel bir miktar girin.",
-      "no_tokens_to_convert": "mUSD'ye dönüştürülebilecek tokenınız yok.",
       "toasts": {
         "converting": "{{token}} → mUSD dönüştürülüyor",
         "eta": "~{{time}}",
@@ -6062,7 +5999,7 @@
       "toasts": {
         "claiming": "mUSD bonusunuz işleniyor",
         "delivered": "mUSD bonusunuz hazır!",
-        "failed": "Bonus alımı başarısız oldu"
+        "failed": "Bonus claim failed"
       }
     },
     "rewards": {
@@ -6073,8 +6010,7 @@
       "tooltip_opted_in_footer": "Puanlar otomatik olarak hesabınıza eklenecektir.",
       "tooltip_not_opted_in_footer": "Puanlarınızı almak için ödüller programına katılın.",
       "tooltip_close": "Kapat"
-    },
-    "your_stablecoins": "Stabil kripto paralarınız"
+    }
   },
   "stake": {
     "stake": "Pay",
@@ -6096,7 +6032,9 @@
       "fee": "Ücret",
       "errors": {
         "insufficient_balance": "Bu eylemi gerçekleştirmek için yeterli kaynak bakiyeniz yok."
-      }
+      },
+      "trx_unstaking_in_progress": "{{amount}} TRX unstake işlemi devam ediyor. Unstake işlemi 14 gün sürer.",
+      "has_claimable_trx": "You can claim {{amount}} TRX. Once claimed you'll get TRX back in your wallet."
     },
     "stake_eth": "ETH Stake Et",
     "unstake_eth": "ETH Unstake Et",
@@ -6574,7 +6512,7 @@
     "hardware_wallet_not_supported": "Donanım cüzdanları henüz desteklenmiyor. Devam etmek için sıcak cüzdan kullanın.",
     "hardware_wallet_not_supported_solana": "Donanım cüzdanları henüz Solana için desteklenmiyor. Devam etmek için sıcak cüzdan kullanın.",
     "price_impact_info_title": "Piyasa etkisi",
-    "price_impact_info_description": "Fiyat etkisi, takas emrinizin varlığın piyasa fiyatını nasıl etkilediğini yansıtır. İşlem boyutuna ve havuzdaki mevcut likiditeye bağlıdır. MetaMask'in fiyat etkisi üzerinde bir etkisi veya kontrolü bulunmamaktadır.",
+    "price_impact_info_description": "This is how your trade changes the market price of a token. It depends on the trade size, available liquidity, and provider fees. MetaMask doesn't control price impact.",
     "price_impact_info_gasless_description": "Fiyat etkisi, takas emrinizin varlığın piyasa fiyatını nasıl etkilediğini yansıtır. Gaz için yeterli fon tutmazsanız kaynak token'inizin bir kısmı otomatik olarak ücretleri karşılamak üzere ayrılır, bu nedenle fiyat etkisi artar. MetaMask fiyat etkisini etkilemez veya kontrol etmez.",
     "price_impact_warning_description": "This trade has an estimated {{priceImpact}} price impact, which reflects how much your trade changes the market price. The quote already reflects this.",
     "price_impact_high": "High price impact",
@@ -6600,6 +6538,7 @@
     },
     "submit": "Gönder",
     "default_slippage_description": "Fiyat kayma yüzdesinden daha fazla değişirse işleminiz gerçekleşmez.",
+    "cancel": "İptal",
     "confirm": "Onayla",
     "exceeding_upper_slippage_warning": "Yüksek kayma; bu durum istenmeyen bir takas ile sonuçlanabilir",
     "exceeding_lower_slippage_warning": "Düşük kayma; bu durum istenmeyen bir takas ile sonuçlanabilir",
@@ -7282,19 +7221,6 @@
       "retry": "Tekrar dene",
       "on_linea": "Linea üzerinde"
     },
-    "cashback_screen": {
-      "title": "Para iadesi",
-      "available_cashback": "Kullanılabilir para iadesi",
-      "network_fee": "Ağ ücreti",
-      "expected_to_receive": "Alınması beklenen",
-      "withdraw": "Çek",
-      "withdraw_unavailable": "Para çekme kullanılamıyor",
-      "withdrawal_initiated": "Para çekme başlatıldı",
-      "withdrawal_success": "Para çekme başarıyla tamamlandı",
-      "withdrawal_failed": "Para çekme başarısız oldu. Lütfen tekrar deneyin.",
-      "no_cashback": "Para iadesi mevcut değil",
-      "loading_error": "Para iadesi yüklenemedi. Lütfen tekrar deneyin."
-    },
     "change_asset": {
       "title": "Token'ı ve ağı değiştir",
       "full_spending_access": "Tam harcama erişimi",
@@ -7469,10 +7395,7 @@
       "service_not_available": "Hizmet şu anda kullanılamıyor. Lütfen kısa süre sonra tekrar deneyin.",
       "invalid_referral_code": "Referans kodu geçersiz. Lütfen kontrol edip tekrar deneyin.",
       "already_referred": "Zaten başka bir kullanıcının referansı ile geldiniz.",
-      "cannot_use_own_referral_code": "Kendi referans kodunuzu kullanamazsınız.",
-      "invalid_bonus_code": "Bonus kodu geçersiz",
-      "already_redeemed": "Bu bonus kodunu zaten kullandınız",
-      "reached_maximum": "Bu bonus kodu maksimum kullanım sayısına ulaştı"
+      "cannot_use_own_referral_code": "Kendi referans kodunuzu kullanamazsınız."
     },
     "claim_reward_error": {
       "title": "Ödül alınamadı"
@@ -7529,10 +7452,8 @@
         "predict": "Tahmin",
         "musd_deposit": "mUSD yatır",
         "apply_referral_bonus": "Referans kodu bonusu",
-        "bonus_code": "Bonus kodu",
         "uncategorized_event": "Kategorize edilmemiş etkinlik"
       },
-      "code": "Kod",
       "date": "Tarih",
       "account": "Hesap",
       "bonus": "Bonus",
@@ -7651,10 +7572,6 @@
       "invalid_code": "Geçersiz referans kodu",
       "apply_button": "Referans kodunu uygula"
     },
-    "bonus_code": {
-      "input_placeholder": "Bonus kodunu gir",
-      "apply_success": "Bonus kodu uygulandı!"
-    },
     "optout": {
       "title": "Ödüller Programını Sil",
       "description": "Bu işlem, hesaplarınızı Ödüller programından kaldırır ve tüm puanlarınızı ile ilerlemenizi siler. Bu işlemi geri alamazsınız.",
@@ -7791,14 +7708,12 @@
     },
     "label": {
       "bridge_fee": "Köprü ücreti",
-      "provider_fee": "Sağlayıcı ücreti",
       "network_fee": "Ağ ücreti",
       "paid_with": "Ödeme aracı",
-      "receive_token": "Token al",
       "retry_button": "Tekrar dene",
       "total": "Toplam",
       "account": "Hesap",
-      "received_total": "Alınan toplam"
+      "received_total": "Received total"
     },
     "summary_title": {
       "bridge_approval": "{{approveSymbol}} onayla",
@@ -7851,15 +7766,14 @@
     "still_connecting_network": "Halen {{networkName}} ağına bağlanılıyor...",
     "unable_to_connect_network": "{{networkName}} ağına bağlanılamıyor.",
     "update_rpc": "RPC'yi güncelle",
-    "switch_to_metamask_default_rpc": "MetaMask varsayılan RPC'sine geç",
+    "switch_to_metamask_default_rpc": "Switch to MetaMask default RPC",
     "check_network_connectivity": "Ağ bağlantınızı kontrol edin.",
     "check_network_connectivity_or": "Ağ bağlantınızı kontrol edin veya",
-    "updated_to_metamask_default": "MetaMask varsayılanına güncellendi"
+    "updated_to_metamask_default": "Updated to MetaMask default"
   },
   "trending": {
     "title": "Keşfet",
     "trending_tokens": "Trend tokenlar",
-    "stocks": "Hisse Senetleri",
     "price_change": "Fiyat değişikliği",
     "all_networks": "Tüm ağlar",
     "24h": "24s",
@@ -8007,8 +7921,8 @@
       }
     },
     "error": {
-      "unable_to_load": "{{section}} yüklenemiyor",
-      "retry": "Tekrar Dene"
+      "unable_to_load": "Unable to load {{section}}",
+      "retry": "Retry"
     }
   }
-}
\ No newline at end of file
+}
diff --git a/locales/languages/vi-vn.json b/locales/languages/vi-vn.json
index 48b55622c1bd..25830b2b098a 100644
--- a/locales/languages/vi-vn.json
+++ b/locales/languages/vi-vn.json
@@ -582,6 +582,7 @@
     "ok": "Ok",
     "cancel": "Hủy",
     "error": "Lỗi",
+    "open_settings": "Cài đặt",
     "attempting_to_scan_with_wallet_locked": "Có vẻ như bạn đang cố gắng quét một mã QR. Bạn cần mở khóa ví của mình trước thì mới có thể sử dụng mã đó.",
     "attempting_sync_from_wallet_error": "Có vẻ như bạn đang cố gắng đồng bộ hóa với tiện ích. Để có thể làm như vậy, bạn sẽ cần xóa ví hiện tại của mình. \n\nSau khi bạn xóa hoặc cài đặt lại một phiên bản mới của ứng dụng, hãy chọn tùy chọn để \"Đồng bộ hóa với tiện ích MetaMask\". Quan trọng! Trước khi xóa ví, hãy đảm bảo bạn đã sao lưu Cụm mật khẩu khôi phục bí mật."
   },
diff --git a/locales/languages/vi.json b/locales/languages/vi.json
index 805c1834f2d0..6d73b7dc6a5d 100644
--- a/locales/languages/vi.json
+++ b/locales/languages/vi.json
@@ -104,8 +104,8 @@
       "title": "Không đủ tiền"
     },
     "insufficient_pay_token_native_post_quote": {
-      "message": "Not enough {{ticker}} to cover fees. Add {{ticker}} to continue.",
-      "title": "Insufficient funds for post quote"
+      "message": "Không đủ {{ticker}} để chi trả phí. Nạp thêm {{ticker}} để tiếp tục.",
+      "title": "Không đủ tiền cho báo giá sau"
     },
     "no_pay_token_quotes": {
       "message": "Lộ trình thanh toán này hiện không khả dụng. Hãy thử thay đổi số lượng, mạng hoặc token và chúng tôi sẽ tìm phương án tốt nhất.",
@@ -1184,7 +1184,6 @@
       "title": "Lệnh mới",
       "leverage": "Đòn bẩy",
       "limit_price": "Giá giới hạn",
-      "market_price": "Giá thị trường",
       "enter_price": "Nhập giá",
       "trigger_price": "Giá kích hoạt",
       "liquidation_price": "Giá thanh lý",
@@ -1328,7 +1327,6 @@
       "funds_are_available_to_trade": "Tiền đã sẵn sàng để giao dịch",
       "close_order_still_active": "Lệnh đóng vị thế vẫn đang có hiệu lực",
       "order_submitted": "Đã gửi lệnh",
-      "submitting_your_trade": "Đang gửi giao dịch của bạn",
       "order_filled": "Đã khớp lệnh",
       "order_placed": "Đã đặt lệnh",
       "order_placement_subtitle": "{{direction}} {{amount}} {{assetSymbol}}",
@@ -1346,26 +1344,14 @@
       "title": "Chi tiết lệnh",
       "cancel_order": "Hủy lệnh",
       "date": "Ngày",
-      "trigger_condition": "Điều kiện kích hoạt",
-      "price": "Giá",
       "fee": "Phí",
       "limit_buy": "Giới hạn mua khống",
       "limit_price": "Giá giới hạn",
       "limit_sell": "Giới hạn bán khống",
       "market_buy": "Mua khống theo thị trường",
       "market_sell": "Bán khống theo thị trường",
-      "market": "Thị trường",
       "open": "Mở",
       "size": "Kích thước",
-      "original_size": "Kích thước ban đầu",
-      "order_value": "Giá trị lệnh",
-      "reduce_only": "Chỉ giảm",
-      "yes": "Có",
-      "no": "Không",
-      "price_above": "Giá trên {{price}}",
-      "price_below": "Giá dưới {{price}}",
-      "take_profit": "Chốt lời",
-      "stop_loss": "Cắt lỗ",
       "status": "Trạng thái",
       "view_explorer": "Xem trên Trình khám phá"
     },
@@ -2197,6 +2183,7 @@
     "available_balance": "Số dư khả dụng",
     "claim_amount_text": "Nhận ${{amount}}",
     "claim_winnings_text": "Nhận tiền thắng",
+    "claiming_text": "Claiming...",
     "unrealized_pnl_label": "Lãi/Lỗ chưa thực hiện",
     "unrealized_pnl_value": "{{amount}} ({{percent}})",
     "unrealized_pnl_error": "Không thể tải",
@@ -2275,6 +2262,9 @@
           "title": "Đã xảy ra sự cố",
           "description": "Không thể thực hiện yêu cầu nhận tiền",
           "try_again": "Thử lại"
+        },
+        "in_progress": {
+          "title": "Claim already in progress"
         }
       }
     },
@@ -2308,7 +2298,6 @@
       "withdrawing_subtitle": "Sẽ khả dụng sau khoảng 1 phút",
       "withdraw_completed": "Rút tiền hoàn tất",
       "withdraw_completed_subtitle": "{{amount}} USDC đã được chuyển vào ví của bạn",
-      "withdraw_any_token_completed_subtitle": "{{amount}} {{token}} đã được chuyển vào ví của bạn",
       "error_title": "Đã xảy ra sự cố",
       "error_description": "Không thể thực hiện yêu cầu rút tiền",
       "try_again": "Thử lại"
@@ -2440,7 +2429,7 @@
     "add_tokens": "Nhập token",
     "are_you_sure_exit": "Are you sure you want to exit?",
     "import_token": "Would you like to import this token?",
-    "import_tokens": "Bạn có muốn nhập các token này không?",
+    "import_tokens": "Would you like to import these tokens?",
     "tokens_detected_in_account": "Đã tìm thấy {{tokenCount}} {{tokensLabel}} mới trong tài khoản này",
     "token_toast": {
       "tokens_imported_title": "Token đã nhập",
@@ -2705,7 +2694,7 @@
     "decimals_cant_be_empty": "Số thập phân Token không thể để trống.",
     "decimals_is_required": "Decimal is required. Find it on:",
     "no_tokens_found": "Chúng tôi không thể tìm ra Token nào có tên đó.",
-    "tokens_empty_description": "Tìm kiếm bất kỳ token nào và nhập nó",
+    "tokens_empty_description": "Search for any token and import it",
     "select_token": "Chọn token",
     "address_must_be_smart_contract": "Đã phát hiện địa chỉ cá nhân. Hãy nhập địa chỉ hợp đồng của Token.",
     "billion_abbreviation": "Tỷ",
@@ -2915,10 +2904,6 @@
     "enabling_notifications": "Đang bật thông báo...",
     "updating_notifications": "Đang cập nhật thông báo...",
     "updating_account_settings": "Đang cập nhật chế độ cài đặt tài khoản...",
-    "reset_notifications_title": "Đặt lại thông báo",
-    "reset_notifications_description": "Đặt lại thông báo có nghĩa là bạn đang xóa các khóa lưu trữ thông báo và đặt lại toàn bộ lịch sử thông báo. Bạn có chắc chắn muốn thực hiện điều này không?",
-    "reset_notifications": "Đặt lại thông báo",
-    "reset_notifications_success": "Khóa lưu trữ thông báo đã bị xóa/được tạo lại và lịch sử thông báo đã được đặt lại.",
     "notifications_dismiss_modal": "Đóng",
     "select_rpc_url": "Chọn URL RPC",
     "title": "Cài đặt",
@@ -3040,9 +3025,9 @@
     "add_rpc_url": "Thêm URL RPC",
     "add_block_explorer_url": "Thêm URL trình khám phá khối",
     "networks_desc": "Thêm và sửa mạng RPC tùy chỉnh",
-    "networks_enabled": "Mạng đã bật",
-    "networks_test_networks": "Mạng thử nghiệm",
-    "networks_additional": "Mạng bổ sung",
+    "networks_enabled": "Enabled Networks",
+    "networks_test_networks": "Test Networks",
+    "networks_additional": "Additional Networks",
     "networks_search_placeholder": "Tìm kiếm mạng",
     "networks_no_results": "Không tìm thấy mạng nào",
     "network_name_label": "Tên mạng",
@@ -3062,15 +3047,15 @@
     "network_rpc_networks": "Mạng RPC",
     "network_add_network": "Thêm mạng",
     "add_chain_title": "Thêm mạng",
-    "add_chain_search_placeholder": "Tìm kiếm theo tên, ID chuỗi hoặc loại tiền tệ",
-    "add_chain_loading": "Đang tải mạng…",
-    "add_chain_error": "Không thể tải mạng. Vui lòng thử lại.",
+    "add_chain_search_placeholder": "Search by name, chain ID, or currency",
+    "add_chain_loading": "Loading networks…",
+    "add_chain_error": "Failed to load networks. Please try again.",
     "add_chain_retry": "Thử lại",
-    "add_chain_added": "Đã thêm",
+    "add_chain_added": "Added",
     "add_chain_or": "hoặc",
     "add_chain_custom_link": "Thêm mạng tùy chỉnh",
     "network_add_custom_network": "Thêm mạng tùy chỉnh",
-    "network_add_test_network": "Thêm mạng thử nghiệm",
+    "network_add_test_network": "Add a test network",
     "network_add": "Thêm",
     "network_save": "Lưu",
     "remove_network_title": "Bạn có muốn gỡ bỏ mạng này?",
@@ -3394,9 +3379,11 @@
     ],
     "private_key_explanation": "Hãy cất giữ nó ở một nơi an toàn và bí mật.",
     "private_key_warning": "Đây là khóa cá nhân cho tài khoản đang được chọn: {{accountName}}. Đừng bao giờ tiết lộ khóa này. Bất kỳ ai có khóa cá nhân của bạn đều có toàn quyền kiểm soát tài khoản của bạn, bao gồm cả quyền chuyển bất kỳ khoản tiền nào của bạn đi.",
-    "seed_phrase_warning_explanation": "Đảm bảo không có ai đang nhìn vào màn hình của bạn. Bộ phận Hỗ trợ MetaMask sẽ không bao giờ yêu cầu thông tin này.",
+    "seed_phrase_warning_explanation": [
+      "Đảm bảo không có ai đang nhìn vào màn hình của bạn. ",
+      "Bộ phận Hỗ trợ MetaMask sẽ không bao giờ yêu cầu điều này."
+    ],
     "private_key_warning_explanation": "Đừng bao giờ tiết lộ khóa này. Bất kỳ ai có khóa cá nhân của bạn đều có toàn quyền kiểm soát tài khoản của bạn, bao gồm cả quyền chuyển bất kỳ khoản tiền nào của bạn đi.",
-    "reveal_srp_description": "Cụm từ khôi phục bí mật cho phép có toàn quyền truy cập vào ví của bạn. Đừng chia sẻ với bất kỳ ai.",
     "reveal_credential_modal": [
       "{{credentialName}} của bạn cung cấp ",
       "toàn quyền truy cập vào tài khoản và tiền của bạn.\n\nĐừng chia sẻ điều này với bất kỳ ai.\n",
@@ -3428,8 +3415,7 @@
     "srp_text": "của bạn",
     "private_key_text": "Khóa riêng tư",
     "got_it": "Đã hiểu",
-    "learn_more": "Tìm hiểu thêm",
-    "copied_to_clipboard": "Đã sao chép vào bộ nhớ đệm"
+    "learn_more": "Tìm hiểu thêm"
   },
   "screenshot_deterrent": {
     "title": "Cảnh báo an toàn",
@@ -3810,7 +3796,7 @@
     "transaction_fee_explanation": "Phí giao dịch liên quan tới quyền này.",
     "view_details": "Xem chi tiết",
     "view_transaction_details": "Xem chi tiết giao dịch",
-    "view_data": "Xem dữ liệu",
+    "view_data": "View data",
     "transaction_details": "Chi tiết giao dịch",
     "site_url": "URL trang web",
     "permission_request": "Yêu cầu cấp quyền",
@@ -3891,7 +3877,7 @@
     "right_button": "Bảo vệ ví"
   },
   "add_favorite": {
-    "title": "Thêm vào mục yêu thích",
+    "title": "Add favorite",
     "title_label": "Tên",
     "url_label": "URL",
     "add_button": "Thêm",
@@ -4245,8 +4231,8 @@
   "biometrics": {
     "enable_touchid": "Mở khóa bằng Touch ID?",
     "enable_faceid": "Mở khóa bằng Face ID?",
-    "enable_fingerprint": "Mở khóa bằng vân tay?",
-    "enable_biometrics": "Mở khóa bằng sinh trắc học?",
+    "enable_fingerprint": "Unlock with fingerprint?",
+    "enable_biometrics": "Unlock with biometrics?",
     "enable_device_passcode_ios": "Mở khóa bằng mật mã của thiết bị?",
     "enable_device_passcode_android": "Mở khóa bằng mã PIN của thiết bị?"
   },
@@ -4772,7 +4758,7 @@
     "public_address": "Địa chỉ công khai",
     "public_address_qr_code": "Địa chỉ công khai",
     "coming_soon": "Sắp ra mắt...",
-    "request_payment": "Yêu cầu thanh toán",
+    "request_payment": "Request payment",
     "copy": "Sao chép",
     "scan_address": "Quét địa chỉ để nhận thanh toán",
     "copy_address": "Sao chép địa chỉ"
@@ -4786,8 +4772,8 @@
     "switch_network": "Vui lòng chuyển qua mạng chính hoặc sepolia",
     "card_title": "Luôn hiển thị nút Thẻ MetaMask",
     "card_desc": "Thẻ MetaMask chỉ khả dụng cho cư dân của một số quốc gia được chọn.",
-    "daimo_demo_title": "Sử dụng môi trường thử nghiệm của DaimoPay",
-    "daimo_demo_desc": "Chuyển đổi giữa môi trường thử nghiệm và môi trường triển khai của DaimoPay cho các giao dịch thanh toán bằng thẻ."
+    "daimo_demo_title": "Use DaimoPay demo environment",
+    "daimo_demo_desc": "Toggle between DaimoPay demo and production environments for card payments."
   },
   "walletconnect_sessions": {
     "no_active_sessions": "Bạn không có phiên đang hoạt động nào",
@@ -4800,10 +4786,10 @@
     "close_current_session": "Đóng phiên hiện tại trước khi bắt đầu một phiên mới."
   },
   "paymentRequest": {
-    "title": "Yêu cầu thanh toán",
-    "title_complete": "Thanh toán hoàn tất",
+    "title": "Payment request",
+    "title_complete": "Payment complete",
     "confirm": "Thanh toán",
-    "cancel": "Từ chối",
+    "cancel": "Decline",
     "is_requesting_you_to_pay": "đang yêu cầu bạn thanh toán",
     "total": "Tổng cộng:"
   },
@@ -4838,7 +4824,6 @@
     "no_payment_methods_available": "Không có phương thức thanh toán khả dụng.",
     "error_fetching_quotes": "Đã xảy ra lỗi. Vui lòng thử lại.",
     "no_quotes_available": "Hiện không có nhà cung cấp nào.",
-    "quote_unavailable": "Không có báo giá.",
     "providers": "Nhà cung cấp",
     "quotes_displayed_for": "Báo giá được hiển thị cho {{paymentMethodName}}.",
     "other_options": "Other options",
@@ -4944,10 +4929,10 @@
       "logged_out_error": "Lỗi khi đăng xuất"
     },
     "token_unavailable_modal": {
-      "title": "Không có sẵn",
-      "description": "{{token}} không khả dụng với {{provider}} tại khu vực của bạn.",
-      "change_token": "Thay đổi token",
-      "change_provider": "Thay đổi nhà cung cấp"
+      "title": "Not available",
+      "description": "{{token}} is not available with {{provider}} in your region.",
+      "change_token": "Change token",
+      "change_provider": "Change provider"
     },
     "provider_picker_modal": {
       "title": "Chọn nhà cung cấp"
@@ -5185,39 +5170,6 @@
     },
     "deposit_order_title": "Nạp {{currency}}"
   },
-  "ramps_order_details": {
-    "title": "Chi tiết lệnh",
-    "status": "Trạng thái",
-    "processing": "Đang xử lý",
-    "complete": "Hoàn tất",
-    "failed": "Không thành công",
-    "cancelled": "Đã hủy",
-    "view_on_provider": "Xem trên {{provider}}",
-    "order_id": "Mã lệnh",
-    "date_and_time": "Ngày và giờ",
-    "fees": "Phí",
-    "total": "Tổng cộng",
-    "card_processing_info": "Mua bằng thẻ thường chỉ mất vài phút",
-    "processing_info_modal_description": "Giao dịch mua hàng bằng thẻ thường mất vài phút. Bạn có thể liên hệ bộ phận hỗ trợ nếu có câu hỏi.",
-    "go_to_provider_support": "Truy cập trang hỗ trợ của {{provider}}",
-    "error_title": "Đã xảy ra sự cố",
-    "error_message": "Không thể tải chi tiết đơn hàng. Vui lòng thử lại.",
-    "try_again": "Thử lại",
-    "close": "Đóng"
-  },
-  "ramps_v2": {
-    "notifications": {
-      "purchase_pending_title": "Đang xử lý giao dịch mua {{cryptocurrency}} của bạn",
-      "purchase_pending_description": "Quá trình này chỉ mất vài phút...",
-      "purchase_completed_title": "Bạn đã mua {{amount}} {{cryptocurrency}} thành công!",
-      "purchase_completed_description": "{{cryptocurrency}} của bạn hiện đã có sẵn",
-      "purchase_failed_title": "Giao dịch mua {{cryptocurrency}} đã thất bại",
-      "purchase_failed_description": "Vui lòng thử lại sau ít phút",
-      "purchase_cancelled_title": "Giao dịch mua của bạn đã bị hủy",
-      "purchase_cancelled_description": "Giao dịch mua {{cryptocurrency}} của bạn đã bị hủy",
-      "track": "Theo dõi"
-    }
-  },
   "swaps": {
     "title": "Hoán đổi",
     "onboarding": {
@@ -5734,15 +5686,12 @@
     "new_wallet_needed_description_part_three": "Để tránh trường hợp này xảy ra lại, hãy nhớ luôn cập nhật ứng dụng MetaMask và hệ điều hành của bạn lên phiên bản mới nhất."
   },
   "srp_security_quiz": {
-    "question_step": "Câu hỏi {{step}}/{{total}}",
     "title": "Câu hỏi bảo mật",
     "introduction": "Để hiển thị Cụm từ khôi phục bí mật, bạn cần trả lời đúng hai câu hỏi",
     "get_started": "Bắt đầu",
     "learn_more": "Tìm hiểu thêm",
     "try_again": "Thử lại",
     "continue": "Tiếp tục",
-    "correct": "Chính xác!",
-    "incorrect": "Không chính xác!",
     "of": "của",
     "question_one": {
       "question": "Nếu bạn làm mất Cụm từ khôi phục bí mật, MetaMask...",
@@ -5921,8 +5870,8 @@
     "claimable_bonus_tooltip": "The annualized bonus you’ve earned for holding mUSD. Your bonus is claimable daily on Linea.",
     "earn_a_percentage_bonus": "Nhận thưởng {{percentage}}%",
     "claimable_bonus": "Thưởng có thể nhận",
-    "claim_bonus": "Nhận thưởng",
-    "claim_bonus_subtitle": "Tiền thưởng sẽ được trả trên {{networkName}}.",
+    "claim_bonus": "Claim bonus",
+    "claim_bonus_subtitle": "Bonus will be paid out on {{networkName}}.",
     "empty_state_cta": {
       "heading": "Cho vay {{tokenSymbol}} và nhận lãi",
       "body": "Cho vay {{tokenSymbol}} với {{protocol}} và kiếm lợi nhuận",
@@ -5933,7 +5882,7 @@
     "service_interruption_banner": {
       "maintenance_message": "Chúng tôi đang bảo trì. Chúng tôi sẽ sớm hoạt động trở lại!"
     },
-    "supply": "Cung cấp",
+    "supply": "Supply",
     "deposit": "Nạp tiền",
     "approve": "Phê duyệt",
     "approval": "Phê duyệt",
@@ -5982,7 +5931,7 @@
     "network": "Mạng",
     "health_factor": "Chỉ số an toàn",
     "liquidation_risk": "Rủi ro thanh lý",
-    "insufficient_pool_liquidity": "Khả năng thanh khoản của bể không đủ",
+    "insufficient_pool_liquidity": "Insufficient pool liquidity",
     "available_to_withdraw": "có sẵn để rút",
     "unknown": "không xác định",
     "how_it_works": "Cách hoạt động",
@@ -6001,7 +5950,7 @@
       "lending": "Lịch sử vị thế",
       "staking": "Lịch sử trả thưởng"
     },
-    "allowance_reset": "Đặt lại hạn mức",
+    "allowance_reset": "Allowance reset",
     "tron": {
       "fee": "Phí"
     },
@@ -6009,20 +5958,8 @@
       "ok": "OK",
       "continue": "Tiếp tục",
       "convert_and_get_percentage_bonus": "Chuyển đổi và nhận {{percentage}}%",
-      "your_musd": "mUSD của bạn",
-      "balance_breakdown_title": "Số dư mUSD của bạn theo mạng",
-      "balance_amount": "{{amount}} mUSD",
-      "balance_amount_with_symbol": "{{amount}} {{symbol}}",
-      "balance_fiat_unavailable": "—",
-      "convert_to_musd": "Chuyển đổi sang mUSD",
       "get_a_percentage_musd_bonus": "Nhận thưởng {{percentage}}% mUSD",
       "convert": "Chuyển đổi",
-      "fetching_quote": "Tìm nạp báo giá...",
-      "you_convert": "Bạn chuyển đổi",
-      "network_fee": "Phí mạng",
-      "earning": "Thu nhập",
-      "quick_convert_description": "Chọn một token để chuyển đổi toàn bộ số dư của bạn hoặc nhấn vào biểu tượng chỉnh sửa để nhập số lượng tùy chỉnh.",
-      "no_tokens_to_convert": "Bạn không có token nào có thể chuyển đổi sang mUSD.",
       "toasts": {
         "converting": "Đang chuyển đổi {{token}} → mUSD",
         "eta": "~{{time}}",
@@ -6062,7 +5999,7 @@
       "toasts": {
         "claiming": "Khoản thưởng mUSD của bạn đang được xử lý",
         "delivered": "Khoản thưởng mUSD của bạn đã có!",
-        "failed": "Nhận thưởng thất bại"
+        "failed": "Bonus claim failed"
       }
     },
     "rewards": {
@@ -6073,8 +6010,7 @@
       "tooltip_opted_in_footer": "Điểm sẽ tự động được cộng vào tài khoản của bạn.",
       "tooltip_not_opted_in_footer": "Đăng ký tham gia chương trình phần thưởng để nhận điểm.",
       "tooltip_close": "Đóng"
-    },
-    "your_stablecoins": "Đồng ổn định của bạn"
+    }
   },
   "stake": {
     "stake": "Stake",
@@ -6096,7 +6032,9 @@
       "fee": "Phí",
       "errors": {
         "insufficient_balance": "Bạn không có đủ số dư tài nguyên để thực hiện hành động này."
-      }
+      },
+      "trx_unstaking_in_progress": "Đang tiến hành hủy ký gửi {{amount}} TRX. Quá trình hủy ký gửi sẽ mất 14 ngày.",
+      "has_claimable_trx": "You can claim {{amount}} TRX. Once claimed you'll get TRX back in your wallet."
     },
     "stake_eth": "Ký gửi ETH",
     "unstake_eth": "Hủy ký gửi ETH",
@@ -6574,7 +6512,7 @@
     "hardware_wallet_not_supported": "Ví cứng hiện chưa được hỗ trợ. Hãy sử dụng ví nóng để tiếp tục.",
     "hardware_wallet_not_supported_solana": "Ví cứng hiện chưa được hỗ trợ cho Solana. Hãy sử dụng ví nóng để tiếp tục.",
     "price_impact_info_title": "Mức tác động giá",
-    "price_impact_info_description": "Tác động giá phản ánh cách lệnh hoán đổi của bạn ảnh hưởng đến giá thị trường của tài sản. Nó phụ thuộc vào kích thước giao dịch và thanh khoản có sẵn trong bể. MetaMask không ảnh hưởng hoặc kiểm soát tác động giá.",
+    "price_impact_info_description": "This is how your trade changes the market price of a token. It depends on the trade size, available liquidity, and provider fees. MetaMask doesn't control price impact.",
     "price_impact_info_gasless_description": "Tác động giá phản ánh cách lệnh hoán đổi của bạn ảnh hưởng đến giá thị trường của tài sản. Nếu bạn không có đủ tiền để trả phí gas, một phần token gốc của bạn sẽ tự động được phân bổ để trả phí, làm tăng tác động giá. MetaMask không can thiệp hoặc kiểm soát tác động giá.",
     "price_impact_warning_description": "This trade has an estimated {{priceImpact}} price impact, which reflects how much your trade changes the market price. The quote already reflects this.",
     "price_impact_high": "High price impact",
@@ -6600,6 +6538,7 @@
     },
     "submit": "Gửi",
     "default_slippage_description": "Giao dịch của bạn sẽ không được thực hiện nếu giá thay đổi vượt quá phần trăm trượt giá.",
+    "cancel": "Hủy",
     "confirm": "Xác nhận",
     "exceeding_upper_slippage_warning": "Độ trượt giá cao, điều này có thể dẫn đến giao dịch hoán đổi không thuận lợi",
     "exceeding_lower_slippage_warning": "Độ trượt giá thấp, điều này có thể dẫn đến giao dịch hoán đổi không thuận lợi",
@@ -7282,19 +7221,6 @@
       "retry": "Thử lại",
       "on_linea": "trên Linea"
     },
-    "cashback_screen": {
-      "title": "Hoàn tiền",
-      "available_cashback": "Hoàn tiền khả dụng",
-      "network_fee": "Phí mạng",
-      "expected_to_receive": "Dự kiến nhận được",
-      "withdraw": "Rút tiền",
-      "withdraw_unavailable": "Không thể rút tiền",
-      "withdrawal_initiated": "Đã khởi tạo lệnh rút tiền",
-      "withdrawal_success": "Rút tiền thành công",
-      "withdrawal_failed": "Rút tiền thất bại. Vui lòng thử lại.",
-      "no_cashback": "Không có hoàn tiền khả dụng",
-      "loading_error": "Không thể tải thông tin hoàn tiền. Vui lòng thử lại."
-    },
     "change_asset": {
       "title": "Thay đổi token và mạng",
       "full_spending_access": "Quyền truy cập chi tiêu đầy đủ",
@@ -7469,10 +7395,7 @@
       "service_not_available": "Dịch vụ hiện không khả dụng. Vui lòng thử lại sau giây lát.",
       "invalid_referral_code": "Mã giới thiệu không hợp lệ. Vui lòng kiểm tra và thử lại.",
       "already_referred": "Bạn đã được người dùng khác giới thiệu.",
-      "cannot_use_own_referral_code": "Bạn không thể sử dụng mã giới thiệu của chính mình.",
-      "invalid_bonus_code": "Mã thưởng không hợp lệ",
-      "already_redeemed": "Bạn đã đổi mã thưởng này",
-      "reached_maximum": "Mã thưởng này đã đạt đến số lượt sử dụng tối đa"
+      "cannot_use_own_referral_code": "Bạn không thể sử dụng mã giới thiệu của chính mình."
     },
     "claim_reward_error": {
       "title": "Không thể nhận phần thưởng"
@@ -7529,10 +7452,8 @@
         "predict": "Dự đoán",
         "musd_deposit": "Nạp mUSD",
         "apply_referral_bonus": "Thưởng mã giới thiệu",
-        "bonus_code": "Mã thưởng",
         "uncategorized_event": "Sự kiện chưa được phân loại"
       },
-      "code": "Mã",
       "date": "Ngày",
       "account": "Tài khoản",
       "bonus": "Thưởng",
@@ -7651,10 +7572,6 @@
       "invalid_code": "Mã giới thiệu không hợp lệ",
       "apply_button": "Áp dụng mã giới thiệu"
     },
-    "bonus_code": {
-      "input_placeholder": "Nhập mã thưởng",
-      "apply_success": "Mã thưởng đã được áp dụng!"
-    },
     "optout": {
       "title": "Hủy tham gia chương trình Phần thưởng",
       "description": "Hành động này sẽ xóa các tài khoản của bạn khỏi chương trình Phần thưởng cũng như xóa toàn bộ điểm và tiến trình của bạn. Bạn sẽ không thể hoàn tác hành động này.",
@@ -7791,14 +7708,12 @@
     },
     "label": {
       "bridge_fee": "Phí cầu nối",
-      "provider_fee": "Phí nhà cung cấp",
       "network_fee": "Phí mạng",
       "paid_with": "Đã thanh toán bằng",
-      "receive_token": "Token nhận được",
       "retry_button": "Thử lại",
       "total": "Tổng cộng",
       "account": "Tài khoản",
-      "received_total": "Tổng số lượng nhận được"
+      "received_total": "Received total"
     },
     "summary_title": {
       "bridge_approval": "Phê duyệt {{approveSymbol}}",
@@ -7851,15 +7766,14 @@
     "still_connecting_network": "Vẫn đang kết nối với {{networkName}}...",
     "unable_to_connect_network": "Không thể kết nối với {{networkName}}.",
     "update_rpc": "Cập nhật RPC",
-    "switch_to_metamask_default_rpc": "Chuyển sang RPC mặc định của MetaMask",
+    "switch_to_metamask_default_rpc": "Switch to MetaMask default RPC",
     "check_network_connectivity": "Kiểm tra kết nối mạng của bạn.",
     "check_network_connectivity_or": "Kiểm tra kết nối mạng của bạn hoặc",
-    "updated_to_metamask_default": "Đã cập nhật sang dạng mặc định của MetaMask"
+    "updated_to_metamask_default": "Updated to MetaMask default"
   },
   "trending": {
     "title": "Khám phá",
     "trending_tokens": "Token xu hướng",
-    "stocks": "Cổ phiếu",
     "price_change": "Biến động giá",
     "all_networks": "Tất cả mạng",
     "24h": "24 giờ",
@@ -8007,8 +7921,8 @@
       }
     },
     "error": {
-      "unable_to_load": "Không thể tải {{section}}",
-      "retry": "Thử lại"
+      "unable_to_load": "Unable to load {{section}}",
+      "retry": "Retry"
     }
   }
-}
\ No newline at end of file
+}
diff --git a/locales/languages/zh-cn.json b/locales/languages/zh-cn.json
index 01d0f9177bc8..a14182f276bc 100644
--- a/locales/languages/zh-cn.json
+++ b/locales/languages/zh-cn.json
@@ -562,6 +562,7 @@
     "ok": "确定",
     "cancel": "取消",
     "error": "错误",
+    "open_settings": "设置",
     "attempting_sync_from_wallet_error": "好像您正尝试与扩展程序同步。要进行同步，请转至“设置”>“高级”>“与 MetaMask 扩展程序同步”"
   },
   "action_view": {
diff --git a/locales/languages/zh.json b/locales/languages/zh.json
index e816d95be023..e6963cd82c71 100644
--- a/locales/languages/zh.json
+++ b/locales/languages/zh.json
@@ -104,8 +104,8 @@
       "title": "资金不足"
     },
     "insufficient_pay_token_native_post_quote": {
-      "message": "Not enough {{ticker}} to cover fees. Add {{ticker}} to continue.",
-      "title": "Insufficient funds for post quote"
+      "message": "{{ticker}} 余额不足，无法支付费用。请添加 {{ticker}} 以继续。",
+      "title": "资金不足，无法发布报价"
     },
     "no_pay_token_quotes": {
       "message": "目前该支付路径不可用。请调整金额、网络或代币类型，系统将为您匹配最优选项。",
@@ -1184,7 +1184,6 @@
       "title": "新订单",
       "leverage": "杠杆",
       "limit_price": "限价",
-      "market_price": "市价",
       "enter_price": "入场价格",
       "trigger_price": "触发价格",
       "liquidation_price": "清算价格",
@@ -1328,7 +1327,6 @@
       "funds_are_available_to_trade": "资金可用于交易",
       "close_order_still_active": "平仓订单仍有效",
       "order_submitted": "订单已提交",
-      "submitting_your_trade": "正在提交您的交易",
       "order_filled": "订单已成交",
       "order_placed": "订单已下达",
       "order_placement_subtitle": "{{direction}}{{amount}}{{assetSymbol}}",
@@ -1346,26 +1344,14 @@
       "title": "订单详情",
       "cancel_order": "取消订单",
       "date": "日期",
-      "trigger_condition": "触发条件",
-      "price": "价格",
       "fee": "费用",
       "limit_buy": "限价多头仓位",
       "limit_price": "限价",
       "limit_sell": "限价空头仓位",
       "market_buy": "市价多头仓位",
       "market_sell": "市价空头仓位",
-      "market": "市场型",
       "open": "未平仓",
       "size": "规模",
-      "original_size": "原始规模",
-      "order_value": "订单价值",
-      "reduce_only": "仅减仓",
-      "yes": "是",
-      "no": "否",
-      "price_above": "价格高于 {{price}}",
-      "price_below": "价格低于 {{price}}",
-      "take_profit": "止盈",
-      "stop_loss": "止损",
       "status": "状态",
       "view_explorer": "在区块链浏览器中查看"
     },
@@ -2197,6 +2183,7 @@
     "available_balance": "可用余额",
     "claim_amount_text": "领取 ${{amount}}",
     "claim_winnings_text": "领取收益",
+    "claiming_text": "Claiming...",
     "unrealized_pnl_label": "未实现盈亏",
     "unrealized_pnl_value": "{{amount}}（{{percent}}）",
     "unrealized_pnl_error": "无法加载",
@@ -2275,6 +2262,9 @@
           "title": "出错了......",
           "description": "继续领取失败",
           "try_again": "请重试"
+        },
+        "in_progress": {
+          "title": "Claim already in progress"
         }
       }
     },
@@ -2308,7 +2298,6 @@
       "withdrawing_subtitle": "约 1 分钟后可用",
       "withdraw_completed": "提取完成",
       "withdraw_completed_subtitle": "{{amount}} USDC 已转移到您的钱包",
-      "withdraw_any_token_completed_subtitle": "{{amount}} {{token}} 已转入您的钱包",
       "error_title": "出错了......",
       "error_description": "提款处理失败",
       "try_again": "请重试"
@@ -2440,7 +2429,7 @@
     "add_tokens": "添加资产",
     "are_you_sure_exit": "Are you sure you want to exit?",
     "import_token": "Would you like to import this token?",
-    "import_tokens": "您想要导入这些代币吗？",
+    "import_tokens": "Would you like to import these tokens?",
     "tokens_detected_in_account": "在此账户中找到{{tokenCount}}个新的{{tokensLabel}}",
     "token_toast": {
       "tokens_imported_title": "已导入的代币",
@@ -2705,7 +2694,7 @@
     "decimals_cant_be_empty": "代币小数位数不能为空。",
     "decimals_is_required": "Decimal is required. Find it on:",
     "no_tokens_found": "我们无法找到具有该名称的任何代币。",
-    "tokens_empty_description": "搜索任意代币并导入",
+    "tokens_empty_description": "Search for any token and import it",
     "select_token": "选择代币",
     "address_must_be_smart_contract": "检测到个人地址。输入代币合约地址。",
     "billion_abbreviation": "十亿",
@@ -2915,10 +2904,6 @@
     "enabling_notifications": "正在启用通知...",
     "updating_notifications": "正在更新通知......",
     "updating_account_settings": "正在更新账户设置......",
-    "reset_notifications_title": "重设通知",
-    "reset_notifications_description": "重设通知意味着您要删除通知存储密钥并重设所有通知历史记录。您确定要这样做吗？",
-    "reset_notifications": "重设通知",
-    "reset_notifications_success": "已删除/重新创建通知存储密钥，并重设通知历史记录。",
     "notifications_dismiss_modal": "忽略",
     "select_rpc_url": "选择 RPC（远程过程调用）URL",
     "title": "设置",
@@ -3040,9 +3025,9 @@
     "add_rpc_url": "添加 RPC（远程过程调用）URL",
     "add_block_explorer_url": "添加区块浏览器 URL",
     "networks_desc": "添加并编辑自定义 RPC 网络",
-    "networks_enabled": "启用的网络",
-    "networks_test_networks": "测试网络",
-    "networks_additional": "其他网络",
+    "networks_enabled": "Enabled Networks",
+    "networks_test_networks": "Test Networks",
+    "networks_additional": "Additional Networks",
     "networks_search_placeholder": "搜索网络",
     "networks_no_results": "未找到网络",
     "network_name_label": "网络名称",
@@ -3062,15 +3047,15 @@
     "network_rpc_networks": "RPC 网络",
     "network_add_network": "添加网络",
     "add_chain_title": "添加网络",
-    "add_chain_search_placeholder": "按名称、链 ID或货币搜索",
-    "add_chain_loading": "加载网络中……",
-    "add_chain_error": "加载网络失败。请重试。",
+    "add_chain_search_placeholder": "Search by name, chain ID, or currency",
+    "add_chain_loading": "Loading networks…",
+    "add_chain_error": "Failed to load networks. Please try again.",
     "add_chain_retry": "重试",
-    "add_chain_added": "已添加",
+    "add_chain_added": "Added",
     "add_chain_or": "或",
     "add_chain_custom_link": "添加自定义网络",
     "network_add_custom_network": "添加自定义网络",
-    "network_add_test_network": "添加测试网络",
+    "network_add_test_network": "Add a test network",
     "network_add": "添加",
     "network_save": "保存",
     "remove_network_title": "是否要删除此网络？",
@@ -3394,9 +3379,11 @@
     ],
     "private_key_explanation": "将它保存在安全、秘密的地方。",
     "private_key_warning": "这是当前选定账户的私钥：{{accountName}}。请勿泄露此密钥。任何得到您的私钥的人都可以完全控制您的账户，包括转走所有资金。",
-    "seed_phrase_warning_explanation": "确保没人窥视您的屏幕。MetaMask 支持团队绝不会索要此类信息。",
+    "seed_phrase_warning_explanation": [
+      "确保没有人在看您的屏幕。",
+      "MetaMask 支持部门绝对不会要求您提供这个。"
+    ],
     "private_key_warning_explanation": "请勿泄露此密钥。任何得到您的私钥的人都可以完全控制您的账户，包括转账所有资金。",
-    "reveal_srp_description": "您的私钥助记词可授予对您钱包的完全访问权限。切勿与任何人分享。",
     "reveal_credential_modal": [
       "您的 {{credentialName}} 提供 ",
       "对您的账户和资金的完全访问权限。\n\n请勿与任何人分享。\n",
@@ -3428,8 +3415,7 @@
     "srp_text": "私钥助记词，",
     "private_key_text": "私钥",
     "got_it": "知道了",
-    "learn_more": "了解详情",
-    "copied_to_clipboard": "已复制到剪贴板"
+    "learn_more": "了解详情"
   },
   "screenshot_deterrent": {
     "title": "安全警告",
@@ -3810,7 +3796,7 @@
     "transaction_fee_explanation": "交易费用与此权限关联。",
     "view_details": "查看详细信息",
     "view_transaction_details": "查看交易详情",
-    "view_data": "查看数据",
+    "view_data": "View data",
     "transaction_details": "交易详情",
     "site_url": "站点 URL",
     "permission_request": "权限请求",
@@ -3891,7 +3877,7 @@
     "right_button": "保护钱包"
   },
   "add_favorite": {
-    "title": "添加到收藏夹",
+    "title": "Add favorite",
     "title_label": "名称",
     "url_label": "URL",
     "add_button": "添加",
@@ -4245,8 +4231,8 @@
   "biometrics": {
     "enable_touchid": "使用 Touch ID 登录？",
     "enable_faceid": "使用 Face ID 登录？",
-    "enable_fingerprint": "使用指纹解锁？",
-    "enable_biometrics": "使用生物识别解锁？",
+    "enable_fingerprint": "Unlock with fingerprint?",
+    "enable_biometrics": "Unlock with biometrics?",
     "enable_device_passcode_ios": "使用设备密码登录？",
     "enable_device_passcode_android": "使用设备 PIN 登录？"
   },
@@ -4772,7 +4758,7 @@
     "public_address": "公钥",
     "public_address_qr_code": "公钥",
     "coming_soon": "即将推出...",
-    "request_payment": "请求付款",
+    "request_payment": "Request payment",
     "copy": "复制",
     "scan_address": "扫描地址以接收付款",
     "copy_address": "复制地址"
@@ -4786,8 +4772,8 @@
     "switch_network": "请切换为 mainnet 或 sepolia",
     "card_title": "始终显示 MetaMask 卡按钮",
     "card_desc": "MetaMask 卡仅对特定国家/地区的居民开放.",
-    "daimo_demo_title": "使用 DaimoPay 演示环境",
-    "daimo_demo_desc": "在 DaimoPay 演示环境和生产环境之间切换，以进行用卡支付。"
+    "daimo_demo_title": "Use DaimoPay demo environment",
+    "daimo_demo_desc": "Toggle between DaimoPay demo and production environments for card payments."
   },
   "walletconnect_sessions": {
     "no_active_sessions": "您没有活动会话",
@@ -4800,10 +4786,10 @@
     "close_current_session": "在开始新会话之前，请先关闭当前会话。"
   },
   "paymentRequest": {
-    "title": "付款请求",
-    "title_complete": "付款完成",
+    "title": "Payment request",
+    "title_complete": "Payment complete",
     "confirm": "支付",
-    "cancel": "拒绝",
+    "cancel": "Decline",
     "is_requesting_you_to_pay": "请求您付款",
     "total": "总额:"
   },
@@ -4838,7 +4824,6 @@
     "no_payment_methods_available": "无可用支付方式。",
     "error_fetching_quotes": "出错了。请重试。",
     "no_quotes_available": "没有可用的提供商。",
-    "quote_unavailable": "报价不可用。",
     "providers": "提供商",
     "quotes_displayed_for": "为 {{paymentMethodName}} 显示的报价。",
     "other_options": "Other options",
@@ -4944,10 +4929,10 @@
       "logged_out_error": "退出登录时出错"
     },
     "token_unavailable_modal": {
-      "title": "不可用",
-      "description": "{{token}} 无法通过 {{provider}} 在您所在的地区使用。",
-      "change_token": "更换代币",
-      "change_provider": "更换提供商"
+      "title": "Not available",
+      "description": "{{token}} is not available with {{provider}} in your region.",
+      "change_token": "Change token",
+      "change_provider": "Change provider"
     },
     "provider_picker_modal": {
       "title": "选择提供商"
@@ -5185,39 +5170,6 @@
     },
     "deposit_order_title": "{{currency}} 存款"
   },
-  "ramps_order_details": {
-    "title": "订单详情",
-    "status": "状态",
-    "processing": "处理中",
-    "complete": "完成",
-    "failed": "失败",
-    "cancelled": "已取消",
-    "view_on_provider": "在 {{provider}} 上查看",
-    "order_id": "订单 ID",
-    "date_and_time": "日期和时间",
-    "fees": "费用",
-    "total": "总额",
-    "card_processing_info": "卡支付通常需要几分钟时间",
-    "processing_info_modal_description": "用卡购买通常需要几分钟时间。如有疑问，您可以联系支持团队。",
-    "go_to_provider_support": "前往 {{provider}} 支持页面",
-    "error_title": "出错了......",
-    "error_message": "无法加载订单详情。请重试。",
-    "try_again": "请重试",
-    "close": "关闭"
-  },
-  "ramps_v2": {
-    "notifications": {
-      "purchase_pending_title": "正在处理您的 {{cryptocurrency}} 购买",
-      "purchase_pending_description": "整个过程通常只有几分钟时间...",
-      "purchase_completed_title": "您已成功购买 {{amount}} {{cryptocurrency}}！",
-      "purchase_completed_description": "您的 {{cryptocurrency}} 现在可用",
-      "purchase_failed_title": "购买 {{cryptocurrency}} 失败",
-      "purchase_failed_description": "请稍后重试",
-      "purchase_cancelled_title": "您的购买已取消",
-      "purchase_cancelled_description": "您对 {{cryptocurrency}} 的购买已被取消",
-      "track": "追踪"
-    }
-  },
   "swaps": {
     "title": "交换",
     "onboarding": {
@@ -5734,15 +5686,12 @@
     "new_wallet_needed_description_part_three": "为了避免再次发生这种情况，请确保将 MetaMask 应用程序和操作系统始终更新至最新版本。"
   },
   "srp_security_quiz": {
-    "question_step": "第 {{step}} 个问题，共 {{total}} 个",
     "title": "安全问答",
     "introduction": "要查看私钥助记词，您需要答对两个问题",
     "get_started": "开始",
     "learn_more": "了解详情",
     "try_again": "请重试",
     "continue": "继续",
-    "correct": "正确！",
-    "incorrect": "错误！",
     "of": "/",
     "question_one": {
       "question": "如果您丢失了私钥助记词，MetaMask......",
@@ -5921,8 +5870,8 @@
     "claimable_bonus_tooltip": "The annualized bonus you’ve earned for holding mUSD. Your bonus is claimable daily on Linea.",
     "earn_a_percentage_bonus": "获得 {{percentage}}% 的奖励",
     "claimable_bonus": "可领取奖励",
-    "claim_bonus": "领取奖励",
-    "claim_bonus_subtitle": "奖励将在 {{networkName}} 上发放。",
+    "claim_bonus": "Claim bonus",
+    "claim_bonus_subtitle": "Bonus will be paid out on {{networkName}}.",
     "empty_state_cta": {
       "heading": "借出 {{tokenSymbol}} 并赚取",
       "body": "通过 {{protocol}} 借出您的 {{tokenSymbol}}，",
@@ -5933,7 +5882,7 @@
     "service_interruption_banner": {
       "maintenance_message": "我们正在进行系统维护。即将恢复服务！"
     },
-    "supply": "供应",
+    "supply": "Supply",
     "deposit": "保证金",
     "approve": "批准",
     "approval": "批准",
@@ -5982,7 +5931,7 @@
     "network": "网络",
     "health_factor": "健康系数",
     "liquidation_risk": "清算风险",
-    "insufficient_pool_liquidity": "资金池流动性不足",
+    "insufficient_pool_liquidity": "Insufficient pool liquidity",
     "available_to_withdraw": "可提取",
     "unknown": "未知",
     "how_it_works": "如何运行",
@@ -6001,7 +5950,7 @@
       "lending": "头寸历史",
       "staking": "奖励发放记录"
     },
-    "allowance_reset": "授权额度重设",
+    "allowance_reset": "Allowance reset",
     "tron": {
       "fee": "费用"
     },
@@ -6009,20 +5958,8 @@
       "ok": "OK",
       "continue": "继续",
       "convert_and_get_percentage_bonus": "转换并获得 {{percentage}}%",
-      "your_musd": "您的 mUSD",
-      "balance_breakdown_title": "您在各网络的 mUSD 余额",
-      "balance_amount": "{{amount}} mUSD",
-      "balance_amount_with_symbol": "{{amount}} {{symbol}}",
-      "balance_fiat_unavailable": "—",
-      "convert_to_musd": "兑换为 mUSD",
       "get_a_percentage_musd_bonus": "获取 {{percentage}}% mUSD 奖励",
       "convert": "兑换",
-      "fetching_quote": "正在获取报价...",
-      "you_convert": "您兑换",
-      "network_fee": "网络费",
-      "earning": "收益",
-      "quick_convert_description": "选择代币以兑换您的全部余额，或点击编辑图标输入自定义金额。",
-      "no_tokens_to_convert": "您没有任何可以兑换为 mUSD 的代币。",
       "toasts": {
         "converting": "正在将 {{token}} 兑换为 mUSD",
         "eta": "大约 {{time}}",
@@ -6062,7 +5999,7 @@
       "toasts": {
         "claiming": "您的 mUSD 奖励正在处理中",
         "delivered": "您的 mUSD 奖励已到账！",
-        "failed": "领取奖励失败"
+        "failed": "Bonus claim failed"
       }
     },
     "rewards": {
@@ -6073,8 +6010,7 @@
       "tooltip_opted_in_footer": "积分将自动添加至您的账户。",
       "tooltip_not_opted_in_footer": "参与奖励计划即可获得积分。",
       "tooltip_close": "关闭"
-    },
-    "your_stablecoins": "您的稳定币"
+    }
   },
   "stake": {
     "stake": "Stake",
@@ -6096,7 +6032,9 @@
       "fee": "费用",
       "errors": {
         "insufficient_balance": "您的资源余额不足以执行此操作。"
-      }
+      },
+      "trx_unstaking_in_progress": "{{amount}} TRX 解除质押正在进行中。解除质押需 14 天。",
+      "has_claimable_trx": "You can claim {{amount}} TRX. Once claimed you'll get TRX back in your wallet."
     },
     "stake_eth": "质押 ETH",
     "unstake_eth": "解除质押 ETH",
@@ -6574,7 +6512,7 @@
     "hardware_wallet_not_supported": "目前暂不支持硬件钱包。请改用热钱包继续操作。",
     "hardware_wallet_not_supported_solana": "Solana 目前暂不支持硬件钱包。请改用热钱包继续操作。",
     "price_impact_info_title": "价格影响",
-    "price_impact_info_description": "价格影响反映您的兑换订单对资产市场价格的影响程度。它取决于交易规模及资金池的可用流动性状况。MetaMask 不参与亦不控制价格影响。",
+    "price_impact_info_description": "This is how your trade changes the market price of a token. It depends on the trade size, available liquidity, and provider fees. MetaMask doesn't control price impact.",
     "price_impact_info_gasless_description": "价格影响反映您的兑换订单对资产市场价格的影响程度。如果您没有足够的资金支付燃料费，系统将自动分配部分源代币用于支付费用，这会扩大价格影响。MetaMask 不参与亦不控制价格影响。",
     "price_impact_warning_description": "This trade has an estimated {{priceImpact}} price impact, which reflects how much your trade changes the market price. The quote already reflects this.",
     "price_impact_high": "High price impact",
@@ -6600,6 +6538,7 @@
     },
     "submit": "提交",
     "default_slippage_description": "如果价格变化超过滑移百分比，您的交易将无法成功。",
+    "cancel": "取消",
     "confirm": "确认",
     "exceeding_upper_slippage_warning": "高滑移，这可能导致不利兑换",
     "exceeding_lower_slippage_warning": "低滑移，这可能导致不利兑换",
@@ -7282,19 +7221,6 @@
       "retry": "请重试",
       "on_linea": "在 Linea 上"
     },
-    "cashback_screen": {
-      "title": "返现",
-      "available_cashback": "可用返现",
-      "network_fee": "网络费",
-      "expected_to_receive": "预计收到",
-      "withdraw": "提取",
-      "withdraw_unavailable": "提现不可用",
-      "withdrawal_initiated": "已发起提现",
-      "withdrawal_success": "提现成功完成",
-      "withdrawal_failed": "提现失败。请重试。",
-      "no_cashback": "无可用返现",
-      "loading_error": "加载返现失败。请重试。"
-    },
     "change_asset": {
       "title": "更改代币和网络",
       "full_spending_access": "全额消费权限",
@@ -7469,10 +7395,7 @@
       "service_not_available": "服务暂不可用。请稍后再试。",
       "invalid_referral_code": "推荐码无效。请检查后重试。",
       "already_referred": "您已被其他用户推荐过。",
-      "cannot_use_own_referral_code": "您无法使用您本人的推荐码。",
-      "invalid_bonus_code": "奖励代码无效",
-      "already_redeemed": "您已兑换过此奖励代码",
-      "reached_maximum": "此奖励代码已达到最大使用次数"
+      "cannot_use_own_referral_code": "您无法使用您本人的推荐码。"
     },
     "claim_reward_error": {
       "title": "领取奖励失败"
@@ -7529,10 +7452,8 @@
         "predict": "预测",
         "musd_deposit": "mUSD 保证金",
         "apply_referral_bonus": "推荐码奖励",
-        "bonus_code": "奖励代码",
         "uncategorized_event": "未归类事件"
       },
-      "code": "代码",
       "date": "日期",
       "account": "账户",
       "bonus": "奖励",
@@ -7651,10 +7572,6 @@
       "invalid_code": "推荐码无效",
       "apply_button": "应用推荐码"
     },
-    "bonus_code": {
-      "input_placeholder": "输入奖励代码",
-      "apply_success": "奖励代码已应用！"
-    },
     "optout": {
       "title": "注销奖励计划账户",
       "description": "此操作将从奖励计划中注销您的账户，并清空您的积分与进度记录。此操作无法撤销。",
@@ -7791,14 +7708,12 @@
     },
     "label": {
       "bridge_fee": "跨链桥费用",
-      "provider_fee": "服务商费用",
       "network_fee": "网络费",
       "paid_with": "已使用以下支付方式付款：",
-      "receive_token": "收款代币",
       "retry_button": "请重试",
       "total": "总额",
       "account": "账户",
-      "received_total": "收款总额"
+      "received_total": "Received total"
     },
     "summary_title": {
       "bridge_approval": "批准 {{approveSymbol}}",
@@ -7851,15 +7766,14 @@
     "still_connecting_network": "仍在连接到 {{networkName}}……",
     "unable_to_connect_network": "无法连接到 {{networkName}}。",
     "update_rpc": "更新 RPC（远程过程调用）",
-    "switch_to_metamask_default_rpc": "切换到 MetaMask 默认 RPC",
+    "switch_to_metamask_default_rpc": "Switch to MetaMask default RPC",
     "check_network_connectivity": "请检查您的网络连接。",
     "check_network_connectivity_or": "请检查您的网络连接或",
-    "updated_to_metamask_default": "已更新至 MetaMask 默认设置"
+    "updated_to_metamask_default": "Updated to MetaMask default"
   },
   "trending": {
     "title": "探索",
     "trending_tokens": "热门代币",
-    "stocks": "股票",
     "price_change": "价格变化",
     "all_networks": "所有网络",
     "24h": "24 小时",
@@ -8007,8 +7921,8 @@
       }
     },
     "error": {
-      "unable_to_load": "无法加载 {{section}}",
-      "retry": "重试"
+      "unable_to_load": "Unable to load {{section}}",
+      "retry": "Retry"
     }
   }
-}
\ No newline at end of file
+}
diff --git a/metro.config.js b/metro.config.js
index 26aef32de6ff..4f292d667145 100644
--- a/metro.config.js
+++ b/metro.config.js
@@ -98,6 +98,29 @@ module.exports = function (baseConfig) {
           'node:buffer': '@craftzdog/react-native-buffer',
         },
         resolveRequest: (context, moduleName, platform) => {
+          // @ecies/ciphers uses package.json "exports" subpaths that Metro
+          // can't resolve without unstable_enablePackageExports. Map them to
+          // the react-native condition targets manually.
+          // Note: require.resolve can't be used here because the package's
+          // "exports" field blocks direct dist/ access.
+          if (moduleName === '@ecies/ciphers/aes') {
+            return {
+              filePath: path.resolve(
+                __dirname,
+                'node_modules/@ecies/ciphers/dist/aes/noble.js',
+              ),
+              type: 'sourceFile',
+            };
+          }
+          if (moduleName === '@ecies/ciphers/chacha') {
+            return {
+              filePath: path.resolve(
+                __dirname,
+                'node_modules/@ecies/ciphers/dist/chacha/noble.js',
+              ),
+              type: 'sourceFile',
+            };
+          }
           // Use axios browser build so Node-only deps (e.g. http2) are never pulled in
           if (
             moduleName === 'axios' ||
diff --git a/package.json b/package.json
index 21c5fe2654ee..d326ee35851e 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "metamask",
-  "version": "7.68.1",
+  "version": "7.69.0",
   "private": true,
   "scripts": {
     "install:foundryup": "yarn mm-foundryup",
@@ -130,7 +130,12 @@
     "gen-bundle:ios": "NODE_OPTIONS='--max-old-space-size=8192' yarn react-native bundle --platform ios --dev false --entry-file index.js --bundle-output ios/main.jsbundle",
     "gen-bundle:android": "yarn react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/main.jsbundle",
     "circular:deps": "dpdm ./app/* --circular --exit-code circular:1 --warning=false",
-    "generate-icons": "yarn ts-node app/component-library/components/Icons/Icon/scripts/generate-assets.ts"
+    "generate-icons": "yarn ts-node app/component-library/components/Icons/Icon/scripts/generate-assets.ts",
+    "a:start": "scripts/perps/agentic/start-metro.sh",
+    "a:stop": "scripts/perps/agentic/stop-metro.sh",
+    "a:status": "scripts/perps/agentic/app-state.sh status",
+    "a:reload": "scripts/perps/agentic/reload-metro.sh",
+    "a:navigate": "scripts/perps/agentic/app-navigate.sh"
   },
   "lint-staged": {
     "*.{js,jsx,ts,tsx}": [
@@ -174,7 +179,8 @@
     "@metamask/core-backend": "^5.0.0",
     "bn.js@npm:4.11.6": "4.12.3",
     "bn.js@npm:5.2.1": "5.2.3",
-    "@metamask/assets-controllers@npm:^99.4.0": "patch:@metamask/assets-controllers@npm%3A100.0.3#~/.yarn/patches/@metamask-assets-controllers-npm-100.0.3-ea172b88c9.patch"
+    "@metamask/bridge-controller@npm:^67.1.1": "patch:@metamask/bridge-controller@npm%3A67.2.0#~/.yarn/patches/@metamask-bridge-controller-npm-67.2.0-32d3aafe1f.patch",
+    "@metamask/bridge-status-controller@npm:^67.0.1": "patch:@metamask/bridge-status-controller@npm%3A67.0.1#~/.yarn/patches/@metamask-bridge-status-controller-npm-67.0.1-d8a41d9c02.patch"
   },
   "dependencies": {
     "@config-plugins/detox": "^9.0.0",
@@ -195,16 +201,16 @@
     "@metamask/account-tree-controller": "^4.1.1",
     "@metamask/accounts-controller": "^36.0.0",
     "@metamask/address-book-controller": "^7.0.1",
-    "@metamask/ai-controllers": "^0.1.0",
+    "@metamask/ai-controllers": "^0.2.0",
     "@metamask/analytics-controller": "^1.0.0",
     "@metamask/app-metadata-controller": "^2.0.0",
     "@metamask/approval-controller": "^8.0.0",
     "@metamask/assets-controller": "^2.0.0",
-    "@metamask/assets-controllers": "patch:@metamask/assets-controllers@npm%3A100.0.3#~/.yarn/patches/@metamask-assets-controllers-npm-100.0.3-ea172b88c9.patch",
+    "@metamask/assets-controllers": "^100.1.0",
     "@metamask/base-controller": "^9.0.0",
     "@metamask/bitcoin-wallet-snap": "^1.10.0",
-    "@metamask/bridge-controller": "patch:@metamask/bridge-controller@npm%3A66.2.0#~/.yarn/patches/@metamask-bridge-controller-npm-66.2.0-8ed148964f.patch",
-    "@metamask/bridge-status-controller": "patch:@metamask/bridge-status-controller@npm%3A66.1.0#~/.yarn/patches/@metamask-bridge-status-controller-npm-66.1.0-a2a478ef94.patch",
+    "@metamask/bridge-controller": "^67.4.0",
+    "@metamask/bridge-status-controller": "patch:@metamask/bridge-status-controller@npm%3A67.0.1#~/.yarn/patches/@metamask-bridge-status-controller-npm-67.0.1-d8a41d9c02.patch",
     "@metamask/chain-agnostic-permission": "^1.3.0",
     "@metamask/connectivity-controller": "^0.1.0",
     "@metamask/controller-utils": "^11.18.0",
@@ -213,7 +219,7 @@
     "@metamask/delegation-deployments": "^0.15.0",
     "@metamask/design-system-react-native": "^0.8.0",
     "@metamask/design-system-twrnc-preset": "^0.3.0",
-    "@metamask/design-tokens": "^8.2.0",
+    "@metamask/design-tokens": "^8.2.2",
     "@metamask/earn-controller": "^10.0.0",
     "@metamask/eip-5792-middleware": "^2.0.0",
     "@metamask/eip1193-permission-middleware": "^1.0.2",
@@ -264,14 +270,14 @@
     "@metamask/preinstalled-example-snap": "^0.7.2",
     "@metamask/profile-metrics-controller": "^2.0.0",
     "@metamask/profile-sync-controller": "^27.1.0",
-    "@metamask/ramps-controller": "^10.0.0",
+    "@metamask/ramps-controller": "^10.2.0",
     "@metamask/react-native-acm": "^1.0.1",
     "@metamask/react-native-actionsheet": "2.4.2",
     "@metamask/react-native-button": "^3.0.0",
     "@metamask/react-native-payments": "^2.0.0",
     "@metamask/react-native-search-api": "1.0.1",
     "@metamask/react-native-webview": "^14.6.0",
-    "@metamask/remote-feature-flag-controller": "^4.0.0",
+    "@metamask/remote-feature-flag-controller": "^4.1.0",
     "@metamask/rpc-errors": "^7.0.2",
     "@metamask/sample-controllers": "^3.0.0",
     "@metamask/scure-bip39": "^2.1.0",
@@ -294,8 +300,8 @@
     "@metamask/swappable-obj-proxy": "^2.1.0",
     "@metamask/swaps-controller": "^15.0.0",
     "@metamask/transaction-controller": "^62.19.0",
-    "@metamask/transaction-pay-controller": "^16.1.2",
-    "@metamask/tron-wallet-snap": "^1.21.1",
+    "@metamask/transaction-pay-controller": "^16.3.0",
+    "@metamask/tron-wallet-snap": "1.22.1",
     "@metamask/utils": "^11.8.1",
     "@myx-trade/sdk": "^0.1.265",
     "@ngraveio/bc-ur": "^1.1.6",
@@ -360,7 +366,7 @@
     "cross-spawn": "7.0.6",
     "d3-shape": "^3.2.0",
     "dayjs": "^1.11.13",
-    "eciesjs": "^0.3.15",
+    "eciesjs": "0.4.17",
     "eth-ens-namehash": "2.0.8",
     "eth-url-parser": "1.0.4",
     "ethereumjs-abi": "^0.6.8",
@@ -509,7 +515,7 @@
     "@metamask/abi-utils": "^3.0.0",
     "@metamask/auto-changelog": "^5.3.0",
     "@metamask/browser-passworder": "^5.0.0",
-    "@metamask/browser-playground": "0.2.0",
+    "@metamask/browser-playground": "0.3.0",
     "@metamask/build-utils": "^3.0.0",
     "@metamask/eslint-config-typescript": "^10.0.0",
     "@metamask/eslint-plugin-design-tokens": "^1.0.0",
@@ -567,7 +573,7 @@
     "appium-chromium-driver": "^2.0.2",
     "appium-uiautomator2-driver": "4.2.7",
     "appium-xcuitest-driver": "5.16.1",
-    "appwright": "patch:appwright@npm%3A0.1.45#~/.yarn/patches/appwright-npm-0.1.45-f282bc1c1b.patch",
+    "appwright": "patch:appwright@patch%3Aappwright@npm%253A0.1.45%23~/.yarn/patches/appwright-npm-0.1.45-f282bc1c1b.patch%3A%3Aversion=0.1.45&hash=9b6269#~/.yarn/patches/appwright-patch-9fcd858d19.patch",
     "assert": "^1.5.0",
     "babel-jest": "^29.7.0",
     "babel-loader": "^9.1.3",
@@ -669,7 +675,7 @@
       "@sentry/react-native>@sentry/cli": true,
       "@storybook/manager-webpack5>@storybook/core-common>webpack>watchpack>watchpack-chokidar2>chokidar>fsevents": false,
       "@storybook/addon-controls>@storybook/core-common>esbuild": false,
-      "appium-adb>@appium/support>sharp": true,
+      "appium-adb>@appium/support>sharp": false,
       "appium>appium-android-driver>appium-chromedriver": false,
       "appium>appium-base-driver>webdriverio>@types/puppeteer-core>@types/puppeteer>puppeteer": false,
       "appium>appium-flutter-driver>rpc-websockets>bufferutil": false,
@@ -680,7 +686,6 @@
       "chromedriver": false,
       "detox": true,
       "detox>bunyan>dtrace-provider": false,
-      "eciesjs>secp256k1": true,
       "ethereumjs-util>keccak": true,
       "ethereumjs-util>secp256k1": true,
       "ganache>@trufflesuite/bigint-buffer": false,
@@ -697,7 +702,6 @@
       "@metamask/sdk-communication-layer>utf-8-validate": false,
       "detox>ws>bufferutil": false,
       "@metamask/notification-services-controller>firebase>@firebase/firestore>@grpc/proto-loader>protobufjs": false,
-      "@metamask/sdk-communication-layer>eciesjs>secp256k1": false,
       "detox>ws>utf-8-validate": false,
       "ganache>@trufflesuite/uws-js-unofficial>utf-8-validate": false,
       "@react-native-firebase/app>firebase>@firebase/firestore>@grpc/proto-loader>protobufjs": false,
diff --git a/scripts/apply-build-config.js b/scripts/apply-build-config.js
index 00c6d2386879..275929815b22 100755
--- a/scripts/apply-build-config.js
+++ b/scripts/apply-build-config.js
@@ -3,7 +3,7 @@
  * Loads build configuration from builds.yml and exports non-secret env vars.
  * Runs at workflow runtime (during the "Apply build config" step).
  *
- * Exports: env, code_fencing, remote_feature_flags. Does NOT handle secrets
+ * Exports: env, code_fencing. Does NOT handle secrets
  * (those are injected by the "Set secrets" step via set-secrets-from-config.js,
  * which reads all secrets via toJSON(secrets) — no explicit per-secret list needed).
  *
@@ -49,13 +49,6 @@ function applyConfig(buildName) {
     process.env.CODE_FENCING_FEATURES = JSON.stringify(config.code_fencing);
   }
 
-  // Set remote feature flag defaults (seeded into RemoteFeatureFlagController)
-  if (config.remote_feature_flags) {
-    process.env.REMOTE_FEATURE_FLAG_DEFAULTS = JSON.stringify(
-      config.remote_feature_flags,
-    );
-  }
-
   return config;
 }
 
@@ -76,12 +69,6 @@ function exportForShell(buildName) {
     );
   }
 
-  if (config.remote_feature_flags) {
-    lines.push(
-      `export REMOTE_FEATURE_FLAG_DEFAULTS='${JSON.stringify(config.remote_feature_flags)}'`,
-    );
-  }
-
   return lines.join('\n');
 }
 
@@ -116,13 +103,6 @@ function exportForGitHubEnv(buildName) {
     appendVar('CODE_FENCING_FEATURES', JSON.stringify(config.code_fencing));
   }
 
-  if (config.remote_feature_flags) {
-    appendVar(
-      'REMOTE_FEATURE_FLAG_DEFAULTS',
-      JSON.stringify(config.remote_feature_flags),
-    );
-  }
-
   return lines.join('\n');
 }
 
diff --git a/scripts/build.sh b/scripts/build.sh
index 4ec2125a0854..ec121ce68f7b 100755
--- a/scripts/build.sh
+++ b/scripts/build.sh
@@ -599,8 +599,12 @@ generateAndroidBinary() {
 
 		# Memory optimization for E2E builds (Keep an eye out if this breaks outside of E2E CI builds)
 		if [ "$METAMASK_ENVIRONMENT" = "e2e" ] ; then
-			# Only build for x86_64 for E2E builds
-			reactNativeArchitecturesArg="-PreactNativeArchitectures=x86_64"
+			# CI uses x86_64 emulators only; local macOS (Apple Silicon) also needs arm64-v8a
+			if [ "${CI:-false}" = "true" ] ; then
+				reactNativeArchitecturesArg="-PreactNativeArchitectures=x86_64"
+			else
+				reactNativeArchitecturesArg="-PreactNativeArchitectures=x86_64,arm64-v8a"
+			fi
 			# Enable verbose logging for E2E builds to help diagnose build failures
 			gradleLoggingFlags="--stacktrace --info"
 		fi
@@ -707,6 +711,7 @@ createEnvFile() {
 		"QUICKNODE_MONAD_URL"
 		"QUICKNODE_OPTIMISM_URL"
 		"QUICKNODE_POLYGON_URL"
+		"QUICKNODE_HYPEREVM_URL"
 	)
 
 	# Create .env file and export to GITHUB_ENV
diff --git a/scripts/docker/Dockerfile b/scripts/docker/Dockerfile
index 255c525a6e69..59f9b6998205 100644
--- a/scripts/docker/Dockerfile
+++ b/scripts/docker/Dockerfile
@@ -33,7 +33,7 @@ ENV HOME=/home/node
 # distro rbenv and ruby are out of date - install rbenv from git and manage ruby
 # RUBY_BUILD_VERSION=v20240501
 ARG RBENV_COMMIT=3bac268cdb81dd745ce13a1cf6ff4a286336ab3b
-ARG RUBY_BUILD_COMMIT=aab1b8d0e7e814f200320749501ba57e2fae20d0
+ARG RUBY_BUILD_COMMIT=d395d1ae53c9834f239ca42913d42dd2e0beaeb3
 RUN (mkdir /home/node/.rbenv \
     && curl -sL https://github.com/rbenv/rbenv/archive/${RBENV_COMMIT}.tar.gz \
     | tar --strip-components=1 -C /home/node/.rbenv/ -xzf - \
diff --git a/scripts/ios/bundle-js-and-sentry-upload.sh b/scripts/ios/bundle-js-and-sentry-upload.sh
index f36ff96b3974..a0dcf21d633d 100755
--- a/scripts/ios/bundle-js-and-sentry-upload.sh
+++ b/scripts/ios/bundle-js-and-sentry-upload.sh
@@ -26,6 +26,16 @@ export SENTRY_DISABLE_AUTO_UPLOAD=${SENTRY_DISABLE_AUTO_UPLOAD:-"true"}
 export SENTRY_DIST=$CURRENT_PROJECT_VERSION
 export SENTRY_RELEASE="$PRODUCT_BUNDLE_IDENTIFIER@$MARKETING_VERSION+$SENTRY_DIST"
 
+# Write source map to a fixed absolute path so Bitrise (and other CI) can
+# deploy it AND Sentry CLI can locate it for upload.
+# Using a relative path breaks Sentry: react-native-xcode.sh writes the file
+# with CWD=repo_root, but sentry-cli resolves SOURCEMAP_FILE relative to its
+# own CWD (ios/), causing a path mismatch. An absolute path anchored on
+# $PROJECT_DIR (set by Xcode to the ios/ directory) is unambiguous for all
+# sub-processes.
+REPO_ROOT="$(cd "${PROJECT_DIR}/.." && pwd)"
+mkdir -p "$REPO_ROOT/sourcemaps/ios"
+export SOURCEMAP_FILE="${SOURCEMAP_FILE:-$REPO_ROOT/sourcemaps/ios/index.js.map}"
 
 # Generate JS bundle and upload Sentry source maps
 REACT_NATIVE_XCODE="../node_modules/react-native/scripts/react-native-xcode.sh"
diff --git a/scripts/perps/agentic/app-state.sh b/scripts/perps/agentic/app-state.sh
index e848001cb29f..94dc619f2120 100755
--- a/scripts/perps/agentic/app-state.sh
+++ b/scripts/perps/agentic/app-state.sh
@@ -2,6 +2,7 @@
 # Query the running MetaMask app state via CDP bridge.
 #
 # Usage:
+#   scripts/perps/agentic/app-state.sh status                   # Route + selected account snapshot
 #   scripts/perps/agentic/app-state.sh route                    # Current route name
 #   scripts/perps/agentic/app-state.sh state engine              # Redux state at path
 #   scripts/perps/agentic/app-state.sh state engine.backgroundState.NetworkController
@@ -10,6 +11,11 @@
 #   scripts/perps/agentic/app-state.sh nav                      # Full navigation state
 #   scripts/perps/agentic/app-state.sh can-go-back              # Can navigate back?
 #   scripts/perps/agentic/app-state.sh go-back                  # Navigate back
+#   scripts/perps/agentic/app-state.sh accounts                 # List all accounts
+#   scripts/perps/agentic/app-state.sh account                  # Get selected account
+#   scripts/perps/agentic/app-state.sh switch-account <addr>    # Switch account
+#   scripts/perps/agentic/app-state.sh recipe perps/positions   # Run a recipe
+#   scripts/perps/agentic/app-state.sh recipe --list            # List recipes
 
 set -euo pipefail
 
@@ -19,6 +25,9 @@ COMMAND="${1:-route}"
 shift || true
 
 case "$COMMAND" in
+  status)
+    node scripts/perps/agentic/cdp-bridge.js status
+    ;;
   route)
     node scripts/perps/agentic/cdp-bridge.js get-route
     ;;
@@ -40,10 +49,23 @@ case "$COMMAND" in
   go-back)
     node scripts/perps/agentic/cdp-bridge.js go-back
     ;;
+  accounts)
+    node scripts/perps/agentic/cdp-bridge.js list-accounts
+    ;;
+  account)
+    node scripts/perps/agentic/cdp-bridge.js get-selected-account
+    ;;
+  switch-account)
+    node scripts/perps/agentic/cdp-bridge.js switch-account "$@"
+    ;;
+  recipe)
+    node scripts/perps/agentic/cdp-bridge.js recipe "$@"
+    ;;
   *)
     echo "Usage: app-state.sh <command> [args...]"
     echo ""
     echo "Commands:"
+    echo "  status                 Route + selected account snapshot"
     echo "  route                  Current route name and params"
     echo "  state <dot.path>       Redux state at the given path"
     echo "  nav                    Full navigation state tree"
@@ -51,6 +73,11 @@ case "$COMMAND" in
     echo "  eval-async <expr>      Evaluate async/Promise expression"
     echo "  can-go-back            Check if navigation can go back"
     echo "  go-back                Navigate back"
+    echo "  accounts               List all accounts"
+    echo "  account                Get the currently selected account"
+    echo "  switch-account <addr>  Switch to account by address"
+    echo "  recipe <team/name>     Run a recipe (e.g. perps/positions)"
+    echo "  recipe --list          List all available recipes"
     exit 1
     ;;
 esac
diff --git a/scripts/perps/agentic/cdp-bridge.js b/scripts/perps/agentic/cdp-bridge.js
index c65670570d81..22fd2b8a92ea 100644
--- a/scripts/perps/agentic/cdp-bridge.js
+++ b/scripts/perps/agentic/cdp-bridge.js
@@ -17,6 +17,8 @@
 'use strict';
 
 const http = require('node:http');
+const fs = require('node:fs');
+const path = require('node:path');
 
 // ---------------------------------------------------------------------------
 // Helpers
@@ -25,8 +27,6 @@ const http = require('node:http');
 /** Read a value from .js.env */
 function loadEnvValue(key) {
   try {
-    const fs = require('node:fs');
-    const path = require('node:path');
     const envPath = path.resolve(__dirname, '../../../.js.env');
     const content = fs.readFileSync(envPath, 'utf8');
     // .js.env uses `export KEY="value"` (shell-sourceable format),
@@ -528,6 +528,92 @@ const COMMANDS = {
     );
     return { currentRoute: route, deviceName, platform };
   },
+
+  async status(client, _args, { deviceName, platform } = {}) {
+    const expr = `(function() {
+      var route = globalThis.__AGENTIC__?.getRoute() || null;
+      var account = null;
+      try { account = globalThis.__AGENTIC__?.getSelectedAccount() || null; } catch(e) {}
+      return { route: route, account: account };
+    })()`;
+    const snapshot = await cdpEval(client, expr);
+    return Object.assign({}, snapshot, { deviceName: deviceName || '', platform: platform || '' });
+  },
+
+  async 'list-accounts'(client) {
+    return await cdpEval(client, 'globalThis.__AGENTIC__?.listAccounts()');
+  },
+
+  async 'get-selected-account'(client) {
+    return await cdpEval(client, 'globalThis.__AGENTIC__?.getSelectedAccount()');
+  },
+
+  async 'switch-account'(client, args) {
+    const address = args[0];
+    if (!address) {
+      throw new Error('Usage: switch-account <address>');
+    }
+    return await cdpEval(client, `globalThis.__AGENTIC__?.switchAccount(${JSON.stringify(address)})`);
+  },
+
+  async recipe(client, args) {
+    const arg = args[0];
+    if (!arg || arg === '--help') {
+      console.error('Usage: recipe <team/name> | recipe --list');
+      process.exit(1);
+    }
+
+    const recipesDir = path.resolve(__dirname, 'recipes');
+
+    if (arg === '--list') {
+      // List all available recipes from recipes/*.json
+      const files = fs.readdirSync(recipesDir).filter((f) => f.endsWith('.json'));
+      const all = {};
+      for (const file of files) {
+        const team = path.basename(file, '.json');
+        const data = JSON.parse(fs.readFileSync(path.join(recipesDir, file), 'utf8'));
+        all[team] = Object.fromEntries(
+          Object.entries(data).map(([name, r]) => [name, r.description || ''])
+        );
+      }
+      return all;
+    }
+
+    // Parse "team/name"
+    const parts = arg.split('/');
+    if (parts.length !== 2) {
+      throw new Error('Recipe must be in "team/name" format (e.g. perps/positions)');
+    }
+    const [team, name] = parts;
+    const recipeFile = path.join(recipesDir, `${team}.json`);
+    if (!fs.existsSync(recipeFile)) {
+      throw new Error(`No recipe file found: recipes/${team}.json`);
+    }
+    const recipes = JSON.parse(fs.readFileSync(recipeFile, 'utf8'));
+    const recipe = recipes[name];
+    if (!recipe) {
+      const available = Object.keys(recipes).join(', ');
+      throw new Error(`Recipe "${name}" not found in ${team}. Available: ${available}`);
+    }
+
+    let raw;
+    if (recipe.async) {
+      raw = await cdpEvalAsync(client, recipe.expression);
+    } else {
+      raw = await cdpEval(client, recipe.expression);
+    }
+    // Recipe expressions typically JSON.stringify their result.
+    // Parse it so main()'s JSON.stringify produces clean output
+    // instead of double-encoded strings.
+    if (typeof raw === 'string') {
+      try {
+        return JSON.parse(raw);
+      } catch {
+        // Not valid JSON — return as-is
+      }
+    }
+    return raw;
+  },
 };
 
 // ---------------------------------------------------------------------------
@@ -546,11 +632,18 @@ Usage:
 
 Commands:
   navigate <RouteName> [params-json]   Navigate to a screen
+  status                               Route + selected account snapshot
   get-route                            Get current route name and params
   get-state [dot.path]                 Get Redux state (or nav state if no path)
   eval <expression>                    Evaluate arbitrary JS in app context
+  eval-async <expression>              Evaluate async/Promise expression
   can-go-back                          Check if navigation can go back
   go-back                              Navigate back
+  list-accounts                        List all accounts
+  get-selected-account                 Get the currently selected account
+  switch-account <address>             Switch to account by address
+  recipe <team/name>                   Run a recipe (e.g. perps/positions)
+  recipe --list                        List all available recipes
 
 Environment:
   WATCHER_PORT    Metro port (default: 8081)
@@ -567,6 +660,13 @@ Environment:
     process.exit(1);
   }
 
+  // `recipe --list` only reads local JSON files — skip CDP connection entirely.
+  if (command === 'recipe' && args[1] === '--list') {
+    const result = await handler(null, args.slice(1), {});
+    console.log(JSON.stringify(result, null, 2));
+    return;
+  }
+
   const port = loadPort();
   const timeout = Number.parseInt(process.env.CDP_TIMEOUT || '5000', 10);
 
diff --git a/scripts/perps/agentic/recipes/README.md b/scripts/perps/agentic/recipes/README.md
new file mode 100644
index 000000000000..347e803850c5
--- /dev/null
+++ b/scripts/perps/agentic/recipes/README.md
@@ -0,0 +1,39 @@
+# Agentic Recipes
+
+Per-team recipe files for domain-specific CDP helpers. Each file is a JSON map of recipe name to expression.
+
+## Adding recipes
+
+Create `<team>.json` in this directory:
+
+```json
+{
+  "recipe-name": {
+    "description": "What it does",
+    "expression": "Engine.context.SomeController.someMethod().then(function(r){return JSON.stringify(r)})",
+    "async": true
+  }
+}
+```
+
+Fields:
+- **description** — shown in `recipe --list`
+- **expression** — JS expression evaluated in the app's Hermes runtime via CDP
+- **async** — `true` if the expression returns a Promise, `false` for sync
+
+## Usage
+
+```bash
+# Run a recipe
+scripts/perps/agentic/app-state.sh recipe <team>/<name>
+
+# List all recipes
+scripts/perps/agentic/app-state.sh recipe --list
+```
+
+## Tips
+
+- Use `.then(function(r){return JSON.stringify(r)})` for complex return values — CDP can only serialize primitives and plain objects
+- `Engine.context` gives access to all controllers registered on the Engine singleton
+- Recipes run in `__DEV__` mode only (the `Engine` global is exposed by NavigationService.ts)
+- Keep expressions self-contained — no external imports, no multi-statement blocks unless wrapped in an IIFE
diff --git a/scripts/perps/agentic/recipes/perps.json b/scripts/perps/agentic/recipes/perps.json
new file mode 100644
index 000000000000..8189e4e54235
--- /dev/null
+++ b/scripts/perps/agentic/recipes/perps.json
@@ -0,0 +1,52 @@
+{
+  "positions": {
+    "description": "Open perps positions",
+    "expression": "Engine.context.PerpsController.getPositions().then(function(r){return JSON.stringify(r)})",
+    "async": true
+  },
+  "auth": {
+    "description": "Active provider auth state (isReadyToTrade)",
+    "expression": "(function(){var c=Engine.context.PerpsController;var id=c.state.activeProvider;var p=c.providers.get(id);if(!p)return JSON.stringify({error:'no provider for '+id});return p.isReadyToTrade().then(function(r){return JSON.stringify({provider:id,isAuthenticated:r.ready,authenticatedAddress:r.authenticatedAddress||null})});})()",
+    "async": true
+  },
+  "balances": {
+    "description": "Account state (balances, margin) from cached state",
+    "expression": "JSON.stringify(Engine.context.PerpsController.state.accountState)",
+    "async": false
+  },
+  "markets": {
+    "description": "Markets with live prices",
+    "expression": "Engine.context.PerpsController.getMarketDataWithPrices().then(function(r){return JSON.stringify(r.map(function(m){return{symbol:m.symbol,price:m.price,change24h:m.change24hPercent}}))})",
+    "async": true
+  },
+  "orders": {
+    "description": "Open limit/stop orders",
+    "expression": "Engine.context.PerpsController.getOpenOrders().then(function(r){return JSON.stringify(r)})",
+    "async": true
+  },
+  "state": {
+    "description": "Full PerpsController state snapshot",
+    "expression": "JSON.stringify(Engine.context.PerpsController.state)",
+    "async": false
+  },
+  "providers": {
+    "description": "Registered provider IDs",
+    "expression": "JSON.stringify(Array.from(Engine.context.PerpsController.providers.keys()))",
+    "async": false
+  },
+  "pre-trade": {
+    "description": "Position count + balance snapshot before a trade (use for pre/post comparison)",
+    "expression": "Promise.all([Engine.context.PerpsController.getPositions(),Engine.context.PerpsController.getAccountState()]).then(function(r){return JSON.stringify({positionCount:r[0].length,positions:r[0].map(function(p){return{symbol:p.symbol,side:p.side,size:p.size,entryPrice:p.entryPrice,unrealizedPnl:p.unrealizedPnl}}),accountState:r[1]})})",
+    "async": true
+  },
+  "place-order": {
+    "description": "TEMPLATE: market buy BTC $10 at 2x leverage — substitute params via eval-async for custom scenarios",
+    "expression": "Engine.context.PerpsController.placeOrder({symbol:'BTC',isBuy:true,orderType:'market',size:'0.0001',leverage:2,usdAmount:'10',maxSlippageBps:500}).then(function(r){return JSON.stringify(r)})",
+    "async": true
+  },
+  "post-trade": {
+    "description": "Position count + balance snapshot after a trade (compare with pre-trade output)",
+    "expression": "Promise.all([Engine.context.PerpsController.getPositions(),Engine.context.PerpsController.getAccountState()]).then(function(r){return JSON.stringify({positionCount:r[0].length,positions:r[0].map(function(p){return{symbol:p.symbol,side:p.side,size:p.size,entryPrice:p.entryPrice,unrealizedPnl:p.unrealizedPnl}}),accountState:r[1]})})",
+    "async": true
+  }
+}
diff --git a/scripts/perps/agentic/test-trade-flow.sh b/scripts/perps/agentic/test-trade-flow.sh
deleted file mode 100755
index c14aa9ddc722..000000000000
--- a/scripts/perps/agentic/test-trade-flow.sh
+++ /dev/null
@@ -1,261 +0,0 @@
-#!/bin/bash
-set -euo pipefail
-# scripts/perps/agentic/test-trade-flow.sh
-# End-to-end trade flow validation — configurable for any scenario.
-#
-# Validates TAT-2597 (position doesn't appear after trade) and
-# TAT-2598 (missing 24h change, oracle price, can't trade) by:
-#   1. Placing a real order via PerpsController
-#   2. Monitoring [PERPS_DEBUG] logs for WS data flow
-#   3. Comparing pre/post position counts
-#
-# Prerequisites:
-#   - Metro running, device connected, app open
-#   - Engine exposed on globalThis (dev builds via __AGENTIC__ bridge)
-#
-# Usage:
-#   scripts/perps/agentic/test-trade-flow.sh                          # BTC long $10
-#   SYMBOL=ETH SIDE=sell ORDER_TYPE=limit LIMIT_PRICE=2100 \
-#     scripts/perps/agentic/test-trade-flow.sh
-#   SYMBOL=SOL SIZE=0.06 USD_AMOUNT=5 SKIP_CLOSE=1 \
-#     scripts/perps/agentic/test-trade-flow.sh
-#   SKIP_NAV=1 scripts/perps/agentic/test-trade-flow.sh              # Already on Perps
-
-SCRIPT_DIR="$(cd "$(dirname "$0")" && pwd)"
-cd "$SCRIPT_DIR/../../.."
-
-PLATFORM="${PLATFORM:-android}"
-SYMBOL="${SYMBOL:-${1:-BTC}}"
-SIDE="${SIDE:-buy}"
-SIZE="${SIZE:-0.0001}"
-USD_AMOUNT="${USD_AMOUNT:-10}"
-LEVERAGE="${LEVERAGE:-2}"
-ORDER_TYPE="${ORDER_TYPE:-market}"
-LIMIT_PRICE="${LIMIT_PRICE:-}"
-SLIPPAGE="${SLIPPAGE:-500}"
-SKIP_CLOSE="${SKIP_CLOSE:-}"
-SKIP_NAV="${SKIP_NAV:-}"
-WAIT_SECS="${WAIT_SECS:-5}"
-
-IS_BUY=$( [ "$SIDE" = "buy" ] && echo "true" || echo "false" )
-METRO_LOG=".agent/metro.log"
-PASS=true
-
-# Helper: eval async JS expression via CDP bridge
-eval_async() {
-  "$SCRIPT_DIR/app-state.sh" eval-async "$@"
-}
-
-echo "=== TRADE FLOW TEST ==="
-echo "Symbol: $SYMBOL | Side: $SIDE | Size: $SIZE | USD: $USD_AMOUNT"
-echo "Leverage: ${LEVERAGE}x | Type: $ORDER_TYPE | Slippage: ${SLIPPAGE}bps"
-echo ""
-
-# 1. Verify Engine is accessible
-echo "[0/9] Checking Engine availability..."
-ENGINE_CHECK=$("$SCRIPT_DIR/app-state.sh" eval "typeof Engine !== 'undefined' && typeof Engine.context !== 'undefined'" 2>&1) || ENGINE_CHECK="false"
-if [ "$ENGINE_CHECK" != "true" ]; then
-  echo "ERROR: Engine not available in CDP context."
-  echo "  Make sure the app is running a dev build with the agentic bridge."
-  echo "  Engine check returned: $ENGINE_CHECK"
-  exit 1
-fi
-echo "  Engine available"
-
-# 2. Navigate (optional)
-if [ -z "$SKIP_NAV" ]; then
-  echo "[1/9] Navigating to Perps..."
-  PLATFORM=$PLATFORM "$SCRIPT_DIR/app-navigate.sh" PerpsMarketListView --no-screenshot || true
-  sleep 3
-else
-  echo "[1/9] Skipping navigation (SKIP_NAV set)"
-fi
-
-# 3. Mark log position for later filtering
-LOG_MARKER=$(wc -l < "$METRO_LOG" 2>/dev/null | tr -d ' ' || echo 0)
-
-# 4. Pre-trade state
-echo "[2/9] Capturing pre-trade state..."
-PRE_STATE=$(eval_async "
-  Promise.all([
-    Engine.context.PerpsController.getPositions(),
-    Engine.context.PerpsController.getAccountState()
-  ]).then(function(results) {
-    var p = results[0]; var a = results[1];
-    return JSON.stringify({
-      positionCount: p.length,
-      symbols: p.map(function(x) { return x.symbol; }),
-      balance: a && a.withdrawable ? a.withdrawable : 'unknown'
-    });
-  })
-") || PRE_STATE='{"error":"failed to get pre-state"}'
-echo "  Pre-trade: $PRE_STATE"
-PRE_COUNT=$(echo "$PRE_STATE" | python3 -c "
-import sys,json
-raw = json.load(sys.stdin)
-# Handle double-encoded JSON (string containing JSON)
-if isinstance(raw, str):
-    raw = json.loads(raw)
-print(raw.get('positionCount', 0))
-" 2>/dev/null || echo 0)
-
-# 5. Fetch price
-echo "[3/9] Fetching current price for $SYMBOL..."
-PRICE=$(eval_async "
-  Engine.context.PerpsController.getMarketDataWithPrices().then(function(m) {
-    var mkt = m.find(function(x) { return x.symbol === '$SYMBOL' || x.name === '$SYMBOL'; });
-    return mkt ? (mkt.price || mkt.markPrice || mkt.oraclePrice || '0') : 'NOT_FOUND';
-  })
-") || PRICE="ERROR"
-# Strip surrounding quotes if double-encoded
-PRICE=$(echo "$PRICE" | sed 's/^"//;s/"$//')
-echo "  Price: $PRICE"
-if [ "$PRICE" = "NOT_FOUND" ] || [ "$PRICE" = "0" ] || [ "$PRICE" = "ERROR" ]; then
-  echo "ERROR: Could not fetch price for $SYMBOL"
-  exit 1
-fi
-
-# 6. Build order params
-PRICE_FIELD=""
-if [ "$ORDER_TYPE" = "limit" ] && [ -n "$LIMIT_PRICE" ]; then
-  PRICE_FIELD="price: '$LIMIT_PRICE',"
-fi
-
-ORDER_PARAMS="{ symbol: '$SYMBOL', isBuy: $IS_BUY, orderType: '$ORDER_TYPE', size: '$SIZE', leverage: $LEVERAGE, usdAmount: '$USD_AMOUNT', priceAtCalculation: $PRICE, maxSlippageBps: $SLIPPAGE, $PRICE_FIELD }"
-
-# 7. Validate
-echo "[4/9] Validating order..."
-VALIDATION=$(eval_async "
-  Engine.context.PerpsController.validateOrder($ORDER_PARAMS)
-    .then(function(r) { return JSON.stringify(r); })
-") || VALIDATION='{"error":"validation call failed"}'
-echo "  Validation: $VALIDATION"
-
-# Check for validation errors
-if echo "$VALIDATION" | python3 -c "
-import sys,json
-raw = json.load(sys.stdin)
-if isinstance(raw, str):
-    raw = json.loads(raw)
-sys.exit(0 if raw.get('isValid', raw.get('valid', True)) else 1)
-" 2>/dev/null; then
-  : # valid
-else
-  echo "WARNING: Order validation failed, proceeding anyway (may be expected)"
-fi
-
-# 8. Place order
-echo "[5/9] Placing order..."
-ORDER_START=$(python3 -c "import time; print(int(time.time()*1000))")
-ORDER_RESULT=$(eval_async "
-  Engine.context.PerpsController.placeOrder($ORDER_PARAMS)
-    .then(function(r) { return JSON.stringify(r); })
-    .catch(function(e) { return JSON.stringify({ error: e.message }); })
-") || ORDER_RESULT='{"error":"placeOrder call failed"}'
-ORDER_END=$(python3 -c "import time; print(int(time.time()*1000))")
-ORDER_MS=$((ORDER_END - ORDER_START))
-echo "  Result: $ORDER_RESULT (${ORDER_MS}ms)"
-
-if echo "$ORDER_RESULT" | grep -q '"error"'; then
-  echo "WARNING: Order may have failed"
-  PASS=false
-fi
-
-# 9. Wait for WS updates
-echo "[6/9] Waiting ${WAIT_SECS}s for WebSocket updates..."
-sleep "$WAIT_SECS"
-
-# 10. Capture debug logs since order
-echo "[7/9] PERPS_DEBUG logs since order:"
-echo "  --- Position-related ---"
-tail -n +"$((LOG_MARKER + 1))" "$METRO_LOG" 2>/dev/null | grep 'PERPS_DEBUG.*[Pp]osition' | head -20 || echo "  (none)"
-echo "  --- Price-related ---"
-tail -n +"$((LOG_MARKER + 1))" "$METRO_LOG" 2>/dev/null | grep 'PERPS_DEBUG.*[Pp]rice' | head -10 || echo "  (none)"
-
-# Count WS callbacks
-WS_POS_CALLBACKS=$(tail -n +"$((LOG_MARKER + 1))" "$METRO_LOG" 2>/dev/null | grep -c 'PositionStreamChannel: WS callback' || echo 0)
-WS_HOOK_UPDATES=$(tail -n +"$((LOG_MARKER + 1))" "$METRO_LOG" 2>/dev/null | grep -c 'usePerpsLivePositions: Update' || echo 0)
-WS_FIRST_PRICE=$(tail -n +"$((LOG_MARKER + 1))" "$METRO_LOG" 2>/dev/null | grep -c 'FIRST WS data received' || echo 0)
-
-# 11. Post-trade state
-echo "[8/9] Capturing post-trade state..."
-POST_STATE=$(eval_async "
-  Promise.all([
-    Engine.context.PerpsController.getPositions(),
-    Engine.context.PerpsController.getAccountState()
-  ]).then(function(results) {
-    var p = results[0]; var a = results[1];
-    return JSON.stringify({
-      positionCount: p.length,
-      symbols: p.map(function(x) { return x.symbol; }),
-      balance: a && a.withdrawable ? a.withdrawable : 'unknown'
-    });
-  })
-") || POST_STATE='{"error":"failed to get post-state"}'
-echo "  Post-trade: $POST_STATE"
-POST_COUNT=$(echo "$POST_STATE" | python3 -c "
-import sys,json
-raw = json.load(sys.stdin)
-if isinstance(raw, str):
-    raw = json.loads(raw)
-print(raw.get('positionCount', 0))
-" 2>/dev/null || echo 0)
-
-# Screenshot
-PLATFORM=$PLATFORM "$SCRIPT_DIR/screenshot.sh" "trade-${SYMBOL}-${SIDE}" || echo "  (screenshot failed)"
-
-# 12. Cleanup (optional)
-if [ -z "$SKIP_CLOSE" ]; then
-  echo "[9/9] Closing position..."
-  CLOSE_RESULT=$(eval_async "
-    Engine.context.PerpsController.closePosition({ symbol: '$SYMBOL' })
-      .then(function(r) { return JSON.stringify(r); })
-      .catch(function(e) { return JSON.stringify({ error: e.message }); })
-  ") || CLOSE_RESULT='{"error":"closePosition call failed"}'
-  echo "  Close: $CLOSE_RESULT"
-else
-  echo "[9/9] Skipping close (SKIP_CLOSE set)"
-fi
-
-# ── Summary ──────────────────────────────────────────────────────────
-echo ""
-echo "=== SUMMARY ==="
-echo "Pre:  $PRE_STATE"
-echo "Post: $POST_STATE"
-echo ""
-echo "--- TAT-2597 (position appears after trade) ---"
-echo "  Position count: $PRE_COUNT → $POST_COUNT"
-echo "  WS position callbacks: $WS_POS_CALLBACKS"
-echo "  Hook updates: $WS_HOOK_UPDATES"
-if [ "$POST_COUNT" -gt "$PRE_COUNT" ] 2>/dev/null; then
-  echo "  PASS: Position count increased"
-else
-  echo "  FAIL: Position count did not increase ($PRE_COUNT → $POST_COUNT)"
-  PASS=false
-fi
-if [ "$WS_POS_CALLBACKS" -gt 0 ] 2>/dev/null; then
-  echo "  PASS: WS delivered position data"
-else
-  echo "  FAIL: No WS position callbacks detected"
-  PASS=false
-fi
-
-echo ""
-echo "--- TAT-2598 (prices and market data flowing) ---"
-echo "  Price WS first data: $WS_FIRST_PRICE"
-if [ "$WS_FIRST_PRICE" -gt 0 ] 2>/dev/null; then
-  echo "  PASS: Price stream received first WS data"
-else
-  echo "  INFO: No FIRST WS data log (may have received data before test started)"
-fi
-
-echo ""
-echo "Order result: $ORDER_RESULT"
-echo "Order latency: ${ORDER_MS}ms"
-echo ""
-if [ "$PASS" = true ]; then
-  echo "RESULT: PASS"
-else
-  echo "RESULT: FAIL"
-  exit 1
-fi
diff --git a/scripts/perps/agentic/validate-myx.sh b/scripts/perps/agentic/validate-myx.sh
new file mode 100755
index 000000000000..91a648c95a08
--- /dev/null
+++ b/scripts/perps/agentic/validate-myx.sh
@@ -0,0 +1,576 @@
+#!/bin/bash
+set -euo pipefail
+# scripts/perps/agentic/validate-myx.sh
+# Comprehensive MYX provider validation — tests each method category on testnet/mainnet.
+# Shows raw data previews for every call so a human can assess what's working.
+#
+# Prerequisites:
+#   - Metro running, device connected, app open
+#   - Engine exposed on globalThis (dev builds via __AGENTIC__ bridge)
+#   - MYX provider enabled (MM_PERPS_MYX_PROVIDER_ENABLED=true)
+#
+# Usage:
+#   scripts/perps/agentic/validate-myx.sh                    # Both networks
+#   scripts/perps/agentic/validate-myx.sh --network testnet  # Testnet only
+#   scripts/perps/agentic/validate-myx.sh --network mainnet  # Mainnet only
+
+SCRIPT_DIR="$(cd "$(dirname "$0")" && pwd)"
+cd "$SCRIPT_DIR/../../.."
+
+# ── Args ────────────────────────────────────────────────────────────
+NETWORK="both"
+while [[ $# -gt 0 ]]; do
+  case $1 in
+    --network) NETWORK="$2"; shift 2 ;;
+    *) echo "Unknown option: $1"; exit 1 ;;
+  esac
+done
+
+# ── Helpers ─────────────────────────────────────────────────────────
+eval_sync() {
+  "$SCRIPT_DIR/app-state.sh" eval "$@" 2>&1
+}
+
+eval_async() {
+  "$SCRIPT_DIR/app-state.sh" eval-async "$@" 2>&1
+}
+
+# Counters
+PASS_COUNT=0
+FAIL_COUNT=0
+SKIP_COUNT=0
+UNVERIFIED_COUNT=0
+
+RESULTS=""
+
+record() {
+  local category="$1" test_name="$2" result="$3" details="${4:-}"
+  local icon
+  case "$result" in
+    PASS)       icon="✓"; PASS_COUNT=$((PASS_COUNT + 1)) ;;
+    FAIL)       icon="✗"; FAIL_COUNT=$((FAIL_COUNT + 1)) ;;
+    SKIP)       icon="⊘"; SKIP_COUNT=$((SKIP_COUNT + 1)) ;;
+    UNVERIFIED) icon="?"; UNVERIFIED_COUNT=$((UNVERIFIED_COUNT + 1)) ;;
+  esac
+  RESULTS="${RESULTS}$(printf '%-16s %-28s %s %-10s  %s\n' "$category" "$test_name" "$icon" "$result" "$details")\n"
+}
+
+# Print indented data preview (truncated to keep output scannable)
+preview() {
+  local label="$1" raw="$2" max_len="${3:-200}"
+  local trimmed
+  if [ ${#raw} -gt "$max_len" ]; then
+    trimmed="${raw:0:$max_len}..."
+  else
+    trimmed="$raw"
+  fi
+  echo "         ↳ $label: $trimmed"
+}
+
+print_report() {
+  local net_label="$1" chain_id="$2"
+  echo ""
+  echo "═══════════════════════════════════════════════════════════════════════"
+  echo "  MYX Provider Validation Report"
+  echo "  Network: $net_label (chainId: $chain_id)"
+  echo "  Timestamp: $(date -u +%Y-%m-%dT%H:%M:%SZ)"
+  echo "═══════════════════════════════════════════════════════════════════════"
+  echo ""
+  printf '%-16s %-28s   %-11s %s\n' "Category" "Test" "Result" "Details"
+  echo "───────────────────────────────────────────────────────────────────────"
+  echo -e "$RESULTS"
+  echo ""
+  local total=$((PASS_COUNT + FAIL_COUNT + SKIP_COUNT + UNVERIFIED_COUNT))
+  echo "Summary: ${PASS_COUNT} passed, ${FAIL_COUNT} failed, ${SKIP_COUNT} skipped, ${UNVERIFIED_COUNT} unverified  (${total} total)"
+  if [ "$UNVERIFIED_COUNT" -gt 0 ]; then
+    echo ""
+    echo "⚠ UNVERIFIED = API returned data but auth was never validated."
+    echo "  myxClient.auth() is sync (stores callbacks, sets #authenticatedAddress=<addr>)."
+    echo "  MYX API may not auth-gate read endpoints — empty results prove nothing."
+  fi
+  echo "═══════════════════════════════════════════════════════════════════════"
+}
+
+# Parse JSON field with python3 (handles double-encoded strings)
+json_field() {
+  local json="$1" field="$2"
+  echo "$json" | python3 -c "
+import sys, json
+raw = json.load(sys.stdin)
+if isinstance(raw, str):
+    raw = json.loads(raw)
+print(raw.get('$field', ''))
+" 2>/dev/null || echo ""
+}
+
+# Pretty-print decoded JSON (handles double-encoding)
+json_decode() {
+  echo "$1" | python3 -c "
+import sys, json
+raw = json.load(sys.stdin)
+if isinstance(raw, str):
+    try: raw = json.loads(raw)
+    except: pass
+print(json.dumps(raw, indent=2, ensure_ascii=False))
+" 2>/dev/null || echo "$1"
+}
+
+# ── Pre-flight ──────────────────────────────────────────────────────
+echo "[pre-flight] Checking Engine availability..."
+ENGINE_CHECK=$(eval_sync 'Boolean(Engine && Engine.context)') || ENGINE_CHECK="false"
+if [ "$ENGINE_CHECK" != "true" ]; then
+  echo "ERROR: Engine not available. Make sure app is running a dev build with agentic bridge."
+  exit 1
+fi
+echo "  Engine available"
+
+# Save initial testnet state so we can restore later
+INITIAL_TESTNET=$(eval_sync "JSON.stringify(Engine.context.PerpsController.state.isTestnet)") || INITIAL_TESTNET="unknown"
+echo "  Current isTestnet: $INITIAL_TESTNET"
+
+# ── Run validation for a given network ──────────────────────────────
+run_validation() {
+  local target_testnet="$1"  # "true" or "false"
+  local net_label
+  local chain_id
+
+  if [ "$target_testnet" = "true" ]; then
+    net_label="testnet"
+    chain_id="97"
+  else
+    net_label="mainnet"
+    chain_id="56"
+  fi
+
+  RESULTS=""
+  PASS_COUNT=0
+  FAIL_COUNT=0
+  SKIP_COUNT=0
+  UNVERIFIED_COUNT=0
+
+  echo ""
+  echo "━━━ Validating $net_label (chainId: $chain_id) ━━━"
+
+  # Switch network if needed
+  local current_testnet
+  current_testnet=$(eval_sync "JSON.stringify(Engine.context.PerpsController.state.isTestnet)") || current_testnet="unknown"
+  if [ "$current_testnet" != "\"$target_testnet\"" ]; then
+    echo "[setup] Switching to $net_label..."
+    eval_async "Engine.context.PerpsController.toggleTestnet().then(function(r) { return JSON.stringify(r); })" >/dev/null 2>&1 || true
+    sleep 2
+  fi
+
+  # ── SDK config probe ──
+  echo "[probe] Checking SDK internal config..."
+  local sdk_probe
+  sdk_probe=$(eval_async '
+    (function() {
+      var provider = Engine.context.PerpsController.providers.get("myx");
+      if (provider === null || provider === undefined) return JSON.stringify({error: "no provider"});
+      var cs = provider.__private_621_clientService;
+      if (cs === null || cs === undefined) return JSON.stringify({error: "no clientService"});
+      var myxClient = cs.__private_635_myxClient;
+      var config = myxClient.configManager.config;
+      var authConfig = cs.__private_639_authConfig;
+      return JSON.stringify({
+        sdkChainId: config.chainId,
+        sdkIsTestnet: config.isTestnet,
+        sdkIsBetaMode: config.isBetaMode,
+        authenticatedAddress: cs.__private_640_authenticatedAddress,
+        appId: authConfig ? authConfig.appId : null,
+        hasApiSecret: Boolean(authConfig && authConfig.apiSecret),
+        brokerAddress: authConfig && authConfig.brokerAddress ? authConfig.brokerAddress : ""
+      });
+    })()
+  ') || sdk_probe='{"error":"probe failed"}'
+  preview "SDK config" "$(json_decode "$sdk_probe")" 500
+
+  # ── 1. Init: Provider registered ──
+  echo "[test] Init: Provider registered..."
+  local provider_check
+  provider_check=$(eval_async '
+    Promise.resolve().then(function() {
+      var p = Engine.context.PerpsController.providers.get("myx");
+      return JSON.stringify({registered: Boolean(p)});
+    })
+  ') || provider_check='{"registered":false}'
+  local registered
+  registered=$(json_field "$provider_check" "registered")
+  if [ "$registered" = "True" ] || [ "$registered" = "true" ]; then
+    record "Init" "Provider registered" "PASS"
+  else
+    record "Init" "Provider registered" "FAIL" "not found in providers map"
+    print_report "$net_label" "$chain_id"
+    return
+  fi
+
+  # ── 2. Init: Markets load ──
+  echo "[test] Init: Markets load..."
+  local markets_result
+  markets_result=$(eval_async '
+    Engine.context.PerpsController.providers.get("myx").getMarkets().then(function(m) {
+      return JSON.stringify({
+        count: m.length,
+        names: m.map(function(x) { return x.name; }),
+        sampleKeys: m[0] ? Object.keys(m[0]) : []
+      });
+    })
+  ') || markets_result='{"error":"getMarkets failed"}'
+  local market_count
+  market_count=$(json_field "$markets_result" "count")
+  preview "markets" "$(json_decode "$markets_result")" 400
+  local first_symbol=""
+  if [ -n "$market_count" ] && [ "$market_count" != "0" ] && [ "$market_count" != "" ]; then
+    record "Init" "Markets loaded" "PASS" "${market_count} markets"
+    first_symbol=$(echo "$markets_result" | python3 -c "
+import sys, json
+raw = json.load(sys.stdin)
+if isinstance(raw, str): raw = json.loads(raw)
+names = raw.get('names', [])
+print(names[0] if names else '')
+" 2>/dev/null || echo "")
+  else
+    record "Init" "Markets loaded" "FAIL" "0 markets"
+  fi
+
+  # ── 3. Init: Market shape ──
+  echo "[test] Init: Market shape..."
+  local shape_result
+  shape_result=$(eval_async '
+    Engine.context.PerpsController.providers.get("myx").getMarkets().then(function(m) {
+      if (m.length === 0) return JSON.stringify({ok: false, reason: "empty"});
+      var s = m[0];
+      return JSON.stringify({
+        name: s.name, maxLeverage: s.maxLeverage, szDecimals: s.szDecimals,
+        providerId: s.providerId, keys: Object.keys(s)
+      });
+    })
+  ') || shape_result='{"ok":false}'
+  preview "first market" "$(json_decode "$shape_result")" 400
+  local has_name
+  has_name=$(echo "$shape_result" | python3 -c "
+import sys, json
+raw = json.load(sys.stdin)
+if isinstance(raw, str): raw = json.loads(raw)
+n = raw.get('name', '')
+print('true' if n and n != 'None' else 'false')
+" 2>/dev/null || echo "false")
+  if [ "$has_name" = "true" ]; then
+    record "Init" "Markets have name" "PASS"
+  else
+    record "Init" "Markets have name" "FAIL" "name is empty/missing"
+  fi
+
+  # ── 4a. Prices: Raw ticker probe (API values before adapter) ──
+  echo "[test] Prices: Raw ticker probe..."
+  local raw_ticker_result
+  raw_ticker_result=$(eval_async '
+    (function() {
+      var provider = Engine.context.PerpsController.providers.get("myx");
+      var cs = provider.__private_621_clientService;
+      var myxClient = cs.__private_635_myxClient;
+      return myxClient.getTickers().then(function(resp) {
+        var tickers = resp.data || [];
+        return JSON.stringify({
+          apiCount: tickers.length,
+          samples: tickers.slice(0, 5).map(function(t) {
+            return {symbol: t.baseSymbol || t.symbol, price: t.price, change: t.change, volume: t.volume};
+          })
+        });
+      });
+    })()
+  ') || raw_ticker_result='{"error":"probe failed"}'
+  preview "raw API tickers" "$(json_decode "$raw_ticker_result")" 600
+
+  # ── 4b. Prices: Formatted tickers (after adapter) ──
+  echo "[test] Prices: Formatted tickers..."
+  local tickers_result
+  tickers_result=$(eval_async '
+    Engine.context.PerpsController.providers.get("myx").getMarketDataWithPrices().then(function(d) {
+      return JSON.stringify({
+        count: d.length,
+        samples: d.slice(0, 3).map(function(x) {
+          return {name: x.name, price: x.price, markPrice: x.markPrice, oraclePrice: x.oraclePrice, volume: x.volume, openInterest: x.openInterest, fundingRate: x.fundingRate};
+        })
+      });
+    })
+  ') || tickers_result='{"count":0}'
+  local ticker_count
+  ticker_count=$(json_field "$tickers_result" "count")
+  preview "formatted tickers" "$(json_decode "$tickers_result")" 500
+  if [ -n "$ticker_count" ] && [ "$ticker_count" != "0" ]; then
+    # Check if prices are actually non-zero
+    local has_real_price
+    has_real_price=$(echo "$tickers_result" | python3 -c "
+import sys, json
+raw = json.load(sys.stdin)
+if isinstance(raw, str): raw = json.loads(raw)
+samples = raw.get('samples', [])
+real = [s for s in samples if s.get('price') and s['price'] not in ('0', '\$0', '<\$0.01', '\$0.00', None)]
+print('true' if real else 'false')
+" 2>/dev/null || echo "false")
+    if [ "$has_real_price" = "true" ]; then
+      record "Prices" "Tickers with real prices" "PASS" "${ticker_count} tickers"
+    else
+      record "Prices" "Tickers returned" "FAIL" "${ticker_count} tickers but ALL prices are \$0"
+    fi
+  else
+    record "Prices" "Tickers returned" "FAIL" "0 tickers"
+  fi
+
+  # ── 5-7. Candles REST ──
+  local intervals="1h 1D 5m"
+  for interval in $intervals; do
+    echo "[test] Candles REST: ${interval} historical..."
+    if [ -n "$first_symbol" ] && [ "$first_symbol" != "" ]; then
+      local candle_result
+      candle_result=$(eval_async '
+        (function() {
+          var provider = Engine.context.PerpsController.providers.get("myx");
+          return provider.getMarkets().then(function(markets) {
+            var sym = markets[0] ? markets[0].name : null;
+            if (sym === null) return JSON.stringify({error: "no markets"});
+            var result = null;
+            var err = null;
+            provider.subscribeToCandles({symbol: sym, interval: "'"${interval}"'", callback: function(d) { result = d; }, onError: function(e) { err = String(e); }});
+            return new Promise(function(resolve) {
+              setTimeout(function() {
+                var candles = result && result.candles ? result.candles : [];
+                var first = candles[0];
+                var last = candles[candles.length - 1];
+                resolve(JSON.stringify({
+                  symbol: sym, interval: "'"${interval}"'", count: candles.length, error: err,
+                  first: first ? {time: first.time, open: first.open, close: first.close, vol: first.volume} : null,
+                  last: last ? {time: last.time, open: last.open, close: last.close, vol: last.volume} : null
+                }));
+              }, 8000);
+            });
+          });
+        })()
+      ') || candle_result='{"count":0,"error":"eval failed"}'
+      local candle_count candle_error
+      candle_count=$(json_field "$candle_result" "count")
+      candle_error=$(json_field "$candle_result" "error")
+      preview "candles ${interval}" "$(json_decode "$candle_result")" 400
+      if [ -n "$candle_count" ] && [ "$candle_count" != "0" ] && [ "$candle_count" != "" ]; then
+        record "Candles REST" "${interval} historical" "PASS" "${candle_count} candles"
+      else
+        record "Candles REST" "${interval} historical" "FAIL" "count=${candle_count:-0} err=${candle_error:-none}"
+      fi
+    else
+      record "Candles REST" "${interval} historical" "SKIP" "no markets available"
+    fi
+  done
+
+  # ── 5b. Candles WS: Live updates (sustained) ──
+  # Subscribe and wait for multiple WS callbacks over time to prove the socket
+  # stays open and delivers data at intervals (not just one burst).
+  # Callback 1 = REST snapshot, callbacks 2+ = WS live updates.
+  echo "[test] Candles WS: Sustained kline updates..."
+  if [ -n "$first_symbol" ] && [ "$first_symbol" != "" ]; then
+    local ws_candle_result
+    ws_candle_result=$(eval_async '
+      new Promise(function(resolve) {
+        var callCount = 0;
+        var firstCount = 0;
+        var timestamps = [];
+        var targetWsCallbacks = 3;
+        var timer = setTimeout(function() {
+          if (typeof unsub === "function") unsub();
+          resolve(JSON.stringify({wsReceived: callCount > 1, callbackCount: callCount, restCount: firstCount, wsCallbacks: callCount - 1, timestamps: timestamps}));
+        }, 65000);
+        var unsub;
+        var provider = Engine.context.PerpsController.providers.get("myx");
+        unsub = provider.subscribeToCandles({symbol: "'"${first_symbol}"'", interval: "1m", limit: 5, callback: function(d) {
+          callCount++;
+          if (callCount === 1) { firstCount = d.candles.length; return; }
+          timestamps.push(Date.now());
+          if (callCount - 1 >= targetWsCallbacks) {
+            clearTimeout(timer);
+            if (typeof unsub === "function") unsub();
+            resolve(JSON.stringify({wsReceived: true, callbackCount: callCount, restCount: firstCount, wsCallbacks: callCount - 1, timestamps: timestamps}));
+          }
+        }, onError: function(e) {
+          clearTimeout(timer);
+          if (typeof unsub === "function") unsub();
+          resolve(JSON.stringify({wsReceived: false, error: String(e), callbackCount: callCount}));
+        }});
+      })
+    ') || ws_candle_result='{"wsReceived":false,"error":"eval failed"}'
+    preview "WS kline" "$(json_decode "$ws_candle_result")" 500
+    local ws_received ws_callbacks
+    ws_received=$(json_field "$ws_candle_result" "wsReceived")
+    ws_callbacks=$(json_field "$ws_candle_result" "wsCallbacks")
+    if [ "$ws_received" = "True" ] || [ "$ws_received" = "true" ]; then
+      record "Candles WS" "Sustained kline updates" "PASS" "${ws_callbacks} WS callbacks received"
+    else
+      local ws_error
+      ws_error=$(json_field "$ws_candle_result" "error")
+      record "Candles WS" "Sustained kline updates" "FAIL" "got ${ws_callbacks:-0} WS callbacks in 65s ${ws_error:+err=$ws_error}"
+    fi
+  else
+    record "Candles WS" "Sustained kline updates" "SKIP" "no markets available"
+  fi
+
+  # ── 5c. Prices WS: Live ticker updates ──
+  # Check if subscribeToPrices delivers a second (WS-driven) callback
+  echo "[test] Prices WS: Live ticker update..."
+  if [ -n "$first_symbol" ] && [ "$first_symbol" != "" ]; then
+    local ws_price_result
+    ws_price_result=$(eval_async '
+      new Promise(function(resolve) {
+        var callCount = 0;
+        var timer = setTimeout(function() { resolve(JSON.stringify({wsReceived: false, callbackCount: callCount})); }, 15000);
+        var unsub;
+        var provider = Engine.context.PerpsController.providers.get("myx");
+        unsub = provider.subscribeToPrices({symbols: ["'"${first_symbol}"'"], callback: function(d) {
+          callCount++;
+          if (callCount >= 2) {
+            clearTimeout(timer);
+            if (typeof unsub === "function") unsub();
+            var sample = d[0] ? {symbol: d[0].symbol, price: d[0].price} : null;
+            resolve(JSON.stringify({wsReceived: true, callbackCount: callCount, sample: sample}));
+          }
+        }});
+      })
+    ') || ws_price_result='{"wsReceived":false,"error":"eval failed"}'
+    preview "WS prices" "$(json_decode "$ws_price_result")" 400
+    local ws_price_received
+    ws_price_received=$(json_field "$ws_price_result" "wsReceived")
+    if [ "$ws_price_received" = "True" ] || [ "$ws_price_received" = "true" ]; then
+      record "Prices WS" "Live ticker update" "PASS" "received multiple callbacks"
+    else
+      record "Prices WS" "Live ticker update" "FAIL" "no 2nd callback in 15s (REST poll only?)"
+    fi
+  else
+    record "Prices WS" "Live ticker update" "SKIP" "no markets available"
+  fi
+
+  # ── 8. Auth: isReadyToTrade ──
+  # NOTE: myxClient.auth() is sync — it just stores signer + getAccessToken callback.
+  # It sets #authenticatedAddress=<addr> immediately, no API call. So "ready:true" proves nothing.
+  echo "[test] Auth: isReadyToTrade..."
+  echo "         ⚠ WARNING: myxClient.auth() is sync — ready:true does NOT mean credentials are valid"
+  local ready_result
+  ready_result=$(eval_async '
+    Engine.context.PerpsController.providers.get("myx").isReadyToTrade().then(function(r) {
+      return JSON.stringify(r);
+    }).catch(function(e) { return JSON.stringify({ready: false, error: e.message}); })
+  ') || ready_result='{"ready":false,"error":"eval failed"}'
+  preview "isReadyToTrade" "$(json_decode "$ready_result")" 300
+  local is_ready
+  is_ready=$(json_field "$ready_result" "ready")
+  if [ "$is_ready" = "True" ] || [ "$is_ready" = "true" ]; then
+    record "Auth" "isReadyToTrade" "UNVERIFIED" "returns ready:true but auth is never validated"
+  else
+    local ready_error
+    ready_error=$(json_field "$ready_result" "error")
+    record "Auth" "isReadyToTrade" "FAIL" "${ready_error:-not ready}"
+  fi
+
+  # ── 9. Positions: getPositions ──
+  echo "[test] Positions: getPositions..."
+  local positions_result
+  positions_result=$(eval_async '
+    Engine.context.PerpsController.providers.get("myx").getPositions().then(function(p) {
+      return JSON.stringify({count: p.length, sample: p[0] ? p[0] : null});
+    }).catch(function(e) { return JSON.stringify({error: e.message}); })
+  ') || positions_result='{"error":"eval failed"}'
+  preview "positions" "$(json_decode "$positions_result")" 300
+  local pos_error
+  pos_error=$(json_field "$positions_result" "error")
+  if [ -n "$pos_error" ] && [ "$pos_error" != "" ]; then
+    record "Positions" "getPositions" "FAIL" "$pos_error"
+  else
+    local pos_count
+    pos_count=$(json_field "$positions_result" "count")
+    record "Positions" "getPositions" "UNVERIFIED" "returned ${pos_count} (auth not validated)"
+  fi
+
+  # ── 10. Orders: getOrders ──
+  echo "[test] Orders: getOrders..."
+  local orders_result
+  orders_result=$(eval_async '
+    Engine.context.PerpsController.providers.get("myx").getOrders().then(function(o) {
+      return JSON.stringify({count: o.length, sample: o[0] ? o[0] : null});
+    }).catch(function(e) { return JSON.stringify({error: e.message}); })
+  ') || orders_result='{"error":"eval failed"}'
+  preview "orders" "$(json_decode "$orders_result")" 300
+  local ord_error
+  ord_error=$(json_field "$orders_result" "error")
+  if [ -n "$ord_error" ] && [ "$ord_error" != "" ]; then
+    record "Orders" "getOrders" "FAIL" "$ord_error"
+  else
+    local ord_count
+    ord_count=$(json_field "$orders_result" "count")
+    record "Orders" "getOrders" "UNVERIFIED" "returned ${ord_count} (auth not validated)"
+  fi
+
+  # ── 11. Account: getAccountState ──
+  echo "[test] Account: getAccountState..."
+  local account_result
+  account_result=$(eval_async '
+    Engine.context.PerpsController.providers.get("myx").getAccountState().then(function(a) {
+      return JSON.stringify(a || {});
+    }).catch(function(e) { return JSON.stringify({error: e.message}); })
+  ') || account_result='{"error":"eval failed"}'
+  preview "accountState" "$(json_decode "$account_result")" 400
+  local acct_error
+  acct_error=$(json_field "$account_result" "error")
+  if [ -n "$acct_error" ] && [ "$acct_error" != "" ]; then
+    record "Account" "getAccountState" "FAIL" "$acct_error"
+  else
+    record "Account" "getAccountState" "UNVERIFIED" "returned data (auth not validated)"
+  fi
+
+  # ── 12. Ping: Health check ──
+  echo "[test] Ping: Health check..."
+  local ping_result
+  ping_result=$(eval_async '
+    (function() {
+      var provider = Engine.context.PerpsController.providers.get("myx");
+      if (typeof provider.ping === "function") {
+        return provider.ping().then(function() { return JSON.stringify({ok: true}); }).catch(function(e) { return JSON.stringify({ok: false, error: e.message}); });
+      }
+      return Promise.resolve(JSON.stringify({ok: false, error: "ping not implemented"}));
+    })()
+  ') || ping_result='{"ok":false,"error":"eval failed"}'
+  preview "ping" "$(json_decode "$ping_result")" 200
+  local ping_ok
+  ping_ok=$(json_field "$ping_result" "ok")
+  if [ "$ping_ok" = "True" ] || [ "$ping_ok" = "true" ]; then
+    record "Ping" "Health check" "PASS"
+  else
+    record "Ping" "Health check" "FAIL" "$(json_field "$ping_result" "error")"
+  fi
+
+  print_report "$net_label" "$chain_id"
+}
+
+# ── Main ────────────────────────────────────────────────────────────
+
+# Ensure MYX provider is initialized
+echo "[init] Initializing PerpsController..."
+eval_async 'Engine.context.PerpsController.init().then(function() { return JSON.stringify({ok: true}); })' >/dev/null 2>&1 || true
+sleep 2
+
+case "$NETWORK" in
+  testnet) run_validation "true" ;;
+  mainnet) run_validation "false" ;;
+  both)
+    run_validation "true"
+    run_validation "false"
+    ;;
+  *) echo "Invalid --network value: $NETWORK (use testnet, mainnet, or both)"; exit 1 ;;
+esac
+
+# Restore initial network state
+echo ""
+echo "[cleanup] Restoring initial network state..."
+CURRENT_TESTNET=$(eval_sync "JSON.stringify(Engine.context.PerpsController.state.isTestnet)") || CURRENT_TESTNET="unknown"
+if [ "$CURRENT_TESTNET" != "$INITIAL_TESTNET" ]; then
+  eval_async 'Engine.context.PerpsController.toggleTestnet().then(function(r) { return JSON.stringify(r); })' >/dev/null 2>&1 || true
+  echo "  Restored to isTestnet=$INITIAL_TESTNET"
+else
+  echo "  Already at isTestnet=$INITIAL_TESTNET"
+fi
diff --git a/scripts/perps/validate-core-sync.sh b/scripts/perps/validate-core-sync.sh
index a8aa87fd449d..659a29c918a1 100755
--- a/scripts/perps/validate-core-sync.sh
+++ b/scripts/perps/validate-core-sync.sh
@@ -30,7 +30,7 @@ PERPS_SRC="app/controllers/perps"
 PERPS_DEST="packages/perps-controller/src"
 WORKSPACE="@metamask/perps-controller"
 
-STEP_COUNT=7
+STEP_COUNT=9
 STEP_RESULTS=()
 STEP_TIMES=()
 STEP_LABELS=()
@@ -166,7 +166,7 @@ if [[ -z "$CORE_PATH" ]]; then
 fi
 
 if $SKIP_BUILD; then
-  STEP_COUNT=6
+  STEP_COUNT=8
 fi
 
 # ─── Step functions ─────────────────────────────────────────────────────────────
@@ -212,6 +212,52 @@ step_preflight() {
   return $errors
 }
 
+compute_source_checksum() {
+  local dir="$1"
+  find "$dir" -name '*.ts' -not -name '*.test.*' -print0 \
+    | sort -z \
+    | xargs -0 shasum -a 256 \
+    | shasum -a 256 \
+    | cut -d' ' -f1
+}
+
+step_conflict_check() {
+  local sync_state="$CORE_PATH/packages/perps-controller/.sync-state.json"
+  if [[ ! -f "$sync_state" ]]; then
+    echo "OK: No previous sync state — first sync"
+    return 0
+  fi
+
+  # Check git-level changes since last sync
+  local last_core_commit
+  last_core_commit=$(jq -r '.lastSyncedCoreCommit // empty' "$sync_state")
+  if [[ -n "$last_core_commit" ]]; then
+    local core_changes
+    core_changes=$(cd "$CORE_PATH" && git diff --name-only "$last_core_commit"..HEAD -- packages/perps-controller/src/ 2>/dev/null | wc -l | tr -d ' ')
+    if (( core_changes > 0 )); then
+      echo "WARN: Core has $core_changes committed file(s) changed in perps-controller/src/ since last sync ($last_core_commit)"
+      echo "WARN: Review these changes before syncing to avoid overwriting Core-only edits"
+    else
+      echo "OK: No committed Core changes since last sync"
+    fi
+  fi
+
+  # Check source fingerprint for uncommitted edits
+  local stored_checksum
+  stored_checksum=$(jq -r '.sourceChecksum // empty' "$sync_state")
+  if [[ -n "$stored_checksum" ]]; then
+    local current_checksum
+    current_checksum=$(compute_source_checksum "$CORE_PATH/$PERPS_DEST")
+    if [[ "$current_checksum" != "$stored_checksum" ]]; then
+      echo "WARN: Core source checksum mismatch — files were edited since last sync"
+      echo "WARN: stored:  $stored_checksum"
+      echo "WARN: current: $current_checksum"
+    else
+      echo "OK: Core source checksum matches last sync"
+    fi
+  fi
+}
+
 step_copy() {
   # Use --filter rules: excludes before includes, first match wins.
   # --delete-excluded ensures test files / mocks at destination are removed.
@@ -336,6 +382,27 @@ step_lint() {
   cd "$MOBILE_ROOT"
 }
 
+step_write_sync_state() {
+  local mobile_commit mobile_branch core_commit core_branch checksum
+  mobile_commit=$(cd "$MOBILE_ROOT" && git rev-parse HEAD)
+  mobile_branch=$(cd "$MOBILE_ROOT" && git branch --show-current)
+  core_commit=$(cd "$CORE_PATH" && git rev-parse HEAD)
+  core_branch=$(cd "$CORE_PATH" && git branch --show-current)
+  checksum=$(compute_source_checksum "$CORE_PATH/$PERPS_DEST")
+
+  cat > "$CORE_PATH/packages/perps-controller/.sync-state.json" <<EOF
+{
+  "lastSyncedMobileCommit": "$mobile_commit",
+  "lastSyncedMobileBranch": "$mobile_branch",
+  "lastSyncedCoreCommit": "$core_commit",
+  "lastSyncedCoreBranch": "$core_branch",
+  "lastSyncedDate": "$(date -u +%Y-%m-%dT%H:%M:%SZ)",
+  "sourceChecksum": "$checksum"
+}
+EOF
+  echo "Sync state written (checksum: ${checksum:0:12}…)"
+}
+
 # ─── Main ───────────────────────────────────────────────────────────────────────
 
 main() {
@@ -352,6 +419,9 @@ main() {
   step=$((step + 1))
   run_step $step "Pre-flight checks" step_preflight
 
+  step=$((step + 1))
+  run_step $step "Conflict check" step_conflict_check
+
   step=$((step + 1))
   run_step $step "Copy source files" step_copy
 
@@ -372,6 +442,9 @@ main() {
   step=$((step + 1))
   run_step $step "Lint" step_lint
 
+  step=$((step + 1))
+  run_step $step "Write sync state" step_write_sync_state
+
   # ─── Summary ────────────────────────────────────────────────────────────────
 
   local total_elapsed
diff --git a/scripts/setup.mjs b/scripts/setup.mjs
index 8be4212e9e80..7b07b973048e 100644
--- a/scripts/setup.mjs
+++ b/scripts/setup.mjs
@@ -213,8 +213,11 @@ const patchPackageTask = {
 
 const installFoundryTask = {
   title: 'Install Foundry',
-  task: (_, task) =>
-    task.newListr(
+  task: (_, task) => {
+    if (IS_NODE) {
+      return task.skip('Skipping Foundry installation (node-only mode).');
+    }
+    return task.newListr(
       [
         {
           title: 'Install Foundry binary',
@@ -238,7 +241,8 @@ const installFoundryTask = {
         exitOnError: true,
         rendererOptions,
       },
-    ),
+    );
+  },
 };
 
 const expoBuildLinks = {
diff --git a/scripts/validate-build-config.js b/scripts/validate-build-config.js
index a66a5df669fd..ec67e5bf9ed6 100755
--- a/scripts/validate-build-config.js
+++ b/scripts/validate-build-config.js
@@ -48,40 +48,6 @@ function validate() {
     }
   });
 
-  // Detect which flags are VersionGatedFeatureFlag-shaped (objects with both
-  // `enabled` and `minimumVersion`) across all builds. Any build that overrides
-  // one of these flags MUST keep it as an object — plain booleans or other
-  // primitives mean the controller can't validate them as VersionGated flags.
-  const versionGatedFlagNames = new Set();
-  buildNames.forEach((name) => {
-    const flags = config.builds[name].remote_feature_flags;
-    if (!flags) return;
-    Object.entries(flags).forEach(([key, value]) => {
-      if (
-        value !== null &&
-        typeof value === 'object' &&
-        'enabled' in value &&
-        'minimumVersion' in value
-      ) {
-        versionGatedFlagNames.add(key);
-      }
-    });
-  });
-
-  buildNames.forEach((name) => {
-    const flags = config.builds[name].remote_feature_flags;
-    if (!flags) return;
-    Object.entries(flags).forEach(([key, value]) => {
-      if (versionGatedFlagNames.has(key) && (value === null || typeof value !== 'object' || Array.isArray(value))) {
-        errors.push(
-          `${name}: remote_feature_flags.${key} must be an object ` +
-            `{ enabled: bool, minimumVersion: string } but got ${JSON.stringify(value)}. ` +
-            `Use "enabled: true/false" + "minimumVersion: '0.0.0'" instead of a plain boolean.`,
-        );
-      }
-    });
-  });
-
   if (errors.length > 0) {
     console.error('❌ Validation errors:');
     errors.forEach((e) => console.error(`  - ${e}`));
diff --git a/scripts/verify-build-config.js b/scripts/verify-build-config.js
index b001dad3a312..882e1d467f8d 100644
--- a/scripts/verify-build-config.js
+++ b/scripts/verify-build-config.js
@@ -311,25 +311,6 @@ function verifyConfig(options = {}) {
     console.log(`   ❌ No code fencing defined in builds.yml`);
   }
 
-  // Verify remote feature flags
-  console.log('\n🚩 Checking remote feature flags...');
-  if (config.remote_feature_flags) {
-    const flags = Object.keys(config.remote_feature_flags);
-    if (verbose) {
-      Object.entries(config.remote_feature_flags).forEach(([flag, value]) => {
-        console.log(`   ✅ ${flag}: ${value}`);
-      });
-    } else {
-      console.log(`   ✅ ${flags.length} remote feature flags configured`);
-    }
-  } else {
-    warnings.push({
-      key: 'remote_feature_flags',
-      reason: 'Not defined in builds.yml',
-    });
-    console.log(`   ⚠️  No remote feature flags defined`);
-  }
-
   // REVERSE CHECK: Find Bitrise env vars NOT in builds.yml
   console.log('\n🔄 Checking for Bitrise env vars NOT in builds.yml...');
 
diff --git a/tests/api-mocking/MockServerE2E.ts b/tests/api-mocking/MockServerE2E.ts
index ae772c453c08..24c668bc3531 100644
--- a/tests/api-mocking/MockServerE2E.ts
+++ b/tests/api-mocking/MockServerE2E.ts
@@ -98,6 +98,12 @@ const isUrlAllowed = (url: string): boolean => {
       return true;
     }
 
+    // Malformed npm: package URIs that leak through the snap proxy
+    // e.g. https://https//npm:@metamask/... or npm:@metamask/...
+    if (/^(?:https?:\/\/.*)?npm[:@]@?metamask\//.test(url)) {
+      return true;
+    }
+
     const parsedUrl = new URL(url);
     const hostname = parsedUrl.hostname;
 
@@ -162,6 +168,9 @@ export default class MockServerE2E implements Resource {
   private _testSpecificMock?: TestSpecificMock;
   private _activeRequests = 0;
   private _shuttingDown = false;
+  private _abortFilterHandler: ((...args: unknown[]) => void) | null = null;
+  private _abortSuppressCount = 0;
+  private _originalRejectionHandlers: ((...args: unknown[]) => void)[] = [];
 
   constructor(params: {
     events: MockEventsObject;
@@ -326,7 +335,10 @@ export default class MockServerE2E implements Resource {
 
             return {
               statusCode: matchingEvent.responseCode,
-              body: JSON.stringify(matchingEvent.response),
+              body:
+                typeof matchingEvent.response === 'string'
+                  ? matchingEvent.response
+                  : JSON.stringify(matchingEvent.response),
             };
           }
 
@@ -356,12 +368,22 @@ export default class MockServerE2E implements Resource {
             }
           }
 
-          return handleDirectFetch(
-            updatedUrl,
-            method,
-            request.headers,
-            method === 'POST' ? requestBodyText : undefined,
-          );
+          try {
+            return await handleDirectFetch(
+              updatedUrl,
+              method,
+              request.headers,
+              method === 'POST' ? requestBodyText : undefined,
+            );
+          } catch (error) {
+            // Client dropped the connection before we could respond (e.g. bridge
+            // controller AbortController fired mid-request). Return a benign
+            // response so mockttp doesn't surface an unhandled rejection.
+            if (error instanceof Error && error.message === 'Aborted') {
+              return { statusCode: 499, body: '' };
+            }
+            throw error;
+          }
         } finally {
           this._activeRequests--;
         }
@@ -404,7 +426,17 @@ export default class MockServerE2E implements Resource {
           const errorMessage = `Request going to live server: ${translatedUrl}`;
           logger.warn(errorMessage);
           if (request.method === 'POST') {
-            logger.warn(`Request Body: ${await request.body.getText()}`);
+            try {
+              logger.warn(`Request Body: ${await request.body.getText()}`);
+            } catch (bodyError) {
+              if (
+                bodyError instanceof Error &&
+                bodyError.message === 'Aborted'
+              ) {
+                return { statusCode: 499, body: '' };
+              }
+              logger.warn('Failed to read request body for logging');
+            }
           }
           this._server?._liveRequests?.push({
             url: translatedUrl,
@@ -414,22 +446,63 @@ export default class MockServerE2E implements Resource {
         } else if (ALLOWLISTED_URLS.includes(translatedUrl)) {
           logger.warn(`Allowed URL: ${translatedUrl}`);
           if (request.method === 'POST') {
-            logger.warn(`Request Body: ${await request.body.getText()}`);
+            try {
+              logger.warn(`Request Body: ${await request.body.getText()}`);
+            } catch (bodyError) {
+              if (
+                bodyError instanceof Error &&
+                bodyError.message === 'Aborted'
+              ) {
+                return { statusCode: 499, body: '' };
+              }
+              logger.warn('Failed to read request body for logging');
+            }
           }
         }
 
-        return handleDirectFetch(
-          translatedUrl,
-          request.method,
-          request.headers,
-          await request.body.getText(),
-        );
+        try {
+          return await handleDirectFetch(
+            translatedUrl,
+            request.method,
+            request.headers,
+            await request.body.getText(),
+          );
+        } catch (error) {
+          // Client dropped the connection before we could respond (e.g. bridge
+          // controller AbortController fired mid-request). Return a benign
+          // response so mockttp doesn't surface an unhandled rejection.
+          if (error instanceof Error && error.message === 'Aborted') {
+            return { statusCode: 499, body: '' };
+          }
+          throw error;
+        }
       } finally {
         this._activeRequests--;
       }
     });
 
     this._serverStatus = ServerStatus.STARTED;
+    this._installAbortFilter();
+  }
+
+  /**
+   * Puts the server into draining mode — handlers return 503 immediately
+   * without forwarding. Call this before stopping backend services (Anvil/Ganache)
+   * to prevent forwarding requests to dead backends during cleanup.
+   */
+  startDraining(): void {
+    logger.info(
+      'MockServer entering drain mode — new requests will receive 503',
+    );
+    this._shuttingDown = true;
+  }
+
+  /**
+   * Removes the lifecycle-wide abort filter. Call this AFTER all cleanup is
+   * complete to ensure late async "Aborted" rejections are caught.
+   */
+  removeAbortFilter(): void {
+    this._removeAbortFilter();
   }
 
   async stop(): Promise<void> {
@@ -453,7 +526,12 @@ export default class MockServerE2E implements Resource {
     await this._waitForActiveRequests();
 
     try {
-      await this._stopServerSuppressingAbortErrors();
+      if (this._server) {
+        await this._server.stop();
+      }
+      // Brief drain period: 'aborted' events from destroyed sockets may fire
+      // asynchronously on the next event-loop tick after `stop()` resolves.
+      await new Promise((resolve) => setTimeout(resolve, 150));
     } catch (error) {
       logger.error('Error stopping mock server:', error);
     } finally {
@@ -468,33 +546,35 @@ export default class MockServerE2E implements Resource {
   }
 
   /**
-   * Stops the mockttp server while suppressing "Aborted" unhandled promise rejections.
-   *
-   * When mockttp's `server.stop()` is called, its underlying `destroyable-server` immediately
-   * destroys all TCP connections via `socket.destroy()`. Any `IncomingMessage` whose body was
-   * being streamed through mockttp's `streamToBuffer` (buffer-utils.ts) will emit 'aborted',
-   * causing the buffer promise to reject with `Error('Aborted')`.
+   * Installs a lifecycle-wide filter for mockttp "Aborted" unhandled promise rejections.
    *
-   * There is a race window where requests have entered mockttp's internal pipeline
-   * (CallbackHandler.handle → waitForCompletedRequest → streamToBuffer) but have not yet
-   * reached our callback (so `_activeRequests` hasn't been incremented). For these requests,
-   * `_waitForActiveRequests()` sees zero active requests and proceeds with `stop()`, but the
-   * body buffering is still in progress. When the socket is destroyed, the buffer promise
-   * rejects and Jest catches it as an unhandled rejection, failing the test suite.
+   * When the app unexpectedly drops connections during a test (e.g., UI transitions,
+   * RN bridge interruptions), mockttp's internal `streamToBuffer` rejects with
+   * `Error('Aborted')` from `buffer-utils.ts`. Since this happens in mockttp's pipeline
+   * before reaching our handler callback, the rejection is unhandled and Jest catches it
+   * as a test failure.
    *
-   * This method temporarily replaces the process `unhandledRejection` handlers with a filter
-   * that suppresses "Aborted" errors originating from mockttp's buffer-utils (verified via
-   * stack trace), forwarding all other rejections to the original handlers.
-   * After the server is stopped and a brief drain period elapses, the original handlers are
-   * restored along with any handlers that were added by other code during the shutdown window.
+   * This filter is active for the entire server lifecycle (start → stop), not just
+   * during shutdown. It removes all existing `unhandledRejection` handlers (e.g. Jest's)
+   * and replaces them with a single filter that suppresses mockttp Aborted errors and
+   * forwards everything else to the original handlers. This ensures Jest never sees
+   * the Aborted rejections.
    */
-  private async _stopServerSuppressingAbortErrors(): Promise<void> {
-    // Snapshot current handlers so we can restore them after shutdown.
-    const originalHandlers = process.rawListeners('unhandledRejection').slice();
+  private _installAbortFilter(): void {
+    if (this._abortFilterHandler) {
+      return; // Already installed
+    }
+
+    this._abortSuppressCount = 0;
+
+    // Snapshot and remove all existing handlers so Jest never sees Aborted errors.
+    this._originalRejectionHandlers = process
+      .rawListeners('unhandledRejection')
+      .slice() as ((...args: unknown[]) => void)[];
     process.removeAllListeners('unhandledRejection');
 
-    let suppressCount = 0;
-    const filterHandler = (reason: unknown, promise: Promise<unknown>) => {
+    this._abortFilterHandler = (reason: unknown, promise: unknown) => {
+      const rejectedPromise = promise as Promise<unknown>;
       if (
         reason instanceof Error &&
         reason.message === 'Aborted' &&
@@ -502,22 +582,19 @@ export default class MockServerE2E implements Resource {
       ) {
         // Mark the promise as handled so Node.js does not consider it unhandled.
         // eslint-disable-next-line no-empty-function
-        promise.catch(() => {});
-        suppressCount++;
+        rejectedPromise.catch(() => {});
+        this._abortSuppressCount++;
         return;
       }
+
       // Forward any other unhandled rejection to the original handlers (e.g. Jest).
-      if (originalHandlers.length === 0) {
-        // No original handlers were registered. Since our filterHandler is a
-        // registered listener, Node considers the rejection "handled" and skips
-        // its default behaviour (warning + exit). Re-throw so the rejection
-        // surfaces as an uncaught exception instead of being silently dropped.
+      if (this._originalRejectionHandlers.length === 0) {
         throw reason;
       }
       let firstError: unknown;
-      for (const handler of originalHandlers) {
+      for (const handler of this._originalRejectionHandlers) {
         try {
-          (handler as (...args: unknown[]) => void)(reason, promise);
+          handler(reason, rejectedPromise);
         } catch (err) {
           if (firstError === undefined) {
             firstError = err;
@@ -528,40 +605,49 @@ export default class MockServerE2E implements Resource {
         throw firstError;
       }
     };
-    process.on('unhandledRejection', filterHandler);
 
-    try {
-      if (this._server) {
-        await this._server.stop();
-      }
-      // Brief drain period: 'aborted' events from destroyed sockets may fire
-      // asynchronously on the next event-loop tick after `stop()` resolves.
-      await new Promise((resolve) => setTimeout(resolve, 150));
-    } finally {
-      // Preserve any handlers that were added by other code during the
-      // shutdown window so they are not permanently lost.
-      const currentHandlers = process
-        .rawListeners('unhandledRejection')
-        .slice();
-      const addedDuringShutdown = currentHandlers.filter(
-        (h) => h !== filterHandler && !originalHandlers.includes(h),
-      );
+    process.on('unhandledRejection', this._abortFilterHandler);
+    logger.debug('Installed lifecycle-wide Aborted error filter');
+  }
 
-      // Remove all and restore: originals first, then any newly added handlers.
-      process.removeAllListeners('unhandledRejection');
-      for (const handler of [...originalHandlers, ...addedDuringShutdown]) {
-        process.on(
-          'unhandledRejection',
-          handler as (...args: unknown[]) => void,
-        );
-      }
+  /**
+   * Removes the lifecycle-wide Aborted error filter and restores original handlers.
+   * Any handlers added by other code during the filter's lifetime are preserved.
+   */
+  private _removeAbortFilter(): void {
+    if (!this._abortFilterHandler) {
+      return;
+    }
 
-      if (suppressCount > 0) {
-        logger.info(
-          `Suppressed ${suppressCount} "Aborted" rejection(s) during mock server shutdown`,
-        );
-      }
+    // Preserve any handlers that were added by other code during the
+    // filter's lifetime so they are not permanently lost.
+    const currentHandlers = process.rawListeners('unhandledRejection').slice();
+    const addedDuringLifecycle = currentHandlers.filter(
+      (h) =>
+        h !== this._abortFilterHandler &&
+        !this._originalRejectionHandlers.includes(
+          h as (...args: unknown[]) => void,
+        ),
+    );
+
+    // Remove all and restore: originals first, then any newly added handlers.
+    process.removeAllListeners('unhandledRejection');
+    for (const handler of [
+      ...this._originalRejectionHandlers,
+      ...(addedDuringLifecycle as ((...args: unknown[]) => void)[]),
+    ]) {
+      process.on('unhandledRejection', handler);
+    }
+
+    this._abortFilterHandler = null;
+    this._originalRejectionHandlers = [];
+
+    if (this._abortSuppressCount > 0) {
+      logger.info(
+        `Suppressed ${this._abortSuppressCount} mockttp "Aborted" rejection(s) during server lifecycle`,
+      );
     }
+    this._abortSuppressCount = 0;
   }
 
   /**
diff --git a/tests/api-mocking/helpers/mockHelpers.ts b/tests/api-mocking/helpers/mockHelpers.ts
index 8badfca10264..5c65e5cc1d21 100644
--- a/tests/api-mocking/helpers/mockHelpers.ts
+++ b/tests/api-mocking/helpers/mockHelpers.ts
@@ -203,10 +203,9 @@ export async function setupMockRequest(
         )}`,
       );
       logger.debug(`Returning response:`, response.response);
-      return {
-        statusCode: response.responseCode ?? 200,
-        json: response.response,
-      };
+      return typeof response.response === 'string'
+        ? { statusCode: response.responseCode ?? 200, body: response.response }
+        : { statusCode: response.responseCode ?? 200, json: response.response };
     });
 }
 
diff --git a/tests/api-mocking/mock-e2e-allowlist.ts b/tests/api-mocking/mock-e2e-allowlist.ts
index 491ca6ec94c8..eab40046de0a 100644
--- a/tests/api-mocking/mock-e2e-allowlist.ts
+++ b/tests/api-mocking/mock-e2e-allowlist.ts
@@ -21,6 +21,7 @@ export const ALLOWLISTED_HOSTS = [
   'mainnet.infura.io',
   'linea-sepolia.infura.io',
   'linea-mainnet.infura.io',
+  'metamask.github.io', // Test-snaps and test-dapp pages loaded in browser
 ];
 
 export const ALLOWLISTED_URLS = [
diff --git a/tests/api-mocking/mock-responses/cardholder-mocks.ts b/tests/api-mocking/mock-responses/cardholder-mocks.ts
index c55238b18329..a37373d6684b 100644
--- a/tests/api-mocking/mock-responses/cardholder-mocks.ts
+++ b/tests/api-mocking/mock-responses/cardholder-mocks.ts
@@ -312,4 +312,13 @@ export const testSpecificMock: TestSpecificMock = async (mockServer) => {
     },
     responseCode: 200,
   });
+
+  // Card dashboard — opened in an in-app browser by card tests
+  await setupMockRequest(mockServer, {
+    requestMethod: 'GET',
+    url: /^https:\/\/card\.metamask\.io(\/.*)?$/,
+    response:
+      '<html><head><title>Card</title></head><body>Card Dashboard</body></html>',
+    responseCode: 200,
+  });
 };
diff --git a/tests/api-mocking/mock-responses/defaults/index.ts b/tests/api-mocking/mock-responses/defaults/index.ts
index 62ba17d0aa41..a09e8c29294f 100644
--- a/tests/api-mocking/mock-responses/defaults/index.ts
+++ b/tests/api-mocking/mock-responses/defaults/index.ts
@@ -375,7 +375,16 @@ export const DEFAULT_MOCKS = {
     ...(DEFAULT_REWARDS_MOCKS.POST || []),
     ...(PERPS_HYPERLIQUID_MOCKS.POST || []),
   ],
-  PUT: [...(USER_STORAGE_MOCK.PUT || [])],
+  PUT: [
+    ...(USER_STORAGE_MOCK.PUT || []),
+    // Profile accounts sync — triggered by onboarded fixture state
+    {
+      urlEndpoint:
+        /^https:\/\/authentication\.api\.cx\.metamask\.io\/api\/v2\/profile\/accounts$/,
+      responseCode: 200,
+      response: {},
+    },
+  ],
   DELETE: [],
   PATCH: [],
 };
diff --git a/tests/api-mocking/mock-responses/defaults/onramp-apis.ts b/tests/api-mocking/mock-responses/defaults/onramp-apis.ts
index e05e1f1c9404..378efa3c9816 100644
--- a/tests/api-mocking/mock-responses/defaults/onramp-apis.ts
+++ b/tests/api-mocking/mock-responses/defaults/onramp-apis.ts
@@ -56,6 +56,12 @@ export const DEFAULT_RAMPS_API_MOCKS: MockEventsObject = {
       responseCode: 200,
       response: [],
     },
+    {
+      urlEndpoint:
+        /^https:\/\/on-ramp-cache\.uat-api\.cx\.metamask\.io\/regions\/.*\/tokens\?.*$/,
+      responseCode: 200,
+      response: RAMPS_TOP_TOKENS_RESPONSE,
+    },
     {
       urlEndpoint:
         /^https:\/\/on-ramp-cache\.uat-api\.cx\.metamask\.io\/v2\/regions\/[^/]+\/topTokens\?.*$/,
diff --git a/tests/api-mocking/mock-responses/perps-arbitrum-mocks.ts b/tests/api-mocking/mock-responses/perps-arbitrum-mocks.ts
index 825efd7c7c50..7ed5979f139a 100644
--- a/tests/api-mocking/mock-responses/perps-arbitrum-mocks.ts
+++ b/tests/api-mocking/mock-responses/perps-arbitrum-mocks.ts
@@ -7,7 +7,17 @@
  */
 
 import type { Mockttp } from 'mockttp';
-import type { TestSpecificMock } from '../../framework';
+import {
+  createLogger,
+  LogLevel,
+  type TestSpecificMock,
+  RampsRegion,
+} from '../../framework';
+
+const logger = createLogger({
+  name: 'PerpsArbitrumMocks',
+  level: LogLevel.INFO,
+});
 
 // Static mock responses for Arbitrum RPC calls
 const MOCK_RESPONSES: Record<string, unknown> = {
@@ -83,7 +93,7 @@ export const PERPS_ARBITRUM_MOCKS: TestSpecificMock = async (
         const bodyText = await request.body.getText();
         const body = bodyText ? JSON.parse(bodyText) : undefined;
 
-        console.log('[Perps E2E Mock] Intercepted Arbitrum RPC call');
+        logger.info('[Perps E2E Mock] Intercepted Arbitrum RPC call');
 
         // Handle batch requests
         if (Array.isArray(body)) {
@@ -171,7 +181,7 @@ export const PERPS_ARBITRUM_MOCKS: TestSpecificMock = async (
           }),
         };
       } catch (error) {
-        console.log('[Perps E2E Mock] Error parsing request body:', error);
+        logger.error('[Perps E2E Mock] Error parsing request body:', error);
         return {
           statusCode: 200,
           body: JSON.stringify({
@@ -192,7 +202,7 @@ export const PERPS_ARBITRUM_MOCKS: TestSpecificMock = async (
     })
     .asPriority(1000)
     .thenCallback(() => {
-      console.log('[Perps E2E Mock] Intercepted HyperLiquid Exchange GET');
+      logger.info('[Perps E2E Mock] Intercepted HyperLiquid Exchange GET');
       return {
         statusCode: 200,
         body: JSON.stringify({ status: 'ok' }),
@@ -209,7 +219,7 @@ export const PERPS_ARBITRUM_MOCKS: TestSpecificMock = async (
     })
     .asPriority(1000)
     .thenCallback(() => {
-      console.log('[Perps E2E Mock] Intercepted HyperLiquid Exchange POST');
+      logger.info('[Perps E2E Mock] Intercepted HyperLiquid Exchange POST');
       return {
         statusCode: 200,
         body: JSON.stringify({ status: 'ok' }),
@@ -228,7 +238,7 @@ export const PERPS_ARBITRUM_MOCKS: TestSpecificMock = async (
     })
     .asPriority(1000)
     .thenCallback(() => {
-      console.log(
+      logger.info(
         '[Perps E2E Mock] Intercepted Rewards perps-fee-discount request',
       );
       return {
@@ -252,7 +262,7 @@ export const PERPS_ARBITRUM_MOCKS: TestSpecificMock = async (
     })
     .asPriority(1000)
     .thenCallback(() => {
-      console.log(
+      logger.info(
         '[Perps E2E Mock] Intercepted HyperLiquid coin image request',
       );
       return {
@@ -274,7 +284,7 @@ export const PERPS_ARBITRUM_MOCKS: TestSpecificMock = async (
     })
     .asPriority(1000)
     .thenCallback(() => {
-      console.log('[Perps E2E Mock] Intercepted Accounts API request');
+      logger.info('[Perps E2E Mock] Intercepted Accounts API request');
       return {
         statusCode: 200,
         body: JSON.stringify({ data: [], included: [] }),
@@ -296,7 +306,7 @@ export const PERPS_ARBITRUM_MOCKS: TestSpecificMock = async (
       const urlParam = new URL(request.url).searchParams.get('url') || '';
       const url = new URL(urlParam);
       const address = (url.searchParams.get('address') || '').toLowerCase();
-      console.log(
+      logger.info(
         '[Perps E2E Mock] Intercepted Token API request for',
         address,
       );
@@ -325,7 +335,7 @@ export const PERPS_ARBITRUM_MOCKS: TestSpecificMock = async (
     })
     .asPriority(1000)
     .thenCallback(async () => {
-      console.log('[Perps E2E Mock] Intercepted Tx Sentinel request');
+      logger.info('[Perps E2E Mock] Intercepted Tx Sentinel request');
       return {
         statusCode: 200,
         body: JSON.stringify({ status: 'ok' }),
@@ -342,7 +352,7 @@ export const PERPS_ARBITRUM_MOCKS: TestSpecificMock = async (
     })
     .asPriority(1000)
     .thenCallback(() => {
-      console.log('[Perps E2E Mock] Intercepted Price API request');
+      logger.info('[Perps E2E Mock] Intercepted Price API request');
       return {
         statusCode: 200,
         body: JSON.stringify({
@@ -426,7 +436,7 @@ export const PERPS_ARBITRUM_MOCKS: TestSpecificMock = async (
     })
     .asPriority(1000)
     .thenCallback(() => {
-      console.log('[Perps E2E Mock] Intercepted Price API request');
+      logger.info('[Perps E2E Mock] Intercepted Price API request');
       return {
         statusCode: 200,
         body: JSON.stringify({
@@ -459,3 +469,36 @@ export const PERPS_ARBITRUM_MOCKS: TestSpecificMock = async (
       };
     });
 };
+
+/**
+ * Mock the geolocation endpoint for Perps eligibility checks.
+ * The EligibilityService fetches geolocation via /proxy and compares
+ * the plain-text result against the blocked regions list (US, CA-ON, GB, BE).
+ * Pass a non-blocked region (e.g. Spain, France) to ensure eligibility.
+ */
+export const mockPerpsGeolocation = async (
+  mockServer: Mockttp,
+  region: RampsRegion,
+): Promise<void> => {
+  const regionCode = region.id.replace('/regions/', '');
+
+  await mockServer
+    .forGet('/proxy')
+    .matching((request) => {
+      const urlParam = new URL(request.url).searchParams.get('url') || '';
+      return /on-ramp\.(dev-api|uat-api|api)\.cx\.metamask\.io\/geolocation/.test(
+        urlParam,
+      );
+    })
+    .asPriority(1000)
+    .thenCallback(() => {
+      logger.info(
+        `[Perps E2E Mock] Intercepted geolocation request → ${regionCode}`,
+      );
+      return {
+        statusCode: 200,
+        body: regionCode,
+        headers: { 'Content-Type': 'text/plain' },
+      };
+    });
+};
diff --git a/tests/api-mocking/mock-responses/ramps/onramp-persona-data.ts b/tests/api-mocking/mock-responses/ramps/onramp-persona-data.ts
new file mode 100644
index 000000000000..86826806ccf4
--- /dev/null
+++ b/tests/api-mocking/mock-responses/ramps/onramp-persona-data.ts
@@ -0,0 +1,14 @@
+export const ONRAMP_PERSONA = {
+  email: 'curtis@example.com',
+  firstName: 'Curt',
+  lastName: 'Angle',
+  mobileNumber: '+15555555555',
+  address: {
+    addressLine1: '123 Test St',
+    city: 'Test City',
+    state: 'CA',
+    postCode: '90210',
+    country: 'United States',
+    countryCode: 'US',
+  },
+};
diff --git a/tests/api-mocking/mock-responses/ramps/ramps-mocks.ts b/tests/api-mocking/mock-responses/ramps/ramps-mocks.ts
index 64e264ee2edd..5bf05ab6add3 100644
--- a/tests/api-mocking/mock-responses/ramps/ramps-mocks.ts
+++ b/tests/api-mocking/mock-responses/ramps/ramps-mocks.ts
@@ -12,7 +12,29 @@ import { RAMPS_TOP_TOKENS_RESPONSE } from './responses/ramps-tokens-response.ts'
 import { RAMPS_PROVIDERS_RESPONSE } from './responses/ramps-providers-response.ts';
 import { RAMPS_PAYMENTS_V2_RESPONSE } from './responses/ramps-payments-response.ts';
 import { createGeolocationResponse } from './responses/ramps-geolocation.ts';
-import { RAMPS_QUOTE_RESPONSE } from './responses/ramps-quotes-response.ts';
+import {
+  createRampsQuoteResponse,
+  ProviderType,
+} from './responses/ramps-quotes-response.ts';
+import {
+  TRANSAK_AUTH_LOGIN_RESPONSE,
+  TRANSAK_AUTH_VERIFY_RESPONSE,
+} from './transak/transak-auth-response.ts';
+import { TRANSAK_QUOTE_RESPONSE } from './transak/transak-quotes-response.ts';
+import {
+  TRANSAK_USER_DETAILS_RESPONSE,
+  TRANSAK_KYC_REQUIREMENT_RESPONSE,
+  TRANSAK_USER_LIMITS_RESPONSE,
+} from './transak/transak-user-response.ts';
+import { TRANSAK_CREATE_ORDER_RESPONSE } from './transak/transak-order-response.ts';
+import { TRANSAK_RAMPS_TRANSLATE_RESPONSE } from './transak/transak-ramps-translate-response.ts';
+import { TRANSAK_PAYMENTS_OVERRIDE_RESPONSE } from './transak/transak-payments-override-response.ts';
+import {
+  BUY_ORDER_WIDGET_URL_RESPONSE,
+  BUY_ORDER_CALLBACK_RESPONSE,
+} from './responses/ramps-buy-order-checkout-response.ts';
+import { createBuyOrderResponse } from './responses/ramps-buy-order-status-response.ts';
+import { createDepositOrderResponse } from './responses/ramps-deposit-order-status-response.ts';
 
 /** Registers an array of static GET mocks in parallel. */
 const registerGetMocks = (mockServer: Mockttp, mocks: MockApiEndpoint[]) =>
@@ -122,20 +144,26 @@ export const RAMPS_CATALOG_MOCKS = async (mockServer: Mockttp) => {
 /**
  * Quote mocks for V1 and V2 endpoints.
  * Returns a single transak-staging quote so the controller auto-selects it.
+ *
+ * @param providerType - 'native' for the Transak KYC flow, 'aggregator' for the widget/WebView flow.
  */
-export const RAMPS_QUOTE_MOCKS = async (mockServer: Mockttp) => {
+export const RAMPS_QUOTE_MOCKS = async (
+  mockServer: Mockttp,
+  providerType: ProviderType = 'aggregator',
+) => {
+  const quoteResponse = createRampsQuoteResponse(providerType);
   await registerGetMocks(mockServer, [
     {
       urlEndpoint:
         /^https:\/\/on-ramp\.uat-api\.cx\.metamask\.io\/providers\/all\/quote\?.*$/,
       responseCode: 200,
-      response: RAMPS_QUOTE_RESPONSE,
+      response: quoteResponse,
     },
     {
       urlEndpoint:
         /^https:\/\/on-ramp\.uat-api\.cx\.metamask\.io\/v2\/quotes\?.*$/,
       responseCode: 200,
-      response: RAMPS_QUOTE_RESPONSE,
+      response: quoteResponse,
     },
   ]);
 };
@@ -147,24 +175,17 @@ export const RAMPS_QUOTE_MOCKS = async (mockServer: Mockttp) => {
  */
 export const RAMPS_CHECKOUT_MOCKS = async (mockServer: Mockttp) => {
   await registerGetMocks(mockServer, [
-    // Buy widget URL — returns a staging callback URL so the WebView
-    // immediately triggers the "order complete" flow.
     {
       urlEndpoint:
         /^https:\/\/on-ramp\.uat-api\.cx\.metamask\.io\/v2\/providers\/[^/]+\/buy(\?.*)?$/,
       responseCode: 200,
-      response: {
-        url: 'https://on-ramp-content.uat-api.cx.metamask.io/regions/fake-callback?orderId=mock-order-123',
-        browser: 'APP_BROWSER',
-        orderId: null,
-      },
+      response: BUY_ORDER_WIDGET_URL_RESPONSE,
     },
-    // Callback — extracts order ID from provider callback URL
     {
       urlEndpoint:
         /^https:\/\/on-ramp\.uat-api\.cx\.metamask\.io\/v2\/providers\/[^/]+\/callback(\?.*)?$/,
       responseCode: 200,
-      response: { id: 'mock-order-123' },
+      response: BUY_ORDER_CALLBACK_RESPONSE,
     },
   ]);
 };
@@ -192,58 +213,17 @@ export const RAMPS_TOKEN_ICON_MOCKS = async (mockServer: Mockttp) => {
   ]);
 };
 
-/** Builds a full order response object for the given status. */
-const buildOrderResponse = (status: string) => ({
-  id: 'mock-order-123',
-  isOnlyLink: false,
-  success: status === 'COMPLETED',
-  cryptoAmount: '0.00355373',
-  fiatAmount: 15,
-  cryptoCurrency: {
-    symbol: 'ETH',
-    name: 'Ethereum',
-    decimals: 18,
-  },
-  fiatCurrency: {
-    symbol: 'USD',
-    name: 'US Dollar',
-    decimals: 2,
-    denomSymbol: '$',
-  },
-  provider: {
-    id: '/providers/transak-staging',
-    name: 'Transak (Staging)',
-  },
-  providerOrderId: 'mock-order-123',
-  providerOrderLink: '',
-  createdAt: Date.now(),
-  totalFeesFiat: 3.5,
-  txHash: status === 'COMPLETED' ? '0xmocktxhash123' : null,
-  walletAddress: '0x76cf1CdD1fcC252442b50D6e97207228aA4aefC3',
-  status,
-  network: {
-    name: 'Ethereum Mainnet',
-    chainId: '1',
-  },
-  canBeUpdated: false,
-  idHasExpired: false,
-  excludeFromPurchases: false,
-  timeDescriptionPending: 'Usually completes in a few minutes',
-  orderType: 'BUY',
-  exchangeRate: 4072.34,
-});
-
 /**
- * Stateful order-status mock.
- * Returns PENDING on the first call, then COMPLETED on every subsequent call.
- * This lets tests observe the pending -> completed transition during order polling.
+ * Buy order-status mock.
+ * Always returns COMPLETED so the order is stored as completed by
+ * getOrderFromCallback, matching how the native deposit flow works
+ * (refreshOrder is called before addOrder there, so the stored order
+ * is already completed when OrderDetails mounts).
  */
-export const RAMPS_ORDER_STATUS_MOCKS = async (mockServer: Mockttp) => {
+export const BUY_ORDER_STATUS_MOCKS = async (mockServer: Mockttp) => {
   const orderUrlPattern =
     /^https:\/\/on-ramp\.uat-api\.cx\.metamask\.io\/v2\/providers\/[^/]+\/orders\/[^/]+(\?.*)?$/;
 
-  let orderCallCount = 0;
-
   await mockServer
     .forGet('/proxy')
     .matching((request) => {
@@ -251,22 +231,203 @@ export const RAMPS_ORDER_STATUS_MOCKS = async (mockServer: Mockttp) => {
       return orderUrlPattern.test(url);
     })
     .asPriority(999)
-    .thenCallback((_) => {
-      orderCallCount++;
-      const status = orderCallCount <= 1 ? 'PENDING' : 'COMPLETED';
+    .thenCallback(() => ({
+      statusCode: 200,
+      json: createBuyOrderResponse('COMPLETED'),
+    }));
+};
+
+/**
+ * Stateful deposit order-status mock for the native Transak flow.
+ * Returns PENDING on the first call, then COMPLETED on every subsequent call.
+ */
+export const DEPOSIT_ORDER_STATUS_MOCKS = async (mockServer: Mockttp) => {
+  let depositOrderCallCount = 0;
+  await mockServer
+    .forGet('/proxy')
+    .matching((request) => {
+      const url = getDecodedProxiedURL(request.url);
+      // Matches both the legacy TransakService endpoint (/providers/...) and the
+      // v2 RampsService endpoint (/v2/providers/...) used by refreshOrder.
+      return url.includes('providers/transak-native-staging/orders/');
+    })
+    .asPriority(1000)
+    .thenCallback(() => {
+      depositOrderCallCount++;
+      const status = depositOrderCallCount <= 1 ? 'PENDING' : 'COMPLETED';
       return {
         statusCode: 200,
-        json: buildOrderResponse(status),
+        json: createDepositOrderResponse(status),
       };
     });
 };
 
 /**
- * Sets up all on-ramp API mocks for a given region.
- * This is the main entry point used by test files.
+ * Mocks all Transak API endpoints for the native KYC + bank-transfer flow.
+ * Covers: auth/login, auth/verify, lookup/quotes, user details, KYC requirement,
+ * user limits, create order, ramps translation, and ramps orders (with stateful polling).
  *
- * @param mockServer - The mock server instance
- * @param selectedRegion - The region selected in the test fixture
+ * Also overrides the payments mock to add isManualBankTransfer: true to debit-credit-card
+ * so the flow takes the bank transfer path (avoiding the unmockable WebView).
+ */
+export const TRANSAK_NATIVE_FLOW_MOCKS = async (mockServer: Mockttp) => {
+  // --- Transak API mocks (api-gateway-stg.transak.com) ---
+  // All responses wrapped in { data: ... } because TransakService unwraps .data
+
+  // POST auth/login — sendUserOtp(email)
+  await mockServer
+    .forPost('/proxy')
+    .matching((request) => {
+      const url = getDecodedProxiedURL(request.url);
+      return url.includes('api-gateway-stg.transak.com/api/v2/auth/login');
+    })
+    .asPriority(999)
+    .thenCallback(() => ({
+      statusCode: 200,
+      json: TRANSAK_AUTH_LOGIN_RESPONSE,
+    }));
+
+  // POST auth/verify — verifyUserOtp()
+  await mockServer
+    .forPost('/proxy')
+    .matching((request) => {
+      const url = getDecodedProxiedURL(request.url);
+      return url.includes('api-gateway-stg.transak.com/api/v2/auth/verify');
+    })
+    .asPriority(999)
+    .thenCallback(() => ({
+      statusCode: 200,
+      json: TRANSAK_AUTH_VERIFY_RESPONSE,
+    }));
+
+  // GET lookup/quotes — transakGetBuyQuote() internal Transak quote
+  await mockServer
+    .forGet('/proxy')
+    .matching((request) => {
+      const url = getDecodedProxiedURL(request.url);
+      return url.includes('api-gateway-stg.transak.com/api/v2/lookup/quotes');
+    })
+    .asPriority(999)
+    .thenCallback(() => ({
+      statusCode: 200,
+      json: TRANSAK_QUOTE_RESPONSE,
+    }));
+
+  // GET user/ — getUserDetails()
+  await mockServer
+    .forGet('/proxy')
+    .matching((request) => {
+      const url = getDecodedProxiedURL(request.url);
+      return url.includes('api-gateway-stg.transak.com/api/v2/user/');
+    })
+    .asPriority(999)
+    .thenCallback(() => ({
+      statusCode: 200,
+      json: TRANSAK_USER_DETAILS_RESPONSE,
+    }));
+
+  // GET kyc/requirement — getKycRequirement()
+  await mockServer
+    .forGet('/proxy')
+    .matching((request) => {
+      const url = getDecodedProxiedURL(request.url);
+      return url.includes('api-gateway-stg.transak.com/api/v2/kyc/requirement');
+    })
+    .asPriority(999)
+    .thenCallback(() => ({
+      statusCode: 200,
+      json: TRANSAK_KYC_REQUIREMENT_RESPONSE,
+    }));
+
+  // GET orders/user-limit — getUserLimits()
+  await mockServer
+    .forGet('/proxy')
+    .matching((request) => {
+      const url = getDecodedProxiedURL(request.url);
+      return url.includes(
+        'api-gateway-stg.transak.com/api/v2/orders/user-limit',
+      );
+    })
+    .asPriority(999)
+    .thenCallback(() => ({
+      statusCode: 200,
+      json: TRANSAK_USER_LIMITS_RESPONSE,
+    }));
+
+  // POST orders — createOrder()
+  await mockServer
+    .forPost('/proxy')
+    .matching((request) => {
+      const url = getDecodedProxiedURL(request.url);
+      return (
+        url.includes('api-gateway-stg.transak.com/api/v2/orders') &&
+        !url.includes('user-limit') &&
+        !url.includes('payment-confirmation') &&
+        !url.includes('active-orders')
+      );
+    })
+    .asPriority(999)
+    .thenCallback(() => ({
+      statusCode: 200,
+      json: TRANSAK_CREATE_ORDER_RESPONSE,
+    }));
+
+  // GET orders/{id} — TransakService.getOrder() payment-details enrichment
+  // Called after createOrder when an access token is present.
+  await mockServer
+    .forGet('/proxy')
+    .matching((request) => {
+      const url = getDecodedProxiedURL(request.url);
+      return (
+        url.includes('api-gateway-stg.transak.com/api/v2/orders/') &&
+        !url.includes('user-limit') &&
+        !url.includes('active-orders')
+      );
+    })
+    .asPriority(999)
+    .thenCallback(() => ({
+      statusCode: 200,
+      json: { data: { orderId: 'mock-transak-order-123' } },
+    }));
+
+  // GET translate — getTranslation() (on-ramp.uat-api.cx.metamask.io)
+  await mockServer
+    .forGet('/proxy')
+    .matching((request) => {
+      const url = getDecodedProxiedURL(request.url);
+      return url.includes(
+        'on-ramp.uat-api.cx.metamask.io/providers/transak-native-staging/native/translate',
+      );
+    })
+    .asPriority(999)
+    .thenCallback(() => ({
+      statusCode: 200,
+      json: TRANSAK_RAMPS_TRANSLATE_RESPONSE,
+    }));
+
+  await DEPOSIT_ORDER_STATUS_MOCKS(mockServer);
+
+  // Payments override — isManualBankTransfer: true for bank transfer path
+  await setupMockRequest(
+    mockServer,
+    {
+      requestMethod: 'GET',
+      url: /^https:\/\/on-ramp-cache\.uat-api\.cx\.metamask\.io\/v2\/regions\/[^/]+\/payments\?.*$/,
+      response: TRANSAK_PAYMENTS_OVERRIDE_RESPONSE,
+      responseCode: 200,
+    },
+    1000,
+  );
+};
+
+/**
+ * Sets up region eligibility and catalog mocks.
+ * Covers geolocation, deposit/aggregator eligibility, and all catalog data
+ * (networks, tokens, providers, payment methods, token icons).
+ *
+ * Use directly for tests that navigate the token-selection or off-ramp UI
+ * without proceeding to a quote or checkout step.
+ * Use setupDepositOnRampMocks or setupBuyOnRampMocks for full-flow tests.
  */
 export const setupRegionAwareOnRampMocks = async (
   mockServer: Mockttp,
@@ -274,8 +435,35 @@ export const setupRegionAwareOnRampMocks = async (
 ) => {
   await RAMPS_REGION_MOCKS(mockServer, selectedRegion);
   await RAMPS_CATALOG_MOCKS(mockServer);
+  await RAMPS_TOKEN_ICON_MOCKS(mockServer);
+};
+
+/**
+ * Sets up all mocks for the native Transak deposit flow (KYC/OTP + bank transfer).
+ * Builds on region/catalog mocks and adds native quotes, checkout, and all
+ * Transak-specific API endpoints.
+ */
+export const setupDepositOnRampMocks = async (
+  mockServer: Mockttp,
+  selectedRegion: RampsRegion,
+) => {
+  await setupRegionAwareOnRampMocks(mockServer, selectedRegion);
+  await RAMPS_QUOTE_MOCKS(mockServer, 'native');
+  await RAMPS_CHECKOUT_MOCKS(mockServer);
+  await TRANSAK_NATIVE_FLOW_MOCKS(mockServer);
+};
+
+/**
+ * Sets up all mocks for the aggregator WebView buy flow.
+ * Builds on region/catalog mocks and adds aggregator quotes, checkout,
+ * and buy order status polling.
+ */
+export const setupBuyOnRampMocks = async (
+  mockServer: Mockttp,
+  selectedRegion: RampsRegion,
+) => {
+  await setupRegionAwareOnRampMocks(mockServer, selectedRegion);
   await RAMPS_QUOTE_MOCKS(mockServer);
   await RAMPS_CHECKOUT_MOCKS(mockServer);
-  await RAMPS_TOKEN_ICON_MOCKS(mockServer);
-  await RAMPS_ORDER_STATUS_MOCKS(mockServer);
+  await BUY_ORDER_STATUS_MOCKS(mockServer);
 };
diff --git a/tests/api-mocking/mock-responses/ramps/responses/ramps-buy-order-checkout-response.ts b/tests/api-mocking/mock-responses/ramps/responses/ramps-buy-order-checkout-response.ts
new file mode 100644
index 000000000000..bc27e1fa2563
--- /dev/null
+++ b/tests/api-mocking/mock-responses/ramps/responses/ramps-buy-order-checkout-response.ts
@@ -0,0 +1,16 @@
+/**
+ * Mock response data for buy (aggregator) checkout flow.
+ * Endpoints: GET buy widget URL, GET callback.
+ * After a quote is selected, RampsController.syncWidgetUrl() fetches the widget URL,
+ * then getOrderFromCallback() extracts the order ID from the provider callback.
+ */
+
+export const BUY_ORDER_WIDGET_URL_RESPONSE = {
+  url: 'https://on-ramp-content.uat-api.cx.metamask.io/regions/fake-callback?orderId=mock-order-123',
+  browser: 'APP_BROWSER',
+  orderId: null,
+};
+
+export const BUY_ORDER_CALLBACK_RESPONSE = {
+  id: 'mock-order-123',
+};
diff --git a/tests/api-mocking/mock-responses/ramps/responses/ramps-buy-order-status-response.ts b/tests/api-mocking/mock-responses/ramps/responses/ramps-buy-order-status-response.ts
new file mode 100644
index 000000000000..8299a9cbb2bd
--- /dev/null
+++ b/tests/api-mocking/mock-responses/ramps/responses/ramps-buy-order-status-response.ts
@@ -0,0 +1,45 @@
+/**
+ * Mock response data for buy (aggregator) order status polling.
+ * Endpoint: GET on-ramp.uat-api.../v2/providers/.../orders/...
+ * Returns a full order object; status is typically PENDING then COMPLETED.
+ */
+
+export const createBuyOrderResponse = (status: string) => ({
+  id: 'mock-order-123',
+  isOnlyLink: false,
+  success: status === 'COMPLETED',
+  cryptoAmount: '0.00355',
+  fiatAmount: 15,
+  cryptoCurrency: {
+    symbol: 'ETH',
+    name: 'Ethereum',
+    decimals: 18,
+  },
+  fiatCurrency: {
+    symbol: 'USD',
+    name: 'US Dollar',
+    decimals: 2,
+    denomSymbol: '$',
+  },
+  provider: {
+    id: '/providers/transak-staging',
+    name: 'Transak (Staging)',
+  },
+  providerOrderId: 'mock-order-123',
+  providerOrderLink: '',
+  createdAt: Date.now(),
+  totalFeesFiat: 3.5,
+  txHash: status === 'COMPLETED' ? '0xmocktxhash123' : null,
+  walletAddress: '0x76cf1CdD1fcC252442b50D6e97207228aA4aefC3',
+  status,
+  network: {
+    name: 'Ethereum Mainnet',
+    chainId: '1',
+  },
+  canBeUpdated: false,
+  idHasExpired: false,
+  excludeFromPurchases: false,
+  timeDescriptionPending: 'Usually completes in a few minutes',
+  orderType: 'BUY',
+  exchangeRate: 4072.34,
+});
diff --git a/tests/api-mocking/mock-responses/ramps/responses/ramps-deposit-order-status-response.ts b/tests/api-mocking/mock-responses/ramps/responses/ramps-deposit-order-status-response.ts
new file mode 100644
index 000000000000..c1202c09af89
--- /dev/null
+++ b/tests/api-mocking/mock-responses/ramps/responses/ramps-deposit-order-status-response.ts
@@ -0,0 +1,42 @@
+/**
+ * Mock response data for deposit (Transak native) order status polling.
+ * Endpoint: GET on-ramp.uat-api.../providers/transak-native-staging/orders/...
+ * Used by ramps orders API mock (getOrder after createOrder) and processDepositOrder.
+ * Returns deposit-format order; status is typically PENDING then COMPLETED.
+ */
+
+export const createDepositOrderResponse = (status: string) => ({
+  provider: '/providers/transak-native-staging',
+  providerOrderId: 'mock-transak-order-123',
+  providerOrderLink: '',
+  createdAt: Date.now(),
+  fiatAmount: 100,
+  totalFeesFiat: 23.33,
+  cryptoAmount: '0.02455',
+  fiatCurrency: {
+    symbol: 'USD',
+    name: 'US Dollar',
+    decimals: 2,
+    denomSymbol: '$',
+  },
+  fiatAmountInUsd: 100,
+  cryptoCurrency: {
+    symbol: 'ETH',
+    name: 'Ethereum',
+  },
+  network: {
+    chainId: '1',
+    name: 'Ethereum Mainnet',
+  },
+  walletAddress: '0x76cf1CdD1fcC252442b50D6e97207228aA4aefC3',
+  status,
+  txHash: status === 'COMPLETED' ? '0xmocktxhash123' : null,
+  orderType: 'DEPOSIT',
+  isOnlyLink: false,
+  success: status === 'COMPLETED',
+  canBeUpdated: false,
+  idHasExpired: false,
+  excludeFromPurchases: false,
+  timeDescriptionPending: 'Usually completes in a few minutes',
+  exchangeRate: 4072.34,
+});
diff --git a/tests/api-mocking/mock-responses/ramps/responses/ramps-geolocation.ts b/tests/api-mocking/mock-responses/ramps/responses/ramps-geolocation.ts
index ae8d4870a39b..d99618e8e45c 100644
--- a/tests/api-mocking/mock-responses/ramps/responses/ramps-geolocation.ts
+++ b/tests/api-mocking/mock-responses/ramps/responses/ramps-geolocation.ts
@@ -17,14 +17,13 @@ export const createGeolocationResponse = (
     { env: 'prod', url: 'https://on-ramp.api.cx.metamask.io/geolocation' },
   ];
 
+  // The real /geolocation endpoint returns plain text (e.g. 'us-ca'), not JSON.
+  // The app reads this with response.text() in useDetectGeolocation.ts and stores
+  // it as-is. If we return a JSON object here, it gets stringified and injected
+  // into URL paths like /regions/{geolocation}/tokens, producing malformed URLs.
   return envConfigs.map(({ url }) => ({
     urlEndpoint: url,
     responseCode: 200,
-    response: {
-      id: region.id,
-      name: region.name,
-      emoji: region.emoji,
-      detected: true,
-    },
+    response: region.id.replace('/regions/', ''),
   }));
 };
diff --git a/tests/api-mocking/mock-responses/ramps/responses/ramps-providers-response.ts b/tests/api-mocking/mock-responses/ramps/responses/ramps-providers-response.ts
index e2d51af76fa6..212ece62f7d7 100644
--- a/tests/api-mocking/mock-responses/ramps/responses/ramps-providers-response.ts
+++ b/tests/api-mocking/mock-responses/ramps/responses/ramps-providers-response.ts
@@ -1,4 +1,7 @@
-// Providers V2 response — staging providers: Transak (default) + Moonpay.
+// Providers V2 response — staging providers: Transak (native) + MoonPay (aggregator).
+// Transak uses the native SDK flow; MoonPay uses the WebView/widget aggregator flow.
+// Note: provider.type here is informational catalog metadata. Flow routing is NOT
+// driven by this field — it is determined at the quote level (quote.providerInfo.type).
 // determinePreferredProvider() auto-selects Transak (matches "transak" in id/name).
 export const RAMPS_PROVIDERS_RESPONSE = {
   providers: [
@@ -56,7 +59,7 @@ export const RAMPS_PROVIDERS_RESPONSE = {
         },
         recurringBuy: {},
       },
-      type: 'aggregator',
+      type: 'native',
       supportedCryptoCurrencies: {
         'eip155:1/slip44:60': true,
       },
diff --git a/tests/api-mocking/mock-responses/ramps/responses/ramps-quotes-response.ts b/tests/api-mocking/mock-responses/ramps/responses/ramps-quotes-response.ts
index 71deb3fb12e0..8e49bf50c801 100644
--- a/tests/api-mocking/mock-responses/ramps/responses/ramps-quotes-response.ts
+++ b/tests/api-mocking/mock-responses/ramps/responses/ramps-quotes-response.ts
@@ -6,7 +6,12 @@
 // controller auto-selects it (RampsController.mjs:952).
 // Returning multiple quotes breaks auto-selection and leaves the Continue
 // button disabled.
-export const RAMPS_QUOTE_RESPONSE = {
+
+export type ProviderType = 'native' | 'aggregator';
+
+export const createRampsQuoteResponse = (
+  providerType: ProviderType = 'native',
+) => ({
   success: [
     {
       provider: '/providers/transak-staging',
@@ -40,11 +45,11 @@ export const RAMPS_QUOTE_RESPONSE = {
           denomSymbol: '$',
         },
         fiatId: '/currencies/fiat/usd',
-        amountIn: 15,
-        amountOut: 0.00355373,
+        amountIn: providerType === 'native' ? 100 : 15,
+        amountOut: providerType === 'native' ? 0.02455598 : 0.00355373,
         exchangeRate: 4072.34318439678,
         networkFee: 0.02,
-        providerFee: 3.5,
+        providerFee: providerType === 'native' ? 23.33 : 3.5,
         extraFee: 0,
         receiver: '0x76cf1CdD1fcC252442b50D6e97207228aA4aefC3',
         paymentMethod: '/payments/debit-credit-card',
@@ -56,7 +61,7 @@ export const RAMPS_QUOTE_RESPONSE = {
       providerInfo: {
         id: '/providers/transak-staging',
         name: 'Transak (Staging)',
-        type: 'aggregator',
+        type: providerType,
         environmentType: 'STAGING',
         description:
           'Per Transak: "The fastest and securest way to buy 100+ cryptocurrencies on 75+ blockchains. Pay via Apple Pay, UPI, bank transfer or use your debit or credit card. Trusted by 2+ million global users. Transak empowers wallets, gaming, DeFi, NFTs, Exchanges, and DAOs across 125+ countries."',
@@ -132,4 +137,4 @@ export const RAMPS_QUOTE_RESPONSE = {
   ],
   error: [],
   customActions: [],
-};
+});
diff --git a/tests/api-mocking/mock-responses/ramps/transak/transak-auth-response.ts b/tests/api-mocking/mock-responses/ramps/transak/transak-auth-response.ts
new file mode 100644
index 000000000000..face3d8b9949
--- /dev/null
+++ b/tests/api-mocking/mock-responses/ramps/transak/transak-auth-response.ts
@@ -0,0 +1,24 @@
+/**
+ * Mock response data for Transak auth API endpoints.
+ * Endpoints: POST auth/login (sendUserOtp), POST auth/verify (verifyUserOtp).
+ * Transak API returns responses wrapped in { data: ... }.
+ */
+
+import { ONRAMP_PERSONA } from '../onramp-persona-data';
+
+export const TRANSAK_AUTH_LOGIN_RESPONSE = {
+  data: {
+    stateToken: 'mock-state-token',
+    isTncAccepted: true,
+    email: ONRAMP_PERSONA.email,
+    expiresIn: 20,
+  },
+};
+
+export const TRANSAK_AUTH_VERIFY_RESPONSE = {
+  data: {
+    accessToken: 'mock-access-token',
+    ttl: 3600,
+    created: new Date().toISOString(),
+  },
+};
diff --git a/tests/api-mocking/mock-responses/ramps/transak/transak-order-response.ts b/tests/api-mocking/mock-responses/ramps/transak/transak-order-response.ts
new file mode 100644
index 000000000000..462a37f5e2f8
--- /dev/null
+++ b/tests/api-mocking/mock-responses/ramps/transak/transak-order-response.ts
@@ -0,0 +1,11 @@
+/**
+ * Mock response data for Transak create order API.
+ * Endpoint: POST api-gateway-stg.transak.com/api/v2/orders
+ */
+
+export const TRANSAK_CREATE_ORDER_RESPONSE = {
+  data: {
+    orderId: 'mock-transak-order-123',
+    walletAddress: '0x76cf1CdD1fcC252442b50D6e97207228aA4aefC3',
+  },
+};
diff --git a/tests/api-mocking/mock-responses/ramps/transak/transak-payments-override-response.ts b/tests/api-mocking/mock-responses/ramps/transak/transak-payments-override-response.ts
new file mode 100644
index 000000000000..4c06f0f3ed13
--- /dev/null
+++ b/tests/api-mocking/mock-responses/ramps/transak/transak-payments-override-response.ts
@@ -0,0 +1,42 @@
+/**
+ * Payments override for Transak native flow (bank transfer path).
+ * Adds isManualBankTransfer: true to debit-credit-card so the flow
+ * avoids the unmockable WebView and uses the bank transfer path.
+ * Overrides: GET on-ramp-cache.../v2/regions/.../payments
+ */
+
+export const TRANSAK_PAYMENTS_OVERRIDE_RESPONSE = {
+  payments: [
+    {
+      id: '/payments/debit-credit-card',
+      paymentType: 'debit-credit-card',
+      name: 'Debit or Credit',
+      score: 100,
+      icons: [{ type: 'materialIcons', name: 'card' }],
+      logo: {
+        light: [
+          'assets/Visa-regular@3x.png',
+          'assets/Mastercard-regular@3x.png',
+        ],
+        dark: ['assets/Visa@3x.png', 'assets/Mastercard@3x.png'],
+      },
+      disclaimer:
+        "Credit card purchases may incur your bank's cash advance fees, subject to your bank's policies.",
+      delay: [5, 10],
+      pendingOrderDescription:
+        'Card purchases may take a few minutes to complete.',
+      amountTier: [1, 3],
+      isManualBankTransfer: true,
+      sellEnabled: true,
+      sell: { enabled: true },
+      recurringBuy: { enabled: true },
+      buy: { enabled: true },
+    },
+  ],
+  sorted: [
+    {
+      sortBy: '1',
+      ids: ['/payments/debit-credit-card'],
+    },
+  ],
+};
diff --git a/tests/api-mocking/mock-responses/ramps/transak/transak-quotes-response.ts b/tests/api-mocking/mock-responses/ramps/transak/transak-quotes-response.ts
new file mode 100644
index 000000000000..18a7375076e8
--- /dev/null
+++ b/tests/api-mocking/mock-responses/ramps/transak/transak-quotes-response.ts
@@ -0,0 +1,23 @@
+/**
+ * Mock response data for Transak lookup/quotes API.
+ * Endpoint: GET api-gateway-stg.transak.com/api/v2/lookup/quotes
+ * Used by transakGetBuyQuote() internal Transak quote.
+ */
+
+export const TRANSAK_QUOTE_RESPONSE = {
+  data: {
+    quoteId: 'mock-quote-id',
+    conversionPrice: 4072.34,
+    fiatCurrency: 'USD',
+    cryptoCurrency: 'ETH',
+    paymentMethod: 'credit_debit_card',
+    fiatAmount: 100,
+    cryptoAmount: 0.02455598,
+    isBuyOrSell: 'BUY',
+    network: 'ethereum',
+    totalFee: 23.33,
+    feeDecimal: 0.23,
+    feeBreakdown: [],
+    nonce: 1,
+  },
+};
diff --git a/tests/api-mocking/mock-responses/ramps/transak/transak-ramps-translate-response.ts b/tests/api-mocking/mock-responses/ramps/transak/transak-ramps-translate-response.ts
new file mode 100644
index 000000000000..66b43d20c9d7
--- /dev/null
+++ b/tests/api-mocking/mock-responses/ramps/transak/transak-ramps-translate-response.ts
@@ -0,0 +1,12 @@
+/**
+ * Mock response data for Ramps translate endpoint (Transak native flow).
+ * Endpoint: GET on-ramp.uat-api.cx.metamask.io/providers/transak-native-staging/native/translate
+ * Used by getBuyQuote, createOrder, getUserLimits. Response is NOT wrapped in { data: ... }.
+ */
+
+export const TRANSAK_RAMPS_TRANSLATE_RESPONSE = {
+  cryptoCurrency: 'ETH',
+  network: 'ethereum',
+  fiatCurrency: 'USD',
+  paymentMethod: 'credit_debit_card',
+};
diff --git a/tests/api-mocking/mock-responses/ramps/transak/transak-user-response.ts b/tests/api-mocking/mock-responses/ramps/transak/transak-user-response.ts
new file mode 100644
index 000000000000..8d3d87e299c8
--- /dev/null
+++ b/tests/api-mocking/mock-responses/ramps/transak/transak-user-response.ts
@@ -0,0 +1,41 @@
+/**
+ * Mock response data for Transak user/KYC/limits API endpoints.
+ * Endpoints: GET user/, GET kyc/requirement, GET orders/user-limit.
+ */
+
+import { ONRAMP_PERSONA } from '../onramp-persona-data';
+
+export const TRANSAK_USER_DETAILS_RESPONSE = {
+  data: {
+    id: 'mock-user-id',
+    firstName: ONRAMP_PERSONA.firstName,
+    lastName: ONRAMP_PERSONA.lastName,
+    email: ONRAMP_PERSONA.email,
+    mobileNumber: ONRAMP_PERSONA.mobileNumber,
+    status: 'active',
+    kyc: {
+      status: 'APPROVED',
+      type: 'SIMPLE',
+      highestApprovedKYCType: 'SIMPLE',
+    },
+    address: ONRAMP_PERSONA.address,
+    createdAt: new Date().toISOString(),
+  },
+};
+
+export const TRANSAK_KYC_REQUIREMENT_RESPONSE = {
+  data: {
+    status: 'APPROVED',
+    kycType: 'SIMPLE',
+    isAllowedToPlaceOrder: true,
+  },
+};
+
+export const TRANSAK_USER_LIMITS_RESPONSE = {
+  data: {
+    limits: { '1': 5000, '30': 25000, '365': 100000 },
+    spent: { '1': 0, '30': 0, '365': 0 },
+    remaining: { '1': 5000, '30': 25000, '365': 100000 },
+    exceeded: { '1': false, '30': false, '365': false },
+  },
+};
diff --git a/tests/api-mocking/mock-responses/trending-api-mocks.ts b/tests/api-mocking/mock-responses/trending-api-mocks.ts
index 7071d9b7320b..c94aaab88955 100644
--- a/tests/api-mocking/mock-responses/trending-api-mocks.ts
+++ b/tests/api-mocking/mock-responses/trending-api-mocks.ts
@@ -1,5 +1,14 @@
 import { MockEventsObject } from '../../framework';
 
+/**
+ * Minimal HTML returned for favicon fetch mocks.
+ * The favicon utility (app/util/favicon/index.ts) makes GET requests to
+ * site origins to extract <link rel="icon"> tags from the HTML source.
+ * These mocks prevent unmocked live requests during E2E tests.
+ */
+const FAVICON_HTML =
+  '<html><head><link rel="icon" href="/favicon.ico"></head><body></body></html>';
+
 const TRENDING_TOKENS_RESPONSE = [
   {
     assetId: 'eip155:1/erc20:0xa0b86991c6218b36c1d19d4a2e9eb0ce3606eb48',
@@ -35,8 +44,30 @@ const RWA_TOKENS_SEARCH_RESPONSE = {
   ],
 };
 
+/**
+ * Geolocation mock returning a non-restricted country (AR) so the RWA/Stocks
+ * section is visible in CI. useRwaTokens hides Stocks when isGeoRestricted
+ * (missing or ONDO_RESTRICTED_COUNTRIES). useDetectGeolocation can overwrite
+ * fixture state; mocking ensures the app always gets AR if it fetches geo.
+ */
+const TRENDING_GEOLOCATION_MOCKS_GET = [
+  {
+    urlEndpoint: 'https://on-ramp.dev-api.cx.metamask.io/geolocation',
+    responseCode: 200,
+    response: 'AR',
+    priority: 1001,
+  },
+  {
+    urlEndpoint: 'https://on-ramp.api.cx.metamask.io/geolocation',
+    responseCode: 200,
+    response: 'AR',
+    priority: 1001,
+  },
+];
+
 export const TRENDING_API_MOCKS: MockEventsObject = {
   GET: [
+    ...TRENDING_GEOLOCATION_MOCKS_GET,
     {
       urlEndpoint:
         /https:\/\/price\.api\.cx\.metamask\.io\/v3\/historical-prices.*/,
@@ -71,6 +102,27 @@ export const TRENDING_API_MOCKS: MockEventsObject = {
       },
       priority: 1000,
     },
+    // Favicon fetch mocks — the useFavicon hook fetches site HTML to extract
+    // <link rel="icon"> tags. Without these mocks the requests leak to live
+    // servers and cause "unmocked request" test failures.
+    {
+      urlEndpoint: 'https://portfolio.metamask.io/',
+      responseCode: 200,
+      response: FAVICON_HTML,
+      priority: 1000,
+    },
+    {
+      urlEndpoint: 'https://uniswap.org/',
+      responseCode: 200,
+      response: FAVICON_HTML,
+      priority: 1000,
+    },
+    {
+      urlEndpoint: 'https://app.uniswap.org/',
+      responseCode: 200,
+      response: FAVICON_HTML,
+      priority: 1000,
+    },
     {
       urlEndpoint: /https:\/\/gamma-api\.polymarket\.com\/events\/pagination.*/,
       responseCode: 200,
diff --git a/tests/component-view/mocks.ts b/tests/component-view/mocks.ts
index b929760b2fed..f6082428533d 100644
--- a/tests/component-view/mocks.ts
+++ b/tests/component-view/mocks.ts
@@ -98,6 +98,9 @@ jest.mock('../../app/core/Engine', () => {
           return undefined;
         },
       },
+      AuthenticationController: {
+        getBearerToken: jest.fn().mockResolvedValue('mock-bearer-token'),
+      },
       NetworkController: {
         state: { networksMetadata: {} },
         findNetworkClientIdByChainId() {
diff --git a/tests/docs/ONRAMP-PROVIDER-TESTING.md b/tests/docs/ONRAMP-PROVIDER-TESTING.md
new file mode 100644
index 000000000000..1f7dd04f0a76
--- /dev/null
+++ b/tests/docs/ONRAMP-PROVIDER-TESTING.md
@@ -0,0 +1,248 @@
+# On-Ramp Provider Manual Testing Guide
+
+This guide covers how to manually test the on-ramp providers (Transak and MoonPay) in the staging environment. It outlines the staging setup, how to locate and use provider-specific test data, the UX flow for each provider, and a general framework for testing other providers.
+
+---
+
+## Table of Contents
+
+- [Overview](#overview)
+- [Prerequisites](#prerequisites)
+- [Understanding Provider Types](#understanding-provider-types)
+- [How to Find Provider Test Data](#how-to-find-provider-test-data)
+- [UX Flow — Getting to Buy](#ux-flow--getting-to-buy)
+- [Testing Transak (Native Flow)](#testing-transak-native-flow)
+  - [Transak Test Data](#transak-test-data)
+  - [Transak UX Walkthrough](#transak-ux-walkthrough)
+- [Testing MoonPay (Aggregator / WebView Flow)](#testing-moonpay-aggregator--webview-flow)
+  - [MoonPay Test Data](#moonpay-test-data)
+  - [MoonPay UX Walkthrough](#moonpay-ux-walkthrough)
+- [Testing Other Providers](#testing-other-providers)
+- [Troubleshooting](#troubleshooting)
+
+---
+
+## Overview
+
+The on-ramp flow in MetaMask Mobile allows you to buy crypto using fiat payment methods. There are two provider integration types:
+
+| Type           | Description                                                       | Providers |
+| -------------- | ----------------------------------------------------------------- | --------- |
+| **Native**     | In-app KYC/OTP flow — checkout is handled entirely inside the app | Transak   |
+| **Aggregator** | Opens the provider's widget in an in-app browser (WebView)        | MoonPay   |
+
+All manual staging tests should be run against a **non-production build** of the app. Non-production builds automatically target MetaMask's staging (UAT) Ramps backend, which connects to each provider's own staging environment.
+
+> **Important:** Do not use real payment credentials. All testing should use test card numbers and staging accounts provided by each provider.
+
+---
+
+## Prerequisites
+
+Before testing, confirm the following:
+
+- You are using a **non-production build** of the app (debug, QA, or RC build targeting staging)
+- The following **remote feature flags** are active on your build:
+
+  | Flag                | Purpose                                        |
+  | ------------------- | ---------------------------------------------- |
+  | `rampsUnifiedBuyV1` | Enables the Buy button entry point             |
+  | `rampsUnifiedBuyV2` | Enables the V2 provider/quote flow             |
+  | `depositConfig`     | Required for the Transak native (deposit) flow |
+
+  If the Buy button is missing, these flags are likely inactive on your build. Check with the team or enable them via a local override.
+
+- Your device's **region is supported**. The staging environment is confirmed to work for:
+  - United States (California)
+  - France
+  - Spain
+  - Saint Lucia
+
+---
+
+## Understanding Provider Types
+
+The flow you experience after selecting a quote depends on the provider type:
+
+- **Native** — Everything happens in-app. You complete KYC, OTP verification, and order submission entirely within MetaMask without opening a browser. _(Transak)_
+- **Aggregator** — The app opens the provider's checkout widget in an in-app browser (WebView). You complete the entire payment experience inside their widget. _(MoonPay)_
+
+This matters for testing because the steps, required test data, and observable behavior differ between the two.
+
+---
+
+## How to Find Provider Test Data
+
+Each provider maintains a separate staging or sandbox environment with test credentials. Below is a general guide for what you need and where to find it.
+
+### What "test data" means for on-ramp providers
+
+- **Staging account** — an account you register with the provider's developer portal, scoped to their sandbox environment
+- **Test card numbers** — Visa/Mastercard numbers that trigger success, decline, or 3DS challenge scenarios without a real charge
+- **Test identity data** — name, address, phone, and email you use for KYC screens (staging providers typically accept any valid-format data)
+- **OTP bypass** — some providers accept a static code (e.g., `000000`) in their sandbox instead of a real SMS/email OTP
+- **Provider API key** — required for some native flows; you can find this in the `depositConfig` feature flag or the provider's developer dashboard
+
+### Where to get it
+
+| Provider         | Where to look                                                                                                                                                                      |
+| ---------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| **Transak**      | [Transak Staging Documentation](https://docs.transak.com/docs/test-credentials) — refer to their documentation for staging test credentials.                                       |
+| **MoonPay**      | [MoonPay Staging Documentation](https://dev.moonpay.com/docs/faq-sandbox-testing) — refer to their test documentation for sandbox credentials.                                     |
+| **Any provider** | Check the provider's official developer documentation for a "sandbox," "test environment," or "testing" section. Most will list test Visa/Mastercard numbers for common scenarios. |
+
+> **Tip:** When testing a new provider for the first time, confirm whether they have a sandbox environment (isolated test data) vs. a staging environment (shared with QA). Some providers have both. Always use the most isolated environment available.
+
+---
+
+## UX Flow — Getting to Buy
+
+All on-ramp tests start from the same entry point regardless of provider:
+
+1. Open the app and log in
+2. From the **Wallet** screen, tap the **Buy** button in the action bar
+3. The **Fund** sheet appears — tap **Buy**
+4. The **Token Select** screen appears — select the token you want to buy (e.g., ETH)
+5. The app detects your region and fetches available quotes
+6. The **Build Quote** screen shows the available quote — review the amount, fee, and provider name
+   - From this screen you can change the **payment type** (e.g., debit/credit card, Apple Pay) and switch between available **providers**
+   - In staging, all valid providers will have **(Staging)** appended to their name (e.g., "Transak (Staging)", "Moonpay (Staging)"). Only select providers with this suffix — any provider without it is not in the staging environment
+7. Tap **Continue** to proceed to the provider-specific checkout
+
+---
+
+## Testing Transak (Native Flow)
+
+Transak's integration runs entirely in-app — it is a native experience. No WebViews open; instead you move through each step as a native screen inside MetaMask.
+
+### Transak Test Data
+
+You will need:
+
+- A **Transak staging account** registered at the Transak developer portal
+- The **email address** associated with that account (used for OTP)
+- A **test card number** from Transak's sandbox documentation
+- **Test identity data** for KYC fields (any valid-format name, address, and phone number)
+
+> Check Transak's sandbox docs for whether a static OTP bypass code is available. In their staging environment a fixed 6-digit code is sometimes accepted in place of a real email OTP.
+
+### Transak UX Walkthrough
+
+After tapping **Continue** on the Build Quote screen:
+
+1. **Verify Identity** — You are shown Transak's KYC requirement screen; tap **Continue**
+2. **Email entry** — enter your Transak staging account email; tap **Continue**
+3. **OTP entry** — Transak sends a code to your email; enter it (or use the staging bypass code if available)
+4. **Personal details** — if this is your first time, you are prompted for name, address, and phone; fill in valid test data
+5. **KYC confirmation** — your identity status is verified and the flow proceeds automatically if approved
+6. **Quote confirmation** — you see the final breakdown: crypto amount, fiat total, and fees
+7. **Order placement** — confirm the order; it is submitted to Transak's staging environment
+8. **Order details screen** — you see a summary with token amount, total fiat, and fees
+9. **Activity tab** — your order appears under **Transfers** and transitions from **Pending** → **Completed**
+
+**What to verify:**
+
+- [ ] OTP screen appears and accepts the staging code
+- [ ] KYC screen shows the correct status after identity check
+- [ ] Order details screen shows the correct token, amount, and provider name ("Transak (Staging)")
+- [ ] Order appears in the Activity tab
+- [ ] Order status reaches **Completed**
+
+---
+
+## Testing MoonPay (Aggregator / WebView Flow)
+
+MoonPay's integration opens their checkout widget in an in-app browser. You enter the flow from MetaMask and return to it automatically on completion — everything in between happens inside MoonPay's widget.
+
+### MoonPay Test Data
+
+You will need:
+
+- A **test card number** from MoonPay's sandbox documentation
+- A **test email** for MoonPay account creation inside the widget (if prompted)
+- Any valid **identity data** if MoonPay's KYC flow is triggered during checkout
+
+> MoonPay's sandbox typically provides Visa and Mastercard numbers for success, decline, and 3DS challenge scenarios. Check their developer docs for the current list.
+
+**Important timing note:** MoonPay's custom order ID expires after **60 seconds**. Once the widget opens, complete the checkout flow without a long pause — if you leave the widget idle too long, the order may fail with an expiration error.
+
+### MoonPay UX Walkthrough
+
+After tapping **Continue** on the Build Quote screen:
+
+1. **In-app browser opens** — MoonPay's checkout widget loads inside the app
+2. **Widget checkout** — inside the widget, you will:
+   - Enter your payment card details (use a MoonPay staging test card)
+   - Verify your email and create or log into a MoonPay account if prompted
+   - Complete any KYC or identity steps required by MoonPay
+   - Confirm the purchase
+3. **Callback handled** — on completion, MoonPay redirects you back to MetaMask automatically
+4. **Order details screen** — you see the order summary with token amount, fiat total, and provider name
+5. **Activity tab** — your order appears under **Transfers** and transitions from **Pending** → **Completed**
+
+**What to verify:**
+
+- [ ] In-app browser opens and MoonPay widget loads correctly
+- [ ] Test card is accepted and payment completes within the widget
+- [ ] You are returned to the Order Details screen automatically after widget completion (no manual navigation needed)
+- [ ] Order details show the correct token, amount, and provider name ("Moonpay (Staging)")
+- [ ] Order appears in the Activity tab
+- [ ] Order status reaches **Completed**
+
+---
+
+## Testing Other Providers
+
+The on-ramp system supports multiple providers. When testing a provider not covered in this guide, use the following steps:
+
+### 1. Confirm the provider is available in your region
+
+The providers shown depend on your detected region. If the expected provider does not appear on the quote screen, confirm your device region is one the provider supports. You can change your region in system settings and relaunch the app.
+
+### 2. Identify the flow type
+
+Look at which screen appears after you tap Continue:
+
+- **KYC / identity / OTP screens in-app** → native flow (follow the same pattern as Transak)
+- **In-app browser opens** → aggregator flow (follow the same pattern as MoonPay)
+
+### 3. Get staging credentials from the provider
+
+Follow the same approach described in [How to Find Provider Test Data](#how-to-find-provider-test-data):
+
+- Register for a sandbox account at the provider's developer portal
+- Collect test card numbers for success and failure scenarios
+- Gather test identity data if KYC is required
+- Confirm whether OTP has a bypass in their sandbox
+
+### 4. Run through the same verification checklist
+
+Regardless of provider, verify:
+
+- [ ] Provider name appears correctly on the Build Quote and Order Details screens
+- [ ] Checkout completes without errors using your test credentials
+- [ ] Order Details screen shows the correct token, amounts, and fees
+- [ ] Order appears in the Activity tab under **Transfers**
+- [ ] Order status reaches **Completed**
+
+---
+
+## Troubleshooting
+
+**Buy button is not visible**
+Confirm `rampsUnifiedBuyV1` and `rampsUnifiedBuyV2` feature flags are active on your build. These are required for the Buy entry point to appear.
+
+**No providers or quotes returned**
+Your detected region may not be supported. Verify your device's region is set to a supported country (US, France, Spain, or Saint Lucia) and relaunch the app.
+
+**Transak KYC flow fails or loops**
+Verify you are using a registered Transak staging account email. If the OTP is not arriving, check whether Transak's sandbox has a bypass code in their documentation.
+
+**MoonPay widget fails to load or returns an error**
+The order ID has a 60-second expiration. If you delayed starting the widget after the quote was fetched, go back and start the flow again. Also confirm MoonPay's sandbox environment is accessible from your network.
+
+**Order stuck in Pending and never reaches Completed**
+This typically means the provider's staging environment has not confirmed the order. Wait a few minutes and pull to refresh in the Activity tab. If it does not resolve, check whether the staging provider processed the transaction on their side.
+
+**Wrong provider shown or preferred provider not auto-selected**
+Provider selection is based on your most recent order history. To test a specific provider, clear your order history from app state or use a fresh wallet fixture.
diff --git a/tests/framework/UNIFIED_E2E_ARCHIITECTURE.md b/tests/docs/UNIFIED_E2E_ARCHITECTURE.md
similarity index 100%
rename from tests/framework/UNIFIED_E2E_ARCHIITECTURE.md
rename to tests/docs/UNIFIED_E2E_ARCHITECTURE.md
diff --git a/tests/docs/UNIFIED_GESTURES_MIGRATION.md b/tests/docs/UNIFIED_GESTURES_MIGRATION.md
new file mode 100644
index 000000000000..449b60c9aefe
--- /dev/null
+++ b/tests/docs/UNIFIED_GESTURES_MIGRATION.md
@@ -0,0 +1,221 @@
+# Unified Gestures Migration Guide
+
+## Overview
+
+`UnifiedGestures` is a static facade that lets page objects execute gestures without knowing whether Detox or Appium/WebdriverIO is running. It uses the **Strategy pattern**: a single `GestureStrategy` interface with two implementations (`DetoxGestureStrategy` and `AppiumGestureStrategy`), selected once at startup.
+
+```
+Page Objects  →  UnifiedGestures (static)  →  GestureStrategy (interface)
+                                                  ├── DetoxGestureStrategy   → Gestures (existing)
+                                                  └── AppiumGestureStrategy  → PlaywrightElement / PlaywrightGestures
+```
+
+This is the **action** counterpart to `encapsulated()` (which handles element locators). Together they let you write fully framework-agnostic page objects.
+
+## Available Methods
+
+| Method                                       | Description                                                                    |
+| -------------------------------------------- | ------------------------------------------------------------------------------ |
+| `tap(elem, opts?)`                           | Tap an element                                                                 |
+| `waitAndTap(elem, opts?)`                    | Wait for visibility then tap                                                   |
+| `typeText(elem, text, opts?)`                | Clear field and type text                                                      |
+| `replaceText(elem, text, opts?)`             | Replace existing text                                                          |
+| `swipe(elem, direction, opts?)`              | Swipe in a direction                                                           |
+| `scrollToElement(target, scrollView, opts?)` | Scroll until target is visible                                                 |
+| `longPress(elem, opts?)`                     | Long press an element                                                          |
+| `dblTap(elem, opts?)`                        | Double tap an element                                                          |
+| `tapAtPoint(elem, point, opts?)`             | Tap at specific {x, y} coordinates on an element                               |
+| `tapAtIndex(elem, index, opts?)`             | Tap the nth matching element (accepts single element or `PlaywrightElement[]`) |
+
+All methods accept optional `UnifiedGestureOptions`:
+
+```typescript
+interface UnifiedGestureOptions {
+  timeout?: number; // Max wait time in ms
+  description?: string; // For logging / error messages
+}
+```
+
+## Migration Steps
+
+### 1. Update element getters to use `encapsulated()`
+
+If your page object still uses Detox-only matchers, convert them first:
+
+```typescript
+// Before
+get passwordInput(): DetoxElement {
+  return Matchers.getElementByID(LoginViewSelectors.PASSWORD_INPUT);
+}
+
+// After
+get passwordInput(): EncapsulatedElementType {
+  return encapsulated({
+    detox: () => Matchers.getElementByID(LoginViewSelectors.PASSWORD_INPUT),
+    appium: () => PlaywrightMatchers.getElementById(LoginViewSelectors.PASSWORD_INPUT),
+  });
+}
+```
+
+### 2. Replace `Gestures.*` calls with `UnifiedGestures.*`
+
+```typescript
+// Before
+import { Gestures } from '../../framework';
+
+async enterPassword(password: string) {
+  await Gestures.typeText(this.passwordInput, password, {
+    hideKeyboard: true,
+    elemDescription: 'password field',
+  });
+}
+
+// After
+import { UnifiedGestures } from '../../framework';
+
+async enterPassword(password: string) {
+  await UnifiedGestures.typeText(this.passwordInput, password, {
+    description: 'password field',
+  });
+}
+```
+
+Framework-specific options like `hideKeyboard`, `checkStability`, and `clearFirst` are handled internally by each strategy with sensible defaults:
+
+- **Detox**: `hideKeyboard: true`, `clearFirst: true`, retry + stability checks
+- **Appium**: Direct `PlaywrightElement` / `PlaywrightGestures` calls (e.g. `fill()`, `click()`)
+
+### 3. Handle edge cases with `encapsulatedAction()`
+
+For the rare ~3% of methods where Detox and Appium need structurally different flows:
+
+```typescript
+import { encapsulatedAction } from '../../framework';
+
+async dismissOnboarding() {
+  await encapsulatedAction({
+    detox: async () => {
+      await Gestures.swipe(this.overlay, 'up');
+      await Gestures.tap(this.dismissButton);
+    },
+    appium: async () => {
+      const btn = await asPlaywrightElement(this.dismissButton);
+      await btn.click();
+    },
+  });
+}
+```
+
+Both `detox` and `appium` branches are **optional** — you can provide only one when the method only exists for a single framework. This is useful during incremental migration when porting a method that has no equivalent on the other side:
+
+```typescript
+// Only the appium branch is needed — Detox doesn't have this flow
+async waitForScreenToDisplay() {
+  await encapsulatedAction({
+    appium: async () => {
+      const element = await asPlaywrightElement(this.title);
+      await element.waitForDisplayed({ timeout: 15000 });
+    },
+  });
+}
+```
+
+If the active framework doesn't have a matching branch, `encapsulatedAction` throws an error to catch misconfiguration early.
+
+## Escape Hatch
+
+When the unified approach becomes overly complex for a specific case, you can always use `FrameworkDetector` or `PlatformDetector` directly for custom conditional logic:
+
+```typescript
+import { FrameworkDetector } from '../../framework';
+
+async complexSpecialCase() {
+  if (FrameworkDetector.isDetox()) {
+    // Detox-specific multi-step flow
+  } else {
+    // Appium-specific multi-step flow
+  }
+}
+```
+
+This should be the last resort. Prefer `UnifiedGestures` > `encapsulatedAction()` > direct `FrameworkDetector` checks, in that order.
+
+## Full Before/After Example
+
+### Before (Detox-only)
+
+```typescript
+import { Gestures, Matchers } from '../../framework';
+import { LoginViewSelectors } from '../../selectors/LoginView.selectors';
+
+class LoginView {
+  get passwordInput(): DetoxElement {
+    return Matchers.getElementByID(LoginViewSelectors.PASSWORD_INPUT);
+  }
+
+  get loginButton(): DetoxElement {
+    return Matchers.getElementByID(LoginViewSelectors.LOGIN_BUTTON);
+  }
+
+  async login(password: string) {
+    await Gestures.typeText(this.passwordInput, password, {
+      hideKeyboard: true,
+      elemDescription: 'password input',
+    });
+    await Gestures.waitAndTap(this.loginButton, {
+      elemDescription: 'login button',
+    });
+  }
+}
+```
+
+### After (Unified)
+
+```typescript
+import { UnifiedGestures } from '../../framework';
+import {
+  encapsulated,
+  EncapsulatedElementType,
+  Matchers,
+  PlaywrightMatchers,
+} from '../../framework';
+import { LoginViewSelectors } from '../../selectors/LoginView.selectors';
+
+class LoginView {
+  get passwordInput(): EncapsulatedElementType {
+    return encapsulated({
+      detox: () => Matchers.getElementByID(LoginViewSelectors.PASSWORD_INPUT),
+      appium: () =>
+        PlaywrightMatchers.getElementById(LoginViewSelectors.PASSWORD_INPUT),
+    });
+  }
+
+  get loginButton(): EncapsulatedElementType {
+    return encapsulated({
+      detox: () => Matchers.getElementByID(LoginViewSelectors.LOGIN_BUTTON),
+      appium: () =>
+        PlaywrightMatchers.getElementById(LoginViewSelectors.LOGIN_BUTTON),
+    });
+  }
+
+  async login(password: string) {
+    await UnifiedGestures.typeText(this.passwordInput, password, {
+      description: 'password input',
+    });
+    await UnifiedGestures.waitAndTap(this.loginButton, {
+      description: 'login button',
+    });
+  }
+}
+```
+
+## FAQ
+
+**Q: Does this change existing Detox test behavior?**
+No. `DetoxGestureStrategy` wraps the existing `Gestures` class — all retry logic, stability checks, and platform-specific scroll behavior are preserved.
+
+**Q: What if I need a Detox-specific option like `checkStability`?**
+Use `encapsulatedAction()` and call `Gestures` directly in the Detox branch.
+
+**Q: Can I still use `Gestures` directly?**
+Yes. The `Gestures` class is not removed or modified. For Detox-only page objects that haven't been migrated, `Gestures` works exactly as before.
diff --git a/tests/flows/accounts.flow.ts b/tests/flows/accounts.flow.ts
index 909dceb6db95..204542f34c36 100644
--- a/tests/flows/accounts.flow.ts
+++ b/tests/flows/accounts.flow.ts
@@ -6,7 +6,6 @@ import Assertions from '../framework/Assertions';
 import SRPListItemComponent from '../page-objects/wallet/MultiSrp/Common/SRPListItemComponent';
 import SrpQuizModal from '../page-objects/Settings/SecurityAndPrivacy/SrpQuizModal';
 import RevealSecretRecoveryPhrase from '../page-objects/Settings/SecurityAndPrivacy/RevealSecretRecoveryPhrase';
-import { RevealSeedViewSelectorsText } from '../../app/components/Views/RevealPrivateCredential/RevealSeedView.testIds';
 import TabBarComponent from '../page-objects/wallet/TabBarComponent';
 import SettingsView from '../page-objects/Settings/SettingsView';
 import SecurityAndPrivacyView from '../page-objects/Settings/SecurityAndPrivacy/SecurityAndPrivacyView';
@@ -32,17 +31,29 @@ export const completeSrpQuiz = async (expectedSrp: string) => {
   await SrpQuizModal.tapQuestionContinueButton(1);
   await SrpQuizModal.tapQuestionRightAnswerButton(2);
   await SrpQuizModal.tapQuestionContinueButton(2);
-  await RevealSecretRecoveryPhrase.enterPasswordToRevealSecretCredential(
-    PASSWORD,
-  );
+
+  // Check if already unlocked (biometrics) or need password entry
+  let isAlreadyUnlocked = await RevealSecretRecoveryPhrase.isUnlocked();
+
+  if (!isAlreadyUnlocked) {
+    await RevealSecretRecoveryPhrase.enterPasswordToRevealSecretCredential(
+      PASSWORD,
+    );
+    // Re-check: "Done" on keyboard triggers tryUnlock() so app may already be on "Tap to reveal"
+    isAlreadyUnlocked = await RevealSecretRecoveryPhrase.isUnlocked();
+    if (!isAlreadyUnlocked) {
+      await RevealSecretRecoveryPhrase.tapConfirmButton();
+    }
+  }
+
+  // Tap the blur overlay to reveal the SRP
   await RevealSecretRecoveryPhrase.tapToReveal();
   await Assertions.expectElementToBeVisible(
     RevealSecretRecoveryPhrase.container,
   );
-  await Assertions.expectTextDisplayed(
-    RevealSeedViewSelectorsText.REVEAL_CREDENTIAL_SRP_TITLE_TEXT,
-  );
-  await Assertions.expectTextDisplayed(expectedSrp);
+  // SRP is now displayed in grid format - verify first word is displayed
+  const srpWords = expectedSrp.split(' ');
+  await Assertions.expectTextDisplayed(srpWords[0]);
   await RevealSecretRecoveryPhrase.scrollToCopyToClipboardButton();
 
   await RevealSecretRecoveryPhrase.tapToRevealPrivateCredentialQRCode();
diff --git a/tests/framework/AppiumGestureStrategy.test.ts b/tests/framework/AppiumGestureStrategy.test.ts
new file mode 100644
index 000000000000..3939f6145cea
--- /dev/null
+++ b/tests/framework/AppiumGestureStrategy.test.ts
@@ -0,0 +1,88 @@
+jest.mock('./PlaywrightGestures.ts', () => ({
+  __esModule: true,
+  default: {
+    dblTap: jest.fn(),
+  },
+}));
+
+jest.mock('./EncapsulatedElement.ts', () => ({
+  asPlaywrightElement: jest.fn(),
+}));
+
+import PlaywrightGestures from './PlaywrightGestures.ts';
+import { asPlaywrightElement } from './EncapsulatedElement.ts';
+import { AppiumGestureStrategy } from './GestureStrategy.ts';
+import { PlaywrightElement } from './PlaywrightAdapter.ts';
+
+describe('AppiumGestureStrategy.dblTap', () => {
+  const strategy = new AppiumGestureStrategy();
+
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  it('delegates to PlaywrightGestures.dblTap with resolved element', async () => {
+    const elem = Promise.resolve({}) as never;
+    const playwrightElement = { unwrap: jest.fn() } as never;
+    (asPlaywrightElement as jest.Mock).mockResolvedValue(playwrightElement);
+
+    await strategy.dblTap(elem);
+
+    expect(asPlaywrightElement).toHaveBeenCalledWith(elem);
+    expect(PlaywrightGestures.dblTap).toHaveBeenCalledWith(playwrightElement);
+  });
+});
+
+describe('AppiumGestureStrategy.tapAtIndex', () => {
+  const strategy = new AppiumGestureStrategy();
+
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  const createPlaywrightElement = (): PlaywrightElement =>
+    ({
+      click: jest.fn(),
+      unwrap: jest.fn(),
+    }) as unknown as PlaywrightElement;
+
+  it('clicks indexed element when PlaywrightElement array is provided', async () => {
+    const first = createPlaywrightElement();
+    const second = createPlaywrightElement();
+    const third = createPlaywrightElement();
+
+    await strategy.tapAtIndex([first, second, third], 2);
+
+    expect(third.click).toHaveBeenCalledTimes(1);
+    expect(second.click).not.toHaveBeenCalled();
+    expect(first.click).not.toHaveBeenCalled();
+    expect(asPlaywrightElement).not.toHaveBeenCalled();
+  });
+
+  it('throws when array index is out of bounds', async () => {
+    const only = createPlaywrightElement();
+
+    await expect(strategy.tapAtIndex([only], 2)).rejects.toThrow(
+      'tapAtIndex: index 2 is out of bounds (1 elements)',
+    );
+  });
+
+  it('throws for single element when index is greater than zero', async () => {
+    const elem = Promise.resolve({}) as never;
+
+    await expect(strategy.tapAtIndex(elem, 2)).rejects.toThrow(
+      'tapAtIndex: Appium requires a PlaywrightElement[] array for index > 0.',
+    );
+  });
+
+  it('uses single element pass-through when index is zero', async () => {
+    const elem = Promise.resolve({}) as never;
+    const playwrightElement = createPlaywrightElement();
+    (asPlaywrightElement as jest.Mock).mockResolvedValue(playwrightElement);
+
+    await strategy.tapAtIndex(elem, 0);
+
+    expect(asPlaywrightElement).toHaveBeenCalledWith(elem);
+    expect(playwrightElement.click).toHaveBeenCalledTimes(1);
+  });
+});
diff --git a/tests/framework/Assertions.ts b/tests/framework/Assertions.ts
index 71cdd804330a..064d01b2ebce 100644
--- a/tests/framework/Assertions.ts
+++ b/tests/framework/Assertions.ts
@@ -382,6 +382,26 @@ export default class Assertions {
     }
   }
 
+  /**
+   * Checks if the array has a minimum length
+   * @param array - The array to check
+   * @param minLength - The minimum length of the array
+   * @returns void
+   */
+  static async checkIfArrayHasMinLength(
+    array: unknown[],
+    minLength: number,
+  ): Promise<void> {
+    if (!Array.isArray(array)) {
+      throw new Error('The provided value is not an array');
+    }
+    if (array.length < minLength) {
+      throw new Error(
+        `Array length assertion failed.\nExpected at least: ${minLength}\nActual length: ${array.length}`,
+      );
+    }
+  }
+
   static async checkIfValueIsDefined(value: unknown): Promise<void> {
     // 0 evaluates to false, so we need to handle it separately
     if (typeof value === 'number') {
diff --git a/tests/framework/Constants.ts b/tests/framework/Constants.ts
index dec259db70ad..b4a09238b19e 100644
--- a/tests/framework/Constants.ts
+++ b/tests/framework/Constants.ts
@@ -33,6 +33,9 @@ export const APP_PACKAGE_IDS = {
   ANDROID: 'io.metamask',
 } as const;
 
+// Package ID for the React Native playground APK (pre-installed on the device)
+export const PLAYGROUND_PACKAGE_ID = 'com.anonymous.multichainrnplayground';
+
 export const DEFAULT_TEST_DAPP_PATH = path.join(
   '..',
   '..',
diff --git a/tests/framework/GestureStrategy.test.ts b/tests/framework/GestureStrategy.test.ts
new file mode 100644
index 000000000000..4d488a61b388
--- /dev/null
+++ b/tests/framework/GestureStrategy.test.ts
@@ -0,0 +1,63 @@
+jest.mock('./Gestures.ts', () => ({
+  __esModule: true,
+  default: {
+    scrollToElement: jest.fn(),
+  },
+}));
+
+import Gestures from './Gestures.ts';
+import { DetoxGestureStrategy } from './GestureStrategy.ts';
+
+describe('DetoxGestureStrategy.scrollToElement', () => {
+  const strategy = new DetoxGestureStrategy();
+
+  const createDetoxElement = (): DetoxElement =>
+    ({ tap: jest.fn() }) as unknown as DetoxElement;
+
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  it('forwards matcher scrollView to Gestures.scrollToElement', async () => {
+    const target = createDetoxElement();
+    const matcher = {
+      type: 'id',
+      value: 'scroll-view',
+    } as unknown as Detox.NativeMatcher;
+    const scrollView = Promise.resolve(matcher);
+
+    await strategy.scrollToElement(target, scrollView, {
+      timeout: 1000,
+      description: 'scroll to token',
+    });
+
+    expect(Gestures.scrollToElement).toHaveBeenCalledTimes(1);
+
+    const [forwardedTarget, forwardedScrollView, forwardedOpts] = (
+      Gestures.scrollToElement as jest.Mock
+    ).mock.calls[0];
+
+    expect(forwardedTarget).toBe(target);
+    await expect(forwardedScrollView).resolves.toBe(matcher);
+    expect(forwardedOpts).toEqual(
+      expect.objectContaining({
+        timeout: 1000,
+        elemDescription: 'scroll to token',
+      }),
+    );
+  });
+
+  it('rejects DetoxElement passed as scrollView', async () => {
+    const target = createDetoxElement();
+    const invalidScrollView = createDetoxElement();
+
+    await expect(
+      strategy.scrollToElement(
+        target,
+        invalidScrollView as unknown as Promise<Detox.NativeMatcher>,
+      ),
+    ).rejects.toThrow(
+      'DetoxGestureStrategy.scrollToElement requires a Detox NativeMatcher',
+    );
+  });
+});
diff --git a/tests/framework/GestureStrategy.ts b/tests/framework/GestureStrategy.ts
new file mode 100644
index 000000000000..3e4c5c78c505
--- /dev/null
+++ b/tests/framework/GestureStrategy.ts
@@ -0,0 +1,442 @@
+import Gestures from './Gestures.ts';
+import PlaywrightGestures from './PlaywrightGestures.ts';
+import { PlaywrightElement } from './PlaywrightAdapter.ts';
+import {
+  EncapsulatedElementType,
+  asDetoxElement,
+  asPlaywrightElement,
+} from './EncapsulatedElement.ts';
+
+/**
+ * Unified options for gesture methods.
+ * Framework-specific options (e.g. Detox's checkStability, hideKeyboard) are
+ * handled internally by each strategy — page objects only deal with these
+ * universal options.
+ */
+export interface UnifiedGestureOptions {
+  /** Maximum time (ms) to wait for the element before timing out */
+  timeout?: number;
+  /** Human-readable description for logging and error messages */
+  description?: string;
+}
+
+/**
+ * Element input for tapAtIndex — either a single element (Detox uses .atIndex())
+ * or an array of elements (Appium selects by array index).
+ */
+export type TapAtIndexElement = EncapsulatedElementType | PlaywrightElement[];
+export type ScrollViewMatcher = Promise<Detox.NativeMatcher>;
+
+/**
+ * Strategy interface for framework-agnostic gesture execution.
+ *
+ * Each method accepts an `EncapsulatedElementType` (either DetoxElement or
+ * Promise<PlaywrightElement>) so page objects never need to know which
+ * framework is running.
+ */
+export interface GestureStrategy {
+  tap(
+    elem: EncapsulatedElementType,
+    opts?: UnifiedGestureOptions,
+  ): Promise<void>;
+
+  waitAndTap(
+    elem: EncapsulatedElementType,
+    opts?: UnifiedGestureOptions,
+  ): Promise<void>;
+
+  typeText(
+    elem: EncapsulatedElementType,
+    text: string,
+    opts?: UnifiedGestureOptions,
+  ): Promise<void>;
+
+  replaceText(
+    elem: EncapsulatedElementType,
+    text: string,
+    opts?: UnifiedGestureOptions,
+  ): Promise<void>;
+
+  swipe(
+    elem: EncapsulatedElementType,
+    direction: 'up' | 'down' | 'left' | 'right',
+    opts?: UnifiedGestureOptions,
+  ): Promise<void>;
+
+  scrollToElement(
+    target: EncapsulatedElementType,
+    scrollView: ScrollViewMatcher,
+    opts?: UnifiedGestureOptions,
+  ): Promise<void>;
+
+  longPress(
+    elem: EncapsulatedElementType,
+    opts?: UnifiedGestureOptions,
+  ): Promise<void>;
+
+  dblTap(
+    elem: EncapsulatedElementType,
+    opts?: UnifiedGestureOptions,
+  ): Promise<void>;
+
+  tapAtPoint(
+    elem: EncapsulatedElementType,
+    point: { x: number; y: number },
+    opts?: UnifiedGestureOptions,
+  ): Promise<void>;
+
+  tapAtIndex(
+    elem: TapAtIndexElement,
+    index: number,
+    opts?: UnifiedGestureOptions,
+  ): Promise<void>;
+}
+
+/**
+ * Detox implementation of GestureStrategy.
+ *
+ * Wraps the existing `Gestures` class, preserving all retry logic, stability
+ * checks, and platform-specific scroll behaviour. `UnifiedGestureOptions` are
+ * mapped to Detox-specific option shapes internally.
+ */
+export class DetoxGestureStrategy implements GestureStrategy {
+  /**
+   * Tap an element
+   * @param elem - The element to tap
+   * @param opts - The options for the tap
+   * @returns A promise that resolves when the tap is complete
+   */
+  async tap(
+    elem: EncapsulatedElementType,
+    opts?: UnifiedGestureOptions,
+  ): Promise<void> {
+    await Gestures.tap(asDetoxElement(elem), {
+      timeout: opts?.timeout,
+      elemDescription: opts?.description,
+    });
+  }
+
+  /**
+   * Wait for an element to be visible and then tap it
+   * @param elem - The element to wait and tap
+   * @param opts - The options for the wait and tap
+   * @returns A promise that resolves when the wait and tap is complete
+   */
+  async waitAndTap(
+    elem: EncapsulatedElementType,
+    opts?: UnifiedGestureOptions,
+  ): Promise<void> {
+    await Gestures.waitAndTap(asDetoxElement(elem), {
+      timeout: opts?.timeout,
+      elemDescription: opts?.description,
+    });
+  }
+
+  /**
+   * Type text into an element
+   * @param elem - The element to type text into
+   * @param text - The text to type
+   * @param opts - The options for the type text
+   * @returns A promise that resolves when the type text is complete
+   */
+  async typeText(
+    elem: EncapsulatedElementType,
+    text: string,
+    opts?: UnifiedGestureOptions,
+  ): Promise<void> {
+    await Gestures.typeText(asDetoxElement(elem), text, {
+      hideKeyboard: true,
+      timeout: opts?.timeout,
+      elemDescription: opts?.description,
+    });
+  }
+
+  /**
+   * Replace text in an element
+   * @param elem - The element to replace text in
+   * @param text - The text to replace
+   * @param opts - The options for the replace text
+   * @returns A promise that resolves when the replace text is complete
+   */
+  async replaceText(
+    elem: EncapsulatedElementType,
+    text: string,
+    opts?: UnifiedGestureOptions,
+  ): Promise<void> {
+    await Gestures.replaceText(asDetoxElement(elem), text, {
+      timeout: opts?.timeout,
+      elemDescription: opts?.description,
+    });
+  }
+
+  /**
+   * Swipe an element
+   * @param elem - The element to swipe
+   * @param direction - The direction to swipe
+   * @param opts - The options for the swipe
+   * @returns A promise that resolves when the swipe is complete
+   */
+  async swipe(
+    elem: EncapsulatedElementType,
+    direction: 'up' | 'down' | 'left' | 'right',
+    opts?: UnifiedGestureOptions,
+  ): Promise<void> {
+    await Gestures.swipe(asDetoxElement(elem), direction, {
+      timeout: opts?.timeout,
+      elemDescription: opts?.description,
+    });
+  }
+
+  /**
+   * Scroll to an element
+   * @param target - The element to scroll to
+   * @param scrollView - The scroll view to scroll to
+   * @param opts - The options for the scroll to element
+   * @returns A promise that resolves when the scroll to element is complete
+   */
+  async scrollToElement(
+    target: EncapsulatedElementType,
+    scrollView: ScrollViewMatcher,
+    opts?: UnifiedGestureOptions,
+  ): Promise<void> {
+    const resolvedScrollView = await scrollView;
+
+    if (this.isLikelyDetoxElement(resolvedScrollView)) {
+      throw new Error(
+        'DetoxGestureStrategy.scrollToElement requires a Detox NativeMatcher ' +
+          '(e.g. Matchers.getIdentifier(...) or by.id(...)), not a DetoxElement.',
+      );
+    }
+
+    await Gestures.scrollToElement(
+      asDetoxElement(target),
+      Promise.resolve(resolvedScrollView),
+      {
+        timeout: opts?.timeout,
+        elemDescription: opts?.description,
+      },
+    );
+  }
+
+  private isLikelyDetoxElement(value: unknown): value is DetoxElement {
+    return (
+      typeof value === 'object' &&
+      value !== null &&
+      'tap' in value &&
+      typeof (value as { tap?: unknown }).tap === 'function'
+    );
+  }
+
+  /**
+   * Long press an element
+   * @param elem - The element to long press
+   * @param opts - The options for the long press
+   * @returns A promise that resolves when the long press is complete
+   */
+  async longPress(
+    elem: EncapsulatedElementType,
+    opts?: UnifiedGestureOptions,
+  ): Promise<void> {
+    await Gestures.longPress(asDetoxElement(elem), {
+      timeout: opts?.timeout,
+      elemDescription: opts?.description,
+    });
+  }
+
+  /**
+   * Double tap an element
+   * @param elem - The element to double tap
+   * @param opts - The options for the double tap
+   * @returns A promise that resolves when the double tap is complete
+   */
+  async dblTap(
+    elem: EncapsulatedElementType,
+    opts?: UnifiedGestureOptions,
+  ): Promise<void> {
+    await Gestures.dblTap(asDetoxElement(elem), {
+      timeout: opts?.timeout,
+      elemDescription: opts?.description,
+    });
+  }
+
+  /**
+   * Tap at a point on an element
+   * @param elem - The element to tap at a point on
+   * @param point - The point to tap at
+   * @param opts - The options for the tap at point
+   * @returns A promise that resolves when the tap at point is complete
+   */
+  async tapAtPoint(
+    elem: EncapsulatedElementType,
+    point: { x: number; y: number },
+    opts?: UnifiedGestureOptions,
+  ): Promise<void> {
+    await Gestures.tapAtPoint(asDetoxElement(elem), point, {
+      timeout: opts?.timeout,
+      elemDescription: opts?.description,
+    });
+  }
+
+  /**
+   * Tap at an index on an element
+   * @param elem - The element to tap at an index on
+   * @param index - The index to tap at
+   * @param opts - The options for the tap at index
+   * @returns A promise that resolves when the tap at index is complete
+   */
+  async tapAtIndex(
+    elem: EncapsulatedElementType,
+    index: number,
+    opts?: UnifiedGestureOptions,
+  ): Promise<void> {
+    await Gestures.tapAtIndex(asDetoxElement(elem), index, {
+      timeout: opts?.timeout,
+      elemDescription: opts?.description,
+    });
+  }
+}
+
+/**
+ * Appium/WebdriverIO implementation of GestureStrategy.
+ *
+ * Wraps `PlaywrightElement` and `PlaywrightGestures`.
+ */
+export class AppiumGestureStrategy implements GestureStrategy {
+  /**
+   * Tap an element
+   * @param elem - The element to tap
+   * @returns A promise that resolves when the tap is complete
+   */
+  async tap(elem: EncapsulatedElementType): Promise<void> {
+    const el = await asPlaywrightElement(elem);
+    await el.click();
+  }
+
+  /**
+   * Wait for an element to be visible and then tap it
+   * @param elem - The element to wait and tap
+   * @returns A promise that resolves when the wait and tap is complete
+   */
+  async waitAndTap(elem: EncapsulatedElementType): Promise<void> {
+    const el = await asPlaywrightElement(elem);
+    await el.click();
+  }
+
+  /**
+   * Type text into an element
+   * @param elem - The element to type text into
+   * @param text - The text to type
+   * @returns A promise that resolves when the type text is complete
+   */
+  async typeText(elem: EncapsulatedElementType, text: string): Promise<void> {
+    const el = await asPlaywrightElement(elem);
+    await el.fill(text);
+  }
+
+  /**
+   * Replace text in an element
+   * @param elem - The element to replace text in
+   * @param text - The text to replace
+   * @returns A promise that resolves when the replace text is complete
+   */
+  async replaceText(
+    elem: EncapsulatedElementType,
+    text: string,
+  ): Promise<void> {
+    const el = await asPlaywrightElement(elem);
+    await el.clear();
+    await el.fill(text);
+  }
+
+  /**
+   * Swipe an element
+   * @param elem - The element to swipe
+   * @param direction - The direction to swipe
+   * @returns A promise that resolves when the swipe is complete
+   */
+  async swipe(
+    elem: EncapsulatedElementType,
+    direction: 'up' | 'down' | 'left' | 'right',
+  ): Promise<void> {
+    const el = await asPlaywrightElement(elem);
+    await PlaywrightGestures.swipe(el, direction);
+  }
+
+  /**
+   * Scroll to an element
+   * @param target - The element to scroll to
+   * @param scrollView - The scroll view to scroll to
+   * @returns A promise that resolves when the scroll to element is complete
+   */
+  async scrollToElement(
+    target: EncapsulatedElementType,
+    _scrollView: ScrollViewMatcher,
+  ): Promise<void> {
+    const el = await asPlaywrightElement(target);
+    await PlaywrightGestures.scrollIntoView(el);
+  }
+
+  /**
+   * Long press an element
+   * @param elem - The element to long press
+   * @returns A promise that resolves when the long press is complete
+   */
+  async longPress(elem: EncapsulatedElementType): Promise<void> {
+    const el = await asPlaywrightElement(elem);
+    await PlaywrightGestures.longPress(el);
+  }
+
+  /**
+   * Double tap an element
+   * @param elem - The element to double tap
+   * @returns A promise that resolves when the double tap is complete
+   */
+  async dblTap(elem: EncapsulatedElementType): Promise<void> {
+    const el = await asPlaywrightElement(elem);
+    await PlaywrightGestures.dblTap(el);
+  }
+
+  /**
+   * Tap at a point on an element
+   * @param elem - The element to tap at a point on
+   * @param point - The point to tap at
+   * @returns A promise that resolves when the tap at point is complete
+   */
+  async tapAtPoint(
+    elem: EncapsulatedElementType,
+    point: { x: number; y: number },
+  ): Promise<void> {
+    const el = await asPlaywrightElement(elem);
+    await el.tapOnCoordinates(point);
+  }
+
+  /**
+   * Tap at an index on an element
+   * @param elem - The element to tap at an index on
+   * @param index - The index to tap at
+   * @returns A promise that resolves when the tap at index is complete
+   */
+  async tapAtIndex(elem: TapAtIndexElement, index: number): Promise<void> {
+    // If an array of PlaywrightElements is provided, tap the one at `index`
+    if (Array.isArray(elem)) {
+      const elements = elem as PlaywrightElement[];
+      if (index < 0 || index >= elements.length) {
+        throw new Error(
+          `tapAtIndex: index ${index} is out of bounds (${elements.length} elements)`,
+        );
+      }
+      await elements[index].click();
+      return;
+    }
+
+    // Single element: allow index 0 as a pass-through, reject anything else
+    if (index !== 0) {
+      throw new Error(
+        `tapAtIndex: Appium requires a PlaywrightElement[] array for index > 0. ` +
+          `Received single element with index ${index}.`,
+      );
+    }
+    const el = await asPlaywrightElement(elem);
+    await el.click();
+  }
+}
diff --git a/tests/framework/PlaywrightGestures.ts b/tests/framework/PlaywrightGestures.ts
index 441d8ee3c5d2..6c4596e4a514 100644
--- a/tests/framework/PlaywrightGestures.ts
+++ b/tests/framework/PlaywrightGestures.ts
@@ -1,5 +1,6 @@
-import { PlaywrightElement } from './PlaywrightAdapter.ts';
-import { boxedStep } from './Utilities.ts';
+import { PlatformDetector } from './PlatformLocator';
+import { PlaywrightElement } from './PlaywrightAdapter';
+import { boxedStep, getDriver } from './Utilities';
 
 /**
  * PlaywrightGestures - Gesture helpers for WebdriverIO/Playwright
@@ -82,6 +83,31 @@ export default class PlaywrightGestures {
       ]);
   }
 
+  /**
+   * Double tap an element using native touch actions.
+   *
+   * Using explicit touchAction avoids relying on desktop-oriented click
+   * semantics and keeps both taps within a mobile-appropriate interval.
+   */
+  @boxedStep
+  static async dblTap(elem: PlaywrightElement, intervalMs = 60): Promise<void> {
+    const location = await elem.unwrap().getLocation();
+    const size = await elem.unwrap().getSize();
+
+    const x = location.x + size.width / 2;
+    const y = location.y + size.height / 2;
+
+    await elem
+      .unwrap()
+      .touchAction([
+        { action: 'press', x, y },
+        'release',
+        { action: 'wait', ms: intervalMs },
+        { action: 'press', x, y },
+        'release',
+      ]);
+  }
+
   /**
    * Scroll element into view
    */
@@ -89,4 +115,25 @@ export default class PlaywrightGestures {
   static async scrollIntoView(elem: PlaywrightElement): Promise<void> {
     await elem.unwrap().scrollIntoView();
   }
+
+  /**
+   * Terminate the app
+   * @param packageName - The package name of the app to terminate (Android only)
+   * @param appId - The app id of the app to terminate (iOS only)
+   */
+  @boxedStep
+  static async terminateApp(
+    packageName?: string,
+    appId?: string,
+  ): Promise<void> {
+    const driver = getDriver();
+    if (!driver) throw new Error('Driver is not available');
+    if ((await PlatformDetector.isAndroid()) && packageName) {
+      await driver.terminateApp(packageName);
+    } else if ((await PlatformDetector.isIOS()) && appId) {
+      await driver.terminateApp(appId);
+    } else {
+      throw new Error('Package name or app id is not available');
+    }
+  }
 }
diff --git a/tests/framework/PlaywrightMatchers.ts b/tests/framework/PlaywrightMatchers.ts
index 0e045d0f957b..e6baa16e1b94 100644
--- a/tests/framework/PlaywrightMatchers.ts
+++ b/tests/framework/PlaywrightMatchers.ts
@@ -1,4 +1,6 @@
-import { PlaywrightElement, wrapElement } from './PlaywrightAdapter.ts';
+import { PlatformDetector } from './PlatformLocator';
+import { PlaywrightElement, wrapElement } from './PlaywrightAdapter';
+import { MatcherOptions } from './types.ts';
 import { getDriver } from './Utilities.ts';
 import { ChainablePromiseElement } from 'webdriverio';
 
@@ -28,7 +30,7 @@ export default class PlaywrightMatchers {
    * @param elementId - The accessibility ID or content-desc/resource-id of the element
    * @returns The wrapped element
    */
-  static async getByAccessibilityId(
+  static async getElementByAccessibilityId(
     elementId: string,
   ): Promise<PlaywrightElement> {
     const drv = getDriver();
@@ -39,13 +41,35 @@ export default class PlaywrightMatchers {
 
   /**
    * Get element by ID (Android resource-id or iOS accessibility identifier)
+   *
    * @param elementId - The ID of the element
+   * @param MatcherOptions - The options for the matcher
+   * @param MatcherOptions.exact - Whether to match the exact ID or not
    * @returns The wrapped element
    */
-  static async getById(elementId: string): Promise<PlaywrightElement> {
+  static async getElementById(
+    elementId: string,
+    options: MatcherOptions = {},
+  ): Promise<PlaywrightElement> {
+    const { exact = false } = options;
+
+    let locator: string;
+    const isAndroid = await PlatformDetector.isAndroid();
+    if (isAndroid) {
+      locator = 'android=new UiSelector()';
+      locator = exact
+        ? `${locator}.resourceId('${elementId}')`
+        : `${locator}.resourceIdMatches('.*${elementId}.*')`;
+    } else {
+      locator = '-ios predicate string:';
+      locator = exact
+        ? `${locator}name == '${elementId}'`
+        : `${locator}name CONTAINS '${elementId}'`;
+    }
+
     const drv = getDriver();
     if (!drv) throw new Error('Driver is not available');
-    const element = await drv.$(elementId);
+    const element = await drv.$(locator);
     return wrapElement(element);
   }
 
@@ -54,19 +78,39 @@ export default class PlaywrightMatchers {
    * @param text - The text to search for
    * @returns The wrapped element
    */
-  static async getByText(text: string): Promise<PlaywrightElement> {
+  static async getElementByText(text: string): Promise<PlaywrightElement> {
     const drv = getDriver();
     if (!drv) throw new Error('Driver is not available');
     const element = await drv.$(`*.=${text}`);
     return wrapElement(element);
   }
 
+  /**
+   * Get element by catch-all selector that works on both platforms
+   * @param identifier - The identifier to search for
+   * @returns The wrapped element
+   */
+  static async getElementByCatchAll(
+    identifier: string,
+  ): Promise<PlaywrightElement> {
+    const isAndroid = await PlatformDetector.isAndroid();
+    let xpath = '';
+    if (isAndroid) {
+      xpath = `//*[@resource-id='${identifier}' or contains(@text,'${identifier}') or contains(@content-desc,'${identifier}')]`;
+    } else {
+      xpath = `//*[contains(@name,'${identifier}') or contains(@label,'${identifier}') or contains(@text,'${identifier}')]`;
+    }
+    return await this.getElementByXPath(xpath);
+  }
+
   /**
    * Get multiple elements by text content
    * @param text - The text to search for
    * @returns The wrapped elements
    */
-  static async getAllByText(text: string): Promise<PlaywrightElement[]> {
+  static async getAllElementsByText(
+    text: string,
+  ): Promise<PlaywrightElement[]> {
     const drv = getDriver();
     if (!drv) throw new Error('Driver is not available');
     const elements = await drv.$$(`*.=${text}`);
@@ -80,7 +124,7 @@ export default class PlaywrightMatchers {
    * @param xpath - The XPath selector to search for
    * @returns The wrapped element
    */
-  static async getByXPath(xpath: string): Promise<PlaywrightElement> {
+  static async getElementByXPath(xpath: string): Promise<PlaywrightElement> {
     const drv = getDriver();
     if (!drv) throw new Error('Driver is not available');
     const element = await drv.$(xpath);
@@ -92,7 +136,9 @@ export default class PlaywrightMatchers {
    * @param className - The class name to search for
    * @returns The wrapped element
    */
-  static async getByClassName(className: string): Promise<PlaywrightElement> {
+  static async getElementByClassName(
+    className: string,
+  ): Promise<PlaywrightElement> {
     const drv = getDriver();
     if (!drv) throw new Error('Driver is not available');
     const element = await drv.$(`.${className}`);
@@ -104,7 +150,7 @@ export default class PlaywrightMatchers {
    * @param className - The class name to search for
    * @returns The wrapped elements
    */
-  static async getAllByClassName(
+  static async getAllElementsByClassName(
     className: string,
   ): Promise<PlaywrightElement[]> {
     const drv = getDriver();
@@ -121,7 +167,7 @@ export default class PlaywrightMatchers {
    * @param selector - The Android UIAutomator selector to search for
    * @returns The wrapped element
    */
-  static async getByAndroidUIAutomator(
+  static async getElementByAndroidUIAutomator(
     selector: string,
   ): Promise<PlaywrightElement> {
     const drv = getDriver();
@@ -130,13 +176,14 @@ export default class PlaywrightMatchers {
     return wrapElement(element);
   }
 
+  // iOS specific selectors
   /**
    * Get element by iOS predicate string
    * Only works on iOS
    * @param predicate - The iOS predicate to search for
    * @returns The wrapped element
    */
-  static async getByIOSPredicate(
+  static async getElementByIOSPredicate(
     predicate: string,
   ): Promise<PlaywrightElement> {
     const drv = getDriver();
@@ -145,13 +192,27 @@ export default class PlaywrightMatchers {
     return wrapElement(element);
   }
 
+  /**
+   * Get element by name on iOS
+   * @param name - The name to search for
+   * @returns The wrapped element
+   */
+  static async getElementByNameiOS(name: string): Promise<PlaywrightElement> {
+    const isIOS = await PlatformDetector.isIOS();
+    if (!isIOS) throw new Error('This function is only valid for iOS');
+    const xpath = `//*[contains(@name,'${name}')]`;
+    return await this.getElementByXPath(xpath);
+  }
+
   /**
    * Get element by iOS class chain
    * Only works on iOS
    * @param chain - The iOS class chain to search for
    * @returns The wrapped element
    */
-  static async getByIOSClassChain(chain: string): Promise<PlaywrightElement> {
+  static async getElementByIOSClassChain(
+    chain: string,
+  ): Promise<PlaywrightElement> {
     const drv = getDriver();
     if (!drv) throw new Error('Driver is not available');
     const element = await drv.$(`-ios class chain:${chain}`);
diff --git a/tests/framework/UnifiedGestures.ts b/tests/framework/UnifiedGestures.ts
new file mode 100644
index 000000000000..381b2b033e93
--- /dev/null
+++ b/tests/framework/UnifiedGestures.ts
@@ -0,0 +1,127 @@
+import { FrameworkDetector } from './FrameworkDetector.ts';
+import { EncapsulatedElementType } from './EncapsulatedElement.ts';
+import {
+  GestureStrategy,
+  UnifiedGestureOptions,
+  TapAtIndexElement,
+  ScrollViewMatcher,
+  DetoxGestureStrategy,
+  AppiumGestureStrategy,
+} from './GestureStrategy.ts';
+
+/**
+ * UnifiedGestures — Static facade for framework-agnostic gesture execution.
+ *
+ * The framework strategy is resolved **once** on first use and cached for the
+ * lifetime of the test run.  Page objects call these static methods directly
+ * and never need to know whether Detox or Appium is running.
+ *
+ * @example
+ * ```typescript
+ * import { UnifiedGestures } from '../framework';
+ *
+ * class LoginView {
+ *   get passwordInput(): EncapsulatedElementType { ... }
+ *
+ *   async enterPassword(password: string) {
+ *     await UnifiedGestures.typeText(this.passwordInput, password);
+ *   }
+ * }
+ * ```
+ */
+export default class UnifiedGestures {
+  private static _strategy: GestureStrategy | null = null;
+
+  /** Lazily resolve and cache the active strategy */
+  private static get strategy(): GestureStrategy {
+    if (!this._strategy) {
+      this._strategy = FrameworkDetector.isDetox()
+        ? new DetoxGestureStrategy()
+        : new AppiumGestureStrategy();
+    }
+    return this._strategy;
+  }
+
+  /** Reset the cached strategy (useful in tests) */
+  static resetStrategy(): void {
+    this._strategy = null;
+  }
+
+  // ── Gesture Methods ─────────────────────────────────────────
+
+  static async tap(
+    elem: EncapsulatedElementType,
+    opts?: UnifiedGestureOptions,
+  ): Promise<void> {
+    await this.strategy.tap(elem, opts);
+  }
+
+  static async waitAndTap(
+    elem: EncapsulatedElementType,
+    opts?: UnifiedGestureOptions,
+  ): Promise<void> {
+    await this.strategy.waitAndTap(elem, opts);
+  }
+
+  static async typeText(
+    elem: EncapsulatedElementType,
+    text: string,
+    opts?: UnifiedGestureOptions,
+  ): Promise<void> {
+    await this.strategy.typeText(elem, text, opts);
+  }
+
+  static async replaceText(
+    elem: EncapsulatedElementType,
+    text: string,
+    opts?: UnifiedGestureOptions,
+  ): Promise<void> {
+    await this.strategy.replaceText(elem, text, opts);
+  }
+
+  static async swipe(
+    elem: EncapsulatedElementType,
+    direction: 'up' | 'down' | 'left' | 'right',
+    opts?: UnifiedGestureOptions,
+  ): Promise<void> {
+    await this.strategy.swipe(elem, direction, opts);
+  }
+
+  static async scrollToElement(
+    target: EncapsulatedElementType,
+    scrollView: ScrollViewMatcher,
+    opts?: UnifiedGestureOptions,
+  ): Promise<void> {
+    await this.strategy.scrollToElement(target, scrollView, opts);
+  }
+
+  static async longPress(
+    elem: EncapsulatedElementType,
+    opts?: UnifiedGestureOptions,
+  ): Promise<void> {
+    await this.strategy.longPress(elem, opts);
+  }
+
+  static async dblTap(
+    elem: EncapsulatedElementType,
+    opts?: UnifiedGestureOptions,
+  ): Promise<void> {
+    await this.strategy.dblTap(elem, opts);
+  }
+
+  static async tapAtPoint(
+    elem: EncapsulatedElementType,
+    point: { x: number; y: number },
+    opts?: UnifiedGestureOptions,
+  ): Promise<void> {
+    await this.strategy.tapAtPoint(elem, point, opts);
+  }
+
+  static async tapAtIndex(
+    elem: TapAtIndexElement,
+    index: number,
+    opts?: UnifiedGestureOptions,
+  ): Promise<void> {
+    await this.strategy.tapAtIndex(elem, index, opts);
+  }
+}
diff --git a/tests/framework/encapsulatedAction.ts b/tests/framework/encapsulatedAction.ts
new file mode 100644
index 000000000000..2df963b8da59
--- /dev/null
+++ b/tests/framework/encapsulatedAction.ts
@@ -0,0 +1,38 @@
+import { FrameworkDetector } from './FrameworkDetector.ts';
+
+/**
+ * Escape hatch for page-object methods that need entirely different
+ * control flow per framework (~3% of cases).
+ *
+ * Use `UnifiedGestures` for the common case. Reach for `encapsulatedAction`
+ * only when the Detox and Appium flows differ structurally (e.g. different
+ * sequences of taps, waits, or scrolls).
+ *
+ * @example
+ * ```typescript
+ * async dismissOnboarding() {
+ *   await encapsulatedAction({
+ *     detox: async () => {
+ *       await Gestures.swipe(this.overlay, 'up');
+ *       await Gestures.tap(this.dismissButton);
+ *     },
+ *     appium: async () => {
+ *       const btn = await asPlaywrightElement(this.dismissButton);
+ *       await btn.click();
+ *     },
+ *   });
+ * }
+ * ```
+ */
+export async function encapsulatedAction(config: {
+  detox?: () => Promise<void>;
+  appium?: () => Promise<void>;
+}): Promise<void> {
+  if (FrameworkDetector.isDetox() && config.detox) {
+    await config.detox();
+  } else if (FrameworkDetector.isAppium() && config.appium) {
+    await config.appium();
+  } else {
+    throw new Error('No action configuration provided');
+  }
+}
diff --git a/tests/framework/fixtures/FixtureBuilder.ts b/tests/framework/fixtures/FixtureBuilder.ts
index 4d79c8860b8e..ae49b7286691 100644
--- a/tests/framework/fixtures/FixtureBuilder.ts
+++ b/tests/framework/fixtures/FixtureBuilder.ts
@@ -215,9 +215,32 @@ class FixtureBuilder {
     this.fixture.state.browser.tabs[0].url = `http://localhost:${getMockServerPortForFixture()}/health-check`;
 
     // 3. Ganache port for localhost network RPC URL
-    this.fixture.state.engine.backgroundState.NetworkController.networkConfigurationsByChainId[
-      '0x539'
-    ].rpcEndpoints[0].url = `http://localhost:${getGanachePortForFixture()}`;
+    const networkConfigs =
+      this.fixture.state.engine.backgroundState.NetworkController
+        .networkConfigurationsByChainId;
+    if (!networkConfigs['0x539']) {
+      const networkClientId = `networkClientId${
+        Object.keys(networkConfigs).length + 1
+      }`;
+      networkConfigs['0x539'] = {
+        blockExplorerUrls: ['https://localhost'],
+        chainId: '0x539',
+        defaultBlockExplorerUrlIndex: 0,
+        defaultRpcEndpointIndex: 0,
+        name: 'Localhost',
+        nativeCurrency: 'ETH',
+        rpcEndpoints: [
+          {
+            networkClientId,
+            name: 'Localhost default RPC',
+            type: 'custom',
+            url: '',
+          },
+        ],
+      };
+    }
+    networkConfigs['0x539'].rpcEndpoints[0].url =
+      `http://localhost:${getGanachePortForFixture()}`;
 
     return this;
   }
@@ -458,6 +481,9 @@ class FixtureBuilder {
     // with the sell/offramp flow which still uses the aggregator SDK
     this.fixture.state.fiatOrders.selectedRegionAgg = aggregatorCountry;
 
+    this.fixture.state.fiatOrders.detectedGeolocation =
+      selectedRegion.countryIsoCode;
+
     return this;
   }
 
@@ -473,6 +499,18 @@ class FixtureBuilder {
     return this;
   }
 
+  /**
+   * Sets detected geolocation (e.g. for RWA/Stocks section visibility in Trending).
+   * Use a non-restricted country code so RWA data is shown when not in __DEV__ (e.g. CI).
+   * @param {string} countryCode - ISO country code (e.g. 'AR' for Argentina).
+   * @returns {FixtureBuilder} - The FixtureBuilder instance for method chaining.
+   */
+  withDetectedGeolocation(countryCode: string) {
+    this.fixture.state.fiatOrders = this.fixture.state.fiatOrders ?? {};
+    merge(this.fixture.state.fiatOrders, { detectedGeolocation: countryCode });
+    return this;
+  }
+
   /**
    * Adds chain switching permission for specific chains.
    * @param {string[]} chainIds - Array of chain IDs to permit (defaults to ['0x1']), other nexts like linea mainnet 0xe708
@@ -1769,6 +1807,13 @@ class FixtureBuilder {
       nativeAssetIdentifiers: {},
     };
 
+    if (
+      !this.fixture.state.engine.backgroundState.NetworkEnablementController
+    ) {
+      this.fixture.state.engine.backgroundState.NetworkEnablementController =
+        {};
+    }
+
     merge(
       this.fixture.state.engine.backgroundState.NetworkEnablementController,
       stateToMerge,
diff --git a/tests/framework/fixtures/FixtureHelper.ts b/tests/framework/fixtures/FixtureHelper.ts
index 217c27ad95b3..58e643d0e2a2 100644
--- a/tests/framework/fixtures/FixtureHelper.ts
+++ b/tests/framework/fixtures/FixtureHelper.ts
@@ -658,6 +658,12 @@ export async function withFixtures(
       }
     }
 
+    // Enter drain mode AFTER endTestfn so analytics events are still captured,
+    // but BEFORE stopping backends — prevents forwarding to dead Anvil/Ganache.
+    if (mockServerInstance) {
+      mockServerInstance.startDraining();
+    }
+
     // Clean up all local nodes
     if (localNodes && localNodes.length > 0) {
       try {
@@ -741,6 +747,13 @@ export async function withFixtures(
       }
     }
 
+    // Remove the abort filter AFTER all cleanup is complete so late async
+    // "Aborted" rejections from destroyed sockets are still caught.
+    if (mockServerInstance) {
+      logger.info('Removing abort filter after full cleanup');
+      mockServerInstance.removeAbortFilter();
+    }
+
     // Handle error reporting: prioritize test error over cleanup errors
     if (testError && cleanupErrors.length > 0) {
       // Both test and cleanup failed - report both but throw the test error
diff --git a/tests/framework/fixtures/fixture-validation.test.ts b/tests/framework/fixtures/fixture-validation.test.ts
index e561c526617e..f37368a4ba75 100644
--- a/tests/framework/fixtures/fixture-validation.test.ts
+++ b/tests/framework/fixtures/fixture-validation.test.ts
@@ -2,10 +2,12 @@ import {
   sortObjectKeysDeep,
   computeSchemaDiff,
   hasSchemaDifferences,
+  hasStructuralChanges,
   mergeFixtureChanges,
   formatSchemaDiff,
   readFixtureFile,
   getMobileFixtureIgnoredKeys,
+  normalizeExportedState,
   FixtureSchemaDiff,
 } from './fixture-validation';
 
@@ -134,6 +136,14 @@ describe('fixture-validation', () => {
       expect(diff.valueMismatches).toEqual([]);
     });
 
+    it('wildcard patterns act as prefix matchers for deeper keys', () => {
+      const baseline = { nets: { '0x1': { rpc: { id: { sub: 'a' } } } } };
+      const candidate = { nets: { '0x1': { rpc: { id: { sub: 'b' } } } } };
+      const diff = computeSchemaDiff(baseline, candidate, ['nets.*.rpc.id']);
+      expect(diff.valueMismatches).toEqual([]);
+      expect(diff.newKeys).toEqual([]);
+    });
+
     it('accepts custom ignoredKeys override', () => {
       const baseline = { a: 1 };
       const candidate = { a: 1, b: 2 };
@@ -169,6 +179,42 @@ describe('fixture-validation', () => {
     });
   });
 
+  describe('hasStructuralChanges', () => {
+    it('returns false for empty diff', () => {
+      expect(hasStructuralChanges(emptyDiff)).toBe(false);
+    });
+
+    it('returns false for value-only mismatches', () => {
+      expect(
+        hasStructuralChanges({
+          ...emptyDiff,
+          valueMismatches: [{ key: 'a', expected: 1, received: 2 }],
+        }),
+      ).toBe(false);
+    });
+
+    it('returns true for new keys', () => {
+      expect(hasStructuralChanges({ ...emptyDiff, newKeys: ['a'] })).toBe(true);
+    });
+
+    it('returns true for missing keys', () => {
+      expect(hasStructuralChanges({ ...emptyDiff, missingKeys: ['a'] })).toBe(
+        true,
+      );
+    });
+
+    it('returns true for type mismatches', () => {
+      expect(
+        hasStructuralChanges({
+          ...emptyDiff,
+          typeMismatches: [
+            { key: 'a', expected: 'number', received: 'string' },
+          ],
+        }),
+      ).toBe(true);
+    });
+  });
+
   describe('mergeFixtureChanges', () => {
     it('adds new keys from newState', () => {
       const existing = { a: 1 };
@@ -346,6 +392,60 @@ describe('fixture-validation', () => {
     });
   });
 
+  describe('normalizeExportedState', () => {
+    it('merges redux slices and wraps engine in backgroundState', () => {
+      const exported = {
+        redux: { alert: 'val1', browser: 'val2' },
+        engine: { AccountTrackerController: { accounts: {} } },
+      };
+      const result = normalizeExportedState(exported);
+      expect(result).toEqual({
+        alert: 'val1',
+        browser: 'val2',
+        engine: {
+          backgroundState: {
+            AccountTrackerController: { accounts: {} },
+          },
+        },
+      });
+    });
+
+    it('spreads all redux keys at the top level', () => {
+      const exported = {
+        redux: { a: 1, b: 2, c: 3 },
+        engine: {},
+      };
+      const result = normalizeExportedState(exported);
+      expect(result.a).toBe(1);
+      expect(result.b).toBe(2);
+      expect(result.c).toBe(3);
+    });
+
+    it('nests engine controllers under engine.backgroundState', () => {
+      const exported = {
+        redux: {},
+        engine: { FooController: { x: 1 }, BarController: { y: 2 } },
+      };
+      const result = normalizeExportedState(exported);
+      const bg = (result.engine as Record<string, unknown>)
+        .backgroundState as Record<string, unknown>;
+      expect(bg.FooController).toEqual({ x: 1 });
+      expect(bg.BarController).toEqual({ y: 2 });
+    });
+
+    it('throws when redux key is missing', () => {
+      expect(() =>
+        normalizeExportedState({ engine: {} } as Record<string, unknown>),
+      ).toThrow('missing the "redux" key');
+    });
+
+    it('throws when engine key is missing', () => {
+      expect(() =>
+        normalizeExportedState({ redux: {} } as Record<string, unknown>),
+      ).toThrow('missing the "engine" key');
+    });
+  });
+
   describe('integration: default fixture self-comparison', () => {
     it('produces empty diff when comparing fixture to itself', () => {
       const fixture = readFixtureFile('default-fixture.json');
diff --git a/tests/framework/fixtures/fixture-validation.ts b/tests/framework/fixtures/fixture-validation.ts
index cd630128f0b4..b6f8b3e7bc78 100644
--- a/tests/framework/fixtures/fixture-validation.ts
+++ b/tests/framework/fixtures/fixture-validation.ts
@@ -70,6 +70,14 @@ function createTypeMap(
   return map;
 }
 
+/**
+ * Checks whether a dot-path key should be ignored during diff comparison.
+ *
+ * Both exact and wildcard patterns act as **prefix matchers**: if a pattern
+ * matches a key or any ancestor of that key, the key is ignored.
+ * For example, pattern `nets.*.rpc.id` ignores `nets.0x1.rpc.id` as well as
+ * `nets.0x1.rpc.id.subkey.deep.nested`.
+ */
 function isIgnoredKey(key: string, ignoredKeys: string[]): boolean {
   for (const pattern of ignoredKeys) {
     if (!pattern.includes('*')) {
@@ -197,31 +205,59 @@ export function getMobileFixtureIgnoredKeys(): string[] {
     'engine.backgroundState.SnapsRegistry',
     'engine.backgroundState.SubjectMetadataController',
 
-    // ── Dynamic per-wallet IDs and addresses ──
+    // ── Per-wallet secrets and dynamic IDs (change every onboarding) ──
     'engine.backgroundState.AccountsController.internalAccounts.selectedAccount',
     'engine.backgroundState.AccountsController.internalAccounts.accounts',
     'engine.backgroundState.PreferencesController.selectedAddress',
     'engine.backgroundState.PreferencesController.identities',
     'engine.backgroundState.AccountTrackerController.accountsByChainId',
-    'engine.backgroundState.KeyringController.keyrings.*.accounts',
+    'engine.backgroundState.KeyringController.keyrings',
     'engine.backgroundState.KeyringController.vault',
+    'engine.backgroundState.KeyringController.isUnlocked',
+    'engine.backgroundState.KeyringController.encryptionKey',
+    'engine.backgroundState.KeyringController.encryptionSalt',
+    'engine.backgroundState.AccountTreeController.accountTree.wallets',
+    'engine.backgroundState.AccountTreeController.accountTree.selectedAccountGroup',
+    'engine.backgroundState.AccountTreeController.accountGroupsMetadata',
+    'engine.backgroundState.AccountTreeController.accountWalletsMetadata',
+    'engine.backgroundState.TokenBalancesController.tokenBalances',
+    'engine.backgroundState.MultichainNetworkController.networksWithTransactionActivity',
     'browser.activeTab',
 
-    // ── Timestamps ──
+    // ── Random IDs (generated fresh each onboarding) ──
+    'engine.backgroundState.PerpsController.cachedUserDataAddress',
+
+    // ── Timestamps (non-deterministic) ──
     'engine.backgroundState.CurrencyRateController.currencyRates.ETH.conversionDate',
     'engine.backgroundState.PhishingController.hotlistLastFetched',
     'engine.backgroundState.PhishingController.stalelistLastFetched',
-    'engine.backgroundState.PhishingController.listState.lastUpdated',
-    'engine.backgroundState.AccountsController.internalAccounts.accounts.*.metadata.importTime',
-    'engine.backgroundState.PreferencesController.identities.*.importTime',
+    'engine.backgroundState.PhishingController.c2DomainBlocklistLastFetched',
+    'engine.backgroundState.PerpsController.lastUpdateTimestamp',
+    'engine.backgroundState.PerpsController.cachedMarketDataTimestamp',
+    'engine.backgroundState.PerpsController.cachedUserDataTimestamp',
     'legalNotices.newPrivacyPolicyToastShownDate',
+    'engine.backgroundState.RemoteFeatureFlagController.cacheTimestamp',
+    'cronjobController.storage.events.*.date',
+    'cronjobController.storage.events.*.scheduledAt',
 
-    // ── Live exchange rates and market data ──
+    // ── Live-fetched server data (changes every run) ──
     'engine.backgroundState.CurrencyRateController.currencyRates',
     'engine.backgroundState.MultichainAssetsRatesController.conversionRates',
     'engine.backgroundState.MultichainAssetsRatesController.historicalPrices',
+    'engine.backgroundState.PhishingController.listState',
+    'engine.backgroundState.PhishingController.phishingLists',
+    'engine.backgroundState.PhishingController.urlScanCache',
+    'engine.backgroundState.PhishingController.tokenScanCache',
+    'engine.backgroundState.PhishingController.addressScanCache',
+    'engine.backgroundState.PhishingController.whitelistPaths',
+    'engine.backgroundState.RemoteFeatureFlagController.rawRemoteFeatureFlags',
+    'engine.backgroundState.RemoteFeatureFlagController.remoteFeatureFlags',
+    'engine.backgroundState.RemoteFeatureFlagController.thresholdCache',
+    'engine.backgroundState.TokenListController.tokensChainsCache',
+    'engine.backgroundState.TokenRatesController.marketData',
+    'engine.backgroundState.TokenSearchDiscoveryDataController',
 
-    // ── Multichain runtime state (UUID-keyed, fetched live) ──
+    // ── Multichain runtime state (address-keyed, fetched live) ──
     'engine.backgroundState.MultichainAssetsController.accountsAssets',
     'engine.backgroundState.MultichainAssetsController.assetsMetadata',
     'engine.backgroundState.MultichainAssetsController.allIgnoredAssets',
@@ -231,11 +267,7 @@ export function getMobileFixtureIgnoredKeys(): string[] {
     // ── Runtime sync/metrics state ──
     'engine.backgroundState.ProfileMetricsController',
     'engine.backgroundState.UserStorageController',
-
-    // ── Token data (fetched live per chain) ──
-    'engine.backgroundState.TokenListController.tokensChainsCache',
-    'engine.backgroundState.TokenRatesController.marketData',
-    'engine.backgroundState.TokenSearchDiscoveryDataController',
+    'engine.backgroundState.AuthenticationController',
 
     // ── Transaction runtime state ──
     'engine.backgroundState.TransactionController.transactions',
@@ -244,46 +276,80 @@ export function getMobileFixtureIgnoredKeys(): string[] {
     'engine.backgroundState.TransactionController.submitHistory',
     'engine.backgroundState.TransactionPayController',
 
-    // ── Authentication & notifications (session/push state) ──
-    'engine.backgroundState.AuthenticationController',
+    // ── Session-based state ──
+    'engine.backgroundState.PermissionController.subjects',
     'engine.backgroundState.NotificationServicesController.metamaskNotificationsList',
     'engine.backgroundState.NotificationServicesController.subscriptionAccountsSeen',
     'engine.backgroundState.NotificationServicesPushController',
 
+    // ── Controllers omitted from fixture (state matches controller defaults) ──
+    // These are excluded to reduce fixture size and startup CPU pressure.
+    // The controllers initialise with their own default state automatically.
+    'engine.backgroundState.AiDigestController',
+    'engine.backgroundState.AnalyticsController',
+    'engine.backgroundState.AppMetadataController',
+    'engine.backgroundState.AssetsController',
+    'engine.backgroundState.BridgeController',
+    'engine.backgroundState.BridgeStatusController',
+    'engine.backgroundState.ConnectivityController',
+    'engine.backgroundState.DeFiPositionsController',
+    'engine.backgroundState.DelegationController',
+    'engine.backgroundState.EarnController',
+    'engine.backgroundState.GatorPermissionsController',
+    'engine.backgroundState.LoggingController',
+    'engine.backgroundState.NetworkEnablementController',
+    'engine.backgroundState.PredictController',
+    'engine.backgroundState.RewardsController',
+    'engine.backgroundState.SeedlessOnboardingController',
+    'engine.backgroundState.SelectedNetworkController',
+    'engine.backgroundState.SignatureController',
+    'engine.backgroundState.SmartTransactionsController',
+
     // ── Cron jobs and ramps (runtime-populated) ──
+    'engine.backgroundState.CronJobController',
     'engine.backgroundState.CronjobController',
     'engine.backgroundState.RampsController',
+    'cronjobController',
 
-    // ── Phishing list state (fetched at runtime) ──
-    'engine.backgroundState.PhishingController.listState',
-
-    // ── Remote feature flags (fetched from server, always changing) ──
-    'engine.backgroundState.RemoteFeatureFlagController.rawRemoteFeatureFlags',
-    'engine.backgroundState.RemoteFeatureFlagController.remoteFeatureFlags',
-
-    // ── Dapp permissions & selected networks (session-based) ──
-    'engine.backgroundState.PermissionController.subjects',
-    'engine.backgroundState.SelectedNetworkController.domains',
-
-    // ── Smart transactions runtime state ──
-    'engine.backgroundState.SmartTransactionsController.smartTransactionsState',
+    // ── Runtime-detected values (non-deterministic between environments) ──
+    'card.geoLocation',
+    'fiatOrders.detectedGeolocation',
 
-    // ── Dynamic network client IDs and port-dependent URLs ──
+    // ── Dynamic network client IDs, port-dependent URLs, and display names ──
+    'engine.backgroundState.NetworkController.networkConfigurationsByChainId.*.name',
+    'engine.backgroundState.NetworkController.networkConfigurationsByChainId.*.nativeCurrency',
     'engine.backgroundState.NetworkController.networkConfigurationsByChainId.*.rpcEndpoints.*.networkClientId',
     'engine.backgroundState.NetworkController.networkConfigurationsByChainId.*.rpcEndpoints.*.url',
+    'engine.backgroundState.NetworkController.networksMetadata',
     'browser.tabs',
 
+    // ── Post-onboarding runtime UI state (non-deterministic between runs) ──
+    'legalNotices.isPna25Acknowledged',
+    'modals.shouldNetworkSwitchPopToWallet',
+    'user.appServicesReady',
+    'user.seedphraseBackedUp',
+    'user.backUpSeedphraseVisible',
+    'user.multichainAccountsIntroModalSeen',
+    'swaps.hasOnboarded',
+    'navigation.currentRoute',
+    'inpageProvider.networkId',
+    'engine.backgroundState.SwapsController.pollingCyclesLeft',
+
     // ── Redux-persist internals ──
     '_persist',
-
-    // ── Runtime redux slices (not part of fixture state) ──
-    'cronjobController',
-    'rewards',
-    'performance',
-    'confirmationMetrics',
   ];
 }
 
+/**
+ * Keys whose value mismatches should be auto-merged during fixture export.
+ * Normally only structural changes (new/missing keys, type mismatches) are
+ * merged. These keys contain data that is expected to evolve over time
+ * (e.g. supported network lists) and should be kept current.
+ */
+export function getAutoUpdatableKeys(): string[] {
+  return ['fiatOrders.networks'];
+}
+
 export function computeSchemaDiff(
   baseline: Record<string, unknown>,
   candidate: Record<string, unknown>,
@@ -317,7 +383,10 @@ export function computeSchemaDiff(
     } else if (candidateTypes[key] === 'array') {
       const baseArr = getNestedValue(baseline, key);
       const candArr = getNestedValue(candidate, key);
-      if (JSON.stringify(baseArr) !== JSON.stringify(candArr)) {
+      if (
+        JSON.stringify(sortObjectKeysDeep(baseArr)) !==
+        JSON.stringify(sortObjectKeysDeep(candArr))
+      ) {
         diff.valueMismatches.push({
           key,
           expected: baseArr,
@@ -357,6 +426,22 @@ export function hasSchemaDifferences(diff: FixtureSchemaDiff): boolean {
   );
 }
 
+export function hasStructuralChanges(diff: FixtureSchemaDiff): boolean {
+  return (
+    diff.newKeys.length > 0 ||
+    diff.missingKeys.length > 0 ||
+    diff.typeMismatches.length > 0
+  );
+}
+
+/**
+ * Merges diff changes from `newState` into `existing`.
+ *
+ * **Important:** ALL entries in `diff.valueMismatches` are applied. Callers
+ * should pre-filter the diff to include only the value mismatches they want
+ * merged (e.g. auto-updatable keys). Passing the raw diff from
+ * `computeSchemaDiff` will overwrite every mismatched value.
+ */
 export function mergeFixtureChanges(
   existing: Record<string, unknown>,
   newState: Record<string, unknown>,
@@ -463,3 +548,35 @@ export function readFixtureFile(fixtureName: string): Record<string, unknown> {
   const content = fs.readFileSync(fixturePath, 'utf-8');
   return JSON.parse(content) as Record<string, unknown>;
 }
+
+/**
+ * Normalizes the exported app state (from CommandQueueServer) into the same
+ * shape as fixture JSON's `state` subtree so they can be compared.
+ *
+ * Exported:  { redux: { alert, browser, ... }, engine: { AccountTrackerController, ... } }
+ * Fixture:   { state: { alert, browser, ..., engine: { backgroundState: { AccountTrackerController, ... } } } }
+ */
+export function normalizeExportedState(
+  exported: Record<string, unknown>,
+): Record<string, unknown> {
+  if (!exported.redux || typeof exported.redux !== 'object') {
+    throw new Error(
+      'normalizeExportedState: exported state is missing the "redux" key. ' +
+        'State export may have failed or returned an unexpected shape.',
+    );
+  }
+  if (!exported.engine || typeof exported.engine !== 'object') {
+    throw new Error(
+      'normalizeExportedState: exported state is missing the "engine" key. ' +
+        'State export may have failed or returned an unexpected shape.',
+    );
+  }
+  const redux = exported.redux as Record<string, unknown>;
+  const engine = exported.engine as Record<string, unknown>;
+  return {
+    ...redux,
+    engine: {
+      backgroundState: engine,
+    },
+  };
+}
diff --git a/tests/framework/fixtures/json/default-fixture.json b/tests/framework/fixtures/json/default-fixture.json
index df06ae3b5ae8..9faa49598d72 100644
--- a/tests/framework/fixtures/json/default-fixture.json
+++ b/tests/framework/fixtures/json/default-fixture.json
@@ -8,27 +8,75 @@
     "@MetaMask:solanaFeatureModalShownV2": "true"
   },
   "state": {
+    "accounts": {
+      "reloadAccounts": false
+    },
     "alert": {
       "autodismiss": null,
       "content": null,
       "data": null,
       "isVisible": false
     },
+    "banners": {
+      "dismissedBanners": []
+    },
     "bookmarks": [],
+    "bridge": {
+      "isDestTokenManuallySet": false,
+      "isGasIncluded7702Supported": false,
+      "isGasIncludedSTXSendBundleSupported": false,
+      "isMaxSourceAmount": false,
+      "isSelectingRecipient": false,
+      "isSelectingToken": false,
+      "isSubmittingTx": false,
+      "slippage": "0.5"
+    },
     "browser": {
       "activeTab": 1692550481062,
+      "favicons": [],
       "history": [],
+      "isFullscreen": false,
       "tabs": [
         {
           "id": 1692550481062,
           "url": "http://localhost:8000/health-check"
         }
       ],
+      "visitedDappsByHostname": {},
       "whitelist": []
     },
+    "card": {
+      "alwaysShowCardButton": false,
+      "authenticatedPriorityToken": null,
+      "authenticatedPriorityTokenLastFetched": null,
+      "cache": {
+        "data": {},
+        "timestamps": {}
+      },
+      "cardholderAccounts": [],
+      "geoLocation": "UNKNOWN",
+      "hasViewedCardButton": false,
+      "isAuthenticated": false,
+      "isDaimoDemo": false,
+      "isLoaded": false,
+      "lastFetchedByAddress": {},
+      "onboarding": {
+        "consentSetId": null,
+        "contactVerificationId": null,
+        "onboardingId": null,
+        "selectedCountry": null
+      },
+      "priorityTokensByAddress": {},
+      "userCardLocation": "international"
+    },
     "collectibles": {
-      "favorites": {}
+      "favorites": {},
+      "isNftFetchingProgress": false
+    },
+    "confirmationMetrics": {
+      "metricsById": {}
     },
+    "cronjobController": {},
     "engine": {
       "backgroundState": {
         "AccountTrackerController": {
@@ -48,7 +96,9 @@
         "AccountTreeController": {
           "accountTree": {
             "wallets": {}
-          }
+          },
+          "hasAccountTreeSyncingSyncedAtLeastOnce": true,
+          "isAccountTreeSyncingInProgress": false
         },
         "AccountsController": {
           "internalAccounts": {
@@ -102,9 +152,9 @@
         },
         "GasFeeController": {
           "estimatedGasFeeTimeBounds": {},
+          "gasEstimateType": "none",
           "gasFeeEstimates": {},
           "gasFeeEstimatesByChainId": {},
-          "gasEstimateType": "none",
           "nonRPCGasFeeApisDisabled": false
         },
         "KeyringController": {
@@ -133,11 +183,59 @@
               "name": "Bitcoin",
               "nativeCurrency": "bip122:000000000019d6689c085ae165831e93/slip44:0"
             },
+            "bip122:000000000933ea01ad0ee984209779ba": {
+              "chainId": "bip122:000000000933ea01ad0ee984209779ba",
+              "isEvm": false,
+              "name": "Bitcoin Testnet",
+              "nativeCurrency": "bip122:000000000933ea01ad0ee984209779ba/slip44:0"
+            },
+            "bip122:00000000da84f2bafbbc53dee25a72ae": {
+              "chainId": "bip122:00000000da84f2bafbbc53dee25a72ae",
+              "isEvm": false,
+              "name": "Bitcoin Testnet4",
+              "nativeCurrency": "bip122:00000000da84f2bafbbc53dee25a72ae/slip44:0"
+            },
+            "bip122:00000008819873e925422c1ff0f99f7c": {
+              "chainId": "bip122:00000008819873e925422c1ff0f99f7c",
+              "isEvm": false,
+              "name": "Bitcoin Mutinynet",
+              "nativeCurrency": "bip122:00000008819873e925422c1ff0f99f7c/slip44:0"
+            },
+            "bip122:regtest": {
+              "chainId": "bip122:regtest",
+              "isEvm": false,
+              "name": "Bitcoin Regtest",
+              "nativeCurrency": "bip122:regtest/slip44:0"
+            },
+            "solana:4uhcVJyU9pJkvQyS88uRDiswHXSCkY3z": {
+              "chainId": "solana:4uhcVJyU9pJkvQyS88uRDiswHXSCkY3z",
+              "isEvm": false,
+              "name": "Solana Testnet",
+              "nativeCurrency": "solana:4uhcVJyU9pJkvQyS88uRDiswHXSCkY3z/slip44:501"
+            },
             "solana:5eykt4UsFv8P8NJdTREpY1vzqKqZKvdp": {
               "chainId": "solana:5eykt4UsFv8P8NJdTREpY1vzqKqZKvdp",
               "isEvm": false,
-              "name": "Solana Mainnet",
-              "nativeCurrency": "solana:5eykt4UsFv8P8NJdTREpY1vzqKqZKvdp/token:EPjFWdd5AufqSSqeM2qN1xzybapC8G4wEGGkZwyTDt1v"
+              "name": "Solana",
+              "nativeCurrency": "solana:5eykt4UsFv8P8NJdTREpY1vzqKqZKvdp/slip44:501"
+            },
+            "solana:EtWTRABZaYq6iMfeYKouRu166VU2xqa1": {
+              "chainId": "solana:EtWTRABZaYq6iMfeYKouRu166VU2xqa1",
+              "isEvm": false,
+              "name": "Solana Devnet",
+              "nativeCurrency": "solana:EtWTRABZaYq6iMfeYKouRu166VU2xqa1/slip44:501"
+            },
+            "tron:2494104990": {
+              "chainId": "tron:2494104990",
+              "isEvm": false,
+              "name": "Tron Shasta",
+              "nativeCurrency": "tron:2494104990/slip44:195"
+            },
+            "tron:3448148188": {
+              "chainId": "tron:3448148188",
+              "isEvm": false,
+              "name": "Tron Nile",
+              "nativeCurrency": "tron:3448148188/slip44:195"
             },
             "tron:728126428": {
               "chainId": "tron:728126428",
@@ -152,37 +250,20 @@
         "NetworkController": {
           "networkConfigurationsByChainId": {
             "0x1": {
-              "blockExplorerUrls": ["https://etherscan.io"],
+              "blockExplorerUrls": [],
               "chainId": "0x1",
-              "defaultBlockExplorerUrlIndex": 0,
               "defaultRpcEndpointIndex": 0,
               "name": "Ethereum Main Network",
               "nativeCurrency": "ETH",
               "rpcEndpoints": [
                 {
-                  "name": "Ethereum Network default RPC",
+                  "failoverUrls": [],
                   "networkClientId": "mainnet",
                   "type": "infura",
                   "url": "https://mainnet.infura.io/v3/{infuraProjectId}"
                 }
               ]
             },
-            "0x539": {
-              "blockExplorerUrls": ["https://test.io"],
-              "chainId": "0x539",
-              "defaultBlockExplorerUrlIndex": 0,
-              "defaultRpcEndpointIndex": 0,
-              "name": "Localhost",
-              "nativeCurrency": "ETH",
-              "rpcEndpoints": [
-                {
-                  "name": "Local RPC",
-                  "networkClientId": "networkId1",
-                  "type": "custom",
-                  "url": "http://localhost:8546"
-                }
-              ]
-            },
             "0xaa36a7": {
               "blockExplorerUrls": [],
               "chainId": "0xaa36a7",
@@ -191,37 +272,40 @@
               "nativeCurrency": "SepoliaETH",
               "rpcEndpoints": [
                 {
+                  "failoverUrls": [],
                   "networkClientId": "sepolia",
                   "type": "infura",
                   "url": "https://sepolia.infura.io/v3/{infuraProjectId}"
                 }
               ]
             },
-            "0xe705": {
+            "0xe708": {
               "blockExplorerUrls": [],
-              "chainId": "0xe705",
+              "chainId": "0xe708",
               "defaultRpcEndpointIndex": 0,
-              "name": "Linea Sepolia",
+              "name": "Linea Main Network",
               "nativeCurrency": "LineaETH",
               "rpcEndpoints": [
                 {
-                  "networkClientId": "linea-sepolia",
+                  "failoverUrls": [],
+                  "networkClientId": "linea-mainnet",
                   "type": "infura",
-                  "url": "https://linea-sepolia.infura.io/v3/{infuraProjectId}"
+                  "url": "https://linea-mainnet.infura.io/v3/{infuraProjectId}"
                 }
               ]
             },
-            "0xe708": {
+            "0xe705": {
               "blockExplorerUrls": [],
-              "chainId": "0xe708",
+              "chainId": "0xe705",
               "defaultRpcEndpointIndex": 0,
-              "name": "Linea Main Network",
+              "name": "Linea Sepolia",
               "nativeCurrency": "LineaETH",
               "rpcEndpoints": [
                 {
-                  "networkClientId": "linea-mainnet",
+                  "failoverUrls": [],
+                  "networkClientId": "linea-sepolia",
                   "type": "infura",
-                  "url": "https://linea-mainnet.infura.io/v3/{infuraProjectId}"
+                  "url": "https://linea-sepolia.infura.io/v3/{infuraProjectId}"
                 }
               ]
             }
@@ -232,12 +316,6 @@
                 "1559": true
               },
               "status": "available"
-            },
-            "networkId1": {
-              "EIPS": {
-                "1559": true
-              },
-              "status": "available"
             }
           },
           "selectedNetworkClientId": "mainnet"
@@ -264,10 +342,63 @@
           "subjects": {}
         },
         "PerpsController": {
-          "isFirstTimeUser": {
+          "accountState": {
+            "availableBalance": "8000.00",
+            "marginUsed": "2000.00",
+            "returnOnEquity": "0",
+            "totalBalance": "10000.00",
+            "unrealizedPnl": "150.00"
+          },
+          "activeProvider": "hyperliquid",
+          "cachedAccountState": null,
+          "cachedMarketData": null,
+          "cachedMarketDataTimestamp": 0,
+          "cachedOrders": null,
+          "cachedPositions": null,
+          "cachedUserDataAddress": null,
+          "cachedUserDataTimestamp": 0,
+          "depositInProgress": false,
+          "depositRequests": [],
+          "hasPlacedFirstOrder": {
             "mainnet": false,
             "testnet": false
-          }
+          },
+          "hip3ConfigVersion": 0,
+          "initializationAttempts": 0,
+          "initializationError": null,
+          "initializationState": "uninitialized",
+          "isEligible": false,
+          "isFirstTimeUser": {
+            "mainnet": true,
+            "testnet": true
+          },
+          "isTestnet": false,
+          "lastDepositResult": null,
+          "lastDepositTransactionId": null,
+          "lastError": null,
+          "lastUpdateTimestamp": 0,
+          "lastWithdrawResult": null,
+          "marketFilterPreferences": {
+            "direction": "desc",
+            "optionId": "volume"
+          },
+          "perpsBalances": {},
+          "selectedPaymentToken": null,
+          "tradeConfigurations": {
+            "mainnet": {},
+            "testnet": {}
+          },
+          "watchlistMarkets": {
+            "mainnet": [],
+            "testnet": []
+          },
+          "withdrawInProgress": false,
+          "withdrawalProgress": {
+            "activeWithdrawalId": null,
+            "lastUpdated": 0,
+            "progress": 0
+          },
+          "withdrawalRequests": []
         },
         "PhishingController": {
           "hotlistLastFetched": 1684231917,
@@ -292,6 +423,7 @@
           "whitelist": []
         },
         "PreferencesController": {
+          "dismissSmartAccountSuggestionEnabled": false,
           "displayNftMedia": true,
           "featureFlags": {},
           "identities": {
@@ -302,18 +434,57 @@
             }
           },
           "ipfsGateway": "https://dweb.link/ipfs/",
+          "isIpfsGatewayEnabled": true,
           "isMultiAccountBalancesEnabled": true,
           "lostIdentities": {},
+          "privacyMode": false,
+          "securityAlertsEnabled": true,
           "selectedAddress": "0x76cf1cdd1fcc252442b50d6e97207228aa4aefc3",
+          "showIncomingTransactions": {
+            "0x1": true,
+            "0x13881": true,
+            "0x38": true,
+            "0x5": true,
+            "0x504": true,
+            "0x505": true,
+            "0x507": true,
+            "0x531": true,
+            "0x61": true,
+            "0x64": true,
+            "0x89": true,
+            "0x8f": true,
+            "0xa": true,
+            "0xa869": true,
+            "0xa86a": true,
+            "0xaa36a7": true,
+            "0xaa37dc": true,
+            "0xe704": true,
+            "0xe705": true,
+            "0xe708": true,
+            "0xfa": true,
+            "0xfa2": true
+          },
+          "showMultiRpcModal": false,
           "showTestNetworks": true,
+          "smartAccountOptIn": true,
+          "smartAccountOptInForAccounts": [],
+          "smartTransactionsOptInStatus": true,
+          "tokenNetworkFilter": {},
+          "tokenSortConfig": {
+            "key": "tokenFiatAmount",
+            "order": "dsc",
+            "sortCallback": "stringNumeric"
+          },
           "useNftDetection": true,
           "useSafeChainsListValidation": false,
-          "useTokenDetection": true
+          "useTokenDetection": true,
+          "useTransactionSimulations": true
         },
         "RampsController": {
           "userRegion": null
         },
         "RemoteFeatureFlagController": {
+          "localOverrides": {},
           "remoteFeatureFlags": {
             "bitcoinAccounts": {
               "enabled": true,
@@ -369,6 +540,7 @@
               "decimals": 0,
               "symbol": ""
             },
+            "networkClientId": "mainnet",
             "sourceTokenInfo": {
               "address": "",
               "decimals": 0,
@@ -450,124 +622,48 @@
       "activationKeys": [],
       "authenticationUrls": [],
       "customOrderIds": [],
+      "detectedGeolocation": null,
       "getStartedAgg": false,
       "getStartedDeposit": false,
       "getStartedSell": false,
       "networks": [
         {
           "active": true,
-          "chainId": 1,
+          "chainId": "1",
           "chainName": "Ethereum Mainnet",
           "nativeTokenSupported": true,
           "shortName": "Ethereum"
         },
         {
           "active": true,
-          "chainId": 10,
-          "chainName": "Optimism Mainnet",
+          "chainId": "59144",
+          "chainName": "Linea",
+          "isEvm": true,
           "nativeTokenSupported": true,
-          "shortName": "Optimism"
+          "shortName": "Linea"
         },
         {
           "active": true,
-          "chainId": 25,
-          "chainName": "Cronos Mainnet",
-          "nativeTokenSupported": true,
-          "shortName": "Cronos"
-        },
-        {
-          "active": true,
-          "chainId": 56,
-          "chainName": "BNB Chain Mainnet",
-          "nativeTokenSupported": true,
-          "shortName": "BNB Chain"
-        },
-        {
-          "active": true,
-          "chainId": 137,
-          "chainName": "Polygon Mainnet",
-          "nativeTokenSupported": true,
-          "shortName": "Polygon"
-        },
-        {
-          "active": true,
-          "chainId": 250,
-          "chainName": "Fantom Mainnet",
-          "nativeTokenSupported": true,
-          "shortName": "Fantom"
-        },
-        {
-          "active": true,
-          "chainId": 1284,
-          "chainName": "Moonbeam Mainnet",
-          "nativeTokenSupported": true,
-          "shortName": "Moonbeam"
-        },
-        {
-          "active": true,
-          "chainId": 1285,
-          "chainName": "Moonriver Mainnet",
-          "nativeTokenSupported": true,
-          "shortName": "Moonriver"
-        },
-        {
-          "active": true,
-          "chainId": 1337,
-          "chainName": "Localhost",
-          "nativeTokenSupported": true,
-          "shortName": "Localhost"
-        },
-        {
-          "chainId": 1,
-          "chainName": "Tenderly",
+          "chainId": "8453",
+          "chainName": "Base",
+          "isEvm": true,
           "nativeTokenSupported": true,
-          "shortName": "Tenderly"
+          "shortName": "Base"
         },
         {
           "active": true,
-          "chainId": 42161,
-          "chainName": "Arbitrum Mainnet",
+          "chainId": "solana:5eykt4UsFv8P8NJdTREpY1vzqKqZKvdp",
+          "chainName": "Solana",
+          "isEvm": false,
           "nativeTokenSupported": true,
-          "shortName": "Arbitrum"
-        },
-        {
-          "active": true,
-          "chainId": 42220,
-          "chainName": "Celo Mainnet",
-          "nativeTokenSupported": true,
-          "shortName": "Celo"
-        },
-        {
-          "active": true,
-          "chainId": 43114,
-          "chainName": "Avalanche C-Chain Mainnet",
-          "nativeTokenSupported": true,
-          "shortName": "Avalanche C-Chain"
-        },
-        {
-          "active": true,
-          "chainId": 1313161554,
-          "chainName": "Aurora Mainnet",
-          "nativeTokenSupported": false,
-          "shortName": "Aurora"
-        },
-        {
-          "active": true,
-          "chainId": 1666600000,
-          "chainName": "Harmony Mainnet (Shard 0)",
-          "nativeTokenSupported": true,
-          "shortName": "Harmony  (Shard 0)"
-        },
-        {
-          "active": true,
-          "chainId": 11297108109,
-          "chainName": "Palm Mainnet",
-          "nativeTokenSupported": false,
-          "shortName": "Palm"
+          "shortName": "Solana"
         }
       ],
       "orders": [],
+      "rampRoutingDecision": null,
+      "selectedCryptoCurrencyDeposit": null,
       "selectedPaymentMethodAgg": null,
+      "selectedPaymentMethodDeposit": null,
       "selectedRegionAgg": null,
       "selectedRegionDeposit": null
     },
@@ -586,7 +682,6 @@
       "collectibleContractModalVisible": false,
       "dappTransactionModalVisible": false,
       "networkModalVisible": false,
-      "receiveModalVisible": false,
       "shouldNetworkSwitchPopToWallet": true,
       "signMessageModalVisible": true
     },
@@ -594,6 +689,9 @@
       "currentBottomNavRoute": "Wallet",
       "currentRoute": "AdvancedSettings"
     },
+    "networkConnectionBanner": {
+      "visible": false
+    },
     "networkOnboarded": {
       "networkOnboardedState": {},
       "networkState": {
@@ -610,21 +708,116 @@
     "notification": {
       "notifications": []
     },
+    "notifications": {},
     "onboarding": {
+      "completedOnboarding": true,
       "events": []
     },
+    "originThrottling": {
+      "origins": {}
+    },
+    "performance": {
+      "activeTraceBySessionId": {},
+      "environment": {
+        "appVersion": "",
+        "branch": "",
+        "commitHash": "",
+        "platform": ""
+      },
+      "isInitialized": false,
+      "metrics": [],
+      "sessionId": "",
+      "startTime": 0
+    },
     "privacy": {
       "approvedHosts": {},
       "revealSRPTimestamps": []
     },
+    "qrKeyringScanner": {
+      "isScanning": false
+    },
+    "rewards": {
+      "activeBoosts": null,
+      "activeBoostsError": false,
+      "activeBoostsLoading": false,
+      "activeTab": "overview",
+      "balanceRefereePortion": 0,
+      "balanceTotal": 0,
+      "balanceUpdatedAt": null,
+      "bulkLink": {
+        "failedAccounts": 0,
+        "initialSubscriptionId": null,
+        "isRunning": false,
+        "linkedAccounts": 0,
+        "totalAccounts": 0,
+        "wasInterrupted": false
+      },
+      "candidateSubscriptionId": "pending",
+      "currentTier": null,
+      "geoLocation": null,
+      "hideCurrentAccountNotOptedInBanner": [],
+      "hideUnlinkedAccountsBanner": false,
+      "nextTier": null,
+      "nextTierPointsNeeded": null,
+      "onboardingActiveStep": "INTRO",
+      "onboardingReferralCode": null,
+      "optinAllowedForGeo": null,
+      "optinAllowedForGeoError": false,
+      "optinAllowedForGeoLoading": false,
+      "pointsEvents": null,
+      "refereeCount": 0,
+      "referralCode": null,
+      "referralDetailsError": false,
+      "referralDetailsLoading": false,
+      "referredByCode": null,
+      "seasonActivityTypes": [],
+      "seasonEndDate": null,
+      "seasonId": null,
+      "seasonName": null,
+      "seasonShouldInstallNewVersion": null,
+      "seasonStartDate": null,
+      "seasonStatusError": null,
+      "seasonStatusLoading": false,
+      "seasonTiers": [],
+      "seasonWaysToEarn": [],
+      "snapshots": null,
+      "snapshotsError": false,
+      "snapshotsLoading": false,
+      "unlockedRewardError": false,
+      "unlockedRewardLoading": false,
+      "unlockedRewards": null
+    },
+    "rpcEvents": {
+      "signingEvent": {
+        "eventStage": "idle",
+        "rpcName": ""
+      }
+    },
+    "sdk": {
+      "approvedHosts": {},
+      "connections": {},
+      "dappConnections": {},
+      "v2Connections": {}
+    },
     "security": {
-      "allowLoginWithRememberMe": false
+      "allowLoginWithRememberMe": false,
+      "dataCollectionForMarketing": false,
+      "isNFTAutoDetectionModalViewed": false,
+      "osAuthEnabled": false
+    },
+    "securityAlerts": {
+      "alerts": {}
     },
     "settings": {
       "avatarAccountType": "Maskicon",
       "basicFunctionalityEnabled": true,
+      "deepLinkModalDisabled": false,
+      "deviceNotificationEnabled": false,
       "hideZeroBalanceTokens": false,
       "lockTime": 30000,
+      "perpsChartPreferences": {
+        "preferredCandlePeriod": "15m"
+      },
       "primaryCurrency": "ETH",
       "searchEngine": "Google"
     },
@@ -635,20 +828,21 @@
       "hasOnboarded": false,
       "isLive": true
     },
-    "transaction": {
-      "selectedAsset": {},
-      "transaction": {}
-    },
     "user": {
+      "ambiguousAddressEntries": {},
+      "appServicesReady": false,
       "appTheme": "os",
       "backUpSeedphraseVisible": false,
       "existingUser": true,
       "gasEducationCarouselSeen": false,
       "initialScreen": "",
       "isAuthChecked": false,
+      "isConnectionRemoved": false,
       "loadingMsg": "",
       "loadingSet": false,
       "multichainAccountsIntroModalSeen": true,
+      "musdConversionAssetDetailCtasSeen": {},
+      "musdConversionEducationSeen": false,
       "passwordSet": true,
       "protectWalletModalVisible": false,
       "seedphraseBackedUp": true,
diff --git a/tests/framework/fixtures/performance/performance-fixture.ts b/tests/framework/fixtures/performance/performance-fixture.ts
index 0b8a7ce74555..657e18a4951b 100644
--- a/tests/framework/fixtures/performance/performance-fixture.ts
+++ b/tests/framework/fixtures/performance/performance-fixture.ts
@@ -1,5 +1,9 @@
 import { test as base } from 'appwright';
-import { PerformanceTracker } from '../../../reporters/PerformanceTracker.js';
+import {
+  PerformanceTracker,
+  type MetricsOutput,
+} from '../../../reporters/PerformanceTracker';
+import { publishPerformanceScenarioToSentry } from '../../../reporters/providers/sentry/PerformanceSentryPublisher';
 import {
   QualityGatesValidator,
   markQualityGateFailure,
@@ -56,10 +60,9 @@ export const test = base.extend<PerformanceFixtures>({
     }
 
     // Always try to attach performance metrics, even if test failed
+    let metrics: MetricsOutput | null = null;
     try {
-      const metrics = (await performanceTracker.attachToTest(
-        testInfo,
-      )) as unknown as { steps: unknown[]; total: number };
+      metrics = await performanceTracker.attachToTest(testInfo);
       console.log(
         `✅ Performance metrics attached: ${
           metrics.steps.length
@@ -72,6 +75,30 @@ export const test = base.extend<PerformanceFixtures>({
       );
     }
 
+    if (metrics) {
+      try {
+        const sentToSentry = await publishPerformanceScenarioToSentry({
+          metrics,
+          testTitle: testInfo.title,
+          projectName: testInfo.project?.name ?? 'unknown',
+          testFilePath: testInfo.file,
+          tags: testTags,
+          status: testInfo.status,
+          retry: testInfo.retry,
+          workerIndex: testInfo.workerIndex,
+        });
+
+        if (sentToSentry) {
+          console.log(`📡 Scenario "${testInfo.title}" sent to Sentry`);
+        }
+      } catch (error) {
+        console.error(
+          `❌ Failed to publish scenario "${testInfo.title}" to Sentry:`,
+          (error as Error).message,
+        );
+      }
+    }
+
     // Validate quality gates if any timer has thresholds defined
     const hasThresholds = performanceTracker.timers.some((t) =>
       t.hasThreshold(),
diff --git a/tests/framework/index.ts b/tests/framework/index.ts
index 665982796ed2..a70108f209dd 100644
--- a/tests/framework/index.ts
+++ b/tests/framework/index.ts
@@ -38,3 +38,13 @@ export {
 
 export { FrameworkDetector, TestFramework } from './FrameworkDetector.ts';
 export { PlatformDetector } from './PlatformLocator.ts';
+export { default as UnifiedGestures } from './UnifiedGestures.ts';
+export { encapsulatedAction } from './encapsulatedAction.ts';
+export {
+  DetoxGestureStrategy,
+  AppiumGestureStrategy,
+  type GestureStrategy,
+  type UnifiedGestureOptions,
+  type TapAtIndexElement,
+  type ScrollViewMatcher,
+} from './GestureStrategy.ts';
diff --git a/tests/framework/types.ts b/tests/framework/types.ts
index b0213f7e1b4a..8ce9f6a1704a 100644
--- a/tests/framework/types.ts
+++ b/tests/framework/types.ts
@@ -91,6 +91,10 @@ export interface LongPressOptions extends GestureOptions {
   duration?: number;
 }
 
+export interface MatcherOptions {
+  exact?: boolean;
+}
+
 /**
  * The options for the scroll gesture.
  * @param {string} direction - The direction to scroll.
diff --git a/tests/helpers.js b/tests/helpers.js
index 7906ff201acc..23624bc87173 100644
--- a/tests/helpers.js
+++ b/tests/helpers.js
@@ -1,12 +1,16 @@
+/* eslint-disable import/no-nodejs-modules */
 import { waitFor, web } from 'detox';
 import { getFixturesServerPort } from './framework/fixtures/FixtureUtils';
 import Utilities from './framework/Utilities';
 import { resolveConfig } from 'detox/internals';
 import { createLogger } from './framework/logger';
+import { exec } from 'child_process';
+import { promisify } from 'util';
 
 const logger = createLogger({
   name: 'TestHelpers',
 });
+const execAsync = promisify(exec);
 
 export default class TestHelpers {
   /**
@@ -394,7 +398,7 @@ export default class TestHelpers {
       return this.launchAppForDebugBuild(platform, launchOptions);
     }
 
-    return device.launchApp(launchOptions);
+    return this.launchAppWithRecovery(launchOptions);
   }
 
   static async launchAppForDebugBuild(platform, launchOptions) {
@@ -403,18 +407,95 @@ export default class TestHelpers {
     );
 
     if (platform === 'ios') {
-      await device.launchApp(launchOptions);
+      await this.launchAppWithRecovery(launchOptions);
       return device.openURL({
         url: deepLinkUrl,
       });
     }
 
-    return device.launchApp({
+    return this.launchAppWithRecovery({
       url: deepLinkUrl,
       ...launchOptions,
     });
   }
 
+  static getAdbDeviceFlag() {
+    return device?.id ? `-s ${device.id}` : '';
+  }
+
+  static async logAndroidReversePorts(context) {
+    if (device.getPlatform() !== 'android') {
+      return;
+    }
+
+    try {
+      const command = `adb ${this.getAdbDeviceFlag()} reverse --list`;
+      const { stdout } = await execAsync(command);
+      logger.debug(
+        `[launch diagnostics] ${context} | adb reverse --list:\n${
+          stdout?.trim() || '(empty)'
+        }`,
+      );
+    } catch (error) {
+      logger.warn(
+        `[launch diagnostics] ${context} | Failed to list adb reverse ports`,
+        error,
+      );
+    }
+  }
+
+  static isAndroidReverseAddressInUseError(error) {
+    const message = error instanceof Error ? error.message : String(error);
+    return (
+      device.getPlatform() === 'android' &&
+      message.includes('adb') &&
+      message.includes('reverse tcp:') &&
+      message.includes('Address already in use')
+    );
+  }
+
+  static extractConflictingReversePort(error) {
+    const message = error instanceof Error ? error.message : String(error);
+    const match = message.match(/reverse tcp:(\d+) tcp:\1/);
+    return match?.[1];
+  }
+
+  static async removeAndroidReversePort(port) {
+    const command = `adb ${this.getAdbDeviceFlag()} reverse --remove tcp:${port}`;
+    await execAsync(command);
+    logger.warn(
+      `[launch recovery] Removed conflicting adb reverse tcp:${port}. Retrying app launch once.`,
+    );
+  }
+
+  static async launchAppWithRecovery(launchOptions) {
+    await this.logAndroidReversePorts('before device.launchApp');
+
+    try {
+      return await device.launchApp(launchOptions);
+    } catch (error) {
+      if (!this.isAndroidReverseAddressInUseError(error)) {
+        throw error;
+      }
+
+      const conflictingPort = this.extractConflictingReversePort(error);
+      if (!conflictingPort) {
+        throw error;
+      }
+
+      logger.warn(
+        `[launch recovery] Detected Detox adb reverse port collision on tcp:${conflictingPort}.`,
+      );
+      await this.logAndroidReversePorts(
+        'launch failure before reverse cleanup',
+      );
+      await this.removeAndroidReversePort(conflictingPort);
+      await this.logAndroidReversePorts('after reverse cleanup before retry');
+
+      return device.launchApp(launchOptions);
+    }
+  }
+
   static getDeepLinkUrl(url) {
     return `expo-metamask://expo-development-client/?url=${encodeURIComponent(
       url,
diff --git a/tests/helpers/swap/constants.ts b/tests/helpers/swap/constants.ts
index 1569d25543f4..c07ab445f335 100644
--- a/tests/helpers/swap/constants.ts
+++ b/tests/helpers/swap/constants.ts
@@ -1,3 +1,12 @@
+/**
+ * Wraps quote fixture objects as an SSE-formatted response string.
+ * Required because bridge-controller uses fetchServerEvents (SSE parser)
+ * which expects lines prefixed with "data: ". Raw JSON returns zero quotes.
+ */
+export function toSSEResponse(quotes: object[]): string {
+  return quotes.map((q) => `data: ${JSON.stringify(q)}\n\n`).join('');
+}
+
 export const localNodeOptions = {
   hardfork: 'london',
   mnemonic:
diff --git a/tests/helpers/swap/swap-mocks.ts b/tests/helpers/swap/swap-mocks.ts
index d544c974c107..a37d16bae911 100644
--- a/tests/helpers/swap/swap-mocks.ts
+++ b/tests/helpers/swap/swap-mocks.ts
@@ -18,6 +18,7 @@ import {
   GET_TOKENS_API_USDC_RESPONSE,
   GET_TOKENS_API_USDT_RESPONSE,
   GET_QUOTE_USDC_GOOGLON_RESPONSE,
+  toSSEResponse,
 } from './constants';
 
 const USDC_MAINNET = '0xa0b86991c6218b36c1d19d4a2e9eb0ce3606eb48';
@@ -73,66 +74,164 @@ export const testSpecificMock: TestSpecificMock = async (
 ) => {
   await setupSpotPricesMock(mockServer);
 
-  // Mock ETH->USDC with default 2% slippage
+  // ── SSE path (bridge-controller SSE feature flag ON) ──────────────────────
+  // Catch-all for getQuoteStream with no slippage param (initial render before
+  // useInitialSlippage fires). Registered first so specific mocks below at
+  // priority 999 take precedence. Prevents real network calls that cause
+  // Error: Aborted when the bridge controller aborts the in-flight request.
+  await setupMockRequest(
+    mockServer,
+    {
+      requestMethod: 'GET',
+      url: /getQuoteStream/i,
+      response: toSSEResponse(GET_QUOTE_ETH_USDC_RESPONSE),
+      responseCode: 200,
+    },
+    1, // lower priority than the specific mocks below (999)
+  );
+
+  // Mock ETH->USDC with default 2% slippage (SSE)
+  await setupMockRequest(mockServer, {
+    requestMethod: 'GET',
+    url: /getQuoteStream.*destTokenAddress=0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48.*slippage=2/i,
+    response: toSSEResponse(GET_QUOTE_ETH_USDC_RESPONSE),
+    responseCode: 200,
+  });
+
+  // Mock ETH->USDC with 3.5% custom slippage (SSE)
+  await setupMockRequest(mockServer, {
+    requestMethod: 'GET',
+    url: /getQuoteStream.*destTokenAddress=0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48.*slippage=3\.5/i,
+    response: toSSEResponse(GET_QUOTE_ETH_USDC_RESPONSE_CUSTOM_SLIPPAGE),
+    responseCode: 200,
+  });
+
+  // Mock ETH->DAI (SSE)
+  await setupMockRequest(mockServer, {
+    requestMethod: 'GET',
+    url: /getQuoteStream.*destTokenAddress=0x6B175474E89094C44Da98b954EedeAC495271d0F/i,
+    response: toSSEResponse(GET_QUOTE_ETH_DAI_RESPONSE),
+    responseCode: 200,
+  });
+
+  // Mock USDC->USDT (SSE)
+  await setupMockRequest(mockServer, {
+    requestMethod: 'GET',
+    url: /getQuoteStream.*destTokenAddress=0xdAC17F958D2ee523a2206206994597C13D831ec7/i,
+    response: toSSEResponse(GET_QUOTE_USDC_USDT_RESPONSE),
+    responseCode: 200,
+  });
+
+  // No quote when destination is mUSD (SSE)
+  await setupMockRequest(mockServer, {
+    requestMethod: 'GET',
+    url: /getQuoteStream.*destTokenAddress=0xacA92E438df0B2401fF60dA7E4337B687a2435DA/i,
+    response: '',
+    responseCode: 200,
+  });
+
+  // Mock USDC->ETH (SSE)
+  await setupMockRequest(mockServer, {
+    requestMethod: 'GET',
+    url: /getQuoteStream.*srcTokenAddress=0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48.*destTokenAddress=0x0000000000000000000000000000000000000000/i,
+    response: toSSEResponse(GET_QUOTE_USDC_ETH_RESPONSE),
+    responseCode: 200,
+  });
+
+  // Mock ETH->WETH (SSE)
   await setupMockRequest(mockServer, {
     requestMethod: 'GET',
-    url: /getQuote.*destTokenAddress=0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48.*slippage=2/i,
+    url: /getQuoteStream.*destTokenAddress=0xC02aaA39b223FE8D0A0e5C4F27eAD9083C756Cc2/i,
+    response: toSSEResponse(GET_QUOTE_ETH_WETH_RESPONSE),
+    responseCode: 200,
+  });
+
+  // Mock WETH->ETH (SSE)
+  await setupMockRequest(mockServer, {
+    requestMethod: 'GET',
+    url: /getQuoteStream.*srcTokenAddress=0xC02aaA39b223FE8D0A0e5C4F27eAD9083C756Cc2.*destTokenAddress=0x0000000000000000000000000000000000000000/i,
+    response: toSSEResponse(GET_QUOTE_WETH_ETH_SAME_CHAIN_RESPONSE),
+    responseCode: 200,
+  });
+
+  // ── JSON path (bridge-controller SSE feature flag OFF) ─────────────────────
+  // The bridge controller falls back to fetchBridgeQuotes → /getQuote? (no
+  // "Stream" suffix) returning plain JSON when sse.enabled is false (e.g. local
+  // dev with BRIDGE_USE_DEV_APIS=true). Use /\/getQuote\?/i so the regex matches
+  // "getQuote?" but NOT "getQuoteStream?".
+
+  // Catch-all for getQuote (no slippage / initial render)
+  await setupMockRequest(
+    mockServer,
+    {
+      requestMethod: 'GET',
+      url: /\/getQuote\?/i,
+      response: GET_QUOTE_ETH_USDC_RESPONSE,
+      responseCode: 200,
+    },
+    1, // lower priority than specific mocks below (999)
+  );
+
+  // Mock ETH->USDC with default 2% slippage (JSON)
+  await setupMockRequest(mockServer, {
+    requestMethod: 'GET',
+    url: /\/getQuote\?.*destTokenAddress=0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48.*slippage=2/i,
     response: GET_QUOTE_ETH_USDC_RESPONSE,
     responseCode: 200,
   });
 
-  // Mock ETH->USDC with 3.5% custom slippage
+  // Mock ETH->USDC with 3.5% custom slippage (JSON)
   await setupMockRequest(mockServer, {
     requestMethod: 'GET',
-    url: /getQuote.*destTokenAddress=0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48.*slippage=3.5/i,
+    url: /\/getQuote\?.*destTokenAddress=0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48.*slippage=3\.5/i,
     response: GET_QUOTE_ETH_USDC_RESPONSE_CUSTOM_SLIPPAGE,
     responseCode: 200,
   });
 
-  // Mock ETH->DAI
+  // Mock ETH->DAI (JSON)
   await setupMockRequest(mockServer, {
     requestMethod: 'GET',
-    url: /getQuote.*destTokenAddress=0x6B175474E89094C44Da98b954EedeAC495271d0F/i,
+    url: /\/getQuote\?.*destTokenAddress=0x6B175474E89094C44Da98b954EedeAC495271d0F/i,
     response: GET_QUOTE_ETH_DAI_RESPONSE,
     responseCode: 200,
   });
 
-  // Mock USDC->USDT
+  // Mock USDC->USDT (JSON)
   await setupMockRequest(mockServer, {
     requestMethod: 'GET',
-    url: /getQuote.*destTokenAddress=0xdAC17F958D2ee523a2206206994597C13D831ec7/i,
+    url: /\/getQuote\?.*destTokenAddress=0xdAC17F958D2ee523a2206206994597C13D831ec7/i,
     response: GET_QUOTE_USDC_USDT_RESPONSE,
     responseCode: 200,
   });
 
-  // No need quote when destination is mUSD
+  // No quote when destination is mUSD (JSON)
   await setupMockRequest(mockServer, {
     requestMethod: 'GET',
-    url: /getQuote.*destTokenAddress=0xacA92E438df0B2401fF60dA7E4337B687a2435DA/i,
+    url: /\/getQuote\?.*destTokenAddress=0xacA92E438df0B2401fF60dA7E4337B687a2435DA/i,
     response: [],
     responseCode: 200,
   });
 
-  // Mock USDC->ETH (ETH native token address is 0x0000...0000)
+  // Mock USDC->ETH (JSON)
   await setupMockRequest(mockServer, {
     requestMethod: 'GET',
-    url: /getQuote.*srcTokenAddress=0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48.*destTokenAddress=0x0000000000000000000000000000000000000000/i,
+    url: /\/getQuote\?.*srcTokenAddress=0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48.*destTokenAddress=0x0000000000000000000000000000000000000000/i,
     response: GET_QUOTE_USDC_ETH_RESPONSE,
     responseCode: 200,
   });
 
-  // Mock ETH->WETH (wrapped native)
+  // Mock ETH->WETH (JSON)
   await setupMockRequest(mockServer, {
     requestMethod: 'GET',
-    url: /getQuote.*destTokenAddress=0xC02aaA39b223FE8D0A0e5C4F27eAD9083C756Cc2/i,
+    url: /\/getQuote\?.*destTokenAddress=0xC02aaA39b223FE8D0A0e5C4F27eAD9083C756Cc2/i,
     response: GET_QUOTE_ETH_WETH_RESPONSE,
     responseCode: 200,
   });
 
-  // Mock WETH->ETH (same-chain unwrap for E2E)
+  // Mock WETH->ETH (JSON)
   await setupMockRequest(mockServer, {
     requestMethod: 'GET',
-    url: /getQuote.*srcTokenAddress=0xC02aaA39b223FE8D0A0e5C4F27eAD9083C756Cc2.*destTokenAddress=0x0000000000000000000000000000000000000000/i,
+    url: /\/getQuote\?.*srcTokenAddress=0xC02aaA39b223FE8D0A0e5C4F27eAD9083C756Cc2.*destTokenAddress=0x0000000000000000000000000000000000000000/i,
     response: GET_QUOTE_WETH_ETH_SAME_CHAIN_RESPONSE,
     responseCode: 200,
   });
@@ -169,10 +268,18 @@ export const testSpecificMock: TestSpecificMock = async (
     responseCode: 200,
   });
 
-  // Mock USDC->GOOGLON
+  // Mock USDC->GOOGLON (SSE)
+  await setupMockRequest(mockServer, {
+    requestMethod: 'GET',
+    url: /getQuoteStream.*destTokenAddress=0xba47214edd2bb43099611b208f75e4b42fdcfedc/i,
+    response: toSSEResponse(GET_QUOTE_USDC_GOOGLON_RESPONSE),
+    responseCode: 200,
+  });
+
+  // Mock USDC->GOOGLON (JSON)
   await setupMockRequest(mockServer, {
     requestMethod: 'GET',
-    url: /getQuote.*destTokenAddress=0xba47214edd2bb43099611b208f75e4b42fdcfedc/i,
+    url: /\/getQuote\?.*destTokenAddress=0xba47214edd2bb43099611b208f75e4b42fdcfedc/i,
     response: GET_QUOTE_USDC_GOOGLON_RESPONSE,
     responseCode: 200,
   });
diff --git a/tests/page-objects/Confirmation/TransactionPayConfirmation.ts b/tests/page-objects/Confirmation/TransactionPayConfirmation.ts
index d8d497f25228..527f633b9d06 100644
--- a/tests/page-objects/Confirmation/TransactionPayConfirmation.ts
+++ b/tests/page-objects/Confirmation/TransactionPayConfirmation.ts
@@ -46,7 +46,21 @@ class TransactionPayConfirmation {
     });
   }
 
+  get tokenListScrollView(): Promise<Detox.NativeMatcher> {
+    return Matchers.getIdentifier(
+      TransactionPayComponentIDs.PAY_WITH_TOKEN_LIST,
+    );
+  }
+
   async tapPayWithToken(tokenSymbol: string): Promise<void> {
+    const tokenElement = Matchers.getElementByText(
+      tokenSymbol,
+    ) as unknown as DetoxElement;
+    await Gestures.scrollToElement(tokenElement, this.tokenListScrollView, {
+      direction: 'down',
+      scrollAmount: 200,
+      elemDescription: `Pay With Token ${tokenSymbol}`,
+    });
     await Gestures.waitAndTap(Matchers.getElementByText(tokenSymbol), {
       elemDescription: `Pay With Token ${tokenSymbol}`,
     });
diff --git a/tests/page-objects/Network/NetworkListModal.ts b/tests/page-objects/Network/NetworkListModal.ts
index dff8d5fdd34c..8115cecc9f3a 100644
--- a/tests/page-objects/Network/NetworkListModal.ts
+++ b/tests/page-objects/Network/NetworkListModal.ts
@@ -84,6 +84,22 @@ class NetworkListModal {
     await Gestures.waitAndTap(elem);
   }
 
+  /**
+   * Select a network inside the Custom networks tab.
+   * Uses withAncestor to avoid matching background text elements
+   * that may be partially obscured behind the modal.
+   */
+  async selectNetworkInCustomTab(networkName: string): Promise<void> {
+    const elem = element(
+      by
+        .text(networkName)
+        .withAncestor(
+          by.id(NETWORK_MULTI_SELECTOR_TEST_IDS.CUSTOM_NETWORKS_CONTAINER),
+        ),
+    ) as unknown as DetoxElement;
+    await Gestures.waitAndTap(elem);
+  }
+
   async scrollToBottomOfNetworkList(): Promise<void> {
     await Gestures.swipe(this.networkScroll, 'up', {
       speed: 'fast',
diff --git a/tests/page-objects/Perps/PerpsMarketListView.ts b/tests/page-objects/Perps/PerpsMarketListView.ts
index 2d3fd0b591a8..129b1e752261 100644
--- a/tests/page-objects/Perps/PerpsMarketListView.ts
+++ b/tests/page-objects/Perps/PerpsMarketListView.ts
@@ -22,11 +22,8 @@ class PerpsMarketListView {
     );
   }
 
-  // Search functionality
-  get searchToggleButton() {
-    return Matchers.getElementByID(
-      PerpsMarketListViewSelectorsIDs.SEARCH_TOGGLE_BUTTON,
-    );
+  get searchBar() {
+    return Matchers.getElementByID(PerpsMarketListViewSelectorsIDs.SEARCH_BAR);
   }
 
   get searchClearButton() {
@@ -100,10 +97,6 @@ class PerpsMarketListView {
     });
   }
 
-  async tapSearchToggleButton() {
-    await Gestures.waitAndTap(this.searchToggleButton);
-  }
-
   async tapSearchClearButton() {
     await Gestures.waitAndTap(this.searchClearButton);
   }
diff --git a/tests/page-objects/Ramps/BuildQuoteView.ts b/tests/page-objects/Ramps/BuildQuoteView.ts
index 084ce3d583e4..1d25c3b8c691 100644
--- a/tests/page-objects/Ramps/BuildQuoteView.ts
+++ b/tests/page-objects/Ramps/BuildQuoteView.ts
@@ -1,5 +1,7 @@
 import Matchers from '../../framework/Matchers';
 import Gestures from '../../framework/Gestures';
+import Utilities from '../../framework/Utilities';
+
 import { BuildQuoteSelectors } from '../../../app/components/UI/Ramp/Aggregator/Views/BuildQuote/BuildQuote.testIds';
 import { AddressSelectorSelectors } from '../../../app/components/Views/AddressSelector/AddressSelector.testIds';
 
@@ -104,6 +106,15 @@ class BuildQuoteView {
     });
   }
 
+  async tapContinueButton(): Promise<void> {
+    await Utilities.waitForElementToBeEnabled(this.continueButton);
+
+    await Gestures.waitAndTap(this.continueButton, {
+      timeout: 2500,
+      elemDescription: 'Continue Button in Build Quote View',
+    });
+  }
+
   async tapSelectAddressDropdown(): Promise<void> {
     await Gestures.waitAndTap(this.accountPickerDropdown, {
       elemDescription: 'Account dropdown in address selector',
diff --git a/tests/page-objects/Ramps/KYCScreen.ts b/tests/page-objects/Ramps/KYCScreen.ts
new file mode 100644
index 000000000000..3ce9aa097436
--- /dev/null
+++ b/tests/page-objects/Ramps/KYCScreen.ts
@@ -0,0 +1,60 @@
+import { EnterEmailSelectorsIDs } from '../../../app/components/UI/Ramp/Views/NativeFlow/EnterEmail.testIds';
+import { OtpCodeSelectorsIDs } from '../../../app/components/UI/Ramp/Views/NativeFlow/OtpCode.testIds';
+import { VerifyIdentitySelectorsIDs } from '../../../app/components/UI/Ramp/Views/NativeFlow/VerifyIdentity.testIds';
+import Matchers from '../../framework/Matchers';
+import Gestures from '../../framework/Gestures';
+import { Utilities } from '../../framework';
+class KYCScreen {
+  get verifyIdentityContinueButton(): DetoxElement {
+    return Matchers.getElementByID(VerifyIdentitySelectorsIDs.CONTINUE_BUTTON);
+  }
+
+  get emailInput(): DetoxElement {
+    return Matchers.getElementByID(EnterEmailSelectorsIDs.EMAIL_INPUT);
+  }
+
+  get sendEmailButton(): DetoxElement {
+    return Matchers.getElementByID(EnterEmailSelectorsIDs.SEND_EMAIL_BUTTON);
+  }
+
+  get otpScreen(): DetoxElement {
+    return Matchers.getElementByID(OtpCodeSelectorsIDs.OTP_CODE_SCREEN);
+  }
+
+  get otpCodeInput(): DetoxElement {
+    return Matchers.getElementByID(OtpCodeSelectorsIDs.OTP_CODE_INPUT);
+  }
+
+  async enterOtpCode(code: string): Promise<void> {
+    await Gestures.typeText(this.otpCodeInput, code, {
+      checkVisibility: false,
+      elemDescription: 'OTP code input in Verify your identity View',
+    });
+  }
+  async tapVerifyIdentityContinueButton(): Promise<void> {
+    await Utilities.waitForElementToBeEnabled(
+      this.verifyIdentityContinueButton,
+    );
+
+    await Gestures.waitAndTap(this.verifyIdentityContinueButton, {
+      elemDescription: 'Verify Identity continue button',
+    });
+  }
+
+  async enterEmail(email: string): Promise<void> {
+    await Utilities.waitForElementToBeEnabled(this.emailInput);
+
+    await Gestures.typeText(this.emailInput, email, {
+      hideKeyboard: true,
+      elemDescription: 'Email input',
+    });
+  }
+
+  async tapSendEmail(): Promise<void> {
+    await Gestures.waitAndTap(this.sendEmailButton, {
+      elemDescription: 'Send email button',
+    });
+  }
+}
+
+export default new KYCScreen();
diff --git a/tests/page-objects/Ramps/OrderDetailsView.ts b/tests/page-objects/Ramps/OrderDetailsView.ts
new file mode 100644
index 000000000000..deec2a925b74
--- /dev/null
+++ b/tests/page-objects/Ramps/OrderDetailsView.ts
@@ -0,0 +1,37 @@
+import { RampsOrderDetailsSelectorsIDs } from '../../../app/components/UI/Ramp/Views/OrderDetails/OrderDetails.testIds';
+import Matchers from '../../framework/Matchers';
+import Gestures from '../../framework/Gestures';
+import Utilities from '../../framework/Utilities';
+
+class OrderDetailsView {
+  get container(): DetoxElement {
+    return Matchers.getElementByID(RampsOrderDetailsSelectorsIDs.CONTAINER);
+  }
+
+  get closeButton(): DetoxElement {
+    return Matchers.getElementByID(RampsOrderDetailsSelectorsIDs.CLOSE_BUTTON);
+  }
+
+  get tokenAmount(): DetoxElement {
+    return Matchers.getElementByID(RampsOrderDetailsSelectorsIDs.TOKEN_AMOUNT);
+  }
+  get backButton(): DetoxElement {
+    return Matchers.getElementByID(RampsOrderDetailsSelectorsIDs.BACK_BUTTON);
+  }
+
+  async tapCloseButton(): Promise<void> {
+    await Utilities.waitForElementToBeEnabled(this.closeButton);
+    await Gestures.waitAndTap(this.closeButton, {
+      timeout: 2500,
+      elemDescription: 'Ramps Order Details Close Button',
+    });
+  }
+
+  async tapBackButton(): Promise<void> {
+    await Gestures.waitAndTap(this.backButton, {
+      elemDescription: 'Ramps Order Details Back Button',
+    });
+  }
+}
+
+export default new OrderDetailsView();
diff --git a/tests/page-objects/Send/RedesignedSendView.ts b/tests/page-objects/Send/RedesignedSendView.ts
index 36dcb74e2681..567a0daec687 100644
--- a/tests/page-objects/Send/RedesignedSendView.ts
+++ b/tests/page-objects/Send/RedesignedSendView.ts
@@ -127,6 +127,7 @@ class SendView {
     await Utilities.waitForElementToBeEnabled(this.reviewButton);
     await Gestures.waitAndTap(this.reviewButton, {
       elemDescription: 'Review button',
+      checkStability: true,
     });
   }
 
diff --git a/tests/page-objects/Send/TransactionConfirmView.ts b/tests/page-objects/Send/TransactionConfirmView.ts
index ab17d40a4027..9fb8b53aa459 100644
--- a/tests/page-objects/Send/TransactionConfirmView.ts
+++ b/tests/page-objects/Send/TransactionConfirmView.ts
@@ -164,6 +164,12 @@ class TransactionConfirmationView {
       elemDescription: 'Gas Fee Token Pill in Confirmation View',
     });
   }
+
+  async tapAdvancedDetails(): Promise<void> {
+    await Gestures.waitAndTap(RowComponents.AdvancedDetails, {
+      elemDescription: 'Advanced details in Confirmation View',
+    });
+  }
 }
 
 export default new TransactionConfirmationView();
diff --git a/tests/page-objects/Settings/SecurityAndPrivacy/RevealSecretRecoveryPhrase.ts b/tests/page-objects/Settings/SecurityAndPrivacy/RevealSecretRecoveryPhrase.ts
index c12839f743b9..a7b5e88238e3 100644
--- a/tests/page-objects/Settings/SecurityAndPrivacy/RevealSecretRecoveryPhrase.ts
+++ b/tests/page-objects/Settings/SecurityAndPrivacy/RevealSecretRecoveryPhrase.ts
@@ -4,6 +4,7 @@ import {
 } from '../../../../app/components/Views/RevealPrivateCredential/RevealSeedView.testIds';
 import Matchers from '../../../framework/Matchers';
 import Gestures from '../../../framework/Gestures';
+import Utilities from '../../../framework/Utilities';
 
 class RevealSecretRecoveryPhrase {
   get container(): DetoxElement {
@@ -71,13 +72,46 @@ class RevealSecretRecoveryPhrase {
     );
   }
 
+  get confirmButton(): DetoxElement {
+    return Matchers.getElementByID(
+      RevealSeedViewSelectorsIDs.SECRET_RECOVERY_PHRASE_NEXT_BUTTON_ID,
+    );
+  }
+
   async enterPasswordToRevealSecretCredential(password: string): Promise<void> {
+    // Wait for password screen to be ready (e.g. after navigation or quiz on iOS/Android CI)
+    await Utilities.waitForElementToBeVisible(
+      this.passwordInputToRevealCredential,
+      15000,
+    );
     await Gestures.typeText(this.passwordInputToRevealCredential, password, {
       hideKeyboard: true,
       elemDescription: 'Password input to reveal credential',
     });
   }
 
+  async tapConfirmButton(): Promise<void> {
+    await Gestures.waitAndTap(this.confirmButton, {
+      elemDescription: 'Confirm button to reveal credential',
+    });
+  }
+
+  /**
+   * Check if the component is already unlocked (blur overlay / "Tap to reveal" visible).
+   * Waits up to 3s so we can detect transition after keyboard submit (onSubmitEditing → tryUnlock).
+   */
+  async isUnlocked(): Promise<boolean> {
+    try {
+      await Utilities.waitForElementToBeVisible(
+        this.revealSecretRecoveryPhraseButton,
+        3000,
+      );
+      return true;
+    } catch {
+      return false;
+    }
+  }
+
   async tapToReveal(): Promise<void> {
     await Gestures.waitAndTap(this.revealSecretRecoveryPhraseButton, {
       elemDescription: 'Reveal secret recovery phrase button',
diff --git a/tests/page-objects/Transactions/ActivitiesView.ts b/tests/page-objects/Transactions/ActivitiesView.ts
index 7ce77fd906f8..ce9de95907ff 100644
--- a/tests/page-objects/Transactions/ActivitiesView.ts
+++ b/tests/page-objects/Transactions/ActivitiesView.ts
@@ -2,6 +2,12 @@ import {
   ActivitiesViewSelectorsIDs,
   ActivitiesViewSelectorsText,
 } from '../../../app/components/Views/ActivityView/ActivitiesView.testIds';
+import {
+  getOrderRowFiatAmountTestId,
+  getOrderRowCryptoAmountTestId,
+  getOrderRowTestId,
+  type RampsOrderTypeSlug,
+} from '../../../app/components/UI/Ramp/Aggregator/Views/OrdersList/OrdersList.testIds';
 import Matchers from '../../framework/Matchers';
 import Gestures from '../../framework/Gestures';
 import Assertions from '../../framework/Assertions';
@@ -15,6 +21,9 @@ class ActivitiesView {
       ActivitiesViewSelectorsText.PREDICTIONS_TAB,
     );
   }
+  get transferTab(): DetoxElement {
+    return Matchers.getElementByID(ActivitiesViewSelectorsIDs.TRANSFER_TAB);
+  }
 
   get tabsBar(): DetoxElement {
     return Matchers.getElementByID(
@@ -137,6 +146,12 @@ class ActivitiesView {
     });
   }
 
+  async tapOnTransfersTab(): Promise<void> {
+    await Gestures.waitAndTap(this.transferTab, {
+      elemDescription: 'Transfer Tab in Activity View',
+    });
+  }
+
   async tapPredictPosition(positionName: string): Promise<void> {
     const el = Matchers.getElementByText(positionName);
     await Gestures.waitAndTap(el, {
@@ -144,6 +159,36 @@ class ActivitiesView {
     });
   }
 
+  rampsOrderCryptoAmount(
+    orderType: RampsOrderTypeSlug,
+    rowIndex: number,
+  ): DetoxElement {
+    return Matchers.getElementByID(
+      getOrderRowCryptoAmountTestId(orderType, rowIndex),
+    );
+  }
+
+  rampsOrderFiatAmount(
+    orderType: RampsOrderTypeSlug,
+    rowIndex: number,
+  ): DetoxElement {
+    return Matchers.getElementByID(
+      getOrderRowFiatAmountTestId(orderType, rowIndex),
+    );
+  }
+
+  async tapRampsOrder(
+    orderType: RampsOrderTypeSlug,
+    rowIndex: number,
+  ): Promise<void> {
+    const order = Matchers.getElementByID(
+      getOrderRowTestId(orderType, rowIndex),
+    );
+    await Gestures.waitAndTap(order, {
+      elemDescription: `Tapping Ramps Order: ${orderType} ${rowIndex}`,
+    });
+  }
+
   /**
    * Verifies that an activity item with the given title is visible and its row status matches.
    * Use after TabBarComponent.tapActivity(). Row 0 is the most recent transaction.
diff --git a/tests/page-objects/Trending/TrendingView.ts b/tests/page-objects/Trending/TrendingView.ts
index 055dfae8f9b5..3ee43ed98524 100644
--- a/tests/page-objects/Trending/TrendingView.ts
+++ b/tests/page-objects/Trending/TrendingView.ts
@@ -195,6 +195,7 @@ class TrendingView {
 
     await Gestures.tap(quickActionButton, {
       elemDescription: `Tap QuickAction button for ${sectionTitle}`,
+      checkStability: true, // Wait for element to stop moving after horizontal scroll
     });
   }
 
@@ -217,6 +218,7 @@ class TrendingView {
 
     await Gestures.tap(viewAllButton, {
       elemDescription: `Tap View All for ${sectionTitle}`,
+      checkStability: true, // Wait for element to stop moving after scroll
     });
   }
 
diff --git a/tests/page-objects/wallet/LoginView.ts b/tests/page-objects/wallet/LoginView.ts
index abb9a7d07ab7..00c874cf61cf 100644
--- a/tests/page-objects/wallet/LoginView.ts
+++ b/tests/page-objects/wallet/LoginView.ts
@@ -1,14 +1,35 @@
 import { LoginViewSelectors } from '../../../app/components/Views/Login/LoginView.testIds';
 import Matchers from '../../framework/Matchers';
 import Gestures from '../../framework/Gestures';
+import {
+  encapsulated,
+  EncapsulatedElementType,
+  asPlaywrightElement,
+} from '../../framework/EncapsulatedElement';
+import { encapsulatedAction } from '../../framework/encapsulatedAction';
+import PlaywrightMatchers from '../../framework/PlaywrightMatchers';
+import UnifiedGestures from '../../framework/UnifiedGestures';
+import { OnboardingSelectorText } from '../../../app/components/Views/Onboarding/Onboarding.testIds';
 
 class LoginView {
   get container(): DetoxElement {
     return Matchers.getElementByID(LoginViewSelectors.CONTAINER);
   }
 
-  get passwordInput(): DetoxElement {
-    return Matchers.getElementByID(LoginViewSelectors.PASSWORD_INPUT);
+  get passwordInput(): EncapsulatedElementType {
+    return encapsulated({
+      detox: () => Matchers.getElementByID(LoginViewSelectors.PASSWORD_INPUT),
+      appium: {
+        android: () =>
+          PlaywrightMatchers.getElementById(LoginViewSelectors.PASSWORD_INPUT, {
+            exact: true,
+          }),
+        ios: () =>
+          PlaywrightMatchers.getElementByAccessibilityId(
+            LoginViewSelectors.PASSWORD_INPUT,
+          ),
+      },
+    });
   }
 
   get forgotPasswordButton(): DetoxElement {
@@ -19,14 +40,27 @@ class LoginView {
     return Matchers.getElementByID(LoginViewSelectors.REMEMBER_ME_SWITCH);
   }
 
-  get loginButton(): DetoxElement {
-    return Matchers.getElementByID(LoginViewSelectors.LOGIN_BUTTON_ID);
+  get loginButton(): EncapsulatedElementType {
+    return encapsulated({
+      detox: () => Matchers.getElementByID(LoginViewSelectors.LOGIN_BUTTON_ID),
+      appium: () =>
+        PlaywrightMatchers.getElementByText(
+          OnboardingSelectorText.UNLOCK_BUTTON,
+        ),
+    });
+  }
+
+  get title(): EncapsulatedElementType {
+    return encapsulated({
+      detox: () => Matchers.getElementByID(LoginViewSelectors.TITLE_ID),
+      appium: () =>
+        PlaywrightMatchers.getElementById(LoginViewSelectors.LOGIN_BUTTON_ID),
+    });
   }
 
   async enterPassword(password: string): Promise<void> {
-    await Gestures.typeText(this.passwordInput, password, {
-      hideKeyboard: true,
-      elemDescription: 'Password Input',
+    await UnifiedGestures.typeText(this.passwordInput, password, {
+      description: 'Password Input',
     });
   }
 
@@ -43,8 +77,17 @@ class LoginView {
   }
 
   async tapLoginButton(): Promise<void> {
-    await Gestures.waitAndTap(this.loginButton, {
-      elemDescription: 'Login Button',
+    await UnifiedGestures.waitAndTap(this.loginButton, {
+      description: 'Login Button',
+    });
+  }
+
+  async waitForScreenToDisplay(): Promise<void> {
+    await encapsulatedAction({
+      appium: async () => {
+        const element = await asPlaywrightElement(this.title);
+        await element.waitForDisplayed({ timeout: 15000 });
+      },
     });
   }
 }
diff --git a/tests/page-objects/wallet/WalletView.ts b/tests/page-objects/wallet/WalletView.ts
index 40a2d21cd26b..e49e87410692 100644
--- a/tests/page-objects/wallet/WalletView.ts
+++ b/tests/page-objects/wallet/WalletView.ts
@@ -14,6 +14,15 @@ import Matchers from '../../framework/Matchers';
 import TestHelpers from '../../helpers.js';
 import Assertions from '../../framework/Assertions';
 import Utilities from '../../framework/Utilities';
+import {
+  encapsulated,
+  EncapsulatedElementType,
+  asPlaywrightElement,
+  asDetoxElement,
+} from '../../framework/EncapsulatedElement';
+import { encapsulatedAction } from '../../framework/encapsulatedAction';
+import PlaywrightMatchers from '../../framework/PlaywrightMatchers';
+import { PlatformDetector } from '../../framework/PlatformLocator';
 
 class WalletView {
   static readonly MAX_SCROLL_ITERATIONS = 8;
@@ -100,8 +109,15 @@ class WalletView {
     return Matchers.getElementByID(WalletViewSelectorsIDs.NETWORK_NAME);
   }
 
-  get totalBalance(): DetoxElement | DetoxMatcher {
-    return Matchers.getElementByID(WalletViewSelectorsIDs.TOTAL_BALANCE_TEXT);
+  get totalBalance(): EncapsulatedElementType {
+    return encapsulated({
+      detox: () =>
+        Matchers.getElementByID(WalletViewSelectorsIDs.TOTAL_BALANCE_TEXT),
+      appium: () =>
+        PlaywrightMatchers.getElementById(
+          WalletViewSelectorsIDs.TOTAL_BALANCE_TEXT,
+        ),
+    });
   }
 
   get accountName(): DetoxElement {
@@ -218,6 +234,13 @@ class WalletView {
     await Assertions.expectElementToBeVisible(elem, {
       description: `${tokenLabel} token in wallet list`,
     });
+    // Wait for the token list to finish loading/reordering before tapping.
+    // New tokens appearing asynchronously can shift positions mid-tap.
+    await Utilities.waitForElementToStopMoving(elem, {
+      timeout: 5000,
+      interval: 500,
+      stableCount: 6,
+    });
     await Gestures.waitAndTap(elem, {
       elemDescription: 'Token',
     });
@@ -226,7 +249,6 @@ class WalletView {
   async tapIdenticon(): Promise<void> {
     await Gestures.waitAndTap(this.accountIcon, {
       elemDescription: 'Top Account Icon',
-      checkStability: true,
     });
   }
 
@@ -565,9 +587,99 @@ class WalletView {
     });
   }
 
+  async waitForBalanceToStabilize(
+    options: {
+      maxWaitTime?: number;
+      pollInterval?: number;
+      sameResultTimeout?: number;
+    } = {},
+  ): Promise<string> {
+    const {
+      maxWaitTime = 60000,
+      pollInterval = 100,
+      sameResultTimeout = 8000,
+    } = options;
+
+    let result = '';
+    await encapsulatedAction({
+      appium: async () => {
+        const startTime = Date.now();
+        const isIOS = await PlatformDetector.isIOS();
+
+        if (isIOS) {
+          // iOS: Element lookups are extremely slow (15-30s each).
+          // Skip stability loop and just wait for a valid balance once.
+          let previousBalance = '';
+          while (Date.now() - startTime < maxWaitTime) {
+            try {
+              const balanceEl = await asPlaywrightElement(this.totalBalance);
+              const rawBalance = await balanceEl.textContent();
+              const balance = (rawBalance || '').trim();
+              previousBalance = balance;
+
+              if (balance && balance !== '' && balance !== '$0.00') {
+                result = balance;
+                return;
+              }
+            } catch {
+              // Element not found yet, retry
+            }
+            await new Promise((r) => setTimeout(r, 1000));
+          }
+          result = previousBalance;
+          return;
+        }
+
+        // Android: Fast element lookups, use stability polling
+        let previousBalance = '';
+        let sameResultStartTime: number | null = null;
+
+        while (true) {
+          if (Date.now() - startTime > maxWaitTime) {
+            result = previousBalance;
+            return;
+          }
+
+          let currentBalance: string;
+          try {
+            const balanceEl = await asPlaywrightElement(this.totalBalance);
+            const rawBalance = await balanceEl.textContent();
+            currentBalance = (rawBalance || '').trim();
+          } catch {
+            await new Promise((r) => setTimeout(r, pollInterval));
+            continue;
+          }
+
+          if (
+            !currentBalance ||
+            currentBalance === '' ||
+            currentBalance === '$0.00'
+          ) {
+            await new Promise((r) => setTimeout(r, pollInterval));
+            continue;
+          }
+
+          if (currentBalance === previousBalance && sameResultStartTime) {
+            const timeSinceSameResult = Date.now() - sameResultStartTime;
+            if (timeSinceSameResult >= sameResultTimeout) {
+              result = currentBalance;
+              return;
+            }
+          } else {
+            sameResultStartTime = Date.now();
+            previousBalance = currentBalance;
+          }
+
+          await new Promise((r) => setTimeout(r, pollInterval));
+        }
+      },
+    });
+    return result;
+  }
+
   // TODO test this
   async getBalanceText(): Promise<string> {
-    const balanceElement = this.totalBalance;
+    const balanceElement = asDetoxElement(this.totalBalance);
     await Assertions.expectElementToBeVisible(balanceElement);
 
     const elem = await balanceElement;
diff --git a/tests/performance/README.md b/tests/performance/README.md
index 113555d6284b..610b9ef58b36 100644
--- a/tests/performance/README.md
+++ b/tests/performance/README.md
@@ -275,6 +275,14 @@ Integration tests for MetaMask Connect:
 - `connection-evm.spec.js` - EVM connection performance
 - `connection-multichain.spec.js` - Multichain connection performance
 - `connection-wagmi.spec.js` - Wagmi integration performance
+- `multichain-rn-connect.spec.js` - Multichain + Solana via the React Native Playground APK
+- `legacy-evm-rn-connect.spec.js` - Legacy EVM connection via the React Native Playground APK
+
+> The RN playground tests require a separate APK built from the
+> [`playground/react-native-playground`](https://github.com/MetaMask/connect-monorepo/tree/main/playground/react-native-playground)
+> directory of the [connect-monorepo](https://github.com/MetaMask/connect-monorepo).
+> The APK must be installed on the emulator before running.
+> See [`tests/performance/mm-connect/README.md`](mm-connect/README.md) for full setup instructions.
 
 ## Performance Tracking System
 
@@ -557,6 +565,29 @@ TEST_PASSWORD_LOGIN="your test password"
 TEST_PASSWORD_ONBOARDING="your onboarding password"
 ```
 
+### Sentry Performance Instrumentation (Optional)
+
+If you want each Appwright performance scenario to upload timer data to Sentry,
+set the following variables in `.e2e.env`:
+
+```bash
+# Required to enable upload
+E2E_PERFORMANCE_SENTRY_DSN="https://<publicKey>@<host>/<projectId>"
+
+# Optional controls
+E2E_PERFORMANCE_SENTRY_ENABLED=true
+E2E_PERFORMANCE_SENTRY_SAMPLE_RATE=1
+E2E_PERFORMANCE_SENTRY_ENVIRONMENT="e2e-performance"
+E2E_PERFORMANCE_SENTRY_RELEASE="mm-mobile-e2e-<build>"
+```
+
+What gets sent per scenario:
+
+- One Sentry `transaction` event per scenario
+- Each test timer as a numeric measurement (duration in milliseconds)
+- Scenario metadata (test name, project, tags, team, retry, worker)
+- Timer details (thresholds and pass/fail validation) in `extra.timer_steps`
+
 ## Reports and Metrics
 
 ### Per-Test Reports
diff --git a/tests/performance/mm-connect/README.md b/tests/performance/mm-connect/README.md
new file mode 100644
index 000000000000..e2abbbb38329
--- /dev/null
+++ b/tests/performance/mm-connect/README.md
@@ -0,0 +1,283 @@
+# MetaMask Connect E2E Tests
+
+This directory contains Appwright-based E2E tests for MetaMask Connect flows.
+
+## Test Files
+
+| File                            | Description                                                   |
+| ------------------------------- | ------------------------------------------------------------- |
+| `connection-evm.spec.js`        | Legacy EVM connection via Browser Playground in Chrome        |
+| `connection-multichain.spec.js` | Multichain API connection via Browser Playground in Chrome    |
+| `connection-wagmi.spec.js`      | Wagmi connector via Browser Playground in Chrome              |
+| `multichain-rn-connect.spec.js` | **Multichain + Solana via the React Native Playground APK**   |
+| `legacy-evm-rn-connect.spec.js` | **Legacy EVM connection via the React Native Playground APK** |
+
+## React Native Playground Setup
+
+The `multichain-rn-connect` test interacts with **two native Android apps** at the
+same time — the MetaMask wallet and the React Native Playground
+(`@metamask/react-native-playground`). The wallet APK is installed by Appwright;
+the playground APK must be **built beforehand**. The test's `beforeAll` hook
+automatically **uninstalls and reinstalls** it on the emulator every run.
+
+### Prerequisites
+
+| Requirement                 | Details                                                      |
+| --------------------------- | ------------------------------------------------------------ |
+| Android emulator            | Running and reachable via `adb`                              |
+| MetaMask wallet APK         | Built or pointed to via `buildPath` in `appwright.config.ts` |
+| `connect-monorepo` checkout | Cloned **next to** `metamask-mobile` (same parent directory) |
+
+Expected directory layout:
+
+```
+Documents/MetaMask/          # or wherever you keep these repos
+├── metamask-mobile/         # this repo
+└── connect-monorepo/        # https://github.com/MetaMask/connect-monorepo
+    └── playground/
+        └── react-native-playground/
+```
+
+### Build the Playground APK
+
+You must build the release APK **manually** before running the test, and
+**rebuild** whenever you change the playground source code. The release variant
+is required because the debug variant expects a Metro dev server at runtime.
+
+#### First-time setup
+
+Run all five steps below from your terminal. Each command is self-contained
+(no implicit working directory from a previous step).
+
+**Step 1 — Install monorepo dependencies:**
+
+```bash
+cd /path/to/connect-monorepo
+yarn install
+```
+
+**Step 2 — Build all workspace packages** (so `@metamask/connect-evm`,
+`@metamask/playground-ui`, etc. have their `dist/` output):
+
+```bash
+cd /path/to/connect-monorepo
+yarn build
+```
+
+**Step 3 — Configure your Infura API key:**
+
+The playground uses Infura RPC endpoints for blockchain requests. Copy the
+example `.env` file and add your key:
+
+```bash
+cd /path/to/connect-monorepo/playground/react-native-playground
+cp .env.example .env
+```
+
+Then edit `.env` and set your Infura API key:
+
+```
+EXPO_PUBLIC_INFURA_API_KEY=your_infura_api_key_here
+```
+
+> You can reuse the same key from `metamask-mobile/.js.env`
+> (`MM_INFURA_PROJECT_ID`).
+
+**Step 4 — Generate the native Android project** (only needed once, or after
+deleting the `android/` directory):
+
+```bash
+cd /path/to/connect-monorepo/playground/react-native-playground
+npx expo prebuild --platform android
+```
+
+**Step 5 — Build the release APK:**
+
+```bash
+cd /path/to/connect-monorepo/playground/react-native-playground/android
+./gradlew assembleRelease
+```
+
+The first build takes ~7 minutes. Subsequent builds are incremental and much
+faster. The output APK will be at:
+
+```
+connect-monorepo/playground/react-native-playground/android/app/build/outputs/apk/release/app-release.apk
+```
+
+#### Rebuilding after changes
+
+When you edit the playground source, run the build command again:
+
+```bash
+cd /path/to/connect-monorepo/playground/react-native-playground/android
+./gradlew assembleRelease
+```
+
+If you also changed shared workspace packages (e.g. `@metamask/playground-ui`),
+rebuild those first:
+
+```bash
+cd /path/to/connect-monorepo
+yarn build
+```
+
+Then run `./gradlew assembleRelease` as above.
+
+### Automatic Install on Each Test Run
+
+The test's `beforeAll` hook automatically **uninstalls** any existing version
+of the playground from the emulator and **installs** the pre-built release APK.
+This guarantees the device always has the latest APK you built, and avoids
+stale debug-vs-release mismatches.
+
+### Running the Test
+
+Before running, make sure the `mm-connect-android-local` project in
+`tests/appwright.config.ts` matches your local emulator:
+
+```ts
+// tests/appwright.config.ts — adjust to your emulator
+{
+  name: 'mm-connect-android-local',
+  use: {
+    device: {
+      name: 'Samsung Galaxy S24 Ultra', // ← your AVD name
+      osVersion: '14',                  // ← your AVD API level
+    },
+    buildPath: 'PATH-TO-BUILD',         // ← path to your MetaMask .apk
+  },
+}
+```
+
+Then run:
+
+```bash
+# From the metamask-mobile root
+yarn run-appwright:mm-connect-android-local
+```
+
+Or run individual RN playground specs:
+
+```bash
+# Multichain + Solana test
+npx appwright test tests/performance/mm-connect/multichain-rn-connect.spec.js \
+  --project mm-connect-android-local \
+  --config tests/appwright.config.ts
+
+# Legacy EVM test
+npx appwright test tests/performance/mm-connect/legacy-evm-rn-connect.spec.js \
+  --project mm-connect-android-local \
+  --config tests/appwright.config.ts
+```
+
+### What the Test Covers
+
+The `multichain-rn-connect` test validates five areas of the multichain
+MetaMask Connect flow:
+
+1. **Simultaneous multi-chain connection** — connects to Ethereum, Linea,
+   Polygon, and Solana in a single session and verifies all scope cards appear.
+
+2. **Read request routing** — invokes `eth_blockNumber` on each EVM chain and
+   `getGenesisHash` on Solana. These are handled directly by the RPC layer
+   without opening MetaMask.
+
+3. **Write request routing** — invokes `personal_sign` on each EVM chain and
+   `signMessage` on Solana. Each write request opens MetaMask for approval,
+   allowing the test to verify the request was routed to the correct network.
+
+4. **Session termination** — disconnects via the Multichain SDK
+   (`sdk.disconnect()`, the equivalent of `wallet_revokeSession`) and verifies
+   the session is fully terminated on both the dApp and wallet sides.
+
+The `legacy-evm-rn-connect` test validates the Legacy EVM connection flow:
+
+1. **accountsChanged propagation** — connects via the Legacy EVM SDK and
+   verifies the dapp receives accounts and displays the active account.
+
+2. **personal_sign** — sends a personal_sign request, approves it in the
+   wallet, and verifies the signature is returned to the dapp.
+
+3. **eth_sendTransaction (cancel)** — sends a transaction request, cancels it
+   in the wallet (to avoid spending funds), and verifies the dapp handles the
+   rejection.
+
+4. **Chain switching from the dapp** — calls `wallet_switchEthereumChain` to
+   switch to Polygon from the dapp side and verifies the chain ID updates.
+
+5. **Chain switching from the wallet** — switches to Ethereum Mainnet in the
+   wallet's network picker and verifies the dapp receives the `chainChanged`
+   event.
+
+### How It Works
+
+Unlike the browser-based tests (which serve a web dApp in Chrome and use
+WebView context switching), this test operates with **two native Android apps**:
+
+```
+┌──────────────────┐   deeplink    ┌──────────────────┐
+│  RN Playground   │ ───────────►  │  MetaMask Wallet  │
+│  (separate APK)  │ ◄────────── │  (app under test) │
+│                  │   callback    │                   │
+└──────────────────┘   deeplink    └──────────────────┘
+```
+
+- Both apps stay in the `NATIVE_APP` Appium context (no WebView switching).
+- `device.activateApp(packageId)` switches focus between the two apps.
+- The playground calls `Linking.openURL(metamask://…)` to open MetaMask;
+  MetaMask sends a callback deeplink (`multichainrn://…`) to return.
+
+### Troubleshooting
+
+**`Unable to resolve the launchable activity of 'com.anonymous.multichainrnplayground'`**
+
+The playground APK is not installed on the emulator. Follow the
+[Build the Playground APK](#build-the-playground-apk) steps above.
+
+**`Unable to load script. Make sure you're running Metro...`**
+
+You installed the **debug** APK instead of the **release** APK. Debug builds
+require a live Metro dev server. Rebuild with `./gradlew assembleRelease` and
+reinstall (`adb install app/build/outputs/apk/release/app-release.apk`).
+
+**`RPCErr50: 401 on https://mainnet.infura.io/v3/ for method POST`**
+
+The Infura API key is missing or was not inlined during the APK build. Make
+sure the `.env` file in `connect-monorepo/playground/react-native-playground/`
+contains a valid `EXPO_PUBLIC_INFURA_API_KEY`. After updating the key you must
+clear the build cache and rebuild:
+
+```bash
+cd /path/to/connect-monorepo/playground/react-native-playground
+rm -rf android/app/build
+cd android && ./gradlew assembleRelease
+```
+
+**Playground APK is installed but the test can't interact with it**
+
+Make sure only one emulator is running (`adb devices` should show a single
+entry). If multiple devices are connected, prefix commands with
+`-s emulator-5554` or similar.
+
+**Picker dropdown doesn't select the right method**
+
+The test selects methods by exact text match (`getElementByText`). If the
+method list in the playground changes, update the method names in the spec
+(e.g., `personal_sign`, `getGenesisHash`, `signMessage`).
+
+**MetaMask auto-locks during the test**
+
+The `unlockIfLockScreenVisible` helper detects the lock screen and re-enters
+the password. If the test consistently fails at a late step, consider
+increasing the wallet's auto-lock timeout in Settings before running.
+
+## Browser Playground Tests
+
+The other three spec files (`connection-evm`, `connection-multichain`,
+`connection-wagmi`) use a **local web server** that serves the Browser
+Playground dApp in Chrome. These tests do not require a separate APK — the dApp
+server is started automatically in `test.beforeAll`.
+
+See the [parent README](../README.md) for details on BrowserStack Local setup
+and other run configurations.
diff --git a/tests/performance/mm-connect/connection-evm.spec.js b/tests/performance/mm-connect/connection-evm.spec.js
index d2a7511687a0..0e0fa6db6c7e 100644
--- a/tests/performance/mm-connect/connection-evm.spec.js
+++ b/tests/performance/mm-connect/connection-evm.spec.js
@@ -1,11 +1,12 @@
-import { test } from 'appwright';
+import { test } from '../../framework/fixtures/performance';
+import TimerHelper from '../../framework/TimerHelper';
 
 import { login } from '../../framework/utils/Flows.js';
 import {
-  launchMobileBrowser,
+  switchToMobileBrowser,
   navigateToDapp,
   refreshMobileBrowser,
-  switchToMobileBrowser,
+  launchMobileBrowser,
 } from '../../framework/utils/MobileBrowser.js';
 import WalletMainScreen from '../../../wdio/screen-objects/WalletMainScreen.js';
 import BrowserPlaygroundDapp from '../../../wdio/screen-objects/BrowserPlaygroundDapp.js';
@@ -23,6 +24,7 @@ import {
   cleanupAdbReverse,
   waitForDappServerReady,
   unlockIfLockScreenVisible,
+  ensureAccountGroupsFinishedLoading,
 } from './utils.js';
 
 const DAPP_NAME = 'MetaMask MultiChain API Test Dapp';
@@ -58,6 +60,7 @@ test.afterAll(async () => {
 
 test('@metamask/connect-evm - Connect via EVM Legacy Connection to Local Browser Playground', async ({
   device,
+  performanceTracker,
 }) => {
   const platform = device.getPlatform?.() || 'android';
   const useBrowserStackLocal =
@@ -80,8 +83,35 @@ test('@metamask/connect-evm - Connect via EVM Legacy Connection to Local Browser
     shouldWaitForQuiescence: false,
   });
 
+  const connectTimer = new TimerHelper(
+    'Time from tapping Connect (Legacy) to dapp confirming EVM connected state',
+    { ios: 20000, android: 30000 },
+    device,
+  );
+  const signTimer = new TimerHelper(
+    'Time from tapping Personal Sign to dapp displaying signature response',
+    { ios: 12000, android: 18000 },
+    device,
+  );
+  const switchChainTimer = new TimerHelper(
+    'Time from tapping Switch to Polygon to dapp confirming chain ID 0x89',
+    { ios: 12000, android: 18000 },
+    device,
+  );
+  const refreshReconnectTimer = new TimerHelper(
+    'Time from refreshing browser to dapp confirming EVM still connected',
+    { ios: 8000, android: 12000 },
+    device,
+  );
+  const reconnectTimer = new TimerHelper(
+    'Time from tapping Connect (Legacy) after disconnect to dapp confirming reconnected',
+    { ios: 20000, android: 30000 },
+    device,
+  );
+
   await AppwrightHelpers.withNativeAction(device, async () => {
     await login(device);
+    await ensureAccountGroupsFinishedLoading(device);
     await launchMobileBrowser(device);
     await navigateToDapp(device, DAPP_URL, DAPP_NAME);
   });
@@ -90,6 +120,7 @@ test('@metamask/connect-evm - Connect via EVM Legacy Connection to Local Browser
   await AppwrightHelpers.withWebAction(
     device,
     async () => {
+      connectTimer.start();
       await BrowserPlaygroundDapp.tapConnectLegacy();
     },
     DAPP_URL,
@@ -112,8 +143,10 @@ test('@metamask/connect-evm - Connect via EVM Legacy Connection to Local Browser
     device,
     async () => {
       await BrowserPlaygroundDapp.assertConnected(true);
+      connectTimer.stop();
       await BrowserPlaygroundDapp.assertChainIdValue('0x1');
       await BrowserPlaygroundDapp.assertActiveAccount(ACCOUNT_1_ADDRESS);
+      signTimer.start();
       await BrowserPlaygroundDapp.tapPersonalSign();
     },
     DAPP_URL,
@@ -135,6 +168,7 @@ test('@metamask/connect-evm - Connect via EVM Legacy Connection to Local Browser
         // Account 1 signed the message
         '0x361c13288b4ab02d50974efddf9e4e7ca651b81c298b614be908c4754abb1dd8328224645a1a8d0fab561c4b855c7bdcebea15db5ae8d1778a1ea791dbd05c2a1b',
       );
+      signTimer.stop();
       await BrowserPlaygroundDapp.tapSendTransaction();
     },
     DAPP_URL,
@@ -155,6 +189,7 @@ test('@metamask/connect-evm - Connect via EVM Legacy Connection to Local Browser
     async () => {
       // Note: Error message may differ slightly in browser playground
       await BrowserPlaygroundDapp.assertResponseValue('denied');
+      switchChainTimer.start();
       await BrowserPlaygroundDapp.tapSwitchToPolygon();
     },
     DAPP_URL,
@@ -174,6 +209,7 @@ test('@metamask/connect-evm - Connect via EVM Legacy Connection to Local Browser
     device,
     async () => {
       await BrowserPlaygroundDapp.assertChainIdValue('0x89');
+      switchChainTimer.stop();
       await BrowserPlaygroundDapp.tapSendTransaction();
     },
     DAPP_URL,
@@ -227,6 +263,7 @@ test('@metamask/connect-evm - Connect via EVM Legacy Connection to Local Browser
   );
 
   await AppwrightHelpers.withNativeAction(device, async () => {
+    refreshReconnectTimer.start();
     await refreshMobileBrowser(device);
   });
   await new Promise((resolve) => setTimeout(resolve, 2000));
@@ -235,6 +272,7 @@ test('@metamask/connect-evm - Connect via EVM Legacy Connection to Local Browser
     device,
     async () => {
       await BrowserPlaygroundDapp.assertConnected(true);
+      refreshReconnectTimer.stop();
       await BrowserPlaygroundDapp.assertChainIdValue('0x1');
       await BrowserPlaygroundDapp.assertActiveAccount(ACCOUNT_3_ADDRESS);
       await BrowserPlaygroundDapp.tapPersonalSign();
@@ -264,6 +302,7 @@ test('@metamask/connect-evm - Connect via EVM Legacy Connection to Local Browser
     async () => {
       await BrowserPlaygroundDapp.tapDisconnect();
       await BrowserPlaygroundDapp.assertConnected(false);
+      reconnectTimer.start();
       await BrowserPlaygroundDapp.tapConnectLegacy();
     },
     DAPP_URL,
@@ -282,6 +321,7 @@ test('@metamask/connect-evm - Connect via EVM Legacy Connection to Local Browser
     device,
     async () => {
       await BrowserPlaygroundDapp.assertConnected(true);
+      reconnectTimer.stop();
       await BrowserPlaygroundDapp.assertChainIdValue('0x1');
       await BrowserPlaygroundDapp.assertActiveAccount(ACCOUNT_3_ADDRESS);
       await BrowserPlaygroundDapp.tapPersonalSign();
@@ -366,6 +406,14 @@ test('@metamask/connect-evm - Connect via EVM Legacy Connection to Local Browser
     DAPP_URL,
   );
 
+  performanceTracker.addTimers(
+    connectTimer,
+    signTimer,
+    switchChainTimer,
+    refreshReconnectTimer,
+    reconnectTimer,
+  );
+
   //
   // Read-only method should hit rpc endpoint instead of wallet
   //
diff --git a/tests/performance/mm-connect/connection-multichain.spec.js b/tests/performance/mm-connect/connection-multichain.spec.js
index adbef8d3995b..aec60088ce1b 100644
--- a/tests/performance/mm-connect/connection-multichain.spec.js
+++ b/tests/performance/mm-connect/connection-multichain.spec.js
@@ -1,4 +1,5 @@
-import { test } from 'appwright';
+import { test } from '../../framework/fixtures/performance';
+import TimerHelper from '../../framework/TimerHelper';
 
 import { login } from '../../framework/utils/Flows.js';
 import {
@@ -49,6 +50,7 @@ test.afterAll(async () => {
 
 test('@metamask/connect-multichain - Connect via Multichain API to Local Browser Playground', async ({
   device,
+  performanceTracker,
 }) => {
   // Get platform-specific URL (use bs-local.com when running on BrowserStack Local tunnel)
   const platform = device.getPlatform?.() || 'android';
@@ -85,10 +87,17 @@ test('@metamask/connect-multichain - Connect via Multichain API to Local Browser
   // Connect via Multichain API (wait for dapp ready then tap Connect to minimize idle time / auto-lock)
   //
 
+  const connectTimer = new TimerHelper(
+    'Time from tapping Connect to dapp confirming Multichain connected state',
+    { ios: 20000, android: 30000 },
+    device,
+  );
+
   await AppwrightHelpers.withWebAction(
     device,
     async () => {
       await BrowserPlaygroundDapp.waitForConnectButtonVisible(15000);
+      connectTimer.start();
       await BrowserPlaygroundDapp.tapConnect();
     },
     DAPP_URL,
@@ -114,6 +123,7 @@ test('@metamask/connect-multichain - Connect via Multichain API to Local Browser
     async () => {
       // Verify connected by checking for scope cards section
       await BrowserPlaygroundDapp.assertMultichainConnected(true);
+      connectTimer.stop();
 
       // Verify at least one scope card is visible (eip155:1 is default)
       await BrowserPlaygroundDapp.assertScopeCardVisible('eip155:1');
@@ -121,6 +131,8 @@ test('@metamask/connect-multichain - Connect via Multichain API to Local Browser
     DAPP_URL,
   );
 
+  performanceTracker.addTimers(connectTimer);
+
   //
   // Cleanup - disconnect
   //
diff --git a/tests/performance/mm-connect/connection-multiclient.spec.js b/tests/performance/mm-connect/connection-multiclient.spec.js
new file mode 100644
index 000000000000..d13221018296
--- /dev/null
+++ b/tests/performance/mm-connect/connection-multiclient.spec.js
@@ -0,0 +1,486 @@
+import { test } from 'appwright';
+
+import { login } from '../../framework/utils/Flows.js';
+import {
+  launchMobileBrowser,
+  switchToMobileBrowser,
+  navigateToDapp,
+} from '../../framework/utils/MobileBrowser.js';
+import WalletMainScreen from '../../../wdio/screen-objects/WalletMainScreen.js';
+import BrowserPlaygroundDapp from '../../../wdio/screen-objects/BrowserPlaygroundDapp.js';
+import AndroidScreenHelpers from '../../../wdio/screen-objects/Native/Android.js';
+import DappConnectionModal from '../../../wdio/screen-objects/Modals/DappConnectionModal.js';
+import SignModal from '../../../wdio/screen-objects/Modals/SignModal.js';
+import SnapSignModal from '../../../wdio/screen-objects/Modals/SnapSignModal.js';
+import AppwrightHelpers from '../../framework/AppwrightHelpers.ts';
+import {
+  DappServer,
+  DappVariants,
+  TestDapps,
+} from '../../../tests/framework/index.ts';
+import {
+  getDappUrlForBrowser,
+  setupAdbReverse,
+  cleanupAdbReverse,
+  ensureAccountGroupsFinishedLoading,
+  waitForDappServerReady,
+  unlockIfLockScreenVisible,
+} from './utils.js';
+import AppwrightGestures from '../../../tests/framework/AppwrightGestures.ts';
+import AccountListComponent from '../../../wdio/screen-objects/AccountListComponent.js';
+
+const DAPP_NAME = 'MetaMask MultiChain API Test Dapp';
+const DAPP_PORT = 8090;
+
+// NOTE: This test requires the testing SRP to be used
+const ACCOUNT_1_EVM_ADDRESS = '0x19a7Ad8256ab119655f1D758348501d598fC1C94';
+const ACCOUNT_1_SOLANA_ADDRESS = '6fr9gpqbsszm6snzsjubu91jwxeduhwnvnkwxqksfwcz';
+
+const SOLANA_MAINNET_CAIP_CHAIN_ID = 'solana:5eykt4UsFv8P8NJdTREpY1vzqKqZKvdp';
+
+const ACCOUNT_1_SOLANA_SIGNED_MESSAGE_RESULT =
+  'TnB0MoNjYOTozLwKcZskdyzYszWHetTLcDskffjqLgQ9nYUbM47JySKpEyTZtA48CdMsPK+erAeId6ayzBoJBQ==';
+
+// Create the playground server using the shared framework
+const playgroundServer = new DappServer({
+  dappCounter: 0,
+  rootDirectory: TestDapps[DappVariants.BROWSER_PLAYGROUND].dappPath,
+  dappVariant: DappVariants.BROWSER_PLAYGROUND,
+});
+
+// Start local playground server before all tests
+test.beforeAll(async () => {
+  // Set port and start the server directly (bypassing Detox-specific utilities)
+  playgroundServer.setServerPort(DAPP_PORT);
+  await playgroundServer.start();
+  await waitForDappServerReady(DAPP_PORT);
+
+  // Set up adb reverse for Android emulator access
+  setupAdbReverse(DAPP_PORT);
+});
+
+// Stop local playground server after all tests
+test.afterAll(async () => {
+  cleanupAdbReverse(DAPP_PORT);
+  await playgroundServer.stop();
+});
+
+test('@metamask/connect-multichain (multiple clients) - Connect multiple clients via Multichain API to Local Browser Playground', async ({
+  device,
+}) => {
+  // Get platform-specific URL
+  const platform = device.getPlatform?.() || 'android';
+  const useBrowserStackLocal =
+    process.env.BROWSERSTACK_LOCAL?.toLowerCase() === 'true';
+  const DAPP_URL = useBrowserStackLocal
+    ? `http://bs-local.com:${DAPP_PORT}`
+    : getDappUrlForBrowser(platform);
+
+  // Initialize page objects with device
+  WalletMainScreen.device = device;
+  BrowserPlaygroundDapp.device = device;
+  AndroidScreenHelpers.device = device;
+  DappConnectionModal.device = device;
+  SignModal.device = device;
+  SnapSignModal.device = device;
+  AccountListComponent.device = device;
+
+  await device.webDriverClient.updateSettings({
+    waitForIdleTimeout: 100,
+    waitForSelectorTimeout: 0,
+    shouldWaitForQuiescence: false,
+  });
+
+  //
+  // Login and navigate to dapp
+  //
+
+  await AppwrightHelpers.withNativeAction(device, async () => {
+    await login(device);
+    await ensureAccountGroupsFinishedLoading(device);
+    await launchMobileBrowser(device);
+    await navigateToDapp(device, DAPP_URL, DAPP_NAME);
+  });
+
+  await AppwrightGestures.wait(1000);
+
+  //
+  // Connect via Multichain API
+  //
+
+  // Tap the Connect button (multichain API - default scopes)
+  await AppwrightHelpers.withWebAction(
+    device,
+    async () => {
+      // Note: the Solana wallet standard provider itself has an issue where it does not
+      // listen for wallet_sessionChanged events, so we need to use the Solana's connect button
+      // as the entrypoint for now.
+      await BrowserPlaygroundDapp.tapSolanaConnect();
+    },
+    DAPP_URL,
+  );
+
+  // Handle connection approval in MetaMask
+  await AppwrightHelpers.withNativeAction(device, async () => {
+    await AndroidScreenHelpers.tapOpenDeeplinkWithMetaMask();
+    await unlockIfLockScreenVisible(device);
+    await DappConnectionModal.tapConnectButton();
+  });
+
+  await AppwrightGestures.wait(1000);
+  await switchToMobileBrowser(device);
+  await AppwrightGestures.wait(1000);
+
+  await AppwrightHelpers.withWebAction(
+    device,
+    async () => {
+      await BrowserPlaygroundDapp.assertMultichainConnected(true);
+      await BrowserPlaygroundDapp.assertScopeCardVisible('eip155:1');
+      await BrowserPlaygroundDapp.assertScopeCardVisible(
+        SOLANA_MAINNET_CAIP_CHAIN_ID,
+      );
+
+      await BrowserPlaygroundDapp.assertConnected(true);
+      await BrowserPlaygroundDapp.assertChainIdValue('0x1');
+      await BrowserPlaygroundDapp.assertActiveAccount(ACCOUNT_1_EVM_ADDRESS);
+
+      await BrowserPlaygroundDapp.assertWagmiConnected(true);
+      await BrowserPlaygroundDapp.assertWagmiChainIdValue('1');
+      await BrowserPlaygroundDapp.assertWagmiActiveAccount(
+        ACCOUNT_1_EVM_ADDRESS,
+      );
+      // Verify wagmi personal sign works when wagmi is connected
+      await BrowserPlaygroundDapp.typeWagmiSignMessage('Hello MetaMask');
+      await BrowserPlaygroundDapp.tapWagmiSignMessage();
+    },
+    DAPP_URL,
+  );
+
+  await AppwrightHelpers.withNativeAction(device, async () => {
+    await AndroidScreenHelpers.tapOpenDeeplinkWithMetaMask();
+    await SignModal.tapConfirmButton();
+  });
+
+  await AppwrightGestures.wait(1000);
+  await switchToMobileBrowser(device);
+  await AppwrightGestures.wait(1000);
+
+  await AppwrightHelpers.withWebAction(
+    device,
+    async () => {
+      await BrowserPlaygroundDapp.assertWagmiSignatureResult('0x');
+
+      await BrowserPlaygroundDapp.assertSolanaConnected(true);
+      await BrowserPlaygroundDapp.assertSolanaActiveAccount(
+        ACCOUNT_1_SOLANA_ADDRESS,
+      );
+      // Verify solana sign works when solana is connected
+      await BrowserPlaygroundDapp.tapSolanaSignMessage();
+    },
+    DAPP_URL,
+  );
+
+  await AppwrightHelpers.withNativeAction(device, async () => {
+    await AndroidScreenHelpers.tapOpenDeeplinkWithMetaMask();
+    await SnapSignModal.tapConfirmButton();
+  });
+
+  await AppwrightGestures.wait(1000);
+  await switchToMobileBrowser(device);
+  await AppwrightGestures.wait(1000);
+
+  await AppwrightHelpers.withWebAction(
+    device,
+    async () => {
+      await BrowserPlaygroundDapp.assertSolanaSignedMessageResult(
+        ACCOUNT_1_SOLANA_SIGNED_MESSAGE_RESULT,
+      );
+
+      // Test EVM sign (legacy personal sign) when EVM is connected
+      await BrowserPlaygroundDapp.tapPersonalSign();
+    },
+    DAPP_URL,
+  );
+
+  await AppwrightHelpers.withNativeAction(device, async () => {
+    await AndroidScreenHelpers.tapOpenDeeplinkWithMetaMask();
+    await SignModal.tapConfirmButton();
+  });
+
+  await AppwrightGestures.wait(1000);
+  await switchToMobileBrowser(device);
+  await AppwrightGestures.wait(1000);
+
+  await AppwrightHelpers.withWebAction(
+    device,
+    async () => {
+      await BrowserPlaygroundDapp.assertResponseValue(
+        '0x361c13288b4ab02d50974efddf9e4e7ca651b81c298b614be908c4754abb1dd8328224645a1a8d0fab561c4b855c7bdcebea15db5ae8d1778a1ea791dbd05c2a1b',
+      );
+
+      // Disconnect EVM
+      await BrowserPlaygroundDapp.tapWagmiDisconnect();
+
+      await BrowserPlaygroundDapp.assertMultichainConnected(true);
+      await BrowserPlaygroundDapp.assertScopeCardNotVisible('eip155:1');
+      await BrowserPlaygroundDapp.assertScopeCardVisible(
+        SOLANA_MAINNET_CAIP_CHAIN_ID,
+      );
+
+      await BrowserPlaygroundDapp.assertConnected(false);
+      await BrowserPlaygroundDapp.assertWagmiConnected(false);
+      await BrowserPlaygroundDapp.assertSolanaConnected(true);
+
+      // Reconnect EVM
+      await BrowserPlaygroundDapp.tapConnectWagmi();
+    },
+    DAPP_URL,
+  );
+
+  await AppwrightHelpers.withNativeAction(device, async () => {
+    await AndroidScreenHelpers.tapOpenDeeplinkWithMetaMask();
+    await DappConnectionModal.tapConnectButton();
+  });
+
+  await AppwrightGestures.wait(1000);
+  await switchToMobileBrowser(device);
+  await AppwrightGestures.wait(1000);
+
+  await AppwrightHelpers.withWebAction(
+    device,
+    async () => {
+      await BrowserPlaygroundDapp.assertScopeCardVisible('eip155:1');
+
+      await BrowserPlaygroundDapp.assertConnected(true);
+      await BrowserPlaygroundDapp.assertChainIdValue('0x1');
+      await BrowserPlaygroundDapp.assertActiveAccount(ACCOUNT_1_EVM_ADDRESS);
+
+      await BrowserPlaygroundDapp.assertWagmiConnected(true);
+      await BrowserPlaygroundDapp.assertWagmiChainIdValue('1');
+      await BrowserPlaygroundDapp.assertWagmiActiveAccount(
+        ACCOUNT_1_EVM_ADDRESS,
+      );
+      // Verify wagmi personal sign works when wagmi is connected
+      await BrowserPlaygroundDapp.typeWagmiSignMessage('Hello MetaMask');
+      await BrowserPlaygroundDapp.tapWagmiSignMessage();
+    },
+    DAPP_URL,
+  );
+
+  await AppwrightHelpers.withNativeAction(device, async () => {
+    await AndroidScreenHelpers.tapOpenDeeplinkWithMetaMask();
+    await SignModal.tapConfirmButton();
+  });
+
+  await AppwrightGestures.wait(1000);
+  await switchToMobileBrowser(device);
+  await AppwrightGestures.wait(1000);
+
+  await AppwrightHelpers.withWebAction(
+    device,
+    async () => {
+      await BrowserPlaygroundDapp.assertWagmiSignatureResult('0x');
+
+      // Make sure solana is still connected
+      await BrowserPlaygroundDapp.assertScopeCardVisible(
+        SOLANA_MAINNET_CAIP_CHAIN_ID,
+      );
+      await BrowserPlaygroundDapp.assertSolanaConnected(true);
+      await BrowserPlaygroundDapp.assertSolanaActiveAccount(
+        ACCOUNT_1_SOLANA_ADDRESS,
+      );
+      // Verify solana sign works when solana is connected
+      await BrowserPlaygroundDapp.tapSolanaSignMessage();
+    },
+    DAPP_URL,
+  );
+
+  await AppwrightHelpers.withNativeAction(device, async () => {
+    await AndroidScreenHelpers.tapOpenDeeplinkWithMetaMask();
+    await SnapSignModal.tapConfirmButton();
+  });
+
+  await AppwrightGestures.wait(1000);
+  await switchToMobileBrowser(device);
+  await AppwrightGestures.wait(1000);
+
+  await AppwrightHelpers.withWebAction(
+    device,
+    async () => {
+      await BrowserPlaygroundDapp.assertSolanaSignedMessageResult(
+        ACCOUNT_1_SOLANA_SIGNED_MESSAGE_RESULT,
+      );
+
+      // Disconnect Solana
+      await BrowserPlaygroundDapp.tapSolanaDisconnect();
+
+      await BrowserPlaygroundDapp.assertScopeCardNotVisible(
+        SOLANA_MAINNET_CAIP_CHAIN_ID,
+      );
+      await BrowserPlaygroundDapp.assertSolanaConnected(false);
+
+      // Make sure EVM is still connected
+      await BrowserPlaygroundDapp.assertScopeCardVisible('eip155:1');
+      await BrowserPlaygroundDapp.assertConnected(true);
+      await BrowserPlaygroundDapp.assertWagmiConnected(true);
+      // Verify wagmi personal sign works when wagmi is connected
+      await BrowserPlaygroundDapp.typeWagmiSignMessage('Hello MetaMask');
+      await BrowserPlaygroundDapp.tapWagmiSignMessage();
+    },
+    DAPP_URL,
+  );
+
+  await AppwrightHelpers.withNativeAction(device, async () => {
+    await AndroidScreenHelpers.tapOpenDeeplinkWithMetaMask();
+    await SignModal.tapConfirmButton();
+  });
+
+  await AppwrightGestures.wait(1000);
+  await switchToMobileBrowser(device);
+  await AppwrightGestures.wait(1000);
+
+  await AppwrightHelpers.withWebAction(
+    device,
+    async () => {
+      await BrowserPlaygroundDapp.assertWagmiSignatureResult('0x');
+
+      // Reconnect Solana
+      await BrowserPlaygroundDapp.tapSolanaConnect();
+    },
+    DAPP_URL,
+  );
+
+  await AppwrightHelpers.withNativeAction(device, async () => {
+    await AndroidScreenHelpers.tapOpenDeeplinkWithMetaMask();
+    await DappConnectionModal.tapConnectButton();
+  });
+
+  await AppwrightGestures.wait(1000);
+  await switchToMobileBrowser(device);
+  await AppwrightGestures.wait(1000);
+
+  await AppwrightHelpers.withWebAction(
+    device,
+    async () => {
+      await BrowserPlaygroundDapp.assertScopeCardVisible(
+        SOLANA_MAINNET_CAIP_CHAIN_ID,
+      );
+      await BrowserPlaygroundDapp.assertSolanaConnected(true);
+      await BrowserPlaygroundDapp.assertSolanaActiveAccount(
+        ACCOUNT_1_SOLANA_ADDRESS,
+      );
+      // Verify solana sign works when solana is connected
+      await BrowserPlaygroundDapp.tapSolanaSignMessage();
+    },
+    DAPP_URL,
+  );
+
+  await AppwrightHelpers.withNativeAction(device, async () => {
+    await AndroidScreenHelpers.tapOpenDeeplinkWithMetaMask();
+    await SnapSignModal.tapConfirmButton();
+  });
+
+  await AppwrightGestures.wait(1000);
+  await switchToMobileBrowser(device);
+  await AppwrightGestures.wait(1000);
+
+  await AppwrightHelpers.withWebAction(
+    device,
+    async () => {
+      await BrowserPlaygroundDapp.assertSolanaSignedMessageResult(
+        ACCOUNT_1_SOLANA_SIGNED_MESSAGE_RESULT,
+      );
+
+      // Make sure EVM is still connected
+      await BrowserPlaygroundDapp.assertScopeCardVisible('eip155:1');
+      await BrowserPlaygroundDapp.assertConnected(true);
+      await BrowserPlaygroundDapp.assertWagmiConnected(true);
+      // Verify wagmi personal sign works when wagmi is connected
+      await BrowserPlaygroundDapp.typeWagmiSignMessage('Hello MetaMask');
+      await BrowserPlaygroundDapp.tapWagmiSignMessage();
+    },
+    DAPP_URL,
+  );
+
+  await AppwrightHelpers.withNativeAction(device, async () => {
+    await AndroidScreenHelpers.tapOpenDeeplinkWithMetaMask();
+    await SignModal.tapConfirmButton();
+  });
+
+  await AppwrightGestures.wait(1000);
+  await switchToMobileBrowser(device);
+  await AppwrightGestures.wait(1000);
+
+  await AppwrightHelpers.withWebAction(
+    device,
+    async () => {
+      await BrowserPlaygroundDapp.assertWagmiSignatureResult('0x');
+
+      // Setup for concurrent connect test
+
+      await BrowserPlaygroundDapp.tapSolanaDisconnect();
+      await BrowserPlaygroundDapp.tapWagmiDisconnect();
+      await BrowserPlaygroundDapp.tapSolanaConnect();
+    },
+    DAPP_URL,
+  );
+
+  await AppwrightHelpers.withNativeAction(device, async () => {
+    await AndroidScreenHelpers.tapOpenDeeplinkWithMetaMask();
+
+    // Purposely terminate the app without accepting the approval
+    await AppwrightGestures.terminateApp(device);
+    await AppwrightGestures.activateApp(device);
+    await login(device);
+    await WalletMainScreen.isMainWalletViewVisible();
+  });
+
+  await AppwrightGestures.wait(1000);
+  await switchToMobileBrowser(device);
+  await AppwrightGestures.wait(1000);
+
+  await AppwrightHelpers.withWebAction(
+    device,
+    async () => {
+      await BrowserPlaygroundDapp.tapConnectWagmi();
+    },
+    DAPP_URL,
+  );
+
+  await AppwrightHelpers.withNativeAction(device, async () => {
+    await AndroidScreenHelpers.tapOpenDeeplinkWithMetaMask();
+    await DappConnectionModal.tapConnectButton();
+  });
+
+  await AppwrightGestures.wait(1000);
+  await switchToMobileBrowser(device);
+  await AppwrightGestures.wait(1000);
+
+  await AppwrightHelpers.withWebAction(
+    device,
+    async () => {
+      await BrowserPlaygroundDapp.assertScopeCardVisible('eip155:1');
+      await BrowserPlaygroundDapp.assertConnected(true);
+      await BrowserPlaygroundDapp.assertWagmiConnected(true);
+      // Currently this is only possible if the solana connection attempt (the first one that initiated) was successful.
+      await BrowserPlaygroundDapp.assertSolanaConnected(true);
+    },
+    DAPP_URL,
+  );
+
+  //
+  // Cleanup - disconnect
+  //
+
+  await AppwrightHelpers.withWebAction(
+    device,
+    async () => {
+      // Note: the Solana wallet standard provider itself has an issue where it does not
+      // listen for wallet_sessionChanged events, so we need to use the Solana's disconnect button
+      // to ensure the solana react hook state is reset correctly.
+      await BrowserPlaygroundDapp.tapSolanaDisconnect();
+      await BrowserPlaygroundDapp.tapDisconnect();
+    },
+    DAPP_URL,
+  );
+});
diff --git a/tests/performance/mm-connect/connection-wagmi.spec.js b/tests/performance/mm-connect/connection-wagmi.spec.js
index 16f19bab5da8..744f25a1d716 100644
--- a/tests/performance/mm-connect/connection-wagmi.spec.js
+++ b/tests/performance/mm-connect/connection-wagmi.spec.js
@@ -1,4 +1,5 @@
-import { test } from 'appwright';
+import { test } from '../../framework/fixtures/performance';
+import TimerHelper from '../../framework/TimerHelper';
 
 import { login } from '../../framework/utils/Flows.js';
 import {
@@ -23,6 +24,7 @@ import {
   cleanupAdbReverse,
   waitForDappServerReady,
   unlockIfLockScreenVisible,
+  ensureAccountGroupsFinishedLoading,
 } from './utils.js';
 
 const DAPP_NAME = 'MetaMask MultiChain API Test Dapp';
@@ -56,8 +58,9 @@ test.afterAll(async () => {
   await playgroundServer.stop();
 });
 
-test('@metamask/connect-wagmi - Connect via Wagmi to Local Browser Playground', async ({
+test('@metamask/connect-evm (wagmi) - Connect via Wagmi to Local Browser Playground', async ({
   device,
+  performanceTracker,
 }) => {
   const platform = device.getPlatform?.() || 'android';
   const useBrowserStackLocal =
@@ -82,12 +85,39 @@ test('@metamask/connect-wagmi - Connect via Wagmi to Local Browser Playground',
     shouldWaitForQuiescence: false,
   });
 
+  const connectTimer = new TimerHelper(
+    'Time from tapping Connect (Wagmi) to dapp confirming Wagmi connected state',
+    { ios: 20000, android: 30000 },
+    device,
+  );
+  const signTimer = new TimerHelper(
+    'Time from tapping Wagmi Sign Message to dapp displaying signature result',
+    { ios: 12000, android: 18000 },
+    device,
+  );
+  const switchChainTimer = new TimerHelper(
+    'Time from tapping Switch Chain to OP Mainnet to dapp confirming chain ID 10',
+    { ios: 12000, android: 18000 },
+    device,
+  );
+  const refreshReconnectTimer = new TimerHelper(
+    'Time from refreshing browser to dapp confirming Wagmi still connected',
+    { ios: 8000, android: 12000 },
+    device,
+  );
+  const reconnectTimer = new TimerHelper(
+    'Time from tapping Connect (Wagmi) after disconnect to dapp confirming reconnected',
+    { ios: 20000, android: 30000 },
+    device,
+  );
+
   //
   // Login and navigate to dapp
   //
 
   await AppwrightHelpers.withNativeAction(device, async () => {
     await login(device);
+    await ensureAccountGroupsFinishedLoading(device);
     await launchMobileBrowser(device);
     await navigateToDapp(device, DAPP_URL, DAPP_NAME);
   });
@@ -101,6 +131,7 @@ test('@metamask/connect-wagmi - Connect via Wagmi to Local Browser Playground',
   await AppwrightHelpers.withWebAction(
     device,
     async () => {
+      connectTimer.start();
       await BrowserPlaygroundDapp.tapConnectWagmi();
     },
     DAPP_URL,
@@ -134,10 +165,12 @@ test('@metamask/connect-wagmi - Connect via Wagmi to Local Browser Playground',
     device,
     async () => {
       await BrowserPlaygroundDapp.assertWagmiConnected(true);
+      connectTimer.stop();
       await BrowserPlaygroundDapp.assertWagmiChainIdValue('1');
       await BrowserPlaygroundDapp.assertWagmiActiveAccount(ACCOUNT_1_ADDRESS);
       // Type a message and sign
       await BrowserPlaygroundDapp.typeWagmiSignMessage('Hello MetaMask');
+      signTimer.start();
       await BrowserPlaygroundDapp.tapWagmiSignMessage();
     },
     DAPP_URL,
@@ -160,6 +193,7 @@ test('@metamask/connect-wagmi - Connect via Wagmi to Local Browser Playground',
     async () => {
       // Verify we got a signature
       await BrowserPlaygroundDapp.assertWagmiSignatureResult('0x');
+      signTimer.stop();
       // Switch to Sepolia
       await BrowserPlaygroundDapp.tapWagmiSwitchChain(11155111);
       await BrowserPlaygroundDapp.assertWagmiChainIdValue('11155111');
@@ -188,6 +222,7 @@ test('@metamask/connect-wagmi - Connect via Wagmi to Local Browser Playground',
   await AppwrightHelpers.withWebAction(
     device,
     async () => {
+      switchChainTimer.start();
       await BrowserPlaygroundDapp.tapWagmiSwitchChain(10); // OP Mainnet
     },
     DAPP_URL,
@@ -207,6 +242,7 @@ test('@metamask/connect-wagmi - Connect via Wagmi to Local Browser Playground',
     device,
     async () => {
       await BrowserPlaygroundDapp.assertWagmiChainIdValue('10');
+      switchChainTimer.stop();
       await BrowserPlaygroundDapp.typeWagmiSignMessage('Hello OP');
       await BrowserPlaygroundDapp.tapWagmiSignMessage();
     },
@@ -281,6 +317,7 @@ test('@metamask/connect-wagmi - Connect via Wagmi to Local Browser Playground',
   //
 
   await AppwrightHelpers.withNativeAction(device, async () => {
+    refreshReconnectTimer.start();
     await refreshMobileBrowser(device);
   });
   await new Promise((resolve) => setTimeout(resolve, 2000));
@@ -289,6 +326,7 @@ test('@metamask/connect-wagmi - Connect via Wagmi to Local Browser Playground',
     device,
     async () => {
       await BrowserPlaygroundDapp.assertWagmiConnected(true);
+      refreshReconnectTimer.stop();
       // Note: Chain may reset to 1 after refresh
       await BrowserPlaygroundDapp.assertWagmiChainIdValue('1');
       await BrowserPlaygroundDapp.assertWagmiActiveAccount(ACCOUNT_3_ADDRESS);
@@ -316,6 +354,7 @@ test('@metamask/connect-wagmi - Connect via Wagmi to Local Browser Playground',
     async () => {
       await BrowserPlaygroundDapp.tapDisconnect();
       await BrowserPlaygroundDapp.assertWagmiConnected(false);
+      reconnectTimer.start();
       await BrowserPlaygroundDapp.tapConnectWagmi();
     },
     DAPP_URL,
@@ -334,6 +373,7 @@ test('@metamask/connect-wagmi - Connect via Wagmi to Local Browser Playground',
     device,
     async () => {
       await BrowserPlaygroundDapp.assertWagmiConnected(true);
+      reconnectTimer.stop();
       await BrowserPlaygroundDapp.assertWagmiChainIdValue('1');
       await BrowserPlaygroundDapp.assertWagmiActiveAccount(ACCOUNT_3_ADDRESS);
     },
@@ -398,6 +438,14 @@ test('@metamask/connect-wagmi - Connect via Wagmi to Local Browser Playground',
     DAPP_URL,
   );
 
+  performanceTracker.addTimers(
+    connectTimer,
+    signTimer,
+    switchChainTimer,
+    refreshReconnectTimer,
+    reconnectTimer,
+  );
+
   //
   // Reset dapp state
   //
diff --git a/tests/performance/mm-connect/legacy-evm-rn-connect.spec.js b/tests/performance/mm-connect/legacy-evm-rn-connect.spec.js
new file mode 100644
index 000000000000..0fd1ae854845
--- /dev/null
+++ b/tests/performance/mm-connect/legacy-evm-rn-connect.spec.js
@@ -0,0 +1,176 @@
+import { test, expect } from '../../framework/fixtures/performance';
+
+import { login } from '../../framework/utils/Flows.js';
+import RNPlaygroundDapp from '../../../wdio/screen-objects/RNPlaygroundDapp.js';
+import DappConnectionModal from '../../../wdio/screen-objects/Modals/DappConnectionModal.js';
+import SignModal from '../../../wdio/screen-objects/Modals/SignModal.js';
+import {
+  unlockIfLockScreenVisible,
+  ensurePlaygroundInstalled,
+} from './utils.js';
+import AppwrightGestures from '../../framework/AppwrightGestures.ts';
+
+const DEFAULT_SCROLL_PARAMS = {
+  scrollParams: { percent: 0.2 },
+};
+
+/**
+ * After a MetaMask action (approve / sign / cancel), wait for the callback
+ * deeplink to return to the playground. Falls back to activateApp if the
+ * automatic return does not happen within a short window.
+ */
+async function returnToPlayground() {
+  await AppwrightGestures.wait(2000);
+  await RNPlaygroundDapp.ensureInPlayground();
+}
+
+test.beforeAll(() => {
+  ensurePlaygroundInstalled();
+});
+
+test('@metamask/connect-legacy-evm-rn - Connect via Legacy EVM, sign, send transaction, and switch chains', async ({
+  device,
+}) => {
+  RNPlaygroundDapp.device = device;
+  DappConnectionModal.device = device;
+  SignModal.device = device;
+
+  await device.webDriverClient.updateSettings({
+    waitForIdleTimeout: 100,
+    waitForSelectorTimeout: 0,
+    shouldWaitForQuiescence: false,
+  });
+
+  //
+  // 1. Login to MetaMask wallet
+  //
+
+  await login(device);
+
+  //
+  // 2. Switch to the RN playground and connect via Legacy EVM
+  //
+
+  await RNPlaygroundDapp.switchToPlayground();
+  await RNPlaygroundDapp.waitForPlaygroundReady();
+
+  await RNPlaygroundDapp.tapConnectLegacy();
+  await AppwrightGestures.wait(3000);
+
+  await unlockIfLockScreenVisible(device);
+  await AppwrightGestures.wait(5000);
+  await DappConnectionModal.tapConnectButton();
+
+  //
+  // 3. Verify accountsChanged — Legacy EVM card visible with accounts
+  //
+
+  await returnToPlayground();
+  await AppwrightGestures.wait(2000);
+
+  await RNPlaygroundDapp.scrollToElement(RNPlaygroundDapp.appTitle, {
+    scrollParams: { direction: 'down' },
+  });
+  await RNPlaygroundDapp.scrollToElement(
+    RNPlaygroundDapp.legacyEvmCard,
+    DEFAULT_SCROLL_PARAMS,
+  );
+  await RNPlaygroundDapp.assertLegacyEvmConnected();
+  await RNPlaygroundDapp.assertLegacyEvmHasAccounts();
+  await RNPlaygroundDapp.assertLegacyEvmActiveAccount();
+
+  const initialChainId = await RNPlaygroundDapp.getLegacyEvmChainId();
+  console.log(`Initial chain ID: ${initialChainId}`);
+
+  //
+  // 4. personal_sign — request, approve, verify result
+  //
+
+  await RNPlaygroundDapp.scrollToElement(
+    RNPlaygroundDapp.legacyEvmBtnPersonalSign,
+    DEFAULT_SCROLL_PARAMS,
+  );
+  await RNPlaygroundDapp.tapLegacyEvmButton(
+    RNPlaygroundDapp.legacyEvmBtnPersonalSign,
+  );
+  await AppwrightGestures.wait(3000);
+
+  await unlockIfLockScreenVisible(device);
+  await AppwrightGestures.wait(1000);
+  await SignModal.tapConfirmButton();
+
+  await returnToPlayground();
+  await AppwrightGestures.wait(1000);
+
+  // Verify signature was returned (hex string starting with 0x)
+  await RNPlaygroundDapp.scrollToElement(
+    RNPlaygroundDapp.legacyEvmResponseText,
+    DEFAULT_SCROLL_PARAMS,
+  );
+  const signResponse = await RNPlaygroundDapp.getLegacyEvmResponseText();
+  console.log(`personal_sign response: ${signResponse}`);
+  expect(signResponse).toContain('0x');
+
+  //
+  // 5. eth_sendTransaction — request, cancel (to avoid spending funds)
+  //
+
+  await RNPlaygroundDapp.scrollToElement(
+    RNPlaygroundDapp.legacyEvmBtnSendTransaction,
+    DEFAULT_SCROLL_PARAMS,
+  );
+  await RNPlaygroundDapp.tapLegacyEvmButton(
+    RNPlaygroundDapp.legacyEvmBtnSendTransaction,
+  );
+  await AppwrightGestures.wait(3000);
+
+  await unlockIfLockScreenVisible(device);
+  await AppwrightGestures.wait(1000);
+
+  // Cancel the transaction to avoid spending real funds
+  await SignModal.tapCancelButton();
+
+  await returnToPlayground();
+  await AppwrightGestures.wait(1000);
+
+  // The dapp should show an error (user rejected) in the response
+  await RNPlaygroundDapp.scrollToElement(
+    RNPlaygroundDapp.legacyEvmResponseText,
+    DEFAULT_SCROLL_PARAMS,
+  );
+  const txResponse = await RNPlaygroundDapp.getLegacyEvmResponseText();
+  console.log(`eth_sendTransaction (cancelled) response: ${txResponse}`);
+  expect(txResponse.toLowerCase()).toContain('denied');
+
+  //
+  // 6. Chain switching from the dapp — wallet_switchEthereumChain
+  //    Switch to Polygon from the dapp, verify the chain ID updates.
+  //
+
+  await RNPlaygroundDapp.scrollToElement(
+    RNPlaygroundDapp.legacyEvmBtnSwitchPolygon,
+    DEFAULT_SCROLL_PARAMS,
+  );
+  await RNPlaygroundDapp.tapLegacyEvmButton(
+    RNPlaygroundDapp.legacyEvmBtnSwitchPolygon,
+  );
+  await AppwrightGestures.wait(3000);
+
+  // The switch opens MetaMask with a network approval dialog.
+  // The SwitchChainApproval dialog uses "connect-button" as its confirm testID.
+  await unlockIfLockScreenVisible(device);
+  await AppwrightGestures.wait(1000);
+  await DappConnectionModal.tapConnectButton();
+
+  await returnToPlayground();
+  await AppwrightGestures.wait(2000);
+
+  // Verify chain ID updated to Polygon (0x89)
+  await RNPlaygroundDapp.scrollToElement(
+    RNPlaygroundDapp.legacyEvmChainIdValue,
+    { scrollParams: { direction: 'down' } },
+  );
+  const polygonChainId = await RNPlaygroundDapp.getLegacyEvmChainId();
+  console.log(`Chain ID after dapp switch to Polygon: ${polygonChainId}`);
+  expect(polygonChainId).toContain('0x89');
+});
diff --git a/tests/performance/mm-connect/multichain-rn-connect.spec.js b/tests/performance/mm-connect/multichain-rn-connect.spec.js
new file mode 100644
index 000000000000..7ce6d530471d
--- /dev/null
+++ b/tests/performance/mm-connect/multichain-rn-connect.spec.js
@@ -0,0 +1,242 @@
+import { test } from '../../framework/fixtures/performance';
+
+import { login } from '../../framework/utils/Flows.js';
+import RNPlaygroundDapp from '../../../wdio/screen-objects/RNPlaygroundDapp.js';
+import DappConnectionModal from '../../../wdio/screen-objects/Modals/DappConnectionModal.js';
+import SignModal from '../../../wdio/screen-objects/Modals/SignModal.js';
+import SnapSignModal from '../../../wdio/screen-objects/Modals/SnapSignModal.js';
+import { APP_PACKAGE_IDS } from '../../framework/Constants.ts';
+import {
+  unlockIfLockScreenVisible,
+  ensurePlaygroundInstalled,
+  ensureAccountGroupsFinishedLoading,
+} from './utils.js';
+import AppwrightGestures from '../../framework/AppwrightGestures.ts';
+import WalletMainScreen from '../../../wdio/screen-objects/WalletMainScreen.js';
+import AccountListComponent from '../../../wdio/screen-objects/AccountListComponent.js';
+
+const CHAINS = {
+  ETHEREUM: 'eip155:1',
+  LINEA: 'eip155:59144',
+  POLYGON: 'eip155:137',
+  SOLANA: 'solana:5eykt4UsFv8P8NJdTREpY1vzqKqZKvdp',
+};
+
+const EVM_CHAINS = [CHAINS.ETHEREUM, CHAINS.LINEA, CHAINS.POLYGON];
+const ALL_CHAINS = [...EVM_CHAINS, CHAINS.SOLANA];
+
+const NETWORK_DISPLAY_NAMES = {
+  [CHAINS.ETHEREUM]: 'Ethereum',
+  [CHAINS.LINEA]: 'Linea',
+  [CHAINS.POLYGON]: 'Polygon',
+};
+
+const DEFAULT_SCROLL_PARAMS = {
+  scrollParams: { percent: 0.2 },
+};
+
+/**
+ * After a MetaMask action (approve / sign), wait for the callback deeplink
+ * to return to the playground. Falls back to activateApp if the automatic
+ * return does not happen within a short window.
+ */
+async function returnToPlayground() {
+  await AppwrightGestures.wait(2000);
+  await RNPlaygroundDapp.ensureInPlayground();
+}
+
+test.beforeAll(() => {
+  ensurePlaygroundInstalled();
+});
+
+test('@metamask/connect-multichain-rn - Connect across 3 EVM chains and Solana, invoke read/write methods, and disconnect', async ({
+  device,
+}) => {
+  RNPlaygroundDapp.device = device;
+  DappConnectionModal.device = device;
+  SignModal.device = device;
+  SnapSignModal.device = device;
+  AppwrightGestures.device = device;
+  WalletMainScreen.device = device;
+  AccountListComponent.device = device;
+
+  await device.webDriverClient.updateSettings({
+    waitForIdleTimeout: 100,
+    waitForSelectorTimeout: 0,
+    shouldWaitForQuiescence: false,
+  });
+
+  //
+  // 1. Login to MetaMask wallet
+  //
+
+  await login(device);
+  await WalletMainScreen.isMainWalletViewVisible();
+
+  await ensureAccountGroupsFinishedLoading(device);
+  //
+  // 2. Switch to the RN playground and select networks
+  //
+
+  await RNPlaygroundDapp.switchToPlayground();
+  await RNPlaygroundDapp.waitForPlaygroundReady();
+
+  // Ethereum (eip155:1) is selected by default; add three more networks
+  await RNPlaygroundDapp.tapNetworkCheckbox(CHAINS.LINEA);
+  await RNPlaygroundDapp.tapNetworkCheckbox(CHAINS.POLYGON);
+  await RNPlaygroundDapp.tapNetworkCheckbox(CHAINS.SOLANA);
+
+  //
+  // 3. Connect via Multichain API
+  //
+
+  await RNPlaygroundDapp.tapConnect();
+  await AppwrightGestures.wait(3000);
+
+  await unlockIfLockScreenVisible(device);
+  await AppwrightGestures.wait(5000);
+  await DappConnectionModal.tapConnectButton();
+
+  //
+  // 4. Return to playground and verify all connections are active
+  //
+
+  await returnToPlayground();
+  await AppwrightGestures.wait(1000);
+  await RNPlaygroundDapp.assertConnected();
+
+  await RNPlaygroundDapp.scrollToElement(RNPlaygroundDapp.appTitle, {
+    scrollParams: { direction: 'down' },
+  });
+
+  for (const chain of ALL_CHAINS) {
+    await RNPlaygroundDapp.scrollToElement(
+      RNPlaygroundDapp.getScopeCard(chain),
+      DEFAULT_SCROLL_PARAMS,
+    );
+    await RNPlaygroundDapp.assertScopeCardVisible(chain);
+  }
+
+  //
+  // 5. EVM Read requests — eth_blockNumber for each EVM chain (already the
+  //    default selected method) and getGenesisHash for Solana
+  //
+
+  await RNPlaygroundDapp.scrollToElement(RNPlaygroundDapp.appTitle, {
+    scrollParams: { direction: 'down' },
+  });
+
+  for (const chain of EVM_CHAINS) {
+    await RNPlaygroundDapp.scrollToElement(
+      RNPlaygroundDapp.getInvokeButton(chain),
+      DEFAULT_SCROLL_PARAMS,
+    );
+    await RNPlaygroundDapp.tapInvoke(chain);
+    await AppwrightGestures.wait(5000);
+
+    await RNPlaygroundDapp.scrollToElement(
+      RNPlaygroundDapp.getResultCode(chain, 'eth_blockNumber'),
+      DEFAULT_SCROLL_PARAMS,
+    );
+    await RNPlaygroundDapp.assertResultCodeContains(
+      chain,
+      'eth_blockNumber',
+      '0x',
+    );
+  }
+
+  //
+  // 6. Write requests — personal_sign for each EVM chain, signMessage for Solana.
+  //    Each write request opens MetaMask for approval, validating that the request
+  //    is routed to the correct network.
+  //
+  await RNPlaygroundDapp.scrollToElement(RNPlaygroundDapp.appTitle, {
+    scrollParams: { direction: 'down' },
+  });
+
+  for (const chain of EVM_CHAINS) {
+    // Select personal_sign (replaces default eth_blockNumber)
+    await RNPlaygroundDapp.scrollToElement(
+      RNPlaygroundDapp.getMethodSelect(chain),
+      DEFAULT_SCROLL_PARAMS,
+    );
+    await RNPlaygroundDapp.selectMethod(chain, 'personal_sign');
+
+    await RNPlaygroundDapp.scrollToElement(
+      RNPlaygroundDapp.getInvokeButton(chain),
+      DEFAULT_SCROLL_PARAMS,
+    );
+    await RNPlaygroundDapp.tapInvoke(chain);
+    await AppwrightGestures.wait(3000);
+
+    // Handle MetaMask sign approval
+    await unlockIfLockScreenVisible(device);
+    await AppwrightGestures.wait(1000);
+
+    // Verify request was routed to the correct network
+    const networkName = NETWORK_DISPLAY_NAMES[chain];
+    if (networkName) {
+      try {
+        await SignModal.assertNetworkText(networkName);
+      } catch {
+        // Network label may not appear for all signing modals; continue
+      }
+    }
+
+    await SignModal.tapConfirmButton();
+    await returnToPlayground();
+    await AppwrightGestures.wait(1000);
+
+    // Verify a signature was returned (hex string starting with 0x)
+    await RNPlaygroundDapp.scrollToElement(
+      RNPlaygroundDapp.getResultCode(chain, 'personal_sign'),
+      DEFAULT_SCROLL_PARAMS,
+    );
+    await RNPlaygroundDapp.assertResultCodeContains(
+      chain,
+      'personal_sign',
+      '0x',
+    );
+  }
+
+  // Solana write request
+  await RNPlaygroundDapp.scrollToElement(
+    RNPlaygroundDapp.getMethodSelect(CHAINS.SOLANA),
+    DEFAULT_SCROLL_PARAMS,
+  );
+  await RNPlaygroundDapp.selectMethod(CHAINS.SOLANA, 'signMessage');
+
+  await RNPlaygroundDapp.scrollToElement(
+    RNPlaygroundDapp.getInvokeButton(CHAINS.SOLANA),
+    DEFAULT_SCROLL_PARAMS,
+  );
+  await RNPlaygroundDapp.tapInvoke(CHAINS.SOLANA);
+  await AppwrightGestures.wait(3000);
+
+  await unlockIfLockScreenVisible(device);
+  await AppwrightGestures.wait(1000);
+  await SnapSignModal.tapConfirmButton();
+  await returnToPlayground();
+
+  await RNPlaygroundDapp.scrollToElement(
+    RNPlaygroundDapp.getResultCode(CHAINS.SOLANA, 'signMessage'),
+    DEFAULT_SCROLL_PARAMS,
+  );
+  await RNPlaygroundDapp.waitForResult(CHAINS.SOLANA, 'signMessage');
+
+  //
+  // 7. Disconnect (wallet_revokeSession) and verify session termination
+  //
+
+  // Scroll back to the top where the disconnect button lives
+  await RNPlaygroundDapp.scrollToElement(RNPlaygroundDapp.disconnectButton, {
+    scrollParams: { direction: 'down' },
+  });
+  await RNPlaygroundDapp.tapDisconnect();
+  await RNPlaygroundDapp.assertDisconnected();
+
+  // Switch to MetaMask and confirm the wallet no longer shows an active session
+  await device.activateApp(APP_PACKAGE_IDS.ANDROID);
+  await AppwrightGestures.wait(1000);
+  await unlockIfLockScreenVisible(device);
+});
diff --git a/tests/performance/mm-connect/utils.js b/tests/performance/mm-connect/utils.js
index 4b662e825f00..6588defa434a 100644
--- a/tests/performance/mm-connect/utils.js
+++ b/tests/performance/mm-connect/utils.js
@@ -1,14 +1,24 @@
 /* eslint-disable import/no-nodejs-modules */
 import { execSync } from 'child_process';
+import path from 'path';
+import fs from 'fs';
 import { expect } from 'appwright';
 import LoginScreen from '../../../wdio/screen-objects/LoginScreen.js';
+import WalletMainScreen from '../../../wdio/screen-objects/WalletMainScreen.js';
+import AccountListComponent from '../../../wdio/screen-objects/AccountListComponent.js';
+import AppwrightGestures from '../../framework/AppwrightGestures.ts';
 import { login } from '../../framework/utils/Flows.js';
+import { PLAYGROUND_PACKAGE_ID } from '../../framework/Constants.ts';
 
 // Default port for the browser playground dapp server
 const DEFAULT_DAPP_PORT = 8090;
 
 const UNLOCK_WAIT_MS = 3000;
 
+// Path from metamask-mobile root to the playground release APK in the sibling connect-monorepo
+const PLAYGROUND_APK_RELATIVE =
+  '../connect-monorepo/playground/react-native-playground/android/app/build/outputs/apk/release/app-release.apk';
+
 /**
  * If the app auto-locked and the unlock/login screen is displayed, enter password and unlock.
  * Waits no more than 3 seconds for the unlock screen; if not visible, returns without action.
@@ -100,3 +110,64 @@ export function cleanupAdbReverse(port) {
     // Ignore cleanup errors
   }
 }
+
+/**
+ * Wait for the wallet to be visible, then cycle the app twice to ensure all
+ * account groups (including Solana) are created and syncing completes.
+ * Must be called from native context after login.
+ * @param {import('appwright').Device} device - Appwright device
+ */
+export async function ensureAccountGroupsFinishedLoading(device) {
+  await WalletMainScreen.isMainWalletViewVisible();
+  await AppwrightGestures.terminateApp(device);
+  await AppwrightGestures.activateApp(device);
+  await login(device);
+  await WalletMainScreen.isMainWalletViewVisible();
+  await WalletMainScreen.tapIdenticon();
+  await AccountListComponent.isComponentDisplayed();
+  await AccountListComponent.waitForSyncingToComplete();
+  await AppwrightGestures.terminateApp(device);
+  await AppwrightGestures.activateApp(device);
+  await login(device);
+  await WalletMainScreen.isMainWalletViewVisible();
+}
+
+/**
+ * Ensure the React Native playground release APK is installed on the
+ * connected emulator. Uninstalls any existing version first, then installs
+ * the pre-built release APK so the device always has a clean copy.
+ *
+ * The APK must be built manually before running the test — see
+ * tests/performance/mm-connect/README.md for instructions.
+ *
+ * @throws {Error} If the APK file has not been built or adb install fails.
+ */
+export function ensurePlaygroundInstalled() {
+  const apkPath = path.resolve(process.cwd(), PLAYGROUND_APK_RELATIVE);
+  if (!fs.existsSync(apkPath)) {
+    throw new Error(
+      `Playground release APK not found at ${apkPath}.\n` +
+        'Build it first:\n' +
+        '  cd connect-monorepo && yarn install && yarn build\n' +
+        '  cd playground/react-native-playground && npx expo prebuild --platform android\n' +
+        '  cd android && ./gradlew assembleRelease\n\n' +
+        'See tests/performance/mm-connect/README.md for full setup instructions.',
+    );
+  }
+
+  // Uninstall any existing version (debug or release) to guarantee a clean state
+  try {
+    execSync(`adb uninstall ${PLAYGROUND_PACKAGE_ID}`, { stdio: 'pipe' });
+    console.log(`Uninstalled existing ${PLAYGROUND_PACKAGE_ID}`);
+  } catch {
+    // Package was not installed; nothing to uninstall
+  }
+
+  console.log(`Installing playground release APK from ${apkPath}...`);
+  try {
+    execSync(`adb install "${apkPath}"`, { stdio: 'pipe' });
+    console.log('Playground APK installed successfully');
+  } catch (error) {
+    throw new Error(`Failed to install playground APK: ${error.message}`);
+  }
+}
diff --git a/tests/regression/fixtures/fixture-validation.spec.ts b/tests/regression/fixtures/fixture-validation.spec.ts
new file mode 100644
index 000000000000..81d34bd84bc6
--- /dev/null
+++ b/tests/regression/fixtures/fixture-validation.spec.ts
@@ -0,0 +1,187 @@
+// eslint-disable-next-line import/no-nodejs-modules, import/no-namespace
+import * as fs from 'fs';
+// eslint-disable-next-line import/no-namespace, import/no-nodejs-modules
+import * as path from 'path';
+import { FixtureValidation } from '../../tags';
+import { CreateNewWallet } from '../../flows/wallet.flow';
+import FixtureBuilder from '../../framework/fixtures/FixtureBuilder';
+import { withFixtures } from '../../framework/fixtures/FixtureHelper';
+import { TestSuiteParams } from '../../framework/types';
+import {
+  readFixtureFile,
+  computeSchemaDiff,
+  formatSchemaDiff,
+  mergeFixtureChanges,
+  sortObjectKeysDeep,
+  normalizeExportedState,
+  hasStructuralChanges as hasStructuralChangesCheck,
+  getAutoUpdatableKeys,
+  FixtureSchemaDiff,
+} from '../../framework/fixtures/fixture-validation';
+
+describe(FixtureValidation('Fixture Validation — Post-Onboarding'), () => {
+  beforeAll(async () => {
+    jest.setTimeout(150000);
+  });
+
+  it('validates the committed fixture and exports updates when structural changes exist', async () => {
+    await withFixtures(
+      {
+        fixture: new FixtureBuilder().withOnboardingFixture().build(),
+        restartDevice: true,
+        useCommandQueueServer: true,
+      },
+      async ({ commandQueueServer }: TestSuiteParams) => {
+        if (!commandQueueServer) {
+          throw new Error('Command queue server not available');
+        }
+
+        // Complete onboarding flow
+        await CreateNewWallet();
+
+        // Capture live app state
+        commandQueueServer.requestStateExport();
+        const exported = await commandQueueServer.getExportedState();
+
+        // Read the committed default fixture (existing-user baseline)
+        const fixture = readFixtureFile('default-fixture.json');
+        const fixtureState = fixture.state as Record<string, unknown>;
+
+        // Normalize exported state to match fixture shape
+        const liveState = normalizeExportedState(exported);
+
+        // Compare
+        const diff = computeSchemaDiff(fixtureState, liveState);
+        const report = formatSchemaDiff(diff);
+
+        const hasStructuralChanges = hasStructuralChangesCheck(diff);
+
+        // --- Validation: write reports for CI ---
+
+        const reportsDir = path.resolve(__dirname, '..', '..', 'reports');
+        if (!fs.existsSync(reportsDir)) {
+          fs.mkdirSync(reportsDir, { recursive: true });
+        }
+
+        // Human-readable diff report (written to reportsDir so it's always uploaded)
+        const diffPath = path.join(reportsDir, 'fixture-validation-diff.txt');
+        if (hasStructuralChanges || diff.valueMismatches.length > 0) {
+          const summary = [
+            '--- Fixture Diff Report ---',
+            '',
+            report,
+            '',
+            `New keys: ${diff.newKeys.length}`,
+            `Missing keys: ${diff.missingKeys.length}`,
+            `Type mismatches: ${diff.typeMismatches.length}`,
+            `Value mismatches: ${diff.valueMismatches.length} (informational)`,
+            '',
+            'To update the committed fixture, comment on the PR:',
+            '  @metamaskbot update-mobile-fixture',
+          ].join('\n');
+
+          fs.writeFileSync(diffPath, summary, 'utf-8');
+          console.log(`\nFull diff written to: ${diffPath}`);
+        } else {
+          fs.writeFileSync(
+            diffPath,
+            'No differences found — fixture is up to date.',
+            'utf-8',
+          );
+        }
+
+        // Machine-readable JSON summary for downstream CI job
+        fs.writeFileSync(
+          path.join(reportsDir, 'fixture-validation-result.json'),
+          JSON.stringify(
+            {
+              hasStructuralChanges,
+              newKeys: diff.newKeys.length,
+              missingKeys: diff.missingKeys.length,
+              typeMismatches: diff.typeMismatches.length,
+              valueMismatches: diff.valueMismatches.length,
+            },
+            null,
+            2,
+          ),
+          'utf-8',
+        );
+
+        // --- Export: update fixture file when changes exist ---
+
+        // Promote auto-updatable value mismatches (e.g. fiatOrders.networks)
+        // so they get merged alongside structural changes.
+        const autoUpdatableKeys = getAutoUpdatableKeys();
+        const autoUpdateMismatches = diff.valueMismatches.filter((m) =>
+          autoUpdatableKeys.includes(m.key),
+        );
+
+        const shouldUpdate =
+          hasStructuralChanges || autoUpdateMismatches.length > 0;
+
+        if (shouldUpdate) {
+          // Merge structural changes + auto-updatable value mismatches.
+          // Other value mismatches are NOT auto-merged because the default
+          // fixture represents an existing user, not a fresh post-onboarding state.
+          const structuralDiff: FixtureSchemaDiff = {
+            newKeys: diff.newKeys,
+            missingKeys: diff.missingKeys,
+            typeMismatches: diff.typeMismatches,
+            valueMismatches: autoUpdateMismatches,
+          };
+
+          const mergedState = mergeFixtureChanges(
+            fixtureState,
+            liveState,
+            structuralDiff,
+          );
+          const updatedFixture = sortObjectKeysDeep({
+            ...fixture,
+            state: mergedState,
+          }) as Record<string, unknown>;
+
+          // Only write to the source fixture file in CI to avoid accidental
+          // local modifications. Locally the diff report is still written to
+          // the reports directory for inspection.
+          const isCI =
+            process.env.CI === 'true' || process.env.GITHUB_CI === 'true';
+          const fixturePath = isCI
+            ? path.resolve(
+                __dirname,
+                '..',
+                '..',
+                'framework',
+                'fixtures',
+                'json',
+                'default-fixture.json',
+              )
+            : path.join(reportsDir, 'updated-default-fixture.json');
+
+          fs.writeFileSync(
+            fixturePath,
+            JSON.stringify(updatedFixture, null, 2) + '\n',
+            'utf-8',
+          );
+
+          // TODO: Change console.warn to throw once fixture validation is stable
+          console.warn(
+            `Committed fixture is out of date.\n` +
+              `  New keys: ${diff.newKeys.length}\n` +
+              `  Missing keys: ${diff.missingKeys.length}\n` +
+              `  Type mismatches: ${diff.typeMismatches.length}\n` +
+              `  Auto-updated values: ${autoUpdateMismatches.length}\n\n` +
+              `Updated fixture written to: ${fixturePath}\n` +
+              `Structural changes and auto-updatable keys were applied.\n` +
+              `Other value mismatches require manual review.`,
+          );
+        } else if (diff.valueMismatches.length > 0) {
+          console.log(
+            `\nFixture schema is up to date. ${diff.valueMismatches.length} value mismatches detected (expected — fixture represents an existing user).`,
+          );
+        } else {
+          console.log('No differences found — fixture is up to date.');
+        }
+      },
+    );
+  });
+});
diff --git a/tests/regression/wallet/fixture-validation.spec.ts b/tests/regression/wallet/fixture-validation.spec.ts
deleted file mode 100644
index 4d54c1bb3e61..000000000000
--- a/tests/regression/wallet/fixture-validation.spec.ts
+++ /dev/null
@@ -1,145 +0,0 @@
-// eslint-disable-next-line import/no-nodejs-modules, import/no-namespace
-import * as fs from 'fs';
-// eslint-disable-next-line import/no-namespace, import/no-nodejs-modules
-import * as path from 'path';
-import { RegressionWalletPlatform } from '../../tags';
-import { CreateNewWallet } from '../../flows/wallet.flow';
-import FixtureBuilder from '../../framework/fixtures/FixtureBuilder';
-import { withFixtures } from '../../framework/fixtures/FixtureHelper';
-import { TestSuiteParams } from '../../framework/types';
-import {
-  readFixtureFile,
-  computeSchemaDiff,
-  hasSchemaDifferences,
-  formatSchemaDiff,
-  mergeFixtureChanges,
-  sortObjectKeysDeep,
-} from '../../framework/fixtures/fixture-validation';
-
-/**
- * Normalizes the exported app state (from captureAppState) into the same
- * shape as fixture JSON's `state` subtree so they can be compared.
- *
- * Exported:  { redux: { alert, browser, ... }, engine: { AccountTrackerController, ... } }
- * Fixture:   { state: { alert, browser, ..., engine: { backgroundState: { AccountTrackerController, ... } } } }
- */
-function normalizeExportedState(
-  exported: Record<string, unknown>,
-): Record<string, unknown> {
-  const redux = exported.redux as Record<string, unknown>;
-  const engine = exported.engine as Record<string, unknown>;
-  return {
-    ...redux,
-    engine: {
-      backgroundState: engine,
-    },
-  };
-}
-
-describe(
-  RegressionWalletPlatform('Fixture Validation — Post-Onboarding'),
-  () => {
-    beforeAll(async () => {
-      jest.setTimeout(150000);
-    });
-
-    it('compares live post-onboarding state against the default fixture', async () => {
-      await withFixtures(
-        {
-          fixture: new FixtureBuilder().withOnboardingFixture().build(),
-          restartDevice: true,
-          useCommandQueueServer: true,
-        },
-        async ({ commandQueueServer }: TestSuiteParams) => {
-          if (!commandQueueServer) {
-            throw new Error('Command queue server not available');
-          }
-
-          // Complete onboarding flow
-          await CreateNewWallet();
-
-          // Capture live app state
-          commandQueueServer.requestStateExport();
-          const exported = await commandQueueServer.getExportedState();
-
-          // Read the committed default fixture (post-onboarding baseline)
-          const fixture = readFixtureFile('default-fixture.json');
-          const fixtureState = fixture.state as Record<string, unknown>;
-
-          // Normalize exported state to match fixture shape
-          const liveState = normalizeExportedState(exported);
-
-          // Compare
-          const diff = computeSchemaDiff(fixtureState, liveState);
-
-          // Write full diff report to a file for easy inspection
-          const outputDir = path.resolve(
-            __dirname,
-            '..',
-            '..',
-            '..',
-            'artifacts',
-          );
-          if (!fs.existsSync(outputDir)) {
-            fs.mkdirSync(outputDir, { recursive: true });
-          }
-          const outputPath = path.join(
-            outputDir,
-            'fixture-validation-diff.txt',
-          );
-
-          if (hasSchemaDifferences(diff)) {
-            const report = formatSchemaDiff(diff);
-            const summary = [
-              '--- Fixture Schema Diff ---',
-              '',
-              report,
-              '',
-              `New keys: ${diff.newKeys.length}`,
-              `Missing keys: ${diff.missingKeys.length}`,
-              `Type mismatches: ${diff.typeMismatches.length}`,
-              `Value mismatches: ${diff.valueMismatches.length}`,
-            ].join('\n');
-
-            fs.writeFileSync(outputPath, summary, 'utf-8');
-            console.log(`\nFull diff written to: ${outputPath}`);
-            console.log(`\nNew keys: ${diff.newKeys.length}`);
-            console.log(`Missing keys: ${diff.missingKeys.length}`);
-            console.log(`Type mismatches: ${diff.typeMismatches.length}`);
-            console.log(`Value mismatches: ${diff.valueMismatches.length}`);
-
-            // Merge changes into the fixture and write updated version
-            const mergedState = mergeFixtureChanges(
-              fixtureState,
-              liveState,
-              diff,
-            );
-            const updatedFixture = sortObjectKeysDeep({
-              ...fixture,
-              state: mergedState,
-            }) as Record<string, unknown>;
-
-            const updatedFixturePath = path.join(
-              outputDir,
-              'updated-default-fixture.json',
-            );
-            fs.writeFileSync(
-              updatedFixturePath,
-              JSON.stringify(updatedFixture, null, 2) + '\n',
-              'utf-8',
-            );
-            console.log(`\nUpdated fixture written to: ${updatedFixturePath}`);
-          } else {
-            const msg = 'No schema differences found — fixture is up to date.';
-            fs.writeFileSync(outputPath, msg, 'utf-8');
-            console.log(msg);
-          }
-
-          // For now, log the diff but don't fail.
-          // Once the ignored-keys list is tuned, flip this to:
-          //   expect(hasSchemaDifferences(diff)).toBe(false);
-        },
-      );
-    });
-  },
-);
diff --git a/tests/reporters/PerformanceTracker.ts b/tests/reporters/PerformanceTracker.ts
index 442328973267..0af177f1edc2 100644
--- a/tests/reporters/PerformanceTracker.ts
+++ b/tests/reporters/PerformanceTracker.ts
@@ -12,7 +12,7 @@ interface Timer {
   hasThreshold(): boolean;
 }
 
-interface MetricsOutput {
+export interface MetricsOutput {
   steps: MetricStep[];
   timestamp: string;
   thresholdMarginPercent: number;
diff --git a/tests/reporters/providers/sentry/PerformanceSentryPublisher.test.ts b/tests/reporters/providers/sentry/PerformanceSentryPublisher.test.ts
new file mode 100644
index 000000000000..909572936b6a
--- /dev/null
+++ b/tests/reporters/providers/sentry/PerformanceSentryPublisher.test.ts
@@ -0,0 +1,311 @@
+jest.mock('../../../framework/logger.ts', () => ({
+  createLogger: jest.fn(() => ({
+    info: jest.fn(),
+    warn: jest.fn(),
+    error: jest.fn(),
+    debug: jest.fn(),
+  })),
+}));
+
+import { publishPerformanceScenarioToSentry } from './PerformanceSentryPublisher';
+import type { MetricsOutput } from '../../PerformanceTracker';
+
+function createMetrics(overrides: Partial<MetricsOutput> = {}): MetricsOutput {
+  return {
+    steps: [
+      {
+        name: 'Step 1 Load',
+        duration: 600,
+        baseThreshold: 800,
+        threshold: 880,
+        validation: {
+          passed: true,
+          exceeded: null,
+          percentOver: null,
+        },
+      },
+      {
+        name: 'Step 1/Load',
+        duration: 700,
+        baseThreshold: 850,
+        threshold: 935,
+        validation: {
+          passed: true,
+          exceeded: null,
+          percentOver: null,
+        },
+      },
+    ],
+    timestamp: '2026-01-01T00:00:00.000Z',
+    thresholdMarginPercent: 10,
+    team: {
+      teamId: 'qa-automation',
+      teamName: 'QA Automation',
+    },
+    total: 1.3,
+    totalThreshold: 1815,
+    hasThresholds: true,
+    totalValidation: {
+      passed: true,
+      exceeded: null,
+      percentOver: null,
+    },
+    device: {
+      name: 'Samsung Galaxy S23 Ultra',
+      osVersion: '13.0',
+      provider: 'browserstack',
+    },
+    ...overrides,
+  };
+}
+
+describe('PerformanceSentryPublisher', () => {
+  let fetchMock: jest.SpiedFunction<typeof fetch>;
+  const originalSentryDsn = process.env.E2E_PERFORMANCE_SENTRY_DSN;
+  const originalSentrySampleRate =
+    process.env.E2E_PERFORMANCE_SENTRY_SAMPLE_RATE;
+  const originalSentryEnabled = process.env.E2E_PERFORMANCE_SENTRY_ENABLED;
+
+  beforeEach(() => {
+    jest.clearAllMocks();
+    delete process.env.E2E_PERFORMANCE_SENTRY_DSN;
+    delete process.env.E2E_PERFORMANCE_SENTRY_SAMPLE_RATE;
+    delete process.env.E2E_PERFORMANCE_SENTRY_ENABLED;
+    fetchMock = jest.spyOn(global, 'fetch');
+  });
+
+  afterEach(() => {
+    if (originalSentryDsn === undefined) {
+      delete process.env.E2E_PERFORMANCE_SENTRY_DSN;
+    } else {
+      process.env.E2E_PERFORMANCE_SENTRY_DSN = originalSentryDsn;
+    }
+
+    if (originalSentrySampleRate === undefined) {
+      delete process.env.E2E_PERFORMANCE_SENTRY_SAMPLE_RATE;
+    } else {
+      process.env.E2E_PERFORMANCE_SENTRY_SAMPLE_RATE = originalSentrySampleRate;
+    }
+
+    if (originalSentryEnabled === undefined) {
+      delete process.env.E2E_PERFORMANCE_SENTRY_ENABLED;
+    } else {
+      process.env.E2E_PERFORMANCE_SENTRY_ENABLED = originalSentryEnabled;
+    }
+
+    fetchMock.mockRestore();
+  });
+
+  it('does not send when DSN is missing', async () => {
+    const sent = await publishPerformanceScenarioToSentry({
+      metrics: createMetrics(),
+      testTitle: 'Import wallet flow',
+      projectName: 'browserstack-android',
+      testFilePath: 'tests/performance/onboarding/import-wallet.spec.js',
+      tags: ['@PerformanceOnboarding'],
+      status: 'passed',
+      retry: 0,
+      workerIndex: 1,
+    });
+
+    expect(sent).toBe(false);
+    expect(fetchMock).not.toHaveBeenCalled();
+  });
+
+  it('sends performance timers as sentry measurements', async () => {
+    process.env.E2E_PERFORMANCE_SENTRY_DSN =
+      'https://publicKey@o123.ingest.sentry.io/4567';
+    fetchMock.mockResolvedValue({
+      ok: true,
+      status: 200,
+    } as Response);
+
+    const sent = await publishPerformanceScenarioToSentry({
+      metrics: createMetrics(),
+      testTitle: 'Import wallet flow',
+      projectName: 'browserstack-android',
+      testFilePath: 'tests/performance/onboarding/import-wallet.spec.js',
+      tags: ['@PerformanceOnboarding', '@PerformanceLaunch'],
+      status: 'passed',
+      retry: 0,
+      workerIndex: 3,
+    });
+
+    expect(sent).toBe(true);
+    expect(fetchMock).toHaveBeenCalledTimes(1);
+
+    const [endpoint, requestInit] = fetchMock.mock.calls[0] ?? [];
+    expect(endpoint).toBeDefined();
+    const endpointUrl = new URL(String(endpoint));
+    expect(endpointUrl.origin).toBe('https://o123.ingest.sentry.io');
+    expect(endpointUrl.pathname).toBe('/api/4567/envelope/');
+    expect(endpointUrl.searchParams.get('sentry_key')).toBe('publicKey');
+    expect(endpointUrl.searchParams.get('sentry_version')).toBe('7');
+    expect(requestInit).toBeDefined();
+    if (!requestInit) {
+      throw new Error('Expected request init payload for Sentry request');
+    }
+    expect(requestInit.method).toBe('POST');
+
+    const body = requestInit.body as string;
+    const [, itemHeaderLine, payloadLine] = body.split('\n');
+    const itemHeaders = JSON.parse(itemHeaderLine);
+    const payload = JSON.parse(payloadLine);
+
+    expect(itemHeaders.type).toBe('transaction');
+    expect(payload.transaction).toBe('Import wallet flow');
+    expect(payload.measurements.step_1_load.value).toBe(600);
+    expect(payload.measurements.step_1_load_2.value).toBe(700);
+    expect(payload.measurements.scenario_total_time_ms.value).toBe(1300);
+    expect(payload.tags.project_name).toBe('browserstack-android');
+    expect(payload.extra.timer_steps).toHaveLength(2);
+  });
+
+  it('protects reserved aggregate keys from timer-key collisions', async () => {
+    process.env.E2E_PERFORMANCE_SENTRY_DSN =
+      'https://publicKey@o123.ingest.sentry.io/4567';
+    fetchMock.mockResolvedValue({
+      ok: true,
+      status: 200,
+    } as Response);
+
+    const sent = await publishPerformanceScenarioToSentry({
+      metrics: createMetrics({
+        steps: [
+          {
+            name: 'scenario_total_time_ms',
+            duration: 111,
+            baseThreshold: 200,
+            threshold: 220,
+            validation: {
+              passed: true,
+              exceeded: null,
+              percentOver: null,
+            },
+          },
+          {
+            name: 'scenario_total_threshold_ms',
+            duration: 222,
+            baseThreshold: 300,
+            threshold: 330,
+            validation: {
+              passed: true,
+              exceeded: null,
+              percentOver: null,
+            },
+          },
+        ],
+      }),
+      testTitle: 'Import wallet flow',
+      projectName: 'browserstack-android',
+      testFilePath: 'tests/performance/onboarding/import-wallet.spec.js',
+      tags: ['@PerformanceOnboarding'],
+      status: 'passed',
+      retry: 0,
+      workerIndex: 0,
+    });
+
+    expect(sent).toBe(true);
+    const [, requestInit] = fetchMock.mock.calls[0] ?? [];
+    expect(requestInit).toBeDefined();
+    if (!requestInit) {
+      throw new Error('Expected request init payload for Sentry request');
+    }
+
+    const body = requestInit.body as string;
+    const [, , payloadLine] = body.split('\n');
+    const payload = JSON.parse(payloadLine);
+
+    // Aggregate keys must remain reserved for totals.
+    expect(payload.measurements.scenario_total_time_ms.value).toBe(1300);
+    expect(payload.measurements.scenario_total_threshold_ms.value).toBe(1815);
+    expect(payload.measurements.scenario_total_time_ms_2.value).toBe(111);
+    expect(payload.measurements.scenario_total_threshold_ms_2.value).toBe(222);
+  });
+
+  it('keeps long colliding timer keys within 64 characters', async () => {
+    process.env.E2E_PERFORMANCE_SENTRY_DSN =
+      'https://publicKey@o123.ingest.sentry.io/4567';
+    fetchMock.mockResolvedValue({
+      ok: true,
+      status: 200,
+    } as Response);
+
+    const longName = 'long_timer_step_name_'.repeat(8);
+    const sent = await publishPerformanceScenarioToSentry({
+      metrics: createMetrics({
+        steps: [
+          {
+            name: longName,
+            duration: 333,
+            baseThreshold: 400,
+            threshold: 440,
+            validation: {
+              passed: true,
+              exceeded: null,
+              percentOver: null,
+            },
+          },
+          {
+            name: longName,
+            duration: 444,
+            baseThreshold: 500,
+            threshold: 550,
+            validation: {
+              passed: true,
+              exceeded: null,
+              percentOver: null,
+            },
+          },
+        ],
+      }),
+      testTitle: 'Import wallet flow',
+      projectName: 'browserstack-android',
+      testFilePath: 'tests/performance/onboarding/import-wallet.spec.js',
+      tags: ['@PerformanceOnboarding'],
+      status: 'passed',
+      retry: 0,
+      workerIndex: 0,
+    });
+
+    expect(sent).toBe(true);
+    const [, requestInit] = fetchMock.mock.calls[0] ?? [];
+    expect(requestInit).toBeDefined();
+    if (!requestInit) {
+      throw new Error('Expected request init payload for Sentry request');
+    }
+
+    const body = requestInit.body as string;
+    const [, , payloadLine] = body.split('\n');
+    const payload = JSON.parse(payloadLine);
+
+    const longTimerKeys = payload.extra.timer_steps
+      .filter((step: { name: string }) => step.name === longName)
+      .map((step: { key: string }) => step.key);
+
+    expect(longTimerKeys).toHaveLength(2);
+    expect(new Set(longTimerKeys).size).toBe(2);
+    expect(longTimerKeys.some((key: string) => key.endsWith('_2'))).toBe(true);
+    expect(longTimerKeys.every((key: string) => key.length <= 64)).toBe(true);
+  });
+
+  it('does not send when sample rate is invalid', async () => {
+    process.env.E2E_PERFORMANCE_SENTRY_DSN =
+      'https://publicKey@o123.ingest.sentry.io/4567';
+    process.env.E2E_PERFORMANCE_SENTRY_SAMPLE_RATE = '2';
+
+    const sent = await publishPerformanceScenarioToSentry({
+      metrics: createMetrics(),
+      testTitle: 'Import wallet flow',
+      projectName: 'browserstack-android',
+      testFilePath: 'tests/performance/onboarding/import-wallet.spec.js',
+      tags: ['@PerformanceOnboarding'],
+      status: 'passed',
+      retry: 0,
+      workerIndex: 0,
+    });
+
+    expect(sent).toBe(false);
+    expect(fetchMock).not.toHaveBeenCalled();
+  });
+});
diff --git a/tests/reporters/providers/sentry/PerformanceSentryPublisher.ts b/tests/reporters/providers/sentry/PerformanceSentryPublisher.ts
new file mode 100644
index 000000000000..221096c614c2
--- /dev/null
+++ b/tests/reporters/providers/sentry/PerformanceSentryPublisher.ts
@@ -0,0 +1,366 @@
+/* eslint-disable import/no-nodejs-modules */
+import { randomUUID } from 'node:crypto';
+import { createLogger } from '../../../framework/logger';
+import type { MetricsOutput } from '../../PerformanceTracker';
+
+const logger = createLogger({ name: 'PerformanceSentryPublisher' });
+
+const DEFAULT_ENVIRONMENT = 'e2e-performance';
+const DEFAULT_SAMPLE_RATE = 1;
+const ENV_SENTRY_DSN = 'E2E_PERFORMANCE_SENTRY_DSN';
+const ENV_SENTRY_ENABLED = 'E2E_PERFORMANCE_SENTRY_ENABLED';
+const ENV_SENTRY_SAMPLE_RATE = 'E2E_PERFORMANCE_SENTRY_SAMPLE_RATE';
+const ENV_SENTRY_ENVIRONMENT = 'E2E_PERFORMANCE_SENTRY_ENVIRONMENT';
+const ENV_SENTRY_RELEASE = 'E2E_PERFORMANCE_SENTRY_RELEASE';
+const MAX_MEASUREMENT_KEY_LENGTH = 64;
+const RESERVED_MEASUREMENT_KEYS = [
+  'scenario_total_time_ms',
+  'scenario_total_threshold_ms',
+] as const;
+
+interface PublishPerformanceScenarioOptions {
+  metrics: MetricsOutput;
+  testTitle: string;
+  projectName: string;
+  testFilePath?: string;
+  tags: string[];
+  status?: string;
+  retry?: number;
+  workerIndex?: number;
+}
+
+interface ParsedSentryDsn {
+  dsn: string;
+  endpoint: string;
+  projectId: string;
+  publicKey: string;
+}
+
+interface TimerMeasurement {
+  key: string;
+  name: string;
+  duration: number;
+  threshold: number | null;
+  baseThreshold: number | null;
+  passed: boolean | null;
+  exceeded: number | null;
+  percentOver: string | null;
+}
+
+interface SentryMeasurement {
+  value: number;
+  unit: 'millisecond';
+}
+
+function getEnvValue(key: string): string | undefined {
+  return Reflect.get(process.env, key) as string | undefined;
+}
+
+function createHexId(length: number): string {
+  return randomUUID().replace(/-/gu, '').slice(0, length);
+}
+
+function normalizeSpanStatus(status?: string): string {
+  switch (status) {
+    case 'passed':
+      return 'ok';
+    case 'timedOut':
+      return 'deadline_exceeded';
+    case 'failed':
+      return 'internal_error';
+    case 'skipped':
+      return 'cancelled';
+    default:
+      return 'unknown_error';
+  }
+}
+
+function sanitizeMeasurementKey(name: string): string {
+  const baseKey = name
+    .toLowerCase()
+    .replace(/[^a-z0-9_.-]/gu, '_')
+    .replace(/_+/gu, '_')
+    .replace(/^_+|_+$/gu, '');
+
+  if (!baseKey) {
+    return 'timer_measurement';
+  }
+
+  if (/^[0-9]/u.test(baseKey)) {
+    return `timer_${baseKey}`;
+  }
+
+  return baseKey;
+}
+
+function createUniqueMeasurementKey(
+  name: string,
+  usedKeys: Set<string>,
+): string {
+  const baseKey = sanitizeMeasurementKey(name).slice(
+    0,
+    MAX_MEASUREMENT_KEY_LENGTH,
+  );
+  if (!usedKeys.has(baseKey)) {
+    usedKeys.add(baseKey);
+    return baseKey;
+  }
+
+  let suffix = 2;
+  while (true) {
+    const suffixToken = `_${suffix}`;
+    const maxBaseLength = Math.max(
+      1,
+      MAX_MEASUREMENT_KEY_LENGTH - suffixToken.length,
+    );
+    const collisionKey = `${baseKey.slice(0, maxBaseLength)}${suffixToken}`;
+
+    if (!usedKeys.has(collisionKey)) {
+      usedKeys.add(collisionKey);
+      return collisionKey;
+    }
+
+    suffix += 1;
+  }
+}
+
+function parseSentryDsn(dsn: string): ParsedSentryDsn | null {
+  try {
+    const parsedUrl = new URL(dsn);
+    const pathSegments = parsedUrl.pathname.split('/').filter(Boolean);
+    const projectId = pathSegments[pathSegments.length - 1];
+    const publicKey = parsedUrl.username;
+
+    if (!projectId || !publicKey) {
+      return null;
+    }
+
+    const pathPrefixSegments = pathSegments.slice(0, -1);
+    const pathPrefix =
+      pathPrefixSegments.length > 0 ? `/${pathPrefixSegments.join('/')}` : '';
+    const endpointUrl = new URL(
+      `${pathPrefix}/api/${projectId}/envelope/`,
+      `${parsedUrl.protocol}//${parsedUrl.host}`,
+    );
+    endpointUrl.searchParams.set('sentry_key', publicKey);
+    endpointUrl.searchParams.set('sentry_version', '7');
+
+    return {
+      dsn,
+      projectId,
+      publicKey,
+      endpoint: endpointUrl.toString(),
+    };
+  } catch {
+    return null;
+  }
+}
+
+function parseSampleRate(rawSampleRate: string | undefined): number | null {
+  if (!rawSampleRate) {
+    return DEFAULT_SAMPLE_RATE;
+  }
+
+  const sampleRate = Number(rawSampleRate);
+  if (!Number.isFinite(sampleRate) || sampleRate < 0 || sampleRate > 1) {
+    return null;
+  }
+
+  return sampleRate;
+}
+
+export async function publishPerformanceScenarioToSentry(
+  options: PublishPerformanceScenarioOptions,
+): Promise<boolean> {
+  if (options.metrics.steps.length === 0) {
+    return false;
+  }
+
+  if (getEnvValue(ENV_SENTRY_ENABLED) === 'false') {
+    return false;
+  }
+
+  const dsn = getEnvValue(ENV_SENTRY_DSN);
+  if (!dsn) {
+    return false;
+  }
+
+  const parsedDsn = parseSentryDsn(dsn);
+  if (!parsedDsn) {
+    logger.warn('Invalid E2E_PERFORMANCE_SENTRY_DSN. Skipping upload.');
+    return false;
+  }
+
+  const sampleRate = parseSampleRate(getEnvValue(ENV_SENTRY_SAMPLE_RATE));
+  if (sampleRate === null) {
+    logger.warn(
+      'Invalid E2E_PERFORMANCE_SENTRY_SAMPLE_RATE. Expected value between 0 and 1.',
+    );
+    return false;
+  }
+
+  if (sampleRate < 1 && Math.random() > sampleRate) {
+    return false;
+  }
+
+  const eventId = createHexId(32);
+  const traceId = createHexId(32);
+  const transactionSpanId = createHexId(16);
+
+  const totalDurationMs = Math.round(options.metrics.total * 1000);
+  const endTimestamp = Date.now() / 1000;
+  const startTimestamp = endTimestamp - totalDurationMs / 1000;
+
+  const usedMeasurementKeys = new Set<string>(RESERVED_MEASUREMENT_KEYS);
+  const timerMeasurements: TimerMeasurement[] = options.metrics.steps.map(
+    (step) => ({
+      key: createUniqueMeasurementKey(step.name, usedMeasurementKeys),
+      name: step.name,
+      duration: step.duration,
+      threshold: step.threshold ?? null,
+      baseThreshold: step.baseThreshold ?? null,
+      passed: step.validation?.passed ?? null,
+      exceeded: step.validation?.exceeded ?? null,
+      percentOver: step.validation?.percentOver ?? null,
+    }),
+  );
+
+  const measurements: Record<string, SentryMeasurement> = {
+    scenario_total_time_ms: {
+      value: totalDurationMs,
+      unit: 'millisecond',
+    },
+  };
+
+  for (const timerMeasurement of timerMeasurements) {
+    measurements[timerMeasurement.key] = {
+      value: timerMeasurement.duration,
+      unit: 'millisecond',
+    };
+  }
+
+  if (options.metrics.totalThreshold !== null) {
+    measurements.scenario_total_threshold_ms = {
+      value: options.metrics.totalThreshold,
+      unit: 'millisecond',
+    };
+  }
+
+  let cursor = startTimestamp;
+  const spans = timerMeasurements.map((timerMeasurement) => {
+    const spanStart = cursor;
+    const spanEnd = spanStart + timerMeasurement.duration / 1000;
+    cursor = spanEnd;
+
+    return {
+      trace_id: traceId,
+      span_id: createHexId(16),
+      parent_span_id: transactionSpanId,
+      op: 'e2e.performance.step',
+      description: timerMeasurement.name,
+      start_timestamp: spanStart,
+      timestamp: spanEnd,
+      status: timerMeasurement.passed === false ? 'deadline_exceeded' : 'ok',
+      data: {
+        duration_ms: timerMeasurement.duration,
+        threshold_ms: timerMeasurement.threshold,
+        base_threshold_ms: timerMeasurement.baseThreshold,
+        exceeded_ms: timerMeasurement.exceeded,
+        percent_over: timerMeasurement.percentOver,
+      },
+    };
+  });
+
+  const environment =
+    getEnvValue(ENV_SENTRY_ENVIRONMENT) || DEFAULT_ENVIRONMENT;
+  const release = getEnvValue(ENV_SENTRY_RELEASE);
+
+  const payload = {
+    event_id: eventId,
+    type: 'transaction',
+    platform: 'javascript',
+    transaction: options.testTitle,
+    transaction_info: {
+      source: 'custom',
+    },
+    start_timestamp: startTimestamp,
+    timestamp: endTimestamp,
+    environment,
+    ...(release ? { release } : {}),
+    contexts: {
+      trace: {
+        trace_id: traceId,
+        span_id: transactionSpanId,
+        op: 'e2e.performance.scenario',
+        status: normalizeSpanStatus(options.status),
+      },
+      device: {
+        name: options.metrics.device.name,
+        os_version: options.metrics.device.osVersion,
+      },
+    },
+    tags: {
+      source: 'appwright-e2e-performance',
+      project_name: options.projectName,
+      provider: options.metrics.device.provider || 'unknown',
+      team_id: options.metrics.team?.teamId || 'unknown',
+      team_name: options.metrics.team?.teamName || 'unknown',
+      test_status: options.status || 'unknown',
+      retry: String(options.retry ?? 0),
+      worker_index: String(options.workerIndex ?? 0),
+    },
+    measurements,
+    spans,
+    extra: {
+      test_file_path: options.testFilePath || '',
+      test_tags: options.tags,
+      threshold_margin_percent: options.metrics.thresholdMarginPercent,
+      has_thresholds: options.metrics.hasThresholds,
+      total_seconds: options.metrics.total,
+      total_threshold_ms: options.metrics.totalThreshold,
+      total_validation: options.metrics.totalValidation,
+      timer_steps: timerMeasurements,
+      sentry_project_id: parsedDsn.projectId,
+    },
+  };
+
+  const envelopeHeaders = {
+    event_id: eventId,
+    dsn: parsedDsn.dsn,
+    sent_at: new Date().toISOString(),
+  };
+  const itemHeaders = {
+    type: 'transaction',
+  };
+
+  const envelope = `${JSON.stringify(envelopeHeaders)}\n${JSON.stringify(itemHeaders)}\n${JSON.stringify(payload)}`;
+
+  try {
+    const response = await fetch(parsedDsn.endpoint, {
+      method: 'POST',
+      headers: {
+        'Content-Type': 'application/x-sentry-envelope',
+        'User-Agent': 'metamask-mobile-appwright-performance',
+      },
+      body: envelope,
+    });
+
+    if (!response.ok) {
+      logger.warn(
+        `Failed to upload scenario "${options.testTitle}" to Sentry. Status: ${response.status}`,
+      );
+      return false;
+    }
+
+    logger.info(
+      `Uploaded scenario "${options.testTitle}" with ${timerMeasurements.length} timer measurements to Sentry.`,
+    );
+    return true;
+  } catch (error) {
+    const message = error instanceof Error ? error.message : String(error);
+    logger.warn(
+      `Error uploading scenario "${options.testTitle}" to Sentry: ${message}`,
+    );
+    return false;
+  }
+}
diff --git a/tests/selectors/Browser/TestSnaps.selectors.ts b/tests/selectors/Browser/TestSnaps.selectors.ts
index c73980ba39ea..ab786a90d3ce 100644
--- a/tests/selectors/Browser/TestSnaps.selectors.ts
+++ b/tests/selectors/Browser/TestSnaps.selectors.ts
@@ -21,6 +21,7 @@ export const TestSnapViewSelectorWebIDS = {
   connectInteractiveButton: 'connectinteractive-ui',
   connectManageStateButton: 'connectmanage-state',
   connectMultichainProviderButton: 'connectmultichain-provider',
+  connectNameLookupButton: 'connectname-lookup',
   connectNetworkAccessButton: 'connectnetwork-access',
   connectEthereumProviderButton: 'connectethereum-provider',
   connectStateButton: 'connectstate',
diff --git a/tests/smoke/card/card-home-add-funds.spec.ts b/tests/smoke/card/card-home-add-funds.spec.ts
index 1def6e83c1f5..68b42879d9bd 100644
--- a/tests/smoke/card/card-home-add-funds.spec.ts
+++ b/tests/smoke/card/card-home-add-funds.spec.ts
@@ -62,9 +62,17 @@ describe(SmokeCard('CardHome - Add Funds'), () => {
       await CardHomeView.tapAddFundsButton();
       await Assertions.expectElementToBeVisible(
         CardHomeView.addFundsBottomSheetDepositOption,
+        {
+          elemDescription:
+            'Add Funds Bottom Sheet Deposit Option in Card Home View',
+        },
       );
       await Assertions.expectElementToBeVisible(
         CardHomeView.addFundsBottomSheetSwapOption,
+        {
+          elemDescription:
+            'Add Funds Bottom Sheet Swap Option in Card Home View',
+        },
       );
     });
   });
@@ -74,7 +82,6 @@ describe(SmokeCard('CardHome - Add Funds'), () => {
       CARD_BUTTON_VIEWED: 'Card Button Viewed',
       CARD_HOME_CLICKED: 'Card Home Clicked',
       CARD_ADD_FUNDS_CLICKED: 'Card Add Funds Clicked',
-      CARD_ADVANCED_MANAGEMENT_CLICKED: 'Card Advanced Management Clicked',
     };
 
     const softAssert = new SoftAssert();
@@ -89,35 +96,23 @@ describe(SmokeCard('CardHome - Add Funds'), () => {
     const cardAddFundsClicked = eventsToCheck.filter(
       (event) => event.event === expectedEvents.CARD_ADD_FUNDS_CLICKED,
     );
-    const cardAdvancedManagementClicked = eventsToCheck.filter(
-      (event) =>
-        event.event === expectedEvents.CARD_ADVANCED_MANAGEMENT_CLICKED,
-    );
 
     const checkCardButtonViewed = softAssert.checkAndCollect(async () => {
-      await Assertions.checkIfValueIsDefined(cardButtonViewed);
+      await Assertions.checkIfArrayHasLength(cardButtonViewed, 1);
     }, 'Check Card Button Viewed event');
 
     const checkCardHomeClicked = softAssert.checkAndCollect(async () => {
-      await Assertions.checkIfValueIsDefined(cardHomeClicked);
+      await Assertions.checkIfArrayHasLength(cardHomeClicked, 1);
     }, 'Check Card Home Clicked event');
 
     const checkCardAddFundsClicked = softAssert.checkAndCollect(async () => {
-      await Assertions.checkIfValueIsDefined(cardAddFundsClicked);
+      await Assertions.checkIfArrayHasLength(cardAddFundsClicked, 1);
     }, 'Check Card Add Funds Clicked event');
 
-    const checkCardAdvancedManagementClicked = softAssert.checkAndCollect(
-      async () => {
-        await Assertions.checkIfValueIsDefined(cardAdvancedManagementClicked);
-      },
-      'Check Card Advanced Management Clicked event',
-    );
-
     await Promise.all([
       checkCardButtonViewed,
       checkCardHomeClicked,
       checkCardAddFundsClicked,
-      checkCardAdvancedManagementClicked,
     ]);
     softAssert.throwIfErrors();
   });
diff --git a/tests/smoke/confirmations/send/send-solana-token.spec.ts b/tests/smoke/confirmations/send/send-solana-token.spec.ts
index 894a8bc4be3f..23de27d46e57 100644
--- a/tests/smoke/confirmations/send/send-solana-token.spec.ts
+++ b/tests/smoke/confirmations/send/send-solana-token.spec.ts
@@ -1,13 +1,12 @@
-import SendView from '../../../page-objects/Send/RedesignedSendView';
-import SolanaTestDApp from '../../../page-objects/Browser/SolanaTestDApp';
 import TokenOverview from '../../../page-objects/wallet/TokenOverview';
 import WalletView from '../../../page-objects/wallet/WalletView';
 import { SmokeConfirmations } from '../../../tags';
 import { loginToApp } from '../../../flows/wallet.flow';
 import { withFixtures } from '../../../framework/fixtures/FixtureHelper';
 import FixtureBuilder from '../../../framework/fixtures/FixtureBuilder';
+import { Assertions } from '../../../framework';
 
-const RECIPIENT = '4Nd1mZyJY5ZqzR3n8bQF7h5L2Q9gY1yTtM6nQhc7P1Dp';
+// const RECIPIENT = '4Nd1mZyJY5ZqzR3n8bQF7h5L2Q9gY1yTtM6nQhc7P1Dp';
 
 describe(SmokeConfirmations('Send SOL token'), () => {
   it('should send solana to an address', async () => {
@@ -21,11 +20,12 @@ describe(SmokeConfirmations('Send SOL token'), () => {
         await device.disableSynchronization();
         await WalletView.tapOnToken('Solana');
         await TokenOverview.tapSendButton();
-        await SendView.enterZeroAmount();
-        await SendView.pressContinueButton();
-        await SendView.inputRecipientAddress(RECIPIENT);
-        await SendView.pressReviewButton();
-        await SolanaTestDApp.tapCancelButton();
+
+        // Since we're not yet mockign Solana and there's residual balance that
+        // can be flaky when loading we're only checking that we're on the
+        // correct screen and sending the correct token.
+        await Assertions.expectTextDisplayed('Send');
+        await Assertions.expectTextDisplayed('SOL');
       },
     );
   });
diff --git a/tests/smoke/confirmations/transactions/dapp-initiated-transfer.spec.ts b/tests/smoke/confirmations/transactions/dapp-initiated-transfer.spec.ts
index 3c29e8929aeb..98ab85f07b1e 100644
--- a/tests/smoke/confirmations/transactions/dapp-initiated-transfer.spec.ts
+++ b/tests/smoke/confirmations/transactions/dapp-initiated-transfer.spec.ts
@@ -147,13 +147,24 @@ describe(SmokeConfirmations('DApp Initiated Transfer'), () => {
 
         await navigateToBrowserView();
         await Browser.navigateToTestDApp();
+        await Assertions.expectElementToBeVisible(TestDApp.testDappPageTitle, {
+          description: 'Test dapp page title should be visible',
+        });
+        await Assertions.expectElementToBeVisible(TestDApp.sendEIP1559Button, {
+          description: 'Send EIP1559 button should be visible',
+        });
         await TestDApp.tapSendEIP1559Button();
 
         // Check all expected elements are visible
         await Assertions.expectElementToBeVisible(
           ConfirmationUITypes.ModalConfirmationContainer,
+          {
+            description: 'Transaction confirmation modal should be visible',
+          },
         );
-        await Assertions.expectElementToBeVisible(RowComponents.TokenHero);
+        await Assertions.expectElementToBeVisible(RowComponents.TokenHero, {
+          description: 'Token hero row should be visible',
+        });
         await Assertions.expectTextDisplayed('0 ETH');
         await Assertions.expectElementToBeVisible(RowComponents.FromTo);
         await Assertions.expectElementToBeVisible(
@@ -169,11 +180,34 @@ describe(SmokeConfirmations('DApp Initiated Transfer'), () => {
 
         // Scroll to Advanced Details section on Android
         if (device.getPlatform() === 'android') {
-          await Gestures.swipe(RowComponents.GasFeesDetails, 'up');
+          await Gestures.swipe(
+            ConfirmationUITypes.ModalConfirmationContainer,
+            'up',
+            {
+              elemDescription: 'Scroll transaction confirmation content',
+            },
+          );
         }
 
+        await Assertions.expectElementToBeVisible(
+          RowComponents.SimulationDetails,
+          {
+            description: 'Simulation details row should be visible',
+            timeout: 30000,
+          },
+        );
+        await Assertions.expectElementToBeVisible(
+          RowComponents.GasFeesDetails,
+          {
+            description: 'Gas fees details row should be visible',
+            timeout: 30000,
+          },
+        );
         await Assertions.expectElementToBeVisible(
           RowComponents.AdvancedDetails,
+          {
+            description: 'Advanced details row should be visible',
+          },
         );
 
         // Accept confirmation
diff --git a/tests/smoke/confirmations/transactions/gas-fee-tokens-eip-7702-sponsored.spec.ts b/tests/smoke/confirmations/transactions/gas-fee-tokens-eip-7702-sponsored.spec.ts
index 09c57f5af925..57e2f7726604 100644
--- a/tests/smoke/confirmations/transactions/gas-fee-tokens-eip-7702-sponsored.spec.ts
+++ b/tests/smoke/confirmations/transactions/gas-fee-tokens-eip-7702-sponsored.spec.ts
@@ -166,12 +166,12 @@ const performSendTransaction = async () => {
     RowComponents.NetworkFeePaidByMetaMask,
   );
   await Utilities.waitForElementToBeVisible(FooterActions.confirmButton);
-  // Silenced errors from confirm button not being tappable due to toast overlapping
-  try {
-    await FooterActions.tapConfirmButton();
-  } catch {
-    console.log('Confirm button not tappable');
-  }
+  await Utilities.waitForElementToStopMoving(FooterActions.confirmButton, {
+    timeout: 5000,
+    interval: 500,
+    stableCount: 6,
+  });
+  await FooterActions.tapConfirmButton();
   await TabBarComponent.tapActivity();
 };
 
diff --git a/tests/smoke/confirmations/transactions/per-dapp-selected-network.spec.ts b/tests/smoke/confirmations/transactions/per-dapp-selected-network.spec.ts
index e50e450616ee..3fffcf08f354 100644
--- a/tests/smoke/confirmations/transactions/per-dapp-selected-network.spec.ts
+++ b/tests/smoke/confirmations/transactions/per-dapp-selected-network.spec.ts
@@ -134,8 +134,11 @@ describe(SmokeConfirmations('Dapp Network Switching'), () => {
           },
         );
 
-        // Change the network to Localhost in app
-        await changeNetworkFromNetworkListModal(LOCAL_CHAIN_NAME);
+        // Change the network to Localhost in app (custom network)
+        await TabBarComponent.tapWallet();
+        await WalletView.tapTokenNetworkFilter();
+        await NetworkListModal.tapOnCustomTab();
+        await NetworkListModal.selectNetworkInCustomTab(LOCAL_CHAIN_NAME);
 
         // Check activity tab (already on wallet from helper, just navigate)
         await TabBarComponent.tapActivity();
diff --git a/tests/smoke/multichain/permissions/chains/permission-system-dapp-chain-switch-grant.spec.js b/tests/smoke/multichain/permissions/chains/permission-system-dapp-chain-switch-grant.spec.js
index 8792883851aa..d086ba1a580d 100644
--- a/tests/smoke/multichain/permissions/chains/permission-system-dapp-chain-switch-grant.spec.js
+++ b/tests/smoke/multichain/permissions/chains/permission-system-dapp-chain-switch-grant.spec.js
@@ -12,10 +12,8 @@ import ConnectedAccountsModal from '../../../../page-objects/Browser/ConnectedAc
 import NetworkConnectMultiSelector from '../../../../page-objects/Browser/NetworkConnectMultiSelector';
 import NetworkNonPemittedBottomSheet from '../../../../page-objects/Network/NetworkNonPemittedBottomSheet';
 import { DappVariants } from '../../../../framework/Constants';
-import { setupRemoteFeatureFlagsMock } from '../../../../api-mocking/helpers/remoteFeatureFlagsHelper';
-import { remoteFeatureMultichainAccountsAccountDetailsV2 } from '../../../../api-mocking/mock-responses/feature-flags-mocks';
 
-describe.skip(SmokeNetworkAbstractions('Chain Permission System'), () => {
+describe(SmokeNetworkAbstractions('Chain Permission System'), () => {
   beforeAll(async () => {
     jest.setTimeout(150000);
   });
@@ -35,12 +33,6 @@ describe.skip(SmokeNetworkAbstractions('Chain Permission System'), () => {
             .withPermissionController()
             .build(),
           restartDevice: true,
-          testSpecificMock: async (mockServer) => {
-            await setupRemoteFeatureFlagsMock(
-              mockServer,
-              remoteFeatureMultichainAccountsAccountDetailsV2(false),
-            );
-          },
         },
         async () => {
           // Setup: Login and navigate to browser
@@ -69,11 +61,10 @@ describe.skip(SmokeNetworkAbstractions('Chain Permission System'), () => {
           await Browser.tapNetworkAvatarOrAccountButtonOnBrowser();
 
           // Navigate back to second Dapp and verify chain permissions
-          await ConnectedAccountsModal.tapManagePermissionsButton();
           await ConnectedAccountsModal.tapPermissionsSummaryTab();
 
           const networkPicker = ConnectedAccountsModal.networkPicker;
-          await Assertions.expectElementToHaveLabel(networkPicker, 'E');
+          await Assertions.expectElementToHaveLabel(networkPicker, 'l E');
         },
       );
     });
diff --git a/tests/smoke/multichain/permissions/chains/permission-system-initial-connection.spec.js b/tests/smoke/multichain/permissions/chains/permission-system-initial-connection.spec.js
index ebcf31946c1a..5048e759d3b0 100644
--- a/tests/smoke/multichain/permissions/chains/permission-system-initial-connection.spec.js
+++ b/tests/smoke/multichain/permissions/chains/permission-system-initial-connection.spec.js
@@ -11,8 +11,6 @@ import ConnectBottomSheet from '../../../../page-objects/Browser/ConnectBottomSh
 import NetworkNonPemittedBottomSheet from '../../../../page-objects/Network/NetworkNonPemittedBottomSheet';
 import NetworkConnectMultiSelector from '../../../../page-objects/Browser/NetworkConnectMultiSelector';
 import { DappVariants } from '../../../../framework/Constants';
-import { setupRemoteFeatureFlagsMock } from '../../../../api-mocking/helpers/remoteFeatureFlagsHelper';
-import { remoteFeatureMultichainAccountsAccountDetailsV2 } from '../../../../api-mocking/mock-responses/feature-flags-mocks';
 
 describe(SmokeNetworkExpansion('Chain Permission Management'), () => {
   beforeAll(async () => {
@@ -29,12 +27,6 @@ describe(SmokeNetworkExpansion('Chain Permission Management'), () => {
         ],
         fixture: new FixtureBuilder().withPermissionController().build(),
         restartDevice: true,
-        testSpecificMock: async (mockServer) => {
-          await setupRemoteFeatureFlagsMock(
-            mockServer,
-            remoteFeatureMultichainAccountsAccountDetailsV2(false),
-          );
-        },
       },
       async () => {
         await loginToApp();
@@ -46,7 +38,9 @@ describe(SmokeNetworkExpansion('Chain Permission Management'), () => {
         await ConnectBottomSheet.tapConnectButton();
 
         await Browser.tapNetworkAvatarOrAccountButtonOnBrowser();
-        await Assertions.expectElementToBeVisible(ConnectedAccountsModal.title);
+        await Assertions.expectElementToBeVisible(
+          ConnectedAccountsModal.disconnectAllAccountsAndNetworksButton,
+        );
       },
     );
   });
@@ -61,12 +55,6 @@ describe(SmokeNetworkExpansion('Chain Permission Management'), () => {
         ],
         fixture: new FixtureBuilder().withPermissionController().build(),
         restartDevice: true,
-        testSpecificMock: async (mockServer) => {
-          await setupRemoteFeatureFlagsMock(
-            mockServer,
-            remoteFeatureMultichainAccountsAccountDetailsV2(false),
-          );
-        },
       },
       async () => {
         // Initial setup: Login and navigate to test dapp
@@ -97,16 +85,18 @@ describe(SmokeNetworkExpansion('Chain Permission Management'), () => {
 
         // Open network permissions menu
         await Browser.tapNetworkAvatarOrAccountButtonOnBrowser();
-        await Assertions.expectElementToBeVisible(ConnectedAccountsModal.title);
-        await ConnectedAccountsModal.tapManagePermissionsButton();
+        await Assertions.expectElementToBeVisible(
+          ConnectedAccountsModal.disconnectAllAccountsAndNetworksButton,
+        );
         await ConnectedAccountsModal.tapPermissionsSummaryTab();
         await ConnectedAccountsModal.tapNavigateToEditNetworksPermissionsButton();
 
         // Verify final permissions state
         // - Should have only Ethereum Mainnet and Sepolia selected
         // - Deselecting both should show the disconnect all button
-        await NetworkNonPemittedBottomSheet.tapEthereumMainNetNetworkName();
-        await NetworkNonPemittedBottomSheet.tapSepoliaNetworkName();
+        await ConnectedAccountsModal.tapSelectAllNetworksButton();
+        await ConnectedAccountsModal.tapDeselectAllNetworksButton();
+
         await Assertions.expectElementToBeVisible(
           ConnectedAccountsModal.disconnectNetworksButton,
         );
diff --git a/tests/smoke/networks/network-manager2.spec.ts b/tests/smoke/networks/network-manager2.spec.ts
index d82de8bdb941..caf24122a507 100644
--- a/tests/smoke/networks/network-manager2.spec.ts
+++ b/tests/smoke/networks/network-manager2.spec.ts
@@ -221,7 +221,7 @@ describe(SmokeNetworkAbstractions('Network Manager'), () => {
     );
   });
 
-  it.skip('should preserve existing enabled networks when adding a network via dapp', async () => {
+  it('should preserve existing enabled networks when adding a network via dapp', async () => {
     await withFixtures(
       {
         dapps: [
diff --git a/tests/smoke/perps/perps-add-funds.spec.ts b/tests/smoke/perps/perps-add-funds.spec.ts
index 4ac732da61f8..d1c284efcd97 100644
--- a/tests/smoke/perps/perps-add-funds.spec.ts
+++ b/tests/smoke/perps/perps-add-funds.spec.ts
@@ -4,7 +4,11 @@ import { LocalNodeType, TestSuiteParams } from '../../framework/types';
 import { Hardfork } from '../../seeder/anvil-manager';
 import { SmokePerps } from '../../tags';
 import { loginToApp } from '../../flows/wallet.flow';
-import { PERPS_ARBITRUM_MOCKS } from '../../api-mocking/mock-responses/perps-arbitrum-mocks';
+import {
+  PERPS_ARBITRUM_MOCKS,
+  mockPerpsGeolocation,
+} from '../../api-mocking/mock-responses/perps-arbitrum-mocks';
+import { RampsRegions, RampsRegionsEnum } from '../../framework/Constants';
 import Assertions from '../../framework/Assertions';
 import PerpsTabView from '../../page-objects/Perps/PerpsTabView';
 import { PerpsHelpers } from '../../helpers/perps/perps-helpers';
@@ -65,7 +69,13 @@ describe(SmokePerps('Perps - Add funds (has funds, not first time)'), () => {
           )
           .build(),
         restartDevice: true,
-        testSpecificMock: PERPS_ARBITRUM_MOCKS,
+        testSpecificMock: async (mockServer) => {
+          await PERPS_ARBITRUM_MOCKS(mockServer);
+          await mockPerpsGeolocation(
+            mockServer,
+            RampsRegions[RampsRegionsEnum.SPAIN],
+          );
+        },
         useCommandQueueServer: true,
         localNodeOptions: [
           {
diff --git a/tests/smoke/ramps/offramp-cashout.failing.ts b/tests/smoke/ramps/offramp-cashout.failing.ts
deleted file mode 100644
index 8b076d837454..000000000000
--- a/tests/smoke/ramps/offramp-cashout.failing.ts
+++ /dev/null
@@ -1,116 +0,0 @@
-import { loginToApp } from '../../flows/wallet.flow';
-import FixtureBuilder from '../../framework/fixtures/FixtureBuilder';
-import { withFixtures } from '../../framework/fixtures/FixtureHelper';
-import { SmokeTrade } from '../../tags';
-import BuildQuoteView from '../../page-objects/Ramps/BuildQuoteView';
-import Assertions from '../../framework/Assertions';
-import WalletView from '../../page-objects/wallet/WalletView';
-import FundActionMenu from '../../page-objects/UI/FundActionMenu';
-import SelectPaymentMethodView from '../../page-objects/Ramps/SelectPaymentMethodView';
-import SellGetStartedView from '../../page-objects/Ramps/SellGetStartedView';
-import {
-  EventPayload,
-  findEvent,
-  getEventsPayloads,
-} from '../../helpers/analytics/helpers';
-import SoftAssert from '../../framework/SoftAssert';
-import { RampsRegions, RampsRegionsEnum } from '../../framework/Constants';
-import { Mockttp } from 'mockttp';
-import { setupRegionAwareOnRampMocks } from '../../api-mocking/mock-responses/ramps/ramps-mocks';
-
-const PaymentMethods = {
-  SEPA_BANK_TRANSFER: 'SEPA Bank Transfer',
-};
-const expectedEvents = {
-  OFFRAMP_PAYMENT_METHOD_SELECTED: 'Off-ramp Payment Method Selected',
-};
-
-/**
- * TODO:
- * Moving to quaratine since all tests are being skipped.
- * When this test is fixed we need to add a second shard to CI.
- */
-describe.skip(SmokeTrade('Off-Ramp Cashout destination'), () => {
-  const eventsToCheck: EventPayload[] = [];
-
-  beforeEach(async () => {
-    jest.setTimeout(150000);
-  });
-
-  it('should change cashout destination', async () => {
-    const selectedRegion = RampsRegions[RampsRegionsEnum.FRANCE];
-    await withFixtures(
-      {
-        fixture: new FixtureBuilder()
-          .withRampsSelectedRegion(selectedRegion)
-          .withRampsSelectedPaymentMethod()
-          .withMetaMetricsOptIn()
-          .build(),
-        restartDevice: true,
-        testSpecificMock: async (mockServer: Mockttp) => {
-          await setupRegionAwareOnRampMocks(mockServer, selectedRegion);
-        },
-        endTestfn: async ({ mockServer }) => {
-          const events = await getEventsPayloads(mockServer);
-          const offRampPaymentMethodSelected = findEvent(
-            events,
-            expectedEvents.OFFRAMP_PAYMENT_METHOD_SELECTED,
-          );
-          if (offRampPaymentMethodSelected) {
-            eventsToCheck.push(offRampPaymentMethodSelected);
-          }
-        },
-      },
-      async () => {
-        await loginToApp();
-        await WalletView.tapWalletBuyButton();
-        await FundActionMenu.tapSellButton();
-        await SellGetStartedView.tapGetStartedButton();
-        await Assertions.expectTextNotDisplayed('SEPA Bank Transfer');
-        await BuildQuoteView.tapPaymentMethodDropdown('Debit or Credit');
-        await SelectPaymentMethodView.tapPaymentMethodOption(
-          PaymentMethods.SEPA_BANK_TRANSFER,
-        );
-        await Assertions.expectTextDisplayed('SEPA Bank Transfer');
-      },
-    );
-  });
-
-  it('should validate segment/metametric events for a successful offramp flow (cashout)', async () => {
-    const softAssert = new SoftAssert();
-
-    const offRampPaymentMethodSelected = eventsToCheck.find(
-      (event) => event.event === expectedEvents.OFFRAMP_PAYMENT_METHOD_SELECTED,
-    );
-
-    // Define assertion calls as variables
-    const checkOffRampPaymentMethodDefined = softAssert.checkAndCollect(
-      async () => {
-        await Assertions.checkIfValueIsDefined(offRampPaymentMethodSelected);
-      },
-      'Off-ramp Payment Method Selected: Should be present',
-    );
-
-    // Only check properties if the event is defined
-    const checkOffRampPaymentMethodProperties = offRampPaymentMethodSelected
-      ? softAssert.checkAndCollect(async () => {
-          Assertions.checkIfObjectHasKeysAndValidValues(
-            offRampPaymentMethodSelected.properties,
-            {
-              payment_method_id: 'string',
-              available_payment_method_ids: 'array',
-              region: 'string',
-              location: 'string',
-            },
-          );
-        }, 'Off-ramp Payment Method Selected: Should have correct properties')
-      : Promise.resolve();
-
-    await Promise.all([
-      checkOffRampPaymentMethodDefined,
-      checkOffRampPaymentMethodProperties,
-    ]);
-
-    softAssert.throwIfErrors();
-  });
-});
diff --git a/tests/smoke/ramps/onramp-unified-buy.spec.ts b/tests/smoke/ramps/onramp-unified-buy.spec.ts
index 1a4801f04d72..aa6f8be22a6d 100644
--- a/tests/smoke/ramps/onramp-unified-buy.spec.ts
+++ b/tests/smoke/ramps/onramp-unified-buy.spec.ts
@@ -7,32 +7,69 @@ import { CustomNetworks } from '../../resources/networks.e2e';
 import { SmokeRamps } from '../../tags';
 import Assertions from '../../framework/Assertions';
 import BuildQuoteView from '../../page-objects/Ramps/BuildQuoteView';
+import OrderDetailsView from '../../page-objects/Ramps/OrderDetailsView';
 import TokenSelectScreen from '../../page-objects/Ramps/TokenSelectScreen';
 
 import { RampsRegions, RampsRegionsEnum } from '../../framework/Constants';
 import { Mockttp } from 'mockttp';
-import { setupRegionAwareOnRampMocks } from '../../api-mocking/mock-responses/ramps/ramps-mocks';
+import {
+  setupDepositOnRampMocks,
+  setupBuyOnRampMocks,
+} from '../../api-mocking/mock-responses/ramps/ramps-mocks';
 import { remoteFeatureFlagRampsUnifiedEnabled } from '../../api-mocking/mock-responses/feature-flags-mocks';
 import { setupRemoteFeatureFlagsMock } from '../../api-mocking/helpers/remoteFeatureFlagsHelper';
+import { ONRAMP_PERSONA } from '../../api-mocking/mock-responses/ramps/onramp-persona-data';
 import {
   getEventsPayloads,
   EventPayload,
 } from '../../helpers/analytics/helpers';
 import SoftAssert from '../../framework/SoftAssert';
-import { RampsRegion } from '../../framework/types';
-import { UnifiedRampRoutingType } from '../../../app/reducers/fiatOrders/types';
 
+import { UnifiedRampRoutingType } from '../../../app/reducers/fiatOrders/types';
+import TabBarComponent from '../../page-objects/wallet/TabBarComponent';
+import ActivitiesView from '../../page-objects/Transactions/ActivitiesView';
+import KYCScreen from '../../page-objects/Ramps/KYCScreen';
 const selectedRegion = RampsRegions[RampsRegionsEnum.UNITED_STATES];
 
-const unifiedBuyV2Mocks = async (mockServer: Mockttp) => {
+const newUserUnifiedBuyV2Mocks = async (mockServer: Mockttp) => {
+  await setupRemoteFeatureFlagsMock(mockServer, {
+    ...remoteFeatureFlagRampsUnifiedEnabled(true),
+    depositConfig: {
+      active: true,
+      providerApiKey: 'DUMMY_VALUE_FOR_TESTING',
+      entrypoints: { walletActions: true },
+      minimumVersion: '1.0.0',
+    },
+  });
+  await setupDepositOnRampMocks(mockServer, selectedRegion);
+};
+
+const returningUserUnifiedBuyV2Mocks = async (mockServer: Mockttp) => {
   await setupRemoteFeatureFlagsMock(
     mockServer,
     remoteFeatureFlagRampsUnifiedEnabled(true),
   );
-  await setupRegionAwareOnRampMocks(mockServer, selectedRegion);
+  await setupBuyOnRampMocks(mockServer, selectedRegion);
+};
+
+// Deposit order mock (ramps-deposit-order-status-response) returns USD; UI shows $ + formatFiatValue
+const nativeDepositOrder = {
+  token: 'ETH',
+  tokenAmount: '0.02455',
+  totalFiat: '$100 USD',
+  feesFiat: '$23.33 USD',
+  quoteDisplayAmount: '100 USD',
+  provider: 'Transak (Staging)',
 };
 
-const tokenToBuy = 'ETH';
+const aggregatorBuyOrder = {
+  token: 'ETH',
+  tokenAmount: '0.00355',
+  totalFiat: '$15 USD',
+  feesFiat: '$3.5 USD',
+  quoteDisplayAmount: '$15.00',
+  provider: 'Transak (Staging)',
+};
 
 const eventsToCheck: EventPayload[] = [];
 
@@ -45,9 +82,12 @@ const expectedEventNames = [
   expectedEvents.RampsButtonClicked,
   expectedEvents.RampsTokenSelected,
 ];
-
 describe(SmokeRamps('Onramp Unified Buy'), () => {
-  it('build quote', async () => {
+  beforeEach(async () => {
+    await device.clearKeychain();
+  });
+
+  it('New user native flow: Places ETH DEPOSIT order through Transak', async () => {
     await withFixtures(
       {
         fixture: new FixtureBuilder()
@@ -56,7 +96,7 @@ describe(SmokeRamps('Onramp Unified Buy'), () => {
           .withMetaMetricsOptIn()
           .build(),
         restartDevice: true,
-        testSpecificMock: unifiedBuyV2Mocks,
+        testSpecificMock: newUserUnifiedBuyV2Mocks,
         endTestfn: async ({ mockServer }) => {
           const events = await getEventsPayloads(
             mockServer,
@@ -69,21 +109,118 @@ describe(SmokeRamps('Onramp Unified Buy'), () => {
         await loginToApp();
         await WalletView.tapWalletBuyButton();
         await FundActionMenu.tapUnifiedBuyButton();
-        /*
-        at the time of this code, the dev team is still working on hooking up the quotes logic
-        as of now, you cannot (both manually and via e2e) go past the continue button
-        there is an animated infinite spinner. And as a result detox is hanging here
-        the disable sync allows detox to proceed without hang
-        Once the code is completed, this should be removed and the test shall go past the continue button
-        */
-        await device.disableSynchronization();
-        await TokenSelectScreen.tapTokenByName(tokenToBuy);
-        await BuildQuoteView.tapKeypadDeleteButton(1);
+        await TokenSelectScreen.tapTokenByName(nativeDepositOrder.token);
+
+        await BuildQuoteView.tapContinueButton();
+
+        await KYCScreen.tapVerifyIdentityContinueButton();
+
+        await KYCScreen.enterEmail(ONRAMP_PERSONA.email);
+
+        await Assertions.expectElementToBeVisible(KYCScreen.otpScreen, {
+          description: 'OTP code screen is visible before entering code',
+        });
+
+        await KYCScreen.enterOtpCode('000000');
+
+        // Verify order details screen
+        await Assertions.expectElementToBeVisible(OrderDetailsView.container, {
+          elemDescription: 'ramps order confirmation screen',
+        });
+        await Assertions.expectElementToHaveText(
+          OrderDetailsView.tokenAmount,
+          `${nativeDepositOrder.tokenAmount} ${nativeDepositOrder.token}`,
+        );
+
+        for (const text of [
+          nativeDepositOrder.totalFiat,
+          nativeDepositOrder.feesFiat,
+        ]) {
+          await Assertions.expectTextDisplayed(text);
+        }
+
+        await OrderDetailsView.tapCloseButton();
+
+        // Verify order in transfers list
+        await TabBarComponent.tapActivity();
+        await ActivitiesView.tapOnTransfersTab();
+
+        await Assertions.expectTextDisplayed(
+          `${nativeDepositOrder.tokenAmount} ${nativeDepositOrder.token}`,
+        );
+        await ActivitiesView.tapRampsOrder('deposit', 1);
+
+        for (const text of [
+          `${nativeDepositOrder.tokenAmount} ${nativeDepositOrder.token}`,
+          nativeDepositOrder.totalFiat,
+        ]) {
+          await Assertions.expectTextDisplayed(text);
+        }
+      },
+    );
+  });
+
+  it('Returning User Aggregator Flow: Places ETH BUY order', async () => {
+    await withFixtures(
+      {
+        fixture: new FixtureBuilder()
+          .withNetworkController(CustomNetworks.Tenderly.Mainnet)
+          .withRampsSelectedRegion(selectedRegion)
+          .withMetaMetricsOptIn()
+          .build(),
+        restartDevice: true,
+        testSpecificMock: returningUserUnifiedBuyV2Mocks,
+        endTestfn: async ({ mockServer }) => {
+          const events = await getEventsPayloads(
+            mockServer,
+            expectedEventNames,
+          );
+          eventsToCheck.push(...events);
+        },
+      },
+      async () => {
+        await loginToApp();
+        await WalletView.tapWalletBuyButton();
+        await FundActionMenu.tapUnifiedBuyButton();
+        await TokenSelectScreen.tapTokenByName(aggregatorBuyOrder.token);
         await BuildQuoteView.tapKeypadDeleteButton(1);
+        await BuildQuoteView.enterAmount('15', 'unifiedBuy');
+
+        await BuildQuoteView.tapContinueButton();
 
-        await BuildQuoteView.enterAmount('5', 'unifiedBuy');
+        // Verify order details screen
+        await Assertions.expectElementToBeVisible(OrderDetailsView.container, {
+          elemDescription: 'ramps order confirmation screen',
+        });
+        await Assertions.expectElementToHaveText(
+          OrderDetailsView.tokenAmount,
+          `${aggregatorBuyOrder.tokenAmount} ${aggregatorBuyOrder.token}`,
+        );
 
-        await Assertions.expectTextDisplayed('$15.00');
+        for (const text of [
+          aggregatorBuyOrder.totalFiat,
+          aggregatorBuyOrder.feesFiat,
+        ]) {
+          await Assertions.expectTextDisplayed(text);
+        }
+
+        await OrderDetailsView.tapCloseButton();
+
+        // Verify order in transfers list
+        await TabBarComponent.tapActivity();
+        await ActivitiesView.tapOnTransfersTab();
+
+        await Assertions.expectTextDisplayed(
+          `${aggregatorBuyOrder.tokenAmount} ${aggregatorBuyOrder.token}`,
+        );
+        await ActivitiesView.tapRampsOrder('buy', 1);
+
+        for (const text of [
+          `${aggregatorBuyOrder.tokenAmount} ${aggregatorBuyOrder.token}`,
+          aggregatorBuyOrder.totalFiat,
+        ]) {
+          await Assertions.expectTextDisplayed(text);
+        }
       },
     );
   });
@@ -91,7 +228,7 @@ describe(SmokeRamps('Onramp Unified Buy'), () => {
   it('validates the segment events from the onramp unified buy test', async () => {
     const softAssert = new SoftAssert();
     for (const ev of expectedEventNames) {
-      const event = eventsToCheck.find((event) => event.event === ev);
+      const event = eventsToCheck.find((e) => e.event === ev);
       await softAssert.checkAndCollect(
         async () => await Assertions.checkIfValueIsDefined(event),
         `${ev}: Should be defined`,
@@ -149,20 +286,22 @@ describe(SmokeRamps('Onramp Unified Buy'), () => {
       async () =>
         await Assertions.checkIfObjectContains(
           rampsButtonClicked?.properties ?? {},
-          { ramp_type: 'UNIFIED_BUY' },
+          { ramp_type: 'UNIFIED_BUY_2' },
         ),
-      `Ramps Button Clicked: ramp_type should be UNIFIED_BUY`,
+      `Ramps Button Clicked: ramp_type should be UNIFIED_BUY_2`,
     );
-    const rampsButtonClickedRegion = JSON.parse(
-      rampsButtonClicked?.properties?.region as string,
-    ) as RampsRegion;
+    const rampsButtonClickedRegion = rampsButtonClicked?.properties
+      ?.region as string;
+    // The region property is a plain string (e.g. "us-ca") matching the
+    // geolocation endpoint response, not a JSON-serialized object.
+    const expectedRegionId = selectedRegion.id.replace('/regions/', '');
     await softAssert.checkAndCollect(
       async () =>
-        await Assertions.checkIfObjectContains(
-          rampsButtonClickedRegion as unknown as Record<string, unknown>,
-          { id: selectedRegion.id, name: selectedRegion.name },
+        await Assertions.checkIfTextMatches(
+          rampsButtonClickedRegion,
+          expectedRegionId,
         ),
-      `Ramps Button Clicked: region should be ${selectedRegion.name} and ${selectedRegion.id}`,
+      `Ramps Button Clicked: region should be ${expectedRegionId}`,
     );
 
     // Ramps Token Selected - Property checks
@@ -190,16 +329,15 @@ describe(SmokeRamps('Onramp Unified Buy'), () => {
       `Ramps Token Selected: Should have the correct properties`,
     );
 
-    const rampsTokenSelectedRegion = JSON.parse(
-      rampsTokenSelected?.properties?.region as string,
-    ) as RampsRegion;
+    const rampsTokenSelectedRegion = rampsTokenSelected?.properties
+      ?.region as string;
     await softAssert.checkAndCollect(
       async () =>
-        await Assertions.checkIfObjectContains(
-          rampsTokenSelectedRegion as unknown as Record<string, unknown>,
-          { id: selectedRegion.id, name: selectedRegion.name },
+        await Assertions.checkIfTextMatches(
+          rampsTokenSelectedRegion,
+          expectedRegionId,
         ),
-      `Ramps Token Selected: region should be ${selectedRegion.name} and ${selectedRegion.id}`,
+      `Ramps Token Selected: region should be ${expectedRegionId}`,
     );
 
     await softAssert.checkAndCollect(
@@ -207,16 +345,16 @@ describe(SmokeRamps('Onramp Unified Buy'), () => {
         await Assertions.checkIfObjectContains(
           rampsTokenSelected?.properties ?? {},
           {
-            token_symbol: tokenToBuy,
+            token_symbol: aggregatorBuyOrder.token,
             token_caip19: 'eip155:1/slip44:60',
             currency_destination: 'eip155:1/slip44:60',
-            currency_destination_symbol: tokenToBuy,
+            currency_destination_symbol: aggregatorBuyOrder.token,
             currency_destination_network:
               CustomNetworks.Tenderly.Mainnet.providerConfig.nickname,
             ramp_routing: UnifiedRampRoutingType.DEPOSIT,
           },
         ),
-      `Ramps Token Selected: token_symbol should be ${tokenToBuy}`,
+      `Ramps Token Selected: token_symbol should be ${aggregatorBuyOrder.token}`,
     );
 
     softAssert.throwIfErrors();
diff --git a/tests/smoke/snaps/test-snap-ethereum-provider.spec.ts b/tests/smoke/snaps/test-snap-ethereum-provider.spec.ts
index 97d18f50a4ac..48484acfb1e5 100644
--- a/tests/smoke/snaps/test-snap-ethereum-provider.spec.ts
+++ b/tests/smoke/snaps/test-snap-ethereum-provider.spec.ts
@@ -9,10 +9,7 @@ import ConnectBottomSheet from '../../page-objects/Browser/ConnectBottomSheet';
 import RequestTypes from '../../page-objects/Browser/Confirmations/RequestTypes';
 import { Mockttp } from 'mockttp';
 import { setupRemoteFeatureFlagsMock } from '../../api-mocking/helpers/remoteFeatureFlagsHelper';
-import {
-  confirmationFeatureFlags,
-  remoteFeatureMultichainAccountsAccountDetailsV2,
-} from '../../api-mocking/mock-responses/feature-flags-mocks';
+import { confirmationFeatureFlags } from '../../api-mocking/mock-responses/feature-flags-mocks';
 import { mockGenesisBlocks } from './mocks';
 
 jest.setTimeout(150_000);
@@ -25,11 +22,10 @@ describe(FlaskBuildTests('Ethereum Provider Snap Tests'), () => {
         restartDevice: true,
         skipReactNativeReload: true,
         testSpecificMock: async (mockServer: Mockttp) => {
-          await setupRemoteFeatureFlagsMock(mockServer, {
-            ...Object.assign({}, ...confirmationFeatureFlags),
-            ...remoteFeatureMultichainAccountsAccountDetailsV2(false),
-          });
-
+          await setupRemoteFeatureFlagsMock(
+            mockServer,
+            Object.assign({}, ...confirmationFeatureFlags),
+          );
           await mockGenesisBlocks(mockServer);
         },
       },
diff --git a/tests/smoke/snaps/test-snap-name-lookup.spec.ts b/tests/smoke/snaps/test-snap-name-lookup.spec.ts
new file mode 100644
index 000000000000..d63c0292ad35
--- /dev/null
+++ b/tests/smoke/snaps/test-snap-name-lookup.spec.ts
@@ -0,0 +1,91 @@
+import { FlaskBuildTests } from '../../tags';
+import { loginToApp } from '../../flows/wallet.flow';
+import { navigateToBrowserView } from '../../flows/browser.flow';
+import FixtureBuilder from '../../framework/fixtures/FixtureBuilder';
+import { withFixtures } from '../../framework/fixtures/FixtureHelper';
+import TestSnaps from '../../page-objects/Browser/TestSnaps';
+import TabBarComponent from '../../page-objects/wallet/TabBarComponent';
+import WalletView from '../../page-objects/wallet/WalletView';
+import RedesignedSendView from '../../page-objects/Send/RedesignedSendView';
+import { Assertions, Gestures, LocalNode, Matchers } from '../../framework';
+import BrowserView from '../../page-objects/Browser/BrowserView';
+import { AnvilPort } from '../../framework/fixtures/FixtureUtils';
+import { AnvilManager } from '../../seeder/anvil-manager';
+import TransactionConfirmView from '../../page-objects/Send/TransactionConfirmView';
+import TokenOverview from '../../page-objects/wallet/TokenOverview';
+
+jest.setTimeout(150_000);
+
+const TOKEN = 'Ethereum';
+
+describe(FlaskBuildTests('Name Lookup Snap Tests'), () => {
+  it('displays the resolved recipient address in the send flow', async () => {
+    await withFixtures(
+      {
+        fixture: ({ localNodes }: { localNodes?: LocalNode[] }) => {
+          const node = localNodes?.[0] as unknown as AnvilManager;
+
+          return new FixtureBuilder()
+            .withNetworkController({
+              providerConfig: {
+                chainId: '0x1',
+                rpcUrl: `http://localhost:${node.getPort() ?? AnvilPort()}`,
+                type: 'custom',
+                nickname: 'Local RPC',
+                ticker: 'ETH',
+              },
+            })
+            .build();
+        },
+        restartDevice: true,
+        skipReactNativeReload: true,
+      },
+      async () => {
+        await loginToApp();
+        await navigateToBrowserView();
+        await TestSnaps.navigateToTestSnap();
+
+        await TestSnaps.installSnap('connectNameLookupButton');
+
+        await BrowserView.tapCloseBrowserButton();
+        await TabBarComponent.tapHome();
+        await device.disableSynchronization();
+        await WalletView.waitForTokenToBeReady(TOKEN);
+        await WalletView.tapOnToken(TOKEN);
+        await TokenOverview.tapSendButton();
+
+        const domain = 'metamask.domain';
+        await RedesignedSendView.enterZeroAmount();
+        await RedesignedSendView.pressContinueButton();
+
+        // Manually replacing the test to avoid flakiness from the '\n' input
+        // added to the end of the text to hide the keyboard
+        await Gestures.replaceText(
+          RedesignedSendView.recipientAddressInput,
+          domain,
+          {
+            elemDescription: 'Enter recipient address',
+          },
+        );
+
+        await RedesignedSendView.pressReviewButton();
+        await TransactionConfirmView.tapAdvancedDetails();
+
+        await Gestures.waitAndTap(
+          Matchers.getElementByText(
+            domain,
+            device.getPlatform() === 'ios' ? 1 : 0,
+          ),
+          {
+            elemDescription: 'Recipient address',
+            delay: 1000, // There's a animation that can cause flakiness
+          },
+        );
+
+        await Assertions.expectTextDisplayed(
+          '0xc0ffee254729296a45a3885639ac7e10f9d54979',
+        );
+      },
+    );
+  });
+});
diff --git a/tests/smoke/swap/swap-action-smoke.spec.ts b/tests/smoke/swap/swap-action-smoke.spec.ts
index f1772b164f7d..2cbfd3d3c3a1 100644
--- a/tests/smoke/swap/swap-action-smoke.spec.ts
+++ b/tests/smoke/swap/swap-action-smoke.spec.ts
@@ -39,7 +39,9 @@ const expectedEventNames = [
   expectedEvents.UnifiedSwapBridgeCompleted,
 ];
 
-describe(SmokeTrade('Swap from Actions'), (): void => {
+// Disabling this test as we've been experiencing issues with the test setup
+// See: https://github.com/MetaMask/metamask-mobile/actions/runs/22703717413/job/65827036980
+describe.skip(SmokeTrade('Swap from Actions'), (): void => {
   beforeEach(async (): Promise<void> => {
     jest.setTimeout(180000);
   });
@@ -190,11 +192,13 @@ describe(SmokeTrade('Swap from Actions'), (): void => {
     );
     await softAssert.checkAndCollect(
       async () =>
-        await Assertions.checkIfArrayHasLength(
+        // if the UI re-renders, it'll fetch extra quotes, so we need to check
+        // for at least 3 events
+        await Assertions.checkIfArrayHasMinLength(
           unifiedSwapBridgeQuotesRequested,
           3,
         ),
-      'Unified SwapBridge Quotes Requested: Should have 3 events',
+      'Unified SwapBridge Quotes Requested: Should have at least 3 events',
     );
     for (const event of unifiedSwapBridgeQuotesRequested) {
       await softAssert.checkAndCollect(
diff --git a/tests/smoke/trending/trending-feed.spec.ts b/tests/smoke/trending/trending-feed.spec.ts
index c446e56855e5..6c85ff7ac7a0 100644
--- a/tests/smoke/trending/trending-feed.spec.ts
+++ b/tests/smoke/trending/trending-feed.spec.ts
@@ -31,7 +31,7 @@ describe(SmokeWalletPlatform('Trending Feed View All Navigation'), () => {
   it('Navigate to all sections full views via View All and return to feed', async () => {
     await withFixtures(
       {
-        fixture: new FixtureBuilder().build(),
+        fixture: new FixtureBuilder().withDetectedGeolocation('AR').build(),
         restartDevice: true,
         testSpecificMock,
       },
diff --git a/tests/smoke/wallet/connections/evm-provider-events.spec.ts b/tests/smoke/wallet/connections/evm-provider-events.spec.ts
index aef2efc504a6..22f187579371 100644
--- a/tests/smoke/wallet/connections/evm-provider-events.spec.ts
+++ b/tests/smoke/wallet/connections/evm-provider-events.spec.ts
@@ -8,6 +8,7 @@ import { withFixtures } from '../../../framework/fixtures/FixtureHelper';
 import TestDApp from '../../../page-objects/Browser/TestDApp';
 import Browser from '../../../page-objects/Browser/BrowserView';
 import ConnectedAccountsModal from '../../../page-objects/Browser/ConnectedAccountsModal';
+import NetworkConnectMultiSelector from '../../../page-objects/Browser/NetworkConnectMultiSelector';
 import { loginToApp } from '../../../flows/wallet.flow';
 import { navigateToBrowserView } from '../../../flows/browser.flow';
 import {
@@ -17,9 +18,8 @@ import {
 import { DappVariants } from '../../../framework/Constants';
 import ToastModal from '../../../page-objects/wallet/ToastModal';
 import AccountListBottomSheet from '../../../page-objects/wallet/AccountListBottomSheet';
-import NetworkListModal from '../../../page-objects/Network/NetworkListModal';
-import { setupRemoteFeatureFlagsMock } from '../../../api-mocking/helpers/remoteFeatureFlagsHelper';
-import { remoteFeatureMultichainAccountsAccountDetailsV2 } from '../../../api-mocking/mock-responses/feature-flags-mocks';
+import TabBarComponent from '../../../page-objects/wallet/TabBarComponent';
+import WalletView from '../../../page-objects/wallet/WalletView';
 
 describe(SmokeWalletPlatform('EVM Provider Events'), () => {
   beforeAll(async () => {
@@ -92,12 +92,6 @@ describe(SmokeWalletPlatform('EVM Provider Events'), () => {
           })
           .build(),
         restartDevice: true,
-        testSpecificMock: async (mockServer) => {
-          await setupRemoteFeatureFlagsMock(
-            mockServer,
-            remoteFeatureMultichainAccountsAccountDetailsV2(false),
-          );
-        },
       },
       async () => {
         await loginToApp();
@@ -116,13 +110,14 @@ describe(SmokeWalletPlatform('EVM Provider Events'), () => {
           );
         }
 
-        await Browser.tapNetworkAvatarOrAccountButtonOnBrowser();
-        await Assertions.expectElementToBeVisible(ConnectedAccountsModal.title);
-        await Assertions.expectElementToNotBeVisible(
-          ToastModal.notificationTitle,
+        await Browser.tapCloseBrowserButton();
+        await Assertions.expectElementToBeVisible(
+          TabBarComponent.tabBarWalletButton,
         );
-
-        await AccountListBottomSheet.tapAccountByName('Account 2');
+        await TabBarComponent.tapWallet();
+        await WalletView.tapIdenticon();
+        await AccountListBottomSheet.tapAccountByNameV2('Account 2');
+        await navigateToBrowserView();
 
         const connectedAccountsAfter = await TestDApp.getConnectedAccounts();
         if (
@@ -176,12 +171,6 @@ describe(SmokeWalletPlatform('EVM Provider Events'), () => {
           })
           .build(),
         restartDevice: true,
-        testSpecificMock: async (mockServer) => {
-          await setupRemoteFeatureFlagsMock(
-            mockServer,
-            remoteFeatureMultichainAccountsAccountDetailsV2(false),
-          );
-        },
       },
       async () => {
         await loginToApp();
@@ -196,17 +185,17 @@ describe(SmokeWalletPlatform('EVM Provider Events'), () => {
         }
 
         await Browser.tapNetworkAvatarOrAccountButtonOnBrowser();
-        await Assertions.expectElementToBeVisible(ConnectedAccountsModal.title);
+        await Assertions.expectTextDisplayed('Account 1');
         await Assertions.expectElementToNotBeVisible(
           ToastModal.notificationTitle,
         );
 
-        await ConnectedAccountsModal.tapManagePermissionsButton();
-        await ConnectedAccountsModal.tapNetworksPicker();
-        await Assertions.expectElementToBeVisible(
-          NetworkListModal.networkScroll,
+        await ConnectedAccountsModal.tapPermissionsSummaryTab();
+        await ConnectedAccountsModal.tapNavigateToEditNetworksPermissionsButton();
+        await NetworkConnectMultiSelector.selectNetworkChainPermission(
+          'Ethereum Main Network',
         );
-        await NetworkListModal.changeNetworkTo('Localhost');
+        await NetworkConnectMultiSelector.tapUpdateButton();
 
         const connectedChainIdAfter = await TestDApp.getConnectedChainId();
         if (connectedChainIdAfter !== '0x539') {
diff --git a/tests/smoke/wallet/musd-conversion-happy-path.spec.ts b/tests/smoke/wallet/musd-conversion-happy-path.spec.ts
index 7c03de17d6e7..41293713d448 100644
--- a/tests/smoke/wallet/musd-conversion-happy-path.spec.ts
+++ b/tests/smoke/wallet/musd-conversion-happy-path.spec.ts
@@ -59,7 +59,6 @@ describe(SmokeWalletPlatform('mUSD Conversion Happy Path'), () => {
         musdConversionEducationSeen: false,
       }),
       async () => {
-        await device.disableSynchronization();
         await loginToApp();
 
         // Verify wallet is visible
@@ -71,10 +70,12 @@ describe(SmokeWalletPlatform('mUSD Conversion Happy Path'), () => {
         await Assertions.expectElementToBeVisible(
           WalletView.musdConversionCta,
           {
+            timeout: 30000,
             description: 'mUSD conversion CTA should be visible',
           },
         );
         await WalletView.tapGetMusdButton();
+        await device.disableSynchronization();
 
         // Verify education screen is shown (first time user) and tap Get Started
         await Assertions.expectElementToBeVisible(WalletView.getStartedButton, {
diff --git a/tests/tags.js b/tests/tags.js
index 34c4907f8715..7a0125d82839 100644
--- a/tests/tags.js
+++ b/tests/tags.js
@@ -89,6 +89,7 @@ const otherTags = {
   regressionTrade: 'RegressionTrade:',
   regressionSampleFeature: 'RegressionSampleFeature:',
   performance: 'Performance:',
+  fixtureValidation: 'FixtureValidation:',
 };
 
 // Smoke test tag functions
@@ -136,6 +137,8 @@ const RegressionSampleFeature = (testName) =>
 const FlaskBuildTests = (testName) =>
   `${flaskTags.flaskBuildTests.tag} ${testName}`;
 const SmokePerformance = (testName) => `${otherTags.performance} ${testName}`;
+const FixtureValidation = (testName) =>
+  `${otherTags.fixtureValidation} ${testName}`;
 
 export {
   smokeTags,
@@ -164,4 +167,5 @@ export {
   RegressionSampleFeature,
   FlaskBuildTests,
   SmokePerformance,
+  FixtureValidation,
 };
diff --git a/wdio/screen-objects/BridgeScreen.js b/wdio/screen-objects/BridgeScreen.js
index 2ebd10a7a3c5..e9b545cde6ea 100644
--- a/wdio/screen-objects/BridgeScreen.js
+++ b/wdio/screen-objects/BridgeScreen.js
@@ -42,7 +42,7 @@ class BridgeScreen {
       if (AppwrightSelectors.isAndroid(this._device)) {
         return AppwrightSelectors.getElementByCatchAll(this._device, networkName);
       } else {
-        return AppwrightSelectors.getElementByID(this._device, `${networkName}`);
+        return AppwrightSelectors.getElementByXpath(this._device, `//XCUIElementTypeButton[@name="${networkName}"]`);
       }
     }
   }
@@ -58,6 +58,7 @@ class BridgeScreen {
     // Tap each digit on the numeric keypad
     const digits = amount.split('');
     AmountScreen.device = this._device;
+    await AppwrightGestures.tap(this.sourceTokenInput);
     for (const digit of digits) {
       const digitButton = await AppwrightSelectors.getElementByText(this._device, digit, true);
       await appwrightExpect(digitButton).toBeVisible({ timeout: 10000 });
@@ -69,7 +70,9 @@ class BridgeScreen {
     const destinationToken = await this.destinationTokenArea;
     await AppwrightGestures.tap(destinationToken);
     const networkButton = await this.getNetworkButton(network);
-    await AppwrightGestures.tap(networkButton);
+    if (network !== 'Ethereum'){
+      await AppwrightGestures.tap(networkButton);
+    }
     let tokenNetworkId;
     if (network == 'Ethereum'){
       tokenNetworkId = `0x1`;
@@ -80,8 +83,8 @@ class BridgeScreen {
     else if (network == 'Solana'){
       tokenNetworkId = `solana:5eykt4UsFv8P8NJdTREpY1vzqKqZKvdp`;
     }
-    const tokenButton = await AppwrightSelectors.getElementByID(this._device, `asset-${tokenNetworkId}-${token}`);
-    await appwrightExpect(tokenButton).toBeVisible({ timeout: 15000 });
+    const tokenButton = AppwrightSelectors.isAndroid(this._device) ? await AppwrightSelectors.getElementByID(this._device, `asset-${tokenNetworkId}-${token}`) : await AppwrightSelectors.getElementByNameiOS(this._device, `asset-${tokenNetworkId}-${token}`);
+    await appwrightExpect(tokenButton).toBeVisible({ timeout: 30000 });
     await AppwrightGestures.tap(tokenButton);
   }
 
diff --git a/wdio/screen-objects/BrowserPlaygroundDapp.js b/wdio/screen-objects/BrowserPlaygroundDapp.js
index 3daf94e7d5ad..13a9113f8b61 100644
--- a/wdio/screen-objects/BrowserPlaygroundDapp.js
+++ b/wdio/screen-objects/BrowserPlaygroundDapp.js
@@ -125,6 +125,10 @@ class BrowserPlaygroundDapp {
     return this._getByTestId('app-btn-connect-wagmi');
   }
 
+  get wagmiDisconnectButton() {
+    return this._getByTestId('wagmi-btn-disconnect');
+  }
+
   get wagmiCard() {
     return this._getByTestId('wagmi-card');
   }
@@ -181,6 +185,34 @@ class BrowserPlaygroundDapp {
     return this._getByTestId(`wagmi-btn-switch-chain-${chainId}`);
   }
 
+  // ============================================================
+  // SOLANA CARD SELECTORS
+  // ============================================================
+
+  get solanaCard() {
+    return this._getByTestId('solana-card');
+  }
+
+  get solanaConnectButton() {
+    return this._getByTestId('app-btn-connect-solana');
+  }
+
+  get solanaDisconnectButton() {
+    return this._getByTestId('solana-btn-disconnect');
+  }
+
+  get solanaAddressContainer() {
+    return this._getByTestId('solana-address-container');
+  }
+
+  get solanaSignMessageButton() {
+    return this._getByTestId('solana-btn-sign-message');
+  }
+
+  get solanaSignedMessageResult() {
+    return this._getByTestId('solana-signed-message-result');
+  }
+
   // ============================================================
   // MULTICHAIN / SCOPE CARD SELECTORS
   // ============================================================
@@ -199,7 +231,7 @@ class BrowserPlaygroundDapp {
    */
   getScopeCard(scope) {
     // The scope card ID uses dashes instead of colons (e.g., 'eip155-1' not 'eip155:1')
-    const escapedScope = scope.replace(/:/g, '-');
+    const escapedScope = scope.toLowerCase().replace(/:/g, '-');
     return this._getByTestId(`scope-card-${escapedScope}`);
   }
 
@@ -271,6 +303,12 @@ class BrowserPlaygroundDapp {
     await AppwrightGestures.tap(element);
   }
 
+  async tapWagmiDisconnect() {
+    if (!this._device) return;
+    const element = await this.wagmiDisconnectButton;
+    await AppwrightGestures.tap(element);
+  }
+
   async tapWagmiSignMessage() {
     if (!this._device) return;
     const element = await this.wagmiSignMessageButton;
@@ -295,6 +333,28 @@ class BrowserPlaygroundDapp {
     await AppwrightGestures.typeText(element, message);
   }
 
+  // ============================================================
+  // SOLANA ACTIONS
+  // ============================================================
+
+  async tapSolanaConnect() {
+    if (!this._device) return;
+    const element = await this.solanaConnectButton;
+    await AppwrightGestures.tap(element);
+  }
+
+  async tapSolanaDisconnect() {
+    if (!this._device) return;
+    const element = await this.solanaDisconnectButton;
+    await AppwrightGestures.tap(element);
+  }
+
+  async tapSolanaSignMessage() {
+    if (!this._device) return;
+    const element = await this.solanaSignMessageButton;
+    await AppwrightGestures.tap(element);
+  }
+
   // ============================================================
   // MULTICHAIN ACTIONS
   // ============================================================
@@ -465,6 +525,49 @@ class BrowserPlaygroundDapp {
     }
   }
 
+  // ============================================================
+  // SOLANA ASSERTIONS
+  // ============================================================
+
+  /**
+   * Assert Solana is connected by checking for the solana address container
+   * @param {boolean} isConnected - Expected connection state
+   */
+  async assertSolanaConnected(isConnected = true) {
+    if (!this._device) return;
+
+    if (isConnected) {
+      const solanaCard = await this.solanaCard;
+      await expect(solanaCard).toBeVisible({ timeout: 10000 });
+    } else {
+      const solanaConnectButton = await this.solanaConnectButton;
+      await expect(solanaConnectButton).toBeVisible({ timeout: 10000 });
+    }
+  }
+
+  /**
+   * Assert Solana active account address
+   * @param {string} expectedAccount - Expected account address
+   */
+    async assertSolanaActiveAccount(expectedAddress) {
+      if (!this._device) return;
+      const addressElement = await this.solanaAddressContainer;
+      const text = await addressElement.getText();
+      expect(text.toLowerCase()).toContain(expectedAddress);
+    }
+
+  /**
+   * Assert Solana signed message result contains expected value
+   * @param {string} expectedValue - Expected signature or part of the signed message result
+   */
+  async assertSolanaSignedMessageResult(expectedValue) {
+    if (!this._device) return;
+    const resultElement = await this.solanaSignedMessageResult;
+    await expect(resultElement).toBeVisible({ timeout: 10000 });
+    const text = await resultElement.getText();
+    expect(text).toContain(expectedValue);
+  }
+
   // ============================================================
   // MULTICHAIN ASSERTIONS
   // ============================================================
@@ -494,6 +597,16 @@ class BrowserPlaygroundDapp {
     const scopeCard = await this.getScopeCard(scope);
     await expect(scopeCard).toBeVisible({ timeout: 10000 });
   }
+
+  /**
+   * Assert a specific scope card is notvisible
+   * @param {string} scope - The CAIP-2 scope (e.g., 'eip155:1')
+   */
+  async assertScopeCardNotVisible(scope) {
+    if (!this._device) return;
+    const scopeCard = await this.getScopeCard(scope);
+    await expect(scopeCard).not.toBeVisible({ timeout: 10000 });
+  }
 }
 
 export default new BrowserPlaygroundDapp();
diff --git a/wdio/screen-objects/LoginScreen.js b/wdio/screen-objects/LoginScreen.js
index 4d22add3e78d..36a3af08ee81 100644
--- a/wdio/screen-objects/LoginScreen.js
+++ b/wdio/screen-objects/LoginScreen.js
@@ -46,6 +46,7 @@ class LoginScreen {
     );
   }
 
+  // Migrated to LoginView.ts (tests/page-objects/wallet/LoginView.ts)
   get getPasswordInputElement() {
     if (!this._device) {
       return Selectors.getXpathElementByResourceId(
@@ -63,6 +64,7 @@ class LoginScreen {
     }
   }
 
+  // Migrated to LoginView.ts (tests/page-objects/wallet/LoginView.ts)
   get unlockButton() {
     // TODO: update the component to have a testID property and use that instead of text
     if (!this._device) {
@@ -72,6 +74,7 @@ class LoginScreen {
     }
   }
 
+  // Migrated to LoginView.ts (tests/page-objects/wallet/LoginView.ts)
   get title() {
     if (!this._device) {
       return Selectors.getXpathElementByResourceId(LoginViewSelectors.TITLE_ID);
@@ -100,6 +103,7 @@ class LoginScreen {
     }
   }
 
+  // Migrated to LoginView.ts (tests/page-objects/wallet/LoginView.ts)
   async waitForScreenToDisplay() {
     if (!this._device) {
       const element = await this.title;
@@ -119,6 +123,7 @@ class LoginScreen {
     }
   }
 
+  // Migrated to LoginView.ts (tests/page-objects/wallet/LoginView.ts)
   async typePassword(password) {
     //await this.isLoginScreenVisible();
     if (!this._device) {
@@ -131,6 +136,7 @@ class LoginScreen {
     }
   }
 
+  // Migrated to LoginView.ts (tests/page-objects/wallet/LoginView.ts)
   async tapUnlockButton() {
     if (!this._device) {
       const element = await this.unlockButton;
diff --git a/wdio/screen-objects/Modals/DappConnectionModal.js b/wdio/screen-objects/Modals/DappConnectionModal.js
index 0fa365058a95..105a58ece732 100644
--- a/wdio/screen-objects/Modals/DappConnectionModal.js
+++ b/wdio/screen-objects/Modals/DappConnectionModal.js
@@ -153,6 +153,7 @@ class DappConnectionModal {
         }
 
         const element = await this.getNetworkButton(networkName);
+        await AppwrightGestures.scrollIntoView(this.device, element);
         await AppwrightGestures.tap(element)
     }
 
diff --git a/wdio/screen-objects/Modals/SnapSignModal.js b/wdio/screen-objects/Modals/SnapSignModal.js
new file mode 100644
index 000000000000..175ebd89bc28
--- /dev/null
+++ b/wdio/screen-objects/Modals/SnapSignModal.js
@@ -0,0 +1,67 @@
+import AppwrightSelectors from '../../../tests/framework/AppwrightSelectors';
+import AppwrightGestures from '../../../tests/framework/AppwrightGestures';
+import { expect } from 'appwright';
+
+/**
+ * Modal for Snap-rendered confirmation dialogs (e.g. Solana signing).
+ *
+ * Snap UIs use SnapUIFooterButton with testIDs following the pattern
+ * "${name}-snap-footer-button". This modal locates the confirm/submit
+ * button via XPath, excluding cancel and default buttons.
+ */
+class SnapSignModal {
+    constructor() {}
+
+    get device() {
+        return this._device;
+    }
+
+    set device(device) {
+        this._device = device;
+    }
+
+    get confirmButton() {
+        if (!this._device) {
+            return null;
+        }
+
+        const xpath =
+            '//*[contains(@resource-id,"snap-footer-button") ' +
+            'and not(contains(@resource-id,"cancel")) ' +
+            'and not(contains(@resource-id,"default-snap-footer-button"))]';
+        return AppwrightSelectors.getElementByXpath(this._device, xpath);
+    }
+
+    get cancelButton() {
+        if (!this._device) {
+            return null;
+        }
+
+        const xpath =
+            '//*[contains(@resource-id,"cancel") ' +
+            'and contains(@resource-id,"snap-footer-button")]';
+        return AppwrightSelectors.getElementByXpath(this._device, xpath);
+    }
+
+    async tapConfirmButton({ timeout = 5000 } = {}) {
+        if (!this._device) {
+            return;
+        }
+
+        const snapBtn = await this.confirmButton;
+        await expect(snapBtn).toBeVisible({ timeout });
+        await AppwrightGestures.tap(snapBtn);
+    }
+
+    async tapCancelButton({ timeout = 5000 } = {}) {
+        if (!this._device) {
+            return;
+        }
+
+        const snapBtn = await this.cancelButton;
+        await expect(snapBtn).toBeVisible({ timeout });
+        await AppwrightGestures.tap(snapBtn);
+    }
+}
+
+export default new SnapSignModal();
diff --git a/wdio/screen-objects/RNPlaygroundDapp.js b/wdio/screen-objects/RNPlaygroundDapp.js
new file mode 100644
index 000000000000..73471a1d7c42
--- /dev/null
+++ b/wdio/screen-objects/RNPlaygroundDapp.js
@@ -0,0 +1,378 @@
+import AppwrightSelectors from '../../tests/framework/AppwrightSelectors';
+import AppwrightGestures from '../../tests/framework/AppwrightGestures';
+import { PLAYGROUND_PACKAGE_ID } from '../../tests/framework/Constants.ts';
+import { expect } from 'appwright';
+
+/**
+ * Replicates the escapeTestId function from @metamask/playground-ui
+ * so generated test IDs match those set in the React Native playground.
+ */
+function escapeTestId(value) {
+  return value
+    .toLowerCase()
+    .replace(/:/g, '-')
+    .replace(/\s+/g, '-')
+    .replace(/_/g, '-')
+    .replace(/[^a-z0-9-]/g, '');
+}
+
+/**
+ * Page Object for the React Native playground app (@metamask/react-native-playground).
+ *
+ * This is a standalone native APK installed alongside the MetaMask wallet.
+ * Elements are accessed via testID (resource-id on Android) using getElementByID,
+ * NOT via data-testid/XPath like the browser playground.
+ */
+class RNPlaygroundDapp {
+  constructor() {
+    this._device = null;
+  }
+
+  get device() {
+    return this._device;
+  }
+
+  set device(device) {
+    this._device = device;
+  }
+
+  _getByTestId(testId) {
+    if (!this._device) return null;
+    return AppwrightSelectors.getElementByID(this._device, testId);
+  }
+
+  // ============================================================
+  // APP-LEVEL SELECTORS
+  // ============================================================
+
+  get appContainer() {
+    return this._getByTestId('app-container');
+  }
+
+  get appTitle() {
+    return this._getByTestId('app-title');
+  }
+
+  get connectButton() {
+    return this._getByTestId('app-btn-connect');
+  }
+
+  get disconnectButton() {
+    return this._getByTestId('app-btn-disconnect');
+  }
+
+  get scopesSection() {
+    return this._getByTestId('app-section-scopes');
+  }
+
+  get errorSection() {
+    return this._getByTestId('app-section-error');
+  }
+
+  get connectLegacyButton() {
+    return this._getByTestId('app-btn-connect-legacy');
+  }
+
+  // ============================================================
+  // LEGACY EVM CARD SELECTORS
+  // ============================================================
+
+  get legacyEvmCard() {
+    return this._getByTestId('legacy-evm-card');
+  }
+
+  get legacyEvmChainIdValue() {
+    return this._getByTestId('legacy-evm-chain-id-value');
+  }
+
+  get legacyEvmAccountsValue() {
+    return this._getByTestId('legacy-evm-accounts-value');
+  }
+
+  get legacyEvmActiveAccount() {
+    return this._getByTestId('legacy-evm-active-account');
+  }
+
+  get legacyEvmResponseText() {
+    return this._getByTestId('legacy-evm-response-text');
+  }
+
+  get legacyEvmBtnPersonalSign() {
+    return this._getByTestId('legacy-evm-btn-personal-sign');
+  }
+
+  get legacyEvmBtnSendTransaction() {
+    return this._getByTestId('legacy-evm-btn-send-transaction');
+  }
+
+  get legacyEvmBtnSwitchPolygon() {
+    return this._getByTestId('legacy-evm-btn-switch-polygon');
+  }
+
+  // ============================================================
+  // NETWORK CHECKBOX SELECTORS
+  // ============================================================
+
+  getNetworkCheckbox(caipChainId) {
+    return this._getByTestId(
+      `dynamic-inputs-checkbox-${escapeTestId(caipChainId)}`,
+    );
+  }
+
+  // ============================================================
+  // SCOPE CARD SELECTORS
+  // ============================================================
+
+  getScopeCard(scope) {
+    return this._getByTestId(`scope-card-${escapeTestId(scope)}`);
+  }
+
+  getScopeNetworkName(scope) {
+    return this._getByTestId(
+      `scope-card-network-name-${escapeTestId(scope)}`,
+    );
+  }
+
+  getMethodSelect(scope) {
+    return this._getByTestId(
+      `scope-card-method-select-${escapeTestId(scope)}`,
+    );
+  }
+
+  getInvokeButton(scope) {
+    return this._getByTestId(
+      `scope-card-invoke-btn-${escapeTestId(scope)}`,
+    );
+  }
+
+  getResultCode(scope, method, index = 0) {
+    const escapedScope = escapeTestId(scope);
+    const escapedMethod = escapeTestId(method);
+    return this._getByTestId(
+      `scope-card-result-code-${escapedScope}-${escapedMethod}-${index}`,
+    );
+  }
+
+  getResultStatus(scope, method, index = 0) {
+    const escapedScope = escapeTestId(scope);
+    const escapedMethod = escapeTestId(method);
+    return this._getByTestId(
+      `scope-card-result-status-${escapedScope}-${escapedMethod}-${index}`,
+    );
+  }
+
+  // ============================================================
+  // APP SWITCHING
+  // ============================================================
+
+  async switchToPlayground() {
+    if (!this._device) return;
+    await this._device.activateApp(PLAYGROUND_PACKAGE_ID);
+    await new Promise((r) => setTimeout(r, 1000));
+  }
+
+  async waitForPlaygroundReady(timeoutMs = 15000) {
+    if (!this._device) return;
+    const container = await this.appContainer;
+    await expect(container).toBeVisible({ timeout: timeoutMs });
+  }
+
+  /**
+   * Ensure we are in the playground. If the app-container is not visible
+   * (e.g. MetaMask is still in the foreground), switch to the playground
+   * via activateApp and wait for it.
+   * Uses app-container rather than app-title because the title can be
+   * scrolled out of the React Native render tree while app-container
+   * sits outside the ScrollView and is always present.
+   */
+  async ensureInPlayground() {
+    if (!this._device) return;
+    try {
+      const container = await this.appContainer;
+      await expect(container).toBeVisible({ timeout: 3000 });
+    } catch {
+      await this.switchToPlayground();
+      await this.waitForPlaygroundReady();
+    }
+  }
+
+  // ============================================================
+  // ACTIONS
+  // ============================================================
+
+  async tapNetworkCheckbox(caipChainId) {
+    if (!this._device) return;
+    const elem = await this.getNetworkCheckbox(caipChainId);
+    await AppwrightGestures.tap(elem);
+  }
+
+  async tapConnect() {
+    if (!this._device) return;
+    const elem = await this.connectButton;
+    await AppwrightGestures.tap(elem);
+  }
+
+  async tapConnectLegacy() {
+    if (!this._device) return;
+    const elem = await this.connectLegacyButton;
+    await AppwrightGestures.tap(elem);
+  }
+
+  async tapLegacyEvmButton(buttonPromise) {
+    if (!this._device) return;
+    const elem = await buttonPromise;
+    await AppwrightGestures.tap(elem);
+  }
+
+  async tapDisconnect() {
+    if (!this._device) return;
+    const elem = await this.disconnectButton;
+    await AppwrightGestures.tap(elem);
+  }
+
+  /**
+   * Select a method from the Picker dropdown on a scope card.
+   * Taps the picker to open the native dropdown, scrolls within the dropdown
+   * if needed to find the option, then taps it.
+   */
+  async selectMethod(scope, methodName, maxScrollAttempts = 10) {
+    if (!this._device) return;
+    const picker = await this.getMethodSelect(scope);
+    await AppwrightGestures.tap(picker);
+    await new Promise((r) => setTimeout(r, 500));
+
+    const webDriverClient = this._device.webDriverClient;
+
+    for (let attempt = 0; attempt < maxScrollAttempts; attempt++) {
+      try {
+        const option = await AppwrightSelectors.getElementByText(
+          this._device,
+          methodName,
+          true,
+        );
+        const isVisible = await option.isVisible({ timeout: 1500 });
+        if (isVisible) {
+          await AppwrightGestures.tap(option);
+          await new Promise((r) => setTimeout(r, 500));
+          return;
+        }
+      } catch {
+        // Option not found or not visible yet
+      }
+
+      // Swipe down inside the dropdown to scroll content up, revealing
+      // items near the top of the list (e.g. personal_sign).
+      await webDriverClient.executeScript('mobile: swipeGesture', [
+        {
+          left: 100,
+          top: 400,
+          width: 600,
+          height: 600,
+          direction: 'down',
+          percent: 0.3,
+        },
+      ]);
+      await new Promise((r) => setTimeout(r, 300));
+    }
+
+    throw new Error(
+      `Method "${methodName}" not found in picker after ${maxScrollAttempts} scroll attempts`,
+    );
+  }
+
+  async tapInvoke(scope) {
+    if (!this._device) return;
+    const elem = await this.getInvokeButton(scope);
+    await AppwrightGestures.tap(elem);
+  }
+
+  /**
+   * Scroll until the given element promise becomes visible.
+   * @param {Promise<AppwrightLocator>} elemPromise
+   * @param {object} options - Passed to AppwrightGestures.scrollIntoView
+   */
+  async scrollToElement(elemPromise, options = {}) {
+    if (!this._device) return;
+    await AppwrightGestures.scrollIntoView(this._device, elemPromise, options);
+  }
+
+  // ============================================================
+  // ASSERTIONS
+  // ============================================================
+
+  async assertConnected() {
+    if (!this._device) return;
+    const scopes = await this.scopesSection;
+    await expect(scopes).toBeVisible({ timeout: 15000 });
+  }
+
+  async assertDisconnected() {
+    if (!this._device) return;
+    const btn = await this.connectButton;
+    await expect(btn).toBeVisible({ timeout: 15000 });
+  }
+
+  async assertScopeCardVisible(scope, timeoutMs = 10000) {
+    if (!this._device) return;
+    const card = await this.getScopeCard(scope);
+    await expect(card).toBeVisible({ timeout: timeoutMs });
+  }
+
+  /**
+   * Wait for a result code element to appear for a given scope/method.
+   */
+  async waitForResult(scope, method, index = 0, timeoutMs = 15000) {
+    if (!this._device) return;
+    const code = await this.getResultCode(scope, method, index);
+    await expect(code).toBeVisible({ timeout: timeoutMs });
+  }
+
+  async assertLegacyEvmConnected(timeoutMs = 15000) {
+    if (!this._device) return;
+    const card = await this.legacyEvmCard;
+    await expect(card).toBeVisible({ timeout: timeoutMs });
+  }
+
+  async assertLegacyEvmHasAccounts(timeoutMs = 10000) {
+    if (!this._device) return;
+    const accounts = await this.legacyEvmAccountsValue;
+    await expect(accounts).toBeVisible({ timeout: timeoutMs });
+  }
+
+  async assertLegacyEvmActiveAccount(timeoutMs = 10000) {
+    if (!this._device) return;
+    const activeAcct = await this.legacyEvmActiveAccount;
+    await expect(activeAcct).toBeVisible({ timeout: timeoutMs });
+  }
+
+  async getLegacyEvmChainId() {
+    if (!this._device) return null;
+    const chainIdElem = await this.legacyEvmChainIdValue;
+    return await chainIdElem.getText();
+  }
+
+  async getLegacyEvmResponseText() {
+    if (!this._device) return null;
+    const resp = await this.legacyEvmResponseText;
+    return await resp.getText();
+  }
+
+  /**
+   * Assert the result code text contains the expected substring.
+   */
+  async assertResultCodeContains(
+    scope,
+    method,
+    expectedText,
+    index = 0,
+    timeoutMs = 15000,
+  ) {
+    if (!this._device) return;
+    const code = await this.getResultCode(scope, method, index);
+    await expect(code).toBeVisible({ timeout: timeoutMs });
+    const text = await code.getText();
+    expect(text).toContain(expectedText);
+  }
+}
+
+export default new RNPlaygroundDapp();
diff --git a/wdio/screen-objects/WalletMainScreen.js b/wdio/screen-objects/WalletMainScreen.js
index 22cfa346caee..7cb948d3d3d6 100644
--- a/wdio/screen-objects/WalletMainScreen.js
+++ b/wdio/screen-objects/WalletMainScreen.js
@@ -337,6 +337,7 @@ class WalletMainScreen {
     }
   }
 
+  // Migrated to WalletView.ts (tests/page-objects/wallet/WalletView.ts)
   async waitForBalanceToStabilize(options = {}) {
     const {
       maxWaitTime = 60000,
diff --git a/yarn.lock b/yarn.lock
index f4bb1c2e9389..f11b05a24e6f 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2270,6 +2270,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@ecies/ciphers@npm:^0.2.5":
+  version: 0.2.5
+  resolution: "@ecies/ciphers@npm:0.2.5"
+  peerDependencies:
+    "@noble/ciphers": ^1.0.0
+  checksum: 10/af90636ee51812c9ead6e2c4be006f334bd6e12c5840de9c673b974b1ff3f79776747059257da3cb1731fcbc2d435a67b86dfb18fa90e07a6962c8816e6ab596
+  languageName: node
+  linkType: hard
+
 "@egjs/hammerjs@npm:^2.0.17":
   version: 2.0.17
   resolution: "@egjs/hammerjs@npm:2.0.17"
@@ -7613,14 +7622,15 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@metamask/ai-controllers@npm:^0.1.0":
-  version: 0.1.0
-  resolution: "@metamask/ai-controllers@npm:0.1.0"
+"@metamask/ai-controllers@npm:^0.2.0":
+  version: 0.2.0
+  resolution: "@metamask/ai-controllers@npm:0.2.0"
   dependencies:
     "@metamask/base-controller": "npm:^9.0.0"
     "@metamask/messenger": "npm:^0.3.0"
+    "@metamask/superstruct": "npm:^3.1.0"
     "@metamask/utils": "npm:^11.9.0"
-  checksum: 10/084a5bac23e2f1a7e57c693fe5a8b2224b1abc5f3031c1337990f1a0df216bcc30679870a561c8a639b90cec141b6dedb3d069684c6512d7baaddb9cf592c147
+  checksum: 10/02a8088036e2e7e70ac94a6a7617df28738500696e37a67f4f71adaa277969afb91a6fd7d6b001f5d2c015d6ea3b97d67e300eb5ed8bf1e739103b7f85c81688
   languageName: node
   linkType: hard
 
@@ -7698,9 +7708,9 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@metamask/assets-controllers@npm:100.0.3, @metamask/assets-controllers@npm:^100.0.3":
-  version: 100.0.3
-  resolution: "@metamask/assets-controllers@npm:100.0.3"
+"@metamask/assets-controllers@npm:^100.0.2, @metamask/assets-controllers@npm:^100.0.3, @metamask/assets-controllers@npm:^100.1.0":
+  version: 100.1.0
+  resolution: "@metamask/assets-controllers@npm:100.1.0"
   dependencies:
     "@ethereumjs/util": "npm:^9.1.0"
     "@ethersproject/abi": "npm:^5.7.0"
@@ -7723,7 +7733,7 @@ __metadata:
     "@metamask/metamask-eth-abis": "npm:^3.1.1"
     "@metamask/multichain-account-service": "npm:^7.0.0"
     "@metamask/network-controller": "npm:^30.0.0"
-    "@metamask/network-enablement-controller": "npm:^4.1.2"
+    "@metamask/network-enablement-controller": "npm:^4.2.0"
     "@metamask/permission-controller": "npm:^12.2.0"
     "@metamask/phishing-controller": "npm:^16.3.0"
     "@metamask/polling-controller": "npm:^16.0.3"
@@ -7734,7 +7744,7 @@ __metadata:
     "@metamask/snaps-sdk": "npm:^10.3.0"
     "@metamask/snaps-utils": "npm:^11.7.0"
     "@metamask/storage-service": "npm:^1.0.0"
-    "@metamask/transaction-controller": "npm:^62.18.0"
+    "@metamask/transaction-controller": "npm:^62.20.0"
     "@metamask/utils": "npm:^11.9.0"
     "@types/bn.js": "npm:^5.1.5"
     "@types/uuid": "npm:^8.3.0"
@@ -7750,13 +7760,13 @@ __metadata:
   peerDependencies:
     "@metamask/providers": ^22.0.0
     webextension-polyfill: ^0.10.0 || ^0.11.0 || ^0.12.0
-  checksum: 10/fd5ef80f4b3d55bcc5bb98dcf6a1fcbfa4b7401ca2591658b2474f0cd69d69c4b4ba6b5e2e4c9b13d1e3ba55f38e501494601eb8c16e702b715bd32283271a17
+  checksum: 10/25a32346b51432bc9d40028719a1b8f0b4a2797458c0fa22f84c1ac3982a4a16e89d7e0b16e1c439377e65621445733b17905b24d4d25c804317b087a19af0ba
   languageName: node
   linkType: hard
 
-"@metamask/assets-controllers@patch:@metamask/assets-controllers@npm%3A100.0.3#~/.yarn/patches/@metamask-assets-controllers-npm-100.0.3-ea172b88c9.patch":
-  version: 100.0.3
-  resolution: "@metamask/assets-controllers@patch:@metamask/assets-controllers@npm%3A100.0.3#~/.yarn/patches/@metamask-assets-controllers-npm-100.0.3-ea172b88c9.patch::version=100.0.3&hash=7df952"
+"@metamask/assets-controllers@npm:^99.4.0":
+  version: 99.4.0
+  resolution: "@metamask/assets-controllers@npm:99.4.0"
   dependencies:
     "@ethereumjs/util": "npm:^9.1.0"
     "@ethersproject/abi": "npm:^5.7.0"
@@ -7766,23 +7776,23 @@ __metadata:
     "@ethersproject/providers": "npm:^5.7.0"
     "@metamask/abi-utils": "npm:^2.0.3"
     "@metamask/account-tree-controller": "npm:^4.1.1"
-    "@metamask/accounts-controller": "npm:^36.0.1"
+    "@metamask/accounts-controller": "npm:^36.0.0"
     "@metamask/approval-controller": "npm:^8.0.0"
     "@metamask/base-controller": "npm:^9.0.0"
     "@metamask/contract-metadata": "npm:^2.4.0"
-    "@metamask/controller-utils": "npm:^11.19.0"
-    "@metamask/core-backend": "npm:^6.0.0"
+    "@metamask/controller-utils": "npm:^11.18.0"
+    "@metamask/core-backend": "npm:5.0.0"
     "@metamask/eth-query": "npm:^4.0.0"
     "@metamask/keyring-api": "npm:^21.5.0"
     "@metamask/keyring-controller": "npm:^25.1.0"
     "@metamask/messenger": "npm:^0.3.0"
     "@metamask/metamask-eth-abis": "npm:^3.1.1"
     "@metamask/multichain-account-service": "npm:^7.0.0"
-    "@metamask/network-controller": "npm:^30.0.0"
-    "@metamask/network-enablement-controller": "npm:^4.1.2"
+    "@metamask/network-controller": "npm:^29.0.0"
+    "@metamask/network-enablement-controller": "npm:^4.1.0"
     "@metamask/permission-controller": "npm:^12.2.0"
-    "@metamask/phishing-controller": "npm:^16.3.0"
-    "@metamask/polling-controller": "npm:^16.0.3"
+    "@metamask/phishing-controller": "npm:^16.2.0"
+    "@metamask/polling-controller": "npm:^16.0.2"
     "@metamask/preferences-controller": "npm:^22.1.0"
     "@metamask/profile-sync-controller": "npm:^27.1.0"
     "@metamask/rpc-errors": "npm:^7.0.2"
@@ -7790,7 +7800,7 @@ __metadata:
     "@metamask/snaps-sdk": "npm:^10.3.0"
     "@metamask/snaps-utils": "npm:^11.7.0"
     "@metamask/storage-service": "npm:^1.0.0"
-    "@metamask/transaction-controller": "npm:^62.18.0"
+    "@metamask/transaction-controller": "npm:^62.17.0"
     "@metamask/utils": "npm:^11.9.0"
     "@types/bn.js": "npm:^5.1.5"
     "@types/uuid": "npm:^8.3.0"
@@ -7806,7 +7816,7 @@ __metadata:
   peerDependencies:
     "@metamask/providers": ^22.0.0
     webextension-polyfill: ^0.10.0 || ^0.11.0 || ^0.12.0
-  checksum: 10/1b3069b2e5e3e431f54c95e15041fbc464abf003f7d35e094f04b4fcd290a228b9b4998f4c05be9ed92fc683b23b444b4f5713429e8a6d8f3b17d8c01185af7d
+  checksum: 10/2329ba8efe5a19ebe836c8ddc492f732461078d3954b713e825e4f0f3f5dc5fb17d55f5dabd30a20bd25e33366e8f2358a23b227c182f36688908f0128c5046c
   languageName: node
   linkType: hard
 
@@ -7879,38 +7889,39 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@metamask/bridge-controller@npm:66.2.0":
-  version: 66.2.0
-  resolution: "@metamask/bridge-controller@npm:66.2.0"
+"@metamask/bridge-controller@npm:67.2.0":
+  version: 67.2.0
+  resolution: "@metamask/bridge-controller@npm:67.2.0"
   dependencies:
     "@ethersproject/address": "npm:^5.7.0"
     "@ethersproject/bignumber": "npm:^5.7.0"
     "@ethersproject/constants": "npm:^5.7.0"
     "@ethersproject/contracts": "npm:^5.7.0"
     "@ethersproject/providers": "npm:^5.7.0"
-    "@metamask/accounts-controller": "npm:^36.0.0"
-    "@metamask/assets-controllers": "npm:^99.4.0"
+    "@metamask/accounts-controller": "npm:^36.0.1"
+    "@metamask/assets-controllers": "npm:^100.0.2"
     "@metamask/base-controller": "npm:^9.0.0"
-    "@metamask/controller-utils": "npm:^11.18.0"
-    "@metamask/gas-fee-controller": "npm:^26.0.2"
+    "@metamask/controller-utils": "npm:^11.19.0"
+    "@metamask/gas-fee-controller": "npm:^26.0.3"
     "@metamask/keyring-api": "npm:^21.5.0"
     "@metamask/messenger": "npm:^0.3.0"
     "@metamask/metamask-eth-abis": "npm:^3.1.1"
-    "@metamask/multichain-network-controller": "npm:^3.0.3"
-    "@metamask/network-controller": "npm:^29.0.0"
-    "@metamask/polling-controller": "npm:^16.0.2"
+    "@metamask/multichain-network-controller": "npm:^3.0.4"
+    "@metamask/network-controller": "npm:^30.0.0"
+    "@metamask/polling-controller": "npm:^16.0.3"
+    "@metamask/profile-sync-controller": "npm:^27.1.0"
     "@metamask/remote-feature-flag-controller": "npm:^4.0.0"
     "@metamask/snaps-controllers": "npm:^17.2.0"
-    "@metamask/transaction-controller": "npm:^62.17.0"
+    "@metamask/transaction-controller": "npm:^62.18.0"
     "@metamask/utils": "npm:^11.9.0"
     bignumber.js: "npm:^9.1.2"
     reselect: "npm:^5.1.1"
     uuid: "npm:^8.3.2"
-  checksum: 10/88de6e442aeb0a8a456337d7ede6a1a2016a4d88ced55b9a74125f1daa53496b07524091b0b5842acd37476736d4633b3c8e9d2edbb6344e3927789d7e81181b
+  checksum: 10/524ed3663b3e1f87a34171dc0b43b7b5751288d410d90b5d266923e71c974b47f3ec4e87d95baf6aa83ff41120b7625488f563e1c63048657241b24711089a95
   languageName: node
   linkType: hard
 
-"@metamask/bridge-controller@npm:^67.1.1, @metamask/bridge-controller@npm:^67.4.0":
+"@metamask/bridge-controller@npm:^67.4.0":
   version: 67.4.0
   resolution: "@metamask/bridge-controller@npm:67.4.0"
   dependencies:
@@ -7942,59 +7953,71 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@metamask/bridge-controller@patch:@metamask/bridge-controller@npm%3A66.2.0#~/.yarn/patches/@metamask-bridge-controller-npm-66.2.0-8ed148964f.patch":
-  version: 66.2.0
-  resolution: "@metamask/bridge-controller@patch:@metamask/bridge-controller@npm%3A66.2.0#~/.yarn/patches/@metamask-bridge-controller-npm-66.2.0-8ed148964f.patch::version=66.2.0&hash=b845b2"
+"@metamask/bridge-controller@npm:^68.0.0":
+  version: 68.0.0
+  resolution: "@metamask/bridge-controller@npm:68.0.0"
   dependencies:
     "@ethersproject/address": "npm:^5.7.0"
     "@ethersproject/bignumber": "npm:^5.7.0"
     "@ethersproject/constants": "npm:^5.7.0"
     "@ethersproject/contracts": "npm:^5.7.0"
     "@ethersproject/providers": "npm:^5.7.0"
-    "@metamask/accounts-controller": "npm:^36.0.0"
-    "@metamask/assets-controllers": "npm:^99.4.0"
+    "@metamask/accounts-controller": "npm:^36.0.1"
+    "@metamask/assets-controllers": "npm:^100.0.3"
     "@metamask/base-controller": "npm:^9.0.0"
-    "@metamask/controller-utils": "npm:^11.18.0"
-    "@metamask/gas-fee-controller": "npm:^26.0.2"
+    "@metamask/controller-utils": "npm:^11.19.0"
+    "@metamask/gas-fee-controller": "npm:^26.0.3"
     "@metamask/keyring-api": "npm:^21.5.0"
     "@metamask/messenger": "npm:^0.3.0"
     "@metamask/metamask-eth-abis": "npm:^3.1.1"
-    "@metamask/multichain-network-controller": "npm:^3.0.3"
-    "@metamask/network-controller": "npm:^29.0.0"
-    "@metamask/polling-controller": "npm:^16.0.2"
-    "@metamask/remote-feature-flag-controller": "npm:^4.0.0"
+    "@metamask/multichain-network-controller": "npm:^3.0.4"
+    "@metamask/network-controller": "npm:^30.0.0"
+    "@metamask/polling-controller": "npm:^16.0.3"
+    "@metamask/profile-sync-controller": "npm:^27.1.0"
+    "@metamask/remote-feature-flag-controller": "npm:^4.1.0"
     "@metamask/snaps-controllers": "npm:^17.2.0"
-    "@metamask/transaction-controller": "npm:^62.17.0"
+    "@metamask/transaction-controller": "npm:^62.19.0"
     "@metamask/utils": "npm:^11.9.0"
     bignumber.js: "npm:^9.1.2"
     reselect: "npm:^5.1.1"
     uuid: "npm:^8.3.2"
-  checksum: 10/f8105319ffdc0baa8c8296ba202c6e41b06c21b5fdd75bcfa26b5c1e11b4edc8d6fabda8664763c39accff6c451b599c0d6597cb52150a6540dce37ef2c3c339
+  checksum: 10/e92d96c7e421efeadcccdd58c87e3f5b171f3a8eff035dae8fff602b162902652b2738ae4aec62e48b432fefcab1736f69f7a2026ba7686151fafe73601c6a9b
   languageName: node
   linkType: hard
 
-"@metamask/bridge-status-controller@npm:66.1.0":
-  version: 66.1.0
-  resolution: "@metamask/bridge-status-controller@npm:66.1.0"
+"@metamask/bridge-controller@patch:@metamask/bridge-controller@npm%3A67.2.0#~/.yarn/patches/@metamask-bridge-controller-npm-67.2.0-32d3aafe1f.patch":
+  version: 67.2.0
+  resolution: "@metamask/bridge-controller@patch:@metamask/bridge-controller@npm%3A67.2.0#~/.yarn/patches/@metamask-bridge-controller-npm-67.2.0-32d3aafe1f.patch::version=67.2.0&hash=471b7e"
   dependencies:
-    "@metamask/accounts-controller": "npm:^36.0.0"
+    "@ethersproject/address": "npm:^5.7.0"
+    "@ethersproject/bignumber": "npm:^5.7.0"
+    "@ethersproject/constants": "npm:^5.7.0"
+    "@ethersproject/contracts": "npm:^5.7.0"
+    "@ethersproject/providers": "npm:^5.7.0"
+    "@metamask/accounts-controller": "npm:^36.0.1"
+    "@metamask/assets-controllers": "npm:^100.0.2"
     "@metamask/base-controller": "npm:^9.0.0"
-    "@metamask/bridge-controller": "npm:^66.2.0"
-    "@metamask/controller-utils": "npm:^11.18.0"
-    "@metamask/gas-fee-controller": "npm:^26.0.2"
-    "@metamask/network-controller": "npm:^29.0.0"
-    "@metamask/polling-controller": "npm:^16.0.2"
+    "@metamask/controller-utils": "npm:^11.19.0"
+    "@metamask/gas-fee-controller": "npm:^26.0.3"
+    "@metamask/keyring-api": "npm:^21.5.0"
+    "@metamask/messenger": "npm:^0.3.0"
+    "@metamask/metamask-eth-abis": "npm:^3.1.1"
+    "@metamask/multichain-network-controller": "npm:^3.0.4"
+    "@metamask/network-controller": "npm:^30.0.0"
+    "@metamask/polling-controller": "npm:^16.0.3"
+    "@metamask/profile-sync-controller": "npm:^27.1.0"
+    "@metamask/remote-feature-flag-controller": "npm:^4.0.0"
     "@metamask/snaps-controllers": "npm:^17.2.0"
-    "@metamask/superstruct": "npm:^3.1.0"
-    "@metamask/transaction-controller": "npm:^62.17.0"
+    "@metamask/transaction-controller": "npm:^62.18.0"
     "@metamask/utils": "npm:^11.9.0"
     bignumber.js: "npm:^9.1.2"
+    reselect: "npm:^5.1.1"
     uuid: "npm:^8.3.2"
-  checksum: 10/05f0cbe787ed0ab0e6b3bd75224a5b8bc15a01a422f4a43a5c1235ffbfaeac05b52cb44d7c2735e750a91ba4757f8c3905af7a7cb1e7c76e30632dc2170c8959
+  checksum: 10/4e3fff09dbb2e46231e2c5db7fc8373fea752cacfabc557367219b3d1af8fd4ec62e7c75bf3a83f8b9b1084d397cbe3b3ad652b21b8e4719374b56b3cc7dd459
   languageName: node
   linkType: hard
 
-"@metamask/bridge-status-controller@npm:^67.0.1":
+"@metamask/bridge-status-controller@npm:67.0.1":
   version: 67.0.1
   resolution: "@metamask/bridge-status-controller@npm:67.0.1"
   dependencies:
@@ -8016,24 +8039,48 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@metamask/bridge-status-controller@patch:@metamask/bridge-status-controller@npm%3A66.1.0#~/.yarn/patches/@metamask-bridge-status-controller-npm-66.1.0-a2a478ef94.patch":
-  version: 66.1.0
-  resolution: "@metamask/bridge-status-controller@patch:@metamask/bridge-status-controller@npm%3A66.1.0#~/.yarn/patches/@metamask-bridge-status-controller-npm-66.1.0-a2a478ef94.patch::version=66.1.0&hash=85f030"
+"@metamask/bridge-status-controller@npm:^68.0.0":
+  version: 68.0.0
+  resolution: "@metamask/bridge-status-controller@npm:68.0.0"
   dependencies:
-    "@metamask/accounts-controller": "npm:^36.0.0"
+    "@metamask/accounts-controller": "npm:^36.0.1"
     "@metamask/base-controller": "npm:^9.0.0"
-    "@metamask/bridge-controller": "npm:^66.2.0"
-    "@metamask/controller-utils": "npm:^11.18.0"
-    "@metamask/gas-fee-controller": "npm:^26.0.2"
-    "@metamask/network-controller": "npm:^29.0.0"
-    "@metamask/polling-controller": "npm:^16.0.2"
+    "@metamask/bridge-controller": "npm:^68.0.0"
+    "@metamask/controller-utils": "npm:^11.19.0"
+    "@metamask/gas-fee-controller": "npm:^26.0.3"
+    "@metamask/keyring-controller": "npm:^25.1.0"
+    "@metamask/network-controller": "npm:^30.0.0"
+    "@metamask/polling-controller": "npm:^16.0.3"
+    "@metamask/profile-sync-controller": "npm:^27.1.0"
     "@metamask/snaps-controllers": "npm:^17.2.0"
     "@metamask/superstruct": "npm:^3.1.0"
-    "@metamask/transaction-controller": "npm:^62.17.0"
+    "@metamask/transaction-controller": "npm:^62.19.0"
+    "@metamask/utils": "npm:^11.9.0"
+    bignumber.js: "npm:^9.1.2"
+    uuid: "npm:^8.3.2"
+  checksum: 10/e166e890d76aa366c6ec50380879eaf1de641068b1f99d66b45908be72dc23966f82e12083307325eeca72fcf1bef8c8e4864a459db057328fcea84900fefba0
+  languageName: node
+  linkType: hard
+
+"@metamask/bridge-status-controller@patch:@metamask/bridge-status-controller@npm%3A67.0.1#~/.yarn/patches/@metamask-bridge-status-controller-npm-67.0.1-d8a41d9c02.patch":
+  version: 67.0.1
+  resolution: "@metamask/bridge-status-controller@patch:@metamask/bridge-status-controller@npm%3A67.0.1#~/.yarn/patches/@metamask-bridge-status-controller-npm-67.0.1-d8a41d9c02.patch::version=67.0.1&hash=baad70"
+  dependencies:
+    "@metamask/accounts-controller": "npm:^36.0.1"
+    "@metamask/base-controller": "npm:^9.0.0"
+    "@metamask/bridge-controller": "npm:^67.1.1"
+    "@metamask/controller-utils": "npm:^11.19.0"
+    "@metamask/gas-fee-controller": "npm:^26.0.3"
+    "@metamask/network-controller": "npm:^30.0.0"
+    "@metamask/polling-controller": "npm:^16.0.3"
+    "@metamask/profile-sync-controller": "npm:^27.1.0"
+    "@metamask/snaps-controllers": "npm:^17.2.0"
+    "@metamask/superstruct": "npm:^3.1.0"
+    "@metamask/transaction-controller": "npm:^62.17.1"
     "@metamask/utils": "npm:^11.9.0"
     bignumber.js: "npm:^9.1.2"
     uuid: "npm:^8.3.2"
-  checksum: 10/dda8c7049da9542e08647e3a546421993271b7e6049eca1722df4d1be6f8ef5773a1da6d1a6833a920dc9cdd02aa78a0cdfdd1b2b6520b56fe8123b86ff1fe87
+  checksum: 10/01302f8bddf1a136e421ad15e7b3136e39aabe8a39f1e4facde7d4fb6549175bdec79cf8a6c8ebbec421e7bf94bd7f8dd8d23366ed63b2740d2db7c21ef0c7fb
   languageName: node
   linkType: hard
 
@@ -8055,10 +8102,10 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@metamask/browser-playground@npm:0.2.0":
-  version: 0.2.0
-  resolution: "@metamask/browser-playground@npm:0.2.0"
-  checksum: 10/4c06720cce0925cf6e6a4c7287dee64976037b3f772c933c5659dd16538658fd171d9377ab1e7790c89f08db72edccd37c6d477a72a75f91f72ee81dd9322eb6
+"@metamask/browser-playground@npm:0.3.0":
+  version: 0.3.0
+  resolution: "@metamask/browser-playground@npm:0.3.0"
+  checksum: 10/87eb5f9f623afea58dcf2eaeb46795ce595ecc3462b5976a4ab35d04c1eff0edde05ccaf52681fe1f02f840cf7d06b29ca6a71ce581cf1b2df2bc1b2e7acd28b
   languageName: node
   linkType: hard
 
@@ -8221,10 +8268,10 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@metamask/design-tokens@npm:^8.2.0":
-  version: 8.2.0
-  resolution: "@metamask/design-tokens@npm:8.2.0"
-  checksum: 10/cc80fd485c8eadcf5e1e380212b852be1eda2ad925ab50ff2cc992c04a0148c2ac755fffecf6dae96b350b6b7a6fa4aeaa91cbe3ca5cd58eb4fba17c68d94449
+"@metamask/design-tokens@npm:^8.2.2":
+  version: 8.2.2
+  resolution: "@metamask/design-tokens@npm:8.2.2"
+  checksum: 10/2ab9e2c148f55874819c550a2e038c050d906709c33315edd200ddaeb7677b5f121f50fa2f43c06ce94b5fc66b59450c81b8927088721d8ad6ee559cf864f442
   languageName: node
   linkType: hard
 
@@ -9164,9 +9211,9 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@metamask/network-enablement-controller@npm:^4.1.0, @metamask/network-enablement-controller@npm:^4.1.1, @metamask/network-enablement-controller@npm:^4.1.2":
-  version: 4.1.2
-  resolution: "@metamask/network-enablement-controller@npm:4.1.2"
+"@metamask/network-enablement-controller@npm:^4.1.0, @metamask/network-enablement-controller@npm:^4.1.1, @metamask/network-enablement-controller@npm:^4.2.0":
+  version: 4.2.0
+  resolution: "@metamask/network-enablement-controller@npm:4.2.0"
   dependencies:
     "@metamask/base-controller": "npm:^9.0.0"
     "@metamask/controller-utils": "npm:^11.19.0"
@@ -9175,10 +9222,10 @@ __metadata:
     "@metamask/multichain-network-controller": "npm:^3.0.4"
     "@metamask/network-controller": "npm:^30.0.0"
     "@metamask/slip44": "npm:^4.3.0"
-    "@metamask/transaction-controller": "npm:^62.17.1"
+    "@metamask/transaction-controller": "npm:^62.20.0"
     "@metamask/utils": "npm:^11.9.0"
     reselect: "npm:^5.1.1"
-  checksum: 10/2860220c63c941173a66be21011c58014421868d1e0e67d05d7ae30c156ac8352d752317e31ac773fa1420a5fdc7126b7c78e317d53d404cd76fd0781cf2c0cb
+  checksum: 10/293efbfbf6b157e248ea1c7bf5fc70abfde4c47802ff2af25978b723ac3b7e657980566a2a3d1311a263209ea650cfa531482a087660dc6178c09e2491806341
   languageName: node
   linkType: hard
 
@@ -9264,7 +9311,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@metamask/phishing-controller@npm:^16.1.0, @metamask/phishing-controller@npm:^16.3.0":
+"@metamask/phishing-controller@npm:^16.1.0, @metamask/phishing-controller@npm:^16.2.0, @metamask/phishing-controller@npm:^16.3.0":
   version: 16.3.0
   resolution: "@metamask/phishing-controller@npm:16.3.0"
   dependencies:
@@ -9439,14 +9486,14 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@metamask/ramps-controller@npm:^10.0.0":
-  version: 10.0.0
-  resolution: "@metamask/ramps-controller@npm:10.0.0"
+"@metamask/ramps-controller@npm:^10.2.0":
+  version: 10.2.0
+  resolution: "@metamask/ramps-controller@npm:10.2.0"
   dependencies:
     "@metamask/base-controller": "npm:^9.0.0"
     "@metamask/controller-utils": "npm:^11.19.0"
     "@metamask/messenger": "npm:^0.3.0"
-  checksum: 10/e8141512569ee521777f8f54579c8e45eed58cb9bd45b0806ecdc214573f4a138041a20d86429cccb792fdb9d3cb56262655077b42df3aa804566916a9bfcbba
+  checksum: 10/4c9e10f3948a4e0f44f3a98fd2a7a220585e74793ad4cc899b27be6ea3c428c76fb95b0987697a0dd62a98221868ce2bfb3e40495cef00f4909e5dd88dec152e
   languageName: node
   linkType: hard
 
@@ -10094,9 +10141,9 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@metamask/transaction-controller@npm:^62.17.0, @metamask/transaction-controller@npm:^62.17.1, @metamask/transaction-controller@npm:^62.18.0, @metamask/transaction-controller@npm:^62.19.0":
-  version: 62.19.0
-  resolution: "@metamask/transaction-controller@npm:62.19.0"
+"@metamask/transaction-controller@npm:^62.17.0, @metamask/transaction-controller@npm:^62.17.1, @metamask/transaction-controller@npm:^62.18.0, @metamask/transaction-controller@npm:^62.19.0, @metamask/transaction-controller@npm:^62.20.0":
+  version: 62.20.0
+  resolution: "@metamask/transaction-controller@npm:62.20.0"
   dependencies:
     "@ethereumjs/common": "npm:^4.4.0"
     "@ethereumjs/tx": "npm:^5.4.0"
@@ -10116,7 +10163,7 @@ __metadata:
     "@metamask/metamask-eth-abis": "npm:^3.1.1"
     "@metamask/network-controller": "npm:^30.0.0"
     "@metamask/nonce-tracker": "npm:^6.0.0"
-    "@metamask/remote-feature-flag-controller": "npm:^4.0.0"
+    "@metamask/remote-feature-flag-controller": "npm:^4.1.0"
     "@metamask/rpc-errors": "npm:^7.0.2"
     "@metamask/utils": "npm:^11.9.0"
     async-mutex: "npm:^0.5.0"
@@ -10129,7 +10176,7 @@ __metadata:
   peerDependencies:
     "@babel/runtime": ^7.0.0
     "@metamask/eth-block-tracker": ">=9"
-  checksum: 10/d98cff056d00830a962dfd41f26211334fe52cf7a3f2833ad3e542303d7c43011918760f37d5a9dd145088b9c45376914de6a523716686897e899842a5d19038
+  checksum: 10/5b0f1af0cf484d39ff29c674bdaed864c6301b98f247cd8c647ac7c51838a27d3b4ddea1bf21c5931e0ce5f60db5f0afb38924e746261afcafb12e28a8581cd6
   languageName: node
   linkType: hard
 
@@ -10172,37 +10219,37 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@metamask/transaction-pay-controller@npm:^16.1.2":
-  version: 16.1.2
-  resolution: "@metamask/transaction-pay-controller@npm:16.1.2"
+"@metamask/transaction-pay-controller@npm:^16.3.0":
+  version: 16.3.0
+  resolution: "@metamask/transaction-pay-controller@npm:16.3.0"
   dependencies:
     "@ethersproject/abi": "npm:^5.7.0"
     "@ethersproject/contracts": "npm:^5.7.0"
     "@ethersproject/providers": "npm:^5.7.0"
-    "@metamask/assets-controllers": "npm:^100.0.3"
+    "@metamask/assets-controllers": "npm:^100.1.0"
     "@metamask/base-controller": "npm:^9.0.0"
-    "@metamask/bridge-controller": "npm:^67.4.0"
-    "@metamask/bridge-status-controller": "npm:^67.0.1"
+    "@metamask/bridge-controller": "npm:^68.0.0"
+    "@metamask/bridge-status-controller": "npm:^68.0.0"
     "@metamask/controller-utils": "npm:^11.19.0"
     "@metamask/gas-fee-controller": "npm:^26.0.3"
     "@metamask/messenger": "npm:^0.3.0"
     "@metamask/metamask-eth-abis": "npm:^3.1.1"
     "@metamask/network-controller": "npm:^30.0.0"
     "@metamask/remote-feature-flag-controller": "npm:^4.1.0"
-    "@metamask/transaction-controller": "npm:^62.19.0"
+    "@metamask/transaction-controller": "npm:^62.20.0"
     "@metamask/utils": "npm:^11.9.0"
     bignumber.js: "npm:^9.1.2"
     bn.js: "npm:^5.2.1"
     immer: "npm:^9.0.6"
     lodash: "npm:^4.17.21"
-  checksum: 10/d304824be5a3218a28b39ccde514748f38b6ed23d694fee08f562c53dc9c16d3257f6a036bc26b5193db35b5bb3e9d9669b2411ff532285738e7310e81090654
+  checksum: 10/fd432b50040e93616f77f8ee24836cb979c4626853ece95dfa9e27d3b26b231407ce0ded6f8f929e81c482f872dbec6c5bce7bbf2f52580218a0e48f7d4b6562
   languageName: node
   linkType: hard
 
-"@metamask/tron-wallet-snap@npm:^1.21.1":
-  version: 1.21.1
-  resolution: "@metamask/tron-wallet-snap@npm:1.21.1"
-  checksum: 10/02b479ad79758dc7ddafd694f4d54ed1e928d98740fc89e489b951f0029a02aeab1f8b5a565139a2ce17c52fd1c109007ebbe27938ff7b92c539e62b35ec838d
+"@metamask/tron-wallet-snap@npm:1.22.1":
+  version: 1.22.1
+  resolution: "@metamask/tron-wallet-snap@npm:1.22.1"
+  checksum: 10/035e044a023f887377da09e0431749aced5700903bb492191631f7f9f5b2ac1f81240885e795755dd48fb603ec6034063424ef734a8ebe4ded820b31049c4877
   languageName: node
   linkType: hard
 
@@ -10482,7 +10529,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@noble/curves@npm:1.9.7, @noble/curves@npm:^1.0.0, @noble/curves@npm:^1.2.0, @noble/curves@npm:^1.4.2, @noble/curves@npm:^1.8.0, @noble/curves@npm:^1.8.1, @noble/curves@npm:^1.9.1, @noble/curves@npm:^1.9.2, @noble/curves@npm:~1.9.0":
+"@noble/curves@npm:1.9.7, @noble/curves@npm:^1.0.0, @noble/curves@npm:^1.2.0, @noble/curves@npm:^1.4.2, @noble/curves@npm:^1.8.0, @noble/curves@npm:^1.8.1, @noble/curves@npm:^1.9.1, @noble/curves@npm:^1.9.2, @noble/curves@npm:^1.9.7, @noble/curves@npm:~1.9.0":
   version: 1.9.7
   resolution: "@noble/curves@npm:1.9.7"
   dependencies:
@@ -21762,7 +21809,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"appwright@patch:appwright@npm%3A0.1.45#~/.yarn/patches/appwright-npm-0.1.45-f282bc1c1b.patch":
+"appwright@patch:appwright@npm%3A0.1.45#~/.yarn/patches/appwright-npm-0.1.45-f282bc1c1b.patch::version=0.1.45&hash=9b6269":
   version: 0.1.45
   resolution: "appwright@patch:appwright@npm%3A0.1.45#~/.yarn/patches/appwright-npm-0.1.45-f282bc1c1b.patch::version=0.1.45&hash=9b6269"
   dependencies:
@@ -21784,6 +21831,28 @@ __metadata:
   languageName: node
   linkType: hard
 
+"appwright@patch:appwright@patch%3Aappwright@npm%253A0.1.45%23~/.yarn/patches/appwright-npm-0.1.45-f282bc1c1b.patch%3A%3Aversion=0.1.45&hash=9b6269#~/.yarn/patches/appwright-patch-9fcd858d19.patch":
+  version: 0.1.45
+  resolution: "appwright@patch:appwright@patch%3Aappwright@npm%253A0.1.45%23~/.yarn/patches/appwright-npm-0.1.45-f282bc1c1b.patch%3A%3Aversion=0.1.45&hash=9b6269#~/.yarn/patches/appwright-patch-9fcd858d19.patch::version=0.1.45&hash=0ae41e"
+  dependencies:
+    "@empiricalrun/llm": "npm:^0.9.25"
+    "@ffmpeg-installer/ffmpeg": "npm:^1.1.0"
+    "@playwright/test": "npm:^1.47.1"
+    appium: "npm:^2.6.0"
+    appium-uiautomator2-driver: "npm:^3.8.0"
+    appium-xcuitest-driver: "npm:^7.27.0"
+    async-retry: "npm:^1.3.3"
+    fluent-ffmpeg: "npm:^2.1.3"
+    form-data: "npm:4.0.0"
+    node-fetch: "npm:^3.3.2"
+    picocolors: "npm:^1.1.0"
+    webdriver: "npm:^8.36.1"
+  bin:
+    appwright: dist/bin/index.js
+  checksum: 10/6f6e0a22262d1206992b29acefdc03804fd56410f67b4ce1739d6614d872f1634ee75153f4567766187f95ec67928ab61504c307ce13e6521f5b77e8b822451e
+  languageName: node
+  linkType: hard
+
 "aproba@npm:^1.0.3 || ^2.0.0":
   version: 2.0.0
   resolution: "aproba@npm:2.0.0"
@@ -26751,13 +26820,15 @@ __metadata:
   languageName: node
   linkType: hard
 
-"eciesjs@npm:^0.3.15":
-  version: 0.3.21
-  resolution: "eciesjs@npm:0.3.21"
+"eciesjs@npm:0.4.17":
+  version: 0.4.17
+  resolution: "eciesjs@npm:0.4.17"
   dependencies:
-    futoin-hkdf: "npm:^1.5.3"
-    secp256k1: "npm:^5.0.1"
-  checksum: 10/7f10709d20c0f65a887ba6d4a4b01685b3a18b933e4296a232372f9e8dc7b957cd68d339457737bf358be8a68ff4fcc8501cb617437e142ac483b0ba04fbc26c
+    "@ecies/ciphers": "npm:^0.2.5"
+    "@noble/ciphers": "npm:^1.3.0"
+    "@noble/curves": "npm:^1.9.7"
+    "@noble/hashes": "npm:^1.8.0"
+  checksum: 10/89e3db5d916e9b4badb516f0a89514300ce7bbc4e1a8a0b8f1e0ef4ac1d88c5aef622a65cb277b6a020e423c3b04f981398eeb349d5bd7e3e42a35132e871e7f
   languageName: node
   linkType: hard
 
@@ -30395,13 +30466,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"futoin-hkdf@npm:^1.5.3":
-  version: 1.5.3
-  resolution: "futoin-hkdf@npm:1.5.3"
-  checksum: 10/aa64b93b4fdca77e6e9c7f045c539dd912f10077bc31d933e219eb5784e88e90a6d830b5d34431da840cc7477c0ed5f2d504dec49718b9f57941de5f23c20471
-  languageName: node
-  linkType: hard
-
 "fwd-stream@npm:^1.0.4":
   version: 1.0.4
   resolution: "fwd-stream@npm:1.0.4"
@@ -35380,19 +35444,19 @@ __metadata:
     "@metamask/account-tree-controller": "npm:^4.1.1"
     "@metamask/accounts-controller": "npm:^36.0.0"
     "@metamask/address-book-controller": "npm:^7.0.1"
-    "@metamask/ai-controllers": "npm:^0.1.0"
+    "@metamask/ai-controllers": "npm:^0.2.0"
     "@metamask/analytics-controller": "npm:^1.0.0"
     "@metamask/app-metadata-controller": "npm:^2.0.0"
     "@metamask/approval-controller": "npm:^8.0.0"
     "@metamask/assets-controller": "npm:^2.0.0"
-    "@metamask/assets-controllers": "patch:@metamask/assets-controllers@npm%3A100.0.3#~/.yarn/patches/@metamask-assets-controllers-npm-100.0.3-ea172b88c9.patch"
+    "@metamask/assets-controllers": "npm:^100.1.0"
     "@metamask/auto-changelog": "npm:^5.3.0"
     "@metamask/base-controller": "npm:^9.0.0"
     "@metamask/bitcoin-wallet-snap": "npm:^1.10.0"
-    "@metamask/bridge-controller": "patch:@metamask/bridge-controller@npm%3A66.2.0#~/.yarn/patches/@metamask-bridge-controller-npm-66.2.0-8ed148964f.patch"
-    "@metamask/bridge-status-controller": "patch:@metamask/bridge-status-controller@npm%3A66.1.0#~/.yarn/patches/@metamask-bridge-status-controller-npm-66.1.0-a2a478ef94.patch"
+    "@metamask/bridge-controller": "npm:^67.4.0"
+    "@metamask/bridge-status-controller": "patch:@metamask/bridge-status-controller@npm%3A67.0.1#~/.yarn/patches/@metamask-bridge-status-controller-npm-67.0.1-d8a41d9c02.patch"
     "@metamask/browser-passworder": "npm:^5.0.0"
-    "@metamask/browser-playground": "npm:0.2.0"
+    "@metamask/browser-playground": "npm:0.3.0"
     "@metamask/build-utils": "npm:^3.0.0"
     "@metamask/chain-agnostic-permission": "npm:^1.3.0"
     "@metamask/connectivity-controller": "npm:^0.1.0"
@@ -35402,7 +35466,7 @@ __metadata:
     "@metamask/delegation-deployments": "npm:^0.15.0"
     "@metamask/design-system-react-native": "npm:^0.8.0"
     "@metamask/design-system-twrnc-preset": "npm:^0.3.0"
-    "@metamask/design-tokens": "npm:^8.2.0"
+    "@metamask/design-tokens": "npm:^8.2.2"
     "@metamask/earn-controller": "npm:^10.0.0"
     "@metamask/eip-5792-middleware": "npm:^2.0.0"
     "@metamask/eip1193-permission-middleware": "npm:^1.0.2"
@@ -35459,14 +35523,14 @@ __metadata:
     "@metamask/profile-metrics-controller": "npm:^2.0.0"
     "@metamask/profile-sync-controller": "npm:^27.1.0"
     "@metamask/providers": "npm:^18.3.1"
-    "@metamask/ramps-controller": "npm:^10.0.0"
+    "@metamask/ramps-controller": "npm:^10.2.0"
     "@metamask/react-native-acm": "npm:^1.0.1"
     "@metamask/react-native-actionsheet": "npm:2.4.2"
     "@metamask/react-native-button": "npm:^3.0.0"
     "@metamask/react-native-payments": "npm:^2.0.0"
     "@metamask/react-native-search-api": "npm:1.0.1"
     "@metamask/react-native-webview": "npm:^14.6.0"
-    "@metamask/remote-feature-flag-controller": "npm:^4.0.0"
+    "@metamask/remote-feature-flag-controller": "npm:^4.1.0"
     "@metamask/rpc-errors": "npm:^7.0.2"
     "@metamask/sample-controllers": "npm:^3.0.0"
     "@metamask/scure-bip39": "npm:^2.1.0"
@@ -35492,8 +35556,8 @@ __metadata:
     "@metamask/test-dapp-multichain": "npm:^0.17.1"
     "@metamask/test-dapp-solana": "npm:^0.3.0"
     "@metamask/transaction-controller": "npm:^62.19.0"
-    "@metamask/transaction-pay-controller": "npm:^16.1.2"
-    "@metamask/tron-wallet-snap": "npm:^1.21.1"
+    "@metamask/transaction-pay-controller": "npm:^16.3.0"
+    "@metamask/tron-wallet-snap": "npm:1.22.1"
     "@metamask/utils": "npm:^11.8.1"
     "@myx-trade/sdk": "npm:^0.1.265"
     "@ngraveio/bc-ur": "npm:^1.1.6"
@@ -35590,7 +35654,7 @@ __metadata:
     appium-chromium-driver: "npm:^2.0.2"
     appium-uiautomator2-driver: "npm:4.2.7"
     appium-xcuitest-driver: "npm:5.16.1"
-    appwright: "patch:appwright@npm%3A0.1.45#~/.yarn/patches/appwright-npm-0.1.45-f282bc1c1b.patch"
+    appwright: "patch:appwright@patch%3Aappwright@npm%253A0.1.45%23~/.yarn/patches/appwright-npm-0.1.45-f282bc1c1b.patch%3A%3Aversion=0.1.45&hash=9b6269#~/.yarn/patches/appwright-patch-9fcd858d19.patch"
     assert: "npm:^1.5.0"
     asyncstorage-down: "npm:4.2.0"
     axios: "npm:^1.13.5"
@@ -35622,7 +35686,7 @@ __metadata:
     dotenv: "npm:^16.0.3"
     dpdm: "npm:^3.14.0"
     eas-cli: "npm:^12.6.1"
-    eciesjs: "npm:^0.3.15"
+    eciesjs: "npm:0.4.17"
     enzyme: "npm:3.9.0"
     enzyme-adapter-react-16: "npm:1.10.0"
     enzyme-to-json: "npm:3.3.5"
@@ -42534,18 +42598,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"secp256k1@npm:^5.0.1":
-  version: 5.0.1
-  resolution: "secp256k1@npm:5.0.1"
-  dependencies:
-    elliptic: "npm:^6.5.7"
-    node-addon-api: "npm:^5.0.0"
-    node-gyp: "npm:latest"
-    node-gyp-build: "npm:^4.2.0"
-  checksum: 10/63fbd35624be4fd9cf3d39e5f79c5471b4a8aea6944453b2bea7b100bb1c77a25c55e6e08e2210cdabdf478c4c62d34c408b34214f2afd9367e19a52a3a4236c
-  languageName: node
-  linkType: hard
-
 "seedrandom@npm:^3.0.5":
   version: 3.0.5
   resolution: "seedrandom@npm:3.0.5"